/* White and Carbon is shared by the complete app without changing layout or artwork. */
:root {
  color-scheme: light;
  --theme-panel: #ffffff;
  --theme-hover: #e6e6eb;
  --theme-border: #85858f;
  --theme-shadow: 0 16px 48px #0b0b0c18;
  --theme-focus: #c13b12;
  --theme-reading: #27272d;
  --theme-good-bg: #eaf5ee;
  --theme-good-ink: #255b3b;
  --theme-good-border: #5f8b6d;
  --theme-error-bg: #fceeee;
  --theme-error-ink: #a42323;
  --theme-error-border: #b16a6a;
  --theme-cta: #ff4c16;
  --theme-cta-hover: #ff693a;
  --theme-cta-ink: #17171a;
  --theme-nav: #ffffff;
  --theme-nav-overlay: #fffffff5;
  --theme-overlay-paper: #fffffff2;
  --theme-avatar: #e6e6eb;
  --theme-placeholder: #666670;
  --theme-hero-fade: #f1f1f4cc;
  --theme-hero-wash: #f1f1f420;
  --theme-hero-bottom: #0b0b0c20;
  --theme-backdrop: #0b0b0c66;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b0b0c;
  --paper: #161618;
  --ink: #f5f5f7;
  --muted: #b5b5bf;
  --soft: #222226;
  --line: #39393f;
  --accent: #ff7549;
  --accent-dark: #ff9876;
  --brand-orange: #ff4c16;
  --accent-soft: #26262a;
  --peach: #161618;
  --green: #a8d9b9;
  --theme-panel: #1b1b1e;
  --theme-hover: #2d2d32;
  --theme-border: #797983;
  --theme-shadow: 0 16px 48px #00000066;
  --theme-focus: #ff7549;
  --theme-reading: #e3e3e8;
  --theme-good-bg: #19291f;
  --theme-good-ink: #ace0bf;
  --theme-good-border: #689976;
  --theme-error-bg: #321d1f;
  --theme-error-ink: #f7bbbb;
  --theme-error-border: #b8787c;
  --theme-cta: #ff4c16;
  --theme-cta-hover: #ff7549;
  --theme-cta-ink: #17171a;
  --theme-nav: #0b0b0c;
  --theme-nav-overlay: #0b0b0cf5;
  --theme-overlay-paper: #161618f2;
  --theme-avatar: #2d2d32;
  --theme-placeholder: #b5b5bf;
  --theme-hero-fade: #161618cc;
  --theme-hero-wash: #16161820;
  --theme-hero-bottom: #0b0b0c8c;
  --theme-backdrop: #000000b3;
}

