/* ==========================================================================
   Light (warm porcelain / iris / marigold theme) — the default.
   styles.css holds the original dark theme; everything here is scoped to
   html[data-theme="light"] so it wins over styles.css and page <style> blocks.
   Tokens follow .agents/skills/clinical-design-system.
   ========================================================================== */

html[data-theme="light"] {
  color-scheme: light;

  /* Palette: white canvas, warm porcelain surfaces #faf7f4, iris #4c35c4
     (actions, white text 8:1), marigold #f2a93b (monitor-amber edges and
     indicators only, too light for text). Stone inks keep copy ≥ 7:1. */
  --med-bg-canvas: #ffffff;
  --med-bg-surface: #faf7f4;
  --med-bg-raised: #ffffff;            /* cards inside a panel */
  --med-bg-subtle: #f3eee8;
  --med-bg-hover: #ebe4dc;
  --med-border: #e7dfd6;
  --med-border-strong: #8a8178;       /* warm stone, 3.8:1 on white */
  --med-primary: #4c35c4;             /* iris */
  --med-primary-accent: #4c35c4;
  --med-primary-hover: #33227f;       /* hover + link text, 12.5:1 on white */
  --med-primary-light: #f1eefc;       /* iris tint for selection */
  --med-primary-light-border: #cfc6f3;
  --med-brass: #f2a93b;               /* signature edge (marigold) */
  --med-teal: #f2a93b;
  --med-hero-edge: #3b82f6;            /* intro panel side stripe (blue) */
  --med-teal-text: #8a4a07;           /* marigold darkened for label text, 6.9:1 */
  --med-text-primary: #1c1917;
  --med-text-secondary: #44403c;
  --med-text-muted: #57534e;          /* 7.6:1 on white */
  --med-emergency-red: #c81e1e;
  --med-emergency-red-text: #9b1c1c;
  --med-emergency-red-bg: #fdf0f0;
  --med-emergency-red-border: #f4b4b4;
  --med-urgent-amber-text: #8a3a06;
  --med-urgent-amber-bg: #fff6e6;
  --med-urgent-amber-border: #f2c97a;
  --med-stable-green: #047857;
  --med-stable-green-text: #065f46;
  --med-stable-green-bg: #ebf8f2;
  --med-stable-green-border: #9fdcc3;
  --med-shadow-sm: 0 0 0 1px rgb(68 49 30 / 0.03), 0 1px 2px 0 rgb(68 49 30 / 0.07);
  --med-shadow-md: 0 0 0 1px rgb(68 49 30 / 0.03), 0 1px 3px 0 rgb(68 49 30 / 0.07), 0 8px 20px -8px rgb(76 53 196 / 0.12);
  --med-shadow-lg: 0 0 0 1px rgb(68 49 30 / 0.04), 0 18px 40px -12px rgb(76 53 196 / 0.18), 0 2px 6px -2px rgb(68 49 30 / 0.08);
  --med-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Shared tokens used by inline styles / JS (dark values in styles.css) */
  --ink-strong: #1c1917;
  --ink-mid: #44403c;
  --ink-soft: #44403c;
  --ink-faint: #57534e;
  --ink-accent: #33227f;
  --ink-ok: #065f46;
  --ink-bad: #9b1c1c;
  --line: #d9cfc4;
  --line-soft: #e7dfd6;
  --surface-inset: #f3eee8;
  --surface-inset-deep: #ebe4dc;
  --chart-line: #4c35c4;
  --chart-fill: rgba(242, 169, 59, 0.18);
  --chart-grid: #ede7e0;

  /* Variables used by quiz.html / quiz-config.html */
  --bg-primary: #faf7f4;
  --bg-secondary: #f3eee8;
  --text-primary: #1c1917;
  --text-secondary: #57534e;
  --border-color: #e7dfd6;
  --accent-color: #4c35c4;
  --success-color: #065f46;
  --error-color: #9b1c1c;
  --warning-color: #8a3a06;

  background: var(--med-bg-canvas);
  color: var(--med-text-primary);
}

