*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f4f4f4;--surface:#fff;--border:#bbb;--border-thick:#333;--given:#1a1a2e;--user:#2563eb;--error:#dc2626;--selected:#dbeafe;--highlight:#eff6ff;--same-number:#bfdbfe;--accent:#2563eb;--radius:6px;font-size:16px}body{background:var(--bg);justify-content:center;min-height:100dvh;padding:1rem;font-family:system-ui,sans-serif;display:flex}#app{flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:400px;display:flex}header{justify-content:space-between;align-items:center;width:100%;display:flex}#deploy-info{color:#aaa;text-align:right;width:100%;margin-top:-.5rem;font-size:.7rem}h1{letter-spacing:-.5px;font-size:1.8rem;font-weight:700}#timer{font-variant-numeric:tabular-nums;color:#555;font-size:1.4rem;font-weight:500}#toolbar{gap:.5rem;width:100%;display:flex}#toolbar select,#toolbar button{border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);cursor:pointer;padding:.4rem .7rem;font-size:.9rem}#toolbar button:hover{background:#f0f0f0}#toolbar select{flex:1}#board{aspect-ratio:1;border:2px solid var(--border-thick);background:var(--border-thick);grid-template-columns:repeat(9,1fr);gap:1px;width:100%;display:grid}.cell{background:var(--surface);cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;font-size:clamp(1rem,4vw,1.4rem);font-weight:400;transition:background .1s;display:flex;position:relative}.cell:nth-child(3n){border-right:2px solid var(--border-thick)}.cell:nth-child(n+19):nth-child(-n+27),.cell:nth-child(n+46):nth-child(-n+54){border-bottom:2px solid var(--border-thick)}.cell.given{color:var(--given);font-weight:700}.cell:not(.given){color:var(--user)}.cell.error{color:var(--error)}.cell.selected{background:var(--selected)}.cell.highlight:not(.selected){background:var(--highlight)}.cell.same-number:not(.selected){background:var(--same-number)}.notes-grid{grid-template-columns:repeat(3,1fr);width:100%;height:100%;padding:1px;display:grid}.notes-grid span{color:#555;justify-content:center;align-items:center;font-size:clamp(.4rem,1.5vw,.55rem);line-height:1;display:flex}#numpad{grid-template-columns:repeat(9,1fr);gap:.3rem;width:100%;display:grid}.num-btn{aspect-ratio:1;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;font-size:clamp(1rem,4vw,1.3rem);font-weight:600;transition:background .1s}.num-btn:hover,.num-btn:active{background:var(--selected)}.num-btn.exhausted{opacity:.25;cursor:default}.num-btn.exhausted:hover,.num-btn.exhausted:active{background:var(--surface)}#action-bar{gap:.5rem;width:100%;display:flex}#action-bar button{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;flex:1;padding:.5rem;font-size:.85rem;transition:background .1s}#action-bar button:hover{background:#f0f0f0}#action-bar button.active{background:var(--accent);color:#fff;border-color:var(--accent)}.solution-hint{color:#16a34a;opacity:.7;pointer-events:none;justify-content:center;align-items:center;font-size:clamp(1rem,4vw,1.4rem);font-weight:600;display:flex;position:absolute;inset:0}@media (hover:none){.cell{-webkit-tap-highlight-color:transparent}}