:root{--font-body:system-ui, "Segoe UI", Roboto, sans-serif;--color-bg:#fff;--color-text:#1f2328;--color-muted:#656d76;--color-border:#d0d7de;--color-cell-bg:#fff;--color-cell-selected-bg:#fff4c2;--color-given:#1f2328;--color-sign:#57606a;--color-button-bg:#f6f8fa;--color-button-hover-bg:#eaeef2;--color-success:#1a7f37;--color-error:#cf222e;--color-revealed:#656d76;--color-hint:#bf8700;--color-hint-related-bg:#ddf4ff;--color-hint-panel-bg:#f6f8fa;--level-0:#0969da;--level-1:#cf222e;--level-2:#1a7f37;--level-3:#8250df;--level-4:#bc4c00;--level-5:#bf3989;--level-6:#0a7b83;--level-7:#7d4e00;--cell-size-max:64px;--gap-ratio:.375;--radius:6px}.level-0{--level-color:var(--level-0)}.level-1{--level-color:var(--level-1)}.level-2{--level-color:var(--level-2)}.level-3{--level-color:var(--level-3)}.level-4{--level-color:var(--level-4)}.level-5{--level-color:var(--level-5)}.level-6{--level-color:var(--level-6)}.level-7{--level-color:var(--level-7)}*{box-sizing:border-box}body{font-family:var(--font-body);color:var(--color-text);background:var(--color-bg);margin:0}button,select{font:inherit;border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-button-bg);color:var(--color-text);cursor:pointer;padding:8px 14px}button:hover:not(:disabled){background:var(--color-button-hover-bg)}button:disabled{cursor:default;opacity:.5}.app{flex-direction:column;align-items:center;gap:16px;max-width:800px;margin:0 auto;padding:24px 16px;display:flex}.title{margin:0}.new-game,.action-row,.number-pad,.checkpoint-trail{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.status{margin:0;font-weight:600}.status-note{color:var(--color-muted);font-weight:400}.board{--cell-size:min(var(--cell-size-max), calc((100vw - 32px) / (var(--grid-size) + (var(--grid-size) - 1) * var(--gap-ratio))));--gap-size:calc(var(--cell-size) * var(--gap-ratio));place-items:center;display:grid}.cell{width:var(--cell-size);height:var(--cell-size);border-radius:calc(var(--cell-size) * .1);font-size:calc(var(--cell-size) * .5);background:var(--color-cell-bg);color:var(--level-color,var(--color-text));border:2px solid var(--color-border);padding:0;font-weight:600}.cell--given,.cell--given:disabled{color:var(--color-given);opacity:1;font-weight:800}.cell:disabled{opacity:1}.cell.cell--selected,.cell.cell--selected:hover{background:var(--color-cell-selected-bg);border-color:var(--color-text)}.cell--hint{text-underline-offset:.15em;text-decoration:underline}.cell.cell--hint-target{border-color:var(--color-hint)}.cell.cell--hint-focus{border:3px solid var(--color-hint)}.cell.cell--hint-related{background:var(--color-hint-related-bg)}.sign--highlight{color:var(--color-hint);transform:scale(1.3)}.hint-panel{border:1px solid var(--color-border);border-left:4px solid var(--color-hint);border-radius:var(--radius);background:var(--color-hint-panel-bg);width:100%;max-width:560px;padding:12px 16px}.hint-panel p{margin:8px 0 0}.hint-panel-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.hint-close{padding:2px 8px}.hint-steps{flex-direction:column;gap:6px;margin:8px 0 0;padding-left:24px;display:flex}.hint-step{text-align:left;background:0 0;border-color:#0000;width:100%;padding:6px 10px}.hint-step--active,.hint-step--active:hover:not(:disabled){background:var(--color-bg);border-color:var(--color-hint)}.cell--revealed{color:var(--color-revealed)}.cell--wrong,.cell--wrong:disabled{border:3px solid var(--color-error);position:relative}.cell-wrong-value{color:var(--color-error);font-size:.55em;line-height:1;text-decoration:line-through;position:absolute;top:.15em;left:.3em}.sign{color:var(--color-sign);font-size:calc(var(--gap-size) * .9);-webkit-user-select:none;user-select:none;font-weight:700}.controls{flex-direction:column;align-items:center;gap:12px;display:flex}.pad-button{min-width:52px;color:var(--level-color,var(--color-text));font-size:1.3rem;font-weight:600}.checkpoint-chip{border:2px solid var(--level-color);color:var(--level-color);border-radius:999px;padding:2px 10px;font-size:.85rem}.checkpoint-chip--current{background:var(--level-color);color:var(--color-bg)}.message{margin:0}.message--success{color:var(--color-success);font-weight:700}.help{color:var(--color-muted);text-align:center;margin:0;font-size:.9rem}