/* ZORO OS deck — technical document system, 1920x1080 artboard, 1rem = 10px at full frame */

:root {
  --ground: #F5F5F2;
  --paper: #FBFBF9;
  --ink: #171717;
  --body: #484844;
  --sec: #74746E;
  --hair: #D7D7D0;
  --grid: #E8E8E3;
  --dark: #1C1C1B;
  --darksec: #AFAFA7;
  --darkink: #F5F5F2;
  --terra: #B64B2A;
  --terratint: rgba(182, 75, 42, 0.08);
  --mono: "SFMono-Regular", ui-monospace, "SF Mono", "Roboto Mono", Menlo, Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "Inter", "Helvetica Neue", Arial, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; }

html { font-size: min(calc(100vw / 192), calc(100vh / 108)); }
body {
  background: var(--dark);
  color: var(--ink);
  font-family: var(--sans);
  width: 100vw; height: 100vh; overflow: hidden;
  display: grid; place-items: center;
  -webkit-font-smoothing: antialiased;
  cursor: default;
}

.deck { position: relative; width: 192rem; height: 108rem; }

.page {
  position: absolute; inset: 0;
  background: var(--ground);
  opacity: 0; visibility: hidden;
  overflow: hidden;
}
.page.active { opacity: 1; visibility: visible; }
.deck.ready .page { transition: opacity .15s linear; }
@media (prefers-reduced-motion: reduce) { .deck.ready .page { transition: none; } }

/* ---------- masthead (64px) ---------- */

.mast {
  position: absolute; top: 0; left: 0; right: 0; height: 6.4rem;
  background: var(--dark); color: var(--darkink);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 6rem;
}
.mast .l { display: flex; align-items: center; gap: 1.4rem; }
.mark { width: 1.1rem; height: 1.1rem; background: var(--terra); display: inline-block; }
.mo {
  font-family: var(--mono); font-size: 1.3rem; line-height: 1.7rem;
  letter-spacing: .08em; font-weight: 600;
}
.mast .mo { color: var(--darkink); }
.mast .r { display: flex; align-items: center; gap: 3.2rem; }
.mast .live { color: var(--darksec); }
.mast .pn { color: var(--darkink); }

/* ---------- shared page header (y96..208) ---------- */

.phead {
  position: absolute; top: 9.6rem; left: 6rem; right: 6rem;
  display: grid; grid-template-columns: minmax(0, 1fr) 60rem; column-gap: 4.8rem;
  align-items: start;
}
.ov { font-family: var(--mono); font-size: 1.3rem; line-height: 1.7rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
.phead h2 { font-size: 4.2rem; line-height: 4.6rem; font-weight: 620; letter-spacing: -.02em; color: var(--ink); margin-top: 1.2rem; }
.intro { font-size: 1.8rem; line-height: 2.7rem; color: var(--body); max-width: 58ch; }

/* ---------- figure panels ---------- */

.fig {
  position: absolute;
  background: var(--paper);
  border: 1px solid var(--hair); border-radius: .4rem;
}
.fig > svg { display: block; width: 100%; height: auto; }
.figfoot {
  position: absolute; left: 0; right: 0; bottom: 0;
  display: flex; justify-content: flex-start; align-items: baseline; gap: 3.2rem;
  padding: 1rem 1.6rem 1.1rem;
  border-top: 1px solid var(--grid);
}
.figcap { font-family: var(--mono); font-size: 1.3rem; line-height: 1.8rem; letter-spacing: .08em; color: var(--ink); font-weight: 600; white-space: nowrap; }
.figcap .s {
  font-family: var(--sans); font-size: 1.35rem; letter-spacing: 0; font-weight: 400;
  color: var(--sec); text-transform: none; margin-left: 1.2rem;
}

/* svg text */
svg text { font-family: var(--sans); }
svg .tm { font-family: var(--mono); letter-spacing: .08em; }

/* ---------- dark rows / cells ---------- */

.cells {
  position: absolute;
  background: var(--dark); border-radius: .4rem;
  display: grid;
}
.cells .cell { padding: 2rem 2.4rem; border-left: 1px solid rgba(245, 245, 242, .14); min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.cells .cell:first-child { border-left: 0; }
.cell .ct { font-family: var(--mono); font-size: 1.35rem; line-height: 1.9rem; letter-spacing: .08em; font-weight: 600; color: var(--darkink); }
.cell p { font-size: 1.4rem; line-height: 2rem; color: var(--darksec); margin-top: .8rem; }

/* ---------- registers (bordered mono tables) ---------- */

.reg { border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper); }
.reg .rh {
  font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--ink);
  padding: 1rem 1.4rem .8rem; border-bottom: 1px solid var(--grid);
}
.reg .rr {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; color: var(--body);
  padding: .45rem 1.4rem; border-bottom: 1px solid var(--grid);
}
.reg .rr:last-child { border-bottom: 0; }
.reg .rr.tot { color: var(--ink); font-weight: 600; border-top: 1px solid var(--ink); }

