:root{--green:#b8e5ce;--dim:#719b89;--red:#a80f18;--black:#010303;--white:#d9e2dd}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#000;color:var(--white);font-family:"Courier New",Courier,monospace;overflow:hidden}body{min-height:100dvh;background:radial-gradient(circle at center,#0a1412 0,#030706 42%,#000 78%)}
#app,.screen{width:100%;height:100dvh}.screen{display:none;position:absolute;inset:0;align-items:center;justify-content:center;padding:24px}.screen.active{display:flex;animation:boot .45s steps(2)}
.crt-shell{width:min(860px,92vw);text-align:center;padding:clamp(28px,6vw,68px) clamp(18px,6vw,60px);border:1px solid rgba(184,229,206,.17);background:rgba(0,7,6,.42);box-shadow:0 0 80px rgba(68,140,111,.06),inset 0 0 60px rgba(0,0,0,.8);position:relative}.narrow{width:min(720px,92vw)}
.status{font-size:11px;letter-spacing:.28em;color:var(--dim);margin-bottom:34px}.glitch,h1,h2{text-transform:uppercase;letter-spacing:.09em;text-shadow:2px 0 rgba(168,15,24,.55),-2px 0 rgba(80,180,170,.35)}h1{font-size:clamp(31px,7vw,68px);margin:0 0 18px}.big{font-size:clamp(32px,7vw,64px);margin:0 0 30px}h2{font-size:clamp(27px,5vw,48px);line-height:1.25}
.warning{letter-spacing:.18em;color:#b7c7c0;font-size:clamp(12px,2vw,16px)}.small{font-size:clamp(13px,2vw,17px);line-height:1.8;color:#9cafA7}.micro{margin-top:28px;font-size:9px;letter-spacing:.15em;color:#50645b}.rule{height:1px;background:linear-gradient(90deg,transparent,#6c8b7d,transparent);margin:30px 0}
.terminal-btn{margin-top:28px;padding:15px 42px;background:transparent;color:var(--green);border:1px solid #759c8a;font:700 15px "Courier New",monospace;letter-spacing:.22em;cursor:pointer;box-shadow:inset 0 0 16px rgba(77,146,116,.08)}.terminal-btn:hover,.terminal-btn:focus{background:#b8e5ce;color:#06100c;outline:none}.hidden{visibility:hidden}
#videoScreen{background:#000;padding:0}#introVideo{width:100%;height:100%;object-fit:contain;background:#000}.skip{position:absolute;right:18px;bottom:max(18px,env(safe-area-inset-bottom));background:rgba(0,0,0,.5);border:0;color:#6f7b76;font:10px "Courier New";letter-spacing:.13em;padding:10px;cursor:pointer}
.type{min-height:110px;white-space:pre-line;font-size:clamp(15px,2.4vw,20px);line-height:1.8;color:#b8c9c1}.pulse{margin-top:38px;color:#7a1a20;animation:pulse 1.1s infinite}
.noise,.scanlines,.vignette{position:fixed;inset:0;pointer-events:none;z-index:50}.noise{opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");animation:noise .22s steps(2) infinite}.scanlines{opacity:.14;background:repeating-linear-gradient(to bottom,transparent 0,transparent 2px,rgba(120,190,165,.13) 3px,transparent 4px)}.vignette{box-shadow:inset 0 0 180px 55px #000}
@keyframes boot{0%{opacity:0;filter:brightness(5) blur(2px)}45%{opacity:.4}100%{opacity:1;filter:none}}@keyframes noise{0%{transform:translate(0)}25%{transform:translate(-1%,1%)}50%{transform:translate(1%,-1%)}75%{transform:translate(.5%,1%)}}@keyframes pulse{50%{opacity:.18}}
@media(max-width:600px){.screen{padding:14px}.crt-shell{padding:34px 18px}.vignette{box-shadow:inset 0 0 90px 22px #000}.skip{font-size:9px}}