.archive-motion,.archive-compare{display:block;color:var(--text)}.showcase-head,.showcase-foot{width:min(100% - 2 * var(--page-pad),1080px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.showcase-head{padding:28px 0;border-top:1px solid var(--rule)}.showcase-kicker{font:11px/1.5 var(--font-mono);color:var(--text-dim);letter-spacing:.12em;text-transform:uppercase}.showcase-head h2{margin-top:8px;font-size:clamp(22px,2.7vw,30px);line-height:1.15;letter-spacing:-.035em}.motion-toggle{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:12px 0 12px 14px;min-height:44px;border:0;background:transparent;color:var(--text-dim);font:11px var(--font-mono);cursor:pointer}.motion-toggle:hover{color:var(--text)}.motion-toggle[hidden]{display:none}.motion-toggle__icon{width:9px;height:10px;border-inline:2px solid currentColor}.motion-toggle[aria-pressed=true] .motion-toggle__icon{width:0;height:0;border:5px solid transparent;border-left:8px solid currentColor;border-right:0}.archive-motion__window{max-width:1600px;margin:auto;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}.archive-motion__row{overflow:hidden}.archive-motion__row+.archive-motion__row{margin-top:16px}.archive-motion__track{display:flex;width:max-content;animation:archive-drift 64s linear infinite;animation-play-state:paused}.archive-motion__row--reverse .archive-motion__track{animation-direction:reverse;animation-duration:72s}.archive-motion[data-running=true] .archive-motion__track{animation-play-state:running}.archive-motion__group{display:flex;gap:16px;padding-right:16px}.archive-motion__link{display:block;flex:0 0 auto}.archive-motion__link:hover .archive-motion__card{border-color:#777}.archive-motion__link:focus-visible{outline-offset:-3px}.archive-motion__track:has(.archive-motion__link:focus-visible){animation-play-state:paused}.archive-motion__card{flex:0 0 auto;width:clamp(220px,27vw,310px);margin:0;padding:22px 16px 12px;background:#090909;border:1px solid var(--rule)}.archive-motion__card figcaption{display:flex;justify-content:space-between;margin-top:17px;font:10px/1.5 var(--font-mono);color:var(--text-dim);letter-spacing:.07em}.archive-motion__card figcaption>span:last-child{color:#555}.showcase-device{position:relative;width:100%;aspect-ratio:1.65}.showcase-device__desktop{position:absolute;top:0;left:0;width:89%;aspect-ratio:16 / 10;border:4px solid #181818;border-bottom-width:9px;border-radius:7px;box-shadow:0 0 0 1px #454545,0 12px 18px #0006;background:#17191b}.showcase-device__desktop:after{content:"";position:absolute;left:-4%;bottom:-12px;width:108%;height:4px;background:#464646;border-radius:1px 1px 50% 50%}.showcase-device img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.showcase-device__phone{position:absolute;width:25%;aspect-ratio:9 / 19.5;right:0;bottom:0;overflow:hidden;border:3px solid #171717;border-radius:11%/5%;box-shadow:0 0 0 1px #666,0 10px 20px #0009;background:#17191b;container-type:inline-size}.showcase-device__time{position:absolute;top:12%;left:0;width:100%;text-align:center;font-size:23cqw;font-weight:700;line-height:1;color:#fff;text-shadow:0 1px 5px #0006}.showcase-device__home{position:absolute;bottom:3%;left:34%;width:32%;height:2px;background:#fff9;border-radius:5px}.archive-motion .showcase-device__time{display:none}.showcase-foot{padding-block:20px 32px}.showcase-foot a,.archive-compare__link{font:11px/1.6 var(--font-mono)}.showcase-foot a{white-space:nowrap}.showcase-foot a:hover,.archive-compare__link:hover{text-decoration:underline;text-underline-offset:5px}@keyframes archive-drift{to{transform:translate(-50%)}}.archive-compare{max-width:var(--page-max);margin:24px auto 0;padding:48px var(--page-pad) 64px;border-top:1px solid var(--rule)}.archive-compare__copy{display:grid;grid-template-columns:1fr 1fr;column-gap:64px}.archive-compare__copy>.showcase-kicker{grid-column:1 / -1}.archive-compare__copy h2{grid-column:1;grid-row:2 / 5;align-self:center}.archive-compare__copy>.archive-compare__lead,.archive-compare__copy>.archive-compare__hint,.archive-compare__copy>.archive-compare__link{grid-column:2}.archive-compare__copy h2{margin-top:17px;font-size:clamp(30px,3.5vw,42px);line-height:1.04;letter-spacing:-.045em}.archive-compare__copy h2 span{color:var(--text-dim)}.archive-compare__lead{max-width:47ch;margin-top:17px;color:var(--text-dim);font-size:14px;line-height:1.65}.archive-compare__hint{display:flex;align-items:center;gap:10px;margin-top:14px;font:11px/1.6 var(--font-mono)}.archive-compare__hint>span{font-size:23px}.archive-compare__link{display:inline-block;justify-self:start;margin-top:6px;border-bottom:1px solid var(--rule);padding-block:8px}.archive-compare__visual{min-width:0;margin-top:32px}.archive-compare__stage{position:relative;aspect-ratio:16 / 9;overflow:hidden;border:1px solid #303030;background:#0a0a0a;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize}.archive-compare__stage:focus-within{outline:2px solid var(--text);outline-offset:5px}.archive-compare__scene,.archive-compare__art{position:absolute;top:0;right:0;bottom:0;left:0}.archive-compare__scene{bottom:auto;aspect-ratio:3 / 2;pointer-events:none}.archive-compare__room{position:absolute;inset:0 0 auto;width:100%;height:auto;pointer-events:none}.archive-compare__art{pointer-events:none}.archive-compare__art[hidden]{display:none}.studio-screens{position:absolute;top:0;right:0;bottom:0;left:0}.studio-screen{position:absolute;overflow:hidden;background:#20242a}.studio-screen img{width:100%;height:100%;object-fit:cover}.studio-screen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(120deg,#ffffff07,transparent 55%,#00000012);box-shadow:inset 0 0 3px #0008}.studio-screen--monitor{left:29.56%;top:11.23%;width:41.34%;height:30.27%}.studio-screen--laptop{left:11.33%;top:40.14%;width:19.92%;height:17.48%;clip-path:polygon(0 2.23%,98.37% 0,100% 94.97%,.33% 100%)}.studio-screen--phone{left:71.16%;top:44.97%;width:4.75%;height:13.77%;border-radius:8%/4%;container-type:inline-size}.studio-screen__notch{position:absolute;z-index:1;top:0;left:45.3%;width:9.2%;height:4.3%;border-radius:0 0 2px 2px;background:#101113;transform:rotate(-.7deg)}.studio-screen--phone .studio-screen__notch{left:25%;width:49%;height:2.3%;border-radius:0 0 3px 3px}.studio-screen__time{position:absolute;top:11%;left:0;width:100%;text-align:center;font:700 23cqw/1 var(--font-display);color:#fff;text-shadow:0 1px 6px #0008}.studio-screen__home{position:absolute;bottom:3%;left:34%;width:32%;height:2px;background:#fffb;border-radius:5px}.studio-screens--neutral .studio-screen{background:radial-gradient(ellipse at 75% 25%,#718392,#33424e 38%,#17232d 62%,#080e17 95%)}.studio-screens--neutral .studio-screen:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(150deg,transparent 44%,#c1d2d72e 44.5%,#8fadb718 60%,transparent 60.5%)}.archive-compare__scene--before{clip-path:inset(0 calc(100% - var(--position)) 0 0)}.archive-compare__label{position:absolute;top:20px;padding:5px 8px;background:#090909b3;font:10px/1.4 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;pointer-events:none}.archive-compare__label--before{left:16px}.archive-compare__label--after{right:16px}.archive-compare__divider{position:absolute;inset:0 auto 0 var(--position);width:1px;background:#fffc;pointer-events:none}.archive-compare__divider>span{position:absolute;top:50%;left:0;display:grid;place-items:center;width:44px;height:44px;transform:translate(-50%,-50%);border-radius:50%;border:1px solid #fff;background:#f1f0eb;color:#111;font-size:24px;box-shadow:0 3px 16px #0006}.archive-compare__range{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}.archive-compare__toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:18px}.archive-compare__choices{display:flex;gap:8px}.archive-compare__choice{min-height:44px;display:flex;align-items:center;gap:7px;padding:4px 8px 4px 4px;border:1px solid var(--rule);background:transparent;font:10px var(--font-mono);color:var(--text-dim);cursor:pointer}.archive-compare__choice[aria-pressed=true]{color:var(--text);border-color:#aaa}.archive-compare__choice:hover{border-color:var(--text)}.archive-compare__choice img{width:23px;height:32px;object-fit:cover}.archive-compare__choice[aria-busy=true]{opacity:.5}.archive-compare__error{padding-top:12px}.no-js .archive-motion__group[aria-hidden],.no-js .archive-compare__toolbar,.no-js .archive-compare__hint{display:none}.no-js .archive-motion__row{overflow-x:auto}.no-js .archive-motion__track{animation:none}.no-js .archive-compare__range{display:none}@media(max-width:900px){.archive-compare__copy{column-gap:32px}.archive-compare__toolbar{align-items:flex-start;flex-direction:column}}@media(max-width:640px){.showcase-head{gap:14px;padding-block:24px}.showcase-head h2{max-width:18ch}.showcase-kicker{font-size:9px}.motion-toggle{font-size:10px;flex-shrink:0}.archive-motion__window{-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}.archive-motion__card{width:220px;padding:18px 14px 10px}.archive-motion__row+.archive-motion__row{margin-top:10px}.archive-motion__group{gap:10px;padding-right:10px}.showcase-foot{gap:14px;align-items:flex-start}.showcase-foot .meta,.showcase-foot a{font-size:10px}.archive-compare{margin-top:8px;padding-block:28px 40px}.archive-compare__copy{display:block}.archive-compare__visual{margin-top:22px}.archive-compare__copy h2{font-size:36px;margin-top:12px}.archive-compare__lead{max-width:42ch;margin-top:14px}.archive-compare__hint{margin-top:15px}.archive-compare__link{margin-top:10px}.archive-compare__divider>span{width:36px;height:36px;font-size:20px}.studio-screen__home{height:1px}.archive-compare__label{top:14px;font-size:9px}.archive-compare__toolbar{flex-direction:row;align-items:center;flex-wrap:wrap}.archive-compare__toolbar>.meta{font-size:10px}.archive-compare__choice{gap:5px;padding-right:6px;font-size:9px}}@media(prefers-reduced-motion:reduce){.archive-motion__track{animation:none}.archive-motion__group[aria-hidden]{display:none}.archive-motion__row{overflow-x:auto;scrollbar-width:thin}.motion-toggle{display:none}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/archive-showcase.css.map */