/* Paired appearances for every design direction. Typography and composition stay intact. */
html[data-mode=light] {
  color-scheme: light;
  --error: #99432f;
  --error-bg: #f7e9e3;
  --accent-ink: #20261b;
  --paper-panel: var(--ink);
  --paper-panel-ink: #f8f9f4;
  --paper-panel-muted: #d5d9d0;
  --paper-panel-line: #ffffff35;
  --paper-panel-accent: color-mix(in srgb, var(--accent) 45%, white);
  --bar-neutral: #87937f;
  --figure-paper: #fffef8;
}
html[data-mode=light][data-theme=notebook] {
  --paper:#f7f7ef; --surface:#fffef8; --ink:#252820; --muted:#64695c;
  --line:#d9ddcf; --accent:#d3df81; --accent-dark:#536724; --tint:#edf0df;
}
html[data-mode=light][data-theme=blueprint] {
  --paper:#f2f5f9; --surface:#ffffff; --ink:#192a40; --muted:#5a6879;
  --line:#d3dce7; --accent:#bad7ff; --accent-dark:#285cb1; --tint:#e4edf8;
  --bar-neutral:#7e94aa;
}
html[data-mode=light][data-theme=workshop] {
  --paper:#faf3ec; --surface:#fffaf5; --ink:#392a25; --muted:#766056;
  --line:#e6d6ca; --accent:#edc0a5; --accent-dark:#a0462b; --tint:#f3e4d8;
  --bar-neutral:#aa8b75;
}
html[data-mode=light][data-theme=plum] {
  --paper:#f8f4f8; --surface:#fffbff; --ink:#302334; --muted:#6f6173;
  --line:#e2d5e5; --accent:#dfb8ef; --accent-dark:#74428b; --tint:#efe4f2;
  --bar-neutral:#9f89ab;
}
html[data-mode=light][data-theme=mono] {
  --paper:#f5f5f3; --surface:#ffffff; --ink:#202120; --muted:#626563;
  --line:#d7d9d6; --accent:#d4d8d2; --accent-dark:#454c43; --tint:#e9ece7;
  --bar-neutral:#89928a;
}
html[data-mode=light][data-theme=night] {
  color-scheme: light;
  --paper:#f2f6f2; --surface:#fbfefb; --ink:#203027; --muted:#5c6c63;
  --line:#d2dfd6; --accent:#b9e69a; --accent-dark:#3e692f; --tint:#e4efdf;
  --error:#99432f; --error-bg:#f7e9e3; --accent-ink:#203027;
  --bar-neutral:#809588;
}

html[data-mode=dark] {
  color-scheme: dark;
  --error: #f0ad98;
  --error-bg: #422e29;
  --accent-ink: #1a2117;
  --paper-panel: #10150f;
  --paper-panel-ink: var(--ink);
  --paper-panel-muted: var(--muted);
  --paper-panel-line: var(--line);
  --paper-panel-accent: var(--accent-dark);
  --bar-neutral: #71836a;
  --figure-paper: #fffef8;
}
html[data-mode=dark][data-theme=notebook] {
  /* The selected Field notes direction pairs with the requested After hours mode. */
  --paper:#151c24; --surface:#1b2630; --ink:#eff4f7; --muted:#a5b5c0;
  --line:#35434d; --accent:#b9e69a; --accent-dark:#b9e69a; --tint:#243239;
  --paper-panel:#0d131a; --bar-neutral:#708995; --accent-ink:#151c24;
}
html[data-mode=dark][data-theme=blueprint] {
  --paper:#141b25; --surface:#1d2937; --ink:#eaf1fa; --muted:#a8b8cb;
  --line:#3a4d62; --accent:#bad7ff; --accent-dark:#a5c9fa; --tint:#27364a;
  --paper-panel:#0d131c; --bar-neutral:#6c829a; --accent-ink:#172336;
}
html[data-mode=dark][data-theme=workshop] {
  --paper:#241c19; --surface:#30251f; --ink:#f8ece2; --muted:#ccb1a1;
  --line:#574236; --accent:#edc0a5; --accent-dark:#e7b290; --tint:#3b2d25;
  --paper-panel:#18120f; --bar-neutral:#997e6d; --accent-ink:#30211a;
}
html[data-mode=dark][data-theme=plum] {
  --paper:#211927; --surface:#2b2333; --ink:#f4edf8; --muted:#bfb0cb;
  --line:#504058; --accent:#dfb8ef; --accent-dark:#d7a8ed; --tint:#362a40;
  --paper-panel:#150f19; --bar-neutral:#8f789e; --accent-ink:#291b31;
}
html[data-mode=dark][data-theme=mono] {
  --paper:#191b1a; --surface:#252826; --ink:#f1f3ef; --muted:#b2b9b2;
  --line:#454c46; --accent:#d4d8d2; --accent-dark:#c8d0c5; --tint:#303630;
  --paper-panel:#101311; --bar-neutral:#78877b; --accent-ink:#202720;
}
html[data-mode=dark][data-theme=night] {
  --paper:#151c24; --surface:#1b2630; --ink:#eff4f7; --muted:#a5b5c0;
  --line:#35434d; --accent:#b9e69a; --accent-dark:#b9e69a; --tint:#243239;
  --paper-panel:#0d131a; --bar-neutral:#708995; --accent-ink:#151c24;
}

