:root{--accent:#3d7fb8}
.sd{gap:16px;padding:10px;flex-wrap:wrap;background:#eef3f7;align-content:center}
.board{display:grid;grid-template-columns:repeat(9,var(--s));grid-template-rows:repeat(9,var(--s));border:3px solid var(--ink);border-radius:10px;overflow:hidden;background:#fff}
.cell{border:0;border-right:1px solid #c8d3db;border-bottom:1px solid #c8d3db;background:#fff;font-size:calc(var(--s)*0.56);font-weight:700;color:#2f5f8a;display:grid;place-items:center;cursor:pointer;padding:0;position:relative}
.cell:nth-child(3n){border-right:2px solid var(--ink)}.cell:nth-child(9n){border-right:0}
.cell.r3{border-bottom:2px solid var(--ink)}.cell.r8{border-bottom:0}
.cell.given{color:var(--ink);font-weight:900}.cell.peer{background:#eef4f9}.cell.same{background:#d7e6f3}.cell.sel{background:#b9d4ec}.cell.bad{color:#d9453b;background:#fbe4e1}
.notes{position:absolute;inset:2px;display:grid;grid-template-columns:repeat(3,1fr);font-size:calc(var(--s)*0.22);color:#6c7a73;font-weight:700;line-height:1}.notes span{display:grid;place-items:center}
.pad{display:flex;flex-direction:column;gap:10px;align-items:center}
.nums{display:grid;grid-template-columns:repeat(3,56px);gap:8px}.nums button{height:56px;border-radius:14px;border:2px solid var(--ink);background:#fff;font-size:24px;font-weight:800;cursor:pointer;position:relative}.nums button small{position:absolute;right:5px;bottom:2px;font-size:10px;color:var(--muted)}.nums button:disabled{opacity:.3}
.tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
@media (max-width:700px){.sd{flex-direction:column;flex-wrap:nowrap;overflow:auto;justify-content:flex-start}.nums{grid-template-columns:repeat(9,1fr);width:min(96vw,440px)}.nums button{height:46px;font-size:20px}}