@font-face{font-family:Montserrat;src:url('/assets/montserrat-500.ttf');font-weight:500;font-display:swap}
@font-face{font-family:Montserrat;src:url('/assets/montserrat-700.ttf');font-weight:700 900;font-display:swap}
:root{color-scheme:dark;font-family:Montserrat,Arial,sans-serif;font-weight:500;background:#080a0e;color:#f5f5f7;--scene-scale:1}
*{box-sizing:border-box}
html{min-height:100%;overflow-x:hidden;overflow-x:clip;background:#080a0e;overscroll-behavior-x:none}
body{margin:0;width:100%;min-width:280px;min-height:100svh;display:flex;flex-direction:column;overflow-x:hidden;overflow-x:clip;overscroll-behavior-x:none;background:radial-gradient(ellipse at 50% 35%,#1d23344d,transparent 60%),linear-gradient(180deg,#10131b,#07090d)}
body:after{content:"";position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 160px #0008;z-index:0}
a,button{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}
a:focus-visible,button:focus-visible{outline:2px solid #8ecdfa;outline-offset:9px}
header{position:relative;z-index:5;display:flex;align-items:center;justify-content:flex-end;width:100%;padding:26px 40px;font-size:10px;letter-spacing:.18em;color:#a9afbb}
.owner-link{border:0;background:#13182255;border-radius:4px;padding:12px 16px;letter-spacing:.04em;color:#b1bccc;font-size:10px;font-weight:700;box-shadow:0 0 16px #7fb6df1c,0 0 5px #7fb6df12;transition:background .2s}
.owner-link:hover{background:#242c3b88;color:#fff}.owner-link span{margin-left:12px;color:#8bbde7}
main{position:relative;flex:1;min-width:0;display:flex;align-items:center;justify-content:center;flex-direction:column;isolation:isolate;padding:2px 20px 20px}
.scene-window{position:fixed;inset:0;overflow:hidden;contain:strict;z-index:-1;pointer-events:none}
.scene{position:absolute;width:1680px;height:945px;left:50%;top:43%;transform:translate(-50%,-50%) scale(var(--scene-scale));transform-origin:center}
.ambient{position:absolute;inset:0}
.red-glow,.blue-glow{position:absolute;top:30px;opacity:.65;will-change:transform,opacity}.red-glow{left:130px}.blue-glow{left:730px}
.grid-field{position:absolute;inset:-20% -18%;background-image:linear-gradient(#9fb9d40b 1px,transparent 1px),linear-gradient(90deg,#9fb9d40b 1px,transparent 1px);background-size:56px 56px;transform:perspective(1100px) rotateX(24deg);transform-origin:50% 42%;will-change:transform;mask-image:linear-gradient(transparent 2%,#000 26%,#000 65%,transparent 95%)}
.grid-field:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#aecfe832 1px,transparent 1px),linear-gradient(90deg,#aecfe832 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 25% 24% at var(--light-x,50%) var(--light-y,45%),#000,transparent);opacity:.65}
.hero-depth{position:relative;flex:none;display:flex;align-items:center;flex-direction:column;gap:20px;width:min(880px,100%);perspective:1100px;transform-style:preserve-3d;z-index:1;user-select:none;touch-action:pan-y pinch-zoom;-webkit-tap-highlight-color:transparent}
.helmet-plane{position:relative;height:clamp(215px,40svh,430px);width:auto;aspect-ratio:.89;transform-style:preserve-3d;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.helmet{filter:drop-shadow(-12px 8px 28px #8f132820) drop-shadow(15px 8px 28px #3266a422) drop-shadow(0 28px 24px #0009);position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.logo-plane{position:relative;width:clamp(290px,39vw,555px);max-width:88vw;aspect-ratio:5.5;padding:0;border:0;background:none;transform-style:preserve-3d;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.game-logo{filter:drop-shadow(0 2px 0 #192135) drop-shadow(0 4px 0 #090d17) drop-shadow(0 10px 15px #000a);position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.announcement{margin:32px 0 0;text-align:center;position:relative;z-index:2;padding:0 12px 5px}.eyebrow{font-size:9px;letter-spacing:.34em;color:#a3afc1;line-height:1.8;margin:0 0 13px}
h2{font-size:clamp(36px,4.2vw,58px);font-weight:700;letter-spacing:-.045em;line-height:1.12;margin:0;text-shadow:0 6px 40px #0009}h2 span{color:#91c9ef}
.release-rule{height:1px;width:160px;margin:22px auto 0;background:linear-gradient(90deg,transparent,#ba5d7577,#8bc8ed99,transparent);box-shadow:0 4px 24px #8bc8ed11}
#particles{position:fixed;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.countdown{display:flex;align-items:flex-start;justify-content:center;gap:18px;margin:22px auto 0;font-variant-numeric:tabular-nums}.countdown[hidden],.release-date[hidden]{display:none}.countdown div{min-width:48px;display:flex;flex-direction:column;gap:8px}.countdown b{font-weight:500;font-size:30px;letter-spacing:-.04em}.countdown span{color:#9ea9bb;text-transform:uppercase;font-size:8px;letter-spacing:.15em}.countdown i{font-style:normal;color:#5c687e;font-size:25px}.release-date{font-size:10px;color:#a3afc1;line-height:1.7;margin:18px auto 0}
.countdown{gap:9px;align-items:center;margin-top:25px}.countdown div{min-width:76px;padding:15px 17px 13px;border:1px solid #b3c6e126;background:linear-gradient(145deg,#1d263744,#0c101acc);box-shadow:inset 0 1px #d8e6f306,0 8px 28px #0004;border-radius:3px;gap:9px}.countdown div:first-child{border-top-color:#d4798a65}.countdown div:last-child{border-top-color:#8fcdf075}.countdown b{font-size:35px;line-height:1.15;color:#e9eef7;text-shadow:0 0 25px #a4d5ff12}.countdown span{font-size:7px;color:#aab7c9;letter-spacing:.16em}.countdown i{font-size:16px;color:#617187;margin-top:-13px}.release-date{font-size:12px;color:#a3afc1}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){header{padding:22px;font-size:9px}.owner-link{padding:10px 12px;font-size:9px}main{padding:14px 16px 26px}.hero-depth{gap:20px}.helmet-plane{height:clamp(220px,39svh,350px)}.logo-plane{width:min(82vw,430px);max-width:none}.announcement{margin-top:34px}.eyebrow{font-size:7px;letter-spacing:.23em}h2{font-size:38px}.scene{top:33%}.countdown{gap:12px}.countdown b{font-size:27px}.countdown div{min-width:40px}}
@media(max-height:650px) and (min-width:601px){header{padding:16px 32px}.helmet-plane{height:215px}.hero-depth{gap:12px}.logo-plane{width:350px}.announcement{margin-top:20px}.eyebrow{margin-bottom:8px;font-size:8px}h2{font-size:34px}.release-rule{margin-top:15px}.countdown{margin-top:12px}.countdown b{font-size:24px}}
@media(max-width:600px){.helmet-plane{height:clamp(190px,36svh,350px)}.announcement{margin-top:28px}h2{font-size:clamp(30px,9.4vw,38px)}}
body.countdown-on .helmet-plane{height:clamp(190px,32svh,340px)}body.countdown-on .announcement{margin-top:24px}
@media(max-width:600px){.countdown{gap:5px;margin-top:22px}.countdown div{min-width:58px;padding:12px 10px 11px}.countdown b{font-size:27px}.countdown span{font-size:7px;letter-spacing:.08em}.countdown i{font-size:12px}.countdown[data-days="3"] div:first-child b{font-size:23px}.countdown[data-days="4"] div:first-child b{font-size:18px}.release-date{max-width:310px;font-size:11px}body.countdown-on header{padding:18px 22px}body.countdown-on main{padding-bottom:14px}body.countdown-on .helmet-plane{height:clamp(180px,29svh,280px)}body.countdown-on .hero-depth{gap:14px}body.countdown-on .announcement{margin-top:20px}}
@media(prefers-reduced-motion:reduce){.helmet-plane,.logo-plane,.grid-field,.red-glow,.blue-glow{will-change:auto}*{scroll-behavior:auto!important;transition:none!important}}
