@property --sc-accent{syntax: "<color>"; inherits: true; initial-value: #ff3d8b;}.showcase{--sc-bg: #0b0b0d;--sc-fg: #f3f0ea;--sc-muted: rgba(243, 240, 234, .66);--sc-line: rgba(243, 240, 234, .24);--scene-h: max(380px, min( calc(100svh - 300px) , 600px));--stage-h: calc(var(--scene-h) * .66);--gap: 36cqw;--depth: 240px;--turn: 34deg;--thick: 12px;position:relative;display:block;overflow:hidden;isolation:isolate;background:var(--sc-bg);color:var(--sc-fg)}.showcase--light{--sc-bg: #e9e5de;--sc-fg: var(--c-ink);--sc-muted: var(--c-muted);--sc-line: var(--c-line)}.showcase__scene{position:relative;height:var(--scene-h)}.showcase__glow{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;transition:opacity 1.4s ease;background:radial-gradient(55% 48% at var(--focus-x, 50%) 44%,color-mix(in srgb,var(--glow, var(--sc-accent)) 70%,transparent),transparent 72%),radial-gradient(120% 70% at 50% 120%,color-mix(in srgb,var(--glow, var(--sc-accent)) 55%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in srgb,var(--sc-bg) 85%,var(--glow, var(--sc-accent))) 0%,var(--sc-bg) 38%,color-mix(in srgb,var(--sc-bg) 70%,var(--glow, var(--sc-accent))) 100%)}.showcase__glow.is-on{opacity:1}.showcase--light .showcase__glow{background:radial-gradient(55% 48% at var(--focus-x, 50%) 44%,color-mix(in srgb,var(--glow, var(--sc-accent)) 38%,transparent),transparent 72%),radial-gradient(120% 70% at 50% 120%,color-mix(in srgb,var(--glow, var(--sc-accent)) 30%,transparent),transparent 70%)}.showcase__words{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none}.showcase__word{grid-area:1 / 1;padding-bottom:6%;font-family:var(--font-display);font-size:clamp(64px,calc(150vw / var(--chars)),34svh);font-weight:800;line-height:.82;letter-spacing:-.01em;text-align:center;white-space:nowrap;color:color-mix(in srgb,var(--sc-fg) 16%,transparent);text-shadow:0 0 40px color-mix(in srgb,var(--sc-accent) 40%,transparent);opacity:0;transform:scale(1.04);transition:opacity 1.3s ease,transform 1.6s cubic-bezier(.33,0,.2,1)}.showcase__word.is-active{opacity:1;transform:none}.showcase__rig{position:absolute;top:0;right:0;bottom:0;left:0;perspective:1200px;perspective-origin:50% 42%}.showcase__stage{position:absolute;top:0;right:0;bottom:0;left:0;container-type:inline-size;transform-style:preserve-3d;transform:rotateX(calc(var(--py, 0) * -3deg)) rotateY(calc(var(--px, 0) * 5deg));transition:transform .8s cubic-bezier(.22,.8,.24,1);touch-action:pan-y;-webkit-user-select:none;user-select:none;outline:none}.showcase__stage:focus-visible{box-shadow:inset 0 0 0 2px var(--sc-fg)}.showcase__pedestal{position:absolute;left:50%;top:calc(46% + var(--item-h, var(--stage-h)) * .5 + 6px);width:min(62vw,calc(var(--stage-h) * .9));aspect-ratio:5 / 1;transform:translate(-50%,-30%);border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.75),rgba(0,0,0,.35) 70%,transparent),radial-gradient(closest-side,color-mix(in srgb,var(--sc-accent) 45%,transparent),transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--sc-fg) 22%,transparent),0 0 26px 2px color-mix(in srgb,var(--sc-accent) 55%,transparent),inset 0 6px 18px color-mix(in srgb,var(--sc-fg) 18%,transparent);pointer-events:none}.showcase__pedestal span{position:absolute;top:18%;right:10%;bottom:18%;left:10%;border-radius:50%;border-top:2px solid color-mix(in srgb,var(--sc-fg) 55%,transparent);filter:blur(1px)}.sc-item{--d: 0;--ad: 0;--xf: 0;position:absolute;left:50%;top:46%;z-index:calc(10 - var(--ad));width:min(56cqw,calc(var(--stage-h) * var(--ar)));aspect-ratio:var(--ar);transform-style:preserve-3d;transform:translate3d(-50%,-50%,0) translate3d(calc(var(--xf) * var(--gap)),calc(var(--ad) * -2%),calc(var(--ad) * var(--depth) * -1)) rotateY(calc(var(--d) * var(--turn) * -1)) rotate(calc(var(--tilt) * min(var(--ad),1)));transition:transform 1.3s cubic-bezier(.45,.05,.2,1),visibility 0s linear 0s;will-change:transform}.sc-item.is-far{visibility:hidden;pointer-events:none;transition:transform 1.3s cubic-bezier(.45,.05,.2,1),visibility 0s linear 1.3s}.sc-item.no-transition{transition:none}.sc-item__link,.sc-item__float,.sc-item__body{position:absolute;top:0;right:0;bottom:0;left:0;display:block;transform-style:preserve-3d}.sc-item__link{cursor:pointer;-webkit-user-drag:none}.sc-item__float{animation:sc-float 10s ease-in-out infinite;animation-delay:calc(var(--i) * -1.4s)}@keyframes sc-float{0%,to{transform:translate3d(0,-.9%,0) rotateY(-5deg) rotateX(1.5deg)}50%{transform:translate3d(0,.9%,0) rotateY(5deg) rotateX(-1.5deg)}}.sc-face{position:absolute;display:block;backface-visibility:hidden}.sc-face--front{top:0;right:0;bottom:0;left:0;overflow:hidden;background:#101010;transform:translateZ(.5px)}.sc-face--framed{box-shadow:inset 0 0 0 clamp(3px,.45vw,6px) #0b0b0b}.sc-face--framed img{padding:clamp(3px,.45vw,6px)}.sc-face--front img,.sc-face--front .tile__empty{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;pointer-events:none}.sc-face__glare{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(115deg,#fff3,#fff0 30% 70%,#ffffff12)}.sc-face__shade{position:absolute;top:0;right:0;bottom:0;left:0;background:#000;opacity:calc(var(--ad) * .24);transition:opacity 1.3s ease;pointer-events:none}.sc-face--back{top:0;right:0;bottom:0;left:0;background:#121212;transform:translateZ(calc(var(--thick) * -1)) rotateY(180deg)}.sc-face--left,.sc-face--right{top:0;bottom:0;width:var(--thick);background:linear-gradient(90deg,#050505,#2a2a2a 45%,#0d0d0d)}.sc-face--left{left:0;transform-origin:left center;transform:rotateY(90deg)}.sc-face--right{right:0;transform-origin:right center;transform:rotateY(-90deg)}.sc-face--top,.sc-face--bottom{left:0;right:0;height:var(--thick);background:linear-gradient(180deg,#2c2c2c,#0a0a0a)}.sc-face--top{top:0;transform-origin:center top;transform:rotateX(-90deg)}.sc-face--bottom{bottom:0;transform-origin:center bottom;transform:rotateX(90deg)}.showcase__head{position:absolute;top:14px;left:0;right:0;z-index:20;display:grid;gap:2px;pointer-events:none}.showcase__title{font-family:var(--font-display);font-size:clamp(1.25rem,2.2vw,1.75rem);font-weight:var(--display-weight);line-height:1;text-transform:uppercase}.showcase__intro{color:var(--sc-muted);font-size:var(--fs-small)}@media(max-width:749px){.showcase__intro{display:none}}.showcase__controls{position:absolute;left:50%;bottom:16px;z-index:20;display:flex;align-items:center;gap:8px;transform:translate(-50%)}.showcase__btn{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--sc-line);background:color-mix(in srgb,var(--sc-bg) 55%,transparent);color:var(--sc-fg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:border-color var(--dur-2)}.showcase__btn:hover{border-color:var(--sc-fg)}.showcase__btn:focus-visible{outline:2px solid var(--sc-fg);outline-offset:2px}.showcase__btn .icon{width:18px;height:18px}.showcase__count{min-width:48px;text-align:center;font-size:.875rem;font-weight:600;font-variant-numeric:tabular-nums}.showcase__btn--pause{margin-left:4px}.showcase__pause-icon{width:12px;height:14px;border-inline:4px solid currentColor}.showcase__btn--pause[aria-pressed=true] .showcase__pause-icon{width:0;height:0;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent currentColor;margin-left:3px}.showcase__progress{position:absolute;left:50%;bottom:-9px;width:120px;height:2px;transform:translate(-50%);background:var(--sc-line);overflow:hidden}.showcase__progress span{display:block;height:100%;width:100%;background:var(--sc-fg);transform-origin:left;transform:scaleX(0)}.showcase__progress.is-running span{animation:sc-progress var(--interval, 5s) linear forwards}@keyframes sc-progress{to{transform:scaleX(1)}}.showcase__panels{position:relative;z-index:25}.sc-panel{--c-ink: #f3f0ea;--c-ink-rgb: 243, 240, 234;--c-paper: #0b0b0d;--c-paper-rgb: 11, 11, 13;--c-muted: rgba(243, 240, 234, .66);--c-line: rgba(243, 240, 234, .2);--c-line-strong: rgba(243, 240, 234, .85);--c-veil: rgba(243, 240, 234, .42);display:grid;gap:10px;padding:16px var(--edge-x) 18px;color:var(--c-ink);animation:sc-panel-in .6s ease both}.showcase--light .sc-panel{--c-ink: #0d0d0d;--c-ink-rgb: 13, 13, 13;--c-paper: #efece6;--c-paper-rgb: 239, 236, 230;--c-muted: rgba(13, 13, 13, .64);--c-line: rgba(13, 13, 13, .14);--c-line-strong: rgba(13, 13, 13, .85);--c-veil: rgba(13, 13, 13, .42)}.sc-panel[hidden]{display:none}@keyframes sc-panel-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.sc-panel__eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--sc-accent) 55%,var(--c-ink))}.sc-panel__title{margin-top:-6px;font-family:var(--font-display);font-size:clamp(1.75rem,3.2vw,2.75rem);font-weight:var(--display-weight);line-height:.95;text-transform:uppercase}.sc-panel__title a{text-decoration:none}.sc-panel__text{color:var(--c-muted);font-size:var(--fs-small)}.sc-panel__price{font-size:1.375rem;font-weight:600;font-variant-numeric:tabular-nums}.sc-panel .variant-picker{gap:10px}.sc-panel .variant-picker__legend{margin-bottom:6px}.sc-panel .pill{min-height:44px;padding:7px 10px;font-size:.875rem;background:rgba(var(--c-paper-rgb),.35)}.sc-panel .variant-picker__input:checked+.pill{background:var(--c-ink)}.sc-panel .pill__sub,.sc-panel .pill__price{font-size:.75rem}.sc-panel .variant-picker__error{background:#ff3d8b29;color:#ff8fbd;border-left-color:#ff3d8b}.sc-panel .buy-buttons__form{gap:8px}.sc-panel .buy-buttons__add{min-height:52px}.sc-panel .buy-buttons__form.is-incomplete .buy-buttons__now{opacity:.55}.sc-panel__details{justify-self:start;font-size:var(--fs-small);text-decoration:underline}.showcase__links{position:relative;z-index:25;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-block:6px 22px}.showcase__link{min-height:48px;border-color:var(--sc-fg);background:transparent;color:var(--sc-fg)}@media(min-width:750px){.showcase{--scene-h: max(560px, min(80svh, 760px));--gap: 26cqw;--depth: 280px;--thick: 16px}.sc-item{width:min(40cqw,calc(var(--stage-h) * var(--ar)))}}@media(min-width:990px){.showcase{--scene-h: max(600px, calc(100svh - 190px) );--stage-h: calc(var(--scene-h) * .64);--gap: 22cqw;--depth: 300px;--turn: 32deg;--thick: 20px;--focus-x: 62%}.showcase__rig{left:min(32vw,440px)}.showcase__pedestal{width:min(34vw,calc(var(--stage-h) * .9))}.sc-item{width:min(36cqw,calc(var(--stage-h) * var(--ar)))}.showcase__words{left:min(32vw,440px)}.showcase__panels{position:absolute;top:50%;left:var(--edge-x);width:min(30vw,400px);transform:translateY(-46%)}.sc-panel{padding:0}.showcase__controls{left:calc(min(32vw,440px) + (100% - min(32vw,440px))/2)}.showcase__links{position:absolute;left:auto;right:var(--edge-x);bottom:18px;display:flex;width:auto;max-width:none;margin:0;padding:0}.showcase__link{min-height:44px;padding-inline:20px}}@media(min-width:990px)and (max-height:760px){.sc-panel{gap:8px}.sc-panel__text{display:none}}@media(prefers-reduced-motion:reduce){.showcase{transition:none}.showcase__stage{transform:none;transition:none}.sc-item{transform:translate3d(-50%,-50%,0);transition:opacity .3s ease}.sc-item:not(.is-active){opacity:0;pointer-events:none}.sc-item__float,.sc-panel,.showcase__progress span{animation:none}.showcase__word{transition:opacity .3s ease;transform:none;filter:none}}@media(max-width:749px){.sc-panel{gap:8px;padding-top:12px}.sc-panel__text,.sc-panel__details{display:none}.sc-panel__title{font-size:1.625rem}.showcase__controls{bottom:10px}}.showcase__arrow{position:absolute;top:46%;z-index:22;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid color-mix(in srgb,var(--sc-fg) 28%,transparent);background:color-mix(in srgb,var(--sc-bg) 45%,transparent);color:var(--sc-fg);transform:translateY(-50%);transition:background-color .3s ease,border-color .3s ease,transform .3s ease;cursor:pointer}.showcase__arrow .icon{width:20px;height:20px}.showcase__arrow--prev{left:max(var(--edge-x),10px)}.showcase__arrow--next{right:max(var(--edge-x),10px)}@media(hover:hover){.showcase__arrow:hover{background:var(--sc-fg);border-color:var(--sc-fg);color:var(--sc-bg)}}.showcase__arrow:active{transform:translateY(-50%) scale(.94)}.showcase__arrow:focus-visible{outline:2px solid var(--sc-fg);outline-offset:3px}.showcase__pause{position:absolute;left:50%;bottom:14px;z-index:22;padding:8px 14px;border-radius:999px;background:var(--sc-fg);color:var(--sc-bg);font-size:var(--fs-small);transform:translate(-50%);opacity:0;pointer-events:none}.showcase__pause:focus-visible{opacity:1;pointer-events:auto}@media(min-width:990px){.showcase__arrow--prev{left:calc(min(32vw,440px) + 12px)}.showcase__arrow{width:56px;height:56px}.showcase__pause{left:calc(min(32vw,440px) + (100% - min(32vw,440px))/2)}}@media(min-width:990px){.showcase__arrow--prev{left:16px}.showcase__arrow--next{right:16px}.showcase__panels{left:92px;width:min(28vw,380px)}}.showcase__orbit{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d;animation:sc-orbit 18s ease-in-out infinite}@keyframes sc-orbit{0%,to{transform:rotateY(-3.5deg) rotateX(1deg)}50%{transform:rotateY(3.5deg) rotateX(-1deg)}}.showcase{--thick: 16px}@media(min-width:750px){.showcase{--thick: 22px}}@media(min-width:990px){.showcase{--thick: 28px}}.sc-face--left{background:linear-gradient(90deg,#020202,#3a3a3a 55%,#111)}.sc-face--right{background:linear-gradient(90deg,#111,#1d1d1d 45%,#050505)}.sc-face--top{background:linear-gradient(180deg,#4a4a4a,#141414)}.sc-face__glare{background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.24) 32%,rgba(255,255,255,.06) 40%,transparent 52%);background-size:260% 100%;animation:sc-glass 9s ease-in-out infinite;mix-blend-mode:screen}@keyframes sc-glass{0%,to{background-position:100% 0}50%{background-position:0% 0}}.showcase__pedestal:after{content:"";position:absolute;left:22%;right:22%;top:8%;height:34%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.75),transparent)}@media(prefers-reduced-motion:reduce){.showcase__orbit,.sc-face__glare{animation:none}}.showcase__note{position:relative;z-index:25;padding-block:4px 26px;color:var(--sc-muted);font-size:var(--fs-small);line-height:1.5;text-align:center}@media(min-width:990px){.showcase__note{position:absolute;left:auto;right:var(--edge-x);bottom:18px;width:auto;max-width:420px;margin:0;padding:0;text-align:right}}.showcase__panels{padding-bottom:8px}
/*# sourceMappingURL=/cdn/shop/t/57/assets/showcase.css.map */
