:root{--bg: #f4f1ea;--fg: #1f2430;--muted: #6b7280;--card: #ffffff;--border: #d9d4c7;--thick: #1f2430;--thin: rgba(31, 36, 48, .2);--hit: #d6453d;--hint: #f59e0b;--n1: #1d4ed8;--n2: #15803d}.cell{--cell-bg: var(--rc);--cell-revealed: color-mix(in srgb, var(--rc) 40%, #ffffff)}@media(prefers-color-scheme:dark){:root{--bg: #161a22;--fg: #e8e6df;--muted: #9aa0ab;--card: #1f2430;--border: #2f3542;--thick: #e8e6df;--thin: rgba(232, 230, 223, .2);--n1: #93c5fd;--n2: #86efac}.cell{--cell-bg: color-mix(in srgb, var(--rc) 55%, #161a22);--cell-revealed: color-mix(in srgb, var(--rc) 22%, #161a22)}}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}#app{max-width:560px;margin:0 auto;padding:calc(8px + env(safe-area-inset-top)) 14px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;min-height:100dvh}header{display:flex;align-items:flex-end;justify-content:space-between;gap:8px}.brand{display:flex;flex-direction:column;gap:2px}h1{font-size:1.35rem;margin:0;letter-spacing:.02em}.label{font-size:.8rem;color:var(--muted)}.hud{display:flex;gap:12px;font-variant-numeric:tabular-nums;font-size:1rem;white-space:nowrap}.board{display:grid;grid-template-columns:repeat(var(--n, 7),1fr);width:min(100%,70dvh);aspect-ratio:1;margin:0 auto;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;border:3px solid var(--thick);border-radius:8px;overflow:hidden;background:var(--thick)}.board.busy,.toolbar.busy{opacity:.5;pointer-events:none}.cell{position:relative;display:flex;align-items:center;justify-content:center;padding:0;margin:0;border:0;border-top:1px solid var(--thin);border-left:1px solid var(--thin);background:var(--cell-bg);color:var(--fg);font:inherit;font-size:calc(var(--cell, 40px) * .5);font-weight:700;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}.cell.bt{border-top:3px solid var(--thick)}.cell.bl{border-left:3px solid var(--thick)}.cell.revealed{background:var(--cell-revealed);cursor:default}.cell.n1{color:var(--n1)}.cell.n2{color:var(--n2)}.cell.n3,.cell.n4{color:var(--hint)}.cell.mark{color:var(--fg)}.cell.given{color:var(--fg);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;cursor:default}.cell.x{color:var(--fg);opacity:.7;font-weight:500}.cell.hit{background:var(--hit);color:#fff}.cell.excluded:after{content:"×";opacity:.3;font-weight:400}.cell.conflict{box-shadow:inset 0 0 0 3px var(--hit);color:var(--hit)}.cell.hint{outline:3px solid var(--hint);outline-offset:-3px;z-index:1;animation:pulse .6s ease-in-out 4}.cell.hintq{outline-color:var(--hit)}.cell.shake{animation:shake .4s}@keyframes pulse{50%{filter:brightness(1.3)}}@keyframes shake{25%{transform:translate(-3px)}75%{transform:translate(3px)}}.msg{min-height:1.5em;text-align:center;color:var(--muted);font-size:.95rem}.toolbar{display:grid;grid-template-columns:repeat(var(--tools, 4),1fr);gap:6px}.toolbar .btn{padding:12px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toolbar .tool{font-size:1.15rem}.btn{font:inherit;font-size:1rem;padding:12px 8px;border-radius:10px;border:1px solid var(--border);background:var(--card);color:var(--fg);cursor:pointer}.btn.active,.btn.primary{background:var(--fg);color:var(--bg);border-color:var(--fg)}details{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:8px 12px}summary{cursor:pointer;font-weight:600}.settings{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}.settings label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;color:var(--muted)}.settings label.check{flex-direction:row;align-items:center;gap:8px;grid-column:1 / -1;color:var(--fg)}select{font:inherit;padding:8px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--fg)}.actions{display:flex;gap:8px;grid-column:1 / -1}.actions .btn{flex:1}ol.rules{padding-left:18px;margin:6px 0;font-size:.92rem;line-height:1.45}.footer{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.8rem;color:var(--muted);padding:2px 2px 10px}.btn.small{padding:8px 10px;font-size:.85rem}dialog{border:0;border-radius:14px;padding:20px;max-width:340px;width:90vw;background:var(--card);color:var(--fg)}dialog::backdrop{background:#00000073}dialog h2{margin:0 0 10px}dialog .row{display:flex;justify-content:space-between;padding:4px 0;font-variant-numeric:tabular-nums}dialog .actions{margin-top:14px;flex-wrap:wrap}
