:root{
  --ink:#0f1722; --ink-deep:#0a1018; --ink-2:#17212e;
  --bone:#efe8d9; --bone-2:#e3dac6; --mute:#98a3b0; --mute-dark:#5d6772;
  --gold:#f2b440; --clay:#cf5a38;
  --sans:'Archivo','Helvetica Neue',Arial,sans-serif;
  --serif:'Newsreader','Iowan Old Style','Palatino Linotype',Charter,Georgia,serif;
  --gutter:clamp(20px,4.4vw,64px);
  --sky-bar:linear-gradient(to right,#7ea3c3,#b7cdcf,#f0dc9e,#f4b840,#ec8630,#d1523a,#98405a,#4b4276);
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--bone);font-family:var(--serif);font-size:19px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body::after{content:'';position:fixed;inset:0;background:var(--grain);opacity:.07;pointer-events:none;z-index:90;mix-blend-mode:multiply}
img,canvas,svg{display:block}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:left}
ol,ul{list-style:none;margin:0;padding:0}
h1,h2,h3,p,dl,dd,figure,blockquote{margin:0}
::selection{background:var(--gold);color:var(--ink)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.skip{position:absolute;left:12px;top:-60px;background:var(--gold);color:var(--ink);padding:10px 14px;font:600 14px var(--sans);z-index:100;transition:top .2s}
.skip:focus{top:12px}
.wrap{width:min(1240px,100% - var(--gutter)*2);margin-inline:auto}
.kicker{font:700 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:22px}

/* ---------- opening ---------- */
.hero{position:relative;min-height:max(100svh,720px);display:grid;grid-template-rows:auto 1fr auto;background:linear-gradient(to bottom,#a9bfcc 0%,#cfd9d3 42%,#efe3c6 78%,#f3dcae 100%);color:var(--ink);overflow:hidden;isolation:isolate}
.sky{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero .sky canvas{width:100%;height:100%}
.mast{position:relative;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px var(--gutter);font:600 13px/1 var(--sans);letter-spacing:.02em}
.mast-name{font-weight:800;text-decoration:none;letter-spacing:-.005em;font-size:15px}
.mast ul{display:flex;gap:clamp(14px,2.6vw,34px)}
.mast ul a{text-decoration:none;padding:6px 0;background:linear-gradient(currentColor,currentColor) 0 100%/0 1.5px no-repeat;transition:background-size .3s}
.mast ul a:hover{background-size:100% 1.5px}

.hero-stage{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:end;gap:clamp(24px,5vw,80px);width:min(1380px,100% - var(--gutter)*2);margin-inline:auto;padding:clamp(24px,5vh,64px) 0 clamp(0px,2vh,28px)}
.hero-text{padding-bottom:clamp(60px,10vh,100px)}
.hero .sky canvas{-webkit-mask-image:radial-gradient(ellipse 44% 32% at 16% 78%,rgba(0,0,0,.22),#000 100%);mask-image:radial-gradient(ellipse 44% 32% at 16% 78%,rgba(0,0,0,.22),#000 100%)}
.hero-artist{font:700 13px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin-bottom:clamp(14px,2.4vh,26px)}
.title{--fs:clamp(96px,17vw,262px);font-family:var(--sans);font-weight:800;font-size:var(--fs);line-height:.8;letter-spacing:-.052em;text-transform:lowercase;margin-left:-.04em}
.title .line{display:flex;align-items:baseline;white-space:nowrap}
.title .word{display:inline-flex}
.title .ch{display:inline-block;will-change:transform;font-variation-settings:'wdth' 88,'wght' 800;padding-bottom:.06em}
.title .vol{font:700 calc(var(--fs)*.15)/1 var(--sans);letter-spacing:-.01em;margin-left:.9em;align-self:flex-end;padding-bottom:.17em;white-space:nowrap}
.js .title .ch{opacity:0;transform:translateY(40%)}
.js.ready .title .ch{opacity:1;transition:opacity .7s calc(var(--i)*55ms + .15s),transform 1.1s cubic-bezier(.2,.8,.2,1) calc(var(--i)*55ms + .15s)}
.lede{font:italic 400 clamp(21px,2.1vw,28px)/1.22 var(--serif);max-width:20em;margin-top:clamp(22px,3.6vh,40px)}
.hero-actions{display:flex;align-items:center;gap:28px;margin-top:clamp(22px,3.4vh,36px);flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:14px;padding:16px 24px;background:var(--ink);color:var(--bone);font:700 14px/1 var(--sans);letter-spacing:.04em;text-decoration:none;transition:transform .25s,background .25s}
.btn span{display:inline-block;transition:transform .25s}
.btn:hover{background:#1f2c3d}.btn:hover span{transform:translateY(3px)}
.btn[href^=http]:hover span{transform:translate(2px,-2px)}
.link{font:700 14px/1 var(--sans);letter-spacing:.04em;text-decoration:none;padding-bottom:6px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;transition:background-size .3s}
.link:hover{background-size:0 1.5px;background-position:100% 100%}

.sleeve{justify-self:end;width:min(100%,440px);margin-bottom:-36px;position:relative;z-index:2}
.sleeve-tilt{perspective:1100px}
.sleeve-art{position:relative;aspect-ratio:1;background:#c8c2b0;transform:rotate(-2.4deg) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d;transition:transform .35s cubic-bezier(.2,.8,.2,1);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 2px 3px rgba(11,18,27,.25),0 22px 40px -8px rgba(11,18,27,.45),0 60px 90px -20px rgba(11,18,27,.4);overflow:hidden}
.sleeve-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s}
.sleeve-art img.loaded{opacity:1}
.sleeve-fallback{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:9%;background:radial-gradient(circle at 70% 30%,#fff3d4 0 11%,transparent 11.5%),linear-gradient(to top,#0f1722 0 22%,transparent 22.2%),linear-gradient(to bottom,#7ea3c3,#f0dc9e 70%,#f4b840);color:var(--ink);transition:opacity .6s}
.sleeve-fallback span{font:800 clamp(46px,7vw,92px)/.8 var(--sans);letter-spacing:-.05em;color:#fff3d4;position:relative;top:-.4em;text-transform:lowercase}
.sleeve-fallback i{font:700 14px var(--sans);font-style:normal;color:#fff3d4;position:relative;top:-6px}
.sleeve-art img.loaded~.sleeve-fallback{opacity:0;pointer-events:none}
.sleeve-sheen{position:absolute;inset:0;background:radial-gradient(500px circle at var(--mx,30%) var(--my,20%),rgba(255,255,255,.22),transparent 55%);mix-blend-mode:soft-light;pointer-events:none}
.sleeve figcaption{font:600 11px/1.5 var(--sans);letter-spacing:.1em;text-transform:uppercase;margin-top:20px;opacity:.7;text-align:right}
.js .sleeve{opacity:0;transform:translateY(40px)}
.js.ready .sleeve{opacity:1;transform:none;transition:opacity 1s .5s,transform 1.4s .5s cubic-bezier(.2,.8,.2,1)}

.land{position:relative;z-index:1;background:var(--ink);color:var(--bone);padding:clamp(26px,4vh,40px) var(--gutter) clamp(26px,4vh,40px);margin-top:0}
.ridge{position:absolute;left:0;top:-89px;width:100%;height:90px;fill:var(--ink);z-index:-1}
.facts{display:grid;grid-template-columns:repeat(4,auto);gap:clamp(18px,4vw,64px);justify-content:start;width:min(1380px,100%);margin-inline:auto}
.facts dt,.stage-meta dt,.credits dt{font:700 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:9px}
.facts dd{font:700 18px/1.2 var(--sans);letter-spacing:-.005em}
.gauge{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:14px;font:600 12px/1.45 var(--sans);color:var(--mute);letter-spacing:.02em}
.gauge strong{color:var(--bone);font-weight:700}
.gauge-arrow{width:26px;height:26px;color:var(--gold);transform-origin:50% 50%}
.gauge-pause{margin-left:10px;font:700 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;padding:9px 12px;border:1px solid rgba(239,232,217,.3);color:var(--bone);transition:background .2s,color .2s}
.gauge-pause:hover,.gauge-pause[aria-pressed=true]{background:var(--bone);color:var(--ink)}
@media(min-width:901px) and (max-width:1220px){.gauge p{display:none}.facts{grid-template-columns:repeat(4,auto)}}

/* ---------- the hour ---------- */
.room{background:var(--ink);padding:clamp(80px,11vw,150px) 0 clamp(80px,10vw,140px)}
.room-head{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr);gap:clamp(28px,6vw,96px);align-items:end}
h2 .nb,.v-name .nb{white-space:nowrap}
h2{font:800 clamp(40px,6vw,92px)/.94 var(--sans);letter-spacing:-.04em;font-variation-settings:'wdth' 90;text-wrap:balance}
.room-intro{font-size:19px;color:#c9c8bd;max-width:24em;padding-bottom:.7em}
.hour{position:relative;display:flex;height:clamp(64px,8vw,92px);margin-top:clamp(40px,6vw,72px);background:var(--sky-bar)}
.seg{position:relative;height:100%;border-left:2px solid var(--ink);background:rgba(10,16,24,.5);transition:background .35s;cursor:pointer;overflow:hidden}
.seg:first-child{border-left:0}
.seg:hover{background:rgba(10,16,24,.22)}
.seg.on{background:rgba(10,16,24,0)}
.seg span{position:absolute;left:9px;top:8px;font:800 12px/1 var(--sans);color:var(--on,#0b121b);opacity:0;transition:opacity .3s}
.seg.on span,.seg:hover span{opacity:1}
.hour-scale{position:relative;height:30px;margin-top:10px;font:600 12px/1 var(--sans);color:var(--mute);letter-spacing:.04em}
.hour-scale span{position:absolute;top:0;transform:translateX(-50%);padding-top:12px}
.hour-scale span::before{content:'';position:absolute;left:50%;top:0;width:1px;height:8px;background:rgba(239,232,217,.35)}
.hour-scale span:first-child{transform:none}.hour-scale span:first-child::before{left:0}
.hour-scale span:last-child{transform:translateX(-100%)}.hour-scale span:last-child::before{left:auto;right:0}

.room-body{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(36px,6vw,92px);margin-top:clamp(36px,5vw,64px);align-items:start}
.tracks{border-top:1px solid rgba(239,232,217,.16)}
.track{border-bottom:1px solid rgba(239,232,217,.16)}
.track>button{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:baseline;width:100%;padding:19px 0;position:relative;transition:padding .35s cubic-bezier(.2,.8,.2,1),color .3s}
.track>button::before{content:'';position:absolute;left:-18px;top:50%;width:8px;height:8px;border-radius:50%;background:var(--c,var(--gold));transform:translateY(-50%) scale(0);transition:transform .35s}
.t-no{font:700 13px/1 var(--sans);color:var(--mute);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.t-name{font:700 clamp(19px,2vw,26px)/1.12 var(--sans);letter-spacing:-.02em;font-variation-settings:'wdth' 96}
.t-name small{display:block;font:italic 400 16px/1.3 var(--serif);letter-spacing:0;color:var(--mute);margin-top:5px}
.t-len{font:600 13px/1 var(--sans);color:var(--mute);font-variant-numeric:tabular-nums}
.track>button:hover{padding-left:10px}
.track.on>button{padding-left:12px}
.track.on>button::before{transform:translateY(-50%) scale(1)}
.track.on .t-name{color:var(--c,var(--gold))}
.track.on .t-no,.track.on .t-len{color:var(--bone)}
.fine{font:500 13px/1.5 var(--sans);color:var(--mute);margin-top:20px;max-width:30em}
.js .track .note{display:none}
.note{font-size:17px;color:#c9c8bd;padding:0 0 22px 56px}

.stagecol{position:relative;align-self:stretch}
.stage{position:sticky;top:24px;--c:var(--gold);--on:#0b121b}
.stage-art{position:relative;aspect-ratio:6/5;overflow:hidden;background:var(--ink-2)}
.stage-art canvas{position:absolute;inset:0;width:100%;height:100%}
.stage-art::after{content:'';position:absolute;inset:0;background:var(--grain);opacity:.28;mix-blend-mode:multiply;pointer-events:none}
.stage-no{position:absolute;left:clamp(14px,2vw,26px);top:clamp(8px,1.4vw,18px);font:800 clamp(64px,9.5vw,132px)/1 var(--sans);letter-spacing:-.06em;color:var(--on);font-variant-numeric:tabular-nums;z-index:2;transition:color .5s}
.stage-clock{position:absolute;right:clamp(14px,2vw,24px);top:clamp(16px,2.2vw,28px);font:700 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--on);z-index:2;transition:color .5s}
.stage-info{padding-top:26px;transition:opacity .3s}
.stage h3{font:800 clamp(32px,4vw,58px)/.98 var(--sans);letter-spacing:-.035em;font-variation-settings:'wdth' 92;text-wrap:balance}
.stage-with{font:italic 400 clamp(20px,2vw,26px)/1.2 var(--serif);color:var(--c);margin-top:10px}
.stage-meta{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:12px clamp(20px,3.4vw,52px);margin-top:26px;padding-top:22px;border-top:1px solid rgba(239,232,217,.16)}
.stage-meta dd{font:700 18px/1.15 var(--sans);font-variant-numeric:tabular-nums}
.stage-note{font-size:19px;color:#d4d2c6;max-width:30em;margin-top:22px;min-height:1.5em}
.stage-note:empty{display:none}
.stage-links{display:flex;align-items:center;gap:26px;margin-top:22px;flex-wrap:wrap}
.stage-links a{font:700 14px/1 var(--sans);letter-spacing:.04em;text-decoration:none;color:var(--ink);background:var(--c);padding:14px 20px;transition:filter .2s}
.stage-links a:hover{filter:brightness(1.1)}
.stage-hint{font:500 13px var(--sans);color:var(--mute)}
@media(hover:none){.stage-hint{display:none}}
.stage-info.swap{animation:swap .55s cubic-bezier(.2,.8,.2,1)}
@keyframes swap{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- player ---------- */
.play{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(36px,6vw,92px);margin-top:clamp(80px,10vw,150px);padding-top:clamp(40px,5vw,64px);border-top:1px solid rgba(239,232,217,.16)}
.play h3{font:800 clamp(34px,4.4vw,60px)/.98 var(--sans);letter-spacing:-.035em;margin-bottom:18px}
.play-copy p{color:#c9c8bd;max-width:24em}
.play .alt{margin-top:22px;display:flex;gap:22px;flex-wrap:wrap}
.play .alt a{font:700 14px var(--sans);letter-spacing:.03em;text-decoration:none;border-bottom:1.5px solid var(--gold);padding-bottom:5px;color:var(--bone)}
.play-box{min-height:232px;background:var(--ink-2);border-radius:14px;overflow:hidden;display:flex}
.play-box iframe{border:0;width:100%;height:352px;display:block}
.play-load{flex:1;display:flex;align-items:center;gap:clamp(18px,3vw,34px);padding:clamp(22px,3vw,40px);transition:background .3s}
.play-load:hover{background:#1d2a3a}
.play-disc{flex:none;width:clamp(96px,13vw,150px);aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,#0b121b 0 2px,#111b27 2px 4px);display:grid;place-items:center;animation:spin 14s linear infinite;box-shadow:0 18px 40px -12px rgba(0,0,0,.6)}
.play-disc i{width:36%;aspect-ratio:1;border-radius:50%;background:var(--sky-bar);position:relative}
.play-disc i::after{content:'';position:absolute;inset:44%;border-radius:50%;background:var(--ink)}
.play-text strong{display:block;font:800 clamp(24px,3vw,38px)/1 var(--sans);letter-spacing:-.03em}
.play-text small{display:block;font:500 14px var(--sans);color:var(--mute);margin-top:10px}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- liner notes ---------- */
.notes{background:var(--bone);color:var(--ink);padding:clamp(80px,11vw,150px) 0}
.notes .kicker{color:#a1641a}
.notes h2{max-width:11em}
.voices{margin-top:clamp(44px,6vw,80px);border-top:1.5px solid var(--ink)}
.voices li{border-bottom:1.5px solid var(--ink)}
.voices button{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(14px,3vw,48px);align-items:end;width:100%;padding:clamp(18px,2.4vw,30px) 0}
.v-name{font:800 clamp(40px,7.6vw,112px)/.92 var(--sans);letter-spacing:-.045em;font-stretch:80%;font-variation-settings:'wdth' 78,'wght' 800;transition:font-variation-settings .6s cubic-bezier(.2,.8,.2,1),color .3s,letter-spacing .6s;text-wrap:balance}
.voices button:hover .v-name,.voices button:focus-visible .v-name{font-variation-settings:'wdth' 118,'wght' 850;color:#a1641a;letter-spacing:-.055em}
.v-song{display:flex;flex-direction:column;align-items:flex-end;gap:8px;text-align:right;padding-bottom:.6em;white-space:nowrap}
.v-song em{font:italic 400 clamp(19px,2vw,28px)/1 var(--serif)}
.v-song b{font:700 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#6d6657}
.credits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px clamp(20px,3vw,44px);margin-top:clamp(40px,5vw,64px)}
.credits dt{color:#6d6657}
.credits dd{font-size:18px;line-height:1.35}
.credits sup a{font:700 11px var(--sans);text-decoration:none;color:#a1641a;margin-left:2px}

/* ---------- story ---------- */
.story{background:var(--ink-deep);padding:clamp(90px,12vw,170px) 0 clamp(90px,11vw,150px);overflow:hidden}
.big-quote h2{font:italic 400 clamp(42px,7.3vw,120px)/.98 var(--serif);letter-spacing:-.035em;font-variation-settings:normal;max-width:12.5em;text-wrap:balance}
.big-quote footer{font:700 12px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:30px}
.story-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,64px);margin-top:clamp(52px,7vw,96px);color:#cfcdc1}
.story-cols p{font-size:19px}
.timeline{position:relative;height:280px;margin-top:clamp(60px,8vw,110px)}
.timeline::before{content:'';position:absolute;left:0;right:0;top:50%;height:3px;background:var(--sky-bar);transform:translateY(-50%);border-radius:2px}
.timeline li{position:absolute;left:var(--x);width:min(250px,30vw);height:50%;top:0;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:26px}
.timeline li::after{content:'';position:absolute;left:0;bottom:-8px;width:14px;height:14px;border-radius:50%;background:var(--bone);box-shadow:0 0 0 5px var(--ink-deep);transform:translateX(-50%)}
.timeline li:first-child::after{transform:none}
.timeline li.down{top:50%;justify-content:flex-start;padding:26px 0 0}
.timeline li.down::after{bottom:auto;top:-8px}
.timeline li.end{left:auto;right:0;text-align:right;align-items:flex-end}
.timeline li.end::after{left:auto;right:0;transform:none}
.timeline b{font:800 clamp(34px,4.6vw,60px)/1 var(--sans);letter-spacing:-.04em;margin-bottom:10px}
.timeline span{font-size:16.5px;line-height:1.4;color:#c4c2b6}

/* ---------- close ---------- */
.close{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(to top,#c95a3c 0,#8c3f55 22%,#3b3563 52%,#161d33 78%,var(--ink-deep) 100%);padding:clamp(110px,15vw,210px) 0 clamp(110px,14vw,190px);text-align:left}
.close .sky{z-index:-1}
.close .sky canvas{width:100%;height:100%}
.close h2{font:800 clamp(64px,13vw,210px)/.84 var(--sans);letter-spacing:-.055em;font-variation-settings:'wdth' 86;margin-bottom:clamp(26px,4vw,48px)}
.close p{font:italic 400 clamp(20px,2.2vw,28px)/1.25 var(--serif);max-width:18em;color:#f3e6cf}
.close-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:clamp(28px,4vw,44px)}
.btn-light{background:var(--bone);color:var(--ink)}.btn-light:hover{background:#fff}
.btn-line{background:transparent;color:var(--bone);box-shadow:inset 0 0 0 1.5px rgba(239,232,217,.6)}.btn-line:hover{background:rgba(239,232,217,.12)}

.foot{background:var(--ink-deep);color:var(--mute);padding:34px 0 56px;font:500 13px/1.6 var(--sans)}
.foot-row{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;align-items:flex-start}
.foot-row p{max-width:44em}
.foot a{color:var(--bone)}
.sources{margin-top:22px;border-top:1px solid rgba(239,232,217,.12);padding-top:18px}
.sources summary{cursor:pointer;font-weight:700;color:var(--bone);letter-spacing:.02em}
.sources ol{list-style:decimal;margin:14px 0 0 20px;display:grid;gap:6px}
.sources li{padding-left:6px}

/* ---------- reveal ---------- */
.js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1)}
.js [data-reveal].in{opacity:1;transform:none}
.js .voices li[data-reveal]:nth-child(2){transition-delay:.08s}.js .voices li[data-reveal]:nth-child(3){transition-delay:.16s}

/* ---------- smaller screens ---------- */
@media(max-width:1000px){
  .room-body,.play{grid-template-columns:1fr}
  .stagecol{display:none}
  .track .stage{position:static;margin:4px 0 30px;display:block}
  .track .note{display:none!important}
  .credits{grid-template-columns:repeat(2,minmax(0,1fr))}
  .story-cols{grid-template-columns:1fr;max-width:34em}
}
@media(max-width:900px){
  .hero .sky canvas{-webkit-mask-image:none;mask-image:none}
  .hero{min-height:0}
  .hero-stage{grid-template-columns:1fr;padding-top:18px;gap:30px}
  .sleeve{justify-self:center;width:min(78%,360px);margin-bottom:-28px;margin-top:6px}
  .mast ul li:not(:last-child){display:none}
  .facts{grid-template-columns:repeat(2,auto);gap:22px 40px}
  .gauge{position:static;transform:none;margin-top:26px;padding-top:20px;border-top:1px solid rgba(239,232,217,.14)}
  .room-head{grid-template-columns:1fr}
  .room-intro{padding-bottom:0}
}
@media(max-width:700px){
  body{font-size:18px}
  .seg span{display:none}
  .hour{height:56px}
  .hour-scale span:nth-child(even){display:none}
  .voices button{grid-template-columns:1fr}
  .v-song{align-items:flex-start;text-align:left;flex-direction:row;align-items:baseline;gap:16px;padding-bottom:0}
  .timeline{height:auto;padding-left:26px;display:grid;gap:34px;margin-top:56px}
  .timeline::before{left:5px;right:auto;top:0;bottom:0;width:3px;height:auto;transform:none;background:linear-gradient(to bottom,#7ea3c3,#f4b840,#d1523a,#4b4276)}
  .timeline li,.timeline li.down,.timeline li.end{position:relative;left:auto;right:auto;top:auto;width:auto;height:auto;padding:0;text-align:left;align-items:flex-start}
  .timeline li::after,.timeline li.down::after,.timeline li.end::after{left:-26px;right:auto;top:8px;bottom:auto;transform:none;width:13px;height:13px}
  .close h2{font-size:clamp(60px,19vw,120px)}
  .stage-meta{grid-template-columns:repeat(2,auto)}
  .gauge-pause{margin-left:auto}
  .gauge p br{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js [data-reveal],.js .sleeve,.js .title .ch{opacity:1!important;transform:none!important;transition:none!important}
  .play-disc{animation:none}
}