/* DEEPFAKE — palette rouge (danger = fake) / cyan (info) */
:root{
  --bg-deep:#02040a; --bg-elev:#08111e; --bg-card:rgba(10,18,36,0.6);
  --border:rgba(120,180,255,0.14); --border-strong:rgba(120,180,255,0.32);
  --text:#e8edf5; --text-muted:#a3b0c5; --text-soft:#7d8aa1;
  --accent:#ff5a2a; --accent-deep:#c4321a; --accent-soft:rgba(255,90,42,0.10);
  --accent-glow:rgba(255,90,42,0.32);
  --secondary:#5dd4f7;
  --ok:#39ff14; --ok-soft:rgba(57,255,20,0.10);
  --danger:#ff2a1a; --danger-soft:rgba(255,42,26,0.14);
  --radius:14px; --radius-sm:8px;
  --tween:200ms cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg-deep)}
body{
  margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:16px;line-height:1.55;color:var(--text);background:transparent;
  min-height:100dvh;
  -webkit-font-smoothing:antialiased;
}

.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:1rem;top:1rem;width:auto;height:auto;background:var(--accent);color:var(--bg-deep);padding:.6rem 1rem;border-radius:8px;font-weight:700;z-index:100}

/* HAL background layer */
.neural-bg{position:fixed;inset:0;width:100vw;height:100dvh;z-index:-2;pointer-events:none;display:block}
.neural-overlay{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,0.10) 0 1px,transparent 1px 3px),
             radial-gradient(ellipse at center,transparent 25%,rgba(0,0,0,0.55) 90%);
  mix-blend-mode:multiply}

.back-to-menu{
  position:fixed;top:12px;left:12px;z-index:10;
  padding:.55rem .85rem;border-radius:999px;background:var(--bg-card);
  border:1px solid var(--border);color:var(--text-muted);text-decoration:none;
  font-weight:600;font-size:.85rem;backdrop-filter:blur(10px);
  transition:background var(--tween),color var(--tween),border-color var(--tween);
}
.back-to-menu:hover{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}

.topbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.85rem;padding:1.5rem 1rem .8rem;text-align:center}
.topbar .brand{
  font-size:2rem;font-weight:900;letter-spacing:.15em;
  background:linear-gradient(135deg,var(--accent),var(--secondary));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.topbar .tag{
  font-size:.7rem;font-family:ui-monospace,SFMono-Regular,monospace;color:var(--text-soft);
  letter-spacing:.14em;text-transform:uppercase;padding:.35rem .8rem;
  border:1px solid var(--border);border-radius:999px;background:var(--bg-card);
}

.layout{max-width:900px;margin:0 auto;padding:1rem 1.25rem 4rem;display:grid;gap:1rem}
.panel{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);
  padding:1.4rem 1.6rem;backdrop-filter:blur(10px);
  animation:panelIn .35s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes panelIn{from{opacity:0;transform:translateY(6px)}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.panel{animation:none}}

.p-title{font-size:1.2rem;margin:0 0 .75rem;display:flex;align-items:center;gap:.7rem;line-height:1.3}
.p-num{
  display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;
  background:var(--accent-soft);color:var(--accent);
  border:1px solid var(--border-strong);border-radius:8px;
  font-family:ui-monospace,SFMono-Regular,monospace;font-weight:800;font-size:.95rem;
}
.p-hint{margin:.4rem 0;color:var(--text-muted);font-size:.92rem;line-height:1.55}
.p-hint strong{color:var(--accent);font-weight:700}
.p-hint em{color:var(--secondary);font-style:normal;font-weight:600}
.p-hint code{padding:.1rem .35rem;background:var(--accent-soft);color:var(--accent);border-radius:4px;font-size:.85em;font-family:ui-monospace,monospace}
.p-hint a{color:var(--secondary);text-decoration:underline}
.p-warn{
  border-left:3px solid var(--danger);padding-left:.75rem;
  background:var(--danger-soft);border-radius:0 6px 6px 0;padding:.6rem .75rem;
  color:var(--text);
}
.p-warn strong{color:var(--danger)}
.p-cache{
  border-left:3px solid var(--secondary);padding-left:.75rem;
  background:rgba(93,212,247,0.10);border-radius:0 6px 6px 0;padding:.6rem .75rem;
  color:var(--text);font-size:.85rem;margin-top:.75rem;
}
.p-cache strong{color:var(--secondary)}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.6rem 1rem;border-radius:var(--radius-sm);
  background:var(--bg-elev);color:var(--text);
  border:1px solid var(--border-strong);
  font-weight:600;font-size:.9rem;cursor:pointer;text-decoration:none;
  transition:background var(--tween),border-color var(--tween),transform var(--tween);
}
.btn:hover{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-primary{
  background:linear-gradient(135deg,var(--accent),var(--accent-deep));
  color:#0a0000;border-color:transparent;
}
.btn-primary:hover{background:linear-gradient(135deg,var(--accent),var(--accent));color:#0a0000;transform:translateY(-1px)}

/* Progress */
.progress-row{display:flex;flex-wrap:wrap;gap:.6rem;margin:.5rem 0}
.prog-item,.img-status{
  display:flex;align-items:center;gap:.55rem;padding:.5rem .85rem;
  border:1px solid var(--border);border-radius:999px;background:var(--bg-elev);
  font-size:.85rem;
}
.prog-item.is-active,.img-status.is-active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.prog-item.is-done,.img-status.is-done{border-color:var(--ok);color:var(--ok);background:var(--ok-soft)}
.prog-item.is-error,.img-status.is-error{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)}
.pi-name{font-weight:600}
.pi-status{color:var(--text-soft);font-family:ui-monospace,monospace;font-size:.78rem}
.prog-item.is-active .pi-status,.prog-item.is-done .pi-status,.prog-item.is-error .pi-status,
.img-status.is-active .pi-status,.img-status.is-done .pi-status,.img-status.is-error .pi-status{color:inherit}

/* Icônes de statut (pure CSS, sans SVG) */
.pi-icon{
  display:inline-grid;place-items:center;
  width:18px;height:18px;flex-shrink:0;
  border-radius:50%;
  border:2px solid var(--text-soft);
  background:transparent;
  position:relative;
  transition:border-color var(--tween),background var(--tween);
}
/* état "en attente" (défaut) : cercle vide gris */
.prog-item:not(.is-active):not(.is-done):not(.is-error) .pi-icon,
.img-status:not(.is-active):not(.is-done):not(.is-error) .pi-icon{
  border-color:var(--text-soft);
}
/* état actif : spinner qui tourne */
.prog-item.is-active .pi-icon,
.img-status.is-active .pi-icon{
  border-color:var(--accent);
  border-top-color:transparent;
  animation:spinIcon .8s linear infinite;
}
@keyframes spinIcon{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
  .prog-item.is-active .pi-icon,.img-status.is-active .pi-icon{animation:none}
}
/* état done : ✓ vert */
.prog-item.is-done .pi-icon,
.img-status.is-done .pi-icon{
  border-color:var(--ok);
  background:var(--ok);
}
.prog-item.is-done .pi-icon::before,
.img-status.is-done .pi-icon::before{
  content:"";position:absolute;
  width:5px;height:9px;
  border:solid #001100;border-width:0 2px 2px 0;
  transform:rotate(45deg) translate(-1px,-2px);
}
/* état error : × rouge */
.prog-item.is-error .pi-icon,
.img-status.is-error .pi-icon{
  border-color:var(--danger);
  background:var(--danger);
}
.prog-item.is-error .pi-icon::before,
.prog-item.is-error .pi-icon::after,
.img-status.is-error .pi-icon::before,
.img-status.is-error .pi-icon::after{
  content:"";position:absolute;
  width:10px;height:2px;background:#1a0000;
}
.prog-item.is-error .pi-icon::before,
.img-status.is-error .pi-icon::before{transform:rotate(45deg)}
.prog-item.is-error .pi-icon::after,
.img-status.is-error .pi-icon::after{transform:rotate(-45deg)}

.progress-bar{width:100%;height:6px;background:var(--bg-elev);border-radius:999px;overflow:hidden;margin:.5rem 0}
.progress-bar-fill{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--secondary));transition:width .3s}

