.seam{position:relative;height:32px;overflow:hidden;background:var(--a)}.seam svg{display:block;width:100%;height:100%}.seam path{fill:none;stroke:var(--b);stroke-width:16px;stroke-dasharray:16px}.seam-top{stroke-dashoffset:16px}.seam[data-from=velvet]{--a:var(--velvet)}.seam[data-from=limestone]{--a:var(--limestone)}.seam[data-from=butter]{--a:var(--butter)}.seam[data-to=velvet]{--b:var(--velvet)}.seam[data-to=limestone]{--b:var(--limestone)}.seam[data-to=butter]{--b:var(--butter)}@media (prefers-reduced-motion:no-preference){html:not([data-motion=paused]) .seam:not(.is-dealt) .seam-top{visibility:hidden}html:not([data-motion=paused]) .seam:not(.is-dealt) .seam-bottom{stroke-dasharray:none}}.seam-riffle{position:absolute;inset:0;display:flex;gap:16px;padding-left:16px}.seam-riffle i{flex:none;width:16px;background:linear-gradient(var(--a) 50%,var(--b) 50%);animation:seam-flip .32s var(--ease-io) both}@keyframes seam-flip{0%{transform:perspective(64px) rotateX(0deg)}to{transform:perspective(64px) rotateX(180deg)}}main :is(.seam,:has(.seam))~* .seam,main :is(.seam,:has(.seam))~.seam{height:8px;background:repeating-linear-gradient(90deg,color-mix(in oklab,var(--b) 50%,var(--a)) 0 8px,transparent 8px 16px) var(--a)}main :is(.seam,:has(.seam))~* .seam>*,main :is(.seam,:has(.seam))~.seam>*{display:none}