:root {
  --cream: #faf7f0;
  --paper: #fffdf7;
  --ink: #1c2333;
  --ink-soft: #3a4456;
  --muted: #6b7589;
  --gold: #b8873a;
  --gold-deep: #8c661f;
  --teal: #2c5f5d;
  --burgundy: #8b3a3a;
  --line: #d9d0be;
  --night: #13182a;
  --footer-h: 64px;
  --accent: #b8873a;
  --border: rgba(28, 35, 51, 0.14);
}

* { box-sizing: border-box; }
html, body {
  margin: 0;
  overflow: hidden;
  height: 100%;
  background: var(--cream);
  color: var(--ink);
  font-family: "PingFang TC", "Noto Sans TC", "Helvetica Neue", ui-sans-serif, system-ui, sans-serif;
}

button {
  border: 0;
  background: var(--night);
  color: #f4efe3;
  padding: .55rem .8rem;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 700;
  font-family: inherit;
}
button:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}

.deck-shell {
  width: 100vw;
  height: 100svh;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr) var(--footer-h);
  background: var(--cream);
}
.deck-shell.toc-collapsed {
  grid-template-columns: 0 minmax(0, 1fr);
}
.deck-shell.toc-collapsed .toc {
  visibility: hidden;
  pointer-events: none;
}

.toc {
  padding: 1rem .85rem;
  border-right: 1px solid var(--line);
  overflow: auto;
  background: #f3eee3;
  min-width: 0;
}
.brand span, .sync-state {
  display: block;
  font-size: .72rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold-deep);
}
.brand strong {
  display: block;
  margin: .35rem 0 1rem;
  font-size: .95rem;
}
.toc nav button {
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  color: var(--muted);
  margin-bottom: .35rem;
  font-weight: 500;
}
.toc nav button.active {
  color: var(--ink);
  font-weight: 700;
}

.stage {
  min-width: 0;
  min-height: 0;
  position: relative;
  overflow: hidden;
  container-type: size;
}

.slide {
  display: none;
  height: 100%;
  padding: clamp(1rem, 2.2cqw, 1.8rem) clamp(1.1rem, 2.6cqw, 2.2rem);
  overflow: hidden;
  gap: clamp(.55rem, 1.2cqh, 1rem);
  font-size: clamp(24px, calc(1.35cqw + 1.7cqh), 34px);
}
.slide.active {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.slide header {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(16rem, .9fr);
  gap: .8rem;
  align-items: start;
  border-bottom: 1px solid var(--line);
  padding-bottom: .45rem;
}
.eyebrow {
  margin: 0 0 .2rem;
  color: var(--gold-deep);
  font-size: .58em;
  letter-spacing: .16em;
  font-weight: 700;
}
h1, h2, h3 {
  margin: 0;
  line-height: 1.22;
  letter-spacing: .01em;
  font-weight: 700;
  color: var(--ink);
}
h1 { font-size: 1.45em; }
h2 { font-size: 1.22em; }
h3 { margin: 0 0 .28rem; font-size: .92em; }
.subtitle, .takeaway { color: var(--ink); }
.takeaway {
  margin: 0;
  font-size: .88em;
  font-weight: 600;
}
.slide-body p, .slide-body li, .card-col p, .path-grid p, .compare-grid p, .six li, .two-photo p {
  font-size: .88em;
  line-height: 1.5;
  margin: 0;
  color: var(--ink);
}

.soil-frame {
  background: var(--paper);
  border: 1px solid var(--line);
  padding: .55rem .7rem;
  border-radius: 6px;
}
.soil-claim, .soil-task {
  margin: 0;
  font-size: .68em;
  line-height: 1.45;
  color: var(--ink);
}
.soil-task { margin-top: .25rem; }

.slide-stack {
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(16cqh, 28cqh) minmax(0, 1fr);
  gap: .55rem;
}
.admit-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  align-content: stretch;
}
.admit-grid article {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: .5rem .7rem;
  min-width: 0;
}
.admit-grid .span-2 { grid-column: 1 / -1; }
.split-layout.preq-split {
  grid-template-columns: minmax(16rem, 1fr) minmax(16rem, 1fr);
}
.chain {
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: .15rem;
}
.chain article {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: .35rem .7rem;
}
.chain .engine {
  border-color: var(--gold);
  background: #fff8ea;
}
.chain-arrow {
  margin: 0;
  text-align: center;
  color: var(--gold-deep);
  font-weight: 700;
  font-size: .7em;
  line-height: 1;
}
.split-layout {
  min-height: 0;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: .75rem;
  align-items: stretch;
}
.split-layout.two-photo { grid-template-columns: 1fr 1fr; }
.split-layout.path-split { grid-template-columns: minmax(18rem, .92fr) minmax(0, 1.15fr); }
.path-col {
  min-height: 0;
  height: 100%;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: .3rem;
}
.path-col .takeaway { font-size: .72em; font-weight: 600; }
.path-list {
  min-height: 0;
  display: grid;
  grid-template-rows: repeat(6, minmax(0, 1fr));
  gap: .28rem;
}
.path-list article {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: .22rem .65rem;
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: .5rem;
}
.path-list h3 { margin: 0; flex: 0 1 auto; }
.path-list p { flex: 1; min-width: 0; }
.card-col, .compare-grid, .path-grid {
  min-height: 0;
  height: 100%;
  display: grid;
  gap: .55rem;
}
.card-col { grid-template-rows: repeat(3, minmax(0, 1fr)); }
.compare-grid { grid-template-columns: 1fr 1fr; }
.path-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.card-col article, .compare-grid article, .path-grid article, .two-photo article {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: .7rem .8rem;
  min-width: 0;
}
.two-photo article { display: grid; grid-template-rows: minmax(0, 1.15fr) auto auto; gap: .4rem; }
.compare-grid b {
  display: block;
  margin-top: .45rem;
  color: var(--gold-deep);
  font-size: .8em;
}
.gain { border-top: 3px solid var(--teal); }
.stuck { border-top: 3px solid var(--burgundy); }

