:root{--primary: #6366f1;--primary-glow: rgba(99, 102, 241, .4);--primary-dim: rgba(99, 102, 241, .15);--bg: #0a0e18;--bg-gradient: linear-gradient(135deg, #0a0e18 0%, #0f1424 50%, #0a0e18 100%);--card: rgba(22, 27, 44, .85);--card-border: rgba(99, 102, 241, .15);--text: #f8fafc;--text-dim: #94a3b8;--text-muted: #64748b;--border: rgba(45, 54, 77, .8);--success: #10b981;--success-dim: rgba(16, 185, 129, .2);--danger: #ef4444;--warning: #f59e0b;--coffee: #FFDD00;--safe: #22c55e;--safe-dim: rgba(34, 197, 94, .15);--radius: 16px;--radius-lg: 24px;--shadow: 0 25px 50px -12px rgba(0, 0, 0, .5);--shadow-glow: 0 0 40px rgba(99, 102, 241, .15);--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--ease-out-back: cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box}html{scroll-behavior:smooth}@view-transition{navigation:auto}::view-transition-old(root){animation:.25s ease-out both page-out}::view-transition-new(root){animation:.3s ease-out .05s both page-in}@keyframes page-out{to{opacity:0}}@keyframes page-in{0%{opacity:0}to{opacity:1}}html.view-transition-reveal .container,html.view-transition-reveal .sidebar,html.view-transition-reveal .tool-card,html.view-transition-reveal .hero-badge,html.view-transition-reveal .btn-coffee-fixed{animation:none!important;opacity:1!important;transform:none!important}body.page-leaving .main-content,body.page-leaving .sidebar{opacity:0;transition:opacity .25s ease-out}body.page-leaving .btn-coffee-fixed{opacity:0;transition:opacity .2s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInRight{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.85}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes glow-pulse{0%,to{box-shadow:0 0 20px #6366f133}50%{box-shadow:0 0 35px #6366f159}}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-gradient);background-attachment:fixed;color:var(--text);margin:0;min-height:100vh;display:flex;overflow-x:hidden;position:relative}body:before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(99,102,241,.08),transparent),radial-gradient(ellipse 60% 40% at 100% 50%,rgba(16,185,129,.04),transparent);pointer-events:none;z-index:0;animation:fadeIn 1.2s var(--ease-out-expo) both}#root{display:flex;flex:1;min-height:0;width:100%}.app-layout{display:flex;flex:1;min-width:0;width:100%}#uiBlocker{display:none}body.processing .sidebar,body.processing .upload-section,body.processing .action-btn,body.processing .btn-coffee-fixed,body.processing .container input[type=file],body.processing .container select,body.processing .container button{pointer-events:none;cursor:not-allowed}body.processing .sidebar{opacity:.85}body.processing .upload-section{opacity:.8}.sidebar{width:280px;min-width:280px;background:#0f1322f2;padding:28px 20px;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:4px;overflow-y:auto;position:relative;z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:slideInRight .5s var(--ease-out-expo) both}.sidebar h2{font-size:22px;font-weight:800;margin:0 0 20px;background:linear-gradient(135deg,#a5b4fc,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sidebar h2 a{-webkit-text-fill-color:inherit}.nav-categories{display:flex;flex-direction:column;gap:0}.nav-category-block{border-bottom:1px solid rgba(255,255,255,.06)}.nav-category-block:last-of-type{border-bottom:none}.nav-category-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 14px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted);background:#0003;border:none;cursor:pointer;font-family:inherit;text-align:left;transition:all .25s var(--ease-out-expo)}.nav-category-header:hover{color:var(--text-dim);background:#6366f114}.nav-category-chevron{font-size:9px;opacity:.7}.nav-category-links{display:flex;flex-direction:column;gap:2px;padding:6px 8px 10px}.nav-link{background:transparent;color:var(--text-dim);padding:10px 14px;text-align:left;font-size:13px;font-weight:600;border-radius:10px;cursor:pointer;transition:all .35s var(--ease-out-expo);font-family:inherit;text-decoration:none;display:block;width:100%;border:1px solid transparent}.nav-link:hover{background:var(--primary-dim);color:#fff;border-color:#6366f133;transform:translate(4px)}.nav-link.active{background:linear-gradient(135deg,#6366f140,#6366f126);color:#fff;border-color:#6366f166;box-shadow:0 4px 20px var(--primary-glow)}.sidebar-bottom{margin-top:auto;padding-top:24px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:16px;flex-shrink:0}.btn-coffee{background:linear-gradient(135deg,#fd0,#f5d000);color:#000;font-weight:800;padding:14px;border-radius:12px;text-align:center;text-decoration:none;font-size:14px;transition:all .35s var(--ease-out-expo);box-shadow:0 4px 15px #ffdd004d;display:block;width:100%;box-sizing:border-box}.btn-coffee:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 25px #ffdd0073}.btn-coffee-fixed{position:fixed;bottom:20px;right:20px;width:auto;min-width:140px;padding:12px 20px;z-index:1000;animation:fadeIn .6s var(--ease-out-expo) .3s both,float 4s ease-in-out 1.5s infinite}.lang-select{width:100%;max-width:120px;padding:8px 12px;font-size:12px;font-weight:600;border-radius:8px;border:1px solid var(--border);background:#0f1322e6;color:var(--text);cursor:pointer;margin-bottom:12px;transition:all .3s var(--ease-out-expo)}.lang-select:hover{border-color:var(--primary)}.lang-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-dim)}.trust-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.trust-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--success);background:var(--success-dim);padding:6px 10px;border-radius:8px;font-weight:600;transition:all .3s var(--ease-out-expo)}.trust-badge:hover{transform:scale(1.05);box-shadow:0 2px 12px #22c55e33}.main-content{flex:1;padding:40px;overflow-y:auto;display:flex;flex-direction:column;align-items:center;position:relative;z-index:1}.container{width:100%;max-width:780px;background:var(--card);border-radius:var(--radius-lg);padding:44px;box-shadow:var(--shadow),var(--shadow-glow);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);animation:fadeInUp .6s var(--ease-out-expo) .1s both}.submux-video-zone{background:linear-gradient(135deg,#6366f114,#6366f105);border:2px dashed rgba(99,102,241,.35);border-radius:var(--radius);padding:32px;text-align:center;transition:all .35s var(--ease-out-expo);cursor:pointer}.submux-video-zone:hover{border-color:var(--primary);background:var(--primary-dim);box-shadow:0 0 0 1px #6366f140}.submux-video-zone .submux-video-icon{font-size:36px;margin-bottom:8px;opacity:.9}.submux-video-zone .submux-video-label{font-weight:700;color:var(--primary);font-size:15px}.submux-video-zone .submux-video-hint{font-size:12px;color:var(--text-dim);margin-top:6px}.submux-tracks-header{display:flex;align-items:center;justify-content:space-between;margin:28px 0 16px;padding-bottom:12px;border-bottom:1px solid var(--border)}.submux-tracks-title{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted)}.submux-add-track{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;font-size:13px;font-weight:700;background:var(--primary-dim);border:1px solid rgba(99,102,241,.4);border-radius:10px;color:var(--primary);cursor:pointer;transition:all .3s var(--ease-out-expo)}.submux-add-track:hover{background:#6366f140;border-color:var(--primary);transform:translateY(-2px)}.submux-track-card{display:flex;gap:16px;align-items:stretch;margin-bottom:14px;padding:0;background:#1c233680;border-radius:14px;border:1px solid var(--border);overflow:hidden;transition:all .3s var(--ease-out-expo)}.submux-track-card:hover{border-color:#6366f14d;box-shadow:0 4px 20px #0003}.submux-track-num{width:44px;min-width:44px;display:flex;align-items:center;justify-content:center;background:#6366f126;font-weight:800;font-size:16px;color:var(--primary)}.submux-track-body{flex:1;display:flex;gap:16px;align-items:center;padding:16px}.submux-track-file{flex:1;min-width:0;padding:16px;background:#0003;border:2px dashed var(--border);border-radius:10px;cursor:pointer;transition:all .25s var(--ease-out-expo)}.submux-track-file:hover{border-color:var(--primary);background:var(--primary-dim)}.submux-track-file .file-label{font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.submux-track-file .file-name{font-size:14px;font-weight:600;color:var(--text);margin-top:6px}.submux-track-file .file-name.empty{color:var(--text-dim);font-weight:500}.submux-track-lang{min-width:150px}.submux-track-lang label{display:block;font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}.submux-track-lang select{width:100%;padding:10px 12px;border-radius:10px;background:#0f1322e6;border:1px solid var(--border);color:var(--text);font-size:13px;font-weight:600}.submux-track-remove{width:44px;min-width:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-left:1px solid var(--border);color:var(--text-muted);cursor:pointer;transition:all .25s var(--ease-out-expo)}.submux-track-remove:hover:not(:disabled){background:#ef444426;color:var(--danger)}.submux-track-remove:disabled{cursor:not-allowed;opacity:.4}.submux-formats-hint{font-size:12px;color:var(--text-muted);margin-top:12px;padding:12px 16px;background:#00000026;border-radius:10px;border-left:3px solid var(--primary)}.coming-soon-card{background:#0000004d;border:2px dashed var(--border);border-radius:var(--radius);padding:36px;text-align:center}.coming-soon-badge{display:inline-block;font-size:14px;font-weight:800;color:var(--warning);margin-bottom:12px}.coming-soon-text{color:var(--text-dim);font-size:14px;line-height:1.6;margin:0}.status-box{margin-top:30px;background:#00000080;border-radius:var(--radius);padding:28px;display:none;border:1px solid rgba(99,102,241,.3);box-shadow:0 0 30px #6366f126}body.processing .status-box{animation:pulse-soft 2s ease-in-out infinite}h1{margin:0 0 8px;font-size:28px;font-weight:800;letter-spacing:-.02em}.subtitle{color:var(--text-dim);font-size:15px;margin-bottom:28px;line-height:1.6}.upload-section{background:#ffffff05;border:2px dashed var(--border);border-radius:var(--radius);padding:28px;text-align:center;margin-bottom:16px;transition:all .4s var(--ease-out-expo);cursor:pointer}.upload-section:hover{border-color:var(--primary);background:var(--primary-dim);box-shadow:0 0 0 1px #6366f133;transform:scale(1.01)}.sub-row,.input-row{display:flex;gap:14px;background:#1c233699;padding:18px;border-radius:12px;margin-bottom:14px;align-items:center;border:1px solid var(--border);transition:all .3s var(--ease-out-expo)}.sub-row:hover,.input-row:hover{border-color:#6366f140}select,input[type=text],input[type=number]{background:#0b0f1acc;color:#fff;border:1px solid var(--border);padding:12px 16px;border-radius:10px;font-family:inherit;font-size:14px;transition:all .3s var(--ease-out-expo)}select:focus,input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-dim)}.btn{font-family:inherit;font-weight:600;cursor:pointer;transition:all .35s var(--ease-out-expo);border-radius:12px;border:none}.btn-primary{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;padding:12px 24px;box-shadow:0 4px 15px var(--primary-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px var(--primary-glow)}.btn-secondary{background:#2d364dcc;color:#fff;padding:10px 18px;font-size:13px;border:1px solid var(--border)}.btn-secondary:hover{background:#37415ae6;transform:translateY(-1px)}.btn-main{width:100%;padding:18px;font-size:16px;margin-top:12px;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;box-shadow:0 4px 20px var(--primary-glow);text-transform:uppercase;font-weight:800;letter-spacing:.05em}.btn-main:hover{transform:translateY(-3px);box-shadow:0 12px 35px var(--primary-glow)}.btn-main:active{transform:translateY(-1px)}.btn:disabled{background:#2d364d99!important;color:#666!important;cursor:not-allowed;box-shadow:none;transform:none!important}.log-area{font-family:Fira Code,monospace;font-size:11px;color:var(--success);max-height:150px;overflow-y:auto;margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.06)}.download-card{background:linear-gradient(135deg,#059669,#10b981,#059669);padding:36px;border-radius:var(--radius);margin-top:28px;text-align:center;box-shadow:0 20px 40px #10b9814d;border:1px solid rgba(255,255,255,.2);animation:fadeInUp .5s var(--ease-out-back) both}.btn-dl{background:#fff;color:#065f46;padding:16px 36px;font-size:16px;font-weight:800;border-radius:12px;cursor:pointer;border:none;display:inline-block;text-decoration:none;margin-bottom:18px;transition:all .35s var(--ease-out-expo);box-shadow:0 4px 15px #0003}.btn-dl:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 30px #00000059}.ad-banner{background:#ffffff05;border:1px dashed var(--border);margin-top:24px;min-height:90px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:11px;border-radius:12px}.seo-text{margin-top:36px;max-width:780px}.seo-text h2{font-size:18px;color:var(--text);font-weight:700}.seo-text p{color:var(--text-dim);font-size:15px;line-height:1.7}.home-container{max-width:900px}.tool-sections{margin-top:32px}.tool-section{margin-bottom:40px}.tool-section:last-child{margin-bottom:0}.tool-section-title{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted);margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px}.tool-section-title:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--border),transparent)}.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}.tool-section .tool-grid{margin-top:0}.tool-card{background:#1c233699;border:1px solid var(--border);border-radius:14px;padding:20px;text-decoration:none;color:var(--text);transition:all .4s var(--ease-out-expo);display:block;position:relative;overflow:hidden;animation:fadeInUp .5s var(--ease-out-expo) both}.tool-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary),transparent);opacity:0;transition:opacity .25s}.tool-card:hover{border-color:#6366f180;background:var(--primary-dim);transform:translateY(-6px) scale(1.02);box-shadow:0 16px 40px #00000059,0 0 30px #6366f126}.tool-card:hover:before{opacity:1}.tool-card h3{margin:0 0 8px;font-size:16px;font-weight:700}.tool-card p{margin:0;font-size:12px;color:var(--text-dim);line-height:1.5}.hero-badge{display:inline-flex;align-items:center;gap:8px;background:var(--safe-dim);color:var(--safe);padding:10px 18px;border-radius:12px;font-size:14px;font-weight:700;margin-bottom:24px;border:1px solid rgba(34,197,94,.3);animation:fadeInUp .5s var(--ease-out-expo) .05s both}.hero-badge span{font-size:18px}input[type=range]{-webkit-appearance:none;height:8px;background:#6366f133;border-radius:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:var(--primary);border-radius:50%;cursor:pointer;box-shadow:0 2px 10px var(--primary-glow);transition:transform .2s var(--ease-out-expo)}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}