/* One color system for the website, member workspace, studio and tournament pages. */
:root,.tournament-theme-preview,.arena-row{
 --theme-hue:218;--theme-end:181;--theme-pop:#caf76c;--theme-pop-ink:#20300d;
 --theme-strong:hsl(var(--theme-hue) 65% 29%);
 --hero-background:radial-gradient(ellipse at 90% 110%,hsl(var(--theme-end) 85% 32% / .6),transparent 55%),radial-gradient(ellipse at 88% -40%,hsl(var(--theme-hue) 94% 63%),transparent 66%),linear-gradient(115deg,hsl(var(--theme-hue) 61% 17%),hsl(var(--theme-hue) 74% 29%) 65%,hsl(var(--theme-end) 64% 25%));
 --hero-border:hsl(var(--theme-hue) 40% 49%);
}
[data-tournament-theme=emerald]{--theme-hue:157;--theme-end:187;--theme-pop:#a3f2b0;--theme-pop-ink:#143a29}
[data-tournament-theme=violet]{--theme-hue:264;--theme-end:319;--theme-pop:#dec0ff;--theme-pop-ink:#36204e}
[data-tournament-theme=crimson]{--theme-hue:347;--theme-end:18;--theme-pop:#ffc0aa;--theme-pop-ink:#4b2127}
[data-tournament-theme=gold]{--theme-hue:38;--theme-end:18;--theme-pop:#ffe298;--theme-pop-ink:#44300a}
[data-tournament-theme=ocean]{--theme-hue:191;--theme-end:226;--theme-pop:#a0f2ec;--theme-pop-ink:#123b45}
:root{
 color-scheme:light;
 --bg:hsl(var(--theme-hue) 50% 96%);--paper:var(--bg);--panel:#fff;--raised:var(--panel);--surface:var(--panel);
 --text:hsl(var(--theme-hue) 48% 17%);--ink:var(--text);--muted:hsl(var(--theme-hue) 20% 40%);
 --line:hsl(var(--theme-hue) 35% 85%);--hover:hsl(var(--theme-hue) 48% 94%);
 --accent:var(--theme-pop);--accent-ink:var(--theme-pop-ink);--green:var(--theme-pop);
 --button-bg:var(--theme-pop);--button-ink:var(--theme-pop-ink);--band-bg:hsl(var(--theme-hue) 56% 15%);
 --dark:hsl(var(--theme-hue) 56% 15%);--nav-bg:hsl(var(--theme-hue) 50% 98% / .96);
 --arena-blue:var(--theme-strong);--arena-teal:hsl(var(--theme-end) 70% 28%);
 --shadow:0 10px 30px hsl(var(--theme-hue) 65% 20% / .05);
 --canvas-dot:hsl(var(--theme-hue) 35% 40% / .17);--canvas-blue:hsl(var(--theme-hue) 90% 60% / .13);--canvas-teal:hsl(var(--theme-end) 80% 40% / .09);
}
html[data-theme=dark]{
 color-scheme:dark;
 --bg:hsl(var(--theme-hue) 56% 8%);--panel:hsl(var(--theme-hue) 48% 13%);
 --text:hsl(var(--theme-hue) 85% 96%);--muted:hsl(var(--theme-hue) 27% 71%);
 --line:hsl(var(--theme-hue) 36% 25%);--hover:hsl(var(--theme-hue) 43% 19%);
 --nav-bg:hsl(var(--theme-hue) 48% 12% / .96);
 --arena-blue:hsl(var(--theme-hue) 90% 78%);--arena-teal:hsl(var(--theme-end) 65% 70%);
 --canvas-dot:hsl(var(--theme-hue) 45% 80% / .12);--canvas-blue:hsl(var(--theme-hue) 85% 55% / .16);--canvas-teal:hsl(var(--theme-end) 80% 40% / .1);
 --shadow:0 10px 30px #00000012;
}
/* Legacy stylesheets also define these aliases in dark-mode selectors. */
:root,html[data-theme=dark]{
 --paper:var(--bg);--ink:var(--text);--raised:var(--panel);--surface:var(--panel);
 --button-bg:var(--theme-pop);--button-ink:var(--theme-pop-ink);
 --band-bg:hsl(var(--theme-hue) 56% 15%);
 --login-bg:var(--bg);--login-ink:var(--text);--login-muted:var(--muted);--login-line:var(--line);
 --login-input:var(--panel);--login-button:var(--theme-pop);--login-button-text:var(--theme-pop-ink);
}
/* Opaque headers and cards remain clear against the shared ambient background. */
.workspace>.workspace-header,.workspace>.sidebar{background:var(--nav-bg)}
.workspace .welcome-banner,.workspace .arena-intro,.workspace .arena-hero,.arena-public .public-event-hero,.tournament-theme-preview{background:var(--hero-background);color:#fff;border:1px solid var(--hero-border)}
.workspace .welcome-banner p,.workspace .arena-intro p,.workspace .arena-hero>p,.workspace .arena-hero .arena-meta{color:#e0e9f7}
.workspace .arena-hero .eyebrow,.workspace .arena-intro .eyebrow,.welcome-banner .eyebrow,.story-content .eyebrow,.story-content h1 span{color:var(--theme-pop)}
.workspace .arena-hero .arena-meta{border-color:#ffffff30}
.workspace .arena-hero{border-top:3px solid var(--theme-pop)}
.workspace .org-tabs a[aria-current],.workspace .competition-tabs a[aria-current=page]{background:var(--theme-pop);color:var(--theme-pop-ink)}
.workspace .org-monogram,.workspace .arena-emblem,html[data-theme=dark] .workspace .arena-emblem{background:var(--hover);color:var(--arena-blue)}
.workspace .arena-intro-symbol{border-color:color-mix(in srgb,var(--theme-pop) 35%,transparent);box-shadow:0 0 0 20px color-mix(in srgb,var(--theme-pop) 5%,transparent)}
.workspace .arena-intro-symbol svg,.welcome-banner a{color:var(--theme-pop)}
.primary:hover{background:color-mix(in srgb,var(--theme-pop) 85%,white)}
.story-overlay{background:linear-gradient(180deg,hsl(var(--theme-hue) 60% 12% / .35),hsl(var(--theme-hue) 60% 12% / .8) 60%,hsl(var(--theme-hue) 60% 12%))}
/* The login photo stays edge-to-edge, without a decorative frame. */
.auth-story{background:var(--hero-background);color:#fff;border:0}
/* Tournament accents follow its palette in both appearance modes. */
.arena-public .public-event-hero{box-shadow:var(--shadow)}
.public-event-hero:after,.arena-public .event-progress>span{background:var(--theme-pop)}
.arena-public .event-summary .event-goals strong{color:var(--theme-pop)}
.arena-public .event-state{color:var(--theme-pop);border-color:color-mix(in srgb,var(--theme-pop) 35%,transparent);background:#091321b3}
.arena-public .event-art{color:#ffffff35}
.event-art .cup-start{stop-color:#fff8dd}.event-art .cup-middle{stop-color:var(--theme-pop)}.event-art .cup-end{stop-color:hsl(var(--theme-end) 70% 65%)}
.event-art .cup-star{fill:hsl(var(--theme-hue) 60% 22%)}.event-art .cup-spark{stroke:var(--theme-pop)}
.arena-public .is-finished .match-teams>strong{background:var(--theme-pop);border-color:var(--theme-pop);color:var(--theme-pop-ink);box-shadow:none}
.arena-public .match-section>h3:before{background:var(--arena-blue)}
.arena-public .match-section:nth-of-type(even)>h3:before{background:var(--arena-teal)}
/* Finished is a semantic status, distinct from the tournament palette. */
.arena-public .match-card.is-finished{background:#eaf7f0;border-color:#8fbfa5;border-top:4px solid #268052}
html[data-theme=dark] .arena-public .match-card.is-finished{background:#142e29;border-color:#386b56;border-top:4px solid #72ce99}
.arena-public .match-card.is-finished .match-top>.match-state{display:inline-flex;align-items:center;gap:6px;background:#196d43;color:#fff;padding:6px 10px;border-radius:7px;font-size:11px;font-weight:700;letter-spacing:.02em}
html[data-theme=dark] .arena-public .match-card.is-finished .match-top>.match-state{background:#a0e8ba;color:#163823}
.arena-public .match-state svg{width:14px;height:14px}
.arena-public .match-card.is-finished:hover{border-color:#268052}
html[data-theme=dark] .arena-public .match-card.is-finished:hover{border-color:#72ce99}
/* Studio surfaces use the same light/dark tokens as the member workspace. */
body:has(.app) .topbar,body:has(.app) :is(.panel,.stat,.album-card,.media-card,.dialog-head,.form-actions),body:has(.app) dialog{background:var(--panel);color:var(--text);border-color:var(--line)}
body:has(.app) :is(input,select,textarea){background:var(--panel);color:var(--text);border-color:var(--line)}
body:has(.app) :is(th,.quick){background:var(--hover);color:var(--muted);border-color:var(--line)}
body:has(.app) :is(td,.panel-head,.check-row){border-color:var(--line)}
body:has(.app) .hero-card{background:var(--hero-background)}
body:has(.app) .hero-card .copy{background:transparent}
/* Native radios preserve keyboard navigation and expose each color by name. */
.tournament-theme-picker{border:0;padding:0;margin:22px 0}
.tournament-theme-picker legend{font-size:12px;font-weight:700;margin-bottom:10px}
.theme-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.theme-choice{position:relative;display:flex;align-items:center;gap:9px;margin:0;padding:10px;border:1px solid var(--line);border-radius:10px;cursor:pointer;min-height:46px;font-size:11px}
.theme-choice input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.theme-choice:has(input:checked){border-color:var(--arena-blue);background:var(--hover);box-shadow:inset 0 0 0 1px var(--arena-blue)}
.theme-choice:has(input:focus-visible){outline:3px solid var(--arena-blue);outline-offset:3px}
.theme-swatch{width:20px;height:20px;flex-shrink:0;border-radius:50%;background:var(--swatch);display:grid;place-items:center;color:white;text-shadow:0 1px 3px #000}
.theme-choice input:checked+.theme-swatch:after{content:'✓';font-size:14px;font-weight:800}
.tournament-theme-preview{margin-top:12px;padding:20px;border-radius:14px;display:flex;justify-content:space-between;align-items:center;gap:16px;min-width:0}
.tournament-theme-preview>div{min-width:0}.tournament-theme-preview small{display:block;color:#e4eaf6;font-size:10px;margin-bottom:5px}
.tournament-theme-preview b{font-family:Manrope,sans-serif;font-size:17px;overflow-wrap:anywhere}
.tournament-theme-preview>strong{flex-shrink:0;font-size:21px;background:var(--theme-pop);color:var(--theme-pop-ink);padding:8px 12px;border-radius:9px}
.tournament-theme-picker .help-copy{margin:8px 0 0!important;font-size:11px!important}
.arena-row[data-tournament-theme] .arena-emblem{background:var(--hero-background);color:var(--theme-pop);border-color:var(--hero-border)}
@media(max-width:420px){.theme-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-choice{font-size:11px}}