:root{
  --navy:#1b2238;--slate:#4a6890;--lav:#b9a7d6;--peach:#f4b183;
  --pink:#ef6f8a;--straw:#f2d04b;--cream:#f3ecdc;--deep:#0f1424;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--deep);color:var(--cream);font-family:'IBM Plex Mono',monospace;overflow-x:hidden}
.vt{font-family:'VT323',monospace;letter-spacing:.04em}
.glow{text-shadow:0 0 6px rgba(244,177,131,.6),0 0 18px rgba(239,111,138,.25)}
.rgb{text-shadow:-2px 0 rgba(239,111,138,.75),2px 0 rgba(120,190,255,.6),0 0 14px rgba(244,177,131,.5)}
.bgphoto{position:fixed;inset:0;background-size:cover;background-position:center;opacity:.18;filter:blur(3px) saturate(1.2);z-index:0}
.screen{position:relative;z-index:1;min-height:100vh;
  background:radial-gradient(ellipse at 50% 20%,rgba(74,104,144,.45),transparent 60%),
             linear-gradient(180deg,rgba(27,34,56,.92),rgba(15,20,36,.96) 70%,rgba(244,177,131,.08));}
.scan{pointer-events:none;position:fixed;inset:0;z-index:50;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px)}
@media(max-width:640px){.scan{background:repeating-linear-gradient(0deg,rgba(0,0,0,.2) 0 1px,transparent 1px 2px)}}
.vign{pointer-events:none;position:fixed;inset:0;z-index:51;border-radius:28px;
  box-shadow:inset 0 0 120px 30px rgba(0,0,0,.75),inset 0 0 0 10px #05070d}
.noise{pointer-events:none;position:fixed;inset:0;z-index:49;opacity:.045;width:100%;height:100%}
.flicker{animation:flick 6s infinite}
@keyframes flick{0%,100%{opacity:1}48%{opacity:1}50%{opacity:.94}52%{opacity:1}}
.track{pointer-events:none;position:fixed;left:0;right:0;height:60px;z-index:52;
  background:linear-gradient(180deg,transparent,rgba(243,236,220,.07),rgba(239,111,138,.06),transparent);
  animation:roll 20s linear infinite;mix-blend-mode:screen}
@keyframes roll{0%{top:-80px}12%{top:110%}100%{top:110%}}
.still .track,.still .flicker,.still .noise{animation:none!important;display:none}
.blink{animation:bl 1.2s steps(2) infinite}
@keyframes bl{50%{opacity:0}}
.panel{background:rgba(15,20,36,.72);border:1px solid rgba(185,167,214,.25);border-radius:6px;
  box-shadow:0 0 0 1px rgba(0,0,0,.5),0 0 30px rgba(74,104,144,.15) inset;backdrop-filter:blur(2px)}
.btn{font-family:'VT323',monospace;font-size:20px;letter-spacing:.06em;padding:6px 14px;border-radius:4px;
  background:linear-gradient(180deg,#2a3352,#161c2f);color:var(--cream);border:1px solid #3a4568;
  box-shadow:0 3px 0 #05070d,inset 0 1px 0 rgba(255,255,255,.08);transition:transform .08s}
.btn:active,.btn.on{transform:translateY(2px);box-shadow:0 1px 0 #05070d}
.btn.on{color:var(--peach);border-color:var(--peach);text-shadow:0 0 8px var(--peach)}
.btn.pink{color:var(--pink);border-color:var(--pink)}
.led{width:10px;height:10px;border-radius:50%;display:inline-block}
.led.g{background:#7dff9b;box-shadow:0 0 10px #7dff9b}
.led.a{background:#ffb347;box-shadow:0 0 10px #ffb347}
input[type=range]{accent-color:var(--peach);width:100%}
.field{background:#0c1020;border:1px solid #33405f;color:var(--cream);padding:8px 10px;border-radius:4px;width:100%;font-family:inherit}
.field:focus{outline:none;border-color:var(--lav);box-shadow:0 0 8px rgba(185,167,214,.4)}
.label-sticker{background:var(--cream);color:#2b2230;font-family:'VT323',monospace;padding:6px 10px;border-radius:2px;
  box-shadow:2px 2px 0 rgba(0,0,0,.4);transform:rotate(-1.5deg)}
.static{background:repeating-radial-gradient(circle at 30% 40%,#999 0 1px,#222 1px 2px);animation:st .15s steps(3) infinite;opacity:.7}
@keyframes st{0%{background-position:0 0}50%{background-position:7px 3px}100%{background-position:-4px 9px}}
.breath{border-radius:50%;transition:transform linear,box-shadow linear;
  background:radial-gradient(circle,rgba(244,177,131,.85),rgba(239,111,138,.4) 60%,transparent 72%)}
.cassette{animation:slide .9s ease-out}
@keyframes slide{0%{transform:translateX(-120%) rotate(-8deg);opacity:0}100%{transform:none;opacity:1}}
.confetti{position:fixed;top:-20px;width:8px;height:18px;z-index:60;border-radius:2px;animation:fall linear forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}
.bsod{position:fixed;inset:0;z-index:70;background:#1d3fb8;display:flex;align-items:center;justify-content:center;flex-direction:column}
.saver{position:fixed;inset:0;z-index:65;background:#000}
.sec-in{animation:secin .6s ease-out both}
@keyframes secin{from{opacity:0;transform:translateY(10px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
a{color:var(--lav)}