:root{--bg:#0a0a0a;--ph:#33ff66;--red:#ff2a2a;--txt:#e8e4d8;--dim:#1f2a22}
html,body{background:var(--bg);color:var(--txt);font-family:'IBM Plex Mono',monospace;margin:0}
body{background:radial-gradient(ellipse at top,#0f1a12 0%,#0a0a0a 60%)}
.vt{font-family:'VT323',monospace}
.crt-overlay{pointer-events:none;position:fixed;inset:0;z-index:50;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);animation:flick 4s infinite}
.reduce .crt-overlay,.reduce-motion .crt-overlay{animation:none}
body.darker #root{filter:brightness(.88)}
@keyframes flick{0%,100%{opacity:.9}50%{opacity:.75}52%{opacity:1}54%{opacity:.8}}
.logo{text-shadow:2px 0 var(--red),-2px 0 #3af,0 0 12px rgba(51,255,102,.5);color:var(--ph);animation:jit 3s infinite}
@keyframes jit{0%,92%,100%{transform:none}93%{transform:translateX(2px) skewX(4deg)}95%{transform:translateX(-3px)}}
.blink{animation:bl 1s steps(2) infinite}@keyframes bl{50%{opacity:0}}
.panel{border:1px solid var(--dim);background:rgba(10,14,11,.85)}
.btn{border:1px solid var(--ph);color:var(--ph);padding:.35rem .7rem;font-family:'VT323';font-size:1.15rem;letter-spacing:.05em;transition:.1s;background:transparent}
.btn:hover{background:var(--ph);color:#000}
.btn-red{border-color:var(--red);color:var(--red)}.btn-red:hover{background:var(--red);color:#000}
.static-bg{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");animation:st .2s steps(3) infinite}
@keyframes st{0%{background-position:0 0}33%{background-position:-40px 20px}66%{background-position:30px -50px}}
.crt{border-radius:28px;padding:18px;background:linear-gradient(145deg,#2a2621,#14120f);box-shadow:inset 0 0 0 2px #3a342c,0 20px 50px #000}
.crt canvas{border-radius:18px;box-shadow:0 0 40px rgba(51,255,102,.12) inset;background:#000;width:100%;display:block}
.knob{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#777,#222);border:1px solid #000}
input[type=range]{-webkit-appearance:none;width:100%;height:6px;background:#111;border:1px solid #2a3a2e}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:18px;background:var(--txt);border:1px solid #000;cursor:pointer}
input[type=range]::-moz-range-thumb{width:12px;height:18px;background:var(--txt);border-radius:0}
input[type=text],select{background:#050805;border:1px solid #2a3a2e;color:var(--ph);font-family:'IBM Plex Mono';font-size:.8rem;padding:.2rem .4rem;width:100%}
.preset{border:1px solid var(--dim);cursor:pointer;transition:.1s}
.preset:hover{border-color:var(--ph);transform:translateY(-1px)}
.egg{position:fixed;inset:0;z-index:99;background:#000;color:var(--red);display:flex;align-items:center;justify-content:center;font-family:VT323;font-size:10vw;text-align:center}
.tape{height:14px;background:repeating-linear-gradient(90deg,#33ff66 0 8px,#0a0a0a 8px 12px)}