/* ─────────────────────────────────────────────────────────────
   ATLAS CAREER OS — v14 Design System
   Palette: Obsidian + Indigo
   Primary: indigo/periwinkle  Brand: amber  Success: emerald  Danger: rose
   ───────────────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* ── Canvas ─────────────────────────── */
  --bg:    #09080e;
  --bg2:   #0f0d18;
  --panel: rgba(16,14,26,.82);
  --panel2:rgba(12,11,20,.90);
  --panel3:rgba(16,14,26,.55);
  --line:  rgba(255,255,255,.065);
  --line2: rgba(129,140,248,.24);
  --shadow: 0 24px 80px rgba(0,0,0,.60);
  --radius: 20px;

  /* ── Type ───────────────────────────── */
  --mono:  'JetBrains Mono', ui-monospace, Menlo, monospace;
  --sans:  'Geist', ui-sans-serif, system-ui, sans-serif;
  --serif: 'Instrument Serif', 'Times New Roman', serif;

  /* ── Text ───────────────────────────── */
  --text:   #ede9fe;
  --muted:  #8b83a8;
  --muted2: #524d67;

  /* ── Semantic palette ───────────────────────────────────────
     indigo  = primary interactive (buttons, active states, focus)
     amber   = Atlas brand (logo, status pill, countdown, rail)
     emerald = success, done, mastered, active streak
     rose    = danger, error, critical, again
     sky     = info callouts only
     violet  = certificates, special labels
     ─────────────────────────────────────────────────────────── */
  --indigo:  #818cf8;
  --indigo2: #6366f1;
  --sky:     #38bdf8;
  --emerald: #34d399;
  --amber:   #f59e0b;
  --rose:    #fb7185;
  --violet:  #c084fc;
  --orange:  #fb923c;
  --green:   #34d399;
  --cyan:    #818cf8; /* maps cyan tags → indigo in this theme */
  --red:     #fb7185;
  --blue:    #38bdf8;
  --purple:  #c084fc;
  --brand:   #f59e0b;
}

