@font-face{font-family:'EB Garamond';src:url(fonts/eb-garamond-latin-wght-normal.woff2?v=dfb3b989) format('woff2');font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'EB Garamond';src:url(fonts/eb-garamond-latin-ext-wght-normal.woff2?v=7de3171e) format('woff2');font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'EB Garamond';src:url(fonts/eb-garamond-latin-wght-italic.woff2?v=75d32d72) format('woff2');font-weight:400 500;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'EB Garamond';src:url(fonts/eb-garamond-latin-ext-wght-italic.woff2?v=af76e286) format('woff2');font-weight:400 500;font-style:italic;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'VT323';src:url(fonts/vt323.woff2?v=9cb03ff1) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Volante';src:url(fonts/volante-300.woff2?v=f56dac63) format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Volante';src:url(fonts/volante-500.woff2?v=1f34f170) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Volante';src:url(fonts/volante-700.woff2?v=bda9062b) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Volante';src:url(fonts/volante-900.woff2?v=fb625d57) format('woff2');font-weight:900;font-display:swap}
@font-face{font-family:'Volante Outline';src:url(fonts/volante-900-outline.woff2?v=6d33be7f) format('woff2');font-weight:900;font-display:swap}
@font-face{font-family:'Lazerkid1';src:url(fonts/lazerkid-1.woff2?v=87b3fb6b) format('woff2');font-display:swap}
@font-face{font-family:'Lazerkid2';src:url(fonts/lazerkid-2.woff2?v=1f49fa6b) format('woff2');font-display:swap}
@font-face{font-family:'Lazerkid3';src:url(fonts/lazerkid-3.woff2?v=46012361) format('woff2');font-display:swap}

:root{
  color-scheme:dark;
  --ink:#0b0b0c; --ink2:#141416; --ink3:#1c1c1f;
  --white:#ffffff; --paper:#f4f3ef; --paper2:#e9e7e1; --pink:#131313;
  --red:#d3272b; --red-d:#8f1a1d; --red-text:#ee4347;
  --hair:rgba(255,255,255,.55); --dim:rgba(255,255,255,.66); --faint:rgba(255,255,255,.16);
  --gut:max(16px,5vw);
  --disp:'Volante','Arial Narrow','Helvetica Neue',Arial,sans-serif;
  --outl:'Volante','Arial Narrow',sans-serif;
  --serif:Garamond,'Times New Roman',serif;
  --osd:ui-monospace,Menlo,monospace;
  --k1:'Lazerkid1',var(--disp); --k2:'Lazerkid2',var(--disp); --k3:'Lazerkid3',var(--disp);
  --t1:#35507a; --t2:#d9a441; --t3:#2a2c30; --t4:#c4262a; --t5:#237a8c; --t6:#6a4a9c; --t7:#c8642a;
  --ease:cubic-bezier(.2,.7,.1,1);
  --tgwc-h:64px; --ofs:calc(var(--tgwc-h) - 46px);
}
/* faces used below the fold or later in the film (prose, tape readout, outlined numerals): asked for after the first frame,
   when the page script sets .late, so the first paint does not wait behind them */
.late{--outl:'Volante Outline','Volante','Arial Narrow',sans-serif;--serif:'EB Garamond',Garamond,'Times New Roman',serif;--osd:'VT323',ui-monospace,Menlo,monospace}
html{background:var(--ink);scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--ink);color:var(--white);font-family:var(--disp);font-size:16px;line-height:1.4;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
main{overflow-x:clip}
*,*::before,*::after{box-sizing:border-box}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cap{font-family:var(--disp);text-transform:uppercase;letter-spacing:.3em;font-weight:300}

/* ───────── fixed HUD (under the shared TGW header) ───────── */
.bk-hud{position:fixed;z-index:60;top:var(--tgwc-h);left:0;right:0;padding:calc(env(safe-area-inset-top,0px) + 18px) var(--gut) 0;
  display:flex;align-items:flex-start;justify-content:space-between;pointer-events:none;color:var(--white);transition:color .4s}
.bk-hud a,.bk-hud button{pointer-events:auto}
.bk-hud::before{content:"";position:absolute;inset:0 0 -34px 0;background:linear-gradient(rgba(11,11,12,.82),rgba(11,11,12,0));opacity:0;transition:opacity .4s,background .4s;pointer-events:none;z-index:-1}
.bk-hud.solid::before{opacity:1}
.bk-hud.paper::before{background:linear-gradient(rgba(244,243,239,.94),rgba(244,243,239,0))}
.bk-hud-mark{font-weight:900;font-size:13px;letter-spacing:.02em;line-height:.9;text-transform:uppercase;opacity:0;transform:translateY(-6px);transition:opacity .5s,transform .5s}
.bk-hud-mark span{display:block}
.bk-hud.solid .bk-hud-mark{opacity:1;transform:none}
.bk-hud-r{display:flex;align-items:center;gap:28px}
.bk-hud-pen{font-weight:300;font-size:12px;letter-spacing:.3em;opacity:.72}
.bk-hud-cta{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:12px;letter-spacing:.24em;text-transform:uppercase;padding:9px 0;border-bottom:1px solid currentColor}
.bk-hud-cta i{width:8px;height:8px;border-radius:50%;background:var(--red);display:block}
.bk-hud-line{position:absolute;left:var(--gut);right:var(--gut);top:calc(env(safe-area-inset-top,0px) + 60px);height:1px;background:var(--hair);transform-origin:left;transition:opacity .4s}
.bk-hud.solid .bk-hud-line{opacity:0}
.bk-hud.paper{color:var(--pink)}
.bk-hud.paper .bk-hud-line{background:rgba(0,0,0,.4)}

