@layer mlola.motion {
@keyframes ml-spin{to{transform:rotate(360deg)}}@keyframes ml-pulse{50%{opacity:.5}}@keyframes ml-fade-in{0%{opacity:0}to{opacity:1}}@keyframes ml-pop-in{0%{opacity:0;transform:translateY(4px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ml-dialog-in{0%{opacity:0;transform:translate(-50%,-48%)scale(.96)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}@keyframes ml-toast-in{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:translateY(0)}}@keyframes ml-slide-left{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes ml-slide-right{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes ml-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes ml-slide-down{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes ml-panel-in{0%{opacity:0;transform:var(--ml-enter-from)}}@keyframes ml-shimmer{0%{background-position:200%}to{background-position:-200%}}.ml-animate-pop{animation:ml-pop-in var(--ml-duration-normal) var(--ml-ease-bounce) both}.ml-animate-slide-left{animation:ml-slide-left var(--ml-duration-normal) var(--ml-ease-spring) both}.ml-text-shimmer{color:var(--ml-primary-text)}@supports ((-webkit-background-clip:text) or (background-clip:text)){.ml-text-shimmer{background:linear-gradient(90deg,var(--ml-text),var(--ml-primary),var(--ml-text));color:#0000;-webkit-text-fill-color:transparent;background-size:200%;-webkit-background-clip:text;background-clip:text;animation:3s ease-in-out infinite ml-shimmer}}@keyframes mlola-glyph-draw{0%{stroke-dashoffset:1px}}@keyframes mlola-glyph-fill{0%{opacity:0}}.mlola-glyph[data-animated]>*{stroke-dasharray:1 1;animation:mlola-glyph-draw var(--ml-duration-slow) var(--ml-ease-standard) both}.mlola-glyph[data-animated]>:nth-child(2){animation-delay:60ms}.mlola-glyph[data-animated]>:nth-child(3){animation-delay:.12s}.mlola-glyph[data-animated]>:nth-child(n+4){animation-delay:.18s}.mlola-glyph[data-animated]>[fill=currentColor]{stroke-dasharray:none;animation-name:mlola-glyph-fill}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;transition-delay:0s!important;animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0s!important}}
}

@layer mlola.tokens,mlola.foundations,mlola.materials,mlola.recipes,mlola.motion,mlola.accessibility;
:root{--ease-spring-soft:cubic-bezier(.16, 1, .3, 1);--ease-spring-bounce:cubic-bezier(.34, 1.56, .64, 1);--ease-in-out-smooth:cubic-bezier(.65, 0, .35, 1);--ease-out-expo:cubic-bezier(.16, 1, .3, 1);--duration-micro:.12s;--duration-short:.18s;--duration-normal:.26s;--duration-smooth:.42s;--duration-slow:.7s}@layer utilities{.perspective-1000{perspective:1000px}.preserve-3d{transform-style:preserve-3d}.backface-hidden{backface-visibility:hidden}.motion-spring{transition-timing-function:var(--ease-spring-soft);transition-duration:var(--duration-normal)}.motion-bounce{transition-timing-function:var(--ease-spring-bounce);transition-duration:var(--duration-smooth)}.glass-card{background:color-mix(in srgb, var(--card) 75%, transparent);-webkit-backdrop-filter:blur(16px)saturate(180%);border:1px solid color-mix(in srgb, var(--border) 60%, transparent)}.glass-panel{background:color-mix(in srgb, var(--background) 80%, transparent);-webkit-backdrop-filter:blur(20px)saturate(190%);border:1px solid color-mix(in srgb, var(--border) 70%, transparent)}.border-glow{position:relative}.border-glow:before{content:"";border-radius:inherit;background:linear-gradient(135deg, color-mix(in srgb, var(--signal) 60%, transparent), transparent 60%);-webkit-mask-composite:xor;pointer-events:none;padding:1px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.animate-shimmer{background:linear-gradient(90deg, color-mix(in srgb, var(--foreground) 70%, transparent) 0%, var(--signal) 50%, color-mix(in srgb, var(--foreground) 70%, transparent) 100%);-webkit-text-fill-color:transparent;background-size:200%;-webkit-background-clip:text;background-clip:text;animation:3s ease-in-out infinite shimmer-sweep}.animate-shake{animation:.45s cubic-bezier(.36,.07,.19,.97) both shake}.animate-pop-in{animation:pop-in .24s var(--ease-spring-bounce) both}.animate-pulse-glow{animation:2.4s ease-in-out infinite pulse-glow}.animate-float{animation:6s ease-in-out infinite float-3d}.ambient-orb{filter:blur(70px);pointer-events:none;opacity:.45;border-radius:9999px;animation:8s ease-in-out infinite alternate orb-pulse;position:absolute}}@keyframes shimmer-sweep{0%{background-position:200%}to{background-position:-200%}}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-4px)}40%,60%{transform:translate(4px)}}@keyframes pop-in{0%{opacity:0;transform:scale(.7)translateY(4px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 0 0 color-mix(in srgb, var(--signal) 40%, transparent)}50%{box-shadow:0 0 0 14px color-mix(in srgb, var(--signal) 0%, transparent)}}@keyframes float-3d{0%,to{transform:translateY(0)rotateX(0)rotateY(0)}50%{transform:translateY(-8px)rotateX(2deg)rotateY(-3deg)}}@keyframes orb-pulse{0%{opacity:.35;transform:scale(1)translate(0)}to{opacity:.55;transform:scale(1.15)translate(20px,-20px)}}@keyframes counter-flip{0%{opacity:0;filter:blur(2px);transform:translateY(10px)rotateX(-45deg)}to{opacity:1;filter:blur();transform:translateY(0)rotateX(0)}}@keyframes text-swap{0%{opacity:0;filter:blur(4px);transform:translateY(6px)}to{opacity:1;filter:blur();transform:translateY(0)}}@layer mlola.motion{.ml-motion-tilt-glare{border-radius:inherit;pointer-events:none;opacity:var(--mlola-glare-opacity,0);background:radial-gradient(circle at var(--mlola-glare-x,50%) var(--mlola-glare-y,50%), color-mix(in srgb, var(--ml-primary) 34%, transparent), transparent 62%);mix-blend-mode:multiply;transition:opacity .24s;position:absolute;inset:0}[data-mode=dark] .ml-motion-tilt-glare{background:radial-gradient(circle at var(--mlola-glare-x,50%) var(--mlola-glare-y,50%), color-mix(in srgb, var(--ml-primary) 42%, transparent), transparent 62%);mix-blend-mode:screen}.ml-motion-counter{font-variant-numeric:tabular-nums;display:inline-flex}.ml-motion-counter-digit,.ml-motion-text{display:inline-block}.ml-motion-shimmer{background:linear-gradient(90deg, color-mix(in srgb, var(--foreground) 70%, transparent) 0%, var(--signal) 50%, color-mix(in srgb, var(--foreground) 70%, transparent) 100%);-webkit-text-fill-color:transparent;background-size:200%;-webkit-background-clip:text;background-clip:text;animation:3s ease-in-out infinite shimmer-sweep}.ml-motion-magnetic{display:inline-block}.ml-motion-origin-morph{transform:translateZ(0)}}@media (prefers-reduced-motion:reduce){.animate-shimmer,.animate-shake,.animate-pop-in,.animate-pulse-glow,.animate-float,.ambient-orb,.ml-motion-shimmer{animation:none!important}}
@layer mlola.scene{.ml-scene-card-stack{cursor:pointer;perspective:1000px;-webkit-user-select:none;user-select:none;width:100%;height:11rem;position:relative}.ml-scene-card-stack-item{inset-inline:0;border:1px solid color-mix(in srgb, var(--border) 90%, transparent);border-radius:var(--ml-radius-lg,1rem);background:var(--card);flex-direction:column;justify-content:space-between;height:9rem;padding:1.25rem;display:flex;position:absolute;top:0}.ml-scene-card-stack-header{justify-content:space-between;align-items:center;display:flex}.ml-scene-card-stack-tag{background:color-mix(in srgb, var(--signal) 15%, transparent);color:var(--signal);font-family:var(--ml-font-mono);letter-spacing:.05em;text-transform:uppercase;border-radius:9999px;align-items:center;padding:.125rem .625rem;font-size:10px;font-weight:600;display:inline-flex}.ml-scene-card-stack-index{color:var(--muted-foreground);font-family:var(--ml-font-mono);font-size:.75rem}.ml-scene-card-stack-title{color:var(--foreground);letter-spacing:-.025em;font-size:.875rem;font-weight:700}.ml-scene-card-stack-subtitle{color:var(--muted-foreground);margin-top:.125rem;font-size:.75rem}.ml-scene-device-frame{perspective:1000px;border-radius:38px;margin-inline:auto;padding:.75rem;position:relative;box-shadow:0 25px 50px -12px #00000040;box-shadow:0 25px 50px -12px lab(0% 0 0/.25)}.ml-scene-device-screen{border:1px solid color-mix(in srgb, var(--border) 80%, transparent);background:var(--background);border-radius:28px;position:relative;overflow:hidden}.ml-scene-device-notch{background:color-mix(in srgb, var(--foreground) 20%, transparent);border-radius:9999px;justify-content:center;align-items:center;width:7rem;height:1rem;margin:.625rem auto;display:flex}.ml-scene-device-notch-dot{background:color-mix(in srgb, var(--foreground) 40%, transparent);border-radius:9999px;width:.5rem;height:.5rem}.ml-scene-device-content{padding:1rem}.ml-scene-spatial-toggle{-webkit-user-select:none;user-select:none;align-items:center;gap:.75rem;display:inline-flex}.ml-scene-spatial-switch{cursor:pointer;border:none;border-radius:9999px;width:3rem;height:1.75rem;padding:.25rem;position:relative;box-shadow:inset 0 2px 4px #00000040;box-shadow:inset 0 2px 4px lab(0% 0 0/.25)}.ml-scene-spatial-switch:disabled{cursor:not-allowed;opacity:.5}.ml-scene-spatial-thumb{background:#fff;background:lab(100% 0 0);border-radius:9999px;width:1.25rem;height:1.25rem;display:block;box-shadow:0 2px 6px #0000004d;box-shadow:0 2px 6px lab(0% 0 0/.3)}.ml-scene-spatial-label{color:var(--foreground);font-size:.75rem;font-weight:600}}
