@source "./";.code-view pre{font-family:var(--pui-font-code);background:0 0!important}.code-view .shiki span{color:var(--shiki-dark)}:root[data-theme=light] .code-view .shiki span{color:var(--shiki-light)}.thumb-still *,.thumb-still :before,.thumb-still :after{transition:none!important;animation:none!important}.cat-tile{width:var(--cat-size,20px);height:var(--cat-size,20px);border-radius:calc(var(--cat-size,20px) * .3);background:var(--lightningcss-light,oklch(.9 .08 var(--cat-h)))var(--lightningcss-dark,oklch(.38 .09 var(--cat-h)));color:var(--lightningcss-light,oklch(.36 .13 var(--cat-h)))var(--lightningcss-dark,oklch(.92 .07 var(--cat-h)));flex-shrink:0;place-items:center;display:inline-grid}.cat-tile>svg{width:62%;height:62%}.hero-sticker{rotate:calc(var(--t,0) * 1deg * var(--pui-tilt))}.style-panel{width:clamp(272px,15vw + 48px,440px)}.style-panel[data-state=rail]{width:84px}.style-looks{--pui-radio-cards-card-width:104px}.style-look-card{gap:var(--pui-space-2);padding:6px 6px 8px}.style-look-media{aspect-ratio:16/10}.style-looks-rail{gap:6px}.style-look-tile{flex-direction:column;align-items:stretch;gap:5px;padding:4px 4px 6px}.style-look-tile .style-look-media{aspect-ratio:auto;width:100%;height:36px}[data-slot=look-preview][data-look=glass]{--pui-page-pattern:radial-gradient(55% 70% at 18% 20%, var(--lightningcss-light,oklch(from var(--pui-accent) .78 .12 h / .85))var(--lightningcss-dark,oklch(from var(--pui-accent) .52 .15 h / .9)), transparent 72%) 0 0 / 100% 100% no-repeat, radial-gradient(50% 65% at 88% 88%, var(--lightningcss-light,oklch(from var(--pui-accent) .8 .11 calc(h + 60) / .8))var(--lightningcss-dark,oklch(from var(--pui-accent) .5 .14 calc(h + 60) / .85)), transparent 72%) 0 0 / 100% 100% no-repeat, repeating-linear-gradient(90deg, var(--lightningcss-light,#141e3c0f)var(--lightningcss-dark,#ffffff0a) 0 1px, transparent 1px 24px), repeating-linear-gradient(0deg, var(--lightningcss-light,#141e3c0f)var(--lightningcss-dark,#ffffff0a) 0 1px, transparent 1px 24px)}.look-preview-face{font-family:var(--pui-font-display);font-stretch:var(--pui-heading-stretch);font-weight:var(--pui-weight-title);letter-spacing:var(--pui-tracking-display)}[data-faces] .look-preview-face,[data-faces] .look-preview-scale{transition:opacity var(--pui-duration-morph) var(--pui-ease-default)}[data-faces=loading] .look-preview-face,[data-faces=loading] .look-preview-scale{opacity:0}.look-preview-scale{transform-origin:0 0;width:200%;height:200%;transform:scale(.5)}.look-preview-scale:dir(rtl){transform-origin:100% 0}.skel{pointer-events:none;position:relative;container-type:inline-size}.skel-v{position:relative}@container (width<600px){.skel-d{display:none}}@container (width>=600px){.skel-p{display:none}}.skel-v>i{left:calc(var(--x) * 0.1%);width:calc(var(--w) * 0.1%);top:calc(var(--y) * 1px);height:calc(var(--h) * 1px);border-radius:calc(var(--r,0) * 1px);position:absolute}.skel-v>.k0{background:var(--m-surface-bg);box-shadow:var(--m-surface-edge)}.skel-v>.k1{background:var(--m-field-bg);box-shadow:inset 0 0 0 1px var(--m-field-ring)}.skel-v>:is(.k2,.k3,.k4,.k5,.k6,.k7){isolation:isolate;background-color:color-mix(in oklab, var(--pui-ink) 9%, transparent);overflow:hidden}.skel-v>.k2{background-color:color-mix(in oklab, var(--pui-ink) 7%, transparent)}.skel-v>.k3{top:calc(var(--y) * 1px + (var(--h) * 1px - max(4px, var(--h) * .56px)) / 2);height:max(4px, var(--h) * .56px);border-radius:999px}.skel-v>.k4{background-color:color-mix(in oklab, var(--pui-ink) 5%, transparent)}.skel-v>.k6{background-color:color-mix(in oklab, var(--pui-ink) 8%, transparent);border-radius:0;mask-image:linear-gradient(#000 0% 35%,#0000 100%)}.skel-v>:is(.k2,.k3,.k4,.k5,.k6,.k7):after{content:"";inset-block:0;left:calc(var(--x) * -.1cqw);pointer-events:none;background:linear-gradient(90deg, transparent 0%, transparent 32%, color-mix(in oklab, var(--pui-ink) 9%, transparent) 50%, transparent 68%, transparent 100%) 0 0 / 100cqw 100% repeat-x;width:300cqw;animation:skel-band calc(1.8s * var(--pui-motion-look,1) * var(--pui-motion-scale,1)) linear infinite;position:absolute}.skel-v>.k4:after{opacity:.6}@keyframes skel-band{0%{transform:translate(-33.3333%)}to{transform:translate(0)}}.skel[data-band=off]>.skel-v>i:after,[data-motion=reduced] .skel>.skel-v>i:after,[data-motion=none] .skel>.skel-v>i:after{display:none}@media (prefers-reduced-motion:reduce){.skel>.skel-v>i:after{display:none}}.stage-slot{position:relative}.stage-slot[data-state=waiting]>.stage-live{opacity:0;pointer-events:none;position:absolute;inset:0 0 auto}.stage-slot:is([data-state=arming],[data-state=reveal])>.skel{position:absolute;inset:0 0 auto}.stage-slot[data-state=arming]>.stage-live{opacity:0}.stage-slot[data-state=reveal]>.stage-live{animation-name:stage-arrive,stage-settle;animation-duration:var(--pui-duration-morph), var(--pui-duration-considered);animation-duration:max(var(--pui-duration-morph), var(--pui-fade-out)), var(--pui-duration-considered);animation-timing-function:var(--pui-ease-default), var(--pui-ease-standard);animation-fill-mode:both;animation-delay:calc(var(--reveal-i,0) * var(--pui-stagger-item))}.stage-slot[data-state=reveal]>.skel{animation:stage-leave var(--pui-fade-out) var(--pui-ease-default) both;animation-delay:calc(var(--reveal-i,0) * var(--pui-stagger-item) + var(--pui-fade-in))}.card-arrive{animation:stage-arrive max(var(--pui-duration-morph), var(--pui-fade-out)) var(--pui-ease-default) both}@keyframes stage-arrive{0%{opacity:0}}@keyframes stage-settle{0%{scale:calc(1 - .012 * var(--pui-motion-travel,1))}}@keyframes stage-leave{to{opacity:0}}
