﻿#boot{position:fixed;top:0;left:0;width:100%;height:100vh;height:100dvh;z-index:99999;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);box-sizing:border-box;transition:opacity .8s ease,visibility 0s linear .8s}
#boot.done{opacity:0;visibility:hidden;pointer-events:none}
html.booted #boot,html:not(.booting) #boot{display:none}
html.booting,html.booting body{overflow:hidden}

/* Decorations only (hidden in lite mode); the core animation is transform/opacity only */
#boot::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,rgba(198,124,244,.22),transparent 60%);opacity:0}
#boot.go::before{animation:boot-glow 2.4s ease-out .4s forwards}
#boot::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);opacity:.6}
#boot.lite::before,#boot.lite::after,#boot.lite .boot-logo-wrap::after,#boot.lite .boot-glow{display:none}

.boot-stage{position:relative;display:flex;flex-direction:column;align-items:center;gap:clamp(14px,4vh,40px);max-width:100%;padding:0 4vw;box-sizing:border-box}
.boot-logo-wrap{position:relative;opacity:0;transform:translate3d(0,60vh,0) scale(.7);will-change:transform,opacity;backface-visibility:hidden}
#boot.go .boot-logo-wrap{animation:boot-rise 1.9s cubic-bezier(.16,1,.3,1) .3s forwards}
#boot.go:not(.lite) .boot-logo-wrap{animation:boot-rise 1.9s cubic-bezier(.16,1,.3,1) .3s forwards,boot-float 4s ease-in-out 2.3s infinite}
.boot-logo{display:block;height:min(76vh,720px,140vw);height:min(76dvh,720px,140vw);width:auto;max-width:92vw}
.boot-glow{position:absolute;left:50%;top:50%;width:150%;height:150%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(198,124,244,.35),transparent);z-index:-1;pointer-events:none}
.boot-logo-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);background-size:250% 100%;background-position:150% 0;-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat;opacity:0}
#boot.go .boot-logo-wrap::after{animation:boot-sheen 1.4s ease-in-out 1.7s forwards}
.boot-text{font-family:"Play",system-ui,sans-serif;font-weight:400;font-size:clamp(1rem,5.2vw,3.2rem);color:#dfcc6c;letter-spacing:.3em;text-indent:.3em;white-space:nowrap;max-width:100%;opacity:0;transform:translate3d(0,10px,0) scale(1.12);will-change:transform,opacity;text-shadow:0 0 14px rgba(198,124,244,.75)}
#boot.lite .boot-text{text-shadow:none}
#boot.go .boot-text{animation:boot-text 1.8s cubic-bezier(.22,1,.36,1) 1.9s forwards}
.boot-line{height:1px;width:min(60vw,420px);background:linear-gradient(90deg,transparent,#c67cf4,#dfcc6c,#c67cf4,transparent);transform:scaleX(0);opacity:.9;will-change:transform}
#boot.go .boot-line{animation:boot-line 1.4s ease-out 2.1s forwards}
.boot-prompt{position:absolute;left:0;right:0;bottom:calc(6vh + env(safe-area-inset-bottom));text-align:center;font-family:"Play",system-ui,sans-serif;font-size:clamp(.7rem,2.6vw,1rem);letter-spacing:.35em;text-indent:.35em;text-transform:uppercase;color:rgba(223,204,108,.85);opacity:0;pointer-events:none}
#boot.go .boot-prompt{animation:boot-prompt-in .8s ease 3.6s forwards,boot-pulse 2s ease-in-out 4.4s infinite}
@keyframes boot-prompt-in{to{opacity:.75}}
@keyframes boot-pulse{0%,100%{opacity:.75}50%{opacity:.25}}
@keyframes boot-rise{0%{opacity:0;transform:translate3d(0,60vh,0) scale(.7)}50%{opacity:1}100%{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes boot-float{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-8px,0)}}
@keyframes boot-sheen{0%{opacity:1;background-position:150% 0}100%{opacity:1;background-position:-50% 0}}
@keyframes boot-text{to{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes boot-line{to{transform:scaleX(1)}}
@keyframes boot-glow{to{opacity:1}}
@media (orientation:landscape) and (max-height:480px){.boot-logo{height:62vh;height:62dvh}.boot-stage{gap:10px}.boot-text{font-size:clamp(.9rem,3.6vw,2rem)}}
@media (prefers-reduced-motion:reduce){#boot.go .boot-logo-wrap,#boot.go .boot-text,#boot.go .boot-line,#boot.go .boot-prompt{animation-duration:.01s;animation-delay:0s}#boot.go .boot-prompt{animation:boot-prompt-in .01s forwards}.boot-logo-wrap::after{display:none}}
