        /* ── Light Mode Overrides ────────────────────────── */
        html[data-theme="light"] body {
            background: #f8f9fc;
            color: #374151;
        }
        html[data-theme="light"] a { color: #4f6edc; }
        html[data-theme="light"] a:hover { color: #3b54b8; }

        /* Nav */
        html[data-theme="light"] nav {
            background: rgba(248, 249, 252, 0.85);
            border-bottom-color: rgba(0,0,0,0.08);
        }
        html[data-theme="light"] .nav-brand { color: #1a1f2e; }
        html[data-theme="light"] .nav-links a { color: #6b7280; }
        html[data-theme="light"] .nav-links a:hover { color: #1a1f2e; }
        html[data-theme="light"] .theme-toggle {
            border-color: rgba(0,0,0,0.12);
            color: #6b7280;
        }
        html[data-theme="light"] .theme-toggle:hover {
            color: #1a1f2e;
            border-color: rgba(0,0,0,0.25);
            background: rgba(0,0,0,0.04);
        }

        /* Section defaults */
        html[data-theme="light"] .section-label { color: #4f6edc; }
        html[data-theme="light"] .section-title { color: #1a1f2e; }
        html[data-theme="light"] .section-subtitle { color: #6b7280; }
        html[data-theme="light"] .glass {
            background: rgba(0, 0, 0, 0.02);
            border-color: rgba(0, 0, 0, 0.08);
        }

        /* Hero */
        html[data-theme="light"] .hero::before {
            background: radial-gradient(circle, rgba(107,138,253,0.08) 0%, transparent 70%);
        }
        html[data-theme="light"] .hero h1 { color: #1a1f2e; }
        html[data-theme="light"] .hero .tagline { color: #6b7280; }
        html[data-theme="light"] .hero .subtitle { color: #9ca3af; }
        html[data-theme="light"] .hero-icon {
            box-shadow: 0 8px 40px rgba(107,138,253,0.2);
        }
        html[data-theme="light"] .btn-primary {
            color: #fff;
            box-shadow: 0 4px 16px rgba(107,138,253,0.25);
        }
        html[data-theme="light"] .btn-secondary {
            color: #6b7280;
            border-color: rgba(0,0,0,0.15);
        }
        html[data-theme="light"] .btn-secondary:hover {
            border-color: rgba(0,0,0,0.3);
            color: #374151;
        }
        html[data-theme="light"] .testflight-badge {
            background: rgba(180,130,0,0.1);
            border-color: rgba(180,130,0,0.25);
            color: #92600a;
        }

        /* Race section panels — keep dark for terminal/app UI feel */
        html[data-theme="light"] .race-panel-left,
        html[data-theme="light"] .race-panel-right {
            box-shadow: 0 8px 40px rgba(0,0,0,0.15);
        }

        /* Comparison section */
        html[data-theme="light"] .comparison-section {
            background: linear-gradient(180deg, #f8f9fc 0%, #f0f2f7 100%);
        }
        html[data-theme="light"] .comp-comparison {
            border-color: rgba(0,0,0,0.1);
            box-shadow: 0 40px 100px rgba(0,0,0,0.1);
        }
        html[data-theme="light"] .comp-drag-hint { color: #9ca3af; }

        /* Comparison SteadyMount UI — light mode app colors */
        html[data-theme="light"] .comp-steady-ui {
            background: #e8e8ed;
        }
        html[data-theme="light"] .comp-fake-menubar {
            background: rgba(255, 255, 255, 0.92);
            border-color: rgba(0,0,0,0.12);
            box-shadow: 0 20px 60px rgba(0,0,0,0.12);
        }
        html[data-theme="light"] .comp-fake-header {
            border-bottom-color: rgba(0,0,0,0.08);
        }
        html[data-theme="light"] .comp-fake-header-text {
            color: #1a1a1e;
        }
        html[data-theme="light"] .comp-fake-header-version {
            color: #86868b;
        }
        html[data-theme="light"] .comp-server-row:hover {
            background: rgba(0,0,0,0.04);
        }
        html[data-theme="light"] .comp-server-dot.green {
            background: #30d158;
            box-shadow: 0 0 6px rgba(48, 209, 88, 0.4);
        }
        html[data-theme="light"] .comp-server-dot.blue {
            background: #0a84ff;
            box-shadow: 0 0 6px rgba(10, 132, 255, 0.4);
        }
        html[data-theme="light"] .comp-server-dot.amber {
            background: #ff9f0a;
            box-shadow: 0 0 6px rgba(255, 159, 10, 0.4);
        }
        html[data-theme="light"] .comp-server-name {
            color: #1a1a1e;
        }
        html[data-theme="light"] .comp-server-detail {
            color: #86868b;
        }
        html[data-theme="light"] .comp-badge-mounted {
            background: rgba(48, 209, 88, 0.12);
            color: #248a3d;
        }
        html[data-theme="light"] .comp-badge-syncing {
            background: rgba(10, 132, 255, 0.12);
            color: #0071e3;
        }
        html[data-theme="light"] .comp-badge-idle {
            background: rgba(255, 159, 10, 0.12);
            color: #b25000;
        }
        html[data-theme="light"] .comp-add-row {
            color: #86868b;
        }
        html[data-theme="light"] .comp-add-row:hover {
            color: #0a84ff;
        }
        html[data-theme="light"] .comp-divider-line {
            background: rgba(0,0,0,0.2);
        }
        html[data-theme="light"] .comp-divider-arrow.left {
            border-right-color: rgba(0,0,0,0.3);
        }
        html[data-theme="light"] .comp-divider-arrow.right {
            border-left-color: rgba(0,0,0,0.3);
        }
        html[data-theme="light"] .comp-divider-handle {
            background: rgba(255,255,255,0.9);
            border-color: rgba(0,0,0,0.15);
        }
        html[data-theme="light"] .comp-divider:hover .comp-divider-arrow.left,
        html[data-theme="light"] .comp-divider.dragging .comp-divider-arrow.left {
            border-right-color: rgba(59, 130, 246, 0.8);
        }
        html[data-theme="light"] .comp-divider:hover .comp-divider-arrow.right,
        html[data-theme="light"] .comp-divider.dragging .comp-divider-arrow.right {
            border-left-color: rgba(59, 130, 246, 0.8);
        }
        html[data-theme="light"] .comp-tagline-green {
            color: #248a3d;
        }
        html[data-theme="light"] .comp-tagline-dim {
            color: #86868b;
        }
        html[data-theme="light"] .comp-add-row {
            border-top-color: rgba(0,0,0,0.06);
        }
        html[data-theme="light"] .comp-label-before {
            background: rgba(220, 38, 38, 0.1);
            color: #dc2626;
            border-color: rgba(220, 38, 38, 0.2);
        }
        html[data-theme="light"] .comp-label-after {
            background: rgba(22, 163, 74, 0.1);
            color: #16a34a;
            border-color: rgba(22, 163, 74, 0.2);
        }

        /* Screenshots */
        html[data-theme="light"] .screenshots-section { background: #f0f2f7; }
        html[data-theme="light"] .screenshot-item img {
            box-shadow: 0 12px 50px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.08);
        }
        html[data-theme="light"] .screenshot-label { color: #9ca3af; }

        /* Features */
        html[data-theme="light"] .features {
            background: linear-gradient(180deg, #f0f2f7 0%, #f8f9fc 100%);
        }
        html[data-theme="light"] .fcard-card {
            background: rgba(255, 255, 255, 0.8);
            border-color: rgba(0, 0, 0, 0.07);
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        html[data-theme="light"] .fcard-card:hover {
            border-color: rgba(0, 0, 0, 0.12);
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.06), 0 0 40px var(--glow-color);
        }
        html[data-theme="light"] .fcard-icon {
            background: rgba(0,0,0,0.03);
            border-color: rgba(0,0,0,0.06);
        }
        html[data-theme="light"] .fcard-card:hover .fcard-icon {
            border-color: rgba(0,0,0,0.1);
            background: rgba(0,0,0,0.04);
        }
        html[data-theme="light"] .fcard-title { color: #1a1f2e; }
        html[data-theme="light"] .fcard-code {
            background: rgba(0,0,0,0.06);
        }
        html[data-theme="light"] .fcard-desc { color: #9ca3af; }
        html[data-theme="light"] .fcard-card:hover .fcard-desc { color: #6b7280; }

        /* How It Works */
        html[data-theme="light"] .how-it-works { background: #f8f9fc; }
        html[data-theme="light"] .step h3 { color: #1a1f2e; }
        html[data-theme="light"] .step p { color: #9ca3af; }

        /* Pricing */
        html[data-theme="light"] .pricing {
            background: linear-gradient(180deg, #f8f9fc 0%, #f0f2f7 100%);
        }
        html[data-theme="light"] .pricing-card {
            background: rgba(255, 255, 255, 0.8);
            border-color: rgba(0, 0, 0, 0.08);
        }
        html[data-theme="light"] .pricing-amount { color: #1a1f2e; }
        html[data-theme="light"] .pricing-detail { color: #9ca3af; }
        html[data-theme="light"] .pricing-list li {
            color: #6b7280;
            border-bottom-color: rgba(0,0,0,0.06);
        }
        html[data-theme="light"] .competitor-note {
            background: rgba(0,0,0,0.02);
            border-color: rgba(0,0,0,0.06);
            color: #9ca3af;
        }
        html[data-theme="light"] .competitor-note strong { color: #6b7280; }
        html[data-theme="light"] .pricing-col {
            border-color: rgba(0,0,0,0.08);
            background: rgba(0,0,0,0.02);
        }
        html[data-theme="light"] .pricing-col-included .pricing-col-title { color: #16a34a; }
        html[data-theme="light"] .pricing-col-future .pricing-col-title { color: #6b7280; }
        html[data-theme="light"] .pricing-col li {
            color: #6b7280;
            border-bottom-color: rgba(0,0,0,0.06);
        }
        html[data-theme="light"] .pricing-col-included li::before { color: #16a34a; }
        html[data-theme="light"] .pricing-col-future li::before { color: #9ca3af; }
        html[data-theme="light"] .pricing-col-note { color: #9ca3af; }

        /* Final CTA */
        html[data-theme="light"] .final-cta { background: #f0f2f7; }
        html[data-theme="light"] .final-cta::before {
            background: radial-gradient(circle, rgba(107,138,253,0.06) 0%, transparent 70%);
        }
        html[data-theme="light"] .final-cta h2 { color: #1a1f2e; }
        html[data-theme="light"] .final-cta p { color: #9ca3af; }

        /* Support */
        html[data-theme="light"] .support { background: #f8f9fc; }
        html[data-theme="light"] .support h2 { color: #1a1f2e; }
        html[data-theme="light"] .support p { color: #9ca3af; }

        /* Footer */
        html[data-theme="light"] footer {
            background: #e8ebf0;
            border-top-color: rgba(0,0,0,0.06);
            color: #9ca3af;
        }
        html[data-theme="light"] footer a { color: #6b7280; }
        html[data-theme="light"] footer a:hover { color: #374151; }

