.s-board-wrap{aspect-ratio:1;width:100%;min-width:280px;max-width:min(480px,100dvh - 300px);margin-inline:auto;position:relative}.s-board{--n:9;--line:#2b2a28;--given:#1f1e1c;--player:#2f55c4;grid-template-columns:repeat(var(--n), 1fr);grid-template-rows:repeat(var(--n), 1fr);border:3px solid var(--line);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;background:#fff;border-radius:8px;width:100%;height:100%;display:grid;position:relative;overflow:hidden;container-type:size}.s-row{display:contents}.s-cell{box-sizing:border-box;min-width:0;min-height:0;color:var(--player);font:600 calc(100cqw / var(--n) * .56) / 1 ui-sans-serif, system-ui, sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent;background:#fbfaf7;border:0 solid #0000002e;border-width:1px 0 0 1px;justify-content:center;align-items:center;padding:0;display:flex;position:relative}.s-cell.bx-l{border-left:2.5px solid var(--line)}.s-cell.bx-t{border-top:2.5px solid var(--line)}.s-cell.c0{border-left-width:0}.s-cell.r0{border-top-width:0}.s-cell.is-given{color:var(--given);cursor:default;background:#efece5;font-weight:750}.s-cell:focus-visible{outline:3px solid var(--accent);outline-offset:-3px;z-index:2}.s-cell.is-peer{background:#eef1f6}.s-cell.is-given.is-peer{background:#e4e3e0}.s-cell.is-same{background:#d8e2f4}.s-cell.is-selected{background:#bdd2f3}.s-digit{pointer-events:none}.s-marks{grid-template-columns:repeat(var(--mc,3), 1fr);grid-template-rows:repeat(var(--mr,3), 1fr);pointer-events:none;width:100%;height:100%;padding:2px;display:grid}.s-marks i{font:500 calc(100cqw / var(--n) * .24) / 1 ui-sans-serif, system-ui, sans-serif;color:#4b4a46;justify-content:center;align-items:center;font-style:normal;display:flex}.s-marks i.is-struck{color:#c62828;text-decoration:line-through 1.5px}.s-cell.is-error{color:#b3261e;background-color:#f6d6d3}.s-cell.is-given.is-error{background-color:#ebc9c4}.s-cell.s-house{background-color:#fbefcf}.s-cell.s-hint{animation:.9s ease-in-out 3 s-pulse;box-shadow:inset 0 0 0 3px #1b7f3b}.s-cell.s-mistake{animation:.9s ease-in-out 3 s-pulse;box-shadow:inset 0 0 0 3px #c62828}.s-cell.s-cause{box-shadow:inset 0 0 0 3px #5b3cc4e6}@keyframes s-pulse{50%{filter:brightness(1.1)}}@media (prefers-reduced-motion:reduce){.s-cell.s-hint,.s-cell.s-mistake{animation:none}}.is-won .s-digit{animation:.5s ease-out both s-pop}@keyframes s-pop{40%{display:inline-block;transform:scale(1.18)}}.s-pad{grid-template-columns:repeat(var(--n), 1fr);gap:5px;display:grid}.s-pad-digit{border:1px solid var(--border);background:var(--surface);min-width:0;min-height:52px;color:var(--fg);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;line-height:1;display:flex}.s-pad-digit:hover:not(:disabled){background:var(--surface-2)}.s-pad-digit:disabled{cursor:not-allowed;opacity:.45}.s-pad-num{font-size:1.45rem;font-weight:650}.s-pad-left{color:var(--muted);margin-top:3px;font-size:.65rem}.s-pad-digit.is-done .s-pad-num{opacity:.35}.is-pencil .s-pad-digit{border-color:var(--accent);border-style:dashed}.is-pencil .s-pad-num{font-size:1rem;font-weight:500}.s-pencil[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent)}.s-overlay{background:var(--surface-2);color:var(--fg);z-index:5;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;font-weight:600;display:none;position:absolute;inset:0}.is-paused .s-overlay[data-for=paused],.is-loading .s-overlay[data-for=loading]{display:flex}.s-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite s-spin}@keyframes s-spin{to{transform:rotate(360deg)}}.s-win::backdrop{background:#00000073}.s-win dl>div{border-bottom:1px solid var(--border);justify-content:space-between;gap:1rem;padding:.35rem 0;display:flex}.s-win dt{color:var(--muted)}.s-win dd{font-variant-numeric:tabular-nums;font-weight:650}.s-static .s-cell{cursor:default}.s-static .s-cell.is-house{background-color:#fbefcf}.s-static .s-cell.is-new{background:#e3f3e7;box-shadow:inset 0 0 0 3px #1b7f3b}.s-static .s-cell.is-focus{box-shadow:inset 0 0 0 3px #5b3cc4d9}
