/* Logo-inspired website chrome. Game canvas, HUD and menus retain their styling. */
body{background:radial-gradient(ellipse at 95% 8%,#01385b40,transparent 42%),radial-gradient(ellipse at 0 38%,#ad00651a,transparent 40%),#030817}
.site>header{height:104px;border-bottom:1px solid #234151;position:relative}
.site>header:after{content:'';position:absolute;bottom:-1px;left:0;width:180px;height:2px;background:linear-gradient(90deg,#00e5ef,#ff27ac,#ffd65a)}
.site>header .brand{align-items:center;gap:18px}



.site>header nav{gap:24px}
.site>header nav button{border:1px solid #264050;background:#071225;padding:12px 14px;box-shadow:3px 3px #010410;color:#c7dfed;transition:border-color .15s,transform .15s}
.site>header nav button:hover{border-color:#00e5ef;color:#00e5ef;transform:translateY(-2px)}
.site>header .live{font-size:8px;letter-spacing:1px;color:#e2b8da}
.site>header .live i{background:#ff27ac;box-shadow:0 0 12px #ff27ac88}
.site>main>.eyebrow{margin-top:3px;color:#6f9ab2}
.site>main>.eyebrow span:first-child{color:#00e5ef}
.site>main>.eyebrow i{color:#ffd65a}
.site>main>.headline{position:relative;min-height:130px;margin:6px 0 23px;align-items:center;gap:30px;overflow:hidden}
.headline .hero-copy{position:relative;z-index:1;flex:1}
.site>main>.headline h1{font:900 clamp(18px,5.2vw,70px)/1.05 var(--display);color:#fff0c9;text-shadow:3px 3px #071021;margin:10px 0 14px;letter-spacing:-.3px;white-space:nowrap}

.site>main>.headline em{display:inline-block;margin:0;background:linear-gradient(175deg,#36fff2 20%,#00d9ef 46%,#ff27ac 88%);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:none}
.site>main>.headline p{font:8px/1.9 var(--mono);letter-spacing:1.5px;color:#8ba6bf;margin:0}

.site>main>.console{border-color:#284e61;box-shadow:3px 3px 0 #00dae120,-3px -3px 0 #ff27ac20,0 22px 70px #0008}
.site>main>.below{border-color:#22394b;color:#93aec3;padding:20px 0}
.site>main>.below kbd{background:#091729;border-color:#2e4b60;color:#ffe6a4}
.site>main>.below>#help{color:#00e5ef}
.site>main>.features{gap:14px;padding:26px 0}
.site>main>.features>div{flex:1;padding:18px 14px;background:linear-gradient(140deg,#0a1a2c,#07101f);border:1px solid #193849;border-top:2px solid #00d9e3;grid-template-columns:27px auto}
.site>main>.features>div:nth-child(2){border-top-color:#ff27ac}
.site>main>.features>div:nth-child(3){border-top-color:#ffd65a}
.site>main>.features .feature-num{color:#00e5ef}
.site>main>.features strong{color:#ffedbd;font-size:18px;letter-spacing:.6px}
.site>main>.features p{color:#8aa7bc;line-height:1.7}
.site>main>.features .stamp{padding:15px;border:1px solid #263649;color:#91a5c2;font-size:7px;align-self:stretch;display:flex;align-items:center}
.site>main>.features .stamp b{color:#ff58c1}
.site>footer{border-color:#22394b;color:#7391ac}
.site>footer button{color:#f1d18b}
.site>footer .footer-state{color:#8cbac7}
@media(max-width:1000px){.site>header .live{display:none}.site>header nav{gap:12px}.site>main>.features{flex-wrap:wrap}.site>main>.features>div{min-width:28%}.site>main>.features .stamp{display:none}}
@media(max-width:600px){.site>header{height:98px}.site>header nav{gap:7px}.site>header nav button{padding:10px 8px;font-size:8px;letter-spacing:0}.site>main>.eyebrow{font-size:6px;letter-spacing:1px}.site>main>.headline{min-height:110px;margin:12px 0 22px;gap:0}.site>main>.headline h1{font-size:8vw;margin:0 0 12px}.site>main>.headline em{display:inline-block;margin:0}.site>main>.headline p{font-size:6px;letter-spacing:1px}.site>main>.headline p br{display:none}.site>main>.features{gap:10px}.site>main>.features>div{min-width:100%;padding:14px}.site>main>.features>div:last-of-type{display:grid}.site>main>.features strong{font-size:18px}.site>main>.features p{font-size:10px}.site>footer{gap:15px}}
@media(prefers-reduced-motion:reduce){.site>header nav button{transition:none}}
@media(max-width:600px){.site>header nav button{min-height:44px;padding:10px;font-size:10px}.site>header nav button span{display:inline;font-size:8px}.site>main>.headline p{display:block}}

.site>header .brand{flex-shrink:0}.site>header .nav-logo{display:block;width:clamp(200px,36vw,460px);height:auto}
@media(max-width:600px){.site>header{height:90px;gap:12px}.site>header .nav-logo{width:clamp(130px,44vw,240px)}.site>header nav{gap:6px}.site>header nav button{padding:10px 7px}}
@media(max-width:380px){.site>header nav button{padding:10px 6px}.site>header nav button span{font-size:7px}.site>header .nav-logo{width:42vw}}

/* Token details stay outside the playable game. */
.token-section{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;margin:12px 0 42px;padding:36px 32px;border:1px solid #264355;background:radial-gradient(ellipse at 0 100%,#00dce314,transparent 60%),linear-gradient(120deg,#0b1729,#090d20);box-shadow:4px 4px #010410;overflow:hidden}
.token-section:before{content:'';position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,#00e5ef,#ff27ac 65%,#ffd65a)}
.token-eyebrow{font:9px/1.7 var(--mono);letter-spacing:1.5px;color:#84adbf}
.token-copy h2{font:900 clamp(48px,6vw,82px)/1 var(--display);font-style:italic;letter-spacing:-1px;margin:15px 0 10px;background:linear-gradient(175deg,#b5fff5 10%,#00e3ee 45%,#ff32b0 90%);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(3px 3px #010510)}
.token-copy p{font:12px/1.7 var(--mono);color:#c3d7e3;margin:0}
.token-contract{min-width:0;padding:22px;background:#040b19;border:1px solid #284153;border-left:3px solid #ff27ac}
.token-contract-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font:9px/1.6 var(--mono);letter-spacing:1px;color:#b6cddd}
.token-pending{font-size:8px;color:#ffd65a;border:1px solid #5c4b32;padding:4px 7px;white-space:nowrap}
.token-address{display:block;font:14px/1.7 var(--mono);letter-spacing:1px;overflow-wrap:anywhere;color:#00e5ef;margin:20px 0 12px}
.token-contract p{font:10px/1.8 var(--mono);color:#7d9bb2;margin:0}
.mobile-session .token-section{display:none}
@media(max-width:800px){.token-section{grid-template-columns:1fr;gap:26px;padding:28px 22px}.token-copy h2{font-size:64px}}
@media(max-width:400px){.token-section{padding:25px 17px}.token-eyebrow{font-size:8px}.token-copy h2{font-size:54px}.token-contract{padding:17px 14px}.token-contract-heading{font-size:8px;letter-spacing:.4px}.token-pending{font-size:7px}.token-address{font-size:12px}}
