ll-color-spectrum{display:block}.spectrum__stage{position:relative}.spectrum__bar{display:flex;align-items:center;gap:4px;height:58px;cursor:pointer;touch-action:manipulation}.spectrum__seg{--f: 0;position:relative;display:block;flex:calc(1 + var(--f) * 1.6) 1 0;min-width:0;height:calc(30px + var(--f) * 24px);border-radius:calc(8px + var(--f) * 4px);background:var(--c);box-shadow:inset 0 0 0 1px #ffffff1f;transition:flex-grow .18s ease-out,height .18s ease-out,border-radius .18s ease-out,box-shadow .2s ease,transform .5s cubic-bezier(.34,1.56,.64,1) calc(var(--i) * 35ms),opacity .4s ease calc(var(--i) * 35ms)}.spectrum__seg.is-light{box-shadow:inset 0 0 0 1px #0000002e}.spectrum__seg.is-dark{box-shadow:inset 0 0 0 1px #ffffff38}.spectrum__seg.is-hot{z-index:1}.spectrum__seg.is-selected{box-shadow:0 0 0 2px var(--color-bg, #0b0b0c),0 0 0 4px var(--color-text, #f2f2ee)}.spectrum__seg.is-focus{box-shadow:0 0 0 2px var(--color-bg, #0b0b0c),0 0 0 4px var(--color-accent, #447dc4)}.spectrum__seg.is-soldout{opacity:.7}.spectrum__seg.is-soldout:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:repeating-linear-gradient(135deg,rgba(11,11,12,.38) 0 2px,transparent 2px 7px)}ll-color-spectrum:not(.is-ready) .spectrum__seg{transform:scaleY(0);opacity:0}.spectrum__card{--x: 0px;--arrow: 50%;position:absolute;left:0;bottom:calc(100% + 6px);z-index:5;width:170px;padding:6px;background:var(--color-surface-2, #1f1f22);border:1px solid var(--color-border, #2a2a2e);border-radius:calc(var(--radius, 14px) * .85);box-shadow:0 16px 32px #0000008c;transform:translate(var(--x),8px) scale(.94);transform-origin:var(--arrow) 100%;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .22s cubic-bezier(.34,1.4,.64,1)}ll-color-spectrum.is-hovering .spectrum__card{opacity:1;transform:translate(var(--x)) scale(1)}.spectrum__card:after{content:"";position:absolute;left:var(--arrow);bottom:-7px;width:12px;height:12px;margin-left:-6px;background:inherit;border-right:1px solid var(--color-border, #2a2a2e);border-bottom:1px solid var(--color-border, #2a2a2e);transform:rotate(45deg)}.spectrum__photo{position:relative;aspect-ratio:4 / 3;overflow:hidden;border-radius:calc(var(--radius, 14px) * .55);background:var(--c);transition:background .2s ease}.spectrum__photo img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .25s ease,transform .4s cubic-bezier(.2,.7,.2,1)}.spectrum__photo img.is-loaded{opacity:1;transform:scale(1)}.spectrum__photo.is-swatch img{display:none}.spectrum__photo.is-swatch{background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.35),transparent 60%),var(--c)}.spectrum__meta{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:8px 4px 2px;font-family:var(--font-mono, monospace);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase}.spectrum__name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spectrum__price{color:var(--color-accent, #447dc4);white-space:nowrap}.spectrum__price.is-out{color:var(--color-muted, #8d8d93)}.spectrum__inputs{position:relative;height:0;overflow:hidden}.spectrum__inputs input{position:absolute;width:1px;height:1px;margin:0;opacity:0}@media(prefers-reduced-motion:reduce){.spectrum__seg,.spectrum__card,.spectrum__photo img{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/10/assets/color-spectrum.css.map */