/* ─ Body ───────────────────────────────── */
body {
  background:
    radial-gradient(900px 700px at 80% -8%,  rgba(99,102,241,.09),  transparent 65%),
    radial-gradient(700px 500px at -5% 85%,  rgba(129,140,248,.06), transparent 65%),
    radial-gradient(500px 400px at 45% 110%, rgba(52,211,153,.04),  transparent 70%),
    linear-gradient(160deg, #09080e 0%, #0d0b18 50%, #070610 100%);
  font-feature-settings: "ss01","cv11";
  letter-spacing: -.005em;
  color: var(--text);
  font-family: var(--sans);
}
/* Barely-visible grid */
body::before {
  opacity: .14 !important;
  background-image:
    linear-gradient(rgba(129,140,248,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(129,140,248,.06) 1px, transparent 1px) !important;
}
/* No CRT scanlines */
body::after { display: none !important; }

/* ─ Typography ─────────────────────────── */
.brand h1, .hero h2, .section-header h2,
.card h3, .card h4, .modal h3 {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em !important;
}
.hero h2        { font-size: clamp(32px,4.2vw,56px) !important; line-height: 1.02 !important; letter-spacing: -.035em !important; }
.brand h1       { font-size: 22px !important; line-height: 1.1 !important; }
.section-header h2 { font-size: 30px !important; letter-spacing: -.025em !important; }
.card h3        { font-size: 18px !important; line-height: 1.2 !important; }
.card h4        { font-size: 14.5px !important; line-height: 1.3 !important; }
.eyebrow {
  color: var(--brand) !important;
  font-family: var(--mono) !important;
  letter-spacing: .14em !important;
  font-weight: 600 !important;
  display: inline-flex; align-items: center; gap: 8px;
}
.card p, .card li, .hero .lead, .section-header p { font-family: var(--sans) !important; }
.hero .lead   { color: var(--muted) !important; font-size: 15.5px !important; line-height: 1.65 !important; }
.hero strong  { color: var(--brand) !important; font-weight: 500 !important; }
.card::before { background: linear-gradient(90deg, transparent, rgba(129,140,248,.12), transparent) !important; }

/* ─ Stat/metric values ─────────────────── */
.metric .value, .stat-value {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  font-size: 28px !important;
  line-height: 1.05 !important;
  letter-spacing: -.025em !important;
}
.progress-ring b { font-family: var(--serif) !important; font-weight: 400 !important; letter-spacing: -.04em !important; }
.progress-ring > div { background: var(--bg2) !important; border-color: rgba(255,255,255,.06) !important; }

/* ─ Sidebar ────────────────────────────── */
.sidebar {
  background: rgba(9,8,14,.88) !important;
  border-color: rgba(255,255,255,.06) !important;
  backdrop-filter: blur(18px);
}
.brand {
  background: linear-gradient(145deg, rgba(245,159,11,.10), rgba(12,11,20,.78) 50%, rgba(129,140,248,.07)) !important;
  border-color: rgba(245,159,11,.22) !important;
  box-shadow: 0 0 0 1px rgba(245,159,11,.06) !important;
  padding: 22px 20px 18px !important;
}
.brand-mark {
  font-family: var(--serif) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 52px !important;
  line-height: .92 !important;
  letter-spacing: -.04em !important;
  margin: 6px 0 10px !important;
  color: var(--text) !important;
}
.brand-mark em { font-style: italic; color: var(--brand); text-shadow: 0 0 28px rgba(245,159,11,.50); }
.brand-tagline { font-family: var(--sans) !important; font-size: 12.5px !important; line-height: 1.55 !important; color: var(--muted) !important; margin-bottom: 6px !important; }
.brand-tagline strong { color: var(--text); font-weight: 500; }

/* Status pill */
.status-pill {
  background: rgba(245,159,11,.08) !important;
  border-color: rgba(245,159,11,.32) !important;
  color: var(--brand) !important;
}
.status-pill::before { background: var(--brand) !important; box-shadow: 0 0 12px rgba(245,159,11,.55) !important; }

/* Search */
.search-wrap input {
  background: rgba(9,8,14,.65) !important;
  border-color: rgba(255,255,255,.07) !important;
  color: var(--text) !important;
  font-family: var(--mono) !important;
  font-size: 13px !important;
}
.search-wrap input::placeholder { color: var(--muted2) !important; }

/* ─ Nav (flat items, inside groups) ────── */
.nav button {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--muted) !important;
  font-family: var(--sans) !important;
  font-weight: 500 !important;
  padding: 9px 12px !important;
  font-size: 12.5px !important;
  border-radius: 10px !important;
}
.nav button:hover {
  border-color: rgba(129,140,248,.28) !important;
  background: rgba(129,140,248,.06) !important;
  color: var(--text) !important;
}
.nav button.active {
  color: var(--text) !important;
  background: rgba(129,140,248,.10) !important;
  border-color: rgba(129,140,248,.28) !important;
  box-shadow: inset 3px 0 0 var(--indigo) !important;
}
.nav .key {
  font-family: var(--mono) !important;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  padding: 1px 5px;
  border-radius: 4px;
}
.nav button.active .key { color: var(--indigo) !important; border-color: rgba(129,140,248,.35) !important; }
.nav button > span:first-child b {
  font-family: var(--mono); font-weight: 500; color: var(--muted2); margin-right: 6px;
  font-size: 13px; min-width: 14px; display: inline-block; text-align: center;
}
.nav button.active > span:first-child b { color: var(--indigo); }
.nav button:hover  > span:first-child b { color: var(--text); }

/* ─ Nav groups (v13 IA) ─────────────────── */
.nav { gap: 8px !important; }
.nav-ia-group {
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  background: rgba(16,14,26,.28);
  overflow: hidden;
  transition: border-color .18s;
}
.nav-ia-group:hover { border-color: rgba(129,140,248,.14); }
.nav-ia-group:has(button.active) { border-color: rgba(129,140,248,.24); background: rgba(129,140,248,.04); }
.nav-group-toggle {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 13px 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--muted) !important;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.nav-group-toggle:hover { background: rgba(129,140,248,.06) !important; color: var(--text) !important; }
.nav-group-toggle > span:first-child {
  display: flex !important; align-items: center !important; gap: 11px !important; min-width: 0;
}
.nav-group-toggle b {
  color: var(--muted2) !important;
  font-family: var(--mono) !important;
  min-width: 18px; text-align: center;
  font-size: 14px;
}
.nav-group-toggle strong {
  display: block; font-size: 13px; line-height: 1.05;
  font-weight: 600; color: inherit;
}
.nav-group-toggle small {
  display: block; margin-top: 3px; font-size: 10.5px; line-height: 1.2;
  color: var(--muted2); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; max-width: 170px;
}
.nav-count {
  font-family: var(--mono); font-size: 10px; color: var(--muted2);
  border: 1px solid rgba(255,255,255,.07); background: rgba(255,255,255,.04);
  border-radius: 999px; padding: 2px 7px; flex-shrink: 0;
}
.nav-group-items {
  display: none; padding: 6px;
  border-top: 1px solid rgba(255,255,255,.05);
}
.nav-ia-group.open .nav-group-items { display: grid; gap: 3px; }
.nav-ia-group.open .nav-group-toggle {
  background: rgba(16,14,26,.50) !important;
  color: var(--text) !important;
}
.nav-ia-group.open .nav-group-toggle b { color: var(--indigo) !important; }
.nav .nav-group { display: none !important; }

/* ─ Action buttons ──────────────────────── */
.tiny-btn, .copy-btn, .filter-btn, .action-btn {
  background: rgba(16,14,26,.70) !important;
  border-color: rgba(255,255,255,.09) !important;
  color: var(--text) !important;
  font-family: var(--sans) !important;
  font-weight: 500 !important;
  border-radius: 10px !important;
  transition: border-color .15s, color .15s, transform .12s, background .15s !important;
}
.tiny-btn:hover, .copy-btn:hover, .filter-btn:hover, .action-btn:hover {
  border-color: var(--indigo) !important;
  color: var(--indigo) !important;
  background: rgba(129,140,248,.07) !important;
  transform: translateY(-1px);
}
.tiny-btn.danger, .action-btn.danger {
  border-color: rgba(251,113,133,.28) !important;
  color: var(--rose) !important;
  background: rgba(251,113,133,.06) !important;
}
.tiny-btn.danger:hover, .action-btn.danger:hover {
  border-color: var(--rose) !important;
  background: rgba(251,113,133,.12) !important;
}
.filter-btn.active {
  background: rgba(129,140,248,.12) !important;
  border-color: rgba(129,140,248,.42) !important;
  color: var(--indigo) !important;
}
.primary-action {
  border-color: rgba(129,140,248,.35) !important;
  background: rgba(129,140,248,.10) !important;
  color: var(--indigo) !important;
}
.primary-action:hover {
  border-color: var(--indigo) !important;
  color: var(--text) !important;
  background: rgba(129,140,248,.18) !important;
  transform: translateY(-1px);
}

/* ─ Hero ────────────────────────────────── */
.hero {
  border: 1px solid rgba(129,140,248,.14) !important;
  background:
    linear-gradient(140deg, rgba(99,102,241,.08), transparent 55%),
    linear-gradient(135deg, rgba(16,14,26,.92), rgba(9,8,14,.62)) !important;
  border-radius: 26px !important;
}
.hero::after { background: radial-gradient(circle, rgba(129,140,248,.08), transparent 60%) !important; }
.hero h2 strong {
  color: var(--brand) !important;
  font-style: italic; font-weight: 400;
  background: rgba(245,159,11,.10);
  padding: 0 8px;
  border-bottom: 2px solid var(--brand);
  border-radius: 2px; margin: 0 2px;
}
.hero .lead strong { color: var(--text) !important; font-weight: 500; }
.metric { background: rgba(16,14,26,.55) !important; border-color: rgba(255,255,255,.07) !important; border-radius: 16px !important; }
.metric .label, .stat-label { font-family: var(--mono) !important; letter-spacing: .10em !important; color: var(--muted2) !important; }

/* Command ring */
.command-card {
  border: 1px solid rgba(52,211,153,.20) !important;
  background: linear-gradient(140deg, rgba(52,211,153,.06), transparent 55%), rgba(16,14,26,.55) !important;
}
.progress-ring {
  background: conic-gradient(var(--emerald) calc(var(--pct)*1%), rgba(255,255,255,.06) 0) !important;
  box-shadow: 0 0 36px rgba(52,211,153,.12) !important;
}
.bar { background: rgba(255,255,255,.06) !important; border-color: rgba(255,255,255,.04) !important; }
.bar > span { background: linear-gradient(90deg, var(--indigo), var(--emerald)) !important; }

/* ─ Cards ───────────────────────────────── */
.card {
  border-color: rgba(255,255,255,.06) !important;
  background: rgba(16,14,26,.62) !important;
  box-shadow: 0 8px 40px rgba(0,0,0,.30) !important;
  border-radius: var(--radius) !important;
  backdrop-filter: blur(14px) saturate(130%);
  -webkit-backdrop-filter: blur(14px) saturate(130%);
  transition: border-color .18s;
}
.card:hover { border-color: rgba(255,255,255,.10) !important; }
.focus-card {
  border-color: rgba(245,159,11,.20) !important;
  background: linear-gradient(140deg, rgba(245,159,11,.06), transparent 55%), rgba(16,14,26,.60) !important;
}

/* ─ Items ───────────────────────────────── */
.item { color: var(--muted) !important; font-size: 13.5px !important; line-height: 1.55 !important; }
.item::before { color: var(--brand) !important; }
.item.check::before { color: var(--emerald) !important; }
.item.x::before { color: var(--rose) !important; }

/* ─ Checks ──────────────────────────────── */
.check-row { background: rgba(16,14,26,.45) !important; border-color: rgba(255,255,255,.07) !important; border-radius: 12px !important; }
.check-row input[type="checkbox"] { accent-color: var(--indigo) !important; }
.check-row label { color: var(--text) !important; }

/* ─ Tags ────────────────────────────────── */
.tag {
  border-color: rgba(255,255,255,.11) !important;
  background: rgba(255,255,255,.05) !important;
  color: var(--muted) !important;
  font-family: var(--mono) !important;
  font-size: 10.5px !important;
  letter-spacing: .04em !important;
  border-radius: 6px !important;
}
/* indigo/cyan = primary interactive */
.tag.cyan, .tag.indigo {
  border-color: rgba(129,140,248,.36) !important;
  background: rgba(129,140,248,.10) !important;
  color: var(--indigo) !important;
}
/* blue = info/secondary */
.tag.blue {
  border-color: rgba(56,189,248,.36) !important;
  background: rgba(56,189,248,.10) !important;
  color: var(--sky) !important;
}
/* green/emerald = success */
.tag.green {
  border-color: rgba(52,211,153,.36) !important;
  background: rgba(52,211,153,.10) !important;
  color: var(--emerald) !important;
}
/* amber = brand/warning */
.tag.amber {
  border-color: rgba(245,159,11,.36) !important;
  background: rgba(245,159,11,.10) !important;
  color: var(--brand) !important;
}
/* orange = secondary warning */
.tag.orange {
  border-color: rgba(251,146,60,.34) !important;
  background: rgba(251,146,60,.09) !important;
  color: var(--orange) !important;
}
/* red/rose/magenta = danger */
.tag.red, .tag.magenta, .tag.danger {
  border-color: rgba(251,113,133,.34) !important;
  background: rgba(251,113,133,.09) !important;
  color: var(--rose) !important;
}
/* purple/violet = certs/special */
.tag.purple {
  border-color: rgba(192,132,252,.34) !important;
  background: rgba(192,132,252,.09) !important;
  color: var(--violet) !important;
}

/* ─ Callouts ────────────────────────────── */
.callout.info {
  background: rgba(56,189,248,.05) !important;
  border-color: rgba(56,189,248,.22) !important;
  color: var(--text);
}
.callout.good, .callout.success {
  background: rgba(52,211,153,.05) !important;
  border-color: rgba(52,211,153,.22) !important;
}
.callout.warn {
  background: rgba(245,159,11,.05) !important;
  border-color: rgba(245,159,11,.28) !important;
}
.callout.danger {
  background: rgba(251,113,133,.05) !important;
  border-color: rgba(251,113,133,.28) !important;
}

/* ─ Timeline ────────────────────────────── */
.timeline::before { background: linear-gradient(var(--indigo), var(--violet), var(--emerald)) !important; opacity: .45 !important; }
.phase-dot {
  background: var(--bg2) !important;
  border-color: rgba(129,140,248,.40) !important;
  color: var(--indigo) !important;
  font-family: var(--mono) !important;
  border-radius: 12px !important;
}

/* ─ Mini table ──────────────────────────── */
.accordion { border-color: rgba(255,255,255,.06) !important; background: rgba(16,14,26,.55) !important; border-radius: 14px !important; }
.mini-table th { font-family: var(--mono) !important; color: var(--muted) !important; background: rgba(16,14,26,.55) !important; letter-spacing: .1em !important; }
.mini-table td { color: var(--text) !important; }
.mini-table tr td, .mini-table tr th { border-bottom-color: rgba(255,255,255,.06) !important; }

/* ─ Output boxes ────────────────────────── */
.output-box, .copy-box {
  border-color: rgba(129,140,248,.16) !important;
  background: rgba(9,8,14,.72) !important;
  color: var(--text) !important;
  font-family: var(--mono) !important;
  font-size: 12.5px !important;
  border-radius: 12px !important;
}
.copy-top { color: var(--muted) !important; font-family: var(--mono) !important; }
.output-box.ai-loading { border-color: rgba(129,140,248,.36) !important; background: rgba(129,140,248,.04) !important; }

/* ─ Inputs ──────────────────────────────── */
input, textarea, select {
  background: rgba(9,8,14,.62) !important;
  border-color: rgba(255,255,255,.08) !important;
  color: var(--text) !important;
  border-radius: 10px !important;
  font-family: var(--sans) !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--indigo) !important;
  box-shadow: 0 0 0 3px rgba(129,140,248,.12) !important;
  outline: none;
}
label.form-label { font-family: var(--mono) !important; letter-spacing: .09em !important; color: var(--muted) !important; }

