.game{align-items:center;gap:var(--space-3);flex-direction:column;flex:1;display:flex}.kbar{width:100%;max-width:400px;color:var(--ink-muted);font-variant-numeric:tabular-nums;justify-content:space-between;font-size:14px;display:flex}.kbar b{color:var(--ink)}.kboard{--n:7;width:min(400px, calc(100vw - 2 * var(--space-4)));aspect-ratio:1;grid-template-rows:repeat(var(--n), 1fr);border:3px solid var(--ink);border-radius:var(--radius-sm);touch-action:none;-webkit-user-select:none;user-select:none;display:grid;overflow:hidden}.krow{grid-template-columns:repeat(var(--n), 1fr);min-height:0;display:grid}.kcell{--tint:var(--kobalt);--amount:55%;border:1px solid color-mix(in srgb, var(--ink) 22%, transparent);background-color:color-mix(in srgb, var(--tint) var(--amount), var(--surface-raised));min-width:0;min-height:0;color:var(--ink);font:inherit;cursor:pointer;border-radius:0;place-items:center;padding:0;display:grid;position:relative}.kcell:focus-visible{box-shadow:inset 0 0 0 3px var(--ink);z-index:1;outline:none}.kcell.bt{border-top:3px solid var(--ink)}.kcell.bb{border-bottom:3px solid var(--ink)}.kcell.bl{border-left:3px solid var(--ink)}.kcell.br{border-right:3px solid var(--ink)}.r1{--tint:var(--mango);--amount:60%}.r2{--tint:var(--koralle)}.r3{--tint:var(--minze)}.r4{--amount:22%}.r5{--tint:var(--mango);--amount:25%}.r6{--tint:var(--koralle);--amount:25%}.r7{--tint:var(--minze);--amount:25%}.r8{--tint:var(--line-strong);--amount:45%}.r1,.r3,.r5,.r7{background-image:repeating-linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, var(--ink) 9%, transparent) 6px 8px)}.kcell .crown,.kcell .x{display:none}.kcell .crown{width:62%;height:62%;fill:var(--ink);stroke:var(--surface-raised);stroke-width:1.5px;paint-order:stroke}.kcell .x{color:color-mix(in srgb, var(--ink) 60%, transparent);font-size:clamp(14px,4.5vw,22px);line-height:1}.kcell.crowned .crown,.kcell.crossed:not(.crowned) .x{display:block}.kcell.bad{box-shadow:inset 0 0 0 3px var(--koralle)}.kcell.bad .crown{fill:var(--koralle);stroke:var(--ink)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .kcell{--amount:62%}:root:not([data-theme=light]) :is(.r4,.r5,.r6,.r7){--amount:36%}}:root[data-theme=dark] .kcell{--amount:62%}:root[data-theme=dark] :is(.r4,.r5,.r6,.r7){--amount:36%}.kcell:disabled{cursor:default}.kboard.solved{border-color:var(--minze)}.ktools{gap:var(--space-2);grid-template-columns:repeat(2,1fr);width:100%;max-width:400px;display:grid}.after{align-items:center;gap:var(--space-2);flex-direction:column;display:flex}.after p{margin:0}.kcell.hop .crown{animation:.48s ease-out both k-hop;animation-delay:inherit}@keyframes k-hop{40%{transform:translateY(-5px)scale(1.15)}}@media (prefers-reduced-motion:reduce){.kcell.hop .crown{animation:none}}