/* ========================================================================== tokens.css — single source of truth for color, type, space, radius, motion. No component file may introduce hex values; everything references these vars. ========================================================================== */ :root { /* Surfaces */ --bg-0: #0B0B10; --bg-1: #14141C; /* Glass material */ --glass-tint: rgba(255, 255, 255, 0.06); --glass-border: rgba(255, 255, 255, 0.14); --glass-highlight: rgba(255, 255, 255, 0.18); --glass-shadow: rgba(0, 0, 0, 0.6); /* Accents */ --accent: #7CFFB2; /* mint, used sparingly */ --accent-2: #FF7AC6; /* magenta, secondary speck */ /* Text */ --text-hi: #F5F5F7; --text-lo: #A1A1AA; --text-on-accent: #0B0B10; /* Spacing scale — 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 */ --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; /* Radius */ --r-card: 20px; --r-button: 999px; --r-image: 12px; --r-tag: 6px; /* Motion */ --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1); --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); --t-out: 200ms; --t-in: 400ms; /* Layout */ --max-w: 1280px; --gutter: clamp(20px, 4vw, 48px); --nav-h: 64px; /* Type stacks — Instrument Serif / Inter / JetBrains Mono are the locked identities (English + numerics). CJK fallbacks are added so Chinese renders with the platform's native serif / sans, not a stripped fallback. Falls through gracefully on every OS. */ --font-display: "Instrument Serif", "Noto Serif SC", "Songti SC", "STSong", SimSun, serif; --font-ui: "Inter", "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, -apple-system, sans-serif; --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, "PingFang SC", monospace; } /* Light theme — opt-in via [data-theme="light"] on . Dark is the default; the footer toggle flips this. */ [data-theme="light"] { --bg-0: #FAFAF7; --bg-1: #F0EFEB; --glass-tint: rgba(255, 255, 255, 0.6); --glass-border: rgba(0, 0, 0, 0.08); --glass-highlight: rgba(255, 255, 255, 0.9); --glass-shadow: rgba(0, 0, 0, 0.08); --text-hi: #0B0B10; --text-lo: #5A5A65; }