/* ─ Score circle ────────────────────────── */
.score-circle { background: conic-gradient(var(--indigo) calc(var(--score)*1%), rgba(255,255,255,.07) 0) !important; }
.score-circle > span { background: var(--bg2) !important; font-family: var(--serif) !important; font-weight: 400 !important; font-size: 22px !important; letter-spacing: -.03em !important; }

/* ─ Calendar ────────────────────────────── */
.calendar-day { background: rgba(16,14,26,.45) !important; border-color: rgba(255,255,255,.06) !important; border-radius: 12px !important; }
.calendar-day:hover { border-color: rgba(129,140,248,.36) !important; }
.calendar-day.today { border-color: rgba(245,159,11,.52) !important; background: rgba(245,159,11,.08) !important; box-shadow: inset 0 0 0 1px rgba(245,159,11,.22) !important; }
.calendar-day.selected { border-color: var(--indigo) !important; box-shadow: 0 0 0 3px rgba(129,140,248,.12) !important; }
.calendar-date-num { font-family: var(--mono) !important; color: var(--text) !important; }
.calendar-weekdays span { font-family: var(--mono) !important; color: var(--muted2) !important; letter-spacing: .12em !important; }
.calendar-month { color: var(--brand) !important; font-family: var(--mono) !important; }
.calendar-badge { font-family: var(--mono) !important; }
.calendar-badge.study   { border-color: rgba(129,140,248,.34) !important; background: rgba(129,140,248,.09) !important; color: var(--indigo) !important; }
.calendar-badge.plan    { border-color: rgba(245,159,11,.34) !important; background: rgba(245,159,11,.09) !important; color: var(--brand) !important; }
.calendar-badge.project { border-color: rgba(192,132,252,.34) !important; background: rgba(192,132,252,.09) !important; color: var(--violet) !important; }
.calendar-badge.job     { border-color: rgba(52,211,153,.34) !important; background: rgba(52,211,153,.09) !important; color: var(--emerald) !important; }
.calendar-badge.notes   { border-color: rgba(56,189,248,.34) !important; background: rgba(56,189,248,.09) !important; color: var(--sky) !important; }
.calendar-badge.review  { border-color: rgba(251,113,133,.34) !important; background: rgba(251,113,133,.09) !important; color: var(--rose) !important; }
.calendar-detail { background: rgba(9,8,14,.55) !important; border-color: rgba(255,255,255,.07) !important; }
.calendar-event { background: rgba(16,14,26,.60) !important; border-color: rgba(255,255,255,.06) !important; }
.calendar-event small { color: var(--muted2) !important; font-family: var(--mono) !important; }

/* ─ Health ──────────────────────────────── */
.health-item { background: rgba(9,8,14,.55) !important; border-color: rgba(255,255,255,.06) !important; font-family: var(--mono) !important; font-size: 12px !important; }
.health-dot-ok   { background: var(--emerald) !important; box-shadow: 0 0 8px var(--emerald) !important; }
.health-dot-warn { background: var(--brand) !important;   box-shadow: 0 0 8px var(--brand) !important; }
.health-dot-err  { background: var(--rose) !important;    box-shadow: 0 0 8px var(--rose) !important; }

/* ─ Flip cards ──────────────────────────── */
.fc-front { background: rgba(16,14,26,.65) !important; border-color: rgba(255,255,255,.07) !important; }
.fc-back   { background: linear-gradient(135deg, rgba(129,140,248,.10), rgba(9,8,14,.88)) !important; border-color: rgba(129,140,248,.32) !important; }
.fc-hint   { font-family: var(--mono) !important; color: var(--muted2) !important; }

