:root{
  --ivory:#f1ecdf;
  --cream:#e9e2d0;
  --paperline:rgba(40,34,26,.16);
  --ink:#28221a;
  --smoke:#6e6557;
  --bronze:#9c7c44;
  --bronze-l:#c9a86a;
  --wine:#762c26;
  --wine-l:#c96a5c;
  --night:#14110c;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--night);
  color:var(--ivory);
  font-family:'Newsreader',Georgia,serif;
  font-size:18px;
  line-height:1.8;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--wine-l)}

/* ════════ THE MOUNTAIN — persistent page background ════════ */
#bgMap{position:fixed;inset:0;z-index:0}
#bgMap canvas{outline:none}
#bgFallback{position:fixed;inset:0;z-index:0;display:none;background-size:cover;background-position:center;filter:sepia(.3) brightness(.75) contrast(1.05)}
#bgFallback.on{display:block}
#bgVeil{position:fixed;inset:0;z-index:1;pointer-events:none;background:
  radial-gradient(ellipse 120% 90% at 50% 40%,transparent 40%,rgba(20,17,12,.34) 100%),
  linear-gradient(180deg,rgba(20,17,12,.28) 0%,transparent 18%,transparent 82%,rgba(20,17,12,.4) 100%)}
#bgLoad{position:fixed;inset:0;z-index:2;background:var(--night);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1.4rem;transition:opacity 1.2s ease;pointer-events:none}
#bgLoad.off{opacity:0}
#bgLoad .bl-t{font-family:'Fraunces',serif;font-weight:500;font-size:1.6rem;color:var(--ivory);font-style:italic}
#bgLoad .bl-s{font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.5em;text-transform:uppercase;color:rgba(241,236,223,.8)}
#bgLoad .bl-line{width:1px;height:46px;background:var(--bronze);animation:drop 2.2s ease-in-out infinite}

/* film grain over everything */
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.85 0 0 0 0 0.8 0 0 0 0 0.68 0 0 0 0.65 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

main{position:relative;z-index:3}

/* ════════ MICRO TYPE ════════ */
.eyebrow,.rail .lbl,.alti,.cue,figure.photo figcaption,.kick,.cc-role,.footer,.m3d-hud .h-sub,.m3d-hud .h-alt,.m3d-legend span,.m3d-note{font-family:'Jost',sans-serif}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:400;letter-spacing:.5em;text-transform:uppercase;color:rgba(241,236,223,.8)}

