/* Ortivs v3 · mobile decision sequence. Everything is scoped to .mds and reads the v3 tokens with fallbacks,
   so the same file works inside v3 (tokens from :root) and in the standalone prototype.
   Type floor: nothing below 11px. No green: gold and cyan never mix translucently (gold sits on dark keylines). */
.mds{--m-bg:var(--bg,#05070b);--m-ink:var(--ink,#f4f1ea);--m-plat:var(--plat,#dbe4f2);--m-mute:var(--mute,#aab4c4);--m-dim:var(--dim,#8a95a8);
  --m-rule:rgba(219,228,242,.14);--m-gold:var(--gold,#e6c07b);--m-gold-hi:var(--gold-hi,#f6dca4);--m-cyan:var(--cyan,#46c8ff);--m-ice:#8fe8ff;
  --m-serif:var(--serif,"Fraunces",ui-serif,Georgia,serif);--m-sans:var(--sans,"Manrope",ui-sans-serif,Arial,sans-serif);--m-mono:var(--mono,"Plex Mono",ui-monospace,Menlo,monospace);
  --m-ease:cubic-bezier(.2,.7,.1,1);--m-pad:var(--pad,22px);--m-top:64px;
  --m-step:62vh;--m-orr:clamp(206px,31vh,286px);
  position:relative;color:var(--m-ink);font:400 16px/1.55 var(--m-sans)}
@supports (height:1svh){.mds{--m-step:62svh;--m-orr:clamp(206px,31svh,286px)}}
.mds *{box-sizing:border-box}
.mds-col{width:100%;max-width:460px;margin-left:auto;margin-right:auto;padding-left:var(--m-pad);padding-right:var(--m-pad)}

/* ---- the section head (in flow, before the pinned stage) ---- */
.mds-intro{padding-top:96px;padding-bottom:36px}
.mds-cl{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.mds-cl .n{font:500 11px/1 var(--m-mono);letter-spacing:.2em;color:var(--m-gold)}
.mds-cl i{width:28px;height:1px;background:rgba(219,228,242,.22)}
.mds-cl .t{font:500 11px/1 var(--m-mono);letter-spacing:.26em;text-transform:uppercase;color:var(--m-mute)}
.mds-intro h2{margin:0;font:300 clamp(36px,10.4vw,46px)/1.04 var(--m-serif);letter-spacing:-.022em;text-wrap:balance}
.mds-intro h2 em{font-style:italic}
.mds-intro p{margin:16px 0 0;font:400 15.5px/1.55 var(--m-sans);color:var(--m-mute);max-width:34ch}

/* ---- the pinned stage: one scroll step per state (track = 100svh + 8.6 steps; keep NSTEP/TAIL in module.js in sync) ---- */
.mds-track{position:relative;height:calc(100vh + 8.6 * var(--m-step))}
@supports (height:1svh){.mds-track{height:calc(100svh + 8.6 * var(--m-step))}}
.mds-snap{position:absolute;left:0;width:1px;height:1px;scroll-snap-align:start;pointer-events:none}
.mds-stage{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;flex-direction:column;padding-top:calc(var(--m-top) + 14px)}
@supports (height:1svh){.mds-stage{height:100svh}}
.mds-veil{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;background:radial-gradient(64% 30% at 50% var(--m-cy,34%),rgba(5,7,11,.25) 0%,rgba(5,7,11,.72) 62%,rgba(5,7,11,.9) 100%)}
.mds-shock{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;overflow:visible}

.mds-hd{position:relative;z-index:3;flex:none}
.mds-lb{display:flex;justify-content:space-between;gap:12px;font:500 11px/1.4 var(--m-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--m-mute)}
.mds-lb .mds-idx{color:var(--m-ink);letter-spacing:.14em}
.mds-q{margin:8px 0 0;font:300 19px/1.2 var(--m-serif);letter-spacing:-.01em;color:var(--m-ink);text-wrap:balance}

.mds-orw{position:relative;z-index:2;flex:none;height:var(--m-orr);margin:12px 0 4px}
.mds-hz{position:absolute;top:50%;height:1px;pointer-events:none;display:block}
.mds-hz.l{left:0;width:calc(50% - var(--m-orr) * .343);background:linear-gradient(90deg,rgba(50,170,250,0),rgba(50,170,250,.6) 45%,#32aafa);box-shadow:0 0 6px rgba(70,200,255,.45)}
.mds-hz.r,.mds-hz.f{right:0;left:calc(50% + var(--m-orr) * .343)}
.mds-hz.r{background:rgba(219,228,242,.14)}
.mds-hz.f{height:2px;top:calc(50% - .5px);transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#fff2cf,var(--m-gold) 7%,#f2f0ec 16%,#eaf6ff 22%,#9fe6ff 34%,var(--m-cyan) 60%,rgba(70,200,255,.15));box-shadow:0 0 10px rgba(70,200,255,.55)}
.mds-orr{position:absolute;left:50%;top:0;width:var(--m-orr);height:var(--m-orr);transform:translateX(-50%)}
.mds-orr svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.mds-n{position:absolute;transform:translate(-50%,-50%);font:500 11px/1 var(--m-mono);letter-spacing:.12em;color:var(--m-mute);text-shadow:0 0 3px #05070b,0 0 8px #05070b;transition:color .4s var(--m-ease);white-space:nowrap}
.mds-n.past{color:var(--m-plat)}
.mds-n.gate{transform:translate(-30%,-50%)}
.mds-n.cur{color:var(--m-cyan)}
.mds-n.gate{color:var(--m-gold)}
.mds-n.gate.cur{color:var(--m-gold-hi)}

/* the centre readout: number and name, or the hold statement (one tight block, no rule through it), or the decided B */
.mds-ro{position:absolute;left:50%;top:50%;width:calc(var(--m-orr) * .46);height:calc(var(--m-orr) * .56);transform:translate(-50%,-50%);pointer-events:none;text-align:center}
.mds-g{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .4s var(--m-ease) .3s}
.mds-g.off{opacity:0;transition-delay:0s;transition-duration:.24s}
.mds-num{font:300 calc(var(--m-orr) * .17)/.9 var(--m-serif);letter-spacing:-.04em;color:var(--m-ink);font-variant-numeric:lining-nums}
.mds-nm{margin-top:8px;font:italic 300 17px/1.1 var(--m-serif);color:var(--m-plat)}
.mds-g-st.gate .mds-num{color:var(--m-gold-hi)}
.mds-g-hold p{margin:0;font:300 16px/1.15 var(--m-serif);letter-spacing:-.005em;color:var(--m-ink);text-wrap:balance}
.mds-g-hold em{font-style:italic;color:var(--m-gold)}
.mds-g-dec .mds-num{color:var(--m-gold-hi);font-style:italic}
.mds-g-dec .mds-nm{color:var(--m-gold);white-space:nowrap;font-size:clamp(14px,calc(var(--m-orr) * .066),17px)}
.mds-sw{transition:opacity .2s var(--m-ease)}
.mds-sw.out{opacity:0;transition-duration:.15s}

/* the record: on its own dark ground, so the page's resting thread and the field never run through the text */
.mds-rec{position:relative;z-index:3;flex:1 1 auto;padding-top:12px;background:linear-gradient(180deg,rgba(5,7,11,0),rgba(5,7,11,.9) 20px,rgba(5,7,11,.95))}
.mds-rh{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap}
.mds-s{font:500 11px/1.3 var(--m-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--m-cyan)}
.mds-s.gold{color:var(--m-gold)}
.mds-tag{display:inline-flex;align-items:center;gap:8px;font:500 11px/1 var(--m-mono);letter-spacing:.16em;text-transform:uppercase;padding:6px 9px 5px;border:1px solid rgba(143,232,255,.42);color:var(--m-ice);white-space:nowrap;border-radius:1px}
.mds-tag.today{border-color:rgba(219,228,242,.34);color:var(--m-plat)}
.mds-tag.gold{border-color:rgba(230,192,123,.5);color:var(--m-gold)}
.mds-tag::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.85}
.mds-tag.direction::before{background:transparent;border:1px solid currentColor;width:4px;height:4px}
.mds-h{margin:8px 0 10px;font:italic 300 18px/1.25 var(--m-serif);color:var(--m-plat);text-wrap:pretty}
.mds dl{margin:0;display:grid;grid-template-columns:92px 1fr}
.mds dt,.mds dd{margin:0;padding:7px 0;border-top:1px solid var(--m-rule)}
.mds dt{font:500 11px/1.9 var(--m-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--m-dim)}
.mds dd{font:400 14px/1.45 var(--m-sans);color:var(--m-plat)}
.mds dd b{font-weight:600;color:var(--m-ink)}
.mds dd .u{font-family:var(--m-serif);font-style:italic;color:var(--m-mute)}
.mds-opts{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:8px}
.mds-opt{padding:10px 14px 11px;border:1px solid rgba(219,228,242,.22);font:400 14px/1.42 var(--m-sans);color:var(--m-plat);transition:border-color .4s var(--m-ease),background-color .4s var(--m-ease)}
.mds-opt b{display:block;font:400 18px/1.2 var(--m-serif);letter-spacing:-.005em;color:var(--m-ink);margin-bottom:2px}
.mds-opt .st{display:block;margin-top:5px;font:500 11px/1.3 var(--m-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--m-mute)}
.mds-opt.chosen{border-color:rgba(230,192,123,.62);background:rgba(230,192,123,.07)}
.mds-opt.chosen b{color:var(--m-gold-hi)}
.mds-opt.chosen .st{color:var(--m-gold)}
.mds-opt.not{border-style:dashed;border-color:rgba(219,228,242,.18);color:var(--m-mute)}
.mds-opt.not b{color:var(--m-mute)}
.mds-rcd{margin:8px 0 12px;font:300 19px/1.22 var(--m-serif);color:var(--m-ink);text-wrap:balance}
.mds-rcd b{font-weight:400;color:var(--m-gold-hi)}
.mds-await{color:var(--m-gold);white-space:nowrap}
.mds-await i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--m-gold);margin:0 7px 2px 1px;vertical-align:middle}

/* short screens (a phone with its browser bars): keep the record whole by dropping the secondary rows */
@media (max-height:760px){
  .mds{--m-orr:clamp(184px,28vh,236px)}
  .mds dt.o,.mds dd.o{display:none}
  .mds-q{font-size:18px}
  .mds-orw{margin:8px 0 2px}
  .mds-opts{gap:6px;margin-bottom:8px}
  .mds-opt{padding:8px 12px 9px}
  .mds-opt b{font-size:17px}
  .mds-rcd{font-size:18px;margin:6px 0 10px}
  .mds-h{margin:6px 0 8px}
}

/* ---- the complete static list: shown in reduced motion; in motion it stays in the page for screen readers ---- */
.mds-list{list-style:none;margin:0 auto;padding-top:8px;padding-bottom:40px;position:relative}
.mds:not(.mds-rm) .mds-list{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.mds.mds-rm .mds-track{display:none}
.mds-list::before{content:"";position:absolute;left:calc(var(--m-pad) + 4px);top:14px;bottom:48px;width:1px;background:linear-gradient(180deg,rgba(50,170,250,0),#32aafa 4%,#32aafa 90%,rgba(50,170,250,.15))}
.mds-li{position:relative;padding:0 0 44px 32px}
.mds-li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;border-radius:50%;background:var(--m-bg);border:1px solid var(--m-cyan);box-shadow:0 0 10px rgba(70,200,255,.55)}
.mds-li.dir::before{border-style:dashed;border-color:var(--m-ice);box-shadow:none}
.mds-li.gate::before{left:-5px;top:4px;width:19px;height:19px;border:1.5px solid var(--m-gold);box-shadow:0 0 14px rgba(230,192,123,.5),inset 0 0 0 3px var(--m-bg),inset 0 0 0 5px rgba(230,192,123,.8)}
.mds-li .hd{display:flex;align-items:baseline;gap:8px 12px;flex-wrap:wrap;margin-bottom:6px}
.mds-li .k{font:500 11px/1 var(--m-mono);letter-spacing:.2em;color:var(--m-dim)}
.mds-li h3{margin:0;font:300 28px/1.1 var(--m-serif);letter-spacing:-.02em;color:var(--m-ink)}
.mds-li.gate h3{color:var(--m-gold-hi)}
.mds-li .one{margin:6px 0 12px;font:italic 300 18px/1.3 var(--m-serif);color:var(--m-plat)}
.mds-holdst{margin:16px 0 12px;padding:14px 0;border-top:1px solid rgba(230,192,123,.45);border-bottom:1px solid rgba(230,192,123,.45);font:300 22px/1.15 var(--m-serif);color:var(--m-ink);text-wrap:balance}
.mds-holdst em{font-style:italic;color:var(--m-gold)}
.mds-li .mds-rcd{margin-top:4px}