/* Design Tokens — colors, spacing, fonts */

        /* ================================================
           REFINED DIGITAL INK — DESIGN TOKENS
           ================================================ */
        :root {
            --bg-base: #0E1019;
            --bg-surface: #151A28;
            --bg-elevated: #1C2338;
            --bg-hover: #252E48;
            --bg-secondary: #192030;
            --border-subtle: rgba(255, 255, 255, 0.06);
            --border-default: rgba(255, 255, 255, 0.12);
            --border-light: rgba(255, 255, 255, 0.08);
            --text-primary: #EAEDF6;
            --text-secondary: #9BA3BF;
            --text-tertiary: #5E6785;
            --accent: #6C7AE0;
            --accent-hover: #8490E8;
            --accent-muted: rgba(108, 122, 224, 0.12);
            --gold: #D4A853;
            --gold-muted: rgba(212, 168, 83, 0.10);
            --green: #34B85A;
            --green-muted: rgba(52, 184, 90, 0.10);
            --red: #F06060;
            --red-muted: rgba(240, 96, 96, 0.10);
            --yellow: #F0A030;
            --yellow-muted: rgba(240, 160, 48, 0.10);
            --orange: #E87040;
            --orange-muted: rgba(232, 112, 64, 0.10);
            --radius-sm: 8px;
            --radius-md: 12px;
            --radius-lg: 16px;
            --transition-fast: 0.18s cubic-bezier(0.4, 0, 0.2, 1);
            --transition-base: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
            --font-sans: 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
            --font-display: 'DM Serif Display', 'Noto Serif SC', Georgia, serif;
            --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
            --shadow-md: 0 4px 16px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.2);
            --shadow-lg: 0 12px 40px rgba(0,0,0,0.4), 0 4px 12px rgba(0,0,0,0.2);
            --shadow-glow: 0 0 30px rgba(108, 122, 224, 0.15);
        }

        /* ================================================
           LIGHT THEME — 柔和浅蓝灰主题
           ================================================ */
        body.theme-light {
            --bg-base: #F2F5FA;
            --bg-surface: #F8FAFF;
            --bg-elevated: #EBF0F8;
            --bg-hover: #E2E8F2;
            --bg-secondary: #EFF3FA;
            --border-subtle: rgba(0, 0, 0, 0.06);
            --border-default: rgba(0, 0, 0, 0.12);
            --border-light: rgba(0, 0, 0, 0.08);
            --text-primary: #1A1A2E;
            --text-secondary: #4A4A5A;
            --text-tertiary: #8A8A96;
            --accent: #5560C8;
            --accent-hover: #4450B0;
            --accent-muted: rgba(85, 96, 200, 0.08);
            --gold: #B8860B;
            --gold-muted: rgba(184, 134, 11, 0.06);
            --green: #22804A;
            --green-muted: rgba(34, 128, 74, 0.06);
            --red: #D04040;
            --red-muted: rgba(208, 64, 64, 0.06);
            --yellow: #C87020;
            --yellow-muted: rgba(200, 112, 32, 0.06);
            --orange: #D05020;
            --orange-muted: rgba(208, 80, 32, 0.06);
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
            --shadow-md: 0 4px 16px rgba(0,0,0,0.06), 0 2px 4px rgba(0,0,0,0.04);
            --shadow-lg: 0 12px 40px rgba(0,0,0,0.08), 0 4px 12px rgba(0,0,0,0.04);
            --shadow-glow: 0 0 30px rgba(85, 96, 200, 0.08);
        }