:root{color-scheme:light;font-family:Inter,SF Pro Text,PingFang SC,Microsoft YaHei,ui-sans-serif,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--bg: #eef1f2;--surface: #ffffff;--surface-soft: #f5f7f7;--surface-strong: #172126;--line: #d8dfe1;--line-strong: #bfc9cc;--text: #152026;--text-soft: #44545c;--muted: #718087;--accent: #0a8075;--accent-strong: #08695f;--accent-soft: #e5f4f1;--danger: #bd3f38;--danger-soft: #fff0ee;--warning: #9a5a08;--warning-soft: #fff4df;--success: #177653;--radius: 8px;--shadow: 0 18px 44px rgba(20, 32, 38, .12)}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%}body{margin:0;background:var(--bg);color:var(--text)}body.drawer-open{overflow:hidden}button,input,textarea,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid rgba(10,128,117,.72);outline-offset:2px}h1,h2,h3,p{margin:0}strong,span,small,p,button{overflow-wrap:anywhere}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.studio-shell{min-height:100vh;background:var(--bg)}.command-header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:minmax(190px,auto) minmax(0,1fr) auto;align-items:center;gap:20px;min-height:64px;padding:9px 20px;border-bottom:1px solid rgba(191,201,204,.82);background:#fffffff5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;min-width:0;gap:10px}.brand-mark{display:grid;width:36px;height:36px;flex:0 0 auto;place-items:center;border-radius:7px;background:var(--surface-strong);color:#fff}.brand-copy{min-width:0}.brand-copy strong,.brand-copy small{display:block}.brand-copy strong{font-size:14px;font-weight:800}.brand-copy small{margin-top:2px;color:var(--muted);font-size:10px;white-space:nowrap}.business-nav{display:flex;align-items:stretch;justify-content:center;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:none}.business-nav::-webkit-scrollbar{display:none}.business-nav button{position:relative;min-width:56px;min-height:42px;padding:6px 10px;border:0;border-radius:6px;background:transparent;color:var(--text-soft);cursor:pointer;white-space:nowrap}.business-nav button:after{position:absolute;right:12px;bottom:2px;left:12px;height:2px;background:transparent;content:""}.business-nav button:hover:not(:disabled){background:var(--surface-soft);color:var(--text)}.business-nav button.active{color:var(--accent-strong);font-weight:750}.business-nav button.active:after{background:var(--accent)}.business-nav button span,.business-nav button small{display:block}.business-nav button span{font-size:13px}.business-nav button small{margin-top:1px;color:var(--muted);font-size:8px}.business-nav button:disabled{cursor:default;opacity:.48}.account-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px}.credit-balance,.account-name{display:inline-flex;min-height:34px;align-items:center;gap:5px;padding:0 9px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--text-soft);white-space:nowrap}.credit-balance svg{color:var(--accent)}.credit-balance strong{color:var(--text);font-size:14px}.credit-balance small,.account-name{font-size:11px}.icon-action{display:inline-grid;width:34px;height:34px;flex:0 0 auto;place-items:center;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--text-soft);cursor:pointer;text-decoration:none}.icon-action:hover:not(:disabled),.icon-action:hover:not(.disabled){border-color:var(--line-strong);color:var(--accent-strong)}.icon-action:disabled,.icon-action.disabled{pointer-events:none;opacity:.38}.creation-workspace{display:grid;width:min(1220px,calc(100% - 32px));min-height:0;margin:0 auto;padding:18px 0 22px;grid-template-rows:clamp(420px,55vh,620px) auto auto;gap:12px}.canvas-section{position:relative;display:grid;min-height:0;overflow:hidden;grid-template-rows:44px minmax(0,1fr);border:1px solid var(--line);border-radius:var(--radius);background:#e5e9ea}.canvas-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 8px 5px 14px;border-bottom:1px solid rgba(191,201,204,.9);background:#ffffffe6}.canvas-topline>div:first-child{display:flex;align-items:center;min-width:0;gap:8px}.canvas-topline strong{font-size:12px}.canvas-topline small{color:var(--muted);font-size:10px}.status-dot{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:var(--success)}.status-dot.working{background:var(--warning);animation:pulse 1.1s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}.canvas-actions{display:flex;gap:6px}.canvas-viewport{position:relative;display:grid;min-height:0;place-items:center;overflow:hidden;background-color:#e7ebec;background-image:linear-gradient(45deg,rgba(98,115,122,.05) 25%,transparent 25%),linear-gradient(-45deg,rgba(98,115,122,.05) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(98,115,122,.05) 75%),linear-gradient(-45deg,transparent 75%,rgba(98,115,122,.05) 75%);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px}.canvas-viewport>img{display:block;width:100%;height:100%;min-height:0;object-fit:contain}.canvas-empty,.generating-state{display:grid;width:min(440px,calc(100% - 40px));justify-items:center;gap:8px;text-align:center}.canvas-empty>span,.generating-mark{display:grid;width:54px;height:54px;place-items:center;border:1px solid rgba(191,201,204,.9);border-radius:var(--radius);background:#ffffffbd;color:var(--text-soft)}.canvas-empty strong,.generating-state strong{margin-top:5px;font-size:16px}.canvas-empty p,.generating-state p{color:var(--muted);font-size:12px;line-height:1.65}.generating-mark{color:var(--accent)}.generating-line{width:min(300px,82%);height:3px;margin-top:6px;overflow:hidden;border-radius:3px;background:#71808733}.generating-line i{display:block;width:38%;height:100%;background:var(--accent);animation:progress 1.4s ease-in-out infinite}@keyframes progress{0%{transform:translate(-110%)}to{transform:translate(365%)}}.canvas-error{position:absolute;right:12px;bottom:12px;left:12px;padding:10px 12px;border:1px solid rgba(189,63,56,.22);border-radius:7px;background:#fff0eef5;color:var(--danger);font-size:12px}.command-dock{border:1px solid #26343a;border-radius:var(--radius);background:var(--surface-strong);color:#f7fbfc;box-shadow:var(--shadow)}.command-context{display:grid;grid-template-columns:auto minmax(150px,auto) minmax(0,1fr) auto;align-items:center;gap:10px;min-height:48px;padding:8px 10px 8px 12px;border-bottom:1px solid rgba(255,255,255,.1)}.context-icon{display:grid;width:30px;height:30px;place-items:center;border-radius:6px;background:#ffffff17;color:#83d7cd}.context-copy{min-width:0}.context-copy small{display:block;color:#8fa0a7;font-size:9px}.context-copy strong{display:block;margin-top:2px;font-size:13px}.tool-select{position:relative;display:inline-flex;align-items:center;max-width:190px}.tool-select select{width:100%;padding:1px 20px 1px 0;border:0;outline:0;appearance:none;background:transparent;color:#fff;font-size:13px;font-weight:750;cursor:pointer}.tool-select select option{background:#fff;color:var(--text)}.tool-select svg{position:absolute;right:0;pointer-events:none;color:#8fa0a7}.command-context>p{min-width:0;overflow:hidden;color:#9eacb1;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.settings-trigger{display:inline-flex;min-height:32px;align-items:center;gap:6px;padding:0 9px;border:1px solid rgba(255,255,255,.14);border-radius:6px;background:#ffffff0f;color:#c8d0d3;cursor:pointer;font-size:10px;white-space:nowrap}.settings-trigger:hover{border-color:#83d7cd80;color:#fff}.prompt-field{position:relative}.prompt-field textarea{display:block;width:100%;min-height:94px;max-height:190px;resize:vertical;padding:15px 48px 10px 16px;border:0;outline:0;background:transparent;color:#f7fbfc;font-size:14px;line-height:1.65}.prompt-field textarea::placeholder{color:#708087}.prompt-count{position:absolute;right:12px;bottom:10px;color:#65767d;font-size:9px}.command-notice-row{display:flex;align-items:center;gap:10px;min-height:40px;padding:5px 12px;border-top:1px solid rgba(255,255,255,.08)}.reference-preview{display:flex;gap:5px}.reference-item{position:relative;width:30px;height:30px;flex:0 0 auto;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:5px}.reference-item img{width:100%;height:100%;object-fit:cover}.reference-item button{position:absolute;top:0;right:0;display:grid;width:15px;height:15px;padding:0;place-items:center;border:0;background:#0b1114c2;color:#fff;cursor:pointer}.reference-more{display:grid;width:30px;height:30px;place-items:center;border-radius:5px;background:#ffffff14;color:#c8d0d3;font-size:10px}.upload-notice,.reference-warning{color:#93a2a8;font-size:10px}.reference-warning{color:#f0bb68}.command-footer{display:flex;min-height:52px;align-items:center;justify-content:space-between;gap:12px;padding:7px 8px 8px 10px;border-top:1px solid rgba(255,255,255,.1)}.command-tools,.generate-group{display:flex;align-items:center;gap:7px;min-width:0}.dock-action{display:inline-flex;min-height:32px;align-items:center;gap:6px;padding:0 9px;border:0;border-radius:6px;background:transparent;color:#b8c3c7;cursor:pointer;font-size:11px;white-space:nowrap}.dock-action:hover{background:#ffffff12;color:#fff}.reference-mode{color:#6f8087;font-size:9px;white-space:nowrap}.template-menu-wrap{position:relative}.template-menu{position:absolute;z-index:30;bottom:calc(100% + 9px);left:0;display:grid;width:min(360px,calc(100vw - 36px));gap:4px;padding:6px;border:1px solid var(--line);border-radius:7px;background:#fff;box-shadow:var(--shadow)}.template-menu:after{position:absolute;bottom:-6px;left:28px;width:10px;height:10px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;content:"";transform:rotate(45deg)}.template-menu button{display:block;min-width:0;padding:8px;border:0;border-radius:5px;background:transparent;color:var(--text);cursor:pointer;text-align:left}.template-menu button:hover{background:var(--surface-soft)}.template-menu strong,.template-menu span{display:block}.template-menu strong{font-size:11px}.template-menu span{margin-top:3px;overflow:hidden;color:var(--muted);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.credit-cost{display:inline-flex;align-items:center;gap:5px;color:#92a1a7;font-size:10px;white-space:nowrap}.generate-button{display:inline-flex;min-width:138px;min-height:38px;align-items:center;justify-content:center;gap:7px;padding:0 13px;border:1px solid #35a99e;border-radius:6px;background:#2c9b90;color:#fff;cursor:pointer;font-size:12px;font-weight:800}.generate-button:hover:not(:disabled){background:#248a80}.generate-button:disabled{cursor:default;opacity:.42}.filmstrip{min-width:0;padding:8px 0 0}.filmstrip-heading{display:flex;align-items:center;justify-content:space-between;min-height:28px;gap:12px}.filmstrip-heading>span,.filmstrip-heading button{display:inline-flex;align-items:center;gap:6px}.filmstrip-heading>span{color:var(--text-soft);font-size:11px;font-weight:750}.filmstrip-heading button{padding:5px 0;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:10px}.filmstrip-heading button:hover{color:var(--accent-strong)}.filmstrip-empty{display:grid;min-height:58px;place-items:center;border:1px dashed var(--line-strong);border-radius:7px;color:var(--muted);font-size:10px;text-align:center}.filmstrip-track{display:flex;gap:7px;min-width:0;overflow-x:auto;padding:1px 0 5px;scrollbar-color:var(--line-strong) transparent}.asset-tile{display:grid;width:142px;min-width:142px;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:7px;padding:5px;border:1px solid var(--line);border-radius:7px;background:#ffffffb8;cursor:pointer;text-align:left}.asset-tile:hover{border-color:var(--line-strong);background:#fff}.asset-tile.selected{border-color:#0a80758c;box-shadow:inset 0 0 0 1px #0a807524}.asset-thumb{display:grid;width:48px;height:40px;overflow:hidden;place-items:center;border-radius:5px;background:#e3e8e9;color:var(--muted)}.asset-thumb img{width:100%;height:100%;object-fit:cover}.asset-copy{min-width:0}.asset-copy strong,.asset-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.asset-copy strong{font-size:10px}.asset-copy small{margin-top:4px;color:var(--muted);font-size:9px}.drawer-layer{position:fixed;z-index:100;inset:0;display:flex;justify-content:flex-end;background:#101b2057;animation:fade-in .14s ease-out}@keyframes fade-in{0%{opacity:0}}.drawer{display:grid;width:min(420px,92vw);height:100%;grid-template-rows:auto minmax(0,1fr);background:var(--surface);box-shadow:-20px 0 50px #131f2529;animation:slide-in .18s ease-out}@keyframes slide-in{0%{transform:translate(100%)}}.drawer-header{display:flex;min-height:68px;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px 12px 18px;border-bottom:1px solid var(--line)}.drawer-header strong,.drawer-header span{display:block}.drawer-header strong{font-size:16px}.drawer-header span{margin-top:3px;color:var(--muted);font-size:10px}.drawer-body{min-height:0;overflow-y:auto;padding:14px}.drawer-search{display:flex;min-height:38px;align-items:center;gap:8px;padding:0 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface-soft);color:var(--muted)}.drawer-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:var(--text);font-size:12px}.drawer-filters{display:flex;gap:5px;margin:10px 0 12px}.drawer-filters button{min-height:30px;padding:0 10px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--text-soft);cursor:pointer;font-size:10px}.drawer-filters button.active{border-color:#0a807547;background:var(--accent-soft);color:var(--accent-strong);font-weight:700}.history-results{display:grid;gap:7px}.drawer-empty{display:grid;min-height:180px;place-items:center;color:var(--muted);font-size:11px}.history-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px;border:1px solid var(--line);border-radius:7px;background:#fff}.history-item.selected{border-color:#0a80757a}.history-main{display:grid;min-width:0;grid-template-columns:62px minmax(0,1fr);gap:9px;padding:7px;border:0;background:transparent;cursor:pointer;text-align:left}.history-thumb{display:grid;width:62px;height:62px;overflow:hidden;place-items:center;border-radius:5px;background:var(--surface-soft);color:var(--muted)}.history-thumb img{width:100%;height:100%;object-fit:cover}.history-copy{min-width:0}.history-copy>span{display:flex;align-items:center;justify-content:space-between;gap:7px}.history-copy strong{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.history-copy em{flex:0 0 auto;color:var(--muted);font-size:9px;font-style:normal}.history-copy em.completed{color:var(--success)}.history-copy em.failed{color:var(--danger)}.history-copy p{display:-webkit-box;margin-top:7px;overflow:hidden;color:var(--text-soft);font-size:10px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}.history-copy small{display:flex;align-items:center;gap:4px;margin-top:6px;color:var(--muted);font-size:8px}.reuse-action{display:grid;width:30px;height:30px;margin-right:7px;place-items:center;border:0;border-radius:6px;background:var(--surface-soft);color:var(--muted);cursor:pointer}.reuse-action:hover{color:var(--accent-strong)}.settings-content{display:grid;gap:20px}.setting-group>span{display:block;margin-bottom:8px;color:var(--text-soft);font-size:11px;font-weight:750}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.choice-grid button{position:relative;display:flex;min-height:38px;align-items:center;justify-content:center;gap:5px;padding:0 8px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--text-soft);cursor:pointer;font-size:10px}.choice-grid button:hover{border-color:var(--line-strong)}.choice-grid button.active{border-color:#0a807580;background:var(--accent-soft);color:var(--accent-strong);font-weight:750}.settings-total{display:flex;align-items:center;justify-content:space-between;margin-top:22px;padding:13px;border-top:1px solid var(--line);background:var(--surface-soft)}.settings-total span{color:var(--muted);font-size:10px}.settings-total strong{font-size:14px}.login-shell{display:grid;min-height:100vh;place-items:center;padding:24px;background:#e8edee}.login-card{width:min(420px,calc(100vw - 48px));min-width:0;padding:20px;border:1px solid var(--line-strong);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow)}.login-heading{margin:34px 0 24px}.login-heading>span{display:inline-flex;align-items:center;gap:6px;color:var(--accent-strong);font-size:10px;font-weight:750}.login-heading h1{margin-top:10px;font-size:24px;letter-spacing:0}.login-heading p{margin-top:7px;color:var(--muted);font-size:12px}.login-form{display:grid;gap:8px}.login-form label{margin-top:5px;color:var(--text-soft);font-size:10px;font-weight:700}.login-form input{min-height:42px;padding:0 11px;border:1px solid var(--line);border-radius:6px;outline:0;background:var(--surface-soft);color:var(--text);font-size:12px}.login-form input:focus{border-color:#0a807594;background:#fff}.login-error{padding:9px 10px;border-radius:6px;background:var(--danger-soft);color:var(--danger);font-size:10px}.login-submit{display:flex;min-height:42px;align-items:center;justify-content:center;gap:8px;margin-top:9px;border:1px solid var(--accent-strong);border-radius:6px;background:var(--accent);color:#fff;cursor:pointer;font-size:12px;font-weight:800}.login-submit:disabled{opacity:.48}.login-card footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:24px;padding-top:13px;border-top:1px solid var(--line);color:var(--muted);font-size:9px}@media(max-width:980px){.command-header{grid-template-columns:auto minmax(0,1fr) auto;gap:10px;padding-inline:12px}.brand-copy{display:none}.business-nav{justify-content:flex-start}.account-name{display:none}.creation-workspace{width:min(100% - 24px,920px);grid-template-rows:minmax(360px,54vh) auto auto}.command-context{grid-template-columns:auto minmax(130px,auto) minmax(0,1fr) auto}}@media(max-width:720px){.command-header{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;min-height:58px;padding:7px 9px}.brand-mark{width:34px;height:34px}.business-nav button{min-width:49px;padding-inline:7px}.business-nav button small,.credit-balance small{display:none}.credit-balance{padding-inline:7px}.creation-workspace{width:100%;min-height:auto;padding:0;grid-template-rows:minmax(290px,46vh) auto auto;gap:0}.canvas-section{border-width:0 0 1px;border-radius:0}.canvas-topline{min-height:42px}.canvas-topline small{display:none}.command-dock{border-width:0 0 1px;border-radius:0;box-shadow:none}.command-context{grid-template-columns:auto minmax(0,1fr) auto;gap:8px}.command-context>p{display:none}.settings-trigger span{display:none}.settings-trigger{width:32px;padding:0;justify-content:center}.prompt-field textarea{min-height:106px;font-size:13px}.command-footer{align-items:stretch}.command-tools{flex:1}.reference-mode,.credit-cost{display:none}.generate-button{min-width:122px}.filmstrip{padding:10px 10px 6px;background:var(--bg)}.drawer{width:100%}}@media(max-width:480px){.login-shell{padding:16px}.login-card{width:min(420px,calc(100vw - 32px))}.login-card footer{flex-wrap:wrap}.command-header{grid-template-columns:auto minmax(0,1fr) auto;gap:6px}.business-nav button{min-width:45px;min-height:38px;padding-inline:5px}.business-nav button span{font-size:12px}.credit-balance{min-height:32px}.account-actions .icon-action{display:none}.canvas-empty{width:calc(100% - 28px)}.canvas-empty strong{font-size:14px}.canvas-empty p{max-width:280px}.command-context{padding-inline:9px}.context-icon{display:none}.command-context{grid-template-columns:minmax(0,1fr) auto}.tool-select{max-width:150px}.command-footer{flex-wrap:wrap;padding:7px 8px 8px}.command-tools{justify-content:flex-start}.dock-action{padding-inline:7px}.generate-group{margin-left:auto}.generate-button{min-width:116px;padding-inline:10px}.asset-tile{width:132px;min-width:132px}.choice-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
