:root{--ink:#0c0618;--purple:#6b16e8;--violet:#9b35ff;--pink:#ff35ba;--yellow:#ffe24a;--cyan:#25dcff;--paper:#fff7df;--line:rgba(255,255,255,.16)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-snap-type:y proximity;background:var(--ink)}body{margin:0;color:#fff;font-family:"Space Grotesk",sans-serif;overflow-x:hidden;background:#100123}button,a{font:inherit}a{color:inherit;text-decoration:none;cursor:pointer}.panel{position:relative;width:100%;height:1080px;min-height:100svh;overflow:hidden;scroll-snap-align:start;padding:150px max(5vw,48px) 72px}.topbar{position:fixed;z-index:50;top:20px;left:50%;transform:translateX(-50%);width:min(92%,1760px);height:70px;padding:0 18px 0 24px;display:flex;align-items:center;justify-content:space-between;border:2px solid rgba(255,255,255,.25);background:rgba(17,2,42,.72);backdrop-filter:blur(14px);box-shadow:0 8px 0 rgba(0,0,0,.25)}.brand{font:18px "Press Start 2P";display:flex;align-items:center;gap:10px}.brand-paw{font-size:24px}.topbar nav,.socials{display:flex;gap:28px;align-items:center}.topbar nav a,.socials a{font-weight:700;letter-spacing:.08em;font-size:13px}.topbar a:hover{color:var(--yellow)}.socials .hot{background:var(--yellow);color:#1b0a28;padding:14px 18px;box-shadow:4px 4px 0 var(--pink)}#stars{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.noise{position:fixed;inset:0;z-index:45;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.scroll-meter{position:fixed;z-index:60;right:14px;top:14%;height:72%;width:5px;background:rgba(255,255,255,.12)}.scroll-meter span{display:block;width:100%;height:0;background:linear-gradient(var(--yellow),var(--pink),var(--cyan));box-shadow:0 0 12px var(--pink)}.hero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;background:#17003e}.hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,0,42,.7),rgba(15,0,42,.08)),url("assets/cosmic-rainbow.png") center/cover;transform:scale(1.03)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,#16002f);pointer-events:none}.hero-copy,.hero-art{position:relative;z-index:3}.eyebrow{font:13px "Press Start 2P";color:var(--yellow);letter-spacing:.06em;line-height:1.7}.hero h1,.panel h2{font-family:"Press Start 2P";line-height:1.05;margin:18px 0;text-shadow:7px 7px 0 #3c0868}.hero h1{font-size:clamp(48px,5.8vw,108px)}.hero h1 span,.panel h2 span{color:var(--yellow);-webkit-text-stroke:2px #54209a;text-shadow:5px 5px 0 var(--pink)}.lede{font-size:clamp(20px,1.6vw,32px);font-weight:700;line-height:1.35}.actions{display:flex;gap:16px;margin-top:34px;flex-wrap:wrap}.pixel-btn{border:3px solid #fff;background:var(--yellow);color:#150527;padding:18px 22px;font-weight:800;letter-spacing:.04em;cursor:pointer;box-shadow:7px 7px 0 var(--pink);transition:.18s transform,.18s box-shadow}.pixel-btn:hover{transform:translate(4px,4px);box-shadow:3px 3px 0 var(--pink)}.pixel-btn.ghost{background:#1d0648;color:#fff}.pixel-btn i{margin-left:12px}.hero-art{height:780px;display:flex;align-items:flex-end;justify-content:center}.hero-art img{height:96%;max-width:100%;object-fit:contain;image-rendering:auto;filter:drop-shadow(0 24px 0 rgba(46,0,85,.6));animation:float 4s ease-in-out infinite}.aura{position:absolute;inset:14% 8%;border-radius:50%;background:conic-gradient(from 90deg,var(--pink),var(--yellow),var(--cyan),var(--purple),var(--pink));filter:blur(36px);opacity:.48;animation:spin 8s linear infinite}.sticker{position:absolute;font:14px "Press Start 2P";padding:13px 15px;background:var(--yellow);color:#1b0739;border:4px solid #1b0739;box-shadow:5px 5px 0 #fff;transform:rotate(-8deg)}.s1{top:24%;right:-1%}.s2{bottom:18%;left:0;transform:rotate(7deg);background:var(--cyan)}.marquee{position:absolute;z-index:5;bottom:0;left:0;right:0;background:var(--yellow);color:#17002e;border-block:4px solid #17002e;white-space:nowrap;overflow:hidden;font:16px "Press Start 2P";padding:18px 0}.marquee div{display:inline-block;animation:marquee 22s linear infinite}.section-no{position:absolute;top:118px;right:5vw;font:12px "Press Start 2P";color:rgba(255,255,255,.55)}.lore{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;align-items:center;background:radial-gradient(circle at 24% 45%,#7e1eaa 0,transparent 30%),linear-gradient(135deg,#18003e,#32035c)}.lore:before{content:"";position:absolute;inset:0;opacity:.12;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px}.lore-art{position:relative;height:700px;display:grid;place-items:center}.lore-art img{position:relative;z-index:2;max-height:100%;max-width:95%;animation:smug 5s ease-in-out infinite;filter:drop-shadow(20px 26px 0 rgba(0,0,0,.25))}.portal{position:absolute;width:540px;height:540px;border:28px solid var(--pink);border-radius:50%;box-shadow:0 0 0 24px var(--yellow),0 0 0 52px var(--cyan),0 0 80px 70px var(--purple);animation:pulse 3s ease-in-out infinite}.lore-copy{position:relative}.panel h2{font-size:clamp(36px,4vw,72px)}.lore-copy>p:not(.eyebrow),.road-copy>p:not(.eyebrow){font-size:21px;line-height:1.55;max-width:760px;color:#eee3ff}.stats{display:flex;margin-top:38px;border:3px solid #fff;background:#17052d;box-shadow:8px 8px 0 var(--cyan)}.stats span{flex:1;padding:20px;text-align:center;font:11px "Press Start 2P";line-height:1.8}.stats b{display:block;font-size:27px;color:var(--yellow)}.roadmap{background:linear-gradient(180deg,#f832a8 0 43%,#4f13a5 43% 100%)}.roadmap:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 8% 14%,var(--yellow) 0 3px,transparent 4px),radial-gradient(circle at 75% 20%,white 0 3px,transparent 4px);background-size:140px 130px;opacity:.55}.road-copy{position:relative;width:48%;z-index:3}.quest-line{position:relative;z-index:4;margin-top:75px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px;border-top:8px solid var(--yellow);padding-top:34px}.quest{min-height:200px;padding:26px 22px;background:#18062d;border:3px solid #fff;box-shadow:8px 8px 0 #2edcff;transition:.25s}.quest:hover{transform:translateY(-12px);box-shadow:8px 20px 0 #2edcff}.quest:before{content:"";position:absolute;margin-top:-53px;width:20px;height:20px;background:var(--cyan);border:5px solid #fff;transform:rotate(45deg)}.quest.active{background:var(--yellow);color:#17002e;box-shadow:8px 8px 0 #fff}.quest i{font:14px "Press Start 2P";color:var(--pink)}.quest b{display:block;font:15px "Press Start 2P";line-height:1.5;margin:15px 0}.quest p{line-height:1.45;margin:0}.skater{position:absolute;height:520px;right:1%;top:5%;z-index:2;filter:drop-shadow(18px 18px 0 rgba(29,3,67,.32));animation:kickflip 4.5s ease-in-out infinite}.chart{background:radial-gradient(circle at 85% 25%,#6b16e8 0,transparent 26%),#100022;padding-bottom:0}.chart-head{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:2}.chart-head h2{margin-top:12px}.live-dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:#51ff7a;box-shadow:0 0 12px #51ff7a;animation:blink 1s step-end infinite}.chart-shell{height:570px;background:#090112;border:4px solid #fff;box-shadow:12px 12px 0 var(--pink);position:relative;overflow:hidden}.chart-controls{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;background:#251047;border-bottom:2px solid #60468b;font:11px "Press Start 2P"}.chart-shell iframe{width:100%;height:calc(100% - 48px);border:0;background:#0b0711}.chart-wait{position:absolute;inset:48px 0 0;display:grid;place-content:center;text-align:center;background:radial-gradient(circle,#321061,#0b0314 70%)}.chart-wait b{font:22px "Press Start 2P";color:var(--yellow)}.chart-wait code{color:var(--cyan)}footer{height:160px;margin:45px -5vw 0;padding:25px 5vw;display:flex;align-items:center;justify-content:space-between;border-top:2px solid var(--line);background:#090014}footer b{font:15px "Press Start 2P";color:var(--yellow)}footer p{margin:8px 0}.footer-links{display:flex;gap:28px;font-weight:700}.fine{font-size:12px;color:#aa98bd}.toast{position:fixed;z-index:100;left:50%;bottom:28px;transform:translate(-50%,140px);background:var(--yellow);color:#19052e;border:3px solid #fff;padding:18px 24px;font:13px "Press Start 2P";box-shadow:7px 7px 0 var(--pink);transition:.35s}.toast.show{transform:translate(-50%,0)}.reveal{opacity:0;transform:translateY(40px);transition:.8s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}
@keyframes float{50%{transform:translateY(-20px) rotate(1deg)}}@keyframes smug{50%{transform:translateY(-12px) rotate(-1deg)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{transform:scale(1.04);filter:hue-rotate(40deg)}}@keyframes kickflip{50%{transform:translateY(-26px) rotate(3deg)}}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes blink{50%{opacity:.25}}
@media(max-width:900px){html{scroll-snap-type:none}.topbar{top:10px;height:58px}.topbar nav{display:none}.socials{gap:8px}.socials a{font-size:10px}.socials .hot{padding:10px}.panel{height:auto;min-height:100svh;padding:110px 22px 70px}.hero,.lore{grid-template-columns:1fr}.hero{padding-bottom:100px}.hero-copy{text-align:center}.actions{justify-content:center}.hero-art{height:480px}.sticker{font-size:9px}.lore-art{height:440px;order:2}.portal{width:330px;height:330px}.lore-copy{order:1}.road-copy{width:100%}.quest-line{grid-template-columns:1fr 1fr}.skater{opacity:.2;height:420px;top:9%}.chart-head{align-items:flex-start;gap:15px;flex-direction:column}.chart-shell{height:520px}.chart{padding-bottom:0}footer{height:auto;flex-direction:column;align-items:flex-start;gap:18px;margin:40px -22px 0;padding:25px 22px}.footer-links{flex-wrap:wrap}.scroll-meter{display:none}}
@media(max-width:560px){.brand{font-size:12px}.socials a:not(.hot){display:none}.hero h1{font-size:39px}.panel h2{font-size:31px}.eyebrow{font-size:10px}.hero-art{height:410px}.stats{flex-direction:column}.stats span{padding:12px}.quest-line{grid-template-columns:1fr}.quest{min-height:0}.chart-shell{height:480px}.chart-wait{padding:25px}.chart-wait b{font-size:15px}.section-no{top:84px}.skater{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
