/* Shared visual contract for every RaceControl surface. */
:root{color-scheme:dark;--bg:#17191c;--surface:#212121;--surface-raised:#303030;--surface-sunken:#111317;--panel:var(--surface);--panel2:var(--surface-raised);--panel3:#383838;--card:var(--surface);--card2:var(--surface-raised);--line:rgba(255,255,255,.06);--line2:rgba(255,255,255,.11);--fg:#e0e0e0;--text:var(--fg);--muted:#b3b3b3;--fg-muted:var(--muted);--fg-subtle:#8c8c8c;--accent:#065cfe;--accent-hover:#1aa4ff;--accent-fg:#fff;--accent-dim:rgba(6,92,254,.14);--accent-soft:var(--accent-dim);--accent-line:rgba(26,164,255,.38);--ok:#2ed47a;--green:var(--ok);--warn:#f5b942;--danger:#ff5a5a;--red:var(--danger);--font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif}
body{background:linear-gradient(135deg,#25282d 0%,#171a20 38%,#10141b 72%,#17191c 100%);background-attachment:fixed;color:var(--fg);font-family:var(--font)}button,input,select,textarea{font-family:var(--font)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}::selection{background:var(--accent-dim);color:var(--fg)}
[hidden]{display:none!important}
.panel,.card,.view,.event-card,.next-card,.calendar-shell,.statistics,.next-event,.person,.stat,.item,.rank{border-color:var(--line);background-color:var(--surface)}header,.topbar,.site-header{border-color:var(--line)}

/* Public league page: the marketing content remains, but its visual grammar is
   the same compact, flat workspace used by /app. */
body:has(.site-header) .site-header{min-height:52px;padding-block:8px;background:rgba(23,25,28,.94)}
body:has(.site-header) .brand img,body:has(.site-header) #logoFallback{width:38px;height:38px;border-radius:6px;background:var(--surface-raised);border:1px solid var(--line2)}
body:has(.site-header) main{max-width:1440px;padding-top:28px}
body:has(.site-header) .hero{grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:16px;padding:16px 0 40px}
body:has(.site-header) .hero-copy{padding:28px 20px}
body:has(.site-header) .hero h1{font-size:clamp(34px,5vw,58px);letter-spacing:-.03em}
body:has(.site-header) .hero-copy>p{font-size:15px}
body:has(.site-header) .button{border-radius:6px;background:var(--surface);border-color:var(--line2);font-size:13px}
body:has(.site-header) .button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
body:has(.site-header) .next-card,body:has(.site-header) .panel,body:has(.site-header) .announcement{background:var(--surface);border-color:var(--line);border-radius:10px;box-shadow:none}
body:has(.site-header) .event-facts div,body:has(.site-header) .record{background:var(--surface-sunken);border:1px solid var(--line);border-radius:6px}
body:has(.site-header) .announcement{border-color:var(--accent-line);margin-bottom:40px}
body:has(.site-header) .announcement-icon{background:var(--accent);color:var(--accent-fg)}
body:has(.site-header) .calendar-section{margin-top:44px}
body:has(.site-header) .event-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px}
body:has(.site-header) .event-card{border-radius:8px;padding:15px;background:var(--surface)}
body:has(.site-header) .event-card:before{background:var(--accent)}

/* Internal member hub: dense operational cards rather than a second public
   landing page. */
body:has(.topbar) .topbar{min-height:52px;padding-block:8px;background:rgba(23,25,28,.94)}
body:has(.topbar) .brand img,body:has(.topbar) #logoFallback{width:38px;height:38px;border-radius:6px;background:var(--surface-raised);border-color:var(--line2)}
body:has(.topbar) .topbar nav a,body:has(.topbar) .topbar button,body:has(.topbar) .view-actions button,body:has(.topbar) .event-action{border-radius:6px;background:var(--surface);border-color:var(--line2);font-size:13px}
body:has(.topbar) main{max-width:1440px;padding-top:24px}
body:has(.topbar) .hero{padding:20px 22px;gap:16px;background:var(--surface);border-color:var(--line);border-radius:10px;box-shadow:none}
body:has(.topbar) .next-event{background:var(--surface-sunken);border-color:var(--line);border-radius:8px}
body:has(.topbar) .calendar-shell,body:has(.topbar) .statistics,body:has(.topbar) main>section:not(.hero){padding:20px;background:var(--surface);border-color:var(--line);border-radius:10px}
body:has(.topbar) .calendar{background:var(--surface-sunken);border-color:var(--line);border-radius:8px}
body:has(.topbar) .day{min-height:96px}
body:has(.topbar) .calendar-event{background:var(--accent-dim);border-color:var(--accent-line);border-radius:4px}
body:has(.topbar) .calendar-event{overflow:hidden;white-space:normal}
body:has(.topbar) .calendar-event b,body:has(.topbar) .calendar-event span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:has(.topbar) .calendar-event b{color:var(--fg);font-size:9px;letter-spacing:.04em;text-transform:uppercase}
body:has(.topbar) .calendar-event span{color:var(--muted)}
body:has(.topbar) .calendar-event.role-race{border-left:3px solid var(--accent)}
body:has(.topbar) .calendar-event.role-qualifying{border-left:3px solid var(--purple,#b46bff)}
body:has(.topbar) .calendar-event.role-practice{border-left:3px solid var(--ok)}
body:has(.topbar) .calendar-event.role-sprint{border-left:3px solid var(--warn)}
body:has(.topbar) .event-card,body:has(.topbar) .panel,body:has(.topbar) .person,body:has(.topbar) .stat{background:var(--surface-sunken);border-color:var(--line);border-radius:8px}
body:has(.topbar) .event-card:before{background:var(--accent)}
body:has(.topbar) .event-action{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
body:has(.topbar) .event-action.leave{background:var(--surface-raised);border-color:rgba(255,90,90,.28);color:var(--fg)}
body:has(.topbar) .attendance{margin:12px 0;border-top:1px solid var(--line);padding-top:10px}
body:has(.topbar) .attendance summary{cursor:pointer;color:var(--fg-muted);font-size:11px;font-weight:700}
body:has(.topbar) .attendance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:9px}
body:has(.topbar) .attendance-group{padding:9px;border:1px solid var(--line);border-radius:6px;background:var(--surface)}
body:has(.topbar) .attendance-group>b{display:block;margin-bottom:6px;font-size:11px}
body:has(.topbar) .attendance-group>b span{color:var(--fg-muted)}
body:has(.topbar) .attendance-group>div{padding:5px 0;border-top:1px solid var(--line)}
body:has(.topbar) .attendance-group strong,body:has(.topbar) .attendance-group small{display:block;font-size:10px}
body:has(.topbar) .attendance-group small{color:var(--fg-muted)}
body:has(.topbar) .status-registered{border-left:3px solid var(--ok)}
body:has(.topbar) .status-declined{border-left:3px solid var(--danger)}
body:has(.topbar) .status-seen{border-left:3px solid var(--accent)}
@media(max-width:620px){body:has(.topbar) .attendance-grid{grid-template-columns:1fr}}
@media(max-width:820px){body:has(.site-header) .hero{grid-template-columns:1fr}}