:root{--beige:#d9cfb4;--beige2:#c4b994;--dark:#2a2720;--green:#4dff7a;--amber:#ffb020}
*{box-sizing:border-box}
body{margin:0;background:#3b372e repeating-linear-gradient(45deg,#3b372e 0 6px,#383429 6px 12px);font-family:'IBM Plex Mono',monospace;color:var(--dark);min-height:100vh}
.case{max-width:1200px;margin:0 auto;padding:16px}
.panel{background:linear-gradient(#e6dcc2,var(--beige2));border-radius:14px 14px 4px 4px;padding:16px 20px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;box-shadow:inset 0 2px 0 #fff8,0 6px 0 #8a7f60,0 10px 20px #0008}
h1{font-family:'VT323',monospace;font-size:52px;margin:0;line-height:.9;letter-spacing:2px;color:#3a3326;text-shadow:0 1px 0 #fff8}
.sub{font-size:11px;letter-spacing:1px;opacity:.7}
.leds{display:flex;gap:10px;flex-wrap:wrap}
.led{display:flex;flex-direction:column;align-items:center;font-size:10px;font-weight:700;gap:3px}
.led i{width:12px;height:12px;border-radius:50%;background:#4a1a10;box-shadow:inset 0 -2px 3px #0006}
.led.on i{background:#ff4a2a;box-shadow:0 0 8px #ff4a2a,0 0 2px #fff inset}
.grid{display:grid;grid-template-columns:320px 1fr;gap:16px;margin-top:18px}
@media(max-width:820px){.grid{grid-template-columns:1fr}h1{font-size:38px}}
.card{background:var(--beige);border-radius:8px;padding:14px;margin-bottom:14px;box-shadow:0 4px 0 #8a7f60}
.lbl{font-size:11px;font-weight:700;letter-spacing:1px;display:block;margin:8px 0 4px}
.field{width:100%;padding:8px;font-family:'VT323';font-size:20px;background:#1d2a1d;color:var(--green);border:2px inset #888;border-radius:4px}
.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.keypad button{padding:12px 0;font-family:'VT323';font-size:26px;background:#efe8d4;border:none;border-radius:6px;box-shadow:0 3px 0 #8a7f60;cursor:pointer}
.keypad button:active{transform:translateY(3px);box-shadow:none}
.row{display:flex;gap:8px;align-items:center}.wrap{flex-wrap:wrap;margin-top:10px}
button{font-family:'IBM Plex Mono';cursor:pointer}
.big{flex:1;padding:12px;font-weight:700;font-size:16px;background:#3a6b3a;color:#fff;border:none;border-radius:6px;box-shadow:0 3px 0 #1f3a1f}
.red{background:#8b2b1e;color:#fff;box-shadow:0 3px 0 #4a150d}
.small{padding:8px 10px;font-size:12px;border:none;border-radius:5px;background:#efe8d4;box-shadow:0 2px 0 #8a7f60}
.small.red{background:#8b2b1e;color:#fff}.small.active{background:var(--amber)}
.toggle{flex:1;padding:6px;font-size:12px;font-weight:700;background:#2a2720;color:var(--amber);border:none;border-radius:4px}
.chk{font-size:12px;display:flex;gap:6px;align-items:center;margin-top:10px}
input[type=range]{width:100%;accent-color:#3a6b3a}
.warn{color:#8b2b1e;font-weight:400}
.stats{font-size:11px;margin-top:10px;line-height:1.5}
.crt{background:#0a120a;border-radius:18px;padding:14px;box-shadow:inset 0 0 40px #000,0 0 0 10px #2a2720,0 0 0 12px #8a7f60;position:relative;overflow:hidden}
.crt::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(transparent 0 2px,#0004 2px 3px);border-radius:18px;box-shadow:inset 0 0 60px #0f0a}
#term{font-family:'VT323';font-size:20px;color:var(--green);text-shadow:0 0 6px #4dff7a99;height:300px;overflow-y:auto;margin:0;white-space:pre-wrap;word-break:break-word}
.inrow{display:flex;gap:6px;align-items:center;border-top:1px solid #1f4a1f;padding-top:8px;position:relative;z-index:2}
.prompt{color:var(--green);font-family:'VT323';font-size:22px}
.tin{flex:1;background:transparent;border:none;outline:none;color:var(--green);font-family:'VT323';font-size:20px;min-width:0}
.txb{background:var(--green);color:#0a120a;border:none;padding:6px 12px;font-weight:700;border-radius:3px}
.viz{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.viz .full{grid-column:1/-1}
@media(max-width:600px){.viz{grid-template-columns:1fr}}
.viz canvas{width:100%;height:150px;background:#0a120a;border-radius:6px;display:block;border:3px solid #2a2720}
.full canvas{height:90px}
.vlbl{font-size:10px;letter-spacing:1px;color:var(--beige);margin-bottom:3px}
.k{margin-left:8px;padding:0 4px;border-radius:2px;color:#000}.k.s{background:#ff5a5a}.k.d{background:#4dff7a}.k.p{background:#ffb020}
footer{text-align:center;color:var(--beige);font-size:12px;padding:20px}
footer a{color:var(--amber)}