.controls-row{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;margin-top:.75rem}
.topk-inline,.toggle-inline{
  display:flex;align-items:center;gap:.5rem;
  padding:.35rem .6rem;border:1px solid var(--border);border-radius:999px;
  background:var(--bg-elev);font-size:.82rem;color:var(--text-muted);
  cursor:pointer;
  transition:border-color var(--tween),color var(--tween);
}
.topk-inline span,.toggle-inline span{font-weight:600}
.toggle-inline:hover{border-color:var(--accent);color:var(--accent)}
.toggle-inline input[type="checkbox"]{
  appearance:none;
  width:32px;height:18px;
  border-radius:999px;background:var(--bg-deep);border:1px solid var(--border-strong);
  position:relative;cursor:pointer;flex-shrink:0;
  transition:background var(--tween),border-color var(--tween);
}
.toggle-inline input[type="checkbox"]::before{
  content:"";position:absolute;
  top:1px;left:1px;
  width:14px;height:14px;border-radius:50%;
  background:var(--text-soft);
  transition:left var(--tween),background var(--tween);
}
.toggle-inline input[type="checkbox"]:checked{
  background:var(--accent-soft);border-color:var(--accent);
}
.toggle-inline input[type="checkbox"]:checked::before{
  left:15px;background:var(--accent);
}
.mode-select{
  background:transparent;color:var(--text);border:none;
  font-family:inherit;font-size:.85rem;padding:.15rem .3rem;cursor:pointer;
}
.mode-select option{background:var(--bg-elev);color:var(--text)}

