.sdk{position:absolute;inset:0;container-type:size;user-select:none;-webkit-user-select:none}.sdk-in{height:100%;display:flex;flex-direction:column;gap:2cqh;padding:3.5cqw}.sdk-hud{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:space-between}.sdk-stats,.sdk-actions{display:flex;gap:6px;align-items:center}.sdk-stat{min-width:52px;padding:3px 8px;border-radius:var(--rounded-sm);background:var(--color-canvas-soft-2);text-align:center;line-height:1.2}.sdk-stat span{display:block;font-size:10px;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--color-mute)}.sdk-stat b{font-size:15px;font-variant-numeric:tabular-nums;color:var(--color-ink)}.sdk-stat.is-hot{min-width:64px;background:color-mix(in srgb,var(--color-cat) 22%,var(--color-canvas-soft-2));box-shadow:inset 0 0 0 var(--border-w) color-mix(in srgb,var(--color-cat) 50%,transparent)}.sdk-stat.is-hot b{font-family:var(--font-display);font-weight:var(--display-weight);font-size:calc(17px * var(--display-scale))}.sdk-btn,.sdk-select{height:30px;padding:0 9px;border:1px solid var(--color-hairline);border-radius:var(--rounded-sm);background:var(--color-canvas);color:var(--color-ink);font:inherit;font-size:13px;font-weight:500;cursor:pointer}.sdk-select{padding:0 4px}.sdk-btn:hover,.sdk-tool:hover,.sdk-key:hover{background:var(--color-canvas-soft-2)}.sdk-btn.is-on{background:color-mix(in srgb,var(--color-cat) 25%,var(--color-canvas));border-color:var(--color-cat)}.sdk-btn:focus-visible,.sdk-select:focus-visible,.sdk-tool:focus-visible,.sdk-key:focus-visible,.sdk-board:focus-visible{outline:2px solid var(--color-cat);outline-offset:2px}.sdk-main{flex:1;min-height:0;display:flex;flex-direction:column;gap:2cqh}.sdk-board-wrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;container-type:size}.sdk-board{position:relative;width:min(100cqw,100cqh);aspect-ratio:1;display:grid;grid-template-columns:repeat(3,1fr);gap:1.4%;padding:1.4%;border-radius:var(--rounded-lg);background:color-mix(in srgb,var(--color-cat) 30%,var(--color-canvas-soft-2));touch-action:none;outline-offset:3px}.sdk-box{display:grid;grid-template-columns:repeat(3,1fr);gap:3%;padding:3%;border-radius:9%;background:color-mix(in srgb,var(--color-cat) 10%,var(--color-canvas-soft-2))}.sdk-cell{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;border-radius:18%;background:var(--color-canvas);cursor:pointer;container-type:size;font-family:var(--font-display);font-weight:var(--display-weight);font-variant-numeric:tabular-nums;line-height:1}.sdk-v{font-size:calc(64cqh * var(--display-scale))}.sdk-cell.is-given{color:var(--color-ink);background:color-mix(in srgb,var(--color-canvas-soft-2) 55%,var(--color-canvas))}.sdk-cell.is-user{color:color-mix(in srgb,var(--color-cat) 70%,var(--color-ink))}.sdk-cell.is-peer{background:color-mix(in srgb,var(--color-cat) 12%,var(--color-canvas))}.sdk-cell.is-given.is-peer{background:color-mix(in srgb,var(--color-cat) 16%,var(--color-canvas-soft-2))}.sdk-cell.is-same{background:color-mix(in srgb,var(--color-cat) 32%,var(--color-canvas))}.sdk-cell.is-sel{background:color-mix(in srgb,var(--color-cat) 48%,var(--color-canvas));box-shadow:inset 0 0 0 2px var(--color-cat)}.sdk-cell.is-bad{color:var(--color-error);background:color-mix(in srgb,var(--color-error-soft) 70%,var(--color-canvas))}.sdk-cell.is-bad.is-sel{box-shadow:inset 0 0 0 2px var(--color-error)}.sdk-cell.is-note-match .sdk-notes{color:var(--color-ink)}.sdk-notes{position:absolute;inset:6%;display:grid;grid-template-columns:repeat(3,1fr);font-family:var(--font-mono);font-weight:500;font-size:27cqh;color:var(--color-mute)}.sdk-notes i{display:flex;align-items:center;justify-content:center;font-style:normal}.sdk-cell.is-hinted{animation:sdk-hint .9s ease-out}.sdk-cell.is-wave{animation:sdk-wave .5s ease-out var(--sdk-delay, 0ms) both}@keyframes sdk-hint{0%,40%{box-shadow:inset 0 0 0 3px var(--color-success)}to{box-shadow:inset 0 0 0 0 transparent}}@keyframes sdk-wave{0%{transform:scale(1)}40%{transform:scale(.82);background:color-mix(in srgb,var(--color-cat) 60%,var(--color-canvas))}to{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.sdk-cell.is-hinted,.sdk-cell.is-wave{animation:none}}.sdk-paused{position:absolute;inset:0;display:none;align-items:center;justify-content:center;border-radius:inherit;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:color-mix(in srgb,var(--color-canvas) 55%,transparent);font-family:var(--font-display);font-size:22px;color:var(--color-ink)}.sdk-board.is-paused:not(.is-solved) .sdk-paused{display:flex}.sdk-controls{display:flex;flex-direction:column;gap:6px}.sdk-tools{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.sdk-tool{min-width:0;overflow:hidden;white-space:nowrap;height:32px;border:1px solid var(--color-hairline);border-radius:var(--rounded-sm);background:var(--color-canvas);color:var(--color-ink);font:inherit;font-size:13px;font-weight:500;cursor:pointer}.sdk-tool[aria-pressed=true]{background:color-mix(in srgb,var(--color-cat) 25%,var(--color-canvas));border-color:var(--color-cat)}.sdk-tool:disabled{opacity:.45;cursor:default}.sdk-pad{display:grid;grid-template-columns:repeat(9,1fr);gap:5px}.sdk-key{position:relative;height:44px;min-width:0;padding:0;border:0;border-radius:var(--rounded-md, 10px);background:color-mix(in srgb,var(--color-cat) 18%,var(--color-canvas-soft-2));color:var(--color-ink);cursor:pointer;font-family:var(--font-display);font-weight:var(--display-weight);font-size:calc(22px * var(--display-scale))}.sdk-key small{position:absolute;right:4px;bottom:2px;font-family:var(--font-mono);font-size:9px;font-weight:500;color:var(--color-mute)}.sdk-key.is-notes{font-size:calc(15px * var(--display-scale));color:var(--color-mute)}.sdk-key.is-done{opacity:.35}.sdk-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@container (min-aspect-ratio: 5/4){.sdk-in{display:grid;grid-template-columns:96cqh minmax(0,1fr);grid-template-rows:auto 1fr;gap:2cqh 3cqh;padding:2cqh}.sdk-main{display:contents}.sdk-board-wrap{grid-column:1;grid-row:1 / 3}.sdk-hud{grid-column:2;grid-row:1}.sdk-controls{grid-column:2;grid-row:2;justify-content:center;min-width:0}.sdk-tools{grid-template-columns:repeat(3,minmax(0,1fr))}.sdk-pad{grid-template-columns:repeat(3,1fr)}.sdk-key{height:auto;aspect-ratio:1.6;max-height:56px}}@container (max-height: 300px){.sdk-stat span,.sdk-stat:not(.is-hot){display:none}.sdk-hud,.sdk-stats,.sdk-actions,.sdk-tools,.sdk-pad{gap:4px}.sdk-tool,.sdk-btn,.sdk-select{height:26px;padding:0 6px;font-size:12px}.sdk-tools{grid-template-columns:repeat(5,minmax(0,1fr))}.sdk-tool{padding:0 2px;font-size:11px}.sdk-key{aspect-ratio:auto;height:30px;max-height:none;font-size:calc(17px * var(--display-scale))}}
