html, body { color-scheme: light; background-color: #F9F8F4; color: #3D3529; }
    @media (prefers-color-scheme: dark) {
        html, body { color-scheme: dark; background-color: #141413; color: #F9F8F4; }
    }

    :root {
        --bg: #F9F8F4;
        --bg-card: #F9F8F4;
        --bg-warm: #F6F0E8;
        --text: rgba(26,26,26,1);
        --text-mid: rgba(26,26,26,0.7);
        --text-light: rgba(26,26,26,0.5);
        --accent: #C8734A;
        --accent-soft: #F2DDD1;
        --accent-hover: #B5623B;
        --border: #E8DFD3;
        --border-light: #F0EAE0;
        --warn: #C45B4A;
        --warn-soft: #FCEAE7;
        --glass-shadow: 0 8px 32px rgba(61,53,41,0.08), 0 1px 2px rgba(61,53,41,0.04), inset 0 1px 0 rgba(255,255,255,0.8);
        --glass-shadow-hover: 0 12px 40px rgba(61,53,41,0.12), 0 2px 4px rgba(61,53,41,0.06), inset 0 1px 0 rgba(255,255,255,0.9);
    }
    * { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
    html { overflow-x: hidden; }
    body { font-family: 'Onest', -apple-system, BlinkMacSystemFont, sans-serif; background: var(--bg); color: var(--text); line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }

    /* ── Top Bar ── */

    /* ── Dark Theme: Global ── */
    body.dark { background: #141413 !important; color: #F9F8F4 !important; }
    html.dark { background-color: #141413 !important; color-scheme: dark !important; }

    ::-webkit-scrollbar { width: 0; }

    /* Anti-FOUC: shell.js adds this class after injecting shared components */
    body.shell-ready { opacity: 1 !important; transition: opacity 0.15s ease; }