/* ---------- before -> after pairs ---------- */

.pair { display: flex; align-items: baseline; gap: 1.6rem; }
.pair .from { font-size: 4.2rem; line-height: 4.2rem; font-weight: 620; letter-spacing: -.02em; color: var(--sec); }
.pair .arr { font-size: 3rem; color: var(--sec); }
.pair .to { font-size: 7.2rem; line-height: 7.2rem; font-weight: 620; letter-spacing: -.02em; color: var(--ink); }
.pair .u, .pair .fu { font-family: var(--mono); font-size: 1.4rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
.delta { margin-top: 1.8rem; font-family: var(--mono); font-size: 1.4rem; letter-spacing: .08em; font-weight: 600; color: var(--terra); }

/* ================= PAGE 1 ================= */

#p1 .band { position: absolute; top: 0; left: 0; right: 0; height: 40.8rem; background: var(--dark); }
#p1 .mast { background: transparent; border-bottom: 1px solid rgba(245, 245, 242, .14); }
#p1 .title {
  position: absolute; top: 10.8rem; left: 6rem; width: 118rem;
  font-size: 7.6rem; line-height: 7.8rem; font-weight: 620; letter-spacing: -.02em; color: var(--darkink);
}
#p1 .lede {
  position: absolute; top: 27.8rem; left: 6rem; width: 140rem;
  font-size: 1.8rem; line-height: 2.7rem; color: var(--darksec);
}
#p1 .meta {
  position: absolute; top: 35.4rem; left: 6rem; right: 6rem;
  display: flex; align-items: baseline;
  font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--darksec);
}
#p1 .meta span { padding: 0 2.4rem; border-left: 1px solid rgba(245, 245, 242, .22); }
#p1 .meta span:first-child { padding-left: 0; border-left: 0; }

#p1 .target { position: absolute; left: 6rem; right: 6rem; top: 43.2rem; height: 11.6rem; }
#p1 .target .th { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
#p1 .target .tg { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 1.2rem; }
#p1 .target .tc { border-left: 1px solid var(--hair); padding: 0 2.4rem; }
#p1 .target .tc:first-child { border-left: 0; padding-left: 0; }
#p1 .target .tn { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
#p1 .target .tc.money .tn { color: var(--terra); }
#p1 .target .tc p { font-size: 2.4rem; line-height: 3rem; font-weight: 620; letter-spacing: -.015em; color: var(--ink); margin-top: .7rem; }

#p1 .lcol {
  position: absolute; left: 6rem; top: 57.2rem; width: 58.4rem; bottom: 5.2rem;
  display: flex; flex-direction: column;
}
#p1 .lcol h3 { font-size: 3.2rem; line-height: 3.6rem; font-weight: 620; letter-spacing: -.02em; color: var(--ink); margin-top: 1.2rem; }
#p1 .lcol .b { font-size: 1.6rem; line-height: 2.4rem; color: var(--body); margin-top: 1.4rem; }
#p1 .lcol .reg { margin-top: 1.6rem; }
#p1 .note { font-size: 1.4rem; line-height: 2rem; color: var(--sec); margin-top: auto; padding-top: 1.4rem; }