/* Explicit values prevent older palette-specific overrides from reversing a mode. */
html[data-mode][data-theme] ::selection {background:var(--accent);color:var(--accent-ink)}
html[data-mode][data-theme] .button.primary {
  background:var(--ink); border-color:var(--ink); color:var(--paper);
}
html[data-mode=dark][data-theme] .button.primary {
  background:var(--accent); border-color:var(--accent); color:var(--accent-ink);
}
html[data-mode][data-theme] .button.primary:hover {
  background:var(--tint); border-color:var(--accent-dark); color:var(--ink);
}
html[data-mode][data-theme] .model-buttons button[aria-pressed=true] {
  background:var(--ink); border-color:var(--ink); color:var(--paper);
}
html[data-mode][data-theme] .bar {background:var(--bar-neutral)}
html[data-mode][data-theme] .chart-row.highlight .bar {background:var(--accent-dark)}
html[data-mode][data-theme] .bid,
html[data-mode][data-theme] .token.solid {color:var(--accent-ink)}
html[data-mode][data-theme] .editor-note {color:var(--accent-ink)}
html[data-mode][data-theme][data-accent=underline] .editor-note,
html[data-mode][data-theme][data-accent=dot] .editor-note {color:var(--accent-dark)}
html[data-mode][data-theme][data-accent=quiet] .editor-note {color:var(--muted)}
html[data-mode=dark][data-accent=marker] .hero h1 em:after,
html[data-mode=dark]:not([data-accent]) .hero h1 em:after {
  background:color-mix(in srgb, var(--accent) 32%, transparent);
}
html[data-mode][data-theme] .paper-section {
  background:var(--paper-panel); color:var(--paper-panel-ink);
}
html[data-mode][data-theme] .paper-section .paper-authors,
html[data-mode][data-theme] .paper-section .institution,
html[data-mode][data-theme] .paper-section .abstract-note,
html[data-mode][data-theme] .paper-section .citation pre,
html[data-mode][data-theme] .paper-section .cite-note {color:var(--paper-panel-muted)}
html[data-mode][data-theme] .paper-section .section-number,
html[data-mode][data-theme] .paper-section .abstract-note .mono,
html[data-mode][data-theme] .paper-section .copy-button {color:var(--paper-panel-accent)}
html[data-mode][data-theme] .paper-section .section-number span,
html[data-mode][data-theme] .paper-section .citation,
html[data-mode][data-theme] .paper-section .citation-header,
html[data-mode][data-theme] .paper-section .copy-button {border-color:var(--paper-panel-line)}
html[data-mode][data-theme] .paper-section .copy-button:hover {
  background:color-mix(in srgb, var(--paper-panel-ink) 9%, transparent);
}
html[data-mode][data-theme] .paper-section .button {
  background:var(--accent); border-color:var(--accent); color:var(--accent-ink);
}
html[data-mode][data-theme] .paper-section .button:hover {
  background:var(--surface); border-color:var(--accent-dark); color:var(--ink);
}
html[data-mode][data-theme] .paper-section :focus-visible {
  outline-color:var(--paper-panel-accent);
}
/* Typeset SVGs and the rendered film intentionally remain light research figures. */
html[data-mode][data-theme] .loss-equation,
html[data-mode][data-theme] .loss-detail .equation-canvas {
  background:var(--figure-paper); color:#252820;
}
html[data-mode][data-theme] .method-film video,
html[data-mode][data-theme] .design-method-poster {background:#f7f7ef}

.header-actions {display:flex;align-items:center;gap:10px;flex-shrink:0}
.site-header .nav {margin-left:auto}
.theme-toggle {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:40px; padding:8px 12px; flex-shrink:0;
  border:1px solid var(--line); background:var(--surface); color:var(--ink);
  font:500 12px/1.25 var(--sans); white-space:nowrap;
  transition:background .15s,border-color .15s;
}
.theme-toggle:hover {background:var(--tint);border-color:var(--accent-dark)}
.theme-toggle:focus-visible {outline:3px solid var(--accent-dark);outline-offset:4px}
.theme-toggle svg {width:16px;height:16px;flex-shrink:0}
html[data-corners=soft] .theme-toggle {border-radius:8px}
html[data-mode=light] .theme-icon-dark,
html[data-mode=dark] .theme-icon-light {display:none}
html[data-mode=light] .theme-icon-light,
html[data-mode=dark] .theme-icon-dark {display:block}
html[data-preview=embedded] .theme-toggle {display:none}
@media(max-width:760px) {
  .theme-toggle {width:40px;height:40px;padding:10px}
  .theme-toggle .theme-label {display:none}
  .theme-toggle svg {width:18px;height:18px}
}
@media(prefers-reduced-motion:reduce) {.theme-toggle{transition:none}}
@media print {
  .theme-toggle {display:none!important}
  html[data-mode][data-theme] {
    color-scheme:light; --paper:#ffffff; --surface:#ffffff; --ink:#111111;
    --muted:#444444; --line:#bbbbbb; --tint:#f4f4f4;
    --accent:#e4e8d9; --accent-dark:#333333; --accent-ink:#111111;
    --paper-panel:#ffffff; --paper-panel-ink:#111111; --paper-panel-muted:#444444;
    --paper-panel-accent:#333333; --paper-panel-line:#bbbbbb;
  }
}