:root {
  --bg: #10151c;
  --bg-2: #171e27;
  --panel: #1e2733;
  --line: rgba(255, 255, 255, 0.1);
  --text: #e9eef4;
  --muted: #93a1b3;
  --accent: #e2b56a;
  --accent-2: #6ec3d8;
  --ok: #86c99a;
  --warn: #e07a73;
  --paper: #f6f3ec;
  --paper-text: #1c2430;
  --paper-muted: #5b6776;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
  --radius: 14px;
  --font: "Segoe UI", "Noto Sans", "Helvetica Neue", Arial, sans-serif;
  --mono: "Cascadia Code", "Consolas", ui-monospace, monospace;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font);
  color: var(--text);
  background: var(--bg);
  line-height: 1.45;
}

a { color: var(--accent-2); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
  background: rgba(16, 21, 28, 0.92);
  position: sticky;
  top: 0;
  z-index: 20;
  backdrop-filter: blur(10px);
}
.brand { font-weight: 700; letter-spacing: 0.02em; }
.brand small { display: block; color: var(--muted); font-weight: 500; font-size: 12px; }
.nav { display: flex; gap: 14px; flex-wrap: wrap; font-size: 14px; }
.nav a { color: var(--text); }
.nav a[aria-current="page"] { color: var(--accent); }