#p1 .fig { left: 66.8rem; top: 57.2rem; width: 119.2rem; height: 45.6rem; }

/* ================= PAGE 2 ================= */

#p2 .rail { position: absolute; left: 6rem; top: 23.2rem; width: 43.2rem; height: 59.6rem; display: flex; flex-direction: column; }
#p2 .rail .rt { font-family: var(--mono); font-size: 1.3rem; line-height: 1.8rem; letter-spacing: .08em; font-weight: 600; color: var(--ink); }
#p2 .rail .fline { font-size: 1.4rem; line-height: 2.1rem; color: var(--body); margin-top: 1rem; padding-bottom: 1.4rem; border-bottom: 1px solid var(--hair); }
#p2 .rail .reg { margin-top: 1.6rem; }
#p2 .rail .reg .rr { padding: .5rem 1.4rem; }
#p2 .rail .exp { font-size: 1.4rem; line-height: 2.1rem; color: var(--body); margin-top: 1.8rem; }

#p2 .fig { left: 51.6rem; top: 23.2rem; width: 134.4rem; height: 59.6rem; }
#p2 .cells { left: 6rem; top: 85.2rem; width: 180rem; height: 17.6rem; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }

/* ================= PAGE 3 ================= */

.page-old { display: none !important; }

#p3 .case-top {
  position: absolute; left: 6rem; top: 23.2rem; width: 180rem; height: 11.2rem;
  display: grid; grid-template-columns: 1fr 1fr 1fr 1.35fr;
  border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper);
}
#p3 .case-top > div { padding: 1.7rem 2.4rem; border-left: 1px solid var(--grid); display: flex; align-items: baseline; gap: 1rem; position: relative; }
#p3 .case-top > div:first-child { border-left: 0; }
#p3 .case-label { position: absolute; top: 1.3rem; left: 2.4rem; font-family: var(--mono); font-size: 1.15rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
#p3 .case-top b { margin-top: 2rem; font-size: 4.4rem; line-height: 4.8rem; letter-spacing: -.03em; color: var(--ink); }
#p3 .case-top small { margin-top: 3.3rem; font-family: var(--mono); font-size: 1.2rem; color: var(--sec); }
#p3 .case-top .case-risk { display: block; background: rgba(182,75,42,.055); }
#p3 .case-risk p { margin-top: 3.1rem; max-width: 34rem; font-size: 1.7rem; line-height: 2.3rem; font-weight: 620; color: var(--ink); }

#p3 .case-main {
  position: absolute; left: 6rem; top: 36.8rem; width: 180rem; height: 48rem;
  display: grid; grid-template-columns: 58rem 1fr; gap: 2.4rem;
}
#p3 .case-drag, #p3 .case-build { border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper); padding: 2.4rem 2.8rem; min-width: 0; }
#p3 .case-section-label { font-family: var(--mono); font-size: 1.25rem; letter-spacing: .08em; font-weight: 600; color: var(--ink); }
#p3 .case-big { margin-top: 1.8rem; font-size: 9rem; line-height: 9rem; letter-spacing: -.04em; font-weight: 620; color: var(--terra); }
#p3 .case-big-note { max-width: 48rem; margin-top: .8rem; font-size: 1.5rem; line-height: 2.2rem; color: var(--body); }
#p3 .drag-list { margin-top: 2.2rem; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--hair); }
#p3 .drag-list span { min-height: 6rem; padding: 1.3rem 1.2rem 1.3rem 2.2rem; border-bottom: 1px solid var(--grid); font-size: 1.35rem; line-height: 1.9rem; color: var(--ink); position: relative; }
#p3 .drag-list span:nth-child(odd) { border-right: 1px solid var(--grid); }
#p3 .drag-list span::before { content: ''; position: absolute; left: .2rem; top: 1.9rem; width: .7rem; height: .7rem; background: var(--terra); }

