/*! StyloftCSS v0.1.0 | MIT License */ @layer sl.tokens,sl.reset,sl.base,sl.layout,sl.components,sl.utilities;@property --sl-orbit{syntax:"<angle>";inherits:false;initial-value:0deg}@layer sl.components{.sl-btn[class*="sl-fx-"]{position:relative;isolation:isolate;overflow:hidden;min-block-size:3rem;padding:.8rem 1.4rem;border:1px solid var(--sl-accent);background:var(--sl-fx-bg,var(--sl-surface));color:var(--sl-fx-color,var(--sl-accent))}.sl-btn[class*="sl-fx-"]:not(:disabled):is(:hover,:focus-visible){background:var(--sl-fx-bg,var(--sl-surface));color:var(--sl-fx-color,var(--sl-accent))}.sl-fx-doors{--sl-fx-color:var(--sl-on-accent)}.sl-fx-doors::before,.sl-fx-doors::after{content:"";position:absolute;inset-block:0;inline-size:51%;background:var(--sl-accent);z-index:-1;pointer-events:none}.sl-fx-doors::before{inset-inline-start:0}.sl-fx-doors::after{inset-inline-end:0}.sl-fx-orbit{--sl-fx-bg:linear-gradient(var(--sl-surface),var(--sl-surface)) padding-box,conic-gradient(from var(--sl-orbit),var(--sl-accent),#a78bfa,#38bdf8,var(--sl-accent)) border-box}.sl-btn.sl-fx-orbit{border:2px solid transparent}.sl-fx-label{display:grid;overflow:hidden}.sl-fx-label > span{grid-area:1/1}.sl-fx-label > span:last-child{translate:0 150%}.sl-fx-spotlight::before,.sl-fx-diagonal::before{content:"";position:absolute;z-index:-1;pointer-events:none;background:var(--sl-accent)}.sl-fx-spotlight::before{inline-size:3rem;block-size:3rem;border-radius:50%;inset-inline-start:-1.5rem;inset-block-end:-1.5rem;scale:0}.sl-fx-diagonal::before{inset:-10% -30%;transform:skewX(-20deg) translateX(-120%)}.sl-fx-arrow{display:inline-block;transform:rotate(-45deg)}.sl-fx-depth{--sl-fx-bg:var(--sl-accent);--sl-fx-color:var(--sl-on-accent)}.sl-btn.sl-fx-depth{box-shadow:0 6px 0 var(--sl-accent-hover)}.sl-fx-frame::before,.sl-fx-frame::after{content:"";position:absolute;inset:4px;border:2px solid currentColor;border-radius:.2rem;pointer-events:none}.sl-fx-frame::before{border-inline:0;scale:0 1}.sl-fx-frame::after{border-block:0;scale:1 0}@media (prefers-reduced-motion:no-preference){.sl-btn[class*="sl-fx-"]{transition:color 350ms ease,box-shadow 350ms ease,transform 350ms cubic-bezier(.2,.7,.2,1)}.sl-fx-doors::before,.sl-fx-doors::after{transition:translate 450ms cubic-bezier(.2,.7,.2,1)}.sl-fx-doors:not(:disabled):is(:hover,:focus-visible){--sl-fx-color:var(--sl-accent)}.sl-fx-doors:not(:disabled):is(:hover,:focus-visible)::before{translate:-100% 0}.sl-fx-doors:not(:disabled):is(:hover,:focus-visible)::after{translate:100% 0}.sl-fx-orbit:not(:disabled):is(:hover,:focus-visible){animation:sl-orbit 1800ms linear infinite}.sl-fx-label > span{transition:translate 400ms cubic-bezier(.2,.7,.2,1)}.sl-fx-swap:not(:disabled):is(:hover,:focus-visible) .sl-fx-label > span:first-child{translate:0 -150%}.sl-fx-swap:not(:disabled):is(:hover,:focus-visible) .sl-fx-label > span:last-child{translate:0 0}.sl-fx-spotlight::before{transition:scale 550ms cubic-bezier(.2,.7,.2,1)}.sl-fx-spotlight:not(:disabled):is(:hover,:focus-visible)::before{scale:12}.sl-fx-diagonal::before{transition:transform 450ms cubic-bezier(.2,.7,.2,1)}.sl-fx-diagonal:not(:disabled):is(:hover,:focus-visible)::before{transform:skewX(-20deg) translateX(0)}.sl-fx-spotlight:not(:disabled):is(:hover,:focus-visible),.sl-fx-diagonal:not(:disabled):is(:hover,:focus-visible){--sl-fx-color:var(--sl-on-accent)}.sl-fx-arrow{transition:transform 400ms cubic-bezier(.2,.7,.2,1)}.sl-fx-runway:not(:disabled):is(:hover,:focus-visible) .sl-fx-arrow{transform:translateX(7px) rotate(0)}.sl-fx-depth:not(:disabled):is(:hover,:focus-visible){transform:translateY(3px);box-shadow:0 3px 0 var(--sl-accent-hover)}.sl-fx-depth:not(:disabled):active{transform:translateY(6px);box-shadow:none}.sl-fx-frame::before,.sl-fx-frame::after{transition:scale 400ms ease}.sl-fx-frame:not(:disabled):is(:hover,:focus-visible)::before,.sl-fx-frame:not(:disabled):is(:hover,:focus-visible)::after{scale:1}}}@keyframes sl-orbit{to{--sl-orbit:360deg}}