/* ==========================================================================
   Last Day — "gilded" theme, dark (28 Sep 2026)
   Near-black ground, metallic gold gradient (the original button), light ink. Square corners, hairline and double
   rules, photos framed like book plates. No glows, no glass, no gradients on
   surfaces, no blur. Loaded after app.css and overrides it.
   ========================================================================== */
:root{
  --bg:#0b1219; --paper:#0b1219; --paper2:#111217; --panel:#111217;
  --card:#111217; --card2:#15171c;
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.17);
  --text:#f3eee5; --dim:#aab0bc; --mute:#737a87;
  --gold:#c9972c; --gold2:#f2cf6b; --gold3:#fff1cf; --gold-leaf:#d9a932; --gold-ink:#0b1219; --gold-soft:rgba(217,169,50,.12);
  --gold-grad:linear-gradient(135deg,#f2cf6b 0%,#d9a932 45%,#a8741c 100%);
  --red:#cc3f35; --red2:#ff6255; --red-soft:rgba(204,63,53,.13);
  --blue:#93a9c8;
  --r:14px; --r-sm:8px;
  --display:'Noto Serif Display',Georgia,serif;
  --serif:'Noto Serif Display',Georgia,serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --rule:3px double rgba(217,169,50,.7);
}
html{background:var(--paper)}
body{background:var(--paper);color:var(--text)}
/* paper grain instead of film grain; certificate frame instead of the vignette */
body::after{display:none}
body::before{background:none;inset:7px;border:3px double rgba(184,135,46,.75);z-index:41}
::selection{background:rgba(184,135,46,.3)}
:focus-visible{outline:2px solid var(--text);outline-offset:3px;border-radius:var(--r)}
#amb{display:none}
@media (min-width:520px){#app{box-shadow:none;border-left:1px solid var(--line);border-right:1px solid var(--line);background:var(--paper)}}

/* ---------- shell ---------- */
.top{height:60px;background:var(--paper);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:var(--rule)}
.top.clear{position:sticky;background:var(--paper)}
.top.clear .brand{text-shadow:none}
.brand{font-family:var(--serif);font-weight:700;font-size:14px;letter-spacing:.42em;color:var(--text)}
.brand svg{color:var(--gold)}
.iconbtn{border-radius:var(--r);color:var(--text)}
@media (hover:hover){.iconbtn:hover{background:var(--gold-soft)}}
.progress{height:4px;top:60px;background:transparent;border-bottom:1px solid var(--line)}
.progress.over{position:sticky}
.progress i{background:var(--gold)}
.progress i::after{width:9px;height:9px;margin-top:-4.5px;right:-4px;border-radius:var(--r);background:var(--gold);box-shadow:none;border:1.5px solid var(--paper)}
.screen{padding:26px 24px 28px}
.screen.flush{padding:0 0 28px}
@keyframes out{to{opacity:0;transform:translateY(-8px)}}
@keyframes outb{to{opacity:0;transform:translateY(8px)}}
.pad{padding:0 24px}

/* ---------- type ---------- */
.eyebrow{gap:9px;font-family:var(--serif);font-size:12.5px;font-weight:400;font-style:italic;letter-spacing:.02em;text-transform:none;color:var(--gold2);margin-bottom:12px}
.eyebrow::before,.center .eyebrow::after,.sec > .eyebrow::after{content:"";width:7px;height:7px;background:var(--gold);opacity:1}
.eyebrow.red{color:var(--red)}.eyebrow.red::before,.center .eyebrow.red::after{background:var(--red)}
.eyebrow.blue{color:var(--blue)}
h1,.h1{font-family:var(--display);font-weight:400;font-size:40px;line-height:1.06;letter-spacing:-.01em;color:var(--text)}
h2,.h2{font-family:var(--display);font-weight:400;font-size:31px;line-height:1.1;letter-spacing:-.005em}
h3{font-family:var(--serif);font-weight:700;font-size:21px}
.lead{color:var(--dim);font-size:16px;line-height:1.6}
.gold,.hl{color:var(--gold2)} .red,.hr{color:var(--red)}
.small{color:var(--mute)}

/* ---------- buttons: flat gold leaf, square, inner rule ---------- */
.btn{height:58px;border-radius:var(--r);font-family:var(--sans);font-weight:700;font-size:13.5px;letter-spacing:.16em;text-transform:uppercase}
.btn:active{transform:translateY(2px)}
.btn-gold{color:var(--gold-ink);background:var(--gold-leaf);box-shadow:inset 0 0 0 4px var(--gold-leaf),inset 0 0 0 5px rgba(28,23,18,.55),0 3px 0 #7d5a17}
.btn-gold:active{box-shadow:inset 0 0 0 4px var(--gold-leaf),inset 0 0 0 5px rgba(28,23,18,.55),0 1px 0 #7d5a17}
.btn-gold::after{display:none}
@media (hover:hover){.btn-gold:hover{background:#d9a932;box-shadow:inset 0 0 0 4px #d9a932,inset 0 0 0 5px rgba(28,23,18,.55),0 3px 0 #7d5a17}}
.btn-line{border:1px solid var(--text);color:var(--text);background:transparent}
@media (hover:hover){.btn-line:hover{border-color:var(--text);background:var(--gold-soft)}}
.btn-red{color:#f3eee5;background:var(--red);box-shadow:inset 0 0 0 4px var(--red),inset 0 0 0 5px rgba(255,255,255,.45),0 3px 0 #5c1813}
.btn[disabled]{opacity:.35}
.btn svg{display:none}
.link{color:var(--mute)}
@media (hover:hover){.link:hover{color:var(--text)}}
.foot{background:var(--paper);border-top:1px solid var(--line);padding-top:16px}
.ripple{background:rgba(255,255,255,.18)}

/* ---------- options: ledger rows ---------- */
.opts{gap:8px}
.opt{padding:16px 16px;border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2);font-weight:500;box-shadow:none}
@media (hover:hover){.opt:hover{border-color:var(--gold)}}
.opt .k{border-radius:var(--r);width:28px;height:28px;font-family:var(--serif);font-size:14px;font-weight:700;color:var(--gold2);border:1px solid var(--gold);background:transparent}
.opt .dot{border-radius:var(--r);width:16px;height:16px;border:1.5px solid var(--line2);margin-right:4px}
.opt .dot svg{transform:scale(.4);color:var(--paper2)}
.opt.sel{border-color:var(--gold);background:rgba(217,169,50,.13);box-shadow:inset 3px 0 0 var(--gold)}
.opt.sel .k{color:var(--paper2);background:var(--gold);border-color:var(--gold)}
.opt.sel .dot{border-color:var(--gold);background:var(--gold);animation:none}
.opt.sel .dot svg{opacity:1;transform:none}
.opts.picked .opt:not(.sel){opacity:.45}

.chip{border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2)}
.chip b{font-family:var(--serif);font-weight:700}
.chip.sel{border-color:var(--red);background:rgba(204,63,53,.13);box-shadow:inset 3px 0 0 var(--red)}
.chip.sel span{color:var(--red)}
.chip.none.sel{border-color:var(--gold);background:rgba(217,169,50,.13);box-shadow:inset 3px 0 0 var(--gold)}
.chip.none.sel span{color:var(--gold2)}
.counter b{color:var(--red)}

.faith{border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2);font-family:var(--serif);font-weight:700}
.faith svg{color:var(--gold)}
@media (hover:hover){.faith:hover{border-color:var(--gold);transform:none}.faith:hover svg{filter:none;transform:none}}
.faith.sel svg{filter:none;transform:none}
.faith.sel{border-color:var(--gold);background:rgba(217,169,50,.13);box-shadow:inset 0 0 0 3px rgba(217,169,50,.13),inset 0 0 0 4px var(--gold)}
.faiths.picked .faith:not(.sel){opacity:.45}

.field{border-radius:var(--r);border:0;border-bottom:1.5px solid var(--text);background:transparent;padding:0 4px;font-family:var(--serif);font-size:21px;color:var(--text)}
.field:focus{border-color:var(--gold);background:transparent;box-shadow:inset 0 -1.5px 0 var(--gold)}
.field.err{border-color:var(--red);box-shadow:inset 0 -1.5px 0 var(--red)}
.field.year{font-family:var(--display);font-weight:400;font-size:34px}
textarea.field{border:1px solid var(--line2);background:var(--paper2);padding:16px 18px;font:400 17px/1.6 var(--serif);
  background-image:repeating-linear-gradient(transparent 0 26.2px,rgba(184,135,46,.22) 26.2px 27.2px);background-position:0 15px}
textarea.field:focus{border-color:var(--gold);box-shadow:none}
.ferr{color:var(--red)}
.privacy{border-radius:var(--r);background:transparent;border:0;border-top:1px solid var(--line);padding:10px 0 0}
.privacy svg{color:var(--gold)}

/* ---------- photos as framed plates ---------- */
.hero,.imgband{margin:18px 24px 0;padding:5px;border:1px solid var(--gold);outline:1px solid rgba(184,135,46,.45);outline-offset:3px;background:var(--paper2)}
.hero::after,.imgband::after{display:none}
.hero .media,.imgband .media{filter:sepia(.28) contrast(1.04);animation:none}
.hero .media{height:40vh;height:40dvh;min-height:240px;max-height:460px}
.imgband .media{height:30vh;height:30dvh;min-height:200px;max-height:380px}
.imgband.tall .media{height:40vh;height:40dvh;max-height:460px}
.imgband.short .media{height:22vh;height:22dvh;min-height:150px}
.imgband + .pad,.imgband.short + .pad,.hero-body{margin-top:22px}
.hero-body{padding:0 24px}
.hero-body h1{font-size:40px}
.ecg{color:var(--red)}
.ecg .pulse{filter:none}
.trust svg{color:var(--gold)}

/* ---------- life clock ---------- */
.clock .d{border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2);box-shadow:none;font-family:var(--display);font-weight:400;color:var(--text)}
.clock .d.big{color:var(--gold2);border-color:var(--gold)}
.clock .sep{color:var(--gold)}
.bignum{font-family:var(--display);font-weight:400;color:var(--gold2);text-shadow:none}
.bignum.red{color:var(--red);text-shadow:none}
.weeks i{background:rgba(255,255,255,.09)}
.weeks i.gone{background:var(--gold)}
.weeks i.now{background:var(--red);box-shadow:none}
.months-wrap .now{background:var(--red);box-shadow:0 0 0 3px rgba(158,42,34,.18)}
.lc-sub{color:var(--mute)}

/* ---------- stat ---------- */
.stat-card{border-radius:var(--r);border:0;border-top:var(--rule);border-bottom:var(--rule);background:transparent;padding:4px 2px}
.stat-card .row b{font-family:var(--display);font-weight:400}
.stat-card .row b.red{color:var(--red)}

/* ---------- quote ---------- */
.sym{color:var(--gold);filter:none}
.quote{font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.35}
.ref{color:var(--gold2);font-family:var(--sans);font-weight:600}
.ornament{color:var(--gold)}

/* ---------- confession ---------- */
@keyframes burn{0%{color:var(--text)}30%{color:#b8872e}100%{color:#9e2a22;opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r)) scale(.3)}}
textarea.field.burning{border-color:var(--gold);box-shadow:none}
.released svg{color:var(--gold)}
.released h3{color:var(--gold2)}

/* ---------- palm ---------- */
.frame{border-radius:var(--r);border:1px solid var(--gold);outline:1px solid rgba(184,135,46,.45);outline-offset:3px;background:#2a2219}
.frame.empty{border:1.5px dashed var(--gold);outline:0;background:var(--paper2);color:var(--dim)}
.frame.empty svg{color:var(--gold)}
.frame .corner{border-color:var(--gold3);border-radius:5px!important}
.frame svg.lines path{filter:none}
.hud .ring{border-color:rgba(217,178,95,.6)}
.hud .read,.hud .pc{color:var(--gold3);text-shadow:none}
.mark{border-color:#e25a4e}
.mark::after{background:#e25a4e}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(226,90,78,.5)}100%{box-shadow:0 0 0 18px rgba(226,90,78,0)}}
.mark .lbl{border-radius:var(--r);background:var(--red);font-family:var(--sans)}
.ok-pill{border-radius:var(--r);background:transparent;border:1px solid rgba(159,208,169,.4);color:#9fd0a9}
.check{color:var(--mute)}
.check i{border-radius:var(--r);width:16px;height:16px;margin:0 3px}

.check.on{color:var(--text)}
.check.on i{background:var(--gold);border-color:var(--gold);color:var(--paper2)}
.check.run i{border-color:var(--gold);border-top-color:transparent}
.reading{border-radius:var(--r);border:0;border-left:3px solid var(--red);background:rgba(204,63,53,.13)}
.reading .row svg{color:var(--red)}

/* ---------- calculating ---------- */
.bar .track{height:6px;border-radius:var(--r);background:transparent;border:1px solid var(--line2)}
.bar .fill{border-radius:var(--r);background:var(--gold);box-shadow:none}
.orb::before,.orb::after{border-color:rgba(184,135,46,.25);border-top-color:var(--gold)}
.orb::after{border-top-color:transparent;border-bottom-color:var(--gold2)}
.orb svg{color:var(--gold);filter:none}

/* ---------- scale + verdict ---------- */
.result-tag{border-radius:var(--r);font-family:var(--sans)}
.result-tag.devil{background:rgba(204,63,53,.13);color:var(--red);border:1px solid var(--red)}
.result-tag.warning{background:rgba(147,169,200,.12);color:var(--blue);border:1px solid var(--blue)}
.result-tag.angel{background:rgba(217,169,50,.13);color:var(--gold2);border:1px solid var(--gold)}
.verdict .imgband .media{height:32vh;height:32dvh;min-height:220px}
.verdict h1{font-size:40px}
.verdict.devil .imgband::before{display:none}
.verdict.devil .imgband{border-color:var(--red);outline-color:rgba(158,42,34,.45)}
.veil{background:#000}
.veil p{font-family:var(--display);color:#e8dcc4}
.veil.flash{background:var(--paper)}
.veil.flash.red{background:#7a1f19}
.score-row{border-radius:var(--r);border:0;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2);background:transparent;padding:14px 2px}
.ring b{font-family:var(--display);font-weight:400}
@keyframes redpulse{0%,100%{opacity:1}50%{opacity:.6}}

/* ---------- kept vs given ---------- */
.kg .lab b{font-family:var(--display);font-weight:400}
.kg .track{height:14px;border-radius:var(--r);background:transparent;border:1px solid var(--line2)}
.kg .fill{border-radius:var(--r)}
.kg .fill.kept{background:var(--red);box-shadow:none}
.kg .fill.given{background:var(--gold);box-shadow:none}
.pct{border-radius:var(--r);background:transparent;border:0;border-top:var(--rule);border-bottom:var(--rule)}
.pct b{font-family:var(--display);font-weight:400;color:var(--red)}
.pct.ok b{color:var(--gold2)}

/* ---------- epitaph ---------- */
.stone{margin:18px 24px 0;padding:5px;border:1px solid var(--gold);outline:1px solid rgba(184,135,46,.45);outline-offset:3px}
.stone .inner{animation:none}
.stone::after{display:none}
.stone + .pad{margin-top:22px}

/* ---------- plan mock / features ---------- */
.phone{border-radius:28px;background:#2a2219;box-shadow:0 0 0 1px var(--gold),0 0 0 5px var(--paper),0 0 0 6px rgba(184,135,46,.45)}
.phone .scr{background:var(--paper2);border:0;color:var(--text)}
.phone .notch{background:#2a2219}
.app-h b{color:var(--gold2)}
.app-t{font-family:var(--display);font-weight:400}
.meter{border-radius:var(--r);height:6px;background:linear-gradient(90deg,var(--red),var(--gold))}
.meter i{border-radius:var(--r);transform:translate(-50%,-50%);width:12px;height:12px;background:var(--text);border:2px solid var(--paper2);box-shadow:none}
.task{border-radius:var(--r);background:transparent;border:0;border-bottom:1px solid var(--line)}
.task i{border-radius:var(--r);background:transparent;color:var(--gold);border:1px solid var(--gold)}
.task .tick{border-radius:var(--r)}
.task.done .tick{background:var(--gold);border-color:var(--gold);box-shadow:none}
.task .tick svg{color:var(--paper2)}
.feat i{border-radius:var(--r);background:transparent;color:var(--gold2);border:1px solid var(--gold)}
.feat b{font-family:var(--serif);font-weight:700}

/* ---------- before / after ---------- */
.ba .card{border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2)}
.ba .card.now{border-color:var(--red);background:var(--paper2)}
.ba .card.then{border-color:var(--gold);background:var(--paper2)}
.ba .card b{font-family:var(--display);font-weight:400}
.ba .card.now b{color:var(--red)} .ba .card.then b{color:var(--gold2)}
.ba .arrow{color:var(--gold)}
.ba .arrow svg{display:block}
.chart{border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2)}

/* ---------- pledge ---------- */
.pledge-text{font-family:var(--serif);font-size:23px}
.pledge-text b{color:var(--gold2)}
.hold .core{border-radius:50%;background:var(--gold-leaf);color:var(--gold-ink);box-shadow:inset 0 0 0 5px var(--gold-leaf),inset 0 0 0 6px rgba(28,23,18,.5)}
.hold.done .core{background:var(--gold3);box-shadow:inset 0 0 0 5px var(--gold3),inset 0 0 0 6px rgba(28,23,18,.5)}
.burst{border-radius:var(--r);background:var(--gold);box-shadow:none}

/* ---------- paywall (shared) ---------- */
.pw-top{border-radius:var(--r)}
.timer{border-radius:var(--r);background:transparent}
.timer b{color:var(--gold2)}
.lc-banner{border-radius:var(--r);background:var(--red);border:0;color:#f3eee5;box-shadow:inset 0 0 0 3px var(--red),inset 0 0 0 4px rgba(255,255,255,.5);font-family:var(--sans);letter-spacing:.02em}
.plan{border-radius:var(--r);border:1px solid var(--line2);background:var(--paper2)}
.plan .dot{border-radius:var(--r);width:16px;height:16px}
.plan .pd b{font-family:var(--display);font-weight:400}
.plan .tag{border-radius:var(--r);font-family:var(--sans)}
.plan.featured .tag{background:var(--gold-leaf);color:var(--gold-ink)}
.plan.sel{border-color:var(--gold);background:rgba(217,169,50,.13);box-shadow:inset 3px 0 0 var(--gold)}
.plan.sel .dot{border-color:var(--gold);background:var(--gold);box-shadow:none}
.pledge-line svg{color:var(--red)}
.guarantee{border-radius:var(--r);border:1px solid var(--gold);outline:1px solid rgba(184,135,46,.45);outline-offset:3px;background:var(--paper2)}
.guarantee svg{color:var(--gold)}
.guarantee b{font-family:var(--serif);font-weight:700}
.sec{margin-top:40px;padding-top:30px;border-top:var(--rule)}
.story{border-radius:var(--r);border:0;border-bottom:1px solid var(--line);background:transparent;padding:16px 0}
.story .av{border-radius:var(--r);background:transparent;color:var(--gold2);border:1px solid var(--gold);font-family:var(--serif)}
.story .stars{color:var(--gold)}
.story p{font-family:var(--serif);font-style:italic}
.faq{border-top:1px solid var(--line2)}
.faq details{border-bottom:1px solid var(--line2)}
.faq summary{font-family:var(--serif);font-weight:700;font-size:16px}
.faq summary::after{color:var(--gold)}
.pay-icons span{border-radius:var(--r)}
.stickybuy{background:var(--paper);border-top:var(--rule)}
.pchips span{border-radius:var(--r);background:transparent;border-color:var(--gold);color:var(--gold2)}
.pchips svg{color:var(--gold2)}
.proofline .stars{color:var(--gold)}

/* ---------- ending ---------- */
.ending .imgband .media{height:34vh;height:34dvh}
.ending h1{font-size:42px}
.ending.sorry .imgband{border-color:var(--red);outline-color:rgba(158,42,34,.4)}

/* ---------- sheets, checkout ---------- */
.sheet-bg,.payframe{background:rgba(0,0,0,.66);backdrop-filter:none;-webkit-backdrop-filter:none}
.sheet{border-radius:var(--r);background:var(--paper);border:0;border-top:var(--rule)}
.sheet .grab{border-radius:var(--r);background:var(--gold)}
.sheet .sum b{font-family:var(--serif)}
.toast{background:#1b1f27;color:var(--text);border:1px solid var(--line2)}
.paysheet h3{font-family:var(--display);font-weight:400}
.fl{color:var(--dim)}
.field.sm{border-radius:var(--r);height:50px;font-size:17px}
.zcity{color:var(--gold2)}
.pfpanel{border-radius:var(--r);background:var(--paper);border:0;border-top:var(--rule)}
.pfhead{background:var(--paper);border-bottom:1px solid var(--line2)}
.pfhead .pft svg,.pfhead b{color:var(--gold2)}
.pfhead b{font-family:var(--display);font-weight:400}
#dodo-inline.raw iframe{background:#fff}
.pfalt{background:var(--paper)}
.pfwait b{color:var(--text)}

/* ---------- landing ---------- */
.livebar i{background:var(--red);animation:none;box-shadow:none;border-radius:var(--r)}
.livebar b{color:var(--red)}
.lq{font-family:var(--serif);font-style:italic;text-transform:none;letter-spacing:0;font-size:14px;color:var(--gold2)}
.lopt{border-radius:var(--r);font:700 13.5px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--text);background:transparent;border:1px solid var(--text);backdrop-filter:none;-webkit-backdrop-filter:none}
.lopt:first-child{color:var(--gold-ink);background:var(--gold-leaf);border-color:transparent;box-shadow:inset 0 0 0 4px var(--gold-leaf),inset 0 0 0 5px rgba(28,23,18,.55),0 3px 0 #7d5a17}
.lopt.sel{border-color:var(--gold)}
.screen[data-s="landing"] .hero .media{height:34vh;height:34dvh;min-height:200px}
.screen[data-s="landing"] .hero-body{margin-top:20px}
@media (max-height:700px){.screen[data-s="landing"] .hero .media{height:28vh;height:28dvh;min-height:170px}.screen[data-s="landing"] .hero-body h1{font-size:34px}}

/* ---------- paywall (27 Sep layout) ---------- */
.pw2-hero .media{height:130px}
.pw2-hero + .pad{margin-top:22px}
.pw2-top h1{font-size:36px}
.pw2-score{border-radius:var(--r);border:0;border-top:var(--rule);border-bottom:var(--rule);background:transparent;padding:16px 4px 18px}
.pw2-sc span{font-family:var(--sans);color:var(--mute)}
.pw2-sc b{font-family:var(--display);font-weight:400;font-size:50px}
.pw2-sc b.now{color:var(--red)}
.pw2-sc b.then{color:var(--gold2);text-shadow:none}
.pw2-score.ang .pw2-sc b.now{color:var(--gold2)}
.pw2-sc em{font-family:var(--serif);font-style:italic;color:var(--dim)}
.pw2-arrow{color:var(--gold)}
.pw2-arrow svg{display:block}
.pw2-track{height:6px;border-radius:var(--r);background:linear-gradient(90deg,var(--red) 0%,var(--red) 25%,var(--gold) 80%)}
.pw2-track i{border-radius:var(--r);border:2px solid var(--paper);width:14px;height:14px;margin:-7px 0 0 -7px}
.pw2-track i.a{background:var(--red);box-shadow:0 0 0 1px var(--red)}
.pw2-track i.b{background:var(--gold2);box-shadow:0 0 0 1px var(--gold2)}
.pw2-card{border-radius:var(--r);border:1px solid var(--gold);outline:1px solid rgba(184,135,46,.45);outline-offset:3px;background:var(--paper2);box-shadow:none;margin-top:18px}
.pw2-price b{font-family:var(--serif);font-weight:700;font-size:18px}
.pw2-amt b{font-family:var(--display);font-weight:400;font-size:44px;color:var(--gold2)}
.pw2-day{font-family:var(--serif);font-style:italic;color:var(--dim);border-top:1px solid var(--line);padding-top:8px;margin-top:10px}
.pw2-secure svg,.pw2-guar svg{color:var(--gold)}
.pw2-incbox{border-radius:var(--r);border:0;background:transparent;padding:0;margin-top:30px}
.pw2-inc li{padding-bottom:11px;border-bottom:1px solid var(--line)}
.pw2-inc li > i{border-radius:var(--r);width:9px;height:9px;margin:6px 4px 0;background:var(--gold)}
.pw2-inc li > i svg{display:none}
.pw2-inc b{font-family:var(--serif);font-weight:700}
.pw2-days li::before{left:31px;background:var(--gold);width:1px;opacity:.6}
.pw2-days .n{border-radius:var(--r);background:transparent;color:var(--gold2);border:1px solid var(--gold);font-family:var(--serif);font-style:italic;font-weight:700;letter-spacing:0;background-color:var(--paper)}
.pw2-days b{font-family:var(--display);font-weight:400}
.pw2-more{font-family:var(--serif);font-style:italic}
.pw2-verse{margin-top:40px;padding:26px 8px;border-top:var(--rule);border-bottom:var(--rule)}
.pw2-verse p{font-family:var(--serif);font-size:24px}
.pw2-verse span{color:var(--gold2);font-family:var(--sans)}
.pw2-sbp b{font-family:var(--display);font-weight:400;color:var(--gold2)}
@media (max-height:760px){.pw2-hero .media{height:96px}.pw2-hero + .pad{margin-top:18px}.pw2-sc b{font-size:42px}}
@media (max-width:360px){h1,.h1{font-size:34px}.hero-body h1{font-size:35px}h2,.h2{font-size:27px}.hero,.imgband,.stone{margin-left:18px;margin-right:18px}}

/* ---------- rounded corners everywhere (user, 28 Sep): smaller radius for small parts, dots instead of diamonds ---------- */
.eyebrow::before,.center .eyebrow::after,.sec > .eyebrow::after{border-radius:50%}
.progress i::after,.livebar i,.burst,.pw2-track i,.pw2-inc li > i,.meter i{border-radius:50%}
.opt .k,.task i,.task .tick,.story .av,.feat i,.ok-pill,.mark .lbl,.result-tag,.plan .tag,.pay-icons span,.pchips span,.pw2-days .n,.iconbtn{border-radius:var(--r-sm)}
.opt .dot,.plan .dot,.check i{border-radius:50%}
.bar .track,.bar .fill,.kg .track,.kg .fill,.pw2-track,.meter,.weeks i{border-radius:99px}
.btn,.lopt{border-radius:var(--r)}
.field{border-radius:0}
.field.sm,textarea.field{border-radius:var(--r-sm)}
.hero,.imgband,.stone,.frame,.guarantee,.pw2-card{border-radius:var(--r);outline:0;box-shadow:0 0 0 4px var(--paper),0 0 0 5px rgba(184,135,46,.45)}
.hero .media,.imgband .media,.stone .inner{border-radius:calc(var(--r) - 5px)}
.stone .inner{overflow:hidden}
.faith.sel{border-radius:var(--r)}
.reading{border-radius:var(--r)}
.stat-card,.pct,.pw2-score,.score-row,.pw2-verse,.stickybuy,.sec,.pw2-incbox,.story{border-radius:0}
.reading{border-left:0;border:1px solid rgba(158,42,34,.35)}
.sheet,.pfpanel{border-radius:20px 20px 0 0}
.sheet .grab{border-radius:4px}
.toast{border-radius:var(--r-sm)}
:focus-visible{border-radius:var(--r-sm)}
.opt.sel,.chip.sel,.chip.none.sel,.plan.sel{box-shadow:none;border-width:1.5px}
.field:focus-visible{outline:none}
.upbtns .btn{letter-spacing:.06em;font-size:12.5px}
.pw2-verse{border-bottom:0;padding-bottom:0}

/* ---------- dark + metallic gold (user, 28 Sep): the original gold button, on black ---------- */
.top,.top.clear,.foot,.stickybuy{background:var(--bg)}
.btn{border-radius:15px;font-family:var(--sans);font-weight:600;font-size:16.5px;letter-spacing:.01em;text-transform:none}
.btn:active{transform:scale(.982)}
.btn svg{display:block}
.btn-gold,.lopt:first-child{color:var(--gold-ink);background:var(--gold-grad);border-color:transparent;
  box-shadow:0 14px 36px -14px rgba(217,169,50,.55),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(0,0,0,.18)}
.btn-gold:active{box-shadow:0 8px 24px -14px rgba(217,169,50,.55),inset 0 1px 0 rgba(255,255,255,.45)}
@media (hover:hover){.btn-gold:hover{background:var(--gold-grad);filter:brightness(1.05);box-shadow:0 18px 44px -14px rgba(217,169,50,.7),inset 0 1px 0 rgba(255,255,255,.45)}}
.btn-line{border-color:var(--line2);color:var(--text)}
@media (hover:hover){.btn-line:hover{border-color:var(--gold);background:var(--gold-soft)}}
.btn-red{color:#fff;background:linear-gradient(135deg,#e55a4e,#b12d27);box-shadow:0 14px 36px -14px rgba(204,63,53,.6),inset 0 1px 0 rgba(255,255,255,.25)}
.lopt{font:600 16.5px/1.2 var(--sans);letter-spacing:.01em;text-transform:none;color:var(--text);border-color:var(--line2)}
/* gold fills use the same metal */
.opt.sel .k,.opt.sel .dot,.plan.sel .dot,.check.on i,.task.done .tick,.bar .fill,.kg .fill.given,.progress i,.weeks i.gone,.pw2-inc li > i{background:var(--gold-grad);border-color:#d9a932}
.hold .core{background:radial-gradient(circle at 35% 30%,#f7e2ae,#c9972c 60%,#a1660d);box-shadow:0 18px 40px -14px rgba(217,169,50,.6)}
.hold.done .core{background:radial-gradient(circle at 35% 30%,#fff5d6,#f2cf6b 60%,#c9972c);box-shadow:0 0 0 8px rgba(242,207,107,.18)}
.pw2-amt b,.pw2-sc b.then,.bignum,.pw2-sbp b{background:linear-gradient(180deg,#f6de96,#c9972c);-webkit-background-clip:text;background-clip:text;color:transparent}
.pw2-days .n{background:var(--bg)}
.lc-banner{color:#fff}
.frame{background:#0a0c10}
.phone{background:#1a1b20}.phone .notch{background:#1a1b20}
.hero,.imgband,.stone,.frame,.guarantee,.pw2-card{box-shadow:0 0 0 4px var(--bg),0 0 0 5px rgba(217,169,50,.35)}
.hero .media,.imgband .media{filter:none}
.stone .media.warm{filter:sepia(.32) saturate(1.3) brightness(1.12) contrast(1.02)}
.ring svg circle:first-child{stroke:rgba(255,255,255,.08)}
@media (min-width:520px){#app{border-color:var(--line);background:var(--bg)}}

/* ---------- type system (user, 28 Sep: new fonts, weights, clearer UI) ----------
   Noto Serif Display for headlines, big numbers and quotes only (never below 20px);
   Manrope for everything you read or tap. */
body{font-family:var(--sans);font-size:16px;line-height:1.55;font-feature-settings:"tnum" 0}
h1,.h1{font-family:var(--display);font-weight:600;font-size:36px;line-height:1.1;letter-spacing:-.015em}
h2,.h2{font-family:var(--display);font-weight:600;font-size:29px;line-height:1.14;letter-spacing:-.01em}
h3{font-family:var(--sans);font-weight:700;font-size:19px;letter-spacing:-.01em}
.hero-body h1{font-size:38px}.verdict h1,.ending h1{font-size:38px}.pw2-top h1{font-size:33px}
.lead{font-size:16px;line-height:1.6;color:#b9bec8;font-weight:400}
:root{--mute:#858c99}
.eyebrow,.lq{font-family:var(--sans);font-style:normal;font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.eyebrow::before,.center .eyebrow::after,.sec > .eyebrow::after{width:5px;height:5px}
.brand{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:.34em}
/* answers: readable, big targets */
.opt{min-height:58px;padding:15px 16px;font-family:var(--sans);font-size:16px;font-weight:600;letter-spacing:-.005em}
.opt .k{font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--gold2);border-color:rgba(217,169,50,.5)}
.opt .sub,.chip span{font-weight:500}
.chip b,.faith,.faq summary,.feat b,.pw2-price b,.pw2-inc b,.guarantee b,.story .who b,.plan .nm b{font-family:var(--sans);font-weight:700;letter-spacing:-.01em}
.faith{font-size:15px}
.faq summary{font-size:15.5px}
.field{font-family:var(--sans);font-weight:600;font-size:20px}
.field.year{font-family:var(--display);font-weight:600;font-size:34px}
textarea.field{font:500 16.5px/1.6 var(--sans)}
/* numbers */
.bignum,.pw2-sc b,.pw2-amt b,.kg .lab b,.pct b,.ba .card b,.stat-card .row b,.clock .d,.ring b,.pw2-sbp b,.plan .pd b{font-family:var(--display);font-weight:600;font-variant-numeric:lining-nums tabular-nums}
.clock .l,.lc-sub,.pw2-sc span,.pw2-arrow small,.kg .lab span,.ref,.pw2-verse span,.app-h{font-family:var(--sans);font-weight:700;letter-spacing:.14em}
/* quotes stay editorial */
.quote,.pw2-verse p,.pledge-text,.story p{font-family:var(--display);font-style:italic;font-weight:500}
.pw2-sc em,.pw2-day,.pw2-more{font-family:var(--sans);font-style:normal;font-weight:500}
.pw2-days .n{font-family:var(--sans);font-style:normal;font-weight:700;font-size:11px;letter-spacing:.04em}
.pw2-days b{font-family:var(--display);font-weight:600;font-size:20px}
/* small print stays legible */
.terms,.pw2-secure,.pw2-guar,.privacy,.pledge-line,.small{font-size:12.5px;line-height:1.5}
.link{font-size:14px;font-weight:500;padding:10px 0;margin-top:6px}

.screen[data-s="landing"] .hero-body h1{font-size:33px}
.screen[data-s="landing"] .hero .media{height:30vh;height:30dvh;min-height:180px}
.lopt{min-height:50px}
.screen[data-s="landing"] .hero-body h1{font-size:30px;letter-spacing:-.02em}
/* paywall: price + main button inside the first screen */
.imgband.pw2-hero .media{height:92px;min-height:0}
.pw2-hero{margin-top:12px}
.pw2-hero + .pad{margin-top:16px}
.pw2-top > .eyebrow{margin-bottom:8px}
.pw2-top h1{font-size:30px}
.pw2-top .lead{font-size:15px;margin-top:8px}
.pw2-score{margin-top:12px;padding:12px 4px 14px}
.pw2-sc b{font-size:44px}
.pw2-card{margin-top:14px;padding:15px 16px 13px}
@media (max-height:760px){.pw2-hero{display:none}.pw2-hero + .pad{margin-top:18px}}

/* ---------- no strokes or lines (user, 28 Sep): separation by fill and spacing only ---------- */
:root{--rule:0 none;--fill:#121318;--fill2:#181a20;--fill-gold:rgba(217,169,50,.14)}
body::before{display:none}
.top,.top.clear{border-bottom:0}
.progress{border-bottom:0;background:rgba(255,255,255,.06)}
.foot{border-top:0}
.stickybuy{border-top:0;box-shadow:0 -18px 30px -6px var(--bg)}
/* photos: no frames, just rounded */
.hero,.imgband,.stone{border:0;outline:0;padding:0;box-shadow:none;background:none}
.hero .media,.imgband .media,.stone .inner{border-radius:var(--r)}
.frame{border:0;outline:0;box-shadow:none}
.frame.empty{border:0;background:var(--fill)}
.verdict.devil .imgband,.ending.sorry .imgband{border:0;outline:0}
/* rows and cards: filled, no border */
.opt,.chip,.faith,.plan,.ba .card,.chart,.clock .d,.task,.story,.btn-line,.lopt:not(:first-child){border:0!important;background:var(--fill);box-shadow:none}
.opt.sel,.chip.none.sel,.faith.sel,.plan.sel{background:var(--fill-gold);box-shadow:none}
.chip.sel{background:rgba(204,63,53,.16);box-shadow:none}
.opt .k{border:0;background:var(--fill2)}
.opt .dot,.plan .dot{border:0;background:var(--fill2)}
.opt.sel .k,.opt.sel .dot,.plan.sel .dot{background:var(--gold-grad)}
.check i{border:0;background:var(--fill2)}
.check.run i{border:1.5px solid var(--gold);border-top-color:transparent;background:none}
.task .tick{border:0;background:var(--fill2)}
.task i,.feat i,.story .av{border:0;background:var(--fill-gold)}
.field,.field.sm,textarea.field{border:0;border-radius:var(--r);background:var(--fill);box-shadow:none;padding:0 18px;background-image:none}
textarea.field{padding:16px 18px}
.field:focus,.field.err{box-shadow:none;background:var(--fill2)}
.field.err{background:rgba(204,63,53,.14)}
.privacy{border:0;padding:0}
/* sections and stat blocks: no rules */
.stat-card,.pct,.pw2-score,.score-row,.pw2-verse,.sec,.pw2-incbox{border:0}
.stat-card{background:var(--fill);border-radius:var(--r);padding:4px 16px}
.stat-card .row,.reading .row{border:0}
.pw2-score{background:var(--fill);border-radius:var(--r);padding:14px 14px 16px}
.pct{background:rgba(204,63,53,.12);border-radius:var(--r)}
.pct.ok{background:var(--fill-gold)}
.score-row{background:var(--fill);border-radius:var(--r);padding:14px 16px}
.sec{padding-top:0;margin-top:44px}
.pw2-verse{padding:0 8px}
.pw2-verse .ornament,.ornament{display:none}
.reading{border:0;background:rgba(204,63,53,.12)}
.guarantee,.pw2-card{border:0;outline:0;box-shadow:none;background:var(--fill)}
.pw2-card{background:var(--fill-gold)}
.pw2-day{border-top:0;padding-top:0;margin-top:6px}
.pw2-inc li{border-bottom:0;padding-bottom:0}
.pw2-incbox{background:var(--fill);border-radius:var(--r);padding:18px}
.pw2-days li::before{display:none}
.pw2-days .n{border:0;background:var(--fill-gold)}
.faq,.faq details{border:0}
.faq{display:grid;gap:8px}
.faq details{background:var(--fill);border-radius:var(--r);padding:0 16px}
.faq summary{padding:16px 0}
.faq p{padding:0 0 16px}
.bar .track,.kg .track{border:0;background:rgba(255,255,255,.07)}
.lc-banner{box-shadow:none;background:linear-gradient(135deg,#e55a4e,#b12d27)}
.btn-red{box-shadow:0 14px 36px -14px rgba(204,63,53,.6)}
.result-tag,.ok-pill,.pchips span,.plan .tag,.pay-icons span{border:0}
.result-tag.devil{background:rgba(204,63,53,.16)}.result-tag.warning{background:rgba(147,169,200,.14)}.result-tag.angel{background:var(--fill-gold)}
.ok-pill{background:rgba(159,208,169,.12)}
.pchips span{background:var(--fill-gold)}
.ecg,.eyebrow::before,.center .eyebrow::after,.sec > .eyebrow::after{display:none}
.sheet,.pfpanel{border:0}
.pfhead,.pfalt{border:0}
.toast{border:0}
@media (min-width:520px){#app{border:0}}

/* ---------- vintage poster headlines (user sample "ELIGATED", 28 Sep): Smokum, uppercase, cream ---------- */
:root{--poster:'Smokum','Noto Serif Display',Georgia,serif;--cream:#efe3c8}
h1,.h1,h2,.h2{font-family:var(--poster);font-weight:400;text-transform:uppercase;letter-spacing:.02em;line-height:1.02;color:var(--cream);text-wrap:balance}
h1,.h1{font-size:42px}
h2,.h2{font-size:34px}
.hero-body h1,.verdict h1,.ending h1{font-size:44px}
.pw2-top h1{font-size:38px}
.screen[data-s="landing"] .hero-body h1{font-size:40px;letter-spacing:.02em}
.sec > h2{font-size:36px}
.brand{font-family:var(--poster);font-weight:400;font-size:21px;letter-spacing:.14em;color:var(--cream)}
.bignum,.pw2-sc b,.pw2-amt b,.kg .lab b,.pct b,.ba .card b,.stat-card .row b,.clock .d,.ring b,.pw2-sbp b,.plan .pd b,.field.year{font-family:var(--poster);font-weight:400;letter-spacing:.02em}
.bignum{font-size:92px}
.pw2-sc b{font-size:54px}
.pw2-amt b{font-size:50px}
.pw2-days b{font-family:var(--poster);font-weight:400;font-size:24px;text-transform:uppercase;letter-spacing:.03em;color:var(--cream)}
.released h3,.app-t,.paysheet h3{font-family:var(--poster);font-weight:400;text-transform:uppercase;letter-spacing:.03em}
.released h3{font-size:30px}
h1 .gold,h1 .hl,h2 .gold,h2 .hl{color:var(--gold2)}
@media (max-width:360px){h1,.h1{font-size:36px}h2,.h2{font-size:30px}}
/* small numbers stay in the readable serif; the poster face is for headlines and hero numbers only */
.stat-card .row b,.clock .d,.ring b,.kg .lab b,.plan .pd b,.pw2-sbp b,.ba .card b{font-family:var(--display);font-weight:600;letter-spacing:0}

/* ---------- blackletter headlines (user reference "Pollyester", 28 Sep): Pirata One, sentence case ----------
   Pollyester itself is a paid font; Pirata One is the closest free textura. Blackletter is never set in all caps. */
:root{--poster:'Pirata One','Noto Serif Display',Georgia,serif}
h1,.h1,h2,.h2,.pw2-days b,.released h3,.app-t,.paysheet h3,.brand{text-transform:none}
h1,.h1,h2,.h2{letter-spacing:.005em;line-height:1.04}
h1,.h1{font-size:46px}
h2,.h2{font-size:38px}
.hero-body h1,.verdict h1,.ending h1{font-size:48px}
.pw2-top h1{font-size:40px}
.screen[data-s="landing"] .hero-body h1{font-size:44px;letter-spacing:0}
.sec > h2{font-size:40px}
.brand{font-size:25px;letter-spacing:.06em}
.pw2-days b{font-size:26px;letter-spacing:.01em}
.bignum{font-size:96px;letter-spacing:0}
.pw2-sc b{font-size:58px;letter-spacing:0}
.pw2-amt b{font-size:52px;letter-spacing:0}
@media (max-width:360px){h1,.h1{font-size:40px}h2,.h2{font-size:33px}}


/* ---------- vintage newspaper type (user reference "The Daily Chronicle", 28 Sep) ----------
   masthead = Rye (logo only) · headlines, labels, numbers = Playfair Display 700–900 caps · everything read or tapped = Libre Baskerville */
:root{--mast:'Rye',Georgia,serif;--poster:'Playfair Display',Georgia,serif;--display:'Playfair Display',Georgia,serif;--serif:'Libre Baskerville',Georgia,serif;--sans:'Libre Baskerville',Georgia,serif}
body{font-family:var(--serif);font-size:15px}
.brand{font-family:var(--mast);font-weight:400;font-size:19px;letter-spacing:.08em;text-transform:uppercase}
h1,.h1,h2,.h2{font-family:var(--poster);font-weight:800;text-transform:uppercase;letter-spacing:.005em;line-height:1.06}
h1,.h1{font-size:33px}
h2,.h2{font-size:27px}
.hero-body h1,.verdict h1,.ending h1{font-size:34px}
.pw2-top h1{font-size:30px}
.screen[data-s="landing"] .hero-body h1{font-size:31px}
.sec > h2{font-size:29px}
.pw2-days b,.released h3,.app-t,.paysheet h3{font-family:var(--poster);font-weight:800;text-transform:uppercase;letter-spacing:.01em}
.pw2-days b{font-size:18px}
/* the "WORLD NEWS GLOBAL HEADLINES" style for labels */
.eyebrow,.lq,.clock .l,.lc-sub,.pw2-sc span,.pw2-arrow small,.kg .lab span,.ref,.pw2-verse span,.app-h{font-family:var(--poster);font-weight:800;font-style:normal;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
/* numbers: Playfair black, lining */
.bignum,.pw2-sc b,.pw2-amt b,.kg .lab b,.pct b,.ba .card b,.stat-card .row b,.clock .d,.ring b,.pw2-sbp b,.plan .pd b,.field.year{font-family:var(--poster);font-weight:900;letter-spacing:0;font-variant-numeric:lining-nums tabular-nums}
.bignum{font-size:80px}.pw2-sc b{font-size:48px}.pw2-amt b{font-size:44px}
/* reading + tapping text: Baskerville */
.lead{font-family:var(--serif);font-size:15.5px;line-height:1.65}
.opt,.lopt,.chip b,.faith,.faq summary,.feat b,.pw2-price b,.pw2-inc b,.guarantee b,.story .who b,.plan .nm b,.field,textarea.field{font-family:var(--serif);font-weight:700;letter-spacing:0}
.opt{font-size:15px}
.opt .k{font-family:var(--poster);font-weight:800}
.btn{font-family:var(--serif);font-weight:700;font-size:15.5px;letter-spacing:.01em}
.quote,.pw2-verse p,.pledge-text,.story p{font-family:var(--serif);font-style:italic;font-weight:400}
.quote{font-size:23px}.pw2-verse p{font-size:21px}
.pw2-sc em,.pw2-day,.pw2-more{font-family:var(--serif);font-style:italic;font-weight:400}
.pw2-days .n{font-family:var(--poster);font-weight:800;font-style:normal}
@media (max-width:360px){h1,.h1{font-size:29px}h2,.h2{font-size:24px}}
.brand{font-size:23px;letter-spacing:.06em}.brand svg{width:17px;height:17px}

/* ---------- less text (user, 28 Sep): short screens, merged steps ---------- */
.eyebrow:empty{display:none}
.q{margin-bottom:18px}
.fields{display:grid;gap:10px}
.fields .field.year{font-size:20px;text-align:left;letter-spacing:0;padding-left:18px;font-family:var(--serif);font-weight:700}
.screen[data-s="vices"] .q .lead,.screen[data-s="worth"] .q .lead,.screen[data-s="confession"] .lead{display:none}
.chip span,.counter{display:none}
.chip{padding:16px;justify-content:center}
.screen[data-s="stat"] .small.mt8{margin-top:2px}
.pw2-top h1{margin-bottom:0}
.pw2-inc li{align-items:center;font-size:14.5px;font-family:var(--serif);font-weight:700}
.pw2-days{display:grid;grid-template-columns:1fr;gap:8px;margin-top:14px}
.pw2-days li{grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:10px 12px;background:var(--fill);border-radius:12px}
.pw2-days li:last-child{padding-bottom:10px}
.pw2-days b{font-size:15px}
.pw2-secure{flex-wrap:wrap;text-align:center}
.sec{margin-top:34px}
.screen[data-s="landing"] .hero-body .eyebrow{display:none}
.pw2-secure{flex-wrap:nowrap;align-items:flex-start;text-align:left;justify-content:center}
.pw2-secure svg{flex:none;margin-top:3px}
/* logo (28 Sep): real hourglass mark, no flip animation */
.brand{gap:10px}
.brand svg.logo{width:19px;height:24px;animation:none;color:inherit}
.brand svg.logo{width:22px;height:28px}

/* ---------- chapter progress (28 Sep): You · Faith · Life · Verdict ---------- */
.progress,.progress.over{position:sticky;top:60px;height:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px 22px 10px;background:var(--bg);border:0;z-index:19}
.progress[hidden]{display:none}
.pseg{display:flex;flex-direction:column;gap:6px;min-width:0}
.pseg .pt{position:relative;display:block;height:5px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
.pseg .pt i{position:absolute;inset:0 auto 0 0;width:0;border-radius:99px;background:var(--gold-grad);transition:width .7s var(--ease-out)}
.pseg .pt i::after{display:none}
.pseg em{font-family:var(--poster);font-style:normal;font-weight:800;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);transition:color .4s}
.pseg.on em{color:var(--gold2)}
.pseg.done em{color:#9fb0c2}
.pseg.on .pt{box-shadow:0 0 0 1px rgba(217,169,50,.25)}
.top{border-bottom:0}

/* ---------- no strokes, no glass (user, 28 Sep) ----------
   Every surface is a solid colour; nothing is drawn with a border, outline, ring or stroke. */
:root{--fill-gold:#1a2430;--fill-red:#2a1415;--fill-blue:#171b22}
*,*::before,*::after{border-color:transparent!important;outline-color:transparent}
:focus-visible{outline:0;box-shadow:0 0 0 3px var(--gold)!important;border-radius:var(--r-sm)}
.btn-gold,.lopt:first-child{box-shadow:0 12px 30px -14px rgba(217,169,50,.5)}
.btn-gold:active{box-shadow:0 6px 18px -12px rgba(217,169,50,.5)}
@media (hover:hover){.btn-gold:hover{box-shadow:0 16px 36px -14px rgba(217,169,50,.6)}}
.btn-red{box-shadow:0 12px 30px -14px rgba(204,63,53,.55)}
.pseg.on .pt{box-shadow:none}
/* tints: solid, not see-through */
.opt.sel,.chip.none.sel,.faith.sel,.plan.sel,.pw2-card,.pchips span,.result-tag.angel,.task i,.feat i,.story .av,.pw2-days .n{background:var(--fill-gold)}
.chip.sel,.pct,.reading,.result-tag.devil,.field.err{background:var(--fill-red)}
.result-tag.warning{background:var(--fill-blue)}
.ok-pill{background:#15201a}
/* palm: no brackets, no scan rings, no line drawing; marks are solid dots */
.frame .corner,.hud .ring,.hud .ring2,.frame svg.lines{display:none}
.mark{border:0;background:rgba(226,90,78,.3);box-shadow:none;animation:markin .6s var(--ease-out) forwards,markpulse 1.6s ease-in-out infinite;animation-delay:var(--d),calc(var(--d) + .6s)}
@keyframes markpulse{50%{transform:scale(1.18)}}
.check i{border:0!important;background:var(--fill2)}
.check.run i{background:var(--gold);animation:markpulse 1s ease-in-out infinite}
.orb::before,.orb::after{border:0;border-radius:50%;background:var(--fill-gold);animation:markpulse 1.4s ease-in-out infinite}
.orb::after{inset:30px;background:var(--gold-grad)}
/* score: a solid badge instead of a stroked ring */
.ring svg{display:none}
.ring{border-radius:50%;background:var(--fill2);display:grid;place-items:center}
/* paywall slider knobs: plain solid dots */
.pw2-track i{border:0!important;box-shadow:none!important;width:13px;height:13px;margin:-6.5px 0 0 -6.5px}
.pw2-track i.a{background:#ff6255}.pw2-track i.b{background:#f2cf6b}
.months-wrap .now{box-shadow:none}
/* focus without a ring: fields brighten, buttons lift */
:focus-visible{box-shadow:none!important}
.field:focus,.field:focus-visible{background:#1d1f26}
.btn:focus-visible,.opt:focus-visible,.lopt:focus-visible,.faith:focus-visible,.chip:focus-visible{filter:brightness(1.18)}
.field.year{text-align:center;letter-spacing:.3em}

/* ---------- Lexend everywhere (user, 28 Sep) — only the LAST DAY logo keeps Rye ---------- */
:root{--lex:'Lexend',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--poster:var(--lex);--display:var(--lex);--serif:var(--lex);--sans:var(--lex)}
body,button,input,textarea{font-family:var(--lex)}
h1,.h1,h2,.h2,.pw2-days b,.released h3,.app-t,.paysheet h3{font-family:var(--lex);font-weight:700;text-transform:none;letter-spacing:-.02em;line-height:1.12;color:var(--cream)}
h1,.h1{font-size:32px}
h2,.h2{font-size:27px}
.hero-body h1,.verdict h1,.ending h1{font-size:32px}
.pw2-top h1{font-size:29px}
.screen[data-s="landing"] .hero-body h1{font-size:30px}
.sec > h2{font-size:26px}
.pw2-days b{font-size:15px;letter-spacing:-.01em}
.eyebrow,.lq,.clock .l,.lc-sub,.pw2-sc span,.pw2-arrow small,.kg .lab span,.ref,.pw2-verse span,.app-h,.pseg em{font-family:var(--lex);font-weight:600;font-style:normal;letter-spacing:.12em}
.bignum,.pw2-sc b,.pw2-amt b,.kg .lab b,.pct b,.ba .card b,.stat-card .row b,.clock .d,.ring b,.pw2-sbp b,.plan .pd b,.field.year{font-family:var(--lex);font-weight:700;letter-spacing:-.02em}
.bignum{font-size:72px}.pw2-sc b{font-size:44px}.pw2-amt b{font-size:40px}
.lead{font-family:var(--lex);font-weight:300;font-size:16px;line-height:1.6}
.opt,.lopt,.chip b,.faith,.faq summary,.feat b,.pw2-price b,.pw2-inc b,.pw2-inc li,.guarantee b,.story .who b,.plan .nm b,.field,textarea.field{font-family:var(--lex);font-weight:500;letter-spacing:-.005em}
.opt{font-size:16px}
.opt .k,.pw2-days .n{font-family:var(--lex);font-weight:600}
.btn{font-family:var(--lex);font-weight:600;font-size:16px;letter-spacing:0}
.quote,.pw2-verse p,.pledge-text,.story p,.pw2-sc em,.pw2-day,.pw2-more{font-family:var(--lex);font-style:normal;font-weight:300}
.quote{font-size:21px;line-height:1.45}
.field.year{letter-spacing:.2em;font-size:28px}
.small,.terms,.privacy,.pw2-secure,.pledge-line{font-family:var(--lex);font-weight:300}
@media (max-width:360px){h1,.h1{font-size:28px}h2,.h2{font-size:24px}}

/* ---------- options: flat and solid (user, 28 Sep: the brown tint read as glass) ----------
   unselected = flat charcoal; selected = solid gold like the buttons, dark text */
:root{--opt:#15161b;--opt-hi:#1c1d23;--opt-key:#23242b}
.opt,.faith,.chip,.plan,.lopt:not(:first-child){background:var(--opt)!important;box-shadow:none!important;transition:background .2s,color .2s,transform .15s}
@media (hover:hover){.opt:hover,.faith:hover,.chip:hover,.plan:hover,.lopt:not(:first-child):hover{background:var(--opt-hi)!important}}
.opt .k{background:var(--opt-key)!important;color:var(--gold2)}
.opt .dot{display:none}
.opt.sel,.faith.sel,.chip.none.sel,.plan.sel,.lopt.sel{background:var(--gold-grad)!important;color:var(--gold-ink)}
.opt.sel .k{background:var(--gold-ink)!important;color:var(--gold2)}
.opt.sel .t,.plan.sel .nm b,.plan.sel .pd b,.plan.sel span{color:var(--gold-ink)}
.faith.sel svg,.faith.sel span{color:var(--gold-ink)}
.chip.sel{background:#b3362d!important;color:#fff}
.chip.sel b,.chip.sel span{color:#fff}
.opts.picked .opt:not(.sel),.faiths.picked .faith:not(.sel){opacity:.35}

/* ---------- stat screen hierarchy (28 Sep): number → caption → line → three facts ---------- */
.brand{white-space:nowrap}
.imgband.stat-img .media{height:18vh;height:18dvh;min-height:120px}
.stat2{display:flex;flex-direction:column;align-items:center}
.stat2 .bignum{font-size:96px;line-height:.95;letter-spacing:-.04em;margin-top:6px}
.stat2-cap{margin-top:10px;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#ff6255}
.stat2-h{margin-top:26px;font-size:22px!important;font-weight:500!important;line-height:1.3!important;color:#b9bec8!important;max-width:15em}
.stat2-row{margin-top:28px;width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stat2-row div{background:var(--opt);border-radius:14px;padding:14px 6px;display:flex;flex-direction:column;gap:4px}
.stat2-row b{font-size:20px;font-weight:700;color:var(--cream);letter-spacing:-.02em}
.stat2-row span{font-size:11px;font-weight:500;color:var(--mute);letter-spacing:.06em;text-transform:uppercase}
/* progress: one label for the current chapter only */
.progress,.progress.over{row-gap:8px;padding:4px 22px 12px}
.pseg{gap:0}
.pseg em{display:none}
.pinfo{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline}
.pinfo b{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold2)}
.pinfo span{font-size:11px;font-weight:500;color:var(--mute);font-variant-numeric:tabular-nums}

/* ---------- inactive states in the gold family (28 Sep: grey looked dull) ---------- */
:root{--opt:#141c26;--opt-hi:#1b2532;--opt-key:#1f2b37;--track:#1b2732;--track-on:#26384a}
/* progress: warm tracks, thin; the current chapter's track is a touch lighter */
.pseg .pt{height:4px;background:var(--track)}
.pseg.on .pt{background:var(--track-on)}
.pseg.done .pt i{background:#b98a2a}
.pinfo span{color:#7d8a99}
/* options */
.opt,.faith,.chip,.plan,.lopt:not(:first-child){color:#f4ecd8}
.opt .k{color:#d9a932}
.faith svg{color:#d9a932}
.chip b{color:#f4ecd8}
.opts.picked .opt:not(.sel),.faiths.picked .faith:not(.sel){opacity:.45}
/* other quiet surfaces follow the same warm tone */
.stat2-row div,.stat-card,.score-row,.pw2-score,.pw2-incbox,.faq details,.guarantee,.pw2-days li,.field,.field.sm,textarea.field,.clock .d{background:var(--opt)}
.field:focus,.field:focus-visible{background:var(--opt-hi)}
.bar .track,.kg .track{background:var(--track)}

/* ---------- progress: only the current section (user, 28 Sep) ---------- */
.progress,.progress.over{grid-template-columns:1fr}
.pseg{display:none}
.pseg.on{display:flex}

/* ---------- no panels at all (user, 28 Sep: tinted dark boxes read as glassmorphism) ----------
   Nothing sits on a translucent-looking dark box: plain text on the black page, solid gold
   (selected / primary), or solid cream (inputs). */
:root{--opt:transparent;--opt-hi:transparent}
/* options: gold badge + text on the page; selected = solid gold pill */
.opt,.chip,.plan,.lopt:not(:first-child){background:transparent!important}
.opt{min-height:52px;gap:16px;padding-left:4px;padding-right:4px;border-radius:14px}
.opt .k{width:34px;height:34px;border-radius:50%;background:#d9a932!important;color:#0b1219!important;font-size:13px;font-weight:700}
.opt.sel{padding-left:12px;padding-right:12px}
.opt.sel .k{background:#0b1219!important;color:#f2cf6b!important}
@media (hover:hover){.opt:not(.sel):hover,.chip:not(.sel):hover,.faith:not(.sel):hover,.lopt:not(:first-child):not(.sel):hover{background:transparent!important;color:#fff}}
/* a chosen answer keeps its gold under the pointer (28 Sep bug: hover wiped it, dark text on black) */
.opt.sel,.opt.sel:hover,.faith.sel,.faith.sel:hover,.plan.sel,.plan.sel:hover{background:var(--gold-grad)!important;color:var(--gold-ink)!important}
.chip.sel,.chip.sel:hover{background:var(--ember)!important;color:#fff4ec!important}
.opts{gap:4px}
.lopt:not(:first-child){color:var(--cream);text-decoration:underline;text-decoration-color:rgba(239,227,200,.35);text-underline-offset:5px}
/* faith: solid gold medallion with a dark symbol + name, no tile; selected = solid gold tile */
.faiths{row-gap:18px}
.faith{background:transparent!important;min-height:0;padding:10px 6px;gap:10px;border-radius:18px}
.faith svg{box-sizing:content-box;width:26px!important;height:26px!important;padding:15px;border-radius:50%;background:#d9a932;color:#0b1219!important;transform:none!important}
.faith.wide{flex-direction:row;gap:12px;padding:8px 6px}
.faith.wide svg{width:20px!important;height:20px!important;padding:11px}
.faith.sel{background:var(--gold-grad)!important}
.faith.sel svg{background:#0b1219;color:#f2cf6b!important}
/* sins: plain words; picked = solid red pill */
.chip{justify-content:flex-start;padding:12px 14px!important;border-radius:12px;min-height:0}
.chip b{font-size:17px}
.chip.sel{background:#b3362d!important}
/* inputs: solid cream, dark text */
.field,.field.sm,textarea.field{background:#efe3c8!important;color:#0b1219}
.field::placeholder{color:#7d8a99}
.field:focus,.field:focus-visible{background:#fbf4e2!important}
.field.err{background:#f3d6cf!important}
/* data blocks: plain text, no boxes */
.stat2-row div,.stat-card,.score-row,.pw2-score,.pw2-incbox,.faq details,.guarantee,.pw2-days li,.clock .d,.pw2-card,.pct,.reading{background:transparent!important}
.stat2-row div{padding:4px}
.pw2-incbox,.pw2-score,.score-row,.reading,.pct,.guarantee{padding-left:0;padding-right:0}
.faq details{padding:0}
.faq{gap:0}
.pw2-days li{padding:8px 0}
.pw2-days .n{background:#d9a932;color:#0b1219}
.ring{background:#b3362d!important}
.ring b{color:#fff!important}
.pw2-card{padding:6px 0 0}

/* ---------- red = ember gradient, like the gold (user, 28 Sep: flat brick red looked bad) ---------- */
:root{--ember:linear-gradient(135deg,#f06a4f 0%,#c8322a 48%,#7d1612 100%)}
.chip.sel,.ring,.lc-banner,.mark .lbl{background:var(--ember)!important;color:#fff4ec}
.chip.sel b{color:#fff4ec}
.btn-red{background:var(--ember)}
.ring b{color:#fff4ec!important}

/* ---------- progress as dots (user, 28 Sep): one dot per step of the current section ---------- */
.pseg,.pseg.on{display:none}
.pdots{display:flex;align-items:center;gap:7px;height:10px}
.pdots i{flex:none;width:8px;height:8px;border-radius:99px;background:var(--track);transition:width .4s var(--ease-out),background .4s}
.pdots i.done{background:#c9972c}
.pdots i.on{width:26px;background:var(--gold-grad)}
.progress .pdots i{position:static;display:block;height:8px;background:#1f2b37}
.progress .pdots i::after{display:none}
.progress .pdots i.done{background:#c9972c}
.progress .pdots i.on{background:var(--gold-grad)}

/* ---------- life clock v2 (28 Sep): their life as an hourglass ---------- */
.lc2{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:22px;margin-top:8px}
.lc2-glass svg{display:block;width:118px;height:auto}
.lc2-fall circle{animation:fall 1.2s linear infinite}
.lc2-fall circle:nth-child(2){animation-delay:.4s}.lc2-fall circle:nth-child(3){animation-delay:.8s}
@keyframes fall{0%{transform:translateY(-8px);opacity:0}25%{opacity:1}100%{transform:translateY(22px);opacity:0}}
.lc2-num{font-size:58px;font-weight:700;letter-spacing:-.04em;line-height:1;background:linear-gradient(180deg,#f6de96,#c9972c);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums}
.lc2-unit{margin-top:6px;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold2)}
.lc2-tick{margin-top:14px;font-size:20px;font-weight:600;color:var(--cream);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.lc2-tick span{display:inline-block;min-width:1.35em}
.lc2-h{margin-top:30px;font-size:22px!important;font-weight:500!important;line-height:1.3!important;color:#b9bec8!important}
.lc2-facts{margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.lc2-facts div{display:flex;flex-direction:column;gap:4px}
.lc2-facts b{font-size:22px;font-weight:700;color:var(--cream);letter-spacing:-.02em}
.lc2-facts span{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}

/* ---------- confession (28 Sep): after it burns, only the answer shows ---------- */
.released-on > .eyebrow,.released-on > h2,.released-on > .lead{display:none}
.released{gap:14px;min-height:0;padding-top:10px}
.released h3{font-family:var(--lex);font-weight:700;font-size:30px;text-transform:none;letter-spacing:-.02em;color:var(--cream)}
.released .quote{font-size:16px!important;line-height:1.55;color:#9a927f;max-width:22em}
.released .ref{display:none}
.lc2-glass svg{width:134px}
.lc2-tick span{min-width:0}

/* ---------- palm-scan pop-up questions (28 Sep): solid cream sheet, no blur ---------- */
.qpop{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,0);transition:background .28s}
.qpop.in{background:rgba(0,0,0,.62)}
.qpop-sheet{width:100%;max-width:480px;background:#efe3c8;color:#0b1219;border-radius:24px 24px 0 0;padding:26px 22px calc(22px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .32s var(--ease-out)}
.qpop.in .qpop-sheet{transform:none}
.qpop-k{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#a1660d}
.qpop-sheet h3{margin-top:10px;font-family:var(--lex);font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.02em;color:#0b1219;text-transform:none}
.qpop-a{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.qpop-a .btn{height:54px}
.qpop-no{background:#0b1219;color:#efe3c8}

/* ---------- glowing particles (user, 28 Sep): back on, behind the content ---------- */
#amb{display:block;z-index:0;mix-blend-mode:normal}
#app{z-index:2}

/* ---------- red numbers: red → black gradient (user, 28 Sep) ---------- */
.bignum.red,.stat2 .bignum,.pw2-sc b.now{background:linear-gradient(180deg,#ff5040 0%,#c8231a 45%,#4a0907 100%);-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none}
.stat2-cap{color:#d8392d}

/* ---------- landing answers (28 Sep): three equal choices like the quiz answers ---------- */
.lopts{gap:6px}
.lopt,.lopt:first-child,.lopt:not(:first-child){display:flex;align-items:center;justify-content:flex-start;gap:16px;min-height:60px;padding:8px 10px;border-radius:16px;
  background:transparent!important;box-shadow:none!important;color:var(--cream)!important;text-decoration:none!important;font:600 17px/1.2 var(--lex);text-align:left}
.lopt .lk{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#d9a932;color:#0b1219;font-weight:700;font-size:18px}
.lopt .lk svg{width:19px;height:19px}
.lopt.sel{background:var(--gold-grad)!important;color:var(--gold-ink)!important}
.lopt.sel .lk{background:#0b1219;color:#f2cf6b}
@media (hover:hover){.lopt:not(.sel):hover{color:#fff!important}.lopt:not(.sel):hover .lk{background:#e6bf55}}
.screen[data-s="landing"] .foot{background:transparent}

/* ---------- palette from the user's reference (28 Sep): blue-black with a fine dot texture, vivid golden yellow ---------- */
:root{--bg:#0b1219;--paper:#0b1219;--cream:#f4ecd8;--gold:#c9972c;--gold2:#d9a932;--gold3:#f6de96;--gold-ink:#0b1219;--mute:#7d8a99;
  --gold-grad:linear-gradient(135deg,#f2cf6b 0%,#d9a932 42%,#a8741c 100%);--track:#1b2732;--track-on:#26384a}
html,body{background-color:#0b1219}
body{background-image:radial-gradient(rgba(140,170,200,.075) 1px,transparent 1.3px);background-size:5px 5px}
.top,.top.clear,.foot,.stickybuy,.progress,.progress.over{background:#0b1219}
.screen[data-s="landing"] .foot{background:transparent}
.lead,.stat2-h,.lc2-h{color:#aebbc9!important}
.pdots{justify-content:flex-end}   /* 28 Sep: dots sit on the right, above "k / n" */
/* 28 Sep: no dot texture; a darker blue-black */
:root{--bg:#070b10;--paper:#070b10}
html,body{background:#070b10}
body{background-image:none}
.top,.top.clear,.foot,.stickybuy,.progress,.progress.over{background:#070b10}
.screen[data-s="landing"] .foot{background:transparent}

/* ---------- soul page (28 Sep) ---------- */
.soul-art{display:flex;justify-content:center;margin-top:10px}
.soul-art img{width:auto;height:44vh;height:44dvh;max-height:400px;max-width:88%;object-fit:contain;filter:drop-shadow(0 0 22px rgba(217,169,50,.35)) drop-shadow(0 0 60px rgba(217,169,50,.18));animation:soulfloat 6s ease-in-out infinite}
@keyframes soulfloat{50%{transform:translateY(-6px)}}
.soul-body{margin-top:18px}
.soul-body h2{font-size:26px!important}
.soul-body .quote{margin-top:14px;font-size:17px!important;line-height:1.5;color:#aebbc9}
.soul-body .ref{margin-top:10px;color:var(--gold2)}

/* ---------- gold glyph icons on answers (28 Sep) — gradient painted through the icon shape ---------- */
.opt .k.g,.lopt .lk.g{width:30px!important;height:30px!important;border-radius:0!important;background:var(--gold-grad)!important;
  -webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat;flex:none}
.opt.sel .k.g,.lopt.sel .lk.g{background:#0b1219!important}
.opt.has-g{gap:18px}

/* ---------- zodiac (28 Sep) ---------- */
.zodiac{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 6px}
.zod{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 4px;border-radius:16px;background:transparent;color:var(--cream);font-family:var(--lex);transition:background .2s}
.zod .zg{font-family:'Noto Sans Symbols 2','Noto Sans Symbols','Segoe UI Symbol',sans-serif;font-size:34px;line-height:1.1;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.zod b{font-size:14px;font-weight:600}
.zod small{font-size:10px;color:var(--mute);letter-spacing:.02em}
.zod.sel{background:var(--gold-grad)}
.zod.sel .zg{background:#0b1219;-webkit-background-clip:text;background-clip:text}
.zod.sel b,.zod.sel small{color:#0b1219}
.zodiac.picked .zod:not(.sel){opacity:.45}
@media (hover:hover){.zod:not(.sel):hover b{color:#fff}}

/* ---------- landing video (28 Sep): portrait card in the video's own shape, whole hourglass visible ---------- */
.screen[data-s="landing"] .hero{width:min(64%,250px,30dvh);margin:10px auto 0}
.screen[data-s="landing"] .hero .media{width:100%;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:4/5;object-fit:cover;object-position:center 52%}
.screen[data-s="landing"] .hero-body{margin-top:18px}
.zod{padding:14px 4px}.zod .zg{font-size:36px}
/* sin icons (28 Sep) */
.chip{flex-direction:row;align-items:center;gap:12px}
.chip .ck.g{flex:none;width:24px;height:24px;background:var(--gold-grad);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.chip.sel .ck.g{background:#fff4ec}
/* questions: never more than two lines */
.q h2,.hero-body h1{text-wrap:balance}
.chip .ck.g{display:block!important}
/* 28 Sep: no dark band behind the bottom button, no glow under buttons */
.foot{background:transparent!important;box-shadow:none!important}
.btn-gold,.btn-red,.lopt:first-child{box-shadow:none!important}
.chip .ck.g{background:linear-gradient(180deg,#ff5a45,#b3231a)}   /* 28 Sep: sin icons are red */

/* ---------- photos in their own 4:5 shape (28 Sep: wide strips cropped them badly) ---------- */
.imgband{--ih:32dvh;width:min(calc(var(--ih) * .8),78%);margin:12px auto 0!important}
.imgband.tall{--ih:40dvh}
.imgband.short{--ih:24dvh}
.imgband .media,.imgband.tall .media,.imgband.short .media,.imgband.stat-img .media,.imgband.pw2-hero .media,.verdict .imgband .media,.ending .imgband .media{
  width:100%;height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:4/5;object-fit:cover;object-position:center 45%!important}
.imgband.stat-img,.imgband.pw2-hero{--ih:20dvh}
.imgband + .pad,.imgband.short + .pad{margin-top:18px!important}
.verdict .imgband{--ih:26dvh}
@media (max-height:740px){.imgband{--ih:24dvh}.imgband.tall{--ih:30dvh}.imgband.short,.verdict .imgband{--ih:19dvh}.imgband.stat-img,.imgband.pw2-hero{--ih:15dvh}
  .stone{width:min(calc(34dvh * .8),78%);margin-left:auto!important;margin-right:auto!important}
  .frame{height:min(30dvh,300px)}}
.verdict .imgband{--ih:24dvh}.verdict h1{font-size:30px!important}.verdict .score-row{margin-top:10px;padding-top:6px;padding-bottom:6px}
@media (max-height:740px){.verdict .imgband{--ih:17dvh}.screen[data-s="turn"] .stat-card{margin-top:4px}.screen[data-s="turn"] .quote{font-size:17px!important}.frame{height:24dvh}.upbtns{margin-top:10px}}
/* cut-out images float on the page (28 Sep) */
.cutout{display:flex;justify-content:center;margin:8px auto 0}
.cutout img{height:30dvh;max-height:300px;width:auto;max-width:80%;object-fit:contain;animation:soulfloat 6s ease-in-out infinite}
.cutout.ember-glow img{filter:drop-shadow(0 0 24px rgba(200,40,30,.35)) drop-shadow(0 0 60px rgba(200,40,30,.18))}
.cutout + .pad{margin-top:14px}
@media (max-height:740px){.cutout img{height:22dvh}}
/* stat candles (28 Sep): the subject is a wide row, so full width, cropped to the candles */
.imgband.stat-img{width:100%!important;--ih:auto}
.imgband.stat-img .media{aspect-ratio:16/10!important;object-position:center 55%!important}
@media (max-height:740px){.imgband.stat-img .media{aspect-ratio:2/1!important}}
.imgband.stat-img{width:calc(100% - 48px)!important}
@media (max-height:740px){.stat2 .bignum{font-size:72px}.stat2-h{margin-top:14px;font-size:19px!important}.stat2-row{margin-top:16px}.imgband.stat-img .media{aspect-ratio:5/2!important}}

/* ---------- liquid progress pill (28 Sep) ---------- */
.pdots{position:relative;gap:10px}
.pdots i,.progress .pdots i{width:8px!important;height:8px;background:#1f2b37}
.pdots i.done,.progress .pdots i.done{background:#c9972c}
.pdots .pill{position:absolute;top:50%;height:8px;margin-top:-4px;border-radius:99px;background:var(--gold-grad);
  transition:left .42s cubic-bezier(.5,1.6,.4,1),width .42s cubic-bezier(.5,1.6,.4,1),height .3s,margin .3s}
.pdots .pill.stretch{height:6px;margin-top:-3px;transition:left .26s cubic-bezier(.6,0,.4,1),width .26s cubic-bezier(.6,0,.4,1),height .2s,margin .2s}
.pdots .pill.snap{transition:none}
.pdots .pill.stretch{height:8px;margin-top:-4px}.pdots .pill{z-index:1}
/* pop-up answers as illustrated cards (28 Sep) */
.qpop-a{gap:12px}
.qcard{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px 10px 16px;border-radius:18px;background:#e2d2ad;color:#0b1219;font:600 15px/1.25 var(--lex);text-align:center;transition:transform .15s,background .2s}
.qcard svg{width:64px;height:64px;fill:#0b1219}
.qcard:active{transform:scale(.97)}
@media (hover:hover){.qcard:hover{background:#d9c69b}}
.qcard.sel{background:var(--gold-grad)}

/* ---------- realistic balance scale (28 Sep) ---------- */
.scale-real{position:relative;width:min(92%,380px);margin:14px auto 0;transform-origin:50% 100%}
.scale-real img{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 30px rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(217,169,50,.12))}
.scale-real.angel img{transform:scaleX(-1)}
.scale-real .sl{position:absolute;top:56%;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;opacity:0;transition:opacity .8s 2.2s}
.scale-real .sl.l{left:2%;color:var(--gold2)}.scale-real .sl.r{right:4%;top:80%;color:#ff6a55}
.scale-real.angel .sl.l{top:80%}.scale-real.angel .sl.r{top:56%}
.scale-real{opacity:0;transform:translateY(16px) rotate(0)}
.scale-real.weigh{animation:weigh 2.4s cubic-bezier(.3,.7,.3,1) forwards}
.scale-real.weigh .sl{opacity:1}
@keyframes weigh{0%{opacity:0;transform:translateY(16px) rotate(-4deg)}25%{opacity:1;transform:translateY(0) rotate(3deg)}50%{transform:rotate(-1.6deg)}72%{transform:rotate(.8deg)}100%{opacity:1;transform:rotate(0)}}
@media (max-height:740px){.scale-real{width:min(80%,300px)}}

/* ---------- devil: no card, dissolves into the dark (28 Sep) ---------- */
.verdict .imgband{--ih:36dvh;border-radius:0;overflow:visible;background:none}
.verdict .imgband .media{border-radius:0!important;
  -webkit-mask-image:radial-gradient(ellipse 62% 58% at 50% 46%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 62% 58% at 50% 46%,#000 55%,transparent 100%)}
@media (max-height:740px){.verdict .imgband{--ih:24dvh}}
.verdict .imgband{--ih:40dvh}
.verdict .imgband .media{-webkit-mask-image:radial-gradient(ellipse 72% 64% at 50% 45%,#000 50%,transparent 100%);mask-image:radial-gradient(ellipse 72% 64% at 50% 45%,#000 50%,transparent 100%)}
@media (max-height:740px){.verdict .imgband{--ih:26dvh}}
/* pop-ups in dark mode (28 Sep): solid dark sheet, gold icons */
.qpop-sheet{background:#101722;color:var(--cream)}
.qpop-k{color:var(--gold2)}
.qpop-sheet h3{color:var(--cream)}
.qcard{background:#182130;color:var(--cream)}
.qcard svg{fill:#d9a932}
@media (hover:hover){.qcard:hover{background:#1f2a3b}}
.qcard.sel{background:var(--gold-grad);color:#0b1219}
.qcard.sel svg{fill:#0b1219}

/* ---------- the page never slides sideways; logo always dead centre (28 Sep) ---------- */
html,body{overflow-x:clip;max-width:100%}
body{overscroll-behavior-x:none}
#app{overflow-x:clip}
.screen.shake{animation:shakeIn .7s cubic-bezier(.36,.07,.19,.97) both}
@keyframes shakeIn{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(2px)}30%,50%,70%{transform:translateX(-3px)}40%,60%{transform:translateX(3px)}}
.top{display:grid;grid-template-columns:44px 1fr 44px;align-items:center}
.top .brand{grid-column:2;justify-self:center;justify-content:center;white-space:nowrap}

/* ---------- UX pass (28 Sep) ---------- */
/* Doherty: every tap answers instantly */
.opt,.chip,.faith,.zod,.lopt,.qcard,.btn{-webkit-tap-highlight-color:transparent}
.opt:active,.chip:active,.faith:active,.zod:active,.lopt:active{transform:scale(.97);transition:transform .08s}
.btn:active{transform:scale(.98)}
/* landing: bigger hourglass, answers close to the question (proximity) */
.screen[data-s="landing"] .hero{width:min(72%,290px,36dvh)}
.screen[data-s="landing"] .spacer{flex:0 0 22px;min-height:22px}
.screen[data-s="landing"] .foot{position:static;margin:0;padding-top:0}
/* confession skip sits above the button */
.foot .link.skip{display:block;margin:0 auto 10px;padding:8px 16px;font-size:14px;color:var(--mute);text-decoration:none}
/* "None of these" matches the other choices */
.chip.none .ck.g{background:var(--gold-grad)}
.chip.none{justify-content:flex-start}
/* palm result: three short lines */
.reading .row{padding:6px 0;font-size:15px;align-items:center}
.reading .row b{color:var(--cream)}
/* paywall hero: the realistic scale, leaning to good */
.pw2-scale{display:flex;justify-content:center;margin-top:6px}
.pw2-scale img{width:min(58%,230px);height:auto;transform:scaleX(-1);filter:drop-shadow(0 0 30px rgba(217,169,50,.25));animation:soulfloat 6s ease-in-out infinite}
.pw2-scale + .pad{margin-top:8px}
@media (max-height:760px){.pw2-scale img{width:min(40%,160px)}}
.pw2-scale{transform:scaleX(-1)}.pw2-scale img{transform:none}
/* paywall + angel verdict use scale_good.webp (good side heavy) — no mirroring */
.pw2-scale{transform:none}
.scale-real.angel img{transform:none}
.scale-real.angel .sl.l{top:80%}.scale-real.angel .sl.r{top:52%}

/* ---------- testimonial page (28 Sep): one story at a time ---------- */
.story-deck{position:relative;min-height:250px;margin-top:10px}
.story2{position:absolute;inset:0;margin:0;display:flex;flex-direction:column;align-items:center;text-align:center;opacity:0;transform:translateX(24px);transition:opacity .5s,transform .5s var(--ease-out);pointer-events:none}
.story2.on{opacity:1;transform:none;pointer-events:auto}
.story2 .qm{font:700 84px/0.8 var(--lex);background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;height:44px}
.story2 blockquote{margin:14px 0 0;font:400 19px/1.5 var(--lex);color:var(--cream);max-width:20em}
.story2 figcaption{margin-top:22px;display:flex;align-items:center;gap:12px;text-align:left}
.story2 .av{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--gold-grad);color:#0b1219;font-weight:700;font-size:18px}
.story2 figcaption b{display:block;font-size:15px;color:var(--cream)}
.story2 figcaption span span,.story2 figcaption > span:last-child{font-size:13px;color:var(--mute)}
.story-dots{display:flex;justify-content:center;gap:8px;margin-top:8px}
.story-dots i{width:8px;height:8px;border-radius:99px;background:#1f2b37;cursor:pointer;transition:width .35s var(--ease-out),background .35s}
.story-dots i.on{width:26px;background:var(--gold-grad)}
.story-note{margin-top:14px;font-size:11px;opacity:.6}

/* ---------- paywall v3 (28 Sep): decide at a glance ---------- */
.pw3{padding-top:8px}
.pw3-head{display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:center}
.pw3-scale{width:96px;height:auto;filter:drop-shadow(0 0 18px rgba(217,169,50,.3))}
.pw3-head .eyebrow{margin-bottom:6px}
.pw3-head h1{font-size:26px!important;line-height:1.15!important}
.pw3-jump{margin-top:16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}
.pw3-jump div:not(.pw3-line){display:flex;flex-direction:column;align-items:center}
.pw3-jump b{font-size:34px;font-weight:700;line-height:1;letter-spacing:-.03em}
.pw3-jump b.now{background:linear-gradient(180deg,#ff5040,#c8231a 45%,#4a0907);-webkit-background-clip:text;background-clip:text;color:transparent}
.pw3-jump b.then{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pw3-jump span{margin-top:4px;font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.pw3-line{height:6px;border-radius:99px;background:linear-gradient(90deg,#c8231a,#d9a932);position:relative;overflow:hidden}
.pw3-line i{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-100%);animation:sheen 2.6s ease-in-out infinite}
@keyframes sheen{to{transform:translateX(100%)}}
.pw3-ben{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.pw3-ben li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:500;color:var(--cream)}
.pw3-ben .bi{flex:none;width:22px;height:22px;background:var(--gold-grad);-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.pw3-price{margin-top:18px;position:relative;padding:18px 18px 14px;border-radius:18px;background:#131b27;text-align:center}
.pw3-tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);padding:4px 12px;border-radius:99px;background:var(--gold-grad);color:#0b1219;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.pw3-amt{display:flex;align-items:baseline;justify-content:center;gap:4px}
.pw3-amt b{font-size:46px;font-weight:700;letter-spacing:-.03em;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.pw3-amt em{font-style:normal;font-size:16px;color:var(--mute)}
.pw3-amt s{font-size:18px;color:var(--mute);margin-right:6px}
.pw3-day{font-size:13.5px;color:#aebbc9}
.pw3-cta{margin-top:14px;height:60px;font-size:17px}
.pw3-trust{margin-top:12px;display:flex;justify-content:center;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:#aebbc9}
.pw3-trust span{display:inline-flex;align-items:center;gap:6px}
.pw3-trust svg{width:14px;height:14px;color:var(--gold2)}
.pw3-quote{margin:30px 0 0;text-align:center}
.pw3-quote blockquote{margin:0;font-size:17px;line-height:1.5;color:var(--cream)}
.pw3-quote figcaption{margin-top:10px;font-size:13px;color:var(--gold2)}
.pw3-quote small{color:var(--mute);font-size:11px}
.pw3-art{margin-top:30px;text-align:center}
.pw3-art img{width:min(78%,300px);height:auto;filter:drop-shadow(0 0 30px rgba(217,169,50,.2))}
.pw3-art p{margin-top:10px;font-size:15px;color:#aebbc9;line-height:1.5}
.pw3-art p b{color:var(--cream);font-weight:600}
.pw3-final{text-align:center;margin-bottom:12px;font-size:14px;color:#aebbc9}
.pw3-final b{font-size:20px;color:var(--cream)}
@media (max-height:740px){.pw3-head{grid-template-columns:72px 1fr}.pw3-scale{width:72px}.pw3-head h1{font-size:22px!important}.pw3-ben{margin-top:12px;gap:6px}.pw3-price{margin-top:14px;padding:14px 14px 10px}.pw3-amt b{font-size:38px}}
.pw3-trust{flex-wrap:nowrap;gap:12px;font-size:12px;white-space:nowrap}

/* ---------- Continue button: inactive until an answer is chosen (28 Sep) ---------- */
.btn-gold[disabled]{opacity:1;background:#141c27!important;color:#6f7d8e!important;box-shadow:none!important}
.btn-gold.wake{animation:wake .5s var(--ease-out)}
@keyframes wake{0%{transform:scale(.96)}60%{transform:scale(1.03)}100%{transform:none}}
.screen[data-s="landing"] .spacer{flex:1 0 16px}
.screen[data-s="landing"] > .foot:last-child{position:sticky;bottom:0}
/* how-to hint under each question (28 Sep) */
.hint{margin-top:8px;font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--gold2)}
.hint.center{text-align:center;margin:0 0 10px}
.soul-body h2{font-size:25px!important;max-width:14em;margin:0 auto}

/* ---------- verdict v2 (28 Sep): image → word → number → one line ---------- */
.v2-art{display:flex;justify-content:center;margin-top:4px}
.v2-art img{height:36dvh;max-height:360px;width:auto;max-width:90%;animation:soulfloat 6s ease-in-out infinite;filter:drop-shadow(0 0 40px rgba(220,30,20,.25))}
.v2-body{margin-top:-10px}
.v2-word{font-size:44px!important;letter-spacing:-.03em;margin-top:2px}
.v2.devil .v2-word,.v2.warning .v2-word{background:linear-gradient(180deg,#ff6a55,#c8231a 55%,#6a0d09);-webkit-background-clip:text;background-clip:text;color:transparent}
.v2.angel .v2-word{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.v2-score{margin-top:12px;display:flex;align-items:baseline;justify-content:center;gap:2px}
.v2-score b{font-size:64px;font-weight:700;line-height:1;letter-spacing:-.04em;color:var(--cream);font-variant-numeric:tabular-nums}
.v2-score span{font-size:20px;color:var(--mute)}
.v2-lab{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin-top:4px}
.v2-line{margin-top:16px;font-size:15px;color:#aebbc9}
.v2-line b{color:#ff6a55;font-weight:600}
.v2.angel .v2-line b{color:var(--gold2)}
@media (max-height:740px){.v2-art img{height:26dvh}.v2-word{font-size:36px!important}.v2-score b{font-size:50px}}

/* ---------- pop-ups: centred cards that scale in, not a sheet from the bottom (28 Sep) ---------- */
.qpop{align-items:center;padding:20px}
.qpop-sheet{border-radius:24px;max-width:400px;padding:24px 20px 20px;transform:scale(.9);opacity:0;transition:transform .3s cubic-bezier(.3,1.4,.5,1),opacity .2s}
.qpop.in .qpop-sheet{transform:none;opacity:1}
.qpop-k,.qpop-sheet h3{text-align:center}
.v2-word,.v2-word *{-webkit-text-fill-color:initial}
.v2.devil .v2-word,.v2.warning .v2-word{background:none;color:#ff4a3a!important;text-shadow:0 0 30px rgba(255,40,20,.35)}
.v2.angel .v2-word{background:none;color:var(--gold2)!important}

/* paywall hero scale (28 Sep) */
.pw3-hero{display:flex;justify-content:center;margin-top:-4px}
.pw3-hero img{width:min(62%,240px);height:auto;filter:drop-shadow(0 0 40px rgba(217,169,50,.3));animation:soulfloat 6s ease-in-out infinite}
.pw3-head{display:block;margin-top:6px}
.pw3-head h1{font-size:28px!important}
@media (max-height:760px){.pw3-hero img{width:min(40%,150px)}.pw3-head h1{font-size:23px!important}}

/* progress pill as a loading bar (28 Sep) */
.pdots .pill{overflow:hidden}
.pdots .pill::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,transparent 0%,rgba(255,250,230,.75) 50%,transparent 100%);transform:translateX(-100%);animation:pillload 1.6s ease-in-out infinite}
@keyframes pillload{to{transform:translateX(100%)}}