.sudoku-app{--sdk-accent:#10b981;--sdk-line:#ffffff1a;--sdk-line-bold:#ffffff6b;--sdk-cell:#10141c;--sdk-cell-sel:#10b98147;--sdk-cell-peer:#ffffff0b;--sdk-cell-same:#10b98121;--sdk-bad:#f87171}.sdk-grid{aspect-ratio:1;border:2px solid var(--sdk-line-bold);background:var(--sdk-cell);touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:10px;grid-template-columns:repeat(9,1fr);width:100%;max-width:32rem;margin:0 auto;display:grid;overflow:hidden}.sdk-cell{border-right:1px solid var(--sdk-line);border-bottom:1px solid var(--sdk-line);color:#cfe6dc;cursor:pointer;background:0 0;justify-content:center;align-items:center;font-size:clamp(1rem,5.2vw,1.7rem);font-weight:600;transition:background 80ms;display:flex;position:relative}.sdk-cell.br{border-right:2px solid var(--sdk-line-bold)}.sdk-cell.bb{border-bottom:2px solid var(--sdk-line-bold)}.sdk-cell.edge-r{border-right:none}.sdk-cell.edge-b{border-bottom:none}.sdk-cell.given{color:#fff;font-weight:800}.sdk-cell.user{color:var(--sdk-accent)}.sdk-cell.hint{color:#67e8f9}.sdk-cell.diag{background:#10b98117}.sdk-cell.peer{background:var(--sdk-cell-peer)}.sdk-cell.same{background:var(--sdk-cell-same)}.sdk-cell.sel{background:var(--sdk-cell-sel)}.sdk-cell.bad{color:var(--sdk-bad)!important}.sdk-cell.wrong{background:#f8717138;color:var(--sdk-bad)!important}.sdk-notes{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);padding:1px;display:grid;position:absolute;inset:0}.sdk-note{color:#7f93a6;justify-content:center;align-items:center;font-size:clamp(.4rem,1.9vw,.62rem);font-weight:500;line-height:1;display:flex}.sdk-pad{grid-template-columns:repeat(9,1fr);gap:6px;width:100%;max-width:32rem;margin:0 auto;display:grid}@media (max-width:420px){.sdk-pad{grid-template-columns:repeat(5,1fr)}}.sdk-key{aspect-ratio:1;color:#e8f2ee;cursor:pointer;background:#141a24;border:1px solid #ffffff1a;border-radius:10px;justify-content:center;align-items:center;font-size:1.35rem;font-weight:700;transition:background .1s,border-color .1s;display:flex;position:relative}.sdk-key:hover{border-color:var(--sdk-accent)}.sdk-key:active{background:#1c2733}.sdk-key.done{color:#4a5a68;cursor:default;background:#0e131a}.sdk-key .cnt{color:#6b7c8c;font-size:.6rem;font-weight:600;position:absolute;bottom:3px;right:5px}