.sudoku-board{grid-template-columns:repeat(var(--sudoku-size,9), minmax(0, 1fr));background:var(--card);border:3px solid var(--ink);border-radius:8px;width:100%;max-width:480px;margin:8px auto 16px;display:grid;overflow:hidden}.sudoku-cell{aspect-ratio:1;background:var(--card);min-width:0;min-height:0;color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation;border:1px solid #8fa394;border-top:0;border-left:0;place-items:center;padding:0;display:grid}.sudoku-cell[data-box-right=true]{border-right:3px solid var(--ink)}.sudoku-cell[data-box-bottom=true]{border-bottom:3px solid var(--ink)}.sudoku-cell[data-last-column=true]{border-right-width:0}.sudoku-cell[data-last-row=true]{border-bottom-width:0}.sudoku-cell[data-given=true]{background:var(--accent-soft);cursor:default}.sudoku-cell[data-selected=true]{background:var(--mint);box-shadow:inset 0 0 0 3px var(--accent)}.sudoku-cell[data-given=true][data-selected=true]{background:var(--mint)}.sudoku-cell:focus-visible{outline:3px solid var(--accent);outline-offset:-3px;z-index:1}.sudoku-cell[data-wrong=true]{box-shadow:inset 0 -5px 0 0 var(--bad);background:#f7e2de}.sudoku-cell[data-wrong=true][data-selected=true]{box-shadow:inset 0 -5px 0 0 var(--bad), inset 0 0 0 3px var(--accent)}.sudoku-symbol,.sudoku-notes{width:86%;height:86%;display:block}.sudoku-notes{width:96%;height:96%}@media (hover:hover){.sudoku-cell[data-given=false]:hover{background:var(--accent-soft)}}.sudoku-palette{grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:8px;margin-bottom:16px;display:grid}.sudoku-key{border:1px solid var(--control-border);border-radius:var(--control-radius,12px);background:var(--card);min-width:44px;min-height:44px;color:var(--ink);font:inherit;cursor:pointer;place-items:center;padding:2px;font-weight:650;line-height:1.2;display:grid}.sudoku-key .sudoku-symbol{width:34px;height:34px}.sudoku-erase{grid-column:span 2;font-size:.9375rem}.sudoku-key:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.sudoku-key:active{background:var(--mint)}@media (hover:hover){.sudoku-key:hover{background:var(--accent-soft)}}.sudoku-tools{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.sudoku-tools .btn{flex:140px;width:auto;min-height:48px}.sudoku-tools [aria-pressed=true]{background:var(--mint);outline:2px solid var(--accent);outline-offset:-2px}.sudoku-confirm{background:var(--card);width:min(32rem,100% - 32px);max-width:none;color:var(--ink);border:0;border-radius:16px;padding:0;box-shadow:0 18px 54px #223c313d}.sudoku-confirm::backdrop{background:#223c317a}.sudoku-confirm-body{padding:24px}.sudoku-confirm h3{margin:0 0 8px;font-size:1.25rem;line-height:1.35}.sudoku-confirm p{max-width:46ch;margin:0 0 20px;line-height:1.6}.sudoku-confirm .board-actions{margin:0}.sudoku-confirm .btn{min-height:48px}.sudoku-count{font-variant-numeric:tabular-nums;margin:0 0 4px;font-size:.875rem;font-weight:600}.sudoku-example{text-align:center;max-width:176px;margin:8px auto 4px}.sudoku-example svg{border-radius:6px;width:100%;height:auto;display:block}#sudoku-board-help,#sudoku-tablet-note,#sudoku-check-note{margin:0 0 8px}.sudoku-practice:not([data-phase=playing]) #sudoku-check-note{display:none}.sudoku-start{margin-block:8px 4px}.sudoku-start .btn{flex:140px;width:auto}.sudoku-practice .board-metrics{gap:16px 32px}.sudoku-practice .board-metrics dd{font-size:1.75rem}#sudoku-result-limits{margin-bottom:12px}@media (width<=480px){#sudoku-app .sudoku-stage{padding:16px 10px}.sudoku-practice .board-metrics{gap:12px 24px}.sudoku-practice .board-metrics dd{font-size:1.5rem}.sudoku-palette{gap:6px}}@media (forced-colors:active){.sudoku-cell{forced-color-adjust:none;color:canvastext;background:canvas;border-color:canvastext}.sudoku-cell svg path,.sudoku-cell svg text{fill:canvastext;stroke:canvastext}.sudoku-cell svg rect{fill:canvas;stroke:canvastext;stroke-width:4px}.sudoku-cell[data-given=true]{background:canvas;box-shadow:inset 0 0 0 2px canvastext}.sudoku-cell[data-wrong=true]{background:canvas;box-shadow:inset 0 -5px canvastext}.sudoku-cell[data-selected=true]{color:highlighttext;background:highlight;box-shadow:inset 0 0 0 3px highlighttext}.sudoku-cell[data-selected=true] svg path,.sudoku-cell[data-selected=true] svg text{fill:highlighttext;stroke:highlighttext}.sudoku-cell[data-selected=true] svg rect{fill:highlight;stroke:highlighttext}.sudoku-cell[data-wrong=true][data-selected=true]{box-shadow:inset 0 -5px highlighttext,inset 0 0 0 3px highlighttext}.sudoku-key{forced-color-adjust:none;color:canvastext;background:canvas;border-color:canvastext}.sudoku-confirm{border:2px solid canvastext}.sudoku-key svg path,.sudoku-key svg text{fill:canvastext;stroke:canvastext}.sudoku-key svg rect{fill:canvas;stroke:canvastext;stroke-width:4px}.sudoku-cell[data-given=false]:hover,.sudoku-key:hover,.sudoku-key:active{background:canvas}}