/* ════════ FIXED CHROME ════════ */
#progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--bronze-l);z-index:10001;transition:width .1s linear}
.rail{position:fixed;left:1.6rem;top:50%;transform:translateY(-50%);z-index:10000;display:flex;flex-direction:column;gap:1.05rem}
.rail a{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:rgba(241,236,223,.6);transition:.3s}
.rail a .dot{width:6px;height:6px;border-radius:50%;border:1px solid rgba(241,236,223,.6);flex:none;transition:.3s}
.rail a .lbl{font-size:.72rem;font-weight:400;letter-spacing:.32em;text-transform:uppercase;opacity:0;transform:translateX(-6px);transition:.3s;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.9),0 1px 8px rgba(0,0,0,.7)}
.rail a:hover .lbl{opacity:1;transform:none}
.rail a.on{color:#f1ecdf}
.rail a.on .dot{background:#f1ecdf;border-color:#f1ecdf}

.alti{position:fixed;right:1.8rem;top:50%;transform:translateY(-50%);z-index:10000;text-align:right;color:rgba(241,236,223,.92);pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.9),0 1px 14px rgba(0,0,0,.75)}
.alti .alti-cap{font-size:.7rem;letter-spacing:.42em;text-transform:uppercase;font-weight:400;opacity:.8}
.alti .alti-ft{font-family:'Jost',sans-serif;font-size:1.9rem;font-weight:600;color:var(--ivory);line-height:1.2;font-variant-numeric:tabular-nums;letter-spacing:.05em}
.alti .alti-m{font-size:.74rem;letter-spacing:.14em;opacity:.7;font-variant-numeric:tabular-nums}
.alti .alti-bar{margin-left:auto;margin-top:.65rem;width:1px;height:110px;background:rgba(241,236,223,.25);position:relative}
.alti .alti-fill{position:absolute;bottom:0;left:0;width:100%;height:0;background:var(--bronze-l)}
.alti.danger .alti-ft{color:var(--wine-l)}

/* ════════ PROLOGUE — type over the mountain ════════ */
.prologue{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:9rem 1.6rem 6rem}
.prologue .eyebrow{opacity:0;animation:fu 1.2s .6s forwards}
.prologue h1{margin-top:2rem;font-family:'Fraunces',serif;font-weight:600;font-size:clamp(2.9rem,8.2vw,6.8rem);line-height:1.04;letter-spacing:-.012em;color:var(--ivory);text-shadow:0 4px 44px rgba(0,0,0,.75);opacity:0;animation:fu 1.4s .9s forwards}
.prologue h1 em{font-style:italic;font-weight:480}
.prologue .rule{width:1px;height:64px;background:rgba(241,236,223,.4);margin:2.6rem auto 2.2rem;opacity:0;animation:fu 1.2s 1.3s forwards}
.prologue .sub{max-width:540px;font-style:italic;font-weight:380;font-size:1.05rem;color:rgba(241,236,223,.85);text-shadow:0 2px 16px rgba(0,0,0,.7);opacity:0;animation:fu 1.3s 1.5s forwards}
.stats{display:flex;flex-wrap:wrap;justify-content:center;gap:0 4.5rem;margin:4rem auto 0}
.stat{padding:1.2rem 0;text-align:center;opacity:0;animation:fu 1.3s 1.9s forwards}
.stat b{display:block;font-family:'Fraunces',serif;font-weight:500;font-size:clamp(2.6rem,5vw,4rem);line-height:1;color:var(--ivory);text-shadow:0 3px 28px rgba(0,0,0,.75)}
.stat span{display:block;margin-top:.6rem;font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;color:rgba(241,236,223,.75)}
.stat.loss b{color:var(--wine-l)}
.cue{margin-top:4.5rem;font-size:.74rem;letter-spacing:.5em;text-transform:uppercase;color:rgba(241,236,223,.7);opacity:0;animation:fu 1.3s 2.3s forwards}
.cue .line{width:1px;height:52px;margin:.9rem auto 0;background:var(--bronze-l);animation:drop 2.4s ease-in-out infinite}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@keyframes fu{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* ════════ CHAPTER COVERS — type on terrain ════════ */
.ch-cover{position:relative;min-height:100vh;display:flex;align-items:flex-end;padding:0 clamp(1.4rem,9vw,9rem) 16vh}
.ch-cover::before{content:attr(data-n);position:absolute;top:6vh;right:5vw;font-family:'Fraunces',serif;font-weight:400;font-size:clamp(10rem,26vw,22rem);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(201,168,106,.5);opacity:0;transform:translateY(30px);transition:1.2s .1s;text-shadow:none;pointer-events:none}
.ch-cover .inner{max-width:640px}
.ch-cover .num{font-family:'Jost',sans-serif;font-size:.78rem;font-weight:400;letter-spacing:.5em;text-transform:uppercase;color:rgba(241,236,223,.78);display:block;margin-bottom:1.4rem;opacity:0;transform:translateY(18px);transition:1s .2s;text-shadow:0 1px 10px rgba(0,0,0,.8)}
.ch-cover h2{font-family:'Fraunces',serif;font-size:clamp(2.6rem,6vw,5.1rem);font-weight:500;line-height:1.05;letter-spacing:-.01em;color:var(--ivory);text-shadow:0 4px 40px rgba(0,0,0,.8);opacity:0;transform:translateY(24px);transition:1.1s .35s}
.ch-cover .dek{margin-top:1.6rem;max-width:480px;font-style:italic;font-weight:380;color:rgba(241,236,223,.88);font-size:1.02rem;text-shadow:0 2px 14px rgba(0,0,0,.75);opacity:0;transform:translateY(24px);transition:1.1s .55s}
.ch-cover.on::before{opacity:1;transform:none}
.ch-cover.on .num,.ch-cover.on h2,.ch-cover.on .dek{opacity:1;transform:none}

/* ════════ PAPER PANELS — content sheets over the mountain ════════ */
.panel-wrap{padding:10vh clamp(1rem,6vw,6rem) 14vh;display:flex;justify-content:center}
/* Card surfaces (2026-07-24): the color-blend layer moved to ::before and a
   normal-blend veil added on ::after, so the terrain still ghosts through
   desaturated — but text now paints at full ink instead of inheriting the
   backdrop's luminance, which is what made it hard to read. */
.panel{width:min(760px,100%);position:relative;color:var(--ink);border:1px solid var(--paperline);border-top:2px solid var(--bronze);box-shadow:0 30px 80px rgba(10,8,5,.55)}
.panel::before{content:'';position:absolute;inset:0;z-index:-2;background:rgb(255 255 255 / 92%);mix-blend-mode:color}
.panel::after{content:'';position:absolute;inset:0;z-index:-1;background:rgb(250 247 240 / 60%)}
.panel .narrative{max-width:640px;margin:0 auto;padding:4.5rem clamp(1.4rem,4vw,3rem)}
.narrative p{margin-bottom:1.6rem;font-weight:380}
.narrative .lede::first-letter{font-family:'Fraunces',serif;font-size:4.6em;font-weight:500;float:left;line-height:.78;margin:.05em .14em 0 0;color:var(--bronze)}
.panel strong{color:var(--ink);font-weight:600}
.panel em{color:var(--ink)}
.hl{color:#5a4732;font-weight:500}
.dng{color:var(--wine)}
main strong{color:inherit;font-weight:600}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s ease}
.reveal.on{opacity:1;transform:none}

.pq{margin:3.4rem 0;padding:0;border:0;text-align:center;font-family:'Fraunces',serif;font-style:italic;font-weight:500;font-size:clamp(1.5rem,3vw,2rem);line-height:1.45;color:var(--ink)}
.pq::before{content:'';display:block;width:1px;height:44px;background:var(--bronze);margin:0 auto 1.6rem}
.pq .att{display:block;margin-top:1.4rem;font-family:'Jost',sans-serif;font-style:normal;font-weight:400;font-size:.74rem;letter-spacing:.38em;text-transform:uppercase;color:var(--smoke)}
.pq-sky{color:var(--ivory);text-shadow:0 3px 30px rgba(0,0,0,.8);max-width:720px;margin:0 auto;padding:26vh 1.6rem}
.pq-sky::before{background:var(--bronze-l)}
.pq-sky .att{color:rgba(241,236,223,.8)}

figure.photo{margin:3.2rem 0}
figure.photo img{width:100%;filter:sepia(.32) contrast(1.05) brightness(.97) saturate(.8)}
figure.photo figcaption{margin-top:1rem;font-size:.76rem;font-weight:400;line-height:2;letter-spacing:.14em;text-transform:uppercase;color:var(--smoke)}

.cast{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0;margin:3rem 0;border-top:1px solid var(--paperline)}
.cc{border-bottom:1px solid var(--paperline);padding:1.9rem 1.3rem 1.9rem 0;transition:background .3s}
.cc:hover{background:rgba(156,124,68,.06)}
.cc.dead .cc-name::after{content:' †';color:var(--wine)}
.cc.full{grid-column:1/-1}
.cc-name{font-family:'Fraunces',serif;font-size:1.5rem;font-weight:500;color:var(--ink)}
.cc-role{font-size:.72rem;font-weight:400;letter-spacing:.32em;text-transform:uppercase;color:var(--smoke);margin:.5rem 0 .9rem}
.cc-desc{font-size:.9rem;font-weight:380;line-height:1.85;color:var(--smoke)}

.record{background:var(--cream);color:var(--ink);font-family:'Special Elite',monospace;padding:2.8rem 2.6rem;margin:3.6rem 0;border:1px solid var(--paperline);box-shadow:0 14px 40px rgba(40,34,26,.2);transform:rotate(-.35deg);position:relative}
.record::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 28% 18%,rgba(120,100,60,.12),transparent 60%);pointer-events:none}
.record .rec-meta{font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--smoke);border-bottom:1px solid var(--paperline);padding-bottom:.8rem;margin-bottom:1.5rem}
.record p{font-size:.94rem;line-height:2.05;margin-bottom:1.2rem}
.record p:last-child{margin-bottom:0}

/* ════════ FLOATING STEP CARDS (over terrain, no panel) ════════ */
.over-steps{position:relative;padding-left:clamp(1rem,7vw,7rem)}
.over-step{min-height:100vh;display:flex;align-items:center;padding:12vh 1.2rem 12vh 0}
.over-card{max-width:460px;position:relative;color:var(--ink);border:1px solid var(--paperline);border-top:2px solid var(--bronze);padding:2rem 2.2rem;box-shadow:0 24px 60px rgba(10,8,5,.55);opacity:0;transform:translateY(34px);transition:opacity .9s ease,transform .9s ease}
.over-card::before{content:'';position:absolute;inset:0;z-index:-2;background:rgb(255 255 255 / 92%);mix-blend-mode:color}
.over-card::after{content:'';position:absolute;inset:0;z-index:-1;background:rgb(250 247 240 / 60%)}
.over-step.on .over-card{opacity:1;transform:none}
.over-card .kick{margin-bottom:.9rem}
.over-card h4{font-family:'Fraunces',serif;font-weight:500;font-size:1.6rem;line-height:1.15;color:var(--ink);margin-bottom:.9rem}
.over-card p{font-size:.92rem;font-weight:380;line-height:1.85;margin-bottom:.9rem}
.over-card p:last-child{margin-bottom:0}
.over-card.tragic{border-top-color:var(--wine)}
.over-card.tragic .kick{color:var(--wine)}
.kick{font-size:.74rem;font-weight:400;letter-spacing:.42em;text-transform:uppercase;color:var(--smoke);display:block}

.sep{display:flex;align-items:center;justify-content:center;gap:1.1rem;padding:3rem 0}
.sep-l{width:74px;height:1px;background:rgba(241,236,223,.35)}
.sep-d{color:var(--bronze-l);font-size:.7rem}

