/* ============================================================
   GAMORD — feuille de style militaire (menus, boutique, HUD DOM)
   ============================================================ */
:root{
  --fond:#12150d; --panneau:#1c2114; --bord:#39422b; --texte:#d9ddc7;
  --ambre:#ffb454; --vert:#a4d65e; --rouge:#e0483e; --gris:#8a917a;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%;overflow:hidden;background:var(--fond);
  font-family:'Saira Condensed','Arial Narrow',Arial,sans-serif;color:var(--texte);
  overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
#jeu{position:fixed;inset:0;display:block;cursor:none;touch-action:none}

/* ---------- Boutons tactiles ---------- */
#padBtns{position:fixed;right:10px;top:80px;bottom:auto;z-index:25;display:none;
  flex-direction:column;gap:10px;align-items:flex-end}
body.tactile #padBtns{display:flex}
#padBtns>button{width:60px;height:60px;border-radius:50%;border:2px solid #4a5535;
  background:rgba(20,24,12,.78);color:#ffd894;font-size:26px;line-height:1;cursor:pointer;
  touch-action:manipulation}
#padBtns>button:active{background:var(--ambre);color:#191204}
#padBtns .slots{display:flex;gap:8px}
#padBtns .slots button{width:44px;height:44px;border-radius:50%;border:2px solid #4a5535;
  background:rgba(20,24,12,.78);color:#d9ddc7;font-family:'Black Ops One',Impact,sans-serif;
  font-size:18px;cursor:pointer;touch-action:manipulation}