/* ─ AI badge ────────────────────────────── */
.ai-badge {
  border-color: rgba(129,140,248,.32) !important;
  background: rgba(129,140,248,.08) !important;
  color: var(--indigo) !important;
  font-family: var(--mono) !important;
  font-size: 9.5px !important;
  padding: 3px 8px !important;
}
.prompt-mode-note { background: rgba(245,159,11,.05) !important; border-color: rgba(245,159,11,.22) !important; color: var(--muted) !important; font-family: var(--mono) !important; }
.domain-card { border-left-color: var(--indigo) !important; }

/* ─ Mobile chrome ───────────────────────── */
.mobile-top { background: rgba(9,8,14,.92) !important; border-bottom-color: rgba(255,255,255,.06) !important; }
.mobile-top select { background: rgba(9,8,14,.70) !important; border-color: rgba(255,255,255,.07) !important; color: var(--text) !important; font-family: var(--mono) !important; }
.mobile-bottom {
  background: rgba(9,8,14,.95) !important;
  border-color: rgba(255,255,255,.07) !important;
  border-radius: 20px !important;
  box-shadow: 0 -12px 40px rgba(0,0,0,.50), 0 0 0 1px rgba(129,140,248,.06) !important;
}
.mobile-bottom button { color: var(--muted) !important; font-family: var(--mono) !important; font-size: 10.5px !important; letter-spacing: .04em !important; }
.mobile-bottom button.active { background: rgba(129,140,248,.10) !important; color: var(--indigo) !important; }

/* ─ Toast ───────────────────────────────── */
.toast { background: rgba(9,8,14,.97) !important; border-color: rgba(52,211,153,.38) !important; color: var(--emerald) !important; font-family: var(--mono) !important; border-radius: 12px !important; }

/* ─ Modal ───────────────────────────────── */
.modal { background: rgba(11,10,19,.97) !important; border-color: rgba(129,140,248,.22) !important; border-radius: 20px !important; }

/* ─ Section header ──────────────────────── */
.section-header p { color: var(--muted) !important; font-size: 14px !important; }

/* ─ Atlas watermark ─────────────────────── */
.atlas-mark {
  position: fixed; top: 14px; right: 18px;
  font-family: var(--mono); font-size: 9.5px; letter-spacing: .22em;
  color: var(--muted2); z-index: 25; pointer-events: none;
  text-transform: uppercase; opacity: .40;
}
.atlas-mark::before { content: "◇ "; color: var(--brand); }
@media (max-width: 1120px) { .atlas-mark { display: none; } }

/* ─ Atlas bottom rail ───────────────────── */
.atlas-rail {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 35;
  background: linear-gradient(90deg, #0c0a18, #110e24 30%, #0c0a18);
  border-top: 1px solid rgba(129,140,248,.18);
  color: rgba(129,140,248,.70);
  font-family: var(--mono); font-size: 11px; letter-spacing: .04em;
  padding: 9px 28px;
  display: flex; align-items: center; gap: 16px;
  box-shadow: 0 -8px 24px rgba(0,0,0,.35);
}
.atlas-rail b { font-weight: 600; color: var(--brand); }
.atlas-rail .sep { color: rgba(129,140,248,.20); }
.atlas-rail .quip { margin-left: auto; font-family: var(--serif); font-style: italic; font-size: 13px; letter-spacing: -.01em; color: rgba(129,140,248,.50); }
.atlas-rail .pulse { display: inline-flex; align-items: center; gap: 6px; }
.atlas-rail .pulse::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 10px rgba(245,159,11,.55); animation: rail-blink 1.6s steps(2) infinite; }
@keyframes rail-blink { 50% { opacity: .25; } }
@media (max-width: 1120px) { .atlas-rail { display: none !important; } }
body.focus-mode .atlas-rail { display: none !important; }
@media print { .atlas-rail { display: none !important; } }
@media (min-width: 1121px) { .main { padding-bottom: 64px !important; } }

/* ─ Atlas link card ─────────────────────── */
.atlas-link {
  border: 1px solid rgba(129,140,248,.18) !important;
  background: linear-gradient(135deg, rgba(129,140,248,.07), rgba(99,102,241,.05) 60%, transparent) !important;
}
.atlas-link:hover { border-color: rgba(129,140,248,.40) !important; transform: translateY(-1px); }

/* ─ Dashboard stats ─────────────────────── */
.dash-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.dash-stat {
  position: relative;
  padding: 18px 20px;
  background: rgba(16,14,26,.72) !important;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 18px;
  backdrop-filter: blur(14px);
  overflow: hidden;
}
.dash-stat::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(129,140,248,.18), transparent);
}
.dash-stat-label { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted2); margin-bottom: 10px; }
.dash-stat-value { font-family: var(--serif); font-weight: 400; font-size: 38px; line-height: 1; letter-spacing: -.03em; color: var(--text); }
.dash-stat.amber .dash-stat-value  { color: var(--brand); }
.dash-stat.green .dash-stat-value  { color: var(--emerald); }
.dash-stat.indigo .dash-stat-value { color: var(--indigo); }
.dash-stat.cyan  .dash-stat-value  { color: var(--indigo); }
.dash-stat-sub { font-size: 11.5px; color: var(--muted); margin-top: 8px; line-height: 1.4; }
/* Zero-state for stats */
.dash-stat-value.zero { color: var(--muted2); font-size: 22px; }
.dash-stat-setup-link {
  display: inline-block; margin-top: 6px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--indigo); cursor: pointer; border-bottom: 1px solid rgba(129,140,248,.35);
  background: none; border-left: 0; border-right: 0; border-top: 0; padding: 0;
}
.dash-stat-setup-link:hover { color: var(--text); border-bottom-color: var(--text); }

.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
.card-head h3 { margin: 0 !important; }

.dash-domains { display: grid; gap: 12px; }
.dash-domain-name { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; color: var(--text); margin-bottom: 6px; }
.dash-domain-name span:first-child { font-family: var(--serif); font-size: 16px; letter-spacing: -.015em; line-height: 1.1; }
.dash-domain-wt { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--muted2); }

.dash-list { display: grid; gap: 4px; }
.dash-list .item { padding: 9px 10px 9px 26px; margin-left: -10px; border-radius: 10px; cursor: pointer; transition: .15s ease; position: relative; font-size: 13px !important; line-height: 1.4 !important; }
.dash-list .item:hover { background: rgba(129,140,248,.06); }
.dash-list .item::before { position: absolute; left: 10px; top: 9px; }
.dash-list .item .item-meta { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted2); margin-left: 8px; white-space: nowrap; }
.dash-list .item.done { opacity: .42; text-decoration: line-through; }
.dash-list .empty { font-size: 12.5px; color: var(--muted2); padding: 16px 6px; font-style: italic; }
#dashHotList .item { font-family: var(--sans); font-size: 13.5px !important; color: var(--text) !important; }
#dashHotList .item.priority::before { content: "▸"; color: var(--brand); }

/* Mentor */
.mentor-meta-row { display: flex; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.mentor-meta { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted) !important; }
.mentor-meta::before { content: "◇ "; color: var(--brand); }
.mentor-regen { margin-left: auto; font-size: 11px !important; padding: 7px 12px !important; }