/* ════════ CH IV HUD / LEGEND / MARKERS ════════ */
.m3d-hud{position:fixed;top:3.2rem;right:2rem;z-index:9999;text-align:right;color:var(--ivory);pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.85),0 2px 18px rgba(0,0,0,.65);opacity:0;transition:opacity .8s}
.m3d-hud.show{opacity:1}
.m3d-hud .h-date{font-family:'Fraunces',serif;font-weight:500;font-size:clamp(1.9rem,4vw,3rem);line-height:1.05}
.m3d-hud .h-sub{margin-top:.4rem;font-size:.74rem;letter-spacing:.4em;text-transform:uppercase;opacity:.85}
.m3d-hud .h-alt{margin-top:.9rem;font-size:.78rem;letter-spacing:.24em;opacity:.9}
.m3d-hud.tragic .h-date{color:var(--wine-l)}
.m3d-legend{position:fixed;left:2rem;bottom:2rem;z-index:9999;display:flex;flex-wrap:wrap;gap:.5rem .9rem;max-width:430px;pointer-events:none;opacity:0;transition:opacity .8s}
.m3d-legend.show{opacity:1}
.m3d-legend span{display:inline-flex;align-items:center;gap:.45rem;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:#2b241c;background:rgba(241,236,223,.9);padding:.22rem .55rem;box-shadow:0 1px 4px rgba(20,17,12,.35)}
.m3d-legend i{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--ivory);box-shadow:0 0 6px rgba(0,0,0,.5)}
.m3d-note{position:fixed;right:2rem;bottom:1.4rem;z-index:9999;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(241,236,223,.85);text-align:right;pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.85);background:rgba(20,17,12,.6);padding:.35rem .6rem;backdrop-filter:blur(2px);opacity:0;transition:opacity .8s}
.m3d-note.show{opacity:1}

