@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600&family=Fira+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap";:root{color:#171717;background:#f7f8fb;font-family:Noto Sans SC,Fira Sans,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--workspace-panel-height: calc(100vh - 118px) }*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at top left,rgba(75,109,255,.12),transparent 34%),linear-gradient(180deg,#f9fbff,#f5f6fa 52%,#eef1f7)}button,input,select,textarea{font:inherit}button{cursor:pointer}svg{display:block;flex:0 0 auto;stroke-width:2.2}.app-shell{min-height:100vh;padding:18px 20px 24px}.community-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:grid;place-items:center;padding:24px;background:#0f172a8f;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.community-dialog{display:grid;grid-template-columns:minmax(240px,340px) minmax(320px,460px);width:min(100%,880px);overflow:hidden;border:1px solid rgba(255,255,255,.78);border-radius:24px;background:linear-gradient(180deg,#fffffffa,#f6f8fff5),#fff;box-shadow:0 34px 90px #0f172a47}.community-dialog-media{display:flex;align-items:center;justify-content:center;min-height:100%;padding:22px;background:radial-gradient(circle at top,rgba(79,70,229,.16),transparent 44%),linear-gradient(180deg,#f7f8ff,#eef2ff)}.community-dialog-media img{display:block;width:100%;max-width:280px;height:auto;border-radius:18px;background:#fff;box-shadow:0 22px 54px #4f46e52e;object-fit:contain}.community-dialog-content{display:grid;align-content:center;gap:16px;padding:clamp(24px,4vw,40px)}.community-dialog-content h2{font-size:clamp(26px,3vw,34px);line-height:1.15}.community-dialog-content>p:not(.eyebrow){color:#4b5563;font-size:15px;line-height:1.8}.community-dialog-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:6px}.community-dialog-primary,.community-dialog-secondary{min-height:44px;border-radius:12px;padding:0 18px;font-size:14px;font-weight:700;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}.community-dialog-primary{border:0;background:linear-gradient(135deg,#111827,#4f46e5);color:#fff;box-shadow:0 14px 32px #4f46e53d}.community-dialog-secondary{border:1px solid #d9ddec;background:#fff;color:#374151}.community-dialog-primary:hover,.community-dialog-secondary:hover{transform:translateY(-1px)}.community-dialog-secondary:hover{border-color:#4f46e5;background:#f7f8ff;color:#4f46e5}.topbar,.workspace{max-width:1480px;margin:0 auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;border:1px solid rgba(17,24,39,.08);border-radius:14px;background:#ffffffd1;padding:14px 16px;box-shadow:0 20px 55px #1f293714;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}h1,h2,p{margin:0}h1{font-size:clamp(22px,2.6vw,32px);font-weight:700;letter-spacing:0}h2{font-size:17px;font-weight:700}.eyebrow{color:#5b5ff0;font-family:Fira Code,monospace;font-size:11px;font-weight:600;text-transform:uppercase}.brand-row{display:flex;align-items:center;gap:12px}.brand-logo{width:48px;height:48px;border-radius:13px;box-shadow:0 14px 32px #4f46e538}.queue-meter,.panel,.mobile-tabs{border:1px solid rgba(17,24,39,.08);background:#ffffffe6;box-shadow:0 16px 42px #0f172a12}.queue-meter{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 14px;border-radius:10px;color:#1f2937;font-family:Fira Code,monospace;font-size:12px;background:#f7f8ff}.availability-badge{margin-left:auto;border-radius:999px;background:#ecfdf5;color:#047857;padding:5px 9px;font-weight:700;white-space:nowrap}.availability-badge.waiting{background:#fff1f2;color:#b91c1c}.queue-meter svg,.panel-title svg,.mobile-tabs svg{color:#4f46e5}.session-badge{border-radius:999px;background:#eef2ff;color:#4f46e5;padding:5px 9px;font-weight:700}.mini-link{border:0;border-radius:999px;background:transparent;color:#4f46e5;padding:5px 8px;font-family:inherit;font-size:12px;font-weight:700}.mini-link:hover{background:#eef2ff}.workspace{display:grid;grid-template-columns:minmax(320px,388px) minmax(440px,1fr) minmax(300px,370px);gap:14px;align-items:start}.panel{border-radius:14px;padding:16px}.panel-title{display:flex;align-items:center;gap:10px;margin-bottom:16px}.cooldown-alert{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;border:1px solid #fecaca;border-radius:12px;background:#fff1f2;color:#991b1b;padding:11px 12px;font-size:13px;font-weight:700;line-height:1.5}.cooldown-alert svg{margin-top:1px;color:#dc2626}.preview-title{gap:14px}.preview-title>div:first-child{flex:0 0 auto}.preview-timeline{flex:1 1 auto;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(72px,1fr);align-items:center;gap:8px;min-width:160px;overflow-x:auto;padding:4px 2px 6px}.preview-timeline button{position:relative;display:grid;justify-items:center;gap:5px;min-width:72px;border:0;background:transparent;color:#6b7280;cursor:pointer}.preview-timeline button:before{content:"";position:absolute;top:9px;left:calc(-50% + 9px);width:calc(100% - 18px);height:2px;background:#e1e5f0}.preview-timeline button:first-child:before{display:none}.preview-timeline button span{position:relative;z-index:1;width:18px;height:18px;border:2px solid #c7cedf;border-radius:999px;background:#fff;box-shadow:0 0 0 4px #eef1f8f2}.preview-timeline button.hasImage span{border-color:#8b93f8;background:#f7f8ff}.preview-timeline button.active{color:#111827}.preview-timeline button.active span{border-color:#4f46e5;background:#4f46e5;box-shadow:0 0 0 5px #4f46e524,0 0 18px #4f46e573}.preview-timeline button small{max-width:78px;overflow:hidden;color:currentColor;font-size:11px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.split{justify-content:space-between}.controls{order:3;display:grid;gap:12px;height:var(--workspace-panel-height);max-height:var(--workspace-panel-height);overflow:auto}.form-section{display:grid;gap:12px;border:1px solid #e7e9f2;border-radius:12px;background:#fbfcff;padding:12px}.form-section>p{color:#111827;font-size:13px;font-weight:700}.field{display:grid;gap:7px}.field span,.upload-box span{color:#4b5563;font-size:13px;font-weight:600}.field small{color:#6b7280;font-size:12px;line-height:1.45}.mode-note{color:#6b7280;font-size:12px;line-height:1.55}.field input,.field select,.field textarea{width:100%;border:1px solid #d9ddec;border-radius:10px;background:#fff;color:#111827;outline:none;padding:10px 11px;transition:border-color .16s ease,box-shadow .16s ease}.field textarea{resize:vertical;min-height:132px}.field input:focus,.field select:focus,.field textarea:focus{border-color:#5b5ff0;box-shadow:0 0 0 3px #5b5ff024}.grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.segmented{display:grid;grid-template-columns:repeat(2,1fr);padding:4px;border-radius:12px;background:#eef1f8}.segmented button,.mobile-tabs button{border:0;border-radius:9px;background:transparent;color:#4b5563;min-height:38px;font-weight:700;padding:0 8px;transition:background .16s ease,color .16s ease}.segmented .active,.mobile-tabs .active{background:#111827;color:#fff}.mobile-tabs .active svg{color:#fff}.upload-box{position:relative;display:flex;align-items:center;gap:10px;min-height:48px;border:1px dashed #b8c0d9;border-radius:12px;padding:12px;background:#f6f8ff;cursor:pointer}.upload-box svg{color:#4f46e5}.upload-box input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.upload-box.disabled{opacity:.55;cursor:not-allowed}.primary-action{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;border:0;border-radius:12px;background:linear-gradient(135deg,#111827,#4f46e5);color:#fff;font-weight:700;transition:transform .16s ease,background .16s ease;box-shadow:0 16px 34px #4f46e538}.primary-action svg{color:currentColor}.primary-action:hover{transform:translateY(-1px)}.primary-action:disabled{opacity:.7;cursor:wait}.primary-action.done{background:linear-gradient(135deg,#0f766e,#10b981);box-shadow:0 16px 34px #10b98138}.primary-action.danger{background:linear-gradient(135deg,#7f1d1d,#ef4444);box-shadow:0 16px 34px #ef444433}.message{color:#4b5563;font-size:13px;line-height:1.5}.message.done{color:#047857}.message.danger{color:#b91c1c}.result-panel{order:2;height:var(--workspace-panel-height);min-height:var(--workspace-panel-height);overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr);background:linear-gradient(180deg,#fffffff0,#fafbfff0),#fff}.preview-area{display:grid;grid-template-rows:minmax(0,1fr);gap:12px;min-height:0;overflow:hidden}.magic-stage{position:relative;display:flex;align-items:center;justify-content:center;height:100%;min-height:0;overflow:hidden;border:1px solid #e3e7f3;border-radius:18px;padding:clamp(18px,3vw,32px);background:linear-gradient(45deg,rgba(226,232,240,.38) 25%,transparent 25%),linear-gradient(-45deg,rgba(226,232,240,.38) 25%,transparent 25%),radial-gradient(circle at 50% 44%,rgba(99,102,241,.2),transparent 34%),#f8faff;background-size:24px 24px,24px 24px,100% 100%,100% 100%;background-position:0 0,0 12px,0 0,0 0}.magic-stage:before,.magic-stage:after{content:"";position:absolute;pointer-events:none;border-radius:999px;filter:blur(4px)}.magic-stage:before{width:280px;height:280px;background:#4f46e521;animation:floatGlow 7s ease-in-out infinite}.magic-stage:after{width:160px;height:160px;right:10%;top:12%;background:#10b98124;animation:floatGlow 8s ease-in-out infinite reverse}.magic-stage.generating .magic-orbit{position:absolute;width:min(72%,520px);aspect-ratio:1;border:1px solid rgba(99,102,241,.24);border-radius:999px;animation:orbitSpin 8s linear infinite}.magic-stage.generating .magic-orbit:before,.magic-stage.generating .magic-orbit:after{content:"";position:absolute;width:8px;height:8px;border-radius:999px;background:#4f46e5;box-shadow:0 0 18px #4f46e5cc}.magic-stage.generating .magic-orbit:before{top:-4px;left:50%}.magic-stage.generating .magic-orbit:after{bottom:-4px;left:28%;background:#10b981;box-shadow:0 0 18px #10b981cc}.magic-stage.generating .magic-sweep{position:absolute;top:-40%;right:-40%;bottom:-40%;left:-40%;background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.72),transparent 58%);animation:sweep 2.9s ease-in-out infinite}.hero-image-card{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:auto;max-width:100%;height:100%;max-height:100%;min-height:0;color:#111827;text-decoration:none;animation:cardRise .52s ease both}.hero-image-card img{display:block;width:auto;max-width:100%;height:auto;max-height:100%;object-fit:contain;border:0;border-radius:14px;background:transparent;box-shadow:0 28px 90px #0f172a38}.hero-image-card span{position:absolute;left:50%;bottom:14px;display:inline-flex;align-items:center;gap:8px;min-height:38px;border-radius:999px;background:#111827e6;color:#fff;padding:0 16px;font-size:13px;font-weight:700;white-space:nowrap;transform:translate(-50%);box-shadow:0 12px 28px #1118272e}.hero-image-card.is-partial img{filter:saturate(.92);opacity:.96}.stage-info-card{position:relative;z-index:2;display:grid;gap:14px;width:min(100%,620px);max-height:100%;overflow:auto;border:1px solid rgba(255,255,255,.72);border-radius:22px;background:#ffffffdb;padding:clamp(22px,4vw,38px);box-shadow:0 28px 90px #0f172a2e;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:cardRise .52s ease both}.stage-info-card h3{margin:0;color:#111827;font-size:clamp(22px,3vw,34px);line-height:1.2}.stage-info-card>p:not(.eyebrow){margin:0;color:#374151;font-size:clamp(15px,1.6vw,18px);line-height:1.8}.status-stage>span{width:fit-content;border-radius:999px;background:#eef1f8;color:#4b5563;padding:6px 10px;font-family:Fira Code,monospace;font-size:12px}.loading-stage{place-items:start}.loading-stage.is-error{border-color:#dc26262e;background:#fff5f5e6}.loading-chip{display:inline-flex;align-items:center;gap:8px}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.settings-grid span{border:1px solid #e5e7ef;border-radius:12px;background:#f7f8ff;color:#111827;padding:12px;font-size:13px;font-weight:700}.empty-preview{position:relative;z-index:1;display:grid;place-items:center;gap:12px;min-height:0;height:100%;color:#6b7280;text-align:center;padding:24px}.empty-preview svg{color:#5b5ff0}.empty-preview.tall{min-height:520px;height:auto;border:1px dashed #c8cede;border-radius:14px;background:#f8faff}.job-meta,.status-row{display:flex;flex-wrap:wrap;gap:8px}.job-meta span,.status-row span{border-radius:999px;background:#eef1f8;color:#374151;padding:6px 10px;font-family:Fira Code,monospace;font-size:12px}.prompt-readout{color:#4b5563;line-height:1.55;border-left:3px solid #5b5ff0;padding-left:12px}.prompt-readout.compact{display:-webkit-box;max-height:48px;overflow:hidden;font-size:13px;-webkit-box-orient:vertical;-webkit-line-clamp:2}.history{order:1;height:var(--workspace-panel-height);max-height:var(--workspace-panel-height);overflow:hidden;display:grid;grid-template-rows:auto auto auto minmax(0,1fr);gap:12px}.history-actions{display:flex;align-items:center;gap:8px}.new-task-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:46px;border:1px solid rgba(79,70,229,.22);border-radius:14px;background:linear-gradient(180deg,#fffffff5,#f7f8fff5),#fff;color:#111827;padding:0 14px;font-size:14px;font-weight:700;box-shadow:0 12px 28px #4f46e51a;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.new-task-btn:hover{border-color:#4f46e58c;box-shadow:0 16px 32px #4f46e529;transform:translateY(-1px)}.new-task-btn svg{color:#4f46e5}.job-list{display:grid;align-content:start;grid-auto-rows:max-content;gap:10px;overflow:auto;padding-right:4px}.job-item{display:flex;flex-direction:column;gap:10px;min-height:124px;max-height:168px;border:1px solid #e5e7ef;border-radius:12px;background:#fff;padding:12px;transition:border-color .16s ease,background .16s ease;cursor:pointer}.job-item:hover,.job-item.selected{border-color:#5b5ff0;background:#f7f8ff}.job-line{display:flex;align-items:center;gap:8px;color:#111827}.job-line span{margin-left:auto;color:#6b7280;font-family:Fira Code,monospace;font-size:12px}.job-line em{border-radius:999px;background:#eef2ff;color:#4f46e5;padding:3px 7px;font-family:Fira Code,monospace;font-size:11px;font-style:normal;font-weight:700}.job-item p{display:-webkit-box;overflow:hidden;color:#4b5563;font-size:13px;line-height:1.4;-webkit-line-clamp:2;-webkit-box-orient:vertical}.job-actions{display:flex;gap:8px;margin-top:auto}.job-actions button,.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid #d9ddec;border-radius:10px;background:#fff;color:#374151}.job-actions button:hover,.icon-btn:hover{border-color:#4f46e5;color:#4f46e5;background:#f7f8ff}.mobile-tabs{display:none;grid-template-columns:repeat(3,1fr);gap:4px;margin:0 auto 14px;padding:4px;border-radius:12px;max-width:680px}.mobile-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:6px}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes orbitSpin{to{transform:rotate(360deg)}}@keyframes sweep{0%{transform:translate(-45%) rotate(0);opacity:0}35%{opacity:.55}to{transform:translate(45%) rotate(0);opacity:0}}@keyframes cardRise{0%{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes floatGlow{0%,to{transform:translate3d(-16px,-10px,0) scale(.96)}50%{transform:translate3d(18px,14px,0) scale(1.04)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:1180px){.workspace{grid-template-columns:minmax(320px,390px) minmax(420px,1fr)}.history{grid-column:1 / -1;height:640px;max-height:640px}}@media(max-width:820px){.app-shell{padding:12px}.community-dialog-backdrop{padding:14px}.community-dialog{grid-template-columns:1fr;width:min(100%,520px)}.community-dialog-media{padding-bottom:12px}.community-dialog-media img{max-width:min(100%,220px)}.topbar{align-items:flex-start;flex-direction:column}.brand-logo{width:42px;height:42px}.queue-meter{width:100%;justify-content:space-between}.mobile-tabs{display:grid}.workspace{display:block}.panel{margin-bottom:14px}.mobileHidden{display:none}.result-panel,.history{min-height:0;height:auto;max-height:none;overflow:visible;display:block}.preview-area{grid-template-rows:auto auto auto;overflow:visible}.preview-title{align-items:flex-start;flex-direction:column}.preview-timeline{width:100%}.magic-stage{height:58vh;min-height:420px}}@media(max-width:460px){.grid-two{grid-template-columns:1fr}.community-dialog-content{gap:14px;padding:22px 18px 20px}.community-dialog-actions{display:grid;grid-template-columns:1fr}.community-dialog-primary,.community-dialog-secondary{width:100%}.mobile-tabs button{font-size:12px}.magic-stage{height:56vh;min-height:390px;padding:14px}}