#padBtns .slots button.actif{background:var(--ambre);color:#191204;border-color:var(--ambre)}
#padBtns button.dispo{border-color:var(--vert);box-shadow:0 0 12px rgba(164,214,94,.7)}
@media (max-width:560px){
  .grille-cmd{grid-template-columns:1fr}
  .coins-hd button{font-size:12px;padding:3px 8px}
}
/* Paysage (téléphone couché) : boutons plus petits pour ne rien chevaucher */
@media (max-height:540px){
  #padBtns{gap:6px;top:80px}
  #padBtns>button{width:46px;height:46px;font-size:20px}
  #padBtns .slots{gap:6px}
  #padBtns .slots button{width:36px;height:36px;font-size:15px}
  .boite{padding:14px 20px}
  h1{font-size:clamp(24px,8vw,40px)}
  .tag{margin:4px 0 8px}
  .briefing{font-size:14px;margin:6px 0 10px}
  .grille-cmd{font-size:14px;gap:4px 18px;margin:4px 0 12px}
  .btn{font-size:16px;padding:10px 22px}
  .petit{margin-top:8px}
}
.coupe{clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
/* Écrans (menu, pause, boutique, fin) : défilables sur petit écran.
   Le centrage vient de margin:auto sur .boite — centré si ça tient,
   défilable sinon (le bouton Jouer reste toujours atteignable). */
.ecran{position:fixed;inset:0;display:flex;overflow-y:auto;padding:16px 0;
  -webkit-overflow-scrolling:touch;
  background:radial-gradient(ellipse at center,rgba(14,17,9,.86),rgba(8,10,5,.95));z-index:20}
/* Le classement s'ouvre PAR-DESSUS l'écran de fin (« Voir le classement ») :
   sans ce z-index supérieur, il restait derrière l'écran de mort. */
#classementEcran{z-index:24}
.cache{display:none!important}
.boite{background:var(--panneau);border:1px solid var(--bord);padding:26px 34px;max-width:760px;width:min(92vw,760px);
  margin:auto;box-shadow:0 0 0 1px #0a0c06,0 18px 60px rgba(0,0,0,.6)}
h1{font-family:'Black Ops One',Impact,'Arial Black',sans-serif;font-size:clamp(34px,6vw,60px);
  letter-spacing:.1em;color:var(--ambre);text-transform:uppercase;line-height:1.05}
.tag{display:inline-block;margin:8px 0 16px;padding:2px 12px;border:1px solid var(--bord);color:var(--gris);
  letter-spacing:.35em;font-size:13px;text-transform:uppercase}
.briefing{border-left:3px solid var(--ambre);padding:8px 14px;margin:10px 0 18px;color:#c4c9b2;font-size:17px;line-height:1.45}
.grille-cmd{display:grid;grid-template-columns:1fr 1fr;gap:6px 26px;margin:6px 0 20px;font-size:16px}
.grille-cmd div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed #2c3320;padding:3px 0}
/* Tutoriel adapté au périphérique : clavier par défaut, tactile si détecté */
#cmdTactile{display:none}
body.tactile #cmdTactile{display:grid}
body.tactile #cmdClavier{display:none}
kbd{font-family:inherit;font-weight:700;background:#262d1a;border:1px solid #4a5535;border-bottom-width:3px;
  border-radius:4px;padding:0 8px;color:var(--ambre);min-width:30px;text-align:center;display:inline-block}
.btn{font-family:'Black Ops One',Impact,sans-serif;font-size:20px;letter-spacing:.12em;cursor:pointer;
  background:var(--ambre);color:#191204;border:none;padding:14px 34px;text-transform:uppercase;
  transition:transform .08s, background .12s}
.btn:hover{background:#ffc678;transform:translateY(-2px)}
.btn:active{transform:translateY(1px)}
.btn.rouge{background:var(--rouge);color:#fff}
.btn.rouge:hover{background:#f0655b}
.petit{color:var(--gris);font-size:14px;margin-top:14px;letter-spacing:.05em}

/* ---------- Boutique ---------- */
#boutique .boite{max-width:960px;width:min(94vw,960px);max-height:92vh;overflow:auto}
.btq-tete{display:flex;justify-content:space-between;align-items:baseline;gap:16px;border-bottom:1px solid var(--bord);
  padding-bottom:10px;margin-bottom:14px;flex-wrap:wrap}
.btq-tete h2{font-family:'Black Ops One',Impact,sans-serif;color:var(--ambre);font-size:30px;letter-spacing:.08em}
#btq-argent{font-size:28px;font-weight:700;color:var(--vert)}
.btq-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.article{background:#202616;border:1px solid #2f3722;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.article .haut{display:flex;align-items:center;gap:10px}
.article .ico{font-size:26px;filter:saturate(.85)}
.article .nom{font-weight:700;font-size:18px;letter-spacing:.03em}
.article .niv{color:var(--ambre);letter-spacing:2px;font-size:13px}
.article .desc{color:#aab096;font-size:14px;line-height:1.35;flex:1}
.article .acheter{align-self:stretch;background:none;border:1px solid var(--ambre);color:var(--ambre);
  font-family:inherit;font-weight:700;font-size:16px;padding:6px;cursor:pointer;letter-spacing:.05em}
.article .acheter:hover:not([disabled]){background:var(--ambre);color:#191204}
.article .acheter[disabled]{border-color:#3a3f2c;color:#6e745c;cursor:not-allowed}
.btq-pied{margin-top:14px;color:var(--gris);font-size:14px;letter-spacing:.06em;text-align:center}

/* ---------- Pseudo + classement ---------- */
.podium-bloc{margin:0 0 16px;border:1px solid #2c3320;background:#161a10;padding:10px 14px}
.podium-ligne{display:flex;gap:10px;align-items:baseline;font-size:15.5px;padding:2px 0;border-bottom:1px dashed #22271a}
.podium-ligne:last-child{border-bottom:none}
.podium-ligne .pod-rang{width:30px;color:var(--gris)}
.podium-ligne .pod-pseudo{font-weight:700;color:#ffd894;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.podium-ligne .pod-score{color:#c4c9b2;white-space:nowrap}
.podium-ligne .pod-date{color:#6e745c;font-size:12.5px;white-space:nowrap}
.podium-vide{color:#5d644c;font-size:14px;margin:0}

/* ---------- Sélecteur de difficulté ---------- */
.pseudo-bloc{margin:0 0 16px}
#pseudoInput{width:100%;font-family:'Black Ops One',Impact,sans-serif;font-size:18px;letter-spacing:.1em;
  background:#202616;border:2px solid #3a4230;color:var(--ambre);padding:10px 14px;
  text-transform:uppercase;outline:none;border-radius:0}
#pseudoInput:focus{border-color:var(--ambre)}
#pseudoInput::placeholder{color:#4d5340}
.boutons-ligne{display:flex;gap:10px;flex-wrap:wrap}
.btn.secondaire{background:#202616;color:var(--ambre);border:2px solid var(--ambre);font-size:16px;padding:12px 20px}
.btn.secondaire:hover{background:var(--ambre);color:#191204}
.clq-niveau{margin-bottom:16px}
.clq-niveau h3{font-family:'Black Ops One',Impact,sans-serif;font-size:17px;letter-spacing:.08em;margin:0 0 6px}
.clq-vide{color:#5d644c;font-size:14px;margin:0}
.clq-table{width:100%;border-collapse:collapse;font-size:15px}
.clq-table th{color:var(--gris);text-align:left;font-weight:600;padding:2px 6px;border-bottom:1px solid var(--bord);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.clq-table td{padding:3px 6px;border-bottom:1px dashed #262d1a}
.clq-table td.rang{width:34px;color:var(--gris)}
.clq-table td.date{color:var(--gris);font-size:13px;white-space:nowrap}
@media (max-width:560px){
  .clq-table{font-size:13px}
  .clq-table td.date{font-size:11px}
}

/* ---------- Sélecteur de difficulté ---------- */
.diff-bloc{margin:4px 0 18px}
.diff-titre{font-size:13px;letter-spacing:.3em;color:var(--gris);text-transform:uppercase;margin-bottom:8px}
.diff-choix{display:flex;gap:8px}
.diff-btn{flex:1;font-family:'Black Ops One',Impact,sans-serif;font-size:14.5px;letter-spacing:.04em;
  background:#202616;border:1px solid #3a4230;color:var(--texte);
  padding:10px 6px;cursor:pointer;text-transform:uppercase;transition:all .1s}
.diff-btn:hover{border-color:var(--ambre);color:var(--ambre)}
.diff-btn.choisi{background:var(--ambre);color:#191204;border-color:var(--ambre)}
.diff-desc{margin-top:8px;color:#aab096;font-size:14px;line-height:1.35;min-height:19px}
.lien-menu{background:none;border:none;color:var(--gris);font-family:inherit;font-size:15px;
  cursor:pointer;text-decoration:underline;letter-spacing:.04em}
.lien-menu:hover{color:var(--ambre)}

/* ---------- Divers ---------- */
.stats-fin{display:flex;gap:26px;justify-content:center;margin:18px 0;flex-wrap:wrap}
.stats-fin div{text-align:center}
.stats-fin .val{font-family:'Black Ops One',Impact,sans-serif;font-size:34px;color:var(--ambre)}
.stats-fin .lbl{color:var(--gris);font-size:14px;letter-spacing:.2em;text-transform:uppercase}
#record{color:var(--vert)}
.coins-hd{position:fixed;top:10px;right:12px;z-index:30;display:flex;gap:8px}
.coins-hd button{background:rgba(20,24,12,.8);border:1px solid var(--bord);color:var(--texte);
  font-family:inherit;font-size:14px;padding:4px 12px;cursor:pointer;letter-spacing:.05em}
.coins-hd button:hover{border-color:var(--ambre);color:var(--ambre)}
#fin h1{color:var(--rouge)}
#scan{position:fixed;inset:0;pointer-events:none;z-index:15;opacity:.5;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.07) 3px 4px)}