#p3 .build-grid { margin-top: 1.8rem; height: 39rem; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); border: 1px solid var(--hair); border-radius: .3rem; overflow: hidden; }
#p3 .build-grid article { padding: 1.8rem 2rem; border-left: 1px solid var(--grid); border-top: 1px solid var(--grid); display: grid; grid-template-columns: 3rem 1fr; column-gap: 1.2rem; align-content: center; }
#p3 .build-grid article:nth-child(odd) { border-left: 0; }
#p3 .build-grid article:nth-child(-n+2) { border-top: 0; }
#p3 .build-grid article > span { grid-row: 1 / 3; font-family: var(--mono); font-size: 1.2rem; color: var(--terra); font-weight: 600; }
#p3 .build-grid article b { font-size: 1.65rem; line-height: 2rem; color: var(--ink); }
#p3 .build-grid article p { margin-top: .6rem; font-size: 1.3rem; line-height: 1.85rem; color: var(--body); }

#p3 .case-results {
  position: absolute; left: 6rem; top: 87.2rem; width: 180rem; height: 15.6rem;
  display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: 10rem 5.6rem;
  background: var(--dark); border-radius: .4rem; color: var(--darkink); overflow: hidden;
}
#p3 .case-results > div { padding: 2rem 2.4rem; border-left: 1px solid rgba(245,245,242,.15); display: flex; flex-direction: column; justify-content: center; }
#p3 .case-results > div:first-child { border-left: 0; }
#p3 .case-results span { font-family: var(--mono); font-size: 1.15rem; letter-spacing: .08em; font-weight: 600; color: var(--darksec); }
#p3 .case-results b { margin-top: .8rem; font-size: 2.8rem; line-height: 3.2rem; letter-spacing: -.015em; color: var(--darkink); }
#p3 .case-results p { grid-column: 1 / -1; border-top: 1px solid rgba(245,245,242,.15); padding: 1.6rem 2.4rem; font-size: 1.6rem; line-height: 2.2rem; font-weight: 620; color: var(--darkink); }

#p3 .sum {
  position: absolute; left: 6rem; top: 23.2rem; width: 180rem; height: 7.2rem;
  display: grid; grid-template-columns: 1fr 1fr 1fr;
  border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper);
}
#p3 .sum .sc { padding: 1.1rem 2rem; border-left: 1px solid var(--grid); display: flex; flex-direction: column; justify-content: center; gap: .5rem; }
#p3 .sum .sc:first-child { border-left: 0; }
#p3 .sum .sl { font-family: var(--mono); font-size: 1.2rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
#p3 .sum .sv { font-family: var(--mono); font-size: 1.45rem; letter-spacing: .06em; font-weight: 600; color: var(--ink); white-space: nowrap; }
#p3 .sum .sc.open .sv { color: var(--terra); }

#p3 .fig { left: 6rem; top: 32.8rem; width: 180rem; height: 51.2rem; }
#p3 .figfoot { padding: .5rem 1.6rem .5rem; }
#p3 .out { left: 6rem; top: 86.4rem; width: 180rem; height: 16.4rem; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 1fr auto; }
#p3 .out .cell { padding: 1.6rem 2.4rem; }
#p3 .out .strip {
  grid-column: 1 / -1;
  border-top: 1px solid rgba(245, 245, 242, .14);
  padding: .9rem 2.4rem;
  font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--darksec);
}

/* ================= PAGE 4 ================= */