/* ─ Progress Intelligence ────────────────── */
.score-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 14px; }
.score-card {
  border-radius: 16px; padding: 16px;
  background: rgba(9,8,14,.55); border: 1px solid rgba(255,255,255,.07);
  display: flex; align-items: center; gap: 14px;
  transition: border-color .18s;
}
.score-card:hover { border-color: rgba(129,140,248,.20); }
.score-ring-mini {
  flex-shrink: 0; width: 60px; height: 60px; border-radius: 50%;
  display: grid; place-items: center;
  background: conic-gradient(var(--indigo) calc(var(--score)*1%), rgba(255,255,255,.07) 0);
}
.score-ring-mini strong {
  width: 46px; height: 46px; border-radius: 50%;
  background: rgba(9,8,14,.88); display: grid; place-items: center;
  font-family: var(--serif); font-weight: 400; font-size: 13.5px;
  color: var(--text); letter-spacing: -.02em;
}
.score-card-body { flex: 1; min-width: 0; }
.score-card-label { font-family: var(--mono); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted2); margin-bottom: 4px; }
.score-card-sub { font-size: 11.5px; color: var(--muted); line-height: 1.4; }
.progress-intel-card { background: rgba(16,14,26,.65) !important; border-color: rgba(255,255,255,.07) !important; }

/* ─ Projects / roadmap ───────────────────── */
.project-roadmap-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); gap: 14px; }
.project-roadmap-card {
  padding: 16px 18px; background: rgba(16,14,26,.65);
  border: 1px solid rgba(255,255,255,.07); border-radius: 18px;
  transition: border-color .18s, transform .18s;
}
.project-roadmap-card:hover { border-color: rgba(129,140,248,.26); transform: translateY(-2px); }
.project-roadmap-card strong { font-size: 16px; letter-spacing: -.03em; color: var(--text); }

/* ─ Resume Lab ───────────────────────────── */
.resume-lab-hero {
  display: grid; grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr);
  gap: 18px; align-items: stretch;
  border: 1px solid rgba(129,140,248,.15); border-radius: 26px;
  padding: 22px; margin-bottom: 16px;
  background:
    radial-gradient(600px 220px at 18% 0%, rgba(129,140,248,.08), transparent 70%),
    radial-gradient(500px 240px at 100% 0%, rgba(99,102,241,.07), transparent 68%),
    rgba(16,14,26,.68);
  box-shadow: var(--shadow); position: relative; overflow: hidden;
}
.resume-lab-hero::after {
  content: ""; position: absolute; inset: auto -10% -45% 35%; height: 220px;
  background: radial-gradient(circle, rgba(129,140,248,.07), transparent 64%); pointer-events: none;
}
.resume-lab-hero > * { position: relative; z-index: 1; }
.resume-lab-hero h3 { font-family: var(--serif) !important; font-size: clamp(26px,4vw,46px) !important; line-height: 1.02 !important; margin: 7px 0 8px !important; font-weight: 400 !important; letter-spacing: -.03em !important; }
.resume-score-card { border: 1px solid rgba(255,255,255,.08); border-radius: 22px; background: rgba(9,8,14,.48); padding: 16px; display: grid; align-content: center; gap: 12px; }
.resume-score-ring { --pct:0; width:150px; height:150px; margin:0 auto; border-radius:50%; display:grid; place-items:center; background: conic-gradient(var(--indigo) calc(var(--pct)*1%), rgba(255,255,255,.08) 0); }
.resume-score-ring > span { width:118px; height:118px; border-radius:50%; background:rgba(9,8,14,.85); display:grid; place-items:center; font-family:var(--serif); font-weight:400; font-size:28px; letter-spacing:-.03em; }
.resume-keyword-list { display: flex; flex-wrap: wrap; gap: 6px; }

/* ─ AI Brain ────────────────────────────── */
.ai-brain-card { background: linear-gradient(135deg, rgba(129,140,248,.07), rgba(99,102,241,.05) 60%, rgba(16,14,26,.62)) !important; border-color: rgba(129,140,248,.16) !important; }
.cloudflare-flow { display:flex; align-items:center; gap:10px; font-family:var(--mono); font-size:11.5px; color:var(--muted2); padding:10px 14px; background:rgba(9,8,14,.50); border-radius:10px; border:1px solid rgba(255,255,255,.07); flex-wrap:wrap; margin:10px 0; }
.cloudflare-flow b { color: var(--indigo); }
.cloudflare-flow span { color: var(--text); }

/* ─ Daily Digest ────────────────────────── */
.digest-card {
  background: linear-gradient(140deg, rgba(52,211,153,.05), rgba(129,140,248,.05) 55%, rgba(16,14,26,.64)) !important;
  border-color: rgba(52,211,153,.16) !important;
}
.digest-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px,1fr)); gap: 10px; margin: 12px 0; }
.digest-stat { background: rgba(9,8,14,.52); border: 1px solid rgba(255,255,255,.07); border-radius: 14px; padding: 14px 16px; text-align: center; }
.digest-stat-value { font-family: var(--serif); font-size: 32px; font-weight: 400; letter-spacing: -.03em; color: var(--text); line-height: 1; }
.digest-stat-label { font-family: var(--mono); font-size: 10px; letter-spacing: .10em; text-transform: uppercase; color: var(--muted2); margin-top: 6px; }
.digest-grade { font-family: var(--serif); font-size: 56px; font-weight: 400; letter-spacing: -.04em; line-height: 1; text-align: center; padding: 14px 16px; }
.digest-grade.A { color: var(--emerald); }
.digest-grade.B { color: var(--indigo); }
.digest-grade.C { color: var(--brand); }
.digest-grade.D { color: var(--orange); }
.digest-grade.F { color: var(--rose); }
.digest-insight { background: rgba(9,8,14,.55); border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 12px 14px; font-size: 13px; line-height: 1.6; color: var(--muted); }

/* ─ Worker diagnostic ───────────────────── */
.worker-diag { display: grid; gap: 8px; margin-top: 12px; }
.worker-diag-row { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: 10px; background: rgba(9,8,14,.55); border: 1px solid rgba(255,255,255,.07); font-size: 12px; font-family: var(--mono); }
.worker-diag-row.ok   { border-color: rgba(52,211,153,.22); }
.worker-diag-row.warn { border-color: rgba(245,159,11,.22); }
.worker-diag-row.err  { border-color: rgba(251,113,133,.22); }
.worker-diag-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 3px; }
.worker-diag-dot.ok   { background: var(--emerald); box-shadow: 0 0 6px var(--emerald); }
.worker-diag-dot.warn { background: var(--brand);   box-shadow: 0 0 6px var(--brand); }
.worker-diag-dot.err  { background: var(--rose);    box-shadow: 0 0 6px var(--rose); }
.worker-diag-body strong { display: block; color: var(--text); margin-bottom: 2px; }
.worker-diag-body span  { color: var(--muted2); font-size: 11px; }

/* ─ SRS ─────────────────────────────────── */
.srs-active-card { animation: srsPulse 2s ease-in-out infinite alternate; }
@keyframes srsPulse { from { box-shadow: 0 0 0 0 rgba(129,140,248,.05); } to { box-shadow: 0 0 0 8px rgba(129,140,248,0); } }

/* ─ Pomodoro mini ───────────────────────── */
.pomo-mini { margin-top: 10px; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(129,140,248,.25); background: rgba(129,140,248,.06); }
.pomo-mini-inner { display: flex; flex-direction: column; gap: 2px; }