.mk-camp{pointer-events:none}
.mk-camp .t{width:7px;height:7px;background:#f4efe4;border:1px solid rgba(20,17,12,.7);transform:rotate(45deg);margin:0 auto;box-shadow:0 0 8px rgba(0,0,0,.6)}
.mk-camp .l{margin-top:.35rem;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:#f4efe4;text-shadow:0 1px 8px rgba(0,0,0,.9);white-space:nowrap;text-align:center}
.mk-p{pointer-events:none;width:13px;height:13px;border-radius:50%;border:2px solid #f4efe4;box-shadow:0 0 0 1.5px rgba(20,17,12,.55),0 0 12px rgba(0,0,0,.55);transition:opacity .6s;position:relative}
.mk-p.hide{opacity:0}
.mk-p.pulse::after{content:'';position:absolute;inset:-7px;border-radius:50%;border:1.5px solid #f4efe4;animation:mkp 2s ease-out infinite}
@keyframes mkp{from{transform:scale(.5);opacity:.9}to{transform:scale(1.35);opacity:0}}

/* ════════ FILM ════════ */
.film{padding:14vh clamp(1rem,7vw,7rem)}
.film .film-head{max-width:660px;margin:0 auto 3rem;text-align:center}
.film h3{margin-top:1.2rem;font-family:'Fraunces',serif;font-weight:500;font-size:clamp(1.8rem,4vw,2.8rem);color:var(--ivory);text-shadow:0 3px 26px rgba(0,0,0,.75)}
.film .film-frame{position:relative;max-width:1020px;margin:0 auto;aspect-ratio:16/9;background:#000;border:1px solid rgba(244,239,228,.25);box-shadow:0 30px 80px rgba(10,8,5,.6)}
.film iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.film .film-cap{max-width:1020px;margin:1rem auto 0;font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(244,239,228,.65);text-align:center}

/* ════════ MEMORIAL & FOOTER ════════ */
.memorial{padding:14vh 1.6rem}
.mem-inner{max-width:780px;margin:0 auto;position:relative;color:var(--ink);border:1px solid var(--paperline);border-top:2px solid var(--wine);box-shadow:0 30px 80px rgba(10,8,5,.55);padding:4.5rem clamp(1.4rem,4vw,3.4rem)}
.mem-inner::before{content:'';position:absolute;inset:0;z-index:-2;background:rgb(255 255 255 / 92%);mix-blend-mode:color}
.mem-inner::after{content:'';position:absolute;inset:0;z-index:-1;background:rgb(250 247 240 / 60%)}
.memorial h2{font-family:'Fraunces',serif;font-size:clamp(2.4rem,5vw,3.4rem);font-weight:500;color:var(--ink);text-align:center;margin-bottom:.6rem}
.memorial .mem-sub{text-align:center;font-style:italic;font-weight:380;color:var(--smoke);margin-bottom:3rem}
.footer{padding:8rem 1.6rem 9rem;text-align:center;font-size:.76rem;font-weight:400;line-height:2.6;letter-spacing:.16em;text-transform:uppercase;color:rgba(241,236,223,.8);text-shadow:0 1px 3px rgba(0,0,0,.85),0 1px 10px rgba(0,0,0,.6)}
.footer em{font-style:normal;color:var(--ivory)}
.footer .final{display:block;margin-top:2.6rem;font-family:'Fraunces',serif;font-size:1.5rem;font-style:italic;letter-spacing:0;text-transform:none;color:var(--ivory);text-shadow:0 3px 26px rgba(0,0,0,.8)}

/* spacing beats between blocks so the mountain breathes */
.breath{height:44vh;pointer-events:none}
.breath.tall{height:70vh}

/* ════════ RESPONSIVE / MOTION ════════ */
@media (max-width:860px){
  .rail{display:none}
  .alti{right:1rem;top:auto;bottom:1.1rem;transform:none}
  .alti .alti-bar{display:none}
  .alti .alti-ft{font-size:1.15rem}
  body{font-size:16.5px}
  .stats{gap:0 2.2rem}
  .over-steps{padding-left:1rem}
  .over-card{max-width:100%}
  .m3d-hud{top:1.2rem;right:1.2rem}
  .m3d-legend{left:1.2rem;bottom:3.6rem;max-width:70vw}
  .m3d-note{right:1.2rem}
  .panel .narrative{padding:3rem 1.3rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal,.over-card,.stat,.prologue h1,.prologue .sub,.prologue .rule,.prologue .eyebrow,.cue,.ch-cover::before,.ch-cover .num,.ch-cover h2,.ch-cover .dek{opacity:1;transform:none}
}


/* ════════ v8: silhouettes · states · features · moments · portraits ════════ */
/* camp tents */
.mk-camp2{pointer-events:none;text-align:center;transition:opacity .8s,filter .8s}
.mk-camp2 .tent{color:#2b241c;filter:url(#hand-fine) drop-shadow(1px 1px 0 rgba(244,239,228,.6));line-height:0}
.mk-camp2 .l{margin-top:.3rem;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:#2b241c;white-space:nowrap}
.mk-camp2.future{opacity:.28}
.mk-camp2.future .tent{color:transparent}
.mk-camp2.future .tent svg path{fill:none;stroke:rgba(43,36,26,.65);stroke-width:1.4}
.mk-camp2.dim{opacity:.45}
.mk-camp2.cleared .tent{color:#8e3c30;position:relative}
.mk-camp2.cleared .tent svg path{fill:#8e3c30;stroke:none}
.mk-camp2.cleared .l{color:#8e3c30}
.mk-camp2.cleared .tent::after{content:'';position:absolute;left:2px;right:2px;top:48%;height:1.5px;background:#f1ecdf;transform:rotate(-16deg)}
.mk-camp2 .pk{font-size:.9rem;color:#2b241c;text-shadow:1px 1px 0 rgba(244,239,228,.6);line-height:1}
.mk-camp2.pknode .l{opacity:.85}

/* climber silhouettes */
.mk-sil{pointer-events:none;line-height:0;filter:url(#hand-fine) drop-shadow(1px 1px 0 rgba(244,239,228,.55));transition:opacity .6s;position:relative}
.mk-sil.hide{opacity:0}
.mk-sil.lost svg g{fill:none!important;stroke:currentColor!important;stroke-width:1.2!important;opacity:.85}
.mk-sil.lost{animation:ghost 3.2s ease-in-out infinite}
@keyframes ghost{0%,100%{opacity:.85}50%{opacity:.35}}
.mk-sil.pulse::after{content:'';position:absolute;left:50%;bottom:-3px;width:26px;height:26px;transform:translateX(-50%);border-radius:50%;border:1.5px solid #f4efe4;animation:mkp 2s ease-out infinite}
.lg-sil{display:inline-block;line-height:0;filter:url(#hand-fine)}
.lg-sil svg{width:11px;height:15px}

/* named features of the route */
.mk-feat{pointer-events:none;text-align:center;transition:opacity 1s}
.mk-feat.off{opacity:0}
.mk-feat .ln{width:1px;height:26px;margin:0 auto;background:linear-gradient(180deg,rgba(201,168,106,.9),transparent)}
.mk-feat .fl{font-family:'Fraunces',serif;font-style:italic;font-size:.86rem;color:#2b241c;white-space:nowrap;letter-spacing:.04em;margin-bottom:.2rem}

/* moment pins */
.mk-mom{pointer-events:none;text-align:center;transition:opacity .9s,transform .9s;transform:translateY(6px)}
.mk-mom.off{opacity:0;transform:translateY(14px)}
.mk-mom .g{width:24px;height:24px;margin:0 auto .35rem;border-radius:50%;background:rgba(241,236,223,.95);color:#762c26;font-size:.8rem;line-height:24px;box-shadow:0 4px 14px rgba(0,0,0,.6);border:1px solid rgba(40,34,26,.4)}
.mk-mom .ml{font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#2b241c;max-width:200px;line-height:1.7;background:rgba(241,236,223,.92);padding:.25rem .55rem;box-shadow:0 1px 4px rgba(20,17,12,.35)}

/* HUD phase */
.m3d-hud .h-phase{font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.5em;text-transform:uppercase;color:rgba(241,236,223,.8);margin-bottom:.5rem;min-height:1em}
.m3d-hud.tragic .h-phase{color:var(--wine-l)}

/* cast portraits + monograms */
.cc{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;column-gap:1.1rem}
.cc-media{grid-row:1/4;width:64px}
.cc-media img{width:64px;height:80px;object-fit:cover;filter:sepia(.3) contrast(1.05) saturate(.7);border:1px solid var(--paperline)}
.cc-media .src{display:block;margin-top:.3rem;font-family:'Jost',sans-serif;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--smoke)}
.mono{width:64px;height:80px;display:flex;align-items:center;justify-content:center;border:1px solid var(--paperline);background:rgba(156,124,68,.07);font-family:'Fraunces',serif;font-weight:500;font-size:1.5rem;color:var(--bronze);letter-spacing:.04em}
.cc.dead .mono{color:var(--wine);background:rgba(118,44,38,.06)}
.cc-name,.cc-role,.cc-desc{grid-column:2}

/* Sella portrait beside his photograph */
.sella-row{display:grid;grid-template-columns:96px 1fr;gap:1.4rem;align-items:start;margin-top:1.8rem;padding-top:1.6rem;border-top:1px solid var(--paperline)}
.sella-row img{width:96px;filter:sepia(.35) contrast(1.05)}
.sella-row .s-cap{font-family:'Jost',sans-serif;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;line-height:2;color:var(--smoke)}
@media (max-width:600px){.cc{grid-template-columns:1fr}.cc-media{grid-row:auto;margin-bottom:.7rem}.cc-name,.cc-role,.cc-desc{grid-column:1}}


/* ════════ v9: film clips + photo plates ════════ */
.film.slim{padding:10vh clamp(1rem,7vw,7rem)}
.film.slim .film-frame{max-width:840px}
.film .film-more{display:block;margin:1.6rem auto 0;text-align:center;font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(241,236,223,.75);text-decoration:none}
.film .film-more:hover{color:var(--ivory)}
.plate-panel .narrative{padding-top:3.2rem;padding-bottom:3.2rem}

/* ════════ v10: cinema grade · legibility · atmosphere ════════ */
#grade{position:fixed;inset:0;z-index:1;pointer-events:none;transition:background 2.5s ease,opacity .8s ease;background:linear-gradient(180deg,rgba(160,110,50,.1),transparent 42%,rgba(20,17,12,.2))}
#grade.g-day{background:linear-gradient(180deg,rgba(60,80,105,.08),transparent 40%,rgba(20,17,12,.2))}
#grade.g-storm{background:linear-gradient(180deg,rgba(52,66,84,.3),rgba(38,48,62,.15) 50%,rgba(14,16,22,.34))}
#grade.g-night{background:radial-gradient(ellipse 120% 90% at 50% 30%,rgba(22,30,58,.22),rgba(10,12,26,.4) 100%)}
#grade.g-dusk{background:linear-gradient(180deg,rgba(96,42,36,.18),transparent 45%,rgba(30,14,12,.3))}
#grade.g-mourn{background:linear-gradient(180deg,rgba(70,74,86,.2),rgba(40,42,50,.1) 50%,rgba(16,17,20,.32))}
#bgVeil{background:
  radial-gradient(ellipse 130% 100% at 50% 42%,transparent 42%,rgba(20,17,12,.3) 100%),
  linear-gradient(90deg,rgba(20,17,12,.3) 0%,transparent 30%,transparent 72%,rgba(20,17,12,.25) 100%),
  linear-gradient(180deg,rgba(20,17,12,.26) 0%,transparent 17%,transparent 80%,rgba(20,17,12,.38) 100%)!important}
#snow{position:fixed;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity 2s}
#snow.on{opacity:1}

/* cover & prologue text plates */
.ch-cover::after{content:'';position:absolute;inset:auto 0 0 0;height:62vh;background:linear-gradient(180deg,transparent,rgba(20,17,12,.66) 62%,rgba(20,17,12,.78));pointer-events:none}
.ch-cover .inner{z-index:2}
.ch-cover h2{color:#f4efe2;filter:url(#hand-text) drop-shadow(0 3px 22px rgba(0,0,0,.85))}
.ch-cover .dek{background:rgba(20,17,12,.5);backdrop-filter:blur(4px);border-left:2px solid var(--bronze-l);padding:.9rem 1.2rem;text-shadow:none;color:#efe9da}
.prologue::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 82% 66% at 50% 46%,rgba(20,17,12,.62) 0%,rgba(20,17,12,.3) 55%,transparent 82%);pointer-events:none}
.prologue>*{position:relative}
.prologue h1{color:#f4efe2;filter:url(#hand-text) drop-shadow(0 4px 26px rgba(0,0,0,.9))}
.prologue .sub,.stat span{text-shadow:0 2px 12px rgba(0,0,0,.95)}
.stat b{filter:drop-shadow(0 3px 16px rgba(0,0,0,.9))}
.pq-sky{background:rgba(20,17,12,.52);backdrop-filter:blur(5px);padding:4rem 2.4rem;max-width:820px;border-top:1px solid rgba(201,168,106,.4);border-bottom:1px solid rgba(201,168,106,.4)}

/* marker legibility: chips + zoom gating */
.mk-camp2 .l{background:rgba(241,236,223,.92);padding:.18rem .5rem;border-radius:1px;box-shadow:0 1px 4px rgba(20,17,12,.35)}
.mk-camp2.cleared .l{background:rgba(241,236,223,.92)}
.mk-feat .fl{background:rgba(241,236,223,.9);padding:.15rem .6rem;box-shadow:0 1px 4px rgba(20,17,12,.3)}
.lbl-far .mk-camp2:not(.major) .l{opacity:0;transition:opacity .5s}
.lbl-far .mk-feat{opacity:0!important}
.mk-camp2 .l{transition:opacity .5s}
.mk-mom .ml{background:rgba(241,236,223,.92)}

/* local ambient video */
.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.film .film-frame{cursor:pointer}
.film .snd{position:absolute;right:.9rem;bottom:.9rem;z-index:2;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:#f1ecdf;background:rgba(20,17,12,.65);border:1px solid rgba(241,236,223,.35);padding:.45rem .8rem;cursor:pointer}
.film .snd:hover{background:rgba(20,17,12,.9)}

/* ════════ v11: silhouette vignettes ════════ */
#stage{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.vg{position:absolute;bottom:0;opacity:0;transition:opacity 1.8s ease;filter:url(#hand) sepia(.18) saturate(.85) drop-shadow(3px 5px 7px rgba(0,0,0,.5))}
.vg.on{opacity:1}
.vg-wide{left:0;width:100%;height:min(46vh,420px)}
.vg-right{right:0;width:min(44vw,480px);height:min(58vh,460px)}
.vg-left{left:0;width:min(42vw,520px);height:min(58vh,460px)}
#vg-nyc{height:min(52vh,440px)}

.an-haul{animation:haulup 9s ease-in-out infinite}
@keyframes haulup{0%,8%{transform:translate(0,0)}46%,58%{transform:translate(18px,-210px)}94%,100%{transform:translate(0,0)}}
.an-pair{transform:translate(560px,222px);animation:pairwalk 16s linear infinite}
@keyframes pairwalk{from{transform:translate(430px,258px)}to{transform:translate(1120px,124px)}}
.an-strip .porter{animation:march 13s linear infinite}
.an-strip .p2{animation-delay:-4s}
.an-strip .p3{animation-delay:-8s}
@keyframes march{from{transform:translate(1350px,64px)}to{transform:translate(-140px,232px)}}
.an-strip .p2,.an-strip .p3{transform:none}
.an-rope{stroke-dasharray:260;animation:ropetense 5s ease-in-out infinite}
@keyframes ropetense{0%,100%{stroke-dashoffset:0;opacity:.9}48%{stroke-dashoffset:0;opacity:.9}52%{opacity:.35}56%{opacity:.9}}
.an-bag{animation:bagfall 5s ease-in infinite}
@keyframes bagfall{0%,46%{transform:translate(212px,296px) rotate(0);opacity:0}
 50%{transform:translate(212px,296px) rotate(0);opacity:1}
 88%{transform:translate(150px,540px) rotate(-260deg);opacity:1}
 100%{transform:translate(140px,580px) rotate(-300deg);opacity:0}}
.an-rescue{animation:rescueup 11s ease-in-out infinite;transform:translate(210px,330px)}
@keyframes rescueup{0%,6%{transform:translate(230px,352px)}60%,70%{transform:translate(140px,170px)}100%{transform:translate(230px,352px)}}
.an-tent{transform-origin:410px 250px;animation:flap 2.6s ease-in-out infinite}
@keyframes flap{0%,100%{transform:skewX(0)}50%{transform:skewX(-3deg)}}
.an-wind line{stroke-dasharray:60 40;animation:gust 2.2s linear infinite}
@keyframes gust{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
#grade.g-city{background:linear-gradient(180deg,rgba(46,30,16,.28),rgba(30,20,12,.13) 40%,rgba(16,11,7,.42))}
@media (prefers-reduced-motion:reduce){.vg *{animation:none!important}}
@media (max-width:860px){.vg-right,.vg-left{width:70vw}}

/* ════════ v12: archival film figures ════════ */
figure.filmfig{margin:3rem 0;position:relative}
figure.filmfig .ff-wrap{position:relative;background:#000;border:1px solid var(--paperline)}
figure.filmfig video{width:100%;display:block;filter:sepia(.14) contrast(1.04)}
figure.filmfig .snd{position:absolute;right:.7rem;bottom:.7rem;z-index:2;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:#f1ecdf;background:rgba(20,17,12,.7);border:1px solid rgba(241,236,223,.35);padding:.4rem .7rem;cursor:pointer}
figure.filmfig figcaption{margin-top:.9rem;font-family:'Jost',sans-serif;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;line-height:2;color:var(--smoke)}

/* ════════ v13 · wind · explore · letterbox · evidence · scrubber · colophon · night ════════ */
/* control cluster */
.ctrl{position:fixed;left:1.6rem;bottom:1.4rem;z-index:10002;display:flex;flex-direction:column;gap:.45rem}
.ctrl button{font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:#f1ecdf;background:rgba(20,17,12,.62);border:1px solid rgba(241,236,223,.3);padding:.5rem .85rem;cursor:pointer;backdrop-filter:blur(3px);text-align:left;transition:.25s}
.ctrl button:hover{border-color:rgba(241,236,223,.85);color:#fff}
.ctrl button.on{background:rgba(241,236,223,.22);border-color:rgba(241,236,223,.85)}
.m3d-legend{bottom:10.6rem}

/* letterbox + film grain bump */
#lbox-t,#lbox-b{position:fixed;left:0;right:0;height:0;background:#0a0805;z-index:9996;transition:height 1.1s cubic-bezier(.6,0,.3,1)}
#lbox-t{top:0}#lbox-b{bottom:0}
body.filmy #lbox-t,body.filmy #lbox-b{height:6.5vh}
body.filmy::after{opacity:.12}

/* explore mode */
#exploreExit{position:fixed;top:1.4rem;left:50%;transform:translate(-50%,-160%);z-index:10003;font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--ink);background:rgba(241,236,223,.95);border:1px solid var(--paperline);padding:.7rem 1.3rem;cursor:pointer;transition:transform .8s cubic-bezier(.6,0,.3,1)}
body.explore #exploreExit{transform:translate(-50%,0)}
body.explore main,body.explore #stage,body.explore .rail,body.explore .alti,body.explore #progress,body.explore .m3d-hud,body.explore #scrub{opacity:0;pointer-events:none;transition:opacity .8s}
body.explore #bgVeil{opacity:.3}
body.explore #grade,body.explore #stars,body.explore #snow{opacity:0!important}
/* while exploring, markers are the point — override MapLibre's inline
   terrain-occlusion fade (0.2) on the marker wrappers */
body.explore .maplibregl-marker{opacity:1!important}
main,#stage,.rail,.alti,#progress{transition:opacity .8s}
.explore-cta{display:block;margin:0 auto 7rem;font-family:'Jost',sans-serif;font-size:.76rem;letter-spacing:.42em;text-transform:uppercase;color:var(--ivory);background:transparent;border:1px solid rgba(241,236,223,.45);padding:1.1rem 2.2rem;cursor:pointer;transition:.3s;position:relative;z-index:3}
.explore-cta:hover{border-color:#f1ecdf;color:#fff}

/* timeline scrubber (ch4) */
/* ════════ explore: location record cards ════════ */
#exploreHint{position:fixed;top:4.6rem;left:50%;transform:translateX(-50%);z-index:10002;font-family:'Jost',sans-serif;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(241,236,223,.85);text-shadow:0 1px 8px rgba(0,0,0,.9);opacity:0;pointer-events:none;transition:opacity 1s .6s}
body.explore #exploreHint{opacity:1}
body.explore.loc-open #exploreHint{opacity:0;transition-delay:0s}
body.explore .mk-camp2{pointer-events:auto;cursor:pointer}
body.explore .mk-camp2:hover .l{background:rgba(233,226,208,1);box-shadow:0 2px 10px rgba(20,17,12,.55)}
#locCard{position:fixed;right:1.6rem;top:50%;transform:translate(120%,-50%);width:min(340px,calc(100vw - 2rem));z-index:10003;background:var(--cream);color:var(--ink);border:1px solid var(--paperline);border-top:2px solid var(--bronze);box-shadow:0 24px 70px rgba(10,8,5,.6);padding:1.6rem 1.5rem 1.1rem;opacity:0;pointer-events:none;transition:transform .7s cubic-bezier(.6,0,.3,1),opacity .7s}
#locCard.show{transform:translate(0,-50%);opacity:1;pointer-events:auto}
#locCard .kick{margin-bottom:.45rem}
#locCard h4{font-family:'Fraunces',serif;font-weight:500;font-size:1.7rem;line-height:1.1;margin-bottom:.55rem}
#locCard p{font-size:.87rem;font-weight:380;line-height:1.7;color:var(--smoke);margin-bottom:1rem}
#lcClose{position:absolute;top:.55rem;right:.55rem;background:none;border:0;color:var(--smoke);font-size:.85rem;cursor:pointer;padding:.4rem}
#lcClose:hover{color:var(--ink)}
.lc-scrub{display:flex;align-items:center;gap:.55rem;border-top:1px solid var(--paperline);padding-top:1rem}
.lc-scrub button{background:none;border:1px solid var(--paperline);color:var(--ink);width:1.7rem;height:1.7rem;cursor:pointer;font-size:1rem;line-height:1;flex:none}
.lc-scrub button:hover{border-color:var(--bronze)}
#lcRange{flex:1;-webkit-appearance:none;appearance:none;height:3px;background:linear-gradient(90deg,var(--bronze-l),var(--bronze));outline:none;cursor:pointer}
#lcRange::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--ink);border:2px solid var(--cream);box-shadow:0 0 0 1px var(--bronze);cursor:pointer}
#lcRange::-moz-range-thumb{width:11px;height:11px;border-radius:50%;background:var(--ink);border:2px solid var(--cream);box-shadow:0 0 0 1px var(--bronze);cursor:pointer}
.lc-when{display:flex;justify-content:space-between;gap:.6rem;margin-top:.75rem;font-family:'Jost',sans-serif;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--smoke)}
.lc-when #lcDate{color:var(--ink);font-weight:500}
.lc-evtitle{font-family:'Fraunces',serif;font-size:1.06rem;line-height:1.3;margin:.3rem 0 .75rem}
.lc-evtitle.tragic{color:var(--wine)}
.lc-state{font-family:'Special Elite',monospace;font-size:.72rem;line-height:1.5;color:var(--smoke);border:1px dashed var(--paperline);padding:.45rem .6rem;margin-bottom:.75rem}
.lc-who{display:flex;flex-wrap:wrap;gap:.35rem .75rem;margin-bottom:.85rem;min-height:1.1rem}
.lc-chip{display:inline-flex;align-items:center;gap:.35rem;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.lc-chip i{width:9px;height:9px;border-radius:50%;display:inline-block;box-shadow:inset 0 0 0 1px rgba(40,34,26,.35)}
.lc-chip.lost{color:var(--wine)}
.lc-none{font-family:'Jost',sans-serif;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--smoke)}
.lc-note{font-family:'Jost',sans-serif;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--smoke);opacity:.8;border-top:1px solid var(--paperline);padding-top:.65rem}
@media(max-width:860px){
  #locCard{right:50%;top:auto;bottom:.8rem;transform:translate(50%,130%)}
  #locCard.show{transform:translate(50%,0)}
  #exploreHint{top:auto;bottom:5.4rem}
}

#scrub{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%);z-index:9999;display:flex;align-items:flex-end;gap:6px;padding:.7rem 1rem .6rem;background:rgba(20,17,12,.55);backdrop-filter:blur(4px);border:1px solid rgba(241,236,223,.2);opacity:0;pointer-events:none;transition:opacity .8s}
#scrub.show{opacity:1;pointer-events:auto}
#scrub .tk{width:7px;height:14px;background:rgba(241,236,223,.3);border:0;cursor:pointer;padding:0;transition:.25s}
#scrub .tk:hover{background:var(--bronze-l)}
#scrub .tk.ph{height:20px}
#scrub .tk.cur{background:var(--bronze-l);box-shadow:0 0 8px rgba(201,168,106,.7)}
#scrub .tk.trg.cur{background:var(--wine-l);box-shadow:0 0 8px rgba(201,106,92,.7)}
#scrub .sd{position:absolute;top:-1.2rem;left:0;right:0;text-align:center;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:rgba(241,236,223,.85);text-shadow:0 1px 8px rgba(0,0,0,.9)}
@media(max-width:860px){#scrub{display:none}}

/* evidence room */
.evroom{max-width:880px;margin:0 auto}
.evroom .ev-head{text-align:center;margin-bottom:2.6rem}
.evroom h3{font-family:'Fraunces',serif;font-weight:500;font-size:clamp(1.9rem,4.5vw,3rem);color:var(--ivory);text-shadow:0 3px 26px rgba(0,0,0,.8)}
.evroom .ev-sub{margin-top:.8rem;font-style:italic;font-weight:380;color:rgba(241,236,223,.85);text-shadow:0 2px 12px rgba(0,0,0,.9)}
.ev-docs{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
/* Evidence documents are paper, not floating cards: solid cream like .record.
   (Their permanent transforms would trap a blend layer anyway.) */
.doc{background:var(--cream);color:var(--ink);border:1px solid var(--paperline);padding:2rem 1.9rem;cursor:pointer;transition:transform .5s ease,box-shadow .5s ease,opacity .5s;box-shadow:0 18px 50px rgba(10,8,5,.5);position:relative}
.doc .d-tab{font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--smoke);margin-bottom:1rem}
.doc h4{font-family:'Fraunces',serif;font-weight:500;font-size:1.5rem;margin-bottom:.9rem}
.doc p{font-size:.9rem;font-weight:380;line-height:1.85;margin-bottom:.8rem}
.doc .d-seal{margin-top:1.2rem;font-family:'Special Elite',monospace;font-size:.72rem;color:var(--wine);border-top:1px dashed var(--paperline);padding-top:.9rem}
.doc.back{transform:scale(.94) translateY(10px);opacity:.62}
.doc.front{transform:scale(1);opacity:1;box-shadow:0 30px 80px rgba(10,8,5,.7)}
.ev-verdict{margin-top:1.8rem;background:rgba(20,17,12,.6);backdrop-filter:blur(4px);border-left:2px solid var(--wine-l);padding:1.4rem 1.7rem;color:#efe9da;font-weight:380;font-size:.95rem}
.ev-verdict b{color:var(--wine-l);font-weight:600}
.ev-hint{margin-top:.9rem;text-align:center;font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.34em;text-transform:uppercase;color:rgba(241,236,223,.6)}
@media(max-width:760px){.ev-docs{grid-template-columns:1fr}.doc.back{transform:none;opacity:.85}}

.doc.reveal:not(.on){opacity:0!important;transform:translateY(26px) scale(.97)!important}
/* colophon */
.colo{border-top:2px solid var(--bronze)}
.colo h3{font-family:'Fraunces',serif;font-weight:500;font-size:2rem;color:var(--ink);text-align:center;margin-bottom:.4rem}
.colo .c-sub{text-align:center;font-style:italic;color:var(--smoke);font-weight:380;margin-bottom:2.4rem}
.colo .row{display:grid;grid-template-columns:130px 1fr;gap:1.3rem;padding:1rem 0;border-bottom:1px solid var(--paperline);font-size:.92rem;font-weight:380}
.colo .row b{font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--smoke);font-weight:400;padding-top:.3rem}
.colo .row em{color:var(--ink)}

/* memorial night */
#stars{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity 3s}
body.memnight #stars{opacity:1}
body.memnight #grade{background:radial-gradient(ellipse 120% 90% at 50% 26%,rgba(14,18,40,.34),rgba(6,8,18,.52) 100%)!important}
.memorial .cc-name{transition:letter-spacing 2.5s ease}
body.memnight .memorial .cc-name{letter-spacing:.1em}
.mk-flame{pointer-events:none;text-align:center}
.mk-flame .fm{width:9px;height:14px;margin:0 auto;background:radial-gradient(ellipse at 50% 80%,#f6d98a,#c9762a 70%,transparent);border-radius:50% 50% 50% 50%/62% 62% 38% 38%;filter:blur(.4px) drop-shadow(0 0 8px rgba(246,217,138,.9));animation:flick 1.3s ease-in-out infinite}
.mk-flame .fl{margin-top:.3rem;font-family:'Jost',sans-serif;font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:#2b241c;background:rgba(241,236,223,.9);padding:.15rem .5rem;box-shadow:0 1px 4px rgba(20,17,12,.3)}
.mk-flame.off{opacity:0;transition:opacity 1.5s}
@keyframes flick{0%,100%{transform:scaleY(1) translateY(0)}30%{transform:scaleY(1.25) translateY(-1px)}60%{transform:scaleY(.9) skewX(3deg)}}
/* typewriter */
.record.typing p:not(.rec-meta){min-height:1em}

/* ════════ v14: the other disasters — cross-links before the footer ════════ */
.epochs{position:relative;z-index:3;text-align:center;padding:14vh 1.6rem 10vh}
.epochs h3{margin-top:1.4rem;font-family:'Fraunces',serif;font-weight:500;font-size:clamp(1.9rem,4.4vw,3rem);color:var(--ivory);text-shadow:0 3px 26px rgba(0,0,0,.8)}
.epochs .ep-sub{margin:.8rem auto 2.4rem;max-width:520px;font-style:italic;font-weight:380;color:rgba(241,236,223,.85);text-shadow:0 2px 12px rgba(0,0,0,.8)}
.epochs .ep-links{display:flex;flex-direction:column;align-items:center;gap:.6rem}
.epochs .ep-links a,.epochs .ep-here{font-family:'Jost',sans-serif;font-size:.76rem;letter-spacing:.34em;text-transform:uppercase;text-decoration:none;padding:.85rem 1.6rem;border:1px solid rgba(241,236,223,.45);color:var(--ivory);background:rgba(20,17,12,.45);backdrop-filter:blur(3px);transition:.3s;min-width:min(420px,86vw)}
.epochs .ep-links a:hover{border-color:#f1ecdf;color:#fff;background:rgba(20,17,12,.7)}
.epochs .ep-here{opacity:.55;border-style:dashed;pointer-events:none}
.epochs .ep-hub{border-color:rgba(201,168,106,.7)}
.epochs .ep-hub:hover{border-color:var(--bronze-l)}

/* On a phone, a nowrap label longer than the screen can't be nudged back into
   view — cap it so the clamp in engine.js/era-map.js always has room to work.
   (Positional clamping lives in JS; this is only the width backstop.) */
@media (max-width:860px){
  .mk-camp2 .l,.mk-feat .fl{max-width:calc(100vw - 24px);overflow:hidden;text-overflow:ellipsis}
  .mk-mom .ml{max-width:min(200px,calc(100vw - 24px))}
  /* the colophon carries bare URLs (publications.americanalpineclub.org) that
     have no break opportunity — on a phone they ran past the panel and were
     clipped. Let long tokens break rather than overflow. */
  .colo .row span{overflow-wrap:anywhere}
}

/* ════════ v15: HERO VARIANTS — mid-century survival-manual covers ════════
   Three alternative treatments for the opening screen, after the Air Ministry
   Pamphlet 224 / FM 21-76 / Houston & Bates "K2 — The Savage Mountain" covers.
   Preview with /?hero=pamphlet | savage | manual; with no parameter the
   original prologue renders untouched. Display face: The Foregen Rough One
   (Vultype Co). The Burn Out cuts supplied alongside are watermarked
   personal-use demos — their digits render as the foundry's badge — and are
   not in the repo at all: anything under public/ is served publicly, so
   shipping them would republish a personal-use font from our own domain.
   The Vultype faces still need a web/@font-face licence confirmed. */
@font-face{font-family:'Foregen Rough';src:url('../fonts/TheForegenRough-One.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'Foregen';src:url('../fonts/TheForegen-Regular.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:'Grahm Rough';src:url('../fonts/GrahmSansRough-Regular.otf') format('opentype');font-weight:400;font-display:swap}

.hero-v{display:none}
body[data-hero] .prologue > :not(.hero-v){display:none}
body[data-hero] .prologue{padding:0;justify-content:center}
/* the satellite ground is bright and busy — hold a scrim under the cover so
   paper, ink and the loose caption lines all read at full contrast */
body[data-hero] .prologue::before{background:
  linear-gradient(180deg,rgba(20,17,12,.62) 0%,rgba(20,17,12,.3) 34%,
                  rgba(20,17,12,.34) 62%,rgba(20,17,12,.68) 100%)}
body[data-hero="pamphlet"] .hv-pamphlet,
body[data-hero="savage"] .hv-savage,
body[data-hero="manual"] .hv-manual{display:block}
.hero-v .hv-cue{margin-top:2.4rem;text-align:center;font-family:'Jost',sans-serif;font-size:.72rem;
  letter-spacing:.5em;text-transform:uppercase;color:rgba(241,236,223,.75)}
.hero-v .hv-cue i{display:block;width:1px;height:44px;margin:.8rem auto 0;background:var(--bronze-l);
  animation:drop 2.4s ease-in-out infinite}

/* ── A · PAMPHLET — cream bands laid across the mountain (Air Ministry 224) */
.hv-pamphlet{width:100vw;margin-inline:calc(50% - 50vw)}
.pm-band{background:#efe9da;color:#14110c;padding:.5rem clamp(1rem,5vw,4rem);
  border-top:1px solid rgba(20,17,12,.35);border-bottom:1px solid rgba(20,17,12,.35);
  box-shadow:0 14px 40px rgba(10,8,5,.5)}
/* Size each line from its own length (≈.47em per character in this face) so
   both bands fill the same optical width, as on the pamphlet covers — and so
   the longer line stops short of the fixed altimeter instead of running under
   it. max-width can't do this: nowrap text overflows its box rather than
   shrinking. The 340px gutter is the rail + altimeter reserve; on a phone
   those move out of the way, so only a small margin is held back. */
.pm-band h2{font-family:'Foregen Rough',Impact,sans-serif;font-weight:400;text-transform:uppercase;
  line-height:.98;letter-spacing:-.005em;text-align:center;white-space:nowrap;
  margin:0 auto;filter:url(#hand-fine)}
.pm-b1 h2{font-size:min(11rem,calc((100vw - 340px) / 4.7))}   /* A MOUNTAIN — 10ch */
.pm-b2 h2{font-size:min(9rem, calc((100vw - 340px) / 4.23))}  /* TO DIE ON — 9ch */
@media(max-width:860px){
  .pm-b1 h2{font-size:calc((100vw - 26px) / 4.7)}
  .pm-b2 h2{font-size:calc((100vw - 26px) / 4.23)}
}
.pm-gap{height:clamp(.5rem,1.4vh,1rem)}
.pm-rule{height:clamp(1.1rem,2.6vh,1.8rem);background:rgba(58,74,102,.72);
  border-top:1px solid rgba(20,17,12,.3);border-bottom:1px solid rgba(20,17,12,.3)}
.pm-foot{margin-top:clamp(1.2rem,4vh,3rem);background:#efe9da;color:#14110c;
  padding:.55rem clamp(1rem,5vw,4rem);display:flex;align-items:center;justify-content:center;gap:1rem;
  border-top:1px solid rgba(20,17,12,.35);border-bottom:1px solid rgba(20,17,12,.35)}
.pm-foot span{font-family:'Jost',sans-serif;font-size:clamp(.62rem,1.5vw,.8rem);font-weight:500;
  letter-spacing:.42em;text-transform:uppercase}
.pm-foot i{width:22px;height:22px;border-radius:50%;border:1.5px solid #14110c;flex:none;
  display:flex;align-items:center;justify-content:center;font-style:normal;font-size:.6rem;
  font-family:'Jost',sans-serif;letter-spacing:0}
.pm-sub{margin:clamp(1rem,3vh,2rem) auto 0;max-width:620px;padding:0 1.4rem;text-align:center;
  font-style:italic;font-weight:380;font-size:1.02rem;color:rgba(241,236,223,.95);
  text-shadow:0 2px 4px rgba(0,0,0,.95),0 2px 18px rgba(0,0,0,.9)}

/* ── B · SAVAGE — cut-paper letters on the photograph (Houston & Bates) */
/* left-aligned like the jacket it comes from, and held clear of the altimeter */
.hv-savage{padding:0 clamp(1.2rem,6vw,5rem);width:min(1180px,calc(100vw - 220px));margin:0 auto;text-align:left}
@media(max-width:860px){.hv-savage{width:100%}}
.sv-dek{display:inline-block;background:rgba(58,106,112,.82);color:#eef3ee;
  padding:.85rem 1.1rem;max-width:23ch;font-family:'Jost',sans-serif;font-weight:400;
  font-size:clamp(.76rem,1.6vw,.95rem);line-height:1.65;letter-spacing:.02em;margin-bottom:1.6rem}
.sv-title{font-family:'Foregen Rough',Impact,sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(3.4rem,15vw,11rem);line-height:.84;letter-spacing:-.015em;color:#12100b;
  text-shadow:2px 0 0 #efe9da,-2px 0 0 #efe9da,0 2px 0 #efe9da,0 -2px 0 #efe9da,
              6px 7px 0 rgba(10,8,5,.42);filter:url(#hand-fine)}
.sv-strip{display:inline-block;margin-top:.9rem;background:var(--wine);color:#f6f1e6;
  padding:.5rem 1.3rem .6rem;font-family:'Foregen',Impact,sans-serif;
  font-size:clamp(1.3rem,4vw,2.7rem);line-height:1.1;letter-spacing:.01em;
  box-shadow:0 10px 30px rgba(10,8,5,.5)}
.sv-credit{display:inline-block;margin-top:2rem;font-family:'Jost',sans-serif;font-weight:500;
  font-size:clamp(.66rem,1.5vw,.82rem);letter-spacing:.4em;text-transform:uppercase;
  color:rgba(241,236,223,.95);background:rgba(20,17,12,.55);padding:.5rem .9rem;
  backdrop-filter:blur(3px);text-shadow:0 1px 10px rgba(0,0,0,.9)}
.sv-credit b{color:var(--bronze-l);font-weight:500}

/* ── C · FIELD MANUAL — the issued sheet (FM 21-76 / Funk & Wagnalls) */
.hv-manual{width:min(760px,92vw);margin:0 auto;background:#efe9da;color:#14110c;
  border-top:9px solid #14110c;border-bottom:9px solid #14110c;
  box-shadow:0 30px 80px rgba(10,8,5,.6);padding:clamp(1.4rem,4vw,2.6rem)}
.fm-head{display:flex;justify-content:space-between;gap:1rem;
  font-family:'Jost',sans-serif;font-weight:500;font-size:clamp(.6rem,1.4vw,.74rem);
  letter-spacing:.34em;text-transform:uppercase;color:#5a5142;
  border-bottom:1px solid rgba(20,17,12,.3);padding-bottom:.7rem;margin-bottom:clamp(1rem,3vw,1.8rem)}
.hv-manual h2{font-family:'Foregen Rough',Impact,sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(2.1rem,7.4vw,4.6rem);line-height:.94;letter-spacing:-.01em;filter:url(#hand-fine)}
.fm-sub{margin-top:.9rem;font-family:'Newsreader',Georgia,serif;font-style:italic;font-weight:380;
  font-size:clamp(.9rem,2vw,1.05rem);line-height:1.6;color:#4b4335;max-width:44ch}
.fm-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(1.2rem,3.4vw,2rem);
  border-top:3px solid #14110c;border-left:1px solid rgba(20,17,12,.28)}
.fm-cell{border-right:1px solid rgba(20,17,12,.28);border-bottom:1px solid rgba(20,17,12,.28);
  padding:.9rem .7rem;text-align:center}
.fm-cell b{display:block;font-family:'Foregen',Impact,sans-serif;font-weight:400;
  font-size:clamp(1.4rem,4.2vw,2.5rem);line-height:1}
.fm-cell span{display:block;margin-top:.45rem;font-family:'Jost',sans-serif;font-size:.6rem;
  letter-spacing:.24em;text-transform:uppercase;color:#5a5142;line-height:1.5}
.fm-cell.loss b{color:var(--wine)}
.fm-foot{margin-top:clamp(1rem,2.6vw,1.5rem);display:flex;justify-content:space-between;gap:1rem;
  align-items:center;font-family:'Jost',sans-serif;font-weight:500;font-size:clamp(.56rem,1.3vw,.68rem);
  letter-spacing:.3em;text-transform:uppercase;color:#5a5142}
@media(max-width:640px){
  .fm-grid{grid-template-columns:repeat(2,1fr)}
  .fm-head,.fm-foot{flex-direction:column;gap:.3rem;text-align:center}
  .sv-dek{max-width:100%}
}