#p4 .charts {
  position: absolute; left: 6rem; top: 24rem; width: 180rem; height: 54.4rem;
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2.4rem;
}
.chart {
  background: var(--paper); border: 1px solid var(--hair); border-radius: .3rem;
  padding: 2.4rem 2.8rem 2rem; display: flex; flex-direction: column; min-width: 0;
}
.chart .ct { font-family: var(--mono); font-size: 1.3rem; line-height: 1.8rem; letter-spacing: .08em; font-weight: 600; color: var(--ink); }
.chart .mid { margin: 1.8rem 0 0; }
.chart .viz { flex: 1; min-height: 0; display: flex; align-items: center; margin-top: 1.4rem; }
.chart .viz svg { display: block; width: 100%; height: auto; }
.rcpt {
  display: flex; align-items: center; gap: 1.2rem;
  border: 1px solid var(--hair); border-radius: .3rem; background: var(--ground);
  padding: 1rem 1.4rem; margin-top: 1.4rem;
  font-family: var(--mono); font-size: 1.2rem; line-height: 1.6rem;
  letter-spacing: .06em; font-weight: 600; color: var(--ink); white-space: nowrap;
}
.rcpt .rq { width: .8rem; height: .8rem; background: var(--terra); flex: none; }
.rcpt .rr { margin-left: auto; color: var(--sec); }
.chart .def { margin-top: 1.4rem; padding-top: 1.4rem; font-size: 1.4rem; line-height: 2rem; color: var(--sec); border-top: 1px solid var(--grid); }

#p4 .cells { left: 6rem; top: 80.8rem; width: 180rem; height: 14.2rem; grid-template-columns: 1fr 1fr 1fr 1fr; }
#p4 .cells .cell { padding: 1.8rem 2.4rem; }
#p4 .method {
  position: absolute; left: 6rem; top: 97.2rem; width: 180rem; height: 5.6rem;
  border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper);
  padding: 0 2rem; display: flex; gap: 2.4rem; align-items: center;
}
#p4 .method .mh { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--ink); white-space: nowrap; }
#p4 .method p { font-size: 1.4rem; line-height: 2rem; color: var(--body); }

/* ================= PAGE 5 ================= */

#p5 .lcol { position: absolute; left: 6rem; top: 23.2rem; width: 73.6rem; height: 68rem; display: flex; flex-direction: column; }
#p5 .hh { font-family: var(--mono); font-size: 1.3rem; line-height: 1.8rem; letter-spacing: .08em; font-weight: 600; color: var(--ink); }
#p5 .lead { margin-top: 2.6rem; }
#p5 .lead .pair .from { font-size: 4.4rem; line-height: 4.4rem; }
#p5 .lead .pair .to { font-size: 7.6rem; line-height: 7.6rem; }
#p5 .lead p { font-size: 1.5rem; line-height: 2.2rem; color: var(--body); margin-top: 1.8rem; max-width: 58ch; }
#p5 .cont { margin-top: 2.6rem; border-top: 1px solid var(--hair); padding-top: 1.4rem; display: flex; gap: 2.4rem; align-items: baseline; }
#p5 .cont .ch { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); white-space: nowrap; }
#p5 .cont p { font-size: 1.45rem; line-height: 2.1rem; color: var(--body); }
#p5 .rules { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.8rem; margin-top: 2.6rem; flex: 1; }
#p5 .rule { border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper); padding: 1.8rem 1.9rem 2rem; }
#p5 .rule .rn { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .06em; font-weight: 600; color: var(--ink); padding-bottom: 1rem; border-bottom: 1px solid var(--grid); }
#p5 .rule .rk { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--ink); margin-top: 1.3rem; }
#p5 .rule .rk.h { color: var(--terra); }
#p5 .rule p { font-size: 1.35rem; line-height: 1.95rem; color: var(--body); margin-top: .4rem; }
#p5 .fig { left: 82rem; top: 23.2rem; width: 104rem; height: 68rem; }
#p5 .ltest {
  position: absolute; left: 6rem; right: 6rem; top: 94.4rem; height: 8.4rem;
  border: 1px solid var(--hair); border-radius: .3rem; background: var(--paper);
  padding: 0 2.4rem; display: flex; gap: 2.8rem; align-items: center;
}
#p5 .ltest .lh { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); white-space: nowrap; }
#p5 .ltest p { font-size: 1.8rem; line-height: 2.6rem; font-weight: 620; letter-spacing: -.01em; color: var(--ink); }

