@layer normalize,base,demo,arrow;@layer normalize{html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}}@layer arrow{.arrow{mix-blend-mode:difference;font-family:Gloria Hallelujah,cursive;font-size:.875rem;position:absolute;left:135%;bottom:65%;rotate:26deg;transition:filter .26s ease-out,opacity .26s ease-out;filter:blur(4px);pointer-events:none;line-height:1.5;z-index:100;opacity:0}.arrow span{white-space:nowrap}.arrow svg{top:calc(100% + .5rem);position:absolute;translate:-50% 0;scale:-1 -1;left:-1rem;width:60px}[data-reveal] .arrow{opacity:.7;filter:blur(0px)}}@layer base{html{color-scheme:dark}*,*:after,*:before{box-sizing:border-box}body{background:light-dark(#fff,#000);display:grid;place-items:center;min-height:100vh;font-family:Noto Sans,SF Pro Text,SF Pro Icons,AOS Icons,Helvetica Neue,Helvetica,Arial,sans-serif,system-ui}body:before{--size: 45px;--line: color-mix(in hsl, canvasText, transparent 80%);content:"";height:100vh;width:100vw;position:fixed;background:linear-gradient(90deg,var(--line) 1px,transparent 1px var(--size)) calc(var(--size) * .36) 50% / var(--size) var(--size),linear-gradient(var(--line) 1px,transparent 1px var(--size)) 0% calc(var(--size) * .32) / var(--size) var(--size);-webkit-mask:linear-gradient(-20deg,transparent 50%,white);mask:linear-gradient(-20deg,transparent 50%,white);top:0;transform-style:flat;pointer-events:none;z-index:-1}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}}@layer demo{.grid{display:flex;flex-wrap:wrap;gap:10px;max-width:calc(100vw - 2rem);margin:0 auto;position:relative}.card{display:flex;flex-direction:column;gap:16px;max-width:100%;width:320px;aspect-ratio:390 / 450;background:#383838;padding:4px;position:relative;-webkit-tap-highlight-color:#0000;border-radius:24px;cursor:pointer;box-shadow:0 1px #ffffff14 inset,0 0 0 1px #ffffff0f,0 4px 12px -4px #0009}.card:is(:hover,:has(:focus-visible)) .card__body:before{opacity:1;transition-delay:var(--hover-delay)}.card:is(:hover,:has(:focus-visible)) a{background:#000;box-shadow:none;transition-delay:var(--hover-delay)}.card:is(:hover,:has(:focus-visible)) .icons{translate:50% 0;transition:translate .16s var(--hover-delay) ease-out}.card:is(:hover,:has(:focus-visible)) .icons svg{opacity:1;transition-delay:var(--hover-delay)}.card h2{display:grid}.card h2 span:first-of-type{text-transform:uppercase;font-size:.675rem;font-weight:800;color:#9a9a99}.card h2 span:last-of-type{font-size:1.5rem}.card:has(a:focus-visible){outline:2px solid white;outline-offset:2px}.card-stack{display:grid;transform-style:preserve-3d;perspective:200px}.card-stack>*{grid-area:1 / 1;transition:transform .26s cubic-bezier(.4,0,.2,1)}.card--blueprint{--print-line: hsl(210 0% 40% / 1);background:#ffffff1a;pointer-events:none;transform:translateZ(-50px);cursor:default}.card--blueprint,.card--blueprint *{position:relative}:is(.card--blueprint,.card--blueprint *):before,:is(.card--blueprint,.card--blueprint *):after{content:"";position:absolute;border:1px solid var(--print-line);inset:min(-10px,-5%) 0;clip-path:inset(2px 0 2px 0);z-index:10}:is(.card--blueprint,.card--blueprint *):after{inset:0 min(-10px,-5%);border:1px solid var(--print-line);clip-path:inset(0 2px 0 2px)}.card--blueprint .card__body a{overflow:visible;background:#0000;border:1px solid var(--print-line);box-shadow:none}.card--blueprint .card__body a .icons{width:100%;grid-template-columns:1fr}.card--blueprint .card__body a .icons svg path{fill:none;stroke:none}.card--blueprint .card__spotlight-carousel>ul{scroll-snap-type:none;overflow:hidden}.card--blueprint img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.card--blueprint .card__body{flex:1;align-items:end}.card--blueprint .card__body p,.card--blueprint .card__body h2 span{-webkit-text-stroke:1px var(--print-line);color:#0000}.card--blueprint .card__body:before{display:none}.card{transform-style:preserve-3d;transform-origin:50% 300%}[data-reveal] .card-stack>.card:not(.card--blueprint){transform:translateZ(20px) rotate(-10deg)}[data-reveal] .card--blueprint{transform:translateZ(0) rotate(6deg)}product-spotlight{display:block;aspect-ratio:385 / 315;overflow:hidden;position:relative;z-index:2;flex:1 0 auto;height:100%;width:100%}spotlight-carousel{display:block}.card__spotlight-carousel{border-radius:20px;aspect-ratio:385 / 315;width:100%;position:relative;z-index:20}.card__spotlight-carousel>ul{width:100%;height:100%;margin:0;padding:0;list-style-type:none;display:flex;overflow:auto;overscroll-behavior:none;scroll-snap-type:x mandatory;scrollbar-color:#0000 #0000;border-radius:20px;outline-color:#fff;outline-offset:2px;outline-width:2px}.card__spotlight-carousel>ul li{scroll-snap-align:center;width:100%;height:100%;flex:1 0 100%}.carousel__markers{position:absolute;top:calc(100% + 6px);translate:-50% 0;left:50%;right:0;z-index:3;display:flex;height:14px;justify-content:center;aspect-ratio:6 / 1}.carousel__markers button{all:unset;width:14px;height:14px;cursor:pointer;position:relative;box-sizing:border-box;opacity:.2;flex:1;border-radius:100px;min-width:14px;max-height:14px;padding:0;border:4px solid transparent}.carousel__markers button:after{content:"";position:absolute;inset:0;border-radius:100px;background:#fff}@supports (animation-timeline: scroll()){.carousel__markers button{animation:indicate both linear;animation-timeline:var(--timeline)}}@supports not (animation-timeline: scroll()){.carousel__markers button[aria-selected=true]{opacity:.6}}.carousel__markers button:focus-visible{outline:2px solid white;outline-offset:2px}@keyframes indicate{50%{flex:5;opacity:.6}}.card__meta{position:relative;display:grid;gap:2px}.card__body{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:0 10px;margin-bottom:10px;flex:1}.card__body:before{content:"";position:absolute;inset:0;border-radius:24px;opacity:0;background:#0000004d;transition:opacity .16s ease-out}.card__body h2{margin:0;line-height:1.1;letter-spacing:-.16px;color:#cfcfce}.card__body p{margin:0;font-weight:300;line-height:1.2;letter-spacing:-.24px;font-size:1.2rem;color:#91918f}.card__body a{color:inherit;text-decoration:none;outline:none;height:100%;aspect-ratio:1;display:grid;place-items:end;border-radius:99px;background:#141414;border:1px solid hsl(0 0% 100% / .2);transition:background .16s ease-out,box-shadow .16s ease-out;overflow:hidden;max-height:72px;translate:2px 0}.card__body a .icons{container-type:inline-size;height:100%;width:200%;display:grid;grid-template-columns:1fr 1fr;place-items:center}.card__body a svg{width:50%;opacity:.5;transition:opacity .18s ease-out}}div.tp-dfwv{width:256px;position:fixed;z-index:100}div.tp-dfwv .tp-rotv{max-height:calc(100vh - 16px);overflow:auto;border-radius:var(--bs-br)}div.tp-dfwv .tp-rotv>.tp-rotv_b{position:sticky;top:0;z-index:2;background:#45474c}@layer gem{.craft-link{width:40px;aspect-ratio:1;display:grid;place-items:center;translate:-1px -1px;border-radius:6px;color:inherit;position:fixed;top:1.25rem;left:1.25rem}.craft-link:is(:hover,:focus-visible) .spinner{opacity:1}.spinner{width:24px;opacity:.5}.spinner path{stroke-width:1px}.gem__bottom{transform-box:fill-box;transform-origin:center}.gem__bottom--top{--to: 360deg;--spin: 90deg;transform:scaleY(-1)}@media(prefers-reduced-motion:no-preference){.gem__bottom{animation:spin 30s infinite linear;animation-composition:add}.craft-link:is(:hover,:focus-visible) .gem__bottom{animation:spin 30s infinite linear,spin-less .65s cubic-bezier(.215,.61,.355,1)}}@keyframes spin-less{to{rotate:var(--spin, -90deg)}}@keyframes spin{to{rotate:var(--to, -360deg)}}}
