:root {
            --bg:#ffffff; --bg-alt:#f8fafc; --surface:#ffffff; --surface-2:#f1f5f9;
            --border:#e2e8f0; --border-strong:#cbd5e1;
            --text:#0f172a; --text-muted:#475569; --text-subtle:#64748b;
            --accent:#4f46e5; --accent-hover:#4338ca; --accent-soft:#eef2ff; --accent-2:#9333ea;
            --warning-soft:#fef3c7; --warning:#d97706;
            --danger-soft:#fee2e2; --danger:#dc2626;
            --shadow-sm:0 1px 2px rgba(15,23,42,.04);
            --shadow:0 4px 12px rgba(15,23,42,.06),0 1px 3px rgba(15,23,42,.04);
            --gradient:linear-gradient(135deg,#4f46e5 0%,#9333ea 100%);
            --radius:14px;
            --radius-sm:10px;
            --font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
            --font-display:'Space Grotesk','Inter',sans-serif;
            --transition:0.2s cubic-bezier(.4,0,.2,1);
        }
        [data-theme="dark"] {
            --bg:#0b1020; --bg-alt:#0f172a; --surface:#111827; --surface-2:#1e293b;
            --border:#1f2937; --border-strong:#334155;
            --text:#f8fafc; --text-muted:#cbd5e1; --text-subtle:#94a3b8;
            --accent:#818cf8; --accent-hover:#a5b4fc; --accent-soft:rgba(129,140,248,.12); --accent-2:#c084fc;
            --warning-soft:rgba(217,119,6,.15); --warning:#fbbf24;
            --danger-soft:rgba(220,38,38,.15); --danger:#f87171;
            --shadow-sm:0 1px 2px rgba(0,0,0,.3);
            --shadow:0 4px 12px rgba(0,0,0,.35),0 1px 3px rgba(0,0,0,.2);
            --gradient:linear-gradient(135deg,#818cf8 0%,#c084fc 100%);
        }
        * { margin:0; padding:0; box-sizing:border-box; }
        html { scroll-behavior:smooth; }
        body {
            font-family:var(--font);
            background:var(--bg);
            color:var(--text);
            line-height:1.7;
            -webkit-font-smoothing:antialiased;
            transition:background-color var(--transition),color var(--transition);
        }
        a { color:var(--accent); text-decoration:none; }
        a:hover { color:var(--accent-hover); text-decoration:underline; }

        .navbar {
            position:sticky; top:0; z-index:100;
            background:color-mix(in srgb,var(--bg) 88%,transparent);
            -webkit-backdrop-filter:saturate(180%) blur(14px);
            backdrop-filter:saturate(180%) blur(14px);
            border-bottom:1px solid var(--border);
        }
        .nav-inner {
            max-width:1100px; margin:0 auto;
            padding:0.85rem 1.5rem;
            display:flex; justify-content:space-between; align-items:center;
            gap:1rem;
        }
        .logo {
            display:flex; align-items:center; gap:0.6rem;
            font-weight:700; font-family:var(--font-display);
            color:var(--text); text-decoration:none;
        }
        .logo:hover { text-decoration:none; }
        .logo-mark {
            width:34px; height:34px; border-radius:9px;
            background:var(--gradient); color:#fff;
            display:grid; place-items:center; font-size:1rem;
            box-shadow:var(--shadow);
        }
        .nav-actions { display:flex; align-items:center; gap:0.5rem; }
        .icon-btn {
            width:38px; height:38px; border-radius:9px;
            border:1px solid var(--border); background:var(--surface);
            color:var(--text-muted); cursor:pointer;
            display:grid; place-items:center;
            transition:all var(--transition);
        }
        .icon-btn:hover { color:var(--text); background:var(--surface-2); border-color:var(--border-strong); }
        .icon-btn svg { width:18px; height:18px; }
        .theme-toggle .sun { display:none; }
        .theme-toggle .moon { display:block; }
        [data-theme="dark"] .theme-toggle .sun { display:block; }
        [data-theme="dark"] .theme-toggle .moon { display:none; }
        .back-link {
            color:var(--text-muted);
            font-size:0.92rem;
            font-weight:500;
            text-decoration:none;
            display:inline-flex; align-items:center; gap:0.4rem;
        }
        .back-link:hover { color:var(--text); text-decoration:none; }

        .page-hero {
            text-align:center;
            padding:4rem 1.5rem 2.5rem;
            background:radial-gradient(ellipse 60% 50% at 50% 0%,var(--accent-soft) 0%,transparent 70%);
        }
        .page-hero h1 {
            font-family:var(--font-display);
            font-size:clamp(2rem,4vw,2.75rem);
            line-height:1.15;
            letter-spacing:-0.02em;
            margin-bottom:0.75rem;
        }
        .page-hero .meta {
            color:var(--text-subtle);
            font-size:0.9rem;
        }

        main {
            max-width:780px;
            margin:0 auto;
            padding:2rem 1.5rem 4rem;
        }
        .section {
            margin-bottom:2.5rem;
        }
        .section h2 {
            font-family:var(--font-display);
            font-size:1.4rem;
            margin-bottom:0.85rem;
            color:var(--text);
            letter-spacing:-0.01em;
        }
        .section h3 {
            font-family:var(--font-display);
            font-size:1.08rem;
            margin:1.25rem 0 0.55rem;
            color:var(--text);
        }
        .section p {
            color:var(--text-muted);
            margin-bottom:0.85rem;
        }
        .section ul {
            color:var(--text-muted);
            padding-left:1.5rem;
            margin-bottom:0.85rem;
        }
        .section ul li { margin-bottom:0.4rem; }
        .section ul li strong { color:var(--text); }

        .callout {
            background:var(--accent-soft);
            border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);
            border-left:4px solid var(--accent);
            border-radius:var(--radius);
            padding:1.1rem 1.25rem;
            margin:1.25rem 0;
        }
        .callout p { color:var(--text); margin:0; }

        .footer {
            border-top:1px solid var(--border);
            background:var(--bg-alt);
            padding:2rem 1.5rem;
            text-align:center;
            color:var(--text-subtle);
            font-size:0.9rem;
        }
        .footer-links {
            display:flex; gap:1.5rem;
            justify-content:center;
            margin-top:0.75rem;
            flex-wrap:wrap;
        }
        .footer-links a {
            color:var(--text-muted);
            text-decoration:none;
            font-weight:500;
        }
        .footer-links a:hover { color:var(--accent); text-decoration:none; }

        @media (max-width:560px) {
            .page-hero h1 { font-size:1.75rem; }
            .section h2 { font-size:1.2rem; }
        }

        /* ---------- Ad slots ---------- */
        .ad-slot {
            display:flex;
            align-items:center;
            justify-content:center;
            margin:0 auto;
        }
        .ad-banner {
            max-width:760px;
            padding:8px;
            margin:1rem auto 2rem;
        }

        /* ---------- terms.html extras ---------- */
        main { max-width:820px; margin:0 auto; padding:2rem 1.5rem 4rem; }
        .acceptance {
            padding:1.25rem 1.5rem;
            margin-bottom:1.5rem;
            background:var(--accent-soft);
            border:1px solid color-mix(in srgb,var(--accent) 25%,transparent);
            border-left:4px solid var(--accent);
            border-radius:var(--radius);
        }
        .acceptance p { color:var(--text); }
        .intro { color:var(--text-muted); margin-bottom:2rem; }
        .toc {
            background:var(--surface);
            border:1px solid var(--border);
            border-radius:var(--radius);
            padding:1.5rem;
            margin-bottom:2.5rem;
        }
        .toc h3 {
            font-size:0.78rem;
            text-transform:uppercase;
            letter-spacing:0.08em;
            margin-bottom:1rem;
            font-weight:600;
            color:var(--text-muted);
        }
        .toc ol {
            columns:2;
            column-gap:1.5rem;
            padding-left:1.25rem;
        }
        .toc ol li { margin-bottom:0.4rem; break-inside:avoid; }
        .toc ol li a { color:var(--text-muted); font-size:0.93rem; text-decoration:none; }
        .toc ol li a:hover { color:var(--accent); }
        @media (max-width:640px) { .toc ol { columns:1; } }
        .section { margin-bottom:2.5rem; scroll-margin-top:80px; }
        .section h2 { display:flex; align-items:center; gap:0.75rem; }
        .section .num {
            display:inline-grid;
            place-items:center;
            width:28px;
            height:28px;
            border-radius:8px;
            background:var(--gradient);
            color:#fff;
            font-size:0.85rem;
            font-weight:700;
            flex-shrink:0;
        }
        .section p { color:var(--text-muted); margin-bottom:0.85rem; }
        .section ul, .section ol { color:var(--text-muted); padding-left:1.5rem; margin-bottom:0.85rem; }
        .section li { margin-bottom:0.4rem; }
        .section li strong { color:var(--text); }
        .callout.warning { background:var(--warning-soft); border-left-color:var(--warning); }
        .callout.danger  { background:var(--danger-soft);  border-left-color:var(--danger);  }