/* ============================================================ sportcenter-manager — design system Palette: campo blu profondo + linee chalk + accento "pallina" Type: Oswald (display/scoreboard) · Inter (body) · Space Mono (numeri) ============================================================ */ :root { --court-blue-950: #0d1f30; --court-blue-900: #12283d; --court-blue-800: #1b3a54; --court-blue-700: #274a68; --line-white: #edf1f2; --chalk-grey: #9fb1bf; --chalk-grey-dim: #6b7d8a; --ball: #c6df2e; --ball-dim: #a3b825; --danger: #e0645a; --radius: 10px; --gap: 16px; font-size: 16px; } /* Tema chiaro, opzionale (attivato via data-theme="light" su , scelta salvata sul dispositivo — vedi initThemeToggle in utils.js). Stessi ruoli semantici delle variabili sopra, solo invertiti in chiarezza: il resto del CSS non cambia, legge sempre le stesse custom property. */ :root[data-theme="light"] { --court-blue-950: #eef2f4; --court-blue-900: #ffffff; --court-blue-800: #e4eaed; --court-blue-700: #c7d3d9; --line-white: #16283a; --chalk-grey: #52697a; --chalk-grey-dim: #8199a8; --ball: #6f8f00; --ball-dim: #576f00; --danger: #c23b2e; } * { box-sizing: border-box; } html, body { margin: 0; padding: 0; background: var(--court-blue-950); color: var(--line-white); font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; -webkit-tap-highlight-color: transparent; } body { min-height: 100dvh; display: flex; flex-direction: column; } h1, h2, h3, .display { font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 0.01em; text-transform: uppercase; margin: 0; color: var(--line-white); } .mono, .num { font-family: 'Space Mono', monospace; font-variant-numeric: tabular-nums; } a { color: var(--ball); } /* Layout: mobile-first single column, max width for larger screens */ .app { width: 100%; max-width: 480px; margin: 0 auto; min-height: 100dvh; display: flex; flex-direction: column; background: var(--court-blue-950); position: relative; } .topbar { padding: 20px var(--gap) 14px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; border-bottom: 1px dashed var(--court-blue-700); } .topbar h1 { font-size: 1.15rem; white-space: nowrap; } .topbar-kicker { font-size: 0.68rem; color: var(--chalk-grey); text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 2px; } .topbar .user-chip { font-size: 0.75rem; color: var(--chalk-grey); font-family: 'Space Mono', monospace; text-align: center; line-height: 1.3; min-width: 0; } .topbar-link { font-size: 0.68rem; color: var(--chalk-grey); text-decoration: none; border: 1px solid var(--court-blue-700); border-radius: 6px; padding: 4px 8px; white-space: nowrap; } .topbar-link:hover { color: var(--ball); border-color: var(--ball); } /* Reset per usare .topbar-link anche su