.cs{gap:14px}.cs-banner{color:var(--muted);font-weight:600}.cs-tubes{display:grid;grid-template-columns:repeat(var(--per-row),minmax(0,54px));justify-content:center;gap:22px clamp(6px,2.4vw,16px);width:100%;max-width:640px;padding:18px 4px 6px}.cs-tube{appearance:none;font:inherit;color:inherit;cursor:pointer;padding:4px 4px 5px;margin:0;width:100%;aspect-ratio:1 / 3.4;border:3px solid color-mix(in oklab,var(--cell-strong) 55%,transparent);border-top-width:2px;border-radius:6px 6px 26px 26px/6px 6px 22px 22px;background:color-mix(in oklab,var(--surface-2) 70%,transparent);box-shadow:inset 6px 0 #ffffff2e;transition:transform .16s ease-out,border-color .2s,box-shadow .2s;position:relative}.cs-tube:hover{border-color:color-mix(in oklab,var(--accent) 60%,var(--cell-strong))}.cs-tube.selected{transform:translateY(-16px);border-color:var(--accent);box-shadow:inset 6px 0 #ffffff2e,0 8px 18px color-mix(in oklab,var(--accent) 30%,transparent)}.cs-inner{width:100%;height:100%;display:flex;flex-direction:column-reverse;justify-content:flex-start;border-radius:2px 2px 20px 20px/2px 2px 17px 17px;overflow:hidden}.cs-layer{flex:0 0 25%;display:grid;place-items:center;background:linear-gradient(90deg,color-mix(in oklab,var(--lc) 85%,#000) 0%,var(--lc) 30%,color-mix(in oklab,var(--lc) 80%,#fff) 55%,var(--lc) 80%);box-shadow:inset 0 1px #ffffff2e;transform-origin:bottom}.cs-layer.lift{filter:brightness(1.12)}.cs-layer.in{animation:cs-fill .26s ease-out backwards}@keyframes cs-fill{0%{transform:scaleY(0);opacity:.4}to{transform:scaleY(1);opacity:1}}.cs-sym{width:62%;height:62%;fill:#fff;stroke:#00000059;stroke-width:.8}.cs-layer.on-light .cs-sym{fill:#14141eb8;stroke:#fff6}.cs-sym circle[fill=none]{stroke:#fff}.cs-layer.on-light .cs-sym circle[fill=none]{stroke:#14141eb8}.cs-tube.pour-out{animation:cs-tilt .28s ease-out}@keyframes cs-tilt{0%{transform:translateY(-16px) rotate(0)}45%{transform:translateY(-20px) rotate(-14deg)}to{transform:none}}.cs-tube.done{border-color:var(--good)}.cs-tube.done:after{content:"✓";position:absolute;left:50%;top:-22px;transform:translate(-50%);color:var(--good);font-weight:800;font-size:1rem;animation:cs-pop .3s ease-out}@keyframes cs-pop{0%{transform:translate(-50%) scale(0)}70%{transform:translate(-50%) scale(1.3)}to{transform:translate(-50%) scale(1)}}.cs-tube.hint-from,.cs-tube.hint-to{animation:cs-hint .6s ease-in-out 3}.cs-tube.hint-from{border-color:var(--focus)}.cs-tube.hint-to{border-color:var(--focus);border-style:dashed}@keyframes cs-hint{50%{transform:translateY(-8px)}}.cs-tubes.solved .cs-tube{animation:cs-cheer .52s ease-in-out;animation-delay:calc(var(--k, 0) * 40ms)}@keyframes cs-cheer{30%{transform:translateY(-14px)}60%{transform:translateY(2px)}}.cs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media (max-width: 400px){.cs-tube{border-width:2px;padding:3px}}