:root{--bg:#f4f6fa;--surface:#fff;--surface-soft:#f8fafc;--ink:#172033;--muted:#738096;--line:#e5eaf1;--blue:#2864dc;--blue-dark:#1d4fb8;--green:#16865a;--red:#c43e4d;--amber:#b97815;--shadow:0 10px 34px rgba(28,43,68,.07);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px}button,input,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.app-shell{min-height:100vh;display:grid;grid-template-columns:248px minmax(0,1fr)}.sidebar{background:#131d30;color:#e6ecf5;padding:24px 16px;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh}.brand-row{display:flex;gap:12px;align-items:center;padding:0 8px 34px}.brand-row strong{display:block;font-size:14px;letter-spacing:.01em}.brand-row small{color:#91a0b7;font-size:11px}.brand-mark{height:36px;width:36px;border-radius:11px;background:linear-gradient(135deg,#4385f7,#2252bd);display:grid;place-items:center;color:#fff;font-size:20px;font-weight:800;box-shadow:0 5px 15px #17396c}.brand-mark.large{height:48px;width:48px;font-size:25px;margin-bottom:18px}.sidebar-label,.eyebrow{font-size:10px;font-weight:800;letter-spacing:.13em;color:#8b98ab}.sidebar-label{padding:0 11px 12px}.nav-actions{display:grid;gap:6px}.nav-item{width:100%;display:flex;gap:12px;align-items:center;text-align:left;border:0;background:transparent;color:#b8c4d6;padding:12px 12px;border-radius:9px;font-size:13px;transition:.15s}.nav-item:hover{background:#1d2b44;color:#fff}.nav-item.active{background:#243a60;color:#fff;box-shadow:inset 3px 0 #6ea1ff}.nav-icon{font-size:18px;width:21px;text-align:center;color:#91b5f7}.sidebar-bottom{margin-top:auto;display:grid;gap:12px}.system-mini{display:flex;align-items:center;gap:10px;border:1px solid #2a3b55;background:#1a2941;padding:12px;border-radius:10px}.system-mini strong{display:block;font-size:11px}.system-mini small{display:block;color:#92a1b7;font-size:10px;margin-top:3px}.online-dot{width:8px;height:8px;background:#36c889;border-radius:50%;box-shadow:0 0 0 4px #24533f}.quiet{font-size:12px}.main-content{padding:30px clamp(20px,3vw,48px) 50px;max-width:1700px;width:100%;margin:0 auto}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.topbar h1{font-size:27px;margin:6px 0 0;letter-spacing:-.035em}.topbar .eyebrow{color:#8692a5}.topbar-right{display:flex;align-items:center;gap:12px}.status-pill{background:#edf8f2;color:#19784e;border:1px solid #d4efe0;border-radius:99px;padding:8px 12px;font-size:11px;font-weight:700}.icon-btn{width:34px;height:34px;border-radius:9px;background:#fff;border:1px solid var(--line);color:#5a667b;font-size:20px;display:grid;place-items:center}.icon-btn:hover{border-color:#a9b8d0;color:var(--blue)}.workspace-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(285px,.72fr);gap:20px;align-items:start}.left-column,.right-column{display:grid;gap:18px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:21px}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:19px}.panel-heading h2{font-size:15px;margin:0 0 5px;letter-spacing:-.01em}.panel-heading p{font-size:11px;color:var(--muted);margin:0}.step-number{font-size:10px;color:#a1aec0;border:1px solid var(--line);padding:5px 7px;border-radius:6px;font-weight:700}.count-badge{background:#f0f4fa;color:#566780;border-radius:8px;padding:5px 9px;font-size:11px;font-weight:700}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field{display:grid;gap:7px;margin-bottom:14px}.field.full-width{grid-column:1/-1}.field label,.form-label{font-size:11px;font-weight:700;color:#516078}.field input,.field select,.field textarea,.text-input{width:100%;border:1px solid #dce3ed;border-radius:8px;background:#fff;padding:10px 11px;color:var(--ink);outline:none;min-height:39px}.field input:focus,.field select:focus,.field textarea:focus,.text-input:focus{border-color:#77a1ed;box-shadow:0 0 0 3px #e9f1ff}.field small,.field-hint{font-size:10px;color:#8995a8;line-height:1.45}.btn{border:0;border-radius:8px;padding:10px 14px;font-size:12px;font-weight:750;transition:.15s}.btn.primary{background:var(--blue);color:#fff;box-shadow:0 4px 10px #2864dc25}.btn.primary:hover{background:var(--blue-dark)}.btn.secondary{background:#f3f6fa;color:#53647d;border:1px solid #e1e7ef}.btn.secondary:hover{background:#eaf0f7}.btn.danger{background:#fff0f0;color:#bd3947;border:1px solid #f6d7da}.btn.full{width:100%}.btn.small{padding:7px 10px;font-size:11px}.button-row{display:flex;gap:8px;align-items:center}.form-actions{display:flex;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding-top:17px;margin-top:7px}.source-select{border:1px dashed #c9d5e5;border-radius:10px;padding:13px;display:flex;gap:12px;align-items:center;background:#fbfcfe}.source-select .file-symbol{width:38px;height:38px;border-radius:9px;background:#edf3ff;color:var(--blue);display:grid;place-items:center;font-size:18px}.source-select .source-text{min-width:0;flex:1}.source-select strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.source-select small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.source-empty{display:grid;justify-items:center;text-align:center;padding:21px 10px;color:var(--muted);gap:7px}.folder-icon{font-size:34px;color:#91a9cc}.source-empty strong{font-size:12px;color:#53627a}.source-empty span{font-size:10px;line-height:1.5;max-width:220px}.probe-result{margin-top:12px}.probe-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.probe-item{border:1px solid var(--line);border-radius:8px;padding:9px}.probe-item span{display:block;font-size:9px;color:var(--muted);margin-bottom:4px}.probe-item strong{font-size:11px;overflow-wrap:anywhere}.capability-list{display:grid;gap:8px}.capability-item{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#56647b;padding:6px 0;border-bottom:1px solid #f0f2f6}.capability-item:last-child{border:0}.capability-ok{color:var(--green);font-weight:750}.capability-off{color:#a2aaba}.permission-note{display:flex;gap:8px;background:#f2f8f5;padding:10px;border-radius:8px;margin-top:13px;color:#4c7a62}.permission-note span{font-size:10px}.permission-note p{font-size:10px;line-height:1.5;margin:0}.info-panel .muted{line-height:1.6}.version-line{border-top:1px solid var(--line);margin-top:14px;padding-top:11px;display:flex;justify-content:space-between;font-size:10px;color:#8490a2}.tasks-list{display:grid;gap:11px}.empty-state{display:grid;justify-items:center;text-align:center;padding:30px 10px;color:var(--muted);gap:5px}.empty-icon{font-size:27px;color:#a9b7cb}.empty-state strong{font-size:12px;color:#52617a}.empty-state span{font-size:10px}.task-card{border:1px solid var(--line);border-radius:10px;padding:13px}.task-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.task-name{font-weight:750;font-size:12px}.task-status{font-size:9px;font-weight:800;text-transform:uppercase;padding:5px 7px;border-radius:5px;background:#eef2f7;color:#617189}.task-status.running{background:#eaf2ff;color:#245fcb}.task-status.completed{background:#eaf8f0;color:#168253}.task-status.failed{background:#fff0f0;color:#bf3d4a}.task-status.awaiting_fallback{background:#fff6e7;color:#a46a0e}.task-progress-row{display:flex;justify-content:space-between;color:#68768c;font-size:10px;margin:12px 0 6px}.progress-track{height:7px;background:#edf1f6;border-radius:99px;overflow:hidden}.progress-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#4c83e7,#1e60d2);transition:width .35s}.task-metrics{display:flex;gap:13px;flex-wrap:wrap;margin-top:10px;color:#748198;font-size:10px}.task-metrics b{color:#3b4a61}.task-message{font-size:10px;line-height:1.5;color:#ba3b48;margin-top:9px;white-space:pre-wrap;overflow-wrap:anywhere}.task-logs{background:#131d2e;color:#c8d5e9;border-radius:7px;padding:9px;font:10px/1.5 ui-monospace,monospace;max-height:110px;overflow:auto;margin-top:9px;white-space:pre-wrap}.task-output{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}.output-chip{font-size:10px;color:#21724f;background:#eef8f2;padding:6px 8px;border-radius:6px;overflow-wrap:anywhere}.warning-chip{font-size:10px;color:#99660f;background:#fff6e5;padding:7px 9px;border-radius:7px;margin-top:8px}.modal{position:fixed;inset:0;background:#101a2dcc;display:grid;place-items:center;padding:20px;z-index:20}.modal-card{background:#fff;border-radius:15px;box-shadow:0 25px 90px #0005;width:min(720px,100%);max-height:min(780px,90vh);display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:19px 21px;border-bottom:1px solid var(--line)}.modal-header h2{margin:5px 0 0;font-size:17px}.modal-header .eyebrow{color:#8895a8}.browser-location{display:flex;gap:10px;align-items:center;padding:12px 20px;background:#f8fafc;border-bottom:1px solid var(--line);font-size:11px;color:#65748d}.browser-location span:nth-child(2){flex:1;font-family:ui-monospace,monospace;color:#34435c;overflow-wrap:anywhere}.browser-items{padding:9px 13px;overflow:auto;min-height:250px;max-height:50vh}.browser-item{display:flex;gap:11px;align-items:center;padding:10px;border-radius:8px;cursor:pointer;border:1px solid transparent}.browser-item:hover{background:#f4f7fb}.browser-item.selected{background:#edf4ff;border-color:#cbdcff}.browser-item-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#f0f3f8;color:#71829d;font-size:16px}.browser-item-icon.directory{background:#fff5df;color:#ba861c}.browser-item-main{flex:1;min-width:0}.browser-item-main strong{font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.browser-item-main small{font-size:9px;color:#8b97a8}.browser-item-type{font-size:9px;color:#98a3b4}.browser-check{width:17px;height:17px;accent-color:var(--blue)}.modal-footer{padding:13px 20px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.loading-state{padding:45px;text-align:center;color:var(--muted);font-size:12px}.login-screen{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 20%,#e2ebfd 0,transparent 35%),var(--bg);padding:18px}.login-card{width:min(410px,100%);background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:32px}.login-card h1{margin:0 0 8px;font-size:24px;letter-spacing:-.04em}.login-card .muted{font-size:12px;line-height:1.6;margin:0 0 22px}.login-card label{font-size:11px;font-weight:750;display:block;margin:0 0 7px}.login-card input{width:100%;padding:12px;border:1px solid #dce3ed;border-radius:8px;margin-bottom:14px}.login-card .eyebrow{color:#8996a8}.error-text{color:var(--red);font-size:11px;min-height:16px}.toast-region{position:fixed;bottom:20px;right:20px;z-index:40;display:grid;gap:8px}.toast{background:#17243a;color:#fff;box-shadow:0 8px 30px #18263f3a;padding:11px 14px;border-radius:8px;font-size:11px;max-width:360px}.toast.error{background:#8f2e3a}.range-row{display:grid;grid-template-columns:1fr 1fr auto;gap:9px;align-items:end;border:1px solid var(--line);border-radius:9px;padding:11px;margin-bottom:9px}.range-row .field{margin:0}.range-row .btn{height:38px}.divider-label{font-size:10px;font-weight:800;color:#94a0b1;letter-spacing:.09em;text-transform:uppercase;margin:16px 0 10px}.hardware-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.hardware-option{border:1px solid var(--line);border-radius:8px;padding:10px 6px;text-align:center;cursor:pointer;background:#fff}.hardware-option input{display:none}.hardware-option strong{display:block;font-size:11px}.hardware-option small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.hardware-option:has(input:checked){border-color:#7da3ec;background:#f0f5ff;box-shadow:inset 0 0 0 1px #9cb8ed}.helper-banner{background:#f3f7fd;border:1px solid #e0eaf8;color:#587092;padding:10px 12px;border-radius:8px;font-size:10px;line-height:1.5;margin:6px 0 14px}.action-desc{font-size:11px;line-height:1.5;color:var(--muted);margin:-7px 0 17px}.field-inline{display:flex;gap:8px}.field-inline>*{flex:1}.muted-note{font-size:10px;color:#8491a5;margin-top:5px;line-height:1.45}
@media(max-width:1100px){.workspace-grid{grid-template-columns:minmax(0,1fr)}.right-column{grid-template-columns:repeat(2,minmax(0,1fr))}.info-panel{grid-column:1/-1}}
@media(max-width:740px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;min-height:0;padding:13px}.brand-row{padding:0 5px 13px}.sidebar-label,.sidebar-bottom{display:none}.nav-actions{display:flex;overflow:auto;padding-bottom:2px}.nav-item{white-space:nowrap;width:auto;padding:9px 10px}.nav-item span:last-child{font-size:11px}.main-content{padding:20px 12px 35px}.topbar{align-items:flex-start}.topbar h1{font-size:21px}.topbar-right{gap:5px}.status-pill{font-size:9px;padding:7px}.panel{padding:15px}.right-column{grid-template-columns:1fr}.info-panel{grid-column:auto}.field-grid{grid-template-columns:1fr}.hardware-options{grid-template-columns:repeat(2,1fr)}.modal-footer{align-items:flex-start;flex-direction:column}.modal-footer .button-row{width:100%;justify-content:flex-end}.range-row{grid-template-columns:1fr 1fr}.range-row .btn{grid-column:1/-1}}

