/* ══════════════════════════════════════════════════════════════════════ Handicap Engine — Design Tokens (kanonische Quelle, siehe DESIGN.md) Konsumenten: alle öffentlichen Seiten + App (public/app/css/style.css). Dark Mode ist gegated: greift nur auf Seiten mit . ══════════════════════════════════════════════════════════════════════ */ :root { --forest: #14532D; --green: #16A34A; --green-lt: #DCFCE7; --green-dk: #166534; --ink: #111827; --sub: #374151; --muted: #656E7B; --border: #E5E7EB; --surface: #F3F4F6; --surface-alt: #E5E7EB; --page: #F9FAFB; --white: #FFFFFF; --gold: #D97706; --gold-lt: #FEF3C7; --gold-dk: #92400E; --red: #DC2626; --red-lt: #FEE2E2; --red-dk: #991B1B; --r-xl: 20px; --r-lg: 16px; --r-md: 12px; --r-sm: 8px; --r-pill: 999px; --r-xs: 4px; --shadow-card: 0 1px 3px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.04); --shadow-sheet: 0 -4px 24px rgba(0,0,0,.12); font-family: 'Outfit', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; } :root[data-theme="auto"] { color-scheme: light dark; } @media (prefers-color-scheme: dark) { :root[data-theme="auto"] { --forest: #166534; --green: #22C55E; --green-lt: #052E16; --green-dk: #4ADE80; --ink: #F9FAFB; --sub: #E5E7EB; --muted: #9CA3AF; --border: #374151; --surface: #1F2937; --surface-alt: #374151; --page: #111827; --white: #1F2937; --gold: #FBBF24; --gold-lt: #1C1500; --gold-dk: #FCD34D; --red: #F87171; --red-lt: #1C0000; --red-dk: #FCA5A5; --shadow-card: 0 1px 3px rgba(0,0,0,.3), 0 0 0 1px rgba(255,255,255,.04); --shadow-sheet: 0 -4px 24px rgba(0,0,0,.4); } }