/* edge ladder + flip window: the book's fore-edge, on the screen's edge */
.ladder{position:fixed;z-index:55;right:0;top:22vh;height:52vh;width:22px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;pointer-events:none}
.ladder i{display:block;height:1px;width:7px;background:rgba(255,255,255,.28);transition:width .25s,background .25s}
.ladder i.on{width:20px;background:var(--white)}
.paper-mode .ladder i{background:rgba(0,0,0,.22)} .paper-mode .ladder i.on{background:#000}
.flip{position:fixed;z-index:55;right:0;top:calc(74vh + 14px);width:40px;height:71px;overflow:hidden;background:#000 no-repeat;background-size:900% auto;
  opacity:0;transition:opacity .5s;pointer-events:none;box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.flip.show{opacity:1}
.ld-flip .flip,.ld-flip .pg .fliphint{background-image:url(seq/flip_atlas.webp?v=d8a5341d)}

/* grain */
.grain{position:fixed;inset:-10%;z-index:58;pointer-events:none;opacity:.075;mix-blend-mode:overlay;animation:grain 1s steps(6) infinite;background-size:220px 220px}
@keyframes grain{0%{transform:translate(0,0)}17%{transform:translate(-7%,4%)}33%{transform:translate(5%,-6%)}50%{transform:translate(-3%,8%)}67%{transform:translate(8%,2%)}83%{transform:translate(-6%,-4%)}100%{transform:translate(0,0)}}

/* loader */
.loader{position:fixed;inset:0;z-index:80;background:var(--ink);display:none;place-items:center;transition:opacity .6s .1s,visibility 0s .7s}
.js .loader{display:grid}
.loader.done{opacity:0;visibility:hidden}
.loader .lr{width:74px;height:74px;position:relative}
.loader .lr svg{width:100%;height:100%;display:block;overflow:visible}
.loader .lbar{position:absolute;left:50%;top:calc(50% + 64px);width:120px;height:1px;background:var(--faint);transform:translateX(-50%)}
.loader .lbar b{display:block;height:100%;width:0;background:var(--white);transition:width .3s}
.loader .lcap{position:absolute;left:50%;top:calc(50% + 78px);transform:translateX(-50%);font-size:10px;letter-spacing:.34em;font-weight:300;color:var(--dim);white-space:nowrap}

/* ───────── STAGE (cover → Milwaukee → the city) ───────── */
.stage{position:relative;height:100vh;height:100svh}
.stage-in{position:relative;height:100vh;height:100svh;overflow:hidden;background:var(--ink);--wm:min(10.8vw,18vh);--bt:max(45vh,calc(env(safe-area-inset-top,0px) + 92px + var(--ofs) + var(--wm)*1.78 + 30px));--bh:min(33vh,calc(100vh - var(--bt) - 150px));--bl:var(--gut)}
.layer{position:absolute;inset:0;width:100%;height:100%;display:block}
#seq{z-index:1;opacity:0}
.cover-under{position:absolute;inset:0;z-index:2;pointer-events:none}
#gl-fall{z-index:3}
#above{z-index:4;object-fit:cover;opacity:0}
.whiteout{z-index:9;background:#fff;opacity:0;pointer-events:none}
.vhs-fx{z-index:6;pointer-events:none;opacity:0;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px)}
.vig{z-index:7;pointer-events:none;background:radial-gradient(120% 90% at 50% 50%,transparent 55%,rgba(0,0,0,.55) 100%);opacity:0}
.fallback-band{position:absolute;z-index:3;object-fit:cover;object-position:42% 40%}
.fallback-band.nojs{left:var(--bl);top:var(--bt);width:calc(100% - var(--bl));height:var(--bh)}

/* cover layout (landscape default) */
.cover-ui{position:absolute;inset:0;z-index:5;pointer-events:none}
.cover-ui a{pointer-events:auto}
.c-col{position:absolute;left:calc(var(--gut) - .2vw);top:calc(env(safe-area-inset-top,0px) + 92px + var(--ofs));writing-mode:vertical-rl;font-family:var(--k3);color:var(--red);
  display:flex;flex-direction:column;gap:.18em;line-height:1;font-size:18px;white-space:nowrap}
.c-col span{display:block}
.c-wm{position:absolute;left:calc(var(--gut) + var(--wm)*.62);top:calc(env(safe-area-inset-top,0px) + 92px + var(--ofs));margin:0;font-weight:900;font-size:var(--wm);line-height:.84;letter-spacing:-.005em;text-transform:uppercase}
.c-wm span{display:block;overflow:hidden;padding-bottom:.02em}
.c-wm span b{display:block;font-weight:900}
.c-ep{position:absolute;left:calc(var(--gut) + var(--wm)*.63);top:calc(env(safe-area-inset-top,0px) + 92px + var(--ofs) + var(--wm)*1.78);font-weight:500;font-size:clamp(11px,.95vw,16px);letter-spacing:.36em;text-transform:uppercase}
.c-tiles{position:absolute;right:0;left:50vw;bottom:calc(100% - var(--bt) + .9vh);height:12vh;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(7,1fr);gap:.55vw}
.c-tiles li{position:relative;height:100%}
.c-tiles a{position:absolute;inset:0;display:block;clip-path:polygon(16% 0,100% 0,84% 100%,0 100%);overflow:hidden;transition:transform .5s var(--ease)}
.c-tiles a:hover,.c-tiles a:focus-visible{transform:translateY(-8px)}
.tile-img{position:absolute;inset:0;filter:saturate(1.38) contrast(1.07) brightness(1.04);isolation:isolate}
.tile-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.tile-img i{position:absolute;inset:0;mix-blend-mode:color}
.c-tiles .tip{position:absolute;left:10%;bottom:calc(100% + 8px);font-size:10px;letter-spacing:.3em;font-weight:500;opacity:0;transform:translateY(4px);transition:.3s;white-space:nowrap;pointer-events:none}
.c-tiles li:hover .tip,.c-tiles a:focus-visible + .tip{opacity:1;transform:none}
.c-band{position:absolute;left:var(--bl);right:0;top:var(--bt);height:var(--bh)}
.c-sun{position:absolute;width:31vh;height:31vh;left:calc(70vw - 15.5vh);top:calc(var(--bt) + var(--bh) - 31vh*.32)}
.c-sun svg{width:100%;height:100%;display:block;overflow:visible}
.c-net{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.c-kori{position:absolute;left:var(--gut);top:calc(var(--bt) + var(--bh) + 2.2vh);font-family:var(--k1);color:var(--red);font-size:clamp(14px,1.45vw,26px);line-height:1}
.c-arr{position:absolute;left:var(--gut);top:calc(var(--bt) + var(--bh) + 2.2vh + clamp(14px,1.45vw,26px) + 6px);font-weight:700;font-size:clamp(22px,2.6vw,48px);letter-spacing:.36em;line-height:1;text-transform:uppercase;margin:0}
.c-hr{position:absolute;left:var(--gut);width:36vw;top:calc(var(--bt) + var(--bh) + 11vh);height:1px;background:var(--hair)}
.c-stamp{position:absolute;left:var(--gut);width:40vw;top:calc(var(--bt) + var(--bh) + 12.6vh);font-family:var(--k2);color:var(--red);font-size:clamp(9px,.78vw,13px);line-height:1.3;white-space:nowrap}
.c-ring{position:absolute;right:calc(var(--gut) + 18px);bottom:max(2.6vh,18px);width:clamp(52px,6.6vh,76px);height:clamp(52px,6.6vh,76px)}
.c-ring svg{width:100%;height:100%;display:block}
.c-cue{position:absolute;left:50%;bottom:3.2vh;transform:translateX(-50%);font-size:10px;letter-spacing:.42em;font-weight:300;color:var(--dim);display:flex;flex-direction:column;align-items:center;gap:10px}
.c-cue i{display:block;width:1px;height:34px;background:linear-gradient(var(--white),transparent);animation:cue 2.2s var(--ease) infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}45%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

/* Act II: the tape */
.osd{position:absolute;z-index:8;left:calc(var(--gut) + 8px);top:calc(env(safe-area-inset-top,0px) + var(--tgwc-h) + 64px);font-family:var(--osd);font-size:clamp(22px,2.2vw,36px);line-height:1;color:#fff;
  text-shadow:2px 0 rgba(255,40,40,.55),-2px 0 rgba(40,160,255,.5),0 0 8px rgba(255,255,255,.35);opacity:0;letter-spacing:.04em}
.osd .row{display:flex;gap:.6em}
.osd .tc{position:absolute;left:0;top:calc(100vh - 214px - var(--tgwc-h));top:calc(100svh - 214px - var(--tgwc-h));white-space:nowrap}
.blurb{position:absolute;z-index:8;left:var(--gut);right:var(--gut);top:calc(env(safe-area-inset-top,0px) + var(--tgwc-h) + 128px);margin:0;font-family:var(--serif);font-weight:500;font-size:clamp(26px,3.4vw,58px);line-height:1.12;letter-spacing:-.005em;
  text-shadow:0 2px 30px rgba(0,0,0,.55)}
.blurb p{margin:0;opacity:0;max-width:17em}
.blurb p:first-child{font-size:1.28em;margin-bottom:.25em}

/* Act III: the city */
.city-cap{position:absolute;z-index:8;right:calc(var(--gut) + 30px);bottom:max(12vh,86px);text-align:right;font-family:var(--serif);font-weight:500;font-size:clamp(26px,3.4vw,58px);line-height:1.12;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.city-cap p{margin:0;opacity:0}
.cutmap{position:absolute;z-index:8;left:var(--gut);top:50%;height:min(46vh,470px);aspect-ratio:1315/2030;transform:translateY(-46%);opacity:0}
.cutmap img{width:100%;height:100%;mix-blend-mode:screen;opacity:.62}
.cutmap .mk{position:absolute;left:0;right:0;top:0;height:100%;transform:translate3d(0,83.5%,0);pointer-events:none}
.cutmap .mk::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--red);box-shadow:0 0 12px rgba(211,39,43,.9)}
.cutmap .mk::before{content:"";position:absolute;left:17.4%;top:-5px;width:11px;height:11px;border-radius:50%;background:var(--red);transform:translateX(-50%)}
.cutmap .lbl{position:absolute;left:0;top:calc(100% + 12px);font-size:10px;letter-spacing:.32em;font-weight:300;color:var(--dim);white-space:nowrap}
.finale{position:absolute;z-index:8;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 var(--gut);margin:0;font-weight:900;text-transform:uppercase;font-size:min(15.5vw,25vh);line-height:.84;letter-spacing:-.01em;pointer-events:none}
.finale span{display:block;overflow:hidden}
.finale b{display:block;transform:translateY(105%)}
.finale span:nth-child(2){padding-left:12vw}
.finale .sub{position:absolute;left:var(--gut);bottom:max(7vh,50px);font-size:11px;letter-spacing:.34em;font-weight:300;line-height:1.6;opacity:0}

/* ───────── CHAPTERS ───────── */
.chapters{position:relative;background:var(--ink)}
.ch-pin{position:relative;height:100vh;height:100svh;overflow:hidden}
.ch-glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 70% at 60% 55%,var(--glow,#35507a) 0%,transparent 70%);opacity:.16;transition:background .8s}
.ch-head{position:absolute;left:var(--gut);top:calc(env(safe-area-inset-top,0px) + 96px + var(--ofs));z-index:3;display:flex;align-items:flex-end;gap:18px}
.emark{width:auto;height:clamp(40px,5.4vw,86px);aspect-ratio:.52}
.emark svg{height:100%;width:auto;display:block}
.ch-h{margin:0;font-weight:900;font-size:clamp(46px,6.8vw,120px);line-height:.8;text-transform:uppercase}
.ch-line{position:absolute;z-index:3;left:var(--gut);right:var(--gut);bottom:max(5.5vh,34px);display:flex;flex-wrap:wrap;gap:.2em 0;margin:0;padding:0;list-style:none;font-weight:300;font-size:clamp(11px,1vw,16px);letter-spacing:.3em;text-transform:uppercase}
.ch-line li{display:flex;align-items:center;color:var(--dim);transition:color .3s}
.ch-line li+li::before{content:"·";color:var(--red);margin:0 .9em 0 .6em;letter-spacing:0;font-weight:700}
.ch-line li.on{color:var(--white)}
.ch-line li button{all:unset;cursor:pointer}
.ch-line .hr{position:absolute;left:0;right:0;top:-18px;height:1px;background:var(--faint)}
.ch-line .hr b{display:block;height:100%;width:0;background:var(--white)}
.ch-track{position:absolute;left:0;top:calc(env(safe-area-inset-top,0px) + 96px + var(--ofs) + clamp(46px,6.8vw,120px)*.8 + 5vh);bottom:0;display:flex;align-items:flex-start;gap:3.2vw;padding-left:var(--gut);padding-right:36vw;will-change:transform}
.ch{position:relative;flex:0 0 auto;width:clamp(260px,26vw,470px)}
.ch-media{position:relative;height:min(520px,calc(100vh - 96px - var(--ofs) - clamp(46px,6.8vw,120px)*.8 - 5vh - 262px));clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);overflow:hidden;background:#000}
.ch-media .tile-img{inset:0 -12%}
.ch-media .tile-img img{transition:filter .7s var(--ease)}
.ch-media .tile-img i{transition:opacity .7s var(--ease)}
.ch:hover .ch-media .tile-img img{filter:grayscale(0)}
.ch:hover .ch-media .tile-img i{opacity:.25}
.ch-num{position:absolute;right:-.06em;top:-.23em;font-family:var(--outl);font-weight:900;font-size:min(46vh,480px);line-height:1;color:#fff;pointer-events:none;mix-blend-mode:normal}
.ch-media::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(0,0,0,.45))}
.ch-t{position:relative;padding:22px 0 0 calc(12% * .5);display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:baseline}
.ch-k{font-family:var(--k1);color:var(--red);font-size:18px;line-height:1}
.ch-n{font-weight:300;font-size:11px;letter-spacing:.3em;color:var(--dim)}
.ch-t h3{grid-column:1/-1;margin:10px 0 0;font-weight:900;font-size:clamp(34px,3.6vw,64px);line-height:.86;text-transform:uppercase;letter-spacing:-.005em}
.ch-t p{grid-column:1/-1;margin:14px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(16px,1.25vw,21px);line-height:1.34;color:rgba(255,255,255,.84);max-width:24em}
.ch-t p::before{content:"“"} .ch-t p::after{content:"”"}
.ch-intro{flex:0 0 auto;width:22vw;min-width:240px;margin-top:8vh;font-weight:300;font-size:11px;letter-spacing:.32em;color:var(--dim);line-height:2}
.ch-intro strong{display:block;font-weight:900;font-size:clamp(30px,3vw,52px);letter-spacing:0;line-height:.9;color:#fff;margin-bottom:18px}

/* ───────── READ: the opening, on paper ───────── */
.read{position:relative;background:var(--paper);color:var(--pink)}
.read-pin{position:relative;height:100vh;height:100svh;overflow:hidden;display:grid;place-items:center;perspective:2600px}
.read-lbl{position:absolute;left:var(--gut);top:calc(env(safe-area-inset-top,0px) + 96px + var(--tgwc-h));font-size:11px;letter-spacing:.34em;font-weight:300;line-height:1.9;color:#555}
.read-lbl b{display:block;font-weight:900;font-size:clamp(34px,3.4vw,58px);letter-spacing:0;line-height:.86;color:var(--pink);margin-bottom:14px}
.read-note{position:absolute;right:var(--gut);bottom:max(6vh,40px);font-size:11px;letter-spacing:.3em;font-weight:300;color:#666;text-align:right;line-height:1.9}
.book3d{--ph:min(76vh,calc((100vw - 2*var(--gut) - 26vw)/2/.6479));translate:7vw 0;--pw:calc(var(--ph)*.6479);position:relative;width:calc(var(--pw)*2);height:var(--ph);transform-style:preserve-3d;transform:rotateX(14deg)}
.book3d::after{content:"";position:absolute;left:4%;right:4%;bottom:-6%;height:12%;background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.28),transparent 70%);transform:translateZ(-2px);filter:blur(6px)}
.pg{position:absolute;top:0;width:var(--pw);height:var(--ph);background:#fff;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.pg.l{left:0;box-shadow:inset -18px 0 26px -18px rgba(0,0,0,.35)}
.pg.r{left:var(--pw);box-shadow:inset 18px 0 26px -18px rgba(0,0,0,.35)}
.leaf{position:absolute;left:var(--pw);top:0;width:var(--pw);height:var(--ph);transform-style:preserve-3d;transform-origin:left center;z-index:3}
.leaf .pg{left:0}
.leaf .back{transform:rotateY(180deg)}
.leaf .shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.0),rgba(0,0,0,.35));opacity:0}
/* the opener */
.op{background:#0b0b0c;color:#fff}
.op .num{position:absolute;right:-.12em;top:-.29em;font-family:var(--outl);font-weight:900;font-size:calc(var(--ph)*.7);line-height:1;color:#fff}
.op .ttl{position:absolute;left:13%;right:10%;bottom:21%;font-weight:900;font-size:calc(var(--ph)*.083);line-height:.85;margin:0}
.op .hr{position:absolute;left:13%;right:10%;bottom:19.3%;height:1px;background:rgba(255,255,255,.8)}
.op .meta{position:absolute;left:13%;bottom:16.2%;font-size:calc(var(--ph)*.0125);letter-spacing:.3em;font-weight:500;display:flex;gap:1.4em;align-items:baseline}
.op .meta .k{font-family:var(--k1);color:var(--red);letter-spacing:0;font-size:1.6em}
.blankpg .pn{position:absolute;bottom:4.6%;left:12%;font-size:calc(var(--ph)*.011);letter-spacing:.2em;color:#999}
/* text pages share one two-column block, each page shows its own column */
.txt .rh{position:absolute;top:5.1%;right:11%;font-weight:700;font-size:calc(var(--ph)*.0115);letter-spacing:.3em;text-transform:uppercase;display:flex;gap:1.6em}
.txt.l .rh{display:none}
.flow{position:absolute;top:8.6%;height:calc(var(--lh)*30);--fs:calc(var(--ph)*.02101);--lh:calc(var(--ph)*.02706);width:calc(var(--pw)*2 - var(--pw)*.13*2);
  column-count:2;column-gap:calc(var(--pw)*.14*2);column-fill:auto;font-family:var(--serif);font-weight:460;font-size:var(--fs);line-height:var(--lh);color:#141414;text-align:justify;hyphens:auto;-webkit-hyphens:auto;
  font-variant-ligatures:common-ligatures}
.txt.l .flow{left:calc(var(--pw)*.13)}
.txt.r .flow{left:calc(var(--pw)*.13 - var(--pw))}
.flow p{margin:0;text-indent:1.5em}
.flow p.first{text-indent:0}
.flow p.sc{font-family:var(--disp);font-weight:500;font-size:.8em;letter-spacing:.16em;text-transform:uppercase;text-indent:0;text-align:left}
.flow .vt{float:left;height:calc(var(--lh)*14);width:calc(var(--lh)*14/3.74*.8);margin:calc(var(--lh)*.12) calc(var(--lh)*.55) 0 0;position:relative}
.flow .vt b{position:absolute;left:0;top:100%;transform-origin:0 0;transform:rotate(-90deg);white-space:nowrap;font-family:var(--disp);font-weight:900;font-size:calc(var(--lh)*14/3.74);line-height:.8;color:#0b0b0c;letter-spacing:-.005em}
.fe{position:absolute;right:0;top:9%;bottom:9%;width:4.6%;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end}
.fe i{display:block;height:1px;width:40%;background:#111}
.fe i.l{width:70%}
.fe i.on{height:calc(var(--ph)*.004);width:100%;background:#000}
.pg .fliphint{position:absolute;right:0;bottom:3%;width:4.6%;aspect-ratio:9/16;background:#222 no-repeat;background-size:900% auto;filter:grayscale(1)}
.read-mob{display:none}

/* ───────── DRAWN: the graphic novel pages ───────── */
.drawn{position:relative;background:var(--ink)}
.drawn-pin{position:relative;height:100vh;height:100svh;overflow:hidden;perspective:1500px;perspective-origin:50% 40%}
.wall{position:absolute;left:50%;top:50%;width:calc(var(--cw)*5 + var(--gap)*4);--cw:min(21vw,300px);--gap:calc(var(--cw)*.12);transform-style:preserve-3d;
  display:grid;grid-template-columns:repeat(5,var(--cw));gap:var(--gap);will-change:transform}
.wall figure{margin:0;position:relative;aspect-ratio:2/3;background:#fff;box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08);transform-style:preserve-3d;will-change:transform}
.wall img{width:100%;height:100%;object-fit:cover}
.drawn-copy{position:absolute;z-index:4;left:var(--gut);right:var(--gut);bottom:max(7vh,44px);display:flex;justify-content:space-between;align-items:flex-end;gap:24px;pointer-events:none}
.drawn-copy h2{margin:0;font-weight:900;text-transform:uppercase;font-size:clamp(40px,6.4vw,116px);line-height:.84;letter-spacing:-.005em;text-shadow:0 4px 40px rgba(0,0,0,.7)}
.drawn-copy h2 span{display:block}
.drawn-copy h2 em{font-style:normal;color:var(--red)}
.drawn-copy p{margin:0;font-size:11px;letter-spacing:.32em;font-weight:300;color:var(--dim);line-height:1.9;text-align:right;text-transform:uppercase}
.drawn-fade{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(var(--ink),transparent 22%,transparent 60%,rgba(11,11,12,.92))}

/* ───────── OBJECT: the paperback ───────── */
.object{position:relative;background:radial-gradient(70% 60% at 50% 45%,#18181b 0%,var(--ink) 70%)}
.obj-pin{position:relative;height:100vh;height:100svh;overflow:hidden;display:grid;place-items:center;perspective:2200px}
.pb{--h:min(70vh,700px);--w:calc(var(--h)*.6479);--d:calc(var(--h)*.0393);position:relative;width:var(--w);height:var(--h);transform-style:preserve-3d}
.pb .f{position:absolute;left:0;top:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.pb .fr,.pb .bk{width:var(--w);height:var(--h);background-size:cover}
.pb .fr{transform:translateZ(calc(var(--d)/2));background-color:#16161a}
.pb .bk{transform:rotateY(180deg) translateZ(calc(var(--d)/2));background-color:#16161a}
.pb .sp{width:var(--d);height:var(--h);left:calc(50% - var(--d)/2);transform:rotateY(-90deg) translateZ(calc(var(--w)/2));background:#16161a center/100% 100% no-repeat}
.ld-pb .pb .fr{background-image:url(img/cover_front.webp?v=d625851b)}.ld-pb .pb .bk{background-image:url(img/cover_back.webp?v=cad4e5c0)}.ld-pb .pb .sp{background-image:url(img/cover_spine.webp?v=ea101d4c)}
.pb .fe2{width:var(--d);height:var(--h);left:calc(50% - var(--d)/2);transform:rotateY(90deg) translateZ(calc(var(--w)/2 - 1px));
  background:linear-gradient(to bottom right,transparent calc(50% - .7px),#1a1a1a calc(50% - .7px),#1a1a1a calc(50% + .7px),transparent calc(50% + .7px)) 0 12%/100% 76% no-repeat,
  repeating-linear-gradient(90deg,#f1efe9 0 1px,#dcd9d1 1px 2px),#eeece6}
.pb .tp,.pb .bt{width:var(--w);height:var(--d);top:calc(50% - var(--d)/2);background:repeating-linear-gradient(0deg,#f1efe9 0 1px,#d8d5cd 1px 2px)}
.pb .tp{transform:rotateX(90deg) translateZ(calc(var(--h)/2))}
.pb .bt{transform:rotateX(-90deg) translateZ(calc(var(--h)/2))}
.pb .gloss{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.13) 50%,transparent 58%) 50% 0/300% 100% no-repeat;mix-blend-mode:screen}
.obj-planet{position:absolute;left:50%;top:52%;width:min(96vh,1000px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(211,39,43,.16),rgba(211,39,43,.05) 62%,transparent 72%);pointer-events:none}
.pb .lit{position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,rgba(255,255,255,.12),transparent 40%,rgba(0,0,0,.28));opacity:var(--o,0)}
.pb-shadow{position:absolute;left:50%;top:calc(50% + min(33vh,320px) + 4px);width:min(42vh,410px);height:40px;transform:translateX(-50%);background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.75),transparent 70%);filter:blur(8px);pointer-events:none}
.obj-title{position:absolute;left:var(--gut);top:calc(env(safe-area-inset-top,0px) + 96px + var(--tgwc-h));font-size:11px;letter-spacing:.34em;font-weight:300;color:var(--dim);line-height:1.9}
.obj-title b{display:block;font-weight:900;font-size:clamp(34px,3.4vw,58px);letter-spacing:0;line-height:.86;color:#fff;margin-bottom:14px}
.callouts{position:absolute;inset:0;pointer-events:none}
.co{position:absolute;opacity:0;font-size:clamp(15px,1.25vw,21px);letter-spacing:.14em;font-weight:700;text-transform:uppercase;line-height:1.25;max-width:320px}
.co small{display:block;margin-top:8px;font-weight:300;color:var(--dim);letter-spacing:.26em;font-size:10.5px;line-height:1.7}
.co.left{text-align:right}
.co svg{position:absolute;overflow:visible;top:.6em}
.co.left svg{left:calc(100% + 14px)}
.co.right svg{right:calc(100% + 14px)}
.co line,.co polyline{stroke:var(--red);stroke-width:1;fill:none}
.co circle{fill:var(--red)}

/* ───────── GET: the back cover ───────── */
.get{position:relative;background:var(--ink);padding-top:max(12vh,90px)}
.get-top{padding:0 var(--gut);display:flex;align-items:center;gap:clamp(12px,1.6vw,28px)}
.get-top .emark{height:min(12vw,190px)}
.get-top h2{margin:0;font-weight:900;font-size:min(15vw,236px);line-height:.8;letter-spacing:-.01em;text-transform:uppercase}
.get-line{margin:5vh var(--gut) 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;font-weight:300;font-size:clamp(11px,1.15vw,19px);letter-spacing:.3em;text-transform:uppercase}
.get-line li+li::before{content:"·";color:var(--red);margin:0 .9em 0 .6em;letter-spacing:0;font-weight:700}
.get-hr{height:1px;background:var(--hair);margin:4.5vh var(--gut) 0}
.get-blurb{margin:5vh auto 0;padding:0 var(--gut);max-width:32em;text-align:center;font-family:var(--serif);font-weight:450;font-size:clamp(19px,1.9vw,32px);line-height:1.3}
.get-band{position:relative;height:min(56vh,640px);margin-top:7vh;overflow:hidden}
.get-band canvas,.get-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.get-arr{margin:6vh 0 0;text-align:center;font-weight:700;font-size:clamp(26px,3vw,52px);letter-spacing:.36em;text-transform:uppercase;padding-left:.36em}
.buy{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;margin:6vh var(--gut) 0}
.btn{position:relative;display:flex;align-items:center;gap:22px;min-width:min(100%,360px);padding:26px 30px;border:1px solid rgba(255,255,255,.4);color:#fff;text-transform:uppercase;cursor:not-allowed}
.btn .b1{font-weight:900;font-size:clamp(24px,2vw,34px);letter-spacing:.04em;line-height:1}
.btn .b2{font-weight:300;font-size:10px;letter-spacing:.3em;color:var(--dim);line-height:1.5}
.btn .soon{margin-left:auto;font-weight:700;font-size:10px;letter-spacing:.3em;color:var(--red);border:1px solid var(--red);padding:5px 8px 4px 10px}
.btn.live{cursor:pointer;border-color:rgba(255,255,255,.8);transition:border-color .3s,background-color .3s}
.btn.live .soon{color:#fff;background:var(--red);transition:background-color .3s,border-color .3s}
.btn.live:hover,.btn.live:focus-visible{border-color:var(--red);background-color:rgba(211,39,43,.12)}
.follow{margin:4.5vh auto 0;text-align:center;font-weight:300;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}
.follow a{color:#fff;border-bottom:1px solid var(--red);padding-bottom:3px;margin-left:.6em;letter-spacing:.14em;text-transform:none;font-weight:500;font-size:15px;transition:color .3s,border-color .3s}
.follow a:hover{color:var(--red)}
.bk-hud-cta:hover{color:var(--red);transition:color .3s}   /* no transition of its own otherwise: it follows the bar's colour (paper mode) */
.bk-foot{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:16px;padding:9vh var(--gut) calc(26px + env(safe-area-inset-bottom,0px));font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--dim)}
.bk-foot .lv{display:flex;align-items:center;gap:12px}
.bk-foot .lv svg{height:22px;width:auto;display:block}
.bk-foot .mid{text-align:center}
.bk-foot .end{text-align:right}

/* ───────── NEXT: Episode 2 ───────── */
.next{position:relative;height:100vh;height:100svh;background:var(--ink);overflow:hidden;border-top:1px solid var(--faint)}
.next .two{position:absolute;right:4vw;bottom:-.14em;font-weight:900;font-size:min(104vh,80vw);line-height:.8;color:#fff}
.next .lbl{position:absolute;left:var(--gut);top:calc(env(safe-area-inset-top,0px) + 96px + var(--tgwc-h));font-size:11px;letter-spacing:.34em;font-weight:300;color:var(--dim);line-height:2}
.next .lbl b{display:block;font-weight:900;font-size:clamp(34px,3.8vw,64px);letter-spacing:0;line-height:.86;color:#fff;margin:6px 0 10px}
.next .lbl .k{font-family:var(--k1);color:var(--red-text);letter-spacing:0;font-size:20px}
.next .wm2{position:absolute;left:var(--gut);bottom:max(6vh,36px);font-weight:900;font-size:clamp(16px,1.4vw,24px);line-height:.86;text-transform:uppercase}

/* ───────── portrait / phone ───────── */
@media (max-width:760px),(max-aspect-ratio:4/5){
  .stage-in{--bt:40vh;--bh:28vh;--wm:min(15.5vw,11vh)}
  .c-col{top:calc(env(safe-area-inset-top,0px) + 84px + var(--ofs));font-size:12px;left:var(--gut)}
  .c-wm{top:calc(env(safe-area-inset-top,0px) + 84px + var(--ofs))}
  .c-ep{top:calc(env(safe-area-inset-top,0px) + 84px + var(--ofs) + var(--wm)*1.78);font-size:11px}
  .c-tiles{left:var(--gut);height:6.4vh;gap:1.4vw;bottom:calc(100% - var(--bt) + .7vh)}
  .c-tiles .tip{display:none}
  .c-sun{width:42vw;height:42vw;left:calc(74vw - 21vw);top:calc(var(--bt) + var(--bh) - 42vw*.32)}
  .c-kori{top:calc(var(--bt) + var(--bh) + 2vh);font-size:15px}
  .c-arr{top:calc(var(--bt) + var(--bh) + 2vh + 21px);font-size:clamp(20px,6.2vw,30px)}
  .c-hr{top:calc(var(--bt) + var(--bh) + 11.5vh);width:48vw}
  .c-stamp{top:calc(var(--bt) + var(--bh) + 13vh);font-size:8px;width:54vw}
  .c-cue{display:none}
  .bk-hud-pen{display:none}
  .bk-hud-r{gap:16px}
  .bk-hud-line{display:none}
  .blurb,.city-cap{font-size:clamp(24px,7vw,34px);bottom:max(16vh,110px)}
  .city-cap{right:calc(var(--gut) + 30px);left:var(--gut)}
  .cutmap{height:34vh;top:calc(env(safe-area-inset-top,0px) + var(--tgwc-h) + 72px);transform:none;left:auto;right:calc(var(--gut) + 10px)}
  .osd{font-size:22px}
  .finale{font-size:19vw}
  .finale span:nth-child(2){padding-left:0}
  .ch-pin{height:auto;overflow:visible;padding:18vh 0 10vh}
  .ch-head{position:relative;left:auto;top:auto;padding:0 var(--gut)}
  .ch-track{position:relative;flex-direction:column;align-items:stretch;padding:8vh var(--gut) 0;gap:10vh;transform:none!important}
  .ch{width:auto}
  .ch-media{height:62vw}
  .ch-num{font-size:78vw}
  .ch-line{display:none}
  .ch-intro{width:auto;margin-top:0}
  .read-pin{height:auto;overflow:visible;display:block;padding:18vh var(--gut) 12vh;perspective:none}
  .read-lbl{position:relative;left:auto;top:auto;margin-bottom:6vh}
  .read-note{position:relative;right:auto;bottom:auto;text-align:left;margin-top:6vh}
  .book3d{display:none}
  .read-mob{display:block}
  .read-mob .op-card{position:relative;background:#0b0b0c;color:#fff;aspect-ratio:1/1.1;overflow:hidden;margin-bottom:8vh}
  .read-mob .op-card .num{position:absolute;right:-.1em;top:-.28em;font-family:var(--outl);font-weight:900;font-size:120vw;line-height:1}
  .read-mob .op-card .ttl{position:absolute;left:8%;bottom:12%;font-weight:900;font-size:13vw;line-height:.85;margin:0}
  .read-mob .op-card .meta{position:absolute;left:8%;bottom:6%;font-size:10px;letter-spacing:.3em;display:flex;gap:1.2em;align-items:baseline}
  .read-mob .op-card .meta .k{font-family:var(--k1);color:var(--red-text);letter-spacing:0;font-size:16px}
  .read-mob .mflow{font-family:var(--serif);font-size:18px;line-height:1.5;color:#141414;hyphens:auto;text-align:justify}
  .read-mob .mflow p{margin:0;text-indent:1.4em}
  .read-mob .mflow p.first{text-indent:0}
  .read-mob .vt{display:none}
  .read-mob .mflow p.sc{font-family:var(--disp);font-weight:500;font-size:.8em;letter-spacing:.14em;text-indent:0;text-transform:uppercase;margin-bottom:.4em}
  .wall{--cw:40vw;grid-template-columns:repeat(3,var(--cw));width:calc(var(--cw)*3 + var(--gap)*2)}
  .wall figure:nth-child(n+13){display:none}
  .drawn-copy{flex-direction:column;align-items:flex-start}
  .drawn-copy p{text-align:left}
  .obj-pin{--pbt:calc(env(safe-area-inset-top,0px) + var(--tgwc-h) + 236px);--pbh:min(480px,calc(100svh - var(--pbt) - max(8vh,56px) - 78px));place-items:start center;padding-top:var(--pbt)}
  .pb{--h:var(--pbh)}
  .pb-shadow{top:calc(var(--pbt) + var(--pbh) + 4px);width:calc(var(--pbh)*.62)}
  .co{max-width:44vw;font-size:10px;letter-spacing:.2em}
  .co small{font-size:9px;letter-spacing:.16em}
  .co svg{display:none}
  .co,.co.left,.co.right{left:var(--gut)!important;right:var(--gut)!important;top:auto!important;bottom:max(8vh,56px);text-align:center;max-width:none;font-size:15px}
  .obj-planet{width:120vw;top:calc(var(--pbt) + var(--pbh)/2)}
  .get-top .emark{height:17vw}
  .btn{min-width:100%}
  .bk-foot{grid-template-columns:1fr 1fr;row-gap:22px}
  .bk-foot .mid{display:none}
  .ladder{width:14px;top:26vh;height:44vh}
  .ladder i{width:5px} .ladder i.on{width:13px}
  .flip{width:30px;height:53px;top:calc(70vh + 10px)}
}
@media (prefers-reduced-motion:reduce){
  .grain,.c-cue i{animation:none}
}
.rm .grain,.rm .c-cue i{animation:none}
.op .fe i{background:transparent} .op .fe i.on{background:#fff;width:100%}
.blurb,.city-cap,.osd,.cutmap{pointer-events:none}
.next .lbl b,.read-lbl b,.obj-title b,.ch-intro strong,.op .ttl,.read-mob .op-card .ttl,.get-top h2{text-transform:uppercase}

/* ───────── scroll room, reserved in CSS: every scene is a tall section around a sticky frame,
   so nothing is pinned or re-wrapped by script and nothing below it moves while scrolling ───────── */
.js .stage{height:800vh;height:800svh}
.js .stage-in{position:sticky;top:0}
.js .drawn{height:260vh;height:260svh}
.js .drawn-pin{position:sticky;top:0}
.js .object{height:340vh;height:340svh}
.js .obj-pin{position:sticky;top:0}
@media (min-width:761px) and (min-aspect-ratio:4/5){
  /* chapters run sideways: the track length is set by the page script (--chlen), this is its CSS estimate */
  .js .chapters{--chlen:calc((max(16px,5vw) + max(22vw,240px) + 7*clamp(260px,26vw,470px) + 7*3.2vw + 36vw - 100vw)*1.05);height:calc(100vh + var(--chlen));height:calc(100svh + var(--chlen))}
  .js .ch-pin{position:sticky;top:0}
  .js .read{height:280vh;height:280svh}
  .js .read-pin{position:sticky;top:0}
  /* the 3D pages are decoration: the excerpt stays readable for assistive tech */
  .read-mob{display:block;position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .read-mob .mflow{hyphens:manual;-webkit-hyphens:manual;text-align:left}
}
/* the wall of pages and the Episode 2 card have fixed heights and nothing is measured inside them: the browser skips them until they come close */
.js:not(.nost) .drawn,.next{content-visibility:auto}
.nost .stage{height:100vh;height:100svh}
.nost .chapters,.nost .read,.nost .drawn,.nost .object{height:auto}
@font-face{font-family: 'Roboto';font-style: normal;font-weight: 100 900;font-display: swap;src: url(../fonts/roboto-latin-ext-wght-normal.woff2?v=a6323dda) format('woff2');unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family: 'Roboto';font-style: normal;font-weight: 100 900;font-display: swap;src: url(../fonts/roboto-latin-wght-normal.woff2?v=665db5e1) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family: 'Martian Mono';font-style: normal;font-weight: 100 800;font-stretch: 75% 112.5%;font-display: swap;src: url(../fonts/martian-mono-normal-latin-ext.woff2?v=734b2e7b) format('woff2');unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family: 'Martian Mono';font-style: normal;font-weight: 100 800;font-stretch: 75% 112.5%;font-display: swap;src: url(../fonts/martian-mono-normal-latin.woff2?v=53a4a47c) format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* shared chrome, lifted from the site CSS at build time */
.tgwc{color-scheme:dark;
  --ink:#07080a; --ink2:#0d0f12; --ink3:#14171b; --ink4:#1c2025;
  --paper:#ecebe6; --paper2:#c8c7c1; --dim:#9b9d9f; --mute:#6c6f73;
  --faint:rgba(236,235,230,.10); --hair:rgba(236,235,230,.2); --hair2:rgba(236,235,230,.34);
  --tally:#da1414; --tally-glow:rgba(218,20,20,.45);
  
  --tally-text:#ef3e3e; --mute-text:#85888c;
  --signal:#b4e7ff;
  --g:max(16px,4.2vw);
  --maxw:1480px;
  --hud-h:64px;
  --disp:'Archivo','Arial Narrow','Helvetica Neue',Arial,sans-serif;
  --mono:'Martian Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:'Bodoni Moda','Bodoni 72',Didot,Georgia,serif;
  --ease:cubic-bezier(.2,.7,.1,1);
  --ease-io:cubic-bezier(.7,0,.2,1);
  --f-body:16px;
  --f-lead:clamp(18px,1.45vw,22px);
  --f-h4:clamp(22px,2.2vw,32px);
  --f-h3:clamp(28px,3.4vw,52px);
  --f-h2:clamp(38px,5.6vw,92px);
  --f-h1:clamp(48px,9.2vw,168px);}
:root{--tgwc-h:64px}
.tgwc *,.tgwc *::before,.tgwc *::after{box-sizing:border-box}
.tgwc{color:var(--paper);font-family:var(--disp);font-size:var(--f-body);font-weight:330;font-stretch:100%;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
.tgwc main{overflow-x:clip}
.tgwc img,.tgwc video,.tgwc canvas{max-width:100%;display:block}
.tgwc a{color:inherit;text-decoration:none}
.tgwc button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.tgwc :focus-visible{outline:2px solid var(--tally);outline-offset:3px}
.tgwc ::selection{background:var(--tally);color:#fff}
.tgwc h1,.tgwc h2,.tgwc h3,.tgwc h4,.tgwc h5,.tgwc h6{margin:0;font-weight:300;line-height:1.02;text-wrap:balance;letter-spacing:-.005em}
.tgwc p{margin:0}
.tgwc b,.tgwc strong{font-weight:780;font-stretch:112%}
.tgwc .n{font-weight:330}
.tgwc .skip{position:fixed;left:12px;top:calc(12px + env(safe-area-inset-top,0px));z-index:200;padding:12px 16px;background:var(--paper);color:var(--ink);
  font-family:var(--mono);font-size:12px;line-height:1.2;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 10px 40px rgba(0,0,0,.6)}
.tgwc .skip:not(:focus){width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;box-shadow:none}
.tgwc .skip:focus-visible{outline:2px solid var(--tally);outline-offset:2px}
.tgwc main:focus,.tgwc [tabindex="-1"]:focus{outline:none}
.tgwc .wrap{width:100%;max-width:calc(var(--maxw) + 2*var(--g));margin-inline:auto;padding-inline:var(--g)}
.tgwc .lab{font-family:var(--mono);font-size:11px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;font-weight:400;font-stretch:100%}
.tgwc .lab{color:var(--dim)}
.tgwc section{position:relative}
.tgwc .hud{position:fixed;z-index:65;left:0;right:0;top:0;height:calc(var(--hud-h) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) var(--g) 0;
  display:flex;align-items:center;justify-content:space-between;gap:24px;transition:background .5s var(--ease),transform .5s var(--ease)}
.tgwc .hud::before{content:"";position:absolute;inset:0 0 -28px;background:linear-gradient(rgba(7,8,10,.94) 0,rgba(7,8,10,.9) calc(100% - 28px),rgba(7,8,10,0));opacity:0;transition:opacity .5s;pointer-events:none;z-index:-1}
.tgwc .hud.solid::before{opacity:1}
.tgwc .hud.hide{transform:translateY(-110%)}
.tgwc .brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.tgwc .brand .gl{width:16px;height:16px;display:block}
.tgwc .brand .wm{height:13px;width:auto;display:block}
.tgwc .nav{display:flex;align-items:center;gap:clamp(14px,2.2vw,34px)}
.tgwc .nav a{position:relative;font-size:13.5px;font-weight:420;letter-spacing:.01em;padding:6px 0;color:var(--paper2);transition:color .25s}
.tgwc .nav a:hover{color:var(--paper)}
.tgwc .nav a[aria-current="page"]{color:var(--tally-text)}
.tgwc .nav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:1px;height:1px;background:var(--tally);box-shadow:0 0 8px var(--tally-glow)}
.tgwc .hud-r{display:flex;align-items:center;gap:18px}
.tgwc .lang{display:flex;gap:2px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em}
.tgwc .lang a{padding:5px 6px;color:var(--mute-text);border:1px solid transparent}
.tgwc .lang a[aria-current="true"]{color:var(--paper);border-color:var(--hair)}
.tgwc .menu-btn{display:none;width:40px;height:40px;position:relative}
.tgwc .menu-btn span{position:absolute;left:9px;right:9px;height:1px;background:var(--paper);transition:transform .4s var(--ease),opacity .3s}
.tgwc .menu-btn span:nth-child(1){top:14px}
.tgwc .menu-btn span:nth-child(2){top:20px}
.tgwc .menu-btn span:nth-child(3){top:26px}
.menu-open .tgwc .menu-btn span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .tgwc .menu-btn span:nth-child(2){opacity:0}
.menu-open .tgwc .menu-btn span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.tgwc .mnav{position:fixed;inset:0;z-index:64;background:rgba(7,8,10,.97);display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hud-h) + 20px) var(--g) 40px;
  clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease-io),visibility 0s .7s;overflow:hidden;visibility:hidden}
.menu-open .tgwc .mnav{clip-path:inset(0 0 0 0);visibility:visible;transition:clip-path .7s var(--ease-io)}
.tgwc .mnav a{display:block;font-size:clamp(34px,9vw,64px);font-weight:250;line-height:1.15;padding:4px 0;border-bottom:1px solid var(--faint)}
.tgwc .mnav a b{font-stretch:118%}
.tgwc .mnav a[aria-current="page"]{color:var(--tally-text)}
.tgwc .socials{display:flex;gap:10px}
.tgwc .socials a{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--hair);transition:border-color .3s,background .3s}
.tgwc .socials a:hover{border-color:var(--paper);background:rgba(255,255,255,.04)}
.tgwc .socials svg{width:16px;height:16px;fill:var(--paper)}
.tgwc .foot{position:relative;padding-block:clamp(70px,8vw,120px) 26px;border-top:1px solid var(--faint);background:linear-gradient(var(--ink),#050607)}
.tgwc .foot .cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}
.tgwc .foot h2,.tgwc .foot h6,.tgwc .foot .fh{font-size:14px;font-weight:620;letter-spacing:.02em;margin-bottom:14px;color:var(--paper)}
.tgwc .foot p,.tgwc .foot address{font-style:normal;font-size:14px;line-height:1.65;color:var(--paper2);font-weight:320}
.tgwc .foot .cols a{overflow-wrap:anywhere}
.tgwc .foot a{border-bottom:1px solid var(--hair);transition:border-color .3s,color .3s}
.tgwc .foot .fl a{display:inline-block;min-height:24px;padding-block:2px;line-height:20px;vertical-align:top}
.tgwc .foot a:hover{color:#fff;border-color:var(--tally)}
.tgwc .foot .socials a{border-bottom:1px solid var(--hair)}
.tgwc .foot .big{margin-top:clamp(60px,7vw,110px);opacity:.95}
.tgwc .foot .big svg{width:100%;height:auto;display:block}
.tgwc .foot .fine{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px;padding:14px 0 34px;border-top:1px solid var(--faint)}
@media (max-width:1100px){.tgwc .nav{display:none}.tgwc .menu-btn{display:block}.tgwc .foot .cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.tgwc{--hud-h:58px}:root{--tgwc-h:58px}.tgwc .foot .cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.tgwc *,.tgwc *::before,.tgwc *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
.tgwc{--ease-out:cubic-bezier(.16,1,.3,1);--ease-spring:cubic-bezier(.34,1.56,.64,1)}
.tgwc section{scroll-margin-top:calc(var(--hud-h) + 10px)}
.tgwc .ar{position:relative;display:inline-block;width:16px;height:9px;flex:0 0 16px;transition:transform .45s var(--ease-out)}
.tgwc .ar::before{content:"";position:absolute;left:0;right:1px;top:4px;height:1px;background:currentColor}
.tgwc .ar::after{content:"";position:absolute;right:0;top:1px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.tgwc .hud .brand .wm{height:12px}
.tgwc .nav{gap:clamp(12px,1.8vw,30px)}
.tgwc .nav .ni{position:relative}
.tgwc .nav .ni>a{display:inline-flex;align-items:center;gap:7px}
.tgwc .nav .ni>a[data-in]{color:var(--paper)}
.tgwc .nav .chev{width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .35s var(--ease-out)}
.tgwc .nav .has-sub:hover .chev,.tgwc .nav .has-sub:focus-within .chev{transform:translateY(1px) rotate(225deg)}
.tgwc .nav .sub{position:absolute;left:-18px;top:calc(100% + 10px);min-width:230px;padding:10px;background:rgba(10,11,13,.97);border:1px solid var(--hair);
  display:grid;gap:2px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .25s,transform .35s var(--ease-out),visibility 0s .35s}
.tgwc .nav .sub::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.tgwc .nav .has-sub:hover .sub,.tgwc .nav .has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .35s var(--ease-out)}
.tgwc .nav .sub a{display:flex;align-items:center;gap:12px;padding:10px 12px;font-size:13.5px;color:var(--paper2);transition:background .2s,color .2s}
.tgwc .nav .sub a:hover,.tgwc .nav .sub a[aria-current]{background:rgba(255,255,255,.05);color:var(--paper)}
.tgwc .nav .sub a[aria-current]::after{display:none}
.tgwc .nav .sub .n{font-family:var(--mono);font-size:9.5px;color:var(--tally-text);letter-spacing:.1em}
.tgwc .nav-cta{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid var(--hair2);font-size:12.5px;font-weight:560;letter-spacing:.05em;text-transform:uppercase;transition:background .3s,color .3s,border-color .3s,transform .6s var(--ease-out)}
.tgwc .nav-cta:hover,.tgwc .nav-cta[aria-current]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.tgwc .mnav nav{display:grid}
.tgwc .mnav a.m1{display:flex;align-items:baseline;gap:14px;font-size:clamp(30px,8.5vw,58px);font-weight:260;line-height:1.1;padding:6px 0;border-bottom:1px solid var(--faint)}
.tgwc .mnav a.m1 .n{font-family:var(--mono);font-size:11px;color:var(--tally-text);letter-spacing:.12em}
.tgwc .mnav a.m2{font-size:clamp(17px,4.6vw,24px);padding:7px 0 7px 36px;color:var(--paper2);border-bottom:1px solid var(--faint)}
.tgwc .mnav a[aria-current="page"]{color:var(--tally-text)}
.tgwc .mnav .mfoot{display:flex;justify-content:space-between;align-items:center;margin-top:26px}
.tgwc .mnav .mclose{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--hair);padding:9px 14px}
.menu-open .tgwc .mnav a.m1,.menu-open .tgwc .mnav a.m2{animation:tgwc-mIn .7s var(--ease-out) both}
.menu-open .tgwc .mnav a:nth-child(2){animation-delay:.04s}
.menu-open .tgwc .mnav a:nth-child(3){animation-delay:.08s}
.menu-open .tgwc .mnav a:nth-child(4){animation-delay:.12s}
.menu-open .tgwc .mnav a:nth-child(5){animation-delay:.16s}
.menu-open .tgwc .mnav a:nth-child(6){animation-delay:.2s}
.menu-open .tgwc .mnav a:nth-child(7){animation-delay:.24s}
.menu-open .tgwc .mnav a:nth-child(8){animation-delay:.28s}
.menu-open .tgwc .mnav a:nth-child(9){animation-delay:.32s}
@media (max-width:1180px){.tgwc .nav{display:none}.tgwc .menu-btn{display:block}}
@media (hover:none){.tgwc .nav{display:none}.tgwc .menu-btn{display:block}}
.tgwc [data-scrub]::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:var(--sp,0%);background:var(--tally);z-index:3;transition:width .1s linear;box-shadow:0 0 8px var(--tally-glow)}
.tgwc [data-stills]{margin-top:10px}
.tgwc .foot .socials{flex-wrap:wrap;gap:8px}
.tgwc .foot .socials a,.tgwc .foot .socials .soc{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.tgwc .foot .socials svg{width:16px;height:16px;fill:var(--paper)}
.tgwc [hidden]{display:none!important}
@media (max-width:760px){.tgwc .foot .f-call{grid-column:1/-1}}
.menu-open .tgwc .mnav a:nth-child(10){animation-delay:.36s}
.menu-open .tgwc .mnav a:nth-child(11){animation-delay:.4s}
.tgwc .mnav nav{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.tgwc .mnav .mfoot .lang{gap:6px}
.tgwc .mnav .mfoot .lang a{display:inline-flex;align-items:center;min-height:36px;font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.14em;line-height:1;padding:8px 12px;border:1px solid transparent;color:var(--mute-text)}
.tgwc .mnav .mfoot .lang a[aria-current="true"]{color:var(--paper);border-color:var(--hair)}
.tgwc{--tg-ink:#0b0b0c;--tg-red:#d3272b;--tg-red-text:#ee4347;--tg-hair:rgba(255,255,255,.55);--tg-faint:rgba(255,255,255,.16);
  --tg-disp:'Volante','Arial Narrow','Helvetica Neue',Arial,sans-serif;--tg-serif:'EB Garamond',Garamond,Georgia,serif;
  --t1:#35507a;--t2:#d9a441;--t3:#2a2c30;--t4:#c4262a;--t5:#237a8c;--t6:#6a4a9c;--t7:#c8642a}
.tgwc ::selection{background:var(--tg-red)}
.tgwc .hud.solid::before{background:linear-gradient(rgba(11,11,12,.96),rgba(11,11,12,.9) calc(100% - 28px),rgba(11,11,12,0))}
.tgwc{--disp:'Roboto',system-ui,-apple-system,'Segoe UI',Arial,sans-serif}
.tgwc b,.tgwc strong{font-weight:700;font-stretch:normal}
.tgwc .flr{position:absolute;z-index:0;pointer-events:none;width:min(80vw,780px);aspect-ratio:1;color:var(--paper);opacity:.1}
.tgwc .flr svg{display:block;width:100%;height:100%;overflow:visible}
.tgwc .flr .fl-main,.tgwc .flr .fl-ch{fill:currentColor}
.tgwc .flr .fl-ch{opacity:0;mix-blend-mode:screen;will-change:transform,opacity}
.tgwc .flr .fl-cr{color:#ff2a2a}
.tgwc .flr .fl-cc{color:#29e0ff}
html.js:not(.rm) .tgwc .flr .fl-main{fill-opacity:0;stroke:currentColor;stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1;stroke-opacity:1;
  transition:stroke-dashoffset 2.8s var(--ease),fill-opacity 1.4s ease 1.7s,stroke-opacity 1.2s ease 2.6s}
.tgwc .fl-menu{right:-18vw;bottom:-18vw;width:70vw;max-width:560px;opacity:.2}
@media (max-width:760px){.tgwc .flr{opacity:.07}}
.tgwc .foot .fine .dir{color:var(--paper2)}
.tgwc .nav-cta{gap:10px;padding:10px 15px 10px 17px;border:0;background:var(--paper);color:var(--ink);font-weight:600;letter-spacing:.08em}
.tgwc .nav-cta .ar{width:14px;flex-basis:14px}
.tgwc .nav-cta:hover,.tgwc .nav-cta[aria-current]{background:var(--tally);color:#fff;border-color:transparent}
.tgwc .nav-cta:hover .ar{transform:translateX(4px)}
.tgwc .nav a.nav-cta{color:var(--ink);padding:10px 15px 10px 17px}
.tgwc .nav a.nav-cta:hover,.tgwc .nav a.nav-cta[aria-current]{color:#fff}
.tgwc .nav a.nav-cta[aria-current]::after{content:none}
.tgwc{--slw:2.4px;--sl-c:var(--tally-text);--gold:#c9a45c;--gold-hi:#ecd593;--gold-text:#d8b86f}
@media (max-width:760px){.tgwc{--slw:2px}}
.tgwc .nav a.nav-cta,.tgwc .nav-cta{background:none;color:var(--gold-text);padding:10px 2px 10px 14px;border:0;font-weight:600;letter-spacing:.1em;transition:color .35s}
.tgwc .nav a.nav-cta:hover,.tgwc .nav a.nav-cta[aria-current]{background:none;color:var(--gold-hi)}
.tgwc .nav a.nav-cta .ar{color:inherit}
.tgwc .nav a.nav-cta[aria-current]::after{content:"";position:absolute;left:14px;right:2px;bottom:4px;height:1px;background:var(--gold);box-shadow:0 0 8px rgba(201,164,92,.45)}
.tgwc .mnav a.m1.gold{color:var(--gold-text)}
@keyframes tgwc-mIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* shared chrome on the book page */
.tgwc{display:contents}
.tgwc.tgwc-f{display:block;position:relative;z-index:2;content-visibility:auto;contain-intrinsic-size:auto 760px}
.tgwc .mnav:not(.on){display:none}
/* the bar's own box would pull in Archivo even where its links are hidden (phones): it takes the mono face, the links keep Archivo */
.tgwc .hud{font-family:var(--mono)}.tgwc .nav{font-family:var(--disp)}
.bk-notice{position:relative;z-index:3;margin:0 auto;max-width:720px;padding:18px var(--gut);font-family:var(--serif);font-style:italic;font-size:17px;line-height:1.5;color:var(--dim);text-align:center}
.bk-release{margin:5vh var(--gut) 0;padding-left:.3em;text-align:center;font-size:12px;letter-spacing:.3em;text-transform:uppercase;font-weight:700;color:var(--red-text)}
.read-src{margin-top:14px;font-family:var(--serif);font-style:italic;font-size:14px;color:#555}
.bk main .chk,.bk main .lnk{background:#d3272b;color:#fff;font:600 10px/1.4 ui-monospace,Menlo,monospace;letter-spacing:.06em;padding:1px 5px;margin-left:6px;border-radius:2px;white-space:nowrap}
/* ══ v4 TGR round ══ */
/* the book's own second bar is gone: the shared header and the pre-order bar sit up there (its line ran over the header) */
.bk-hud{display:none!important}
/* the pre-order bar, same as on the other TGR pages */
.tg-bar{position:fixed;z-index:62;left:0;right:0;top:calc(var(--tgwc-h) + env(safe-area-inset-top,0px));background:rgba(11,11,12,.93);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(211,39,43,.6);animation:tgbar-in .8s var(--ease) .6s both}
.tg-bar[hidden],.tgbar-x-pre .tg-bar[data-tgbar=pre],.tgbar-x-out .tg-bar[data-tgbar=out],.menu-open .tg-bar{display:none}
.tg-bar-in{position:relative;display:flex;align-items:center;justify-content:center;gap:10px clamp(12px,1.6vw,26px);min-height:44px;padding:6px calc(var(--gut) + 40px) 6px var(--gut)}
.tg-bar p{margin:0;font-family:var(--disp);font-weight:500;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:#fff;line-height:1.35}
.tg-bar .btn{display:inline-flex;align-items:center;justify-content:center;flex:none;width:auto;min-width:0;max-width:none;height:auto;gap:0;cursor:pointer;padding:8px 15px 7px;
background:var(--red);border:1px solid var(--red);color:#fff;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.2em;text-transform:uppercase;transition:background .3s,color .3s}
.tg-bar .btn:hover{background:#fff;color:#000}
.tg-bar .btn .bt{display:inline-block}
.tg-bar-x{position:absolute;right:calc(var(--gut) - 6px);top:50%;width:34px;height:34px;margin-top:-17px;display:grid;place-items:center;color:#fff;background:none;border:0;cursor:pointer;opacity:.8}
.tg-bar-x:hover,.tg-bar-x:focus-visible{opacity:1}
.tg-bar-x i{position:relative;width:14px;height:14px}
.tg-bar-x i::before,.tg-bar-x i::after{content:"";position:absolute;left:50%;top:0;width:1.5px;height:14px;margin-left:-.75px;background:currentColor;transform:rotate(45deg)}
.tg-bar-x i::after{transform:rotate(-45deg)}
@keyframes tgbar-in{from{transform:translateY(-100%);opacity:0}}
@keyframes tgbar-up{from{transform:translateY(100%);opacity:0}}
.rm .tg-bar{animation:none}
@media (max-width:760px){.tg-bar{top:auto;bottom:0;border-bottom:0;border-top:1px solid rgba(211,39,43,.6);animation-name:tgbar-up;padding-bottom:env(safe-area-inset-bottom,0px)}
  .tg-bar-in{justify-content:flex-start;padding:8px 52px 8px var(--gut);min-height:52px}.tg-bar p{font-size:10.5px;letter-spacing:.1em}}
/* the cover: AD IKKEN is out of the cipher list (its place on the cover stays empty); the cut 35 percent bigger */
#kori{visibility:hidden}
.cutmap{height:min(62vh,640px)}
@media (max-width:760px){.cutmap{height:min(52vh,420px)}}
/* the statement over the Core */
.bk-state{position:relative;z-index:2;overflow:hidden;min-height:100vh;min-height:100svh;display:grid;place-items:center;background:#000;perspective:1000px;padding:12vh var(--gut)}
.bk-st-v{position:absolute;inset:-8% -4%;transform-origin:50% 60%}
.bk-st-v video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.5) saturate(.85)}
.bk-st-sh{position:absolute;inset:0;background:radial-gradient(70% 70% at 50% 50%,rgba(11,11,12,.55),rgba(11,11,12,.15)),linear-gradient(var(--ink),transparent 16%,transparent 84%,var(--ink))}
.bk-st-t{position:relative;z-index:2;margin:0;text-align:center;font-weight:900;text-transform:uppercase;font-size:clamp(46px,9.4vw,180px);line-height:.88;text-shadow:0 6px 60px rgba(0,0,0,.6)}
.bk-st-t span{display:block}.bk-st-t span:last-child{color:var(--red-text)}
/* the chapters' heading line */
.ch-intro strong{margin-bottom:0}
/* the drawn pages: the line under the heading */
.drawn-l{display:grid;gap:18px;max-width:min(760px,60vw)}
.drawn-copy .drawn-t{margin:0;text-align:left;text-transform:none;letter-spacing:0;font-weight:400;font-family:var(--serif);
font-style:italic;font-size:clamp(17px,1.4vw,22px);line-height:1.45;color:#f4f3ef;text-shadow:0 2px 24px rgba(0,0,0,.8);max-width:34em}
@media (max-width:760px){.drawn-l{max-width:none}}
/* the back cover with its blurb as text */
.bk-back{position:relative;z-index:2;background:var(--ink);padding:14vh var(--gut) 8vh}
.bk-bk-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(30px,6vw,110px);align-items:center;max-width:1280px;margin:0 auto}
.bk-bk-img{margin:0;box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08);transform:rotate(-2deg)}
.bk-bk-img img{width:100%;height:auto}
.bk-bk-t{font-family:var(--serif);font-size:clamp(17px,1.35vw,21px);line-height:1.6;color:#e9e7e1}
.bk-bk-t p{margin:0 0 1em;max-width:36em}
.bk-bk-t .lead{font-size:1.5em;line-height:1.25;color:#fff;margin-bottom:.9em}
@media (max-width:860px){.bk-bk-in{grid-template-columns:1fr}.bk-bk-img{max-width:340px;margin:0 auto}}
/* buy: the release date big above the buttons; Goodreads; the Discord as a real button */
.bk-release{margin:6vh var(--gut) 0;font-size:clamp(20px,2.4vw,40px);letter-spacing:.14em;color:#fff;font-weight:900}
.bk-release::after{content:"";display:block;width:64px;height:2px;margin:16px auto 0;background:var(--red)}
.follow.gr{margin-top:2.2vh}
.bk-disc{margin:7vh auto 0;padding:0 var(--gut);max-width:760px;display:grid;justify-items:center;gap:22px;text-align:center}
.bk-disc p{margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.6vw,24px);line-height:1.45;color:#e9e7e1}
.bk-dbtn{display:inline-flex;align-items:center;gap:14px;padding:20px 32px;background:var(--red);border:1px solid var(--red);color:#fff;font-weight:700;font-size:clamp(14px,1.15vw,17px);letter-spacing:.2em;text-transform:uppercase;transition:background .3s,color .3s}
.bk-dbtn svg{width:26px;height:26px;fill:currentColor}
.bk-dbtn:hover{background:#fff;color:#000}
.bk-foot{grid-template-columns:1fr}