/* ================= E10 : jauges des scénarios Gilets jaunes et Casseur, fin de campagne ================= */
/* une ligne de plus sous l'objectif de mission (en haut au centre) */
#hud-mission { flex-wrap: wrap; justify-content: center; row-gap: calc(var(--u) * 1); }
#hud-mission .e10-hud { flex-basis: 100%; display: flex; justify-content: center; align-items: center; gap: calc(var(--u) * 2.5);
  font-size: calc(var(--u) * 4.2); color: #e8dcc0; white-space: nowrap; border-top: var(--u) solid #2e2740; padding-top: calc(var(--u) * 1.2); }
.e10-hud .e10-k { font-family: 'Silk', monospace; font-size: calc(var(--u) * 3.6); color: #ffd60a; letter-spacing: .05em; }
.e10-hud .e10-k.hot, .e10-hud .e10-n.hot { color: #ff6a5a; }
.e10-hud.chase { animation: e10blink .5s steps(2) infinite; }
@keyframes e10blink { 50% { color: #ffb4a8; } }
.e10-hud .e10-n { color: #fff3d6; }
.e10-bar { display: inline-flex; gap: 1px; font-style: normal; }
.e10-bar b, .e10-bar u { display: inline-block; width: calc(var(--u) * 2); height: calc(var(--u) * 3); background: #ffd60a; text-decoration: none; }
.e10-bar u { background: #3a3150; }
.e10-bar.hi b { background: #7ee081; }
.e10-bar.lo b { background: #ff6a5a; }

/* fin de campagne (scène `fin`, ui/fin.js) */
#sc-fin .shade { background: rgba(14, 10, 22, .78); }
#fin-box { width: min(92vw, calc(var(--u) * 260)); max-height: 88vh; overflow: auto; padding: calc(var(--u) * 6) calc(var(--u) * 8); }
#fin-box .fin-kicker { font-family: 'Silk', monospace; color: #ffd60a; font-size: calc(var(--u) * 4); letter-spacing: .08em; }
#fin-box h2 { font-size: calc(var(--u) * 10); margin: calc(var(--u) * 2) 0 calc(var(--u) * 3); color: #fff3d6; }
#fin-box h2.bad { color: #ff8a7a; } #fin-box h2.good { color: #7ee081; }
#fin-box .fin-texte { font-size: calc(var(--u) * 5.2); line-height: 1.45; color: #e8dcc0; }
#fin-box .fin-texte p { margin: 0 0 calc(var(--u) * 3); }
#fin-box .fin-lignes { list-style: none; padding: 0; margin: calc(var(--u) * 3) 0; display: grid; gap: calc(var(--u) * 1.5); }
#fin-box .fin-lignes li { font-size: calc(var(--u) * 4.6); padding-left: calc(var(--u) * 5); position: relative; color: #d8ccb0; }
#fin-box .fin-lignes li::before { content: ''; position: absolute; left: 0; top: .45em; width: calc(var(--u) * 2.4); height: calc(var(--u) * 2.4); background: #ffd60a; }
#fin-box .fin-lignes li.bad::before { background: #ff6a5a; } #fin-box .fin-lignes li.good::before { background: #7ee081; }
#fin-box .fin-stats { display: flex; flex-wrap: wrap; gap: calc(var(--u) * 3); margin: calc(var(--u) * 3) 0; }
#fin-box .fin-stats div { background: #241d34; border: var(--u) solid #141018; padding: calc(var(--u) * 1.5) calc(var(--u) * 3); }
#fin-box .fin-stats span { display: block; font-size: calc(var(--u) * 3.4); color: #a89cc0; }
#fin-box .fin-stats b { font-size: calc(var(--u) * 6); color: #fff3d6; }
#fin-box .fin-autres { font-size: calc(var(--u) * 4); color: #8a7ea4; margin-top: calc(var(--u) * 3); }
#fin-box .fin-autres b { color: #b8acd0; }
#fin-box canvas.fin-cv { float: right; margin: 0 0 calc(var(--u) * 3) calc(var(--u) * 5); image-rendering: pixelated; border: var(--u) solid #141018; }