/* ============================================================
       THEME SYSTEM — SERAPHIM ENGINE v2.5.1b
       Two themes controlled via body class:
         (none / default) = Dreaming Flowers
         body.theme-prestige = Seraphim Prestige
       ============================================================ */

    /* --- DREAMING FLOWERS (Default) --- */
    :root {
        /* ====================================================
           DREAMING FLOWERS v3 — Pinterest Light Mode
           Cream/parchment base, warm rose + sage accents,
           soft card shadows, bright airy feel.
           ==================================================== */

        /* Page canvas */
        --th-bg:              #faf5f0;          /* warm parchment page */
        --th-bg-body-border:  #e8c8d8;          /* dusty rose double border */

        /* Surface layers (light) */
        --th-surface:         #ffffff;          /* pure white card */
        --th-surface-dark:    #f2ebe4;          /* slightly deeper cream */
        --th-surface-mid:     rgba(255,248,244,0.98);

        /* Glass panels — white card with soft rose rim */
        --th-glass-bg:        rgba(255, 252, 250, 0.96);
        --th-glass-border:    rgba(210, 155, 180, 0.35);

        /* Core accent palette */
        --th-accent:          #d4688a;          /* deep rose — primary */
        --th-accent-alt:      #4aab87;          /* sage green — secondary */
        --th-accent-teal:     #3ab5a4;          /* teal */
        --th-accent-blue:     #6aaed6;          /* dusty blue */
        --th-accent-lavender: #9b7ec8;          /* soft violet */
        --th-accent-peach:    #e8956a;          /* warm coral */

        /* Oracle Codex / Scouter glyph colors */
--glyph-primary-vessel: #3b82f6;      /* blue */
--glyph-tier-legendary: #f59e0b;      /* gold */
--glyph-secondary-signal: #f59e0b;    /* gold */

/* Rarity Matrix canonical colors */
--glyph-common: #8a8f98;              /* Common / grey */
--glyph-rare: #3b82f6;                /* Rare / blue */
--glyph-legendary: #f59e0b;           /* Legendary / golden */
--glyph-mythic: #10b981;              /* Mythic / green */

        /* Semantic aliases */
        --th-gold:            #d4688a;          /* rose replaces gold */
        --th-emerald:         #4aab87;          /* sage replaces emerald */
        --th-red:             #c0504a;          /* warm red for errors */

        /* Text — dark on light */
        --th-text-primary:    #5a2d42;          /* deep rose-brown heading */
        --th-text-secondary:  #2e6b54;          /* deep sage body */
        --th-text-muted:      rgba(120, 80, 100, 0.55);

        /* Scanline */
        --th-scanline:        linear-gradient(to right, transparent, #d4688a, transparent);

        /* Tabs */
        --th-tab-active-border: #d4688a;
        --th-tab-active-bg:   rgba(212,104,138,0.10);

        /* Output / terminal — light cream */
        --th-output-border:   #4aab87;
        --th-output-bg:       #f8f4f0;

        /* Vessel bay */
        --th-vessel-border:   #4aab87;
        --th-vessel-bg:       #f8fff8;
        --th-vessel-color:    #2e6b54;

        /* Progress */
        --th-progress-bar:    #d4688a;
        --th-terminal-sanctified: #d4688a;

        /* Nav — white with soft shadow */
        --th-nav-bg:          rgba(255, 252, 250, 0.98);

        /* Panels */
        --th-triptych-bg:     rgba(255, 252, 250, 0.98);
        --th-onboarding-bg:   rgba(255, 250, 247, 0.96);
        --th-onboarding-border: rgba(210,155,180,0.30);
        --th-onboarding-num-bg: rgba(212,104,138,0.10);
        --th-onboarding-num-border: rgba(212,104,138,0.35);
        --th-onboarding-num-color: #d4688a;

        /* Intention button */
        --th-intention-border: rgba(212,104,138,0.50);
        --th-intention-bg:    rgba(212,104,138,0.07);
        --th-intention-locked-bg: #d4688a;
        --th-intention-locked-color: #ffffff;
        --th-intention-locked-border: #d4688a;
        --th-intention-locked-shadow: rgba(212,104,138,0.40);

        /* Animations */
        --th-grail-shimmer-a: #d4688a;
        --th-grail-shimmer-b: #ffffff;
        --th-grail-shimmer-shadow: rgba(212,104,138,0.50);
        --th-architect-glow-a: rgba(212,104,138,0.04);
        --th-architect-glow-b: rgba(212,104,138,0.25);

        /* Scrollbar */
        --th-scrollbar-thumb: #d4a8bc;
        --th-scrollbar-track: #f0e8ec;

        /* Border radius tokens */
        --th-radius-sm:   8px;
        --th-radius-md:   14px;
        --th-radius-lg:   20px;
        --th-radius-xl:   28px;
        --th-radius-pill: 999px;
    }

    /* --- SERAPHIM PRESTIGE (Classic Black/Gold/Emerald) --- */
    body.theme-prestige {
        /* Restore black surface tokens for Prestige */
        --th-surface-panel:   rgba(5, 5, 5, 0.96);
        --th-surface-input:   #000;
        --th-surface-overlay: rgba(0, 0, 0, 0.60);
        --th-surface-deep:    rgba(0, 0, 0, 0.99);
        --th-surface-card:    #09090b;           /* zinc-950 */
        --th-surface-subtle:  rgba(24, 24, 27, 0.50); /* zinc-900/50 */
        --th-surface-mid2:    rgba(24, 24, 27, 0.70);
        --th-border-subtle:   rgba(63, 63, 70, 0.80);  /* zinc-700/800 */
        --th-bg:              #000;
        --th-bg-body-border:  #18181b;          /* zinc-950 */
        --th-surface:         #050505;
        --th-surface-dark:    #010101;
        --th-surface-mid:     rgba(5,5,5,0.94);
        --th-glass-bg:        rgba(5, 5, 5, 0.94);
        --th-glass-border:    rgba(251, 191, 36, 0.2);
        /* Oracle Codex / Scouter glyph colors — Prestige */
--glyph-primary-vessel: #3b82f6;
--glyph-tier-legendary: #fbbf24;
--glyph-secondary-signal: #fbbf24;

/* Rarity Matrix canonical colors */
--glyph-common: #9ca3af;              /* Common / grey */
--glyph-rare: #38bdf8;                /* Rare / blue */
--glyph-legendary: #fbbf24;           /* Legendary / golden */
--glyph-mythic: #10b981;              /* Mythic / green */
        --th-accent:          #fbbf24;          /* gold */
        --th-accent-alt:      #10b981;          /* emerald */
        --th-accent-teal:     #10b981;
        --th-accent-blue:     #3b82f6;
        --th-gold:            #fbbf24;
        --th-emerald:         #10b981;
        --th-red:             #ef4444;
        --th-text-primary:    #fbbf24;
        --th-text-secondary:  #10b981;
        --th-text-muted:      rgba(255,255,255,0.45);
        --th-scanline:        linear-gradient(to right, transparent, #fbbf24, transparent);
        --th-tab-active-border: #fbbf24;
        --th-tab-active-bg:   rgba(251,191,36,0.2);
        --th-output-border:   #fbbf24;
        --th-output-bg:       #010101;
        --th-vessel-border:   #10b981;
        --th-vessel-bg:       rgba(0,0,0,0.99);
        --th-vessel-color:    #10b981;
        --th-progress-bar:    #fbbf24;
        --th-terminal-sanctified: #fbbf24;
        --th-nav-bg:          rgba(0,0,0,0.95);
        --th-triptych-bg:     rgba(8,8,8,0.98);
        --th-onboarding-bg:   rgba(5,5,5,0.82);
        --th-onboarding-border: rgba(251,191,36,0.16);
        --th-onboarding-num-bg: rgba(251,191,36,0.12);
        --th-onboarding-num-border: rgba(251,191,36,0.35);
        --th-onboarding-num-color: #fbbf24;
        --th-intention-border: rgba(251,191,36,0.4);
        --th-intention-bg:    rgba(251,191,36,0.1);
        --th-intention-locked-bg: #fbbf24;
        --th-intention-locked-color: #000;
        --th-intention-locked-border: #fbbf24;
        --th-intention-locked-shadow: rgba(251,191,36,0.55);
        --th-grail-shimmer-a: #fbbf24;
        --th-grail-shimmer-b: #fff;
        --th-grail-shimmer-shadow: rgba(251,191,36,0.6);
        --th-architect-glow-a: rgba(251,191,36,0.05);
        --th-architect-glow-b: rgba(251,191,36,0.4);
        --th-scrollbar-thumb: #fbbf24;
        --th-scrollbar-track: #000;
    }

    /* ============================================================
       THEME TOGGLE BUTTON
       ============================================================ */
    #theme-toggle-btn {
        position: fixed;
        bottom: 28px;
        right: 28px;
        z-index: 9999;
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px 18px;
        font-family: 'Space Grotesk', sans-serif;
        font-size: 10px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.35em;
        cursor: pointer;
        border: 1.5px solid var(--th-accent);
        background: var(--th-glass-bg);
        color: var(--th-accent);
        box-shadow: 0 4px 24px rgba(0,0,0,0.55);
        transition: background 0.3s, color 0.3s, border-color 0.3s, box-shadow 0.3s;
        white-space: nowrap;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }
    #theme-toggle-btn:hover {
        background: var(--th-accent);
        color: var(--th-bg);
        box-shadow: 0 0 32px color-mix(in srgb, var(--th-accent) 50%, transparent);
    }
    #theme-toggle-btn .theme-icon {
        font-size: 14px;
        line-height: 1;
        display: inline-block;
        transition: transform 0.4s;
    }
    #theme-toggle-btn:hover .theme-icon {
        transform: rotate(20deg) scale(1.2);
    }
    @media (max-width: 768px) {
        #theme-toggle-btn {
            bottom: 16px;
            right: 16px;
            padding: 9px 14px;
            font-size: 9px;
            letter-spacing: 0.2em;
            max-width: calc(100vw - 32px);
        }
    }
    @media (max-width: 480px) {
        #theme-toggle-btn {
            bottom: 12px;
            right: 12px;
            padding: 8px 11px;
            font-size: 8px;
            letter-spacing: 0.12em;
            max-width: calc(100vw - 24px);
        }
        #theme-toggle-btn .theme-icon {
            font-size: 11px;
        }
    }