/* The control stays in the app header and remains available in the reader. */
.topbar { gap: 12px; }
.topbar .header-actions { margin-left: auto; }
.theme-control { position: relative; flex: 0 0 auto; z-index: 40; }
.theme-trigger { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 10px; background: transparent; color: var(--muted); }
.theme-trigger > svg { width: 19px; height: 19px; }
.theme-trigger:hover, .theme-trigger[aria-expanded="true"] { background: var(--theme-hover); color: var(--ink); border-color: var(--theme-border); }
.theme-trigger:focus-visible, .theme-option:has(input:focus-visible) { outline: 2px solid var(--theme-focus); outline-offset: 4px; }
.theme-panel { position: absolute; top: calc(100% + 12px); right: 0; width: 248px; padding: 19px 12px 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--theme-panel); color: var(--ink); box-shadow: var(--theme-shadow); }
.theme-panel[hidden] { display: none; }
.theme-panel h2 { font-family: var(--heading,var(--sans)); font-size: 15px; font-weight: 650; letter-spacing: -.3px; margin: 0 8px; }
.theme-panel > p { color: var(--muted); font-size: 11px; margin: 5px 8px 14px; line-height: 1.6; }
.theme-panel fieldset { padding: 0; margin: 0; border: 0; }
.theme-option { display: flex; align-items: center; gap: 12px; padding: 11px 12px; min-height: 60px; border: 1px solid transparent; border-radius: 9px; cursor: pointer; }
.theme-option:hover { background: var(--theme-hover); }
.theme-option:has(input:checked) { background: var(--accent-soft,#fff0ea); border-color: var(--theme-border); }
.theme-option input { width: 16px; height: 16px; margin: 0; accent-color: var(--accent); flex: 0 0 16px; }
.theme-option input:focus-visible { outline: none; }
.theme-option strong { display: block; color: var(--ink); font-size: 12px; font-weight: 600; }
.theme-option small { display: block; color: var(--muted); font-size: 10px; margin-top: 2px; }
.theme-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
body[data-view="read"] .theme-control { margin-left: auto; }

/* Neutral surfaces, vivid brand orange, and a separate accessible text accent. */
html[data-theme] body { background: var(--bg); color: var(--ink); }
html[data-theme] ::selection { background: var(--accent-soft); color: var(--ink); }
html[data-theme] :focus-visible { outline-color: var(--theme-focus); }
html[data-theme] .sidebar { background: var(--theme-nav); border-color: var(--line); }
html[data-theme] .topbar { background: var(--bg); border-color: var(--line); }
html[data-theme] .mobile-navigation { background: var(--theme-nav-overlay); border-color: var(--line); box-shadow: 0 -4px 20px #0b0b0c33; }
html[data-theme] :is(.brand-wordmark,.account-person strong,.switch-row strong,.field,.field > legend) { color: var(--ink); }
html[data-theme] #navigation :is(a,button) { color: var(--muted); }
html[data-theme] #navigation :is(a,button):hover { background: var(--soft); color: var(--ink); }
html[data-theme] #navigation :is(a,button).active { color: var(--accent); background: var(--accent-soft); }
html[data-theme] #navigation .active svg { color: var(--accent); }
html[data-theme] :is(.mobile-nav-link,.notification-button,.profile-dots) { color: var(--muted); }
html[data-theme] .mobile-nav-link.active { color: var(--accent); background: var(--accent-soft); }
html[data-theme] :is(.mobile-nav-link:hover,.notification-button:hover,.icon-button:hover) { background: var(--soft); }
html[data-theme] :is(.sidebar-note,.profile,.week-row,.activity-row,.quote-strip small,.schedule-next) { border-color: var(--line); }
html[data-theme] .membership { background: var(--soft); border-color: var(--line); }
html[data-theme] :is(.membership-icon,.membership b) { color: var(--accent); }
html[data-theme] .avatar { background: var(--theme-avatar); color: var(--ink); border-color: var(--bg); }
html[data-theme] :is(.search-box,.search-box kbd,.date-chip) { background: var(--soft); color: var(--muted); border-color: var(--line); }
html[data-theme] .search-box input { color: var(--ink); }
html[data-theme] :is(.new-label,#navigation .nav-badge) { background: var(--theme-hover); color: var(--accent); }

/* Secondary copy retains a consistent contrast across cards and nested panels. */
html[data-theme] :is(
  .workspace-label,.sidebar-note p,.sidebar-note > span:last-child,.membership > span:not(.membership-icon),.profile small,
  .breadcrumb,.search-box svg,.eyebrow,.page-heading > p,.heading-row p,.hero-description,.hero-meta,.hero-meta span,.hero-footnote,
  .next-read-label,.next-read-meta,.card-top > span,.card-top > svg,.daily-card > p,.goal-center > svg,.goal-center strong > span,
  .goal-center strong small,.goal-center > span,.goal-center > small,.daily-card .goal-caption,.week-row .day,
  .section-heading p,.path-meta,.path-info p,.path-bottom,.path-stats,.schedule-copy p,.schedule-next,.quote-strip,.quote-strip p,.quote-strip small,
  .site-footer,.content-note,.search-summary,.detail-meta,.library-intro p,.library-tabs button,.stat-card > span,.stat-card > small,
  .stat-card p,.stat-card strong small,.activity-row small,.activity-row p,.empty-state p,.author-hero p,.author-hero .content-note,
  .author-card p,.draft-item p,.reader-top,.reader-meta,.reader-byline,.reader-footer p,.source-note,.feature-list span small,.feature-list > p,
  .modal-head p,.modal-body > p,.close-button,.field > small,.switch-row p,.switch-row small,.check-label,.notification-status p,.option-card p,
  .lesson-item small,.quiz-counter,.quiz-count,.results p,.score-ring > span,.settings-link small,.settings-link > svg,
  .archive-heading > p,.archive-tabs a,.archive-intro p,.archive-counts span,.archive-section-heading p,.archive-resume small,
  .archive-card-meta,.archive-collection-copy p,.archive-scope-note,.archive-join-panel p,.archive-select-label,.archive-search,
  .archive-result-count,.archive-translator,.archive-book-description,.archive-book-details,.archive-save,.archive-empty p,
  .archive-context-line,.archive-guide-banner small,.archive-era-date,.archive-era-card p,.archive-route-card > p,.archive-route-card li p,
  .archive-bibliography > p,.archive-guide-intro p,.archive-thinker-date small,.archive-thinker-copy > p,.archive-influence-chips small,
  .archive-thinker-hero > p,.archive-location,.archive-profile-card p,.archive-profile-card li,.archive-connection-columns h3,
  .archive-connection-card p,.archive-connection-center span,.archive-muted,.archive-source-gap ul,.archive-source-gap p,
  .archive-reader-header > p,.archive-reader-controls legend,.archive-reading-estimate small,.archive-progress-caption,.archive-reader-footer p,
  .archive-reading-policy,.archive-license > p,.archive-edition-details dt,.archive-modal-body > p,.archive-loading p,.archive-thinker-hero .archive-survival,
  .archive-preview-bar,.archive-access-bridge p,.archive-invitation p,.lesson-source-card p,.lesson-source-card small,.saved-primary-row p,
  .account-person span,.access-intro,.access-benefits span,.access-note,.access-pricing p,
  .engine-form-bottom legend,.engine-length,.engine-model-status,.engine-history > span,.engine-plan-head p,.engine-step-stage,.engine-steps p,
  .engine-evidence li span,.engine-evidence p,.engine-account-note p,.engine-saved-list button small,.engine-method-note,.engine-download-details li,
  .guided-intro-copy > p,.guided-source-title small,.guided-pace > span,.guided-intro-copy .guided-first-bit,.guided-promise-grid p,
  .guided-editorial-note,.guided-small-note,.guided-session-heading > p,.guided-session-meta,.guided-ending p,.guided-source-notice p,
  .guided-modal-body > p,.guided-quiz-feedback p,.guided-score span,.guided-plus-card > p,.guided-reminder-meta,.guided-reminder-preview small,
  .guided-unavailable p,.guided-loading,.archive-guided-cta p,.guided-context-note p,
  .journey-back,.journey-cover-copy > p,.journey-cover-meta,.journey-cover-copy > small,.journey-progress-label,.journey-progress > small,
  .journey-map > summary small,.journey-map > summary > svg,.journey-map button small,.journey-stage-kicker,.journey-stage-kicker > span:last-child,
  .journey-context .eyebrow,.journey-context > p,.journey-reading-reason > p,.journey-source-heading p,.journey-evidence-note,.journey-source > small,
  .journey-source-unavailable,.journey-stage-footer > p,.journey-references > summary,.journey-references > p,.journey-scope .eyebrow,
  .journey-scope p,.journey-scope ul,.journey-loading,.journey-empty p,.journey-load-notice p
) { color: var(--muted); }
html[data-theme] #engine-model-status { color: var(--muted); }
html[data-theme] :is(input,textarea)::placeholder { color: var(--theme-placeholder); opacity: 1; }

/* Discovery panels and original photographs keep their own composition. */
html[data-theme] :is(.hero,.archive-intro,.archive-join-panel,.archive-guide-intro,.guided-intro-card,.journey-cover,.author-hero,.library-intro) { background: var(--peach); border-color: var(--line); }
html[data-theme] :is(.path-detail-visual,.archive-collection-image,.guided-intro-art) { background: var(--paper); }
html[data-theme] .archive-collection-image:after { background: linear-gradient(transparent,#0b0b0c70); }
html[data-theme] .archive-loading > span { background: var(--brand-orange); }
html[data-theme] .hero-art:after { background: linear-gradient(90deg,var(--peach) 0%,var(--theme-hero-fade) 15%,var(--theme-hero-wash) 56%,transparent 85%); }
html[data-theme] .guided-intro-art:after { background: linear-gradient(90deg,var(--peach),transparent 30%); }
html[data-theme] .journey-cover-art:after { background: linear-gradient(90deg,var(--peach) 0%,transparent 32%),linear-gradient(0deg,var(--theme-hero-bottom),transparent 45%); }
html[data-theme] :is(.archive-counts,.archive-guide-intro > p,.archive-thinker-copy,.archive-thinker-hero .archive-survival,.guided-pace) { border-color: var(--line); }
html[data-theme] :is(.category-tag,.save-button) { background: var(--theme-overlay-paper); color: var(--ink); }
html[data-theme] .save-button.saved { background: var(--accent-soft); color: var(--accent); }
html[data-theme] :is(.tag,.archive-pill,.free-badge,.indie-badge,.archive-access-badge,.archive-access-badge.plus,.draft-item > span) { background: var(--soft); color: var(--accent); border-color: var(--line); }
html[data-theme] .free-badge { color: var(--accent); }
html[data-theme] :is(.filter-chip,.card-arrow,.schedule-icon,.lesson-item > span:first-child,.lesson-number,.activity-icon,.saved-primary-icon) { background: var(--soft); color: var(--muted); border-color: var(--line); }
html[data-theme] :is(.filter-chip:hover,.card-arrow:hover) { background: var(--theme-hover); color: var(--ink); border-color: var(--theme-border); }
html[data-theme] .filter-chip.active { background: var(--accent-soft); color: var(--accent); border-color: var(--accent); }
html[data-theme] :is(.library-tabs .active,.library-tabs button.active) { color: var(--accent); border-color: var(--accent); }
html[data-theme] :is(.path-card:hover,.archive-collection-card:hover) { border-color: var(--theme-border); box-shadow: 0 5px 20px #0b0b0c22; }
html[data-theme] :is(.schedule-banner,.archive-invitation,.guided-invitation,.lesson-source-card,.archive-guide-banner,.archive-route-card,
  .archive-impact,.archive-resume,.archive-reader-controls,.archive-preview-bar,.archive-access-bridge,.account-benefits,.access-free-mark,
  .access-pricing,.guided-ending,.guided-preview-disclosure,.guided-reminder-preview,.archive-guided-cta,.journey-source,.journey-bridge,
  .journey-account-note,.engine-account-note,.engine-plan-duration,.engine-step-sources a,.engine-next-questions button,.engine-history button) { background: var(--soft); border-color: var(--line); }
html[data-theme] :is(.empty-state,.saved-primary-empty,.archive-source-gap,.archive-empty,.guided-unavailable) { background: var(--paper); border-color: var(--theme-border); }
html[data-theme] :is(.archive-book-spine,.archive-influence-chips a) { background: var(--soft); border-color: var(--line); color: var(--muted); }
html[data-theme] :is(.archive-tabs a span,.archive-save.saved) { background: var(--accent-soft); color: var(--accent); }
html[data-theme] .archive-save.saved svg { fill: var(--accent-soft); }

/* Readability is shared by the sample lesson, archive and guided source reader. */
html[data-theme] :is(.reader-paper,.archive-original-paper,.guided-original,.guided-plus-card,.journey-stage,.journey-map) { background: var(--paper); border-color: var(--line); }
html[data-theme] :is(.reader-text,.archive-original-paper p,.guided-original p) { color: var(--theme-reading); }
html[data-theme] .reader-text p:first-child:first-letter { color: var(--accent); }
html[data-theme] :is(.archive-original-paper h2,.guided-original h2,.archive-license h2,.guided-source-notice h2,.journey-stage h3,
  .archive-access-bridge h2,.account-benefits p,.guided-plus-benefits p,.guided-quiz-feedback > strong,.journey-map button strong) { color: var(--ink); }
html[data-theme] :is(.takeaway,.guided-takeaway,.quiz-feedback,.guided-quiz-feedback,.notice,.notification-status,.journey-load-notice) { background: var(--soft); color: var(--muted); border-color: var(--line); }
html[data-theme] :is(.takeaway p,.guided-takeaway > p,.journey-bridge p) { color: var(--ink); }
html[data-theme] :is(.takeaway,.guided-takeaway,.journey-bridge,.guided-context-note) { border-left-color: var(--accent); }
html[data-theme] :is(.progress-line,.reader-progress,.archive-book-progress,.guided-session-progress,.journey-progress-track) { background: var(--line); }
html[data-theme] :is(.progress-line span,.reader-progress span) { background: var(--brand-orange); }
html[data-theme] .goal-visual :is(circle,.ring-bg) { stroke: var(--line); }
html[data-theme] .goal-visual circle:last-child { stroke: var(--brand-orange); }
html[data-theme] :is(.day b,.goal-options,.engine-choice) { background: var(--soft); color: var(--muted); border-color: var(--line); }
html[data-theme] .day.done b { background: var(--accent-soft); color: var(--accent); }
html[data-theme] .day.today b { background: var(--soft); color: var(--accent); border-color: var(--accent); }
html[data-theme] .day:after { background: var(--line); }
html[data-theme] .day.done:after { background: var(--brand-orange); }
html[data-theme] :is(.day.today,.activity-row > span,.stat-card > svg,.author-card > svg,.feature-list svg,.lesson-item > svg,.empty-state > svg) { color: var(--accent); }
html[data-theme] .score-badge { background: var(--accent-soft); color: var(--accent) !important; }

/* Buttons, form fields and feedback use the same hierarchy in every module. */
html[data-theme] .primary-button { background: var(--theme-cta); color: var(--theme-cta-ink); border-color: var(--theme-cta); }
html[data-theme] .primary-button:hover { background: var(--theme-cta-hover); color: var(--theme-cta-ink); border-color: var(--theme-cta-hover); }
html[data-theme] .lesson-source-icon { background: var(--theme-cta); color: var(--theme-cta-ink); }
html[data-theme] :is(.outline-button,.schedule-banner .outline-button,.modal-footer .outline-button,.archive-collection-actions .outline-button) { background: var(--paper); color: var(--ink); border-color: var(--theme-border); }
html[data-theme] .outline-button:hover { background: var(--theme-hover); border-color: var(--theme-border); }
html[data-theme] :is(.text-button,.content-note a,.archive-collection-links > a,.archive-book-author,.archive-resume span,.archive-era-number,
  .archive-era-card summary,.archive-route-card li,.archive-inline-book,.archive-source-links a,.archive-school,.archive-connection-card > span,
  .archive-connection-center,.archive-license-actions a,.archive-contents button > span,.archive-contents button > svg,.archive-edition-details a,
  .archive-preview-bar strong,.access-free-mark,.engine-status,.engine-starters small,.engine-starters b,.engine-plan-duration,.engine-day,
  .engine-step-sources a,.engine-evidence summary,.engine-evidence a,.engine-next-questions button span,.engine-saved-list button b,
  .guided-label,.guided-source-title,.guided-promise-grid article > span,.guided-session-meta svg,.guided-source-notice a,.guided-takeaway > span,
  .guided-quiz-count,.guided-plus-benefits svg,.guided-reminder-top,.guided-reminder-preview > span,.archive-guided-cta > div > span,.guided-context-note > span,
  .journey-question,.journey-source-type,.journey-source-type.type-testimony,.journey-source-type.type-retrospective,.journey-source-symbol,
  .journey-thinkers a,.journey-bridge .eyebrow,.journey-next-preview,.journey-references a,.journey-scope > details,.journey-load-notice .text-button,
  .notification-status .text-button,.notification-status strong,.takeaway > span,.takeaway strong) { color: var(--accent); }
html[data-theme] .text-button:hover { color: var(--accent-dark); }
html[data-theme] :is(.input,.field input:not([type="checkbox"]):not([type="radio"]),.field select,.field textarea,.time-row input,
  .engine-builder textarea,.engine-length select,.archive-select-label select,.archive-search) { background: var(--paper); color: var(--ink); border-color: var(--theme-border); }
html[data-theme] .archive-search input { color: var(--ink); }
html[data-theme] :is(.input,.field input,.field select,.field textarea,.engine-builder textarea,.engine-length select,.archive-select-label select,.archive-search):focus-within { border-color: var(--theme-focus); }
html[data-theme] :is(.time-row button,.day-toggle,.option-card,.quiz-option,.guided-quiz-option,.archive-minute-options button,.guided-pace button,
  .engine-starters button,.journey-checkpoint > span,.journey-stage-number,.guided-ending-icon,.guided-plus-mark strong,.guided-complete-mark,.journey-source-symbol) { background: var(--soft); color: var(--muted); border-color: var(--theme-border); }
html[data-theme] :is(.goal-choice,.goal-options button,.engine-choice span,.archive-reading-estimate,.archive-thinker-date,.journey-reading-focus,.journey-reading-focus > strong,.journey-checkpoint) { color: var(--muted); }
html[data-theme] :is(.quiz-option > span,.quiz-option > span:first-child,.guided-quiz-option > span) { background: var(--theme-hover); color: var(--muted); border-color: var(--theme-border); }
html[data-theme] :is(.goal-options button.active,.goal-choice:has(input:checked),.day-toggle:has(input:checked),.day-toggle.active,
  .engine-choice label:has(input:checked) span,.archive-minute-options button.active,.guided-pace button.active,.quiz-option.selected,.guided-quiz-option.selected) { background: var(--accent-soft); color: var(--accent); border-color: var(--accent); box-shadow: none; }
html[data-theme] :is(.quiz-option:hover,.guided-quiz-option:hover,.engine-starters button:hover,.engine-step-sources a:hover,
  .engine-next-questions button:hover,.engine-saved-list button:hover,.journey-thinkers a:hover,.journey-map li > button:hover) { background: var(--theme-hover); color: var(--ink); border-color: var(--theme-border); }
html[data-theme] :is(.quiz-option.correct,.guided-quiz-option.correct,.journey-checkpoint.is-complete > span,.journey-map .is-complete .journey-stage-number,.engine-ai-draft) { background: var(--theme-good-bg); color: var(--theme-good-ink); border-color: var(--theme-good-border); }
html[data-theme] :is(.engine-ai-draft > strong,.engine-ai-draft > p,.engine-ai-draft small,.journey-checkpoint.is-complete,.journey-map button em) { color: var(--theme-good-ink); }
html[data-theme] :is(.quiz-option.incorrect,.guided-quiz-option.incorrect) { background: var(--theme-error-bg); color: var(--theme-error-ink); border-color: var(--theme-error-border); }
html[data-theme] :is(.form-error,.account-message) { color: var(--theme-error-ink); }
html[data-theme] .score-ring { background: var(--accent-soft); color: var(--accent); border-color: var(--accent); }
html[data-theme] .journey-map .is-current > button { background: var(--accent-soft); }
html[data-theme] .journey-map .is-current .journey-stage-number { background: var(--theme-cta); color: var(--theme-cta-ink); border-color: var(--theme-cta); }
html[data-theme] .journey-map li + li:before { background: var(--line); }
html[data-theme] .journey-map ol { scrollbar-color: var(--theme-border) transparent; }
html[data-theme] dialog { color: var(--ink); background: var(--paper); border-color: var(--line); box-shadow: 0 24px 100px #0b0b0c80; }
html[data-theme] dialog::backdrop { background: var(--theme-backdrop); }
html[data-theme] .modal-footer { background: var(--theme-nav); border-color: var(--line); }
html[data-theme] #toast { background: var(--theme-hover); color: var(--ink); border-color: var(--theme-border); box-shadow: var(--theme-shadow); }

@media (max-width: 1023px) and (min-width: 768px) {
  .topbar .search-box { width: 200px; }
  .topbar .header-actions { gap: 10px; }
}
@media (max-width: 767px) {
  .theme-control { position: fixed; top: 14px; right: 66px; }
  .theme-trigger { width: 42px; height: 42px; border-color: transparent; }
  .theme-panel { position: fixed; right: 20px; top: 64px; max-width: calc(100vw - 40px); }
  body[data-view="read"] .theme-control { position: relative; top: auto; right: auto; }
  body[data-view="read"] .theme-panel { position: absolute; right: 0; top: calc(100% + 10px); }
  html[data-theme] .sidebar { background: var(--theme-nav-overlay); }
}
@media (max-width: 374px) {
  .theme-control { right: 60px; }
  .theme-panel { right: 16px; max-width: calc(100vw - 32px); }
}
@media (prefers-reduced-motion: reduce) {
  .theme-trigger,.theme-option { transition: none; }
}
