.ck{grid-template-columns:minmax(0,1fr);gap:16px;max-width:1200px;margin:0 auto;padding:6px 8px 0;display:grid}.ck__play{flex-direction:column;align-items:center;gap:8px;min-width:0;display:flex}.ck-mark{width:100%;height:100%;display:block}.ck-taken{min-width:0;display:block}@media (max-width:420px){.ck-chip{gap:3px;padding:3px 5px 3px 3px}.ck-chip.shell-chip--end{padding:3px 3px 3px 5px}.ck-chip .shell-chip__mark{width:18px;height:18px}.ck-chip .shell-chip__name{font-size:.82rem}.ck-chip .shell-chip__score{font-size:1.25rem}}@media (max-width:899px){.ck-status.is-note,.ck-status.is-result{font-size:1rem}}.ck-frame{width:100%;margin:0 auto}.ck--online .ck-frame{max-width:min(100%,560px,100dvh - 16px)}.ck-board{aspect-ratio:1;border:2.5px solid var(--ink);background-color:var(--paper);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;grid-template-rows:repeat(8,minmax(0,1fr));grid-template-columns:repeat(8,minmax(0,1fr));width:100%;display:grid;position:relative}.ck-light{background:var(--paper)}.ck-sq{appearance:none;background-color:var(--rule);width:100%;min-width:0;height:100%;color:inherit;cursor:default;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background-image:repeating-linear-gradient(-45deg,#0000 0 5px,#545b7721 5px 6.5px);border:0;border-radius:0;margin:0;padding:0;display:block;position:relative}.ck-sq.is-draggable{touch-action:none;cursor:grab}.ck-sq.is-target{cursor:pointer}.ck-sq:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;z-index:3}.ck-sq.is-last{background-color:#ffe45cb3}.ck-num{top:2px;color:var(--ink-soft);pointer-events:none;font-size:.75rem;line-height:1;position:absolute;inset-inline-start:3px}@media (max-width:899px){.ck-num{display:none}}.ck-piece{z-index:1;pointer-events:none;position:absolute;inset:0}.ck-art{width:100%;height:100%;display:block;overflow:visible}.ck-art__body{stroke:var(--ink);stroke-width:5px}.ck-art__ring{fill:none;stroke-width:3.5px}.ck-art__crown{fill:var(--marker);stroke:var(--ink);stroke-width:3.5px;stroke-linejoin:round}.ck-piece--b .ck-art__body,.ck-piece--B .ck-art__body{fill:var(--ink)}.ck-piece--b .ck-art__ring,.ck-piece--B .ck-art__ring{stroke:#fffdf552}.ck-piece--r .ck-art__body,.ck-piece--R .ck-art__body{fill:var(--o)}.ck-piece--r .ck-art__ring,.ck-piece--R .ck-art__ring{stroke:#fffdf580}.ck-sq .ck-art{filter:drop-shadow(1.5px 2px #1b234059)}.ck-sq.is-must:before{content:"";z-index:2;border:3px dashed var(--o);pointer-events:none;border-radius:50%;animation:1.6s linear infinite ck-must;position:absolute;inset:4%}@keyframes ck-must{to{transform:rotate(360deg)}}.ck-sq.is-selected{background-color:var(--marker)}.ck-sq.is-selected .ck-piece{transform:translateY(-4%)scale(1.06)}.ck-sq.is-lifted .ck-piece{opacity:.3}.ck-sq.is-target:after{content:"";z-index:2;border:3px solid var(--ink);opacity:.55;pointer-events:none;border-radius:50%;position:absolute;inset:33%}.ck-sq.is-jump:after{border-color:var(--o);opacity:1;background:radial-gradient(circle, var(--o) 0 22%, transparent 24%);border-width:4px;inset:26%}@media (hover:hover) and (pointer:fine){.ck-sq.is-target:hover{background-color:var(--paper-shade)}}.ck-sq.is-victim:after,.ck-sq.is-taken:after{content:"";z-index:2;pointer-events:none;background:linear-gradient(45deg, transparent 44%, var(--paper) 44% 56%, transparent 56%), linear-gradient(-45deg, transparent 44%, var(--paper) 44% 56%, transparent 56%);position:absolute;inset:22%}.ck-sq.is-taken .ck-piece{opacity:.4}.ck-piece.is-fading{animation:ck-fade .26s ease-in var(--delay,0s) both}@keyframes ck-fade{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.6)}}@media (prefers-reduced-motion:reduce){.ck-sq.is-must:before{animation:none}.ck-piece.is-fading{display:none}}.ck-ghost{top:0;z-index:30;pointer-events:none;will-change:transform;width:clamp(48px,10vmin,72px);height:clamp(48px,10vmin,72px);position:fixed;inset-inline-start:0}.ck-ghost[hidden]{display:none}.ck-ghost .ck-piece{position:absolute;inset:0}.ck-ghost .ck-art{filter:drop-shadow(3px 5px #1b234059)}@media (min-width:900px),(min-width:640px) and (max-height:500px){.ck{padding:16px var(--gutter) 0}}@media (min-width:900px) and (min-height:501px){.ck--online .ck-frame{max-width:min(100%,560px,max(330px,100dvh - 340px))}}