/* ================= Étape E9 : scénario CRS (HUD, radio, briefing, rapport, carte tactique) ================= */
body:not([data-scene="game"]) :is(#crs-radio, #crs-rapport, #crs-map) { display: none !important; }
/* le joueur CRS n'est pas « repéré » : la jauge laisse la place au HUD de section */
body.crs-on #hud-heat { display: none; }
#crs-hud { display: none; margin-top: calc(var(--u) * 2); padding-top: calc(var(--u) * 2); box-shadow: 0 calc(var(--u) * -1) 0 var(--hi); }
body.crs-on #crs-hud { display: block; }
#crs-hud .crs-head { display: flex; align-items: baseline; gap: calc(var(--u) * 2); white-space: nowrap; }
#crs-grade { color: var(--blue); font-size: calc(var(--u) * 4.2); }
#crs-sect { color: var(--dim); font-size: calc(var(--u) * 4); }
#crs-order { margin-left: auto; padding: 0 var(--u); font-size: calc(var(--u) * 3.6); background: #3b8f5a; color: #fff; box-shadow: 0 var(--u) 0 #1d4a2d; }
#crs-order[data-o="avancer"] { background: #c98a12; box-shadow: 0 var(--u) 0 #6a4806; }
#crs-order[data-o="charger"] { background: #d23a32; box-shadow: 0 var(--u) 0 #6d1712; animation: blink .4s steps(2) infinite; }
#crs-order[data-o="reculer"] { background: #4d6fb0; box-shadow: 0 var(--u) 0 #26375a; }
#crs-b-coh i { --c: #6ab8ff; } #crs-b-fat i { --c: #b48cff; } #crs-b-ten i { --c: #ff7a4e; }
#crs-hud .bar.mini span { font-size: calc(var(--u) * 3.2); }
.crs-row { display: flex; align-items: center; flex-wrap: wrap; gap: calc(var(--u) * 1.2); margin-top: calc(var(--u) * 1.5); font-size: calc(var(--u) * 3.8); color: var(--dim); }
.crs-row .t { font-size: calc(var(--u) * 3.2); color: var(--dim); margin-right: calc(var(--u) * .5); }
.crs-row b { color: var(--paper); font-family: 'Silk', monospace; font-weight: 400; font-size: calc(var(--u) * 3.4); margin: 0 calc(var(--u) * 2) 0 calc(var(--u) * .5); }
.crs-row em { font-style: normal; color: #7a6f8c; margin-right: calc(var(--u) * 2); }
.crs-row s { display: inline-block; width: calc(var(--u) * 2); height: calc(var(--u) * 3); background: #d8d8c0; box-shadow: 0 var(--u) 0 #8a8a70; text-decoration: none; }
.crs-row s.gmd { background: var(--orange); box-shadow: 0 var(--u) 0 #7a4a00; }
.crs-row s.off { background: var(--ink); box-shadow: none; }
.crs-row .som s { background: var(--ink); width: calc(var(--u) * 2.5); height: calc(var(--u) * 2.5); margin-right: calc(var(--u) * .6); box-shadow: none; }
.crs-row .som s.on { background: var(--sun); }
.crs-row .som.ok b { color: var(--green); }
.crs-row .cam { padding: 0 var(--u); font: calc(var(--u) * 3.2)/1.5 'Silk', monospace; color: var(--dim); box-shadow: inset 0 0 0 var(--u) var(--hi); }
.crs-row .cam.on { color: #fff; background: #a3161f; box-shadow: inset 0 0 0 var(--u) #4a080d; }
.crs-row .obs { padding: 0 var(--u); font: calc(var(--u) * 3.2)/1.5 'Silk', monospace; color: var(--ink); background: #ff9a8e; }
#crs-keys { display: none; margin-top: calc(var(--u) * 2); padding-top: calc(var(--u) * 2); box-shadow: 0 calc(var(--u) * -1) 0 var(--hi); }
#crs-keys b { color: var(--blue); }
body.crs-on #crs-keys { display: block; }

/* radio */
#crs-radio { left: 50%; top: calc(var(--u) * 18); transform: translateX(-50%); width: min(calc(var(--u) * 170), 60vw); display: none; padding: calc(var(--u) * 2) calc(var(--u) * 4); z-index: 6; font-size: calc(var(--u) * 4.2); background: #1b2236; }
#crs-radio.show { display: block; }
#crs-radio.alert { box-shadow: inset 0 0 0 var(--u) var(--ink), inset 0 0 0 calc(var(--u) * 2) #ffa62b; }
#crs-radio .rh { display: flex; align-items: center; gap: calc(var(--u) * 2); }
#crs-radio .rh .t { color: var(--blue); font-size: calc(var(--u) * 3.4); }
#crs-radio .rh i { width: calc(var(--u) * 2); height: calc(var(--u) * 2); background: var(--hi); }
#crs-radio .rh i.live { background: var(--orange); animation: blink .5s steps(2) infinite; }
#crs-radio .rl { color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#crs-radio .rl b { color: var(--blue); font-family: 'Silk', monospace; font-weight: 400; font-size: calc(var(--u) * 3.2); margin-right: var(--u); }
#crs-radio .rl.ordre { color: var(--paper); }
#crs-radio .rl.refus { color: #ffb4a8; } #crs-radio .rl.ok { color: var(--green); }
#crs-radio .crs-pend { margin-top: var(--u); color: var(--orange); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#crs-radio .crs-pend .t { font-size: calc(var(--u) * 3.4); margin-right: var(--u); }
#crs-radio .crs-pend.wait { color: var(--dim); animation: blink 1s steps(2) infinite; cursor: default; }
#crs-radio .crs-ans { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(var(--u) * 2); margin-top: calc(var(--u) * 1.5); }
#crs-radio .crs-ans button { text-align: left; font: calc(var(--u) * 3.8)/1.2 'Silk', monospace; padding: calc(var(--u) * 1.5) calc(var(--u) * 2); }
#crs-radio .crs-ans small { display: block; margin-top: var(--u); font: calc(var(--u) * 3.6)/1.1 'Pixelify', monospace; text-transform: none; color: #4a3f63; }

/* briefing */
#crs-brief { inset: calc(var(--u) * 6); display: none; z-index: 20; padding: calc(var(--u) * 5) calc(var(--u) * 7); background: #1b2236; overflow: auto; }
#crs-brief.show { display: flex; flex-direction: column; gap: calc(var(--u) * 2); }
#crs-brief .bf-head { display: flex; justify-content: space-between; font-size: calc(var(--u) * 3.6); color: var(--blue); }
#crs-brief .dim, #crs-rapport .dim, #crs-map .dim { color: var(--dim); }
#crs-brief h2 { color: var(--paper); }
#crs-brief .bf-who { color: var(--dim); } #crs-brief .bf-who b { color: var(--sun); font-weight: 400; }
#crs-brief .bf-cols { display: grid; grid-template-columns: auto 1fr; gap: calc(var(--u) * 6); align-items: start; }
#crs-brief .bf-map canvas, #crs-map canvas { image-rendering: pixelated; box-shadow: 0 0 0 var(--u) var(--ink), calc(var(--u) * 2) calc(var(--u) * 2) 0 var(--ink); display: block; }
#crs-brief .bf-map canvas { width: calc(var(--u) * 120 * 1.15); height: calc(var(--u) * 84 * 1.15); }
#crs-brief .bf-leg { margin-top: calc(var(--u) * 3); font-size: calc(var(--u) * 3.8); color: var(--dim); display: flex; gap: calc(var(--u) * 2); align-items: center; }
#crs-brief .bf-leg i { display: inline-block; width: calc(var(--u) * 3); height: calc(var(--u) * 3); }
#crs-brief .bf-leg i.z { background: #ffd60a; } #crs-brief .bf-leg i.a { background: #6ab8ff; } #crs-brief .bf-leg i.c { background: #ff5a4e; }
#crs-brief h3 { margin: calc(var(--u) * 2) 0 var(--u); font-size: calc(var(--u) * 4); color: var(--sun); font-weight: 400; }
#crs-brief ul { margin: 0; padding-left: calc(var(--u) * 5); font-size: calc(var(--u) * 4.4); line-height: 1.2; }
#crs-brief ul.rules li { color: #c8d8ff; }
#crs-brief .bf-affs { display: grid; gap: calc(var(--u) * 2); }
#crs-brief .bf-affs button { text-align: left; display: grid; grid-template-columns: auto 1fr; column-gap: calc(var(--u) * 2); background: var(--bg2); color: var(--paper); padding: calc(var(--u) * 2) calc(var(--u) * 3); }
#crs-brief .bf-affs button kbd { grid-row: span 3; align-self: center; }
#crs-brief .bf-affs button b { font-weight: 400; color: var(--sun); }
#crs-brief .bf-affs button small, #crs-brief .bf-affs button em { font: calc(var(--u) * 3.8)/1.2 'Pixelify', monospace; text-transform: none; color: var(--dim); font-style: normal; }
#crs-brief .bf-affs button em { color: #c8d8ff; }
#crs-brief .bf-affs button.sel { background: #3d3456; box-shadow: inset 0 0 0 var(--u) var(--sun), 0 var(--u) 0 var(--ink); }
#crs-brief .bf-foot, #crs-rapport .rp-foot { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: calc(var(--u) * 3); }
#crs-brief .go, #crs-rapport .go { font-size: calc(var(--u) * 5); padding: calc(var(--u) * 2) calc(var(--u) * 5); }

/* rapport */
#crs-rapport { left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(calc(var(--u) * 230), 94vw); max-height: 92vh; overflow: auto; display: none; z-index: 20; padding: calc(var(--u) * 5) calc(var(--u) * 7); background: #241f2e; }
#crs-rapport.show { display: flex; flex-direction: column; gap: calc(var(--u) * 2); }
#crs-rapport .rp-head { display: flex; justify-content: space-between; font-size: calc(var(--u) * 3.6); color: var(--blue); }
#crs-rapport .rp-item { padding: calc(var(--u) * 2) calc(var(--u) * 3); background: #2b2538; box-shadow: inset 0 0 0 var(--u) var(--ink); }
#crs-rapport .rp-item.cur { box-shadow: inset 0 0 0 var(--u) var(--sun); }
#crs-rapport .rp-t { display: flex; gap: calc(var(--u) * 3); align-items: baseline; margin-bottom: var(--u); }
#crs-rapport .rp-t .t { color: var(--sun); font-size: calc(var(--u) * 3.6); flex: none; }
#crs-rapport .rp-t .vrai { color: #c8d8ff; font-size: calc(var(--u) * 4.2); }
#crs-rapport .rp-item button { display: block; width: 100%; text-align: left; margin-top: var(--u); font: calc(var(--u) * 4.2)/1.2 'Pixelify', monospace; background: var(--bg2); color: var(--paper); padding: var(--u) calc(var(--u) * 2); }
#crs-rapport .rp-item button.sel { background: var(--paper); color: var(--ink); }
#crs-rapport .rp-item button.e2.sel { background: #ffb4a8; }
#crs-rapport .rp-res { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(var(--u) * 3); }
#crs-rapport .rp-res div { background: #2b2538; padding: calc(var(--u) * 2) calc(var(--u) * 3); box-shadow: inset 0 0 0 var(--u) var(--ink); }
#crs-rapport .rp-res .t { display: block; color: var(--dim); font-size: calc(var(--u) * 3.4); }
#crs-rapport .rp-res b { font: calc(var(--u) * 9)/1.1 'Silk', monospace; color: var(--sun); font-weight: 400; }
#crs-rapport .rp-res small { display: block; color: var(--dim); }
#crs-rapport ul { margin: 0; padding-left: calc(var(--u) * 5); }
#crs-rapport li.bad { color: #ffb4a8; } #crs-rapport li.good { color: var(--green); }
#crs-rapport h3 { color: var(--sun); font-weight: 400; margin: calc(var(--u) * 2) 0 0; font-size: calc(var(--u) * 4); }

/* carte tactique */
#crs-map { left: 50%; top: 50%; transform: translate(-50%, -50%); display: none; z-index: 20; padding: calc(var(--u) * 4) calc(var(--u) * 5); background: #1b2236; }
#crs-map.show { display: flex; flex-direction: column; gap: calc(var(--u) * 2); }
#crs-map .mp-head { display: flex; justify-content: space-between; gap: calc(var(--u) * 6); color: var(--blue); font-size: calc(var(--u) * 3.8); }
#crs-map canvas { width: calc(var(--u) * 120 * 1.6); height: calc(var(--u) * 84 * 1.6); cursor: crosshair; }
#crs-map .mp-foot { display: flex; gap: calc(var(--u) * 3); align-items: center; font-size: calc(var(--u) * 3.8); color: var(--dim); }

/* ---------- (crs2) munitions, image, sections, radio à deux voix, outils de la carte ---------- */
.crs-row s.lbd { background: #e8eefc; box-shadow: 0 var(--u) 0 #6a7590; width: calc(var(--u) * 1.4); }
.crs-row s.gm2l { background: #9ad06a; box-shadow: 0 var(--u) 0 #4a6a2a; }
.crs-row s.main { background: #c8d0a0; box-shadow: 0 var(--u) 0 #6a7040; }
.crs-row b.bad { color: #ff7a6e; } .crs-row b.good { color: var(--green); }
#crs-b-peur i { --c: #e0524a; }
#crs-sects { margin-top: calc(var(--u) * 1.5); font-size: calc(var(--u) * 3.4); color: var(--dim); }
#crs-sects .crs-sh { display: flex; align-items: center; gap: calc(var(--u) * 1.2); margin: calc(var(--u) * .8) 0; }
#crs-sects .crs-sh .t { font-size: calc(var(--u) * 3.2); }
#crs-sects .crs-sh small { font-size: calc(var(--u) * 3); color: #7a6f8c; }
#crs-sects .crs-sh b { color: var(--paper); font-family: 'Silk', monospace; font-weight: 400; margin-right: calc(var(--u) * 2); }
#crs-sects .crs-sect { display: grid; grid-template-columns: calc(var(--u) * 4) calc(var(--u) * 6) 1fr 1fr calc(var(--u) * 6); align-items: center; gap: calc(var(--u) * 1.2); padding: calc(var(--u) * .4) var(--u); }
#crs-sects .crs-sect.sel { background: rgba(255, 214, 10, .14); }
#crs-sects .crs-sect b { font-family: 'Silk', monospace; font-weight: 400; color: var(--sun); }
#crs-sects .crs-sect i, #crs-sects .crs-sect em { font-style: normal; color: var(--paper); }
#crs-sects .mb { height: calc(var(--u) * 1.6); background: var(--ink); position: relative; }
#crs-sects .mb u { position: absolute; left: 0; top: 0; bottom: 0; background: #ffb03a; }
#crs-sects .mb.coh u { background: var(--green); }
#crs-sects .mb u.hot { background: #ff5a4e; }
#crs-radio .rl.civ b { color: #ffd27a; }
#crs-radio .crs-pend.dual { color: #ffd27a; white-space: normal; }
#crs-map .mp-foot { flex-wrap: wrap; }
#crs-mp-tools { display: flex; flex-wrap: wrap; gap: var(--u); max-width: calc(var(--u) * 190); }
#crs-mp-tools button { font: calc(var(--u) * 3.2)/1.2 'Silk', monospace; padding: calc(var(--u) * .8) calc(var(--u) * 1.4); }
#crs-mp-tools button.sel { background: var(--sun); color: var(--ink); }

/* ---------- (crs2) mode libre « Maintien de l'ordre » ---------- */
#mt-hud { position: fixed; right: calc(var(--u) * 4); top: calc(var(--u) * 26); width: calc(var(--u) * 70); display: none; pointer-events: none; z-index: 3; padding: calc(var(--u) * 2.5) calc(var(--u) * 3);
  background: #1b2236; box-shadow: 0 0 0 var(--u) #0d1018, inset 0 0 0 var(--u) #2c4a7a; color: var(--paper); font-size: calc(var(--u) * 3.6); }
#mt-hud.show { display: block; }
body:not([data-scene="game"]) #mt-hud { display: none !important; }
#mt-hud .mt-t { font: calc(var(--u) * 3.8)/1.2 'Silk', monospace; color: var(--blue); margin-bottom: calc(var(--u) * 1.5); }
#mt-hud .mt-r { display: flex; justify-content: space-between; margin: calc(var(--u) * .6) 0; color: var(--dim); }
#mt-hud .mt-r b { font-family: 'Silk', monospace; font-weight: 400; color: var(--paper); }
#mt-hud .mt-r b.good { color: var(--green); } #mt-hud .mt-r b.bad { color: #ff7a6e; } #mt-hud .mt-r b.sun { color: var(--sun); }
#maintien-box { width: calc(var(--u) * 170); }
#maintienfin-box { width: calc(var(--u) * 180); }
#maintienfin-box h2.win { color: var(--sun); } #maintienfin-box h2.lose { color: #ffb3a8; }
.mt-table tr.neg td:nth-child(3) { color: #ff9a8e; }
#maintienfin-box small { color: var(--dim); }

/* ---------- (crsjeu) tuto de l'infiltré en civil (sim/infiltre.js) ---------- */
#infil-tuto { position: fixed; left: 50%; top: calc(var(--u, 4px) * 30); transform: translateX(-50%) translateY(calc(var(--u, 4px) * -3)); z-index: 40;
  width: min(92vw, calc(var(--u, 4px) * 150)); background: #141018ee; color: #fff3d6; padding: calc(var(--u, 4px) * 3) calc(var(--u, 4px) * 4);
  box-shadow: 0 0 0 var(--u, 4px) #ffd60a, 0 0 0 calc(var(--u, 4px) * 2) #141018; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; cursor: pointer;
  font: calc(var(--u, 4px) * 3.2)/1.35 Silk, monospace; }
#infil-tuto.show { opacity: 1; pointer-events: auto; transform: translateX(-50%); }
#infil-tuto h3 { margin: 0 0 calc(var(--u, 4px) * 2); color: #ffd60a; font-size: calc(var(--u, 4px) * 4.4); letter-spacing: .04em; }
#infil-tuto .it-r { display: flex; gap: calc(var(--u, 4px) * 2); margin: calc(var(--u, 4px) * .8) 0; }
#infil-tuto .it-r b { flex: 0 0 calc(var(--u, 4px) * 24); color: #9ec3ff; }
#infil-tuto .it-f { margin-top: calc(var(--u, 4px) * 2); color: #7ee081; font-size: .9em; }
#infil-tuto kbd { background: #2a2433; color: #fff; padding: 0 calc(var(--u, 4px) * .8); border-radius: 2px; }

/* ---------- (crsjeu) fil de la journée, feuille de service, bilan de service (crs/actions.js) ---------- */
.bc-crs-fil { margin-top: calc(var(--u, 4px) * 1); font-size: .82em; opacity: .9; }
.bc-crs-fil .cf-pips { display: inline-flex; gap: 2px; vertical-align: middle; }
.bc-crs-fil .cf-pips i { width: calc(var(--u, 4px) * 1.6); height: calc(var(--u, 4px) * 1.6); background: #3a3346; display: inline-block; }
.bc-crs-fil .cf-pips i.fait { background: #7ee081; } .bc-crs-fil .cf-pips i.rate { background: #ff5a4e; }
.bc-crs-fil .cf-pips i.cur { background: #ffd60a; box-shadow: 0 0 0 1px #fff3d6; }
.bc-pourquoi { font-size: .76em; opacity: .75; margin-top: calc(var(--u, 4px) * .6); font-style: italic; }
#crs-feuille { position: fixed; right: calc(var(--u, 4px) * 6); top: calc(var(--u, 4px) * 24); z-index: 40; width: min(88vw, calc(var(--u, 4px) * 110));
  background: #141018ee; color: #fff3d6; padding: calc(var(--u, 4px) * 3) calc(var(--u, 4px) * 4); box-shadow: 0 0 0 var(--u, 4px) #9ec3ff, 0 0 0 calc(var(--u, 4px) * 2) #141018;
  opacity: 0; pointer-events: none; transform: translateX(calc(var(--u, 4px) * 6)); transition: opacity .3s, transform .3s; cursor: pointer; font: calc(var(--u, 4px) * 3)/1.3 Silk, monospace; }
#crs-feuille.show { opacity: 1; pointer-events: auto; transform: none; }
#crs-feuille .cf-sur { color: #9ec3ff; letter-spacing: .08em; font-size: .9em; }
#crs-feuille h3 { margin: calc(var(--u, 4px) * 1) 0; color: #ffd60a; }
#crs-feuille .cf-pied { margin-top: calc(var(--u, 4px) * 2); opacity: .7; font-size: .85em; }
.crs-fil { list-style: none; padding: 0; margin: 0; }
.crs-fil li { margin: calc(var(--u, 4px) * .9) 0; }
.crs-fil li b { display: inline-block; width: 1.3em; color: #9ec3ff; }
.crs-fil li.fait b { color: #7ee081; } .crs-fil li.rate b { color: #ff5a4e; } .crs-fil li.cours { color: #ffd60a; }
.crs-fil li small { display: block; margin-left: 1.3em; opacity: .7; font-size: .82em; }
.crs-fil-pause { margin-top: calc(var(--u, 4px) * 3); max-height: 40vh; overflow-y: auto; }
.crs-service { display: grid; grid-template-columns: auto 1fr; gap: calc(var(--u, 4px) * 2) calc(var(--u, 4px) * 4); align-items: start; margin-bottom: calc(var(--u, 4px) * 3); }
.crs-service .cs-note { display: flex; align-items: center; gap: calc(var(--u, 4px) * 2); }
.crs-service .cs-note b { font-size: 3em; line-height: 1; color: #ffd60a; }
.crs-service .cs-note.nA b, .crs-service .cs-note.nB b { color: #7ee081; } .crs-service .cs-note.nD b, .crs-service .cs-note.nE b { color: #ff5a4e; }
.crs-service .cs-note span small { display: block; opacity: .7; }
.crs-service .cs-v { display: grid; grid-template-columns: 11em 8em 1fr; gap: calc(var(--u, 4px) * 2); align-items: center; margin: 2px 0; }
.crs-service .cs-b { display: block; height: calc(var(--u, 4px) * 1.6); background: #3a3346; }
.crs-service .cs-b u { display: block; height: 100%; background: #ffd60a; }
.crs-service .cs-b u.good { background: #7ee081; } .crs-service .cs-b u.bad { background: #ff5a4e; }
.crs-service .cs-v small { opacity: .75; }
.crs-service .cs-deb { grid-column: 1 / -1; padding: calc(var(--u, 4px) * 2); box-shadow: 0 0 0 2px #7ee081 inset; }
.crs-service .cs-deb b { display: block; color: #7ee081; margin-bottom: calc(var(--u, 4px) * 1); }
@media (max-width: 640px) { .crs-service { grid-template-columns: 1fr; } .crs-service .cs-v { grid-template-columns: 1fr 6em; } .crs-service .cs-v small { grid-column: 1 / -1; } }