/* Theme definitions only. Club palette values live exclusively in club-identity.js. */
:root {
  color-scheme:dark;
  --brand-anchor:#091525;
  --text-on-brand:#f5f7fb;
  --surface-tile:#f8fafb;
  --text-on-tile:#081222;
  --surface-overlay:rgba(2,8,17,.72);
  --surface-modal: #0c1b2d;
  --input-text:var(--text-primary);
  --status-info:#a8d1ff;
  --disabled-opacity:.45;
  --divider:var(--border-subtle);
}
:root[data-theme="day"] {
  color-scheme:light;
  --surface-page:#f3f1eb;
  --surface-card:#fffefa;
  --surface-raised:#ffffff;
  --surface-muted:#eaece7;
  --surface-inset:#f2f3ee;
  --surface-input:#ffffff;
  --surface-hover:#e8ede9;
  --surface-selected:#f5e4df;
  --surface-selected-strong:#e9d6ce;
  --surface-modal:#fffefa;
  --surface-overlay:rgba(9,21,37,.58);
  --text-primary:#192c3c;
  --text-secondary:#52616a;
  --text-heading:#142b40;
  --text-muted:#52616a;
  --text-body:var(--text-primary);
  --text-subtle:var(--text-secondary);
  --text-success:var(--status-success);
  --text-warning:var(--status-warning);
  --text-danger:var(--status-danger);
  --text-info:var(--status-info);
  --surface-control:var(--surface-card);
  --surface-quiet:var(--surface-muted);
  --border-control:var(--border-subtle);
  --button-primary:#bd2630;
  --border-subtle:#c9d0ca;
  --border-strong:#82938e;
  --brand-primary:#bd2630;
  --brand-highlight:#a9232c;
  --status-success:#216247;
  --status-warning:#765007;
  --status-danger:#a62c37;
  --status-info:#245c82;
  --surface-success:#e7f1e8;
  --surface-warning:#f7eed7;
  --surface-danger:#f8e7e6;
  --surface-info:#e5eef5;
  --border-success:#78a28a;
  --border-warning:#b99c55;
  --border-danger:#c38a8e;
  --border-info:#7d9fb7;
  --focus-ring:#1c6397;
  --pitch-surface:#adc3ad;
  --pitch-surface-deep:#93af9b;
  --pitch-line:rgba(40,73,56,.32);
  --pitch-marking:rgba(34,68,50,.45);
  --pitch-label:#203d2e;
  --shadow:0 10px 28px rgba(25,44,60,.08);
  --elevation-colour:rgba(25,44,60,.10);
  --disabled-opacity:.62;
  --scroll-track:#e8eae5;
  --scroll-thumb:#83968c;
}
/* Components consume the same roles in either mode. Legacy literals are Night fallbacks. */
body { background:var(--page-background,radial-gradient(circle at 90% 5%,rgba(238,43,43,.13),transparent 28rem),linear-gradient(180deg,var(--bg),#09182a 52%,#07111f)); }
:root[data-theme="day"] { --page-background:linear-gradient(180deg,#f6f3ec,var(--surface-page)); }
button:disabled { opacity:var(--disabled-opacity); }
input,select,textarea { color:var(--input-text); }
input::placeholder,textarea::placeholder { color:var(--text-muted,#8093aa); opacity:1; }
.appearance-panel { margin-block:18px; padding:18px; }
.appearance-panel h2 { font-size:1.1rem; margin-bottom:8px; }
.appearance-options { display:flex; flex-wrap:wrap; gap:8px; }
.appearance-options button { flex:1 1 130px; min-height:44px; padding:10px 12px; border:1px solid var(--border-subtle); border-radius:10px; color:var(--text-primary); background:var(--surface-muted); }
.appearance-options [aria-pressed="true"] { border:2px solid var(--focus-ring); font-weight:800; background:var(--surface-selected,var(--surface-raised)); }
.appearance-options [aria-pressed="true"]::before { content:'✓ '; }
.appearance-panel p { color:var(--text-secondary); font-size:.8rem; margin:10px 0 0; }
:where(button,a,input,select,textarea):focus-visible { outline:2px solid var(--focus-ring); outline-offset:3px; }
/* A single brand anchor protects the existing logo and keeps Day recognisable. */
[data-theme="day"] .topbar { background:var(--brand-anchor); padding:18px; border-radius:16px; color:var(--text-on-brand); --text-primary:#f5f7fb;--text-secondary:#a9b6c8;--text:#f5f7fb;--muted:#a9b6c8;--text-muted:#a9b6c8;--text-body:#f5f7fb;--text-subtle:#a9b6c8;--text-warning:#ffe09a;--text-success:#8bedb7;--brand-highlight:#ff7c75;--surface-inset:#132a43;--surface-muted:#132a43;--surface-raised:#132a43;--surface-control:#132a43;--surface-quiet:#132a43;--border-subtle:#40566b;--border-control:#40566b; }
[data-theme="day"] .topbar h1 { color:var(--text-on-brand); }
@media(max-width:600px){[data-theme="day"] .topbar{padding:14px;}}
/* No theme transition animation: instant changes also respect reduced motion. */
@media(prefers-reduced-motion:reduce){.cloud-save-dot{animation:none!important;}}