:root{--studio-bg-deep:#0a0a0c;--studio-bg-primary:#0f1015;--studio-bg-elevated:#16171d;--studio-bg-surface:#1c1d24;--studio-bg-hover:#22232b;--studio-accent:#06b6d4;--studio-accent-hover:#22d3ee;--studio-accent-active:#0891b2;--studio-accent-muted:#06b6d426;--studio-accent-glow:#06b6d466;--studio-accent-rgb:6,182,212;--studio-secondary:#8b5cf6;--studio-secondary-hover:#a78bfa;--studio-secondary-muted:#8b5cf626;--studio-success:#22c55e;--studio-success-muted:#22c55e26;--studio-error:#ef4444;--studio-error-muted:#ef444426;--studio-warning:#f59e0b;--studio-warning-muted:#f59e0b26;--studio-text-primary:#f4f4f5;--studio-text-secondary:#a1a1aa;--studio-text-muted:#52525b;--studio-text-inverse:#0a0a0c;--studio-border:#ffffff14;--studio-border-subtle:#ffffff0a;--studio-border-strong:#ffffff1f;--studio-border-accent:#06b6d466;--font-display:"Satoshi",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-body:"Satoshi",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-mono:"JetBrains Mono","Fira Code","Consolas",monospace;--text-hero:clamp(3rem,8vw,5rem);--text-display:clamp(2rem,5vw,3.5rem);--text-h1:clamp(1.75rem,3vw,2.5rem);--text-h2:1.5rem;--text-h3:1.25rem;--text-h4:1.125rem;--text-body:.9375rem;--text-small:.8125rem;--text-micro:.6875rem;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--leading-tight:1.1;--leading-snug:1.25;--leading-normal:1.5;--leading-relaxed:1.625;--tracking-tight:-.025em;--tracking-normal:0;--tracking-wide:.025em;--tracking-wider:.05em;--tracking-widest:.1em;--space-0:0;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--space-24:6rem;--space-32:8rem;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1400px;--header-height:64px;--sidebar-width:280px;--radius-none:0;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-3xl:24px;--radius-full:9999px;--shadow-xs:0 1px 2px #0000004d;--shadow-sm:0 2px 4px #0006;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 24px #00000080;--shadow-xl:0 16px 48px #0009;--shadow-2xl:0 24px 64px #000000b3;--shadow-glow-sm:0 0 12px rgba(var(--studio-accent-rgb),.2);--shadow-glow:0 0 24px rgba(var(--studio-accent-rgb),.3);--shadow-glow-lg:0 0 40px rgba(var(--studio-accent-rgb),.4);--shadow-inset:inset 0 1px 2px #0000004d;--duration-instant:50ms;--duration-fast:.15s;--duration-base:.25s;--duration-slow:.4s;--duration-slower:.6s;--duration-reveal:.8s;--ease-linear:linear;--ease-in:cubic-bezier(.4,0,1,1);--ease-out:cubic-bezier(0,0,.2,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--ease-out-expo:cubic-bezier(.16,1,.3,1);--ease-out-quart:cubic-bezier(.25,1,.5,1);--ease-out-back:cubic-bezier(.34,1.56,.64,1);--ease-spring:cubic-bezier(.175,.885,.32,1.275);--transition-fast:var(--duration-fast)var(--ease-out);--transition-base:var(--duration-base)var(--ease-out-expo);--transition-slow:var(--duration-slow)var(--ease-out-expo);--transition-spring:var(--duration-base)var(--ease-spring);--z-below:-1;--z-base:0;--z-above:1;--z-dropdown:100;--z-sticky:200;--z-overlay:300;--z-modal:400;--z-popover:500;--z-toast:600;--z-tooltip:700;--z-max:9999;--blur-sm:blur(4px);--blur-md:blur(8px);--blur-lg:blur(16px);--blur-xl:blur(24px);--grain-opacity:.03;--gradient-hero:linear-gradient(135deg,var(--studio-accent)0%,var(--studio-secondary)100%);--gradient-subtle:linear-gradient(180deg,#ffffff05 0%,transparent 100%);--gradient-surface:linear-gradient(135deg,var(--studio-bg-elevated)0%,var(--studio-bg-surface)100%);--checkerboard-size:8px;--checkerboard-color-1:#18181b;--checkerboard-color-2:#27272a}[data-theme=light]{--studio-bg-deep:#f8fafc;--studio-bg-primary:#fff;--studio-bg-elevated:#f1f5f9;--studio-bg-surface:#e2e8f0;--studio-bg-hover:#cbd5e1;--studio-accent:#0891b2;--studio-accent-hover:#06b6d4;--studio-accent-active:#0e7490;--studio-accent-muted:#0891b21a;--studio-accent-glow:#0891b24d;--studio-accent-rgb:8,145,178;--studio-secondary:#7c3aed;--studio-secondary-hover:#8b5cf6;--studio-secondary-muted:#7c3aed1a;--studio-text-primary:#0f172a;--studio-text-secondary:#475569;--studio-text-muted:#94a3b8;--studio-text-inverse:#f4f4f5;--studio-border:#00000014;--studio-border-subtle:#0000000a;--studio-border-strong:#0000001f;--studio-border-accent:#0891b24d;--shadow-xs:0 1px 2px #0000000d;--shadow-sm:0 2px 4px #0000000f;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 8px 24px #0000001a;--shadow-xl:0 16px 48px #0000001f;--shadow-2xl:0 24px 64px #00000026;--shadow-glow-sm:0 0 12px rgba(var(--studio-accent-rgb),.15);--shadow-glow:0 0 24px rgba(var(--studio-accent-rgb),.2);--shadow-glow-lg:0 0 40px rgba(var(--studio-accent-rgb),.25);--checkerboard-color-1:#f1f5f9;--checkerboard-color-2:#e2e8f0;--grain-opacity:.02}:root{--btn-height-sm:36px;--btn-height-md:44px;--btn-height-lg:52px;--btn-padding-sm:var(--space-2)var(--space-4);--btn-padding-md:var(--space-3)var(--space-6);--btn-padding-lg:var(--space-4)var(--space-8);--input-height:44px;--input-padding:var(--space-3)var(--space-4);--input-border-width:1px;--toggle-width:44px;--toggle-height:24px;--toggle-thumb-size:18px;--toggle-thumb-offset:3px;--card-padding:var(--space-6);--card-radius:var(--radius-xl);--card-border:var(--studio-border)}.checkerboard-bg{background-image:linear-gradient(45deg,var(--checkerboard-color-1)25%,transparent 25%),linear-gradient(-45deg,var(--checkerboard-color-1)25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checkerboard-color-1)75%),linear-gradient(-45deg,transparent 75%,var(--checkerboard-color-1)75%);background-size:calc(var(--checkerboard-size)*2)calc(var(--checkerboard-size)*2);background-position:0 0,var(--checkerboard-size)0,var(--checkerboard-size)calc(var(--checkerboard-size)*-1),0 var(--checkerboard-size);background-color:var(--checkerboard-color-2)}.grain-overlay:after{content:"";pointer-events:none;width:100%;height:100%;z-index:var(--z-max);opacity:var(--grain-opacity);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");position:fixed;top:0;left:0}.glow-ring{box-shadow:0 0 0 1px var(--studio-border-accent),var(--shadow-glow)}.focus-ring:focus-visible{box-shadow:0 0 0 2px var(--studio-bg-primary),0 0 0 4px var(--studio-accent);outline:none}
@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes fadeInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes scaleInBounce{0%{opacity:0;transform:scale(.9)}60%{transform:scale(1.02)}to{opacity:1;transform:scale(1)}}@keyframes slideInUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slideInDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes revealFromRight{0%{clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes revealFromLeft{0%{clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes revealFromCenter{0%{clip-path:polygon(50% 0,50% 0,50% 100%,50% 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}@keyframes revealWithLine{0%{clip-path:polygon(100% 0,100% 0,100% 100%,100% 100%);filter:brightness()}50%{filter:brightness(1.1)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);filter:brightness()}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes progressRing{0%{stroke-dashoffset:100px}to{stroke-dashoffset:0}}@keyframes bounceDots{0%,80%,to{opacity:.5;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}@keyframes glowPulse{0%,to{box-shadow:0 0 20px #06b6d433}50%{box-shadow:0 0 35px #06b6d466}}@keyframes glowPulseLight{0%,to{box-shadow:0 0 20px #0891b226}50%{box-shadow:0 0 35px #0891b24d}}@keyframes borderPulse{0%,to{border-color:#06b6d466}50%{border-color:#06b6d4cc}}@keyframes ringPulse{0%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(1.5)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes buttonPress{0%{transform:scale(1)}50%{transform:scale(.97)}to{transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-4px)}20%,40%,60%,80%{transform:translate(4px)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-2deg)}75%{transform:rotate(2deg)}}@keyframes sunToMoon{0%{transform:rotate(0)scale(1)}50%{transform:rotate(180deg)scale(.8)}to{transform:rotate(360deg)scale(1)}}@keyframes moonToSun{0%{transform:rotate(0)scale(1)}50%{transform:rotate(-180deg)scale(.8)}to{transform:rotate(-360deg)scale(1)}}@keyframes canvasDraw{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes successCheck{0%{stroke-dasharray:44;stroke-dashoffset:44px}to{stroke-dasharray:44;stroke-dashoffset:0}}@keyframes errorX{0%{stroke-dasharray:20;stroke-dashoffset:20px}to{stroke-dasharray:20;stroke-dashoffset:0}}@keyframes modalEnter{0%{opacity:0;transform:scale(.95)translateY(-20px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes modalOverlayEnter{0%{opacity:0}to{opacity:1}}@keyframes tooltipEnter{0%{opacity:0;transform:scale(.95)translateY(4px)}to{opacity:1;transform:scale(1)translateY(0)}}.stagger-1{animation-delay:0s}.stagger-2{animation-delay:50ms}.stagger-3{animation-delay:.1s}.stagger-4{animation-delay:.15s}.stagger-5{animation-delay:.2s}.stagger-6{animation-delay:.25s}.stagger-7{animation-delay:.3s}.stagger-8{animation-delay:.35s}.stagger-in>*{animation:fadeInUp .4s var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards;opacity:0}.stagger-in>:first-child{animation-delay:0s}.stagger-in>:nth-child(2){animation-delay:50ms}.stagger-in>:nth-child(3){animation-delay:.1s}.stagger-in>:nth-child(4){animation-delay:.15s}.stagger-in>:nth-child(5){animation-delay:.2s}.stagger-in>:nth-child(n+6){animation-delay:.25s}.animate-fadeIn{animation:fadeIn var(--duration-base,.25s)var(--ease-out,ease-out)forwards}.animate-fadeInUp{animation:fadeInUp var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-fadeInDown{animation:fadeInDown var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-fadeInLeft{animation:fadeInLeft var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-fadeInRight{animation:fadeInRight var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-scaleIn{animation:scaleIn var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-scaleInBounce{animation:scaleInBounce var(--duration-slow,.4s)var(--ease-out-back,cubic-bezier(.34,1.56,.64,1))forwards}.animate-revealRight{animation:revealFromRight var(--duration-reveal,.8s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-revealLeft{animation:revealFromLeft var(--duration-reveal,.8s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))forwards}.animate-spin{animation:1s linear infinite spin}.animate-pulse{animation:2s ease-in-out infinite pulse}.animate-shimmer{animation:1.5s ease-in-out infinite shimmer}.animate-glowPulse{animation:2s ease-in-out infinite glowPulse}.animate-borderPulse{animation:1.5s ease-in-out infinite borderPulse}.animate-float{animation:3s ease-in-out infinite float}.animate-shake{animation:.5s ease-in-out shake}.animate-bounce{animation:.5s ease-in-out bounce}.animate-wiggle{animation:.3s ease-in-out wiggle}.transition-none{transition:none}.transition-fast{transition:all var(--duration-fast,.15s)var(--ease-out,ease-out)}.transition-base{transition:all var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))}.transition-slow{transition:all var(--duration-slow,.4s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))}.transition-spring{transition:all var(--duration-base,.25s)var(--ease-spring,cubic-bezier(.175,.885,.32,1.275))}.transition-colors{transition:color var(--duration-fast,.15s)var(--ease-out,ease-out),background-color var(--duration-fast,.15s)var(--ease-out,ease-out),border-color var(--duration-fast,.15s)var(--ease-out,ease-out)}.transition-transform{transition:transform var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))}.transition-opacity{transition:opacity var(--duration-base,.25s)var(--ease-out,ease-out)}.hover-lift{transition:transform var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1)),box-shadow var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))}.hover-lift:hover{transform:translateY(-2px)}.hover-lift:active{transform:translateY(-1px)}.hover-scale{transition:transform var(--duration-base,.25s)var(--ease-out-expo,cubic-bezier(.16,1,.3,1))}.hover-scale:hover{transform:scale(1.02)}.hover-scale:active{transform:scale(.98)}.hover-glow{transition:box-shadow var(--duration-base,.25s)var(--ease-out,ease-out)}.hover-glow:hover{box-shadow:0 0 24px #06b6d44d}.button-press{transition:transform .1s;transform:scale(1)}.button-press:active{transform:scale(.98)}.shimmer{position:relative;overflow:hidden}.shimmer:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);width:100%;height:100%;animation:1.5s infinite shimmer;position:absolute;top:0;left:-100%}[data-theme=light] .shimmer:before{background:linear-gradient(90deg,#0000,#fff6,#0000)}.animate-none{animation:none!important}.animate-paused{animation-play-state:paused}.animate-running{animation-play-state:running}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.animate-spin,.animate-pulse,.animate-shimmer,.animate-glowPulse,.animate-borderPulse,.animate-float,.shimmer:before{animation:none!important}}.page-load{--page-load-delay:0s}.page-load-header{opacity:0;animation:fadeInDown var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:var(--page-load-delay,0s)}.page-load-hero-title{opacity:0;animation:fadeInUp var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .1s)}.page-load-hero-subtitle{opacity:0;animation:fadeInUp var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .2s)}.page-load-upload{opacity:0;animation:scaleIn var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .3s)}.page-load-stats{opacity:0;animation:fadeInUp var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .5s)}.page-load-features{opacity:0;animation:fadeInUp var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .6s)}.page-load-footer{opacity:0;animation:fadeIn var(--duration-slow,.4s)var(--ease-out)forwards;animation-delay:calc(var(--page-load-delay,0s) + .7s)}.page-load-sidebar{opacity:0;animation:slideInRight var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .2s)}.page-load-canvas{opacity:0;animation:scaleIn var(--duration-slow,.4s)var(--ease-out-expo)forwards;animation-delay:calc(var(--page-load-delay,0s) + .1s)}.page-load-stagger>:first-child{animation-delay:calc(var(--page-load-delay,0s) + 0s)}.page-load-stagger>:nth-child(2){animation-delay:calc(var(--page-load-delay,0s) + 50ms)}.page-load-stagger>:nth-child(3){animation-delay:calc(var(--page-load-delay,0s) + .1s)}.page-load-stagger>:nth-child(4){animation-delay:calc(var(--page-load-delay,0s) + .15s)}.page-load-stagger>:nth-child(5){animation-delay:calc(var(--page-load-delay,0s) + .2s)}.page-load-stagger>:nth-child(6){animation-delay:calc(var(--page-load-delay,0s) + .25s)}.page-load-stagger>:nth-child(n+7){animation-delay:calc(var(--page-load-delay,0s) + .3s)}.page-load-stagger>*{opacity:0;animation:fadeInUp var(--duration-base,.25s)var(--ease-out-expo)forwards}.grain-overlay{position:relative}.grain-overlay:before{content:"";opacity:.03;pointer-events:none;z-index:0;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");position:absolute;inset:0}.grain-overlay-light:before{opacity:.02}.grain-overlay-heavy:before{opacity:.05}.grain-overlay>*{z-index:1;position:relative}[data-theme=light] .grain-overlay:before{opacity:.015}[data-theme=light] .grain-overlay-light:before{opacity:.01}[data-theme=light] .grain-overlay-heavy:before{opacity:.03}@keyframes skeletonShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,var(--studio-bg-elevated,#16171d)25%,var(--studio-bg-surface,#1c1d24)50%,var(--studio-bg-elevated,#16171d)75%);border-radius:var(--radius-md,8px);background-size:200% 100%;animation:1.5s ease-in-out infinite skeletonShimmer}.skeleton-text{border-radius:var(--radius-sm,4px);height:1em}.skeleton-title{border-radius:var(--radius-sm,4px);width:60%;height:1.5em}.skeleton-avatar{border-radius:var(--radius-full,9999px);width:48px;height:48px}.skeleton-button{border-radius:var(--radius-lg,12px);width:120px;height:48px}.skeleton-card{border-radius:var(--radius-xl,16px);height:200px}.skeleton-image{aspect-ratio:16/9;border-radius:var(--radius-lg,12px)}[data-theme=light] .skeleton{background:linear-gradient(90deg,var(--studio-bg-elevated,#f1f5f9)25%,var(--studio-bg-surface,#e2e8f0)50%,var(--studio-bg-elevated,#f1f5f9)75%);background-size:200% 100%}@media (max-width:768px){.hover-lift:hover,.hover-scale:hover{transform:none}.hover-glow:hover{box-shadow:none}.button-press:active{transform:scale(.99)}.page-load-header,.page-load-hero-title,.page-load-hero-subtitle,.page-load-upload,.page-load-stats,.page-load-features,.page-load-footer,.page-load-sidebar,.page-load-canvas{animation-duration:.3s}}@media (prefers-reduced-motion:reduce){.page-load-header,.page-load-hero-title,.page-load-hero-subtitle,.page-load-upload,.page-load-stats,.page-load-features,.page-load-footer,.page-load-sidebar,.page-load-canvas,.page-load-stagger>*{opacity:1!important;animation:none!important}.skeleton{background:var(--studio-bg-surface,#1c1d24);animation:none}}
*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-moz-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-size:16px}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial}}body{font-family:var(--font-body);font-size:var(--text-body);font-weight:var(--weight-normal);line-height:var(--leading-normal);color:var(--studio-text-primary);background-color:var(--studio-bg-primary);min-height:100vh;transition:background-color var(--duration-base)var(--ease-out),color var(--duration-base)var(--ease-out);overflow-x:hidden}ul,ol{list-style:none}a{color:inherit;text-decoration:none}img,picture,video,canvas,svg{max-width:100%;height:auto;display:block}input,button,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:none}textarea{resize:vertical}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}:focus{outline:2px solid var(--studio-accent);outline-offset:2px}:focus:not(:focus-visible){outline:none}:focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px;border-radius:var(--radius-sm)}.skip-link{padding:var(--space-3)var(--space-6);background:var(--studio-accent);color:var(--studio-text-inverse);font-weight:var(--weight-semibold);border-radius:var(--radius-md);z-index:var(--z-max);transition:top var(--duration-fast)var(--ease-out);position:absolute;top:-100%;left:50%;transform:translate(-50%)}.skip-link:focus{top:var(--space-4)}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:var(--weight-bold);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--studio-text-primary)}h1{font-size:var(--text-h1)}h2{font-size:var(--text-h2)}h3{font-size:var(--text-h3)}h4{font-size:var(--text-h4)}p{color:var(--studio-text-secondary);line-height:var(--leading-relaxed)}strong,b{font-weight:var(--weight-semibold)}small{font-size:var(--text-small)}code,pre{font-family:var(--font-mono);font-size:.9em}.app{background:var(--studio-bg-primary);flex-direction:column;min-height:100vh;display:flex;position:relative}.app-workspace{width:100%;height:calc(100vh - var(--header-height));flex:1;max-width:none;margin:0;padding:0;display:flex;overflow:hidden}.app-main-workspace{padding:var(--space-6);background:var(--studio-bg-primary);flex-direction:column;flex:1;display:flex;position:relative;overflow:auto}.app-main-workspace .canvas-container{min-height:0;padding-top:var(--space-4);flex:1;justify-content:center;align-items:flex-start;display:flex}.container{width:100%;max-width:var(--container-xl);padding:0 var(--space-6);margin:0 auto}.container-sm{max-width:var(--container-sm)}.container-md{max-width:var(--container-md)}.container-lg{max-width:var(--container-lg)}.container-2xl{max-width:var(--container-2xl)}.btn{justify-content:center;align-items:center;gap:var(--space-2);height:var(--btn-height-md);padding:var(--btn-padding-md);font-family:var(--font-body);font-size:var(--text-body);font-weight:var(--weight-semibold);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--duration-base)var(--ease-out-expo);line-height:1;text-decoration:none;display:inline-flex;position:relative;overflow:hidden}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--studio-accent);color:var(--studio-text-inverse);border:none}.btn-primary:hover:not(:disabled){background:var(--studio-accent-hover);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary,.btn-ghost{color:var(--studio-text-secondary);border:1px solid var(--studio-border);background:0 0}.btn-secondary:hover:not(:disabled),.btn-ghost:hover:not(:disabled){color:var(--studio-text-primary);border-color:var(--studio-border-strong);background:#ffffff08}[data-theme=light] .btn-secondary:hover:not(:disabled),[data-theme=light] .btn-ghost:hover:not(:disabled){background:#00000008}.btn-danger{background:var(--studio-error);color:#fff;border:none}.btn-danger:hover:not(:disabled){background:#dc2626;transform:translateY(-1px)}.btn-success{background:var(--studio-success);color:#fff;border:none}.btn-success:hover:not(:disabled){background:#16a34a;transform:translateY(-1px)}.btn-sm{height:var(--btn-height-sm);padding:var(--btn-padding-sm);font-size:var(--text-small);border-radius:var(--radius-md)}.btn-lg{height:var(--btn-height-lg);padding:var(--btn-padding-lg);font-size:var(--text-h4);border-radius:var(--radius-xl)}.btn-icon{width:var(--btn-height-md);height:var(--btn-height-md);border-radius:var(--radius-md);padding:0}.btn-icon.btn-sm{width:var(--btn-height-sm);height:var(--btn-height-sm)}.btn-icon.btn-lg{width:var(--btn-height-lg);height:var(--btn-height-lg)}.input{width:100%;height:var(--input-height);padding:var(--input-padding);font-family:var(--font-body);font-size:var(--text-body);color:var(--studio-text-primary);background:var(--studio-bg-surface);border:var(--input-border-width)solid var(--studio-border);border-radius:var(--radius-lg);transition:all var(--duration-fast)var(--ease-out);display:block}.input::placeholder{color:var(--studio-text-muted)}.input:hover:not(:disabled){border-color:var(--studio-border-strong)}.input:focus{border-color:var(--studio-accent);box-shadow:0 0 0 3px var(--studio-accent-muted);outline:none}.input:disabled{opacity:.5;cursor:not-allowed}.toggle{width:var(--toggle-width);height:var(--toggle-height);background:var(--studio-bg-deep);border:1px solid var(--studio-border);border-radius:var(--radius-full);cursor:pointer;transition:all var(--duration-base)var(--ease-spring);display:inline-flex;position:relative}.toggle:after{content:"";top:var(--toggle-thumb-offset);left:var(--toggle-thumb-offset);width:var(--toggle-thumb-size);height:var(--toggle-thumb-size);background:var(--studio-text-muted);border-radius:var(--radius-full);transition:all var(--duration-base)var(--ease-spring);position:absolute}.toggle.active{background:var(--studio-accent-muted);border-color:var(--studio-accent)}.toggle.active:after{background:var(--studio-accent);transform:translateX(calc(var(--toggle-width) - var(--toggle-thumb-size) - var(--toggle-thumb-offset)*2));box-shadow:var(--shadow-glow-sm)}.toggle:hover:not(.disabled){border-color:var(--studio-border-strong)}.toggle.disabled{opacity:.5;cursor:not-allowed}.card{background:var(--studio-bg-elevated);border:1px solid var(--studio-border);border-radius:var(--card-radius);padding:var(--card-padding);transition:all var(--duration-base)var(--ease-out-expo)}.card:hover{border-color:var(--studio-border-strong)}.card-interactive:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.glass{-webkit-backdrop-filter:var(--blur-lg);backdrop-filter:var(--blur-lg);border:1px solid var(--studio-border);background:#ffffff08}[data-theme=light] .glass{background:#fffc}.text-primary{color:var(--studio-text-primary)}.text-secondary{color:var(--studio-text-secondary)}.text-muted{color:var(--studio-text-muted)}.text-accent{color:var(--studio-accent)}.text-success{color:var(--studio-success)}.text-error{color:var(--studio-error)}.text-warning{color:var(--studio-warning)}.bg-deep{background-color:var(--studio-bg-deep)}.bg-primary{background-color:var(--studio-bg-primary)}.bg-elevated{background-color:var(--studio-bg-elevated)}.bg-surface{background-color:var(--studio-bg-surface)}.font-normal{font-weight:var(--weight-normal)}.font-medium{font-weight:var(--weight-medium)}.font-semibold{font-weight:var(--weight-semibold)}.font-bold{font-weight:var(--weight-bold)}.text-xs{font-size:var(--text-micro)}.text-sm{font-size:var(--text-small)}.text-base{font-size:var(--text-body)}.text-lg{font-size:var(--text-h4)}.text-xl{font-size:var(--text-h3)}.text-2xl{font-size:var(--text-h2)}.text-3xl{font-size:var(--text-h1)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.hidden{display:none}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.m-0{margin:0}.mt-auto{margin-top:auto}.mb-auto{margin-bottom:auto}.ml-auto{margin-left:auto}.mr-auto{margin-right:auto}.mx-auto{margin-left:auto;margin-right:auto}.p-0{padding:0}.p-2{padding:var(--space-2)}.p-4{padding:var(--space-4)}.p-6{padding:var(--space-6)}.p-8{padding:var(--space-8)}.rounded-none{border-radius:0}.rounded-sm{border-radius:var(--radius-sm)}.rounded{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-full{border-radius:var(--radius-full)}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-scroll{overflow:scroll}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.w-full{width:100%}.h-full{height:100%}.min-h-screen{min-height:100vh}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-75{opacity:.75}.opacity-100{opacity:1}.cursor-pointer{cursor:pointer}.cursor-not-allowed{cursor:not-allowed}@media (max-width:768px){.container{padding:0 var(--space-4)}.app-workspace{height:auto;min-height:calc(100vh - var(--header-height));flex-direction:column}.app-main-workspace{padding:var(--space-4)}h1{font-size:var(--text-h2)}h2{font-size:var(--text-h3)}.btn{height:40px;padding:var(--space-2)var(--space-4);font-size:var(--text-small)}.btn-lg{height:48px;padding:var(--space-3)var(--space-6);font-size:var(--text-body)}}@media (max-width:480px){.container{padding:0 var(--space-3)}h1{font-size:var(--text-h3)}.btn{height:36px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (prefers-contrast:high){:root{--studio-border:#fff3;--studio-border-strong:#fff6}[data-theme=light]{--studio-border:#0003;--studio-border-strong:#0006}.btn,.input{border-width:2px}}@media print{body{color:#000;background:#fff}.app-workspace{height:auto}.btn,.toggle{border:1px solid #000}}
.global-drop-zone{z-index:9999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;pointer-events:none;background:#000000d9;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;inset:0}.global-drop-zone.dragging{opacity:1;pointer-events:all}.global-drop-zone.uploading{opacity:1;pointer-events:all;background:#000000e6}.drop-zone-content{text-align:center;color:#fff;max-width:500px;padding:2rem}.drop-indicator{animation:2s infinite pulse}.drop-icon-container,.upload-icon-container{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:50%;justify-content:center;align-items:center;width:120px;height:120px;margin-bottom:1.5rem;display:inline-flex;box-shadow:0 10px 40px #667eea66}.drop-icon-container svg,.upload-icon-container svg{color:#fff;filter:drop-shadow(0 2px 4px #0003)}.upload-icon-container{animation:2s linear infinite rotate}.drop-title,.upload-title{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px #0000004d);-webkit-background-clip:text;background-clip:text;margin:0 0 .5rem;font-size:2rem;font-weight:600}.drop-subtitle{color:#a0a0a0;margin:0;font-size:1.125rem}.upload-status{flex-direction:column;align-items:center;display:flex}.progress-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border-radius:12px;width:100%;max-width:400px;margin-top:2rem;padding:1rem}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:768px){.drop-icon-container,.upload-icon-container{width:80px;height:80px}.drop-icon-container svg,.upload-icon-container svg{width:48px;height:48px}.drop-title,.upload-title{font-size:1.5rem}.drop-subtitle{font-size:1rem}}