:root{color-scheme:dark;--bg: #05070c;--green: #00ff88;--red: #ff4466;--blue: #00aaff;--dim-green: #00ff8844;--dim-red: #ff446644;--dim-blue: #00aaff44;--cell-bg: #0d1117;--border: #1a2233;--font-header: "Orbitron", sans-serif;--font-mono: "Share Tech Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:var(--bg);color:var(--green);font-family:var(--font-mono)}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px)}.header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--border);background:#080b12}.header-title{font-family:var(--font-header);font-size:1.4rem;font-weight:900;letter-spacing:.05em}.header-title .red{color:var(--red)}.header-title .green{color:var(--green)}.header-sub{font-size:.65rem;color:#556;margin-top:2px}.header-stats{display:flex;gap:24px;font-size:.8rem}.stat-label{color:#556;font-size:.65rem}.stat-val{color:var(--green);font-size:1rem}.socials{display:flex;gap:12px;align-items:center}.socials a{color:#556;font-size:1.2rem;text-decoration:none;transition:color .2s}.socials a.twitter:hover{color:#1d9bf0}.socials a.github:hover{color:#fff}.mission-bar{padding:8px 20px;font-size:.75rem;color:#556;border-bottom:1px solid var(--border);background:#060910}.mission-bar span{color:var(--green)}.timer-wrap{height:4px;background:#111}.timer-bar{height:100%;background:var(--green);transition:width .3s linear,background .3s}.timer-bar.yellow{background:#fc0}.timer-bar.red{background:var(--red)}.main-area{display:flex;gap:20px;padding:16px 20px;min-height:420px}.grid-container{flex-shrink:0}.grid{display:grid;gap:2px;border:1px solid var(--border);background:var(--border)}.cell{width:52px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--cell-bg);font-size:.85rem;cursor:pointer;transition:background .15s,color .15s;-webkit-user-select:none;user-select:none;color:#445;font-family:var(--font-mono)}.cell:hover{background:#151d2a}.cell.row-highlight{background:#ff44661f;color:var(--red)}.cell.col-highlight{background:#00ff881a;color:var(--green)}.cell.selected{background:var(--dim-green);color:var(--green);font-weight:700}.cell.matched{background:var(--dim-blue);color:var(--blue)}.cell.disabled{opacity:.3;pointer-events:none}.side-panel{flex:1;min-width:260px;display:flex;flex-direction:column;gap:12px}.panel-box{border:1px solid var(--border);background:#080b12;padding:12px}.panel-label{font-family:var(--font-header);font-size:.65rem;color:#556;letter-spacing:.15em;text-transform:uppercase;margin-bottom:8px}.sequence{display:flex;gap:6px;margin-bottom:6px;align-items:center}.seq-code{font-size:.8rem;padding:2px 6px;border:1px solid var(--border);color:#445;background:var(--cell-bg)}.seq-code.matched{color:var(--blue);border-color:var(--blue);background:var(--dim-blue)}.seq-reward{font-size:.65rem;color:#556;margin-left:auto}.seq-check{color:var(--blue);font-size:.8rem}.buffer-slots{display:flex;gap:4px;flex-wrap:wrap}.buf-slot{width:36px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);font-size:.75rem;color:#445;background:var(--cell-bg)}.buf-slot.filled{color:var(--green);border-color:var(--green)}.buf-slot.seq-match{color:var(--blue);border-color:var(--blue);background:var(--dim-blue)}.log-lines{font-size:.7rem;color:#556;line-height:1.6}.log-lines .log-green{color:var(--green)}.log-lines .log-red{color:var(--red)}.log-lines .log-blue{color:var(--blue)}.bottom-bar{display:flex;gap:12px;padding:12px 20px;border-top:1px solid var(--border);background:#060910}.btn{font-family:var(--font-header);font-size:.7rem;letter-spacing:.1em;padding:8px 20px;border:1px solid var(--border);background:transparent;color:#556;cursor:pointer;transition:all .2s;text-transform:uppercase}.btn:hover{border-color:var(--green);color:var(--green)}.btn:disabled{opacity:.3;cursor:default;border-color:var(--border);color:#333}.btn.primary{border-color:var(--green);color:var(--green);background:#00ff8814}.btn.primary:hover{background:#00ff882e}.btn.danger{border-color:var(--red);color:var(--red)}.overlay-bg{position:fixed;top:0;right:0;bottom:0;left:0;background:#05070ceb;display:flex;align-items:center;justify-content:center;z-index:100}.overlay-box{border:1px solid var(--border);background:#080b12;padding:40px 48px;text-align:center;max-width:480px;width:90%}.overlay-box h1{font-family:var(--font-header);font-size:1.8rem;font-weight:900;margin-bottom:8px}.overlay-box h2{font-family:var(--font-header);font-size:1.1rem;font-weight:700;margin-bottom:12px;color:var(--green)}.overlay-box p{font-size:.8rem;color:#556;margin-bottom:6px;line-height:1.6}.overlay-box .score-display{font-family:var(--font-header);font-size:2rem;color:var(--green);margin:12px 0}.overlay-box .bonus-note{color:var(--blue);font-size:.8rem;margin-bottom:16px}.overlay-box .fail-text{color:var(--red)}.overlay-btns{display:flex;gap:12px;justify-content:center;margin-top:20px;flex-wrap:wrap}.overlay-socials{margin-top:20px;display:flex;gap:16px;justify-content:center}.overlay-socials a{color:#556;font-size:1.4rem;text-decoration:none;transition:color .2s}.overlay-socials a.twitter:hover{color:#1d9bf0}.overlay-socials a.github:hover{color:#fff}.howto-steps{text-align:left;margin:16px 0}.howto-steps li{font-size:.75rem;color:#778;margin-bottom:8px;line-height:1.5}.howto-steps li strong{color:var(--green)}