:root{--b:#0052FF;--c:#22E6FF;--ink:#050B1F;--ink2:#0A1640;--w:#EAF2FF;--glow:0 0 24px rgba(34,230,255,.55),0 0 60px rgba(0,82,255,.5)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--w);font-family:Inter,system-ui,sans-serif;overflow-x:hidden}
a{color:var(--c);text-decoration:none}
.disp{font-family:"Anton","Bebas Neue",Impact,sans-serif;text-transform:uppercase;letter-spacing:.01em;line-height:.92;margin:.1em 0}
.glow{color:#F3EBDD;text-shadow:var(--glow)}.cy{color:var(--c)}.eyebrow{font:800 13px Inter;letter-spacing:.3em;text-transform:uppercase;color:var(--c)}
/* nav */
nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px 5vw;background:linear-gradient(180deg,rgba(5,11,31,.95),rgba(5,11,31,.6));backdrop-filter:blur(12px);border-bottom:1px solid rgba(34,230,255,.2)}
.brand{font:400 26px Anton,Impact;color:#F3EBDD;letter-spacing:.02em}.brand span{color:var(--c)}
.links a{color:#cfe0ff;margin:0 14px;font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.08em}.links a.on,.links a:hover{color:var(--c);text-shadow:var(--glow)}
.btn{display:inline-block;position:relative;background:var(--b);color:#F3EBDD;border:0;padding:16px 34px;font:400 22px Anton,Impact;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);box-shadow:var(--glow);transition:transform .15s,filter .15s}
.btn:hover{transform:translateY(-2px) scale(1.03);filter:brightness(1.2)}.btn.alt{background:transparent;outline:2px solid var(--c);color:var(--c)}.btn.sm{font-size:16px;padding:10px 22px}
.btn:disabled{background:#2a3558;box-shadow:none;cursor:not-allowed;transform:none}
/* speed lines bg */
.speed{position:absolute;inset:0;background:repeating-linear-gradient(100deg,transparent 0 38px,rgba(34,230,255,.07) 38px 40px,transparent 40px 90px);animation:sp 1.2s linear infinite;pointer-events:none}
@keyframes sp{to{background-position:-180px 0}}
.halftone{position:absolute;inset:0;background-image:radial-gradient(rgba(34,230,255,.25) 1px,transparent 1.5px);background-size:14px 14px;mask-image:linear-gradient(90deg,#000,transparent 60%);pointer-events:none}
/* hero */
.hero{position:relative;min-height:min(100vh,900px);padding:120px 5vw 80px;display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:2vw;background:radial-gradient(ellipse at 70% 50%,#0b3bd1 0%,#06144a 45%,var(--ink) 75%);overflow:hidden}
.hero h1{font-size:clamp(64px,10vw,150px)}.hero p.lead{font-size:20px;max-width:520px;color:#cfe0ff;line-height:1.5}
.cd{display:flex;gap:10px;margin:26px 0}.cd div{background:rgba(0,82,255,.25);border:1px solid rgba(34,230,255,.5);padding:10px 16px;text-align:center;font-size:11px;letter-spacing:.2em;text-transform:uppercase;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.cd b{display:block;font:400 42px Anton;color:#F3EBDD;text-shadow:var(--glow)}
.stage{position:relative;height:620px}.stage .panel{position:absolute;overflow:hidden;border:3px solid var(--c);box-shadow:var(--glow);background:#000}
.stage .panel img{width:100%;height:100%;object-fit:cover}
.p1{width:62%;height:78%;right:0;top:4%;clip-path:polygon(10% 0,100% 0,90% 100%,0 100%);z-index:2;animation:fl 5s ease-in-out infinite}
.p2{width:40%;height:46%;left:0;top:0;clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);animation:fl 6s ease-in-out infinite -2s}
.p3{width:44%;height:46%;left:6%;bottom:0;clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);animation:fl 7s ease-in-out infinite -4s}
@keyframes fl{50%{transform:translateY(-14px)}}
.tagname{position:absolute;z-index:3;font:400 22px Anton;background:var(--c);color:var(--ink);padding:4px 14px;transform:skewX(-12deg)}
/* marquee */
.marquee{overflow:hidden;background:var(--b);border-block:3px solid var(--c);transform:rotate(-2deg) scale(1.05);margin:-20px 0;position:relative;z-index:5;box-shadow:var(--glow)}
.track{display:flex;gap:0;width:max-content;animation:mq 40s linear infinite}.track.rev{animation-direction:reverse}
.track img{height:150px;width:150px;object-fit:cover;border-right:3px solid var(--ink)}
.track span{font:400 48px Anton;padding:0 30px;line-height:150px;color:#F3EBDD;white-space:nowrap}
@keyframes mq{to{transform:translateX(-50%)}}
/* sections */
section{position:relative;padding:130px 5vw;overflow:hidden}
.divider{height:70px;background:var(--c);clip-path:polygon(0 0,100% 40%,100% 100%,0 60%);margin:-1px 0;position:relative;z-index:4}
.divider.b{background:var(--b);clip-path:polygon(0 40%,100% 0,100% 60%,0 100%)}
.lore{background:linear-gradient(180deg,#06144a,var(--ink));display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center}
.lore h2{font-size:clamp(48px,7vw,104px)}.lore p{font-size:19px;line-height:1.7;color:#cfe0ff}
.bubble{position:relative;background:#F3EBDD;color:var(--ink);padding:18px 26px;font:400 28px Anton;display:inline-block;border-radius:20px;transform:rotate(-2deg);box-shadow:6px 6px 0 var(--b)}
.lore-art{display:grid;grid-template-columns:1fr 1fr;gap:12px;transform:skewY(-4deg)}.lore-art div{overflow:hidden;border:2px solid var(--c);aspect-ratio:1}.lore-art div:first-child{grid-column:span 2;aspect-ratio:16/9}
.lore-art img{width:100%;height:100%;object-fit:cover;transform:skewY(4deg) scale(1.1)}
.crew{background:var(--ink2)}.crew h2,.tok h2,.road h2{font-size:clamp(48px,7vw,104px);text-align:center}
.gallery{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:50px}
.gallery figure{margin:0;position:relative;aspect-ratio:1;overflow:hidden;border:2px solid rgba(34,230,255,.4);clip-path:polygon(8% 0,100% 0,92% 100%,0 100%);transition:transform .25s,box-shadow .25s}
.gallery figure:hover{transform:scale(1.07) rotate(-1deg);border-color:var(--c);box-shadow:var(--glow);z-index:2}
.gallery img{width:100%;height:100%;object-fit:cover}.gallery figcaption{position:absolute;left:12%;bottom:6px;font:400 18px Anton;color:#F3EBDD;text-shadow:0 0 8px #000}
.tok{background:radial-gradient(ellipse at center,#0a2a9e,var(--ink) 70%)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1000px;margin:40px auto}.stats div{background:rgba(0,82,255,.18);border:1px solid rgba(34,230,255,.4);padding:24px;text-align:center;clip-path:polygon(6% 0,100% 0,94% 100%,0 100%)}
.stats b{display:block;font:400 34px Anton;color:#F3EBDD;text-shadow:var(--glow)}.stats span{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#9fb8ff}
.tkn{display:flex;gap:60px;justify-content:center;align-items:center;flex-wrap:wrap}.donut{width:280px;height:280px;border-radius:50%;position:relative;box-shadow:var(--glow)}
.donut:after{content:"";position:absolute;inset:60px;background:var(--ink);border-radius:50%}
#alloc{list-style:none;padding:0}#alloc li{margin:12px 0;font-size:18px;font-weight:700}#alloc i{display:inline-block;width:14px;height:14px;margin-right:10px;transform:skewX(-12deg)}#alloc .amt{color:#9fb8ff;font-size:13px;font-weight:500;margin-left:6px}
.note{text-align:center;color:#9fb8ff;font-size:13px}
.road{background:var(--ink2)}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:50px}
.steps div{background:linear-gradient(160deg,rgba(0,82,255,.35),rgba(5,11,31,.6));border-top:4px solid var(--c);padding:28px;clip-path:polygon(0 0,100% 0,100% 88%,88% 100%,0 100%)}
.steps b{font:400 52px Anton;color:var(--c);text-shadow:var(--glow)}.steps h3{font:400 26px Anton;text-transform:uppercase;margin:6px 0}.steps p{color:#cfe0ff;line-height:1.5}
.cta{text-align:center;background:var(--b)}.cta h2{font-size:clamp(56px,9vw,140px)}
footer{text-align:center;padding:40px;color:#9fb8ff;font-size:13px;border-top:1px solid rgba(34,230,255,.2)}
/* mine page */
.mine-hero{min-height:min(100vh,900px);padding:120px 5vw 60px;background:radial-gradient(ellipse at 50% 30%,#0b3bd1,#06144a 45%,var(--ink) 75%);display:grid;grid-template-columns:1.1fr 1fr;gap:4vw;align-items:start;position:relative;overflow:hidden}
.mine-hero h1{font-size:clamp(56px,8vw,120px)}
.rig{position:relative;height:300px;margin:30px 0;border:2px solid var(--c);background:rgba(0,10,40,.7);box-shadow:var(--glow);overflow:hidden;clip-path:polygon(3% 0,100% 0,97% 100%,0 100%)}
.rig canvas{width:100%;height:100%;display:block}.rig .hud{position:absolute;left:5%;top:14px;font:12px ui-monospace,monospace;color:var(--c);letter-spacing:.1em}
.panelbox{background:rgba(5,11,31,.75);border:1px solid rgba(34,230,255,.4);padding:30px;clip-path:polygon(0 0,100% 0,100% 94%,94% 100%,0 100%)}
.row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(34,230,255,.15);font-size:14px}.row span{color:#9fb8ff;text-transform:uppercase;letter-spacing:.12em;font-size:12px}
.row code{font:12px ui-monospace,monospace;color:#F3EBDD;word-break:break-all;text-align:right;max-width:72%}
.meter{position:relative;height:16px;background:#0b1a4d;margin:24px 0 8px;border:1px solid rgba(34,230,255,.4)}#mBar{height:100%;width:0;background:linear-gradient(90deg,var(--b),var(--c));box-shadow:var(--glow);transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
#mTick{position:absolute;top:-8px;width:3px;height:30px;background:#F3EBDD;box-shadow:0 0 10px #F3EBDD;left:0}.legend{display:flex;justify-content:space-between;font-size:11px;color:#9fb8ff;letter-spacing:.1em}
.verdict{font:400 64px Anton;text-transform:uppercase;margin:20px 0 10px;text-shadow:var(--glow)}.verdict.hit{color:var(--c);animation:pulse 1s infinite}.verdict.miss{color:#FF4D7D;text-shadow:0 0 20px rgba(255,77,125,.6)}
@keyframes pulse{50%{transform:scale(1.04)}}.small{color:#9fb8ff;font-size:13px}
.alloc{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.alloc div{background:rgba(0,82,255,.2);border:1px solid rgba(34,230,255,.35);padding:16px;text-align:center}.alloc b{display:block;font:400 32px Anton;color:#F3EBDD}.alloc span{font-size:11px;color:#9fb8ff;letter-spacing:.15em;text-transform:uppercase}
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.how div{border-left:3px solid var(--c);padding:6px 16px;color:#cfe0ff}.how b{display:block;font:400 22px Anton;color:#F3EBDD;text-transform:uppercase}
.reveal{opacity:0;transform:translateY(40px) skewY(2deg);transition:all .9s cubic-bezier(.2,.8,.2,1)}.reveal.in{opacity:1;transform:none}
@media(max-width:900px){.hero,.lore,.mine-hero{grid-template-columns:1fr}.stage{height:420px}.gallery{grid-template-columns:repeat(3,1fr)}.stats,.steps,.how,.alloc{grid-template-columns:1fr 1fr}.links{display:none}}

.scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:50px}
.scene{margin:0;position:relative;aspect-ratio:16/9;overflow:hidden;border:2px solid rgba(34,230,255,.5);clip-path:polygon(4% 0,100% 0,96% 100%,0 100%);transition:transform .3s,box-shadow .3s}
.scene.big{grid-column:span 4;aspect-ratio:21/8}.scene:hover{transform:scale(1.03);box-shadow:var(--glow);z-index:2}
.scene img{width:100%;height:100%;object-fit:cover}.scene figcaption{position:absolute;left:6%;bottom:12px;color:#cfe0ff;font-size:14px;text-shadow:0 0 8px #000}
.scene figcaption b{display:block;font:400 30px Anton;color:#F3EBDD;text-transform:uppercase;text-shadow:var(--glow)}
.pfps{display:flex;gap:8px;overflow-x:auto;padding:16px 0;justify-content:center;flex-wrap:wrap}.pfps img{width:64px;height:64px;object-fit:cover;border:2px solid rgba(34,230,255,.4);border-radius:6px}
.track img.wide{width:267px;object-fit:cover}
@media(max-width:900px){.scenes{grid-template-columns:1fr 1fr}.scene.big{grid-column:span 2}}

/* ===== MATTE THEME (palette sampled from art_anime/nft backgrounds) ===== */
:root{--b:#0052FF;--c:#0052FF;--ink:#FCF0E0;--ink2:#F6E9D6;--w:#132237;--navy:#132237;--pink:#FD93A9;--muted:#456EA6;--lav:#A481BB;--sky:#74CAFB;--orange:#FD9035;--mint:#A1CBB3;--cream:#FCF0E0;--glow:none;--shadow:0 8px 24px rgba(19,34,55,.08)}
body{background:var(--cream);color:var(--navy)}
.glow{color:var(--navy);text-shadow:none}.cy{color:var(--b)}.eyebrow{color:var(--muted)}
.speed,.halftone{display:none}
nav{background:rgba(252,240,224,.92);border-bottom:1px solid rgba(19,34,55,.08)}.brand{color:var(--navy)}.brand span{color:var(--b)}
.links a{color:var(--navy);opacity:.75}.links a.on,.links a:hover{color:var(--b);text-shadow:none;opacity:1}
.btn{box-shadow:var(--shadow)}.btn:hover{filter:none;box-shadow:0 10px 26px rgba(0,82,255,.18)}.btn.alt{outline:2px solid var(--navy);color:var(--navy);background:transparent}
.btn:disabled{background:#C9C2B6}
.hero,.mine-hero{background:var(--cream)}.hero p.lead{color:#3a4a63}
.stage .panel{border:0;box-shadow:var(--shadow);background:var(--sky)}
.tagname{background:var(--navy);color:var(--cream)}
.how div{border-left:3px solid var(--b);color:#3a4a63}.how b{color:var(--navy)}
.marquee{background:var(--sky);border-block:0;box-shadow:none}.track span{color:var(--navy)}.track img{border-right:3px solid var(--cream)}
.divider{background:var(--pink)}.divider.b{background:var(--lav)}
.lore{background:var(--pink)}.lore p{color:var(--navy)}.lore .eyebrow{color:var(--navy);opacity:.7}
.bubble{box-shadow:6px 6px 0 var(--navy);background:var(--cream)}.lore-art div{border:0;box-shadow:var(--shadow)}
.crew{background:var(--cream)}.note{color:#5a6880}
.scene{border:0;box-shadow:var(--shadow)}.scene:hover{box-shadow:0 14px 30px rgba(19,34,55,.15)}.scene figcaption{color:#F3EBDD;text-shadow:0 1px 6px rgba(0,0,0,.4)}.scene figcaption b{color:#F3EBDD;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.pfps img{width:72px;height:72px;border:0;border-radius:12px;box-shadow:var(--shadow);aspect-ratio:1;object-fit:cover}
.tok{background:var(--mint)}
.stats div{background:var(--cream);border:0;box-shadow:var(--shadow)}.stats b{color:var(--navy);text-shadow:none}.stats span{color:#5a6880}
.donut{box-shadow:var(--shadow)}.donut:after{background:var(--mint)}#alloc .amt{color:#5a6880}
.road{background:var(--lav)}.road .eyebrow,.road .note{color:var(--navy)}
.steps div{background:var(--cream);border-top:4px solid var(--b);box-shadow:var(--shadow)}.steps b{color:var(--b);text-shadow:none}.steps p{color:#3a4a63}
.cta{background:var(--b)}.cta h2.glow{color:var(--cream)}.cta .btn{background:var(--navy)!important}
footer{color:#5a6880;border-top:1px solid rgba(19,34,55,.08)}
.cd div{background:var(--cream);border:0;box-shadow:var(--shadow);color:#5a6880}.cd b{color:var(--navy);text-shadow:none}
.rig{border:0;background:#F3EBDD;box-shadow:var(--shadow)}.rig .hud{color:var(--muted)}
.panelbox{background:#F3EBDD;border:0;box-shadow:var(--shadow)}.row{border-bottom:1px solid rgba(19,34,55,.08)}.row span{color:#5a6880}.row code{color:var(--navy)}
.meter{background:#EDE3D3;border:0;border-radius:8px}#mBar{background:var(--b);box-shadow:none;border-radius:8px}#mTick{background:var(--navy);box-shadow:none}.legend{color:#5a6880}
.verdict{text-shadow:none;color:var(--navy)}.verdict.hit{color:#2E8B57}.verdict.miss{color:#D9536F;text-shadow:none}.small{color:#5a6880}
.alloc div{background:var(--cream);border:0;box-shadow:var(--shadow)}.alloc b{color:var(--navy)}.alloc span{color:#5a6880}
.mine-hero .panelbox img{border:0!important;box-shadow:var(--shadow)!important}
.bubble{color:var(--navy)!important}

/* ===== CALM STRAIGHT LAYOUT (overrides) ===== */
*{clip-path:none!important}
:root{--r:20px}
.disp{font-family:Inter,system-ui,sans-serif;font-weight:800;text-transform:none;letter-spacing:-.03em;line-height:1.05}
.btn{border-radius:999px;font:700 16px Inter;text-transform:none;letter-spacing:0;padding:14px 28px}.btn.sm{font-size:14px;padding:9px 18px}
.brand{font:800 20px Inter}
section{padding:110px 6vw;text-align:center}section h2.disp{font-size:clamp(36px,5vw,56px)}
.note{font-size:17px;margin:8px 0 0}
.hero{min-height:auto;padding:150px 6vw 100px;grid-template-columns:1fr 1.1fr;gap:5vw}.hero h1{font-size:clamp(44px,6vw,80px)}
.hero-img img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r);box-shadow:var(--shadow)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1000px;margin:40px auto 0}.steps.four{grid-template-columns:repeat(4,1fr);max-width:1100px}
.steps div{background:#F3EBDD;border:0;border-radius:var(--r);padding:28px;text-align:left;box-shadow:var(--shadow)}
.steps b{font:800 28px Inter;color:var(--b)}.steps h3{font:700 20px Inter;text-transform:none;margin:8px 0 4px;color:var(--navy)}.steps p{margin:0;color:#5a6880}
.how-sec{background:var(--sky)}.scenes-sec{background:var(--cream)}.crew{background:var(--pink)}.tok{background:var(--mint)}.road{background:var(--lav)}
.scenes{grid-template-columns:repeat(3,1fr);gap:20px;max-width:1200px;margin:40px auto 0}.scene,.scene.big{grid-column:auto;aspect-ratio:16/9;border-radius:var(--r);transform:none!important}
.scene:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.scene figcaption{left:16px;bottom:12px;font:700 16px Inter;color:#F3EBDD;background:rgba(19,34,55,.55);padding:4px 12px;border-radius:999px;text-shadow:none}
.pfps{max-width:900px;margin:30px auto 0;gap:12px}.pfps img{width:84px;height:84px;border-radius:16px}
.stats{grid-template-columns:repeat(3,1fr);max-width:900px}.stats div{border-radius:var(--r)}.stats b{font:800 26px Inter}
.cta{background:var(--b)}.cta h2.disp{color:var(--cream)}.cta .btn{background:var(--cream)!important;color:var(--navy)}
.cd div,.alloc div,.panelbox,.rig,.stats div,.meter{border-radius:var(--r)}
.rig,.marquee,.lore-art,.tagname,.stage{transform:none!important}
.verdict{font:800 48px Inter;text-transform:none}.mine-hero h1{font-size:clamp(44px,6vw,80px)}
.cd b{font:800 34px Inter}.alloc b{font:800 26px Inter}.how b{font:700 17px Inter;text-transform:none}
.mine-hero .panelbox img{border-radius:16px}
@media(max-width:900px){.steps,.steps.four,.scenes,.stats{grid-template-columns:1fr 1fr}.scene:first-child{grid-column:span 2}}

/* ===== VARIED LAYOUTS v3 (palette: cream, navy, Base blue, muted blue, sky, pink, peach) ===== */
:root{--peach:#FDB58A;--lav:#74CAFB;--mint:#FDB58A}
body{font-family:Inter,system-ui,sans-serif}
h1,h2,h3{font-family:Inter,system-ui,sans-serif;font-weight:800;letter-spacing:-.03em;color:var(--navy);margin:0}
section h2{font-size:clamp(34px,4.5vw,54px);margin-bottom:40px}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}.reveal.in{opacity:1;transform:none}
/* hero */
.hx{position:relative;height:min(92vh,820px);margin:72px 3vw 0;border-radius:28px;overflow:hidden}
.hx-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hx-card{position:absolute;left:4vw;bottom:5vw;max-width:520px;background:rgba(252,240,224,.94);border-radius:24px;padding:40px;box-shadow:0 20px 50px rgba(19,34,55,.15);text-align:left}
.hx-card h1{font-size:clamp(38px,4.6vw,64px);line-height:1.05;margin:10px 0 16px}.hx-card p{color:#3a4a63;font-size:18px;line-height:1.5;margin:0 0 24px}
/* split */
.split-sec{background:var(--cream)}.split{display:grid;grid-template-columns:1.2fr 1fr;gap:5vw;align-items:center;max-width:1150px;margin:0 auto 60px;text-align:left}
.split.rev{grid-template-columns:1fr 1.2fr}.split.rev img{order:2}
.split img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:24px;box-shadow:var(--shadow);transition:transform .35s}.split img:hover{transform:translateY(-6px)}
.split b{font:800 56px Inter;color:var(--pink)}.split h3{font-size:34px;margin:6px 0 10px}.split p{font-size:19px;color:#3a4a63;line-height:1.5;margin:0}
/* bento */
.bento-sec{background:var(--sky)}.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:18px;max-width:1200px;margin:auto}
.bento figure{margin:0;position:relative;border-radius:22px;overflow:hidden;box-shadow:var(--shadow);transition:transform .35s,box-shadow .35s}
.bento figure:hover,.hscroll figure:hover,.nums div:hover,.timeline div:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(19,34,55,.16)}
.bento img{width:100%;height:100%;object-fit:cover}.bento figcaption{position:absolute;left:14px;bottom:12px;background:rgba(252,240,224,.92);color:var(--navy);font:700 14px Inter;padding:5px 12px;border-radius:999px}
.b1{grid-column:span 2;grid-row:span 2}.b2{grid-column:span 2}.b3{grid-row:span 1}.b4{grid-row:span 1}
.b5{grid-column:span 4;background:var(--navy);color:var(--cream);border-radius:22px;display:flex;align-items:center;justify-content:center;font:800 clamp(26px,3vw,40px) Inter;letter-spacing:-.02em;text-align:center}
/* band */
.band{position:relative;height:440px;overflow:hidden}.band img{width:100%;height:100%;object-fit:cover}
.band p{position:absolute;inset:auto 0 40px;text-align:center;font:800 clamp(30px,4vw,52px) Inter;color:#F3EBDD;text-shadow:0 2px 20px rgba(19,34,55,.45);margin:0}
/* collection */
.crew-sec{background:var(--pink);text-align:left}.row-head{display:flex;justify-content:space-between;align-items:end;max-width:1200px;margin:0 auto 30px}.row-head h2{margin:0}.row-head p{color:var(--navy);font-size:17px;margin:0}
.hscroll{display:flex;gap:18px;overflow-x:auto;padding:10px 6vw 30px;margin:0 -6vw;scroll-snap-type:x mandatory}
.hscroll figure{flex:0 0 220px;margin:0;background:var(--cream);border-radius:22px;padding:10px;box-shadow:var(--shadow);scroll-snap-align:start;transition:transform .3s,box-shadow .3s}
.hscroll img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:16px;display:block}.hscroll figcaption{font:700 14px Inter;color:var(--navy);padding:10px 6px 4px}
/* coin */
.coin-sec{background:var(--cream)}.bignum b{display:block;font:800 clamp(56px,10vw,140px) Inter;letter-spacing:-.05em;color:var(--b);line-height:1}
.bignum span{font-size:18px;color:#5a6880}.nums{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1000px;margin:50px auto 30px}
.nums div{background:#F3EBDD;border-radius:22px;padding:30px 20px;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s}.nums div:nth-child(odd){background:var(--peach)}
.nums b{display:block;font:800 40px Inter;color:var(--navy)}.nums span{color:#3a4a63}
/* timeline */
.road-sec{background:var(--muted)}.road-sec h2{color:var(--cream)}
.timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1100px;margin:auto}
.timeline:before{content:"";position:absolute;left:12%;right:12%;top:13px;height:4px;background:rgba(252,240,224,.5);border-radius:4px}
.timeline div{position:relative;padding-top:44px;transition:transform .3s}.timeline i{position:absolute;top:0;left:50%;transform:translateX(-50%);width:30px;height:30px;border-radius:50%;background:var(--cream);border:6px solid var(--b)}
.timeline div:nth-child(2) i{border-color:var(--peach)}.timeline b{display:block;font:800 24px Inter;color:#F3EBDD}.timeline span{color:#dfe8f5}
/* cta */
.cta-sec{background:var(--cream)}.cta-card{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;max-width:1150px;margin:auto;background:var(--b);border-radius:28px;overflow:hidden;box-shadow:var(--shadow)}
.cta-card img{width:100%;height:100%;aspect-ratio:16/9;object-fit:cover}.cta-card h2{color:var(--cream);margin-bottom:24px}.cta-card .btn{background:var(--cream)!important;color:var(--navy)}
/* mine page palette */
.verdict.hit{color:var(--b)}.verdict.miss{color:#E0607E}
.alloc div:nth-child(5){background:var(--peach)}.cd div:first-child{background:var(--sky)}
@media(max-width:900px){.split,.split.rev,.cta-card{grid-template-columns:1fr}.split.rev img{order:0}.bento{grid-template-columns:1fr 1fr}.b1,.b2,.b5{grid-column:span 2}.nums,.timeline{grid-template-columns:1fr 1fr}.timeline:before{display:none}.hx-card{left:4vw;right:4vw}}
.band img{object-position:center 35%}

/* ===== 2-COLOR UI: cream + Base blue (navy/white for contrast) ===== */
:root{--pink:#0052FF;--peach:#F3EBDD;--sky:#F3EBDD;--lav:#F3EBDD;--mint:#F3EBDD;--muted:#0052FF}
.split b{color:var(--b)}
.bento-sec{background:#F3EBDD}.b5{background:var(--b);color:#F3EBDD}
.crew-sec{background:var(--b)}.crew-sec h2,.crew-sec .row-head p{color:#F3EBDD}
.nums div,.nums div:nth-child(odd){background:#F3EBDD}.nums div:nth-child(odd) b{color:var(--b)}
.road-sec{background:var(--b)}.timeline div:nth-child(2) i{border-color:var(--navy)}
.cd div:first-child,.alloc div:nth-child(5){background:var(--cream)}
.verdict.hit{color:var(--b)}.verdict.miss{color:#6B7280}
.marquee,.how-sec,.tok,.road,.crew,.lore,.divider{background:var(--cream)}
.hx-btns{display:flex;gap:10px;flex-wrap:wrap}.hx-btns .btn{padding:12px 20px;font-size:15px}
.btn.alt{background:transparent!important;outline:0;border:2px solid var(--b);color:var(--b);box-shadow:none}.btn.alt:hover{background:rgba(0,82,255,.06)!important}
/* text on Base blue = cream */
.b5,.crew-sec h2,.crew-sec .row-head p,.road-sec h2,.timeline b,.btn{color:#FCF0E0}.btn.alt{color:var(--b)}.timeline span{color:#E9E1D3}
.cta-card .btn{color:var(--navy)}

/* ===== MOTION v2 ===== */
.reveal{opacity:0;transform:translate3d(0,32px,0);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}
.stagger>*{opacity:0;transform:translate3d(0,24px,0);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--i,0)*90ms)}
.stagger.in>*{opacity:1;transform:none}
.zoom{overflow:hidden}.zoom img{transform:scale(1.12);transition:transform 1.6s cubic-bezier(.16,1,.3,1)}.zoom.in img{transform:scale(1)}
.px img{will-change:transform}
.timeline.seq>div{opacity:0;transform:translate3d(0,20px,0);transition:opacity .7s ease,transform .7s ease;transition-delay:calc(var(--i,0)*220ms)}
.timeline.seq.in>div{opacity:1;transform:none}
.timeline.seq:before{transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.16,1,.3,1)}.timeline.seq.in:before{transform:scaleX(1)}
.hscroll.drift{scroll-behavior:auto}
@media (prefers-reduced-motion: reduce){.reveal,.stagger>*,.timeline.seq>div,.zoom img{opacity:1!important;transform:none!important;transition:none!important}.timeline.seq:before{transform:none!important}}

.hitcard{position:relative;display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center;background:#F3EBDD;border:2px solid var(--b);border-radius:20px;padding:16px;margin-bottom:18px;overflow:hidden;text-align:left}
.hitcard[hidden]{display:none}.hitcard img{width:150px;height:150px;object-fit:cover;border-radius:14px}
.hitcard h2{font:800 22px Inter;color:var(--b);margin:4px 0 6px;letter-spacing:-.02em}.hitcard p{margin:0 0 12px;color:#3a4a63;font-size:14px;line-height:1.5}.hitcard .eyebrow{font-size:11px;margin:0}
.hitcard .btn{padding:10px 20px;font-size:14px}.hitcard canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hitcard.pop{animation:pop .6s cubic-bezier(.34,1.56,.64,1)}@keyframes pop{0%{opacity:0;transform:scale(.92) translateY(10px)}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){.hitcard.pop{animation:none}}
@media(max-width:520px){.hitcard{grid-template-columns:1fr}.hitcard img{width:100%;height:auto;aspect-ratio:16/9}}

/* collection marquee */
.cmarq{position:relative;overflow:hidden;margin:0 -6vw;padding:10px 0 30px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ctrack{display:flex;width:max-content;animation:cmq 50s linear infinite;will-change:transform}
.cmarq:hover .ctrack{animation-play-state:paused}
.cset{display:flex;gap:18px;padding-right:18px}
.cset figure{flex:0 0 200px;margin:0;background:#F3EBDD;border-radius:22px;padding:10px;box-shadow:var(--shadow);transition:transform .3s}
.cset figure:hover{transform:translateY(-6px)}
.cset img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:16px;display:block}.cset figcaption{font:700 14px Inter;color:var(--navy);padding:10px 6px 4px}
@keyframes cmq{to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion: reduce){.ctrack{animation:none}.cmarq{overflow-x:auto;-webkit-mask-image:none;mask-image:none}.cset[aria-hidden]{display:none}}
.nums{grid-template-columns:repeat(3,1fr);max-width:820px}
html{scroll-behavior:smooth}section[id],header[id]{scroll-margin-top:84px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
.addr-pill{background:#F3EBDD;color:var(--navy);font:700 13px ui-monospace,Menlo,monospace;padding:8px 14px;border-radius:999px;box-shadow:var(--shadow)}.addr-pill[hidden]{display:none}
.rig{background:#EFE5D3;height:320px}.rig .hud{background:rgba(252,240,224,.9);padding:4px 10px;border-radius:999px;color:var(--navy);top:12px;left:12px;font-weight:700}
@media(max-width:600px){.rig{height:240px}}
.row-head{justify-content:flex-start}
.os-link{display:inline-block;margin-top:14px;font-size:14px;font-weight:600;color:var(--b);opacity:.85;text-decoration:none;border-bottom:1px solid rgba(0,82,255,.3)}.os-link:hover{opacity:1;border-color:var(--b)}footer a{color:var(--b);text-decoration:none}
.nav-wallet{display:flex;align-items:center}.nav-wallet [hidden]{display:none!important}
.wpill{position:relative}.wp-btn{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--navy);cursor:pointer;background:#F3EBDD;color:var(--navy)}
.wp-btn:hover{border-color:#0052FF}.wp-dot{width:8px;height:8px;border-radius:50%;background:#0052FF;display:inline-block}
.wpill.wrong .wp-dot{background:var(--navy);opacity:.35}.wpill.wrong .wp-btn{border-style:dashed}
.wp-menu{position:absolute;right:0;top:calc(100% + 8px);background:#F3EBDD;border:1.5px solid var(--navy);border-radius:14px;padding:6px;min-width:160px;box-shadow:var(--shadow);z-index:50;display:flex;flex-direction:column}
.wp-menu[hidden]{display:none}.wp-menu button{background:none;border:0;text-align:left;padding:9px 12px;border-radius:9px;font:600 14px Inter;color:var(--navy);cursor:pointer}.wp-menu button:hover{background:#0052FF;color:#F3EBDD}.wp-menu button[hidden]{display:none}
#checkBtn[hidden],#walletBtn[hidden]{display:none}

[hidden]{display:none!important}