/* ===== Hub / notes (readable page) ===== */
body.mode-page { background: var(--paper); color: var(--paper-text); }
body.mode-page .topbar {
  background: rgba(246, 243, 236, 0.94);
  border-bottom-color: rgba(0, 0, 0, 0.08);
}
body.mode-page .brand, body.mode-page .nav a { color: var(--paper-text); }
body.mode-page .brand small, body.mode-page .muted { color: var(--paper-muted); }
body.mode-page .nav a[aria-current="page"] { color: #9a6b1e; }

.wrap { max-width: 720px; margin: 0 auto; padding: 28px 20px 80px; }
body.mode-page .wrap { max-width: 46rem; }
body.mode-page .wrap.wrap-wide { max-width: 64rem; }
body.mode-page .wrap p { font-size: 1.05rem; line-height: 1.6; }
body.mode-page .wrap li { line-height: 1.55; }
h1, h2, h3 { line-height: 1.2; }
h1 { font-size: clamp(28px, 4vw, 42px); margin: 0 0 8px; }
h2 { margin-top: 2.2em; border-bottom: 1px solid rgba(0,0,0,.08); padding-bottom: 6px; }
.lead { font-size: 1.15rem; color: var(--paper-muted); max-width: 62ch; }

.grid-sem { display: grid; gap: 18px; }
.sem {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: var(--radius);
  padding: 18px 18px 8px;
  box-shadow: 0 8px 24px rgba(28, 36, 48, 0.06);
}
.sem h2 { margin: 0 0 4px; border: 0; font-size: 1.25rem; }
.sem .meta { color: var(--paper-muted); margin-bottom: 12px; font-size: 14px; }

table.plan { width: 100%; border-collapse: collapse; font-size: 14px; }
table.plan th, table.plan td {
  text-align: left;
  vertical-align: top;
  padding: 8px 8px;
  border-top: 1px solid rgba(0,0,0,.08);
}
table.plan th { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--paper-muted); }
table.plan td.hw { font-size: 13px; line-height: 1.4; }
table.plan td.pair { font-size: 13px; line-height: 1.4; color: var(--paper-muted); }
.hw-hrs { font-weight: 700; white-space: nowrap; color: var(--paper-text); }
.hw-box {
  background: #fff7e6;
  border: 1px solid #ead7a8;
  border-left: 4px solid #c9923a;
  padding: 10px 14px;
  border-radius: 0 10px 10px 0;
  margin: 16px 0;
}
.hw-box p { margin: 0; }
.status {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.status-ready { background: #d8f3e1; color: #1c6b38; }
.status-pptx { background: #f8e6c8; color: #7a4d0c; }
.status-draft { background: #e7eaf0; color: #445060; }

.def-card {
  background: #fff;
  border-left: 4px solid #c9923a;
  padding: 10px 14px;
  margin: 16px 0;
  border-radius: 0 10px 10px 0;
}
body.mode-page .def-card .term {
  font-size: 1.06em;
  font-weight: 700;
  font-style: normal;
  color: inherit;
  margin: 0 0 4px;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.35;
}
.def-card p { margin: 0; }
.memo, dfn.memo {
  font-style: normal;
  font-weight: 700;
  box-shadow: inset 0 -0.42em 0 #f0d39a;
  padding: 0 0.12em;
}
.letter-index {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 4px;
  margin: 18px 0 8px;
  position: sticky;
  top: 52px;
  background: var(--paper);
  padding: 8px 0;
  z-index: 5;
}
.letter-index a {
  display: inline-flex;
  min-width: 1.7em;
  height: 1.7em;
  align-items: center;
  justify-content: center;
  color: var(--paper-text);
  font-weight: 700;
  border-radius: 6px;
}
.letter-index a:hover { background: #ead9b4; text-decoration: none; }
.glossary-letter {
  margin: 1.8em 0 0.6em;
  font-size: 1.15rem;
  color: var(--paper-muted);
  border: 0;
  scroll-margin-top: 120px;
}
body.mode-page .def-card { scroll-margin-top: 120px; }
.note-callout {
  background: #fff7e6;
  border: 1px solid #ead7a8;
  padding: 12px 14px;
  border-radius: 10px;
  margin: 16px 0;
}
.toc { display: grid; gap: 4px; margin: 16px 0 28px; }
.toc a { color: var(--paper-text); }
.badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  padding: 1px 7px;
  border-radius: 999px;
  background: #efe4cc;
  color: #6b4e16;
  margin-left: 6px;
}
.badge-f02 { background: #d9e8f4; color: #24506e; }
.badge-f03 { background: #e4d9f0; color: #4a2e6b; }
.badge-f04 { background: #d4eee4; color: #1e5c45; }
.badge-f05 { background: #f4d9d9; color: #6b2e2e; }
.badge-f06 { background: #f4e6d0; color: #6b4a1e; }
.badge-f07 { background: #d4eaf4; color: #1e4a5c; }
.badge-f08 { background: #e4f0d4; color: #3a5220; }
.badge-a01 { background: #d6e4f4; color: #1e3a5c; }
.badge-a02 { background: #d6eef4; color: #1e4a5c; }
.badge-a03 { background: #d9e8d4; color: #2a4a20; }
.badge-a04 { background: #f4e8d0; color: #5c3e14; }
.badge-a05 { background: #f4dce4; color: #5c2a40; }
.badge-f09 { background: #dce8f4; color: #243a52; }
.badge-f10 { background: #e8e0d0; color: #4a3c20; }
.badge-f11 { background: #e0dce8; color: #3a2a52; }
.badge-a07 { background: #d8e8dc; color: #1e4a30; }
.badge-a09 { background: #e0d8e8; color: #3a2a52; }
.badge-a10 { background: #f0e0d0; color: #5c3a18; }
.badge-a11 { background: #d0e4f0; color: #1a4060; }
.badge-a12 { background: #e4e8d0; color: #3a4a18; }
.formula {
  display: block;
  font-family: var(--mono);
  font-size: 1.08em;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 8px 0;
  margin: 10px 0;
  text-align: center;
  font-weight: 650;
  letter-spacing: .03em;
  overflow-x: auto;
}
.formula .eq-note {
  display: block;
  margin-top: 8px;
  font-size: 0.7em;
  font-weight: 500;
  font-family: var(--font);
  color: var(--paper-muted);
  letter-spacing: 0;
}
body.mode-slides .formula {
  background: transparent;
  border: 0;
  box-shadow: none;
  font-size: clamp(22px, 3.2vw, 42px);
  color: var(--accent-2);
  padding: 8px 0;
  margin: 8px 0 4px;
}
body.mode-slides .formula .eq-note {
  color: var(--muted);
  font-size: 0.42em;
}
.eq-block { margin: 6px 0 10px; }
.eq-title {
  margin: 0 0 4px;
  color: var(--accent);
  font-size: clamp(16px, 1.8vw, 22px);
  font-weight: 700;
}
.eq-block .formula {
  margin: 0 0 4px;
  font-size: clamp(18px, 2.5vw, 32px);
  padding: 4px 0;
}
.formula-paren {
  margin-inline: .08em;
}
.eq-where {
  margin: 0;
  color: var(--muted);
  font-size: clamp(13px, 1.35vw, 17px);
  line-height: 1.35;
  max-width: 72ch;
}
.badge-draft { background: #f8d9d6; color: #7a2e28; }
.glossary-index {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 12px 0 28px;
  font-size: 14px;
}
.q-list li { margin: 0.6em 0; }

/* ===== Slides ===== */
body.mode-slides { overflow: hidden; height: 100vh; background: #0b0f14; }
body.mode-slides .topbar { position: fixed; left: 0; right: 0; top: 0; }
.deck {
  height: 100vh;
  padding: 56px 0 42px;
}
.slide {
  display: none;
  height: 100%;
  padding: 28px 48px 24px;
  max-width: 1360px;
  margin: 0 auto;
}
.slide.is-active {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  overflow: hidden;
  animation: in .18s ease;
}
.slide--dense.is-active {
  overflow: auto;
  gap: 8px;
}
.slide--dense h2 {
  font-size: clamp(22px, 2.6vw, 32px);
}
.slide--dense p,
.slide--dense li {
  font-size: clamp(13px, 1.35vw, 17px);
  margin: 0.18em 0;
}
.slide--dense .defn {
  font-size: clamp(14px, 1.5vw, 18px);
  max-width: none;
  margin-top: 4px;
}
.slide--dense .caveat {
  font-size: clamp(12px, 1.2vw, 15px);
}
.slide--dense .term {
  font-size: clamp(22px, 2.6vw, 32px);
}
.slide--dense .columns {
  gap: 16px;
  align-items: stretch;
}
.slide--dense .legend-list {
  margin: 0;
  padding-left: 1.15em;
  columns: 1;
}
.slide--dense .legend-list li {
  break-inside: avoid;
  margin: 0.12em 0;
  line-height: 1.35;
}
.fig--light img {
  background: #fff;
}
@keyframes in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.slide h2 { margin: 0; font-size: clamp(28px, 4vw, 44px); border: 0; font-weight: 800; line-height: 1.15; flex: 0 0 auto; }

/* Uniform pptx-faithful lecture layout */
.slide--pptx {
  align-items: stretch;
  justify-content: flex-start;
  text-align: left;
}
.slide--pptx > h2 {
  align-self: flex-start;
  width: 100%;
  margin: 0 0 8px;
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 800;
  line-height: 1.15;
}
.slide--pptx > p,
.slide--pptx > ul,
.slide--pptx > ol {
  align-self: flex-start;
  width: 100%;
  margin: 0 0 8px;
  flex: 0 0 auto;
}
.slide--pptx > p { font-size: clamp(17px, 1.9vw, 24px); }
.slide--pptx > ul,
.slide--pptx > ol {
  font-size: clamp(16px, 1.8vw, 22px);
  padding-left: 1.2em;
}
.fig-fill {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fig-fill img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  background: transparent;
  border-radius: 0;
}
.gallery-fill {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  align-items: stretch;
}
.gallery-fill img {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: contain;
  background: transparent;
  border-radius: 0;
}
.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;
}
.kicker { display: none; }
/* leftover class; kickers removed from lecture slides */
.slide p, .slide li { font-size: clamp(18px, 2.1vw, 26px); }
.slide ul { margin: 0; padding-left: 1.1em; }
.slide li { margin: 0.28em 0; }
.muted { color: var(--muted); }
.columns { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; flex: 1; min-height: 0; }
.columns--text-wide { grid-template-columns: minmax(0, 1.45fr) minmax(220px, 0.75fr); gap: 20px; }
.columns--text-first { grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.95fr); }
.slide--defn-lg .defn {
  font-size: clamp(18px, 2.1vw, 26px);
  max-width: none;
}
.slide--defn-lg:not(.slide--dense) .defn {
  font-size: clamp(20px, 2.4vw, 30px);
}
.data--bordered {
  border: 1px solid rgba(255,255,255,0.28);
  border-radius: 8px;
  overflow: hidden;
}
.data--bordered th,
.data--bordered td {
  border: 1px solid rgba(255,255,255,0.22);
}
.data--bordered tr:last-child td { border-bottom: 1px solid rgba(255,255,255,0.22); }

.slide-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  min-height: 0;
}
.slide-stack > .columns {
  flex: 0 0 auto;
}
.slide-stack > .fig,
.slide-stack > .fig-wide {
  flex: 1 1 auto;
  min-height: 0;
}
.fig-wide {
  width: 100%;
}
.fig-wide img {
  max-height: 100%;
  width: 100%;
  object-fit: contain;
}

.slide-color-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(200px, 0.8fr);
  grid-template-rows: auto minmax(0, 1fr);
  gap: 12px 18px;
  flex: 1;
  min-height: 0;
}
.slide-color-layout .color-text { grid-column: 1; grid-row: 1; }
.slide-color-layout .color-side {
  grid-column: 2;
  grid-row: 1;
  min-height: 0;
}
.slide-color-layout .color-main {
  grid-column: 1 / -1;
  grid-row: 2;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.slide-color-layout .color-main img {
  max-height: 100%;
  max-width: min(100%, 920px);
  width: auto;
  object-fit: contain;
  background: transparent;
}
.slide-color-layout .color-side img {
  max-height: 180px;
  width: auto;
  margin-left: auto;
  display: block;
  background: transparent;
}

.slide--pair-fit .columns { gap: 14px; }
.slide--pair-fit .fig { flex: 1 1 auto; min-height: 0; }
.slide--pair-fit .fig img { max-height: 42vh; }

.defn-full {
  max-width: none !important;
  width: 100%;
  font-size: clamp(20px, 2.35vw, 30px);
  margin: 4px 0 10px;
}
.fig--plain img,
.gallery--plain img {
  background: transparent !important;
}
.defn-lead {
  font-size: clamp(20px, 2.4vw, 30px);
  font-weight: 650;
  margin: 4px 0 8px;
}
.defn-rest {
  font-size: clamp(15px, 1.6vw, 20px);
  color: var(--muted);
  margin: 0 0 8px;
  max-width: none;
}
.columns-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; }
.grow { flex: 1; min-height: 0; }

.slide--title { justify-content: center; }
.slide--title h1 { font-size: clamp(40px, 6vw, 72px); margin: 0; }
.slide--definition { justify-content: flex-start; }
.slide.is-active > ul,
.slide.is-active > ol {
  flex: 0 1 auto;
  min-height: 0;
  overflow: auto;
}
body.mode-slides .term {
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 800;
  margin: 0;
  line-height: 1.15;
  flex: 0 0 auto;
  color: var(--accent);
}
.defn {
  font-size: clamp(20px, 2.4vw, 32px);
  max-width: 50ch;
  margin: 8px 0 0;
}
.caveat { color: var(--muted); font-size: clamp(16px, 1.7vw, 22px); }

.fig {
  margin: 0;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.fig img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 10px;
  background: #000;
  margin: auto;
}
.fig.fig-lg { flex: 1 1 auto; }
.figcaption, figcaption {
  color: var(--muted);
  font-size: 12px;
  margin-top: 6px;
  flex: 0 0 auto;
}
.gallery {
  display: grid;
  gap: 10px;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  align-items: stretch;
  justify-items: stretch;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: minmax(0, 1fr);
}
.gallery:has(> img:only-child),
.gallery:has(> :only-child) { grid-template-columns: 1fr; }
.gallery:has(> img:nth-child(3):last-child) { grid-template-columns: 1fr 1fr 1fr; }
.gallery:has(> img:nth-child(4):last-child) {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}
.gallery:has(> img:nth-child(5)) { grid-template-columns: 1fr 1fr 1fr; }
.gallery img {
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  object-fit: contain;
  background: #0a0d12;
  border-radius: 8px;
}
.columns .fig img { max-height: 100%; }
.slide--definition .fig { flex: 1 1 auto; }

.data {
  width: 100%;
  border-collapse: collapse;
  font-size: clamp(14px, 1.6vw, 20px);
  background: var(--bg-2);
  border-radius: 12px;
  overflow: hidden;
}
.data th, .data td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}
.data th { color: var(--accent); font-size: 13px; letter-spacing: .04em; text-transform: uppercase; }
.data td { font-size: clamp(15px, 1.7vw, 22px); }
.data tr:last-child td { border-bottom: 0; }

.footer-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 16px;
  font-size: 13px;
  color: var(--muted);
  background: #0b0f14;
}
.footer-bar button {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 4px 12px;
  cursor: pointer;
}
.lec-nav {
  color: var(--accent-2);
  font-size: 12px;
  white-space: nowrap;
  max-width: 9.5em;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 0 0 auto;
}
.lec-nav:hover { color: var(--accent); text-decoration: none; }
#progress-track { flex: 1; height: 3px; background: #243040; border-radius: 99px; overflow: hidden; }
#progress { height: 100%; width: 0; background: var(--accent); }
.help {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 40;
  align-items: center;
  justify-content: center;
}
.help.is-open { display: flex; }
.help-card {
  background: var(--panel);
  padding: 22px 26px;
  border-radius: 14px;
  min-width: 280px;
  box-shadow: var(--shadow);
}
.help-card kbd {
  font-family: var(--mono);
  background: #0f141c;
  padding: 1px 6px;
  border-radius: 4px;
  border: 1px solid var(--line);
}
.speaker-notes {
  display: none;
  position: fixed;
  right: 16px;
  bottom: 46px;
  max-width: 380px;
  background: #fff8e8;
  color: #2a2418;
  padding: 12px 14px;
  border-radius: 10px;
  font-size: 14px;
  z-index: 15;
  box-shadow: var(--shadow);
}
body.show-notes .speaker-notes { display: block; }
body.show-notes .slide.is-active .speaker-notes { display: block; }

.pack-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin: 8px 0 28px;
}
a.pack-card {
  display: block;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: 14px 16px;
  color: var(--paper-text);
}
a.pack-card:hover {
  border-color: #c9923a;
  text-decoration: none;
}
.pack-card h2 {
  margin: 0 0 6px;
  font-size: 1.05rem;
}
.pack-card p {
  margin: 0;
  color: var(--paper-muted);
  font-size: 14px;
}

.sem-pills {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin: 4px 0 22px;
}
.sem-pill {
  display: block;
  width: 100%;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: 14px 16px;
  color: var(--paper-text);
  text-align: left;
  cursor: pointer;
  font: inherit;
  box-shadow: 0 8px 24px rgba(28, 36, 48, 0.06);
}
.sem-pill:hover {
  border-color: #c9923a;
  text-decoration: none;
}
.sem-pill[aria-current="true"] {
  border-color: #c9923a;
  box-shadow: 0 0 0 2px rgba(201, 146, 58, 0.28);
}
.sem-pill .n {
  display: block;
  font-size: 12px;
  color: var(--paper-muted);
  letter-spacing: .04em;
  text-transform: uppercase;
}
.sem-pill strong {
  display: block;
  margin-top: 4px;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
}
.sem-panel { display: none; }
.sem-panel.is-on { display: block; }
.sem-panel > h2 { margin-top: 0; }
.topic-links {
  display: inline-block;
  margin-left: .45em;
  font-size: 13px;
  white-space: nowrap;
}
.topic-links a { margin: 0 2px; }
.muted-cell { color: var(--paper-muted); }
.exam-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 22px;
}
.exam-tabs a {
  display: inline-block;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  color: var(--paper-text);
  font-size: 14px;
  font-weight: 600;
}
.exam-tabs a:hover { text-decoration: none; border-color: #c9923a; }
.exam-tabs a[aria-current="true"] {
  border-color: #c9923a;
  box-shadow: 0 0 0 2px rgba(201, 146, 58, 0.28);
}
.exam-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.exam-item {
  display: grid;
  grid-template-columns: 2.2em 1fr minmax(7em, auto);
  gap: 4px 12px;
  padding: 10px 0;
  border-top: 1px solid rgba(0,0,0,.07);
  align-items: start;
}
.exam-item .n {
  color: var(--paper-muted);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.exam-item .lec {
  font-size: 13px;
  text-align: right;
}
.exam-item .lec a { white-space: nowrap; }
.min-terms {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px;
  margin: 16px 0;
}
.min-terms a,
.min-term-plain {
  display: block;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--paper-text);
}
.min-terms a:hover {
  border-color: #c9923a;
  text-decoration: none;
}
.min-term-plain { color: var(--paper-muted); }
h2 small {
  font-weight: 500;
  color: var(--paper-muted);
  font-size: 0.72em;
}

/* ===== Inline schemes & live widgets ===== */
.scheme {
  width: 100%;
  height: auto;
  max-height: 62vh;
  background: #141b24;
  border-radius: 12px;
  border: 1px solid #2a3544;
  flex: 1;
  min-height: 180px;
}
body.mode-page .scheme {
  max-height: none;
  margin: 12px 0;
}
.widget {
  background: #141b24;
  color: #e9eef4;
  border: 1px solid #2a3544;
  border-radius: 12px;
  padding: 12px 14px 14px;
  margin: 12px 0 4px;
}
body.mode-slides .widget {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  margin: 0;
}
.widget-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
.widget-toolbar button {
  background: #1e2733;
  color: #e9eef4;
  border: 1px solid #2a3544;
  border-radius: 8px;
  padding: 4px 10px;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
}
.widget-toolbar button.is-on {
  border-color: #e2b56a;
  color: #e2b56a;
}
.widget svg,
.widget canvas {
  width: 100%;
  height: auto;
  display: block;
  flex: 1;
  min-height: 140px;
  max-height: 100%;
  background: #141b24;
  border-radius: 8px;
}
.widget-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px 16px;
  margin-top: 8px;
  font-size: 13px;
  color: #93a1b3;
}
.widget-controls label { display: flex; flex-direction: column; gap: 4px; }
.widget-controls input[type="range"] { width: 100%; }
.widget-controls--compact {
  gap: 2px 12px;
  margin-top: 2px;
  font-size: 12px;
}
.widget-controls--compact label {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.widget-controls--compact input[type="range"] {
  flex: 1;
  min-width: 72px;
  height: 14px;
  margin: 0;
}
body.mode-slides .widget--dof {
  padding: 2px 6px 4px;
}
body.mode-slides .widget--dof svg {
  flex: 1 1 0;
  min-height: 0;
  height: 0;
  width: 100%;
  max-height: none;
}
body.mode-slides .widget--dof .widget-readout {
  font-size: clamp(12px, 1.35vw, 17px);
  margin: 0;
}
.slide--widget h2 {
  font-size: clamp(18px, 2vw, 26px);
}
.widget-readout {
  font-family: var(--mono);
  font-size: clamp(15px, 1.8vw, 22px);
  color: #6ec3d8;
  margin: 8px 0 0;
  letter-spacing: 0.02em;
}
body.mode-page .widget-readout { font-size: 1.05rem; }
.widget-copy {
  margin: 8px 0 0;
  font-size: clamp(14px, 1.55vw, 20px);
  line-height: 1.45;
  color: #d5dde6;
  max-width: 72ch;
}
body.mode-slides .widget-copy {
  font-size: clamp(13px, 1.4vw, 18px);
  flex: 0 0 auto;
}
body.mode-page .widget-copy { font-size: 1.02rem; color: var(--paper-text); }
.widget-dots { display: inline-flex; gap: 6px; align-items: center; margin-left: 8px; }
.widget-dots button {
  width: 11px;
  height: 11px;
  padding: 0;
  border-radius: 99px;
  background: #1e2733;
  border: 1px solid #2a3544;
}
.widget-dots button.is-on { background: #e2b56a; border-color: #e2b56a; }
body.mode-slides .defn { max-width: 62ch; }
.stages {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 18px;
  align-items: stretch;
  flex: 1;
  min-height: 0;
}
.stage-card {
  background: var(--panel);
  border: 2px solid var(--accent);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.stage-card .n {
  color: var(--accent);
  font-weight: 800;
  font-size: clamp(14px, 1.6vw, 18px);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 8px;
}
.stage-arrow {
  align-self: center;
  color: var(--accent);
  font-size: 42px;
  font-weight: 700;
}
.stages--stack {
  grid-template-columns: 1fr;
  gap: 10px;
}
.stages--stack .stage-arrow {
  font-size: 22px;
  line-height: 1;
  transform: rotate(90deg);
}
.gallery .cam-card {
  height: 100%;
  min-height: 0;
}
.gallery .cam-card img {
  width: 100%;
  height: 100%;
}
.class-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 16px;
  flex: 1;
  min-height: 0;
}
.class-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px;
  min-height: 0;
  overflow: auto;
}
.class-card h3 {
  margin: 0 0 10px;
  color: var(--accent);
  font-size: clamp(18px, 2.1vw, 26px);
  border: 0;
}
.class-card ul { margin: 0; padding-left: 1.1em; }
.class-card p { margin: 0; font-size: clamp(14px, 1.55vw, 19px); line-height: 1.35; }
.class-grid--2 { grid-template-columns: 1fr 1fr; }
.class-grid--4 { grid-template-columns: repeat(4, 1fr); }
.class-grid--5 { grid-template-columns: repeat(5, 1fr); }
.class-grid--5 .class-card {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px 8px;
}
.class-grid--5 .class-card h3 { margin: 0; }
.slide--fit > ul,
.slide--fit > .class-grid {
  flex: 0 0 auto;
  overflow: visible;
}
.slide--fit .class-grid { gap: 10px; }
.slide--fit .class-card { padding: 10px 12px; }
.slide--fit .class-card h3 {
  margin: 0 0 6px;
  font-size: clamp(15px, 1.7vw, 22px);
}
.slide--fit .gallery {
  flex: 1 1 0;
  min-height: 0;
}
.slide--fit p,
.slide--fit li {
  font-size: clamp(15px, 1.6vw, 20px);
}
.slide--fit .data {
  font-size: clamp(12px, 1.35vw, 17px);
}
.columns .gallery {
  height: 100%;
  min-height: 0;
}
.columns--stretch { align-items: stretch; }
.columns--stretch > * {
  min-height: 0;
  overflow: hidden;
}
.people-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  flex: 1;
  min-height: 0;
}
.person {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--panel);
  border-radius: 12px;
  padding: 8px;
}
.person img {
  flex: 1;
  min-height: 0;
  width: 100%;
  object-fit: contain;
  background: #fff;
  border-radius: 8px;
}
.person h3 {
  margin: 8px 0 2px;
  font-size: clamp(13px, 1.4vw, 17px);
  border: 0;
  color: var(--accent);
}
.person a { color: var(--accent); text-decoration: none; }
.person a:hover { text-decoration: underline; }
.person p { margin: 0; font-size: clamp(12px, 1.2vw, 15px); color: var(--muted); }
.fig--fit-h {
  min-height: 0;
  max-height: calc(100vh - 14rem);
}
.fig--fit-h img {
  max-height: calc(100vh - 15rem);
  object-fit: contain;
}
.fig--paper img,
.gallery--paper img {
  background: #fff;
}
.cam-card {
  background: #efece4;
  border-radius: 12px;
  padding: 10px;
  min-height: 0;
  display: flex;
}
.cam-card img {
  background: transparent;
  object-fit: contain;
}
.quote {
  font-size: clamp(16px, 1.8vw, 22px);
  line-height: 1.45;
  max-width: 36ch;
  color: var(--text);
  margin: 0;
}
.quote cite {
  display: block;
  margin-top: 12px;
  color: var(--muted);
  font-style: normal;
  font-size: 0.85em;
}
.slide--formula-bg { position: relative; }
.formula-watermark {
  position: absolute;
  left: 4%;
  right: 4%;
  top: 28%;
  bottom: 12%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: clamp(22px, 3.4vw, 42px);
  color: rgba(226, 181, 106, 0.16);
  pointer-events: none;
  z-index: 0;
  text-align: center;
  line-height: 1.35;
}
.slide--formula-bg > *:not(.formula-watermark) { position: relative; z-index: 1; }
.q-hook {
  border-left: 4px solid var(--accent);
  padding: 8px 0 8px 16px;
  font-size: clamp(20px, 2.3vw, 30px);
  max-width: 50ch;
}
.track-pill {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 999px;
  margin-right: 6px;
}
.track-cam { background: #efe4cc; color: #6b4e16; }
.track-gnd { background: #e4f0d4; color: #3a5220; }
.track-uav { background: #d6e4f4; color: #1e3a5c; }
.track-air { background: #f4e8d0; color: #5c3e14; }
.track-sat { background: #e0d8e8; color: #3a2a52; }
.track-cv { background: #d4eee4; color: #1e5c45; }

.layers-stage {
  flex: 1;
  min-height: 0;
  position: relative;
  display: flex;
}
.layers-stage img,
.layers-stage svg {
  flex: 1;
  min-height: 0;
  width: 100%;
  object-fit: contain;
  background: #141b24;
  border-radius: 8px;
}
.fig--solo {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.fig--solo img {
  flex: 1;
  min-height: 0;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
  object-fit: contain;
}
.hist-meta {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 0 0 12px;
}
.hist-meta div {
  background: var(--panel);
  border-radius: 10px;
  padding: 10px 14px;
}
.hist-meta .k {
  display: block;
  color: var(--accent);
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 700;
}
.hist-meta p { margin: 4px 0 0; }
.assign-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  flex: 1;
  min-height: 0;
}
.assign-card {
  background: var(--panel);
  border-radius: 12px;
  padding: 14px 16px;
}
.assign-card h3 {
  margin: 0 0 8px;
  border: 0;
  color: var(--accent);
  font-size: clamp(16px, 1.8vw, 22px);
}
.fig-slot {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--panel);
  border: 1px dashed var(--line);
  border-radius: 12px;
  color: var(--muted);
  padding: 16px;
  text-align: center;
}
@media (max-width: 800px) {
  .slide { padding: 18px 16px; }
  .columns, .columns-3 { grid-template-columns: 1fr; }
  .stages, .class-grid, .people-grid, .assign-grid, .hist-meta { grid-template-columns: 1fr; }
  .stage-arrow { transform: rotate(90deg); }
  .gallery:has(> img:nth-child(3):last-child) { grid-template-columns: 1fr; }
  .lec-nav { max-width: 5.5em; font-size: 11px; }
  .exam-item {
    grid-template-columns: 2em 1fr;
  }
  .exam-item .lec {
    grid-column: 2;
    text-align: left;
  }
}
/* ===== Simulators ===== */
body.mode-sim {
  background: #0d1218;
  color: var(--text);
  min-height: 100vh;
}
.sim-page {
  max-width: 1280px;
  margin: 0 auto;
  padding: 20px 20px 64px;
}
.sim-head h1 { margin: 0 0 6px; }
.sim-head p {
  margin: 0 0 12px;
  color: var(--muted);
  max-width: 62ch;
}
.sim-run {
  max-width: 72ch !important;
  font-size: 14px;
}
.sim-run code {
  color: #e2b56a;
  font-size: 13px;
}
.sim-need-http, .sim-fail {
  background: #3a2a18;
  border: 1px solid #e2b56a;
  color: #e9eef4;
  border-radius: 12px;
  padding: 14px 16px;
  max-width: 72ch;
  margin: 0 0 16px;
}
.sim-need-http a { color: #e2b56a; }
.sim-need-http code, .sim-fail code { color: #e2b56a; }
.sim-stage .sim-fail {
  position: absolute;
  z-index: 5;
  left: 12px;
  right: 12px;
  top: 12px;
  margin: 0;
}
.sim-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 0 0 16px;
}
.sim-tabs a {
  color: var(--text);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 99px;
  padding: 7px 14px;
  font-size: 14px;
}
.sim-tabs a:hover { text-decoration: none; border-color: var(--accent); }
.sim-tabs a.is-on {
  color: #141b24;
  background: var(--accent);
  border-color: var(--accent);
}
.sim-panel { display: none; }
.sim-panel.is-on { display: block; }
.sim-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  min-height: calc(100vh - 210px);
}
.sim-stage {
  position: relative;
  background: #10151c;
  border: 1px solid var(--line);
  border-radius: 14px;
  min-height: 520px;
  overflow: hidden;
}
.sim-canvas, .sim-labels, .sim-label-layer {
  position: absolute;
  inset: 0;
}
.sim-labels,
.sim-label-layer { pointer-events: none !important; }
.sim-canvas canvas { display: block; width: 100%; height: 100%; }
.sim-webgl {
  touch-action: none;
  cursor: grab;
  user-select: none;
}
.sim-webgl:active { cursor: grabbing; }
.sim-label {
  color: #e9eef4;
  background: rgba(20, 27, 36, 0.86);
  border: 1px solid #e2b56a;
  border-radius: 8px;
  padding: 3px 8px;
  font-size: 12px;
  white-space: nowrap;
  pointer-events: none;
}
.sim-toolbar {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  z-index: 3;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  align-items: center;
  background: rgba(16, 21, 28, 0.88);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 12px;
}
.sim-toolbar.is-hidden { display: none; }
.sim-seg { display: flex; gap: 0; }
.sim-seg button, .sim-part {
  background: #1e2733;
  color: var(--text);
  border: 1px solid var(--line);
  padding: 6px 12px;
  font: inherit;
  cursor: pointer;
}
.sim-seg button:first-child { border-radius: 8px 0 0 8px; }
.sim-seg button:last-child { border-radius: 0 8px 8px 0; }
.sim-seg button.is-on,
.sim-part.is-on {
  background: var(--accent);
  color: #141b24;
  border-color: var(--accent);
}
.sim-range {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--muted);
}
.sim-orbit-hint {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 4;
  color: #e9eef4;
  background: rgba(20, 27, 36, 0.82);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 5px 10px;
  font-size: 12px;
  display: flex;
  gap: 10px;
  align-items: center;
  pointer-events: auto;
}
.sim-orbit-hint button {
  border: 1px solid #6b7887;
  border-radius: 6px;
  padding: 2px 7px;
  color: #e9eef4;
  background: #273442;
  font: inherit;
  cursor: pointer;
}
.sim-range--pri input { width: 180px; }
.sim-more {
  flex: 1 1 100%;
  color: var(--muted);
  font-size: 13px;
}
.sim-more summary {
  cursor: pointer;
  color: var(--accent);
  margin-bottom: 8px;
}
.sim-more .sim-range { margin: 6px 8px 0 0; }
.sim-toolbar button.is-on.sim-part {
  background: var(--accent);
  color: #141b24;
}
.sim-check {
  font-size: 13px;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 6px;
}
.sim-side {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 16px 20px;
  min-height: 0;
}
.sim-kicker {
  margin: 0 0 4px;
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  font-weight: 700;
}
.sim-side h2 {
  margin: 0 0 8px;
  border: 0;
  font-size: 1.35rem;
  color: var(--text);
}
.sim-side p { margin: 0 0 14px; color: #d5dde6; }
.sim-side .muted { color: var(--muted); font-size: 13px; }
.sim-parts {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 14px;
}
.sim-part {
  border-radius: 8px;
  text-align: left;
  font-size: 14px;
}
.sim-layout--dof { min-height: calc(100vh - 210px); }
.sim-dof-views {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  min-height: calc(100vh - 250px);
}
.sim-layout--dof .sim-stage--photo {
  height: 32vh;
  min-height: 220px;
}
.sim-photo {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 280px;
}
.sim-geom {
  margin: 0;
  background: #141b24;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.sim-geom svg { display: block; width: 100%; height: auto; }
.sim-toolbar--static {
  position: static;
  inset: auto;
}
.sim-shot {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 36 / 24;
  background: #0a0d12;
  border-radius: 8px;
  margin: 0 0 12px;
}
.sim-soon {
  background: var(--panel);
  border: 1px dashed var(--line);
  border-radius: 14px;
  padding: 28px;
  max-width: 52ch;
}
.sim-stage--afs { cursor: crosshair; }
.sim-afs-map {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: crosshair;
  background: #10151c;
}
.sim-stage--observer,
#exposure .sim-stage--photo {
  min-height: 280px;
  height: 36vh;
}
.sim-select {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}
.sim-select select,
.sim-custom-grid input {
  color: var(--text);
  background: #1e2733;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 5px 8px;
}
.sim-preset-box {
  display: contents;
}
.sim-custom-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 8px;
}
.sim-custom-grid label {
  display: grid;
  gap: 3px;
}
.sim-lab-main {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.sim-stage--lab {
  min-height: 430px;
  height: 52vh;
}
.sim-lab-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}
.sim-lab-steps button {
  color: var(--muted);
  background: #1e2733;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 6px;
  cursor: pointer;
}
.sim-lab-steps button.is-on {
  color: #141b24;
  background: var(--accent);
  border-color: var(--accent);
}
.sim-lab-controls { align-items: end; }
.sim-stereo-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.sim-stereo-pair figure {
  margin: 0;
  min-width: 0;
}
.sim-stereo-pair figcaption {
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  margin-top: 4px;
}
.sim-stereo-pair .sim-shot {
  margin: 0;
  border: 1px solid var(--line);
}
.sim-result-list {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.sim-result-list div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 5px;
}
.sim-result-ok { color: #86c99a; }
.sim-result-warn { color: #e2b56a; }
.sim-warning { color: #e2b56a !important; }
.afs-point {
  color: #141b24;
  border: 2px solid #141b24;
  display: grid;
  place-items: center;
  font: 700 11px/1 sans-serif;
  box-shadow: 0 1px 4px #0008;
}
.afs-point--gcp {
  background: #e2b56a;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
}
.afs-point--chk {
  background: #6ec3d8;
  border-radius: 3px;
}
.leaflet-container { font-family: inherit; }
.leaflet-control-attribution { font-size: 10px; }
.sim-stage--workflow {
  min-height: 420px;
  height: 48vh;
}
.sim-workflow-output {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
}
.sim-workflow-output > section { display: none; }
.sim-workflow-output > section.is-on { display: block; }
.sim-workflow-output h2 {
  margin: 0 0 12px;
  border: 0;
  font-size: 1rem;
}
.sim-stereo-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.sim-stereo-pair figure { margin: 0; }
.sim-stereo-pair canvas,
.sim-process-canvas {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;
  background: #090d12;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.sim-stereo-pair figcaption {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}
.sim-workflow-steps {
  display: grid;
  gap: 6px;
  margin-bottom: 16px;
}
.sim-workflow-steps button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 9px;
  color: var(--text);
  background: #1e2733;
  cursor: pointer;
  text-align: left;
}
.sim-workflow-steps button span {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #344252;
}
.sim-workflow-steps button.is-on {
  border-color: var(--accent);
  color: #141b24;
  background: var(--accent);
}
.sim-workflow-steps button.is-on span { background: #fff8; }
.sim-workflow-controls {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}
.sim-params-switch {
  margin: 0 0 12px;
  color: var(--text);
}
.sim-ray-controls {
  display: grid;
  gap: 7px;
  margin: 0 0 14px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: #18212b;
}
.sim-ray-controls > label:not(.sim-check) {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 13px;
}
.sim-ray-controls .muted {
  margin: 0;
  font-size: 11px;
}
.sim-workflow-controls .sim-range,
.sim-workflow-side .sim-more .sim-range {
  justify-content: space-between;
}
.sim-workflow-controls input,
.sim-workflow-side .sim-more input { width: 120px; }
.sim-primary {
  width: 100%;
  margin: 12px 0;
  border: 0;
  border-radius: 9px;
  padding: 10px 12px;
  background: var(--accent);
  color: #141b24;
  font: 700 14px/1.2 inherit;
  cursor: pointer;
}
.sim-reconstruction-table {
  overflow: auto;
  max-height: 360px;
}
.sim-reconstruction-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.sim-reconstruction-table th,
.sim-reconstruction-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  text-align: right;
}
.sim-reconstruction-table th:first-child,
.sim-reconstruction-table td:first-child { text-align: left; }
.sim-workflow-side [data-wf-read] {
  font-size: 13px;
  color: #d5dde6;
}
.sim-workflow-side [data-wf-read] p { margin-bottom: 8px; }
@media (max-width: 720px) {
  .sim-stereo-pair { grid-template-columns: 1fr; }
}
.sim-afs-pts {
  font-size: 13px;
  line-height: 1.45;
  color: #d5dde6;
  max-height: 28vh;
  overflow: auto;
}
.sim-afs-pts .sim-kicker { margin-top: 12px; }
.sim-afs-pts .muted { color: var(--muted); }
.sim-side [data-afs-read] p { margin: 0 0 8px; }
.sim-soon h2 { margin: 0 0 8px; border: 0; }
@media (max-width: 960px) {
  .sim-layout { grid-template-columns: 1fr; }
  .sim-stage { min-height: 64vh; }
  .sim-lab-steps { grid-template-columns: 1fr 1fr; }
}

.theme-toggle {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 10px;
  color: var(--text);
  background: var(--panel);
  font: 600 12px/1.2 var(--font);
  cursor: pointer;
  white-space: nowrap;
}
.theme-toggle:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.theme-toggle:focus-visible {
  outline: 2px solid var(--accent-2);
  outline-offset: 2px;
}

/* Ф02: крупные технические схемы и интерактивные построения */
.f02-full-figure img {
  width: 100%;
  height: 100%;
  background: #fff;
}
.f02-photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
  border: 2px solid var(--line);
}
.f02-phenomena-labels {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
}
.f02-phenomena-labels span {
  padding: 7px 5px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--text);
  background: var(--panel);
  font-size: clamp(11px, 1.05vw, 15px);
  font-weight: 700;
  text-align: center;
}
.f02-pair-labels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  color: var(--text);
  font-size: clamp(13px, 1.2vw, 17px);
  font-weight: 700;
  text-align: center;
}
.f02-focus-modes {
  flex: 1 1 auto;
  min-height: 0;
  align-items: stretch;
}
.f02-focus-modes .card p {
  font-size: clamp(16px, 1.65vw, 21px);
}
.f02-diaphragm-effects {
  align-items: stretch;
}
.f02-diaphragm-effects > div {
  display: flex;
  min-height: 0;
  flex-direction: column;
  gap: 8px;
}
.f02-diaphragm-effects h3 {
  margin: 0;
  font-size: clamp(17px, 1.8vw, 24px);
}
.f02-diaphragm-effects .f02-static-figure,
.f02-diaphragm-effects .fig {
  flex: 1 1 auto;
}
.f02-static-figure {
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  border: 2px solid var(--line);
  border-radius: 14px;
  background: #fff;
}
.f02-static-figure svg {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
}
.f02-parts-layout,
.f02-parameters-layout {
  grid-template-columns: minmax(290px, .72fr) minmax(0, 1.28fr);
  align-items: stretch;
}
.f02-parts-layout > ul,
.f02-parameters-layout > ul {
  align-self: center;
}
.slide .card {
  height: 100%;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
}
.slide .card h3 {
  margin-top: 0;
  color: var(--accent);
  font-size: clamp(20px, 2.1vw, 28px);
}
.f02-image-only {
  padding-block: 12px;
}
.f02-image-only .fig img {
  width: 100%;
  height: 100%;
  background: #fff;
}
.f02-readout:empty {
  display: none;
}
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  flex-direction: column;
  gap: 9px;
  padding: 12px;
  border: 2px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: #000;
}
.f02-interactive svg {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  border-radius: 9px;
  background: #fff;
}
.f02-image-slider img {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
  object-fit: contain;
  border: 1px solid #111;
  border-radius: 9px;
  background: #fff;
}
.f02-controls {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 2fr);
  gap: 18px;
  align-items: center;
}
.f02-controls label,
.f02-readout,
.f02-stage-label {
  color: #000;
  font: 600 clamp(14px, 1.35vw, 18px)/1.3 var(--font);
}
.f02-controls input[type="range"] {
  width: 100%;
}
.f02-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.f02-chip {
  border: 2px solid #111;
  border-radius: 999px;
  padding: 7px 12px;
  color: #000;
  background: #fff;
  font: 700 14px/1 var(--font);
  cursor: pointer;
}
.f02-chip.is-active {
  color: #fff;
  background: #000;
}
.f02-readout {
  min-height: 2.6em;
  margin: 0;
}
.frac {
  display: inline-grid;
  grid-template-rows: auto auto;
  margin-inline: .14em;
  vertical-align: middle;
  line-height: 1.05;
  text-align: center;
}
.frac > span:first-child {
  padding: 0 .2em .1em;
  border-bottom: .075em solid currentColor;
}
.frac > span:last-child {
  padding: .1em .2em 0;
}
.formula-separator {
  display: inline-block;
  margin-left: 1.5em;
}
.formula--row {
  white-space: nowrap;
  overflow: visible;
  font-size: clamp(15px, 1.55vw, 24px);
  letter-spacing: -0.01em;
}
.formula--nowrap {
  white-space: nowrap;
  overflow-x: auto;
  font-size: clamp(18px, 1.9vw, 28px);
}
.f02-aberr-layout {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
}
.f02-aberr-layout .class-grid {
  grid-template-columns: 1fr;
}
.f02-calib-params {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.f02-calib-params .card p {
  font-size: clamp(14px, 1.2vw, 18px);
}
.f02-focus-legend {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 6px;
}
.f02-focus-legend div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}
.f02-focus-legend strong {
  font-size: clamp(14px, 1.25vw, 18px);
}
.f02-focus-legend span {
  color: var(--muted);
  font-size: clamp(13px, 1.1vw, 16px);
  line-height: 1.25;
}
[data-f02-focus-practice] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
}
[data-f02-focus-practice] svg {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}
.f02-definition-cards,
.f02-lightpower-layout,
.f02-macro-layout,
.f02-extension-layout,
.f02-chromatic-layout,
.f02-distortion-layout,
.f02-model-layout,
.f02-source-layout {
  align-items: stretch;
}
.f02-definition-cards .card p,
.f02-calibration-methods .card p {
  font-size: clamp(15px, 1.35vw, 19px);
}
.f02-lightpower-layout {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 14px;
  align-items: start;
}
.f02-lightpower-layout .eq-block {
  margin-bottom: 6px;
}
.f02-lightpower-layout .formula {
  font-size: clamp(20px, 2.1vw, 30px);
}
.f02-coated-photo {
  margin: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: 100%;
}
.f02-coated-photo img {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  object-fit: contain;
  border: 2px solid var(--line);
  background: #fff;
}
.f02-coated-photo figcaption {
  margin-top: 8px;
  padding: 0 2px;
  color: var(--muted);
  font-size: clamp(13px, 1.15vw, 16px);
  line-height: 1.35;
}
.f02-format-controls {
  grid-template-columns: 1fr;
}
.f02-format-controls .f02-chip-row {
  margin-bottom: 4px;
}
.f02-formula-columns {
  align-items: stretch;
}
.f02-dof-hero,
.f02-static-figure[data-f02-dof-rays] {
  flex: 1 1 auto;
  min-height: 0;
}
.f02-projection-fig {
  flex: 1 1 auto;
  min-height: 0;
}
.f02-projection-fig img {
  background: #fff;
  object-fit: contain;
}
.f02-projection-fig figcaption {
  font-size: clamp(14px, 1.35vw, 18px);
  line-height: 1.35;
}
.f02-dof-coc-combo {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, 0.7fr);
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
  gap: 12px;
}
.f02-dof-coc-combo .f02-dof-hero {
  min-height: 0;
}
.f02-coc-side {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
}
.f02-coc-caption {
  margin: 0;
  font-size: clamp(15px, 1.5vw, 20px);
  line-height: 1.35;
  color: var(--muted);
}
.f02-coc-compact {
  flex: 1 1 auto;
  min-height: 0;
  transform: scale(0.92);
  transform-origin: top center;
}
.f02-coc-compact svg {
  max-height: 100%;
}
.eq-block .frac {
  font-size: 0.92em;
}
.eq-block .frac > span:last-child {
  font-size: 0.88em;
}
[data-f02-focus-practice],
[data-f02-camera-geometry],
[data-f02-projections],
[data-f02-calibration-pipeline] {
  flex: 1 1 auto;
  min-height: 0;
}
.data--grid {
  border: 2px solid var(--text);
  border-collapse: collapse;
  border-radius: 0;
  overflow: visible;
  background: var(--bg);
}
.data--grid th,
.data--grid td {
  border: 1px solid var(--text);
}
.data--grid tr:last-child td {
  border-bottom: 1px solid var(--text);
}
html[data-slide-theme="light"] body.mode-slides .data--grid {
  border: 2px solid #000;
  background: #fff;
  box-shadow: none;
}
html[data-slide-theme="light"] body.mode-slides .data--grid th,
html[data-slide-theme="light"] body.mode-slides .data--grid td {
  border: 1px solid #000;
  color: #000;
}
.f02-macro-layout {
  grid-template-columns: minmax(330px, .9fr) minmax(0, 1.1fr);
}
.f02-macro-layout .class-grid {
  grid-template-columns: 1fr;
}
.f02-macro-layout .card {
  padding: 17px;
}
.f02-extension-layout {
  grid-template-columns: minmax(0, 1.1fr) minmax(340px, .9fr);
}
.f02-bottom-gallery {
  display: grid;
  flex: 1 1 auto;
  min-height: 0;
  grid-template-columns: .75fr 1.25fr;
  gap: 14px;
}
.f02-bottom-gallery figure {
  display: flex;
  min-height: 0;
  margin: 0;
  flex-direction: column;
}
.f02-bottom-gallery img {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  object-fit: contain;
  border: 1px solid var(--line);
  background: #fff;
}
.f02-chromatic-layout {
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
}
.f02-af-layout {
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 10px;
}
.f02-af-layout .card p {
  font-size: clamp(15px, 1.35vw, 20px);
  margin: 0 0 8px;
}
.f02-af-figure {
  min-height: 220px;
  flex: 0 0 auto;
}
.f02-mtf-layout {
  grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr);
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
}
.f02-mtf-layout .class-grid {
  grid-template-columns: 1fr;
}
.f02-helios-fig {
  background: #0a0a0a;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.f02-helios-fig img {
  background: #0a0a0a;
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
}
.f02-aperture-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  flex: 1 1 auto;
  min-height: 0;
  align-items: stretch;
}
.f02-aperture-gallery .fig {
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.f02-aperture-gallery img {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  object-fit: contain;
  background: #fff;
}
.slide--image-only .fig-full {
  flex: 1 1 auto;
  min-height: 0;
}
.slide--image-only .fig-full img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.fig-full {
  flex: 1 1 auto;
  min-height: 0;
  margin: 0;
}
.fig-full img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}
.f02-params-list {
  flex: 1 1 auto;
  margin: 12px 0 0;
  padding-left: 1.2em;
  font-size: clamp(22px, 2.5vw, 36px);
  line-height: 1.55;
  columns: 2;
  column-gap: 48px;
}
.slide--image-only .f02-static-figure.fig-full {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}
.slide--image-only .f02-static-figure.fig-full svg {
  width: 100%;
  height: 100%;
  display: block;
}
.slide--image-only.is-active {
  display: flex;
  flex-direction: column;
}
.f02-distortion-layout {
  grid-template-columns: minmax(390px, .9fr) minmax(0, 1.1fr);
}
.f02-fov-layout {
  grid-template-columns: minmax(280px, .85fr) minmax(0, 1.15fr);
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
}
.f02-fov-layout .fig {
  margin: 0;
  min-height: 0;
}
.f02-fov-layout .fig img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.f02-distortion-layout .card {
  height: auto;
  margin-bottom: 9px;
  padding: 13px 17px;
}
.f02-distortion-layout .card h3 {
  margin-bottom: 4px;
}
.f02-distortion-layout .card p {
  margin: 0;
  font-size: clamp(14px, 1.22vw, 18px);
}
.f02-model-layout {
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr);
}
.f02-model-layout .eq-block {
  margin-bottom: 7px;
  padding: 10px 14px;
}
.f02-model-layout .formula {
  font-size: clamp(18px, 1.85vw, 27px);
}
.f02-model-layout .eq-where {
  font-size: clamp(12px, 1.02vw, 15px);
}
.f02-source-layout {
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
}
.f02-source-layout .class-grid {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.f02-source-layout .card {
  padding: 13px;
}
.f02-source-layout .card h3 {
  font-size: clamp(17px, 1.65vw, 23px);
}
.f02-source-layout .card p {
  font-size: clamp(14px, 1.15vw, 17px);
}
.columns-4,
.f02-calibration-methods {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.f02-calibration-methods .card {
  padding: 13px;
}
.f02-calibration-methods .card h3 {
  font-size: clamp(17px, 1.6vw, 22px);
}
.f02-calibration-figure {
  max-height: 30vh;
  margin-top: 10px;
}
.f02-calibration-pipeline-slide .card {
  padding: 15px 18px;
}
.f02-questions {
  columns: 2;
  column-gap: 54px;
}
.f02-questions li {
  break-inside: avoid;
  margin-bottom: .55em;
}
html[data-slide-theme="light"] body.mode-slides [data-widget="dof"] svg {
  filter: invert(1) hue-rotate(180deg);
}
@media (max-width: 800px) {
  .f02-phenomena-labels {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .f02-parts-layout,
  .f02-parameters-layout,
  .f02-definition-cards,
  .f02-lightpower-layout,
  .f02-macro-layout,
  .f02-extension-layout,
  .f02-chromatic-layout,
  .f02-fov-layout,
  .f02-aberr-layout,
  .f02-af-layout,
  .f02-mtf-layout,
  .f02-calib-params,
  .f02-distortion-layout,
  .f02-model-layout,
  .f02-source-layout,
  .columns-4,
  .f02-calibration-methods {
    grid-template-columns: 1fr;
  }
  .f02-controls {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .f02-questions {
    columns: 1;
  }
}

html[data-slide-theme="light"] {
  color-scheme: light;
  --bg: #ffffff;
  --bg-2: #ffffff;
  --panel: #ffffff;
  --line: rgba(0, 0, 0, 0.62);
  --text: #000000;
  --muted: #222222;
  --accent: #000000;
  --accent-2: #003c66;
  --ok: #005a2b;
  --warn: #8a0000;
  --shadow: 0 16px 42px rgba(0, 0, 0, 0.18);
}
html[data-slide-theme="light"] body.mode-slides {
  color: var(--text);
  background: var(--bg);
}
html[data-slide-theme="light"] body.mode-slides .topbar {
  background: rgba(255, 255, 255, 0.97);
  border-bottom-color: var(--line);
}
html[data-slide-theme="light"] body.mode-slides .footer-bar {
  background: #ffffff;
  border-top: 1px solid var(--line);
}
html[data-slide-theme="light"] body.mode-slides .formula {
  color: var(--text);
  background: transparent;
  border: 0;
  box-shadow: none;
}
html[data-slide-theme="light"] body.mode-slides #progress-track {
  background: #b8b8b8;
}
html[data-slide-theme="light"] body.mode-slides .help {
  background: rgba(0, 0, 0, 0.38);
}
html[data-slide-theme="light"] body.mode-slides .help-card kbd {
  color: var(--text);
  background: #ffffff;
}
html[data-slide-theme="light"] body.mode-slides .formula-watermark {
  color: rgba(0, 0, 0, 0.1);
}
html[data-slide-theme="light"] body.mode-slides input {
  accent-color: var(--accent);
}
html[data-slide-theme="light"] body.mode-slides .fig img,
html[data-slide-theme="light"] body.mode-slides .gallery img {
  background: transparent;
  border: 1px solid var(--line);
}
html[data-slide-theme="light"] body.mode-slides .scheme,
html[data-slide-theme="light"] body.mode-slides .widget,
html[data-slide-theme="light"] body.mode-slides .widget svg,
html[data-slide-theme="light"] body.mode-slides .widget canvas,
html[data-slide-theme="light"] body.mode-slides .layers-stage img,
html[data-slide-theme="light"] body.mode-slides .layers-stage svg {
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
}
html[data-slide-theme="light"] body.mode-slides .speaker-notes {
  border: 1px solid #dfc789;
}

@media print {
  body.mode-slides { overflow: visible; height: auto; }
  .topbar, .footer-bar, .help, .theme-toggle { display: none !important; }
  .deck { height: auto; padding: 0; }
  .slide { display: block !important; height: auto; page-break-after: always; }
}

.hub-qr {
  margin: 2rem 0 1rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--line, #d0d5dd);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .75rem;
  text-align: center;
  min-height: calc(100vh - 6rem);
}
.hub-qr img {
  display: block;
  width: min(92vw, 92vh);
  height: min(92vw, 92vh);
  max-width: 100%;
  object-fit: fill;
  background: #fff;
  border-radius: 8px;
}
.hub-qr p {
  margin: 0;
  font-size: clamp(1.1rem, 2.2vw, 1.6rem);
}
.hub-qr a {
  color: inherit;
}

.f03a-static-figure {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}
.f03a-static-figure svg {
  width: 100%;
  height: 100%;
  display: block;
  min-height: 240px;
}
.f03a-drive-cards {
  flex: 1 1 auto;
  align-items: stretch;
}
.f03a-location-layout {
  flex: 1 1 auto;
  min-height: 0;
  align-items: stretch;
}

.f02-aperture-number-layout {
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
  align-items: start;
  gap: 20px;
  flex: 1 1 auto;
  min-height: 0;
}
.f02-aperture-wiki-figs {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
}
.f02-aperture-wiki-figs .fig {
  margin: 0;
}
.f02-aperture-wiki-figs img {
  max-height: 220px;
  width: 100%;
  object-fit: contain;
  background: #fff;
}
.f02-dof-coc-combo[data-f02-dof-combo] {
  grid-template-columns: minmax(0, 1.6fr) minmax(280px, 0.75fr);
}
.f02-dof-coc-combo .f02-controls {
  grid-column: 1 / -1;
}
.f02-dof-coc-combo .f02-dof-hero,
.f02-dof-coc-combo .f02-coc-side {
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.f02-dof-coc-combo .f02-dof-hero svg,
.f02-dof-coc-combo .f02-coc-side svg {
  width: 100%;
  height: 100%;
  min-height: 280px;
  flex: 1 1 auto;
}

.f03a-location-layout ul {
  margin: 0;
  padding-left: 1.1em;
  align-self: start;
}
.f03a-location-layout .f03a-static-figure {
  min-height: 300px;
}
