:root {
    --subpage-paper: linear-gradient(180deg, rgba(251, 253, 255, 0.96), rgba(228, 239, 252, 0.86));
    --subpage-paper-strong: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(236, 245, 255, 0.9));
    --subpage-paper-soft: linear-gradient(180deg, rgba(246, 250, 255, 0.88), rgba(219, 232, 248, 0.74));
    --subpage-paper-border: rgba(180, 205, 238, 0.92);
    --subpage-paper-shadow:
        0 24px 60px rgba(3, 14, 32, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.96),
        0 0 0 1px rgba(255, 255, 255, 0.22);
    --subpage-surface-ink: #10203a;
    --subpage-surface-muted: #47627d;
    --subpage-link: #1d5fb7;
    --subpage-pill-bg: rgba(255, 255, 255, 0.82);
    --subpage-pill-border: rgba(162, 191, 228, 0.9);
    --subpage-pill-ink: #35506f;
}

main :is(
    .hero,
    .hero-panel,
    .meta-panel,
    .section-panel,
    .info-panel,
    .channel-card,
    .form-panel,
    .list-panel,
    .cta-panel,
    .panel,
    .card,
    .plan,
    .compare-card,
    .subscribe-dialog,
    .access-popup-card,
    .formula-card,
    .meta-card,
    .status-box,
    .glass-panel,
    .metric-card,
    .research-card,
    .insight-card,
    .team-member,
    .newsletter,
    .tile,
    .box,
    .result,
    .formula
) {
    background: var(--subpage-paper) !important;
    border: 1px solid var(--subpage-paper-border) !important;
    box-shadow: var(--subpage-paper-shadow) !important;
    color: var(--subpage-surface-ink);
    -webkit-backdrop-filter: blur(18px) saturate(122%);
    backdrop-filter: blur(18px) saturate(122%);
}

main :is(
    .hero,
    .hero-panel,
    .info-panel,
    .cta-panel,
    .formula-card,
    .meta-card,
    .section-panel
) {
    background:
        radial-gradient(circle at top right, rgba(118, 174, 248, 0.26), transparent 32%),
        radial-gradient(circle at bottom left, rgba(255, 255, 255, 0.48), transparent 40%),
        var(--subpage-paper-strong) !important;
}

main :is(
    .panel,
    .card,
    .plan,
    .compare-card,
    .status-box,
    .channel-card,
    .list-panel,
    .glass-panel,
    .metric-card,
    .newsletter,
    .tile,
    .box,
    .result,
    .formula
) {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(231, 241, 252, 0.84)) !important;
}

main :is(
    .hero,
    .hero-panel,
    .meta-panel,
    .section-panel,
    .info-panel,
    .channel-card,
    .form-panel,
    .list-panel,
    .cta-panel,
    .panel,
    .card,
    .plan,
    .compare-card,
    .subscribe-dialog,
    .access-popup-card,
    .formula-card,
    .meta-card,
    .status-box,
    .glass-panel,
    .metric-card,
    .research-card,
    .insight-card,
    .team-member,
    .newsletter,
    .tile,
    .box,
    .result,
    .formula
) :is(h1, h2, h3, h4, strong, .v, .status-value, .hero-title, .panel-title, .list-title, .plan-price, .value, .title) {
    color: var(--subpage-surface-ink) !important;
}

main :is(
    .hero,
    .hero-panel,
    .meta-panel,
    .section-panel,
    .info-panel,
    .channel-card,
    .form-panel,
    .list-panel,
    .cta-panel,
    .panel,
    .card,
    .plan,
    .compare-card,
    .subscribe-dialog,
    .access-popup-card,
    .formula-card,
    .meta-card,
    .status-box,
    .glass-panel,
    .metric-card,
    .research-card,
    .insight-card,
    .team-member,
    .newsletter,
    .tile,
    .box,
    .result,
    .formula
) :is(p, li, dd, dt, label, small, .lead, .muted, .meta, .note, .footnote, .source, .status-note, .k, .subtitle, .hero-copy, .panel-copy, .hero-meta, .read, .axis-label) {
    color: var(--subpage-surface-muted) !important;
}

main :is(
    .hero-kicker,
    .panel-kicker,
    .channel-kicker,
    .list-kicker,
    .pill,
    .eyebrow,
    .tag
) {
    background: var(--subpage-pill-bg) !important;
    border: 1px solid var(--subpage-pill-border) !important;
    color: var(--subpage-pill-ink) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

main :is(.status-label, .overline, .section-label) {
    color: var(--subpage-pill-ink) !important;
}

main :is(.hero, .hero-panel, .panel, .card, .plan, .compare-card, .form-panel, .cta-panel, .formula-card, .meta-card, .list-panel, .channel-card, .result, .formula) a:not(.btn):not(.button):not(.cta-button):not(.pill-btn) {
    color: var(--subpage-link) !important;
}

main :is(.hero, .hero-panel, .panel, .card, .plan, .compare-card, .form-panel, .cta-panel, .formula-card, .meta-card, .list-panel, .channel-card) :is(input, select, textarea) {
    background: rgba(255, 255, 255, 0.9) !important;
    color: var(--subpage-surface-ink) !important;
    border: 1px solid rgba(164, 192, 228, 0.84) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.98);
}

main :is(.hero, .hero-panel, .panel, .card, .plan, .compare-card, .form-panel, .cta-panel, .formula-card, .meta-card, .list-panel, .channel-card) :is(input, select, textarea)::placeholder {
    color: rgba(71, 98, 125, 0.74) !important;
}

main :is(.btn.secondary, .button.secondary, .cta-button.secondary) {
    background: rgba(255, 255, 255, 0.88) !important;
    color: var(--subpage-surface-ink) !important;
    border-color: rgba(164, 192, 228, 0.92) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.98),
        0 10px 24px rgba(11, 33, 66, 0.16);
}

main :is(.btn, .button, .cta-button, .pill-btn):not(.secondary):not(.ghost):not(.outline) {
    color: #fff !important;
}

main :is(table th, table td, .compare-table th, .compare-table td) {
    border-color: rgba(173, 199, 232, 0.72) !important;
    color: var(--subpage-surface-ink);
}