/* Follow the device automatically, including changes made while the site is open.
   Keep exam diagrams and video artwork in their original colours. */
:root { color-scheme: light; }
@media screen and (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --paper:#121b17; --paper-2:#1e2b24; --paper-3:#2a3930;
    --surface:#1a261f; --ink:#edf2e9; --ink-soft:#c1cec3; --ink-faint:#a6b7a9;
    --green:#85d5a6; --green-deep:#afe7c4; --green-tint:#253d2d;
    --pen:#ffac91; --pen-soft:#422c25; --gold:#e7bf73; --line:#415247;
    --action:#286346; --action-hover:#347c57; --danger:#a53823;
    --shadow:0 2px 18px #0003; --shadow-lg:0 12px 40px #0005;
  }
  :root header { background:rgba(18,27,23,.94); }
  :root input, :root select, :root textarea, :root button { color:inherit; }
  :root input::placeholder, :root textarea::placeholder { color:var(--ink-faint); opacity:1; }
  :root :focus-visible { outline:3px solid var(--green); outline-offset:3px; }
  :root .searchbar, :root .sheet, :root .subj-card, :root .filters,
  :root .paper-card, :root .feat, :root .qcard, :root .answer,
  :root .paper-instructions, :root .login-card, :root .auth-card,
  :root .btn-ghost, :root .card, :root .qrow-actions select,
  :root .codes code, :root .chip-btn, :root .vrow,
  :root .method-seg button.on, :root .imp-ta, :root .pv-q,
  :root .image-editor, :root .stat-tile, :root .ufilter button,
  :root .finder, :root .paper-row, :root .plan-card,
  :root .study-table, :root .seg button, :root .act-close, :root .act-mini div {
    background:var(--surface);
  }
  :root .field input:focus, :root .field select:focus, :root .field textarea:focus,
  :root .auth-card input:focus, :root .redeem-form input:focus { background:var(--surface); }
  :root .redeem-form input { color:var(--ink); }
  :root .sheet-1 { background:var(--paper-2); }
  :root .sheet-2 { background:var(--paper-3); }
  :root .section-instructions-public, :root .chip-btn.on { background:var(--green-tint); }
  :root .study-content .study-equations { background:var(--paper-2); border-color:var(--line); }
  :root .field select, :root .role-select {
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23c1cec3' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  }
  :root .brand .mark, :root .nav-cta, :root .trial-bar,
  :root .qnum, :root .btn-green, :root .pi-code, :root .doc-hero-ico,
  :root .imp-step .st-n, :root .qfig-thumb .replace-fig,
  :root .section-drawer button.on, :root .ufilter button.on, :root .seg button.on {
    background:var(--action); color:#fff;
  }
  :root .btn-green:hover, :root .nav-cta:hover { background:var(--action-hover); }
  :root .btn-danger, :root .searchbar button, :root .trial-bar.over,
  :root .badge.gce, :root .pi-badge.gce { background:var(--danger); color:#fff; }
  :root .btn-danger:hover, :root .searchbar button:hover { background:#bc422b; }
  :root .trial-cta { background:var(--surface); color:var(--green-deep)!important; }
  :root .trial-bar.over .trial-cta { color:var(--pen)!important; }
  :root .notice, :root .form-err { color:var(--pen); }
  :root .notice.green { color:var(--green-deep); }
  :root .draft-card, :root .draft-banner { background:#352f20; border-color:#8f7949; color:#f4dca6; }
  :root .draft-count, :root .role-badge.admin { background:#4b3e25; color:#f4dca6; }
  :root .act-tip { background:var(--paper-3); }
  :root footer, :root .admin-side { background:#10241a; }
  :root footer .brand .mark, :root .admin-side .side-brand .mark { background:var(--action); color:#fff; }
  :root .student-footer-apps h2, :root .student-footer-contact h2 { color:var(--ink); }
  :root .app-download, :root .app-download--coming-soon:hover { background:#193d2b; color:#f0f4eb; }
  :root .app-download:hover { background:var(--action); }
  :root .app-download-eye { fill:#193d2b; }

  :root .app-home {
    --app-green:var(--green); --app-soft:var(--paper); --app-cream:var(--surface);
    --app-muted:var(--ink-faint); --app-border:var(--line);
    --app-green-surface:var(--green-tint); --app-green-border:var(--line);
    color:var(--ink);
  }
  :root .student-header--home { background:var(--paper); }
  :root .student-header--home .student-nav .brand .mark { background:var(--action); }
  :root .app-brand-copy strong { color:var(--ink); }
  :root .app-brand-copy small { color:var(--ink-faint); }
  :root .app-welcome p { color:var(--ink-soft); }
  :root .app-welcome p strong, :root .app-section-heading h2,
  :root .app-search input, :root .app-finder select { color:var(--ink); }
  :root .app-welcome-kicker, :root .app-small-label { color:var(--green); }
  :root .app-news-item, :root .app-subject-card { color:var(--ink)!important; }
  :root .app-news-item, :root .app-finder select { background:var(--surface); }
  :root .app-news-error { color:var(--pen)!important; }
  :root .app-primary-button, :root .app-search button, :root .app-news-avatar { background:var(--action); color:#fff; }
  :root .app-primary-button:hover, :root .app-search button:hover { background:var(--action-hover); }
  :root .app-bottom-nav { background:var(--surface); border-color:var(--line); }
  :root .app-bottom-nav a { color:var(--ink-faint); }
  :root .app-bottom-nav a[aria-current="page"] { color:var(--green); }
  :root .app-gift { background:#4b3e25; }

  :root .lessons-intro { background:linear-gradient(110deg,#21392a,#29382b); border-color:var(--line); }
  :root .lessons-eyebrow, :root .lessons-intro h1 em, :root .lessons-illustration,
  :root .lesson-player a, :root .lessons-empty a, :root .lessons-entry a { color:var(--green); }
  :root .lessons-intro h1, :root .lesson-card h2, :root .lessons-empty h3 { color:var(--ink); }
  :root .lessons-intro p, :root .lessons-search label { color:var(--ink-soft); }
  :root .lessons-results-head>span, :root .lesson-author,
  :root .lessons-loading, :root .lessons-empty { color:var(--ink-faint); }
  :root .lessons-search, :root .lesson-card, :root .lessons-empty,
  :root .lessons-pagination button { background:var(--surface); border-color:var(--line); }
  :root .lessons-search input, :root .lessons-search select { background:var(--paper); color:var(--ink); border-color:var(--line); }
  :root .lessons-search button, :root .lesson-watch, :root .lessons-empty button { background:var(--action); color:#fff; }
  :root .lesson-subject, :root .lessons-entry { background:var(--green-tint); color:var(--green-deep); border-color:var(--line); }
  :root .lessons-illustration span { background:var(--action); box-shadow:8px 8px 0 var(--paper-3); }
  :root .question-learning, :root .njabvwa-offer { border-color:var(--line); }
  :root .learning-panel, :root .njabvwa-complete { background:var(--green-tint); }
  :root .learning-video a, :root .njabvwa-coach-menu { color:var(--green); }
  :root .njabvwa-player { background:var(--surface); color:var(--ink); border-color:var(--line); }
  :root .njabvwa-offer button:not(.app-primary-button),
  :root .njabvwa-coach-menu a, :root .njabvwa-coach-menu button,
  :root .njabvwa-player button:not(.app-primary-button) { background:var(--surface); color:var(--green); border-color:var(--line); }
  /* Preserve source image backgrounds so black exam lines remain legible. */
  :root .qfig, :root .figure-lightbox { color-scheme:light; }
  :root .qfig figcaption, :root .figure-lightbox-head { color-scheme:dark; }
  :root .kicker[style] { color:var(--green)!important; }
}