#sudoku-app{--su-line:var(--text);--su-thin:#9c8f79;--su-mine:#0b56a4;--su-wrong:#a8201a;--su-wrong-bg:#fde4e0;--su-peer:#e9eff4;--su-same:#c4dcf0;--su-selected:#ffe27a;margin:0 0 24px}.su-game{gap:10px;display:grid}.su-info{gap:4px 18px}.su-level{font-weight:800}.su-clock{font-variant-numeric:tabular-nums}.su-play{gap:12px;display:grid}.su-side{align-content:start;gap:12px;min-width:0;display:grid}@media (width>=900px){.su-play{grid-template-columns:minmax(0,600px) minmax(300px,400px);align-items:start;gap:28px}.su-status{min-height:7.5em}}.su-board{min-width:0}.su-grid{aspect-ratio:1;border:4px solid var(--su-line);background:var(--su-thin);width:100%;max-width:600px;box-shadow:var(--shadow-md);touch-action:manipulation;border-radius:6px;grid-template-rows:repeat(9,minmax(0,1fr));grid-template-columns:repeat(9,minmax(0,1fr));gap:1px;margin:0 auto;display:grid;container-type:inline-size}.su-cell{background:var(--surface);min-width:0;min-height:0;color:var(--su-mine);font-family:var(--font);font-variant-numeric:lining-nums tabular-nums;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0;border-radius:0;place-items:center;margin:0;padding:0;font-size:clamp(24px,7.4cqw,44px);font-weight:500;line-height:1;transition:background-color .12s;display:grid;position:relative}.su-cell:nth-child(9n+3),.su-cell:nth-child(9n+6){box-shadow:3px 0 0 var(--su-line);margin-right:2px}.su-cell:nth-child(n+19):nth-child(-n+27),.su-cell:nth-child(n+46):nth-child(-n+54){box-shadow:0 3px 0 var(--su-line);margin-bottom:2px}.su-cell:nth-child(n+19):nth-child(-n+27):nth-child(3n),.su-cell:nth-child(n+46):nth-child(-n+54):nth-child(3n){box-shadow:0 3px 0 var(--su-line), 3px 0 0 var(--su-line), 3px 3px 0 var(--su-line)}.su-cell:nth-child(n+19):nth-child(-n+27):nth-child(9n),.su-cell:nth-child(n+46):nth-child(-n+54):nth-child(9n){box-shadow:0 3px 0 var(--su-line)}.su-given{color:var(--text);background:var(--surface-2);font-weight:800}.su-peer{background:var(--su-peer)}.su-given.su-peer{background:#dfe6ec}.su-same{background:var(--su-same)}.su-same .su-digit{text-underline-offset:.14em;text-decoration:underline;text-decoration-thickness:2px}.su-selected{z-index:2;background:var(--su-selected);outline:4px solid var(--su-line);outline-offset:-4px}.su-cell:focus-visible{z-index:3;outline:4px solid var(--focus);outline-offset:-4px}.su-selected:focus-visible{outline-color:var(--su-line);box-shadow:0 0 0 4px var(--focus)}.su-wrong{color:var(--su-wrong);background:var(--su-wrong-bg)}.su-wrong .su-digit{-webkit-text-decoration:underline wavy var(--su-wrong);text-decoration:underline wavy var(--su-wrong);text-underline-offset:.12em;text-decoration-thickness:2px}.su-x{font-size:.42em;font-weight:900;line-height:1;position:absolute;top:1px;right:3px}.su-hint-unit{background:var(--highlight-soft)}.su-hint-step{background:var(--highlight-soft);outline:3px dashed var(--su-line);outline-offset:-4px}.su-cell.su-hint{z-index:4;background:var(--highlight);outline:5px solid var(--su-line);outline-offset:-5px}.su-solved .su-cell{cursor:default}.su-notes{width:100%;height:100%;color:var(--muted);grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);padding:1px;font-size:clamp(10px,2.9cqw,17px);font-weight:600;display:grid}.su-notes>span{place-items:center;display:grid}.su-notes .su-note-on{background:var(--primary);color:#fff;border-radius:3px;font-weight:800}.su-dock{gap:10px}.su-tools{flex-wrap:wrap;gap:8px;display:flex}.su-tools .btn{white-space:nowrap;flex:auto;min-width:0;padding:6px 10px}.su-notes-btn.su-on{border-color:var(--primary-deep);background:var(--primary);color:var(--on-primary);box-shadow:inset 0 3px 6px #00000059}.su-pad{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;display:grid}@media (width>=900px){.su-pad{grid-template-columns:repeat(3,minmax(0,1fr))}.su-pad-erase{flex-direction:row;grid-column:1/-1;gap:10px}}.su-pad-btn{border:2px solid var(--primary);border-radius:var(--radius-sm);background:linear-gradient(180deg, #fff, var(--surface-2));min-width:0;min-height:64px;box-shadow:0 3px 0 var(--border-strong);color:var(--primary);font:inherit;cursor:pointer;touch-action:manipulation;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:4px 2px;line-height:1.1;display:flex}.su-pad-btn:hover{background:var(--primary-soft)}.su-pad-btn:active{box-shadow:0 1px 0 var(--border-strong);transform:translateY(2px)}.su-pad-digit{font-variant-numeric:lining-nums;font-size:1.9rem;font-weight:800}.su-pad-icon{font-size:1.5rem}.su-pad-left{white-space:nowrap;font-size:1rem;font-weight:600}.su-pad-done{border-color:var(--border-strong);background:var(--bg-deep);box-shadow:none;color:var(--muted);border-style:dashed}.su-pad-btn.su-armed{border-color:var(--primary-deep);background:var(--primary);box-shadow:inset 0 3px 6px #0006, 0 0 0 4px var(--highlight);color:var(--on-primary)}.su-status-buttons{flex-wrap:wrap;gap:10px;margin-top:10px;display:flex}.su-hint-steps{margin:.3em 0 0;padding-left:2.2em}.su-hint-steps li+li{margin-top:.3em}.su-level-list{gap:12px;display:grid}.su-level-btn{text-align:left;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 18px}.su-level-btn strong{font-size:var(--text-lg)}.su-level-help{font-weight:500}.su-form-error{color:var(--su-wrong);margin:6px 0 0;font-weight:700}@media (width<=767px){.su-game,.su-play,.su-side{gap:6px}.su-info{font-size:1.25rem}.su-grid{width:min(100%, max(280px, calc(100svh - var(--dock-h,260px) - 12px)));border-width:3px}.su-dock.play-dock,.su-tools,.su-pad{gap:6px}.su-tools .btn{min-height:56px;padding:4px 6px;font-size:1.25rem}.su-pad-btn{gap:0;min-height:60px;padding:2px 0}.su-pad-digit{font-size:1.6rem}.su-pad-left{letter-spacing:-.01em;font-size:1.25rem;font-weight:700}.play-dock .su-status.su-status-long{max-height:9.5em}.play-dock .su-status .su-status-buttons{margin-top:4px}.play-dock .su-status .hint-box{padding:2px 8px}.play-dock .su-status .su-hint-steps{padding-left:1.8em}}@media (prefers-reduced-motion:reduce){.su-cell{transition:none}}
