:root{--ink:#eaf6ff;--kaspa:#35e3ff;--btnBorder:rgba(53,227,255,.45);--btnGlow:rgba(53,227,255,.18);--btnSolid1:#0df;--btnSolid2:#79f;--buyGlow:rgba(12,199,255,.5)}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Helvetica,Arial;color:var(--ink);background:#071023;overflow-x:hidden}
/* Background stack */
#bg{position:fixed;inset:0;z-index:-2;overflow:hidden}
#layers{position:absolute;inset:-4%}
.layer{position:absolute;inset:0;background-size:cover;background-position:center;filter:contrast(1.1)saturate(1.2)brightness(.95);opacity:0;transform:scale(1.06);transition:opacity .4s ease,transform .4s ease}
.layer.show{opacity:.98;transform:scale(1.02)}
.scanlines{position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px);background-size:100% 3px;mix-blend-mode:overlay;pointer-events:none}
.noise{position:absolute;inset:0;background-image:url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%2240%22 height=%22440%22><filter id=%22n%22><feTurbulence type=%22fractalNoise%22 baseFrequency=%220.8%22 numOctaves=%222%22 stitchTiles=%22stitch%22/></filter><rect width=%2240%22 height=%22440%22 filter=%22url(%23n)%22 opacity=%220.06%22/></svg>');mix-blend-mode:overlay;pointer-events:none}
#glitchfx,#glitchSweep,#staticFX{position:absolute;inset:0;pointer-events:none}
#glitchfx{z-index:1}#glitchSweep{z-index:2;mix-blend-mode:screen}#staticFX{z-index:3;mix-blend-mode:screen}
/* Header + buttons */
.nav{position:fixed;top:16px;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:0 12px}
.brand .mark{font-weight:900;letter-spacing:.12em;text-shadow:0 0 18px rgba(53,227,255,.35)}
.cta-fixed{display:flex;gap:10px;align-items:center;backdrop-filter:blur(14px)saturate(1.1);-webkit-backdrop-filter:blur(14px)saturate(1.1);background:linear-gradient(180deg,rgba(6,14,32,.58),rgba(8,18,40,.46));border:1px solid rgba(136,247,255,.35);box-shadow:0 18px 48px rgba(0,0,0,.45),0 0 30px rgba(53,227,255,.18);padding:8px;border-radius:18px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;font-weight:900;letter-spacing:.02em;color:#eaf6ff;transition:.2s;text-decoration:none;cursor:pointer;position:relative;overflow:hidden;white-space:nowrap}
.btn.ghost{border:1px solid var(--btnBorder);background:radial-gradient(120% 160% at 20% -20%,rgba(20,40,80,.95),rgba(8,16,32,.9));box-shadow:0 0 18px var(--btnGlow)}
.btn.solid{border:1px solid transparent;background:linear-gradient(92deg,var(--btnSolid1),var(--btnSolid2));color:#041321;text-shadow:none;box-shadow:0 10px 28px var(--buyGlow)}
.btn.solid .dot{display:inline-block;width:8px;height:8px;border-radius:99px;background:#041321}
.btn:hover{transform:translateY(-1px)}
/* Always-fuzzy buttons + hover/touch stabilize */
@keyframes fuzzNoise{0%,100%{filter:blur(.3px) saturate(1.05)}25%{filter:blur(.5px) saturate(1.1) contrast(1.02)}50%{filter:blur(.8px) saturate(1.15) contrast(1.06)}75%{filter:blur(.5px) saturate(1.08) contrast(1.03)}}
@keyframes chromaDrift{0%{text-shadow:-1px 0 rgba(255,0,255,.35),1px 0 rgba(0,255,255,.35)}50%{text-shadow:-2px 0 rgba(255,0,255,.45),2px 0 rgba(0,255,255,.45)}100%{text-shadow:-1px 0 rgba(255,0,255,.35),1px 0 rgba(0,255,255,.35)}}
.cta-fixed .btn,.brand .mark{animation:fuzzNoise 2.6s infinite linear, chromaDrift 3.4s infinite ease-in-out}
.cta-fixed .btn::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.05),rgba(255,255,255,.05) 1px,transparent 2px,transparent 4px);mix-blend-mode:overlay;opacity:.16;pointer-events:none}
.cta-fixed .btn:hover,.cta-fixed .btn.stable{animation:none!important;filter:none!important;text-shadow:none!important}
#glitchToggle[aria-pressed="false"]{border-color:rgba(255,120,120,.6);box-shadow:0 0 24px rgba(255,80,80,.3)}
/* Hero */
.hero{min-height:92vh;display:grid;place-items:center;text-align:center;padding:40px 16px;position:relative;z-index:4}
.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(600px 300px at 50% 30%,rgba(7,16,35,.55),transparent 60%);pointer-events:none;z-index:-1}
.glitch-title{font-size:clamp(64px,10vw,180px);font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#e9fbff;text-shadow:0 0 28px rgba(53,227,255,.45),0 0 80px rgba(53,227,255,.28);position:relative;animation:fuzzNoise 4.5s infinite linear}
.glitch-title::before,.glitch-title::after{content:attr(data-text);position:absolute;inset:0;mix-blend-mode:screen;pointer-events:none}
.glitch-title::before{left:2px;text-shadow:-2px 0 #f0f;animation:gl-left .9s infinite linear}
.glitch-title::after{left:-2px;text-shadow:2px 0 #0ff;animation:gl-right 1.05s infinite linear}
.glitch-title.flicker{animation:flash .2s steps(2,end) 0s 1}
#wanderText{position:absolute;left:12%;top:78%;transform:translate(-50%,-50%);font-weight:800;letter-spacing:.08em;text-transform:lowercase;background:linear-gradient(90deg,rgba(0,255,255,.5),rgba(255,0,255,.5),rgba(255,255,0,.5),rgba(0,255,255,.5));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 10px rgba(53,227,255,.18),0 0 22px rgba(255,0,255,.12);filter:saturate(1.2);opacity:.06;pointer-events:none;user-select:none;font-size:clamp(12px,1.6vw,18px)}
#wanderText.flash{opacity:.12;transition:opacity .25s ease}
/* Panels */
.panel{padding:70px 16px}.grid-1{display:grid;grid-template-columns:1fr;gap:14px;max-width:980px;margin:0 auto}
.card{background:linear-gradient(180deg,rgba(8,14,30,.82),rgba(7,10,20,.78));border:1px solid rgba(53,227,255,.28);border-radius:16px;padding:18px;color:#d8eaff;backdrop-filter:blur(6px);box-shadow:0 20px 50px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.03)}
.card:hover{transform:translateY(-1px);transition:transform .2s ease}
ul.bullets{list-style:none;margin:10px 0;padding:0}ul.bullets li{padding:6px 0;border-bottom:1px dashed rgba(200,230,255,.1)}ul.bullets li:last-child{border-bottom:0}
.foot{padding:40px 16px;text-align:center;color:#cfe0f5}
@keyframes gl-left{0%{clip-path:inset(0 0 80% 0)}50%{clip-path:inset(20% 0 20% 0)}100%{clip-path:inset(80% 0 0 0)}}
@keyframes gl-right{0%{clip-path:inset(80% 0 0 0)}50%{clip-path:inset(20% 0 20% 0)}100%{clip-path:inset(0 0 80% 0)}}
@keyframes flash{0%,100%{opacity:1}50%{opacity:.35}}
/* Mobile */
@media (max-width:820px){.nav{padding:8px 10px}.cta-fixed{gap:8px;padding:8px;max-width:100vw;overflow-x:auto;-webkit-overflow-scrolling:touch}.cta-fixed .btn{padding:10px 12px;font-size:14px;white-space:nowrap}.brand .mark{font-size:16px}}
@media (max-width:560px){.cta-fixed{max-width:92vw}.glitch-title{font-size:clamp(44px,12vw,120px)}}
