/* ============================================================
   LIGHT THEME OVERRIDES — loaded LAST (after icons.css).
   Every rule is scoped to html[data-theme="light"], so specificity
   (0,1,x) + !important beats the per-template <style> blocks'
   (0,1,0) + !important even though those render later in the doc.
   Dark mode is completely untouched by this file.
   ============================================================ */

/* ---------- app shell ---------- */
html[data-theme="light"] body {
    background: var(--bg) !important;
    color: var(--text) !important;
}
html[data-theme="light"] .main-content { background: transparent !important; }
html[data-theme="light"] .navbar {
    background: rgba(255, 255, 255, .92) !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .nav-brand h2,
html[data-theme="light"] .nav-brand .icon { color: var(--accent) !important; text-shadow: none !important; }
html[data-theme="light"] .nav-link { color: var(--text-muted) !important; text-shadow: none !important; }
html[data-theme="light"] .nav-link:hover { color: var(--accent) !important; }
html[data-theme="light"] .nav-menu { background: transparent !important; }
@media (max-width: 768px) {
    html[data-theme="light"] .nav-menu { background: #ffffff !important; border-color: var(--border) !important; }
}
html[data-theme="light"] .footer,
html[data-theme="light"] footer {
    background: #ffffff !important;
    color: var(--text-muted) !important;
    border-top: 1px solid var(--border) !important;
}
html[data-theme="light"] .footer * { color: var(--text-muted) !important; }

/* ---------- generic cards (covers the per-template dark-hex blocks) ---------- */
html[data-theme="light"] .stat-card,
html[data-theme="light"] .info-card,
html[data-theme="light"] .action-card,
html[data-theme="light"] .active-exam-card,
html[data-theme="light"] .form-card,
html[data-theme="light"] .form-card.large,
html[data-theme="light"] .exam-form-card,
html[data-theme="light"] .dashboard-section,
html[data-theme="light"] .history-card,
html[data-theme="light"] .hx-row,
html[data-theme="light"] .ranking-card,
html[data-theme="light"] .ranking-section-card,
html[data-theme="light"] .leaderboard-section-card,
html[data-theme="light"] .podium-item,
html[data-theme="light"] .exam-card,
html[data-theme="light"] .no-exam-card,
html[data-theme="light"] .next-exam-card,
html[data-theme="light"] .no-history-card,
html[data-theme="light"] .exam-card-compact,
html[data-theme="light"] .exam-with-slots,
html[data-theme="light"] .time-slot-card,
html[data-theme="light"] .summary-card,
html[data-theme="light"] .questions-section,
html[data-theme="light"] .review-header,
html[data-theme="light"] .cg-card,
html[data-theme="light"] .sb-card,
html[data-theme="light"] .set-card,
html[data-theme="light"] .res-card,
html[data-theme="light"] .arch-card,
html[data-theme="light"] .instructions-card {
    background: var(--card) !important;
    border-color: var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    color: var(--text) !important;
}
html[data-theme="light"] .stat-card *:not(.icon),
html[data-theme="light"] .action-card h3,
html[data-theme="light"] .dashboard-section h2,
html[data-theme="light"] .info-card h4 { text-shadow: none !important; }

/* headings + common text inside cards */
html[data-theme="light"] h1, html[data-theme="light"] h2, html[data-theme="light"] h3,
html[data-theme="light"] h4, html[data-theme="light"] h5 {
    color: var(--text) !important;
    text-shadow: none !important;
}
html[data-theme="light"] p { color: var(--text-muted); }

/* ---------- forms ---------- */
html[data-theme="light"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] select,
html[data-theme="light"] textarea {
    background: var(--surface) !important;
    color: var(--text) !important;
    border: 1px solid var(--border-strong) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #8ba0b8 !important; }
html[data-theme="light"] select option { background: #ffffff !important; color: var(--text) !important; }
html[data-theme="light"] label,
html[data-theme="light"] .form-label,
html[data-theme="light"] .auth-label { color: var(--text) !important; text-shadow: none !important; }
html[data-theme="light"] .auth-label[for="nsi_id"],
html[data-theme="light"] .auth-label[for="username"],
html[data-theme="light"] .auth-label[for="password"],
html[data-theme="light"] .auth-label[for="confirm_password"] {
    color: var(--accent) !important;
    -webkit-text-fill-color: var(--accent) !important;
}
/* Chrome autofill mirror (theme-fixes.css pins it dark) */
html[data-theme="light"] input:-webkit-autofill,
html[data-theme="light"] input:-webkit-autofill:hover,
html[data-theme="light"] input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    -webkit-text-fill-color: var(--text) !important;
    caret-color: var(--text) !important;
}

/* ---------- tables ---------- */
html[data-theme="light"] table th {
    background: var(--card-2) !important;
    color: var(--text-muted) !important;
    text-shadow: none !important;
    border-color: var(--border) !important;
}
html[data-theme="light"] table td {
    color: var(--text) !important;
    border-color: var(--border) !important;
    background: transparent !important;
}
html[data-theme="light"] .data-table,
html[data-theme="light"] .sb-table,
html[data-theme="light"] .users-table,
html[data-theme="light"] .results-table-container {
    background: var(--card) !important;
    border-color: var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] tbody tr:hover td { background: rgba(0, 114, 163, .06) !important; }

/* ---------- flash messages ---------- */
html[data-theme="light"] .flash-success { background: rgba(21, 127, 61, .1) !important; color: #115c30 !important; border-color: rgba(21, 127, 61, .4) !important; }
html[data-theme="light"] .flash-error { background: rgba(200, 30, 64, .08) !important; color: #a01732 !important; border-color: rgba(200, 30, 64, .35) !important; }
html[data-theme="light"] .flash-info { background: rgba(0, 114, 163, .08) !important; color: #005f8f !important; border-color: rgba(0, 114, 163, .35) !important; }
html[data-theme="light"] .flash-warning { background: rgba(154, 106, 0, .1) !important; color: #7a5500 !important; border-color: rgba(154, 106, 0, .4) !important; }

/* ---------- glows off, softly ---------- */
html[data-theme="light"] * { text-shadow: none !important; }
html[data-theme="light"] .sb-live-dot,
html[data-theme="light"] .hx-ring { filter: none !important; }

/* muted/dim text needs to darken, not fade */
html[data-theme="light"] .text-muted,
html[data-theme="light"] .sub, html[data-theme="light"] .hint,
html[data-theme="light"] .stat-label, html[data-theme="light"] .meta-value,
html[data-theme="light"] .timeline-label { color: var(--text-muted) !important; }

/* status pills keep their semantic hue, adjusted for light ground */
html[data-theme="light"] .exam-status.active,
html[data-theme="light"] .status-badge.active,
html[data-theme="light"] .status-badge.available-now,
html[data-theme="light"] .status-badge.passed, html[data-theme="light"] .exam-status.passed {
    background: rgba(21, 127, 61, .1) !important;
    border-color: rgba(21, 127, 61, .45) !important;
    color: #115c30 !important;
}
html[data-theme="light"] .status-badge.failed, html[data-theme="light"] .exam-status.failed {
    background: rgba(200, 30, 64, .08) !important;
    border-color: rgba(200, 30, 64, .4) !important;
    color: #a01732 !important;
}

/* the intentionally-light exam question area already works on light — keep */
html[data-theme="light"] .question-card { box-shadow: 0 1px 3px rgba(23,43,66,.07) !important; }

/* (landing hero now themes with the page — see CATCHY LIGHT below) */


/* ============================================================
   COMPONENT PASS - the redesigned sections carry hardcoded
   dark-theme literals in their template <style> blocks; every
   one of them gets a light equivalent here.
   ============================================================ */

/* navbar: SOLID surface, above everything, colored icons */
html[data-theme="light"] .navbar {
    background: #ffffff !important;
    z-index: 1100 !important;
}
html[data-theme="light"] .nav-user,
html[data-theme="light"] .nav-user .icon,
html[data-theme="light"] .nav-link .icon,
html[data-theme="light"] .cyber-icon .icon { color: var(--accent) !important; }
html[data-theme="light"] .nav-link.logout { color: var(--danger) !important; border-color: rgba(200,30,64,.4) !important; }

/* kill dark-era decorative glows/inner-borders that read as stray lines on light */
html[data-theme="light"] .dashboard-section.rankings-section::before,
html[data-theme="light"] .dashboard-section.rankings-section::after,
html[data-theme="light"] .rankings-section .ranking-section-card::before,
html[data-theme="light"] .rankings-section .leaderboard-section-card::before,
html[data-theme="light"] .exam-header::before { display: none !important; }

/* ---- Exam History rows (hx-) ---- */
html[data-theme="light"] .hx-row { background: var(--card) !important; }
html[data-theme="light"] .hx-ring span {
    background: var(--card) !important;
    color: var(--text) !important;
    text-shadow: none !important;
}
html[data-theme="light"] .hx-title b { color: var(--text) !important; }
html[data-theme="light"] .hx-chip {
    background: rgba(0, 114, 163, .06) !important;
    border-color: var(--border) !important;
    color: var(--text-muted) !important;
}
html[data-theme="light"] .hx-chip .icon { color: var(--accent) !important; }
html[data-theme="light"] .hx-chip.hx-dur { color: #9a6a00 !important; border-color: rgba(154,106,0,.35) !important; background: rgba(154,106,0,.06) !important; }
html[data-theme="light"] .hx-chip.hx-dur .icon { color: #9a6a00 !important; }
html[data-theme="light"] .hx-pass { --rc: #157f3d; }
html[data-theme="light"] .hx-fail { --rc: #c81e40; }
html[data-theme="light"] .hx-row::after { display: none !important; }

/* ---- Your Exam Rankings ---- */
html[data-theme="light"] .rankings-section .card-header {
    background: rgba(0, 114, 163, .06) !important;
    border-color: var(--border) !important;
}
html[data-theme="light"] .rankings-section .card-header h3 { color: var(--text) !important; }
html[data-theme="light"] .rankings-section .card-header h3 .icon { color: var(--accent) !important; }
html[data-theme="light"] .rankings-section .section-subtitle,
html[data-theme="light"] .section-header p { color: var(--text-muted) !important; }
html[data-theme="light"] .ranking-card .exam-title { color: var(--text) !important; }
html[data-theme="light"] .ranking-stats-grid .stat-item {
    background: var(--card-2) !important;
    border-color: var(--border) !important;
}
html[data-theme="light"] .ranking-stats-grid .stat-label { color: var(--text-muted) !important; }
html[data-theme="light"] .ranking-stats-grid .stat-value { color: var(--text) !important; }
html[data-theme="light"] .ranking-stats-grid .stat-value.score-excellent { color: #157f3d !important; }
html[data-theme="light"] .ranking-stats-grid .stat-value.score-good { color: #005f8f !important; }
html[data-theme="light"] .ranking-stats-grid .stat-value.score-average { color: #9a6a00 !important; }
html[data-theme="light"] .ranking-stats-grid .stat-value.score-poor { color: #c81e40 !important; text-shadow: none !important; }
html[data-theme="light"] .ranking-stats-grid .stat-icon .icon { color: var(--accent) !important; }

/* ---- Top Performers podium ---- */
html[data-theme="light"] .rankings-section .podium-item { background: var(--card) !important; }
html[data-theme="light"] .rankings-section .performer-name { color: var(--text) !important; }
html[data-theme="light"] .rankings-section .performer-name.current-user { color: var(--accent) !important; text-shadow: none !important; }
html[data-theme="light"] .rankings-section .performer-wing { color: var(--text-muted) !important; background: var(--card-2) !important; border-radius: 8px; padding: .2rem .6rem; }
html[data-theme="light"] .rankings-section .performer-stats .stat-row {
    background: var(--card-2) !important;
    border-color: var(--border) !important;
}
html[data-theme="light"] .rankings-section .performer-score { color: #157f3d !important; }
html[data-theme="light"] .rankings-section .performer-duration { color: #9a6a00 !important; }
html[data-theme="light"] .rankings-section .performer-stats .stat-row:last-child span:last-child { color: var(--text) !important; }
html[data-theme="light"] .rankings-section .podium-number { text-shadow: none !important; }

/* ---- resources / instructions / timelines on the dashboard ---- */
html[data-theme="light"] .sd-res-tile, html[data-theme="light"] .sd-res-main b { color: var(--text) !important; }
html[data-theme="light"] .sd-res-main span { color: var(--text-muted) !important; }
html[data-theme="light"] .instruction-content h4 { color: var(--text) !important; }
html[data-theme="light"] .instruction-content p,
html[data-theme="light"] .timeline-value { color: var(--text-muted) !important; }
html[data-theme="light"] .timeline-item { background: var(--card-2) !important; border-color: var(--border) !important; }

/* ---- exam cards (available/upcoming) ---- */
html[data-theme="light"] .exam-card-compact h3,
html[data-theme="light"] .exam-title-bar h3 { color: var(--text) !important; }
html[data-theme="light"] .meta-item, html[data-theme="light"] .quick-meta { color: var(--text-muted) !important; }
html[data-theme="light"] .time-remaining-badge { color: #9a6a00 !important; background: rgba(154,106,0,.07) !important; }
html[data-theme="light"] .slot-time .time-display, html[data-theme="light"] .slot-duration { color: var(--text) !important; }
html[data-theme="light"] .countdown-text { color: var(--text-muted) !important; }

/* ---- welcome header / stray glows ---- */
html[data-theme="light"] .dashboard-header,
html[data-theme="light"] .exam-header {
    background: var(--card) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .dashboard-header h1, html[data-theme="light"] .dashboard-header p { color: var(--text) !important; }

/* ---- admin scoreboard + congratulations (same literals family) ---- */
html[data-theme="light"] .sb-controls { background: var(--card) !important; border-color: var(--border) !important; }
html[data-theme="light"] .sb-pod b, html[data-theme="light"] .sb-table tbody td { color: var(--text) !important; }
html[data-theme="light"] .sb-pod { background: var(--card) !important; }
html[data-theme="light"] .sb-pod .sb-pod-meta, html[data-theme="light"] .sb-muted { color: var(--text-muted) !important; }
html[data-theme="light"] .sb-score.hi { color: #157f3d !important; }
html[data-theme="light"] .sb-score.mid { color: #9a6a00 !important; }
html[data-theme="light"] .sb-score.lo { color: #c81e40 !important; }
html[data-theme="light"] .cg-title { -webkit-text-fill-color: initial !important; background: none !important; color: var(--text) !important; }
html[data-theme="light"] .cg-subtitle { color: var(--text) !important; }
html[data-theme="light"] .cg-message, html[data-theme="light"] .cg-info-label { color: var(--text-muted) !important; }
html[data-theme="light"] .cg-info-value { color: var(--text) !important; }
html[data-theme="light"] .cg-info { background: var(--card-2) !important; border-color: var(--border) !important; }
html[data-theme="light"] .cg-orb { opacity: .15 !important; }


/* ============================================================
   GLOW KILL PASS — some glow rules sit at (0,2,1)+!important and
   beat the broad reset; name them explicitly at higher specificity.
   ============================================================ */
html[data-theme="light"] .rankings-section .section-header h2,
html[data-theme="light"] .rankings-section .section-header .section-subtitle,
html[data-theme="light"] .dashboard-section h2,
html[data-theme="light"] .section-header h2,
html[data-theme="light"] .stat-content h3,
html[data-theme="light"] .dashboard-header h1,
html[data-theme="light"] .card-header h3,
html[data-theme="light"] .nav-brand h2,
html[data-theme="light"] .feature h3,
html[data-theme="light"] .cyber-bullet {
    text-shadow: none !important;
    filter: none !important;
}
/* header pills: no glossy streak, no cyan bloom */
html[data-theme="light"] .rankings-section .card-header {
    box-shadow: none !important;
}
html[data-theme="light"] .rankings-section .card-header h3 {
    background: transparent !important;
    -webkit-text-fill-color: currentColor !important;
}
/* box glows that survived on light cards */
html[data-theme="light"] .ranking-card,
html[data-theme="light"] .podium-item,
html[data-theme="light"] .hx-row,
html[data-theme="light"] .ranking-section-card,
html[data-theme="light"] .leaderboard-section-card,
html[data-theme="light"] .dashboard-section {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .rank-badge,
html[data-theme="light"] .rank-badge.gold,
html[data-theme="light"] .top-performers .rank-badge.gold {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .podium-medal .icon,
html[data-theme="light"] .rankings-section .podium-medal .icon,
html[data-theme="light"] .sb-pod .icon,
html[data-theme="light"] .hx-status {
    filter: none !important;
    box-shadow: none !important;
}
html[data-theme="light"] .sb-live { box-shadow: none !important; }
html[data-theme="light"] .sb-live-dot { box-shadow: none !important; animation: none !important; }


/* ============================================================
   LIGHT V2 — a DESIGNED light theme (not an inversion).
   Principles: navy ink on soft blue-grey paper, ONE strong accent
   (deep cyan) carrying the brand, crisp borders, clear hierarchy.
   ============================================================ */

/* paper: subtle vertical gradient so the page has depth without glow */
html[data-theme="light"] { background: #e9eff7 !important; }
html[data-theme="light"] body {
    /* no 'fixed' attachment — it stops painting past the first viewport in some
       renderers, exposing a dark html background under the lower page */
    background: #f2f6fb !important;
    min-height: 100vh;
}

/* navbar: white bar with a firm accent base line — anchors the page */
html[data-theme="light"] .navbar {
    border-bottom: 2px solid rgba(0, 114, 163, .28) !important;
}
html[data-theme="light"] .nav-link {
    color: #35506b !important;
    font-weight: 600 !important;
}
html[data-theme="light"] .nav-link:hover { color: #0072a3 !important; }

/* section titles: solid navy + a short accent underline (identity w/o glow) */
html[data-theme="light"] .dashboard-section h2,
html[data-theme="light"] .rankings-section .section-header h2 {
    color: #12293f !important;
    border-bottom: none !important;
}
html[data-theme="light"] .rankings-section .section-header h2 { position: relative; padding-bottom: .5rem; }
html[data-theme="light"] .rankings-section .section-header h2::after {
    content: "" !important;
    display: block !important;
    position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
    width: 84px; height: 3px; border-radius: 3px;
    background: #0072a3;
    min-height: 0 !important; border: none !important; box-shadow: none !important; padding: 0 !important;
}
html[data-theme="light"] .rankings-section .section-subtitle { letter-spacing: 1.5px; }

/* cards: crisp edge + gentle two-layer shadow (defined, not floating foam) */
html[data-theme="light"] .dashboard-section,
html[data-theme="light"] .ranking-section-card,
html[data-theme="light"] .leaderboard-section-card {
    border: 1px solid rgba(13, 63, 110, .18) !important;
}
html[data-theme="light"] .hx-row,
html[data-theme="light"] .ranking-card,
html[data-theme="light"] .podium-item {
    border: 1px solid rgba(13, 63, 110, .2) !important;
}
html[data-theme="light"] .hx-row:hover,
html[data-theme="light"] .ranking-card:hover,
html[data-theme="light"] .podium-item:hover {
    border-color: rgba(0, 114, 163, .5) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* header pills: tinted accent band with real presence */
html[data-theme="light"] .rankings-section .card-header {
    background: #e7f2f9 !important;
    border: 1px solid rgba(0, 114, 163, .3) !important;
}
html[data-theme="light"] .rankings-section .card-header h3 { color: #0f2740 !important; font-weight: 800 !important; }
html[data-theme="light"] .rankings-section .card-header h3 .icon { color: #0072a3 !important; }

/* chips: readable tinted capsules (were washed-out foam) */
html[data-theme="light"] .hx-chip,
html[data-theme="light"] .rankings-section .performer-stats .stat-row,
html[data-theme="light"] .a-chip, html[data-theme="light"] .sb-chip {
    background: #eaf3fa !important;
    border: 1px solid rgba(0, 114, 163, .28) !important;
    color: #35506b !important;
    font-weight: 600 !important;
}
html[data-theme="light"] .hx-chip.hx-dur { background: #faf3e2 !important; border-color: rgba(154, 106, 0, .35) !important; color: #8a5f00 !important; }
html[data-theme="light"] .rankings-section .performer-wing {
    background: #eaf3fa !important;
    border: 1px solid rgba(0, 114, 163, .22) !important;
    color: #35506b !important;
}

/* stat tiles inside ranking card: soft tint + firm numbers */
html[data-theme="light"] .ranking-stats-grid .stat-item {
    background: #f4f8fc !important;
    border: 1px solid rgba(13, 63, 110, .18) !important;
}
html[data-theme="light"] .ranking-stats-grid .stat-label { color: #5a7089 !important; font-weight: 700 !important; }

/* score ring on white: give it a rim so the conic arc reads */
html[data-theme="light"] .hx-ring { box-shadow: 0 1px 3px rgba(23,43,66,.07); }

/* FAILED/PASSED pills: firmer */
html[data-theme="light"] .hx-status { font-weight: 800 !important; }

/* buttons: gradients stay, but grounded with a crisp edge */
html[data-theme="light"] .hx-btn,
html[data-theme="light"] .cg-btn-primary,
html[data-theme="light"] .btn-start-exam {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* welcome band: identity strip instead of a plain white box */
html[data-theme="light"] .dashboard-header {
    background: #ffffff !important;
    border-left: 4px solid #0072a3 !important;
}

/* tables */
html[data-theme="light"] table th { background: #edf3f9 !important; color: #44586f !important; }

/* footer: quiet, bordered */
html[data-theme="light"] .footer { background: #f4f8fc !important; }

/* generic muted text: raise from foam to legible */
html[data-theme="light"] .section-subtitle,
html[data-theme="light"] .timeline-label,
html[data-theme="light"] .stat-label,
html[data-theme="light"] .meta-item,
html[data-theme="light"] .quick-meta,
html[data-theme="light"] .slot-date { color: #4a5f78 !important; }


/* ============================================================
   UNBEATABLE glow kill: tripled attribute selector = (0,3,0)+
   important — outranks every template rule that also uses
   !important at (0,2,1). Light mode has NO text glow, period.
   ============================================================ */
html[data-theme="light"][data-theme="light"][data-theme="light"] *,
html[data-theme="light"][data-theme="light"][data-theme="light"] *::before,
html[data-theme="light"][data-theme="light"][data-theme="light"] *::after {
    text-shadow: none !important;
}


/* ============================================================
   SEEN-WITH-MY-OWN-EYES fixes (headless-browser visual QA pass)
   ============================================================ */

/* 1. dark backdrop behind cards: neutralize every page-level wrapper */
html[data-theme="light"][data-theme="light"] .main-content,
html[data-theme="light"][data-theme="light"] .admin-dashboard,
html[data-theme="light"][data-theme="light"] .dashboard-container,
html[data-theme="light"][data-theme="light"] .admin-content,
html[data-theme="light"][data-theme="light"] .content-body,
html[data-theme="light"][data-theme="light"] .exam-container {
    background: transparent !important;
}
html[data-theme="light"] .dashboard-container::before,
html[data-theme="light"] .main-content::before { display: none !important; }

/* 2. 'No Rankings Yet' placeholder was a dark slate slab on white */
html[data-theme="light"] .no-rankings-placeholder {
    background: var(--card-2) !important;
    border: 1px dashed var(--border-strong) !important;
    color: var(--text-muted) !important;
}
html[data-theme="light"] .no-rankings-placeholder h3,
html[data-theme="light"] .no-rankings-placeholder .placeholder-icon { color: var(--text) !important; }

/* 3. Resources tile was a dark navy bar with invisible title */
html[data-theme="light"] .sd-res-tile {
    background: var(--card-2) !important;
    border: 1px solid var(--border) !important;
}
html[data-theme="light"] .sd-res-tile b { color: var(--text) !important; }
html[data-theme="light"] .sd-res-tile span { color: var(--text-muted) !important; }
html[data-theme="light"] .sd-res-dl { color: var(--accent) !important; }

/* 4. Instructions tiles were muddy slate gradients with pale text */
html[data-theme="light"] .instruction-item {
    background: var(--card-2) !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}
html[data-theme="light"] .instruction-item h4 { color: var(--text) !important; }
html[data-theme="light"] .instruction-item p { color: var(--text-muted) !important; }
html[data-theme="light"] .instruction-icon .icon { color: var(--accent) !important; }

/* 5. admin dashboard hero: greenish gradient banner + green gradient title */
html[data-theme="light"][data-theme="light"] .dashboard-header {
    background: #ffffff !important;
}
html[data-theme="light"][data-theme="light"] .dashboard-header h1 {
    background: none !important;
    -webkit-background-clip: initial !important;
    -webkit-text-fill-color: currentColor !important;
    color: var(--text) !important;
}
html[data-theme="light"] .dashboard-header p { color: var(--text-muted) !important; }

/* 6. flash banner: blend with the light page */
html[data-theme="light"] .flash-message { box-shadow: 0 1px 3px rgba(23,43,66,.07) !important; }


/* ============================================================
   CATCHY LIGHT — friendly color for everyday users.
   White paper + navy ink stays; each area gets a soft pastel
   identity so the page feels alive, never washed out.
   ============================================================ */

/* ---------- LANDING PAGE: flip its scoped mini-tokens ---------- */
html[data-theme="light"] .home-wrap {
    --ink: #12293f;
    --muted: #44586f;
    --line: rgba(13, 63, 110, .18);
    --card: #ffffff;
    --cyan: #0891b2; --violet: #6d28d9; --pink: #db2777;
    --gold: #b45309; --green: #157f3d; --blue: #2563eb;
}
/* hero: pastel aurora on paper, dark readable headline */
html[data-theme="light"] .home-hero .aurora { opacity: .38 !important; }
html[data-theme="light"] .home-hero .scrim {
    background: transparent !important;
}
html[data-theme="light"] .home-hero h1 {
    background: #0e7490 !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
html[data-theme="light"] .home-hero h1 .icon { color: #0891b2 !important; filter: none !important; }
html[data-theme="light"] .hero-tagline { color: #12293f !important; text-shadow: none !important; }
html[data-theme="light"] .hero-eyebrow { background: rgba(255,255,255,.75) !important; color: #12293f !important; border-color: rgba(13,63,110,.25) !important; }
html[data-theme="light"] .hero-year { -webkit-text-stroke: 2px rgba(13, 63, 110, .08) !important; }
html[data-theme="light"] .home-hero::before { opacity: .5; }
html[data-theme="light"] .home-hero .hero-stats > * {
    background: rgba(255,255,255,.8) !important;
    border-color: rgba(13,63,110,.2) !important;
    color: #12293f !important;
}

/* ---------- ADMIN QUESTIONS: card bodies were still navy (gradient literals) ---------- */
html[data-theme="light"] .admin-content .question-card {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .admin-content .question-text,
html[data-theme="light"] .admin-content .question-text p { color: var(--text) !important; }
html[data-theme="light"] .admin-content .question-text strong { color: var(--accent) !important; }
html[data-theme="light"] .admin-content .question-header,
html[data-theme="light"] .admin-content .question-footer {
    background: var(--card-2) !important;
    border-color: var(--border) !important;
}
html[data-theme="light"] .admin-content .question-id { color: var(--text-muted) !important; }
/* stat chips row at the top of Question Management */
html[data-theme="light"] .admin-content [class*="stat-"],
html[data-theme="light"] .admin-content [class*="qcount"],
html[data-theme="light"] .admin-content [class*="filter-chip"] {
    color: var(--text) !important;
}

/* ---------- AUTH: label bands blue-tinted (were minty) ---------- */
/* (superseded by the DEDICATED AUTH LIGHT block below) */

/* ---------- CATCHY PASTELS: stat cards get per-card identity ---------- */
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+1) .stat-icon { background: #e0f2fe !important; color: #0369a1 !important; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+2) .stat-icon { background: #ede9fe !important; color: #6d28d9 !important; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+3) .stat-icon { background: #dcfce7 !important; color: #15803d !important; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+4) .stat-icon { background: #fef3c7 !important; color: #b45309 !important; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+5) .stat-icon { background: #fce7f3 !important; color: #be185d !important; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+6) .stat-icon { background: #cffafe !important; color: #0e7490 !important; }
html[data-theme="light"] .stats-grid .stat-card .stat-icon {
    border-radius: 14px !important; border: none !important;
}
html[data-theme="light"] .stats-grid .stat-card .stat-content h3 { color: var(--text) !important; }

/* quick-action cards: pastel icon circles, hue rotates */
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+1) .action-icon { background: #e0f2fe !important; color: #0369a1 !important; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+2) .action-icon { background: #ede9fe !important; color: #6d28d9 !important; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+3) .action-icon { background: #dcfce7 !important; color: #15803d !important; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+4) .action-icon { background: #fef3c7 !important; color: #b45309 !important; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+5) .action-icon { background: #fce7f3 !important; color: #be185d !important; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+6) .action-icon { background: #cffafe !important; color: #0e7490 !important; }
html[data-theme="light"] .action-card .action-icon { border: none !important; border-radius: 16px !important; }
html[data-theme="light"] .action-card:hover { border-color: rgba(37, 99, 235, .45) !important; }

/* section accent bars: brand blue→violet in light (was green-cyan) */
html[data-theme="light"] .dashboard-section::before {
    background: #2563eb !important;
    animation: none !important;
}

/* student stat tiles + chips pick up soft tints */
html[data-theme="light"] .ranking-stats-grid .stat-item:nth-child(1) { background: #f0f7ff !important; }
html[data-theme="light"] .ranking-stats-grid .stat-item:nth-child(2) { background: #f5f3ff !important; }
html[data-theme="light"] .ranking-stats-grid .stat-item:nth-child(3) { background: #f0fdf4 !important; }
html[data-theme="light"] .ranking-stats-grid .stat-item:nth-child(4) { background: #fffbeb !important; }

/* footer: navy ink lockup */
html[data-theme="light"] .footer, html[data-theme="light"] footer { border-top: 2px solid rgba(37, 99, 235, .18) !important; }


/* landing section headings: gradient started near-white — darken for light */
html[data-theme="light"] .home-section .sec-head h2,
html[data-theme="light"] .home-wrap .sec-head h2,
html[data-theme="light"] .home-wrap h2 {
    background: #12293f !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}


/* admin questions: the stats strip (dark pills w/ dark digits) -> pastel chips */
html[data-theme="light"] .admin-content .stat-item {
    background: #eef5fb !important;
    border: 1px solid rgba(13, 63, 110, .2) !important;
    box-shadow: none !important;
}
html[data-theme="light"] .admin-content .stat-item .stat-value { color: #12293f !important; text-shadow: none !important; }
html[data-theme="light"] .admin-content .stat-item .stat-label { color: #44586f !important; }
html[data-theme="light"] .admin-content .stat-item--total {
    background: #dbeafe !important;
    border-color: rgba(37, 99, 235, .35) !important;
}
html[data-theme="light"] .admin-content .stat-item--total .stat-value { color: #1d4ed8 !important; }
html[data-theme="light"] .admin-content .stat-group { background: #ffffff !important; border-color: rgba(13,63,110,.16) !important; }
html[data-theme="light"] .admin-content .stat-group-title { color: #44586f !important; }


/* ============================================================
   DEDICATED AUTH LIGHT — login & register get their own light
   identity. Hammer specificity so no dark-era trick survives
   (gradient-clip titles, transparent-fill labels, mint bands).
   ============================================================ */

/* the card */
html[data-theme="light"][data-theme="light"] .auth-card {
    background: #ffffff !important;
    border: 1px solid rgba(13, 63, 110, .16) !important;
    border-radius: 20px !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    position: relative;
    overflow: hidden;
}
html[data-theme="light"] .auth-card::before {
    content: "" !important;
    position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: #0891b2 !important;
    border: none !important; box-shadow: none !important;
}

/* title: dark blue→violet gradient text (no washed pale start) */
html[data-theme="light"][data-theme="light"] .auth-header h2 {
    background: #0e7490 !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
}
html[data-theme="light"] .auth-header h2 .icon {
    -webkit-text-fill-color: initial !important;
    color: #2563eb !important; filter: none !important;
}

/* EVERY label — one uniform blue capsule, real ink, no fill tricks */
html[data-theme="light"][data-theme="light"] .auth-card .auth-label,
html[data-theme="light"][data-theme="light"] .auth-card label {
    background: #e8f1fc !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    color: #0f2c47 !important;
    -webkit-text-fill-color: #0f2c47 !important;
    text-shadow: none !important;
    border-radius: 8px !important;
    border-left: 3px solid #2563eb !important;
    padding: .45rem .8rem !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    display: block !important;
}

/* inputs */
html[data-theme="light"] .auth-card .auth-input,
html[data-theme="light"] .auth-card input {
    background: #ffffff !important;
    border: 1.5px solid rgba(13, 63, 110, .28) !important;
    color: #12293f !important;
    border-radius: 10px !important;
}
html[data-theme="light"] .auth-card input:focus {
    border-color: #2563eb !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    outline: none !important;
}

/* hints + requirement panel */
html[data-theme="light"] .auth-card .auth-help,
html[data-theme="light"] .auth-card .req-hint,
html[data-theme="light"] .auth-card small {
    color: #52657c !important;
}
html[data-theme="light"] .auth-card .req-hint-ic { color: #2563eb !important; }
html[data-theme="light"] .password-requirements {
    background: #eef5fc !important;
    border: 1px solid rgba(37, 99, 235, .22) !important;
}
html[data-theme="light"] .password-requirements strong,
html[data-theme="light"] .password-requirements b { color: #0f2c47 !important; }
html[data-theme="light"] .req-item { color: #52657c !important; }
html[data-theme="light"] .req-item .icon-x { color: #b23b55 !important; }
html[data-theme="light"] .req-item .icon-check { color: #157f3d !important; }
html[data-theme="light"] .password-requirements .icon-lock { color: #2563eb !important; }

/* button: confident blue gradient with white text */
html[data-theme="light"][data-theme="light"] .auth-card .auth-button,
html[data-theme="light"][data-theme="light"] .auth-card button[type="submit"] {
    background: #0891b2 !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    text-shadow: none !important;
}
html[data-theme="light"] .auth-card .auth-button:hover { filter: brightness(1.06); transform: translateY(-1px); }

/* links under the card */
html[data-theme="light"] .auth-card a, html[data-theme="light"] .cyber-link { color: #1d4ed8 !important; }


/* ============================================================
   PALETTE v3 — "Professional Indigo". ONE accent (#2563eb),
   navy ink ramp, pure-white cards. Supersedes every scattered
   tint above (later rules win at equal specificity).
   ============================================================ */

/* --- page + gradient --- */
html[data-theme="light"] { background: #f6f8fb !important; }
html[data-theme="light"] body {
    background: #fafbfd !important;
}

/* --- rainbow OUT: every icon chip becomes the ONE brand chip --- */
html[data-theme="light"] .stats-grid .stat-card:nth-child(n) .stat-icon,
html[data-theme="light"] .actions-grid .action-card:nth-child(n) .action-icon {
    background: #e7eefc !important;
    color: #1d4ed8 !important;
    border: none !important;
}
html[data-theme="light"] .stat-card .stat-content h3 { color: #0f2440 !important; }

/* --- ranking stat tiles: one inset tone (no four tints) --- */
html[data-theme="light"] .ranking-stats-grid .stat-item:nth-child(n) {
    background: #eef2f8 !important;
    border: 1px solid #dde5ef !important;
}

/* --- section accent bars + heading underline: brand gradient --- */
html[data-theme="light"] .dashboard-section::before {
    background: #2563eb !important;
}
html[data-theme="light"] .rankings-section .section-header h2::after,
html[data-theme="light"] .home-wrap .sec-head .u {
    background: #2563eb !important;
}

/* --- LANDING: repoint its scoped mini-tokens; washes off; white cards --- */
html[data-theme="light"] .home-wrap {
    --cyan: #2563eb; --violet: #7c3aed; --blue: #2563eb;
    --green: #15803d; --gold: #b45309; --pink: #db2777;
    --ink: #0f2440; --muted: #64748b;
    --line: #dde5ef;
    --card: #ffffff;
}
html[data-theme="light"] .home-wrap .req-card::after,
html[data-theme="light"] .home-wrap .step-card::after { display: none !important; }
html[data-theme="light"] .home-wrap .req-card,
html[data-theme="light"] .home-wrap .step-card {
    background: #ffffff !important;
    border: 1px solid #dde5ef !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .home-wrap .req-card::before,
html[data-theme="light"] .home-wrap .step-card::before {
    background: #2563eb !important;
    opacity: 1 !important;
}
/* step number wore pale grey (#94a3b8) → give it the card's own hue so it reads as a colored step marker */
html[data-theme="light"][data-theme="light"] .home-wrap .step-badge { color: var(--sc, #2563eb) !important; opacity: .8 !important; text-shadow: none !important; }
html[data-theme="light"] .home-wrap .step-ic {
    background: #e7eefc !important;
    color: #1d4ed8 !important;
    box-shadow: none !important;
    border: 1px solid #c7d7f7 !important;
}
html[data-theme="light"] .home-wrap .req-ic, html[data-theme="light"] .home-wrap .req-card .icon:first-child { color: #1d4ed8 !important; }
/* the A-0561 code chip: light, branded, mono */
html[data-theme="light"] .home-wrap .id-chip,
html[data-theme="light"] .home-wrap .req-card code,
html[data-theme="light"] .home-wrap [class*="format-example"],
html[data-theme="light"] .home-wrap [class*="id-example"] {
    background: #e7eefc !important;
    color: #1d4ed8 !important;
    border: 1.5px dashed #93b4f5 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}
html[data-theme="light"] .home-wrap .id-chip *, html[data-theme="light"] .home-wrap [class*="id-example"] * { color: #1d4ed8 !important; }

/* --- pills: filled, readable --- */
html[data-theme="light"] .home-wrap .pill,
html[data-theme="light"] .home-wrap [class*="req-pill"],
html[data-theme="light"] .home-wrap .req-item .tag {
    background: #e7eefc !important;
    border: 1px solid #c7d7f7 !important;
    color: #1d4ed8 !important;
    font-weight: 700 !important;
}

/* --- AUTH: flat brand capsule, kill the legacy mint underline layer --- */
html[data-theme="light"][data-theme="light"] .auth-card .auth-label,
html[data-theme="light"][data-theme="light"] .auth-card label {
    background: #e7eefc !important;
    background-image: none !important;
    border-left: 3px solid #2563eb !important;
    color: #0f2440 !important;
    -webkit-text-fill-color: #0f2440 !important;
}
html[data-theme="light"][data-theme="light"] .auth-card::before {
    background: #2563eb !important;
}
html[data-theme="light"][data-theme="light"] .auth-card .auth-button,
html[data-theme="light"][data-theme="light"] .auth-card button[type="submit"] {
    background: #2563eb !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"] .auth-header h2 {
    background: #1d4ed8 !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
html[data-theme="light"] .auth-header h2 .icon { color: #2563eb !important; }
html[data-theme="light"] .password-requirements {
    background: #eef2f8 !important;
    border: 1px solid #dde5ef !important;
}
html[data-theme="light"] .auth-card input:focus {
    border-color: #2563eb !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* --- BUTTONS: one primary everywhere --- */
html[data-theme="light"] .hx-btn,
html[data-theme="light"] .cg-btn-primary,
html[data-theme="light"] .btn-start-exam,
html[data-theme="light"] .res-btn,
html[data-theme="light"] .review-footer .footer-btn,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .cyber-button {
    background: #2563eb !important;
    color: #ffffff !important;
    border: none !important;
    text-shadow: none !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .btn-secondary {
    background: #ffffff !important;
    color: #33465e !important;
    border: 1.5px solid #c3d0e0 !important;
}
/* semantic buttons keep meaning */
html[data-theme="light"] .btn-success, html[data-theme="light"] .ex-resume { background: #16a34a !important; color: #fff !important; }
html[data-theme="light"] .btn-danger, html[data-theme="light"] .ex-stop { background: #be123c !important; color: #fff !important; }
html[data-theme="light"] .ex-pause { background: #b45309 !important; color: #fff !important; }

/* --- headings: solid ink (gradient text only on hero/auth titles) --- */
html[data-theme="light"] .home-wrap h2,
html[data-theme="light"] .home-section .sec-head h2,
html[data-theme="light"] .home-wrap .sec-head h2 {
    background: none !important;
    -webkit-background-clip: initial !important; background-clip: initial !important;
    -webkit-text-fill-color: currentColor !important;
    color: #0f2440 !important;
}

/* --- links + focus visibility --- */
html[data-theme="light"] a { color: #1d4ed8; }
html[data-theme="light"] :focus-visible { outline: 2px solid #2563eb !important; outline-offset: 2px; }

/* --- hx chips align to system --- */
html[data-theme="light"] .hx-chip {
    background: #eef2f8 !important;
    border-color: #dde5ef !important;
    color: #33465e !important;
}
html[data-theme="light"] .hx-chip .icon { color: #2563eb !important; }
html[data-theme="light"] .hx-chip.hx-dur { color: #b45309 !important; background: #fdf3e2 !important; border-color: #f3d9ac !important; }
html[data-theme="light"] .hx-chip.hx-dur .icon { color: #b45309 !important; }


/* landing pills: the real class is `.tag` (probe-verified) */
html[data-theme="light"] .home-wrap .tag,
html[data-theme="light"] .req-card .tag {
    background: #e7eefc !important;
    border: 1px solid #c7d7f7 !important;
    color: #1d4ed8 !important;
    font-weight: 700 !important;
}


/* ============================================================
   v4 VIBRANT LIGHT — light != white. A coordinated 6-hue
   spectrum on the white canvas: every section owns a hue
   (bar + icon + heading), page gets a soft aurora, admin
   stats get their color identities back — all systematic.
   Hues: sky #0284c7 · indigo #2563eb · violet #7c3aed ·
   amber #d97706 · teal #0d9488 · rose #db2777
   ============================================================ */

/* --- page: soft aurora corners instead of flat grey --- */
html[data-theme="light"] body {
    background:
        transparent,
        transparent,
        transparent,
        #fafbfd !important;
}

/* --- headings: rich gradient ink (dark enough to read) --- */
html[data-theme="light"] .dashboard-section h2,
html[data-theme="light"] .rankings-section .section-header h2 {
    background: #0f2440 !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
html[data-theme="light"] .dashboard-section h2 .icon { -webkit-text-fill-color: initial !important; color: var(--sec, #2563eb) !important; }

/* --- section hue identities (student dashboard) --- */
html[data-theme="light"] .dashboard-section:has(.exams-horizontal-container),
html[data-theme="light"] .dashboard-section:has(.no-exam-card) { --sec: #0284c7; }
html[data-theme="light"] .dashboard-section:has(.hx-list),
html[data-theme="light"] .dashboard-section:has(.no-history-card) { --sec: #7c3aed; }
html[data-theme="light"] .dashboard-section.rankings-section { --sec: #d97706; }
html[data-theme="light"] .dashboard-section.sd-resources,
html[data-theme="light"] .dashboard-section:has(.sd-res-list) { --sec: #0d9488; }
html[data-theme="light"] .dashboard-section:has(.instructions-card) { --sec: #6366f1; } /* calm indigo, not hot pink */

html[data-theme="light"] .dashboard-section::before {
    background: var(--sec, #2563eb) !important;
    width: 4px !important;
}
html[data-theme="light"] .dashboard-section {
    border-top: 3px solid color-mix(in srgb, var(--sec, #2563eb) 55%, transparent) !important;
}
html[data-theme="light"] .dashboard-section:hover {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* section-hue accents inside */
html[data-theme="light"] .sd-res-ic { background: #ccf5f0 !important; color: #0f766e !important; border: none !important; }
html[data-theme="light"] .instruction-icon .icon { color: #6366f1 !important; }
html[data-theme="light"] .instruction-item { border-left: 3px solid #c7d2fe !important; }
html[data-theme="light"] .rankings-section .card-header {
    background: #fef3c7 !important;
    border-color: #f3d9ac !important;
}
html[data-theme="light"] .rankings-section .card-header h3 .icon { color: #d97706 !important; }

/* history ring/status keep their semantic colors; chips get hue borders */
html[data-theme="light"] .hx-row { border-left: 4px solid var(--rc, #7c3aed) !important; }

/* --- ADMIN: colorful stat identity returns (coordinated, saturated-on-tint) --- */
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+1) { --sc: #0284c7; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+2) { --sc: #7c3aed; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+3) { --sc: #0d9488; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+4) { --sc: #d97706; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+5) { --sc: #db2777; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(6n+6) { --sc: #2563eb; }
html[data-theme="light"] .stats-grid .stat-card:nth-child(n) .stat-icon {
    background: color-mix(in srgb, var(--sc, #2563eb) 14%, #ffffff) !important;
    color: var(--sc, #2563eb) !important;
}
html[data-theme="light"] .stats-grid .stat-card {
    border-top: 3px solid var(--sc, #2563eb) !important;
}
html[data-theme="light"] .stats-grid .stat-card .stat-content h3 { color: var(--sc, #0f2440) !important; }
html[data-theme="light"] .stat-progress .stat-bar { background: var(--sc, #2563eb) !important; }

/* quick actions: same spectrum on hover + icon */
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+1) { --sc: #0284c7; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+2) { --sc: #7c3aed; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+3) { --sc: #0d9488; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+4) { --sc: #d97706; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+5) { --sc: #db2777; }
html[data-theme="light"] .actions-grid .action-card:nth-child(6n+6) { --sc: #2563eb; }
html[data-theme="light"] .actions-grid .action-card:nth-child(n) .action-icon {
    background: color-mix(in srgb, var(--sc, #2563eb) 13%, #ffffff) !important;
    color: var(--sc, #2563eb) !important;
}
html[data-theme="light"] .actions-grid .action-card:hover {
    border-color: var(--sc, #2563eb) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    transform: translateY(-3px);
}

/* --- welcome banner: gradient identity strip --- */
html[data-theme="light"][data-theme="light"] .dashboard-header {
    background:
        transparent,
        #ffffff !important;
    border-left: 4px solid #2563eb !important;
}

/* --- landing: step/req cards get the spectrum too --- */
html[data-theme="light"] .home-wrap .step-card:nth-child(1) { --sc: #0284c7; }
html[data-theme="light"] .home-wrap .step-card:nth-child(2) { --sc: #7c3aed; }
html[data-theme="light"] .home-wrap .step-card:nth-child(3) { --sc: #d97706; }
html[data-theme="light"] .home-wrap .step-card::before { background: var(--sc, #2563eb) !important; }
html[data-theme="light"] .home-wrap .step-card .step-ic {
    background: color-mix(in srgb, var(--sc, #2563eb) 14%, #ffffff) !important;
    color: var(--sc, #2563eb) !important;
    border-color: color-mix(in srgb, var(--sc, #2563eb) 35%, #ffffff) !important;
}
html[data-theme="light"] .home-wrap .req-card:nth-child(1) { --sc: #0284c7; }
html[data-theme="light"] .home-wrap .req-card:nth-child(2) { --sc: #7c3aed; }
html[data-theme="light"] .home-wrap .req-card::before { background: var(--sc, #2563eb) !important; }

/* --- auth labels: per-field hue bars (colorful, still tidy) --- */
html[data-theme="light"] .auth-card .form-group:nth-of-type(4n+1) label { border-left-color: #0284c7 !important; }
html[data-theme="light"] .auth-card .form-group:nth-of-type(4n+2) label { border-left-color: #7c3aed !important; }
html[data-theme="light"] .auth-card .form-group:nth-of-type(4n+3) label { border-left-color: #0d9488 !important; }
html[data-theme="light"] .auth-card .form-group:nth-of-type(4n+4) label { border-left-color: #d97706 !important; }

/* --- scoreboard: podium warm gold, pills hue --- */
html[data-theme="light"] .sb-pod-1 { border-top: 3px solid #d97706 !important; }
html[data-theme="light"] .rankings-section .podium-item.podium-1 { border-color: #f3d9ac !important; }


/* ============================================================
   AUDIT-DRIVEN PURGE — automated element-walk found these
   dark-theme survivors in light mode. Zero tolerance pass.
   ============================================================ */

/* 1. cyan drop-shadow GLOWS on icons (filter:, not text-shadow — 26 hits) */
html[data-theme="light"][data-theme="light"] .icon,
html[data-theme="light"][data-theme="light"] .stat-icon,
html[data-theme="light"][data-theme="light"] .stat-icon *,
html[data-theme="light"][data-theme="light"] .instruction-icon,
html[data-theme="light"][data-theme="light"] .instruction-icon *,
html[data-theme="light"][data-theme="light"] .no-history-icon,
html[data-theme="light"][data-theme="light"] .no-data-icon,
html[data-theme="light"][data-theme="light"] .placeholder-icon,
html[data-theme="light"][data-theme="light"] .action-icon,
html[data-theme="light"][data-theme="light"] .breakdown-icon,
html[data-theme="light"][data-theme="light"] .tip-icon,
html[data-theme="light"][data-theme="light"] .summary-icon,
html[data-theme="light"][data-theme="light"] .podium-medal,
html[data-theme="light"][data-theme="light"] .rank-medal,
html[data-theme="light"][data-theme="light"] .cyber-icon {
    filter: none !important;
    text-shadow: none !important;
}

/* 2. pale cyan placeholder text -> ink */
html[data-theme="light"][data-theme="light"] .no-rankings-placeholder h4,
html[data-theme="light"][data-theme="light"] .no-rankings-placeholder h3 { color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .no-rankings-placeholder p { color: #64748b !important; }
html[data-theme="light"][data-theme="light"] .no-data h4, html[data-theme="light"][data-theme="light"] .no-data p,
html[data-theme="light"][data-theme="light"] .no-history-card h3, html[data-theme="light"][data-theme="light"] .no-history-card p,
html[data-theme="light"][data-theme="light"] .no-exam-card h3, html[data-theme="light"][data-theme="light"] .no-exam-card p {
    color: #33465e !important;
}

/* 3. gold #ffd700 digits wash out on light -> amber-700 ink */
html[data-theme="light"][data-theme="light"] .podium-number,
html[data-theme="light"][data-theme="light"] .rank-badge.gold,
html[data-theme="light"][data-theme="light"] .top-performers .rank-badge.gold {
    color: #b45309 !important;
    text-shadow: none !important;
}

/* 4. admin System Info: white <strong> on white card */
html[data-theme="light"][data-theme="light"] .info-card p strong,
html[data-theme="light"][data-theme="light"] .info-details p strong,
html[data-theme="light"][data-theme="light"] .status-indicator span,
html[data-theme="light"][data-theme="light"] .health-indicators span {
    color: #0f2440 !important;
}
html[data-theme="light"] .info-card p, html[data-theme="light"] .info-details p { color: #33465e !important; }


/* ============================================================
   LIGHT TYPOGRAPHY — the terminal mono font is the dark theme's
   identity; on a clean light UI it reads dated. Light mode uses
   a modern sans stack; mono survives only where it MEANS code
   (ID chips, timers, hero year). Dark mode untouched.
   ============================================================ */
html[data-theme="light"][data-theme="light"] body,
html[data-theme="light"][data-theme="light"] h1,
html[data-theme="light"][data-theme="light"] h2,
html[data-theme="light"][data-theme="light"] h3,
html[data-theme="light"][data-theme="light"] h4,
html[data-theme="light"][data-theme="light"] h5,
html[data-theme="light"][data-theme="light"] p,
html[data-theme="light"][data-theme="light"] a,
html[data-theme="light"][data-theme="light"] li,
html[data-theme="light"][data-theme="light"] td,
html[data-theme="light"][data-theme="light"] th,
html[data-theme="light"][data-theme="light"] label,
html[data-theme="light"][data-theme="light"] span,
html[data-theme="light"][data-theme="light"] div,
html[data-theme="light"][data-theme="light"] button,
html[data-theme="light"][data-theme="light"] input,
html[data-theme="light"][data-theme="light"] select,
html[data-theme="light"][data-theme="light"] textarea,
html[data-theme="light"][data-theme="light"] small,
html[data-theme="light"][data-theme="light"] strong,
html[data-theme="light"][data-theme="light"] b {
    font-family: -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans Bengali', Arial, sans-serif !important;
    letter-spacing: normal !important;
}
/* headings get real weight in sans */
html[data-theme="light"] h1, html[data-theme="light"] h2 { font-weight: 800 !important; }
html[data-theme="light"] h3, html[data-theme="light"] h4 { font-weight: 700 !important; }
html[data-theme="light"] .nav-brand h2 { font-weight: 800 !important; letter-spacing: .5px !important; }

/* mono ONLY where it means code/digits */
html[data-theme="light"][data-theme="light"][data-theme="light"] code,
html[data-theme="light"][data-theme="light"][data-theme="light"] pre,
html[data-theme="light"][data-theme="light"][data-theme="light"] .id-chip,
html[data-theme="light"][data-theme="light"][data-theme="light"] .id-chip *,
html[data-theme="light"][data-theme="light"][data-theme="light"] .hero-year,
html[data-theme="light"][data-theme="light"][data-theme="light"] .timer-display,
html[data-theme="light"][data-theme="light"][data-theme="light"] #timeRemaining,
html[data-theme="light"][data-theme="light"][data-theme="light"] .hx-ring span,
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-updated b {
    font-family: 'Share Tech Mono', Consolas, monospace !important;
}

/* landing: the short FULL-ID card centers its content (no dead bottom half) */
html[data-theme="light"] .req-grid { align-items: stretch; }
html[data-theme="light"] .req-card:first-child {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

/* uppercase tracking labels (pills, eyebrows) keep a touch of spacing in sans */
html[data-theme="light"] .tag,
html[data-theme="light"] .hero-eyebrow,
html[data-theme="light"] .hx-status,
html[data-theme="light"] .sb-live { letter-spacing: .8px !important; font-size-adjust: none; }


/* ============================================================
   USER-SPOTTED FIXES: hero headline halo + glossy header chips
   ============================================================ */

/* 1. hero h1 carried filter: none !important;
}
html[data-theme="light"][data-theme="light"] .home-hero h1 .icon {
    filter: none !important;
}
html[data-theme="light"] .hero-tagline { text-shadow: none !important; }
html[data-theme="light"] .step-badge { text-shadow: none !important; }

/* 2. req-card header chips (.req-badge) were dark-era glossy gradients —
   flatten to the same tint-chip language as everything else */
html[data-theme="light"][data-theme="light"] .home-wrap .req-badge {
    background: color-mix(in srgb, var(--sc, #2563eb) 13%, #ffffff) !important;
    color: var(--sc, #2563eb) !important;
    border: 1px solid color-mix(in srgb, var(--sc, #2563eb) 30%, #ffffff) !important;
    box-shadow: none !important;
    filter: none !important;
}
html[data-theme="light"] .home-wrap .req-badge .icon { color: var(--sc, #2563eb) !important; }
html[data-theme="light"] .home-wrap .req-title { color: #0f2440 !important; }


/* ============================================================
   v7 COLORFUL SURFACES — "light" is not "white". Every card
   wears a clean pastel of ITS OWN hue (6-10% mixes), ink stays
   dark, borders take the hue. Ordered color, everywhere.
   ============================================================ */

/* section cards: white -> soft hue gradient + hue border */
html[data-theme="light"][data-theme="light"] .dashboard-section {
    background: color-mix(in srgb, var(--sec, #2563eb) 6%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--sec, #2563eb) 26%, #ffffff) !important;
}
/* inner tiles take a firmer sip of the section hue */
html[data-theme="light"][data-theme="light"] .instruction-item,
html[data-theme="light"][data-theme="light"] .sd-res-tile,
html[data-theme="light"][data-theme="light"] .timeline-item {
    background: color-mix(in srgb, var(--sec, #2563eb) 9%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--sec, #2563eb) 24%, #ffffff) !important;
}

/* exam history rows: pass = mint surface, fail = rose surface (color with meaning) */
/* history rows: clean WHITE surface, no left status bar (removed per request —
   the FAILED/PASSED badge + score ring already show status). */
html[data-theme="light"][data-theme="light"] .hx-row {
    background: #ffffff !important;
    border: 1px solid #e6ebf2 !important;
    border-left: 1px solid #e6ebf2 !important;
}
html[data-theme="light"] .hx-ring span { background: #ffffff !important; }

/* rankings: amber-cream card headers + tiles */
html[data-theme="light"][data-theme="light"] .ranking-card {
    background: #fffbf0 !important;
    border-color: #f3d9ac !important;
}
html[data-theme="light"][data-theme="light"] .ranking-stats-grid .stat-item:nth-child(n) {
    background: #fffdf6 !important;
    border-color: #f3e3c2 !important;
}
html[data-theme="light"][data-theme="light"] .rankings-section .podium-item {
    background: color-mix(in srgb, var(--mc, #d97706) 6%, #ffffff) !important;
}

/* admin stat cards: each wears its own pastel */
html[data-theme="light"][data-theme="light"] .stats-grid .stat-card {
    background: color-mix(in srgb, var(--sc, #2563eb) 7%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--sc, #2563eb) 28%, #ffffff) !important;
    border-top: 3px solid var(--sc, #2563eb) !important;
}
html[data-theme="light"][data-theme="light"] .actions-grid .action-card {
    background: color-mix(in srgb, var(--sc, #2563eb) 6%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--sc, #2563eb) 22%, #ffffff) !important;
}

/* landing step/req cards drink their hue too */
html[data-theme="light"][data-theme="light"] .home-wrap .step-card,
html[data-theme="light"][data-theme="light"] .home-wrap .req-card {
    background: color-mix(in srgb, var(--sc, #2563eb) 6%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--sc, #2563eb) 25%, #ffffff) !important;
}

/* auth card: blue->violet whisper gradient */
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-card {
    background: #ffffff !important;
}

/* welcome banner: two-hue soft gradient */
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header {
    background:
        transparent,
        transparent,
        #ffffff !important;
}

/* CANVAS: lavender-blush — tested against warm-ivory/mint/sky on the live page.
   Chosen because NO section card uses lavender (all five pastels pop against it)
   and it flatters the indigo→violet brand. Soft, eye-catchy, never harsh. */
html[data-theme="light"][data-theme="light"][data-theme="light"] { background: #efe9fa !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] body {
    background:
        transparent,
        transparent,
        transparent,
        #fbf9fe !important;
}

/* footer: quiet indigo wash */
html[data-theme="light"][data-theme="light"] .footer {
    background: #f2f5fb !important;
    border-top: 2px solid rgba(37, 99, 235, .22) !important;
}

/* scoreboard + congrats surfaces */
html[data-theme="light"][data-theme="light"] .sb-card { background: #ffffff !important; }
html[data-theme="light"][data-theme="light"] .cg-card { background: #ffffff !important; }


/* ============================================================
   v8 — exam RESULTS / REVIEW / TAKE pages still had dark slabs
   baked in their template <style> DARK PASS. Light overrides.
   ============================================================ */

/* --- exam_results: the score-summary box was navy #12253f --- */
html[data-theme="light"][data-theme="light"] .result-display {
    background: #ffffff !important;
    border: 1px solid #ddd4f2 !important;
    color: #0f2440 !important;
}
html[data-theme="light"] .result-details h2 { color: #0f2440 !important; }
html[data-theme="light"] .result-message.fail { color: #be123c !important; }
html[data-theme="light"] .result-message.success { color: #15803d !important; }
html[data-theme="light"][data-theme="light"] .breakdown-item { background: #ffffff !important; border: 1px solid #dde5ef !important; }
html[data-theme="light"] .breakdown-label { color: #64748b !important; }
html[data-theme="light"] .breakdown-value { color: #0f2440 !important; }
html[data-theme="light"] .breakdown-item.highlight { background: #ffffff !important; border-color:#ddd4f2 !important; }

/* --- exam_review: question-card was navy; make it white w/ hue accent --- */
html[data-theme="light"][data-theme="light"] .review-header {
    background: #ffffff !important;
    border: 1px solid #d6e0f5 !important;
}
html[data-theme="light"][data-theme="light"] .summary-card,
html[data-theme="light"][data-theme="light"] .questions-section {
    background: #ffffff !important; border: 1px solid #dde5ef !important;
}
html[data-theme="light"][data-theme="light"] .question-card {
    background: #ffffff !important;
    border: 1px solid #dde5ef !important;
    color: #0f2440 !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"] .question-card.correct { border-left: 4px solid #16a34a !important; }
html[data-theme="light"][data-theme="light"] .question-card.incorrect { border-left: 4px solid #be123c !important; }
html[data-theme="light"][data-theme="light"] .question-card .question-text,
html[data-theme="light"][data-theme="light"] .question-card .question-content,
html[data-theme="light"][data-theme="light"] .question-card p { color: #0f2440 !important; background: transparent !important; }
html[data-theme="light"] .question-header { background: transparent !important; border-bottom: 1px solid #eef2f8 !important; }
html[data-theme="light"][data-theme="light"] .option-item {
    background: #f7f9fc !important; border: 1px solid #dde5ef !important; color: #33465e !important;
}
html[data-theme="light"] .option-item.correct-option { background: #f0fdf4 !important; border-color:#86efac !important; }
html[data-theme="light"] .option-item.user-selected:not(.correct-option) { background:#fef2f2 !important; border-color:#fca5a5 !important; }
html[data-theme="light"] .option-text, html[data-theme="light"] .option-item * { color: #33465e !important; }
html[data-theme="light"] .option-item.correct-option .option-text { color:#166534 !important; }
html[data-theme="light"] .answer-section.user-answer { background:#eff6ff !important; border:1px solid #bfdbfe !important; }
html[data-theme="light"] .answer-section.correct-answer { background:#f0fdf4 !important; border:1px solid #bbf7d0 !important; }
html[data-theme="light"] .answer-label { color:#64748b !important; }
html[data-theme="light"] .answer-value { color:#0f2440 !important; }
html[data-theme="light"] .answer-section.correct-answer .answer-value { color:#166534 !important; }

/* --- take_exam: VIBRANT header (user wanted "aro joss color") — rich indigo→blue→cyan
       gradient with white timer, readable on the color. --- */
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-header {
    background: #4f46e5 !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
/* .exam-header is shared by take_exam AND exam_results — make every heading/text on the
   gradient white (results uses .exam-info h1, take_exam uses .exam-title h1) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-header h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-header .exam-info h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-title h1 { color: #ffffff !important; text-shadow: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-header h1 .icon,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-title h1 .icon { color: #ffffff !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-header .exam-info p { color: rgba(255,255,255,.92) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-timer .timer-display,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-timer #timer {
    background: rgba(255,255,255,.94) !important;   /* frosted white chip on the gradient */
    border: 1px solid rgba(255,255,255,.7) !important;
    color: #1e3a8a !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] #timeRemaining { color: #1d4ed8 !important; text-shadow: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-timer p { color: #ffffff !important; opacity: .95; letter-spacing: 1.5px; text-shadow: none; }
/* selected option: richer blue tint so the chosen answer pops */
html[data-theme="light"][data-theme="light"][data-theme="light"] .option-label.selected,
html[data-theme="light"][data-theme="light"][data-theme="light"] .option-label:has(input:checked) {
    background: #eaf1ff !important;
    border-color: #2f6fed !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* ============================================================
   v9 — RESOURCES colorful type-hued cards (light) + vibrancy boost
   File = amber, Link = teal. Beats the section-hue tint (triple hammer).
   ============================================================ */
html[data-theme="light"] .sd-res-tile.res-file { --rh:#d97706; --rh2:#ea580c; }
html[data-theme="light"] .sd-res-tile.res-link { --rh:#0d9488; --rh2:#0891b2; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-tile {
    background: color-mix(in srgb, var(--rh) 11%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--rh) 30%, #ffffff) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-tile:hover {
    border-color: var(--rh) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .sd-res-ic {
    background: var(--rh) !important;
    color: #ffffff !important; border: none !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .sd-res-main b { color: var(--text) !important; }
html[data-theme="light"] .sd-res-desc { color: var(--text-muted) !important; }
html[data-theme="light"] .sd-res-badge {
    color: var(--rh) !important;
    background: color-mix(in srgb, var(--rh) 13%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--rh) 32%, #ffffff) !important;
}
html[data-theme="light"] .sd-res-cta {
    color: var(--rh) !important;
    background: color-mix(in srgb, var(--rh) 11%, #ffffff) !important;
    border: 1px solid color-mix(in srgb, var(--rh) 30%, #ffffff) !important;
}
html[data-theme="light"] .sd-res-tile:hover .sd-res-cta { background: var(--rh) !important; color: #ffffff !important; }

/* --- vibrancy boost: section headings show more hue, accent bars brighter --- */
html[data-theme="light"] .dashboard-section h2,
html[data-theme="light"] .rankings-section .section-header h2 {
    background: #0f2440 !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
html[data-theme="light"] .dashboard-section::before {
    width: 5px !important;
    background: var(--sec, #2563eb) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .dashboard-section {
    border-top: 3px solid color-mix(in srgb, var(--sec, #2563eb) 70%, transparent) !important;
}

/* --- kill the heavy black podium shadow in light (was rgba(0,0,0,.35) blob) --- */
html[data-theme="light"] .rankings-section .podium-item,
html[data-theme="light"] .rankings-section .podium-item.podium-1,
html[data-theme="light"] .rankings-section .podium-item.podium-2,
html[data-theme="light"] .rankings-section .podium-item.podium-3 {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"] .rankings-section .podium-item::before { box-shadow: none !important; }
html[data-theme="light"] .rankings-section .podium-item:hover,
html[data-theme="light"] .rankings-section .podium-item.podium-1:hover,
html[data-theme="light"] .rankings-section .podium-item.podium-2:hover,
html[data-theme="light"] .rankings-section .podium-item.podium-3:hover {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* v9 fix: force resource icon WHITE + badge/cta hue (beat legacy .sd-res-ic teal & .sd-res-tile span muted) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-ic { color:#ffffff !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-ic .icon { color:#ffffff !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-badge { color: var(--rh) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-cta { color: var(--rh) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .sd-res-tile:hover .sd-res-cta { color:#ffffff !important; }

/* --- exam_review summary tiles: values were WHITE (dark-pass leak) → invisible on light --- */
html[data-theme="light"] .summary-value { color: #0f2440 !important; text-shadow: none !important; }
html[data-theme="light"] .summary-value.score-value { color: #2563eb !important; text-shadow: none !important; }
html[data-theme="light"] .summary-details { color: #64748b !important; }
html[data-theme="light"] .summary-label { color: #64748b !important; }
html[data-theme="light"] .summary-status.passed { color: #15803d !important; }
html[data-theme="light"] .summary-status.failed { color: #be123c !important; }
html[data-theme="light"][data-theme="light"] .summary-item {
    background: #ffffff !important;
    border: 1px solid #dbe6f5 !important;
}

/* --- review question text: keep it DARK in light mode (dark-pass forced it light) --- */
html[data-theme="light"] .question-text h4,
html[data-theme="light"] .question-text p,
html[data-theme="light"] .question-text * { color: #0f2440 !important; }

/* --- exam_review header title: dark-pass gave it a pale cyan gradient (#eaf4ff→#00d4ff),
       invisible on the light header. Use the readable brand gradient. --- */
html[data-theme="light"] .rh-title {
    background: #2563eb !important;
    -webkit-background-clip: text !important; background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
html[data-theme="light"] .rh-eyebrow { color: #1d4ed8 !important; text-shadow: none !important; }
html[data-theme="light"] .rh-eyebrow .icon { color: #2563eb !important; }
html[data-theme="light"] .exam-description { color: #64748b !important; }
html[data-theme="light"] .review-header .back-btn {
    color: #1d4ed8 !important; background: #eef3ff !important; border: 1px solid #c7d7f7 !important;
}

/* --- rankings podium rank number: was amber (#b45309) on a blue circle → unreadable.
       White number on the blue circle = clean high contrast (medal icon shows the rank). --- */
html[data-theme="light"][data-theme="light"] .rankings-section .podium-number {
    color: #ffffff !important; text-shadow: none !important;
}

/* ============================================================
   v10 — HERO background refinement (user: "bg color aro sundor").
   A balanced 4-corner pastel wash (sky · lavender · blush · mint)
   on a soft paper base, so the hero reads even & premium instead
   of one harsh cyan corner. Blob aurora softened to a whisper. */
html[data-theme="light"][data-theme="light"] .home-hero {
    background:
        transparent,
        transparent,
        transparent,
        transparent,
        #f7fbff !important;
}
html[data-theme="light"][data-theme="light"] .home-hero .aurora { opacity: .16 !important; }
/* keep a gentle white core behind the headline for crisp reading */
html[data-theme="light"][data-theme="light"] .home-hero .scrim {
    background: transparent !important;
}

/* ============================================================
   FLAT LIGHT — remove the remaining gradient/colour-wash accents
   that live in template-inline / base CSS (not in this file).
   Light theme = solids only (dark theme untouched).
   ============================================================ */
/* hero: drop the blurred colour blobs + any divider bar → truly flat */
html[data-theme="light"] .home-hero .aurora { display: none !important; }
html[data-theme="light"] .home-hero h1 + span,
html[data-theme="light"] .hero-divider, html[data-theme="light"] .home-hero hr { background: #cdd7e5 !important; }
/* accent strips / progress fills / rings → solid brand blue */
html[data-theme="light"][data-theme="light"] .progress-fill { background: #2563eb !important; box-shadow: none !important; }
html[data-theme="light"][data-theme="light"] .question-card::before,
html[data-theme="light"][data-theme="light"] .ranking-card::before { background: #2563eb !important; animation: none !important; box-shadow: none !important; }
html[data-theme="light"][data-theme="light"] .option-letter { background: #2f6fed !important; box-shadow: none !important; }
html[data-theme="light"][data-theme="light"] .question-number .q-number,
html[data-theme="light"][data-theme="light"] .q-number { background: #2563eb !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-number { background: #2563eb !important; }
/* result score ring → solid semantic */
html[data-theme="light"][data-theme="light"] .score-circle.pass { background: #16a34a !important; box-shadow: none !important; }
html[data-theme="light"][data-theme="light"] .score-circle.fail { background: #dc2626 !important; box-shadow: none !important; }
/* primary buttons → solid brand blue; start-exam solid green (kept meaningful) */
html[data-theme="light"][data-theme="light"] .btn-primary,
html[data-theme="light"][data-theme="light"] .auth-button,
html[data-theme="light"][data-theme="light"] .auth-card button[type="submit"],
html[data-theme="light"][data-theme="light"] .cyber-button.btn-full,
html[data-theme="light"][data-theme="light"] .cg-btn-primary,
html[data-theme="light"][data-theme="light"] .footer-btn,
html[data-theme="light"][data-theme="light"] .review-actions .btn-primary,
html[data-theme="light"][data-theme="light"] .exam-container .next-btn,
html[data-theme="light"][data-theme="light"] .hx-btn,
html[data-theme="light"][data-theme="light"] .res-btn {
    background: #2563eb !important; background-size: auto !important; box-shadow: none !important; color: #ffffff !important;
}
html[data-theme="light"][data-theme="light"] .btn-start-exam { background: #16a34a !important; box-shadow: none !important; }

/* flat: hero/auth headline as one clean brand-blue solid (script left it teal); divider bar solid */
html[data-theme="light"][data-theme="light"] .home-hero h1,
html[data-theme="light"][data-theme="light"] .auth-header h2 {
    background: none !important; color: #1d4ed8 !important; -webkit-text-fill-color: #1d4ed8 !important;
}
html[data-theme="light"][data-theme="light"] .home-hero h1 .icon { color: #1d4ed8 !important; }
html[data-theme="light"][data-theme="light"] .hero-tagline .bar { background: #2563eb !important; }

/* eye-catchy (but flat/solid) surface tints — user: "white na rekhe eyecatchy color add" */
html[data-theme="light"][data-theme="light"] .exam-card-compact {
    background: #eff6ff !important;                 /* soft solid blue, not white */
    border: 1px solid #bfdbfe !important;
}
html[data-theme="light"][data-theme="light"] .exam-card-compact.available {
    background: #eefdf3 !important;                 /* available = soft mint */
    border: 1px solid #b7ebc6 !important;
}
html[data-theme="light"][data-theme="light"] .exam-card-compact .meta-item {
    background: #ffffff !important; border: 1px solid #dbe7f5 !important;
}

/* ============================================================
   NO GLOW in light — neutralise every coloured box-shadow / halo
   that leaks from base or template-inline CSS. Flat neutral lift only.
   ============================================================ */
html[data-theme="light"][data-theme="light"][data-theme="light"] .question-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card-compact,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-header,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-section,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header,
html[data-theme="light"][data-theme="light"][data-theme="light"] .summary-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .summary-item,
html[data-theme="light"][data-theme="light"][data-theme="light"] .questions-section,
html[data-theme="light"][data-theme="light"][data-theme="light"] .review-header,
html[data-theme="light"][data-theme="light"][data-theme="light"] .result-display,
html[data-theme="light"][data-theme="light"][data-theme="light"] .ranking-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .ranking-section-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .leaderboard-section-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-item,
html[data-theme="light"][data-theme="light"][data-theme="light"] .stat-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .action-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .history-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .hx-row,
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .set-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .res-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .arch-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-wrap .step-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-wrap .req-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .option-label,
html[data-theme="light"][data-theme="light"][data-theme="light"] .option-item,
html[data-theme="light"][data-theme="light"][data-theme="light"] .meta-item,
html[data-theme="light"][data-theme="light"][data-theme="light"] .score-circle,
html[data-theme="light"][data-theme="light"][data-theme="light"] .id-chip,
html[data-theme="light"][data-theme="light"][data-theme="light"] .hx-ring,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-start-exam,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-primary,
html[data-theme="light"][data-theme="light"][data-theme="light"] .nav-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .review-btn {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    filter: none !important;
    text-shadow: none !important;
}
/* hover: keep a slightly firmer NEUTRAL lift, still no coloured glow */
html[data-theme="light"][data-theme="light"][data-theme="light"] .question-card:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card-compact:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-section:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .ranking-card:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-item:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .stat-card:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .action-card:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .hx-row:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .step-card:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .option-label:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-start-exam:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-primary:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .nav-btn:hover {
    box-shadow: 0 3px 8px rgba(23,43,66,.10) !important;
    filter: none !important;
}
/* headings / hero / brand text: no glow */
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .rh-title,
html[data-theme="light"][data-theme="light"][data-theme="light"] #timeRemaining,
html[data-theme="light"][data-theme="light"][data-theme="light"] .performer-name,
html[data-theme="light"][data-theme="light"][data-theme="light"] .summary-value { text-shadow: none !important; }

/* remaining leaked glows: progress card, review panel, submit/action buttons */
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-progress,
html[data-theme="light"][data-theme="light"][data-theme="light"] .review-screen,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-success,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-large,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-info,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-secondary,
html[data-theme="light"][data-theme="light"][data-theme="light"] .footer-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-btn-primary,
html[data-theme="light"][data-theme="light"][data-theme="light"] .prev-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .next-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .view-answers-btn {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    filter: none !important;
    text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .btn-success:hover,
html[data-theme="light"][data-theme="light"][data-theme="light"] .footer-btn:hover {
    box-shadow: 0 3px 8px rgba(23,43,66,.10) !important;
}

/* last two leaked glows: status badge (green) + podium rank number (cyan) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .status-badge,
html[data-theme="light"][data-theme="light"][data-theme="light"] .status-badge.available-now,
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-number {
    box-shadow: none !important; text-shadow: none !important;
}

/* welcome banner: eye-catchy SOLID brand-blue block (flat — no gradient, no glow) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header {
    background: #2563eb !important;
    border: 1px solid #2563eb !important;
    border-left: 6px solid #1e3a8a !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header h1 *,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header p,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header .dashboard-subtitle {
    color: #ffffff !important; text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header h1 .icon { color: #ffffff !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header p { opacity: .92; }

/* history row left status bar (::before) removed in light per request */
html[data-theme="light"][data-theme="light"][data-theme="light"] .hx-row::before { display: none !important; }

/* colourful hero headline — each word a solid brand colour (flat, no gradient/glow).
   Mirrors the old teal→blue→violet→rose sweep, but as discrete solid words. */
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 .hw1 { color: #0e7490 !important; -webkit-text-fill-color: #0e7490 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 .hw2 { color: #1d4ed8 !important; -webkit-text-fill-color: #1d4ed8 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 .hw3 { color: #7c3aed !important; -webkit-text-fill-color: #7c3aed !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 .hw4 { color: #be185d !important; -webkit-text-fill-color: #be185d !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 .icon { color: #0e7490 !important; -webkit-text-fill-color: #0e7490 !important; }
/* colourful accents around the headline */
html[data-theme="light"][data-theme="light"] .hero-eyebrow .dot { background: #db2777 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .hero-tagline .bar { background: #7c3aed !important; }

/* hero headline: kill the dark drop-shadow halo + hue animation + icon cyan glow (index.html inline) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 {
    filter: none !important; animation: none !important; text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .home-hero h1 .icon { filter: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .hero-tagline { text-shadow: none !important; }

/* LOGIN/REGISTER label band: auth-portals.css puts a blue→#00ff41 gradient WASH on
   .auth-label::before (opacity .1) + gradient underlines on [for] labels. Kill in light. */
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-label::before { display: none !important; background: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-label,
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-label[for="nsi_id"],
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-label[for="username"],
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-label[for="password"] {
    background-image: none !important;
    background: #e7eefc !important;
    color: #1e3a8a !important;
    -webkit-text-fill-color: #1e3a8a !important;
    text-shadow: none !important;
}

/* auth page (login/register): flatten all remaining auth-portals.css gradients/effects in light */
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-container::before { display: none !important; } /* green animated grid overlay */
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-button::before { display: none !important; }   /* button shimmer sweep */
html[data-theme="light"][data-theme="light"][data-theme="light"] .footer-link-primary {
    background: #eff5ff !important; border: 1px solid #cfe0f5 !important; color: #1d4ed8 !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .footer-link-secondary {
    background: #f1f5f9 !important; border: 1px solid #e2e8f0 !important; color: #475569 !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .register-portal .auth-card {
    border-image: none !important; border: 1px solid #dde5ef !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .auth-header h2,
html[data-theme="light"][data-theme="light"][data-theme="light"] .register-portal .auth-header h2 {
    background: none !important; color: #1d4ed8 !important; -webkit-text-fill-color: #1d4ed8 !important; text-shadow: none !important;
}

/* landing: SCROLL indicator + section subtitle were near-invisible (faint --muted) → readable slate */
html[data-theme="light"][data-theme="light"] .scroll-ind,
html[data-theme="light"][data-theme="light"] .home-wrap .scroll-ind { color: #475569 !important; }
html[data-theme="light"][data-theme="light"] .home-wrap .sec-head p,
html[data-theme="light"][data-theme="light"] .home-section .sec-head p,
html[data-theme="light"][data-theme="light"] .sec-head p { color: #475569 !important; }

/* ============================================================
   ADMIN LIVE SCOREBOARD — the whole page uses .sb-wrap scoped DARK tokens
   (--card dark gradient, --ink light text). Repoint them to light + flat.
   ============================================================ */
html[data-theme="light"][data-theme="light"] .sb-wrap {
    --ink: #0f2440 !important;
    --muted: #64748b !important;
    --line: #dde5ef !important;
    --card: #ffffff !important;
}
html[data-theme="light"][data-theme="light"] .sb-controls,
html[data-theme="light"][data-theme="light"] .sb-card,
html[data-theme="light"][data-theme="light"] .sb-pod {
    background: #ffffff !important; border: 1px solid #dde5ef !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"] .sb-controls select {
    background: #f6f8fb !important; color: #0f2440 !important; border: 1px solid #dde5ef !important;
}
html[data-theme="light"][data-theme="light"] .sb-controls label,
html[data-theme="light"][data-theme="light"] .sb-updated,
html[data-theme="light"][data-theme="light"] .sb-pod .sb-pod-meta { color: #64748b !important; }
html[data-theme="light"][data-theme="light"] .sb-pod b,
html[data-theme="light"][data-theme="light"] .sb-table tbody td { color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .sb-head h1 {
    background: none !important; color: #1d4ed8 !important; -webkit-text-fill-color: #1d4ed8 !important;
}
html[data-theme="light"][data-theme="light"] .sb-table thead th {
    background: #eef2f8 !important; color: #1d4ed8 !important; border-bottom: 1px solid #dde5ef !important;
}
html[data-theme="light"][data-theme="light"] .sb-table tbody td { border-bottom: 1px solid #e6ebf2 !important; }
html[data-theme="light"][data-theme="light"] .sb-table tbody tr:hover { background: #f2f7ff !important; }
html[data-theme="light"][data-theme="light"] .sb-pod-score { background: #eef4ff !important; color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .sb-back { color: #1d4ed8 !important; border: 1px solid #dde5ef !important; }
html[data-theme="light"][data-theme="light"] .sb-back:hover { color: #1e3a8a !important; border-color: #93c5fd !important; }
/* no glow on scoreboard icons / live dot */
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-head h1 .icon,
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-pod .icon { filter: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-live-dot { box-shadow: none !important; }

/* ============================================================
   ADMIN settings / resources / archived pages — scoped DARK tokens
   (.settings-wrap/.res-wrap/.arch-wrap: --card dark gradient, --ink light).
   Repoint to light + flatten (no gradient/glow).
   ============================================================ */
html[data-theme="light"][data-theme="light"] .settings-wrap,
html[data-theme="light"][data-theme="light"] .res-wrap,
html[data-theme="light"][data-theme="light"] .arch-wrap {
    --ink: #0f2440 !important; --muted: #64748b !important; --line: #dde5ef !important; --card: #ffffff !important;
}
html[data-theme="light"][data-theme="light"] .set-card,
html[data-theme="light"][data-theme="light"] .res-card,
html[data-theme="light"][data-theme="light"] .arch-card,
html[data-theme="light"][data-theme="light"] .set-nav-item,
html[data-theme="light"][data-theme="light"] .set-link {
    background: #ffffff !important; border: 1px solid #dde5ef !important; box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"] .settings-wrap input, html[data-theme="light"][data-theme="light"] .settings-wrap select, html[data-theme="light"][data-theme="light"] .settings-wrap textarea,
html[data-theme="light"][data-theme="light"] .res-wrap input, html[data-theme="light"][data-theme="light"] .res-wrap select, html[data-theme="light"][data-theme="light"] .res-wrap textarea,
html[data-theme="light"][data-theme="light"] .arch-wrap input, html[data-theme="light"][data-theme="light"] .arch-wrap select, html[data-theme="light"][data-theme="light"] .arch-wrap textarea {
    background: #ffffff !important; color: #0f2440 !important; border: 1px solid #dde5ef !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .settings-wrap h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .res-wrap h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .arch-wrap h1 {
    background: none !important; color: #1d4ed8 !important; -webkit-text-fill-color: #1d4ed8 !important;
}
html[data-theme="light"][data-theme="light"] .set-title, html[data-theme="light"][data-theme="light"] .res-title, html[data-theme="light"][data-theme="light"] .arch-title { color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .settings-wrap label, html[data-theme="light"][data-theme="light"] .res-wrap label, html[data-theme="light"][data-theme="light"] .arch-wrap label { color: #33465e !important; }
html[data-theme="light"][data-theme="light"] .settings-wrap .set-hint, html[data-theme="light"][data-theme="light"] .settings-wrap small, html[data-theme="light"][data-theme="light"] .res-wrap small { color: #64748b !important; }
/* icon badges (gradient) → solid tint chip */
html[data-theme="light"][data-theme="light"][data-theme="light"] .set-badge,
html[data-theme="light"][data-theme="light"][data-theme="light"] .res-badge,
html[data-theme="light"][data-theme="light"][data-theme="light"] .arch-badge {
    background: #eef4ff !important; border: 1px solid #dbe6f5 !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .set-badge .icon,
html[data-theme="light"][data-theme="light"][data-theme="light"] .res-badge .icon,
html[data-theme="light"][data-theme="light"][data-theme="light"] .arch-badge .icon { color: #2563eb !important; }
/* primary gradient buttons → solid blue (flat) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .set-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .res-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .arch-btn,
html[data-theme="light"][data-theme="light"][data-theme="light"] .settings-wrap button[type="submit"],
html[data-theme="light"][data-theme="light"][data-theme="light"] .res-wrap button[type="submit"] {
    background: #2563eb !important; color: #ffffff !important; box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* admin_results "Top Performers" podium (admin_results.css dark gradients) → light.
   :not(.dashboard-section) so the student-dashboard rankings section keeps its tint. */
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) {
    background: #ffffff !important; border: 1px solid #dde5ef !important; box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section)::before,
html[data-theme="light"][data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section)::after { display: none !important; }
html[data-theme="light"][data-theme="light"] .podium-section .podium-card {
    background: #f6f9fd !important; border: 1px solid #dde5ef !important; box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-section .podium-card::before { display: none !important; }
html[data-theme="light"][data-theme="light"] .podium-card .user-name { color: #0f2440 !important; text-shadow: none !important; }
html[data-theme="light"][data-theme="light"] .podium-card .nsi-id,
html[data-theme="light"][data-theme="light"] .podium-card .wing-name,
html[data-theme="light"][data-theme="light"] .podium-card .exams { color: #64748b !important; }
html[data-theme="light"][data-theme="light"] .podium-card .score { color: #2563eb !important; }
html[data-theme="light"][data-theme="light"] .podium-card .rank-number { color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) h2 { color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) h2 .icon,
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) .trophy-icon .icon { color: #d97706 !important; filter: none !important; }
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) .section-description { color: #64748b !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-card .medal .icon { filter: none !important; }
/* remaining performers list rows (if dark) */
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) .performer-item,
html[data-theme="light"][data-theme="light"] .rankings-section:not(.dashboard-section) .ranking-row {
    background: #ffffff !important; border: 1px solid #e6ebf2 !important; color: #0f2440 !important;
}

/* admin_results .podium-section had a dark gradient background-IMAGE → light panel */
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-section {
    background: #f1f5f9 !important; background-image: none !important; border: 1px solid #e2e8f0 !important;
    border-radius: 16px; padding: 1.25rem !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .podium-card .score-display {
    background: #eaf1ff !important; background-image: none !important; border: 1px solid #dbe6f5 !important;
}
html[data-theme="light"][data-theme="light"] .podium-card .exams { color: #64748b !important; }

/* admin users action buttons: solid colour-coded pills with white icon + label (flat) */
html[data-theme="light"][data-theme="light"] .action-buttons .btn-info { background:#0284c7 !important; color:#fff !important; border:1px solid #0284c7 !important; }
html[data-theme="light"][data-theme="light"] .action-buttons .btn-secondary { background:#64748b !important; color:#fff !important; border:1px solid #64748b !important; }
html[data-theme="light"][data-theme="light"] .action-buttons .btn-primary { background:#2563eb !important; color:#fff !important; border:1px solid #2563eb !important; }
html[data-theme="light"][data-theme="light"] .action-buttons .btn-warning { background:#d97706 !important; color:#fff !important; border:1px solid #d97706 !important; }
html[data-theme="light"][data-theme="light"] .action-buttons .btn-danger { background:#dc2626 !important; color:#fff !important; border:1px solid #dc2626 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .action-buttons .btn-small,
html[data-theme="light"][data-theme="light"][data-theme="light"] .action-buttons .btn-small .icon,
html[data-theme="light"][data-theme="light"][data-theme="light"] .action-buttons .btn-lbl { color:#ffffff !important; }
html[data-theme="light"][data-theme="light"] .action-buttons .btn-small { box-shadow:0 1px 3px rgba(23,43,66,.07) !important; }

/* ---------------------------------------------------------------------------
   .exam-header is THREE different things: the hero banner on take_exam and
   exam_results (which the indigo rule above is for) and a plain title+buttons
   row inside each card on /admin/exams. The indigo rule was painting that admin
   row as a full-width violet band with unreadable text on it. Scope it back out.
   Dark is untouched: there .exam-header has no background at all.
   --------------------------------------------------------------------------- */
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card .exam-header,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exams-container .exam-header {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card .exam-header h1,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card .exam-header h2,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card .exam-header h3,
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card .exam-title h3 {
    color: var(--text) !important;
    text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .exam-card .exam-header .icon {
    color: var(--accent) !important;
}
/* the status pill on an admin exam card: readable on the white card */
html[data-theme="light"][data-theme="light"] .exam-card .status-badge.inactive,
html[data-theme="light"][data-theme="light"] .exam-card .status-badge:not(.active) {
    background: var(--card-2) !important;
    color: var(--text-muted) !important;
    border: 1px solid var(--border) !important;
}
html[data-theme="light"][data-theme="light"] .exam-card .status-badge.active {
    background: #e8f7ee !important;
    color: #15803d !important;
    border: 1px solid #bbf7d0 !important;
}

/* ---------------------------------------------------------------------------
   Coverage gaps found by a full sweep of the admin pages: selector families
   that live in admin_results.css / admin-dashboard-enhanced.css and were never
   mentioned here, so they kept their dark-theme paint in light.
   --------------------------------------------------------------------------- */

/* /admin/results — "Other Top Performers" panel and its cards */
html[data-theme="light"][data-theme="light"] .other-performers,
html[data-theme="light"][data-theme="light"] .performer-card {
    background: var(--card) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"] .other-performers { background: var(--card-2) !important; }
html[data-theme="light"][data-theme="light"] .other-performers h3,
html[data-theme="light"][data-theme="light"] .performer-card .performer-name,
html[data-theme="light"][data-theme="light"] .performer-card b { color: var(--text) !important; }
html[data-theme="light"][data-theme="light"] .performer-card .performer-meta,
html[data-theme="light"][data-theme="light"] .performer-card small,
html[data-theme="light"][data-theme="light"] .performer-card span { color: var(--text-muted) !important; }

/* /admin/results — the base .rank-badge is neon green on white */
html[data-theme="light"][data-theme="light"] .rank-badge {
    background: color-mix(in srgb, var(--accent) 12%, var(--card)) !important;
    color: var(--accent) !important;
    border: 1px solid var(--border-strong, var(--border)) !important;
    text-shadow: none !important;
    box-shadow: none !important;
}
/* keep the podium colours, just make 2nd/3rd readable on white */
html[data-theme="light"][data-theme="light"][data-theme="light"] .top-performers .rank-badge.silver {
    background: #f1f5f9 !important; color: #475569 !important; border-color: #94a3b8 !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .top-performers .rank-badge.bronze {
    background: #fdf1e3 !important; color: #92400e !important; border-color: #d0a373 !important;
}

/* /admin/dashboard — the hero banner kept a cyan sweep and a green radial glow */
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header::before,
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-header::after {
    display: none !important;
}

/* /admin/dashboard — Live Scoreboard pill: flat brand tint, no gradient, no glow */
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-live-link {
    background: color-mix(in srgb, var(--accent) 12%, var(--card)) !important;
    background-image: none !important;
    border: 1px solid var(--border-strong, var(--border)) !important;
    color: var(--accent) !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .sb-live-link:hover {
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}

/* scheduler rows are built by JS with inline styles on the row only — the row
   itself we cannot reach, but its inputs and labels we can */
html[data-theme="light"][data-theme="light"][data-theme="light"] .scheduler-row,
html[data-theme="light"][data-theme="light"][data-theme="light"] .scheduler-item {
    background: var(--card-2) !important;
    border: 1px solid var(--border) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .scheduler-row label,
html[data-theme="light"][data-theme="light"][data-theme="light"] .scheduler-item label {
    color: var(--text-muted) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .scheduler-row input,
html[data-theme="light"][data-theme="light"][data-theme="light"] .scheduler-item input {
    background: var(--card) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    color-scheme: light !important;
}

/* last gradients still painting on the light admin pages (light must stay FLAT) */
html[data-theme="light"][data-theme="light"][data-theme="light"] .score-display {
    background: var(--card-2) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .score-display,
html[data-theme="light"][data-theme="light"][data-theme="light"] .score-display .score,
html[data-theme="light"][data-theme="light"][data-theme="light"] .score-display span { color: var(--text) !important; text-shadow: none !important; }

html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge {
    background-image: none !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge.difficulty-easy   { background: #e8f7ee !important; color: #15803d !important; border: 1px solid #bbf7d0 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge.difficulty-medium { background: #fdf3e2 !important; color: #b45309 !important; border: 1px solid #fcd9a4 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge.difficulty-hard   { background: #fdeef2 !important; color: #be123c !important; border: 1px solid #fbc7d4 !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge.difficulty-unseen,
html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge.difficulty-image,
html[data-theme="light"][data-theme="light"][data-theme="light"] .difficulty-badge.difficulty-video  { background: #e7eefc !important; color: #1d4ed8 !important; border: 1px solid #c7d8f7 !important; }

html[data-theme="light"][data-theme="light"][data-theme="light"] .category-card {
    background: var(--card) !important;
    background-image: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .total-questions-display {
    background: var(--accent) !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* ---------------------------------------------------------------------------
   Complete-profile page: its own <style> paints every panel navy (rgba(26,31,58))
   and every field near-black, and none of it was ever overridden for light.
   Flat, token-driven, no gradients, no glows.
   --------------------------------------------------------------------------- */
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .progress-container,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .instructions-section,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .profile-form-card,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .motivation-card {
    background: var(--card) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    backdrop-filter: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .motivation-card::before,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .motivation-card::after,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .progress-bar::after {
    display: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .progress-bar-wrapper {
    background: var(--card-2) !important;
    border: 1px solid var(--border) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .progress-bar {
    background: var(--accent) !important;
    background-image: none !important;
    box-shadow: none !important;
    animation: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .progress-text,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .progress-percentage,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-section-title,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .instructions-title,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .motivation-title,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-label,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .profile-title {
    color: var(--text) !important;
    text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .profile-subtitle,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-help,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-hint,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container small {
    color: var(--text-muted) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-input,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-select {
    background: var(--card) !important;
    color: var(--text) !important;
    border: 1px solid var(--border-strong, var(--border)) !important;
    box-shadow: none !important;
    color-scheme: light !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-input:focus,
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-select:focus {
    border-color: var(--accent) !important;
    background: var(--card) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .form-select option {
    background: #ffffff !important;
    color: var(--text) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .submit-button {
    background: var(--accent) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .submit-button:hover {
    background: #1d4ed8 !important;
    background-image: none !important;
}
/* the blue-tinted notice box above the fields is written inline; give it a flat tint */
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .profile-form-card > div[style*="rgba(0, 191, 255, 0.1)"] {
    background: #e7eefc !important;
    border: 1px solid #c7d8f7 !important;
    color: var(--text) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .profile-icon-wrapper {
    background: var(--accent) !important;
    background-image: none !important;
    box-shadow: none !important;
    animation: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .profile-completion-container .motivation-icon .icon {
    filter: none !important;
    color: var(--accent) !important;
}

/* ---------------------------------------------------------------------------
   Profile-complete-success page: its own <style> is a navy glass card with a
   green glow and gradient text; none of it was ever overridden for light.
   --------------------------------------------------------------------------- */
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .success-card {
    background: var(--card) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    backdrop-filter: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .success-card::before,
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .dashboard-button::before { display: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .success-icon-wrapper {
    background: #e8f7ee !important;
    background-image: none !important;
    box-shadow: none !important;
    animation: none !important;
    border: 1px solid #bbf7d0 !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .success-icon .icon { color: #15803d !important; filter: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .success-title {
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: var(--text) !important;
    color: var(--text) !important;
    text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .success-subtitle { color: var(--text-muted) !important; text-shadow: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .user-info-box {
    background: var(--card-2) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .user-info-item { border-color: var(--border) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .user-info-label { color: var(--text-muted) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .user-info-label .lbl-ic { color: var(--accent) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .user-info-value { color: var(--text) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .dashboard-button {
    background: var(--accent) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .dashboard-button span,
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .dashboard-button .icon { color: #ffffff !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .dashboard-button:hover { background: #1d4ed8 !important; background-image: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .feature-item {
    background: var(--card-2) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .feature-text { color: var(--text) !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .success-container .feature-icon { color: var(--accent) !important; }

/* ---------------------------------------------------------------------------
   Exam-congratulations page: blurred colour orbs, a glowing gradient check badge,
   gradient accent bar and gradient icon chips - all decorative dark-theme
   effects. Light stays flat.
   --------------------------------------------------------------------------- */
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-stage .cg-orb { display: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-ring { display: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-check-badge {
    background: #16a34a !important;
    background-image: none !important;
    box-shadow: none !important;
    animation: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-accent {
    background: var(--accent) !important;
    background-image: none !important;
    animation: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-card {
    background: var(--card) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
    backdrop-filter: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-info {
    background: var(--card-2) !important;
    background-image: none !important;
    border: 1px solid var(--border) !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-info-ic {
    background: color-mix(in srgb, var(--accent) 12%, var(--card)) !important;
    background-image: none !important;
    color: var(--accent) !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-btn-primary {
    background: var(--accent) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(23,43,66,.07) !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-btn-primary:hover { background: #1d4ed8 !important; background-image: none !important; }
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-btn-ghost {
    background: var(--card) !important;
    background-image: none !important;
    border: 1px solid var(--border-strong, var(--border)) !important;
    color: var(--text) !important;
    box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"][data-theme="light"] .cg-title { text-shadow: none !important; }

/* Instructions: .instructions-card is the GRID that lays the three tiles out, not a
   card - the generic card rule painted it white, so the 20px gaps between the
   tinted tiles showed up as white bars. */
html[data-theme="light"][data-theme="light"][data-theme="light"] .dashboard-section .instructions-card {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* ADMIN device-tracking page: styled by static/css/admin_devices.css (.dt-*),
   which is token-driven and already flat in light — no overrides needed here. */

/* ===== Other Top Performers (4th place onwards) on the student dashboard: dark slab -> light card ===== */
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .remaining-performers {
    background: #ffffff !important; border: 1px solid #e6ebf2 !important; box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .remaining-performers h4 {
    background: none !important; -webkit-text-fill-color: #0f2440 !important; color: #0f2440 !important; text-shadow: none !important;
}
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item {
    background: #f6f8fb !important; border: 1px solid #e6ebf2 !important; box-shadow: none !important; color: #0f2440 !important;
}
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item:hover { background: #eef2f8 !important; transform: none !important; }
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item.current-user { background: #fff7e6 !important; border-color: #f5d08a !important; }
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item .performer-name,
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item .info-value { color: #0f2440 !important; }
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item .info-label { color: #64748b !important; opacity: 1 !important; }
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item .performer-rank {
    background: #e7eefc !important; color: #1d4ed8 !important; box-shadow: none !important;
}
html[data-theme="light"][data-theme="light"] .dashboard-section.rankings-section .performer-item .performer-score { color: #15803d !important; }