:root{--ink:#23344b;--muted:#728198;--line:#dbe3ed;--ice:#edf3f9;--paper:#fff;--cobalt:#2859de;--slate:#334a68;--danger:#ad3347;font-family:"Microsoft YaHei UI","PingFang SC",system-ui,sans-serif;color:var(--ink);background:var(--ice);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,textarea,select{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #779bff}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}[hidden]{display:none!important}a{color:var(--cobalt)}.topbar{height:78px;background:var(--ink);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 32px}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:white;font-family:Georgia,"Times New Roman",serif;font-size:27px}.brand-mark{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #90a5c0;font:24px Georgia;position:relative}.brand-mark>span{font:15px system-ui;position:absolute;right:-5px;top:-7px;background:var(--ink);padding:0 2px}.brand-light{color:#c6d3e4}.private-badge{font:11px "Microsoft YaHei UI",sans-serif;letter-spacing:1px;padding:5px 8px;border:1px solid #52627a;margin-left:8px;color:#b9c9dd}.header-actions{display:flex;gap:26px;align-items:center}.connection{font-size:12px;color:#c7d5e7;display:flex;gap:8px;align-items:center}.connection i{width:7px;height:7px;border-radius:50%;background:#cf9b5c}.connection.online i{background:#79c6b1}.quiet{border:0;background:transparent;color:inherit;padding:8px;font-size:12px}.workspace{display:grid;grid-template-columns:224px 1fr;min-height:calc(100vh - 78px)}.sidebar{background:#e5edf6;border-right:1px solid #d3ddea;padding:32px 16px 24px;display:flex;flex-direction:column}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--muted)}.sidebar>.eyebrow{padding:0 14px;margin-bottom:19px}.workflow-button{width:100%;border:1px solid transparent;background:transparent;display:flex;align-items:center;gap:13px;text-align:left;padding:16px 12px;margin-bottom:7px;border-radius:9px;color:#52647c}.workflow-button:hover{background:#f4f7fc}.workflow-button.active{background:var(--paper);border-color:#d6e0ed;color:var(--cobalt);box-shadow:0 4px 12px #29477206}.workflow-icon{font:25px Georgia;min-width:28px;text-align:center}.workflow-button strong{font-size:13px;line-height:1.5;display:block}.workflow-button small{font-size:10px;display:block;color:var(--muted);margin-top:4px}.sidebar-bottom{margin-top:auto;padding:44px 14px 0}.tiny-label{font-size:10px;letter-spacing:1px;color:var(--muted)}.sidebar-bottom strong{display:block;font-size:12px;line-height:1.6;margin-top:9px;overflow-wrap:anywhere}.sidebar-bottom p{font-size:11px;line-height:1.7;color:var(--muted)}.refresh{padding-left:0;color:var(--slate)}.main{padding:34px 34px 48px;min-width:0;max-width:1800px;width:100%;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px;gap:15px}.intro h1{font-size:27px;letter-spacing:-1px;font-weight:600;margin:10px 0}.muted{color:var(--muted);font-size:12px;line-height:1.8;margin:0}.type-badge{border:1px solid #cbd8e8;color:#677b96;font-size:10px;padding:7px 12px;border-radius:20px;white-space:nowrap}.studio-grid{display:grid;grid-template-columns:minmax(280px,370px) minmax(0,1fr);gap:22px;align-items:start}.control-panel,.output-panel{background:var(--paper);border:1px solid var(--line);border-radius:12px;overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;padding:20px 23px;gap:12px}.panel-heading h2{font-size:13px;font-weight:600;margin:0}.control-panel>.panel-heading{border-bottom:1px solid #e8edf4}.fields{padding:23px;display:grid;gap:22px}.field label{display:block;font-size:12px;font-weight:600;margin-bottom:9px}.required{color:var(--cobalt);margin-left:4px}input:not([type=checkbox]),textarea,select{display:block;width:100%;border:1px solid #d5dfeb;border-radius:6px;background:#f9fbfe;color:var(--ink);padding:11px 12px;font-size:12px;transition:border-color .15s}input:hover,textarea:hover,select:hover{border-color:#9eafc7}textarea{min-height:112px;resize:vertical;line-height:1.8}input[type=file]{font-size:11px;padding:17px 10px;border-style:dashed;background:#f4f8fd}input::file-selector-button{border:0;background:#e3ecfa;color:#385a91;padding:8px;border-radius:4px;margin-right:8px;cursor:pointer}.field .file-hint{display:block;font-size:10px;color:var(--muted);margin-top:8px;overflow-wrap:anywhere}.field.boolean{display:flex;align-items:center;gap:10px}.field.boolean label{margin:0}.field.boolean input{width:17px;height:17px;accent-color:var(--cobalt)}.submit-area{padding:4px 23px 18px}.primary{width:100%;border:0;border-radius:6px;padding:14px 17px;background:var(--cobalt);color:white;font-size:12px;font-weight:600;display:flex;justify-content:space-between;align-items:center;min-height:45px}.primary:hover:not(:disabled){background:#204ac0}.primary span{font-size:18px;font-weight:400}.hint{font-size:10px;color:var(--muted);text-align:center;line-height:1.7;margin:11px 0 0}.error{color:var(--danger);font-size:12px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}.error:empty{display:none}.notice{font-size:12px;padding:12px 16px;margin:0 20px 16px;background:#fff5e7;border:1px solid #f0dfc1;border-radius:6px;line-height:1.8;overflow-wrap:anywhere}#global-error{margin:0 0 20px}.preview{margin:0 20px;background:#eef3f9;min-height:370px;border:1px solid #dde6f0;border-radius:7px;display:flex;justify-content:center;align-items:center;overflow:hidden;position:relative}.empty-state{text-align:center;padding:48px 20px}.empty-state h3{font-size:14px;font-weight:500;margin:26px 0 12px}.empty-state p{font-size:11px;line-height:1.9;color:var(--muted);margin:0}.viewfinder{height:72px;width:94px;margin:auto;background:linear-gradient(#a7b9d2,#a7b9d2) left top/17px 1px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) left top/1px 17px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) right top/17px 1px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) right top/1px 17px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) left bottom/17px 1px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) left bottom/1px 17px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) right bottom/17px 1px no-repeat,linear-gradient(#a7b9d2,#a7b9d2) right bottom/1px 17px no-repeat;display:grid;place-items:center;color:#a7b9d2;font-size:25px;font-weight:200}.preview img,.preview video{width:100%;max-height:600px;object-fit:contain;display:block}.preview audio{width:min(90%,480px)}.preview-actions{display:flex;gap:10px;padding:13px 22px;flex-wrap:wrap;min-height:43px}.download{font-size:11px;padding:6px 10px;background:#edf3fd;text-decoration:none;border-radius:4px}.history{border-top:1px solid #e5ebf2}.jobs{max-height:340px;overflow:auto;padding:0 22px 15px}.history-empty{font-size:11px;color:var(--muted);padding:3px 0 15px}.job{border-top:1px solid #e8edf4;padding:13px 0;display:grid;grid-template-columns:1fr auto;gap:6px 12px}.job-name{font-size:12px;font-weight:500}.job-meta{font-size:10px;color:var(--muted);margin-top:5px}.job-status{font-size:10px;color:var(--slate);display:block;text-align:right}.job-status.completed{color:#26836a}.job-status.failed,.job-status.disconnected{color:var(--danger)}.job button{border:0;background:transparent;color:var(--cobalt);font-size:10px;padding:7px 0 0 10px}.job .error{grid-column:1/-1;margin:0;font-size:10px}.job progress{grid-column:1/-1;width:100%;height:3px;accent-color:var(--cobalt)}.loading{min-height:100vh;display:grid;place-items:center;color:var(--muted);font-size:13px}.login-view{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-art{background:var(--ink);color:white;padding:60px 12%;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.login-art>.brand-mark{margin-bottom:50px}.login-art>p{color:#a7bbd4;font-size:11px;letter-spacing:2px;line-height:1.9}.login-art h1{font-weight:400;font-size:clamp(36px,4.5vw,64px);letter-spacing:3px;line-height:1.5;margin:20px 0 35px}.art-frame{width:100%;height:100px;border-top:1px solid #6e829d;border-bottom:1px solid #6e829d;display:flex;align-items:center;position:relative;margin:0 0 22px}.art-frame span{font-family:Georgia;letter-spacing:5px;font-size:13px;color:#91a8c7}.login-form{max-width:360px;width:calc(100% - 64px);margin:auto;padding:64px 0}.login-form h2{font-weight:500;font-size:28px;margin:16px 0}.login-form label{display:block;font-size:12px;margin:34px 0 10px}.login-form .primary{margin-top:22px}.login-form small{display:block;font-size:10px;color:var(--muted);margin-top:25px;line-height:1.8}@media(min-width:1500px){.preview{min-height:470px}.main{padding:42px 48px}}@media(max-width:1100px){.workspace{grid-template-columns:190px 1fr}.main{padding:28px 22px}.studio-grid{grid-template-columns:minmax(245px,310px) minmax(0,1fr);gap:16px}.panel-heading,.fields{padding:18px}.preview{min-height:340px;margin:0 14px}.private-badge{display:none}.workflow-button{padding:14px 8px;gap:9px}}@media(max-width:850px){.workspace{grid-template-columns:1fr}.sidebar{padding:16px;border-right:0;border-bottom:1px solid var(--line)}.sidebar>.eyebrow,.sidebar-bottom{display:none}#workflow-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.workflow-button{margin:0;padding:11px 8px;justify-content:center}.workflow-icon{display:none}.workflow-button strong{font-size:11px}.workflow-button small{font-size:9px}.main{margin:0}.intro h1{font-size:24px}.topbar{padding:0 22px;height:68px}.brand{font-size:24px}.header-actions{gap:12px}.studio-grid{grid-template-columns:minmax(245px,.8fr) minmax(0,1fr)}}@media(max-width:600px){.main{padding:24px 16px}.studio-grid{grid-template-columns:1fr}.intro{margin-bottom:20px}.intro>.type-badge{display:none}.intro .eyebrow{font-size:9px}.topbar{padding:0 16px}.brand{font-size:22px;gap:9px}.brand-mark{width:29px;height:29px;font-size:21px}.connection{font-size:10px}.header-actions{gap:7px}.sidebar{padding:12px 8px}.workflow-button{padding:10px 3px}.workflow-button small{font-size:8px;letter-spacing:-.2px}.preview{min-height:310px}.login-view{grid-template-columns:1fr}.login-art{padding:28px 32px}.login-art>.brand-mark{margin-bottom:8px}.login-art h1{font-size:30px;margin:8px 0}.login-art h1 br{display:none}.login-art>p,.art-frame{display:none}.login-form{padding:42px 0}.login-form label{margin-top:24px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.auth-shell{max-width:400px;width:calc(100% - 48px);margin:auto;padding:40px 0}.auth-shell .login-form{width:100%;padding:24px 0;max-width:none}.auth-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line)}.auth-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:12px 0;color:var(--muted)}.auth-tabs button.active{color:var(--cobalt);border-bottom-color:var(--cobalt)}.account-name{font-size:11px;overflow-wrap:anywhere}.retention-notice{margin:0 0 20px;background:#e8effa;border-color:#d5e0f0}.admin-panel{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.admin-help{margin:0;padding:0 24px 20px;line-height:1.8;font-size:12px}.admin-users{padding:0 24px}.account-card,.invite-row{border-top:1px solid var(--line);padding:20px 0}.account-card h3,.invite-form h3{font-size:14px;margin:0 0 20px}.admin-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.admin-fields label,#invite-result label{font-size:11px;line-height:2.2}.permissions{border:1px solid var(--line);border-radius:6px;margin:20px 0;padding:12px;display:flex;flex-wrap:wrap;gap:16px}.permissions legend{font-size:11px;color:var(--muted);padding:0 6px}.permissions label{display:flex;gap:6px;align-items:center;font-size:12px}.permissions input{accent-color:var(--cobalt)}.account-actions{display:flex;align-items:center;gap:15px}.account-actions button{background:#edf3fd;color:var(--cobalt);border-radius:4px}.account-actions .danger{color:var(--danger);background:#fff0f1}.invite-form{padding:24px;border-top:1px solid var(--line)}.invite-form .primary{max-width:250px;margin:20px 0}#invite-result{background:var(--ice);padding:16px;border-radius:6px}#invite-code{font-family:monospace;font-size:16px}.all-jobs{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin:0 22px 14px}#admin-nav{font-size:12px;margin-top:16px;justify-content:center;border-color:var(--line)}@media(max-width:600px){.admin-fields{grid-template-columns:1fr}.account-name{max-width:90px;font-size:10px}.header-actions{gap:3px}.permissions{gap:12px}.admin-users{padding:0 16px}.invite-form{padding:20px 16px}.auth-shell{padding:16px 0}.account-actions{flex-wrap:wrap}}

.history-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:0 22px 8px}.history-select-all,.job-selection{display:flex;align-items:center;gap:7px;font-size:11px}.history-tools .danger{color:var(--danger);background:#fff0f1;border-radius:4px}.history-help,.history-message{font-size:11px;line-height:1.7;color:var(--muted);margin:0;padding:0 22px 12px}.job-selection{justify-content:flex-end;margin-top:10px;color:var(--muted)}.history-tools input,.job-selection input{width:16px;height:16px;accent-color:var(--cobalt)}

.task-progress-panel{margin:0 20px 18px;padding:20px;background:#eaf1ff;border:1px solid #a9c1f4;border-radius:9px}.task-progress-heading,.task-progress-line{display:flex;align-items:center;justify-content:space-between;gap:14px}.task-progress-heading{font-size:13px;margin-bottom:18px}.task-stage{font-size:12px;font-weight:500;line-height:1.7}.task-percent{font-size:26px;line-height:1.2;font-weight:700;color:var(--cobalt);white-space:nowrap}.task-bar{display:block;width:100%;height:18px;margin-top:12px;border:0;border-radius:9px;overflow:hidden;accent-color:var(--cobalt);background:#cfddf3}.task-bar::-webkit-progress-bar{background:#cfddf3;border-radius:9px}.task-bar::-webkit-progress-value{background:linear-gradient(90deg,#3d72df,#2454d1);border-radius:9px}.task-bar:indeterminate{background:linear-gradient(90deg,#cfddf3 20%,#6391ed 50%,#cfddf3 80%);background-size:200% 100%;animation:task-busy 1.6s linear infinite}.task-bar:indeterminate::-webkit-progress-bar{background:transparent}.task-progress-note{font-size:10px;color:#62799b;line-height:1.7;margin:12px 0 0}.interrupt-button,.job .interrupt-button{border:1px solid #e8a1a9;color:#ac3345;background:#fff5f6;padding:9px 12px;border-radius:5px;font-size:12px;white-space:nowrap}.job-progress{grid-column:1/-1;background:#f0f5fd;padding:12px;border-radius:6px;margin-top:6px}.job .job-progress progress{height:12px;margin-top:8px}.job-progress .task-percent{font-size:18px}.job-progress .task-stage{font-size:11px}@keyframes task-busy{from{background-position:200% 0}to{background-position:0 0}}@media(prefers-reduced-motion:reduce){.task-bar:indeterminate{animation:none}}

/* Mobile web: readable controls, touch spacing and safe-area navigation. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}.mobile-shortcuts{display:none}button,a,input,select,textarea{touch-action:manipulation}#creation-settings,#creation-output,#creation-history{scroll-margin-top:16px}
@media(max-width:850px){
  body{font-size:15px}.workspace,.studio-grid{grid-template-columns:minmax(0,1fr)}.main{min-width:0;padding:22px 14px calc(92px + env(safe-area-inset-bottom,0px))}.topbar{height:auto;min-height:86px;flex-wrap:wrap;gap:10px;padding:14px max(16px,env(safe-area-inset-left,0px))}.brand{font-size:24px}.header-actions{width:100%;justify-content:space-between;gap:10px}.header-actions .account-name{max-width:46%;font-size:13px}.connection{font-size:12px}.header-actions .quiet{min-height:44px;min-width:48px;font-size:14px}.private-badge{display:none}
  .sidebar{padding:12px 14px}#workflow-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.workflow-button{min-height:64px;padding:12px;text-align:left;justify-content:flex-start}.workflow-button strong{font-size:14px;line-height:1.5}.workflow-button small{font-size:11px;letter-spacing:0}.workflow-button .workflow-icon{display:none}#admin-nav{min-height:44px;margin-top:8px;font-size:14px}.intro{margin-bottom:18px}.intro .eyebrow{display:none}.intro h1{font-size:24px;line-height:1.4;letter-spacing:0;overflow-wrap:anywhere}.intro>.type-badge{display:none}.muted{font-size:14px;line-height:1.7}.retention-notice{font-size:13px;margin-bottom:18px;padding:12px 14px}
  .panel-heading{padding:18px 16px;flex-wrap:wrap}.panel-heading h2{font-size:16px;line-height:1.5}.tiny-label{font-size:11px}.fields{padding:18px 16px;gap:20px}.field label{font-size:15px;margin-bottom:10px}.field .file-hint{font-size:12px;line-height:1.6}input:not([type=checkbox]),textarea,select{font-size:16px;min-height:48px;padding:12px;max-width:100%}textarea{min-height:150px;line-height:1.7}input[type=file]{font-size:14px;white-space:normal;padding:12px 8px}input::file-selector-button{font-size:14px;min-height:44px;margin-right:8px}.field.boolean{min-height:44px}.field.boolean input{width:22px;height:22px;flex-shrink:0}.field.boolean label{padding:10px 0;line-height:1.5}.primary{min-height:50px;font-size:16px;padding:14px 16px}.submit-area{padding:4px 16px 20px}.hint{font-size:12px;line-height:1.6}.error,.notice{font-size:14px}
  .preview{margin:0 12px;min-height:240px}.preview img,.preview video{max-height:72vh;max-height:72svh}.preview audio{width:94%}.preview-actions{padding:12px;gap:8px}.preview-actions button,.download{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:88px;padding:10px 14px;font-size:14px}.empty-state{padding:36px 18px}.empty-state h3{font-size:16px}.empty-state p{font-size:14px;line-height:1.7}
  .task-progress-panel{margin:0 12px 16px;padding:16px}.task-progress-heading{flex-wrap:wrap;font-size:15px}.task-stage{font-size:14px}.task-percent{font-size:28px}.task-progress-note{font-size:12px}.task-bar{height:20px}.interrupt-button,.job .interrupt-button{min-height:44px;padding:10px 14px;font-size:14px}.task-progress-heading .interrupt-button{margin-left:auto}
  .jobs{max-height:none;overflow:visible;padding:0 14px 16px}.job{padding:18px 0;gap:10px;grid-template-columns:minmax(0,1fr) auto}.job-name{font-size:14px;line-height:1.6}.job-meta{font-size:12px;line-height:1.6;overflow-wrap:anywhere}.job-status{font-size:13px}.job button{min-height:44px;font-size:14px;padding:10px 8px}.job-selection{min-height:44px;margin-top:4px;font-size:14px;padding:8px}.job-selection input,.history-tools input,.all-jobs input{width:22px;height:22px;flex-shrink:0}.job .error{font-size:12px}.job-progress .task-stage{font-size:13px}.job-progress .task-percent{font-size:22px}.job .job-progress progress{height:14px}.all-jobs{font-size:13px;line-height:1.6;margin:0 14px 12px;min-height:44px}.history-tools{display:grid;grid-template-columns:1fr 1fr;padding:0 14px 12px;gap:10px}.history-select-all{min-height:44px;font-size:14px}.history-tools .quiet{min-height:44px;font-size:14px;padding:10px}.history-help,.history-message{padding:0 14px 14px;font-size:12px;line-height:1.7}
  .admin-fields{grid-template-columns:minmax(0,1fr);gap:16px}.admin-fields label,#invite-result label{font-size:14px}.admin-users{padding:0 16px}.account-card h3,.invite-form h3{font-size:17px;overflow-wrap:anywhere}.permissions{min-width:0;margin:18px 0;padding:12px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.permissions legend{font-size:14px}.permissions label{min-height:44px;font-size:14px;line-height:1.5;gap:10px}.permissions input{width:22px;height:22px;flex-shrink:0}.account-actions{flex-wrap:wrap;gap:10px}.account-actions button,.admin-panel .quiet{min-height:44px;font-size:14px;padding:10px 14px}.invite-form{padding:20px 16px}.invite-form .primary{max-width:none}.admin-help{font-size:14px;padding:0 16px 20px}#invite-code{font-size:16px;min-width:0}.invite-row{overflow-wrap:anywhere}
  .login-view{min-height:100svh;grid-template-columns:minmax(0,1fr)}.login-art{padding:24px}.login-art>.brand-mark{margin-bottom:8px}.login-art h1{font-size:28px;margin:8px 0;letter-spacing:1px}.login-art h1 br{display:none}.login-art>p,.art-frame{display:none}.auth-shell{width:calc(100% - 40px);max-width:460px;padding:20px 0 calc(24px + env(safe-area-inset-bottom,0px))}.auth-shell .login-form{padding:20px 0}.login-form label{font-size:15px;margin-top:22px}.login-form h2{font-size:26px}.auth-tabs button{min-height:48px;font-size:16px;padding:12px 4px}
  .mobile-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:20;background:#fff;border-top:1px solid #cbd8e8;gap:4px;padding:8px max(8px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px))}.mobile-shortcuts button{border:0;border-radius:6px;background:#edf3fd;color:#244b93;min-height:48px;font-size:14px;font-weight:600;padding:10px 4px}.mobile-shortcuts button:active{background:#d6e4fc}
}
@media(max-width:360px){.main{padding-left:10px;padding-right:10px}.sidebar{padding-left:10px;padding-right:10px}.brand{font-size:22px}.header-actions .account-name{max-width:40%}.job{grid-template-columns:minmax(0,1fr)}.job>div:nth-child(2){display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}.job-status{text-align:left}.job-selection{margin:0}.task-progress-line{flex-wrap:wrap}.history-tools{gap:8px}.history-tools .quiet{font-size:13px}}
@media(pointer:coarse) and (min-width:851px){button,.download,.job-selection,.permissions label{min-height:44px}input:not([type=checkbox]),textarea,select{font-size:16px;min-height:44px}.job button{padding:10px;font-size:13px}}

/* Emotion controls keep a touch-sized slider and editable value. */
.slider-controls{display:grid;grid-template-columns:minmax(0,1fr) 84px;align-items:center;gap:12px}.slider-controls input[type=range]{width:100%;min-width:0;height:44px;padding:0;accent-color:var(--accent,#2854df);cursor:pointer}.slider-controls input[type=number]{width:100%;min-width:0}.field-help{display:block;font-size:13px;line-height:1.6;color:#627286;margin-top:6px}

.field.boolean:has(.field-help){flex-wrap:wrap}.field.boolean .field-help{flex:0 0 100%;margin-top:0}.field.boolean:has(.field-help) label{flex:1}

#preview.cutout-preview,.output-choice img{background-color:#fff;background-image:linear-gradient(45deg,#e4e8ee 25%,transparent 25%),linear-gradient(-45deg,#e4e8ee 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e4e8ee 75%),linear-gradient(-45deg,transparent 75%,#e4e8ee 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}#preview-actions.output-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.output-card{min-width:0;display:flex;flex-direction:column;gap:6px}.output-choice{width:100%;padding:6px;border:2px solid transparent;border-radius:8px;background:#edf3f9;color:var(--ink)}.output-choice.selected{border-color:var(--cobalt)}.output-choice img{display:block;width:100%;height:150px;object-fit:contain;border-radius:4px}.output-choice span{display:block;font-size:13px;line-height:1.5;padding:8px 0;overflow-wrap:anywhere}.output-card .download{text-align:center;min-height:44px}

#preview-actions .output-choice{display:block}#preview-actions .output-choice span{white-space:normal;overflow-wrap:normal;word-break:normal}#preview-actions .output-choice img{width:100%;max-width:100%}

.input-thumbnail{display:flex;align-items:center;gap:14px;width:100%;margin-top:12px;padding:10px;border:1px solid #dce5f3;border-radius:12px;background:#f5f8ff;color:#2854b8;text-align:left;cursor:zoom-in;min-width:0}
.input-thumbnail[hidden]{display:none}
.input-thumbnail img{width:96px;height:96px;object-fit:contain;border-radius:8px;background:repeating-conic-gradient(#e5e9ef 0% 25%,#fff 0% 50%) 0/16px 16px}
.input-thumbnail span{font-size:13px}
.original-dialog{box-sizing:border-box;width:min(1100px,96vw);max-width:96vw;max-height:94dvh;border:0;border-radius:16px;padding:16px;background:#fff;overflow:auto}
.original-dialog::backdrop{background:rgba(10,20,40,.78)}
.original-dialog>button{display:block;margin:0 0 12px auto;min-height:44px}
.original-dialog>img{display:block;width:auto;height:auto;max-width:100%;max-height:74dvh;object-fit:contain;margin:auto;background:repeating-conic-gradient(#e5e9ef 0% 25%,#fff 0% 50%) 0/20px 20px}
.original-caption{overflow-wrap:anywhere;text-align:center;font-size:13px;color:#63728a}
.image-upload-field:focus-visible,.image-upload-field:focus-within{outline:2px solid #3665df;outline-offset:7px;border-radius:8px}
.paste-image{margin-top:10px;min-height:44px}
/* Visual history: media first, optional details, consistent selection tools. */
.jobs{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;max-height:680px;padding:8px 22px 22px;align-items:start}
.jobs>.job{display:flex;flex-direction:column;gap:12px;min-width:0;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
.job-card-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.job-card-actions .job-meta{margin:0}.job-card-actions .job-selection{margin-left:auto}.job-card-actions .job-status{text-align:left}
.history-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0}.history-media:has(>.history-image:only-child){grid-template-columns:1fr}
.job .history-image{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:7px;overflow:hidden;text-align:left;cursor:zoom-in;font-size:12px}
.history-image img{display:block;width:100%;height:180px;object-fit:contain;background:repeating-conic-gradient(#e5e9ef 0% 25%,#fff 0% 50%) 0/16px 16px}.history-image span{display:block;padding:8px;overflow-wrap:anywhere}.history-image:hover{border-color:var(--cobalt)}
.history-media.history-audio{display:flex;flex-direction:column;gap:12px}.history-media audio,.history-media video{width:100%;min-width:0}.history-media .download{align-self:start;min-height:44px;display:inline-flex;align-items:center}
.job-details{font-size:12px;min-width:0}.job-details summary{cursor:pointer;min-height:32px;color:#52647c;padding:8px 0}.job-details .job-meta{overflow-wrap:anywhere}.history-placeholder{padding:28px 10px;text-align:center;color:var(--muted);font-size:13px}.jobs>.history-empty{grid-column:1/-1}
@media(max-width:600px){.jobs{grid-template-columns:minmax(0,1fr);padding:8px 14px 16px;max-height:70vh}.history-image img{height:170px}.job-card-actions .job-selection{min-height:44px}.original-dialog>.download{display:inline-flex;align-items:center;min-height:44px;margin-top:12px}}
.mask-edit{min-height:44px;background:#e8f0ff;border-radius:6px;margin-top:10px}.mask-thumbnail{display:block;max-width:100%;max-height:200px;object-fit:contain;margin-top:10px}
.mask-dialog{width:min(1000px,96vw);max-width:96vw;max-height:95dvh;border:0;border-radius:14px;padding:18px;overflow:auto}.mask-dialog::backdrop{background:#101828bd}.mask-dialog h3{margin:0 0 10px}.mask-dialog p{font-size:13px;line-height:1.6}.mask-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0}.mask-tools button,.mask-dialog>button{min-height:44px;padding:8px 14px;border:1px solid #ccd7e5;border-radius:6px}.mask-tools button[aria-pressed=true]{background:#2859de;color:white}.mask-tools input[type=range]{width:140px}.mask-stage{background:#edf3f9;text-align:center;max-height:60dvh;overflow:auto}.mask-stage canvas{display:block;max-width:100%;max-height:60dvh;width:auto;height:auto;margin:auto;touch-action:none;cursor:crosshair}.mask-dialog>.primary{margin:12px 0}.mask-thumbnail[hidden]{display:none}

/* Persistent visual grouping for all media upload areas. */
.field.upload-panel{padding:16px;border:2px solid #7195df;border-radius:12px;background:#f3f7ff;min-width:0}
.field.replacement-reference{border-color:#639e91;background:#f1f8f5}
.field.upload-panel>label{font-size:13px;line-height:1.6;color:#203b69;padding-bottom:10px;border-bottom:1px solid #ccdaf3}
.field.replacement-reference>label{color:#235649;border-bottom-color:#c8e1d8}
.field.upload-panel .field-help{display:block;font-size:12px;line-height:1.7;margin-top:10px}
.field.upload-panel .paste-image{border:1px solid #bacbe9;background:#fff;border-radius:6px;padding:9px 14px}
@media(max-width:600px){.field.upload-panel{padding:12px}}
/* Day/night theme uses surface colors only; original media colors are preserved. */
.theme-toggle{min-height:44px;white-space:nowrap;border:1px solid #64748b;border-radius:7px;padding:8px 10px}
html[data-theme=dark]{color-scheme:dark;--ink:#e1e8f2;--muted:#a3b2c8;--line:#3c4c64;--ice:#111827;--paper:#1b2535;--cobalt:#91b4ff;--slate:#c2d0e4;--danger:#ffadba}
html[data-theme=dark] .topbar,html[data-theme=dark] .login-art,html[data-theme=dark] .brand-mark>span{background:#111b2b}
html[data-theme=dark] .sidebar{background:#172132;border-color:#3c4c64}
html[data-theme=dark] .workflow-button{color:#bdcbe0}
html[data-theme=dark] .workflow-button:hover,html[data-theme=dark] .workflow-button.active{background:#26374e;border-color:#526d95}
html[data-theme=dark] input:not([type=checkbox]),html[data-theme=dark] textarea,html[data-theme=dark] select{background:#152033;color:#e1e8f2;border-color:#526581}
html[data-theme=dark] input::file-selector-button{background:#304769;color:#e3edff}
html[data-theme=dark] .preview,html[data-theme=dark] .mask-stage{background:#131c2b;border-color:#3c4c64}
html[data-theme=dark] .primary{background:#3767da;color:#fff}
html[data-theme=dark] .download,html[data-theme=dark] .mobile-shortcuts button,html[data-theme=dark] .input-thumbnail,html[data-theme=dark] .mask-edit{background:#263b59;color:#c5d9ff;border-color:#536e95}
html[data-theme=dark] .mobile-shortcuts,html[data-theme=dark] .original-dialog,html[data-theme=dark] .mask-dialog,html[data-theme=dark] .auth-shell,html[data-theme=dark] .account-card,html[data-theme=dark] .invite-row{background:#1b2535;color:#e1e8f2;border-color:#3c4c64}
html[data-theme=dark] .notice{background:#28364a;border-color:#536581;color:#dce7f8}
html[data-theme=dark] .field.upload-panel{background:#1b2b43;border-color:#719ce9}
html[data-theme=dark] .field.replacement-reference{background:#1c3432;border-color:#6eb29e}
html[data-theme=dark] .field.upload-panel>label{color:#d3e2ff;border-color:#46638f}
html[data-theme=dark] .field.replacement-reference>label{color:#c4eee1;border-color:#477e6e}
html[data-theme=dark] .field.upload-panel .paste-image{background:#293e59;color:#dce7fa;border-color:#6380a7}
html[data-theme=dark] .job-details summary,html[data-theme=dark] .original-caption,html[data-theme=dark] .type-badge{color:#b8c9e0}
html[data-theme=dark] .job-status.completed{color:#85dec0}
html[data-theme=dark] .history,html[data-theme=dark] .control-panel>.panel-heading,html[data-theme=dark] .job{border-color:#3c4c64}
html[data-theme=dark] .history-tools .danger{background:#442936;color:#ffc2cc}
html[data-theme=dark] .task-progress-panel,html[data-theme=dark] .task-progress{background:#203149;border-color:#4a6488;color:#deebff}
@media(max-width:600px){.header-actions{gap:8px;flex-wrap:wrap}.theme-toggle{font-size:11px;padding:6px 8px}}