/* Apeks v8.1 (3 Nov 2026, V8_1_PLAN.md), loaded after v7.css. v7.1 is the page; this sheet holds only what v8.1 adds:
   the "Get paid to work out." hero, the comeback arc, the guilt trips crossed out, the habit timeline,
   the three photo doors, questions grouped by audience and the form dialog.
   Engines: GSAP owns the arc's stroke, the Thursday glow, the strikes and the Apeks card (apeks.js, scrubbed, no pin);
   CSS owns every reveal (.rv.in) and the doors' swing. Still twins show every final state. */

/* ---------- hero: headline, descriptor, sub line, three door buttons ----------
   Canvas pixels (the take is drawn on 1586x992). Phones get the stacked twin below. */
@media (min-width:701px){
  .sc-hero h1{top:112px;font-size:66px;line-height:66px;letter-spacing:-.058em}
  .sc-hero .desc{position:absolute;left:0;right:0;top:192px;text-align:center;font-size:28px;line-height:32px;font-weight:700;letter-spacing:-.035em}
  .sc-hero .lede{top:246px;font-size:19px;line-height:26px}
  .hbtns{top:308px;gap:12px}
  .hbtns .btn{height:48px;font-size:17px;padding:0 26px}
}
.doorbtns .btn{text-decoration:none;white-space:nowrap}
.doorbtns .btn:not(.ghost){color:#fff}
.sc-hero .lede b{font-weight:700}
.nw{white-space:nowrap}
.hc-t small{display:inline-block;margin-top:6px;padding:3px 9px;border-radius:99px;background:#191A2010;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#3a3b42}
@media (max-width:700px){
  .sc-hero h1{font-size:46px;line-height:44px;text-wrap:balance}
  .sc-hero .desc{position:relative;inset:auto;margin-top:12px;text-align:center;font-size:21px;line-height:25px;font-weight:700;letter-spacing:-.03em;padding:0 8px}
  .sc-hero .lede{font-size:16px;margin-top:12px}
  .hbtns.doorbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
  .hbtns.doorbtns .btn{min-height:46px;height:auto;padding:10px 14px;font-size:16px;white-space:normal;text-align:center}
  .hbtns.doorbtns .btn:first-child{grid-column:1 / -1}
}

/* ---------- the comeback: Monday, the blank Tuesday, an arc to Thursday ---------- */
.d7wrap{position:relative;padding-top:10.5%} /* room for the arc, as a share of the week's width so it scales with it */
.arc7{position:absolute;left:0;top:0;width:100%;height:auto;aspect-ratio:1000/120;overflow:visible;pointer-events:none}
.arc7 path{fill:none;stroke:var(--coral);stroke-width:6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:0;
  filter:drop-shadow(0 6px 10px #FF725E66)}
.comeback5 .d.cb{box-shadow:0 0 0 calc(var(--glow,1) * 3px) #FF725E,0 calc(var(--glow,1) * 26px) calc(var(--glow,1) * 50px) -18px #FF725Ecc}
.comeback5 .fcopy{max-width:760px;margin-left:auto;margin-right:auto}

/* ---------- guilt: the guilt trip, shown, then crossed out ---------- */
.nags{position:relative;display:grid;gap:14px;max-width:560px;margin:clamp(40px,4.6vw,64px) auto 0}
.nag{position:relative;display:flex;align-items:center;gap:16px;padding:18px 22px;border-radius:24px;text-align:left;
  background:linear-gradient(160deg,#ffffff1c,#ffffff0a);border:1px solid #ffffff21;color:#F7F7F2;
  box-shadow:inset 0 1px 0 #ffffff1f,0 30px 50px -36px #000;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.nag.n1{rotate:-2deg;translate:-26px 0}.nag.n2{rotate:1.5deg;translate:22px 0}.nag.n3{rotate:-1deg;translate:-10px 0}
.nag:not(.ok){opacity:.5} /* the struck state; GSAP scrubs it from full strength as each strike lands */
.ni{flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#ffffff1f}
.nt small{display:block;font-size:12.5px;letter-spacing:.04em;color:#F7F7F2a6}
.nt b{display:table;margin-top:2px;font-size:clamp(19px,1.6vw,23px);line-height:1.2;letter-spacing:-.02em;font-weight:700}
.nt span{display:block;margin-top:2px;font-size:16px;color:#3a3b42}
.nt b{position:relative}
.nag .x{position:absolute;left:-6px;right:-8px;top:54%;height:4px;border-radius:4px;background:var(--coral);transform-origin:0 50%;box-shadow:0 0 14px #FF725E99}
.ni svg{width:22px;height:22px;color:#F7F7F2b3}
.nolist .fline{color:#F7F7F2c7}
.nag.ok{margin-top:10px;background:linear-gradient(160deg,#FFFFFF,#F4F1FB);border-color:#fff;color:var(--ink);
  box-shadow:inset 0 1px 0 #fff,0 0 0 6px #FF725E1f,0 40px 80px -30px #FF725E88}
.nag.ok .ni{background:var(--coral);color:var(--ink)}.nag.ok .ni svg{width:26px;height:auto}
.nag.ok small{color:#5d5e66;font-weight:700;letter-spacing:.14em}
.illus{margin-top:18px;text-align:center;font-size:12px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:#F7F7F27a}
@media (max-width:700px){.nag.n1,.nag.n2,.nag.n3{translate:0 0}.nag{padding:16px 18px}}

/* ---------- research: the habit timeline under the two charts ---------- */
.chart5.habit{grid-column:1 / -1}
.tl7{padding:34px 4px 0}
.tl-track{position:relative;height:22px;border-radius:99px;background:#191A2012}
.tl-fill,.tl-range{position:absolute;top:0;bottom:0;left:0;border-radius:99px;transform-origin:0 50%;transition:transform 1.4s var(--ease) .2s}
.tl-fill{right:0;background:linear-gradient(90deg,#C5B7EB66,#C5B7EB)}
.tl-range{left:57.14%;right:0;background:linear-gradient(90deg,#FF8A70,#F25F49);box-shadow:0 14px 30px -14px #FF725E99;transition-delay:1.2s}
.tl-gap{position:absolute;top:-4px;bottom:-4px;left:28.6%;width:3px;border-radius:2px;background:#F7F7F2;box-shadow:0 0 0 1px #191A2014}
.tl-gl{position:absolute;bottom:calc(100% + 8px);left:28.6%;translate:-50% 0;white-space:nowrap;font-size:13px;font-weight:600;color:#45464d}
.js .habit:not(.in) .tl-fill,.js .habit:not(.in) .tl-range{transform:scaleX(0)}
.tl-m{list-style:none;margin:12px 0 0;padding:0;display:flex;justify-content:space-between;font-size:13px;color:var(--mute);font-variant-numeric:tabular-nums}
.tl-u{margin-top:4px;text-align:center;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}

/* ---------- the three doors: tall photo panels with a floating overlay each ---------- */
.doors{padding:clamp(80px,9vw,140px) 0 clamp(60px,7vw,110px)}
.dprow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,26px);margin-top:clamp(36px,4.4vw,60px);perspective:1800px}
.dp{position:relative;isolation:isolate;min-height:clamp(540px,46vw,660px);border-radius:28px;overflow:hidden;color:#fff;background:#191A20;
  box-shadow:inset 0 1px 0 #ffffff40,0 50px 80px -46px #191A20aa,0 0 0 1px #191A2014;
  transition:translate .5s var(--ease),box-shadow .5s var(--ease)}
.dp-ph{position:absolute;inset:0;z-index:-2}
.dp-ph img{width:100%;height:100%;object-fit:cover;transition:scale 1.2s var(--ease)}
.dp-m .dp-ph img{object-position:50% 40%}.dp-g .dp-ph img{object-position:40% 50%}.dp-b .dp-ph img{object-position:50% 30%}
.dp::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#191A2000 25%,#191A20a6 50%,#191A20f2 100%)}
.dp:hover .dp-ph img{scale:1.04}
.dp-ov{position:absolute;top:22px;left:22px;right:22px;display:flex}
.dp-tx{position:absolute;left:0;right:0;bottom:0;padding:clamp(22px,2.4vw,32px)}
.dtag{font-size:12px;font-weight:700;letter-spacing:.2em;color:#F7F7F2cc}
.dp h3{margin:10px 0 0;font-size:clamp(26px,2.3vw,34px);line-height:1.04;letter-spacing:-.04em;font-weight:800;color:#fff;text-wrap:balance}
.dp-tx>p:not(.dtag){margin-top:10px;font-size:clamp(16px,1.2vw,18px);line-height:1.4;color:#F7F7F2e0;max-width:30ch}
.dp-tx .btn.dbtn{position:relative;left:auto;top:auto;width:auto;height:auto;display:inline-flex;min-height:48px;margin-top:20px;padding:12px 24px;border:0;cursor:pointer;
  background:var(--chalk);color:var(--ink);font:700 16px Satoshi,system-ui,sans-serif}
.dp-tx .btn.dbtn:hover{background:#fff}
.dp-tx .btn.dbtn:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.dp-tx .more{display:inline-flex;margin:20px 0 0 18px;color:#fff;font-weight:600}
.dp-tx .more:focus-visible{outline-color:#fff}
.dp.pick{translate:0 -10px;box-shadow:inset 0 1px 0 #ffffff40,0 0 0 3px var(--coral),0 60px 90px -40px #FF725E99}
/* the ticket and the ghost list float over the photo */
.tkt{position:relative;width:min(100%,262px);padding:18px 20px 16px;border-radius:16px;background:linear-gradient(160deg,#FFFDF8,#F6EFE3);color:var(--ink);rotate:-5deg;
  box-shadow:0 30px 50px -20px #000b,0 2px 0 #fff inset;
  -webkit-mask:radial-gradient(circle 10px at 0 64%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 10px at 100% 64%,#0000 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 10px at 0 64%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 10px at 100% 64%,#0000 98%,#000) right/51% 100% no-repeat}
.tkt b{display:block;margin-top:6px;font-size:clamp(28px,2.4vw,34px);letter-spacing:-.04em;line-height:1}
.tkt .tk-eb{color:#C93F2A}
.tkt .tk-pilot{margin-top:14px}
.dp-m .dp-ov,.dp-b .dp-ov{justify-content:flex-end}
.ghostc{width:min(100%,262px);padding:16px 16px 10px;border-radius:18px;background:#191A20b8;border:1px solid #ffffff26;rotate:3deg;
  box-shadow:0 30px 50px -24px #000c;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.gh-h{font-size:11px;font-weight:700;letter-spacing:.16em;color:#F7F7F2a6}
.gh-r{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid #ffffff14;font-size:13px}
.gh-h+.gh-r{margin-top:8px}
.gh-r i{flex:none;width:22px;height:22px;border-radius:50%;background:#ffffff2e}
.gh-r u{flex:1;height:7px;border-radius:7px;background:#ffffff1f}
.gh-r em{font-style:normal;color:#F7F7F2a6;white-space:nowrap}
.gh-r:nth-child(3){opacity:.85}.gh-r:nth-child(4){opacity:.7}.gh-r:nth-child(6){opacity:.55}
.gh-r.back{margin:0 -8px;padding:9px 8px;border-radius:12px;border-top-color:transparent;background:var(--coral);color:var(--ink);box-shadow:0 12px 24px -12px #FF725Ecc}
.gh-r.back i{background:#191A2033}.gh-r.back u{background:#191A2026}.gh-r.back em{color:var(--ink);font-weight:700}
.gh-r.back+.gh-r{border-top-color:transparent}
.dnote{margin:clamp(24px,3vw,40px) auto 0;max-width:62ch;text-align:center;font-size:15px;line-height:1.5;color:#45464d}
/* the swing: each door opens on its left hinge as the row enters (CSS, no pin). The row is the observed element,
   because a fully clipped element never reports itself as visible */
.js .dprow.rv{opacity:1;translate:0 0;scale:1}
.js .dprow .dp{transform-origin:0 50%;clip-path:inset(0 100% 0 0 round 28px);transform:rotateY(-38deg);
  transition:clip-path 1.1s var(--ease),transform 1.3s var(--ease),translate .5s var(--ease),box-shadow .5s var(--ease)}
.js .dprow.in .dp{clip-path:inset(0 0 0 0 round 28px);transform:none}
.js .dprow .dp:nth-child(2){transition-delay:.14s,.14s,0s,0s}.js .dprow .dp:nth-child(3){transition-delay:.28s,.28s,0s,0s}
@media (prefers-reduced-motion:reduce){.js .dprow .dp{clip-path:none;transform:none;transition:none}.dp:hover .dp-ph img{scale:1}.dp.pick{translate:0 0}}
@media (max-width:1000px){
  .dprow{grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto}
  .dp{min-height:clamp(580px,150vw,640px)}
}
/* still twin: first light into day, carried by the doors */
.still .doors{background:linear-gradient(var(--peach),var(--chalk) 70%)}
.still .soon{background:var(--chalk)}

/* ---------- questions, grouped by audience ---------- */
.qg{margin:34px 0 0;font-size:13px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--blue)}
.qs .qg:first-child{margin-top:22px}

/* ---------- the form dialog (forms.js) ---------- */
#notify .pending{margin-top:14px}
#notify .pending a{color:var(--blue);font-weight:700;overflow-wrap:anywhere}


/* ================= v8.3 polish (3 Nov 2026): the independent review, ranked ================= */
/* the night chapters own their night with soft 110px fades; the sky only ever blends light colours */
.comeback5{background:var(--night)}
.still .comeback5{background:linear-gradient(#191A2000,var(--night) 110px)} /* motion off has no hand-off, so it keeps a soft edge */
.nolist,.still .nolist{background:var(--night)}
.t2 .stage,.still .t2,.still .t2 .stage{background:var(--night)}
.still .rooms5{background:linear-gradient(var(--night),#191A2000 110px)}
.take.t2,.still .take.t2{background:var(--night)} /* the pinned story and its spacer stay night, so no sky shows between the chapters */
.comeback5{padding-bottom:clamp(64px,7vw,110px)}
.proof{padding-bottom:clamp(48px,5vw,90px)}
.doors{padding-top:clamp(56px,6vw,100px)}
.faq{padding-top:clamp(56px,7vw,120px)}
/* take 1: how it works on a warm lit stage; the art 1.3x so it shares the frame with the lines (desktop canvas px) */
.sc-mon::before{content:"";position:absolute;left:343px;top:-200px;width:900px;height:900px;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,#FFB49A47,#C5B7EB2e 55%,#F7F7F200)}
html:not(.phc):not(.still) .art{transform:scale(1.3);transform-origin:793px 250px}
html:not(.phc):not(.still) .rest-mon{left:728px;top:152.5px;width:130px}
/* the hero tabs clear the phone's bezel; the label sits level with them */
@media (min-width:701px){html:not(.phc) .pill{top:900px}html:not(.phc) .sample{top:913px}}
/* the comeback: the credit chip sits above Thursday, readable, with the arc landing on it */
.cbt{top:auto;bottom:calc(100% + 6px);padding:5px 11px;font-size:clamp(11px,.9vw,13px);font-weight:700}
/* the research in the lit glass card language; each value sits on its own bar; sources as one quiet caption */
.chart5{background:linear-gradient(160deg,#FFFFFFb8,#FFFFFF59);border:1px solid #ffffffcc;-webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);
  box-shadow:inset 0 1px 0 #fff,0 40px 70px -42px #8a4a3266,0 0 90px -40px #FF725E55}
.b2{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;height:calc(clamp(110px,11vw,160px) + 84px)}
.b2 b,.b2 i,.b2 span{order:0}
.chart5 .src{margin-top:10px;font-size:12px;line-height:1.5;color:#6b6660;max-width:52ch;text-wrap:balance}
/* coming soon in the same lit card language: a highlight from the top left, a tinted glow, lighter photo shade */
.collage .tl:not(.tl-photo){border-color:#ffffffb3;box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px #ffffff66,0 40px 60px -40px #191A2066}
.collage .tl-apex{background-image:radial-gradient(120% 90% at 0% 0%,#ffffffb3,#ffffff00 55%),linear-gradient(160deg,#FFE7DF,#FFD3C6);box-shadow:inset 0 1px 0 #fff,0 40px 70px -40px #F25F4966,0 0 100px -40px #FF725E66}
.collage .tl-meter{background-image:radial-gradient(120% 90% at 0% 0%,#ffffffb3,#ffffff00 55%),linear-gradient(160deg,#FCF8E0,#F6EFC2)}
.collage .tl-duo{background-image:radial-gradient(120% 90% at 0% 0%,#ffffffb3,#ffffff00 55%),linear-gradient(160deg,#F6F2FD,#E9E1FA)}
.tl-photo::before{background:linear-gradient(180deg,#191A2000 0%,#191A2059 46%,#191A20d9 100%)}
.tl-apex{position:relative;overflow:hidden}
.apex-g{position:absolute;right:5%;top:50%;translate:0 -50%;width:min(42%,290px);height:auto;filter:drop-shadow(0 26px 34px #F25F4940)}
.tl-apex>:not(.apex-g){position:relative;max-width:56%}
/* questions: the heading stays with its list */
.faq-grid{align-items:start}
@media (min-width:701px){.faq h2{position:sticky;top:120px}}
/* story: the gym's thank-you card is no longer covered by the Monday room card */
@media (min-width:701px){html:not(.phc) .c-ten{left:1292px;top:2px}}
/* doors: one CTA row on every door */
.dp-ph{background:#2a2b31}
.dp-tx .btn.dbtn{padding:12px 20px;font-size:15.5px}
.dp-tx .more{margin-left:14px;white-space:nowrap}
/* the club: reels get the reel look (a slight tilt, a lit shadow); the caption reads on first light */
.reel li{box-shadow:0 26px 44px -22px #50281499}
.reel li:nth-child(odd){rotate:-1.5deg}.reel li:nth-child(even){rotate:1.2deg}
.rooms5 .illus{color:#7d6e64}
/* one focus ring, visible on night and on day */
.comeback5 :focus-visible,.nolist :focus-visible,.t2 :focus-visible{outline-color:#C9B8FF}
/* centred two-line lines break evenly */
.msub,.fsec .fline,.close .cc p,.dnote{text-wrap:balance}
/* the questions' audience tabs (every screen) */
.qtabs{display:flex;gap:4px;margin:16px 0 4px;padding:4px;border-radius:99px;background:#191A200f;max-width:520px}
.qtabs button{flex:1;min-height:42px;border:0;border-radius:99px;background:none;font:600 14px Satoshi,system-ui,sans-serif;color:#45464d;cursor:pointer;white-space:nowrap}
.qtabs button:hover{color:var(--ink)}
.qtabs button[aria-selected="true"]{background:var(--ink);color:#fff}
.swdots{display:none}


/* ================= v8.4 (3 Nov 2026): hand-offs, clearer doors, the phone story path ================= */

/* the doors: who it is for, first and big; the whole card is one tap target */
.dp{cursor:pointer}
.dp-who{position:absolute;left:18px;top:18px;z-index:2;display:flex;align-items:center;gap:11px;max-width:calc(100% - 36px);padding:7px 14px 7px 7px;border-radius:99px;
  background:#191A20b3;border:1px solid #ffffff26;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 16px 30px -18px #000c}
.dw-i{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--ink)}
.dw-i svg{width:20px;height:20px}
.dp-m .dw-i{background:var(--coral)}.dp-g .dw-i{background:var(--lav)}.dp-b .dw-i{background:var(--yellow)}
.dw-t b{display:block;font-size:17px;line-height:1.1;letter-spacing:-.02em;white-space:nowrap}
.dw-t small{display:block;margin-top:2px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#F7F7F2b3}
.dw-n{margin-left:6px;font-size:12px;font-weight:700;color:#F7F7F280;font-variant-numeric:tabular-nums}
.dp-ov{top:86px}
.dp-tx h3{margin-top:0}
.dbtn span{margin-left:6px;transition:translate .3s var(--ease)}
.dp:hover .dbtn span{translate:4px 0}
@media (hover:hover) and (pointer:fine){.dp:hover{translate:0 -6px;box-shadow:inset 0 1px 0 #ffffff40,0 60px 90px -44px #191A20bb,0 0 0 1px #191A2014}}
.dtabs{display:none}
.spath{display:none}
.t2 .stage{-webkit-mask-image:none;mask-image:none} /* v7 faded the story's edges into the sky; the doorway hand-off replaces that */
/* v8.4: the door label reads first; each door's read-more link sits in the same top-right corner */
.dp-who{padding:8px 16px 8px 8px}
.dw-i{width:44px;height:44px}.dw-i svg{width:22px;height:22px}
.dw-t b{font-size:19px}
.dp-ov{top:96px}
.dp-more{position:absolute;right:18px;top:24px;z-index:2;padding:8px 12px;border-radius:99px;background:#F7F7F2e6;color:var(--ink);font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap;box-shadow:0 10px 20px -12px #000a}
.dp-more:hover{background:#fff}.dp-more:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.dp-m .dp-ov,.dp-b .dp-ov{top:110px}
@media (max-width:1180px) and (min-width:1001px){.dp-more{top:auto;bottom:24px}.dw-n{display:none}}
.dw-n{display:none} /* the label and the link share the top row; the count added clutter */
@media (max-width:1320px) and (min-width:1001px){.dp-who{padding-right:12px}.dw-t b{font-size:17px}.dw-i{width:38px;height:38px}.dp-more{font-size:12px;padding:7px 10px}}

/* ================= v8.5 (3 Nov 2026): the final review ================= */
/* the travelling phone's dark screen reaches the frame's edge, so no old colour shows while it grows */
/* no bridge of empty screen after a hand-off: the next chapter arrives at once */
html:not(.still) .comeback5{padding-top:clamp(40px,4vw,72px)}
html:not(.still) .rooms5{padding-top:clamp(48px,5vw,88px)}
/* the day after the doorway: the light chapters sit on chalk in motion-off too */
.still .rooms5{background:linear-gradient(var(--night),#191A2000 110px)}
.still .proof,.still .doors{background:var(--chalk)}
/* card titles break evenly */
.sc-card b{text-wrap:balance}
/* the brand door gets its own object: a yellow gift tag on a string, not the members' ticket */
.tkt.gtag{background:linear-gradient(160deg,#FBF4B8,#EEE58C);rotate:6deg;-webkit-mask:none;mask:none;border-radius:14px 14px 14px 40px;padding-left:34px}
.tkt.gtag::before{content:"";position:absolute;left:12px;top:50%;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;background:#191A2066;box-shadow:inset 0 1px 2px #0006}
.tkt.gtag::after{content:"";position:absolute;left:-46px;top:50%;width:52px;height:2px;background:#d9c9a3;rotate:-18deg;transform-origin:100% 50%}
.tkt.gtag .tk-eb{color:#7a5a00}
/* 1366x768: the heading and a whole door fit one screen */
@media (min-width:1001px) and (max-height:820px){.dp{min-height:min(clamp(540px,46vw,660px),calc(100vh - 120px))}}
/* v8.5: the hand-off into the night grows from Thursday's arrow (geometry and motion set by apeks.js) */
.cbp{position:absolute;z-index:8;border-radius:50%;opacity:0;visibility:hidden;display:grid;place-items:center;transform-origin:50% 50%;box-shadow:0 18px 30px -14px #2C52D088}
.cbp svg{width:62%;height:62%}
.still .cbp{display:none}
/* v8.5: into the day after the story: the club rises over it as a sheet with a clean edge; it overlaps the pin's last screen */
html:not(.still) .take.t2 .stage{z-index:1}
html:not(.still) .rooms5{position:relative;z-index:3;margin-top:-100vh;background:var(--chalk);border-radius:36px 36px 0 0;box-shadow:0 -40px 90px -30px #000d}
.t2-dim{position:absolute;inset:0;z-index:5;background:var(--night);opacity:0;pointer-events:none}
.t2 .stage>.cv{z-index:1}

/* ================= v8.6 (3 Nov 2026) ================= */
/* the story's glow feathers out before the stage's top edge, so the night above and the story are one surface */
.t2 .studio{-webkit-mask-image:linear-gradient(transparent 0,#000 30%);mask-image:linear-gradient(transparent 0,#000 30%)}

/* the brand tag no longer pretends to hang from the photo's twine: a clean yellow sticker label, the members' ticket's sibling */
.tkt.gtag{padding-left:20px;border-radius:16px;rotate:5deg}
.tkt.gtag::before,.tkt.gtag::after{display:none}

/* ================= v9 (3 Nov 2026) ================= */
/* a door card goes to its own page; only the button opens the form */
.dp-cover{position:absolute;inset:0;z-index:1}
.dp-who,.dp-more{z-index:3}
.dp-tx{z-index:2;pointer-events:none}
.dp-tx a,.dp-tx button{pointer-events:auto}
.dp-link{color:inherit;text-decoration:none}
.dp-link:focus-visible{outline:3px solid #fff;outline-offset:4px;border-radius:6px}
.dp-tx .btn.dbtn{position:relative;z-index:3}
.dp-ov{top:104px}
