/* Compact three-state theme control. */
/* Shared scrollbar palette for pages and scrollable form controls. */
:root{--scroll-thumb:#3d526f;--scroll-track:#080a0f;--scroll-hover:#64acff}
html[data-color-mode="light"]{--scroll-thumb:#a5b7d0;--scroll-track:#f6f8fc;--scroll-hover:#2468d8}
html,body,textarea,select,.legal-sidebar{scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--scroll-track)}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--scroll-track)}
html::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb,::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:8px;border:2px solid var(--scroll-track)}
html::-webkit-scrollbar-thumb:hover,body::-webkit-scrollbar-thumb:hover,::-webkit-scrollbar-thumb:hover{background:var(--scroll-hover)}
::-webkit-scrollbar-corner{background:var(--scroll-track)}
.theme-switch{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:0 0 36px;padding:0;margin-left:4px;border:0;border-radius:8px;background:transparent;color:var(--white);cursor:pointer;transition:background .15s;touch-action:manipulation}
.theme-switch:hover{background:#ffffff08;color:var(--white)!important;opacity:1}
.theme-switch:focus-visible{outline:2px solid #64acff;outline-offset:3px}
.theme-switch .theme-icon{display:none;width:18px;height:18px;max-width:none;pointer-events:none}
.theme-switch[data-theme-preference="system"] .theme-icon-system,.theme-switch[data-theme-preference="light"] .theme-icon-light,.theme-switch[data-theme-preference="dark"] .theme-icon-dark{display:block}
html[data-color-mode="light"] .theme-switch:hover{background:#edf3fd;color:#17233a!important}
@media(max-width:760px){.site-header .brand{margin-right:auto}.theme-switch{margin-left:0;width:38px;height:38px;flex-basis:38px}.site-header .site-menu{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0}.site-header .nav-inner{gap:10px}}

/* Light palette, covering shared surfaces and page-specific overrides. */
html[data-color-mode="light"]{--bg:#f6f8fc;--surface:#fff;--card:#fff;--white:#17233a;--muted:#596a82;--line:#dce3ee;--accent:#2468d8;--accent-2:#1a58c2;--hover-color:#174ea6;background:#f6f8fc}
html[data-color-mode="light"] body{background:#f6f8fc;color:#17233a}
html[data-color-mode="light"] body::before{background:radial-gradient(ellipse 850px 450px at 50% 0,#dceaff,transparent 85%)}
html[data-color-mode="light"] .site-header .nav-inner{background:#ffffffed;border-color:#dce3ee;box-shadow:0 8px 30px #1a355a0a}
html[data-color-mode="light"] .site-header .brand{color:#17233a}
html[data-color-mode="light"] .site-header nav a{color:#596a82}
html[data-color-mode="light"] .site-header nav a.active{color:#205fc2}
html[data-color-mode="light"] .site-header nav a:hover{background:#edf3fd;color:#174ea6!important}
html[data-color-mode="light"] .site-header nav .nav-invite{background:#2468d8;border-color:#2468d8;color:#fff!important}
html[data-color-mode="light"] .site-menu{background:#f3f6fc;border-color:#dce3ee;color:#17233a}
html[data-color-mode="light"] .eyebrow,html[data-color-mode="light"] .invite-eyebrow{color:#2468d8}
html[data-color-mode="light"] .secondary-action,html[data-color-mode="light"] .invite-secondary{background:#fff!important;border-color:#cbd6e6!important;color:#253c61!important}
html[data-color-mode="light"] :is(.leaderboard,.music-card,.preview-card,.card,.invite-side,.systems,.update-card){background:#fff!important;border-color:#dce3ee!important;box-shadow:0 6px 25px #1a355a08!important}
html[data-color-mode="light"] :is(.leaderboard,.music-card,.preview-card,.invite-side,.update-card):hover{border-color:#b7cbed!important;box-shadow:0 12px 30px #1a355a0d!important}
html[data-color-mode="light"] :is(.leaderboard h4,.music-card .mc-title,.preview-meta h4,.lb-username,.container h2,.sys-name-title,.update-title){color:#17233a}
html[data-color-mode="light"] :is(.used-banner,.lb-row,.mc-row,.reliability-section,.reliability-card-label,.reliability-card .preview-stats,.reliability-card .preview-stat+.preview-stat,.welcome-preview-heading,.system-row){border-color:#dce3ee}
html[data-color-mode="light"] :is(.reliability-card .preview-meta .muted,.reliability-card-label,.reliability-card .preview-stat .lbl,.reliability-card-footer>span,.welcome-preview-caption,.welcome-preview-heading>span:last-child){color:#60718b}
html[data-color-mode="light"] :is(.reliability-status-link,.welcome-preview-heading,.reliability-card-footer .preview-status){color:#2468d8}
html[data-color-mode="light"] .preview-stat{background:#f6f8fc;border-color:#dce3ee}
html[data-color-mode="light"] .verified-app{background:#e9efff;color:#3458ad;border-color:#cfdaff}
html[data-color-mode="light"] .qa{background:#fff;border-color:#dce3ee}
html[data-color-mode="light"] #faq .q{color:#17233a}
html[data-color-mode="light"] #faq .a{color:#596a82}
html[data-color-mode="light"] .cta-band{background:linear-gradient(120deg,#e9f2ff,#f5f8ff)!important;border-color:#cdddf3}
html[data-color-mode="light"] .cta-band h2{color:#17233a}
html[data-color-mode="light"] .cta-band .cta-btn{background:#2468d8;color:#fff}
html[data-color-mode="light"] .systems-header{background:#f1f5fb}
html[data-color-mode="light"] :is(.chip,.notice,.contact-box){background:#f2f6fd!important;border-color:#dce3ee!important}
html[data-color-mode="light"] :is(input,textarea,select){background:#fff!important;border-color:#cbd6e6!important;color:#17233a!important}
html[data-color-mode="light"] :is(.data-table th,.data-table td){border-color:#dce3ee}
html[data-color-mode="light"] .data-table th{background:#edf3fc;color:#17233a}
html[data-color-mode="light"] footer.main{background:#edf2f9;border-color:#dce3ee}
html[data-color-mode="light"] :is(.footer-brand h3,.footer-col h4){color:#253c61}
html[data-color-mode="light"] :is(.footer-desc,.footer-list a,.footer-bottom){color:#596a82}
html[data-color-mode="light"] .footer-bottom{border-color:#dce3ee}
html[data-color-mode="light"] body[data-page="premium"] .pricing-row .pack-container{background:#fff!important;border-color:#dce3ee!important;color:#17233a}
html[data-color-mode="light"] body[data-page="premium"] .pricing-row .pack-container.popular{background:linear-gradient(150deg,#eef5ff,#fff)!important;border-color:#86ace8!important}
html[data-color-mode="light"] body[data-page="premium"] .pack-container :is(.pack-title,.price-container,.price-container .big){color:#17233a}
html[data-color-mode="light"] body[data-page="premium"] .pack-container :is(.lead,.feat,.price-container .period,.price-container .currency){color:#596a82}
html[data-color-mode="light"] body[data-page="premium"] .pack-container .pack-header{border-color:#dce3ee}
html[data-color-mode="light"] body[data-page="premium"] .pack-container .feat i{background:#f2f6fd;border-color:#dce3ee;color:#2468d8}
html[data-color-mode="light"] body[data-page="premium"] .pack-container .btn-subscribe{background:#edf3fd!important;border-color:#cbd6e6!important;color:#205fc2!important}
html[data-color-mode="light"] body[data-page="premium"] .pack-container.popular .btn-subscribe{background:#2468d8!important;color:#fff!important;border-color:#2468d8!important}
html[data-color-mode="light"] body[data-page="premium"] .pack-container .pill-popular{background:#e3edff!important;color:#205fc2!important;border-color:#c7d8f6}
html[data-color-mode="light"] #paymentModal .pay-modal-card{background:#fff!important;color:#17233a;border-color:#dce3ee!important}
html[data-color-mode="light"] #paymentModal :is(.pm-merchant-title,.pm-amount,.upi-title,.pm-title-center,.pm-success-title,.pm-qr-amount-val){color:#17233a}
html[data-color-mode="light"] #paymentModal :is(.pm-subtitle,.pm-paying-text,.pm-section-title,.upi-sub,.pm-note,.pm-sub-center,.pm-success-text,.pm-qr-amount-text){color:#596a82}
html[data-color-mode="light"] #paymentModal :is(.pm-header,.upi-row,.pm-info-box){border-color:#dce3ee}
html[data-color-mode="light"] #paymentModal :is(.upi-row,.pm-info-box){background:#f5f8fd;color:#596a82}
html[data-color-mode="light"] #paymentModal .pm-input{background:#fff!important;color:#17233a!important;border-color:#cbd6e6!important}
html[data-color-mode="light"] #paymentModal :is(.pm-close,.pm-link-btn,.pm-success-icon){color:#2468d8;border-color:#cbd6e6;background:#edf3fd}
html[data-color-mode="light"] #paymentModal #pm-payment-id{color:#2468d8!important}
html[data-color-mode="light"] .server-preview{background:#fff;border-color:#dce3ee;box-shadow:0 16px 45px #1a355a10}
html[data-color-mode="light"] :is(.server-preview-toolbar,.server-preview-caption){background:#f4f6fb;border-color:#e3e7ef}
html[data-color-mode="light"] :is(.server-preview-toolbar>strong,.server-message-author>strong){color:#26344d}
html[data-color-mode="light"] :is(.server-channel-description,.server-message-note,.server-message-text){color:#59677d}
html[data-color-mode="light"] .server-preview-composer{background:#edf0f6;color:#738097}
html[data-color-mode="light"] .server-message-divider::before,html[data-color-mode="light"] .server-message-divider::after{background:#dce3ee}
html[data-color-mode="light"] .server-mention{color:#3c55bb;background:#e8edff}
@media(max-width:760px){html[data-color-mode="light"] .site-header nav{background:#fff;border-color:#dce3ee}}
/* Keep the navbar invite action legible and unchanged on hover. */
.site-header nav a.nav-invite,.site-header nav a.nav-invite:hover{background:#f3f6fc;color:#111827!important;text-decoration:none}
.site-header nav a.nav-invite::after{display:none!important}
html[data-color-mode="light"] .site-header nav a.nav-invite,html[data-color-mode="light"] .site-header nav a.nav-invite:hover{background:#2468d8;color:#fff!important;text-decoration:none}
@media(prefers-reduced-motion:reduce){.theme-switch *{animation:none!important;transition:none!important}}
