/* ============================================================================
   LearnIt — dark skin for the essay-subject engines
   (economics / business / legal / biology / chemistry / physics papers).
   Include AFTER the engine's own <style>. Remaps tokens + overrides the many
   hardcoded light surfaces & dark text colours. Print output is a separate
   window, so downloaded papers stay white.
   Note: --blue-dk was used as BOTH heading text and button background in the
   light theme; here it becomes a light heading colour and the button/tab
   backgrounds are overridden to the accent gradient explicitly.
   ========================================================================== */
:root{
  --bg:#06192a; --paper:rgba(255,255,255,0.04); --ink:#f3f7fb; --slate:hsl(208,14%,66%);
  --line:rgba(255,255,255,0.10); --blue:#9bbdd4; --blue-dk:#dce9f3;
  --green:#6fd3a6; --red:#ec8d8d; --gold:#d8b56c;
}
body{
  color:var(--ink) !important;
  background:
    radial-gradient(820px 560px at 6% -8%, rgba(155,139,214,0.18), transparent 56%),   /* violet */
    radial-gradient(720px 560px at 96% 4%, rgba(95,197,154,0.13), transparent 55%),     /* green  */
    radial-gradient(1000px 820px at 78% 116%, rgba(108,182,201,0.16), transparent 56%), /* teal   */
    radial-gradient(620px 520px at 26% 104%, rgba(216,181,108,0.08), transparent 60%),  /* gold   */
    linear-gradient(180deg, hsl(201,100%,13%) 0%, hsl(201,86%,10%) 52%, #00080f 100%) !important;
  background-attachment:fixed !important;
}
.nav{ background:rgba(7,24,40,0.82) !important; border-bottom-color:var(--line) !important;
      backdrop-filter:blur(12px) saturate(120%); -webkit-backdrop-filter:blur(12px) saturate(120%); }
.nav-back{ background:rgba(255,255,255,0.05) !important; color:var(--blue) !important; }
.nav-back:hover{ background:rgba(255,255,255,0.10) !important; border-color:var(--blue) !important; }
.hero{ border-bottom-color:var(--line); }
.hero .pill{ background:rgba(155,189,212,0.14); color:#cfe2f0; }

/* tabs + cards */
.tab{ background:rgba(255,255,255,0.05); }
.tab:hover{ color:var(--blue); }
.tab.on{ background:linear-gradient(135deg,#7fb0de,#3f78c0); color:#06223f; border-color:transparent; }
.card,.paper-tile,.topic-tile,.q,.q-group,.markpaper{ background:var(--paper); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.note{ background:rgba(255,255,255,0.04); }

/* buttons */
.btn{ background:rgba(255,255,255,0.05); color:var(--blue); }
.btn:hover{ border-color:var(--blue); }
.btn.primary{ background:linear-gradient(135deg,#7fb0de,#3f78c0); color:#06223f; border-color:transparent; }
.btn.primary:hover{ filter:brightness(1.06); background:linear-gradient(135deg,#7fb0de,#3f78c0); }

/* questions / options / inputs */
.q .qtopic{ background:rgba(255,255,255,0.07); }
.q code{ background:rgba(255,255,255,0.08); }
.q-group .q.part{ border-bottom-color:rgba(255,255,255,0.10); }
.q-group > .qhead{ border-bottom-color:var(--line); }
.opt:hover{ border-color:var(--blue); background:rgba(255,255,255,0.06); }
.opt.sel{ background:rgba(155,189,212,0.16); box-shadow:inset 0 0 0 1px var(--blue); }
.opt.correct{ background:rgba(111,211,166,0.13); }
.opt.wrong{ background:rgba(236,141,141,0.13); }
.expl{ background:rgba(255,255,255,0.04); color:#cdd9e4; }
.ans-area textarea{ background:rgba(255,255,255,0.05); color:var(--ink); }
.ans-area textarea:focus{ box-shadow:0 0 0 3px rgba(155,189,212,0.18); }
.upload-lbl:hover{ background:rgba(255,255,255,0.06); }

/* marking / model answers */
.mark-result.self{ background:rgba(255,255,255,0.04); }
.model .mbody{ background:rgba(255,255,255,0.04); color:#cdd9e4; }
.am-tag{ background:rgba(155,189,212,0.14); border-color:rgba(155,189,212,0.40); color:#cfe2f0; }
.am-fb,.am-crit-static li{ color:#cdd9e4; }
.am-hint,.am-missed,.crit .am-missed,.am-note,.stim-note{ color:#8aa0b2 !important; }
.am-crit-static li{ border-bottom-color:rgba(255,255,255,0.08); }
.am-improve{ background:rgba(216,181,108,0.10); border-color:rgba(216,181,108,0.30); color:#e8d6a8; }
.essay-hint{ background:rgba(255,255,255,0.04); color:#cdd9e4; }
.crit li{ border-bottom-color:rgba(255,255,255,0.08); }

/* stimulus + key concepts + scorebar */
.stim-box{ background:rgba(255,255,255,0.04); }
.stim-table th{ background:rgba(155,189,212,0.14); color:#cfe2f0; }
.stim-table th,.stim-table td{ border-color:var(--line); }
.kc span{ background:rgba(255,255,255,0.05); }
.sec-head{ border-bottom-color:var(--blue); }
.scorebar{ background:rgba(7,24,40,0.92); border-color:var(--line); box-shadow:0 -6px 22px rgba(0,0,0,0.4); }

/* mode chooser + paginator + mark-paper letter grid */
.mode-btn{ background:rgba(255,255,255,0.04); }
.mode-btn:hover{ border-color:var(--blue); background:rgba(255,255,255,0.06); }
.mode-btn.on{ background:rgba(155,189,212,0.16); border-color:var(--blue); }
.mode-btn.on .mode-lbl, .mode-btn.on .mode-ct{ color:#fff; }
.mode-ico{ color:var(--blue); }
.mp-let{ background:rgba(255,255,255,0.05); color:var(--slate); }
.pg-chip{ background:rgba(255,255,255,0.05); color:var(--slate); }
.pg-seg-btn.on{ background:rgba(255,255,255,0.10); color:#fff; box-shadow:none; }

/* swapped emoji icons */
.li-emoji{ vertical-align:-0.14em; }