:root{--bg:#f6f9fd;--card:#fff;--ink:#0c1730;--muted:#6e7f9e;--line:#dce5f2;--primary:#5b5df6;--nav:#0e162b;--green:#12b76a;--amber:#f59e0b;--danger:#e5484d;--shadow:0 8px 30px rgba(35,55,90,.08)}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}a{text-decoration:none;color:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:20}.brand{height:70px;display:flex;align-items:center;gap:10px;padding:0 18px;border-bottom:1px solid var(--line)}.brand-mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;display:grid;place-items:center;font-size:26px;font-weight:900}.brand strong{display:block;font-size:18px}.brand span{font-size:11px;color:var(--muted)}nav{padding:14px 10px;overflow:auto;flex:1}.nav-section{font-size:11px;color:#94a3b8;font-weight:800;padding:14px 12px 6px}.nav-item{display:flex;align-items:center;gap:10px;min-height:38px;padding:8px 12px;border-radius:10px;color:#536681;font-size:13px;margin:2px 0}.nav-item span{width:18px;text-align:center}.nav-item:hover{background:#f3f6fb;color:#111827}.nav-item.active{background:#0a0a0b;color:#fff;box-shadow:0 6px 14px rgba(0,0,0,.12)}.mini-badge{margin-left:auto;font-size:10px;padding:2px 6px;border-radius:999px;background:#fff1c8;color:#8a5900}.sidebar-user{display:flex;align-items:center;gap:10px;margin:10px;padding:12px;border:1px solid var(--line);border-radius:14px}.sidebar-user>div:nth-child(2){min-width:0;flex:1}.sidebar-user strong,.sidebar-user small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user small{font-size:11px;color:var(--muted)}.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#6d5dfc,#8d52ff);color:#fff;display:grid;place-items:center}.avatar.small{width:32px;height:32px}.main{margin-left:250px;min-width:0}.topbar{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px;position:sticky;top:0;z-index:10}.search{width:min(600px,60vw);display:flex;align-items:center;gap:8px;background:#f6f8fb;border:1px solid var(--line);border-radius:12px;padding:10px 13px}.search input{border:0;background:transparent;outline:0;width:100%;color:var(--ink)}.top-actions{display:flex;align-items:center;gap:10px}.pill,.tag{font-size:11px;padding:5px 10px;border-radius:999px;background:#eef2ff;color:#4245d8;font-weight:800}.content{padding:22px;max-width:1600px;margin:auto}.hero{background:linear-gradient(100deg,#f0e9ff,#e5f3ff);border:1px solid #dde6fb;border-radius:18px;padding:26px;display:flex;justify-content:space-between;align-items:center;overflow:hidden;box-shadow:var(--shadow)}.hero h1{margin:0 0 8px;font-size:28px}.hero p{margin:0;color:var(--muted)}.hero .cta{background:#111a33;color:#fff;border:0;border-radius:12px;padding:14px 18px;font-weight:800}.metric-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:14px}.metric{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.metric .value{font-size:25px;font-weight:800}.metric .label{font-size:12px;color:var(--muted);margin-top:4px}.section-title{display:flex;justify-content:space-between;align-items:end;margin:26px 0 12px}.section-title h2{margin:0;font-size:20px}.section-title p{margin:4px 0 0;color:var(--muted);font-size:13px}.tools-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.tool-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;text-align:center;box-shadow:var(--shadow)}.tool-icon{width:48px;height:48px;margin:0 auto 12px;border-radius:13px;background:linear-gradient(135deg,#4f7cff,#7255ed);color:#fff;display:grid;place-items:center;font-size:23px}.tool-card h3{font-size:14px;margin:0 0 5px}.tool-card p{font-size:12px;color:var(--muted);min-height:34px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:11px;padding:10px 14px;font-weight:700;cursor:pointer}.btn.primary{background:#10182e;color:#fff;border-color:#10182e}.btn.purple{background:#5b36f4;color:#fff;border-color:#5b36f4}.btn.green{background:#079455;color:#fff;border-color:#079455}.btn.danger{background:#fff3f3;color:#b42318;border-color:#ffd2d2}.charts{display:grid;grid-template-columns:1.5fr 1fr .9fr;gap:14px;margin-top:14px}.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.card h3{margin:0 0 12px}.fake-chart{height:190px;display:flex;align-items:end;gap:10px;border-bottom:1px solid var(--line);padding:12px}.fake-chart i{flex:1;background:linear-gradient(#8a8cf8,#5b5df6);border-radius:7px 7px 0 0}.donut{width:160px;height:160px;border-radius:50%;background:conic-gradient(#4f7cff 0 38%,#7855e8 38% 60%,#16b364 60% 76%,#f59e0b 76% 90%,#dbe3ef 90%);margin:20px auto;position:relative}.donut:after{content:'128\A Tác vụ';white-space:pre;position:absolute;inset:31px;background:#fff;border-radius:50%;display:grid;place-items:center;text-align:center;font-weight:800}.checklist{padding:0;list-style:none}.checklist li{margin:10px 0;color:#475467}.checklist li:before{content:'✓';display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#dff8ec;color:#079455;margin-right:8px;font-size:11px;font-weight:900}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;font-size:13px}.table th,.table td{padding:11px 10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}.table th{color:#6e7f9e;font-size:12px}.status{padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800}.status.done{background:#e8f8ef;color:#087a47}.status.processing{background:#eef2ff;color:#4238ca}.alert{padding:12px 14px;border-radius:10px;margin-bottom:12px}.alert.success{background:#eaf8f1;color:#087a47}.alert.error{background:#fff1f1;color:#b42318}.tool-page{max-width:1050px;margin:0 auto}.tool-heading{text-align:center;margin:14px 0 22px}.tool-heading .big-icon{width:54px;height:54px;border-radius:15px;background:#0f172a;color:#fff;display:grid;place-items:center;margin:auto;font-size:25px}.tool-heading h1{font-size:28px;margin:10px 0 5px}.tool-heading p{color:var(--muted);margin:0}.upload-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow)}.dropzone{border:2px dashed #dbe5f3;border-radius:16px;min-height:165px;display:grid;place-items:center;text-align:center;padding:20px;cursor:pointer}.dropzone.drag{background:#eef3ff;border-color:#7c83ff}.dropzone input{display:none}.dropzone .upload-ico{font-size:32px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}.field{display:flex;flex-direction:column;gap:7px}.field label{font-size:12px;font-weight:800}.field input,.field select{width:100%;border:1px solid var(--line);border-radius:10px;padding:11px;background:#fff}.slider-row{background:#f9fbfe;border:1px solid var(--line);border-radius:14px;padding:14px}.slider-row input[type=range]{width:100%}.tool-actions{display:flex;justify-content:space-between;gap:10px;margin-top:18px}.result-card{margin-top:16px;background:#ebfbf3;border:1px solid #9ee8c4;border-radius:14px;padding:16px}.wave{height:120px;background:#111a2e;border-radius:14px;display:flex;align-items:center;gap:3px;padding:18px;margin-top:16px}.wave span{flex:1;max-width:5px;background:#f4b000;border-radius:3px}.login-shell{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#eef4ff,#f7f1ff)}.auth-card{width:min(440px,92vw);background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:var(--shadow)}.auth-card h1{margin-top:0}.auth-card .field{margin:12px 0}.auth-card .btn{width:100%}.muted{color:var(--muted);font-size:13px}.mobile-only{display:none}.icon-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 11px}.admin-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media(max-width:1200px){.metric-grid{grid-template-columns:repeat(3,1fr)}.tools-grid{grid-template-columns:repeat(3,1fr)}.charts{grid-template-columns:1fr}.admin-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.sidebar{transform:translateX(-102%);transition:.2s}.sidebar.open{transform:translateX(0)}.main{margin-left:0}.mobile-only{display:block}.search{width:65vw}.content{padding:14px}.metric-grid{grid-template-columns:repeat(2,1fr)}.tools-grid{grid-template-columns:repeat(2,1fr)}.hero{align-items:flex-start;gap:14px;flex-direction:column}.form-grid{grid-template-columns:1fr}.tool-actions{flex-direction:column}.tool-actions .btn{width:100%}}
@media(max-width:520px){.metric-grid,.tools-grid,.admin-grid{grid-template-columns:1fr}.top-actions .pill{display:none}.search{width:58vw}.tool-heading h1{font-size:22px}}

/* ===== VoicePro V1.4: sidebar rõ hơn + mobile drawer + preview/video ===== */
.sidebar{width:270px;z-index:60}.main{margin-left:270px}.brand-copy{min-width:0;flex:1}.nav-item{font-size:14px;font-weight:600;color:#34445f;letter-spacing:.01px;min-height:42px;padding:9px 12px}.nav-item span{font-size:15px;color:#49617e}.nav-item:hover{color:#101828}.nav-item.active{font-weight:750}.nav-item.active span{color:#ffc400}.nav-section{font-size:11px;color:#7f90aa;letter-spacing:.04em}.sidebar-user strong{font-size:13px}.sidebar-user small{font-size:11.5px}
.sidebar-close{margin-left:auto;width:36px;height:36px;border:1px solid var(--line);background:#fff;border-radius:10px;font-size:25px;line-height:1;cursor:pointer}.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,.48);z-index:55}.menu-toggle{font-size:18px;min-width:40px;position:relative;z-index:45}
.row-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.inline-form{display:inline-flex;margin:0}.btn-sm{padding:7px 10px;border-radius:9px;font-size:12px}.btn.preview{background:#eef5ff;border-color:#cfe0ff;color:#164aa5}.status.failed{background:#fff0f0;color:#b42318}.section-title.compact{margin:0 0 14px;align-items:center}.section-title.compact h2{font-size:18px}
.media-preview{display:block;width:100%;max-height:620px;background:#0b1220;border-radius:14px}.audio-preview{display:block;width:100%;margin:20px 0 8px}.preview-card{overflow:hidden}.clip-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.clip-card{border:1px solid var(--line);border-radius:14px;padding:12px;background:#f9fbfe}.clip-card video{display:block;width:100%;aspect-ratio:9/16;max-height:540px;background:#0b1220;border-radius:12px;object-fit:contain}.clip-title{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px}.clip-title span{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70%}

@media(max-width:800px){
  .sidebar{width:min(86vw,320px);transform:translateX(-105%);box-shadow:8px 0 30px rgba(15,23,42,.18);transition:transform .22s ease}.sidebar.open{transform:translateX(0)}
  .sidebar-overlay.show{display:block}.main{margin-left:0}.topbar{padding:0 12px;gap:10px}.search{width:auto;flex:1;min-width:0}.search input{font-size:13px}.top-actions{flex:0 0 auto}.content{padding:12px}.brand{height:64px}.sidebar-close{display:block!important}.nav-item{font-size:15px;min-height:44px}.nav-section{font-size:11.5px}.table th,.table td{padding:10px 8px}.clip-grid{grid-template-columns:1fr}.row-actions{gap:5px}body.nav-open{overflow:hidden}
}
@media(max-width:520px){.topbar{height:62px}.search{padding:9px 10px}.top-actions .avatar{display:none}.tool-page{width:100%}.upload-card{padding:14px}.tool-heading{margin-top:8px}.clip-card{padding:10px}}

/* ===== VoicePro V1.5: upload chắc chắn hoạt động + so sánh A/B ===== */
.dropzone{cursor:default;gap:8px}.file-picker{display:block!important;width:min(620px,100%);margin:10px auto 0;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#f8fbff;color:#263852;font:inherit}.file-picker::file-selector-button{border:0;background:#10182e;color:#fff;font-weight:800;border-radius:9px;padding:10px 14px;margin-right:12px;cursor:pointer}.selected-files{width:min(680px,100%);margin-top:8px;display:grid;gap:6px}.selected-files>span{font-size:12px;color:var(--muted)}.selected-file{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;background:#fff;border:1px solid var(--line);border-radius:10px;text-align:left;font-size:12px}.selected-file b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:80%}.selected-file span{color:var(--muted);white-space:nowrap}.upload-hint{font-size:11.5px;color:#60708c;margin-top:4px}.upload-hint a{color:#3e4dde;font-weight:800;text-decoration:underline}.upload-warn{color:#b54708!important;font-weight:700}.dropzone.drag{background:#eef4ff;box-shadow:inset 0 0 0 2px rgba(91,93,246,.12)}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.compare-pane{border:1px solid var(--line);border-radius:15px;padding:16px;background:#f9fbfe}.compare-pane.original{background:#fffaf0;border-color:#f5d99e}.compare-pane.normalized{background:#effcf5;border-color:#abe5c7}.compare-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px}.compare-head h3{margin:0;font-size:16px}.compare-badge{font-size:11px;font-weight:800;padding:5px 8px;border-radius:999px;background:#fff;border:1px solid var(--line)}.compare-pane audio{width:100%;margin:8px 0 4px}.metrics-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:12px}.metrics-table td{padding:7px 4px;border-bottom:1px dashed #dbe4ef}.metrics-table td:last-child{text-align:right;font-weight:800}.ab-controls{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.ab-controls .btn.active{background:#10182e;color:#fff;border-color:#10182e}.compare-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}.compare-stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px}.compare-stat small{display:block;color:var(--muted);font-size:11px}.compare-stat strong{display:block;font-size:18px;margin-top:4px}.upload-diagnostic{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;margin-top:16px}.ok-text{color:#087a47;font-weight:800}.fail-text{color:#b42318;font-weight:800}
@media(max-width:800px){.compare-grid{grid-template-columns:1fr}.compare-summary{grid-template-columns:1fr}.selected-file{align-items:flex-start;flex-direction:column}.selected-file b{max-width:100%}.file-picker{font-size:13px}}

/* ===== VoicePro V1.6: Wood + Amber Theme & User Administration ===== */
:root{
  --bg:#fbf6ef;
  --card:#fffdf9;
  --ink:#352315;
  --muted:#836b58;
  --line:#eadac7;
  --primary:#6a4026;
  --nav:#3a2416;
  --wood-950:#2b1a10;
  --wood-900:#3a2416;
  --wood-800:#4a2c1a;
  --wood-700:#6a4026;
  --wood-600:#805234;
  --wood-100:#f4e8db;
  --cream:#fff8ee;
  --amber:#f59e0b;
  --amber-2:#ffb020;
  --orange:#e9780f;
  --green:#188c5a;
  --danger:#bd3e2f;
  --shadow:0 10px 30px rgba(79,48,26,.09)
}
html,body{background:var(--bg);color:var(--ink)}
body{background-image:radial-gradient(circle at 84% 8%,rgba(245,158,11,.075),transparent 28%),radial-gradient(circle at 22% 95%,rgba(106,64,38,.055),transparent 30%)}
.sidebar{background:linear-gradient(180deg,var(--wood-950) 0%,var(--wood-900) 50%,#432718 100%);border-right:1px solid rgba(255,184,75,.20);box-shadow:6px 0 24px rgba(59,35,20,.08)}
.brand{border-bottom:1px solid rgba(255,255,255,.10)}
.brand-mark{background:linear-gradient(145deg,var(--amber-2),var(--orange));color:#3b230f;box-shadow:0 7px 20px rgba(245,158,11,.30)}
.brand strong{color:#fff9f1;letter-spacing:.01em}.brand span{color:#d7bda5}
.nav-section{color:#d0a986;font-weight:900;letter-spacing:.075em}
.nav-item{color:#f2e4d6;font-weight:700}
.nav-item span{color:#efc48b}.nav-item:hover{background:rgba(255,255,255,.085);color:#fff}
.nav-item.active{background:linear-gradient(100deg,#f59e0b,#f08b12);color:#35200f;box-shadow:0 8px 20px rgba(245,158,11,.24);font-weight:900}
.nav-item.active span{color:#4a2c1a}.mini-badge{background:#fff3cc;color:#744006;border:1px solid rgba(245,158,11,.32)}
.sidebar-user{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.055);color:#fff7ed}.sidebar-user small{color:#d6bca4}.sidebar-user>a{color:#ffc56a;font-size:18px}
.avatar{background:linear-gradient(135deg,#f59e0b,#d66a08);color:#3a2416;font-weight:900;box-shadow:0 4px 12px rgba(245,158,11,.20)}
.topbar{background:rgba(255,253,249,.96);border-bottom-color:#eadac7;backdrop-filter:blur(8px)}
.search{background:#fffaf3;border-color:#e8d6c1}.search input{color:var(--ink)}
.pill,.tag{background:#fff1d2;color:#8a4b05;border:1px solid #ffd58b}
.role-top{font-size:10px;font-weight:900;letter-spacing:.045em;color:#6a4026;background:#f4e8db;border:1px solid #e5cfb7;padding:5px 9px;border-radius:999px}
.hero{background:linear-gradient(115deg,#fff4df 0%,#f6e4cf 46%,#ffe8b0 100%);border-color:#e8cfad;position:relative}.hero:after{content:'';position:absolute;right:-70px;bottom:-110px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(116,70,36,.18),transparent 67%)}.hero .cta{background:linear-gradient(135deg,var(--wood-900),var(--wood-700));box-shadow:0 8px 18px rgba(74,44,26,.2)}
.metric,.card,.tool-card,.upload-card{background:var(--card);border-color:var(--line);box-shadow:var(--shadow)}
.metric .value,.section-title h2,.tool-heading h1{color:#3a2416}.tool-icon{background:linear-gradient(145deg,#8b5835,#f59e0b);color:#fff8ed}.tool-heading .big-icon{background:linear-gradient(145deg,var(--wood-900),var(--wood-700));color:#ffc365;box-shadow:0 9px 20px rgba(74,44,26,.18)}
.btn{border-color:#e4d0b9;background:#fffdf9;color:#56351f;transition:.16s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 5px 13px rgba(83,49,26,.09)}
.btn.primary{background:linear-gradient(135deg,var(--wood-900),var(--wood-700));border-color:var(--wood-900);color:#fffaf3}.btn.purple,.btn.amber{background:linear-gradient(135deg,#f59e0b,#e9780f);border-color:#e9780f;color:#3b220e}.btn.green{background:#188c5a;border-color:#188c5a}.btn.danger{background:#fff2ef;color:#a53427;border-color:#efc2b9}
.file-picker{background:#fffaf3;color:#543723;border-color:#e6d2bb}.file-picker::file-selector-button{background:linear-gradient(135deg,var(--wood-900),var(--wood-700));color:#fffaf2}.dropzone{border-color:#e5c9a8;background:#fffdf9}.dropzone.drag{background:#fff3d8;border-color:#f59e0b;box-shadow:inset 0 0 0 2px rgba(245,158,11,.16)}
.wave{background:#2f2119}.wave span{background:#f7a80c}.slider-row,.clip-card,.compare-pane{background:#fffaf4}.selected-file{background:#fffdf9}.upload-hint a{color:#a95808}
.table th{color:#7a604d}.table tr:hover td{background:#fffaf4}.status.done{background:#e9f7ef;color:#176d49}.status.processing{background:#fff3d9;color:#985500}.status.failed{background:#fff0ed;color:#a93b2e}
.fake-chart i{background:linear-gradient(#f8bd4c,#d9790a)}.donut{background:conic-gradient(#7d4e31 0 38%,#f59e0b 38% 60%,#c4772e 60% 76%,#eab15d 76% 90%,#eadcca 90%)}.donut:after{background:#fffdf9}
.compare-pane.original{background:#fff8ea;border-color:#edcf98}.compare-pane.normalized{background:#eef9f3;border-color:#afe0c8}.ab-controls .btn.active{background:var(--wood-900);border-color:var(--wood-900)}
.pagination{display:flex;gap:6px;justify-content:flex-end;margin:14px 0}.pagination a{min-width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:#fffdf9;color:#6a4026;font-weight:800}.pagination a.active{background:#f59e0b;color:#3b230f;border-color:#e78a0b}
.hidden{display:none!important}

/* Auth */
.auth-body,.login-shell{background:linear-gradient(135deg,#3b2416 0%,#5d3821 46%,#7b4a28 100%);position:relative;overflow:auto}
.auth-body:before,.login-shell:before{content:'';position:fixed;inset:0;background:radial-gradient(circle at 15% 15%,rgba(255,185,70,.22),transparent 28%),radial-gradient(circle at 82% 84%,rgba(255,166,20,.16),transparent 30%),repeating-linear-gradient(12deg,rgba(255,255,255,.016) 0 1px,transparent 1px 9px);pointer-events:none}
.auth-card{position:relative;width:min(470px,92vw);background:rgba(255,252,246,.985);border:1px solid #e1c5a4;border-radius:22px;padding:32px;box-shadow:0 24px 70px rgba(24,12,5,.33)}
.auth-card h1{font-size:30px;margin:8px 0 8px;color:#3a2416}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:20px}.auth-brand strong{display:block;color:#3a2416;font-size:20px}.auth-brand span{display:block;color:#8c705b;font-size:12px}.auth-kicker{display:inline-flex;background:#fff0ca;border:1px solid #ffd482;color:#8f5002;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.07em}.auth-card .field input{background:#fffdf8;border-color:#dfc9b0;min-height:46px}.auth-card .field input:focus{outline:2px solid rgba(245,158,11,.20);border-color:#f0a224}.auth-submit{width:100%;min-height:48px;margin-top:8px}.auth-switch{text-align:center;margin:18px 0 0;color:#7b624f;font-size:13px}.auth-switch a{color:#a85708}

/* User management */
.user-filter{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:12px;align-items:end;margin-bottom:14px}.filter-submit .btn{min-width:90px}
.admin-user-create{margin-bottom:14px;border-top:4px solid #f59e0b}.user-create-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.user-create-submit{justify-content:flex-end}
.user-table-card{padding:0}.user-table th{background:#fff8ef}.user-cell{display:flex;align-items:center;gap:10px}.user-cell .avatar{width:34px;height:34px;flex:0 0 auto}.user-cell small{display:block;color:var(--muted);margin-top:2px}.role-badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:900}.role-badge.admin{background:#fff0c9;color:#875000;border:1px solid #ffd37e}.role-badge.user{background:#f2e9df;color:#65452f;border:1px solid #e3d2c2}.user-edit-row td{background:#fff9f1!important}.user-edit-grid{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:10px;align-items:end}.edit-submit{min-width:150px}.password-reset-form{margin-top:12px;padding-top:12px;border-top:1px dashed #dfc8ae;max-width:480px}.inline-password{display:flex;gap:8px}.inline-password input{flex:1}.empty-cell{text-align:center!important;color:var(--muted);padding:24px!important}

@media(max-width:1100px){.user-create-grid{grid-template-columns:repeat(2,1fr)}.user-edit-grid{grid-template-columns:repeat(3,1fr)}.user-filter{grid-template-columns:2fr 1fr 1fr}.filter-submit{grid-column:1/-1}}
@media(max-width:800px){.sidebar{background:linear-gradient(180deg,#2c1a10,#432719)}.role-top{display:none}.user-create-grid,.user-edit-grid,.user-filter{grid-template-columns:1fr}.filter-submit{grid-column:auto}.inline-password{flex-direction:column}.auth-card{padding:24px}.auth-card h1{font-size:26px}}

/* ===== VoicePro V1.7 – Readable Sans + Smart Workflow ===== */
html,body,button,input,select,textarea{font-family:"Segoe UI",Inter,Roboto,Arial,sans-serif!important}
body{font-size:15px;line-height:1.55;letter-spacing:0}.nav-item{font-size:14px;font-weight:650;line-height:1.35}.nav-section{font-size:11px;letter-spacing:.055em}.field label,.table th{font-size:12.5px}.field input,.field select{font-size:14px}.muted{line-height:1.55}.tool-card h3,.card h3{line-height:1.35}.tool-heading p{font-size:14px}.topbar .search input{font-size:14px}
.workflow-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:16px}.workflow-card{cursor:pointer;position:relative;min-height:150px;transition:.18s ease}.workflow-card input{position:absolute;opacity:0}.workflow-card:has(input:checked){border-color:#e89a18;box-shadow:0 0 0 2px rgba(245,158,11,.18),var(--shadow);background:#fff9ed}.workflow-check{position:absolute;right:14px;top:14px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#f1e5d8;color:#9b6c49;font-weight:900}.workflow-card:has(input:checked) .workflow-check{background:#f59e0b;color:#3b230f}.workflow-card h3{padding-right:28px;margin-top:4px}.workflow-card p{color:var(--muted);font-size:13px}
.project-form{display:grid;grid-template-columns:1.1fr 2fr auto;gap:12px;align-items:end}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}.project-card{position:relative}.project-icon{width:42px;height:42px;border-radius:12px;background:#fff0ce;color:#8d4f09;display:grid;place-items:center;font-size:22px;font-weight:900}.project-card h3{margin:12px 0 5px}.project-card p{color:var(--muted);min-height:42px}.project-meta{display:flex;justify-content:space-between;gap:8px;color:#8b725f;font-size:12px;padding:10px 0;border-top:1px dashed #e6d3bf}
.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.plan-card{border-top:4px solid #f59e0b}.plan-name{display:inline-flex;padding:6px 10px;border-radius:999px;background:#fff0ca;color:#7f4604;font-weight:900;margin-bottom:14px}.plan-card .field{margin-bottom:10px}
.compare-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.compare-stat{padding:14px;border-radius:12px;background:#fff8ec;border:1px solid #ead1ae}.compare-stat small,.compare-stat strong{display:block}.compare-stat strong{font-size:18px;margin-top:4px}.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.metrics-table{width:100%;border-collapse:collapse}.metrics-table td{padding:8px;border-bottom:1px solid #eadfce}.metrics-table td:last-child{text-align:right;font-weight:800}.ab-controls{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.compare-pane audio{width:100%;margin:10px 0}
@media(max-width:1200px){.workflow-grid{grid-template-columns:repeat(3,1fr)}.project-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){body{font-size:14px}.nav-item{font-size:14px;font-weight:700}.workflow-grid,.project-grid,.plan-grid,.compare-grid,.compare-summary{grid-template-columns:1fr}.project-form{grid-template-columns:1fr}.workflow-card{min-height:auto}.content{padding:14px}.tool-heading h1{font-size:23px}.section-title h2{font-size:19px}}

/* ===== VoicePro V1.8 – Detailed Tool Help ===== */
.tool-help{margin-top:20px;background:linear-gradient(180deg,#fffaf3,#fffdf9);border:1px solid #e7cfb4;border-radius:18px;padding:20px;box-shadow:var(--shadow)}
.tool-help-title{display:flex;gap:13px;align-items:flex-start}.tool-help-title>span{width:38px;height:38px;flex:0 0 38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#5b351f,#9b5a25);color:#ffc566;font-size:20px;font-weight:900}.tool-help-title h2{margin:0;color:#3a2416;font-size:20px}.tool-help-title p{margin:5px 0 0;color:#6f5848;line-height:1.65;font-size:14px}.tool-help-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}.help-card{background:#fff;border:1px solid #ead8c4;border-radius:14px;padding:16px}.help-card.tip{background:#fff7e8;border-color:#efd09d}.help-card h3{margin:0 0 10px;color:#51311d;font-size:15px}.help-card ol,.help-card ul{margin:0;padding-left:20px;color:#655044}.help-card li{margin:7px 0;line-height:1.55}.help-engine{margin:13px 0 0;padding-top:11px;border-top:1px dashed #e3cbb1;color:#816650;font-size:12px}.field small.muted{display:block;margin-top:2px;font-size:12px;line-height:1.45}
@media(max-width:800px){.tool-help{padding:15px}.tool-help-grid{grid-template-columns:1fr}.tool-help-title h2{font-size:18px}.tool-help-title p{font-size:13px}}


/* ===== VoicePro V1.9 – Video storyboard + background music + tutorials ===== */
.tutorial-top-link{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid #e5cba9;background:#fff8ed;border-radius:999px;color:#6a3c1e;font-size:12.5px;font-weight:800;white-space:nowrap}.tutorial-top-link span{color:#e68508}.tutorial-top-link:hover{background:#ffefcf;border-color:#efb862}
.video-join-generic-list{display:none!important}.video-order-panel{margin:16px 0;background:#fff9ef;border:1px solid #ead0ad;border-radius:16px;padding:16px}.video-order-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}.video-order-head h3{margin:0 0 4px;color:#4a2c18}.video-order-head p{margin:0;color:#79604e;font-size:13px;max-width:760px}.video-order-head>span{flex:0 0 auto;background:#f59e0b;color:#3c240f;border-radius:999px;padding:5px 10px;font-weight:900;font-size:12px}.video-sort-list{display:grid;gap:10px}.video-sort-empty{padding:22px;text-align:center;color:#8a725f;border:1px dashed #dfc19d;border-radius:12px;background:#fffdf9}.video-sort-card{display:grid;grid-template-columns:38px 190px minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px;border:1px solid #e5d0b7;border-radius:14px;background:#fff;cursor:grab;transition:.14s ease}.video-sort-card:active{cursor:grabbing}.video-sort-card.dragging{opacity:.55;transform:scale(.99)}.video-sort-card.drag-over{border-color:#e48b0b;box-shadow:0 0 0 2px rgba(245,158,11,.17);background:#fff8e9}.video-sort-number{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#4a2d1b;color:#ffd07d;font-weight:900}.video-sort-card video{width:190px;height:108px;object-fit:cover;border-radius:10px;background:#21150f}.video-sort-info{min-width:0}.video-sort-info b,.video-sort-info span,.video-sort-info small{display:block}.video-sort-info b{color:#3e291a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.video-sort-info span{color:#826a58;font-size:12px;margin-top:4px}.video-sort-info em{font-style:normal}.video-sort-info small{color:#a07b5d;margin-top:10px}.video-sort-actions{display:flex;gap:6px}.video-sort-actions button{width:34px;height:34px;border:1px solid #e1ccb3;border-radius:9px;background:#fffaf2;color:#54351f;font-weight:900;cursor:pointer}.video-sort-actions button:hover{background:#ffecc5}.video-sort-actions button.remove{color:#a33a2e;background:#fff2ee;border-color:#efc4ba}
.music-panel{border:1px solid #e7c899;background:linear-gradient(180deg,#fff9eb,#fffdf8);border-radius:14px;padding:15px}.music-toggle-row{display:flex;justify-content:space-between;align-items:center;gap:14px}.music-toggle-row p{margin:3px 0 0}.switch{position:relative;width:54px;height:30px;flex:0 0 54px}.switch input{opacity:0;width:0;height:0}.switch-slider{position:absolute;inset:0;border-radius:999px;background:#cfc4b9;cursor:pointer;transition:.2s}.switch-slider:before{content:'';position:absolute;width:22px;height:22px;left:4px;top:4px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.2);transition:.2s}.switch input:checked+.switch-slider{background:#e58a0a}.switch input:checked+.switch-slider:before{transform:translateX(24px)}.music-fields{display:grid;grid-template-columns:1fr 1.4fr;gap:14px;margin-top:14px;padding-top:14px;border-top:1px dashed #e3c9a5}.file-picker.compact{min-height:44px}
.tutorial-page-title{align-items:center}.tutorial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tutorial-card{padding:0;overflow:hidden}.tutorial-video{aspect-ratio:16/9;background:#22150e}.tutorial-video iframe{width:100%;height:100%;border:0;display:block}.tutorial-card-body{padding:16px}.tutorial-card-body h3{margin:8px 0;color:#412817;font-size:17px}.tutorial-card-body p{color:#725b49;font-size:13px;line-height:1.6}.tutorial-meta span{display:inline-flex;padding:4px 8px;border-radius:999px;background:#fff0c8;color:#8a4e06;font-size:11px;font-weight:900}.empty-tutorial{text-align:center;padding:50px}.empty-tutorial>div{font-size:42px;color:#e58a0a}.tutorial-admin-form{border-top:4px solid #f59e0b}.tutorial-form-grid{display:grid;grid-template-columns:2fr 2fr 1.4fr .7fr;gap:12px;align-items:end}.tutorial-desc{grid-column:1/4}.tutorial-submit{display:flex;justify-content:flex-end}.tutorial-admin-thumb{width:150px;aspect-ratio:16/9;object-fit:cover;border-radius:9px;border:1px solid #ead2b6}.tutorial-edit-details{margin-top:9px}.tutorial-edit-details summary{cursor:pointer;color:#a85a08;font-weight:800;font-size:12px}.tutorial-edit-form{display:grid;grid-template-columns:1.5fr 1.7fr 1.2fr .5fr .7fr;gap:7px;margin-top:8px}.tutorial-edit-form input,.tutorial-edit-form select,.tutorial-edit-form textarea{width:100%;border:1px solid #dfcbb3;border-radius:8px;padding:8px;background:#fffdf9}.tutorial-edit-form textarea{grid-column:1/5}
@media(max-width:1200px){.tutorial-grid{grid-template-columns:repeat(2,1fr)}.tutorial-form-grid{grid-template-columns:1fr 1fr}.tutorial-desc{grid-column:1/-1}.tutorial-submit{justify-content:flex-start}.tutorial-edit-form{grid-template-columns:1fr 1fr}.tutorial-edit-form textarea{grid-column:1/-1}.video-sort-card{grid-template-columns:34px 150px minmax(0,1fr) auto}.video-sort-card video{width:150px;height:86px}}
@media(max-width:800px){.tutorial-top-link b{display:none}.tutorial-top-link{padding:8px 10px}.tutorial-grid{grid-template-columns:1fr}.tutorial-form-grid{grid-template-columns:1fr}.tutorial-desc{grid-column:auto}.video-order-head{display:block}.video-order-head>span{display:inline-flex;margin-top:9px}.video-sort-card{grid-template-columns:32px minmax(0,1fr) auto;align-items:start}.video-sort-card video{grid-column:2/4;width:100%;height:auto;max-height:230px}.video-sort-info{grid-column:2/3}.video-sort-actions{grid-column:3/4}.music-fields{grid-template-columns:1fr}.tutorial-admin-thumb{width:110px}}

/* ===== VoicePro V1.9.1 – Ghép video upload/preview hotfix ===== */
.video-native-input,.music-native-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important}
.video-upload-cta,.music-upload-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:11px 18px;border-radius:12px;background:linear-gradient(135deg,#5b321b,#7a4525);color:#fff!important;font-weight:900;font-size:14px;letter-spacing:.15px;cursor:pointer;box-shadow:0 8px 18px rgba(91,50,27,.18);border:1px solid #6c3b20;transition:.16s ease}
.video-upload-cta:hover,.music-upload-cta:hover{transform:translateY(-1px);background:linear-gradient(135deg,#6c3b20,#925425);box-shadow:0 10px 22px rgba(91,50,27,.23)}
.video-upload-cta span,.music-upload-cta span{color:#ffc15a;font-size:18px;line-height:1}
.video-picked-text{margin-top:10px;color:#7a5b44;font-size:13px;line-height:1.5}.video-picked-text b{color:#4a2b18}
.video-order-panel{border-width:2px}.video-sort-list{min-height:84px}.video-sort-card{box-shadow:0 5px 14px rgba(74,44,24,.06)}
.video-sort-card video{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.music-panel{transition:.18s ease}.music-panel.enabled{border-color:#e99213;box-shadow:0 0 0 2px rgba(232,138,10,.08);background:linear-gradient(180deg,#fff6df,#fffdf8)}
.music-upload-box{display:flex;flex-direction:column;align-items:flex-start;gap:9px}.music-picked-text{font-size:13px;color:#765846;line-height:1.45;word-break:break-word}.music-picked-text b{color:#4a2c18}.music-preview{display:block;width:100%;max-width:520px;height:42px}.music-preview[hidden]{display:none}.btn.tiny{padding:7px 10px;font-size:12px;border-radius:9px}
@media(max-width:800px){.video-upload-cta,.music-upload-cta{width:100%}.video-sort-card{grid-template-columns:30px minmax(0,1fr) auto}.video-sort-card video{grid-column:1/-1;width:100%;max-height:260px}.video-sort-info{grid-column:1/3}.video-sort-actions{grid-column:3/4}.music-preview{max-width:none}}


/* ===== VoicePro V1.9.2 – Tách âm video + video tắt âm + thay nhạc ===== */
.extract-result-hints,.extract-result-summary{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}.extract-result-hints span,.extract-result-summary span{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border:1px solid #e8cda8;border-radius:999px;background:#fff8e9;color:#68401f;font-size:12px;font-weight:800}.extract-music-panel{background:linear-gradient(180deg,#fff8e8,#fffdf9)}.extract-music-panel.enabled{background:linear-gradient(180deg,#fff2cf,#fffaf0)}.mixed-result-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mixed-result-card{display:flex;flex-direction:column;min-height:250px}.mixed-result-card.video video{aspect-ratio:16/9;max-height:320px}.mixed-result-card.audio{justify-content:flex-start}.audio-result-icon{height:132px;border-radius:12px;background:linear-gradient(135deg,#38261c,#5b351f);display:grid;place-items:center;color:#ffad18;font-size:48px;margin-bottom:12px}.mixed-result-card .audio-preview{margin:0 0 12px}.mixed-result-card .row-actions{margin-top:auto}.extract-music-panel .music-fields{align-items:start}
@media(max-width:1100px){.mixed-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.mixed-result-grid{grid-template-columns:1fr}.extract-result-hints,.extract-result-summary{display:grid;grid-template-columns:1fr}.mixed-result-card{min-height:auto}}

/* ===== VoicePro V2.0 – Karaoke AI Studio + Recording Library ===== */
.karaoke-hero{display:flex;align-items:center;justify-content:space-between;gap:22px;background:linear-gradient(120deg,#3a2416,#5f371e 56%,#a75d17);color:#fff8ec;border-radius:20px;padding:28px;box-shadow:0 14px 36px rgba(58,36,22,.18);margin-bottom:18px;position:relative;overflow:hidden}.karaoke-hero:after{content:'♪';position:absolute;right:22%;top:-52px;font-size:210px;color:rgba(255,184,75,.08);font-weight:900}.karaoke-hero h1{margin:8px 0;font-size:30px;position:relative;z-index:1}.karaoke-hero p{max-width:850px;color:#f5dcc2;line-height:1.65;margin:0;position:relative;z-index:1}.karaoke-badge{display:inline-flex;padding:7px 11px;border-radius:999px;background:#ffb02e;color:#3a2416;font-size:11px;font-weight:900;letter-spacing:.6px}.karaoke-cost-box{min-width:190px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:6px;position:relative;z-index:1}.karaoke-cost-box small{color:#f4d5b6}.karaoke-cost-box b{font-size:18px}.karaoke-cost-box span{font-size:12px;color:#ffd694}.karaoke-create-card{border-top:4px solid #ee9309}.karaoke-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}.karaoke-form textarea,.karaoke-editor textarea{width:100%;border:1px solid #dfc5a7;border-radius:12px;padding:12px;background:#fffdf8;color:#3e291d;font:inherit;line-height:1.65}.karaoke-api-note{grid-column:1/-1;background:#fff2cf;border:1px solid #ebbf77;border-radius:13px;padding:14px;color:#66401e}.karaoke-api-note p{margin:6px 0 0;line-height:1.6}.karaoke-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.karaoke-project-card{display:flex;gap:14px;align-items:flex-start;transition:.15s}.karaoke-project-card:hover{transform:translateY(-2px);border-color:#d99743}.karaoke-project-icon{width:52px;height:52px;flex:0 0 52px;border-radius:14px;background:linear-gradient(145deg,#5b321b,#e68a0c);display:grid;place-items:center;font-size:26px}.karaoke-project-card h3{margin:0 0 5px;color:#412716}.karaoke-project-card p{margin:0 0 10px;color:#7a5b44;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}.karaoke-project-card small{color:#9a8069}.karaoke-project-meta{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:8px}.karaoke-project-meta>span:not(.status){font-size:10px;padding:4px 7px;border-radius:999px;background:#fff0ce;color:#8a4e06;font-weight:800}.empty-karaoke{grid-column:1/-1;text-align:center;color:#80654f;padding:44px}.karaoke-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.karaoke-detail-grid audio{width:100%}.karaoke-info-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.karaoke-info-list span{background:#fff6e5;border:1px solid #efd2a1;border-radius:999px;padding:7px 10px;font-size:12px}.check-row{display:flex;align-items:center;gap:8px;font-size:13px;color:#5b402c}.karaoke-output video{width:100%;max-height:620px;background:#1f120b;border-radius:14px}.karaoke-timeline{display:grid;gap:8px}.karaoke-line{display:grid;grid-template-columns:42px 130px minmax(0,1fr);gap:10px;align-items:center;padding:10px;border:1px solid #ecd6bc;border-radius:10px;background:#fffdf9}.karaoke-line>span{width:30px;height:30px;border-radius:9px;background:#5b321b;color:#ffbf50;display:grid;place-items:center;font-weight:900;font-size:11px}.karaoke-line time{color:#9a6f4c;font-size:12px}.karaoke-line b{font-size:13px;color:#452b1b}.danger-zone{display:flex;justify-content:flex-end;margin-top:16px}.api-settings-card{border-top:4px solid #e58a0a}
.recorder-studio{border-top:4px solid #e58a0a}.recorder-center{text-align:center;margin:20px}.recorder-timer{font-size:38px;font-weight:900;color:#3a2416}.recorder-buttons{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin:16px 0}.recorder-center audio{width:min(680px,100%);margin:8px auto 0}.recorder-status{margin-top:9px}.recorder-library-title{margin-top:24px}.recorder-library audio{width:250px;height:36px}.empty-recordings{text-align:center;padding:40px;color:#84654e}.row-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
@media(max-width:1100px){.karaoke-project-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.karaoke-hero{display:block;padding:22px}.karaoke-cost-box{margin-top:16px;min-width:0}.karaoke-hero h1{font-size:25px}.karaoke-form,.karaoke-detail-grid{grid-template-columns:1fr}.karaoke-project-grid{grid-template-columns:1fr}.karaoke-line{grid-template-columns:36px 1fr}.karaoke-line b{grid-column:1/-1}.recorder-library audio{width:190px}.recorder-buttons .btn{width:100%}}