*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #0a0e17;--bg-panel: #111827;--bg-cell: #1a2332;--border: #1e3a5f;--neon-cyan: #00e5ff;--neon-magenta: #ff00e5;--neon-green: #39ff14;--neon-yellow: #ffe600;--neon-red: #ff3b3b;--neon-orange: #ff8c00;--text-primary: #e0e7ef;--text-dim: #6b7b8d;--glow-cyan: 0 0 8px rgba(0, 229, 255, .6), 0 0 20px rgba(0, 229, 255, .3);--glow-magenta: 0 0 8px rgba(255, 0, 229, .6), 0 0 20px rgba(255, 0, 229, .3);--glow-green: 0 0 8px rgba(57, 255, 20, .6), 0 0 20px rgba(57, 255, 20, .3);--glow-red: 0 0 8px rgba(255, 59, 59, .6), 0 0 20px rgba(255, 59, 59, .3);--cell-size: 64px;--door-size: 32px;--gap: 2px}body{font-family:SF Mono,Fira Code,Cascadia Code,monospace;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#app{width:100%;max-width:600px;padding:12px 16px;display:flex;flex-direction:column;align-items:center;gap:10px}.toolbar{position:relative;display:flex;align-items:center;justify-content:flex-end;width:100%;gap:8px}.toolbar-info{position:absolute;left:0;right:0;text-align:center;font-size:.7rem;color:var(--text-dim);font-variant-numeric:tabular-nums;pointer-events:none}.toolbar-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text-dim);font-family:inherit;font-size:1rem;cursor:pointer;transition:border-color .15s,color .15s;touch-action:manipulation;display:flex;align-items:center;justify-content:center}@media(hover:hover){.toolbar-btn:hover{border-color:var(--neon-cyan);color:var(--neon-cyan)}}.kebab-menu{position:fixed;z-index:50;background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:12px;min-width:240px;display:flex;flex-direction:column;gap:8px}.kebab-label{font-size:.7rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em}.kebab-sizes{display:flex;gap:6px}.kebab-size-btn{flex:1;min-width:0;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:6px 4px;border:1px solid var(--border);border-radius:4px;background:var(--bg-cell);color:var(--text-primary);font-family:inherit;font-size:.75rem;cursor:pointer;transition:border-color .15s,color .15s}.kebab-grid-2x2{display:grid;grid-template-columns:1fr 1fr}@media(hover:hover){.kebab-size-btn:hover{border-color:var(--neon-cyan);color:var(--neon-cyan)}}.kebab-size-btn.btn-current{border-color:var(--neon-cyan);color:var(--neon-cyan)}.kebab-sep{border-top:1px solid var(--border)}.kebab-toggle{display:flex;align-items:center;gap:8px;font-size:.7rem;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none}.kebab-toggle input[type=checkbox]{accent-color:var(--neon-cyan);width:14px;height:14px;cursor:pointer}.board-wrapper{position:relative;display:flex;justify-content:center}.board-container{position:relative}.grid{display:grid;gap:var(--gap)}.cell{width:var(--cell-size);height:var(--cell-size);background:var(--bg-cell);border:1px solid var(--border);position:relative;display:flex;align-items:center;justify-content:center}.cell.guess-mode{cursor:pointer;touch-action:manipulation;transition:border-color .15s}@media(hover:hover){.cell.guess-mode:hover{border-color:var(--neon-cyan)}}body[data-empty-style=dot] .empty-mark:after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--text-dim);opacity:.7;top:50%;left:50%;transform:translate(-50%,-50%)}body[data-empty-style=border] .empty-mark{border-color:var(--text-dim)!important;box-shadow:inset 0 0 4px #6b7b8d4d}body[data-empty-style=tint] .empty-mark{background:#6b7b8d59!important}body[data-empty-style=cropmarks] .empty-mark:before,body[data-empty-style=cropmarks] .empty-mark:after{content:"";position:absolute;width:20%;height:20%;pointer-events:none}body[data-empty-style=cropmarks] .empty-mark:before{top:3px;left:3px;border-top:1px solid var(--text-dim);border-left:1px solid var(--text-dim)}body[data-empty-style=cropmarks] .empty-mark:after{bottom:3px;right:3px;border-bottom:1px solid var(--text-dim);border-right:1px solid var(--text-dim)}.mirror-line{position:absolute;pointer-events:none}.mirror-line.forward{border-bottom:2px solid var(--neon-magenta);transform:rotate(-45deg);transform-origin:center;width:113%;height:0;top:50%;left:-6.5%}.mirror-line.backward{border-bottom:2px solid var(--neon-magenta);transform:rotate(45deg);transform-origin:center;width:113%;height:0;top:50%;left:-6.5%}.mirror-line.revealed{border-color:var(--neon-green);filter:drop-shadow(0 0 4px rgba(57,255,20,.5))}.cell.cell-win{animation:cell-win-bounce .5s ease-out}@keyframes cell-win-bounce{0%{transform:scale(1)}25%{transform:scale(1.15)}50%{transform:translateY(-8px) scale(1.05)}75%{transform:translateY(0) scale(1.02)}to{transform:scale(1)}}.mirror-line.gaveup{border-color:var(--neon-orange);filter:drop-shadow(0 0 4px rgba(255,140,0,.5));animation:cell-reveal .3s ease-out}@keyframes cell-reveal{0%{opacity:0;transform:rotate(var(--_rot)) scale(.3)}to{opacity:1;transform:rotate(var(--_rot)) scale(1)}}.cell.cell-gaveup{animation:cell-gaveup-pulse .4s ease-out}@keyframes cell-gaveup-pulse{0%{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}.mirror-line.gaveup.forward{--_rot: -45deg}.mirror-line.gaveup.backward{--_rot: 45deg}.door{position:absolute;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;color:var(--text-dim);background:transparent;border:none;padding:0;font-family:inherit;cursor:pointer;transition:color .15s,text-shadow .15s,transform .15s;-webkit-user-select:none;user-select:none;touch-action:manipulation;z-index:2}@media(hover:hover){.door:hover{color:var(--neon-cyan);text-shadow:var(--glow-cyan);transform:scale(1.15)}}.door.entry-highlight{color:var(--neon-cyan);text-shadow:var(--glow-cyan)}.door.exit-highlight{color:var(--neon-magenta);text-shadow:var(--glow-magenta)}.door.same-door-highlight{color:var(--neon-yellow);text-shadow:0 0 8px rgba(255,230,0,.6),0 0 20px rgba(255,230,0,.3)}.bounce-display{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:3rem;font-weight:700;color:var(--neon-yellow);text-shadow:0 0 16px rgba(255,230,0,.8),0 0 40px rgba(255,230,0,.4);pointer-events:none;opacity:0;z-index:10}.bounce-display.visible{animation:bounce-pop .8s ease-out forwards}@keyframes bounce-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}to{opacity:0;transform:translate(-50%,-50%) scale(1) translateY(-20px)}}.history-strip{width:100%;max-height:5.5rem;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.history-list{display:flex;flex-direction:column;gap:4px}.history-item{padding:6px 10px;background:var(--bg-cell);border-left:3px solid var(--neon-cyan);border-radius:0 4px 4px 0;font-size:.7rem;font-family:inherit}.history-item.reset{border-left-color:var(--neon-yellow)}.history-item.wrong{border-left-color:var(--neon-red)}.history-item.correct{border-left-color:var(--neon-green)}.history-empty{color:var(--text-dim);font-size:.7rem;text-align:center;padding:12px 0}.bottom-bar{width:100%;display:flex;flex-direction:column;align-items:center;gap:8px}.solved-msg{font-size:.85rem;color:var(--neon-green);text-shadow:var(--glow-green);text-align:center;letter-spacing:.04em}.solved-msg.gaveup-msg{color:var(--text-dim);text-shadow:none}.btn{padding:10px 20px;border:1px solid var(--border);border-radius:4px;background:var(--bg-panel);color:var(--text-primary);font-family:inherit;font-size:.8rem;cursor:pointer;text-transform:uppercase;letter-spacing:.06em;transition:border-color .15s,color .15s,box-shadow .15s}@media(hover:hover){.btn:hover{border-color:var(--neon-cyan);color:var(--neon-cyan);box-shadow:var(--glow-cyan)}}.btn:disabled{opacity:.3;cursor:not-allowed;box-shadow:none}.btn.btn-submit{border-color:var(--neon-green);color:var(--neon-green)}@media(hover:hover){.btn.btn-submit:hover{box-shadow:var(--glow-green)}}.btn.btn-giveup{border-color:var(--text-dim);color:var(--text-dim)}.btn.btn-warning{border-color:var(--neon-orange);color:var(--neon-orange)}@media(hover:hover){.btn.btn-warning:hover{box-shadow:0 0 8px #ff8c0099,0 0 20px #ff8c004d}}.btn.btn-current{border-color:var(--neon-cyan);color:var(--neon-cyan)}.button-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.board-wrapper.shake{animation:shake .4s ease-out}.overlay{position:fixed;inset:0;background:#0a0e17d9;display:flex;align-items:center;justify-content:center;z-index:60;opacity:0;pointer-events:none;transition:opacity .3s}.overlay.visible{opacity:1;pointer-events:auto}.overlay-panel{background:var(--bg-panel);border:1px solid var(--border);border-radius:8px;padding:24px;max-width:440px;width:90%;display:flex;flex-direction:column;align-items:center;gap:16px}.overlay-panel h3{font-size:.85rem;color:var(--neon-cyan);text-transform:uppercase;letter-spacing:.1em}.help-panel{text-align:left}.help-content p{font-size:.75rem;color:var(--text-primary);line-height:1.6;margin-bottom:8px}.help-content strong{color:var(--neon-cyan)}.help-content code{color:var(--neon-magenta);background:#ff00e51a;padding:1px 4px;border-radius:2px}.help-shortcuts{margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}.help-shortcuts h4{font-size:.7rem;color:var(--neon-cyan);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.help-shortcuts p{font-size:.7rem;color:var(--text-dim)}.help-shortcuts kbd{display:inline-block;padding:2px 6px;border:1px solid var(--border);border-radius:3px;background:var(--bg-cell);font-family:inherit;font-size:.65rem;color:var(--text-primary)}body.in-iframe{padding-top:52px}@media(max-width:480px){:root{--cell-size: 52px;--door-size: 26px}}@media(max-width:360px){:root{--cell-size: 44px;--door-size: 22px}}@media(max-height:700px){body{min-height:auto;height:100vh;height:100dvh}#app{padding:6px 12px;gap:6px}.toolbar-btn{width:30px;height:30px;font-size:.85rem}.history-strip{max-height:6rem}.btn{padding:8px 14px;font-size:.75rem}}