.game{--board-size:min(calc(100vw - 24px), calc(100svh - 250px), 560px);grid-template-columns:minmax(0,1fr);grid-template-areas:"bar""board""side";gap:10px;max-width:560px;margin:0 auto;display:grid}.game.size-9{--board-size:min(calc(100vw - 24px), max(260px, calc(100svh - 196px)), 560px)}.game.size-4,.game.size-6{--board-size:min(calc(100vw - 24px), calc(100svh - 196px), 440px)}@media (width>=900px){.game{--board-size:min(560px, calc(100vh - 200px));grid-template-columns:auto minmax(260px,320px);grid-template-areas:"bar bar""board side";justify-content:start;column-gap:32px;max-width:none}.game.size-9{--board-size:min(560px, max(420px, calc(100vh - 200px)))}.game.size-4,.game.size-6{--board-size:440px}}.game-bar{width:var(--board-size);grid-area:bar;align-items:center;gap:12px;margin:0 auto;display:flex}@media (width>=900px){.game-bar{margin:0}}.tag{color:var(--ink);border:1.5px solid;border-radius:999px;padding:2px 12px;font-size:.95rem;font-weight:700}.timer{font-variant-numeric:tabular-nums;margin-left:auto;font-size:1.15rem;font-weight:700}html[data-timer=hide] .timer{visibility:hidden}.board-area{width:var(--board-size);height:var(--board-size);grid-area:board;margin:0 auto;position:relative}.board{grid-template-columns:repeat(var(--n), 1fr);grid-template-rows:repeat(var(--n), 1fr);background:var(--paper-raised);border:3px solid var(--graphite);touch-action:manipulation;border-radius:6px;width:100%;height:100%;display:grid;overflow:hidden}.cell{border:0;border-right:1px solid var(--rule-strong);border-bottom:1px solid var(--rule-strong);font:inherit;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;place-items:center;min-width:0;min-height:0;margin:0;padding:0;display:grid;position:relative}.size-9 .cell:nth-child(9n),.size-6 .cell:nth-child(6n),.size-4 .cell:nth-child(4n){border-right:0}.cell.edge-r{border-right:2.5px solid var(--graphite)}.cell.edge-b{border-bottom:2.5px solid var(--graphite)}.cell .v{font-size:calc(var(--board-size) / var(--n) * .56);font-weight:500;line-height:1}.cell.given{color:var(--graphite);cursor:default}.cell.given .v{font-weight:700}.cell.peer{background:var(--peer)}.cell.same{background:var(--same)}.cell.sel{background:var(--highlight)}.cell.bad .v{color:var(--error)}.cell.bad{background:var(--error-bg)}.cell.sel.bad{background:color-mix(in srgb, var(--highlight) 50%, var(--error-bg))}.cell.hint-focus{box-shadow:inset 0 0 0 3px var(--ink)}.cell.hint-target{background:color-mix(in srgb, var(--ok) 22%, transparent)}.cell:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;z-index:2}.notes{grid-template-columns:repeat(var(--bw), 1fr);grid-template-rows:repeat(var(--bh), 1fr);color:var(--pencil);font-size:calc(var(--board-size) / var(--n) * .24);pointer-events:none;line-height:1;display:grid;position:absolute;inset:2px}.notes span{place-items:center;display:grid}.notes span.hl{color:var(--ink);font-weight:700}.paused-cover{background:var(--paper-raised);border:3px solid var(--graphite);text-align:center;border-radius:6px;place-content:center;gap:12px;padding:24px;display:grid;position:absolute;inset:0}.paused-cover[hidden]{display:none}.side{width:var(--board-size);flex-direction:column;grid-area:side;gap:12px;margin:0 auto;display:flex}@media (width>=900px){.side{width:auto;margin:0}}.pad{grid-template-columns:repeat(var(--keys,9), 1fr);gap:5px;display:grid}.size-6 .pad{--keys:6}.size-4 .pad{--keys:4}@media (width>=900px){.size-9 .pad{grid-template-columns:repeat(3,1fr);gap:8px}}.key{border:1px solid var(--rule-strong);background:var(--paper-raised);color:var(--ink);font:inherit;cursor:pointer;border-radius:10px;place-items:center;min-height:52px;padding:8px 0 10px;font-size:clamp(1.2rem,5.2vw,1.6rem);font-weight:700;line-height:1;display:grid;position:relative}@media (width>=900px){.key{min-height:64px;font-size:1.7rem}}.key .kc{color:var(--pencil);font-size:.62rem;font-weight:500;position:absolute;bottom:3px;left:0;right:0}.key.done{opacity:.35}.key.active{background:var(--ink);color:var(--paper)}.key.active .kc{color:var(--paper)}.tools{grid-template-columns:repeat(auto-fit,minmax(60px,1fr));gap:6px;display:grid}.tool{border:1px solid var(--rule-strong);background:var(--paper-raised);color:var(--graphite);font:inherit;cursor:pointer;border-radius:10px;flex-direction:column;align-items:center;gap:3px;min-height:48px;padding:8px 4px;font-size:.9rem;display:flex}@media (width<=899px){.tool{flex-direction:row;justify-content:center;gap:6px;padding:6px 4px;font-size:.88rem}.tool svg{width:18px;height:18px}.side,.game{gap:8px}}.tool svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.tool[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.tool.small{flex-direction:row;min-height:36px;padding:4px 12px;font-size:.95rem}.tool:disabled{opacity:.4;cursor:default}.hint-panel,.done-panel{border:1.5px solid var(--ink);background:var(--paper-raised);border-radius:12px;padding:14px 16px}.hint-panel[hidden],.done-panel[hidden]{display:none}.hint-title{margin-bottom:4px;font-weight:700}.hint-actions,.done-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.done-panel h2{color:var(--ok);margin-bottom:6px}.name-form{margin:8px 0 12px}.name-form label{margin-bottom:6px;font-weight:700;display:block}.name-form div{gap:8px;display:flex}.name-form input{min-width:0;font:inherit;border:1px solid var(--rule-strong);background:var(--paper);color:var(--graphite);border-radius:10px;flex:1;padding:10px 12px}.game-links{flex-wrap:wrap;gap:16px;display:flex}.linkish{color:var(--ink);font:inherit;text-underline-offset:.18em;cursor:pointer;background:0 0;border:0;padding:4px 0;text-decoration:underline}@media print{.game{--board-size:160mm;max-width:none;display:block}.game-bar .tool,.timer,.side,.paused-cover{display:none!important}.game-bar{width:160mm;margin:0 auto 6mm}.board-area{margin:0 auto}.board{background:#fff;border-color:#000}.cell{border-color:#888;color:#000!important;background:#fff!important}.cell:not(.given) .v,.notes{visibility:hidden}.cell.edge-r{border-right-color:#000}.cell.edge-b{border-bottom-color:#000}}