/* ================= PAGE 6 ================= */

#p6 .diagnostic {
  position: absolute; left: 6rem; top: 23.2rem; width: 180rem; height: 61.6rem;
  display: grid; grid-template-columns: minmax(0, 1fr) 53.6rem; gap: 2.4rem;
}
#p6 .question-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 2.4rem; }
#p6 .question-card { background: var(--paper); border: 1px solid var(--hair); border-top: 2px solid var(--ink); border-radius: .3rem; padding: 2.2rem 2.6rem; }
#p6 .question-label { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--sec); }
#p6 .question-card p { display: grid; grid-template-columns: 3.2rem 1fr; gap: 1.2rem; font-size: 1.8rem; line-height: 2.55rem; color: var(--ink); margin-top: 2rem; }
#p6 .question-card p + p { border-top: 1px solid var(--grid); padding-top: 1.8rem; }
#p6 .question-card p span { font-family: var(--mono); font-size: 1.2rem; letter-spacing: .06em; color: var(--terra); font-weight: 600; padding-top: .2rem; }

#p6 .diagnostic-output { background: var(--dark); border-radius: .4rem; padding: 3.2rem; color: var(--darkink); display: flex; flex-direction: column; }
#p6 .output-label { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--terra); }
#p6 .diagnostic-output h3 { font-size: 3.6rem; line-height: 4.2rem; font-weight: 620; letter-spacing: -.02em; margin-top: 2rem; }
#p6 .diagnostic-output > p { font-size: 1.55rem; line-height: 2.35rem; color: var(--darksec); margin-top: 1.5rem; }
#p6 .diagnostic-output ol { list-style: none; margin-top: 2.4rem; border-top: 1px solid rgba(245, 245, 242, .16); }
#p6 .diagnostic-output li { display: grid; grid-template-columns: 3.2rem 1fr; gap: 1.2rem; padding: 1.3rem 0; border-bottom: 1px solid rgba(245, 245, 242, .16); font-size: 1.45rem; line-height: 2rem; color: var(--darkink); }
#p6 .diagnostic-output li span { font-family: var(--mono); font-size: 1.15rem; letter-spacing: .06em; color: var(--darksec); }
#p6 .output-path { margin-top: auto; display: grid; grid-template-columns: 1fr auto 1fr; gap: 1.2rem; align-items: center; border: 1px solid rgba(245, 245, 242, .2); border-radius: .3rem; padding: 1.4rem; }
#p6 .output-path span { font-family: var(--mono); font-size: 1.05rem; line-height: 1.5rem; letter-spacing: .07em; font-weight: 600; color: var(--darksec); }
#p6 .output-path span:last-child { color: var(--darkink); text-align: right; }
#p6 .output-path b { color: var(--terra); font-size: 1.8rem; }

#p6 .closeband {
  position: absolute; left: 6rem; top: 87.2rem; width: 180rem; height: 15.6rem;
  background: var(--dark); border-radius: .4rem;
  padding: 0 3.2rem; display: flex; flex-direction: column; justify-content: center;
}
#p6 .closeband .big { font-size: 2.8rem; line-height: 3.6rem; font-weight: 620; letter-spacing: -.015em; color: var(--darkink); }
#p6 .closeband .cta { font-family: var(--mono); font-size: 1.3rem; letter-spacing: .08em; font-weight: 600; color: var(--darksec); margin-top: 1.4rem; }

/* ---------- print / pdf ---------- */

@page { size: 1920px 1080px; margin: 0; }
@media print {
  html { font-size: 10px; }
  body { width: auto; height: auto; overflow: visible; display: block; background: #fff; }
  .deck { width: 1920px; height: auto; }
  .page {
    position: relative; inset: auto;
    width: 1920px; height: 1080px;
    opacity: 1; visibility: visible;
    page-break-after: always; break-inside: avoid;
  }
}