/* deck.css — the eleven-slide pitch, printed on the same stock as the traders.
   Scroll-snap on a big screen, plain flow on a phone. */

body{overflow-x:hidden}
.bar{position:sticky;top:0;z-index:60;background:var(--paper)}

.deck{scroll-snap-type:y proximity}
.deck section{min-height:calc(100svh - 62px);display:flex;flex-direction:column;
  justify-content:center;scroll-snap-align:start;padding:56px clamp(18px,5vw,40px) 72px;
  max-width:760px;margin:0 auto;position:relative;border-bottom:2px dashed var(--ink)}
.deck section:last-child{border-bottom:0}

.n{position:absolute;top:22px;right:clamp(18px,5vw,40px);font-size:10px;letter-spacing:.2em;
  color:var(--ink-soft);font-weight:700}
h1{font-size:clamp(44px,11vw,84px);line-height:.9;letter-spacing:-.045em}
h2{font-size:clamp(28px,6.6vw,50px);line-height:1;letter-spacing:-.035em;margin-bottom:18px}
.deck p{font-size:16px;line-height:1.62;margin:12px 0;max-width:52ch;color:var(--ink-soft)}
.deck p b{color:var(--ink);font-weight:800}
.big{font-size:clamp(19px,4.6vw,26px);line-height:1.35;color:var(--ink);font-weight:800}
.g{color:var(--good)} .r{color:var(--bad)} .a{color:var(--warn)} .mut{color:var(--ink-soft)}
.hint{position:absolute;bottom:26px;left:clamp(18px,5vw,40px);font-size:10px;letter-spacing:.3em;
  color:var(--ink-soft)}
.deck a{color:var(--ink);text-decoration:none;border-bottom:2px solid var(--accent)}

/* the order ticket, as a plate */
.ticket{border:3px solid var(--ink);background:var(--plate);padding:18px;margin:20px 0;
  position:relative;overflow-x:auto}
.ticket::before{content:"";position:absolute;left:0;top:0;bottom:0;width:9px;
  background-image:radial-gradient(circle,var(--paper) 2.6px,transparent 3px);
  background-size:9px 16px;background-repeat:repeat-y;border-right:2px solid var(--ink)}
.ticket h3{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;margin:0 0 12px 16px}
.ticket table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:13px;
  margin-left:16px}
.ticket th{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;text-align:left;
  border-bottom:3px solid var(--ink);padding:4px 8px 6px 0;color:var(--ink-soft)}
.ticket td{border-bottom:1px solid var(--sunk);padding:8px 8px 8px 0;line-height:1.45}
.ticket tr:last-child td{border-bottom:none}
.rt{text-align:right}
.dot{display:inline-block;width:10px;height:10px;margin-right:7px;border:2px solid var(--ink)}

/* archetypes */
.arch{border:2px solid var(--ink);background:var(--plate);padding:14px 16px;margin:9px 0}
.arch b{display:block;font-size:14px;letter-spacing:.04em;margin-bottom:4px;font-weight:800}
.arch span{font-size:13px;color:var(--ink-soft);line-height:1.5;display:block}

/* the two-up stat block */
.stats{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--ink);
  border:3px solid var(--ink);margin:22px 0}
.stats div{background:var(--paper);padding:16px 14px}
.stats b{display:block;font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;
  letter-spacing:-.03em}
.stats span{font-size:9px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft);
  display:block;margin-top:6px}

@media (max-width:640px){
  .deck{scroll-snap-type:none}
  .deck section{min-height:auto;padding:44px 18px 56px}
  .stats{grid-template-columns:1fr}
  .hint{display:none}
}