/* ================= Manette et touches (input/gamepad.js, input/keys-ui.js) ================= */
/* boutons de manette : kbd colorés, sans coins arrondis */
kbd.pad { min-width: calc(var(--u) * 6); }
kbd.pad.pa { background: #7ee081; box-shadow: 0 var(--u) 0 #2f6a3e; }
kbd.pad.pb { background: #ff8a7e; box-shadow: 0 var(--u) 0 #7a2a2e; }
kbd.pad.px-x { background: #8ac8ff; box-shadow: 0 var(--u) 0 #2a4a7a; }
kbd.pad.py { background: #ffe066; box-shadow: 0 var(--u) 0 #7a6010; }
kbd.pad.pg { background: #d8d0c0; box-shadow: 0 var(--u) 0 #6a6050; }
#menu .opt kbd.pad { background: #8ac8ff; }

/* indicateur « manette connectée » */
#pad-ind { right: calc(var(--u) * 4); top: calc(var(--u) * 4); display: none; align-items: center; gap: calc(var(--u) * 2); padding: calc(var(--u) * 1.5) calc(var(--u) * 3); z-index: 20; }
#pad-ind.show { display: flex; }
#pad-ind canvas { image-rendering: pixelated; width: calc(var(--u) * 13); height: calc(var(--u) * 8); }
#pad-ind span { font-size: calc(var(--u) * 3.6); color: var(--dim); }
body.pad-active #pad-ind span { color: var(--sun); }
/* en partie, l'alarme (en haut à droite) passe sous l'indicateur */
body.pad-on #alarm { top: calc(var(--u) * 17); }

/* sélection à la manette (dialogues, garde à vue, préparation) */
.pad-sel { outline: var(--u) solid var(--sun) !important; outline-offset: calc(var(--u) * -1); background: var(--hi) !important; }
#prep .pad-sel { outline-offset: 0; }

/* curseur virtuel (sac, carte tactique) */
#pad-cursor { position: fixed; left: 0; top: 0; width: 0; height: 0; display: none; pointer-events: none; z-index: 60; }
#pad-cursor.show { display: block; }
#pad-cursor::before, #pad-cursor::after { content: ''; position: absolute; background: var(--sun); box-shadow: 0 0 0 var(--u) var(--ink); }
#pad-cursor::before { left: calc(var(--u) * -4); top: calc(var(--u) * -.5); width: calc(var(--u) * 9); height: var(--u); }
#pad-cursor::after { top: calc(var(--u) * -4); left: calc(var(--u) * -.5); height: calc(var(--u) * 9); width: var(--u); }

/* écran « Touches et manette » */
#keys-box { max-height: calc(100vh - var(--u) * 10); overflow-y: auto; width: min(calc(var(--u) * 230), 94vw); scrollbar-width: none; }
#keys-box::-webkit-scrollbar { display: none; }
#keys-box .sub { font-size: calc(var(--u) * 3.8); line-height: 1.5; }
#keys-box .kb-h { margin: calc(var(--u) * 4) 0 calc(var(--u) * 2); font-size: calc(var(--u) * 4.4); }
.kb-row { padding: calc(var(--u) * 1.2) calc(var(--u) * 3); }
.kb-row > span:first-child { font: calc(var(--u) * 4.4)/1.25 'Pixelify', monospace; text-transform: none; }
.kb-row.fixed { opacity: .55; cursor: default; }
.kb-row.custom .kb-val > kbd:first-child { background: var(--sun); }
.kb-row.conflict { box-shadow: inset 0 0 0 var(--u) var(--ink), inset calc(var(--u) * 2) 0 0 0 var(--red); }
.kb-val { display: flex; align-items: center; gap: var(--u); justify-content: flex-end; }
.kb-val kbd { margin-right: 0; }
.kb-val kbd.alt { opacity: .6; }
.kb-pad { margin-left: calc(var(--u) * 3); }
.kb-pad kbd { font-size: calc(var(--u) * 3.4); }
.kb-wait { color: var(--sun); font: calc(var(--u) * 3.8)/1 'Silk', monospace; animation: blink .6s steps(2) infinite; }
.kb-bad { color: var(--red) !important; }
.kb-msg { margin-bottom: calc(var(--u) * 2); color: var(--green); font-size: calc(var(--u) * 4.2); }
.kb-msg.bad { color: var(--red); }
