.studio{--st-bg:#08090a;--st-s1:#0f1011;--st-s2:#121314;--st-s3:#161718;--st-line:#ffffff0f;--st-line-strong:#ffffff1c;--st-text:#f7f8f8;--st-body:#d0d6e0;--st-dim:#8a8f98;--st-accent:#a78bfa;--st-accent-2:#f0abfc;--st-accent-soft:#a78bfa24;--st-good:#34d399;--st-warn:#fbbf24;--st-bad:#fb7185;--st-fast:.1s ease;--st-move:.16s cubic-bezier(.25,.46,.45,.94);--st-reveal:.4s cubic-bezier(.16,1,.3,1);isolation:isolate;background:var(--st-bg);min-height:calc(100vh - 4rem);color:var(--st-body);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;position:relative;overflow-x:clip}.studio:before{content:"";z-index:-1;pointer-events:none;filter:blur(12px);background:radial-gradient(38% 55% at 22% 8%,#8b5cf62e,#0000 70%),radial-gradient(34% 50% at 80% 0,#ec489921,#0000 72%);height:70vh;animation:26s ease-in-out infinite alternate st-drift;position:absolute;inset:-20% -10% auto}.studio:after{content:"";z-index:-1;pointer-events:none;background-image:radial-gradient(circle at 1px 1px,#ffffff0e 1px,#0000 0);background-size:26px 26px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0%,#0000 62%);mask-image:linear-gradient(#000 0%,#0000 62%)}@keyframes st-drift{0%{transform:translate(-2%)scale(1)}to{transform:translate(3%,2%)scale(1.08)}}.st-rise{animation:st-rise var(--st-reveal)both;animation-delay:calc(min(var(--i,0)*45ms,.36s))}@keyframes st-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.st-fade{animation:st-fade var(--st-reveal)both}@keyframes st-fade{0%{opacity:0}to{opacity:1}}.st-panel{border:1px solid var(--st-line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(#ffffff09,#ffffff03);border-radius:14px;position:relative}.st-panel:before{content:"";background:linear-gradient(90deg,#0000,#ffffff29,#0000);border-radius:14px 14px 0 0;height:1px;position:absolute;inset:0 0 auto}.st-title{color:var(--st-text);letter-spacing:-.02em}.st-label{color:var(--st-dim);letter-spacing:.09em;text-transform:uppercase;font-size:11px;font-weight:600}.st-meta{color:var(--st-dim)}.st-drop{border:1px dashed var(--st-line-strong);transition:border-color var(--st-move),background-color var(--st-move),transform var(--st-move);background:#ffffff04;border-radius:14px;position:relative}.st-drop:hover{border-color:#a78bfa73}.st-drop[data-over=true]{border-color:var(--st-accent);background:var(--st-accent-soft);transform:scale(1.015)}.st-drop[data-over=true]:after{content:"";border:1px solid #a78bfa59;border-radius:17px;animation:1.1s ease-out infinite st-halo;position:absolute;inset:-3px}@keyframes st-halo{0%{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(1.04)}}.st-file{border:1px solid var(--st-line);text-align:left;width:100%;transition:border-color var(--st-fast),background-color var(--st-fast),transform var(--st-move);background:#ffffff05;border-radius:11px;align-items:center;gap:10px;padding:9px 10px;display:flex;position:relative}.st-upload{border:1px solid var(--st-line);background:#ffffff05;border-radius:11px;width:100%;padding:10px 12px;display:block}.st-file:hover{border-color:var(--st-line-strong);background:#ffffff0b}.st-file:active{transform:scale(.99)}.st-file[data-on=true]{background:var(--st-accent-soft);border-color:#a78bfa80}.st-order{background:var(--st-accent);color:#16062e;border-radius:999px;flex:none;place-items:center;width:20px;height:20px;font-size:11px;font-weight:700;animation:.22s cubic-bezier(.34,1.56,.64,1) both st-pop;display:grid}@keyframes st-pop{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.st-scan{position:relative;overflow:hidden}.st-scan:after{content:"";background:linear-gradient(90deg,#0000,#a78bfa29,#0000);animation:1.5s ease-in-out infinite st-sweep;position:absolute;inset:0;transform:translate(-100%)}@keyframes st-sweep{to{transform:translate(100%)}}.st-input{border:1px solid var(--st-line-strong);width:100%;color:var(--st-text);transition:border-color var(--st-move),box-shadow var(--st-move),background-color var(--st-move);background:#ffffff06;border-radius:11px;padding:11px 14px;font-size:14px}.st-input::placeholder{color:var(--st-dim)}.st-input:focus{background:#ffffff0a;border-color:#a78bfaa6;outline:none;box-shadow:0 0 0 4px #a78bfa24}.st-input:disabled{opacity:.5}.st-btn{border:1px solid var(--st-line-strong);color:var(--st-text);min-height:40px;transition:background-color var(--st-fast),border-color var(--st-fast),transform var(--st-move),opacity var(--st-fast);background:#ffffff0a;border-radius:11px;justify-content:center;align-items:center;gap:7px;padding:10px 15px;font-size:13px;font-weight:600;display:inline-flex}.st-btn:hover:not(:disabled){background:#ffffff14;border-color:#ffffff2e}.st-btn:active:not(:disabled){transform:scale(.98)}.st-btn:disabled{opacity:.45;cursor:not-allowed}.st-btn-primary{color:#fff;background:linear-gradient(120deg,#7c3aed,#c026d3);border-color:#0000;position:relative;overflow:hidden}.st-btn-primary:hover:not(:disabled){background:linear-gradient(120deg,#8b5cf6,#d946ef);border-color:#0000}.st-btn-primary:after{content:"";background:linear-gradient(105deg,#0000 30%,#ffffff59 50%,#0000 70%);transition:transform .55s;position:absolute;inset:0;transform:translate(-120%)}.st-btn-primary:hover:not(:disabled):after{transform:translate(120%)}.st-chip{border:1px solid var(--st-line-strong);color:var(--st-body);min-height:32px;transition:border-color var(--st-fast),background-color var(--st-fast),transform var(--st-move);background:#ffffff06;border-radius:999px;padding:7px 13px;font-size:12px}.st-chip:hover{background:var(--st-accent-soft);color:var(--st-text);border-color:#a78bfa8c;transform:translateY(-1px)}.st-recipe{border:1px solid var(--st-line);text-align:left;transition:border-color var(--st-fast),background-color var(--st-fast),transform var(--st-move);background:#ffffff05;border-radius:12px;padding:11px 13px}.st-recipe:hover{background:var(--st-accent-soft);border-color:#a78bfa80;transform:translateY(-2px)}.st-icon-btn{width:30px;height:30px;color:var(--st-dim);transition:color var(--st-fast),background-color var(--st-fast);border-radius:9px;place-items:center;display:grid}.st-icon-btn:hover{color:var(--st-bad);background:#fb71851f}.st-step{border:1px solid var(--st-line);transition:border-color var(--st-fast),background-color var(--st-fast);background:#ffffff06;border-radius:11px;align-items:center;gap:12px;padding:10px 12px;display:flex;position:relative}.st-step:hover{border-color:var(--st-line-strong);background:#ffffff0b}.st-step+.st-step{margin-top:8px}.st-step+.st-step:before{content:"";background:linear-gradient(#0000,#a78bfa8c);width:1px;height:9px;position:absolute;top:-9px;left:26px}.st-node{background:var(--st-accent-soft);width:22px;height:22px;color:var(--st-accent);font-variant-numeric:tabular-nums;border:1px solid #a78bfa73;border-radius:999px;flex:none;place-items:center;font-size:11px;font-weight:700;display:grid}.st-job{border:1px solid var(--st-line);transition:border-color var(--st-move),background-color var(--st-move);background:#ffffff06;border-radius:12px;padding:12px 13px}.st-job[data-live=true]{border-color:#a78bfa66}.st-job[data-status=done]{border-color:#34d3994d}.st-job[data-status=failed]{border-color:#fb718559}.st-track{background:#ffffff12;border-radius:999px;height:3px;overflow:hidden}.st-fill{background:linear-gradient(90deg,var(--st-accent),var(--st-accent-2));border-radius:999px;height:100%;transition:width .5s cubic-bezier(.16,1,.3,1)}.st-fill[data-running=true]{animation:1.6s ease-in-out infinite st-breathe}@keyframes st-breathe{0%,to{opacity:1}50%{opacity:.55}}.st-dot{background:var(--st-accent);border-radius:999px;width:7px;height:7px;animation:1.8s ease-out infinite st-ping;box-shadow:0 0 #a78bfa80}@keyframes st-ping{0%{box-shadow:0 0 #a78bfa80}70%{box-shadow:0 0 0 7px #a78bfa00}to{box-shadow:0 0 #a78bfa00}}.st-poster{border:1px solid var(--st-line);border-radius:10px;animation:.5s ease-out both st-poster}@keyframes st-poster{0%{opacity:0;filter:blur(6px);transform:scale(.985)}to{opacity:1;filter:none;transform:none}}.st-alert{color:#ffd9df;background:#fb71851a;border:1px solid #fb718559;border-radius:12px}.st-skel{background:linear-gradient(90deg,#ffffff08,#ffffff13,#ffffff08) 0 0/200% 100%;border-radius:11px;animation:1.4s ease-in-out infinite st-skel}@keyframes st-skel{to{background-position:-200% 0}}@media (pointer:coarse){.studio .st-chip{min-height:44px;padding-inline:16px}.studio .st-icon-btn{width:44px;height:44px;opacity:1!important}.studio .st-file{padding-block:12px}}.studio :focus-visible{outline:2px solid var(--st-accent);outline-offset:2px;border-radius:8px}.st-demo{text-align:center}.st-stage{perspective:1400px;perspective-origin:50% 42%;height:21rem;position:relative}.st-stage-inner,.st-scene{transform-style:preserve-3d;position:absolute;inset:0}.st-3d{transform-style:preserve-3d}.st-floor{transform-origin:50% 100%;pointer-events:none;background-image:linear-gradient(90deg,#a78bfa42 1px,#0000 1px),linear-gradient(#a78bfa42 1px,#0000 1px);background-size:54px 54px;height:20rem;position:absolute;bottom:-2rem;left:-25%;right:-25%;transform:rotateX(68deg)translateZ(-70px);-webkit-mask-image:radial-gradient(60% 70% at 50% 100%,#000 10%,#0000 78%);mask-image:radial-gradient(60% 70% at 50% 100%,#000 10%,#0000 78%)}.st-chip[data-on=true]{background:var(--st-accent-soft);color:var(--st-text);border-color:#a78bfa8c}@media (max-width:640px){.st-stage{perspective:1100px;height:19rem;transform:scale(.58)}}@media (prefers-reduced-motion:reduce){.studio *,.studio:before,.studio:after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
