:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;--ink:#17201d;--muted:#65716d;--line:#d9e0dc;--panel:#fff;--page:#f5f7fa;--soft:#eef4f0;--green:#0f8f68;--green-strong:#057455;--coral:#d95d42;--blue:#2f6fed;--gold:#b8870b;--violet:#694fc4;--danger:#b42318;--shadow:0 18px 48px #1925201c;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:var(--page);color:var(--ink);letter-spacing:0}body{min-width:320px;min-height:100vh;margin:0}button,input,select,textarea{font:inherit;letter-spacing:0}button{cursor:pointer}.app-shell{grid-template-columns:264px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{color:#eff8f4;background:#18231f;flex-direction:column;gap:22px;height:100vh;padding:24px 18px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;min-width:0;display:flex}.brand-mark{color:#0e201a;background:linear-gradient(135deg,#9ce8c8,#f5c45a 58%,#f58a6d);border-radius:8px;flex:none;place-items:center;width:46px;height:46px;display:grid}.brand strong,.brand span{overflow-wrap:anywhere;display:block}.brand strong{font-size:15px}.brand span{color:#b9c9c1;margin-top:3px;font-size:12px}.side-nav{gap:8px;display:grid}.side-nav a{color:#d5e4dd;border:1px solid #0000;border-radius:8px;align-items:center;gap:10px;min-height:42px;padding:0 12px;text-decoration:none;display:flex}.side-nav a:hover,.side-nav a.active{background:#ffffff14;border-color:#9ce8c847}.connection-tile{background:#ffffff0f;border:1px solid #ffffff1f;border-radius:8px;gap:4px;margin-top:auto;padding:14px;display:grid}.connection-tile span,.connection-tile small{color:#b9c9c1}.connection-tile strong{overflow-wrap:anywhere}.main{min-width:0;padding:28px}.topbar{justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px;display:flex}.topbar h1,.section-heading h2{margin:0;font-weight:760;line-height:1.08}.topbar h1{font-size:clamp(30px,4vw,48px)}.section-heading h2{font-size:20px}.eyebrow{color:var(--green-strong);text-transform:uppercase;margin:0 0 6px;font-size:12px;font-weight:780}.top-actions,.section-heading,.preset-row,.readiness-strip,.stack-actions,.tabbar,.segmented,.connection-state,.task-details{align-items:center;display:flex}.top-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px}.button,.icon-button,.segmented button,.tabbar button{border:1px solid var(--line);min-height:40px;color:var(--ink);background:#fff;border-radius:8px;justify-content:center;align-items:center;gap:8px;transition:transform .16s,border-color .16s,background .16s;display:inline-flex}.button{padding:0 14px;font-weight:720}.button:hover,.icon-button:hover,.segmented button:hover,.tabbar button:hover{border-color:#aab8b2;transform:translateY(-1px)}.button.primary{border-color:var(--green-strong);color:#fff;background:var(--green-strong)}.button.secondary{background:var(--soft)}.button.danger{width:100%;color:var(--danger);background:#fff2ef;border-color:#b4231847}.icon-button{width:42px;padding:0}.notice{max-width:100%;color:var(--green-strong);overflow-wrap:anywhere;background:#edf9f4;border:1px solid #0f8f6840;border-radius:8px;align-items:center;gap:9px;margin:0 0 18px;padding:10px 12px;display:inline-flex}.notice.warn{color:#8c6200;background:#fff7df;border-color:#b8870b40}.panel{border:1px solid var(--line);background:var(--panel);min-width:0;box-shadow:var(--shadow);border-radius:8px;padding:20px}.connection-panel{margin-bottom:18px}.section-heading{justify-content:space-between;gap:14px;margin-bottom:18px}.workspace{grid-template-columns:minmax(0,1fr) minmax(330px,410px);align-items:start;gap:18px;display:grid}.compose-column,.monitor-column{gap:18px;min-width:0;display:grid}.connection-grid,.form-grid,.settings-grid,.asset-grid{gap:14px;display:grid}.connection-grid{grid-template-columns:minmax(0,1fr) auto;align-items:end}.form-grid.two{grid-template-columns:minmax(0,1.5fr) minmax(180px,.5fr)}.form-grid.split{grid-template-columns:minmax(0,1fr) 126px;align-items:end}.settings-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.settings-grid.compact{grid-template-columns:minmax(180px,1.2fr) repeat(3,minmax(90px,.5fr)) minmax(160px,.8fr);align-items:end}.field,.control-group{gap:8px;min-width:0;display:grid}.field span,.control-group>span,.asset-list strong{color:var(--muted);text-transform:uppercase;font-size:12px;font-weight:760}.field input:not([type=range]):not([type=color]),.field select,.field textarea{width:100%;min-height:42px;color:var(--ink);background:#fff;border:1px solid #cdd7d2;border-radius:8px;outline:none}.field input:not([type=range]):not([type=color]),.field select{padding:0 12px}.field textarea{resize:vertical;min-height:84px;padding:12px;line-height:1.45}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px #0f8f681f}.field em{color:var(--muted);font-size:12px;font-style:normal}.proxy-route{background:#fbfcfc;border:1px solid #cdd7d2;border-radius:8px;min-height:42px;padding:10px 12px}.proxy-route strong{overflow-wrap:anywhere;color:var(--ink);font-size:14px;line-height:1.35}.field input[type=range]{width:100%;accent-color:var(--green)}.color-field{grid-template-columns:1fr auto;align-items:center}.color-field span{grid-column:1/-1}.color-field input{border:1px solid var(--line);background:0 0;border-radius:8px;width:54px;height:42px}.check-field{min-height:42px;color:var(--ink);align-items:center;gap:10px;font-weight:730;display:flex}.check-field input{width:18px;height:18px;accent-color:var(--green)}.brand-kit{gap:14px;display:grid}.brand-preview{border:1px solid var(--line);background:#fbfcfc;border-radius:8px;flex-wrap:wrap;align-items:center;gap:12px;min-height:54px;padding:12px;display:flex}.brand-preview span{overflow-wrap:anywhere;border-radius:8px;align-items:center;max-width:100%;min-height:34px;padding:6px 10px;font-weight:780;display:inline-flex}.brand-preview small{color:var(--muted);font-weight:760}.action-row{flex-wrap:wrap;display:flex}.segmented{border:1px solid var(--line);background:#f8faf9;border-radius:8px;gap:4px;padding:4px}.segmented.wide{width:100%}.segmented button{background:0 0;border-color:#0000;flex:1;min-height:34px;padding:0 10px}.segmented button.selected{color:var(--green-strong);background:#fff;border-color:#0f8f682e;box-shadow:0 5px 14px #19252014}.connection-state{border:1px solid var(--line);white-space:nowrap;background:#fbfcfc;border-radius:8px;gap:8px;min-height:42px;padding:0 12px}.readiness-strip{flex-wrap:wrap;gap:8px;margin-top:14px}.readiness-strip span{border-radius:8px;align-items:center;gap:6px;min-height:30px;padding:0 9px;font-size:12px;font-weight:760;display:inline-flex}.readiness-strip .ready{color:var(--green-strong);background:#e9f8f2}.readiness-strip .pending{color:#8c6200;background:#fff7df}.trust-grid,.estimate-strip,.template-grid,.storyboard-grid,.pipeline-list,.output-pack,.action-row,.term-row{gap:10px;display:grid}.trust-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px}.trust-card{border:1px solid var(--line);background:#fbfcfc;border-radius:8px;grid-template-columns:18px minmax(0,1fr);gap:5px 8px;min-height:74px;padding:10px;display:grid}.trust-card svg{grid-row:1/span 2;margin-top:1px}.trust-card span,.template-card span,.mini-heading span,.pipeline-step{color:var(--muted);text-transform:uppercase;font-size:12px;font-weight:760}.trust-card strong{overflow-wrap:anywhere;min-width:0;font-size:13px}.trust-card.ready{background:#f2fbf7;border-color:#0f8f683d}.trust-card.warn{background:#fff8e6;border-color:#b8870b47}.estimate-strip{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:14px}.estimate-strip span{min-height:38px;color:var(--ink);background:#fbfcfc;border:1px solid #dce4e0;border-radius:8px;align-items:center;gap:7px;padding:0 10px;font-size:13px;font-weight:760;display:inline-flex}.preset-row{flex-wrap:wrap;gap:10px;margin-bottom:16px}.template-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}.template-card{border:1px solid var(--line);min-height:112px;color:var(--ink);text-align:left;background:#fff;border-radius:8px;gap:5px;padding:12px;display:grid}.template-card strong,.template-card small{overflow-wrap:anywhere;min-width:0}.template-card strong{font-size:13px}.template-card small{color:var(--muted);line-height:1.35}.template-card.selected{background:#f0fbf6;border-color:#0f8f686b}.stack-actions{flex-direction:column;gap:8px}.stack-actions .button{width:100%}.metadata-strip{border-left:4px solid var(--violet);background:#f4f1ff;border-radius:8px;gap:7px;margin-top:14px;padding:12px;display:grid}.metadata-strip span,.metadata-strip small{color:#514865}.metadata-strip .button{justify-self:start}.storyboard-panel{border-top:1px solid var(--line);gap:12px;margin-top:16px;padding-top:16px;display:grid}.mini-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.mini-heading strong{overflow-wrap:anywhere;min-width:0;font-size:13px}.term-row{flex-wrap:wrap;display:flex}.term-row span{color:#36534a;background:#edf5f1;border-radius:8px;min-height:28px;padding:6px 8px;font-size:12px;font-weight:720}.storyboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.storyboard-scene{border:1px solid var(--line);background:#fbfcfc;border-radius:8px;gap:7px;min-height:138px;padding:12px;display:grid}.storyboard-scene span{color:var(--green-strong);text-transform:uppercase;font-size:12px;font-weight:780}.storyboard-scene p{color:var(--ink);margin:0;font-size:13px;line-height:1.42}.storyboard-scene small{color:var(--muted);line-height:1.35}.tabbar{gap:6px}.tabbar button{background:#f8faf9;width:38px;min-height:38px;padding:0}.tabbar button.active{color:var(--blue);background:#eef4ff;border-color:#2f6fed47}.asset-grid{grid-template-columns:1fr 1fr}.upload-zone{min-height:132px;color:var(--green-strong);text-align:center;background:#f8fbfa;border:1px dashed #aebdb6;border-radius:8px;place-items:center;gap:8px;font-weight:760;display:grid;position:relative}.upload-zone input{opacity:0;cursor:pointer;position:absolute;inset:0}.asset-list{grid-column:1/-1;gap:8px;display:grid}.asset{border:1px solid var(--line);min-height:42px;color:var(--ink);text-align:left;background:#fff;border-radius:8px;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;padding:0 10px;display:grid}.asset.selected{background:#effaf5;border-color:#0f8f6861}.asset span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.asset small{color:var(--muted)}.preview-panel{overflow:hidden}.status-pill{border-radius:999px;align-items:center;gap:7px;min-height:30px;padding:0 9px;font-size:12px;font-weight:760;display:inline-flex}.status-pill.good{color:var(--green-strong);background:#e9f8f2}.status-pill.bad{color:var(--danger);background:#fff0ed}.status-pill.busy{color:var(--blue);background:#edf4ff}.status-pill.neutral{color:var(--muted);background:#f2f4f3}.phone-frame{aspect-ratio:9/16;background:linear-gradient(#fff3,#fff0),#212c27;border:10px solid #1c2622;border-radius:26px;place-items:center;max-height:min(58vh,560px);margin:0 auto;display:grid;overflow:hidden}.phone-frame video{object-fit:contain;background:#111815;width:100%;height:100%}.empty-preview{color:#dceae4;background:linear-gradient(#0f8f6838,#0000 45%),repeating-linear-gradient(135deg,#ffffff0d,#ffffff0d 1px,#0000 1px 18px),#1f2a26;place-items:center;gap:12px;width:100%;height:100%;display:grid}.empty-preview span{font-weight:780}.task-details{flex-wrap:wrap;gap:10px;margin-top:14px}.pipeline-list{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px}.pipeline-step{background:#f2f4f3;border-radius:8px;justify-content:center;align-items:center;gap:6px;min-height:31px;padding:0 8px;display:inline-flex}.pipeline-step.done{color:var(--green-strong);background:#e9f8f2}.pipeline-step.active{color:var(--blue);background:#edf4ff}.pipeline-step.failed{color:var(--danger);background:#fff0ed}.output-pack{grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.output-pack .button,.action-row .button{min-width:0}.task-failure{color:var(--danger);background:#fff4f2;border:1px solid #fed7cf;border-radius:8px;margin:0;padding:10px 12px;font-size:12px}.task-details>span{min-width:0;color:var(--muted);overflow-wrap:anywhere;font-size:12px}.progress-line{background:#edf1ef;border-radius:999px;flex:150px;height:8px;position:relative;overflow:hidden}.progress-line i{border-radius:inherit;background:linear-gradient(90deg, var(--green), var(--gold));position:absolute;inset:0 auto 0 0}.task-panel{gap:14px;display:grid}.task-list{gap:8px;max-height:390px;display:grid;overflow:auto}.task-item{border:1px solid var(--line);min-height:58px;color:var(--ink);text-align:left;background:#fff;border-radius:8px;grid-template-columns:20px minmax(0,1fr) 18px;align-items:center;gap:9px;padding:9px 10px;display:grid}.task-item.selected{background:#f0fbf6;border-color:#0f8f686b}.task-item span{gap:3px;min-width:0;display:grid}.task-item strong,.task-item small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.task-item small,.empty-list,.footer{color:var(--muted)}.good{color:var(--green-strong)}.bad{color:var(--danger)}.busy{color:var(--blue)}.neutral{color:var(--muted)}.spin{animation:1s linear infinite spin}.empty-list{border:1px dashed var(--line);border-radius:8px;place-items:center;min-height:96px;display:grid}.footer{flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:20px;font-size:12px;display:flex}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1180px){.app-shell{grid-template-columns:1fr}.sidebar{flex-flow:wrap;align-items:center;height:auto;position:static}.side-nav{grid-auto-flow:column;overflow-x:auto}.connection-tile{min-width:230px;margin-top:0;margin-left:auto}.workspace{grid-template-columns:1fr}.monitor-column{grid-template-columns:minmax(280px,400px) minmax(0,1fr)}.template-grid,.trust-grid,.pipeline-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=820px){.main{padding:18px}.topbar,.section-heading,.connection-grid{flex-direction:column;align-items:stretch}.connection-grid,.form-grid.two,.form-grid.split,.settings-grid,.settings-grid.compact,.asset-grid,.monitor-column,.storyboard-grid,.template-grid,.trust-grid,.estimate-strip,.pipeline-list,.output-pack{grid-template-columns:1fr}.stack-actions{flex-direction:row}.asset-list{grid-column:auto}.connection-tile{width:100%;margin-left:0}.top-actions{justify-content:stretch}.top-actions .button{flex:1}}@media (width<=520px){.sidebar{padding:16px}.side-nav{width:100%}.panel{padding:16px}.topbar h1{font-size:30px}.tabbar,.segmented{width:100%}.stack-actions{flex-direction:column}}
