@import"https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800;900&display=swap";:root{--bg:#050508;--card:#101017;--card2:#161620;--line:#292936;--text:#f8f8fc;--muted:#9c9ca9;--brand:#7c5cff;--pink:#e85cff;--green:#43d6a4;--danger:#ff6d7a}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;font-family:Vazirmatn,system-ui,sans-serif;color:var(--text);background:radial-gradient(900px 550px at 90% -10%,#3c1776 0%,transparent 58%),radial-gradient(700px 500px at 0 30%,#10234a 0%,transparent 58%),var(--bg)}body{overflow-x:hidden}button,input,textarea,select{font:inherit}button{cursor:pointer}.app-shell{width:min(1440px,100%);margin:auto;padding:18px 22px 60px}.topbar{height:62px;display:flex;align-items:center;justify-content:space-between;margin-bottom:38px}.brand{display:flex;align-items:center;gap:11px}.brandmark{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,var(--brand),var(--pink));box-shadow:0 18px 50px #7c5cff42;font-size:22px}.brand strong{display:block;font-size:18px}.brand span{display:block;color:#8e8e9b;font-size:10px;margin-top:2px}.top-actions{display:flex;gap:9px;align-items:center}.secure-pill{padding:8px 12px;border:1px solid #30303b;background:#ffffff07;border-radius:999px;color:#bdbdc9;font-size:11px}.icon-btn{width:34px;height:34px;border-radius:50%;border:1px solid #33333e;background:#15151d;color:#ddd}.hero{text-align:center;max-width:900px;margin:0 auto 34px}.eyebrow{display:inline-flex;padding:7px 12px;border-radius:999px;border:1px solid #7c5cff55;background:#7c5cff12;color:#d9d0ff;font-size:10px;letter-spacing:.5px}.hero h1{font-size:clamp(38px,6vw,70px);line-height:1.05;letter-spacing:-2px;margin:15px 0 12px}.hero h1 span{background:linear-gradient(90deg,#fff,#c8b7ff,#ff8be9);color:transparent;background-clip:text;-webkit-background-clip:text}.hero p{max-width:760px;margin:auto;color:var(--muted);line-height:2;font-size:14px}.hero-badges{display:flex;justify-content:center;flex-wrap:wrap;gap:7px;margin-top:17px}.hero-badges span{padding:7px 10px;border-radius:999px;background:#ffffff06;border:1px solid #292934;color:#aaaab6;font-size:10px}.workspace{display:grid;grid-template-columns:minmax(330px,1.02fr) minmax(350px,.98fr) minmax(330px,.95fr);gap:15px;align-items:start}.card{background:linear-gradient(180deg,#12121add,#0b0b11ed);border:1px solid var(--line);border-radius:24px;box-shadow:0 28px 90px #0008;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);overflow:hidden}.setup,.production,.result{padding:18px}.section-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}.section-head small{display:block;color:#777783;font-size:10px;margin-bottom:3px}.section-head h2{font-size:18px;margin:0}.step-state,.outputState,.section-head>span{color:#8f8f9c;font-size:10px}.state-dot{color:#9c96b9}.field{margin-bottom:14px}.field label{display:block;color:#d5d5df;font-size:11px;margin-bottom:7px}.field label b{color:#ff7c98}.field label em{font-style:normal;color:#777783;margin-right:4px}.input,.field textarea,.field select{width:100%;border:1px solid #30303b;background:#08080d;color:#fff;border-radius:12px;padding:11px 12px;outline:none}.input:focus,.field textarea:focus,.field select:focus{border-color:#836cff;box-shadow:0 0 0 3px #7c5cff12}.field textarea{min-height:104px;resize:vertical;line-height:1.8}.hint{color:#666673;font-size:9px;margin-top:5px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:9px}.style-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.style-chip{border:1px solid #2e2e39;background:#09090e;color:#aaaab6;border-radius:12px;padding:8px 5px;text-align:center}.style-chip i{display:block;font-style:normal;font-size:17px}.style-chip span{display:block;font-weight:700;font-size:10px;margin-top:2px}.style-chip small{display:block;color:#646470;font-size:8px;margin-top:2px}.style-chip.active{border-color:#8871ff;background:#7c5cff17;color:#fff;box-shadow:inset 0 0 0 1px #7c5cff25}.color-row{display:flex;align-items:center;gap:8px}.color-row input{width:42px;height:36px;padding:2px;border-radius:10px;border:1px solid #33333e;background:#09090e}.color-row>span:not(.color-note){font:700 10px monospace;color:#bdbdca}.color-note{font-size:9px;color:#666672;margin-right:auto}.drop{display:block;border:1.5px dashed #444451;border-radius:15px;padding:17px;text-align:center;background:#08080d;transition:.2s}.drop:hover{border-color:#8973ff;background:#7c5cff08}.drop input,.music-drop input{display:none}.upload-icon{width:38px;height:38px;display:grid;place-items:center;margin:auto;border-radius:12px;background:#7c5cff14;color:#bdadff;font-size:23px}.drop strong{display:block;font-size:11px;margin:7px 0 2px}.drop span,.drop small{display:block;color:#777783;font-size:9px}.asset-list{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.asset-item{position:relative;width:60px;height:60px;border-radius:10px;overflow:hidden;border:1px solid #343440;background:#17171f}.asset-item img{width:100%;height:100%;object-fit:cover}.asset-item>span{position:absolute;bottom:3px;left:3px;background:#000b;border-radius:5px;padding:1px 4px;font-size:8px}.asset-item button{position:absolute;top:2px;right:2px;width:19px;height:19px;border:0;border-radius:50%;background:#000c;color:#fff;line-height:1}.video-thumb{height:100%;display:grid;place-items:center;color:#c8bcff;font-size:20px}.asset-empty{font-size:9px;color:#686875}.music-drop{display:flex;align-items:center;gap:9px;padding:10px;border:1px solid #2c2c36;border-radius:12px;background:#08080d}.music-drop>span{font-size:21px}.music-drop strong,.music-drop small{display:block}.music-drop strong{font-size:10px}.music-drop small{color:#6f6f7b;font-size:9px;margin-top:2px;max-width:250px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.button-row,.output-actions,.result-extra{display:flex;gap:8px}.primary,.secondary,.ghost{border-radius:12px;padding:11px 13px;font-weight:800}.primary{border:0;color:#fff;background:linear-gradient(135deg,var(--brand),var(--pink));box-shadow:0 12px 28px #7c5cff2d}.primary.big{flex:1}.secondary{background:#20202a;border:1px solid #343440;color:#eee}.ghost{background:transparent;border:1px solid #2e2e39;color:#aaaab6}.primary:disabled,.secondary:disabled,.ghost:disabled{opacity:.42;cursor:not-allowed}.notice{margin-top:10px;border:1px solid #1f4b3f;background:#0b1c18;color:#9be2ca;border-radius:11px;padding:9px 10px;font-size:9px;line-height:1.8}.notice b{color:#b9f1df}.progress-card{border:1px solid #292936;border-radius:16px;background:#09090f;padding:13px}.progress-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.progress-top strong{display:block;font-size:12px}.progress-top small{display:block;color:#737380;font-size:9px;margin-top:4px}.progress-top>b{font-size:22px;background:linear-gradient(90deg,#fff,#c5b4ff);color:transparent;background-clip:text;-webkit-background-clip:text}.progress-track{height:7px;background:#23232d;border-radius:99px;overflow:hidden;margin:13px 0}.progress-track i{display:block;width:0;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--brand),var(--pink));box-shadow:0 0 18px #9b75ff77;transition:width .3s}.stage-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.pipeline-stage{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid #24242e;border-radius:11px;background:#0d0d13;opacity:.48}.pipeline-stage.active{opacity:1;border-color:#6652c5;background:#161324}.pipeline-stage.done{opacity:1;border-color:#255342;background:#0d1815}.stage-number{font:800 9px monospace;color:#777783}.pipeline-stage b{display:block;font-size:9px}.pipeline-stage small{display:block;color:#666672;font-size:8px;margin-top:2px}.stage-check{margin-right:auto;font-size:12px;color:#777}.done .stage-check{color:var(--green)}.active .stage-check{color:#b6a7ff}.live-log{margin-top:11px;border:1px solid #292936;border-radius:15px;background:#09090e;overflow:hidden}.log-head{display:flex;justify-content:space-between;padding:8px 10px;border-bottom:1px solid #22222c;color:#aaaab5;font-size:9px}.tiny-btn{background:transparent;border:0;color:#8276b9;font-size:9px}.log{height:116px;overflow:auto;padding:7px 10px}.log-line{display:flex;gap:7px;color:#c2c2ce;font-size:9px;line-height:1.8;padding:2px 0}.log-line span:first-child{color:#8f7dff}.log-line.success span:first-child{color:var(--green)}.log-line.error span:first-child{color:var(--danger)}.log-line.muted{color:#666673}.script-panel{margin-top:11px;border:1px solid #292936;border-radius:15px;background:#09090e;overflow:hidden}.panel-title{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-bottom:1px solid #22222c;font-size:9px;color:#b8b8c3}.script-panel textarea{width:100%;height:145px;border:0;outline:0;background:transparent;color:#ddd;font-size:10px;line-height:1.9;padding:10px;resize:vertical}.script-panel textarea.editing{background:#0e0e15}.script-meta{display:flex;justify-content:space-between;padding:7px 10px;border-top:1px solid #22222c;color:#666672;font-size:8px}.video-stage{height:550px;border:1px solid #2a2a35;border-radius:17px;background:#030305;display:grid;place-items:center;overflow:hidden;position:relative}.video-stage:before{content:"9:16";position:absolute;top:10px;left:10px;padding:4px 7px;border-radius:7px;background:#0009;color:#777783;font:700 8px monospace;z-index:2}.video-stage canvas{max-width:100%;max-height:100%;height:100%;width:auto;border-radius:9px}.empty{text-align:center;color:#72727f;padding:25px}.empty div{font-size:45px;margin-bottom:10px}.empty strong,.empty small{display:block}.empty strong{font-size:11px;color:#9999a6}.empty small{font-size:9px;margin-top:5px}.processing{text-align:center;color:#9999a6}.processing strong,.processing small{display:block}.processing strong{font-size:11px;margin-top:10px}.processing small{font-size:9px;color:#666672;margin-top:4px}.spinner{width:36px;height:36px;margin:auto;border-radius:50%;border:3px solid #282834;border-top-color:#9c7dff;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.output-actions{margin-top:10px}.output-actions .primary{flex:1}.result-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:9px}.result-metrics>div{border:1px solid #292936;background:#0a0a10;border-radius:11px;padding:8px}.result-metrics span{display:block;font-size:15px}.result-metrics b{display:block;font-size:9px;margin-top:3px}.result-metrics small{display:block;color:#666672;font-size:8px;margin-top:2px}.result-extra{margin-top:9px}.result-extra>*{flex:1}.how{margin-top:15px;padding:14px 17px;display:flex;justify-content:space-between;gap:18px;align-items:center}.how>div:first-child{display:flex;gap:11px;align-items:flex-start}.how-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#7c5cff15}.how h3{margin:0 0 4px;font-size:12px}.how p{margin:0;color:#777783;font-size:9px;line-height:1.8;max-width:720px}.how-list{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.how-list span{padding:6px 8px;border-radius:8px;background:#fff5;border:1px solid #292936;color:#888895;font-size:8px}footer{text-align:center;color:#5e5e69;font-size:9px;margin-top:22px}@media(max-width:1150px){.workspace{grid-template-columns:1fr 1fr}.result{grid-column:1/-1}.video-stage{height:620px}}@media(max-width:760px){.app-shell{padding:12px 10px 45px}.topbar{margin-bottom:25px}.secure-pill{display:none}.hero{margin-bottom:24px}.hero h1{font-size:42px}.workspace{grid-template-columns:1fr}.result{grid-column:auto}.video-stage{height:560px}.how{display:block}.how-list{justify-content:flex-start;margin-top:12px}.stage-grid{grid-template-columns:1fr 1fr}}@media(max-width:420px){.grid-2{grid-template-columns:1fr}.style-grid{grid-template-columns:repeat(2,1fr)}.hero h1{font-size:37px}.video-stage{height:500px}.app-shell{padding-inline:8px}.setup,.production,.result{padding:13px;border-radius:19px}}.final-preview{width:100%;height:100%;max-height:100%;display:block;object-fit:contain;background:#000;border-radius:18px}