/* ─ Quick Capture ───────────────────────── */
.qc-toggle {
  position: fixed; bottom: 24px; right: 24px; z-index: 9000;
  width: 54px; height: 54px; border-radius: 50%; border: none;
  background: linear-gradient(135deg, #818cf8, #a78bfa);
  color: #fff; font-size: 26px; font-weight: 700; cursor: pointer;
  box-shadow: 0 6px 24px rgba(129,140,248,.40), 0 0 0 3px rgba(9,8,14,.65);
  transition: transform .18s ease, box-shadow .18s ease;
  display: flex; align-items: center; justify-content: center;
}
.qc-toggle:hover  { transform: scale(1.06); box-shadow: 0 8px 32px rgba(129,140,248,.50), 0 0 0 3px rgba(9,8,14,.65); }
.qc-toggle:active { transform: scale(.96); }
.qc-toggle.qc-open { transform: rotate(45deg); }
.qc-plus { line-height: 1; }
.qc-panel {
  position: fixed; bottom: 90px; right: 24px; z-index: 9000;
  width: min(380px, calc(100vw - 32px)); max-height: calc(100vh - 130px); overflow-y: auto;
  background: rgba(9,8,14,.97); border: 1px solid rgba(129,140,248,.20);
  border-radius: 18px; padding: 16px;
  box-shadow: 0 20px 60px rgba(0,0,0,.60), 0 0 0 1px rgba(129,140,248,.08);
  backdrop-filter: blur(18px);
}
.qc-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.qc-close { background: transparent; border: none; color: var(--muted2); font-size: 22px; cursor: pointer; padding: 0 4px; line-height: 1; }
.qc-close:hover { color: var(--text); }
.qc-tabs { display: flex; gap: 4px; margin-bottom: 10px; flex-wrap: wrap; }
.qc-tab { flex: 1 1 auto; min-width: 70px; padding: 6px 8px; border-radius: 8px; border: 1px solid rgba(255,255,255,.08); background: transparent; color: var(--muted2); font-size: 11px; font-family: var(--mono); cursor: pointer; transition: .15s; }
.qc-tab:hover { color: var(--text); }
.qc-tab-active { background: rgba(129,140,248,.12); color: var(--indigo); border-color: rgba(129,140,248,.38); }
.qc-body { display: flex; flex-direction: column; gap: 4px; }
.qc-body input, .qc-body textarea, .qc-body select { width: 100%; padding: 8px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,.08); background: rgba(9,8,14,.55); color: var(--text); font-size: 13px; font-family: var(--sans); }
.qc-body textarea { min-height: 60px; resize: vertical; }
.qc-footer { margin-top: 12px; }
@media (max-width: 900px) { .qc-toggle { bottom: 88px; right: 16px; } .qc-panel { bottom: 156px; right: 16px; width: calc(100vw - 32px); } }

/* ─ Update toast ────────────────────────── */
.update-toast {
  position: fixed; top: 16px; left: 50%; transform: translateX(-50%);
  z-index: 9500; display: flex; align-items: center; gap: 12px;
  background: rgba(9,8,14,.97); border: 1px solid rgba(129,140,248,.38);
  color: var(--text); font-family: var(--mono); font-size: 13px;
  padding: 12px 18px; border-radius: 12px;
  box-shadow: 0 8px 30px rgba(0,0,0,.55);
  animation: slideDown .3s ease;
}
@keyframes slideDown { from { opacity:0; transform: translateX(-50%) translateY(-12px); } to { opacity:1; transform: translateX(-50%) translateY(0); } }
.update-toast button { border: 1px solid rgba(129,140,248,.42); background: rgba(129,140,248,.12); color: var(--indigo); padding: 6px 14px; border-radius: 8px; font-family: var(--mono); font-size: 12px; cursor: pointer; }
.update-toast button:hover { background: rgba(129,140,248,.22); }

/* ─ Beginner Journey ────────────────────── */
.beginner-primary-card { border-color: rgba(255,255,255,.08) !important; background: var(--panel) !important; }
.today-move-label {
  font-family: var(--serif);
  font-size: clamp(22px, 2.8vw, 36px);
  font-weight: 400;
  letter-spacing: -.03em;
  line-height: 1.08;
  color: var(--text);
  margin: 10px 0 4px;
}
.today-move-desc {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.55;
  margin-bottom: 14px;
}
.beginner-score-row { grid-template-columns: repeat(4, minmax(0,1fr)) !important; margin-top: 14px; }
.journey-card { border-color: rgba(255,255,255,.07) !important; }
.journey-steps { display: grid; gap: 9px; margin-top: 12px; }
.journey-step {
  width: 100%; text-align: left;
  display: grid; grid-template-columns: 28px minmax(0,1fr);
  align-items: center; gap: 10px; padding: 11px 12px;
  border-radius: 14px; border: 1px solid rgba(255,255,255,.08);
  background: rgba(16,14,26,.55); color: var(--text); cursor: pointer;
  transition: border-color .15s, background .15s;
}
.journey-step:hover { border-color: rgba(129,140,248,.28); background: rgba(129,140,248,.05); }
.journey-step span {
  width: 28px; height: 28px; display: grid; place-items: center;
  border-radius: 999px; background: rgba(255,255,255,.05);
  color: var(--muted); font-family: var(--mono); font-size: 12px;
}
.journey-step strong { font-size: 13px; line-height: 1.25; font-weight: 600; }
.journey-step.done { border-color: rgba(52,211,153,.22); background: rgba(52,211,153,.06); }
.journey-step.done span { background: rgba(52,211,153,.14); color: var(--emerald); }

/* Advanced section toggle — proper button, not <details> */
.advanced-toggle-btn {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  padding: 15px 18px; background: transparent; border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px; color: var(--muted); font-size: 13px; font-weight: 600;
  font-family: var(--sans); cursor: pointer; transition: border-color .15s, color .15s;
}
.advanced-toggle-btn:hover { border-color: rgba(129,140,248,.25); color: var(--text); }
.advanced-toggle-btn.open { border-color: rgba(129,140,248,.22); color: var(--text); background: rgba(129,140,248,.04); }
.advanced-toggle-btn .toggle-icon { font-size: 16px; color: var(--muted2); transition: transform .2s; }
.advanced-toggle-btn.open .toggle-icon { transform: rotate(180deg); color: var(--indigo); }
.advanced-section-body { display: none; }
.advanced-section-body.open { display: block; }

.compact-mission-list { margin-top: 10px; max-height: 215px; overflow: auto; }
.onboarding-modal { max-width: 620px !important; }
.modal-journey .journey-step { background: rgba(255,255,255,.03); }

/* Mission CTA hierarchy */
.mission-primary-btn {
  border-color: rgba(129,140,248,.40) !important;
  background: rgba(129,140,248,.12) !important;
  color: var(--indigo) !important;
  font-weight: 600 !important;
}
.mission-primary-btn:hover {
  border-color: var(--indigo) !important;
  background: rgba(129,140,248,.20) !important;
  color: var(--text) !important;
}
.mission-text-links {
  display: flex; gap: 16px; margin-top: 10px; flex-wrap: wrap;
}
.mission-text-link {
  font-size: 12.5px; font-family: var(--mono); color: var(--muted);
  background: none; border: none; cursor: pointer; padding: 0;
  letter-spacing: .04em;
  transition: color .14s;
}
.mission-text-link:hover { color: var(--indigo); }

