:root{color:#eef7ff;background:#07090d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color-scheme:dark;--bg: #07090d;--bg-2: #0b1018;--surface: rgba(18, 25, 36, .62);--surface-strong: rgba(24, 34, 48, .78);--surface-soft: rgba(255, 255, 255, .055);--line: rgba(210, 235, 255, .13);--line-strong: rgba(190, 228, 255, .24);--text: #edf7ff;--muted: #8fa0af;--muted-strong: #b8c7d5;--accent: #4cc9ff;--accent-2: #8c7dff;--success: #28d17c;--danger: #ff6b68;--shadow: 0 18px 58px rgba(0, 0, 0, .42);--blur: blur(22px) saturate(145%)}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 18% -12%,rgba(76,201,255,.2),transparent 34%),radial-gradient(circle at 94% 8%,rgba(140,125,255,.16),transparent 32%),linear-gradient(180deg,#090d13,#06080c 58%,#080b10)}button,select,input,textarea{font:inherit}button{cursor:pointer}.appShell{min-height:100vh}.topBar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;min-height:66px;margin:0 auto;padding:10px 12px;border-bottom:1px solid var(--line);background:#080c129e;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:0 8px 30px #0000003d}.iconButton{display:inline-grid;flex:0 0 auto;width:42px;height:42px;place-items:center;border:1px solid var(--line);border-radius:12px;color:var(--text);background:linear-gradient(180deg,#ffffff1f,#ffffff0b);box-shadow:inset 0 1px #ffffff1c}.topNavButton{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:7px;min-width:112px;height:42px;border:1px solid var(--line);border-radius:12px;padding:0 12px;color:var(--text);background:linear-gradient(180deg,#ffffff1f,#ffffff0b);box-shadow:inset 0 1px #ffffff1c;font-size:13px;font-weight:780}.iconButton:hover,.smallButton:hover,.topNavButton:hover,.viewToggle button:hover,.breadcrumbs button:hover,.folderUp:hover,.fileEntry:hover{border-color:var(--line-strong);background-color:#ffffff17}.iconButton.danger{color:#ffd7d5}.iconButton:disabled,.topNavButton:disabled{cursor:not-allowed;opacity:.48}.topBarTitle{display:grid;min-width:0;flex:1}.appName{color:var(--text);font-size:15px;font-weight:780;line-height:1.15}.workflowName{overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.statusDot{width:10px;height:10px;border-radius:50%;box-shadow:0 0 18px currentColor}.online{color:var(--success);background:var(--success)}.offline{color:var(--danger);background:var(--danger)}.main{display:grid;gap:16px;width:min(760px,100%);margin:0 auto;padding:16px 12px 104px}.errorBanner{border:1px solid rgba(255,107,104,.34);border-radius:12px;padding:12px 14px;color:#ffd2d1;background:#5a161c75;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);font-size:14px}.promptPanel,.resultPanel,.outputsPage{display:grid;gap:14px}.promptPanel,.resultPanel{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--surface);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--shadow)}.field{display:grid;gap:7px}.uploadBox{display:grid;min-height:78px;place-items:center;border:1px dashed rgba(140,210,255,.34);border-radius:12px;color:var(--muted-strong);background:linear-gradient(180deg,#4cc9ff16,#ffffff09);font-size:14px;font-weight:740;text-align:center}.uploadBox input{position:absolute;width:1px;height:1px;opacity:0}.field span,.sectionTitle h2{margin:0;color:var(--muted-strong);font-size:12px;font-weight:780;letter-spacing:0}select,input,textarea{width:100%;border:1px solid var(--line);border-radius:12px;color:var(--text);background:#05090e9e;box-shadow:inset 0 1px #ffffff12,0 1px #ffffff0a;outline:none}select:focus,input:focus,textarea:focus{border-color:#4cc9ffc7;box-shadow:0 0 0 3px #4cc9ff29,inset 0 1px #ffffff14}select{min-height:48px;padding:0 12px}.workflowPickerRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.customSelect{position:relative;min-width:0}.customSelectButton{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;border:1px solid var(--line);border-radius:12px;padding:0 12px;color:var(--text);background:#05090eb8;box-shadow:inset 0 1px #ffffff12,0 1px #ffffff0a;outline:none}.customSelectButton:focus-visible{border-color:#4cc9ffc7;box-shadow:0 0 0 3px #4cc9ff29,inset 0 1px #ffffff14}.customSelectButton span,.customSelectOption span{overflow:hidden;color:inherit;font-size:15px;font-weight:560;text-overflow:ellipsis;white-space:nowrap}.customSelectButton .chevron{flex:0 0 auto;color:var(--muted-strong);transition:transform .16s ease}.customSelectButton .chevron.open{transform:rotate(180deg)}.customSelectMenu{position:absolute;top:calc(100% + 8px);right:0;left:0;z-index:20;display:grid;max-height:260px;overflow-y:auto;border:1px solid rgba(76,201,255,.32);border-radius:14px;padding:6px;background:#0a0f17f0;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:0 22px 54px #00000073,inset 0 1px #ffffff14}.customSelectOption{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:42px;border:0;border-radius:10px;padding:0 10px;color:var(--muted-strong);background:transparent;text-align:left}.customSelectOption:hover{color:var(--text);background:#ffffff14}.customSelectOption.active{color:#f7fbff;background:linear-gradient(135deg,#2ec9ff42,#7a5cff3d)}.customSelectEmpty{padding:12px;color:var(--muted);font-size:13px}input{min-height:48px;padding:0 12px}textarea{resize:vertical;padding:13px 12px;line-height:1.45}.generateButton{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;border:1px solid rgba(94,214,255,.42);border-radius:12px;color:#f7fbff;background:linear-gradient(135deg,#2ec9ff,#407cff 48%,#7a5cff);box-shadow:0 14px 32px #407cff3d;font-weight:820;text-shadow:0 1px 12px rgba(0,0,0,.32)}.promptPanel .generateButton{position:sticky;bottom:12px;z-index:7}.generateButton:disabled{opacity:.48}.dangerAction{border-color:#ff6b6880;background:linear-gradient(135deg,#ff6b68,#e7485f 48%,#9e4dff);box-shadow:0 14px 32px #ff6b6838}.sectionTitle{display:flex;align-items:center;justify-content:space-between;gap:12px}.jobStatus{border:1px solid var(--line);border-radius:999px;padding:4px 9px;color:var(--muted-strong);background:#ffffff0f;font-size:12px}.jobStatus.completed{color:#baf7d3;background:#28d17c29}.jobStatus.failed{color:#ffd2d1;background:#ff6b6829}.emptyState,.progressBox{display:grid;min-height:180px;place-items:center;border:1px dashed rgba(190,228,255,.18);border-radius:14px;padding:20px;color:var(--muted);background:#ffffff0a;text-align:center}.resultImage{width:100%;border-radius:12px;object-fit:cover;box-shadow:0 16px 42px #00000052}.resultActions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.smallButton{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;border:1px solid var(--line);border-radius:12px;color:var(--text);background:#fff1;font-size:13px;font-weight:740;text-decoration:none}.drawer{pointer-events:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:20}.drawer.open{pointer-events:auto}.drawerScrim{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;background:#00000075;transition:opacity .16s ease}.drawer.open .drawerScrim{opacity:1}.drawerPanel{position:absolute;top:0;right:0;display:grid;grid-template-rows:auto 1fr;width:min(390px,88vw);height:100%;border-left:1px solid var(--line);background:#0a0e16c7;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:-24px 0 70px #00000075;transform:translate(100%);transition:transform .18s ease}.drawer.open .drawerPanel{transform:translate(0)}.drawerHeader{display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid var(--line)}.drawerTabs{display:grid;grid-template-columns:1fr;flex:1;gap:8px}.drawerTab{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;border:1px solid var(--line);border-radius:12px;color:var(--muted-strong);background:#ffffff0f;font-size:13px;font-weight:760}.drawerTab.active{color:#051018;background:linear-gradient(135deg,#79e0ff,#4cc9ff)}.drawerContent{display:grid;align-content:start;gap:12px;overflow:auto;padding:16px}.settingsRow{display:grid;gap:5px;border-bottom:1px solid var(--line);padding-bottom:12px}.settingsRow span{color:var(--muted);font-size:12px}.settingsRow strong{overflow-wrap:anywhere;color:var(--text);font-size:14px}.settingsNote{border:1px solid var(--line);border-radius:12px;padding:12px;color:var(--muted-strong);background:#ffffff0e;font-size:13px;line-height:1.4}.outputsPage{border:1px solid var(--line);border-radius:16px;padding:10px;background:var(--surface);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--shadow)}.outputsHeader{display:grid;grid-template-columns:1fr auto auto auto auto;gap:8px;align-items:center}.viewToggle{display:inline-grid;grid-template-columns:1fr 1fr;gap:4px;border:1px solid var(--line);border-radius:12px;padding:4px;background:#ffffff0b}.viewToggle button{display:grid;width:34px;height:32px;place-items:center;border:0;border-radius:9px;color:var(--muted-strong);background:transparent}.viewToggle button.active{color:#041018;background:linear-gradient(135deg,#79e0ff,#4cc9ff)}.breadcrumbs{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.breadcrumbs button,.folderUp{flex:0 0 auto;border:1px solid var(--line);border-radius:999px;padding:8px 11px;color:var(--muted-strong);background:#ffffff0e;font-size:13px;font-weight:740}.folderUp{display:inline-flex;align-items:center;gap:7px;justify-self:start}.selectionBar{position:sticky;top:76px;z-index:8;display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;border:1px solid rgba(76,201,255,.3);border-radius:14px;padding:8px;background:#0d1a26d1;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:0 12px 30px #0000003d}.selectionBar span{color:var(--text);font-size:13px;font-weight:780}.selectionBar button,.moveTarget,.contextMenu button{display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;border:1px solid var(--line);border-radius:12px;padding:9px 10px;color:var(--text);background:#fff1;font-size:13px;font-weight:740}.fileList,.fileGrid{display:grid;gap:9px}.fileGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.fileEntry{display:grid;grid-template-columns:74px 1fr auto;gap:11px;align-items:center;border:1px solid rgba(210,235,255,.11);border-radius:13px;padding:8px;color:var(--text);background:linear-gradient(180deg,#ffffff13,#ffffff09);text-align:left;text-decoration:none;-webkit-user-select:none;user-select:none;box-shadow:inset 0 1px #ffffff0e}.fileGrid .fileEntry{grid-template-columns:1fr;align-content:start;gap:8px;min-height:172px}.fileEntry.selected{border-color:#4cc9ff9e;background:linear-gradient(180deg,#4cc9ff38,#8c7dff1a);box-shadow:0 0 0 1px #4cc9ff1f,0 12px 28px #4cc9ff1c}.fileEntry.dropTarget{border-color:#28d17cad;background:#28d17c24}.fileThumb{display:grid;width:74px;height:74px;place-items:center;border:1px solid rgba(255,255,255,.08);border-radius:11px;color:var(--muted-strong);background:#0000003d;overflow:hidden}.fileGrid .fileThumb{width:100%;height:auto;aspect-ratio:1}.fileThumb img{width:100%;height:100%;object-fit:cover}.fileMeta{display:grid;gap:4px;min-width:0}.fileMeta strong{overflow:hidden;color:var(--text);font-size:13px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.fileGrid .fileMeta strong{display:-webkit-box;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.fileMeta span{color:var(--muted);font-size:13px}.fileMore{color:var(--muted)}.fileGrid .fileMore{display:none}.contextMenu{position:fixed;z-index:40;display:grid;gap:6px;width:190px;border:1px solid var(--line-strong);border-radius:14px;padding:6px;background:#0c121bdb;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--shadow)}.contextMenu button:disabled{opacity:.5}.moveSheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:35;display:grid;align-items:end;background:#0000006b}.moveSheetPanel{display:grid;gap:8px;max-height:min(520px,80vh);overflow:auto;border:1px solid var(--line);border-radius:18px 18px 0 0;padding:14px;background:#0c121bdb;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:0 -18px 58px #00000070}.moveTarget{width:100%}.modalOverlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;padding:18px;background:#00000085;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.modalPanel{display:grid;gap:14px;width:min(420px,100%);border:1px solid var(--line-strong);border-radius:16px;padding:16px;background:#0e141ee0;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);box-shadow:var(--shadow)}.modalActions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.modalActions .generateButton{min-height:42px}.modalText{margin:0;overflow-wrap:anywhere;color:var(--muted-strong);font-size:14px;line-height:1.5}@media(max-width:430px){.outputsHeader{grid-template-columns:1fr auto auto}.outputsHeader .iconButton{width:38px;height:38px}.viewToggle{grid-column:span 2;justify-self:end}}@media(min-width:760px){.main{padding-top:28px}.fileGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.moveSheet{place-items:center;align-items:center}.moveSheetPanel{width:min(420px,90vw);border-radius:16px}}
