@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#090b13;--side:#0d101b;--panel:#141724;--panel2:#171a29;--line:#272b3d;--muted:#838ba5;--ink:#f3f5ff;--violet:#966cff;--blue:#6c9cff;--peach:#f2a98f;--green:#46d0b5;--font:Manrope,DM Sans,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:14px;line-height:1.45}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:wait}button:focus-visible,textarea:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:2px solid #ae8dff;outline-offset:3px}a{color:inherit;text-decoration:none}.hidden{display:none!important}
.app-shell{display:flex;min-height:100vh}.sidebar{width:258px;flex:0 0 258px;display:flex;flex-direction:column;background:#0e111b;border-right:1px solid #232637;padding:28px 17px 22px;min-height:100vh;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:11px;padding:3px 14px 52px}.brand-icon{width:40px;height:40px;border-radius:13px;background:linear-gradient(135deg,#9364ff,#5c70fc 62%,#37c9dc);display:flex;align-items:center;justify-content:center;font-size:27px;font-weight:700;box-shadow:0 6px 28px #6d50e92e}.brand-icon.small{width:30px;height:30px;font-size:20px;border-radius:10px}.brand-type{display:flex;flex-direction:column}.brand-type strong,.mobile-brand strong{font-size:19px;letter-spacing:-.7px;font-weight:800}.brand-ai{color:#b798ff}.brand-type small{font-size:9px;letter-spacing:2.6px;font-weight:800;color:#77819f}.nav-caption{font-size:10px;font-weight:800;color:#5d6480;letter-spacing:1.8px;padding:0 15px 13px}.nav-stack{display:flex;flex-direction:column;gap:6px}.nav-btn{width:100%;display:flex;gap:12px;align-items:center;text-align:left;border:1px solid transparent;color:#9ba2bb;border-radius:11px;background:transparent;padding:12px;font-weight:700;font-size:12.5px;white-space:nowrap}.nav-btn span{font-size:22px;width:25px;color:#9597ae;font-weight:400;text-align:center}.nav-btn:hover,.nav-btn.active{background:#242037;color:#e9e4ff}.nav-btn.active{border-color:#41375c}.nav-btn.active span{color:#b59cff}.nav-btn i{font-size:9px;background:#252841;border-radius:4px;padding:2px 5px;color:#b9b0fe;font-style:normal;margin-left:auto}.side-spacer{flex:1}.side-info{padding:19px 17px;background:linear-gradient(135deg,#282044,#181c30);border:1px solid #453567;border-radius:14px}.side-info strong{font-size:13px;display:block;margin:8px 0}.side-info p{color:#b3aacd;font-size:11px;line-height:1.65;margin:0}.tip-symbol{color:#c09fff;font-size:24px}.sidebar-foot{font-size:9px;letter-spacing:1.3px;color:#636a82;text-align:center;margin-top:28px}.sidebar-foot span{padding:0 7px}.workspace{flex:1;min-width:0}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1d2030;padding:0 39px;gap:12px}.breadcrumbs{font-size:11px;color:#757e99;font-weight:650;white-space:nowrap}.breadcrumbs span{color:#3f455b;padding:0 12px}.breadcrumbs b{color:#c8cce1;font-weight:700}.topbar-right{display:flex;align-items:center;gap:17px}.connection-tag{color:#a5aec4;display:flex;align-items:center;gap:8px;font-size:11px;white-space:nowrap}.connection-tag i{width:7px;height:7px;background:#fcba7c;border-radius:50%;box-shadow:0 0 13px #ffbd7c77}.connection-tag.online i{background:#47d3ac;box-shadow:0 0 13px #47d3ac77}.icon-button{width:38px;height:38px;background:#171a28;color:#c7cbe0;border:1px solid #2d3243;border-radius:10px;font-size:20px}.main-content{max-width:1370px;margin:auto;padding:40px 41px 20px}.hero{margin-bottom:31px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#ad91ff;margin-bottom:16px;display:flex;align-items:center;gap:10px}.eyebrow-dot{height:6px;width:6px;border-radius:50%;background:#9c8aff;box-shadow:0 0 13px #a78aff}.hero h1{font-size:clamp(34px,3.5vw,52px);line-height:1.16;letter-spacing:-2.7px;font-weight:800;margin:0 0 13px}.hero h1 em{font-style:normal;color:#aa8cff;background:linear-gradient(100deg,#dfb2ff,#947cff 60%,#6aaef5);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero p{margin:0;color:#929bb4;line-height:1.75;font-size:13px}.studio-grid{display:grid;grid-template-columns:minmax(360px,1fr) minmax(330px,1fr);gap:20px;align-items:start}.panel{border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,#171a27,#131622);padding:26px 25px;box-shadow:0 10px 35px #05060b25}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}.panel-kicker{font-size:9px;font-weight:800;letter-spacing:1.7px;color:#7d86a3}.panel-heading h2{margin:6px 0 0;font-size:22px;line-height:1.2;letter-spacing:-.7px}.mode-tag{font-size:9px;letter-spacing:1.1px;font-weight:800;padding:7px 10px;border:1px solid #50436d;color:#c5b2ff;border-radius:7px;background:#2a233e}.panel-desc{margin:0 0 24px;color:#8d96ae;font-size:11.6px;line-height:1.7}.field-label{display:flex;align-items:baseline;justify-content:space-between;margin:16px 0 9px;font-size:12px;font-weight:800;color:#d5d8e9}.field-label span{color:#747d99;font-size:9px;font-weight:700}textarea,select,input[type=text],input[type=password]{display:block;width:100%;border-radius:10px;border:1px solid #33374b;background:#10131f;color:#eceef7;outline:none;transition:border-color .15s;min-height:44px;padding:12px 13px}textarea::placeholder,input::placeholder{color:#646f86}textarea{min-height:137px;resize:vertical;padding:14px;line-height:1.7;font-size:12px}select{font-size:12px;font-weight:650;appearance:none;background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="%23b5a6da" stroke-width="2"%3E%3Cpath d="m6 9 6 6 6-6"/%3E%3C/svg%3E');background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}select option{background:#191b2a}textarea:focus,select:focus,input:focus{border-color:#8868da;box-shadow:0 0 0 2px #8f67d417}.textarea-footer{display:flex;justify-content:space-between;color:#636c86;font-size:10px;margin-top:6px}.preset-label{margin:23px 0 10px}.preset-row{display:flex;flex-wrap:wrap;gap:8px}.preset{padding:8px 11px;border:1px solid #30344a;background:#202335;color:#b5bcd1;border-radius:7px;font-size:10px;font-weight:700}.preset:hover{background:#302943;color:#f4ecff}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;margin-top:8px}.field-grid .field-label{font-size:11px}.check-line{display:flex;gap:12px;align-items:center;margin:20px 0 1px;background:#1e2132;padding:12px;border-radius:10px;border:1px solid #30344b}.check-line input{accent-color:#a584ff;width:18px;height:18px;margin:0}.check-line span{display:flex;flex-direction:column;gap:2px}.check-line b{font-size:11px}.check-line small{color:#8992ae;font-size:10px}.estimate{display:flex;justify-content:space-between;gap:10px;align-items:flex-end;margin-top:28px;margin-bottom:14px;padding-top:18px;border-top:1px solid #292d40}.estimate>div{display:flex;flex-direction:column;gap:4px}.estimate span{font-size:9px;color:#858da7;font-weight:800;letter-spacing:1.25px}.estimate strong{font-size:23px;font-weight:800;color:#dbc7ff;letter-spacing:-.8px}.estimate small{color:#77819b;font-size:10px;text-align:right;padding-bottom:4px}.primary-button{display:flex;align-items:center;justify-content:center;position:relative;gap:12px;width:100%;min-height:50px;border:none;border-radius:10px;background:linear-gradient(100deg,#8557f0,#6c60ee,#697beb);box-shadow:0 7px 22px #7151ca38;color:white;font-size:13px;font-weight:800}.primary-button span:first-child{font-size:17px;font-weight:500}.primary-button b{position:absolute;right:17px;font-size:21px;font-weight:400}.primary-button:hover{filter:brightness(1.1)}.mini-disclaimer{font-size:9.5px;line-height:1.65;text-align:center;color:#69738c;margin:13px 7px 0}.drop-zone{position:relative;border:1px dashed #5a4a7b;background:linear-gradient(135deg,#211d35,#161a2b);min-height:158px;border-radius:11px;display:grid;place-items:center;overflow:hidden;cursor:pointer}.drop-zone.dragover{border-color:#baa2ff;background:#2c2143}.drop-empty{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:16px;gap:4px;text-align:center}.upload-icon{font-size:27px;color:#bd9bff}.drop-empty b{font-size:11px;color:#dddeed}.drop-empty small{font-size:10px;color:#929bb2}.upload-cta{margin-top:9px;border:1px solid #604b85;color:#ccb6ff;border-radius:7px;padding:7px 16px;font-size:10px;font-weight:800}.file-preview{position:absolute;inset:0;display:grid;place-items:center;background:#090b13}.file-preview img,.file-preview video{width:100%;height:100%;max-height:240px;object-fit:contain}.file-preview .file-label{position:absolute;bottom:7px;left:9px;max-width:calc(100% - 18px);background:#101323ce;color:#e7e8f3;border:1px solid #ffffff22;padding:5px 8px;border-radius:6px;font-size:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.input-foot{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:7px 2px 0;color:#79839c;font-size:10px}.text-button{background:none;border:none;color:#ac94ff;padding:4px 0;font-size:10px;font-weight:800}.result-panel{min-height:655px}.result-heading{margin-bottom:20px}.result-tag{font-size:9px;color:#63dfbf;border:1px solid #30605a;background:#183930;border-radius:6px;padding:7px 9px;font-weight:800;letter-spacing:1px}.result-stage{background:radial-gradient(ellipse at 50% 38%,#252041,#111420 60%,#0f111b 100%);border:1px solid #2b2e42;border-radius:12px;aspect-ratio:1.06;min-height:300px;max-height:560px;display:grid;place-items:center;overflow:hidden}.result-placeholder,.busy-view{text-align:center;padding:14px;display:flex;justify-content:center;align-items:center;flex-direction:column;width:100%}.graphic-scene{height:165px;width:205px;display:grid;place-items:center;position:relative;margin-bottom:9px}.graphic-ring{position:absolute;border-radius:50%;border:1px solid #68569f66;transform:rotate(-35deg);box-shadow:0 0 45px #7d53e51b}.ring-1{height:160px;width:160px}.ring-2{height:120px;width:120px;border-color:#9b74d266;transform:rotate(27deg)}.graphic-core{width:86px;height:86px;display:grid;place-items:center;color:#dbb8ff;font-size:72px;font-weight:300;text-shadow:0 0 42px #9a67ed90;animation:float 7s ease-in-out infinite}.result-placeholder strong,.busy-view strong{font-size:15px;font-weight:800;letter-spacing:-.3px}.result-placeholder p,.busy-view p{font-size:11px;color:#8e97af;margin:10px auto 0;max-width:230px;line-height:1.6}.result-media{height:100%;width:100%;display:grid;place-items:center}.result-media img,.result-media video{width:100%;height:100%;max-height:560px;object-fit:contain}.result-actions{display:flex;gap:10px;margin-top:14px}.secondary-button,.outline-button{border-radius:9px;min-height:41px;display:flex;justify-content:center;align-items:center;font-weight:800;font-size:11px;flex:1;padding:10px;border:1px solid #44355e;background:#28223e;color:#d6c1ff}.outline-button{background:transparent;border-color:#3b4054;color:#b5bfda}.secondary-button:hover,.outline-button:hover{filter:brightness(1.18)}.stage-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 2px 25px;font-size:10px;color:#78829b}.stage-footer span:last-child{white-space:nowrap;color:#a6adbf}.history-heading{border-top:1px solid #292c3d;padding-top:21px;display:flex;align-items:center;justify-content:space-between;gap:12px}.history-heading h3{font-size:16px;margin:4px 0 0;letter-spacing:-.2px}.history-list{display:flex;flex-direction:column;gap:9px;margin-top:16px;max-height:320px;overflow-y:auto}.empty-history{padding:22px 15px;text-align:center;background:#171a29;border:1px dashed #34394d;border-radius:10px;color:#747e99;font-size:11px;line-height:1.65}.history-item{border:1px solid #2b2f43;background:#1c2030;border-radius:10px;padding:9px;display:flex;align-items:center;gap:10px;min-width:0;cursor:pointer;text-align:left;color:inherit}.history-item:hover{background:#28253a}.history-thumb{height:51px;width:61px;border-radius:6px;background:linear-gradient(135deg,#3f3268,#252d46);flex:0 0 61px;display:grid;place-items:center;color:#bd9fff;font-size:24px;overflow:hidden}.history-thumb img{width:100%;height:100%;object-fit:cover}.history-item-body{min-width:0;flex:1}.history-item-body strong{display:block;font-size:10.5px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:#dee0ec}.history-item-body small{display:block;font-size:9px;color:#8790a9;margin-top:3px}.history-item-status{font-size:9px;padding:4px 6px;border-radius:5px;color:#c6b2ff;background:#312943}.history-item-status.done{color:#73dabb;background:#1e4039}.history-item-status.failed{color:#f19e9c;background:#4c2a33}.history-note{font-size:9px;color:#69738b;line-height:1.6;margin-top:13px}.loading-orb{width:78px;height:78px;background:linear-gradient(145deg,#9567fd,#515ade);display:grid;place-items:center;border-radius:24px;font-size:48px;color:#eee3ff;box-shadow:0 0 60px #8260ed66;margin-bottom:30px;animation:float 3s ease-in-out infinite}.result-tag.working{color:#eec799;background:#433325;border-color:#675035}.result-tag.error{color:#ffa5a5;background:#3e252a;border-color:#654149}.main-footer{display:flex;justify-content:space-between;color:#4f5873;font-size:9px;letter-spacing:1px;font-weight:800;gap:10px;margin:24px 1px 8px}.mobile-tabs,.mobile-brand{display:none}.settings-modal{width:min(440px,calc(100vw - 30px));border:1px solid #4a405e;background:#191b2a;color:#f4f3ff;padding:0;border-radius:17px;box-shadow:0 20px 130px #000b}.settings-modal::backdrop{background:#070914cc;backdrop-filter:blur(6px)}.settings-content{padding:27px}.settings-title{display:flex;justify-content:space-between;align-items:start}.settings-title h2{font-size:22px;margin:5px 0}.close-button{background:#26283a;color:#c4c6d6;border:none;border-radius:8px;width:34px;height:34px}.settings-content p{font-size:12px;line-height:1.7;color:#a0a7bf}.settings-content .primary-button{margin-top:16px}.settings-tip{font-size:10px;line-height:1.65;color:#7e8aa5;margin-top:14px}.toast{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);z-index:50;background:#e7deff;color:#26223b;border-radius:11px;padding:12px 17px;box-shadow:0 10px 60px #0009;font-size:12px;font-weight:750;max-width:min(90vw,600px);text-align:center;animation:in .2s ease-out}@keyframes in{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}@keyframes float{50%{transform:translateY(-10px)}}
@media(max-width:1200px){.sidebar{width:218px;flex-basis:218px;padding:25px 11px}.main-content{padding:31px 25px}.panel{padding:24px 19px}.studio-grid{gap:15px}.topbar{padding:0 26px}}
@media(max-width:980px){.sidebar{display:none}.mobile-brand{display:flex;align-items:center;gap:9px}.topbar{height:68px}.breadcrumbs{display:none}.main-content{padding:31px 25px}.mobile-tabs{display:flex;gap:9px;overflow-x:auto;margin:0 -25px 19px;padding:0 25px 8px;scrollbar-width:none}.mobile-tabs::-webkit-scrollbar{display:none}.mode-chip{background:#191c2b;border:1px solid #2c3042;color:#a2abc5;white-space:nowrap;border-radius:10px;padding:11px 14px;font-size:11px;font-weight:800}.mode-chip.active{background:#292240;color:#dbc9ff;border-color:#654b94}}
@media(max-width:720px){.topbar{padding:0 17px}.connection-tag{font-size:0;gap:0}.connection-tag i{width:8px;height:8px}.topbar-right{gap:11px}.main-content{padding:28px 16px}.hero{margin-bottom:23px}.eyebrow{font-size:9px;margin-bottom:12px}.hero h1{font-size:36px;letter-spacing:-1.8px}.hero p{font-size:11.5px;max-width:380px}.mobile-tabs{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}.studio-grid{display:flex;flex-direction:column;gap:16px}.panel{width:100%;padding:22px 18px}.result-panel{min-height:auto}.panel-heading h2{font-size:19px}.result-stage{aspect-ratio:1.1;min-height:275px;max-height:460px}.graphic-scene{height:140px}.main-footer{margin:20px 3px 10px;font-size:8px}.field-grid{column-gap:10px}}
@media(max-width:390px){.field-grid{grid-template-columns:1fr}.hero h1{font-size:33px}.estimate{align-items:center}.estimate strong{font-size:21px}.preset{padding:8px 9px}.result-actions{flex-wrap:wrap}.result-actions>*{min-width:130px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}