.zoom-control{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;font-weight:700;white-space:nowrap}
.zoom-control select{min-width:82px;padding:7px 9px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--ink);font:inherit;font-size:12px;cursor:pointer}
@media(max-width:900px){.zoom-control span{display:none}.zoom-control select{min-width:72px}}


/* Thème sombre : les couleurs structurelles basculent sans modifier le thème clair existant. */
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#101722;--surface:#182231;--surface-soft:#202c3d;--ink:#e6edf7;
  --muted:#9aa9bd;--line:#2b394d;--blue:#6d9df5;--blue-dark:#8ab0ff;
  --green:#48c58b;--red:#f07882;--amber:#e5b45e;
  --shadow:0 10px 34px rgba(0,0,0,.22);
}
:root[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .task-card,
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .modal-card{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .field input,
:root[data-theme="dark"] .field select,
:root[data-theme="dark"] .field textarea,
:root[data-theme="dark"] .text-input,
:root[data-theme="dark"] .login-card input,
:root[data-theme="dark"] .zoom-control select{background:#111b29;color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .icon-btn{background:var(--surface);color:var(--ink);border-color:var(--line)}
:root[data-theme="dark"] .status-pill{background:#18372e;color:#78d9aa;border-color:#285744}
:root[data-theme="dark"] .count-badge,
:root[data-theme="dark"] .step-number,
:root[data-theme="dark"] .task-status{background:#263448;color:#bdcbe0;border-color:var(--line)}
:root[data-theme="dark"] .task-status.running{background:#1c3558;color:#9fc2ff}
:root[data-theme="dark"] .task-status.completed{background:#193c30;color:#7cdaad}
:root[data-theme="dark"] .task-status.failed{background:#49272e;color:#ff9ca4}
:root[data-theme="dark"] .task-status.awaiting_fallback{background:#49391f;color:#f1c875}
:root[data-theme="dark"] .btn.secondary{background:#263448;color:#d5e0ef;border-color:var(--line)}
:root[data-theme="dark"] .btn.secondary:hover{background:#304158}
:root[data-theme="dark"] .btn.danger{background:#46262d;color:#ffabb1;border-color:#63323b}
:root[data-theme="dark"] .source-select,
:root[data-theme="dark"] .helper-banner,
:root[data-theme="dark"] .browser-location{background:#202d40;border-color:var(--line);color:#c0cee0}
:root[data-theme="dark"] .source-select .file-symbol,
:root[data-theme="dark"] .browser-item-icon{background:#2b3b52;color:#a9c5f7}
:root[data-theme="dark"] .permission-note{background:#1d382f;color:#9ad8b8}
:root[data-theme="dark"] .capability-item{color:#c0ccdc;border-color:#29374a}
:root[data-theme="dark"] .task-logs{background:#0b111b;color:#cbd8e9}
:root[data-theme="dark"] .output-chip{background:#1c3a2f;color:#91dfb7}
:root[data-theme="dark"] .warning-chip{background:#40351f;color:#f0c979}
:root[data-theme="dark"] .progress-track{background:#2a374a}
:root[data-theme="dark"] .browser-item:hover,
:root[data-theme="dark"] .browser-item.selected{background:#263a57;border-color:#3a5275}
:root[data-theme="dark"] .browser-location span:nth-child(2){color:#d6e1f0}
:root[data-theme="dark"] .browser-item-main small,
:root[data-theme="dark"] .browser-item-type{color:#9aa9bd}
:root[data-theme="dark"] .login-screen{background:radial-gradient(circle at 20% 20%,#1b2b45 0,transparent 35%),var(--bg)}
:root[data-theme="dark"] .login-card .eyebrow,
:root[data-theme="dark"] .topbar .eyebrow{color:#9aa9bd}
:root[data-theme="dark"] .field label,
:root[data-theme="dark"] .form-label{color:#bdcbe0}
:root[data-theme="dark"] .field small,
:root[data-theme="dark"] .field-hint,
:root[data-theme="dark"] .muted-note{color:#9aa9bd}
:root[data-theme="dark"] .hardware-option{background:#1b2737;border-color:var(--line);color:var(--ink)}
:root[data-theme="dark"] .hardware-option:has(input:checked){background:#203756;border-color:#6d9df5}
:root[data-theme="dark"] .modal{background:#050a12dd}
:root[data-theme="dark"] .browser-items{background:var(--surface)}
:root[data-theme="dark"] .browser-check{accent-color:var(--blue)}
:root[data-theme="dark"] .range-row{border-color:var(--line)}
:root[data-theme="dark"] .form-actions,
:root[data-theme="dark"] .modal-header,
:root[data-theme="dark"] .modal-footer{border-color:var(--line)}
:root[data-theme="dark"] .field input:focus,
:root[data-theme="dark"] .field select:focus,
:root[data-theme="dark"] .field textarea:focus,
:root[data-theme="dark"] .text-input:focus{box-shadow:0 0 0 3px #29456d}
@media(max-width:740px){.topbar-right{flex-wrap:wrap;justify-content:flex-end}.theme-control select{min-width:90px}}


/* ============================================================
   FFmpeg Manager 0.1.6 — palette sombre bleu nuit / marine
   Le thème clair d'origine reste inchangé.
   ============================================================ */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #070d18;
  --surface: #101b2c;
  --surface-soft: #16243a;
  --ink: #f3f6fc;
  --muted: #a8b6ca;
  --line: #263b59;
  --blue: #4d86e8;
  --blue-dark: #3168c9;
  --green: #42c58a;
  --red: #f06b76;
  --amber: #e8b85e;
  --shadow: 0 12px 36px rgba(0,0,0,.34);
  --panel: #101b2c;
  --border: #263b59;
}
:root[data-theme="dark"] body,
:root[data-theme="dark"] .app-shell,
:root[data-theme="dark"] .main-content {
  background: #070d18;
  color: #f3f6fc;
}
:root[data-theme="dark"] .sidebar {
  background: linear-gradient(180deg, #0b1424 0%, #101e34 100%);
  border-right: 1px solid #203450;
  color: #f3f6fc;
}
:root[data-theme="dark"] .nav-item { color: #b9c7dc; }
:root[data-theme="dark"] .nav-item:hover { background: #1a2d49; color: #fff; }
:root[data-theme="dark"] .nav-item.active {
  background: #203b63;
  color: #fff;
  box-shadow: inset 3px 0 #6ea4ff;
}
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .task-card,
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .modal-card,
:root[data-theme="dark"] .probe-item {
  background: #101b2c;
  color: #f3f6fc;
  border-color: #263b59;
  box-shadow: 0 12px 36px rgba(0,0,0,.24);
}
:root[data-theme="dark"] .panel-heading h2,
:root[data-theme="dark"] .topbar h1,
:root[data-theme="dark"] .login-card h1,
:root[data-theme="dark"] .task-name,
:root[data-theme="dark"] .task-top strong,
:root[data-theme="dark"] .browser-item-main strong,
:root[data-theme="dark"] .source-select strong,
:root[data-theme="dark"] .empty-state strong,
:root[data-theme="dark"] .source-empty strong,
:root[data-theme="dark"] .probe-item strong,
:root[data-theme="dark"] .brand-row strong {
  color: #f5f8ff;
}
:root[data-theme="dark"] .panel-heading p,
:root[data-theme="dark"] .muted,
:root[data-theme="dark"] .small,
:root[data-theme="dark"] .field small,
:root[data-theme="dark"] .field-hint,
:root[data-theme="dark"] .muted-note,
:root[data-theme="dark"] .action-desc,
:root[data-theme="dark"] .version-line,
:root[data-theme="dark"] .browser-item-main small,
:root[data-theme="dark"] .browser-item-type,
:root[data-theme="dark"] .empty-state,
:root[data-theme="dark"] .source-empty,
:root[data-theme="dark"] .loading-state,
:root[data-theme="dark"] .task-metrics,
:root[data-theme="dark"] .task-message {
  color: #a8b6ca;
}
:root[data-theme="dark"] .field label,
:root[data-theme="dark"] .form-label,
:root[data-theme="dark"] .login-card label,
:root[data-theme="dark"] .zoom-control {
  color: #d6e1f2;
}
:root[data-theme="dark"] .field input,
:root[data-theme="dark"] .field select,
:root[data-theme="dark"] .field textarea,
:root[data-theme="dark"] .text-input,
:root[data-theme="dark"] .login-card input,
:root[data-theme="dark"] .zoom-control select,
:root[data-theme="dark"] select,
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
:root[data-theme="dark"] textarea {
  background: #091322;
  color: #f3f6fc;
  border-color: #304966;
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: #8294ad;
  opacity: 1;
}
:root[data-theme="dark"] option {
  background: #101b2c;
  color: #f3f6fc;
}
:root[data-theme="dark"] .field input:focus,
:root[data-theme="dark"] .field select:focus,
:root[data-theme="dark"] .field textarea:focus,
:root[data-theme="dark"] .text-input:focus {
  border-color: #6599ed;
  box-shadow: 0 0 0 3px rgba(77,134,232,.2);
}
:root[data-theme="dark"] .btn.secondary,
:root[data-theme="dark"] .icon-btn {
  background: #1a2a41;
  color: #e3ecfa;
  border: 1px solid #304966;
}
:root[data-theme="dark"] .btn.secondary:hover,
:root[data-theme="dark"] .icon-btn:hover {
  background: #243b5c;
  border-color: #4e75a8;
}
:root[data-theme="dark"] .btn.primary {
  background: #356fc9;
  color: #fff;
}
:root[data-theme="dark"] .btn.primary:hover { background: #477fda; }
:root[data-theme="dark"] .btn.danger {
  background: #4a202b;
  border: 1px solid #793744;
  color: #ffb4bc;
}
:root[data-theme="dark"] .status-pill {
  background: #123a32;
  color: #8ce1bd;
  border-color: #23624f;
}
:root[data-theme="dark"] .count-badge,
:root[data-theme="dark"] .step-number,
:root[data-theme="dark"] .task-status {
  background: #1d304a;
  color: #d0def2;
  border-color: #304966;
}
:root[data-theme="dark"] .task-status.running {
  background: #183763; color: #a8caff;
}
:root[data-theme="dark"] .task-status.completed {
  background: #143b31; color: #91e3c0;
}
:root[data-theme="dark"] .task-status.failed {
  background: #49242d; color: #ffafb6;
}
:root[data-theme="dark"] .task-status.awaiting_fallback {
  background: #49371d; color: #f2cf82;
}
:root[data-theme="dark"] .source-select,
:root[data-theme="dark"] .helper-banner,
:root[data-theme="dark"] .browser-location,
:root[data-theme="dark"] .hardware-option {
  background: #14243a;
  border-color: #304966;
  color: #d9e5f5;
}
:root[data-theme="dark"] .source-select .file-symbol,
:root[data-theme="dark"] .browser-item-icon {
  background: #203a5d;
  color: #b9d2ff;
}
:root[data-theme="dark"] .hardware-option:has(input:checked) {
  background: #1b3a65;
  border-color: #6599ed;
  box-shadow: inset 0 0 0 1px #6599ed;
}
:root[data-theme="dark"] .capability-item {
  color: #c4d1e3;
  border-color: #263b59;
}
:root[data-theme="dark"] .capability-ok { color: #69d6a5; }
:root[data-theme="dark"] .capability-off { color: #8192a9; }
:root[data-theme="dark"] .permission-note {
  background: #12372f;
  color: #a4e5c7;
}
:root[data-theme="dark"] .task-logs {
  background: #050a12;
  color: #d6e3f4;
  border-color: #263b59;
}
:root[data-theme="dark"] .progress-track { background: #263b59; }
:root[data-theme="dark"] .progress-fill { background: #4d86e8; }
:root[data-theme="dark"] .output-chip {
  background: #153b31; color: #9ae7c2; border-color: #285b4b;
}
:root[data-theme="dark"] .warning-chip {
  background: #44351c; color: #f3cf82; border-color: #685027;
}
:root[data-theme="dark"] .browser-items { background: #0d1726; }
:root[data-theme="dark"] .browser-item {
  border-color: #243a57;
  color: #e7eef9;
}
:root[data-theme="dark"] .browser-item:hover,
:root[data-theme="dark"] .browser-item.selected {
  background: #1b3557;
  border-color: #5277aa;
}
:root[data-theme="dark"] .modal { background: rgba(1,5,12,.82); }
:root[data-theme="dark"] .modal-header,
:root[data-theme="dark"] .modal-footer,
:root[data-theme="dark"] .form-actions,
:root[data-theme="dark"] .range-row,
:root[data-theme="dark"] .version-line {
  border-color: #263b59;
}
:root[data-theme="dark"] .login-screen {
  background:
    radial-gradient(circle at 18% 15%, rgba(36,74,127,.4) 0, transparent 34%),
    linear-gradient(145deg, #070d18, #0d1b30 60%, #070d18);
}
:root[data-theme="dark"] .login-card .eyebrow,
:root[data-theme="dark"] .topbar .eyebrow { color: #8fa5c4; }
:root[data-theme="dark"] .toast {
  background: #1d3554;
  color: #fff;
  border: 1px solid #34567e;
}
:root[data-theme="dark"] .toast.error {
  background: #662b37;
  border-color: #95414e;
}
:root[data-theme="dark"] .divider-label { color: #90a4c1; }
:root[data-theme="dark"] a { color: #8db8ff; }
:root[data-theme="dark"] hr { border-color: #263b59; }


/* Confirmation de suppression des fichiers sources — signal visuel rouge explicite. */
.source-cleanup-card{width:min(560px,100%);border:1px solid #e7a0a6;box-shadow:0 24px 90px rgba(76,12,22,.28)}
.source-cleanup-card .modal-header{background:#fff3f3;border-bottom-color:#f0c6c9}
.source-cleanup-card .cleanup-eyebrow{color:#bd2738;font-weight:850}
.source-cleanup-card .modal-header h2{color:#7f1d2a}
.cleanup-alert-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:#c83243;color:#fff;font-size:24px;font-weight:900;box-shadow:0 4px 12px #c8324338}
.cleanup-modal-body{padding:20px 22px;color:#344054}
.cleanup-modal-body>p{margin:0 0 14px;line-height:1.6;font-size:13px}
.cleanup-source-list{display:grid;gap:7px;max-height:190px;overflow:auto;margin:0 0 15px}
.cleanup-source-item{display:grid;gap:3px;padding:9px 11px;border:1px solid #f0d5d8;border-radius:8px;background:#fffafa;min-width:0}
.cleanup-source-item strong{font-size:12px;color:#56202a;overflow-wrap:anywhere}
.cleanup-source-item span{font-size:10px;color:#8b5960;overflow-wrap:anywhere}
.cleanup-warning{padding:11px 12px;background:#fff0f0;border:1px solid #f2c3c8;border-left:4px solid #c83243;border-radius:8px;color:#8b2633;font-size:11px;line-height:1.55}
.cleanup-modal-footer{justify-content:flex-end;flex-wrap:wrap;background:#fffafa;border-top-color:#f0c6c9}
.cleanup-modal-footer .btn.danger{background:#bf2638;border-color:#a91e2f;color:#fff;font-weight:800;box-shadow:0 4px 12px #bf26382a}
.cleanup-modal-footer .btn.danger:hover{background:#9f1f2e}
.cleanup-modal-footer .btn:disabled{opacity:.6;cursor:wait}
:root[data-theme="dark"] .source-cleanup-card{border-color:#803e4a;background:#111b2c}
:root[data-theme="dark"] .source-cleanup-card .modal-header{background:#311c2a;border-color:#653442}
:root[data-theme="dark"] .source-cleanup-card .modal-header h2{color:#fff1f2}
:root[data-theme="dark"] .source-cleanup-card .cleanup-eyebrow{color:#ff9eaa}
:root[data-theme="dark"] .cleanup-modal-body{background:#101b2c;color:#eaf0fa}
:root[data-theme="dark"] .cleanup-source-item{background:#1b2537;border-color:#593744}
:root[data-theme="dark"] .cleanup-source-item strong{color:#ffe8eb}
:root[data-theme="dark"] .cleanup-source-item span{color:#d8aab2}
:root[data-theme="dark"] .cleanup-warning{background:#3a1e29;border-color:#743b49;border-left-color:#ed596b;color:#ffd6dc}
:root[data-theme="dark"] .cleanup-modal-footer{background:#111b2c;border-color:#653442}
@media(max-width:560px){.cleanup-modal-footer{flex-direction:column-reverse;align-items:stretch}.cleanup-modal-footer .btn{width:100%}}

/* Réglages avancés de résolution et d'audio */
#resolution:disabled,#deinterlace:disabled,#audio-channels:disabled,#audio-sample-rate:disabled,#framerate:disabled{opacity:.58;cursor:not-allowed}
#source-match-banner{line-height:1.55}
#manual-resolution-wrap .field{margin-bottom:8px}


/* Ligne d'actions juste sous la progression : Annuler / suppression des sources. */
.task-actions-row{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-top:9px;
}
.task-actions-row .btn{margin:0}
.task-actions-row .source-delete-task-btn{
  background:#fff0f0;
  border:1px solid #efbfc5;
  color:#b42332;
  font-weight:750;
}
.task-actions-row .source-delete-task-btn:hover{
  background:#ffe0e3;
  border-color:#d97984;
}
.task-actions-row .source-delete-task-btn:disabled{
  opacity:.42;
  cursor:not-allowed;
}
:root[data-theme="dark"] .task-actions-row .source-delete-task-btn{
  background:#49232d;
  border-color:#79414c;
  color:#ffb1bb;
}
:root[data-theme="dark"] .task-actions-row .source-delete-task-btn:hover{
  background:#5a2935;
  border-color:#a35360;
}
.source-cleanup-card{width:min(470px,100%);max-height:min(650px,88vh)}
.source-cleanup-card .cleanup-modal-body{padding:15px 18px}
.source-cleanup-card .cleanup-modal-footer{padding:12px 18px}
.source-cleanup-card .modal-header{padding:14px 18px}

/* À propos et historique des versions */
.version-line strong{color:var(--ink);font-size:11px}.version-details{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:9px;color:var(--muted);font-size:10px}.ai-credit{font-weight:750;color:var(--blue)}.changelog-button{margin-top:13px}.changelog-modal-card{width:min(760px,100%)}.changelog-content{margin:0;padding:18px 21px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;background:var(--surface-soft);color:var(--ink);font:11px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;max-height:calc(90vh - 150px);min-height:220px}.changelog-modal-card .modal-footer{justify-content:flex-end}
@media(max-width:520px){.version-details{align-items:flex-start;flex-direction:column}.changelog-content{padding:14px;font-size:10px}}

.diagnostic-report{margin-top:11px;padding:11px 12px;border:1px solid var(--line);border-radius:9px;background:var(--surface-soft);font-size:11px;line-height:1.5}.diagnostic-report>strong{display:block;color:var(--ink);font-size:12px;margin-bottom:7px}.diagnostic-meta{display:flex;gap:6px 13px;flex-wrap:wrap;color:var(--muted);margin-bottom:7px}.diagnostic-report ul{margin:6px 0 0;padding-left:17px;color:var(--ink)}.diagnostic-report li{margin:3px 0;overflow-wrap:anywhere}

/* Ergonomie smartphone : navigation basse fixe, contrôles tactiles et panneaux adaptés. */
@media (max-width: 740px) {
  .app-shell {
    display: block;
    min-height: 100dvh;
  }

  .sidebar {
    position: fixed;
    inset: auto 0 0;
    z-index: 30;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 7px 5px calc(7px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid #2a3b55;
    box-shadow: 0 -8px 24px rgba(12, 23, 40, .2);
  }

  .brand-row,
  .sidebar-label,
  .sidebar-bottom {
    display: none;
  }

  .nav-actions {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 2px;
    width: 100%;
    overflow: visible;
    padding: 0;
  }

  .nav-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3px;
    width: 100%;
    min-width: 0;
    min-height: 58px;
    padding: 6px 2px;
    border-radius: 8px;
    white-space: normal;
    text-align: center;
  }

  .nav-item span:last-child {
    display: block;
    max-width: 100%;
    font-size: 9px;
    line-height: 1.12;
    overflow-wrap: anywhere;
  }

  .nav-icon {
    width: auto;
    font-size: 18px;
    line-height: 1;
  }

  .nav-item.active {
    box-shadow: inset 0 2px #6ea1ff;
  }

  .main-content {
    width: 100%;
    min-width: 0;
    padding: 15px 11px calc(100px + env(safe-area-inset-bottom, 0px));
  }

  .topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 11px;
    margin-bottom: 15px;
  }

  .topbar h1 {
    font-size: clamp(21px, 6vw, 25px);
    line-height: 1.15;
    overflow-wrap: anywhere;
  }

  .topbar-right {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: stretch;
    gap: 7px;
    min-width: 0;
  }

  .zoom-control {
    display: grid;
    flex: 1 1 90px;
    min-width: 0;
    gap: 4px;
    font-size: 10px;
  }

  .zoom-control span {
    display: block;
    font-size: 9px;
  }

  .zoom-control select {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: 7px 8px;
    font-size: 12px;
  }

  .status-pill {
    display: flex;
    flex: 1 1 125px;
    justify-content: center;
    align-items: center;
    min-width: 0;
    min-height: 40px;
    padding: 7px 9px;
    font-size: 10px;
    text-align: center;
  }

  .icon-btn {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
  }

  .workspace-grid,
  .left-column,
  .right-column {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 13px;
    min-width: 0;
  }

  .panel {
    min-width: 0;
    padding: 14px;
    border-radius: 12px;
  }

  .panel-heading {
    gap: 9px;
    margin-bottom: 14px;
  }

  .panel-heading h2 {
    font-size: 15px;
    line-height: 1.25;
  }

  .panel-heading p {
    font-size: 11px;
    line-height: 1.4;
  }

  .field-grid,
  .probe-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 9px;
  }

  .field {
    min-width: 0;
    margin-bottom: 11px;
  }

  .field input,
  .field select,
  .field textarea,
  .text-input,
  input,
  select,
  textarea {
    min-height: 44px;
    font-size: 16px;
  }

  .field label,
  .form-label {
    font-size: 12px;
  }

  .field small,
  .field-hint {
    font-size: 11px;
  }

  .btn {
    min-height: 44px;
    padding: 11px 13px;
    font-size: 13px;
  }

  .btn.small {
    min-height: 38px;
    padding: 8px 10px;
    font-size: 11px;
  }

  .button-row {
    flex-wrap: wrap;
  }

  .button-row > .btn {
    flex: 1 1 auto;
  }

  .form-actions {
    display: flex;
    flex-direction: column-reverse;
    align-items: stretch;
    gap: 8px;
  }

  .form-actions > .btn,
  .form-actions .button-row,
  .form-actions .button-row > .btn {
    width: 100%;
  }

  .source-select {
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 11px;
  }

  .source-select .source-text {
    flex: 1 1 calc(100% - 54px);
  }

  .source-select > .btn {
    width: 100%;
  }

  .task-card {
    min-width: 0;
    padding: 11px;
  }

  .task-top {
    align-items: flex-start;
  }

  .task-name {
    overflow-wrap: anywhere;
    line-height: 1.35;
  }

  .task-status {
    flex: 0 0 auto;
    font-size: 9px;
  }

  .task-progress-row {
    gap: 8px;
    font-size: 11px;
    line-height: 1.35;
  }

  .task-progress-row > span {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .task-metrics {
    gap: 8px 11px;
    font-size: 11px;
  }

  .task-actions-row .btn {
    flex: 1 1 125px;
  }

  .task-output {
    align-items: stretch;
  }

  .task-output .btn {
    flex: 1 1 120px;
  }

  .task-logs {
    max-height: 220px;
    padding: 10px;
    font-size: 11px;
    overflow-wrap: anywhere;
  }

  .task-logs-wrap summary {
    display: flex;
    align-items: center;
    min-height: 40px;
    font-size: 12px;
  }

  .range-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
  }

  .range-row .field {
    min-width: 0;
  }

  .range-row .btn {
    grid-column: 1 / -1;
    width: 100%;
  }

  .hardware-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .browser-location {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
    padding: 10px 12px;
  }

  .browser-location span:nth-child(2) {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .browser-items {
    min-height: 120px;
    max-height: none;
    flex: 1 1 auto;
    padding: 7px 9px;
  }

  .browser-item {
    min-height: 48px;
    padding: 9px 7px;
  }

  .browser-item-main strong,
  .browser-item-main small {
    overflow-wrap: anywhere;
  }

  .modal {
    z-index: 50;
    align-items: end;
    padding: 0;
  }

  .modal-card {
    width: 100%;
    max-width: none;
    max-height: min(92dvh, 900px);
    border-radius: 17px 17px 0 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .modal-header {
    padding: 14px 15px;
  }

  .modal-header h2 {
    font-size: 16px;
  }

  .modal-footer {
    align-items: stretch;
    flex-direction: column;
    gap: 9px;
    padding: 12px 15px;
  }

  .modal-footer .button-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  .modal-footer .button-row > .btn,
  .modal-footer > .btn {
    width: 100%;
  }

  .browser-card {
    height: min(92dvh, 900px);
  }

  .browser-card .modal-footer .button-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .changelog-content {
    min-height: 150px;
    max-height: 58dvh;
    padding: 13px 14px;
    font-size: 11px;
    line-height: 1.6;
  }

  .changelog-modal-card .modal-footer {
    flex-direction: row;
    justify-content: flex-end;
  }

  .changelog-modal-card .modal-footer .btn {
    width: auto;
    min-width: 110px;
  }

  .source-cleanup-card .cleanup-modal-body {
    padding: 14px 15px;
  }

  .source-cleanup-card .cleanup-modal-footer {
    flex-direction: column-reverse;
    align-items: stretch;
  }

  .source-cleanup-card .cleanup-modal-footer .btn {
    width: 100%;
  }

  .version-details {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 380px) {
  .main-content {
    padding-right: 9px;
    padding-left: 9px;
  }

  .panel {
    padding: 12px;
  }

  .nav-item span:last-child {
    font-size: 8px;
  }

  .browser-location {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .browser-location #browser-up {
    grid-column: 1 / -1;
    width: 100%;
  }

  .browser-card .modal-footer .button-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