html[data-theme="light"] body { background: var(--med-bg-canvas); color: var(--med-text-primary); }
html[data-theme="light"] :focus-visible { outline-color: var(--med-primary-accent); }
html[data-theme="light"] .skip-link { background: var(--med-primary); color: #ffffff; }

/* ── Base surfaces & text ───────────────────────────────────────────────── */
html[data-theme="light"] .card {
  background: var(--med-bg-surface);
  border-color: var(--med-border);
  box-shadow: var(--med-shadow-md);
  backdrop-filter: none;
}
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-lite-title,
html[data-theme="light"] .scenario-badge,
html[data-theme="light"] .step-chip,
html[data-theme="light"] .bot-label { color: var(--med-primary-hover); }
html[data-theme="light"] .creator-mark { color: var(--med-teal-text); }
html[data-theme="light"] .muted,
html[data-theme="light"] .tiny-note,
html[data-theme="light"] .scenario-footer,
html[data-theme="light"] .progress-meta,
html[data-theme="light"] .nav-user-badge,
html[data-theme="light"] .settings-desc { color: var(--med-text-muted); }
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3 { color: var(--med-text-primary); }

html[data-theme="light"] .stat-card {
  background: var(--med-bg-subtle);
  border-color: var(--med-border);
}
html[data-theme="light"] .stat-card strong { color: var(--med-text-primary); }
html[data-theme="light"] .stat-card span { color: var(--med-text-muted); }

/* ── Module / chapter cards ─────────────────────────────────────────────── */
html[data-theme="light"] .module-card,
html[data-theme="light"] .learning-module-card,
html[data-theme="light"] .chapter-card,
html[data-theme="light"] .scenario-card {
  background: var(--med-bg-surface);
  border-color: var(--med-border);
  color: var(--med-text-primary);
  box-shadow: var(--med-shadow-sm);
}
html[data-theme="light"] .module-card:hover,
html[data-theme="light"] .learning-module-card:hover,
html[data-theme="light"] .chapter-card:hover,
html[data-theme="light"] .scenario-card:hover {
  background: var(--med-bg-surface);
  border-color: var(--med-primary-accent);
  box-shadow: var(--med-shadow-md);
}
html[data-theme="light"] .learning-module-name { color: var(--med-text-primary); }
html[data-theme="light"] .learning-module-desc { color: var(--med-text-muted); }
html[data-theme="light"] .learning-module-arrow { color: var(--med-primary-accent); }
html[data-theme="light"] .chapter-index { background: var(--med-primary-light); color: var(--med-primary-hover); }
html[data-theme="light"] .chapter-arrow { color: var(--med-text-muted); }

html[data-theme="light"] .chapter-nav-item { color: var(--med-text-secondary); }
html[data-theme="light"] .chapter-nav-item:hover { background: var(--med-bg-subtle); color: var(--med-text-primary); }
html[data-theme="light"] .chapter-nav-item.active {
  background: var(--med-primary-light);
  color: var(--med-primary-hover);
  border-color: var(--med-primary-accent);
}
html[data-theme="light"] .chapter-nav-index { color: var(--med-primary-hover); }
html[data-theme="light"] .chapter-prose { color: var(--med-text-secondary); }
html[data-theme="light"] .chapter-nav-list { border-top-color: var(--med-border); }
html[data-theme="light"] .breadcrumb-row { color: var(--med-text-muted); }
html[data-theme="light"] .breadcrumb-row a { color: var(--med-primary-hover); }
html[data-theme="light"] .breadcrumb-sep { color: var(--med-text-muted); }

/* ── Buttons ────────────────────────────────────────────────────────────── */
html[data-theme="light"] .ghost-btn {
  background: var(--med-bg-surface);
  color: var(--med-text-secondary);
  border-color: var(--line);
}
html[data-theme="light"] .ghost-btn:hover { background: var(--med-bg-subtle); border-color: var(--med-border-strong); }
html[data-theme="light"] .accent-btn,
html[data-theme="light"] .submit-btn,
html[data-theme="light"] .link-btn,
html[data-theme="light"] .mode-btn.active {
  background: var(--med-primary-accent);
  color: #ffffff;
}
html[data-theme="light"] .accent-btn:hover,
html[data-theme="light"] .submit-btn:hover,
html[data-theme="light"] .link-btn:hover { background: var(--med-primary-hover); }
html[data-theme="light"] .danger-btn {
  background: var(--med-emergency-red);
  color: #ffffff;
  border-color: var(--med-emergency-red);
}
html[data-theme="light"] .danger-btn:hover { background: var(--med-emergency-red-text); }

/* ── Welcome assistant ──────────────────────────────────────────────────── */
html[data-theme="light"] .welcome-avatar { border-color: var(--med-border-strong); box-shadow: var(--med-shadow-lg); }
html[data-theme="light"] .welcome-blob {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: #000000;
  box-shadow: var(--med-shadow-md);
}

/* ── Games ──────────────────────────────────────────────────────────────── */
html[data-theme="light"] .flashcard {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-text-primary);
  box-shadow: var(--med-shadow-md);
}
html[data-theme="light"] .match-tile {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-text-primary);
}
html[data-theme="light"] .match-tile.selected { border-color: var(--med-primary-accent); background: var(--med-primary-light); }
html[data-theme="light"] .match-tile.matched { border-color: var(--med-stable-green); background: var(--med-stable-green-bg); }
html[data-theme="light"] .match-tile.wrong { border-color: var(--med-emergency-red); background: var(--med-emergency-red-bg); }