/* Tabs */
.tab-row{
  display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap;
  padding-bottom:.5rem;border-bottom:1px solid var(--border);
}
.tab{
  padding:.5rem 1rem;background:transparent;color:var(--text-muted);
  border:1px solid var(--border);border-radius:999px 999px 0 0;
  font-weight:600;font-size:.9rem;cursor:pointer;
  transition:color var(--tween),background var(--tween),border-color var(--tween);
}
.tab:hover{color:var(--text)}
.tab.is-active{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.tab-panel{display:none}
.tab-panel.is-active{display:block}

/* Dropzone */
.dropzone{
  padding:2rem 1.5rem;border:2px dashed var(--border-strong);border-radius:var(--radius);
  text-align:center;background:var(--bg-elev);
  display:flex;flex-direction:column;align-items:center;gap:.85rem;
  transition:border-color var(--tween),background var(--tween);
}
.dropzone.is-drag{border-color:var(--accent);background:var(--accent-soft)}
.dz-hint{margin:0;color:var(--text-muted);font-size:.95rem}
.dz-small{margin:0;color:var(--text-soft);font-size:.75rem}

/* Preview */
.preview{margin-top:1rem;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--bg-elev)}
.preview img,.preview video{display:block;width:100%;max-height:480px;object-fit:contain;background:#000}
.preview-wrap{position:relative;display:block}
.face-overlay{
  position:absolute;top:0;left:0;
  width:100%;height:100%;
  pointer-events:none;
  object-fit:contain;
}
.preview-actions{
  display:flex;flex-wrap:wrap;gap:.5rem;padding:.75rem;
  border-top:1px solid var(--border);background:var(--bg-elev);
}
.btn-ic{
  display:inline-grid;place-items:center;
  width:20px;height:20px;flex-shrink:0;
  font-weight:900;font-size:.9rem;line-height:1;
}
.img-status{margin-top:.75rem;width:fit-content}

/* Webcam controls */
.webcam-controls{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}

/* Video progress */
.vid-progress{margin-top:1rem}
#vid-timeline{width:100%;max-width:820px;height:120px;display:block;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:.5rem}

/* Verdict */
.verdict{padding:.5rem 0}
.verdict-label{
  font-size:2rem;font-weight:900;letter-spacing:.05em;
  text-align:center;padding:1rem;margin-bottom:1rem;
  border-radius:var(--radius);background:var(--bg-elev);border:1px solid var(--border);
  color:var(--text-soft);
}
.verdict-label.is-real{color:var(--ok);border-color:var(--ok);background:var(--ok-soft)}
.verdict-label.is-fake{color:var(--danger);border-color:var(--danger);background:var(--danger-soft);animation:fakePulse 1.4s ease-in-out infinite}
.verdict-label.is-uncertain{color:var(--secondary);border-color:var(--secondary);background:rgba(93,212,247,0.10)}
@keyframes fakePulse{
  0%,100%{box-shadow:0 0 0 0 rgba(255,42,26,0.5)}
  50%{box-shadow:0 0 20px 5px rgba(255,42,26,0.35)}
}
@media (prefers-reduced-motion:reduce){.verdict-label.is-fake{animation:none}}

.verdict-scores{display:grid;gap:.75rem;margin-bottom:.75rem}
.score-row{display:grid;grid-template-columns:100px 1fr 60px;align-items:center;gap:.75rem}
.score-name{font-weight:700;font-size:.85rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}
.score-bar{height:12px;background:var(--bg-elev);border:1px solid var(--border);border-radius:999px;overflow:hidden}
.score-bar-fill{display:block;height:100%;width:0;border-radius:999px;transition:width .4s ease-out}
.score-real{background:linear-gradient(90deg,var(--ok),#8fff70)}
.score-fake{background:linear-gradient(90deg,var(--danger),var(--accent))}
.score-val{font-family:ui-monospace,monospace;font-weight:700;font-size:.9rem;color:var(--text);text-align:right}

.verdict-hint{color:var(--text-soft);font-size:.85rem;margin:.5rem 0 0;text-align:center;font-style:italic}

.stats{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem;justify-content:center}
.chip{
  padding:.3rem .7rem;border-radius:999px;font-size:.7rem;font-weight:700;
  font-family:ui-monospace,SFMono-Regular,monospace;letter-spacing:.05em;
  border:1px solid var(--border-strong);background:var(--bg-elev);color:var(--secondary);
}

/* Face list (multi-visages) */
.face-list{margin-top:1rem}
.face-list-title{
  font-size:1rem;margin:0 0 .5rem;color:var(--text);
  display:flex;align-items:center;gap:.5rem;
}
.face-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.6rem}
.face-card{
  display:flex;gap:.6rem;align-items:center;
  padding:.55rem .7rem;border-radius:var(--radius-sm);
  border:1px solid var(--border);background:var(--bg-elev);
  transition:border-color var(--tween),background var(--tween);
}
.face-card.is-real{border-color:var(--ok);background:var(--ok-soft)}
.face-card.is-fake{border-color:var(--danger);background:var(--danger-soft)}
.face-card.is-uncertain{border-color:var(--secondary);background:rgba(93,212,247,0.10)}
.face-thumb{
  width:64px;height:64px;flex-shrink:0;border-radius:6px;
  border:1px solid var(--border-strong);background:#000;object-fit:cover;
}
.face-meta{flex:1;min-width:0;display:grid;gap:.3rem}
.face-verdict{font-size:.82rem;color:var(--text-muted)}
.face-verdict strong{color:var(--text)}
.face-card.is-real .face-verdict strong{color:var(--ok)}
.face-card.is-fake .face-verdict strong{color:var(--danger)}
.face-card.is-uncertain .face-verdict strong{color:var(--secondary)}
.face-bars{display:grid;gap:.2rem}
.face-bar{display:grid;grid-template-columns:36px 1fr 36px;gap:.4rem;align-items:center;font-size:.7rem;font-family:ui-monospace,monospace}
.face-bar-name{color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.face-bar-track{height:6px;background:var(--bg-deep);border-radius:999px;overflow:hidden}
.face-bar-fill{display:block;height:100%;width:0;transition:width .3s ease-out}
.face-bar-real{background:linear-gradient(90deg,var(--ok),#8fff70)}
.face-bar-fake{background:linear-gradient(90deg,var(--danger),var(--accent))}
.face-bar-val{color:var(--text);text-align:right;font-weight:700}

/* Panneau EXIF / Métadonnées */
.exif-panel{
  margin-top:1rem;padding:1rem 1.15rem;
  border:1px solid var(--border);border-radius:var(--radius);
  background:var(--bg-elev);
}
.exif-title{
  font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text);margin:0 0 .6rem;font-weight:800;
}
.exif-fname{font-family:ui-monospace,monospace;color:var(--secondary);font-weight:600;font-size:.8rem;letter-spacing:.02em;text-transform:none}
.exif-flags{display:grid;gap:.4rem;margin-bottom:.75rem}
.exif-warn{
  padding:.5rem .75rem;border-radius:6px;font-size:.82rem;
  border-left:3px solid var(--text-soft);
}
.exif-warn.is-high{border-color:var(--danger);background:var(--danger-soft);color:var(--danger);font-weight:600}
.exif-warn.is-mid{border-color:var(--secondary);background:rgba(93,212,247,0.10);color:var(--text)}
.exif-grid{display:grid;grid-template-columns:1fr 1fr;gap:.35rem .75rem}
@media (max-width:640px){ .exif-grid{ grid-template-columns:1fr } }
.exif-row{
  display:grid;grid-template-columns:110px 1fr;gap:.5rem;
  padding:.35rem .55rem;border-radius:4px;background:var(--bg-deep);
  font-size:.78rem;
}
.exif-row.is-alert{border:1px solid var(--danger);background:var(--danger-soft)}
.exif-row.is-warn{border:1px solid var(--secondary);background:rgba(93,212,247,0.08)}
.exif-row.is-info{border:1px solid var(--ok);background:var(--ok-soft)}
.exif-row.is-info .exif-val{color:var(--ok);font-weight:600}
.exif-warn.is-info{border-color:var(--ok);background:var(--ok-soft);color:var(--ok);font-weight:600}
.exif-label{color:var(--text-soft);font-family:ui-monospace,monospace;font-weight:600;text-transform:uppercase;letter-spacing:.03em;font-size:.7rem;align-self:center}
.exif-val{color:var(--text);font-family:ui-monospace,monospace;word-break:break-word}
.exif-row.is-alert .exif-val{color:var(--danger);font-weight:700}
.exif-row.is-warn .exif-val{color:var(--secondary);font-weight:600}

/* Blind test */
.blind-hud{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin-bottom:.75rem;justify-content:center}
.blind-image-wrap{
  border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  background:#000;text-align:center;margin-bottom:.75rem;
}
#blind-img{display:block;width:100%;max-height:60vh;object-fit:contain}
.blind-actions{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.btn-guess{
  padding:1.2rem;font-size:1.15rem;font-weight:800;letter-spacing:.05em;
  border-width:2px;
}
.btn-guess-real{border-color:var(--ok);color:var(--ok);background:var(--ok-soft)}
.btn-guess-real:hover:not(:disabled){background:var(--ok);color:#001100}
.btn-guess-fake{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)}
.btn-guess-fake:hover:not(:disabled){background:var(--danger);color:#1a0000}
.blind-feedback{
  margin-top:.75rem;padding:.85rem 1rem;border-radius:var(--radius);
  border:2px solid var(--border);background:var(--bg-elev);
  animation:panelIn .25s ease-out both;
}
.blind-feedback.is-correct{border-color:var(--ok);background:var(--ok-soft)}
.blind-feedback.is-wrong{border-color:var(--danger);background:var(--danger-soft)}
.fb-title{font-size:1.1rem;font-weight:800;margin-bottom:.35rem}
.blind-feedback.is-correct .fb-title{color:var(--ok)}
.blind-feedback.is-wrong .fb-title{color:var(--danger)}
.fb-detail{font-size:.85rem;color:var(--text);margin-bottom:.15rem}
.blind-progress{margin-top:1rem}

/* Reverse search buttons */
.reverse-search-group{
  display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;
  padding:.35rem .6rem;border:1px solid var(--border);border-radius:999px;
  background:var(--bg-elev);
}
.rs-label{
  font-size:.7rem;color:var(--text-soft);font-family:ui-monospace,monospace;
  text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-right:.2rem;
}
.btn-small{
  padding:.35rem .6rem;font-size:.75rem;
  border-radius:6px;
}

/* Batch mode */
.batch-progress{margin-top:.75rem}
.batch-results{margin-top:.75rem}
.batch-toolbar{
  display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;
  padding:.5rem 0;
}
.batch-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-sm)}
.batch-table{width:100%;border-collapse:collapse;font-size:.8rem;background:var(--bg-elev)}
.batch-table th,.batch-table td{
  padding:.5rem .65rem;text-align:left;
  border-bottom:1px solid var(--border);vertical-align:middle;
}
.batch-table th{
  font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--text-soft);background:var(--bg-deep);font-weight:700;
}
.batch-table td.num,.batch-table th.num{text-align:right;font-family:ui-monospace,monospace}
.batch-table tr:last-child td{border-bottom:none}
.batch-table tr.is-real td{background:var(--ok-soft)}
.batch-table tr.is-fake td{background:var(--danger-soft)}
.batch-table tr.is-uncertain td{background:rgba(93,212,247,0.08)}
.batch-table tr.is-error td{background:rgba(255,42,26,0.04);color:var(--text-soft)}
.batch-thumb{
  width:40px;height:40px;object-fit:cover;
  border-radius:4px;border:1px solid var(--border);
  display:block;
}
.batch-thumb-err{
  display:grid;place-items:center;color:var(--danger);font-weight:900;
  background:var(--bg-deep);
}
.batch-name{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.batch-size{font-size:.65rem;color:var(--text-soft);font-family:ui-monospace,monospace;margin-top:.15rem}
.batch-err{
  font-size:.65rem;color:var(--danger);font-family:ui-monospace,monospace;
  margin-top:.15rem;font-weight:400;
}

/* Export controls */
.export-controls{
  margin-top:.75rem;padding:.75rem;
  border-top:1px solid var(--border);
  display:flex;flex-wrap:wrap;gap:.5rem;
}

/* ELA panel */
.ela-controls{margin-top:.75rem}
.ela-meta{font-size:.75rem;color:var(--text-muted);font-family:ui-monospace,monospace;margin-bottom:.35rem}
.ela-score{font-size:.85rem}
.ela-score.is-ok{color:var(--ok)}
.ela-score.is-mid{color:var(--secondary)}
.ela-score.is-warn{color:var(--accent)}
.ela-score.is-alert{color:var(--danger)}
.ela-canvas-wrap{
  margin-top:.5rem;border:1px solid var(--border);border-radius:6px;overflow:hidden;
  background:#000;
}
.ela-canvas{
  display:block;width:100%;max-height:480px;
  object-fit:contain;
}

/* Consensus box (bloc en haut de compare-results) */
.consensus-box{
  padding:1rem 1.25rem;margin-bottom:.75rem;
  border:2px solid var(--border-strong);border-radius:var(--radius);
  background:var(--bg-elev);
  animation:panelIn .35s cubic-bezier(.2,.8,.2,1) both;
}
.consensus-box.is-real{border-color:var(--ok);background:linear-gradient(135deg,var(--ok-soft),var(--bg-elev))}
.consensus-box.is-fake{border-color:var(--danger);background:linear-gradient(135deg,var(--danger-soft),var(--bg-elev))}
.consensus-box.is-uncertain{border-color:var(--secondary);background:linear-gradient(135deg,rgba(93,212,247,0.10),var(--bg-elev))}
.cons-title{
  font-size:.7rem;font-family:ui-monospace,monospace;color:var(--text-soft);
  letter-spacing:.15em;text-transform:uppercase;font-weight:700;margin-bottom:.4rem;
}
.cons-verdict{
  font-size:1.7rem;font-weight:900;letter-spacing:.03em;margin-bottom:.75rem;
  color:var(--text);
}
.consensus-box.is-real .cons-verdict{color:var(--ok)}
.consensus-box.is-fake .cons-verdict{color:var(--danger)}
.consensus-box.is-uncertain .cons-verdict{color:var(--secondary)}
.cons-bars{display:grid;gap:.4rem;margin-bottom:.6rem}
.cons-bar{display:grid;grid-template-columns:60px 1fr 60px;align-items:center;gap:.5rem;font-size:.82rem}
.cons-bar-name{font-family:ui-monospace,monospace;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.7rem}
.cons-bar-track{height:10px;background:var(--bg-deep);border-radius:999px;overflow:hidden;border:1px solid var(--border)}
.cons-bar-fill{display:block;height:100%;width:0;border-radius:999px;transition:width .5s ease-out}
.cons-bar-real{background:linear-gradient(90deg,var(--ok),#8fff70)}
.cons-bar-fake{background:linear-gradient(90deg,var(--danger),var(--accent))}
.cons-bar-val{font-family:ui-monospace,monospace;font-weight:700;text-align:right;font-size:.8rem}
.cons-conf{
  font-size:.72rem;color:var(--text-soft);font-family:ui-monospace,monospace;
  border-top:1px solid var(--border);padding-top:.55rem;
}
.cons-conf strong{color:var(--text)}
.consensus-box.conf-low .cons-conf strong{color:var(--danger)}
.consensus-box.conf-mid .cons-conf strong{color:var(--secondary)}
.consensus-box.conf-high .cons-conf strong{color:var(--ok)}

/* Mode comparaison — table 4 modèles */
.compare-block{margin-top:1rem}
.compare-results{margin-top:.75rem;overflow-x:auto}
.compare-table{
  width:100%;border-collapse:collapse;font-size:.85rem;
  background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius-sm);
  overflow:hidden;
}
.compare-table th,.compare-table td{
  padding:.55rem .75rem;text-align:left;
  border-bottom:1px solid var(--border);
}
.compare-table th{
  font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--text-soft);background:var(--bg-deep);font-weight:700;
}
.compare-table td.num,.compare-table th.num{text-align:right;font-family:ui-monospace,monospace}
.compare-table tr:last-child td{border-bottom:none}
.compare-table tr.is-active td{color:var(--text-muted)}
.compare-table tr.is-real td{background:var(--ok-soft)}
.compare-table tr.is-fake td{background:var(--danger-soft)}
.compare-table tr.is-uncertain td{background:rgba(93,212,247,0.08)}
.compare-table tr.is-error td{background:rgba(255,42,26,0.04);color:var(--text-soft)}
.compare-table .cmp-verdict{display:flex;align-items:center;gap:.4rem}
.compare-table .cmp-verdict .pi-icon{width:14px;height:14px;border-width:2px}
.compare-table tr.is-active .cmp-verdict .pi-icon{border-color:var(--accent);border-top-color:transparent;animation:spinIcon .8s linear infinite}
.compare-table tr.is-real .cmp-verdict .pi-icon{border-color:var(--ok);background:var(--ok)}
.compare-table tr.is-real .cmp-verdict .pi-icon::before{content:"";position:absolute;width:4px;height:7px;border:solid #001100;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-2px)}
.compare-table tr.is-fake .cmp-verdict .pi-icon{border-color:var(--danger);background:var(--danger)}
.compare-table tr.is-fake .cmp-verdict .pi-icon::before{content:"";position:absolute;width:8px;height:2px;background:#1a0000;transform:rotate(45deg)}
.compare-table tr.is-fake .cmp-verdict .pi-icon::after{content:"";position:absolute;width:8px;height:2px;background:#1a0000;transform:rotate(-45deg)}
.compare-table tr.is-uncertain .cmp-verdict .pi-icon{border-color:var(--secondary);background:var(--secondary)}
.compare-table tr.is-error .cmp-verdict .pi-icon{border-color:var(--danger);background:transparent}

@media (max-width:640px){
  .layout{padding:.75rem .75rem 3rem}
  .panel{padding:1rem 1.1rem}
  .topbar .brand{font-size:1.5rem}
  .score-row{grid-template-columns:80px 1fr 50px;gap:.5rem}
  .verdict-label{font-size:1.4rem}
}
