@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{--navy:#15243b;--navy-2:#203653;--blue:#2356a8;--blue-soft:#eef4ff;--text:#132036;--muted:#728099;--line:#dbe3ef;--line-2:#cbd6e6;--surface:#fff;--page:#f1f4f8;--success:#12a66a;--success-soft:#effbf6;--danger:#ee4f57;--shadow:0 10px 32px rgba(23,42,70,.06)}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,"Microsoft YaHei",system-ui,sans-serif;color:var(--text);background:var(--page)}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(35,86,168,.18);outline-offset:2px}
[hidden]{display:none!important}
.hidden-input{display:none}

.studio-shell{min-height:100vh}
.app-header{height:76px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;gap:22px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96);position:sticky;top:0;z-index:20;backdrop-filter:blur(14px)}
.brand-block,.header-actions,.asset-actions,.queue-toolbar,.queue-summary,.queue-actions,.prompt-footer,.card-title-row{display:flex;align-items:center}
.brand-block{gap:12px;min-width:0}.brand-block h1{margin:0;font-size:21px;letter-spacing:-.35px}.brand-block p{margin:4px 0 0;color:var(--muted);font-size:12px}
.brand-mark{width:38px;height:38px;display:grid;place-items:center;position:relative;transform:rotate(45deg);border-radius:11px;background:linear-gradient(145deg,#274d87,#12253f);box-shadow:0 8px 18px rgba(22,42,71,.2)}
.brand-mark i{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff}.brand-mark i:nth-child(1){left:9px;top:9px}.brand-mark i:nth-child(2){right:9px;top:9px}.brand-mark i:nth-child(3){left:9px;bottom:9px}
.header-actions{gap:10px}.connection-state{height:38px;padding:0 13px;display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:12px;background:#fff;color:#516078;font-size:12px}.connection-state i,.key-security i{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(18,166,106,.1)}
.connection-state.offline i{background:#98a4b5;box-shadow:0 0 0 4px rgba(117,130,149,.1)}
.key-button,.ghost-button,.dark-button{height:38px;padding:0 15px;border-radius:12px;font-size:12px;font-weight:650}.key-button,.ghost-button{border:1px solid var(--line);background:#fff;color:var(--text)}.dark-button{border:0;background:var(--navy);color:#fff}.key-button:hover,.ghost-button:hover{border-color:#aebed4;background:#f8fafc}.dark-button:hover{background:var(--navy-2)}
.key-status{min-width:250px;padding:8px 14px;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;border:1px solid var(--line);border-radius:14px;background:#f7f9fc}.key-status span{grid-row:1/3;color:#7b889d;font-size:11px}.key-status strong{font-size:12px}.key-status small{color:#768399;font-size:10px}

.workbench{min-height:calc(100vh - 76px);padding:10px;display:grid;grid-template-columns:minmax(600px,3fr) minmax(430px,2fr);gap:10px}
.control-panel,.queue-panel{min-width:0;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}
.control-panel{padding:18px;overflow:auto}.queue-panel{padding:18px;display:flex;flex-direction:column;position:sticky;top:86px;height:calc(100vh - 96px);overflow:hidden}
.section-heading,.queue-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.compact-heading{margin-bottom:14px;align-items:center}.section-heading h2,.queue-head h2,.parameter-title h2{margin:2px 0 0;font-size:18px}.eyebrow{color:#3563a3;font-size:10px;font-weight:750;letter-spacing:.09em;text-transform:uppercase}
.mode-tabs{display:flex;padding:3px;border:1px solid var(--line);border-radius:11px;background:#f5f7fa}.mode-tabs button{height:32px;padding:0 15px;border:0;border-radius:8px;background:transparent;color:#718097;font-size:12px}.mode-tabs button.active{background:#fff;color:var(--navy);box-shadow:0 3px 10px rgba(20,39,66,.1)}

.workspace-card{margin-top:10px;padding:16px;border:1px solid var(--line);border-radius:15px;background:#fff}.prompt-card{margin-top:0}.card-title-row{min-height:30px;justify-content:space-between;gap:14px}.card-title-row label{font-size:13px;font-weight:700}.card-title-row label small,.card-title-row>div>small{margin-left:5px;color:#8591a5;font-size:10px;font-weight:500}.asset-actions{gap:7px}.asset-actions>span{color:#8793a7;font-size:10px}.asset-actions .ghost-button,.asset-actions .dark-button{height:32px;padding:0 12px;border-radius:9px}
.reference-grid{min-height:86px;margin-top:9px;padding:8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;border:1px dashed var(--line-2);border-radius:12px;background:#fafbfd}.upload-tile{min-height:68px;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;border-radius:9px;background:transparent;color:#78869b}.upload-tile:hover{background:var(--blue-soft);color:var(--blue)}.upload-tile span{font-size:20px}.upload-tile b{font-size:11px}.upload-tile small{font-size:8px;text-align:center}.reference-thumb{min-height:68px;position:relative;overflow:hidden;border-radius:9px;background:#edf1f6}.reference-thumb img{width:100%;height:100%;position:absolute;object-fit:cover}.reference-thumb button{width:22px;height:22px;padding:0;position:absolute;right:4px;top:4px;border:0;border-radius:50%;background:rgba(13,27,46,.78);color:#fff;font-size:15px}
.prompt-wrap{margin-top:10px;border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.18s}.prompt-wrap:focus-within,.fixed-content textarea:focus{border-color:#7fa2d4;box-shadow:0 0 0 3px rgba(35,86,168,.08)}.prompt-wrap textarea{width:100%;height:122px;padding:13px;border:0;outline:0;resize:vertical;color:var(--text);font-size:13px;line-height:1.65}.prompt-wrap textarea::placeholder,.fixed-content textarea::placeholder{color:#9aa7ba}.prompt-footer{min-height:35px;padding:0 11px;justify-content:space-between;border-top:1px solid #edf1f6;background:#fbfcfe;color:#8a96a9;font-size:9px}.prompt-footer button{border:0;background:transparent;color:var(--blue);font-size:10px}
.fixed-content{margin-top:12px;padding-top:12px;border-top:1px solid #edf1f6}.fixed-content textarea{width:100%;height:66px;margin-top:7px;padding:11px;border:1px solid var(--line);border-radius:10px;outline:0;resize:vertical;font-size:11px;line-height:1.55}.fixed-content p{margin:6px 0 0;color:#8a96a8;font-size:9px}.danger-link{height:30px;padding:0 10px;border:0;border-radius:8px;background:#fff0f1;color:#d94149;font-size:10px;font-weight:650}.danger-link:hover{background:#ffe3e5}

.batch-panel .card-title-row{align-items:flex-start}.batch-list{display:grid;gap:6px;margin-top:9px;max-height:180px;overflow:auto}.batch-item{min-height:42px;padding:8px 68px 8px 38px;position:relative;border:1px solid var(--line);border-radius:9px;background:#fbfcfe}.batch-item p{margin:0;font-size:10px;line-height:1.5}.batch-index{position:absolute;left:10px;top:10px;color:var(--blue);font-size:9px;font-weight:700}.batch-item>b{position:absolute;right:32px;top:10px;color:#8b97a9;font-size:8px}.batch-item button{position:absolute;right:7px;top:7px;width:22px;height:22px;padding:0;border:0;border-radius:6px;background:#eef2f7;color:#68768b}.batch-submit{width:100%;height:38px;margin-top:9px;border:0;border-radius:10px;background:var(--navy);color:#fff;font-size:11px;font-weight:700}

.parameter-title{align-items:flex-end}.size-chip{padding:5px 8px;border-radius:7px;background:var(--blue-soft);color:var(--blue);font-size:10px;font-weight:700}.setting-block{margin-top:13px}.setting-block>label{display:block;margin-bottom:7px;color:#4f5e74;font-size:10px;font-weight:650}.ratio-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.ratio-grid button{height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid var(--line);border-radius:10px;background:#fbfcfe;color:#607086;font-size:9px}.ratio-grid button:hover{border-color:#9db2cf}.ratio-grid button.active{border-color:var(--navy);background:#f3f6fa;color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}.ratio-grid button i{width:var(--w);height:var(--h);display:block;border:1.5px solid currentColor;border-radius:2px}.extended-ratios{margin-top:7px;padding:8px;border-radius:11px;background:#f7f9fc}.settings-grid{display:grid;grid-template-columns:1fr 1.35fr 1fr 1.2fr;gap:9px}.segmented{height:38px;padding:3px;display:flex;border:1px solid var(--line);border-radius:10px;background:#f4f6f9}.segmented button{min-width:0;flex:1;border:0;border-radius:7px;background:transparent;color:#758297;font-size:9px}.segmented button.active{background:#fff;color:var(--navy);font-weight:700;box-shadow:0 2px 7px rgba(19,36,59,.1)}.segmented.locked button:not(.active){opacity:.4;pointer-events:none}.select-wrap select{width:100%;height:38px;padding:0 28px 0 10px;border:1px solid var(--line);border-radius:10px;outline:0;background:#fff;color:var(--text);font-size:10px}.generate-button{width:100%;height:54px;margin-top:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;border-radius:12px;background:linear-gradient(110deg,#182a43,#203c60);color:#fff;box-shadow:0 9px 22px rgba(18,37,62,.18)}.generate-button:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(18,37,62,.24)}.generate-button span{font-size:14px;font-weight:750}.generate-button small{margin-top:3px;color:#bfcbda;font-size:8px}

.queue-head{align-items:center}.icon-button{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#607087;font-size:22px}.queue-toolbar{min-height:46px;margin-top:12px;gap:8px;border-bottom:1px solid #edf1f6}.select-all{border:0;background:transparent;color:#53647b;font-size:10px}.queue-summary{flex:1;justify-content:center;gap:5px}.queue-summary span{padding:5px 7px;border-radius:7px;background:#f4f6f9;color:#8793a6;font-size:8px}.queue-summary b{color:#42536c}.queue-toolbar .ghost-button{height:29px;padding:0 9px;border-radius:8px;font-size:9px}.queue-actions{gap:7px;margin-top:10px}.queue-actions button{flex:1;height:32px;border:1px solid var(--line);border-radius:9px;background:#fff;color:#627187;font-size:9px}.queue-actions .danger{color:#da3f47}.queue-search{height:38px;margin-top:9px;padding:0 7px 0 11px;display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:10px;background:#fbfcfe}.queue-search>span{color:#7c899d}.queue-search input{min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;font-size:10px}.queue-search button{width:24px;height:24px;padding:0;border:0;border-radius:6px;background:#edf1f6;color:#78869b}.task-queue{min-height:0;flex:1;margin-top:10px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));align-content:start;gap:9px;overflow:auto}.queue-empty{grid-column:1/-1;min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#93a0b3;text-align:center}.queue-empty>span{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:#f0f3f7;color:#7c8ba0;font-size:22px}.queue-empty b{margin-top:12px;color:#66758a;font-size:12px}.queue-empty p{max-width:230px;margin:6px 0;font-size:9px;line-height:1.55}
.queue-task{min-width:0;padding:12px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 5px 15px rgba(26,45,72,.04)}.queue-task.completed{border-color:#8de0bb;background:linear-gradient(145deg,#fff,#f7fffb)}.queue-task.running{border-color:#9db7dc}.queue-task.failed{border-color:#f1a8ad}.task-top,.task-meta,.task-controls,.task-bulk{display:flex;align-items:center;justify-content:space-between;gap:5px}.task-index{color:var(--navy);font-size:10px;font-weight:800}.task-state{padding:3px 6px;border-radius:99px;background:#edf1f6;color:#66768b;font-size:8px}.completed .task-state{background:#e5f8ef;color:#138258}.running .task-state{background:#eaf1fb;color:#2f65ae}.failed .task-state{background:#ffebed;color:#ce3f47}.task-name{margin:7px 0 4px;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px;align-items:center}.task-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.task-name button,.task-controls button,.task-bulk button{height:25px;padding:0 6px;border:1px solid var(--line);border-radius:7px;background:#fff;color:#617187;font-size:8px}.task-prompt{max-height:92px;margin:6px 0;padding:7px;overflow:auto;border-radius:7px;background:#f6f8fb;color:#627087;font-size:9px;line-height:1.5}.task-meta{color:#8b97a9;font-size:8px}.task-images{margin-top:8px;display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.task-images.count-1{grid-template-columns:1fr}.task-images.count-2,.task-images.count-4{grid-template-columns:repeat(2,1fr)}.task-image{position:relative;aspect-ratio:1;overflow:hidden;border-radius:8px;background:#e8edf3}.task-image img{width:100%;height:100%;object-fit:cover}.task-image input{position:absolute;right:4px;top:4px;accent-color:var(--navy)}.task-image button{position:absolute;left:4px;bottom:4px;width:24px;height:24px;border:0;border-radius:6px;background:rgba(14,29,48,.78);color:#fff}.task-image em{position:absolute;left:4px;top:4px;padding:2px 4px;border-radius:4px;background:rgba(14,29,48,.72);color:#fff;font-size:7px;font-style:normal}.task-bulk,.task-controls{margin-top:7px}.task-bulk button,.task-controls button{flex:1}.auth-error{display:block;margin-top:6px;color:#d14249;font-size:8px;line-height:1.4}
.queue-fab{position:fixed;right:18px;bottom:18px;z-index:20;height:42px;padding:0 15px;border:0;border-radius:99px;background:var(--navy);color:#fff;box-shadow:0 10px 28px rgba(18,37,62,.25)}.studio-shell.queue-collapsed .workbench{grid-template-columns:1fr}.studio-shell.queue-collapsed .queue-panel{display:none}.studio-shell.queue-collapsed .queue-fab{display:block!important}

.key-dialog{width:min(500px,calc(100vw - 26px));padding:0;border:0;border-radius:20px;background:transparent}.key-dialog::backdrop{background:rgba(12,25,42,.58);backdrop-filter:blur(6px)}.key-card{padding:28px;position:relative;border-radius:20px;background:#fff;box-shadow:0 26px 80px rgba(11,24,41,.3)}.dialog-close{position:absolute;right:14px;top:14px;width:30px;height:30px;border:0;border-radius:8px;background:#eef2f6;color:#64738a;font-size:20px}.key-hero{display:flex;align-items:center;gap:12px}.key-hero>i{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:var(--navy);color:#fff;font-style:normal}.key-hero span{color:#4b70a3;font-size:9px;font-weight:800;letter-spacing:.12em}.key-hero h2{margin:3px 0 0;font-size:21px}.key-card>p{color:#77859a;font-size:11px}.key-label{display:grid;gap:7px;font-size:11px;font-weight:700}.key-input-wrap{height:48px;padding:0 7px 0 12px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:11px}.key-input-wrap input{min-width:0;flex:1;height:100%;border:0;outline:0}.key-input-wrap button{height:32px;border:0;border-radius:8px;background:#edf3fb;color:var(--blue);font-size:10px}.key-security{margin-top:8px;display:flex;align-items:center;gap:7px;color:#7c899b;font-size:9px}.dialog-actions{margin-top:20px;display:flex;justify-content:flex-end;gap:8px}.dialog-actions button{height:40px;padding:0 16px;border-radius:10px;font-size:11px;font-weight:700}.key-cancel{border:1px solid var(--line);background:#fff;color:#66758a}.key-save{border:0;background:var(--navy);color:#fff}
.toast{position:fixed;left:50%;bottom:24px;z-index:80;transform:translateX(-50%);min-width:260px;max-width:calc(100vw - 30px);padding:11px 38px 11px 14px;border-radius:10px;background:var(--navy);color:#fff;box-shadow:0 14px 38px rgba(13,27,45,.28);font-size:11px}.toast.ok{background:#147a58}.toast.error{background:#b53c43}.toast button{position:absolute;right:7px;top:7px;width:25px;height:25px;border:0;border-radius:6px;background:rgba(255,255,255,.12);color:#fff}
.image-viewer{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;background:rgba(6,13,23,.94)}.image-viewer img{max-width:calc(100vw - 110px);max-height:calc(100vh - 80px);object-fit:contain}.viewer-toolbar{height:52px;padding:0 14px;position:absolute;left:0;right:0;top:0;display:flex;align-items:center;justify-content:flex-end;gap:7px;color:#fff;background:linear-gradient(rgba(0,0,0,.7),transparent)}.viewer-toolbar>span{margin-right:auto}.viewer-toolbar strong{position:absolute;left:50%;transform:translateX(-50%);font-size:11px}.viewer-toolbar button{height:30px;padding:0 10px;border:1px solid rgba(255,255,255,.28);border-radius:7px;background:rgba(255,255,255,.1);color:#fff}.viewer-nav{position:absolute;top:50%;width:40px;height:58px;border:0;border-radius:8px;background:rgba(255,255,255,.12);color:#fff;font-size:30px}.viewer-nav.prev{left:14px}.viewer-nav.next{right:14px}

.settings-grid.parameter-selects{grid-template-columns:repeat(5,minmax(0,1fr));margin-top:9px}.select-wrap{position:relative}.select-wrap::after{content:"";width:6px;height:6px;position:absolute;right:13px;top:50%;border-right:1.5px solid #60718a;border-bottom:1.5px solid #60718a;transform:translateY(-70%) rotate(45deg);pointer-events:none}.select-wrap select{height:44px;padding:0 30px 0 12px;border-color:var(--line-2);border-radius:11px;appearance:none;background:linear-gradient(180deg,#fff,#fbfcfe);font-weight:650;cursor:pointer;transition:border-color .18s,box-shadow .18s,background .18s}.select-wrap select:hover{border-color:#9db0ca;background:#fff}.select-wrap select:focus{border-color:#6187bd;box-shadow:0 0 0 3px rgba(35,86,168,.1)}.select-wrap select:disabled{cursor:not-allowed;background:#eef2f6;color:#9aa6b7}.parameter-card{background:linear-gradient(145deg,#fff 0%,#fbfdff 100%)}.parameter-select{min-width:0;margin-top:0;padding:9px;border:1px solid #e3e9f2;border-radius:12px;background:rgba(255,255,255,.82);transition:border-color .18s,box-shadow .18s}.parameter-select:hover{border-color:#c6d3e5;box-shadow:0 5px 14px rgba(27,52,84,.05)}.parameter-select>label{min-height:0;margin:0 2px 7px;display:flex;color:#34455e}.parameter-select>label span{font-size:10px;font-weight:750}
@media(max-width:1200px){.workbench{grid-template-columns:minmax(520px,3fr) minmax(370px,2fr)}.settings-grid,.settings-grid.parameter-selects{grid-template-columns:1fr 1fr}.key-status{min-width:210px}}
@media(max-width:900px){.app-header{height:auto;min-height:70px;padding:10px 14px}.connection-state,.key-status{display:none}.workbench{grid-template-columns:1fr}.queue-panel{position:static;height:620px}.settings-grid,.settings-grid.parameter-selects{grid-template-columns:1fr 1fr}.studio-shell.queue-collapsed .queue-panel{display:none}}
@media(max-width:620px){.brand-block p{display:none}.brand-block h1{font-size:16px}.brand-mark{width:32px;height:32px}.workbench{padding:6px}.control-panel,.queue-panel{padding:12px;border-radius:14px}.section-heading{align-items:flex-start;flex-direction:column}.compact-heading{align-items:stretch}.mode-tabs{align-self:stretch}.mode-tabs button{flex:1}.ratio-grid{grid-template-columns:repeat(3,1fr)}.settings-grid,.settings-grid.parameter-selects{grid-template-columns:1fr}.asset-actions>span,.asset-actions .ghost-button{display:none}.queue-toolbar{flex-wrap:wrap}.queue-summary{order:3;flex-basis:100%}.task-queue{grid-template-columns:1fr}.image-viewer img{max-width:100vw}.viewer-toolbar strong{display:none}}

/* Desktop 100% zoom: keep the complete creation flow inside one 900px-tall screen. */
@media(min-width:901px) and (min-height:720px){
  .workbench{height:calc(100vh - 76px);min-height:0}
  .control-panel{height:100%;padding:14px;display:flex;flex-direction:column;overflow:auto;scrollbar-gutter:stable}
  .queue-panel{top:86px;height:calc(100vh - 96px)}
  .compact-heading{min-height:38px;margin-bottom:9px;flex:0 0 auto}
  .workspace-card{margin-top:8px;padding:11px 14px;border-radius:13px}
  .prompt-card{min-height:0;flex:1 1 auto;display:flex;flex-direction:column}
  .batch-panel,.parameter-card{flex:0 0 auto}
  .card-title-row{min-height:27px}
  .reference-grid{min-height:62px;margin-top:6px;padding:6px}
  .upload-tile{min-height:50px;gap:1px}
  .upload-tile span{font-size:17px}
  .reference-thumb{min-height:50px}
  .prompt-wrap{min-height:99px;margin-top:7px;display:flex;flex:1 1 auto;flex-direction:column}
  .prompt-wrap textarea{height:auto;min-height:70px;padding:10px 12px;flex:1 1 auto}
  .prompt-footer{min-height:29px}
  .fixed-content{margin-top:8px;padding-top:8px}
  .fixed-content textarea{height:44px;min-height:42px;margin-top:5px;padding:8px 10px}
  .fixed-content p{margin-top:4px}
  .batch-panel{min-height:55px;padding-top:9px;padding-bottom:9px}
  .batch-list:empty{display:none}
  .parameter-card{padding-top:10px;padding-bottom:10px}
  .parameter-title{min-height:27px}
  .setting-block{margin-top:8px}
  .setting-block>label{margin-bottom:5px}
  .ratio-grid button{height:43px;gap:2px}
  .extended-ratios{padding:5px}
  .segmented{height:34px}
  .parameter-select{padding:7px}
  .parameter-select>label{min-height:0;margin-bottom:6px}
  .select-wrap select{height:38px}
  .generate-button{height:45px;margin-top:10px}
  .generate-button span{font-size:13px}
  .generate-button small{margin-top:1px}
}

@media(min-width:901px) and (max-height:780px){
  .app-header{height:64px}
  .workbench{height:calc(100vh - 64px);min-height:0}
  .queue-panel{top:74px;height:calc(100vh - 84px)}
  .brand-block p,.connection-state{display:none}
  .prompt-wrap textarea{height:68px}
  .fixed-content textarea{height:40px;min-height:38px}
  .reference-grid{min-height:54px}
  .upload-tile,.reference-thumb{min-height:42px}
  .ratio-grid button{height:39px}
}

/* Compact horizontal task queue */
.queue-head-redesign{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:10px}.queue-title{text-align:center}.queue-title .eyebrow{display:block}.queue-title h2{margin-top:1px}.queue-head-redesign>.select-all,.queue-head-actions button{height:32px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#40516a;font-size:9px;font-weight:650}.queue-head-redesign>.select-all:hover,.queue-head-actions .clear-all:hover{border-color:#aebed4;background:#f7f9fc}.queue-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px}.queue-head-actions .download-selected{border-color:#16a25f;background:#16a25f;color:#fff}.queue-head-actions .delete-selected{border-color:#d83455;background:#d83455;color:#fff}.queue-head-actions button:disabled{border-color:#dfe5ed;background:#edf1f5;color:#9aa6b6;cursor:not-allowed}.queue-head-actions .icon-button{width:32px;padding:0;font-size:20px}.queue-toolbar{min-height:38px;margin-top:7px;justify-content:center;border-top:1px solid #edf1f6}.queue-toolbar .queue-summary{flex:0 1 auto}.queue-toolbar .stop-all{margin-left:auto;padding:4px 8px;border:0;border-radius:7px;background:transparent;color:#d14850;font-size:8px}.queue-toolbar .stop-all:hover{background:#fff0f1}.task-queue{display:grid;grid-template-columns:1fr;align-content:start;gap:8px;margin-top:8px}.queue-task{min-height:148px;padding:10px;display:grid;grid-template-columns:22px minmax(0,1fr) 106px;gap:10px;align-items:stretch;border-radius:14px}.queue-task.completed{border-color:#8bdcb7;background:linear-gradient(105deg,#fbfffd,#f4fcf8)}.queue-task.selected{border-color:#2ab274;box-shadow:0 0 0 2px rgba(42,178,116,.11)}.task-select-control{width:18px;height:18px;margin-top:1px;padding:0;display:grid;place-items:center;border:2px solid #c7d3e2;border-radius:50%;background:#fff}.task-select-control i{width:8px;height:8px;border-radius:50%;background:transparent}.task-select-control.checked{border-color:#142a45}.task-select-control.checked i{background:#142a45}.task-select-control:disabled{opacity:.4;cursor:not-allowed}.task-content{min-width:0;display:flex;flex-direction:column}.task-title-line{display:flex;align-items:center;gap:7px;min-width:0}.task-title-line>b{color:#172942;font-size:11px}.task-title-line time{color:#64758d;font-size:9px}.task-title-line .task-state{margin-left:1px}.task-content>.task-name{display:block;margin:7px 0 3px;overflow:hidden;color:#24364e;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.task-prompt-line{margin:0;overflow:hidden;color:#5f7087;font-size:9px;line-height:1.5;text-overflow:ellipsis;white-space:nowrap}.task-bottom{margin-top:auto}.task-meta{justify-content:flex-start;flex-wrap:wrap;gap:5px 9px;margin-top:8px;color:#8190a4;font-size:8px}.task-meta span{white-space:nowrap}.task-primary-actions{display:flex;align-items:center;gap:5px;margin-top:8px;flex-wrap:wrap}.task-primary-actions button{height:28px;padding:0 9px;border:1px solid #d5deea;border-radius:9px;background:#fff;color:#40516a;font-size:8px}.task-primary-actions button:hover{border-color:#9eafc5;background:#f8fafc}.task-primary-actions .task-delete{color:#d14850}.task-primary-actions .task-stop{color:#d14850}.task-visual{min-width:0;display:flex;flex-direction:column;align-self:stretch}.task-images{width:100%;height:94px;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:3px}.task-images.count-1{grid-template-columns:1fr}.task-images.count-2{grid-template-columns:repeat(2,1fr)}.task-image{min-width:0;height:100%;aspect-ratio:auto;border-radius:9px}.task-images.count-3 .task-image:first-child{grid-row:span 2}.task-image img{width:100%;height:100%;object-fit:cover}.task-image em,.task-image input,.task-image button{display:none}.task-download{height:28px;margin-top:6px;border:1px solid #d5deea;border-radius:9px;background:#fff;color:#34465f;font-size:8px}.task-download:hover{border-color:#9eb0c7;background:#f8fafc}.task-image-placeholder{height:94px;display:grid;place-items:center;border:1px dashed #d8e1ec;border-radius:9px;background:#f6f8fb;color:#8b98aa;font-size:8px}.queue-task .auth-error{margin-top:5px}.queue-empty{min-height:240px}

@media(max-width:1400px){.queue-head-redesign{grid-template-columns:auto 1fr}.queue-head-actions{grid-column:1/-1;justify-content:center}.queue-title{grid-column:2}.queue-task{grid-template-columns:20px minmax(0,1fr) 88px;gap:7px}.task-images,.task-image-placeholder{height:78px}.task-primary-actions button{padding:0 6px}}
@media(max-width:1080px){.queue-head-redesign{grid-template-columns:auto 1fr auto}.queue-head-actions{grid-column:auto}.queue-title{grid-column:auto}.queue-task{grid-template-columns:22px minmax(0,1fr) 100px}.task-images,.task-image-placeholder{height:88px}}
@media(max-width:620px){.queue-head-redesign{grid-template-columns:auto 1fr}.queue-head-actions{grid-column:1/-1}.queue-task{grid-template-columns:20px minmax(0,1fr) 82px;padding:8px}.task-images,.task-image-placeholder{height:74px}.task-primary-actions button{height:26px;padding:0 5px}.queue-toolbar .stop-all{display:none}}
