@font-face{font-family:Chakra;src:url(/fonts/ChakraPetch-Bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Geist;src:url(/fonts/Geist.woff2) format('woff2');font-weight:100 900;font-display:swap}
:root{--b:#CCFF00;--bt:#4A6600;--ink:#111;--lb:#F4FFCC;--sh:4px 4px 0 var(--ink)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:16px/1.55 Geist,system-ui,sans-serif;color:var(--ink);background:#fff;overflow-x:hidden}
h1,h2,h3{font-family:Chakra,Geist,sans-serif;line-height:1.05;margin:0}
a{color:inherit}img{max-width:100%;display:block}
.w{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}.w.narrow{max-width:820px}
.b{display:inline-flex;align-items:center;gap:8px;font:700 17px Chakra,sans-serif;text-decoration:none;padding:13px 24px;border:2px solid var(--ink);border-radius:12px;background:#fff;color:var(--ink);box-shadow:var(--sh);transition:transform .15s,box-shadow .15s}
.b:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}.b:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.b.blue{background:var(--b);color:#111}.b.sm{padding:8px 16px;font-size:15px}
.b.ghost{background:transparent;color:#111;border-color:#111;box-shadow:4px 4px 0 #111}
/* header */
.hn{position:sticky;top:0;z-index:50;background:#fff;border-bottom:2px solid var(--ink)}
.hbar{display:flex;align-items:center;gap:24px;height:64px}
.hb{display:flex;align-items:center;gap:10px;font:700 22px Chakra,sans-serif;text-decoration:none}
.hn nav{display:flex;gap:22px;margin-left:auto;font-weight:600;font-size:15px}.hn nav a{text-decoration:none}.hn nav a:hover{color:var(--bt)}
/* hero */
.hero{position:relative;height:max(640px,min(56.25vw,calc(100vh - 64px)));overflow:hidden;background:#fff;border-bottom:2px solid var(--ink)}
.hbg,.hcat,.fall{position:absolute}
.hero{--sw:max(100vw,calc(max(640px,min(56.25vw,100vh - 64px)) * 1.7778))}
.hbg{left:50%;bottom:0;width:var(--sw);aspect-ratio:16/9;transform:translateX(-50%);background:url(/assets/brand/hero_bg.webp?v=202610302210) center/100% 100% no-repeat}
.hcat{left:calc(50% - var(--sw)/2 + var(--sw)*.094);bottom:calc(var(--sw)*.5625*.205);width:calc(var(--sw)*.234);height:auto;transform-origin:50% 100%}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(-1deg)}}
.hcopy{position:relative;z-index:3;padding-top:clamp(40px,8vh,96px);text-align:center}
.hcopy h1{font-size:clamp(56px,9vw,148px);letter-spacing:-.02em;color:var(--ink);text-shadow:5px 5px 0 var(--b)}
.hcopy .lead{font:700 clamp(20px,2.2vw,30px) Chakra,sans-serif;margin:14px 0 4px}
.hcopy p{margin:0 auto;max-width:560px;font-size:18px}
.cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:22px}
.ca{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:8px 14px;border:2px dashed var(--ink);border-radius:10px;background:#fff;font-weight:600;font-size:14px}
.ca code{font-size:13px;word-break:break-all}.caCopy{font:700 13px Chakra;border:2px solid var(--ink);border-radius:8px;background:var(--b);color:#111;padding:3px 10px;cursor:pointer}
.fall{inset:0;z-index:1;pointer-events:none}
.coin{display:block;width:44px;height:44px;border-radius:50%;background:var(--b) url(/assets/brand/logo_256.png?v=202610302210) center/70% no-repeat;border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
.coin.sm{width:38px;height:38px;margin-bottom:12px}
.fall i{position:absolute;top:-80px;animation:drop linear infinite}
.c1{left:56%;animation-duration:9s!important}.c2{left:74%;animation-duration:12s!important;animation-delay:-4s!important}.c3{left:88%;animation-duration:10s!important;animation-delay:-7s!important;transform:scale(.7)}.c4{left:40%;animation-duration:14s!important;animation-delay:-10s!important}
.frat{width:72px;height:78px;background:url(/assets/rat.webp?v=202610302210) 0 0/576px 468px;filter:drop-shadow(2px 2px 0 rgba(0,0,0,.15))}
.r1{left:66%;animation-duration:11s!important;animation-delay:-2s!important}.r2{left:94%;animation-duration:13s!important;animation-delay:-8s!important;background-image:url(/assets/rat_golden.webp?v=202610302210)!important}
@keyframes drop{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(calc(100vh + 200px)) rotate(300deg)}}
/* marquee */
.mq{background:var(--b);color:#111;border-bottom:2px solid var(--ink);overflow:hidden;white-space:nowrap;font:700 26px Chakra,sans-serif;padding:14px 0}
.mqt{display:inline-flex;animation:mq 30s linear infinite}.mqt span{padding-right:0}
@keyframes mq{to{transform:translateX(-50%)}}
/* sections: full bleed ink backgrounds */
.sec{position:relative;padding:96px 0;border-bottom:2px solid var(--ink);background-color:#fff;background-size:cover;background-position:center}
.sec>.w{position:relative;z-index:1}
.sec::before{content:"";position:absolute;inset:0;background:inherit;background-image:var(--art);background-size:cover;background-position:center;opacity:var(--op,.28);pointer-events:none}
.ink-roofs{--art:url(/assets/brand/bg_roofs.webp?v=202610302210)}.ink-alley{--art:url(/assets/brand/bg_alley.webp?v=202610302210)}
.lblue{background-color:var(--lb)}.lblue::before{mix-blend-mode:multiply;opacity:.35}
.blue{background-color:var(--b);color:#111}.blue::before{opacity:.55}
.ink-alley-b{--art:url(/assets/brand/bg_alley_blue.webp?v=202610302210)}.ink-roofs-b{--art:url(/assets/brand/bg_roofs_blue.webp?v=202610302210)}.ink-clouds-b{--art:url(/assets/brand/bg_clouds_blue.webp?v=202610302210)}
.hd{text-align:center;margin-bottom:44px}.hd h2{font-size:clamp(38px,5vw,64px)}.hd p{margin:10px auto 0;max-width:560px;font-size:18px}
.txt h2{font-size:clamp(38px,5vw,64px)}.txt p{font-size:18px;margin:14px 0 24px}
.g2,.g3,.g4,.g7{display:grid;gap:22px}.g2{grid-template-columns:1fr 1fr;gap:16px}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g7{grid-template-columns:repeat(7,1fr);gap:14px}
.card{background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:16px;padding:24px;box-shadow:var(--sh);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-6px);box-shadow:4px 12px 0 var(--ink)}
.card h3{font-size:22px;margin-bottom:8px}.card p{margin:0;font-size:15px}
.st b{display:block;font:700 56px Chakra;color:var(--bt);line-height:1}.st span{font-weight:600}
.split{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center}
.tv{position:relative;transform:rotate(-3deg);background:var(--b);border:3px solid var(--ink);border-radius:28px;padding:18px;box-shadow:10px 10px 0 var(--ink);margin-top:30px}
.tvin{border:3px solid var(--ink);border-radius:16px;overflow:hidden;background:#000}.tvin img{width:100%}
.ant{position:absolute;top:-40px;width:4px;height:56px;background:var(--ink);border-radius:2px}.a1{left:40%;transform:rotate(-28deg)}.a2{left:56%;transform:rotate(28deg)}
.ant::after{content:"";position:absolute;top:-8px;left:-5px;width:14px;height:14px;border-radius:50%;background:var(--ink)}
.spr{margin:0 auto 14px;background-image:var(--img);background-repeat:no-repeat}
.rs{width:144px;height:156px;background-size:1152px 936px;animation:rx .8s steps(8) infinite}
@keyframes rx{to{background-position-x:-1152px}}
.sewer{filter:sepia(.5) hue-rotate(50deg) saturate(1.3) brightness(.62)}
.rat{text-align:center}.card em,.cat em{display:inline-block;font:700 14px Chakra;font-style:normal;background:var(--b);color:#111;border:2px solid var(--ink);border-radius:8px;padding:2px 10px;margin-bottom:10px}
.cat{text-align:center;padding:16px 10px}.cat h3{font-size:16px;margin-bottom:8px}
.cs{width:120px;height:120px;background-size:480px 480px;animation:cx .4s steps(4) infinite,cy 1.6s steps(4) infinite}
@keyframes cx{to{background-position-x:-480px}}@keyframes cy{to{background-position-y:-480px}}
.note{text-align:center;margin-top:26px;font-weight:600}
.lv{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.lv li{background:#fff;border:2px solid var(--ink);border-radius:14px;padding:16px;box-shadow:var(--sh);font:700 18px Chakra;display:flex;flex-direction:column;gap:6px;transition:transform .2s,box-shadow .2s}
.lv li:hover{transform:translateY(-6px);box-shadow:4px 12px 0 var(--ink)}
.lv b{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--b);color:#111;border:2px solid var(--ink)}
.lv em{font-style:normal;font:600 14px Geist;color:#555}.lv em::after{content:" XP"}
.map{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.map .z{background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:14px;padding:28px 16px;text-align:center;font:700 19px Chakra;box-shadow:var(--sh);transition:transform .2s}.map .z:hover{transform:translateY(-6px)}
.alley{grid-column:1/-1;border:2px dashed #111;border-radius:14px;padding:14px;text-align:center;font:700 18px Chakra;letter-spacing:.2em;text-transform:uppercase}
.steps .n{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--b);color:#111;font:700 24px Chakra;border:2px solid var(--ink);margin-bottom:14px}
.buy svg{width:64px;height:64px;fill:none;stroke:var(--ink);stroke-width:3;stroke-linejoin:round;stroke-linecap:round;margin-bottom:12px;background:var(--lb);border-radius:14px;padding:6px}
.buy .b{margin-top:16px}
.tk{grid-template-columns:1.1fr 1fr}.tk .hd{text-align:left;margin-bottom:24px}.tk .hd p{margin-left:0}
.box{background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:14px;padding:16px 18px;box-shadow:var(--sh)}.box span{display:block;font-size:13px;font-weight:600;color:#555}.box b{font:700 24px Chakra}
.box .ca{margin:0;padding:0;border:0;font:600 15px Geist;display:block}
.badge{position:relative;width:min(420px,100%);aspect-ratio:1;margin:0 auto}
.badge img{position:absolute;inset:18%;width:64%;height:64%;border-radius:50%;border:4px solid var(--ink);background:#fff;box-shadow:8px 8px 0 var(--ink)}
.ring{position:absolute;inset:0;border-radius:50%;background:#fff;border:4px solid var(--ink);animation:spin 24s linear infinite}
.ring text{font:700 30px Chakra;letter-spacing:4px;fill:var(--ink)}
@keyframes spin{to{transform:rotate(360deg)}}
.lb{max-width:720px;margin:0 auto;text-align:center}
.lb ol{list-style:none;margin:0 0 18px;padding:0;text-align:left}
.lb li{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:12px 6px;border-bottom:2px dashed #cdd6b0}
.lb li b{font:700 18px Chakra;color:var(--bt)}.lb li em{font-style:normal;font-weight:700}
.lb li.empty{display:block;text-align:center;padding:28px;font-weight:600;color:#555}
.faq details{background:#fff;border:2px solid var(--ink);border-radius:14px;margin-bottom:12px;box-shadow:var(--sh)}
.faq summary{cursor:pointer;list-style:none;padding:18px 22px;font:700 19px Chakra;display:flex;justify-content:space-between}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";color:var(--bt);font-size:24px;line-height:1}
.faq details[open] summary::after{content:"–"}.faq details p{margin:0;padding:0 22px 18px}
.fin{position:relative;min-height:max(560px,46vw);background:#fff url(/assets/brand/bg_clouds.webp?v=202610302210) center/cover no-repeat;border-bottom:2px solid var(--ink);display:flex;align-items:center}
.fincopy{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.fincopy h2{font-size:clamp(44px,6vw,92px);text-shadow:5px 5px 0 var(--b)}.fincopy p{font-size:19px;font-weight:600;margin:10px 0 0;background:#fff;padding:2px 8px}
.fincopy .cta{justify-content:flex-end}.fin .b.ghost{color:var(--ink);border-color:var(--ink);background:var(--lb);box-shadow:var(--sh)}
.hf{background:var(--b);color:#111;overflow:hidden}
.hf .w{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:28px}
.hf nav{display:flex;gap:20px;font-weight:600}.hf nav a{text-decoration:none}.hf p{margin:0;font-size:14px}
.wm{font:700 clamp(80px,19.5vw,380px) Chakra;line-height:.8;text-align:center;letter-spacing:-.03em;margin-top:28px;color:#111;white-space:nowrap;transform:translateY(12%)}
/* reveal */
.up{opacity:0;transform:translateY(36px);transition:opacity .7s ease,transform .7s ease}.up.in{opacity:1;transform:none}
.tv.up.in{transform:rotate(-3deg)}.card.up.in:hover{transform:translateY(-6px)}
@media (max-width:1000px){.g4{grid-template-columns:1fr 1fr}.g7{grid-template-columns:repeat(4,1fr)}.lv{grid-template-columns:repeat(2,1fr)}.split,.tk{grid-template-columns:1fr}.hn nav{display:none}.hbar .b{margin-left:auto}}
@media (max-width:640px){.sec{padding:64px 0}.g3,.g4,.g2{grid-template-columns:1fr}.g7{grid-template-columns:1fr 1fr}.map{grid-template-columns:1fr 1fr}
 .hero{height:780px;--sw:1180px}.hbg{left:0;transform:none}.hcat{left:calc(var(--sw)*.094 - 40px)}
 .hcopy h1{font-size:58px}.hcopy p{font-size:16px}.fall .c3,.fall .r2{display:none}
 .fin{min-height:640px;background-position:22% center;align-items:flex-start;padding-top:56px}.fincopy{align-items:center;text-align:center}.fincopy .cta{justify-content:center}
 .mq{font-size:20px}.tv{margin-top:40px}.rs{width:120px;height:130px;background-size:960px 780px}@keyframes rx{to{background-position-x:-960px}}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.up{opacity:1;transform:none}.tv.up{transform:rotate(-3deg)}}
html,body{overflow-x:clip}
@media (min-width:641px){.hcopy{position:absolute;inset:0;padding:0 4vw 0 38%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;max-width:none;margin:0;padding-bottom:6%}.hcopy p{margin:0}.hcopy .cta{justify-content:flex-start}}
.wm{transform:none;padding-bottom:10px}
@media (max-width:640px){.hero{height:820px;--sw:1000px}.hcat{left:calc(var(--sw)*.094 - 30px)}.stats .g4{grid-template-columns:1fr 1fr;gap:14px}.st b{font-size:44px}.card{padding:18px}.badge{width:300px}}
@media (max-width:640px){.g7{grid-template-columns:repeat(3,1fr);gap:10px}.cat{padding:10px 4px}.cs{width:88px;height:88px;background-size:352px 352px}@keyframes cx{to{background-position-x:-352px}}@keyframes cy{to{background-position-y:-352px}}.cat h3{font-size:13px}.lv li{padding:12px;font-size:15px}}

.wmband{background:var(--b);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);overflow:hidden;padding:2.2vw 0 1.2vw}
.wmband .wm{margin:0;transform:none;line-height:.82;text-shadow:.6vw .6vw 0 var(--ink)}
.hf .w{padding-bottom:28px}
/* hero rework: centred, coin */
.hero .hcopy{position:absolute!important;inset:0!important;padding:0 20px 4%!important;display:flex!important;flex-direction:column;justify-content:center;align-items:center!important;text-align:center!important;max-width:none;margin:0}
.hero .hcopy p{margin:0 auto!important}.hero .hcopy .cta{justify-content:center!important;flex-wrap:wrap}
.coin{position:relative;width:clamp(96px,11vw,150px);aspect-ratio:1;border-radius:50%;background:#CCFF00;border:3px solid #111;box-shadow:5px 5px 0 #111,inset 0 0 0 7px #fff,inset 0 0 0 10px #111;display:grid;place-items:center;margin-bottom:14px;overflow:visible}
.coin img{width:66%;height:66%;object-fit:contain;border-radius:50%}
.coin:after{content:"";position:absolute;inset:10px;border-radius:50%;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 48%,transparent 60%) -150% 0/250% 100% no-repeat;animation:glint 3.2s ease-in-out infinite}
.coin i{position:absolute;width:16px;height:16px;background:#fff;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);filter:drop-shadow(0 0 1px #111);opacity:0;animation:spk 2.4s ease-in-out infinite}
.coin .s1{top:-6px;right:4px}.coin .s2{bottom:10px;left:-10px;animation-delay:.8s;width:12px;height:12px}.coin .s3{top:30%;right:-14px;animation-delay:1.6s;width:10px;height:10px}
@keyframes glint{0%,55%{background-position:150% 0}100%{background-position:-150% 0}}
@keyframes spk{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.coin:after,.coin i{animation:none}}
@media (max-width:520px){.hero .hcopy .cta .b{padding:11px 16px;font-size:15px}}
.hero .coin{width:150px!important;height:150px!important;flex:0 0 auto;padding:0}
.hero .coin img{width:96px!important;height:96px!important;max-width:none;margin:0;position:static}
@media (max-width:700px){.hero .coin{width:104px!important;height:104px!important}.hero .coin img{width:66px!important;height:66px!important}}
.xf img{width:16px;height:16px;filter:none}.hbar .xf{margin-right:8px}@media(max-width:700px){.hbar .xf{padding:8px 10px;font-size:0;gap:0}.hbar .xf img{width:16px}}

[data-x][hidden]{display:none!important}