:root{
  --bg:#020403;
  --panel:rgba(0,18,10,.72);
  --panel-border:rgba(80,255,150,.28);
  --text:#d7ffe3;
  --muted:rgba(215,255,227,.66);
  --accent:#00ff66;
  --accent2:#8affb6;
  --danger:#ff3355;
  --shadow:0 0 30px rgba(0,255,100,.28);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:#000;color:var(--text);font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,monospace;overflow:hidden}
body.landing{overflow:auto;background:radial-gradient(circle at 70% 20%,rgba(0,255,125,.18),transparent 32%),radial-gradient(circle at 15% 78%,rgba(0,140,255,.12),transparent 26%),#020403;min-height:100%}
.landing-wrap{max-width:1100px;margin:0 auto;padding:70px 24px 60px}.brand-kicker{letter-spacing:.28em;color:var(--accent);font-size:13px;text-shadow:var(--shadow)}
h1{font-size:clamp(42px,9vw,112px);line-height:.9;margin:16px 0 24px;text-transform:uppercase;letter-spacing:-.06em;text-shadow:0 0 28px rgba(0,255,100,.35)}
.lead{max-width:850px;color:var(--muted);font-size:18px;line-height:1.65}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:42px}.mode-card{text-decoration:none;color:var(--text);border:1px solid var(--panel-border);background:linear-gradient(180deg,rgba(0,35,16,.82),rgba(0,10,6,.78));padding:26px;border-radius:22px;min-height:230px;position:relative;overflow:hidden;box-shadow:0 20px 80px rgba(0,0,0,.42)}.mode-card:before{content:"";position:absolute;inset:-60px;background:repeating-linear-gradient(90deg,rgba(0,255,100,.08) 0 1px,transparent 1px 19px);opacity:.5;transform:rotate(-7deg)}.mode-card>*{position:relative}.mode-card:hover{border-color:rgba(0,255,100,.75);box-shadow:0 0 40px rgba(0,255,100,.2)}.card-tag{color:#000;background:var(--accent);padding:5px 8px;border-radius:999px;font-weight:900}h2{margin:28px 0 10px;font-size:28px}.mode-card p{color:var(--muted);line-height:1.55}
@media(max-width:760px){.cards{grid-template-columns:1fr}}
canvas#screen{position:fixed;inset:0;width:100vw;height:100vh;display:block;background:#000}.vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at center,transparent 44%,rgba(0,0,0,.58) 100%);mix-blend-mode:multiply}.scanlines{position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(255,255,255,.045) 0 1px,transparent 1px 4px);opacity:.18}.noise{position:fixed;inset:0;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='170' height='170' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}.hud{position:fixed;top:18px;left:18px;right:18px;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;pointer-events:none}.title-block{pointer-events:auto;min-width:260px;max-width:560px;border:1px solid var(--panel-border);background:linear-gradient(180deg,rgba(0,25,12,.78),rgba(0,8,5,.62));border-radius:14px;padding:14px 16px;box-shadow:var(--shadow)}.title-block .kicker{font-size:11px;letter-spacing:.24em;color:var(--accent2);opacity:.9}.title-block .main-title{margin-top:6px;font-size:24px;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.title-block .sub{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.45}.stats{pointer-events:auto;display:grid;grid-template-columns:repeat(2,auto);gap:8px;min-width:230px}.stat{border:1px solid var(--panel-border);background:rgba(0,13,7,.66);border-radius:12px;padding:10px 12px;text-align:right}.stat span{display:block;color:var(--muted);font-size:10px;letter-spacing:.16em}.stat strong{display:block;color:var(--accent);font-size:18px;margin-top:2px;text-shadow:var(--shadow)}.controls{position:fixed;left:18px;bottom:18px;right:18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;pointer-events:auto;border:1px solid var(--panel-border);background:linear-gradient(180deg,rgba(0,18,10,.76),rgba(0,5,3,.72));padding:12px;border-radius:18px;box-shadow:var(--shadow)}button,.control{height:38px;border:1px solid rgba(110,255,170,.32);background:rgba(0,0,0,.42);color:var(--text);border-radius:10px;padding:0 12px;font-family:inherit;font-weight:700;letter-spacing:.03em;cursor:pointer}button:hover{border-color:var(--accent);box-shadow:0 0 18px rgba(0,255,100,.18)}.control{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}input[type="range"]{accent-color:var(--accent);width:110px}.terminal-strip{position:fixed;right:18px;top:138px;width:min(420px,calc(100vw - 36px));max-height:calc(100vh - 240px);overflow:hidden;border:1px solid var(--panel-border);background:rgba(0,10,6,.5);border-radius:14px;padding:12px;pointer-events:none;box-shadow:0 0 28px rgba(0,255,100,.08)}.terminal-line{font-size:12px;line-height:1.55;color:rgba(210,255,225,.7);white-space:nowrap;text-shadow:0 0 8px rgba(0,255,100,.22)}.terminal-line.ok{color:rgba(120,255,165,.95)}.terminal-line.warn{color:rgba(255,215,105,.92)}.terminal-line.bad{color:rgba(255,90,115,.92)}.center-flash{position:fixed;inset:0;display:grid;place-items:center;pointer-events:none;opacity:0;transform:scale(1.08);transition:.28s ease}.center-flash.active{opacity:1;transform:scale(1)}.flash-box{font-size:clamp(34px,7vw,96px);font-weight:1000;letter-spacing:.08em;text-transform:uppercase;padding:18px 30px;border:2px solid var(--accent);background:rgba(0,0,0,.62);text-shadow:0 0 24px var(--accent);box-shadow:0 0 80px rgba(0,255,100,.4);border-radius:14px}.glitch{animation:glitch .55s steps(2,end) infinite}@keyframes glitch{0%,100%{filter:none;transform:translate(0)}25%{filter:hue-rotate(45deg);transform:translate(2px,-1px)}50%{filter:hue-rotate(-30deg);transform:translate(-2px,1px)}75%{filter:contrast(1.5);transform:translate(1px,2px)}}@media(max-width:820px){.hud{display:block}.stats{margin-top:10px}.terminal-strip{display:none}.controls{max-height:42vh;overflow:auto}.title-block{max-width:none}.stat{text-align:left}}

/* v2 performance + clean fullscreen */
.clean-fullscreen .controls,
.clean-fullscreen .hud,
.clean-fullscreen .terminal-strip,
.clean-fullscreen .noise{
  display:none !important;
}

.clean-fullscreen canvas#screen{
  cursor:none;
}

@media (prefers-reduced-motion: reduce){
  .scanlines,.noise,.vignette{display:none!important}
  .glitch{animation:none!important}
}