/* One calm reading space, in daylight or after dark. Loaded after the palette. */
.topbar { position: sticky; top: 0; z-index: 9; }
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  gap: 7px;
  min-width: 76px;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #c7d1c0;
  border-radius: 9px;
  background: #eef2e9;
  color: #31543b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}
.theme-toggle svg { width: 18px; height: 18px; stroke-width: 1.7; }
.theme-toggle:hover { background: #e5ecdf; border-color: #9ba992; }
.theme-toggle:focus-visible { outline: 3px solid #426950; outline-offset: 3px; }

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #111a16;
  --surface: #1a2620;
  --paper: #1a2620;
  --surface-soft: #202d25;
  --wash: #202d25;
  --ink: #e8ede5;
  --ink-strong: #e8ede5;
  --muted: #b1bfb0;
  --muted-readable: #b1bfb0;
  --ink-secondary: #b1bfb0;
  --green: #b4d09b;
  --green-dark: #c6deb2;
  --action: #b4d09b;
  --line: #3c4d40;
  --line-soft: #3c4d40;
  --lime: #b4d09b;
  --gold: #d3bb87;
  --gold-ink: #d3bb87;
  --orange: #edb88d;
  --shadow: 0 5px 25px #0000001f;
  --feedback-paper: #202d25;
  --feedback-ink: #e8ede5;
  --feedback-secondary: #b1bfb0;
  --feedback-success: #b4d09b;
  --feedback-info: #a5c9d5;
  --feedback-warning: #e0c28b;
  --feedback-error: #f0aea0;
  background: var(--bg);
  color: var(--ink);
}
html[data-theme="dark"] body { background: var(--bg); color: var(--ink); }
html[data-theme="dark"] ::selection { background: #b4d09b; color: #172218; }
html[data-theme="dark"] :is(button, a, input, textarea, select, summary):focus-visible {
  outline-color: #d3bb87;
}
html[data-theme="dark"] :is(input, textarea) { caret-color: #b4d09b; }
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #a1b09f; opacity: 1; }

/* Navigation remains a quiet supporting surface. */
html[data-theme="dark"] :is(.sidebar, .topbar) {
  background: #17221c;
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] :is(.brand, .sidebar .brand) { color: var(--ink); }
html[data-theme="dark"] :is(.brand-icon, .mobile-brand .brand-icon) {
  background: #26372b; border-color: #6d8064; color: #b4d09b;
}
html[data-theme="dark"] :is(.brand small, .nav-label, .sidebar .brand small, .sidebar .nav-label,
  .sidebar-bottom p, .sidebar .local-status, .breadcrumb, .breadcrumb b, .topbar-right) { color: var(--muted); }
html[data-theme="dark"] .breadcrumb span { color: #7d8e7c; }
html[data-theme="dark"] .sidebar nav button { color: #b1bfb0; }
html[data-theme="dark"] .sidebar nav button:hover { background: #243229; }
html[data-theme="dark"] .sidebar nav button.active {
  background: #2b3b2d; color: #c7deb6; box-shadow: inset 2px 0 #d3bb87;
}
html[data-theme="dark"] .sidebar nav button.active i { background: #d3bb87; }
html[data-theme="dark"] :is(.sidebar-bottom .small-leaf, .sidebar-bottom .text-link) { color: #b4d09b; }
html[data-theme="dark"] .sidebar .local-status i { background: #b4d09b; }
html[data-theme="dark"] .sidebar .local-status.storage-unavailable { color: #e0c28b; }
html[data-theme="dark"] .sidebar .local-status.storage-unavailable i { background: #e0c28b; }
html[data-theme="dark"] .avatar { background: #2d3b2b; border-color: #17221c; color: #c8d8bd; }
html[data-theme="dark"] .theme-toggle { background: #25352a; border-color: #718267; color: #d9e5cb; }
html[data-theme="dark"] .theme-toggle:hover { background: #314432; border-color: #a1b28e; }
html[data-theme="dark"] .theme-toggle:focus-visible { outline-color: #d3bb87; }

/* Primary actions use sage; secondary actions keep the dark panel colour. */
html[data-theme="dark"] :is(.button, .rail .coach-entry .button, .focus-panel .button,
  .smart-entry > .button, .coach-entry .button, .immersive .button):where(:not(.secondary, .outline, .danger)) {
  background: #b4d09b; color: #172218; border-color: #b4d09b;
}
html[data-theme="dark"] :is(.button, .rail .coach-entry .button, .focus-panel .button,
  .smart-entry > .button, .coach-entry .button, .immersive .button):where(:not(.secondary, .outline, .danger)):hover {
  background: #c6deb2; color: #172218;
}
html[data-theme="dark"] :is(.button.secondary, .button.outline, .immersive .button.outline,
  .smart-plan > li > .button) { background: #26372b; color: #c4dcaf; border-color: #708364; }
html[data-theme="dark"] :is(.button.secondary, .button.outline, .immersive .button.outline,
  .smart-plan > li > .button):hover { background: #314432; color: #d7e7c7; }
html[data-theme="dark"] .button.danger { background: #3b2925; color: #f0aea0; border-color: #92685c; }
html[data-theme="dark"] .button.danger:hover { background: #4b312b; }
html[data-theme="dark"] :is(.text-link, .coach-external summary, .recovery-label) { color: #b4d09b; }
html[data-theme="dark"] :is(.eyebrow, .panel-label, .desk-heading .eyebrow, .smart-eyebrow) { color: #d3bb87; }
html[data-theme="dark"] :is(.subtitle, .info-note, .modal-subtitle, .section-head h2 span,
  .task-meta, .stat-label, .stat-number small, .step-list small, .composer p,
  .record small, .mini-stats small, .block-number, .plan-block p, .budget-panel p,
  .desk-metrics span, .week-summary, .recall-card-meta, .recall-method,
  .lab-method, .lab-tabs > button, .draft-hint, .feedback-record small,
  .feedback-record p, .feedback-record blockquote, .draft-task small,
  .guide-steps p, .guide-options span, .about-copy, .quote-panel p, .quote-panel small,
  .next-action p, .recall-teaser p, .coach-entry p) { color: var(--muted); }
html[data-theme="dark"] :is(.task-title.done, .step-list .done) { color: #a5b39f; }
html[data-theme="dark"] .task-detail-card.completed { opacity: 1; }
html[data-theme="dark"] :is(.desk-metrics b, .focus-panel h3, .focus-panel .timer-display,
  .recall-teaser h3, .coach-entry h3, .empty h3, .about-copy h3, .method-panel h2) { color: var(--ink); }
html[data-theme="dark"] :is(.week-summary b, .record > span, .draft-task li, .note-card p,
  .recall-card .text-link, .recall-answer p, .recall-answer small) { color: #bfd1b4; }
html[data-theme="dark"] :is(.desk-metrics > div:last-child b, .priority-order,
  .method-index, .guide-steps li::before, .draft-task li span) { color: #d3bb87; }
html[data-theme="dark"] :is(.stat-label svg, .composer h3 svg, .next-symbol, .empty svg) { color: #b4d09b; }
html[data-theme="dark"] footer { color: #a8b6a4; }

/* Explicit surface coverage for the older hardcoded component palettes. */
html[data-theme="dark"] :is(.panel, .task-card, .task-detail-card, .plan-block,
  .composer, .today-desk, .weekly-desk, .review-controls, .recall-card,
  .cadence-panel, .understanding-topic, .rail .coach-entry, .recall-teaser,
  .next-action, .empty, .stats-row, dialog) {
  background: #1a2620; color: var(--ink); border-color: var(--line);
}
html[data-theme="dark"] :is(.study-entry, .budget-panel, .recall-intro,
  .simulation-panel, .method-panel, .quote-panel, .coach-entry, .note-card,
  .adjust-summary > div, .coach-reason, .ai-help, .ai-result, .simulation-result,
  .guide-options button, .collab-flow span, .recall-question, .recall-answer,
  .recall-answer.mine, .smart-plan > li, .smart-empty) {
  background: #202d25; color: var(--ink); border-color: var(--line);
}
html[data-theme="dark"] :is(.task-card:hover, .task-detail-card:hover) { border-color: #738367; }
html[data-theme="dark"] :is(.desk-metrics > div, .card-footer, .record, .week-summary,
  .recall-counter, .lab-tabs, .draft-task, .feedback-record, .coach-external,
  .diagnosis-lines, .subject-track, .recall-method, .smart-summary,
  .smart-summary > div, .smart-radar, .smart-context, .smart-evidence) { border-color: var(--line); }
html[data-theme="dark"] :is(.quick-grid button, .quick-grid button:first-child,
  .icon-button, .task-action, .round-arrow) { background: #25352a; border-color: #65775a; color: #c3d7b3; }
html[data-theme="dark"] :is(.quick-grid button:hover, .quick-grid button:first-child:hover,
  .icon-button:hover, .task-action:hover, .round-arrow:hover, .guide-options button:hover) { background: #314432; }
html[data-theme="dark"] .check { background: #152019; border-color: #859779; color: #172218; }
html[data-theme="dark"] .check.checked { background: #b4d09b; border-color: #b4d09b; }
html[data-theme="dark"] :is(.tag, .pill, .smart-kind, .topic-status, .topic-status.stable) {
  background: #2b3b2d; color: #c3dbaf; border-color: #718467;
}
html[data-theme="dark"] .tag.blue { background: #24373e; color: #b2d2e1; }
html[data-theme="dark"] .tag.purple { background: #352e3e; color: #d2bfdc; }
html[data-theme="dark"] :is(.tag.orange, .risk-pill, .topic-status.weak) { background: #3b3223; color: #e0c28b; }
html[data-theme="dark"] :is(.urgent, .risk-text) { color: #edb88d !important; }
html[data-theme="dark"] :is(.demo-banner, .alert) { background: #302d21; border-color: #8f7d55; color: #e0c28b; }
html[data-theme="dark"] :is(.demo-banner button, .alert button) { color: #f0d69e; }
html[data-theme="dark"] :is(.form-error, [aria-invalid="true"] + .form-error) { color: #f0aea0; }
html[data-theme="dark"] [aria-invalid="true"] { border-color: #dc9485; }
html[data-theme="dark"] :is(.filter-button, .day-select .weekday, .day-select small,
  .mini-day, .mini-day b) { color: #b1bfb0; }
html[data-theme="dark"] :is(.filter-button.active, .day-select.active, .mini-day.today b,
  .mini-day.active b, .lab-tabs > button.active) { background: #2b3b2d; color: #c7deb6; border-color: #9caf88; }
html[data-theme="dark"] .mini-day.today b { box-shadow: inset 0 -2px #d3bb87; }
html[data-theme="dark"] .lab-tabs > button.active { background: transparent; }
html[data-theme="dark"] .day-select { background: #1a2620; border-color: var(--line); }
html[data-theme="dark"] :is(.day-select.active .weekday, .day-select.active small) { color: #c7deb6; }
html[data-theme="dark"] :is(.day-load, .day-select.active .day-load, .full-progress,
  .progress-small, .subject-track, .smart-load-meter) { background: #344537; }
html[data-theme="dark"] :is(.day-load i, .day-select.active .day-load i,
  .full-progress span, .progress-small span) { background: #b4d09b; }
html[data-theme="dark"] .chart-bar { background: #7f9d6b; }
html[data-theme="dark"] .chart-col.current .chart-bar { background: #b4d09b; }
html[data-theme="dark"] :is(.chart-col small, .chart-labels span, .subject-row span, .subject-row b) { color: var(--muted); }
html[data-theme="dark"] .week-track { background: #344537; }
html[data-theme="dark"] .week-track > span { background: #b4d09b; }
html[data-theme="dark"] .week-track.previous > span { background: #98ad8a; }
html[data-theme="dark"] .tone-0 { background: #b4d09b; }
html[data-theme="dark"] .tone-1 { background: #d3bb87; }
html[data-theme="dark"] .tone-2 { background: #a5c9d5; }
html[data-theme="dark"] .tone-3 { background: #c8b3d4; }
html[data-theme="dark"] .storage-warning { background: #302d21; border-color: #b9a06c; color: #e0c28b; }
html[data-theme="dark"] .storage-warning button { color: #f0d69e; }

/* Keep native form controls legible, including locally opened HTML. */
html[data-theme="dark"] :is(.field input, .field select, .field textarea, .ai-response,
  .search, .review-toolbar .search, .review-settings select, .smart-controls input,
  .smart-controls select, .smart-context textarea, .input-row, .input-row input) {
  background: #142019; color: var(--ink); border-color: #7b8e6e;
}
html[data-theme="dark"] :is(.field label, .adjust-summary b, .recovery-label,
  .guide-options button, .smart-summary b, .smart-insights b, .smart-insight b,
  .smart-empty, .smart-load-day > b, .smart-load-day > strong) { color: var(--ink); }
html[data-theme="dark"] :is(.adjust-summary small, .smart-summary span,
  .smart-note, .smart-plan-top > small, .smart-plan > li > p,
  .smart-evidence p, .smart-insights p, .smart-insight p,
  .smart-load-day > small, .smart-context > p, .smart-empty p) { color: var(--muted); }
html[data-theme="dark"] :is(.smart-evidence summary, .smart-insights .text-link,
  .smart-insight .text-link) { color: #b4d09b; }
html[data-theme="dark"] :is(.smart-plan > li::before, .smart-evidence summary::marker) { color: #d3bb87; }
html[data-theme="dark"] .smart-entry { background: #25382b; border-color: #66805c; color: var(--ink); }
html[data-theme="dark"] .smart-entry p { color: #c2d0bb; }
html[data-theme="dark"] .smart-entry > .button svg { color: #263c25; }
html[data-theme="dark"] .smart-load { scrollbar-color: #849a75 #202d25; }
html[data-theme="dark"] .smart-load-day { border-top-color: #7b8e6e; }
html[data-theme="dark"] .smart-load-meter > i { background: #b4d09b; }
html[data-theme="dark"] :is(.smart-load-day[data-level="overload"], .smart-insights > li[data-type="error"]) { border-color: #f0aea0; }
html[data-theme="dark"] .smart-load-day[data-level="overload"] .smart-load-meter > i { background: #f0aea0; }
html[data-theme="dark"] .smart-insights > li[data-type="warning"] { border-color: #e0c28b; }
html[data-theme="dark"] .smart-insights > li[data-type="info"] { border-color: #a5c9d5; }
html[data-theme="dark"] .smart-insights > li[data-type="success"] { border-color: #b4d09b; }

/* Photo veils keep both the image and the actual reading area calm. */
html[data-theme="dark"] .atelier-hero { background-color: #17251c; border-color: #526849; }
html[data-theme="dark"] .atelier-hero::before {
  background: linear-gradient(90deg, #152019fc 0%, #152019f5 38%, #152019e8 58%, #15201999 78%, #1520192e 100%);
}
html[data-theme="dark"] .atelier-hero h2 { color: #edf0e5; }
html[data-theme="dark"] .atelier-hero .eyebrow { color: #d3bb87; }
html[data-theme="dark"] .atelier-hero p { color: #c0cdb7; }
html[data-theme="dark"] :is(.atelier-hero .hero-cta, .atelier-hero .hero-cta svg) { color: #d3bb87; }
html[data-theme="dark"] .atelier-hero .image-credit { background: #17221cf2; color: #d5ddce; }
html[data-theme="dark"] .focus-panel { background: #1a2620; background-image: none; border-color: #526849; color: var(--ink); }
html[data-theme="dark"] .focus-panel .panel-label { color: #d3bb87; }
html[data-theme="dark"] :is(.focus-panel p, .focus-panel .focus-hint) { color: var(--muted); }
html[data-theme="dark"] dialog { box-shadow: 0 25px 100px #0009; }
html[data-theme="dark"] dialog::backdrop { background: #050b08b8; }
html[data-theme="dark"] .immersive { background-color: #132018; color: var(--ink); }
html[data-theme="dark"] #modal.immersive { background: #132018 url('assets/reading-room-v2.png') center/cover no-repeat; }
html[data-theme="dark"] .immersive::before { background: #0b1810e8; }
html[data-theme="dark"] .immersive .timer-ring { background: #17251be8; border-color: #b59d65; outline-color: #6a603f; }
html[data-theme="dark"] :is(.timer-modal .timer-display, .immersive .timer-display) { color: #e2c995; }
html[data-theme="dark"] :is(.timer-ring small, .timer-modal p, .immersive .modal-subtitle,
  .immersive .timer-ring small, .immersive .timer-modal p, .immersive .timer-modal .info-note) { color: #c1cdb6; }
html[data-theme="dark"] .duration-options button { background: #223226; color: #cdddc0; border-color: #819875; }
html[data-theme="dark"] .duration-options button[aria-pressed="true"] { background: #d3bb87; color: #252716; border-color: #d3bb87; }

/* Review, diagnosis and external collaboration retain their semantic cues. */
html[data-theme="dark"] .coverage-dial { background: conic-gradient(#b4d09b var(--coverage), #344537 0); }
html[data-theme="dark"] .coverage-dial > span { background: #1a2620; color: var(--ink); }
html[data-theme="dark"] :is(.coverage-dial em, .diagnosis-metrics span, .diagnosis-metrics small,
  .diagnosis-line p, .simulation-panel .info-note, .simulation-placeholder p,
  .scenario span, .compare-numbers small, .simulation-result p, .simulation-result > small,
  .method-panel ol, .recall-intro p, .recall-counter span, .rating-grid small,
  .recall-answer.mine p, .recall-answer.mine small) { color: var(--muted); }
html[data-theme="dark"] :is(.recall-intro h2, .recall-counter b, .compare-numbers b,
  .scenario b, .rating-grid b, .method-panel .text-link) { color: #c5d9b4; }
html[data-theme="dark"] :is(.scenario, .rating-grid button) { background: #202d25; border-color: #6d8064; }
html[data-theme="dark"] :is(.scenario.selected, .rating-grid button:hover) { background: #33472f; border-color: #b4d09b; }
html[data-theme="dark"] .scenario.selected b { color: #e1cc9d; }
html[data-theme="dark"] .scenario.selected span { color: #cad8c0; }
html[data-theme="dark"] .simulation-placeholder { border-color: #7b8e6e; color: #b4d09b; }
html[data-theme="dark"] .rating-grid button:first-child { background: #392f23; border-color: #a48d64; }
html[data-theme="dark"] .rating-grid button:first-child b { color: #e0c28b; }
html[data-theme="dark"] .review-finish > svg { background: #30422d; color: #c4dda9; }
html[data-theme="dark"] .review-finish p { color: var(--muted); }
html[data-theme="dark"] .journey { color: var(--muted); }
html[data-theme="dark"] .journey span { border-color: var(--line); }
html[data-theme="dark"] .journey .active { border-color: #d3bb87; color: #d4e6c4; }
html[data-theme="dark"] .coach-reason { border-left-color: #d3bb87; }
html[data-theme="dark"] #toast { border-color: #65775a; border-left-color: var(--feedback-accent); --feedback-tint: #27383a; }
html[data-theme="dark"] #toast[data-type="success"] { --feedback-tint: #2b3b2d; }
html[data-theme="dark"] #toast[data-type="warning"] { --feedback-tint: #3b3223; }
html[data-theme="dark"] #toast[data-type="error"] { --feedback-tint: #3b2925; }
html[data-theme="dark"] #completion-feedback { background: #283b2b; color: #e8ede5; border-color: #a8bd94; }
html[data-theme="dark"] #completion-feedback > span { border-color: #a8bd94; color: #d3bb87; }
html[data-theme="dark"] #completion-feedback[data-kind="task"] > span { border-color: #d3bb87; background: #d3bb87; color: #172218; }
html[data-theme="dark"] #ai-flow.collab-flow { background: #202d25; border-color: #607457; color: var(--ink); }
html[data-theme="dark"] #ai-flow :is(.flow-heading, .flow-step, .flow-copy small) { color: var(--muted); }
html[data-theme="dark"] #ai-flow :is(.flow-heading > b, .flow-copy b) { color: #d8e4ce; }
html[data-theme="dark"] #ai-flow .flow-step::before { background: #7d9270; }
html[data-theme="dark"] #ai-flow .flow-dot { background: #202d25; border-color: #90a37f; color: #c2d2b6; }
html[data-theme="dark"] #ai-flow .flow-step[data-state="done"] .flow-dot { background: #b4d09b; border-color: #b4d09b; color: #172218; }
html[data-theme="dark"] #ai-flow .flow-step[data-state="current"] .flow-dot { background: #d3bb87; border-color: #d3bb87; color: #252716; box-shadow: 0 0 0 3px #202d25, 0 0 0 4px #d3bb87; }
html[data-theme="dark"] #ai-flow .flow-step[data-state="current"] .flow-copy b { color: #e0c28b; }
html[data-theme="dark"] #ai-flow > p { border-color: var(--line); color: var(--muted); }

@media (max-width: 650px) {
  .topbar-right { gap: 9px; }
  .theme-toggle { min-width: 72px; padding: 9px 10px; }
  html[data-theme="dark"] .sidebar { background: #17221cfa; border-top-color: #526149; }
  html[data-theme="dark"] .sidebar nav button.active svg { fill: #354a2f; }
  html[data-theme="dark"] .atelier-hero::before { background: linear-gradient(90deg, #152019fc 0%, #152019f5 55%, #152019e8 76%, #152019c9 100%); }
}
@media (max-width: 380px) {
  .topbar { padding-inline: 15px; }
  .topbar-right .avatar { display: none; }
  .theme-toggle { min-width: 70px; }
}
@media (prefers-reduced-motion: reduce) { .theme-toggle { transition: none; } }
@media (forced-colors: active) {
  .theme-toggle { background: ButtonFace; color: ButtonText; border: 1px solid ButtonText; }
  html[data-theme="dark"] :is(.sidebar, .topbar, .panel, dialog, .theme-toggle,
    .task-card, .task-detail-card, .plan-block, .smart-entry, #toast, #ai-flow.collab-flow) {
    background: Canvas; color: CanvasText; border-color: CanvasText;
  }
  html[data-theme="dark"] .atelier-hero::before { background: Canvas; }
  html[data-theme="dark"] :is(button, a, input, textarea, select, summary):focus-visible { outline-color: Highlight; }
}