@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--ui-scale:1.16;--text-xs:12px;--text-sm:13px;--text-md:14px;--text-lg:16px;--control-height:42px;--panel-padding:16px;--workspace-gap:20px;color:#e9eaec;font-synthesis:none;text-rendering:optimizelegibility;background:#0c0e0f;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{background:#0c0e0f;min-width:320px;margin:0}button,textarea{font:inherit}button{cursor:pointer;color:inherit;border:0}button:focus-visible,textarea:focus-visible{outline-offset:2px;outline:1px solid #d9ff00}.app-shell{background:#0c0e0f;min-height:100vh}.app-header{z-index:20;height:56px;box-shadow:none;background:0 0;outline:none;align-items:center;padding:0 24px;display:flex;position:fixed;top:0;left:0;right:0}.app-header strong{color:#f4f5f6;letter-spacing:.08em;font-size:15px}.brand-group{align-items:center;gap:9px;line-height:1;display:flex;transform:translateY(5px)}.flowpilot-logo{object-fit:cover;filter:none;border-radius:4px;width:24px;height:24px;display:block}.flowpilot-brand{color:#f4f5f6;letter-spacing:.045em;font-size:15px;font-weight:600;line-height:1}.header-divider{background:#303338;width:1px;height:18px;margin:0 14px}.header-page{color:#858a91;font-size:13px}.generator-shell{gap:var(--workspace-gap);grid-template-columns:340px minmax(0,1fr);min-height:100vh;padding:76px 20px 16px;display:grid}.control-rail{min-height:calc(100vh - 92px);padding:var(--panel-padding);background:#111315;border:1px solid #2a2d31;border-radius:15px;flex-direction:column;display:flex;position:relative;overflow:visible}.control-rail svg{width:16px;height:16px}.model-card{background:#1a1d20;border:1px solid #292c30;border-radius:12px;overflow:hidden}.model-card-image{background-image:linear-gradient(#0000000a,#050709b3),url(/assets/gemini-omni-flash.webp);background-position:50%;background-size:cover;flex-direction:column;justify-content:flex-end;height:130px;padding:0 14px 12px;display:flex;position:relative;overflow:hidden}.model-card-image:after{content:"";pointer-events:none;background:linear-gradient(90deg,#00000026,#0000 60%);position:absolute;inset:0}.model-card-image span,.model-card-image b{z-index:1;line-height:1;position:relative}.model-card-image span{color:#d9ff00;font-size:16px;font-weight:700}.model-card-image b{color:#f5f6f7;margin-top:4px;font-size:18px;font-weight:600}.change-model{z-index:2;color:#1d2022;background:#c6cdcfa6;border-radius:8px;align-items:center;gap:6px;min-height:32px;padding:0 11px;font-size:13px;font-weight:600;display:flex;position:absolute;top:10px;right:10px}.change-model:hover{background:#e3e7e8}.model-card-footer{justify-content:space-between;align-items:center;min-height:54px;padding:8px 14px;display:flex}.model-card-footer strong,.model-card-footer small{display:block}.model-card-footer strong{color:#eef0f1;font-size:14px;font-weight:600}.model-card-footer small{color:#767b82;margin-top:4px;font-size:12px}.model-card-footer svg{color:#747a80}.mode-tabs{background:#1a1d20;border:1px solid #24272b;border-radius:10px;grid-template-columns:repeat(3,1fr);gap:4px;margin:12px 0 18px;padding:5px;display:grid}.mode-tabs button{color:#777c82;background:0 0;border-radius:7px;min-height:40px;font-size:13px;font-weight:600}.mode-tabs button.active{color:#f0f1f2;background:#373b40}.mode-tabs button:hover:not(.active){color:#babdc1}.media-input{margin-bottom:18px}.upload-box{color:#8c9197;background:#1a1d20;border:1px dashed #393d42;border-radius:11px;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:128px;display:flex}.upload-box:hover{background:#1e2125;border-color:#686d74}.upload-icons{color:#aaa9b7;background:#303338;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;margin-bottom:10px;display:flex}.upload-icons svg+svg{margin-left:-4px}.upload-box strong{color:#bfc2c6;font-size:14px;font-weight:600}.upload-box small{color:#757a81;margin-top:4px;font-size:12px}.hidden-input{display:none}.mock-add{color:#777c82;background:0 0;align-items:center;gap:6px;margin:8px auto 0;font-size:12px;display:flex}.mock-add:hover{color:#ddd}.asset-list{background:#191c1f;border:1px solid #292c30;border-radius:10px;flex-direction:column;gap:8px;padding:10px;display:flex}.asset-item{align-items:center;gap:10px;min-width:0;display:flex}.asset-item img{object-fit:cover;border-radius:6px;flex:none;width:38px;height:38px}.asset-item span{color:#b8bcc1;text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:12px;overflow:hidden}.asset-item button{color:#8e9399;background:#292c30;border-radius:6px;place-items:center;width:28px;height:28px;display:grid}.add-more,.change-media{color:#a7abb0;background:#202327;border:1px solid #303439;border-radius:7px;justify-content:center;align-items:center;gap:6px;min-height:32px;font-size:12px;display:flex}.change-media{color:#c3c6ca;background:0 0;border:0}.add-more:hover,.change-media:hover{color:#fff}.field-label{color:#8f949a;margin:0 2px 8px;font-size:13px;font-weight:500;display:block}.prompt-box{resize:none;color:#e7e9eb;background:#1a1d20;border:1px solid #292c30;border-radius:11px;outline:none;width:100%;height:158px;margin-bottom:18px;padding:14px 15px;font-size:14px;line-height:1.55;display:block}.prompt-box::placeholder{color:#777c82}.prompt-box:focus{border-color:#51565d}.select-wrap{width:100%;margin-bottom:16px;position:relative}.select-trigger{color:#e7e8ea;text-align:left;background:#191c1f;border:1px solid #292c30;border-radius:8px;justify-content:space-between;align-items:center;width:100%;min-height:42px;padding:0 13px;font-size:14px;display:flex}.select-trigger:hover,.select-wrap.open .select-trigger{border-color:#50555c}.select-trigger svg{color:#82878e;width:16px;height:16px}.select-menu{z-index:60;background:#202327;border:1px solid #383c42;border-radius:8px;max-height:180px;padding:5px;position:absolute;top:calc(100% + 5px);left:0;right:0;overflow:auto;box-shadow:0 14px 28px #0006}.select-menu button{color:#b5b9be;text-align:left;background:0 0;border-radius:6px;justify-content:space-between;align-items:center;width:100%;min-height:36px;padding:0 10px;font-size:13px;display:flex}.select-menu button:hover,.select-menu button.selected{color:#f3f4f5;background:#34383d}.parameters-label{margin-top:2px}.parameter-grid{grid-template-columns:1fr 1fr 1fr;gap:7px;display:grid}.parameter-grid .select-wrap{margin-bottom:0}.parameter-grid .select-trigger{min-height:42px;padding:0 11px;font-size:13px}.parameter-grid .select-menu{min-width:100%}.rail-bottom{margin-top:auto;padding-top:16px}.generation-status{color:#9ca1a7;align-items:center;gap:8px;min-height:22px;margin-bottom:10px;font-size:13px;display:flex}.generation-status.error{color:#f09b9b}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.generate-button{color:#121600;background:#d9ff00;border-radius:11px;justify-content:center;align-items:center;width:100%;min-height:50px;font-size:15px;font-weight:700;display:flex;box-shadow:inset 0 -3px #5064008c}.generate-button-content{justify-content:center;align-items:center;gap:7px;display:inline-flex}.generate-button:hover:not(:disabled){background:#ebff5d}.generate-button:disabled{cursor:not-allowed;color:#d8de8b;box-shadow:none;background:#63700b}.result-canvas{background:#0c0e0f;border:1px solid #24282c;border-radius:15px;min-width:0;min-height:calc(100vh - 92px);padding:28px 32px;position:relative;overflow:visible}.canvas-label{color:#666c73;letter-spacing:.12em;text-transform:uppercase;font-size:12px}.empty-result{color:#6b7178;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:calc(100vh - 145px);font-size:15px;display:flex}.empty-result svg{color:#858b92;width:18px;height:18px}.video-result{flex-direction:column;justify-content:center;align-items:center;min-height:calc(100vh - 145px);padding:24px 0 36px;display:flex}.video-frame{aspect-ratio:16/9;background:#080909;border:1px solid #2a2e33;border-radius:12px;width:min(1120px,100%);position:relative;overflow:hidden}.video-frame video{object-fit:contain;background:#080909;width:100%;height:100%;display:block}.poster-overlay{color:#fff;pointer-events:auto;cursor:pointer;background:#00000080;border:1px solid #fff9;border-radius:50%;place-items:center;width:60px;height:60px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.poster-overlay svg{width:22px;height:22px}.result-actions{color:#a5aab0;justify-content:space-between;align-items:center;gap:20px;width:min(1120px,100%);padding-top:14px;font-size:13px;display:flex}.result-actions div{gap:8px;display:flex}.result-actions button{color:#b7bbc0;background:#151719;border:1px solid #2b2f34;border-radius:8px;align-items:center;gap:6px;min-height:38px;padding:0 13px;font-size:13px;display:flex}.result-actions button:hover{color:#f3f4f5;border-color:#555a61}@media (width<=760px){.app-header{padding:0 14px}.app-header strong{font-size:13px}.generator-shell{grid-template-columns:1fr;gap:14px;padding:70px 12px 12px}.control-rail{border-radius:12px;min-height:auto;padding:14px}.model-card{max-width:440px}.rail-bottom{margin-top:16px}.result-canvas{border-radius:12px;min-height:620px;padding:20px 16px}.empty-result,.video-result{min-height:540px}.parameter-grid{gap:6px}}@media (width<=420px){.header-page,.header-divider{display:none}.app-header strong{font-size:12px}.parameter-grid .select-trigger{padding:0 7px;font-size:11px}.result-actions{flex-direction:column;align-items:flex-start;gap:10px}}.result-actions .download-button{color:#b7bbc0;background:#151719;border:1px solid #2b2f34;border-radius:8px;align-items:center;gap:6px;min-height:38px;padding:0 13px;font-size:13px;text-decoration:none;display:flex}.result-actions .download-button:hover{color:#f3f4f5;border-color:#555a61}.history-section{border-top:1px solid #24282c;margin-top:24px;padding-top:18px}.history-heading{color:#d8dadd;justify-content:space-between;align-items:baseline;margin-bottom:12px;font-size:14px;font-weight:600;display:flex}.history-heading small{color:#72777e;font-size:12px;font-weight:400}.history-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;display:grid}.history-card{text-align:left;background:#151719;border:1px solid #292d32;border-radius:10px;min-width:0;padding:0;overflow:hidden}.history-card:hover{border-color:#555b63}.history-thumb{aspect-ratio:16/9;object-fit:cover;background:#080909;width:100%;display:block}.history-card-body{padding:10px 11px 11px}.history-card-body strong{color:#dfe1e3;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:500;line-height:1.35;display:block;overflow:hidden}.history-card-body small{color:#777d84;margin-top:6px;font-size:11px;display:block}@media (width<=760px){.history-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=420px){.history-grid{grid-template-columns:1fr}}@media (width>=761px){html,body,#root{height:100%;overflow:hidden}.app-shell{height:100vh;overflow:hidden}.generator-shell{height:100vh;min-height:0;overflow:hidden}.control-rail{min-height:0;overflow:hidden}.result-canvas{height:calc(100vh - 92px);min-height:0;overflow:hidden auto}}@media (width<=760px){html,body,#root{min-height:100%}.app-shell,.generator-shell{height:auto;min-height:100vh;overflow:visible}.control-rail{min-height:auto;overflow:visible}.result-canvas{height:auto;min-height:620px;overflow:visible}}.account-panel,.auth-panel{align-items:center;gap:8px;margin-left:auto;display:flex;transform:translateY(5px)}.account-panel{color:#9da3aa;font-size:12px}.account-balance{color:#d9ff00;font-weight:600}.account-email{text-overflow:ellipsis;white-space:nowrap;max-width:180px;overflow:hidden}.account-link,.account-button{color:#dfe2e4;background:#171a1d;border:1px solid #30343a;border-radius:7px;justify-content:center;align-items:center;min-height:32px;padding:0 11px;font-size:12px;text-decoration:none;display:inline-flex}.account-button{cursor:pointer}.account-button:hover,.account-link:hover{color:#fff;border-color:#697078}.auth-panel{background:#111315;border:1px solid #292d32;border-radius:10px;padding:7px 9px}.auth-panel strong{color:#e6e8ea;white-space:nowrap;margin-right:3px;font-size:12px}.auth-panel input{color:#e8eaec;background:#1a1d20;border:1px solid #30343a;border-radius:6px;width:120px;min-height:30px;padding:0 8px;font-size:12px}.auth-panel input:focus{outline:1px solid #697078}.auth-switch{color:#898f96;white-space:nowrap;background:0 0;font-size:11px}.auth-switch:hover{color:#d9ff00}.google-login-button{color:#1a1c1e;cursor:pointer;background:#f2f3f4;border:1px solid #3a3f45;border-radius:7px;align-items:center;gap:8px;min-height:32px;padding:0 12px;font-size:12px;font-weight:600;display:inline-flex}.google-login-button:hover{background:#fff;border-color:#fff}.google-mark{color:#4285f4;background:#fff;border-radius:50%;place-items:center;width:18px;height:18px;font-size:13px;font-weight:700;display:grid}.admin-dashboard{background:#0c0e0f;min-height:100vh;padding:94px 32px 48px}.admin-heading{justify-content:space-between;align-items:flex-start;gap:24px;max-width:1280px;margin:0 auto 30px;display:flex}.admin-heading h1{color:#f1f2f3;letter-spacing:-.04em;margin:8px 0 6px;font-size:32px}.admin-heading p{color:#7d838a;margin:0;font-size:13px}.overview-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;max-width:1280px;margin:0 auto 30px;display:grid}.overview-card{background:#111315;border:1px solid #292d32;border-radius:11px;flex-direction:column;gap:10px;min-height:108px;padding:18px;display:flex}.overview-card small{color:#858b92;text-transform:uppercase;letter-spacing:.08em;font-size:12px}.overview-card strong{color:#f0f1f2;letter-spacing:-.04em;font-size:28px}.admin-section{max-width:1280px;margin:0 auto 26px}.admin-section-heading{justify-content:space-between;align-items:baseline;margin-bottom:10px;display:flex}.admin-section-heading h2{color:#e6e8ea;margin:0;font-size:16px}.admin-section-heading span{color:#70767d;font-size:12px}.admin-table-wrap{background:#111315;border:1px solid #292d32;border-radius:10px;overflow:auto}.admin-table-wrap table{border-collapse:collapse;width:100%;min-width:620px}.admin-table-wrap th,.admin-table-wrap td{color:#b8bdc2;text-align:left;border-bottom:1px solid #25292d;padding:12px 14px;font-size:12px}.admin-table-wrap th{color:#777e85;letter-spacing:.06em;text-transform:uppercase;font-size:11px;font-weight:600}.admin-table-wrap tr:last-child td{border-bottom:0}.admin-state{color:#858b92;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:100vh;display:flex}.admin-state strong{color:#e6e8ea;font-size:18px}.admin-error{color:#f09b9b;background:#211517;border:1px solid #653e42;border-radius:8px;max-width:1280px;margin:0 auto 18px;padding:12px 14px;font-size:13px}@media (width<=900px){.auth-panel{flex-wrap:wrap;max-width:calc(100vw - 24px);position:absolute;top:62px;right:12px}.admin-dashboard{padding:82px 16px 30px}.overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-heading h1{font-size:26px}}@media (width<=520px){.account-panel{position:absolute;top:62px;right:12px}.account-email{display:none}.overview-grid{grid-template-columns:1fr 1fr}.overview-card strong{font-size:22px}}.auth-loading{color:#8b9299;letter-spacing:.01em;background:#0c0e0f;justify-content:center;align-items:center;gap:11px;min-height:100vh;font-size:13px;display:flex}.auth-loading-mark{background:#15181b;border:1px solid #2c3137;border-radius:9px;place-items:center;width:32px;height:32px;display:grid}.auth-loading-mark .flowpilot-logo{width:20px;height:20px}.login-screen{isolation:isolate;color:#eef0f2;background:#0b0d0f;place-items:center;min-height:100vh;padding:32px 20px;display:grid;position:relative;overflow:hidden}.login-grid{z-index:-1;opacity:.42;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:72px 72px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000 0%,#000 24% 76%,#0000 100%);mask-image:linear-gradient(#0000 0%,#000 24% 76%,#0000 100%)}.login-screen:after{z-index:-1;content:"";pointer-events:none;border:1px solid #d9ff0012;border-radius:50%;width:620px;height:360px;position:absolute;transform:rotate(-12deg)}.login-panel{background:#0f1214f0;border:1px solid #292e34;border-radius:18px;flex-direction:column;align-items:flex-start;width:min(100%,460px);padding:42px;display:flex;box-shadow:0 24px 80px #00000047}.login-brand{color:#f4f5f6;letter-spacing:.065em;align-items:center;gap:10px;margin-bottom:70px;font-size:14px;font-weight:650;display:flex}.login-brand .flowpilot-logo{border-radius:5px;width:26px;height:26px}.login-eyebrow{color:#a7bd38;letter-spacing:.14em;margin:0 0 14px;font-size:11px;font-weight:650}.login-panel h1{color:#f3f4f5;letter-spacing:-.045em;max-width:380px;margin:0 0 28px;font-size:clamp(30px,4vw,38px);font-weight:600;line-height:1.08}.login-line{display:block}.login-line-primary{font-size:1em;font-weight:650}.login-line-emphasis{color:#dfe3e6;letter-spacing:-.035em;margin-top:4px;font-size:.82em;font-weight:500}.login-line-secondary{color:#8d969e;letter-spacing:-.02em;margin-top:5px;font-size:.7em;font-weight:400;line-height:1.18}.login-copy{color:#8d959d;max-width:350px;margin:18px 0 30px;font-size:15px;line-height:1.6}.login-primary{border-color:#f2f3f4;border-radius:9px;justify-content:center;width:100%;min-height:48px;font-size:14px}.login-primary:disabled{cursor:wait;opacity:.65}.login-primary .google-mark{background:0 0;width:19px;height:19px}.login-secondary{color:#c7cdd2;background:#171b1f;border:1px solid #3b4249;border-radius:8px;min-height:40px;margin:-12px 0 22px;padding:0 14px;font-size:13px}.login-secondary:hover{color:#fff;border-color:#69737b}.login-legal{color:#687179;max-width:350px;margin:18px 0 0;font-size:11px;line-height:1.55}.login-screen button:focus-visible{outline-offset:3px;outline:2px solid #d9ff00}@media (width<=600px){.login-screen{padding:20px 16px}.login-panel{border-radius:14px;padding:28px 22px}.login-brand{margin-bottom:54px}.login-panel h1{font-size:38px}.login-copy{font-size:14px}}