/* ─ Light mode ──────────────────────────── */
body.light-mode {
  --bg: #f6f4ff; --bg2: #eeebff; --panel: rgba(255,255,255,.85);
  --panel2: rgba(250,249,255,.94); --line: rgba(30,20,80,.07);
  --text: #1a1635; --muted: #5a5280; --muted2: #9990bb;
  --shadow: 0 16px 50px rgba(30,20,80,.08);
}
body.light-mode {
  background:
    radial-gradient(1000px 600px at 80% -5%, rgba(99,102,241,.10), transparent 60%),
    radial-gradient(700px 500px at -5% 90%, rgba(129,140,248,.08), transparent 60%),
    linear-gradient(135deg, #f6f4ff, #eeebff) !important;
}
body.light-mode::before { background-image: linear-gradient(rgba(30,20,80,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(30,20,80,.03) 1px, transparent 1px) !important; opacity: .30 !important; }
body.light-mode .sidebar { background: rgba(255,255,255,.88) !important; border-color: rgba(30,20,80,.08) !important; }
body.light-mode .brand { background: linear-gradient(145deg, rgba(245,159,11,.12), rgba(255,255,255,.90) 50%, rgba(129,140,248,.07)) !important; border-color: rgba(245,159,11,.28) !important; }
body.light-mode .brand-mark { color: #1a1635 !important; }
body.light-mode .brand-mark em { color: #b45309 !important; text-shadow: 0 0 18px rgba(180,83,9,.25); }
body.light-mode .brand-tagline { color: #5a5280 !important; }
body.light-mode .brand-tagline strong { color: #1a1635 !important; }
body.light-mode .status-pill { background: rgba(245,159,11,.10) !important; border-color: rgba(245,159,11,.40) !important; color: #b45309 !important; }
body.light-mode .status-pill::before { background: #b45309 !important; box-shadow: 0 0 8px rgba(180,83,9,.40) !important; }
body.light-mode .nav button { color: #5a5280 !important; }
body.light-mode .nav button:hover { background: rgba(99,102,241,.08) !important; color: #1a1635 !important; border-color: rgba(99,102,241,.32) !important; }
body.light-mode .nav button.active { background: rgba(99,102,241,.12) !important; border-color: rgba(99,102,241,.38) !important; color: #1a1635 !important; box-shadow: inset 3px 0 0 #4f46e5 !important; }
body.light-mode .nav button.active > span:first-child b { color: #4f46e5 !important; }
body.light-mode .nav-ia-group { background: rgba(255,255,255,.55) !important; border-color: rgba(30,20,80,.08) !important; }
body.light-mode .nav-ia-group:has(button.active) { border-color: rgba(99,102,241,.25) !important; background: rgba(99,102,241,.06) !important; }
body.light-mode .nav-group-toggle { color: #5a5280 !important; }
body.light-mode .nav-group-toggle:hover { background: rgba(99,102,241,.07) !important; color: #1a1635 !important; }
body.light-mode .nav-ia-group.open .nav-group-toggle { background: rgba(255,255,255,.70) !important; color: #1a1635 !important; }
body.light-mode .nav-ia-group.open .nav-group-toggle b { color: #4f46e5 !important; }
body.light-mode .nav-group-toggle small, body.light-mode .nav-count { color: #9990bb !important; }
body.light-mode .tiny-btn, body.light-mode .copy-btn, body.light-mode .filter-btn, body.light-mode .action-btn { background: rgba(255,255,255,.82) !important; border-color: rgba(30,20,80,.10) !important; color: #1a1635 !important; }
body.light-mode .tiny-btn:hover, body.light-mode .copy-btn:hover, body.light-mode .filter-btn:hover, body.light-mode .action-btn:hover { background: rgba(99,102,241,.10) !important; border-color: #4f46e5 !important; color: #4f46e5 !important; }
body.light-mode .tiny-btn.danger, body.light-mode .action-btn.danger { background: rgba(251,113,133,.07) !important; border-color: rgba(239,68,68,.28) !important; color: #dc2626 !important; }
body.light-mode .primary-action { background: rgba(99,102,241,.12) !important; border-color: rgba(99,102,241,.38) !important; color: #4f46e5 !important; }
body.light-mode .mission-primary-btn { background: rgba(99,102,241,.14) !important; border-color: rgba(99,102,241,.42) !important; color: #4f46e5 !important; }
body.light-mode .hero { border-color: rgba(99,102,241,.20) !important; background: linear-gradient(140deg, rgba(99,102,241,.07), transparent 55%), linear-gradient(135deg, rgba(255,255,255,.96), rgba(242,240,255,.70)) !important; }
body.light-mode .hero h2 strong { background: rgba(245,159,11,.14) !important; color: #b45309 !important; border-bottom-color: #b45309 !important; }
body.light-mode .hero .lead { color: #5a5280 !important; }
body.light-mode .card { background: rgba(255,255,255,.80) !important; border-color: rgba(30,20,80,.09) !important; box-shadow: 0 4px 20px rgba(30,20,80,.06) !important; }
body.light-mode .card::before { background: linear-gradient(90deg, transparent, rgba(99,102,241,.18), transparent) !important; }
body.light-mode .card p, body.light-mode .card li { color: #5a5280 !important; }
body.light-mode .focus-card { border-color: rgba(245,159,11,.26) !important; background: linear-gradient(140deg, rgba(245,159,11,.07), transparent 55%), rgba(255,255,255,.84) !important; }
body.light-mode .tag { background: rgba(255,255,255,.68) !important; border-color: rgba(30,20,80,.12) !important; color: #1a1635 !important; }
body.light-mode .tag.cyan, body.light-mode .tag.indigo { border-color: rgba(79,70,229,.32) !important; background: rgba(79,70,229,.08) !important; color: #4f46e5 !important; }
body.light-mode .tag.blue   { border-color: rgba(2,132,199,.30) !important; background: rgba(2,132,199,.08) !important; color: #0284c7 !important; }
body.light-mode .tag.green  { border-color: rgba(5,150,105,.30) !important; background: rgba(5,150,105,.08) !important; color: #059669 !important; }
body.light-mode .tag.amber  { border-color: rgba(180,83,9,.30) !important; background: rgba(245,159,11,.10) !important; color: #b45309 !important; }
body.light-mode .tag.red, body.light-mode .tag.danger, body.light-mode .tag.magenta { border-color: rgba(220,38,38,.28) !important; background: rgba(220,38,38,.08) !important; color: #dc2626 !important; }
body.light-mode .tag.purple { border-color: rgba(124,58,237,.28) !important; background: rgba(124,58,237,.08) !important; color: #7c3aed !important; }
body.light-mode .callout.info   { background: rgba(56,189,248,.07) !important; border-color: rgba(2,132,199,.30) !important; }
body.light-mode .callout.good   { background: rgba(5,150,105,.06) !important; border-color: rgba(5,150,105,.30) !important; }
body.light-mode .callout.warn   { background: rgba(245,159,11,.08) !important; border-color: rgba(180,83,9,.30) !important; }
body.light-mode .callout.danger { background: rgba(220,38,38,.07) !important; border-color: rgba(220,38,38,.30) !important; }
body.light-mode .output-box, body.light-mode .copy-box { background: rgba(255,255,255,.84) !important; border-color: rgba(99,102,241,.22) !important; color: #1a1635 !important; }
body.light-mode input, body.light-mode textarea, body.light-mode select { background: rgba(255,255,255,.84) !important; border-color: rgba(30,20,80,.10) !important; color: #1a1635 !important; }
body.light-mode input:focus, body.light-mode textarea:focus, body.light-mode select:focus { border-color: #4f46e5 !important; box-shadow: 0 0 0 3px rgba(79,70,229,.10) !important; }
body.light-mode .calendar-day { background: rgba(255,255,255,.70) !important; border-color: rgba(30,20,80,.08) !important; }
body.light-mode .calendar-day.today { border-color: rgba(180,83,9,.48) !important; background: rgba(245,159,11,.10) !important; }
body.light-mode .calendar-day.selected { border-color: #4f46e5 !important; box-shadow: 0 0 0 3px rgba(79,70,229,.12) !important; }
body.light-mode .calendar-detail { background: rgba(255,255,255,.75) !important; border-color: rgba(30,20,80,.10) !important; }
body.light-mode .calendar-event { background: rgba(255,255,255,.88) !important; border-color: rgba(30,20,80,.08) !important; }
body.light-mode .health-item { background: rgba(255,255,255,.72) !important; border-color: rgba(30,20,80,.09) !important; }
body.light-mode .ai-badge { background: rgba(99,102,241,.10) !important; color: #4f46e5 !important; border-color: rgba(79,70,229,.35) !important; }
body.light-mode .toast { background: rgba(255,255,255,.97) !important; color: #059669 !important; border-color: rgba(5,150,105,.38) !important; }
body.light-mode .modal { background: rgba(255,255,255,.99) !important; border-color: rgba(79,70,229,.25) !important; }
body.light-mode .dash-stat { background: rgba(255,255,255,.84) !important; border-color: rgba(30,20,80,.09) !important; }
body.light-mode .dash-stat::before { background: linear-gradient(90deg, transparent, rgba(99,102,241,.18), transparent) !important; }
body.light-mode .dash-stat-value { color: #1a1635 !important; }
body.light-mode .dash-stat.amber .dash-stat-value  { color: #b45309 !important; }
body.light-mode .dash-stat.green .dash-stat-value  { color: #059669 !important; }
body.light-mode .dash-stat.cyan  .dash-stat-value,
body.light-mode .dash-stat.indigo .dash-stat-value { color: #4f46e5 !important; }
body.light-mode .mobile-top { background: rgba(255,255,255,.92) !important; border-color: rgba(30,20,80,.08) !important; }
body.light-mode .mobile-bottom { background: rgba(255,255,255,.96) !important; border-color: rgba(30,20,80,.09) !important; }
body.light-mode .mobile-bottom button { color: #5a5280 !important; }
body.light-mode .mobile-bottom button.active { background: rgba(79,70,229,.12) !important; color: #4f46e5 !important; }
body.light-mode .atlas-rail { background: linear-gradient(90deg, #1e1b4b, #312e81 30%, #1e1b4b) !important; border-top-color: rgba(129,140,248,.22) !important; color: rgba(165,180,252,.70) !important; }
body.light-mode .atlas-rail b { color: #f59e0b !important; }
body.light-mode .atlas-rail .quip { color: rgba(165,180,252,.55) !important; }
body.light-mode .journey-step { background: rgba(255,255,255,.65) !important; border-color: rgba(30,20,80,.09) !important; }
body.light-mode .journey-step:hover { border-color: rgba(79,70,229,.28) !important; background: rgba(79,70,229,.06) !important; }
body.light-mode .journey-step.done { border-color: rgba(5,150,105,.28) !important; background: rgba(5,150,105,.07) !important; }
body.light-mode .advanced-toggle-btn { border-color: rgba(30,20,80,.09) !important; color: #5a5280 !important; background: rgba(255,255,255,.65) !important; }
body.light-mode .advanced-toggle-btn:hover { border-color: rgba(79,70,229,.28) !important; color: #1a1635 !important; }
body.light-mode .advanced-toggle-btn.open { border-color: rgba(79,70,229,.28) !important; background: rgba(79,70,229,.06) !important; }
body.light-mode .pomo-mini { border-color: rgba(79,70,229,.28) !important; background: rgba(99,102,241,.07) !important; }
body.light-mode .qc-panel { background: rgba(255,255,255,.98) !important; border-color: rgba(79,70,229,.22) !important; }
body.light-mode .qc-tab { border-color: rgba(30,20,80,.10) !important; color: #5a5280 !important; }
body.light-mode .qc-tab-active { background: rgba(79,70,229,.10) !important; color: #4f46e5 !important; border-color: rgba(79,70,229,.38) !important; }
body.light-mode .score-card { background: rgba(255,255,255,.74) !important; border-color: rgba(30,20,80,.09) !important; }
body.light-mode .score-ring-mini { background: conic-gradient(#4f46e5 calc(var(--score)*1%), rgba(30,20,80,.10) 0) !important; }
body.light-mode .score-ring-mini strong { background: rgba(255,255,255,.92) !important; color: #1a1635 !important; }
body.light-mode .digest-card { background: linear-gradient(140deg, rgba(5,150,105,.06), rgba(79,70,229,.05) 55%, rgba(255,255,255,.74)) !important; border-color: rgba(5,150,105,.20) !important; }
body.light-mode .digest-stat { background: rgba(255,255,255,.74) !important; border-color: rgba(30,20,80,.09) !important; }
body.light-mode .digest-grade.B { color: #4f46e5 !important; }
body.light-mode .digest-grade.A { color: #059669 !important; }
body.light-mode .digest-grade.C { color: #b45309 !important; }
body.light-mode .digest-grade.D { color: #ea580c !important; }
body.light-mode .digest-grade.F { color: #dc2626 !important; }
body.light-mode .worker-diag-row { background: rgba(255,255,255,.74) !important; }
body.light-mode .worker-diag-body strong { color: #1a1635 !important; }
body.light-mode .update-toast { background: rgba(255,255,255,.98) !important; border-color: rgba(79,70,229,.32) !important; }
body.light-mode .project-roadmap-card { background: rgba(255,255,255,.80) !important; border-color: rgba(30,20,80,.09) !important; }

/* ─ Responsive ──────────────────────────── */
@media (max-width: 980px) {
  .dash-stats { grid-template-columns: 1fr 1fr; }
  .score-grid { grid-template-columns: 1fr 1fr; }
  .project-roadmap-grid { grid-template-columns: 1fr; }
  .resume-lab-hero { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .dash-stats { grid-template-columns: 1fr 1fr; }
  .beginner-score-row { grid-template-columns: 1fr 1fr !important; }
  .dash-stat { padding: 14px 16px; }
  .dash-stat-value { font-size: 28px; }
  .today-move-label { font-size: 22px; }
  .mentor-meta-row { gap: 8px; }
  .mentor-regen { margin-left: 0; width: 100%; text-align: center; }
  .score-grid { grid-template-columns: 1fr; }
  .cloudflare-flow b { display: none; }
  .mobile-bottom { grid-template-columns: repeat(3,1fr) !important; }
}
@media print { body::after, body::before { display: none !important; } .atlas-rail { display: none !important; } }