html,body,#root{min-height:100%}body{overflow-x:hidden}svg{display:block}:root{--sidebar:248px;--bg:#08090c;--surface:#101116;--surface-2:#15161d;--surface-3:#1b1c25;--line:#ffffff17;--line-strong:#9e70ff6b;--text:#f7f5fb;--muted:#aaa7b4;--subtle:#716e7c;--brand:#9560ff;--brand-2:#7840ec;--brand-soft:#9560ff1f;--green:#55dca4;--amber:#f4bf59;--red:#fa7b90;--shadow:0 24px 70px #00000042;--radius:18px}:root[data-theme=light]{--bg:#f5f5f8;--surface:#fff;--surface-2:#f9f8fc;--surface-3:#f0eef6;--line:#1f1a2b1f;--line-strong:#703fd761;--text:#1c1924;--muted:#625e6c;--subtle:#817c8a;--brand:#7440de;--brand-2:#6226c4;--brand-soft:#7440de17;--green:#16845c;--amber:#9a6410;--red:#bf294b;--shadow:0 18px 52px #251d3414}*{box-sizing:border-box}html{background:var(--bg);min-width:320px;min-height:100%}body{min-height:100vh;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-offset:2px;outline:3px solid #9560ff59}::selection{color:#fff;background:#7541df}.app{grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:100vh;display:grid}.sidebar{z-index:30;width:var(--sidebar);border-right:1px solid var(--line);background:color-mix(in srgb,var(--bg) 94%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);flex-direction:column;display:flex;position:fixed;inset:0 auto 0 0}.brand{border-bottom:1px solid var(--line);align-items:center;gap:12px;height:76px;padding:0 20px;display:flex}.brand-symbol{color:#fff;background:linear-gradient(145deg,#aa7aff,#7134de);border-radius:11px;flex:none;place-items:center;width:38px;height:38px;font-weight:800;display:grid;box-shadow:0 8px 28px #7740e14d}.brand>span:last-child{flex-direction:column;gap:3px;min-width:0;display:flex}.brand b{letter-spacing:.12em;font-size:15px}.brand small{color:var(--subtle);letter-spacing:.15em;font:600 9px/1.2 monospace}.primary-nav{flex:1;padding:22px 12px;overflow-y:auto}.primary-nav>p,.step-nav>p{color:var(--subtle);letter-spacing:.16em;text-transform:uppercase;margin:0 10px 9px;font:600 10px/1.2 monospace}.nav-item,.side-step{width:100%;min-height:46px;color:var(--muted);text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;align-items:center;gap:12px;padding:0 12px;font-size:13px;font-weight:600;transition:all .18s;display:flex;position:relative}.nav-item:hover,.side-step:hover{color:var(--text);background:var(--surface-2)}.nav-item.active,.side-step.active{color:var(--text);border-color:var(--line-strong);background:var(--brand-soft)}.nav-item svg{width:18px}.nav-item i{background:var(--brand);border-radius:3px;width:3px;position:absolute;inset:8px auto 8px -1px}.step-nav{margin-top:26px}.side-step>span{border:1px solid var(--line);width:24px;height:24px;color:var(--subtle);border-radius:8px;flex:none;place-items:center;font:700 9px/1 monospace;display:grid}.side-step>span svg{width:13px}.side-step.done>span{color:var(--green);border-color:color-mix(in srgb,var(--green) 40%,transparent);background:color-mix(in srgb,var(--green) 10%,transparent)}.service-card{border:1px solid var(--line);background:var(--surface);border-radius:12px;align-items:center;gap:11px;margin:12px 14px 18px;padding:14px;display:flex}.service-card>div{flex-direction:column;gap:3px;min-width:0;display:flex}.service-card b{font-size:11px}.service-card small{color:var(--subtle);text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.service-pulse{background:var(--amber);width:9px;height:9px;box-shadow:0 0 0 5px color-mix(in srgb,var(--amber) 10%,transparent);border-radius:50%;flex:none}.service-pulse.online{background:var(--green);box-shadow:0 0 0 5px color-mix(in srgb,var(--green) 10%,transparent)}.service-pulse.offline{background:var(--red);box-shadow:0 0 0 5px color-mix(in srgb,var(--red) 10%,transparent)}.service-pulse.loading{animation:1.2s infinite pulse}.main{grid-column:2;min-width:0}.topbar{z-index:20;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);align-items:center;gap:16px;height:76px;padding:0 30px;display:flex;position:sticky;top:0}.crumb{min-width:0;color:var(--subtle);letter-spacing:.12em;align-items:center;gap:9px;font:600 10px/1 monospace;display:flex}.crumb svg{width:13px}.crumb b{color:var(--text);letter-spacing:0;text-overflow:ellipsis;white-space:nowrap;font:700 13px/1 DM Sans,Noto Sans SC,sans-serif;overflow:hidden}.top-actions{align-items:center;gap:8px;margin-left:auto;display:flex}.theme-toggle,.icon-button{border:1px solid var(--line);background:var(--surface);min-width:42px;height:42px;color:var(--muted);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:7px;padding:0 12px;font-size:12px;font-weight:700;display:inline-flex}.theme-toggle:hover,.icon-button:hover{color:var(--text);border-color:var(--line-strong)}.theme-toggle svg,.icon-button svg{width:16px}.mobile-menu,.menu-scrim{display:none}.page{width:min(1280px,100%);margin:0 auto;padding:38px 34px 80px}.page-hero{align-items:flex-start;gap:16px;margin-bottom:26px;display:flex}.hero-icon{border:1px solid var(--line-strong);color:#b996ff;background:linear-gradient(145deg,var(--brand-soft),transparent);border-radius:14px;flex:none;place-items:center;width:46px;height:46px;display:grid;box-shadow:0 10px 28px #6130b91f}.hero-icon svg{width:21px}.eyebrow{color:var(--brand);letter-spacing:.16em;margin:0 0 7px;font:700 10px/1.2 monospace}h1{letter-spacing:-.04em;margin:0;font-size:clamp(30px,4vw,46px);line-height:1.08}.hero-copy{max-width:760px;color:var(--muted);margin:10px 0 0;font-size:14px;line-height:1.8}.alert{border:1px solid var(--line);color:var(--muted);background:var(--surface);border-radius:12px;align-items:flex-start;gap:11px;margin:0 0 18px;padding:14px 16px;font-size:12px;line-height:1.6;display:flex}.alert>svg{flex:none;width:18px;margin-top:1px}.alert>div{flex-direction:column;gap:2px;display:flex}.alert b{color:var(--text)}.alert.warning{border-color:color-mix(in srgb,var(--amber) 30%,transparent);background:color-mix(in srgb,var(--amber) 7%,var(--surface))}.alert.warning>svg{color:var(--amber)}.alert.danger{border-color:color-mix(in srgb,var(--red) 30%,transparent)}.alert.danger>svg{color:var(--red)}.stepper{grid-template-columns:repeat(4,1fr);gap:8px;margin:0 0 20px;display:grid}.stepper button{border:1px solid var(--line);background:var(--surface);min-height:58px;color:var(--subtle);cursor:pointer;border-radius:12px;align-items:center;gap:10px;padding:9px 12px;display:flex}.stepper button:hover{border-color:var(--line-strong)}.stepper button.active{color:var(--text);border-color:var(--line-strong);background:var(--brand-soft)}.stepper button>span{background:var(--surface-3);width:27px;height:27px;color:var(--brand);border-radius:8px;place-items:center;font:700 11px/1 monospace;display:grid}.stepper button>span svg{width:14px}.stepper button.done>span{color:#fff;background:var(--brand)}.stepper b{font-size:12px}.panel{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);overflow:hidden}.panel-header{border-bottom:1px solid var(--line);align-items:flex-start;gap:14px;min-height:90px;padding:20px 22px;display:flex}.panel-header>span{width:29px;height:29px;color:var(--brand);background:var(--brand-soft);border-radius:9px;flex:none;place-items:center;font:700 10px/1 monospace;display:grid}.panel-header h2,.section-toolbar h2,.history-head h2{letter-spacing:-.02em;margin:0;font-size:18px}.panel-header p{color:var(--muted);margin:6px 0 0;font-size:12px;line-height:1.6}.panel-body{padding:23px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.field{flex-direction:column;gap:8px;min-width:0;display:flex}.field.full,.form-actions.full{grid-column:1/-1}.field-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.field-head label{color:var(--text);font-size:12px;font-weight:700}.field-head span{color:var(--subtle);font-size:10px}.field input,.field textarea,.field select,.revision-row textarea{border:1px solid var(--line);background:var(--surface-2);width:100%;color:var(--text);border-radius:11px;outline:none;transition:all .16s}.field input,.field select{height:46px;padding:0 13px}.field textarea,.revision-row textarea{resize:vertical;min-height:132px;padding:12px 13px;line-height:1.65}.field textarea.compact{min-height:96px}.field textarea.prompt{min-height:180px}.field input::placeholder,.field textarea::placeholder,.revision-row textarea::placeholder{color:color-mix(in srgb,var(--subtle) 72%,transparent)}.field input:focus,.field textarea:focus,.field select:focus,.revision-row textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.field-error{color:var(--red);margin:0;font-size:11px}.form-actions{justify-content:space-between;align-items:center;gap:10px;margin-top:24px;display:flex}.form-actions.end{justify-content:flex-end}.button{border:1px solid var(--line);min-height:42px;color:var(--text);background:var(--surface-2);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:0 15px;font-size:12px;font-weight:700;transition:all .16s;display:inline-flex}.button svg{width:16px}.button:hover:not(:disabled){border-color:var(--line-strong);transform:translateY(-1px)}.button.primary{color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:#0000;box-shadow:0 12px 28px #632ec538}.button.danger{color:var(--red);border-color:color-mix(in srgb,var(--red) 30%,transparent)}.button:disabled,.text-button:disabled{opacity:.45;cursor:not-allowed}.choice-grid,.style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.choice{border:1px solid var(--line);background:var(--surface-2);cursor:pointer;border-radius:13px;align-items:flex-start;gap:12px;min-height:102px;padding:16px;transition:all .16s;display:flex}.choice:hover{border-color:var(--line-strong);transform:translateY(-1px)}.choice.selected{border-color:var(--brand);background:var(--brand-soft);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand) 28%,transparent)}.choice input{opacity:0;pointer-events:none;position:absolute}.choice-code{border:1px solid var(--line);width:30px;height:30px;color:var(--brand);background:var(--surface);border-radius:9px;flex:none;place-items:center;font:700 10px/1 monospace;display:grid}.choice-code svg{width:15px}.choice-main{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.choice-main b{font-size:14px}.choice-main small{color:var(--muted);font-size:11px;line-height:1.55}.choice em{color:var(--brand);background:var(--brand-soft);white-space:nowrap;border-radius:99px;padding:4px 7px;font-size:9px;font-style:normal}.settings-grid{margin-top:20px}.segments{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.segments label{position:relative}.segments input{opacity:0;position:absolute}.segments span{border:1px solid var(--line);min-height:44px;color:var(--muted);background:var(--surface-2);cursor:pointer;border-radius:10px;place-items:center;font-size:11px;display:grid}.segments label.selected span{color:var(--text);border-color:var(--brand);background:var(--brand-soft)}.summary-row{border:1px solid var(--line);background:var(--line);border-radius:14px;grid-template-columns:repeat(4,1fr);gap:1px;margin-bottom:18px;display:grid;overflow:hidden}.summary-row>div{background:var(--surface);flex-direction:column;gap:7px;min-width:0;padding:15px 17px;display:flex}.summary-row small{color:var(--subtle);letter-spacing:.1em;font:700 9px/1 monospace}.summary-row b{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:330px;padding:35px;display:flex}.empty-state>span,.canvas-state .orb{border:1px solid var(--line-strong);width:68px;height:68px;color:var(--brand);background:var(--brand-soft);border-radius:22px;place-items:center;display:grid}.empty-state>span svg,.empty-state>svg{width:26px}.empty-state h2,.canvas-state h2{margin:18px 0 7px;font-size:17px}.empty-state p,.canvas-state p{max-width:430px;color:var(--muted);margin:0;font-size:12px;line-height:1.7}.section-toolbar{justify-content:space-between;align-items:flex-end;gap:14px;margin:22px 0 13px;display:flex}.section-toolbar>div:last-child{flex-wrap:wrap;gap:8px;display:flex}.review-list{gap:13px;display:grid}.review-card{border:1px solid var(--line);background:var(--surface);border-radius:15px;overflow:hidden}.review-card header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;min-height:55px;padding:8px 15px;display:flex}.review-card header>span{color:var(--brand);letter-spacing:.12em;font:700 10px/1 monospace}.review-card header>div{gap:7px;display:flex}.review-card header .button{min-height:36px;padding:0 10px;font-size:10px}.review-columns{grid-template-columns:1fr 1fr;display:grid}.review-columns>div{min-width:0;padding:19px}.review-columns>div+div{border-left:1px solid var(--line);background:var(--surface-2)}.review-columns small{color:var(--subtle);letter-spacing:.11em;text-transform:uppercase;font:700 9px/1 monospace}.review-columns p{white-space:pre-wrap;overflow-wrap:anywhere;margin:10px 0 0;font-size:14px;line-height:1.85}.review-columns>div+div p{color:var(--muted)}.revision-panel{margin-top:18px}.revision-row{grid-template-columns:1fr auto;align-items:stretch;gap:10px;display:grid}.revision-row textarea{min-height:78px}.chips{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.chips button,.text-button{border:1px solid var(--line);min-height:36px;color:var(--muted);cursor:pointer;background:0 0;border-radius:99px;align-items:center;gap:6px;padding:0 10px;font-size:10px;display:inline-flex}.chips button:hover,.text-button:hover{color:var(--text);border-color:var(--line-strong)}.text-button.danger{color:var(--red)}.text-button svg{width:14px}.artist-grid{grid-template-columns:minmax(330px,440px) minmax(0,1fr);align-items:start;gap:18px;display:grid}.controls-panel{position:sticky;top:94px}.controls-panel .panel-body{gap:19px;display:grid}.preset-list{gap:8px;display:grid}.preset-list button{border:1px solid var(--line);min-height:54px;color:var(--muted);background:var(--surface-2);text-align:left;cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:8px 11px;display:flex}.preset-list button:hover{border-color:var(--line-strong);color:var(--text)}.preset-list button>svg:first-child{width:16px;color:var(--brand)}.preset-list button>svg:last-child{width:15px;margin-left:auto}.preset-list button span{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.preset-list b{color:var(--text);font-size:11px}.preset-list small{text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.dropzone{border:1px dashed var(--line-strong);min-height:132px;color:var(--muted);background:var(--brand-soft);text-align:center;cursor:pointer;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:18px;display:flex;position:relative;overflow:hidden}.dropzone input{z-index:2;opacity:0;cursor:pointer;position:absolute;inset:0}.upload-icon{width:40px;height:40px;color:var(--brand);background:var(--surface);border-radius:12px;place-items:center;margin-bottom:3px;display:grid}.upload-icon svg{width:18px}.dropzone b{color:var(--text);font-size:12px}.dropzone small{font-size:10px}.dropzone.has-preview{background:#050507;min-height:180px}.dropzone img{object-fit:contain;border-radius:9px;max-width:100%;max-height:260px}.replace-image{z-index:1;color:#fff;background:#000000b8;border-radius:7px;align-items:center;gap:5px;padding:7px 9px;font-size:9px;display:inline-flex;position:absolute;bottom:10px;right:10px}.replace-image svg{width:12px}.compact-grid{grid-template-columns:1fr 1fr}.compact-grid .field:first-child{grid-column:1/-1}.generate-actions{justify-content:flex-end;align-items:center;gap:12px;display:flex}.generate-actions>span{min-width:0;color:var(--muted);align-items:center;gap:7px;font-size:10px;display:flex}.generate-actions>span svg{width:15px}.canvas-panel{min-height:692px}.canvas{background-color:color-mix(in srgb,var(--bg) 85%,var(--surface));background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:28px 28px;place-items:center;min-height:601px;padding:22px;display:grid;position:relative}.canvas-state{text-align:center;flex-direction:column;align-items:center;display:flex}.canvas-state .orb svg{width:25px}.generated{object-fit:contain;border-radius:12px;max-width:100%;max-height:650px;display:block;box-shadow:0 24px 64px #00000061}.canvas-actions{gap:8px;display:flex;position:absolute;bottom:14px;right:14px}.canvas-actions .button{background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.history-panel{margin-top:18px;padding:21px}.history-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.history-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:11px;margin-top:17px;display:grid}.history-grid article{border:1px solid var(--line);background:var(--surface-2);border-radius:12px;overflow:hidden}.history-preview{aspect-ratio:1;cursor:pointer;background:#050507;border:0;width:100%;padding:0;position:relative;overflow:hidden}.history-preview img{object-fit:cover;width:100%;height:100%}.history-preview span{color:#fff;text-overflow:ellipsis;white-space:nowrap;background:#000000b8;border-radius:7px;padding:6px 7px;font-size:9px;position:absolute;inset:auto 7px 7px;overflow:hidden}.history-grid article>button:last-child{border:0;border-top:1px solid var(--line);width:100%;min-height:40px;color:var(--muted);cursor:pointer;background:0 0;justify-content:center;align-items:center;gap:6px;font-size:10px;display:flex}.history-grid article>button:last-child:hover{color:var(--text);background:var(--brand-soft)}.history-grid article>button:last-child svg{width:13px}.history-empty{min-height:90px;color:var(--subtle);justify-content:center;align-items:center;gap:10px;font-size:11px;display:flex}.history-empty svg{width:17px}.toast-region{z-index:80;gap:9px;width:min(380px,100vw - 36px);display:grid;position:fixed;bottom:18px;right:18px}.toast{border:1px solid var(--line);color:var(--text);background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:12px;align-items:center;gap:9px;padding:13px 13px 13px 15px;font-size:11px;animation:.2s toast-in;display:flex}.toast>svg{width:17px;color:var(--brand)}.toast.success>svg{color:var(--green)}.toast.error>svg{color:var(--red)}.toast span{flex:1}.toast button{width:30px;height:30px;color:var(--subtle);cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;padding:0;display:grid}.toast button svg{width:14px}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.45;transform:scale(.82)}}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}}@media (width<=1080px){.app{display:block}.sidebar{transition:transform .2s;transform:translate(-105%);box-shadow:28px 0 80px #0000005c}.menu-open .sidebar{transform:translate(0)}.menu-scrim{z-index:25;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0303059e;border:0;position:fixed;inset:0}.menu-open .menu-scrim{display:block}.main{width:100%}.mobile-menu{flex:none;display:inline-flex}.artist-grid{grid-template-columns:1fr}.controls-panel{position:static}}@media (width<=760px){.topbar{height:64px;padding:0 14px}.crumb>span,.crumb>svg,.top-actions .button span,.theme-toggle span{display:none}.top-actions .button,.theme-toggle{width:42px;padding:0}.page{padding:26px 14px 52px}.page-hero{gap:12px}.hero-icon{border-radius:12px;width:41px;height:41px}h1{font-size:31px}.stepper{grid-template-columns:repeat(2,1fr)}.form-grid,.choice-grid,.style-grid,.review-columns{grid-template-columns:1fr}.review-columns>div+div{border-top:1px solid var(--line);border-left:0}.summary-row{grid-template-columns:repeat(2,1fr)}.panel-header,.panel-body{padding:17px}.section-toolbar{flex-direction:column;align-items:flex-start}.revision-row{grid-template-columns:1fr}.canvas-panel{min-height:500px}.canvas{min-height:410px;padding:13px}.canvas-actions{flex-wrap:wrap;width:100%;margin-top:12px;position:static}.canvas-actions .button{flex:1}}@media (width<=460px){.hero-copy{font-size:13px}.stepper{gap:6px}.stepper button{gap:7px;min-height:52px;padding:8px}.stepper button>span{width:25px;height:25px}.stepper b{font-size:11px}.summary-row{grid-template-columns:1fr}.form-actions{flex-direction:column-reverse;align-items:stretch}.form-actions .button{width:100%}.review-card header{flex-direction:column;align-items:flex-start;padding:13px}.review-card header>div{width:100%}.review-card header .button{flex:1}.segments,.compact-grid{grid-template-columns:1fr}.compact-grid .field:first-child{grid-column:auto}.generate-actions{flex-direction:column;align-items:stretch}.generate-actions .button{width:100%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.studio-stepper{grid-template-columns:repeat(3,1fr)}.studio-settings{border:1px solid var(--line);background:var(--surface-2);border-radius:14px;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:18px;display:grid}.studio-settings .field:last-child{grid-column:1/-1}.mode-card{border:1px solid var(--line);background:var(--surface-2);border-radius:13px;justify-content:space-between;align-items:center;gap:20px;min-height:72px;padding:14px 16px;display:flex}.mode-card>div{align-items:center;gap:12px;min-width:0;display:flex}.mode-card>div>svg{width:20px;color:var(--brand)}.mode-card>div span{flex-direction:column;gap:4px;display:flex}.mode-card b{font-size:12px}.mode-card small{color:var(--muted);font-size:10px;line-height:1.5}.switch{flex:none;width:44px;height:24px;position:relative}.switch input{opacity:0;position:absolute}.switch span{border:1px solid var(--line);background:var(--surface-3);cursor:pointer;border-radius:99px;transition:all .18s;position:absolute;inset:0}.switch span:after{content:"";background:var(--muted);border-radius:50%;width:16px;height:16px;transition:all .18s;position:absolute;top:3px;left:3px}.switch input:checked+span{border-color:var(--brand);background:var(--brand)}.switch input:checked+span:after{background:#fff;left:23px}.plan-workspace,.render-workspace{gap:18px;display:grid}.plan-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.plan-card>header{border-bottom:1px solid var(--line);align-items:center;gap:12px;min-height:76px;padding:15px 18px;display:flex}.plan-card>header>span,.render-card>header>div>span{width:31px;height:31px;color:var(--brand);background:var(--brand-soft);border-radius:9px;flex:none;place-items:center;font:700 10px/1 monospace;display:grid}.plan-card>header>div{flex:1;min-width:0}.plan-card>header small,.render-card header small{color:var(--subtle);letter-spacing:.12em;margin-bottom:5px;font:700 9px/1 monospace;display:block}.plan-card>header input{width:100%;color:var(--text);background:0 0;border:0;outline:0;padding:0;font-size:16px;font-weight:700}.plan-card>header em{color:var(--brand);background:var(--brand-soft);border-radius:99px;padding:5px 8px;font-size:9px;font-style:normal}.plan-card-body{padding:18px}.plan-details{border:1px solid var(--line);background:var(--surface-2);border-radius:11px;padding:11px 13px}.plan-details summary{color:var(--muted);cursor:pointer;font-size:11px;font-weight:700}.plan-details[open] summary{color:var(--text);margin-bottom:15px}.sticky-actions{z-index:12;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 90%,transparent);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:14px;justify-content:space-between;gap:10px;padding:12px;display:flex;position:sticky;bottom:14px}.render-control-grid{grid-template-columns:minmax(240px,360px) 1fr;align-items:start;gap:22px;display:grid}.studio-dropzone{min-height:210px}.render-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.render-options>.button{grid-column:1/-1;min-height:48px}.production-summary{border:1px solid var(--line);background:var(--line);border-radius:12px;grid-column:1/-1;grid-template-columns:1fr 1fr;gap:1px;display:grid;overflow:hidden}.production-summary>div{background:var(--surface-2);flex-direction:column;gap:6px;padding:14px;display:flex}.production-summary small{color:var(--subtle);letter-spacing:.1em;font:700 9px/1 monospace}.production-summary b{font-size:12px}.render-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.render-card>header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;min-height:70px;padding:13px 15px;display:flex}.render-card>header>div{align-items:center;gap:11px;min-width:0;display:flex}.render-card h2{text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:14px;overflow:hidden}.render-card header .button{min-height:36px;padding:0 10px}.render-frame{background-color:color-mix(in srgb,var(--bg) 85%,var(--surface));background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:28px 28px;place-items:center;min-height:360px;display:grid;overflow:hidden}.render-frame>img{object-fit:contain;width:100%;height:100%;max-height:620px}.render-frame .canvas-state{padding:34px}.render-card>footer{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;min-height:62px;padding:11px 14px;display:flex}.render-card>footer p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:10px;overflow:hidden}.render-card>footer .button{flex:none;min-height:36px}@media (width<=980px){.studio-settings{grid-template-columns:repeat(2,minmax(0,1fr))}.plan-list,.render-grid,.render-control-grid{grid-template-columns:1fr}}@media (width<=620px){.studio-settings,.render-options{grid-template-columns:1fr}.studio-settings .field:last-child{grid-column:auto}.studio-stepper{grid-template-columns:1fr}.mode-card{align-items:flex-start}.sticky-actions{flex-direction:column-reverse;align-items:stretch;position:static}.sticky-actions .button{width:100%}.render-card>header{align-items:flex-start}.render-card>header>div{flex:1}.render-card header .button span{display:none}.render-frame{min-height:300px}}