
  #campus-court{color-scheme:light dark;--court-paper:light-dark(#f5f8fd,#111a2b);--court-panel:light-dark(#fff,#19253b);--court-ink:light-dark(#152340,#eef4ff);--court-muted:light-dark(#50617c,#b8c8e3);--court-edge:light-dark(#d9e3f2,#3a4c6c);--court-accent:light-dark(#2357b7,#a9c8ff);--court-on-accent:light-dark(#fff,#10223f);--court-soft:light-dark(#e6efff,#263d63);--court-warn:light-dark(#79500e,#ffcf83);font:15px/1.55 Tahoma,system-ui,sans-serif;background:var(--court-paper);color:var(--court-ink);border:1px solid var(--court-edge);border-radius:20px;overflow:hidden;text-align:start}
  #campus-court *{box-sizing:border-box}
  #campus-court [hidden]{display:none!important}
  #campus-court :is(h1,h2,h3,p,fieldset){margin:0}
  #campus-court h1{font-size:clamp(28px,5vw,46px);line-height:1.15;margin-block:5px 8px}
  #campus-court h2{font-size:21px}
  #campus-court h3{font-size:16px}
  #campus-court small,#campus-court .court-muted{color:var(--court-muted);font-size:13px}
  #campus-court :is(.court-header,.court-line,.court-brand,.court-actions){display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  #campus-court :is(.court-header,.court-line){justify-content:space-between}
  #campus-court .court-header{padding:15px clamp(12px,4vw,30px);background:var(--court-panel)}
  #campus-court .court-brand{font-weight:700}
  #campus-court .court-brand small{display:block;font-weight:400}
  #campus-court .court-mark{display:block;width:56px;height:56px;border-radius:12px;object-fit:contain}
  #campus-court nav{display:flex;gap:6px;flex-wrap:wrap;padding:8px clamp(12px,4vw,30px);background:var(--court-panel);border-block:1px solid var(--court-edge)}
  #campus-court :is(button,input){font:inherit;color:inherit;max-width:100%}
  #campus-court button{background:var(--court-panel);border:1px solid var(--court-edge);border-radius:9px;padding:7px 12px;min-height:44px;text-align:inherit}
  #campus-court nav button{border-color:transparent}
  #campus-court button[aria-pressed="true"]{background:var(--court-soft);border-color:var(--court-accent);color:var(--court-accent)}
  #campus-court button.court-primary{background:var(--court-accent);color:var(--court-on-accent);border-color:transparent;font-weight:700;text-align:center}
  #campus-court button:disabled{opacity:.58}
  #campus-court .court-hero{background:light-dark(#142950,#22395f);color:#f2f7ff;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:22px clamp(12px,4vw,30px)}
  #campus-court .court-hero small{color:#c9dcff}
  #campus-court .court-pitch{flex:0 1 180px;aspect-ratio:2/1;border:1px solid #88abe7;border-radius:8px;position:relative;display:grid;place-items:center}
  #campus-court .court-pitch::before{content:'';position:absolute;inset-block:0;inset-inline-start:50%;border-inline-start:1px solid #88abe7}
  #campus-court .court-pitch span{width:28%;aspect-ratio:1;border-radius:50%;border:1px solid #88abe7}
  #campus-court .court-body{display:grid;gap:13px;padding:18px clamp(12px,4vw,30px) 24px}
  #campus-court .court-tag{display:inline-block;background:var(--court-soft);color:var(--court-accent);border-radius:100px;padding:4px 10px;font-size:12px}
  #campus-court .court-slots,#campus-court .court-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,155px),1fr));gap:8px}
  #campus-court .court-slots small{display:block}
  #campus-court form,#campus-court .court-detail,#campus-court [data-queue]{display:grid;gap:10px;align-content:start;min-width:0}
  #campus-court fieldset{border:0;padding:0;min-width:0}
  #campus-court legend{padding:0;margin-block-end:4px}
  #campus-court label{display:grid;gap:4px;min-width:0}
  #campus-court input:not([type=radio],[type=checkbox]){min-width:0;width:100%;background:var(--court-panel);padding:8px;border:1px solid var(--court-edge);border-radius:8px}
  #campus-court .court-radio{display:flex;align-items:center;gap:7px;min-height:40px}
  #campus-court .court-inset,#campus-court .court-detail{background:var(--court-panel);border:1px solid var(--court-edge);border-radius:12px;padding:12px;overflow-wrap:anywhere}
  #campus-court .court-upload{border:1px dashed var(--court-accent);border-radius:10px;padding:10px}
  #campus-court .court-admin{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:14px}
  #campus-court .court-receipt{background:var(--court-paper);border:1px dashed var(--court-edge);border-radius:10px;padding:12px}
  #campus-court .court-receipt img{display:block;max-width:100%;max-height:420px;object-fit:contain;margin:auto}
  #campus-court [role=alert]{color:var(--court-warn)}
  @media(max-width:520px){#campus-court .court-admin{grid-template-columns:1fr}#campus-court .court-pitch{display:none}}

html{color-scheme:light dark;background:light-dark(#eaf0fb,#0c1322)}
body{margin:0;padding:clamp(8px,3vw,32px)}
#campus-court{max-width:1040px;margin-inline:auto}
#campus-court select{font:inherit;color:inherit;background:var(--court-panel);padding:8px;border:1px solid var(--court-edge);border-radius:8px;max-width:100%}
#campus-court .court-list{display:grid;gap:9px;align-content:start}
#campus-court .court-payment{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:16px}
#campus-court .court-qr,#campus-court .court-proof{display:block;max-width:100%;height:auto;border-radius:8px;margin-block:8px}
#campus-court .court-proof{max-height:520px;object-fit:contain}
#campus-court #adminPanel > button{margin-block-end:12px}
#campus-court #notice{color:var(--court-warn)}
@media(max-width:520px){#campus-court .court-payment{grid-template-columns:1fr}}
