/* ============================================================ themes.css — design tokens. Swapping the [data-theme] value on re-skins the whole game. Only "galaxy" is fully built out in this release; the variable contract is what future themes (candy, ocean, ice...) would populate. ============================================================ */ :root, [data-theme="galaxy"] { /* fonts */ --font-display: 'Space Grotesk', 'Segoe UI', sans-serif; --font-ui: 'Space Grotesk', 'Segoe UI', sans-serif; --font-body: 'Inter', 'Segoe UI', Tahoma, sans-serif; /* backdrop */ --bg-void: #05010f; --bg-mid: #140a33; --nebula-1: rgba(120, 60, 220, 0.55); --nebula-2: rgba(30, 140, 200, 0.35); --nebula-3: rgba(220, 60, 160, 0.28); /* accents */ --accent-pink: #ff6ec4; --accent-violet: #8b7cf6; --accent-cyan: #22e5ee; --accent-gold: #ffd166; --accent-green: #4ade80; --accent-red: #ff5470; /* text */ --text-primary: #f4f2ff; --text-dim: rgba(244, 242, 255, 0.55); --text-faint: rgba(244, 242, 255, 0.32); /* glass surfaces */ --glass-bg: rgba(255, 255, 255, 0.06); --glass-bg-strong: rgba(20, 12, 45, 0.72); --glass-border: rgba(255, 255, 255, 0.14); --glass-blur: 14px; /* bubble palette (order matters: index -> color id) */ --bubble-0: #ff4d6d; --bubble-1: #4ade80; --bubble-2: #3b82f6; --bubble-3: #ffd166; --bubble-4: #ff9f45; --bubble-5: #b370ff; --bubble-6: #22e5ee; --danger: #ff4d6d; --shadow-glow: 0 0 40px rgba(120, 90, 255, 0.35); }