.content-media {
  margin: 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.content-media img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
}
.content-media.banner {
  width: 100%;
  max-height: 28cqh;
}
.content-media.banner img {
  width: 100%;
  max-height: 28cqh;
  object-fit: contain;
}

.title-slide {
  position: relative;
  padding: 0;
  grid-template-rows: 1fr;
}
.title-slide .hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 55% 50%;
}
.title-copy {
  position: relative;
  z-index: 1;
  align-self: end;
  margin: 1.2rem;
  max-width: 72%;
  padding: 1rem 1.1rem;
  background: rgba(250, 247, 240, .9);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.title-copy .subtitle { font-size: .78em; margin: .55rem 0 .7rem; }

.six {
  margin: 0;
  padding-left: 1.25em;
  columns: 2;
  column-gap: 1.6rem;
}
.six li {
  break-inside: avoid;
  margin: 0 0 .85rem;
  font-size: .95em;
  line-height: 1.55;
  color: var(--ink);
}

.controls {
  grid-column: 1 / -1;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(.5rem, 2vw, 2rem);
  padding: .45rem clamp(.5rem, 1.6vw, 1.4rem);
  border-top: 1px solid var(--line);
  background: #fffdf7;
}
.deck-identity { min-width: 0; display: flex; align-items: center; gap: .65rem; }
.deck-identity-mark {
  width: 4px;
  align-self: stretch;
  min-height: 38px;
  border-radius: 999px;
  background: var(--gold);
}
.deck-identity-copy { min-width: 0; display: grid; gap: .08rem; }
.deck-identity-copy strong, .deck-identity-copy span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.deck-identity-copy strong { font-size: clamp(.74rem, 1vw, .96rem); }
.deck-identity-copy span { color: var(--muted); font-size: clamp(.58rem, .8vw, .76rem); }
.page-controls { display: flex; align-items: center; gap: .4rem; }
.page-controls #pageInfo {
  min-width: 3.8rem;
  color: var(--muted);
  font: 650 .7rem/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  text-align: center;
}
.controls button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  padding: .42rem .65rem;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #1c2333;
  color: #f4efe3;
}
.sync-state { font-size: .85rem; color: var(--muted); margin-top: 1rem; }

@media (max-width: 900px) {
  .deck-shell,
  .deck-shell.toc-collapsed {
    grid-template-columns: minmax(0, 1fr);
  }
  .toc, #tocToggle { display: none; }
  .slide header,
  .split-layout,
  .split-layout.two-photo,
  .split-layout.preq-split,
  .compare-grid,
  .path-grid,
  .admit-grid,
  .split-layout.path-split {
    grid-template-columns: 1fr;
  }
  .admit-grid .span-2 { grid-column: auto; }
  .six { columns: 1; }
  .title-copy { max-width: calc(100% - 1.4rem); }
}

@media (max-width: 640px) {
  :root { --footer-h: 72px; }
  .slide { padding: .72rem; gap: .52rem; }
  .controls { gap: .35rem; padding: .45rem .5rem; }
  .nav-label { display: none; }
}