@font-face{font-family:Inter;src:url('/assets/inter.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
:root{color-scheme:light;font-family:Inter,Arial,sans-serif;color:#060a10;background:#fff}
*{box-sizing:border-box}
body{margin:0}
#network{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.page{position:relative;z-index:1;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:32px 20px}
.content{width:max-content;max-width:100%;display:flex;flex-direction:column;align-items:center;text-align:center}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.logo-frame{position:relative;isolation:isolate;width:min(760px,86vw);animation:entrance .9s ease-out both}
.logo-frame::before{content:"";position:absolute;z-index:-1;inset:8% 4%;border-radius:50%;background:radial-gradient(ellipse,rgba(206,252,4,.28),rgba(206,252,4,.09) 40%,transparent 72%);pointer-events:none;animation:breathe 7s ease-in-out infinite}
.logo{display:block;width:100%;height:auto}
.message{margin-top:clamp(26px,4vh,42px);max-width:630px;animation:entrance .9s .12s ease-out both}
.headline{font-size:clamp(1.25rem,2.2vw,1.8rem);font-weight:700;letter-spacing:-.045em;line-height:1.2;margin:0}
.progress{position:relative;width:160px;height:4px;margin:15px auto 0;background:#e2e7e9;border-radius:3px;overflow:hidden}
.progress span{position:absolute;inset:0 auto 0 0;width:42%;background:#a8e000;border-bottom:1px solid #648900;border-radius:3px;animation:progress 2.5s ease-in-out infinite}
.description{font-size:clamp(.9rem,1.3vw,1rem);line-height:1.6;color:#343d46;margin:12px 0 0}
.terminal{text-align:left;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.75rem;letter-spacing:.03em;color:#343d46;margin:28px 0 0;min-height:2.5em;min-width:230px;padding:8px 13px;border:1px solid #d9dfe1;border-radius:8px;background:rgba(255,255,255,.82)}
.prompt{color:#060a10;font-weight:700}.cursor{display:inline-block;width:7px;height:1em;margin-left:4px;vertical-align:-.16em;background:#060a10;animation:blink 1s steps(2,start) infinite}
.languages{display:none;gap:6px;margin-top:30px}.js .languages{display:flex}
.languages button{font:600 .72rem Inter,Arial,sans-serif;letter-spacing:.08em;color:#060a10;background:transparent;border:0;border-bottom:2px solid transparent;padding:9px 10px;cursor:pointer}
.languages button[aria-pressed=true]{border-bottom-color:#060a10}.languages button:focus-visible{outline:2px solid #060a10;outline-offset:3px}
@keyframes blink{to{visibility:hidden}}
@keyframes entrance{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes breathe{0%,100%{opacity:.65;transform:scale(.94)}50%{opacity:1;transform:scale(1.08)}}
@keyframes progress{0%{transform:translateX(-105%)}100%{transform:translateX(345%)}}
.paused *, .paused *::before{animation-play-state:paused!important}
@media(max-height:500px){.page{padding-block:24px}.logo-frame{width:min(480px,70vw)}.message{margin-top:18px}.terminal{margin-top:16px}.languages{margin-top:14px}}
@media(prefers-reduced-motion:reduce){.logo-frame,.logo-frame::before,.message,.progress span,.cursor{animation:none}}