:root{--bg:#0d1117;--panel:#151b24;--line:#263041;--blue:#0057B7;--yellow:#FFD700;--red:#E53935;--warn:#FDD835;--green:#43A047;--gray:#616161;--text:#e8edf3;--muted:#8b98a9}
body{margin:0;background:radial-gradient(1200px 600px at 10% -10%,rgba(0,87,183,.25),transparent),radial-gradient(900px 500px at 110% 110%,rgba(255,215,0,.08),transparent),var(--bg);color:var(--text);font-family:'IBM Plex Mono',monospace;min-height:100vh}
.hc{--text:#fff;--muted:#ddd;--panel:#000;--line:#fff}
.disp{font-family:'Unbounded',sans-serif}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px}
.btn{border:1px solid var(--line);background:#1b2330;padding:.45rem .8rem;border-radius:10px;font-size:.8rem;transition:.15s}
.btn:hover{border-color:var(--yellow)}
.btn.on{background:var(--blue);border-color:var(--blue)}
.tile{cursor:pointer;transition:transform .15s,filter .15s;stroke:#0d1117;stroke-width:3}
.tile:hover,.tile:focus{filter:brightness(1.25);outline:none;stroke:#fff}
.tile.sel{stroke:var(--yellow);stroke-width:4}
.st-red{fill:var(--red)}.st-yellow{fill:var(--warn)}.st-green{fill:var(--green)}.st-gray{fill:var(--gray)}
.pulse{animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{50%{opacity:.6}}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.rise{animation:rise .5s both}
@keyframes rise{from{opacity:0;transform:translateY(8px)}}
.reduced *{animation:none!important;transition:none!important}
.spin{animation:spin .8s linear}
@keyframes spin{to{transform:rotate(360deg)}}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-thumb{background:#334}