@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
        body {
            font-family: 'Inter', sans-serif;
            background-color: #0f172a;
            color: #f8fafc;
            scroll-behavior: smooth;
        }
        section[id], [id="faq"] {
            scroll-margin-top: 80px;
        }
        .glass-card {
            background: rgba(30, 41, 59, 0.7);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.08);
        }
        .gradient-text {
            background: linear-gradient(135deg, #38bdf8, #818cf8);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        .hero-glow {
            background: radial-gradient(ellipse 80% 50% at 50% -20%, rgba(56,189,248,0.15), transparent);
        }
        pre {
            background-color: #0d1526;
            padding: 1.25rem;
            border-radius: 0.75rem;
            overflow-x: auto;
            border: 1px solid #1e2d4a;
        }
        code {
            font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
            color: #e2e8f0;
            font-size: 0.82em;
        }
        .code-comment { color: #546e8a; }
        .code-keyword { color: #c084fc; }
        .code-string  { color: #86efac; }
        .code-type    { color: #fcd34d; }
        .code-func    { color: #67e8f9; }
        .badge-live {
            animation: pulse-ring 2s cubic-bezier(0.455,0.03,0.515,0.955) infinite;
        }
        @keyframes pulse-ring {
            0%   { box-shadow: 0 0 0 0 rgba(56,189,248,0.4); }
            70%  { box-shadow: 0 0 0 8px rgba(56,189,248,0); }
            100% { box-shadow: 0 0 0 0 rgba(56,189,248,0); }
        }
        /* Mobile menu */
        #mobileMenu { transition: max-height 0.3s ease, opacity 0.3s ease; }
        .feature-card:hover { transform: translateY(-4px); transition: transform 0.25s ease; }
        .nav-link { position: relative; }
        .nav-link::after {
            content: '';
            position: absolute;
            bottom: -2px; left: 0;
            width: 0; height: 2px;
            background: #38bdf8;
            transition: width 0.2s ease;
        }
        .nav-link:hover::after { width: 100%; }
        .nav-link.is-active {
            color: #38bdf8;
        }
        .nav-link.is-active::after {
            width: 100%;
        }
        .comparison-card,
        .license-mode-card {
            display: flex;
            flex-direction: column;
            height: 100%;
        }
        .comparison-code,
        .license-use-case {
            margin-top: auto;
        }
        .license-feature-list {
            flex: 1 1 auto;
        }
        .pricing-tier-card {
            min-height: 100%;
        }
        .pricing-tier-card .tier-card-price {
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
        }
        .tier-card-toprail {
            display: flex;
            align-items: flex-start;
            height: 36px;
        }
        .tier-card-title {
            min-height: 63px;
        }
        .tier-card-decision {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .pricing-plan-selector {
            display: grid;
            gap: 10px;
        }
        .pricing-plan-option {
            width: 100%;
            min-height: 92px;
            border: 1px solid rgba(148, 163, 184, 0.22);
            border-radius: 12px;
            padding: 12px;
            background: rgba(15, 23, 42, 0.62);
            color: #cbd5e1;
            text-align: left;
            transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
        }
        .pricing-plan-option:hover {
            border-color: rgba(56, 189, 248, 0.45);
            background: rgba(15, 23, 42, 0.86);
            transform: translateY(-1px);
        }
        .pricing-plan-option.is-selected {
            border-color: rgba(56, 189, 248, 0.75);
            background: rgba(14, 165, 233, 0.12);
            box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.16) inset;
        }
        .pricing-plan-option.is-recommended:not(.is-selected) {
            border-color: rgba(16, 185, 129, 0.42);
            background: rgba(16, 185, 129, 0.08);
        }
        .pricing-plan-option strong {
            display: block;
            margin: 7px 0 5px;
            color: #fff;
            font-size: 1rem;
            line-height: 1.2;
        }
        .pricing-plan-option small {
            display: block;
            color: #94a3b8;
            font-size: 0.73rem;
            line-height: 1.45;
        }
        .tier-price-subline {
            margin: -2px 0 8px;
            color: #7dd3fc;
            font-size: 0.82rem;
            font-weight: 800;
            line-height: 1.25;
        }
        .tier-price-subline strong {
            color: #ffffff;
            font-size: 1rem;
            font-weight: 900;
        }
        .plan-option-top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            color: #e2e8f0;
            font-size: 0.78rem;
            font-weight: 800;
        }
        .plan-save {
            flex-shrink: 0;
            border-radius: 999px;
            background: rgba(16, 185, 129, 0.15);
            color: #6ee7b7;
            border: 1px solid rgba(16, 185, 129, 0.32);
            padding: 2px 8px;
            font-size: 0.65rem;
            font-weight: 900;
            white-space: nowrap;
        }
        .billing-toggle {
            display: inline-flex;
            align-items: center;
            gap: 2px;
            min-height: 34px;
            border-radius: 999px;
            background: rgba(2, 6, 23, 0.72);
            border: 1px solid rgba(148, 163, 184, 0.18);
            padding: 3px;
            box-shadow: 0 10px 22px rgba(2, 6, 23, 0.24);
        }
        .billing-toggle-option {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
            min-height: 28px;
            border-radius: 999px;
            padding: 0 10px;
            color: #cbd5e1;
            font-size: 0.72rem;
            font-weight: 800;
            line-height: 1;
            white-space: nowrap;
            transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
        }
        .billing-toggle-option:hover {
            color: #fff;
        }
        .billing-toggle-option.is-selected {
            background: #f8fafc;
            color: #0f172a;
            box-shadow: 0 6px 14px rgba(15, 23, 42, 0.22);
        }
        .billing-save {
            color: #38bdf8;
            font-size: 0.68rem;
            font-weight: 900;
        }
        .billing-toggle-option.is-selected .billing-save {
            color: #0369a1;
        }
        @media (min-width: 1024px) {
            .pricing-tier-card .tier-card-header {
                min-height: 149px;
            }
            .pricing-tier-card .tier-card-price {
                min-height: 116px;
            }
            .pricing-tier-card .tier-card-decision {
                min-height: 112px;
            }
            .pricing-tier-card .tier-card-summary {
                min-height: 126px;
            }
            .pricing-tier-card .tier-card-highlight {
                min-height: 127px;
            }
        }
        @media (max-width: 420px) {
            .billing-toggle {
                width: 100%;
                margin-top: 8px;
            }
            .billing-toggle-option {
                flex: 1 1 0;
            }
        }