/* ── Progress / scenario steps ──────────────────────────────────────────── */
html[data-theme="light"] .progress-bar { background: var(--med-bg-hover); }
html[data-theme="light"] .progress-fill { background: var(--med-primary-accent); }
html[data-theme="light"] .step-card,
html[data-theme="light"] .sidebar-card {
  background: var(--med-bg-surface);
  border-color: var(--med-border);
}
html[data-theme="light"] .step-card.wrong { background: var(--med-emergency-red-bg); border-color: var(--med-emergency-red-border); }
html[data-theme="light"] .step-pill { background: var(--med-bg-subtle); color: var(--med-text-primary); }
html[data-theme="light"] .step-pill.active { background: var(--med-primary-light); border-color: var(--med-primary-accent); }
html[data-theme="light"] .step-pill.wrong {
  background: var(--med-emergency-red-bg);
  border-color: var(--med-emergency-red-border);
  color: var(--med-emergency-red-text);
}
html[data-theme="light"] .summary-strip {
  background: var(--med-primary-light);
  border-color: var(--med-primary-light-border);
  color: var(--med-text-primary);
}

/* ── Questions / results ────────────────────────────────────────────────── */
html[data-theme="light"] .question-block { border-top-color: var(--med-border); }
html[data-theme="light"] .option-row { background: var(--med-bg-subtle); color: var(--med-text-primary); }
html[data-theme="light"] .option-row:hover { background: var(--med-primary-light); }
html[data-theme="light"] .score-pill { background: var(--med-primary-light); border-color: var(--med-primary-accent); color: var(--med-primary); }
html[data-theme="light"] .result-item.correct { background: var(--med-stable-green-bg); border-color: var(--med-stable-green-border); }
html[data-theme="light"] .result-item.wrong,
html[data-theme="light"] .result-item.incorrect { background: var(--med-emergency-red-bg); border-color: var(--med-emergency-red-border); }
html[data-theme="light"] .result-item.correct { border-inline-start-color: var(--med-stable-green); }
html[data-theme="light"] .result-item.incorrect { border-inline-start-color: var(--med-emergency-red); }
html[data-theme="light"] .option-label.correct { background-color: var(--med-stable-green-bg); }
html[data-theme="light"] .option-label.incorrect { background-color: var(--med-emergency-red-bg); }
html[data-theme="light"] .difficulty-1 { background-color: var(--med-stable-green-bg); }
html[data-theme="light"] .difficulty-2 { background-color: var(--med-urgent-amber-bg); }
html[data-theme="light"] .difficulty-3 { background-color: var(--med-emergency-red-bg); }
html[data-theme="light"] .btn-next:hover:not(:disabled),
html[data-theme="light"] .btn-restart:hover { background-color: var(--med-primary-hover); }
html[data-theme="light"] .btn-finish:hover:not(:disabled) { background-color: #064e3b; }
html[data-theme="light"] .btn-home { background-color: #57534e; }
html[data-theme="light"] .btn-home:hover { background-color: #44403c; }
html[data-theme="light"] .option-btn.selected,
html[data-theme="light"] .difficulty-btn.selected { color: #ffffff; }

/* ── Scenario bot ───────────────────────────────────────────────────────── */
html[data-theme="light"] .bot-select,
html[data-theme="light"] .bot-input {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-text-primary);
}
html[data-theme="light"] .bot-select:focus,
html[data-theme="light"] .bot-input:focus { border-color: var(--med-primary-accent); }
html[data-theme="light"] .mode-toggle { background: var(--med-bg-subtle); }
html[data-theme="light"] .mode-btn { color: var(--med-text-secondary); }
html[data-theme="light"] .msg-content {
  background: var(--med-bg-subtle);
  border-color: var(--med-border);
  color: var(--med-text-primary);
}
html[data-theme="light"] .bot-msg-bot .msg-content {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
}
html[data-theme="light"] .bot-msg-user .msg-content { background: var(--med-primary-accent); color: #ffffff; }
html[data-theme="light"] .bot-msg-system .msg-content {
  background: var(--med-primary-light);
  border-color: var(--med-primary-light-border);
  color: var(--med-text-secondary);
}
html[data-theme="light"] .bot-sidebar-header-title { color: var(--med-primary-hover); }

/* ── Settings / toggles ─────────────────────────────────────────────────── */
html[data-theme="light"] .settings-card { background: var(--med-bg-surface); border-color: var(--med-border); }
html[data-theme="light"] .settings-card:hover { border-color: var(--med-border-strong); }
html[data-theme="light"] .settings-title { color: var(--med-text-primary); }
html[data-theme="light"] .toggle-slider { background-color: var(--med-border-strong); border-color: var(--med-border-strong); }
html[data-theme="light"] .toggle-switch input:checked + .toggle-slider { background: var(--med-primary-accent); border-color: var(--med-primary-accent); }
html[data-theme="light"] .toggle-switch input:focus-visible + .toggle-slider { outline-color: var(--med-primary-accent); }
html[data-theme="light"] .icon-toggle-btn {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-primary-accent);
  box-shadow: var(--med-shadow-sm);
}
html[data-theme="light"] .icon-toggle-btn:hover {
  border-color: var(--med-primary-accent);
  color: var(--med-primary-hover);
  box-shadow: var(--med-shadow-md);
}
html[data-theme="light"] .icon-toggle-btn.disabled { background: var(--med-bg-subtle); color: var(--med-text-muted); }
html[data-theme="light"] .icon-toggle-btn.disabled:hover { border-color: var(--med-emergency-red); color: var(--med-emergency-red-text); box-shadow: none; }

/* ── Modals ─────────────────────────────────────────────────────────────── */
html[data-theme="light"] .modal-backdrop { background: rgba(28, 25, 23, 0.45); }
html[data-theme="light"] .modal-box {
  background: var(--med-bg-surface);
  border-color: var(--med-border);
  color: var(--med-text-primary);
  box-shadow: var(--med-shadow-lg);
}

/* ── Navigation / PWA ───────────────────────────────────────────────────── */
html[data-theme="light"] .nav-menu { border-top-color: var(--med-border); }
html[data-theme="light"] .pwa-install-btn { border-color: var(--med-border-strong); color: var(--med-primary-hover); }
html[data-theme="light"] .pwa-install-btn:hover { background: var(--med-primary-light); border-color: var(--med-primary-accent); color: var(--med-primary-hover); }
html[data-theme="light"] .pwa-safari-hint {
  background: var(--med-bg-surface);
  border-color: var(--med-border);
  color: var(--med-text-secondary);
  box-shadow: var(--med-shadow-lg);
  backdrop-filter: none;
}
html[data-theme="light"] .pwa-safari-hint p { color: var(--med-primary-hover); }

/* ── Login / register (page <style> blocks) ─────────────────────────────── */
html[data-theme="light"] .auth-form label,
html[data-theme="light"] .auth-link { color: var(--med-text-secondary); }
html[data-theme="light"] .auth-form input {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-text-primary);
}
html[data-theme="light"] .auth-form input:focus { border-color: var(--med-primary-accent); }
html[data-theme="light"] .auth-form .error { color: var(--med-emergency-red-text); }
html[data-theme="light"] .auth-link a,
html[data-theme="light"] .tos-row a { color: var(--med-primary-hover); }

/* ── Profile (page <style> block) ───────────────────────────────────────── */
html[data-theme="light"] .scope-btn { border-color: var(--med-border-strong); color: var(--med-text-secondary); background: var(--med-bg-surface); }
html[data-theme="light"] .scope-btn:hover { border-color: var(--med-primary-accent); }
html[data-theme="light"] .scope-btn.active { background: var(--med-primary-accent); border-color: var(--med-primary-accent); color: #ffffff; }
html[data-theme="light"] .activity-item { background: var(--med-bg-surface); border-color: var(--med-border); }
html[data-theme="light"] .activity-header:hover { background: var(--med-bg-subtle); }
html[data-theme="light"] .activity-type,
html[data-theme="light"] .expand-icon { color: var(--med-primary-hover); }
html[data-theme="light"] .activity-score.good { color: var(--med-stable-green-text); }
html[data-theme="light"] .activity-score.ok { color: var(--med-urgent-amber-text); }
html[data-theme="light"] .activity-score.bad { color: var(--med-emergency-red-text); }
html[data-theme="light"] .activity-date,
html[data-theme="light"] .empty-state { color: var(--med-text-muted); }
html[data-theme="light"] .activity-details { border-top-color: var(--med-border); }
html[data-theme="light"] .detail-row.correct { background: var(--med-stable-green-bg); }
html[data-theme="light"] .detail-row.incorrect { background: var(--med-emergency-red-bg); }
html[data-theme="light"] .detail-q { color: var(--med-text-primary); }
html[data-theme="light"] .detail-answer .yours,
html[data-theme="light"] .detail-answer .wrong-label { color: var(--med-emergency-red-text); }
html[data-theme="light"] .detail-answer .correct-label,
html[data-theme="light"] .detail-answer .actual-correct { color: var(--med-stable-green-text); }
html[data-theme="light"] .detail-answer { border-top-color: var(--med-border); }

/* ── Admin (page <style> block) ─────────────────────────────────────────── */
html[data-theme="light"] .admin-tabs { border-bottom-color: var(--med-border); }
html[data-theme="light"] .admin-tab-btn {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-text-secondary);
}
html[data-theme="light"] .admin-tab-btn:hover { background: var(--med-bg-subtle); color: var(--med-text-primary); border-color: var(--med-border-strong); }
html[data-theme="light"] .admin-tab-btn.active {
  background: var(--med-primary-accent);
  color: #ffffff;
  border-color: var(--med-primary-accent);
  box-shadow: var(--med-shadow-sm);
}
html[data-theme="light"] .admin-table-wrap { background: var(--med-bg-surface); border-color: var(--med-border); }
html[data-theme="light"] .admin-table th,
html[data-theme="light"] .admin-table td { border-bottom-color: var(--med-border); }
html[data-theme="light"] .admin-table th { background: var(--med-bg-subtle); color: var(--med-primary); }
html[data-theme="light"] .admin-table tr:hover td { background: var(--med-bg-canvas); }
html[data-theme="light"] .role-admin,
html[data-theme="light"] .badge-draft {
  background: var(--med-urgent-amber-bg);
  color: var(--med-urgent-amber-text);
  border-color: var(--med-urgent-amber-border);
}
html[data-theme="light"] .role-user { background: var(--med-bg-subtle); color: var(--med-text-secondary); border-color: var(--med-border-strong); }
html[data-theme="light"] .badge-published {
  background: var(--med-stable-green-bg);
  color: var(--med-stable-green-text);
  border-color: var(--med-stable-green-border);
}
html[data-theme="light"] .admin-input {
  background: var(--med-bg-surface);
  border-color: var(--med-border-strong);
  color: var(--med-text-primary);
}
html[data-theme="light"] .admin-input:focus { border-color: var(--med-primary-accent); }
html[data-theme="light"] .tag-badge { background: var(--med-primary-light); color: var(--med-primary-hover); }
html[data-theme="light"] .status-msg.success {
  background: var(--med-stable-green-bg);
  border-color: var(--med-stable-green-border);
  color: var(--med-stable-green-text);
}
html[data-theme="light"] .status-msg.error {
  background: var(--med-emergency-red-bg);
  border-color: var(--med-emergency-red-border);
  color: var(--med-emergency-red-text);
}
html[data-theme="light"] .script-card { background: var(--med-bg-subtle); border-color: var(--med-border); }

/* Form controls without a dedicated class (admin forms, quiz-config inputs) */
html[data-theme="light"] select,
html[data-theme="light"] textarea { color: var(--med-text-primary); }

/* ── Signature: intro panel with a blue side stripe ─────────────────── */
html[data-theme="light"] .intro-panel {
  background: var(--med-bg-surface);
  border-color: var(--med-border);
  border-inline-start: 4px solid var(--med-hero-edge);
  box-shadow: var(--med-shadow-lg);
}
html[data-theme="light"] .intro-panel h1 { color: var(--med-text-primary); letter-spacing: -0.02em; }
html[data-theme="light"] .intro-panel .lead { color: var(--med-text-secondary); }
html[data-theme="light"] .intro-panel .creator-mark { color: var(--med-teal-text); }

/* Readouts: numbers in monospace, like a vitals monitor */
html[data-theme="light"] .chapter-index,
html[data-theme="light"] .score-pill,
html[data-theme="light"] .stat-card strong { font-family: var(--med-mono); }
html[data-theme="light"] .stat-card { border-top: 2px solid var(--med-brass); }

/* Category labels in dark marigold so they never compete with iris actions */
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .section-lite-title { color: var(--med-teal-text); }

/* Nav sits flatter than content cards */
html[data-theme="light"] .nav-panel { box-shadow: var(--med-shadow-sm); }

/* Inputs: visible edges + iris focus ring (marigold is too light for 3:1) */
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="text"],
html[data-theme="light"] select,
html[data-theme="light"] textarea { border-color: var(--med-border-strong); }
html[data-theme="light"] input:focus-visible,
html[data-theme="light"] select:focus-visible,
html[data-theme="light"] textarea:focus-visible {
  outline: 2px solid var(--med-primary-accent);
  outline-offset: 1px;
}

/* ── Hierarchy: white page → porcelain panel → white card ───────────────
   One step of contrast per level, and corners tighten as you go inward. */
html[data-theme="light"] .card { border-radius: 20px; }
html[data-theme="light"] .module-card,
html[data-theme="light"] .learning-module-card,
html[data-theme="light"] .chapter-card,
html[data-theme="light"] .scenario-card,
html[data-theme="light"] .step-card,
html[data-theme="light"] .sidebar-card,
html[data-theme="light"] .settings-card,
html[data-theme="light"] .activity-item,
html[data-theme="light"] .admin-table-wrap,
html[data-theme="light"] .flashcard,
html[data-theme="light"] .match-tile {
  background: var(--med-bg-raised);
  border-radius: 12px;
}
html[data-theme="light"] .module-card:hover,
html[data-theme="light"] .learning-module-card:hover,
html[data-theme="light"] .chapter-card:hover,
html[data-theme="light"] .scenario-card:hover { background: var(--med-bg-raised); }
html[data-theme="light"] .auth-form input,
html[data-theme="light"] .admin-input,
html[data-theme="light"] .bot-input,
html[data-theme="light"] .bot-select { background: var(--med-bg-raised); }

/* ── Buttons: one size everywhere, centred in cards ──────────────────── */
html[data-theme="light"] .ghost-btn,
html[data-theme="light"] .accent-btn,
html[data-theme="light"] .danger-btn,
html[data-theme="light"] .submit-btn { border-radius: 10px; }
html[data-theme="light"] .accent-btn,
html[data-theme="light"] .submit-btn {
  min-height: 42px;
  padding: 10px 18px;
  font-size: 0.95rem;
  font-weight: 600;
}
html[data-theme="light"] .scenario-card .button-row {
  justify-content: center;
  align-items: center;
  gap: 16px;
}
html[data-theme="light"] .scenario-card .button-row a.accent-btn {
  min-height: 42px;
  padding: 10px 18px;
  font-size: 0.95rem;
  font-weight: 600;
}
html[data-theme="light"] .scenario-card .button-row a.text-link {
  min-height: 0;
  padding: 0;
  font-size: 0.95rem;
  color: var(--med-primary-hover);
}
html[data-theme="light"] .scenario-card:hover .card-link { background: var(--med-primary-hover); }
html[data-theme="light"] .scenario-card:focus-within { border-color: var(--med-primary-accent); }
html[data-theme="light"] .nav-panel .accent-btn {
  min-height: 0;
  padding: 8px 10px;
  font-size: 0.92rem;
}

/* ── Home hero: one sentence of purpose ─────────────────────────────── */
html[data-theme="light"] .intro-panel .lead {
  max-width: 60ch;
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.55;
}

/* Context labels: sentence case and quiet, so marigold only marks the hero edge */
html[data-theme="light"] .eyebrow,
html[data-theme="light"] .scenario-badge {
  text-transform: none;
  letter-spacing: 0;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--med-text-muted);
}