:root{
  --ink:#0b1640; --paper:#fff8e7; --red:#ff2d3d; --yellow:#ffd23f; --blue:#2a8bff;
  --display:"Bangers",Impact,sans-serif; --body:"Nunito",system-ui,sans-serif; --mono:"Space Mono",ui-monospace,monospace;
  --line:4px solid var(--ink); --shadow:8px 8px 0 var(--ink);
  --dots:radial-gradient(rgba(11,22,64,.16) 1.4px,transparent 1.6px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:#8fd0ff;-webkit-text-size-adjust:100%}
body{font-family:var(--body);color:var(--ink);font-size:19px;line-height:1.5;overflow-x:hidden;background:transparent}
body.closed{overflow:hidden;height:100vh}
img,video{display:block;max-width:100%}
a{color:inherit}
b{font-weight:900}
::selection{background:var(--yellow)}

/* ---------- BUTTONS ---------- */
.btn{font-family:var(--display);font-size:24px;letter-spacing:.06em;padding:12px 26px;border:var(--line);box-shadow:6px 6px 0 var(--ink);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;
  transition:transform .12s,box-shadow .12s;color:var(--ink);background:#fff;border-radius:10px}
.btn:hover{transform:translate(-2px,-2px) rotate(-1deg);box-shadow:9px 9px 0 var(--ink)}
.btn:active{transform:translate(4px,4px);box-shadow:2px 2px 0 var(--ink)}
.btn-red{background:var(--red);color:#fff;text-shadow:2px 2px 0 var(--ink)}
.btn-yellow{background:var(--yellow)}
.btn-white{background:#fff}
.hud-btn{font-family:var(--mono);font-weight:700;font-size:12px;background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:8px;padding:6px 10px;cursor:pointer;box-shadow:3px 3px 0 var(--ink);text-decoration:none;white-space:nowrap}
.hud-btn[aria-pressed=true]{background:var(--yellow)}
.ca{display:inline-flex;align-items:center;gap:10px;background:#fff;border:3px solid var(--ink);border-radius:10px;padding:6px 6px 6px 12px;box-shadow:4px 4px 0 var(--ink);max-width:100%}
.ca-label{font-family:var(--display);font-size:20px;color:var(--red)}
.ca code{font-family:var(--mono);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ca-copy{font-family:var(--display);font-size:17px;letter-spacing:.05em;background:var(--yellow);border:3px solid var(--ink);border-radius:7px;padding:3px 10px;cursor:pointer;color:var(--ink)}
.ca.live{background:#fffbe0}

/* ---------- COVER ---------- */
#cover{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px;perspective:2200px;overflow:auto;
  background:var(--dots) 0 0/14px 14px,radial-gradient(circle at 50% 40%,#ffe98a,#ffb81f 70%)}
.cover-book{width:min(540px,100%);transform-style:preserve-3d}
.cover-front{position:relative;background:var(--paper);border:var(--line);border-radius:6px;box-shadow:14px 14px 0 var(--ink);padding:14px;display:flex;flex-direction:column;gap:10px;
  transform-origin:left center;transition:transform 1s cubic-bezier(.6,.05,.3,1),opacity .4s .7s;animation:coverIn .8s cubic-bezier(.2,1.4,.4,1)}
@keyframes coverIn{from{transform:scale(.6) rotate(-8deg);opacity:0}}
#cover.opening .cover-front{transform:rotateY(-115deg);opacity:0}
#cover.opening{animation:coverFade .5s .75s forwards;pointer-events:none}
@keyframes coverFade{to{opacity:0;visibility:hidden}}
.cover-top{display:flex;align-items:stretch;gap:10px}
.cv-logo{flex:1;font-family:var(--display);font-size:clamp(38px,9vw,64px);line-height:.9;color:var(--yellow);-webkit-text-stroke:2px var(--ink);text-shadow:4px 4px 0 var(--ink);background:var(--red);border:3px solid var(--ink);padding:6px 12px}
.cv-issue{font-family:var(--display);font-size:16px;line-height:1;text-align:center;border:3px solid var(--ink);padding:8px 10px;background:#fff}
.cv-issue b{font-size:36px;font-weight:400}
.cv-price{font-family:var(--display);font-size:20px;writing-mode:vertical-rl;border:3px solid var(--ink);padding:6px 4px;background:var(--yellow)}
.cv-title{font-family:var(--display);font-weight:400;line-height:.88;text-align:center;color:#fff;-webkit-text-stroke:2px var(--ink);text-shadow:5px 5px 0 var(--ink)}
.cv-title span{display:block;font-size:clamp(40px,9.5vw,68px)}
.cv-title span:last-child{color:var(--yellow);font-size:clamp(30px,7.4vw,52px)}
.cv-art{border:3px solid var(--ink);overflow:hidden;aspect-ratio:16/8}
.cv-art img{width:100%;height:100%;object-fit:cover;object-position:52% 30%}
.cv-blurb{position:absolute;right:-18px;top:46%;font-family:var(--display);font-size:clamp(16px,3.4vw,21px);line-height:1;width:130px;padding:26px 16px;text-align:center;transform:rotate(12deg);animation:wobble 1.6s ease-in-out infinite}
@keyframes wobble{50%{transform:rotate(6deg) scale(1.06)}}
.burst-y{background:var(--yellow);clip-path:polygon(50% 0,61% 18%,82% 6%,79% 29%,100% 32%,85% 50%,100% 68%,79% 71%,82% 94%,61% 82%,50% 100%,39% 82%,18% 94%,21% 71%,0 68%,15% 50%,0 32%,21% 29%,18% 6%,39% 18%)}
.cv-bottom{display:flex;flex-direction:column;align-items:center;gap:12px}
.btn.btn-open{font-size:clamp(26px,5.6vw,36px);padding:12px 30px;animation:tap 1.2s ease-in-out infinite}
@keyframes tap{50%{transform:scale(1.06) rotate(-1.5deg)}}

/* ---------- SKY (scroll: day → sunset → space) ---------- */
#sky{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,var(--sky-top,#5fb6ff),var(--sky-bot,#c6ecff));overflow:hidden}
.stars{position:absolute;inset:0;opacity:var(--night,0);
  background-image:radial-gradient(1.5px 1.5px at 12% 20%,#fff,transparent),radial-gradient(2px 2px at 30% 70%,#fff,transparent),radial-gradient(1.5px 1.5px at 55% 35%,#fff,transparent),radial-gradient(2px 2px at 72% 15%,#fff,transparent),radial-gradient(1.5px 1.5px at 85% 60%,#fff,transparent),radial-gradient(1.5px 1.5px at 40% 50%,#fff,transparent),radial-gradient(2px 2px at 92% 85%,#fff,transparent),radial-gradient(1.5px 1.5px at 8% 88%,#fff,transparent);
  background-size:420px 420px}
.sun{position:absolute;width:26vmin;aspect-ratio:1;border-radius:50%;right:8vw;top:calc(10vh + var(--sunY,0) * 1vh);background:radial-gradient(circle,#fff6c9 0 40%,#ffd23f 62%,rgba(255,210,63,0) 72%);opacity:calc(1 - var(--night,0))}
.clouds{position:absolute;left:0;width:200%;height:30vh;display:flex;justify-content:space-around;align-items:center}
.clouds.c1{top:16vh;animation:drift 70s linear infinite}
.clouds.c2{top:60vh;animation:drift 45s linear infinite reverse;opacity:.8}
.clouds>i{position:relative;display:block;width:260px;height:80px;background:#fff;border-radius:80px;opacity:calc(1 - var(--night,0) * .8)}
.clouds>i::before,.clouds>i::after{content:"";position:absolute;background:#fff;border-radius:50%}
.clouds>i::before{width:120px;height:120px;left:40px;top:-60px}
.clouds>i::after{width:90px;height:90px;left:130px;top:-40px}
.clouds.c2>i{transform:scale(.7)}
@keyframes drift{to{transform:translateX(-50%)}}
#cape{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
#hero-fly{position:fixed;left:0;top:0;z-index:2;width:clamp(64px,8vw,110px);pointer-events:none;will-change:transform;filter:drop-shadow(4px 4px 0 var(--ink))}
#hero-fly img{width:100%;border-radius:50%;border:3px solid var(--ink)}
#confetti{position:fixed;inset:0;width:100%;height:100%;z-index:90;pointer-events:none}
#bursts{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden}
.boom{position:absolute;font-family:var(--display);font-size:clamp(30px,4.4vw,58px);line-height:1;color:var(--red);-webkit-text-stroke:2px var(--ink);text-shadow:3px 3px 0 var(--ink);
  padding:46px 40px;background:var(--yellow);clip-path:polygon(50% 0,61% 18%,82% 6%,79% 29%,100% 32%,85% 50%,100% 68%,79% 71%,82% 94%,61% 82%,50% 100%,39% 82%,18% 94%,21% 71%,0 68%,15% 50%,0 32%,21% 29%,18% 6%,39% 18%);
  animation:boom 1.1s cubic-bezier(.2,1.6,.4,1) forwards;white-space:nowrap}
@keyframes boom{0%{transform:scale(0) rotate(var(--r))}18%{transform:scale(1.15) rotate(var(--r))}28%{transform:scale(1) rotate(var(--r))}80%{opacity:1;transform:scale(1) rotate(var(--r))}100%{opacity:0;transform:scale(1.3) rotate(var(--r))}}

/* ---------- HUD ---------- */
#hud{position:fixed;top:12px;left:12px;right:12px;z-index:50;display:flex;align-items:center;gap:12px;padding:8px 12px;background:#fff;border:var(--line);border-radius:12px;box-shadow:5px 5px 0 var(--ink);transition:transform .4s cubic-bezier(.2,1.4,.4,1)}
body.closed #hud{transform:translateY(-140%)}
.hud-brand{font-family:var(--display);font-size:28px;line-height:1;text-decoration:none;color:var(--red);-webkit-text-stroke:1px var(--ink);display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.hud-brand small{font-family:var(--mono);font-size:11px;color:var(--ink);-webkit-text-stroke:0;letter-spacing:.08em}
.alt{display:flex;align-items:center;gap:10px;flex:1;max-width:420px;margin-left:auto;font-family:var(--mono);font-size:11px;font-weight:700}
.alt-bar{flex:1;height:14px;border:3px solid var(--ink);border-radius:8px;background:#e8f4ff;overflow:hidden}
.alt-bar i{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);background:repeating-linear-gradient(-45deg,var(--red) 0 8px,#ff5a66 8px 16px)}
#alt-num{min-width:96px;text-align:right}

/* ---------- PAGES ---------- */
#book{position:relative;z-index:3}
.page{position:relative;min-height:100vh;padding:120px max(20px,calc(50vw - 620px)) 80px}
.chapter{display:inline-block;font-family:var(--display);font-size:clamp(22px,2.6vw,30px);letter-spacing:.04em;background:var(--yellow);border:var(--line);padding:4px 16px;box-shadow:5px 5px 0 var(--ink);transform:rotate(-1.5deg);margin-bottom:34px}
.chapter b{font-weight:400;color:var(--red)}
.chapter small{font-family:var(--mono);font-size:12px}
.caption{display:inline-block;font-family:var(--display);font-size:clamp(18px,1.8vw,22px);letter-spacing:.05em;background:var(--yellow);border:3px solid var(--ink);padding:4px 12px;box-shadow:4px 4px 0 var(--ink)}
.lead{font-size:clamp(18px,1.7vw,22px);font-weight:700;max-width:560px}
.panel{position:relative;background:#fff;border:var(--line);box-shadow:var(--shadow);overflow:hidden}
.panel>img{width:100%;height:100%;object-fit:cover}
.pop{opacity:0;transform:scale(.7) rotate(var(--pr,-3deg));transition:opacity .35s,transform .6s cubic-bezier(.2,1.6,.4,1)}
.pop.in{opacity:1;transform:rotate(var(--pr2,0deg))}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px}

/* splash */
.splash-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;min-height:calc(100vh - 220px)}
.mega{font-family:var(--display);font-weight:400;line-height:.86;margin:16px 0 18px}
.mega span{display:block;font-size:clamp(64px,9vw,150px);color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:4px 4px 0 var(--ink),8px 8px 0 var(--red);animation:bob 3s ease-in-out infinite}
.mega .mega-2{font-size:clamp(40px,5.6vw,94px);color:var(--yellow);text-shadow:4px 4px 0 var(--ink),8px 8px 0 var(--blue);animation-delay:-1.5s}
@keyframes bob{50%{transform:translateY(-6px) rotate(-.6deg)}}
.ca-hero{margin-top:20px}
.splash-art{aspect-ratio:4/3;--pr:4deg;--pr2:1.5deg}
.kb{animation:kb 14s ease-in-out infinite alternate;transform-origin:55% 30%}
@keyframes kb{to{transform:scale(1.18)}}
.bubble{position:absolute;max-width:62%;background:#fff;border:3px solid var(--ink);border-radius:26px;padding:12px 16px;font-family:var(--display);font-size:clamp(17px,1.7vw,22px);letter-spacing:.03em;line-height:1.1;box-shadow:4px 4px 0 var(--ink);min-height:48px;opacity:0;transform:scale(.4);transform-origin:20% 100%;transition:.4s cubic-bezier(.2,1.6,.4,1) .35s}
.pop.in .bubble{opacity:1;transform:none}
.b-right{left:14px;top:14px}
.b-left{right:14px;top:14px;transform-origin:80% 100%}
.bubble::after{content:"";position:absolute;bottom:-17px;width:24px;height:20px;background:#fff;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);clip-path:polygon(0 0,100% 0,100% 100%)}
.b-right::after{right:34px}
.b-left::after{left:34px;transform:scaleX(-1)}
.scroll-cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);font-family:var(--display);font-size:22px;letter-spacing:.08em;background:#fff;border:3px solid var(--ink);border-radius:30px;padding:4px 16px;box-shadow:4px 4px 0 var(--ink);white-space:nowrap}
.scroll-cue span{display:inline-block;animation:bounce 1s infinite;color:var(--red)}
@keyframes bounce{50%{transform:translateY(5px)}}

/* origin strip */
.strip{display:grid;grid-template-columns:1.2fr 1fr;grid-template-rows:300px 300px;gap:18px}
.p1{--pr:-5deg;--pr2:-1deg}
.p2{--pr:5deg;--pr2:1deg}
.p3{--pr:6deg;--pr2:-1deg}
.p4{--pr:-6deg;--pr2:1deg}
.strip .caption{position:absolute;left:10px;bottom:10px;right:10px;font-size:clamp(15px,1.5vw,19px)}
.zap{background:var(--dots) 0 0/12px 12px,radial-gradient(circle,#fff5b0,#ffd23f 50%,#ff9f1a);display:grid;place-items:center}
.zap-word{font-family:var(--display);font-size:clamp(70px,9vw,140px);color:var(--red);-webkit-text-stroke:3px var(--ink);text-shadow:6px 6px 0 var(--ink);transform:rotate(-8deg);animation:zapShake .25s infinite}
@keyframes zapShake{50%{transform:rotate(-6deg) translate(2px,-2px)}}

/* profile */
.profile-card{--pr:-6deg;--pr2:-1deg;display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:center;padding:26px;background:var(--paper);border:var(--line);border-radius:16px;box-shadow:var(--shadow);max-width:1000px;margin:0 auto;position:relative;overflow:hidden}
.profile-card::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:color-dodge;opacity:.45;
  background:linear-gradient(115deg,transparent 20%,rgba(255,0,150,.35) 35%,rgba(0,220,255,.35) 45%,rgba(255,240,0,.35) 55%,transparent 70%);background-size:250% 250%;background-position:var(--hx,50%) var(--hy,50%)}
.pc-art{perspective:800px}
.pc-art img{width:100%;border-radius:50%;border:var(--line);box-shadow:6px 6px 0 var(--ink);animation:spinY 6s ease-in-out infinite}
@keyframes spinY{0%,40%{transform:rotateY(0)}55%,100%{transform:rotateY(360deg)}}
.pc-name{font-family:var(--display);font-weight:400;font-size:clamp(64px,8vw,110px);line-height:.9;color:var(--red);-webkit-text-stroke:3px var(--ink);text-shadow:5px 5px 0 var(--ink)}
.pc-sub{font-family:var(--mono);font-size:12px;font-weight:700;margin:6px 0 16px}
.stats{list-style:none;display:grid;gap:10px}
.stats li{display:grid;grid-template-columns:130px 1fr 74px;align-items:center;gap:12px;font-family:var(--display);font-size:20px;letter-spacing:.04em}
.stats b{font-family:var(--display);font-weight:400;text-align:right;color:var(--red)}
.sbar{height:20px;border:3px solid var(--ink);border-radius:10px;background:#fff;overflow:hidden}
.sbar i{display:block;height:100%;width:0;background:repeating-linear-gradient(-45deg,var(--blue) 0 10px,#58a6ff 10px 20px);transition:width 1.4s cubic-bezier(.2,1,.3,1)}

/* cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.card{--pr:8deg;border:0;background:none;padding:0;cursor:pointer;perspective:1200px;aspect-ratio:3/4;font:inherit;color:inherit;text-align:left}
.card:nth-child(2){--pr:-8deg;--pr2:1deg}
.card:nth-child(3){--pr2:-1deg}
.card-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,1.3,.4,1)}
.card:hover .card-in{transform:rotateY(12deg) translateY(-6px)}
.card.flipped .card-in{transform:rotateY(180deg)}
.card.flipped:hover .card-in{transform:rotateY(170deg) translateY(-6px)}
.cf{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:var(--line);border-radius:18px;box-shadow:var(--shadow);padding:22px;display:flex;flex-direction:column}
.front{justify-content:space-between;background:var(--dots) 0 0/12px 12px,var(--c)}
.c-blue{--c:#58a6ff}.c-red{--c:#ff5a66}.c-yellow{--c:#ffd23f}
.c-no{font-family:var(--display);font-size:26px;background:#fff;border:3px solid var(--ink);border-radius:50%;width:48px;height:48px;display:grid;place-items:center}
.c-ico{font-size:clamp(70px,8vw,110px);line-height:1;text-align:center;color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:5px 5px 0 var(--ink)}
.cf h3{font-family:var(--display);font-weight:400;font-size:clamp(32px,3.4vw,46px);line-height:1;color:#fff;-webkit-text-stroke:2px var(--ink);text-shadow:4px 4px 0 var(--ink)}
.front p{font-family:var(--mono);font-size:12px;font-weight:700}
.back{transform:rotateY(180deg);background:var(--paper);justify-content:center;gap:14px}
.back h3{color:var(--red)}
.back p{font-weight:700;font-size:18px}
.c-stat{align-self:flex-start;font-family:var(--display);font-size:22px;background:var(--yellow);border:3px solid var(--ink);padding:2px 12px;border-radius:8px}

/* coin flip */
.flip-wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.flip-stage{position:relative;display:grid;place-items:center;height:min(520px,70vw);perspective:1600px}
.coin{position:relative;width:min(380px,62vw);aspect-ratio:1;transform-style:preserve-3d;transition:transform 1.8s cubic-bezier(.25,1.15,.35,1)}
.coin .face{position:absolute;inset:0;border-radius:50%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:4px solid var(--ink)}
.coin .face img{width:100%;height:100%;border-radius:50%}
.coin .tails{transform:rotateY(180deg)}
.coin-shadow{position:absolute;bottom:2%;width:42%;height:18px;border-radius:50%;background:rgba(11,22,64,.28);filter:blur(4px)}
.flip-result{font-family:var(--display);font-weight:400;font-size:clamp(46px,6vw,86px);line-height:.95;color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:5px 5px 0 var(--ink);margin-bottom:12px}
.btn.btn-flip{font-size:34px;padding:12px 40px;margin:22px 0 14px}
.flip-count{font-family:var(--mono);font-size:13px;font-weight:700}

/* launch tags + pair */
.launch-tag{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.launch-tag span{font-family:var(--mono);font-weight:700;font-size:12px;background:#fff;border:3px solid var(--ink);border-radius:20px;padding:4px 12px;box-shadow:3px 3px 0 var(--ink)}
.pair-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;max-width:980px;margin:0 auto 34px}
.pair-side{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:24px;border:var(--line);border-radius:18px;box-shadow:var(--shadow)}
.pair-side.si{background:var(--dots) 0 0/12px 12px,#58a6ff;--pr:-8deg;--pr2:-2deg}
.pair-side.rsi{background:var(--dots) 0 0/12px 12px,#1c1f33;color:#fff;--pr:8deg;--pr2:2deg}
.pair-side img,.rsi-badge{width:min(200px,40vw);aspect-ratio:1;border-radius:50%;border:var(--line);box-shadow:5px 5px 0 var(--ink)}
.rsi-badge{display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,#ff3b3b,#8a0000 60%,#200000);border-color:#000}
.rsi-badge span{font-family:var(--display);font-size:min(96px,19vw);color:#fff;-webkit-text-stroke:3px #000;text-shadow:5px 5px 0 #000}
.pair-side b{font-family:var(--display);font-weight:400;font-size:clamp(54px,6vw,84px);line-height:1;margin-top:10px;color:var(--yellow);-webkit-text-stroke:3px var(--ink);text-shadow:4px 4px 0 var(--ink)}
.pair-side.rsi b{color:#ff3b3b;-webkit-text-stroke:3px #000}
.pair-side span{font-family:var(--mono);font-weight:700;font-size:13px}
.pair-side em{font-style:normal;font-family:var(--display);font-size:20px;background:#fff;color:var(--ink);border:3px solid var(--ink);padding:0 10px;margin-top:6px}
.pair-mid .burst-y{display:grid;place-items:center;width:120px;height:120px;font-family:var(--display);font-size:64px;color:var(--red);-webkit-text-stroke:2px var(--ink)}
.pair-mid.in .burst-y{animation:spinSlow 8s linear infinite}
@keyframes spinSlow{to{transform:rotate(360deg)}}
.pair-story{max-width:980px;margin:0 auto;padding:26px;border-radius:16px;background:var(--paper);--pr:3deg}
.pair-story .lead{max-width:none;margin:14px 0 18px}
.pair-facts{display:grid;grid-template-columns:repeat(4,1fr);border:3px solid var(--ink);border-radius:10px;overflow:hidden;background:#fff}
.pair-facts div{padding:10px 14px;border-right:3px solid var(--ink)}
.pair-facts div:last-child{border-right:0}
.pair-facts dt{font-family:var(--mono);font-size:11px;font-weight:700}
.pair-facts dd{font-family:var(--display);font-size:22px;color:var(--red)}

/* how to */
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding-top:20px}
.steps li{padding:30px 22px 24px;border-radius:14px;background:#fff;overflow:visible;--pr:-6deg}
.steps li:nth-child(2){--pr:6deg;--pr2:1deg;margin-top:40px}
.steps li:nth-child(3){--pr2:-1deg}
.steps li:not(:last-child)::after{content:"➜";position:absolute;right:-38px;top:40%;font-size:34px;color:var(--red)}
.num{position:absolute;top:-26px;left:-14px;font-family:var(--display);font-size:34px;width:60px;height:60px;display:grid;place-items:center;color:#fff;background:var(--red);border:var(--line);border-radius:50%;box-shadow:3px 3px 0 var(--ink)}
.steps h3{font-family:var(--display);font-weight:400;font-size:34px;margin:8px 0 6px}
.steps p{font-weight:700;font-size:17px}
.steps a{color:var(--red)}

/* token */
.token-panel{--pr:3deg;display:grid;grid-template-columns:1fr 1.1fr;border-radius:18px;background:var(--paper)}
.tk-video{background:#061436;border-right:var(--line)}
.tk-video video{width:100%;height:100%;object-fit:cover;aspect-ratio:1}
.tk-copy{padding:34px 30px;display:flex;flex-direction:column;align-items:flex-start;gap:14px;justify-content:center}
.ticker{font-family:var(--display);font-weight:400;font-size:clamp(64px,8.6vw,136px);line-height:.85;color:var(--yellow);-webkit-text-stroke:4px var(--ink);text-shadow:6px 6px 0 var(--ink),12px 12px 0 var(--red)}

/* end */
.end{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-bottom:0}
.tbc{--pr:-10deg;--pr2:-3deg;font-family:var(--display);font-size:clamp(50px,8vw,120px);background:var(--yellow);border:var(--line);box-shadow:var(--shadow);padding:10px 30px;margin-top:auto}
.next{font-family:var(--display);font-size:clamp(24px,3vw,36px);margin:26px 0 auto;letter-spacing:.04em;color:#fff;-webkit-text-stroke:1.5px var(--ink);text-shadow:3px 3px 0 var(--ink)}
.next b{font-weight:400;color:var(--yellow)}
.foot{width:calc(100% + 2 * max(20px,calc(50vw - 620px)));margin-top:80px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;text-align:left;background:#fff;border-top:var(--line);padding:18px 20px 22px;font-family:var(--mono);font-size:11px;font-weight:700}
.foot span:last-child{max-width:720px}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
  .splash-grid,.flip-wrap,.token-panel{grid-template-columns:1fr}
  .splash-art{order:-1}
  .strip{grid-template-columns:1fr;grid-template-rows:none}
  .strip .panel{height:260px}
  .profile-card{grid-template-columns:1fr;justify-items:center;text-align:center}
  .pc-art{width:60%}
  .stats{width:100%;text-align:left}
  .cards{grid-template-columns:1fr;max-width:340px;margin:0 auto}
  .steps{grid-template-columns:1fr;gap:50px}
  .steps li:nth-child(2){margin-top:0}
  .steps li:not(:last-child)::after{content:"⬇";right:auto;left:50%;top:auto;bottom:-46px;transform:translateX(-50%)}
  .tk-video{border-right:0;border-bottom:var(--line)}
  .pair-grid{grid-template-columns:1fr;justify-items:center}
  .pair-side{width:100%;max-width:340px}
  .pair-facts{grid-template-columns:1fr 1fr}
  .pair-facts div:nth-child(2){border-right:0}
  .pair-facts div:nth-child(-n+2){border-bottom:3px solid var(--ink)}
  .flip-stage{height:auto;padding:30px 0}
  .flip-copy{text-align:center}
  .flip-copy .lead{margin:0 auto}
}
@media (max-width:560px){
  body{font-size:17px}
  .page{padding:100px 16px 70px}
  .foot{width:calc(100% + 32px)}
  #hud{top:8px;left:8px;right:8px;padding:6px 8px;gap:8px}
  .hud-brand small,.alt>span{display:none}
  #alt-num{min-width:0;font-size:10px}
  .btn{font-size:20px;padding:10px 18px}
  .stats li{grid-template-columns:96px 1fr 58px;font-size:16px;gap:8px}
  .cv-blurb{right:-8px;width:100px;padding:20px 12px}
  .ca code{font-size:11px}
  .bubble{max-width:80%}
  .splash-grid{gap:30px}
  .scroll-cue{display:none}
}
@media (max-height:720px){.cv-art{aspect-ratio:16/6}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important}
  .pop{opacity:1;transform:none}
}