@import "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=IBM+Plex+Sans:wght@400;500;600&display=swap";body{margin:0}:root{--bg:#0c0e12;--bg-elev:#12151c;--bg-panel:#161a23;--bg-soft:#1c2230;--line:#ffffff14;--line-strong:#ffffff24;--text:#eef1f6;--muted:#9aa3b5;--accent:#3dd6c6;--accent-2:#f0b429;--danger:#ff6b6b;--ok:#3dd68c;--radius:16px;--shadow:0 18px 50px #00000059;--font:"DM Sans", "IBM Plex Sans", system-ui, sans-serif;--mono:"IBM Plex Sans", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--font);color:var(--text);background-color:#0000;background-image:radial-gradient(1200px 600px at 10% -10%,#3dd6c61f,#0000 55%),radial-gradient(900px 500px at 100% 0,#f0b42914,#0000 50%),linear-gradient(#0b0d11 0%,#0c0e12 40%,#0a0c10 100%);background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:auto,auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;margin:0}button,input,select{font:inherit;color:inherit}button{cursor:pointer}.app-shell{grid-template-columns:240px 1fr;min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#0a0c10d1;flex-direction:column;gap:28px;height:100vh;padding:22px 16px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;padding:4px 8px;display:flex}.brand-mark{width:40px;height:40px;color:var(--accent);background:linear-gradient(145deg,#3dd6c640,#3dd6c60d);border:1px solid #3dd6c659;border-radius:12px;place-items:center;display:grid}.brand-name{letter-spacing:-.03em;font-size:1.15rem;font-weight:700}.brand-tag{color:var(--muted);font-size:.75rem}.nav{flex-direction:column;gap:6px;display:flex}.nav-item{color:var(--muted);background:0 0;border:1px solid #0000;border-radius:12px;align-items:center;gap:10px;padding:11px 12px;transition:all .18s;display:flex}.nav-item:hover{color:var(--text);background:#ffffff08}.nav-item.active{color:var(--text);background:#3dd6c61a;border-color:#3dd6c638}.sidebar-footer{background:var(--bg-soft);color:var(--muted);border-radius:12px;margin-top:auto;padding:12px;font-size:.8rem}.main{max-width:1280px;padding:28px 32px 48px}.topbar h1{letter-spacing:-.04em;margin:0;font-size:1.75rem}.sub{color:var(--muted);margin:6px 0 0}.panel{background:linear-gradient(180deg, #ffffff08, transparent 40%), var(--bg-panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.upload-zone{background:linear-gradient(180deg, #3dd6c60f, transparent 50%), var(--bg-panel);text-align:center;cursor:pointer;border:1px dashed #3dd6c659;border-radius:22px;place-content:center;gap:8px;min-height:340px;margin-top:22px;transition:all .2s;display:grid}.upload-zone.drag{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 0 0 4px #3dd6c61f}.upload-zone.busy{pointer-events:none;opacity:.85}.upload-icon{width:64px;height:64px;color:var(--accent);background:#3dd6c61f;border-radius:18px;place-items:center;margin:0 auto 8px;display:grid}.upload-zone h2{letter-spacing:-.03em;margin:0}.upload-zone p{color:var(--muted);margin:0}.upload-cta{border:1px solid var(--line-strong);background:#ffffff0f;border-radius:999px;margin-top:10px;padding:10px 16px;display:inline-block}.video-info{grid-template-columns:1.4fr 1fr;gap:18px;margin-top:22px;display:grid}.preview-frame{border:1px solid var(--line);aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden}.preview-frame.tall{aspect-ratio:16/9;max-height:480px}.preview-frame video,.compare-side video{object-fit:contain;background:#000;width:100%;height:100%;display:block}.meta-grid{grid-template-columns:1fr 1fr;align-content:start;gap:10px;display:grid}.meta-item{background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:4px;min-width:0;padding:12px;display:flex}.meta-item span{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.75rem}.meta-item strong{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.features{margin-top:28px}.section-head h2{letter-spacing:-.03em;margin:0}.section-head p{color:var(--muted);margin:6px 0 0}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px;display:grid}.feature-card{border:1px solid var(--line);background:var(--bg-panel);border-radius:16px;padding:16px;transition:all .18s}.feature-card.on{border-color:#3dd6c659;box-shadow:inset 0 0 0 1px #3dd6c614}.feature-head{grid-template-columns:auto 1fr auto;align-items:start;gap:12px;display:grid}.feature-icon{width:40px;height:40px;color:var(--accent);background:#ffffff0a;border-radius:12px;place-items:center;display:grid}.feature-title-row{align-items:center;gap:8px;display:flex}.feature-titles h3{margin:0;font-size:1rem}.feature-titles p{color:var(--muted);margin:4px 0 0;font-size:.88rem;line-height:1.4}.badge{color:var(--accent-2);background:#f0b42926;border:1px solid #f0b4294d;border-radius:999px;padding:2px 7px;font-size:.68rem}.switch{width:46px;height:26px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{background:#2a3140;border-radius:999px;transition:all .18s;position:absolute;inset:0}.slider:before{content:"";background:#fff;border-radius:50%;width:20px;height:20px;transition:all .18s;position:absolute;top:3px;left:3px}.switch input:checked+.slider{background:var(--accent)}.switch input:checked+.slider:before{transform:translate(20px)}.feature-body{border-top:1px solid var(--line);gap:10px;margin-top:14px;padding-top:14px;display:grid}.field{gap:6px;display:grid}.field span{color:var(--muted);font-size:.8rem}.field em{color:var(--text);float:right;font-style:normal}.field select,.field input[type=number],.field input[type=text]{background:var(--bg-soft);border:1px solid var(--line);border-radius:10px;padding:9px 11px}.field input[type=color]{border:1px solid var(--line);background:0 0;border-radius:10px;width:100%;height:38px;padding:4px}.field-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.sliders{gap:8px;display:grid}.check{color:var(--muted);align-items:center;gap:8px;display:flex}.auto-edit-bar{background:linear-gradient(90deg,#3dd6c61f,#f0b4290f);border:1px solid #3dd6c640;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;margin-top:22px;padding:18px 20px;display:flex}.auto-edit-bar p{color:var(--muted);margin:4px 0 0}.btn{border:1px solid var(--line-strong);color:var(--text);background:#ffffff0a;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:10px 14px;transition:all .16s;display:inline-flex}.btn:hover{background:#ffffff14}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{color:#04221f;background:linear-gradient(#4ee0d0,#2cbcad);border-color:#0000;font-weight:700}.btn.primary:hover{filter:brightness(1.05)}.btn.lg{padding:14px 22px;font-size:1rem}.btn.block{width:100%}.btn.ghost{background:0 0}.processing{margin-top:22px;padding:28px}.processing-hero{text-align:center;padding:18px 0 8px;position:relative}.processing-hero h1{letter-spacing:-.04em;margin:0}.processing-hero p{color:var(--muted)}.pulse-ring{border:2px solid #3dd6c680;border-radius:50%;width:64px;height:64px;margin:0 auto 16px;animation:1.6s infinite pulse;box-shadow:0 0 #3dd6c659}@keyframes pulse{70%{box-shadow:0 0 0 18px #3dd6c600}to{box-shadow:0 0 #3dd6c600}}.progress-block{max-width:520px;margin:22px auto}.progress-top{color:var(--muted);justify-content:space-between;margin-bottom:8px;display:flex}.progress-track{background:#222836;border-radius:999px;height:10px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--accent), #7cf0e4);height:100%;transition:width .3s}.progress-eta{text-align:center;color:var(--muted);margin-top:8px;font-size:.9rem}.stage-list{gap:10px;max-width:520px;margin:24px auto 0;padding:0;list-style:none;display:grid}.stage{background:var(--bg-soft);border:1px solid var(--line);color:var(--muted);border-radius:12px;grid-template-columns:28px 1fr;align-items:start;gap:10px;padding:12px 14px;display:grid}.stage.running{color:var(--text);border-color:#3dd6c64d}.stage.completed{color:var(--text)}.stage.failed{color:var(--danger);border-color:#ff6b6b66}.stage-icon{background:#ffffff0a;border-radius:50%;place-items:center;width:28px;height:28px;display:grid}.stage.completed .stage-icon{color:var(--ok);background:#3dd68c26}.stage.running .stage-icon{color:var(--accent)}.stage-label{font-weight:600}.stage-detail{color:var(--muted);margin-top:2px;font-size:.85rem}.result-view{grid-template-columns:1.55fr .9fr;gap:16px;margin-top:22px;display:grid}.result-toolbar{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.result-toolbar h2{margin:0}.seg{background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:4px;display:inline-flex}.seg button{color:var(--muted);background:0 0;border:0;border-radius:9px;padding:8px 12px}.seg button.active{color:var(--text);background:#3dd6c626}.compare-wrap{gap:12px;display:grid}.compare-side{gap:6px;display:grid}.compare-side span{color:var(--muted);font-size:.8rem}.compare-side video{border:1px solid var(--line);aspect-ratio:16/9;border-radius:12px}.result-actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.summary-list{gap:8px;margin:12px 0 0;padding:0;list-style:none;display:grid}.summary-list li{color:var(--text);align-items:center;gap:8px;display:flex}.summary-list svg{color:var(--ok)}.note{color:var(--muted);font-size:.88rem}.export-panel{gap:12px;margin-top:14px;display:grid}.export-panel h3,.result-side h3{margin:0}.hint{color:var(--muted);margin:0;font-size:.78rem}.error-banner{color:#ffb4b4;background:#ff6b6b1a;border:1px solid #ff6b6b59;border-radius:12px;margin-top:14px;padding:12px 14px}.empty-state{text-align:center;margin-top:22px;padding:48px 24px}.empty-state h2{margin:0 0 8px}.empty-state p{color:var(--muted);margin:0 0 18px}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=980px){.app-shell{grid-template-columns:1fr}.sidebar{flex-flow:wrap;align-items:center;height:auto;position:relative}.nav{flex-flow:wrap}.sidebar-footer{display:none}.video-info,.feature-grid,.result-view{grid-template-columns:1fr}.main{padding:18px 16px 40px}}