.studio{--s-bg:#0c0d0f;--s-panel:#131417;--s-raised:#1a1c20;--s-hover:#22252a;--s-line:#25282d;--s-line-2:#30343a;--s-text:#ecedee;--s-soft:#a9aeb6;--s-mute:#6e737b;--s-black:#000;--s-accent:#c6f432;--s-accent-ink:#0c0d0f;--s-ai:#8b7cff;--s-ok:#3dd68c;--s-warn:#f5b547;--s-danger:#ff5d5d;--s-r:10px;--s-r-lg:14px;--s-ui:var(--font-geist-sans), "Geist", system-ui, sans-serif;--s-mono:var(--font-geist-mono), "Geist Mono", ui-monospace, monospace;--color-brand-bg:var(--s-bg);--color-brand-surface:var(--s-hover);--color-brand-secondary:var(--s-soft);--color-brand-accent:var(--s-text);--color-brand-light:var(--s-text);--color-brand-text:var(--s-text);--font-sans:var(--s-ui);--font-display:var(--s-ui);--font-heading:var(--s-ui);--font-mono:var(--s-mono);--background:var(--s-bg);--foreground:var(--s-text);--card:var(--s-panel);--card-foreground:var(--s-text);--popover:var(--s-raised);--popover-foreground:var(--s-text);--primary:var(--s-accent);--primary-foreground:var(--s-accent-ink);--secondary:var(--s-raised);--secondary-foreground:var(--s-text);--muted:var(--s-raised);--muted-foreground:var(--s-mute);--accent:var(--s-hover);--accent-foreground:var(--s-text);--border:var(--s-line);--input:var(--s-line-2);--ring:var(--s-accent);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:var(--s-bg);color:var(--s-text);font-family:var(--s-ui);-webkit-font-smoothing:antialiased}body.studio{background:var(--s-bg)}.studio [data-classic-hero]{display:none}.studio textarea,.studio input[type=text],.studio input[type=search],.studio input:not([type]){padding-right:40px}.studio [data-no-mic] textarea,.studio [data-no-mic] input,.studio textarea[data-no-mic],.studio input[data-no-mic]{padding-right:revert-layer}.studio [data-new-badge]{display:none}.studio h1,.studio h2,.studio h3,.studio h4{font-family:var(--s-ui);letter-spacing:-.01em}.studio :focus-visible{outline:2px solid var(--s-accent);outline-offset:2px}.studio button:not(:disabled),.studio [role=button],.studio [role=tab],.studio [role=menuitem],.studio a[href],.studio select,.studio summary,body.studio [role=menuitem],body.studio [role=option]{cursor:pointer}.studio label:has(>input[type=checkbox]){cursor:pointer}.studio label:has(>input[type=color]){cursor:pointer}.studio button:disabled{cursor:not-allowed}.studio ::selection{background:color-mix(in oklab, var(--s-accent) 35%, transparent)}.studio .mono,.studio .font-mono{font-family:var(--s-mono)}.studio *{scrollbar-width:thin;scrollbar-color:var(--s-line-2) transparent}@layer components{.s-app{min-height:100dvh;display:flex}.s-rail{background:var(--s-panel);border-right:1px solid var(--s-line);z-index:30;flex-direction:column;flex-shrink:0;align-items:center;gap:6px;width:76px;height:100dvh;padding:14px 0;display:none;position:sticky;top:0}@media (min-width:768px){.s-rail{display:flex}}.s-logo{border-radius:11px;place-items:center;width:38px;height:38px;margin-bottom:14px;transition:transform .2s;display:grid}.s-logo img{object-fit:contain;width:30px;height:30px;filter:drop-shadow(0 4px 14px color-mix(in oklab, var(--s-accent) 35%, transparent))}.s-logo:hover{transform:rotate(-6deg)scale(1.05)}.s-navbtn{width:60px;color:var(--s-mute);border-radius:10px;flex-direction:column;align-items:center;gap:5px;padding:9px 0 7px;font-size:10.5px;font-weight:500;transition:background .15s,color .15s;display:flex}.s-navbtn svg{width:20px;height:20px}.s-navbtn:hover{background:var(--s-raised);color:var(--s-soft)}.s-navbtn[aria-current=page]{background:var(--s-raised);color:var(--s-text)}.s-navbtn[aria-current=page] svg{color:var(--s-accent)}.s-navbtn{position:relative}.s-navbtn:has(.s-navpending){background:var(--s-raised);color:var(--s-text)}.s-navbtn:has(.s-navpending) svg{color:var(--s-accent)}.s-navpending{border-radius:inherit;pointer-events:none;background:linear-gradient(90deg, transparent, color-mix(in oklab, var(--s-accent) 22%, transparent), transparent);background-size:200% 100%;animation:.9s linear infinite s-shimmer;position:absolute;inset:0}.s-navbtn.ask svg{color:var(--s-ai)}.s-main{flex-direction:column;flex:1;min-width:0;display:flex}.s-top{z-index:20;background:color-mix(in oklab, var(--s-bg) 88%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--s-line);flex-shrink:0;align-items:center;gap:10px;height:56px;padding:0 16px;display:flex;position:sticky;top:0}.s-top h1{white-space:nowrap;font-size:14px;font-weight:600}.s-crumb{color:var(--s-mute);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.s-content{flex:1;min-width:0;padding:20px 16px 96px}@media (min-width:768px){.s-content{padding:24px 24px 40px}}.s-content.bleed{padding:0}.s-reading{max-width:1240px;margin:0 auto}.s-tabbar{z-index:40;background:color-mix(in oklab, var(--s-panel) 94%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--s-line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));grid-template-columns:repeat(5,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}@media (min-width:768px){.s-tabbar{display:none}}.s-tabbar .s-navbtn{width:auto}.s-btn{background:var(--s-raised);border:1px solid var(--s-line-2);white-space:nowrap;height:34px;color:var(--s-text);border-radius:9px;justify-content:center;align-items:center;gap:8px;padding:0 14px;font-size:13px;font-weight:500;transition:background .15s,filter .15s,border-color .15s;display:inline-flex}.s-btn:hover{background:var(--s-hover)}.s-btn:disabled{opacity:.45;cursor:not-allowed}.s-btn.primary{background:var(--s-accent);color:var(--s-accent-ink);border-color:#0000;font-weight:600}.s-btn.primary:hover:not(:disabled){filter:brightness(1.08)}.s-btn.ghost{color:var(--s-soft);background:0 0;border-color:#0000}.s-btn.ghost:hover{background:var(--s-raised);color:var(--s-text)}.s-btn.ai{border-color:color-mix(in oklab, var(--s-ai) 45%, transparent);color:var(--s-text)}.s-btn.ai svg{color:var(--s-ai)}.s-btn.lg{height:42px;padding:0 18px;font-size:14px}.s-btn.sm{border-radius:8px;height:28px;padding:0 10px;font-size:12px}.s-btn .cost{font:500 11px var(--s-mono);opacity:.75;border-left:1px solid #00000040;padding-left:8px}.s-btn:not(.primary) .cost{border-left-color:var(--s-line-2)}.s-chip{border:1px solid var(--s-line-2);height:28px;color:var(--s-soft);white-space:nowrap;background:0 0;border-radius:999px;align-items:center;gap:6px;padding:0 11px;font-size:12px;display:inline-flex}.s-chip:hover{color:var(--s-text);border-color:var(--s-mute)}.s-chip[aria-pressed=true],.s-chip.on{background:var(--s-text);color:var(--s-bg);border-color:var(--s-text)}.s-pill{font:500 12px var(--s-mono);color:var(--s-soft);background:var(--s-raised);border:1px solid var(--s-line);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:6px 11px;display:inline-flex}.s-pill b{color:var(--s-text);font-weight:500}.s-pill.s-credits-low{color:var(--s-danger);border-color:color-mix(in oklab, var(--s-danger) 45%, var(--s-line));background:color-mix(in oklab, var(--s-danger) 8%, var(--s-raised))}.s-pill.s-credits-low b{color:var(--s-danger)}.s-pill.s-credits-out{color:#fff;border-color:var(--s-danger);background:var(--s-danger);animation:2.4s ease-in-out infinite s-credits-pulse}.s-pill.s-credits-out b{color:#fff}@keyframes s-credits-pulse{0%,to{box-shadow:0 0 0 0 color-mix(in oklab, var(--s-danger) 45%, transparent)}50%{box-shadow:0 0 0 5px #0000}}@media (prefers-reduced-motion:reduce){.s-pill.s-credits-out{animation:none}}.s-badge{font:500 10px var(--s-mono);background:var(--s-line);color:var(--s-soft);white-space:nowrap;border-radius:999px;padding:2px 7px}.s-badge.ok{background:color-mix(in oklab, var(--s-ok) 15%, transparent);color:var(--s-ok)}.s-badge.ai{background:color-mix(in oklab, var(--s-ai) 15%, transparent);color:var(--s-ai)}.s-badge.warn{background:color-mix(in oklab, var(--s-warn) 15%, transparent);color:var(--s-warn)}.s-badge.danger{background:color-mix(in oklab, var(--s-danger) 15%, transparent);color:var(--s-danger)}.s-seg{background:var(--s-bg);border:1px solid var(--s-line);border-radius:10px;gap:2px;padding:3px;display:inline-flex}.s-seg>button,.s-seg>a{height:28px;color:var(--s-mute);white-space:nowrap;border-radius:7px;align-items:center;gap:6px;padding:0 12px;font-size:12.5px;font-weight:500;display:inline-flex}.s-seg>button:hover,.s-seg>a:hover{color:var(--s-soft)}.s-seg>[aria-selected=true],.s-seg>[aria-pressed=true],.s-seg>[aria-current=page]{background:var(--s-raised);color:var(--s-text)}.s-input{background:var(--s-bg);border:1px solid var(--s-line-2);width:100%;height:36px;color:var(--s-text);border-radius:9px;outline:none;padding:0 12px;font-size:13px}.s-input:focus{border-color:var(--s-mute)}.s-input::placeholder{color:var(--s-mute)}textarea.s-input{resize:vertical;height:auto;padding:10px 12px;line-height:1.5}select.s-input{padding:0 8px}.s-label{color:var(--s-mute);text-transform:uppercase;letter-spacing:.06em;margin:0 0 7px;font-size:11px;display:block}.s-kbd{font:500 10px var(--s-mono);color:var(--s-mute);border:1px solid var(--s-line-2);border-radius:5px;padding:1px 5px}.s-card,.s-panel{background:var(--s-panel);border:1px solid var(--s-line);border-radius:var(--s-r-lg)}.s-section-h{color:var(--s-mute);text-transform:uppercase;letter-spacing:.08em;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;font-size:12px;font-weight:500;display:flex}.s-empty{border:1px dashed var(--s-line-2);border-radius:var(--s-r-lg);text-align:center;color:var(--s-soft);padding:48px 20px}.s-empty h3{color:var(--s-text);margin-bottom:6px;font-size:15px;font-weight:600}textarea.s-grow{field-sizing:content;resize:none;min-height:calc(var(--min-lines,2) * 1.6em + .6em);max-height:calc(var(--max-lines,5) * 1.6em + .6em);line-height:1.6;overflow-y:auto}.s-cslide{color:#fff;opacity:0;cursor:pointer;background:#0c0d0f99;border-radius:999px;place-items:center;width:28px;height:28px;transition:opacity .15s;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.s-cslide.l{left:8px}.s-cslide.r{right:8px}.s-media:hover .s-cslide,.s-cslide:focus-visible{opacity:1}@media (hover:none){.s-cslide{opacity:.8}}.s-skel{background:linear-gradient(90deg, var(--s-panel), var(--s-raised), var(--s-panel));border-radius:var(--s-r-lg);background-size:200% 100%;animation:1.4s linear infinite s-shimmer}@keyframes s-shimmer{to{background-position:-200% 0}}.s-media{border-radius:var(--s-r-lg);background:var(--s-panel);border:1px solid var(--s-line);text-align:left;width:100%;transition:border-color .2s;display:block;position:relative;overflow:hidden}.s-media:hover{border-color:var(--s-line-2)}.s-media .m{aspect-ratio:4/3;background:#000;position:relative;overflow:hidden}.s-media .m img,.s-media .m video{object-fit:cover;width:100%;height:100%;transition:transform .5s;display:block}.s-media:hover .m img,.s-media:hover .m video{transform:scale(1.03)}.s-media .tl{gap:4px;display:flex;position:absolute;top:8px;left:8px}.s-media .tl .s-badge{color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0009}.s-media .hov{opacity:0;gap:4px;transition:all .2s;display:flex;position:absolute;top:8px;right:8px;transform:translateY(-4px)}.s-media .hov .s-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0c0d0fb8;border-color:#ffffff1f}.s-media .hov .s-btn:hover{background:#0c0d0fe6}.s-media:hover .hov,.s-media:focus-within .hov{opacity:1;transform:none}@media (hover:none){.s-media .hov{opacity:1;transform:none}}.s-media .ft{justify-content:space-between;align-items:center;gap:8px;padding:9px 11px;display:flex}.s-media .ft b{white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;font-weight:500;overflow:hidden}.s-media .ft span{color:var(--s-mute);white-space:nowrap;font-size:11px}.s-media.sel{outline:2px solid var(--s-accent);outline-offset:-2px}.s-acc{border-bottom:1px solid var(--s-line)}.s-acc>button{text-align:left;grid-template-columns:22px 1fr auto auto;align-items:center;gap:10px;width:100%;padding:12px 14px;display:grid}.s-acc>button:hover{background:var(--s-raised)}.s-acc .ic{color:var(--s-mute);place-items:center;display:grid}.s-acc .nm{font-size:13px;font-weight:500}.s-acc .sum{color:var(--s-mute);text-overflow:ellipsis;white-space:nowrap;max-width:150px;font-size:12px;overflow:hidden}.s-acc .chev{color:var(--s-mute);transition:transform .2s}.s-acc[data-open=true] .chev{transform:rotate(90deg)}.s-acc .b{padding:2px 14px 14px 46px}.s-steps{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.s-step{color:var(--s-mute);border-radius:8px;align-items:center;gap:7px;padding:4px 6px;font-size:12.5px;font-weight:500;display:flex}.s-step:hover:not(:disabled){color:var(--s-soft)}.s-step i{border:1px solid var(--s-line-2);width:20px;height:20px;font:500 10px var(--s-mono);border-radius:50%;place-items:center;font-style:normal;display:grid}.s-step.done{color:var(--s-soft)}.s-step.done i{background:var(--s-ok);border-color:var(--s-ok);color:#06210f}.s-step.cur{color:var(--s-text)}.s-step.cur i{background:var(--s-text);color:var(--s-bg);border-color:var(--s-text)}.s-step:disabled{cursor:default}.s-step-sep{background:var(--s-line-2);width:22px;height:1px}.s-pick{border-radius:var(--s-r-lg);background:var(--s-panel);border:1px solid var(--s-line);flex-direction:column;transition:transform .18s,border-color .18s,box-shadow .18s;display:flex;overflow:hidden}.s-pick:hover,.s-pick:focus-visible{border-color:color-mix(in oklab, var(--s-accent) 45%, var(--s-line-2));transform:translateY(-3px);box-shadow:0 18px 40px #00000073}.s-pick-media{place-items:center;display:grid;position:relative;overflow:hidden}.s-pick-media video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.s-pick:hover .s-pick-media svg{transform:scale(1.08)}.s-pick-media svg{transition:transform .3s}.s-drop{border:1.5px dashed var(--s-line-2);color:var(--s-soft);transition:border-color .15s,background .15s}.s-drop:hover{border-color:var(--s-accent);background:color-mix(in oklab, var(--s-accent) 5%, transparent)}.s-example{background:var(--s-bg);border:1px solid var(--s-line);color:var(--s-soft);transition:border-color .15s,color .15s}.s-example:hover{border-color:var(--s-line-2);color:var(--s-text)}a.s-card,button.s-card{transition:transform .15s,border-color .15s}a.s-card:hover,button.s-card:hover{border-color:var(--s-line-2);transform:translateY(-2px)}.s-tool{width:38px;height:38px;color:var(--s-mute);border-radius:9px;place-items:center;display:grid;position:relative}.s-tool:hover{background:var(--s-raised);color:var(--s-text)}.s-tool[aria-pressed=true]{background:var(--s-raised);color:var(--s-accent);box-shadow:inset 0 0 0 1px var(--s-line-2)}.s-tool-sep{background:var(--s-line);width:22px;height:1px;margin:4px 0}.s-tip{z-index:50;text-align:left;background:var(--s-raised);border:1px solid var(--s-line-2);width:220px;color:var(--s-text);opacity:0;pointer-events:none;border-radius:10px;padding:8px 10px;font-size:12px;line-height:1.4;transition:opacity .12s,transform .12s;position:absolute;top:2px;left:46px;transform:translate(-4px);box-shadow:0 12px 30px #00000073}.s-tip span{color:var(--s-soft)}.s-tool:hover .s-tip,.s-tool:focus-visible .s-tip{opacity:1;transition-delay:.25s;transform:none}.s-ask{z-index:60;background:var(--s-panel);border:1px solid var(--s-line-2);border-radius:16px;flex-direction:column;width:min(420px,100vw - 24px);display:flex;position:fixed;top:12px;bottom:12px;right:12px;overflow:hidden;box-shadow:0 30px 80px #0000008c}@media (max-width:767px){.s-ask{border-radius:16px 16px 0 0;width:auto;inset:10dvh 0 0}}.s-ask .msg{white-space:pre-wrap;font-size:13.5px;line-height:1.55}.s-ask .msg.me{background:var(--s-raised);border:1px solid var(--s-line);border-radius:12px 12px 4px;align-self:flex-end;max-width:85%;padding:8px 12px}.s-ask .msg.ai{color:var(--s-text)}.s-ask .act{border:1px solid color-mix(in oklab, var(--s-ai) 40%, transparent);background:color-mix(in oklab, var(--s-ai) 7%, var(--s-bg));border-radius:12px;gap:8px;padding:10px 12px;display:grid}}@media (prefers-reduced-motion:reduce){.studio *,.studio :before,.studio :after{transition:none!important;animation:none!important}}