.sk{--sk-inset:3px;--sk-r:max(4px, calc(var(--radius) * .45));--sk-tint:66%;--sk-edge-w:min(var(--board-border), 2px);--sk-reach:calc(-1 * (var(--grid-line) + var(--cell-gap)));padding:var(--cell-gap);background:var(--card);border:var(--board-border) solid var(--board-line);border-radius:calc(var(--radius) * .6);container-type:inline-size}.sk-grid{gap:var(--cell-gap);display:grid;position:relative}.sk .cell{aspect-ratio:1;cursor:pointer;background:var(--cell);border-radius:var(--cell-radius);border-right:var(--grid-line) solid var(--board-thin);border-bottom:var(--grid-line) solid var(--board-thin);justify-content:center;align-items:center;display:flex;position:relative}.sk .cell.edge-r{border-right:0}.sk .cell.edge-b{border-bottom:0}.sk .cell.k-tl{border-top-left-radius:max(var(--cell-radius), calc(var(--radius) * .6 - var(--board-border) - var(--cell-gap)))}.sk .cell.k-tr{border-top-right-radius:max(var(--cell-radius), calc(var(--radius) * .6 - var(--board-border) - var(--cell-gap)))}.sk .cell.k-bl{border-bottom-left-radius:max(var(--cell-radius), calc(var(--radius) * .6 - var(--board-border) - var(--cell-gap)))}.sk .cell.k-br{border-bottom-right-radius:max(var(--cell-radius), calc(var(--radius) * .6 - var(--board-border) - var(--cell-gap)))}.sk .blk{pointer-events:none;top:0;left:0;right:var(--sk-reach);bottom:var(--sk-reach);background:color-mix(in srgb, var(--c) var(--sk-tint), var(--cell));border:0 solid color-mix(in srgb, var(--c) 40%, var(--board-line));transition:opacity .15s;display:none;position:absolute}.sk .cell.on .blk{display:block}.sk .blk.e-t{top:var(--sk-inset);border-top-width:var(--sk-edge-w)}.sk .blk.e-b{bottom:var(--sk-inset);border-bottom-width:var(--sk-edge-w)}.sk .blk.e-l{left:var(--sk-inset);border-left-width:var(--sk-edge-w)}.sk .blk.e-r{right:var(--sk-inset);border-right-width:var(--sk-edge-w)}.sk .blk.e-t.e-l{border-top-left-radius:var(--sk-r)}.sk .blk.e-t.e-r{border-top-right-radius:var(--sk-r)}.sk .blk.e-b.e-l{border-bottom-left-radius:var(--sk-r)}.sk .blk.e-b.e-r{border-bottom-right-radius:var(--sk-r)}.sk .blk.pop{transform-origin:calc(var(--ox,.5) * 100%) calc(var(--oy,.5) * 100%)}.sk .blk.bad{--sk-edge-w:2.5px;border-color:var(--danger);background:color-mix(in srgb, var(--danger) 12%, color-mix(in srgb, var(--c) var(--sk-tint), var(--cell)))}.sk .cell.doomed .blk{opacity:.35}.sk .num{z-index:4;color:var(--foreground);font:700 clamp(12px, 4.4vw, 22px) / 1 var(--font-mono);font-size:min(26px, calc(100cqi / var(--cols) * .46));position:relative}.sk .cell:after{content:"";border-radius:inherit;box-shadow:inherit;pointer-events:none;position:absolute;inset:0}.sk-preview{z-index:3;pointer-events:none;left:calc((100% + var(--cell-gap)) * var(--x) / var(--cols));top:calc((100% + var(--cell-gap)) * var(--y) / var(--rows));width:calc((100% + var(--cell-gap)) * var(--w) / var(--cols) - var(--cell-gap));height:calc((100% + var(--cell-gap)) * var(--h) / var(--rows) - var(--cell-gap));border:2.5px dashed color-mix(in srgb, var(--foreground) 65%, transparent);border-radius:var(--sk-r);background:color-mix(in srgb, var(--foreground) 8%, transparent);transition:opacity .15s;position:absolute}.sk-preview[hidden]{display:none}.sk-preview.good{border-style:solid;border-color:var(--primary);background:color-mix(in srgb, var(--primary) 22%, transparent)}.sk-preview.off{opacity:.3}.sk-bubble{text-align:center;min-width:2em;font:700 clamp(13px, 3.6vw, 17px) / 1 var(--font-mono);background:var(--foreground);color:var(--background);border-radius:99px;padding:.25em .55em;position:absolute;top:0;left:0;translate:-35% -55%}.sk-preview.at-r .sk-bubble{left:auto;right:0;translate:35% -55%}.sk-preview.at-b .sk-bubble{top:auto;bottom:0;translate:-35% 55%}.sk-preview.at-r.at-b .sk-bubble{translate:35% 55%}.sk-preview.good .sk-bubble{background:var(--primary);color:var(--primary-foreground)}.is-done .sk .cell{cursor:default}@media (hover:hover){.sk .cell:not(.on):hover{background:color-mix(in srgb, var(--primary) 10%, var(--cell))}}.sk-preview{transition:left 80ms var(--ease-out), top 80ms var(--ease-out), width 80ms var(--ease-out), height 80ms var(--ease-out), opacity .15s ease}@keyframes sk-settle{0%{opacity:.6;transform:scale(.9)}60%{opacity:1;transform:scale(1.03)}}.sk .blk.settle{animation:sk-settle .18s var(--ease-out) both}