@font-face{font-family:Silkscreen;src:url('assets/Silkscreen-Regular.ttf') format('truetype');font-display:swap}
*{box-sizing:border-box}
html{min-height:100%;background:#080808}
body{margin:0;min-height:100svh;display:grid;place-items:center;background:#080808;color:#f6f1eb;text-align:center;-webkit-font-smoothing:antialiased}
main{width:100%;padding:64px 24px 80px;display:flex;flex-direction:column;align-items:center}
.logo{display:block;width:192px;height:192px;object-fit:contain;margin:0 0 42px}
h1{font-family:Silkscreen,monospace;font-size:clamp(24px,4vw,36px);font-weight:400;letter-spacing:3px;line-height:1.4;margin:0}
.coming{font-family:Arial,Helvetica,sans-serif;font-size:10px;font-weight:500;letter-spacing:5px;line-height:1.8;color:#aaa6a3;margin:23px 0 0;padding-left:5px}
@media(max-width:480px){.logo{width:156px;height:156px;margin-bottom:34px}h1{letter-spacing:2px}.coming{font-size:9px;letter-spacing:4px}main{padding-bottom:64px}}

.logo{animation:float 7s ease-in-out infinite}
h1{position:relative;animation:glitch-shift 13s linear infinite}
h1:before,h1:after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;opacity:0}
h1:before{color:#40ddd1;animation:glitch-top 13s linear infinite}
h1:after{color:#ff5590;animation:glitch-bottom 13s linear infinite}
@keyframes float{0%,100%{transform:translateY(6px) rotate(-1deg)}50%{transform:translateY(-6px) rotate(1deg)}}
@keyframes glitch-shift{0%,71.9%,74%,100%{transform:none}72%{transform:translateX(-1px)}72.5%{transform:translateX(2px)}73%{transform:translateX(-2px)}73.5%{transform:none}}
@keyframes glitch-top{0%,71.9%,74%,100%{opacity:0;transform:none;clip-path:inset(0 0 65% 0)}72%,73%{opacity:.8;transform:translate(3px,-1px);clip-path:inset(15% 0 55% 0)}72.5%,73.5%{opacity:.65;transform:translate(-3px,1px);clip-path:inset(55% 0 20% 0)}}
@keyframes glitch-bottom{0%,71.9%,74%,100%{opacity:0;transform:none;clip-path:inset(65% 0 0 0)}72%,73%{opacity:.75;transform:translate(-3px,1px);clip-path:inset(65% 0 5% 0)}72.5%,73.5%{opacity:.6;transform:translate(2px,-1px);clip-path:inset(30% 0 50% 0)}}
@media(prefers-reduced-motion:reduce){.logo,h1,h1:before,h1:after{animation:none}h1:before,h1:after{display:none}}