.cycler{position:relative;display:block;container-type:inline-size}.deck{position:relative;aspect-ratio:var(--deck-ratio, 4 / 5)}.deck:before{content:"";position:absolute;z-index:0;top:4%;right:-4%;bottom:-2%;left:-4%;border-radius:50%;background:radial-gradient(ellipse at center,rgb(31 42 68 / .3),transparent 68%);opacity:var(--deck-shadow-alpha, 0);filter:blur(.45rem);pointer-events:none}.deck__layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:var(--deck-radius, var(--radius-2xl));background-color:var(--layer-color, var(--color-butter-yellow));transition:translate .62s var(--ease-spring),scale .62s var(--ease-spring),rotate .62s var(--ease-spring),opacity .5s var(--ease-out)}.deck__layer img{width:100%;height:100%;object-fit:cover;transition:opacity .45s var(--ease-out)}.deck__layer[data-layer=back]{z-index:1;translate:var(--deck-offset-x, 4.5%) var(--deck-offset-y, 4%);scale:1}.deck__layer[data-layer=back] img{opacity:0}.deck__layer[data-layer=front]{z-index:2;translate:0 0;scale:1;box-shadow:0 .9rem 1.25rem rgb(31 42 68 / calc(var(--deck-shadow-alpha, 0) * .7))}.deck__layer[data-layer=front] img{opacity:1}.deck__layer[data-state=popping]{translate:62% -4%;rotate:7deg;scale:.88;opacity:0}.deck__layer[data-state=rising]{z-index:2;translate:0 0;scale:1}.deck__layer[data-state=rising] img{opacity:1}.deck__layer[data-state=waiting]{transition:none}.cycler[data-animation=fade] .deck__layer[data-state=popping]{translate:0 0;rotate:0deg;scale:1;opacity:0}.deck__empty{display:grid;place-items:center;height:100%;padding:var(--space-6);color:var(--color-navy-500);font-family:var(--font-accent);font-size:var(--text-sm);font-weight:700;text-align:center}.deck__indicator{position:absolute;z-index:3;inset-block-end:var(--space-4);inset-inline-start:var(--space-4);display:flex;align-items:center;gap:var(--space-2);overflow:hidden;max-width:8rem}.deck__indicator [data-dot]{position:relative;overflow:hidden;flex:0 0 auto;width:.5rem;height:.5rem;border-radius:var(--radius-pill);background:color-mix(in srgb,var(--color-cream-500) 55%,transparent);transition:width .4s var(--ease-spring),margin .4s var(--ease-spring),opacity .3s var(--ease-out)}.deck__indicator [data-dot=active]{width:2.75rem;background:color-mix(in srgb,var(--color-cream-500) 40%,transparent)}.deck__indicator [data-dot=active] [data-fill]{display:block;height:100%;border-radius:inherit;background:var(--color-cream-500);animation:deck-fill var(--fill-duration, 5s) linear forwards}.deck__indicator [data-dot=leaving]{width:0;margin-inline-end:calc(var(--space-2) * -1);opacity:0}.deck__next{position:absolute;z-index:5;inset-block-start:50%;inset-inline-end:var(--space-3);display:grid;place-items:center;width:2.75rem;height:2.75rem;translate:0 -50%;padding:0;border:0;border-radius:var(--radius-pill);background:color-mix(in srgb,var(--color-surface) 55%,transparent);color:var(--color-text);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:background-color .18s var(--ease-out),transform .18s var(--ease-spring)}.deck__next:hover{background:color-mix(in srgb,var(--color-surface) 88%,transparent);transform:scale(1.06)}.deck__next svg{width:1.25rem;height:1.25rem}@keyframes deck-fill{0%{width:var(--fill-from, 0%)}to{width:100%}}.deck-ring{z-index:0;aspect-ratio:1;color:var(--color-blue-500);opacity:.72;border-width:2.5px;--deck-ring-x: -10%;--deck-ring-y: 0%;inset-inline-start:var(--deck-ring-x);inset-block-start:var(--deck-ring-y)}@media not (min-width:60rem){.deck-ring{--deck-ring-x: -6%;--deck-ring-y: -10%}}.deck-decor{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;pointer-events:none}.deck-decor>*{position:absolute}.deck-badge-round{display:grid;place-items:center;width:clamp(5rem,4rem + 5cqi,7.5rem);aspect-ratio:1;padding:var(--space-2);border-radius:50%;background:var(--color-blue-500);box-shadow:0 .35rem color-mix(in srgb,var(--color-blue-500) 72%,black);color:var(--color-cream-500);font-family:var(--font-accent);text-align:center;line-height:1.1;rotate:-8deg;text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;transition:transform .2s var(--ease-spring),box-shadow .2s var(--ease-out)}.deck-decor .deck-badge-round{pointer-events:auto;cursor:pointer}.deck-badge-round:hover,.deck-badge-round:focus-visible{transform:translateY(-.2rem) scale(1.03);box-shadow:0 .5rem color-mix(in srgb,var(--color-blue-500) 72%,black)}.deck-badge-round small{display:block;font-size:var(--text-2xs);font-weight:600;letter-spacing:var(--tracking-caps);opacity:.85}.deck-badge-round strong{display:block;font-size:clamp(.74rem,.56rem + .82cqi,.98rem);font-weight:800;letter-spacing:.02em;text-transform:uppercase}.deck-badge-pill{display:inline-flex;align-items:center;gap:var(--space-2);padding:.6rem 1rem;border-radius:var(--radius-pill);background:var(--color-cream-500);box-shadow:var(--shadow-md);color:var(--color-navy-500);font-family:var(--font-accent);font-size:var(--text-sm);font-weight:700;white-space:nowrap}.deck-badge-pill svg{width:1.1em;height:1.1em;color:var(--color-blue-500)}.deck-spark{color:var(--color-blue-500);font-size:clamp(3rem,2rem + 4cqi,5rem);line-height:1;rotate:-12deg}.flip{position:relative;overflow:hidden;aspect-ratio:var(--flip-ratio, 1 / 1);border-radius:var(--flip-radius, var(--radius-2xl));background-color:var(--layer-color, var(--color-cream-100))}.flip [data-slide]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0}.flip [data-slide] img{width:100%;height:100%;object-fit:contain}.flip [data-slide][data-state=current]{opacity:1;translate:0 0;animation:flip-settle .9s var(--ease-out) both}.flip [data-slide][data-state=leaving]{opacity:0;transition:opacity .55s cubic-bezier(.16,.84,.44,1)}@keyframes flip-settle{0%{opacity:0;translate:0 var(--flip-rise, 5%)}45%{opacity:1}to{opacity:1;translate:0 0}}.cycler[data-animation=fade-scale] .flip [data-slide][data-state=current]{animation:flip-scale-in .75s var(--ease-spring) both}.cycler[data-animation=fade-scale] .flip [data-slide][data-state=leaving]{opacity:0;scale:1.06;transition:opacity .45s var(--ease-out),scale .45s var(--ease-out)}@keyframes flip-scale-in{0%{opacity:0;scale:.9;translate:0 var(--flip-rise, 5%)}to{opacity:1;scale:1;translate:0 0}}@media(prefers-reduced-motion:reduce){.deck__layer,.flip [data-slide]{transition:none;animation:none}.deck__indicator{display:none}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/image-cycler.css.map */