/* Shared semantic colors for both appearances. */
:root{
 color-scheme:light;
 --bg:#f6f7f4;--ink:#103f49;--muted:#587078;--line:#dce5e3;--white:#fff;
 --green:#103f49;--lime:#c8f04a;--amber:#947025;
 --surface:#fff;--surface-raised:#fcfdfb;--surface-soft:#edf3ee;--surface-inset:#f5f8f5;
 --field:#fdfefb;--placeholder:#5f767c;--accent:#103f49;--on-accent:#fff;--accent-hover:#0b3038;
 --selected-bg:#e7f1d7;--selected-ink:#103f49;--positive:#476d2f;--positive-bg:#eaf3df;
 --warning:#866124;--warning-bg:#faf1dd;--draft:#75694f;--draft-bg:#f2f0ea;--error:#a94032;
 --focus:#6a8c37;--focus-ring:#8ba76133;--shadow:#103f4910;
 --border:var(--line);
}
:root[data-theme="dark"]{
 color-scheme:dark;
 --bg:#071e27;--ink:#eff6f5;--muted:#a3bbc2;--line:#28505c;--white:#0e2c36;
 --green:#c8f04a;--amber:#e6bc6b;
 --surface:#0e2c36;--surface-raised:#102f39;--surface-soft:#153943;--surface-inset:#0b2630;
 --field:#0b2630;--placeholder:#8da8b1;--accent:#c8f04a;--on-accent:#10242b;--accent-hover:#daf778;
 --selected-bg:#173b42;--selected-ink:#d2f567;--positive:#b8e887;--positive-bg:#153c32;
 --warning:#edc477;--warning-bg:#3b3322;--draft:#becfd5;--draft-bg:#213b46;--error:#ffa398;
 --focus:#c8f04a;--focus-ring:#c8f04a33;--shadow:#00000026;
}
body{background:var(--bg);color:var(--ink)}
button{color:inherit}
.primary{background:var(--accent);color:var(--on-accent);box-shadow:0 3px 8px var(--shadow)}
.primary:hover{background:var(--accent-hover)}
#pick-meeting[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.toast{background:var(--accent);color:var(--on-accent)}
input,textarea,select{accent-color:var(--accent)}
.sidebar .brand-wordmark,.login-art .brand-wordmark{transition:none}
:root[data-theme="dark"] .brand-wordmark{filter:brightness(0) invert(1)}
:root[data-theme="dark"] .login-art{background:linear-gradient(180deg,#0b2832 0%,#103f49 60%,#071e27 100%)}
:root[data-theme="dark"] .login-art .brand-description{color:#c7dcd9}
:root[data-theme="dark"] .login-art:after{opacity:.08}
:root[data-theme="dark"] .nav-item.active{box-shadow:inset 3px 0 0 var(--lime)}
:root[data-theme="dark"] .event-card,:root[data-theme="dark"] .stats>div{background:linear-gradient(120deg,var(--surface-raised),var(--surface))}
:root[data-theme="dark"] .leaflet-bar a{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .leaflet-bar a:hover{background:var(--surface-soft)}
:root[data-theme="dark"] .leaflet-control-attribution{background:var(--surface);color:var(--muted)}
:root[data-theme="dark"] .leaflet-control-attribution a{color:var(--positive)}
:root[data-theme="dark"] .leaflet-tooltip,:root[data-theme="dark"] .leaflet-popup-content-wrapper,:root[data-theme="dark"] .leaflet-popup-tip{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .search input{color:var(--ink)}
@media(max-width:600px){.topbar .avatar{display:none}.topbar .profile{gap:0}.club-switch select{width:120px}.club-switch{font-size:0;gap:0}.mobile-nav{flex:1;justify-content:flex-end}.mobile-nav button{padding:5px 4px}}

/* Compact icon disclosures live in the application header or public top bar. */
.public-topbar{position:absolute;top:14px;right:20px;z-index:40}
body:has(#app-view:not([hidden])) .public-topbar{display:none}
.topbar-actions{display:flex;align-items:center;gap:22px;margin-left:auto}
.preference-controls{display:flex;align-items:center;gap:6px}
.preference-menu{position:relative}
.icon-control{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:38px;min-width:38px;padding:8px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--muted);cursor:pointer}
.icon-control svg{width:19px;height:19px;flex:none}
.language-control{font-size:10px;font-weight:750;letter-spacing:.4px;padding:8px 10px}
.icon-control:hover,.icon-control[aria-expanded="true"]{background:var(--surface-soft);color:var(--ink);border-color:var(--line)}
.icon-control:focus-visible,.preference-option:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.preference-panel{position:absolute;right:0;top:calc(100% + 9px);width:206px;padding:7px;z-index:70;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px var(--shadow);color:var(--ink)}
.preference-title{font-size:10px;font-weight:650;color:var(--muted);margin:6px 9px 8px}
.preference-option{width:100%;display:flex;align-items:center;gap:10px;min-height:40px;padding:10px;border:0;border-radius:7px;background:transparent;color:var(--ink);font-size:12px;text-align:left;cursor:pointer}
.preference-option>span{flex:1}
.preference-option svg{width:17px;height:17px;flex:none}
.preference-option:hover{background:var(--surface-soft)}
.preference-option[aria-pressed="true"]{background:var(--selected-bg);color:var(--selected-ink);font-weight:650}
.preference-option .choice-check{opacity:0;width:15px}
.preference-option[aria-pressed="true"] .choice-check{opacity:1}
#public-preferences .preference-controls{padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
@media(max-width:850px){.topbar{height:auto;min-height:76px;padding:12px 20px;flex-wrap:wrap;gap:10px}.topbar-actions{gap:10px}.topbar .mobile-nav{order:3;flex:0 0 100%;justify-content:flex-start;gap:8px}.mobile-nav button{padding:8px 12px;min-height:34px;border-radius:6px;background:var(--surface-soft);color:var(--ink)}}
@media(max-width:600px){.topbar{padding:10px 14px;gap:8px}.topbar-actions{gap:5px}.topbar .club-switch select{width:128px}.topbar .profile{gap:0}.topbar .mobile-nav{gap:6px}.mobile-nav button{font-size:10px;flex:1;padding:8px}.icon-control{height:38px;min-width:36px}.public-topbar{top:10px;right:12px}.preference-panel{width:196px}}
