/* Appearance controls surfaces; club identity remains the active accent. */
:root[data-appearance]:not([data-team]),:root[data-appearance][data-team="neutral"]{--club:var(--accent)!important;--club2:var(--accent)!important;--clubLight:var(--link)!important;--clubOn:var(--accent-ink)!important;--clubSoft:var(--soft)!important;--clubRGB:var(--accent-rgb)!important;--muted:var(--mute);--blue:var(--link);--on:var(--accent-ink);--hero:var(--soft);--score:var(--field);--tint:var(--soft);--goldbg:var(--soft)}
:root[data-appearance="1"]{color-scheme:light;--bg:#f5f2ea;--panel:#fff;--ink:#152d40;--mute:#526579;--line:#cbd3d9;--soft:#e6edf2;--field:#f5f7f9;--accent:#102d43;--accent-ink:#fff;--accent-rgb:16,45,67;--link:#174e74;--shell:#102d43;--shell-accent:#e5c788;--gold:#946534;--danger:#a62f30;--live:#247348;--livetx:#247348}
:root[data-appearance="2"]{color-scheme:dark;--bg:#0d1726;--panel:#16263a;--ink:#f3f6fb;--mute:#b7c6d9;--line:#3b506b;--soft:#223953;--field:#102034;--accent:#69a8ff;--accent-ink:#102034;--accent-rgb:105,168,255;--link:#8dbdff;--shell:#102034;--shell-accent:#8dbdff;--gold:#e3c88e;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5}
:root[data-appearance="3"]{color-scheme:light;--bg:#f4f3e9;--panel:#fff;--ink:#173b33;--mute:#53685e;--line:#c5d3c9;--soft:#e4ede5;--field:#f4f7f3;--accent:#153e35;--accent-ink:#fff;--accent-rgb:21,62,53;--link:#225e4e;--shell:#153e35;--shell-accent:#e5cb90;--gold:#876020;--danger:#a62f30;--live:#247348;--livetx:#247348}
:root[data-appearance="4"]{color-scheme:dark;--bg:#151a20;--panel:#202830;--ink:#f1f5f6;--mute:#b5c1ca;--line:#42535d;--soft:#2b3c40;--field:#10161c;--accent:#78d9ba;--accent-ink:#10281f;--accent-rgb:120,217,186;--link:#78d9ba;--shell:#10161c;--shell-accent:#78d9ba;--gold:#e3c88e;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5}
/* Additional light and dark surfaces. */
:root[data-appearance="5"]{color-scheme:light;--bg:#f2f5f9;--panel:#fff;--ink:#192c42;--mute:#54667b;--line:#cbd5e2;--soft:#e6edf6;--field:#f7f9fc;--accent:#27548a;--accent-ink:#fff;--accent-rgb:39,84,138;--link:#27548a;--shell:#19334f;--shell-accent:#c2dbff;--gold:#866018;--danger:#a62f30;--live:#247348;--livetx:#247348}
:root[data-appearance="6"]{color-scheme:light;--bg:#f7f3f8;--panel:#fff;--ink:#35283e;--mute:#6d5d78;--line:#d8ccdf;--soft:#eee6f2;--field:#faf7fc;--accent:#69467f;--accent-ink:#fff;--accent-rgb:105,70,127;--link:#69467f;--shell:#3a2849;--shell-accent:#ead6fa;--gold:#866018;--danger:#a62f30;--live:#247348;--livetx:#247348}
:root[data-appearance="7"]{color-scheme:dark;--bg:#0c0d10;--panel:#181a1f;--ink:#f4f5f7;--mute:#b7bec9;--line:#414752;--soft:#282d35;--field:#111318;--accent:#d3dbe8;--accent-ink:#171d28;--accent-rgb:211,219,232;--link:#d3dbe8;--shell:#0a0c10;--shell-accent:#d3dbe8;--gold:#e3c88e;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5}
:root[data-appearance="8"]{color-scheme:dark;--bg:#1d1420;--panel:#2b2030;--ink:#faf1f7;--mute:#cfbacb;--line:#624b60;--soft:#402e43;--field:#221827;--accent:#e0aedb;--accent-ink:#311b35;--accent-rgb:224,174,219;--link:#e0aedb;--shell:#211526;--shell-accent:#e0aedb;--gold:#e3c88e;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5}
:root[data-appearance]{--muted:var(--mute);--blue:var(--link);--on:var(--accent-ink);--hero:var(--soft);--score:var(--field);--tint:var(--soft);--goldbg:var(--soft)}
:root[data-appearance][data-team]:not([data-team="neutral"]){--accent:var(--club);--accent-ink:var(--clubOn);--accent-rgb:var(--clubRGB);--shell-accent:var(--clubLight)}
:root[data-appearance][data-team]:not([data-team="neutral"]) .top,:root[data-appearance][data-team]:not([data-team="neutral"]) .mobile-nav{background:color-mix(in srgb,var(--club) 30%,var(--shell));border-color:var(--club)}
:root[data-appearance] body{background:var(--bg);color:var(--ink)}
:root[data-appearance] .top,:root[data-appearance] .mobile-nav{background:var(--shell);color:#f3f6fb;border-color:#ffffff30}
:root[data-appearance] .top .nav button,:root[data-appearance] .top .settings-menu>summary,:root[data-appearance] .mobile-nav button{color:#d9e3ed}
:root[data-appearance] .top .nav button.on,:root[data-appearance] .mobile-nav button[aria-current=page]{background:#ffffff16;color:var(--shell-accent)}
:root[data-appearance] .top .brand-crown{filter:brightness(0) invert(1)}
:root[data-appearance="1"] .top .brand-crown,:root[data-appearance="3"] .top .brand-crown{filter:brightness(0) saturate(100%) invert(79%) sepia(37%) saturate(400%) hue-rotate(356deg)}
:root[data-appearance] .top .logo{color:#fff!important}
:root[data-appearance] .top .login-button{background:#ffffff16;color:#fff;border-color:#ffffff40}
:root[data-appearance] .card,:root[data-appearance] .box,:root[data-appearance] .post,:root[data-appearance] .cmt,:root[data-appearance] .upcoming,:root[data-appearance] .football-table{background:var(--panel);color:var(--ink);border-color:var(--line)}
:root[data-appearance] .football-competitions button{background:var(--soft);color:var(--ink);border-color:var(--line)}
:root[data-appearance] .football-competitions button.selected,:root[data-appearance] .chip.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
:root[data-appearance] .mobile-next-fixture small,:root[data-appearance] .mobile-next-fixture em,:root[data-appearance] .mobile-competition-nav button{color:var(--mute)}
:root[data-appearance] .account-page .textlink{color:var(--link)}
.account-page .account-profile-fields{grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
.account-page .account-profile-fields .account-language{grid-column:1 / 2}
.account-page .account-profile-fields .account-theme{grid-column:2 / 4}
.account-page .account-profile-fields .account-profile-row{padding:14px;min-width:0}
.account-page .account-profile-fields .account-profile-row select{font-size:16px;min-height:44px;width:100%;max-width:none}
@media(max-width:600px){.account-page .account-profile-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.account-page .account-profile-fields .account-profile-row{grid-column:1 / -1;padding:14px 0;border-right:0}.account-page .account-profile-fields .account-language{grid-column:1;padding-right:10px}.account-page .account-profile-fields .account-theme{grid-column:2;padding-left:10px}.account-page .account-profile-fields .account-field-label{font-size:15px}.account-page .account-profile-fields .account-profile-row select{font-size:13px;padding:8px 4px}}

:root[data-appearance] .stadiumhero .hero-copy h1 em{color:var(--shell-accent)}
:root[data-appearance] .stadiumhero .upcoming h2,:root[data-appearance] .stadiumhero .upcoming .fixture-teams{color:var(--ink)}

/* Additional choices; original club palette remains the default. */
:root[data-appearance="9"]{color-scheme:light;--bg:#ffffff;--panel:#ffffff;--ink:#101720;--mute:#586471;--line:#e4e9ef;--soft:#edf3ff;--field:#ffffff;--accent:#1559da;--accent-ink:#ffffff;--accent-rgb:21,89,218;--link:#1559da;--shell:#ffffff;--shell-accent:#1559da;--gold:#1559da;--danger:#a62f30;--live:#247348;--livetx:#247348;}
:root[data-appearance="10"]{color-scheme:dark;--bg:#111316;--panel:#1d2025;--ink:#f9fafc;--mute:#aeb6c3;--line:#363c46;--soft:#3b2228;--field:#111316;--accent:#ff7a85;--accent-ink:#300d14;--accent-rgb:255,122,133;--link:#ff7a85;--shell:#1d2025;--shell-accent:#ff7a85;--gold:#ff7a85;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5;}
:root[data-appearance="11"]{color-scheme:light;--bg:#f7f2ff;--panel:#ffffff;--ink:#261640;--mute:#71617d;--line:#e6dcf3;--soft:#eee4ff;--field:#f7f2ff;--accent:#7435cf;--accent-ink:#ffffff;--accent-rgb:116,53,207;--link:#7435cf;--shell:#ffffff;--shell-accent:#7435cf;--gold:#7435cf;--danger:#a62f30;--live:#247348;--livetx:#247348;}
:root[data-appearance="12"]{color-scheme:light;--bg:#eff7ff;--panel:#ffffff;--ink:#102d46;--mute:#566e82;--line:#d6e6f5;--soft:#e0eeff;--field:#eff7ff;--accent:#075dda;--accent-ink:#ffffff;--accent-rgb:7,93,218;--link:#075dda;--shell:#ffffff;--shell-accent:#075dda;--gold:#075dda;--danger:#a62f30;--live:#247348;--livetx:#247348;}
:root[data-appearance="13"]{color-scheme:light;--bg:#fff3f3;--panel:#ffffff;--ink:#3b161c;--mute:#806069;--line:#f1dce0;--soft:#ffe4e9;--field:#fff3f3;--accent:#c4203c;--accent-ink:#ffffff;--accent-rgb:196,32,60;--link:#c4203c;--shell:#ffffff;--shell-accent:#c4203c;--gold:#c4203c;--danger:#a62f30;--live:#247348;--livetx:#247348;}
:root[data-appearance="14"]{color-scheme:dark;--bg:#101b31;--panel:#192840;--ink:#f6f8ff;--mute:#acbad0;--line:#304562;--soft:#253b5e;--field:#101b31;--accent:#91baff;--accent-ink:#102242;--accent-rgb:145,186,255;--link:#91baff;--shell:#192840;--shell-accent:#91baff;--gold:#91baff;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5;}
:root[data-appearance="15"]{color-scheme:dark;--bg:#191919;--panel:#252525;--ink:#fafafa;--mute:#c5c5c5;--line:#484848;--soft:#443020;--field:#191919;--accent:#ffb26b;--accent-ink:#251708;--accent-rgb:255,178,107;--link:#ffb26b;--shell:#252525;--shell-accent:#ffb26b;--gold:#ffb26b;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5;}
:root[data-appearance="16"]{color-scheme:dark;--bg:#242c38;--panel:#303b4b;--ink:#f7fbff;--mute:#c2cedd;--line:#536176;--soft:#384f66;--field:#242c38;--accent:#a7dcff;--accent-ink:#142b3c;--accent-rgb:167,220,255;--link:#a7dcff;--shell:#303b4b;--shell-accent:#a7dcff;--gold:#a7dcff;--danger:#ffaaa7;--live:#a9e4c5;--livetx:#a9e4c5;}
/* Readability uses theme foregrounds, never a club accent for scores. */
:root[data-appearance] :is(.football-match,.football-panel,.live-widget,.livewrap,.home-standings,.mobile-next-fixture,.upcoming,.next){background:var(--panel);color:var(--ink);border-color:var(--line)}
:root[data-appearance] :is(.football-score,.football-club,.football-club b,.fixture-teams,.kickoff-time,.standing-row,.football-table td,.football-table th){color:var(--ink)!important;opacity:1}
:root[data-appearance] :is(.football-clock,.football-fixture-meta,.football-match-state,.fixture-time-country,.fixture-time-date,.football-score small,.football-match .meta){color:var(--mute)!important;opacity:1}
:root[data-appearance] .stadiumhero .mobile-match{background:var(--panel);color:var(--ink)}
:root[data-appearance] .stadiumhero .upcoming :is(h2,.fixture-teams){color:var(--ink)}
:root:is([data-appearance="9"],[data-appearance="10"],[data-appearance="11"],[data-appearance="12"],[data-appearance="13"],[data-appearance="14"],[data-appearance="15"],[data-appearance="16"]) body{background-image:none}
:root:is([data-appearance="9"],[data-appearance="10"],[data-appearance="11"],[data-appearance="12"],[data-appearance="13"],[data-appearance="14"],[data-appearance="15"],[data-appearance="16"]) :is(.top,.mobile-nav){background:var(--panel)!important;color:var(--ink);border-color:var(--line)}
:root:is([data-appearance="9"],[data-appearance="10"],[data-appearance="11"],[data-appearance="12"],[data-appearance="13"],[data-appearance="14"],[data-appearance="15"],[data-appearance="16"]) :is(.top .logo,.top .nav button,.top .settings-menu>summary,.mobile-nav button){color:var(--ink)!important}
:root:is([data-appearance="9"],[data-appearance="10"],[data-appearance="11"],[data-appearance="12"],[data-appearance="13"],[data-appearance="14"],[data-appearance="15"],[data-appearance="16"]) :is(.top .nav button.on,.mobile-nav button[aria-current=page],.top .login-button){background:var(--soft);color:var(--ink)!important;border-color:var(--line)}
/* White theme: clear black outlines without changing the other palettes. */
:root[data-appearance="9"]{--line:#20252b!important}
:root[data-appearance="9"] :is(.card,.box,.post,.cmt,.upcoming,.football-table,.football-match,.football-panel,.mobile-next-fixture,.next,.account-identity,.account-stats,.account-crest,.picker-teams button,.football-competitions button,.fld input,.fld select,.fld textarea){border:2px solid var(--line)}
:root[data-appearance="9"] :is(.top,.mobile-nav){border-width:2px}
/* The settings dropdown must use its own surface/foreground pair in every theme. */
:root .top .settings-menu .apps-dropdown{background:var(--panel)!important;color:var(--ink)!important;border-color:var(--line)!important}
:root .top .settings-menu .apps-dropdown :is(button,a,strong){background:transparent;color:var(--ink)!important;opacity:1}
:root .top .settings-menu .apps-dropdown :is(button,a):is(:hover,:focus-visible){background:var(--soft)!important;color:var(--ink)!important;outline-color:var(--link)}
:root .top .settings-menu:is(:hover,:focus-within,[open])>summary{background:var(--soft)!important;color:var(--ink)!important}
:root .settings-tabs .chip:is(:hover,:focus-visible){background:var(--soft);color:var(--ink);border-color:var(--line)}
:root[data-appearance] .settings-page :is(select,option,optgroup,input:not([type=checkbox]),textarea){background:var(--field);color:var(--ink);border-color:var(--line)}
:root[data-appearance] .settings-page :is(.meta,.sub,.account-field-label){color:var(--mute)}
:root[data-appearance="10"] :is(.settings-tabs .chip.on,.top .nav>button.on,.mobile-nav button[aria-current=page]){background:#ff7a85!important;color:#300d14!important;border-color:#ff7a85}
/* All five settings destinations visible together, never a scrolling strip. */
:root .settings-page nav.settings-tabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px;width:100%;max-width:760px;min-width:0;overflow:visible;padding:0;box-sizing:border-box}
:root .settings-page nav.settings-tabs>button.chip{width:100%;min-width:0;max-width:100%;height:48px;min-height:48px;padding:8px 4px;white-space:normal;font-size:14px;line-height:1.2;letter-spacing:-.025em;box-sizing:border-box;justify-content:center}
@media(max-width:480px){:root .settings-page nav.settings-tabs{gap:3px}:root .settings-page nav.settings-tabs>button.chip{font-size:clamp(11px,2.9vw,13px);padding:8px 1px;border-radius:6px}}

/* Compact account summary: identity once, preferences in a single row. */
.account-page .account-compact-profile{padding:16px 20px}
.account-compact-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.account-compact-person{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-width:0}
.account-compact-person>strong{font-size:20px;line-height:1.4;overflow-wrap:anywhere}
.account-compact-badge{font:inherit;cursor:pointer;border:1px solid var(--line);min-height:32px;font-size:14px;color:var(--mute);padding:2px 8px;border-radius:6px;background:var(--soft)}
.account-page .account-compact-edit{flex:none;min-height:40px;font-size:14px;padding:6px 12px}
.account-compact-meta{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:2px 0 6px;font-size:14px}
.account-compact-meta .account-supported-team{gap:6px}
.account-page .account-compact-meta .textlink{margin-left:auto;text-align:right;font-size:14px;min-height:36px;padding:4px 0}
.account-compact-preferences{display:grid;grid-template-columns:1fr 1fr;gap:16px;border-top:1px solid var(--line);padding-top:12px}
.account-compact-preferences>div{display:flex;align-items:center;gap:10px;min-width:0}
.account-compact-preferences label,.account-compact-preferences .account-field-label{font-size:14px;padding:0;color:var(--mute);flex:none}
.account-compact-preferences select{width:100%;min-width:0;min-height:40px;padding:6px 10px;font:inherit;font-size:14px;color:var(--ink);background:var(--field);border:1px solid var(--line);border-radius:8px}
@media(max-width:600px){.account-page .account-compact-profile{padding:14px}.account-compact-person>strong{font-size:18px}.account-compact-preferences{gap:10px}.account-compact-preferences>div{flex-direction:column;align-items:stretch;gap:5px}.account-compact-top{align-items:flex-start}.account-page .account-compact-edit{padding:6px 8px}}

.account-compact-meta:empty{display:none}
.account-compact-top{margin-bottom:10px}
.account-compact-badge:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
