html,body{position:fixed;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;overflow:hidden;background:#061126;color:white;touch-action:none;overscroll-behavior:none}
#stage{position:fixed;inset:0;overflow:hidden;background:#061126}
#canvas{display:block;position:absolute;inset:0;width:100%;height:100%;border:0;margin:0;padding:0}
#canvas:focus{outline:none}
#launch{position:fixed;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;overflow-x:hidden;overflow-y:auto;touch-action:pan-y;background:#061126;transition:opacity .4s ease}
#launch.gone{opacity:0;pointer-events:none}
#bg{position:fixed;background:url('loading-bg.jpg') center/cover no-repeat;pointer-events:none}
#bg::after{content:"";position:absolute;inset:0}
#logo,#bottom{position:relative}
#bottom{display:flex;flex-direction:column}
#play{display:none;width:100%;border:0;cursor:pointer}
#bar{overflow:hidden}
#fill{height:100%;width:0%;transition:width .25s ease}
#news{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:20;overflow:auto;touch-action:pan-y}
#launch.news-open #news{display:block}
#launch.news-open::after{content:"";position:fixed;inset:0;z-index:15;background:#020612b3;backdrop-filter:blur(6px)}
#news h2{display:flex;align-items:center;justify-content:space-between}
#news button{cursor:pointer;color:white}
#error,#notice{display:none}
#error{padding:14px;color:#ffd2d2}
#error p{margin:0 0 10px;white-space:pre-line}
#error pre{margin:8px 0 0;max-height:22vh;overflow:auto;white-space:pre-wrap}
#error .row{display:flex;gap:10px}
#error button{flex:1;border:0;border-radius:10px;color:white}
@font-face{font-family:RiftDisplay;src:url('fonts/LilitaOne-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:RiftBody;src:url('fonts/Nunito.ttf') format('truetype');font-weight:200 1000;font-display:swap}
:root{--cyan:#5fd8ff;--gold:#ffc637;--navy:#061126;--line:#6689bc;--muted:#a9bddc}
*{box-sizing:border-box}
body{font-family:RiftBody,system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,select{font:inherit}
button:focus-visible,select:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}
#launch{padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));gap:18px;justify-content:space-between}
#bg{inset:0;background-position:center 43%;animation:none}
#bg::after{background:linear-gradient(180deg,rgba(6,17,38,.12),rgba(6,17,38,.12) 38%,rgba(6,17,38,.7) 70%,#061126)}
.spark{display:none}
#logo{flex:1;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:min(80vw,350px);min-height:100px;margin:0;padding-top:8px;animation:none}
#logo img{width:100%;max-height:24vh;object-fit:contain;filter:drop-shadow(0 8px 16px #030a19);animation:logo-breathe 6s ease-in-out infinite}
#logo::after{display:none}
.launch-tagline{font-size:11px;letter-spacing:.18em;font-weight:900;color:#d7e7ff;margin-top:10px;text-shadow:0 2px 8px #000}
#bottom{flex:none;width:min(100%,440px);padding:22px;margin:0;gap:12px;border:1.5px solid var(--line);border-radius:20px;background:linear-gradient(145deg,rgba(21,40,73,.97),rgba(6,17,38,.97));box-shadow:0 12px 40px #02081788,inset 0 1px 0 #b8d3ff33;animation:none}
.launch-heading{font:30px/1.05 RiftDisplay,system-ui,sans-serif;text-align:center;letter-spacing:.01em}
.launch-description{margin:0 0 4px;text-align:center;font-size:14px;line-height:1.4;color:var(--muted)}
.panel{background:#10203f;border:1.5px solid var(--line);box-shadow:0 4px 14px #02081755,inset 0 1px 0 #b8d3ff22;backdrop-filter:none}
#news-btn{align-self:stretch;justify-content:flex-start;width:100%;height:48px;min-height:48px;border-radius:12px;padding:0 14px;font-size:14px;letter-spacing:0;font-weight:800;text-align:left}
#news-btn .star{font-size:22px;margin-right:2px}
#news-btn #ver{margin-left:auto;font-size:12px;color:var(--muted)}
#news-btn .chev{color:var(--muted);font-size:12px}
#play{height:56px;min-height:56px;border-radius:12px;color:#281e0c;text-shadow:none;font:30px/1 RiftDisplay,system-ui,sans-serif;letter-spacing:.02em;background:linear-gradient(#ffe064,#ffc637 65%,#ffa51b);box-shadow:inset 0 0 0 2px #ffedac,inset 0 -5px 0 #d58b17;clip-path:polygon(3% 0,97% 0,100% 20%,100% 80%,97% 100%,3% 100%,0 80%,0 20%);animation:none}
#play:hover{filter:brightness(1.06)}
#play:active{transform:translateY(2px);filter:brightness(.94)}
#bar{height:10px;border-radius:6px;border:1px solid #466087;background:#030c1c}
#fill{background:linear-gradient(#8aeaff,#23b9f0);box-shadow:none}
#status{font-size:13px;line-height:1.4;min-height:18px;letter-spacing:0;color:#c9ddf5}
#version{font-size:11px;color:var(--muted);letter-spacing:.03em}
#news{width:min(calc(100vw - 32px),570px);max-height:calc(100dvh - max(40px,env(safe-area-inset-top)) - max(40px,env(safe-area-inset-bottom)));padding:20px;border-radius:20px;background:#0c1a33}
#news h2{font:26px RiftDisplay,system-ui,sans-serif;text-shadow:none;letter-spacing:0;margin:0 0 14px;gap:12px}
#news h2 small{font:800 13px RiftBody,system-ui,sans-serif;color:var(--gold)}
#news-close{width:44px;height:44px;min-width:44px;border-radius:12px;border:1.5px solid var(--line);background:#142847;font-size:18px}
.release-picker{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:0 0 14px;border-bottom:1px solid #6689bc44;color:var(--muted);font-size:13px;font-weight:800}
#release-picker{height:44px;flex:1;min-width:160px;border:1.5px solid var(--line);border-radius:10px;padding:0 10px;color:white;background:#142847;font-size:14px}
#release-title{font:23px RiftDisplay,system-ui,sans-serif;margin:18px 0 4px}
#release-date{font-size:12px;color:var(--cyan);margin:0 0 14px}
#news ul{font-size:14px;line-height:1.6;color:#d5e3f7;padding-left:20px}
#news li{padding:0 0 10px}
#news li::marker{color:var(--cyan)}
#notice{font-size:12px;padding:12px;line-height:1.5}
#error{font-size:14px;border-color:#db7c78}
#error button{min-height:44px;background:#2452a2;font-weight:800}
#error pre{font:11px/1.4 monospace}
@keyframes logo-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(min-width:740px) and (orientation:landscape){
 #launch{display:grid;grid-template-columns:minmax(220px,1fr) minmax(300px,440px);align-content:center;align-items:center;justify-content:center;gap:clamp(24px,5vw,80px);padding-left:max(5vw,env(safe-area-inset-left));padding-right:max(5vw,env(safe-area-inset-right))}
 #logo{justify-self:center;width:min(100%,430px);padding:0;min-height:0}
 #logo img{max-height:48vh;width:100%}
 #bottom{justify-self:center;padding:24px}
 #bg::after{background:linear-gradient(90deg,rgba(6,17,38,.05),rgba(6,17,38,.35) 40%,rgba(6,17,38,.9))}
}
@media(max-height:520px){
 #launch{gap:10px;padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}
 #bottom{gap:8px;padding:16px}
 .launch-heading{font-size:26px}
 .launch-description{font-size:12px}
 #logo img{max-height:44vh}
 #play{height:50px;min-height:50px;font-size:28px}
 .launch-tagline{font-size:9px}
 #news{max-height:calc(100dvh - 24px)}
}
@media(max-width:360px) and (orientation:portrait){#bottom{padding:16px}.launch-heading{font-size:27px}.launch-description{font-size:13px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
#news-btn{display:flex;align-items:center;gap:8px;color:#eef5ff;cursor:pointer}
#status,#version{text-align:center}