/* La caserne de la base, façon Manor Lords (demande du propriétaire du 7 octobre 2026, interface/composants/caserne.jsx) :
   la barre des cartes d'unités en bas de la vue du domaine, la fiche de la troupe choisie au-dessus. La place du tiroir
   vit dans parure-domaine.css ; ici, son contenu. Les boutons portent un préfixe à six identifiants : la règle des
   boutons du cadre commun en a cinq et passerait devant. */

#siege :is(#recrutement, #recrutement-racine) { height: 100%; pointer-events: none; }
#siege #recrutement .caserne {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: var(--e-2);
  height: 100%; min-height: 0; pointer-events: none;
}
#siege #recrutement .caserne > * { pointer-events: auto; }
#siege #recrutement :is(.caserne__attente, .caserne__erreur) {
  margin: 0; padding: var(--e-2) var(--e-3); color: var(--parchemin);
  background: rgb(20 16 12 / .92); border: 1px solid rgb(184 150 79 / .6); border-radius: 3px;
}

/* ── La barre ── */
#siege #recrutement .caserne__barre {
  flex: none; display: flex; align-items: stretch; gap: 6px; max-width: 100%; padding: 6px;
  background: linear-gradient(180deg, rgb(44 35 26 / .95), rgb(18 15 12 / .96));
  border: 1px solid rgb(184 150 79 / .7); border-radius: 3px;
  box-shadow: 0 6px 18px rgb(0 0 0 / .6), inset 0 1px 0 rgb(255 232 180 / .08);
}
#siege #recrutement .caserne__cartes {
  display: flex; gap: 6px; min-width: 0; margin: 0; padding: 4px 2px 2px; list-style: none;
  overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin;
}
#siege #recrutement .caserne__carte { flex: none; margin: 0; padding: 0; background: none; box-shadow: none; }

html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__carte-bouton {
  position: relative; display: block; width: 6.4rem; height: 9.6rem; min-height: 0; margin: 0; padding: 0;
  overflow: hidden; cursor: pointer; text-transform: none; letter-spacing: 0;
  background: radial-gradient(ellipse at 50% 38%, #2c2620 0%, #14110e 70%);
  border: 1px solid #0b0a09; border-radius: 3px;
  box-shadow: inset 0 0 0 1px rgb(184 150 79 / .4), 0 2px 6px rgb(0 0 0 / .6);
  transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}
html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__carte-bouton:is(:hover, :focus-visible) {
  transform: translateY(-2px); filter: brightness(1.12);
  box-shadow: inset 0 0 0 1px rgb(232 195 90 / .8), 0 4px 10px rgb(0 0 0 / .7);
}
html:not(#c#c#c#c#c#c) #siege #recrutement .caserne__carte.est-choisie > button.caserne__carte-bouton {
  transform: translateY(-4px);
  box-shadow: inset 0 0 0 2px var(--or-vif, #e8c35a), 0 0 14px rgb(232 195 90 / .45), 0 4px 10px rgb(0 0 0 / .7);
}
#siege #recrutement .caserne__carte-image { position: absolute; inset: 0 0 1.7rem 0; display: block; }
#siege #recrutement .caserne__carte-image img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: 50% 100%; }
#siege #recrutement .caserne__carte-image.est-portrait img { object-position: 50% 50%; }
#siege #recrutement .caserne__carte.est-fermee .caserne__carte-image img { filter: grayscale(.85) brightness(.55); }
#siege #recrutement .caserne__carte-nom {
  position: absolute; inset: 0 0 auto 0; padding: .3rem .25rem 1rem; font-size: .72rem; line-height: 1.1;
  font-variant-caps: small-caps; letter-spacing: .02em; text-align: center; color: var(--parchemin, #e9dcc0);
  background: linear-gradient(180deg, rgb(0 0 0 / .8), rgb(0 0 0 / 0)); text-shadow: 0 1px 2px #000;
}
#siege #recrutement .caserne__carte-niveau {
  position: absolute; top: 1.5rem; left: .25rem; display: grid; place-items: center; width: 1.35rem; height: 1.35rem;
  font-size: .75rem; color: var(--or, #c9a75a); background: #1a1510; border: 1px solid rgb(184 150 79 / .8); border-radius: 50%;
}
#siege #recrutement .caserne__carte-pastille { position: absolute; top: 1.5rem; right: .25rem; }
#siege #recrutement .caserne__carte-pied {
  position: absolute; inset: auto 0 0 0; display: flex; align-items: center; justify-content: center; gap: .25rem;
  height: 1.7rem; padding: 0 .2rem; font-size: 1rem; font-variant-numeric: tabular-nums; color: var(--or, #c9a75a);
  background: linear-gradient(180deg, #2a2219, #15110d); border-top: 1px solid rgb(184 150 79 / .55);
}
#siege #recrutement .caserne__carte.est-fermee .caserne__carte-pied { font-size: .66rem; line-height: 1; color: #e5a58f; white-space: nowrap; overflow: hidden; }
#siege #recrutement .caserne__carte-marque { width: .85rem; height: .85rem; flex: none; }

/* La file des levées, au bord gauche de la barre. */
html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__file {
  flex: none; display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: .25rem;
  width: 9.5rem; min-height: 0; margin: 0; padding: .45rem .55rem; text-align: left; text-transform: none; letter-spacing: 0;
  color: var(--parchemin, #e9dcc0); background: rgb(0 0 0 / .35); border: 1px solid rgb(184 150 79 / .45); border-radius: 3px;
  box-shadow: none; cursor: pointer;
}
html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__file:is(:hover, :focus-visible, .est-choisie) { border-color: var(--or-vif, #e8c35a); background: rgb(40 32 24 / .7); }
#siege #recrutement .caserne__file-titre { font-size: .72rem; font-variant-caps: small-caps; letter-spacing: .04em; color: var(--or, #c9a75a); }
#siege #recrutement .caserne__file-ordre { font-size: .86rem; line-height: 1.2; }
#siege #recrutement .caserne__file.est-vide .caserne__file-ordre { color: var(--texte-pale, #a8997d); }
#siege #recrutement .caserne__file-jauge { display: block; height: 5px; background: #1a1510; border: 1px solid rgb(184 150 79 / .35); }
#siege #recrutement .caserne__file-jauge > span { display: block; height: 100%; background: linear-gradient(90deg, #8c6b2a, #e8c35a); }
#siege #recrutement :is(.caserne__file-fin, .caserne__file-attente) { font-size: .72rem; color: var(--texte-pale, #a8997d); }

/* « Comparer » : le registre en liste, au bord droit. */
html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__outil {
  flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem;
  width: 4.8rem; min-height: 0; margin: 0; padding: .4rem .3rem; font-size: .75rem; text-transform: none; letter-spacing: 0;
  color: var(--parchemin, #e9dcc0); background: rgb(0 0 0 / .35); border: 1px solid rgb(184 150 79 / .45); border-radius: 3px; box-shadow: none;
}
html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__outil:is(:hover, :focus-visible, .est-choisie) { border-color: var(--or-vif, #e8c35a); background: rgb(40 32 24 / .7); }
#siege #recrutement .caserne__outil-marque { width: 1.6rem; height: 1.6rem; }

/* ── Le panneau au-dessus de la barre ── */
#siege #recrutement .caserne__panneau {
  flex: 0 1 auto; width: min(56rem, 100%); min-height: 0; overflow: hidden auto; overscroll-behavior: contain;
  padding: var(--e-2) var(--e-3); color: var(--parchemin, #e9dcc0);
  background: linear-gradient(180deg, rgb(34 28 22 / .96), rgb(18 15 12 / .96));
  border: 1px solid rgb(184 150 79 / .7); border-radius: 3px; box-shadow: 0 6px 18px rgb(0 0 0 / .6);
}
#siege #recrutement .caserne__panneau--verrou { width: min(40rem, 100%); }
#siege #recrutement .caserne__panneau--unite { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: var(--e-3); align-items: start; }
#siege #recrutement .caserne__portrait {
  position: sticky; top: 0; display: block; aspect-ratio: 2 / 3;
  background: radial-gradient(ellipse at 50% 38%, #2c2620 0%, #14110e 72%);
  border: 1px solid rgb(184 150 79 / .5); border-radius: 3px; box-shadow: inset 0 0 18px rgb(0 0 0 / .7);
}
#siege #recrutement .caserne__portrait img { display: block; width: 100%; height: 100%; object-fit: contain; }
#siege #recrutement .caserne__detail { min-width: 0; gap: var(--e-2); }
#siege #recrutement .caserne__tete { display: flex; align-items: baseline; gap: var(--e-2); margin: 0 0 var(--e-1); }
#siege #recrutement .caserne__nom { margin: 0; font-family: var(--police-titre, inherit); font-size: 1.2rem; color: var(--or, #c9a75a); }
#siege #recrutement .caserne__sous { color: var(--texte-pale, #a8997d); font-size: .9rem; }
html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__fermer { margin-left: auto; min-width: 2.2rem; min-height: 2.2rem; padding: 0; text-transform: none; }
#siege #recrutement .caserne__forces { display: flex; flex-wrap: wrap; gap: .3rem 1.1rem; margin: 0; padding: 0; list-style: none; font-size: .9rem; }
#siege #recrutement .caserne__forces li { display: flex; align-items: center; gap: .3rem; margin: 0; padding: 0; background: none; }
#siege #recrutement .caserne__force-marque { width: 1rem; height: 1rem; }
#siege #recrutement .caserne__corps { min-width: 0; }

@media (max-width: 46rem) {
  #siege #recrutement .caserne { gap: var(--e-1); }
  #siege #recrutement .caserne__barre { width: 100%; gap: 4px; padding: 4px; }
  html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__carte-bouton { width: 4.6rem; height: 6.9rem; }
  #siege #recrutement .caserne__carte-image { bottom: 1.4rem; }
  #siege #recrutement .caserne__carte-pied { height: 1.4rem; font-size: .85rem; }
  #siege #recrutement .caserne__carte-nom { font-size: .62rem; padding-bottom: .6rem; }
  #siege #recrutement :is(.caserne__carte-niveau, .caserne__carte-pastille) { top: 1.2rem; }
  html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__file { width: 6.2rem; padding: .3rem .4rem; }
  #siege #recrutement .caserne__file-ordre { font-size: .76rem; }
  html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__outil { width: 3.4rem; font-size: .66rem; }
  #siege #recrutement .caserne__panneau { padding: var(--e-1) var(--e-2); }
  #siege #recrutement .caserne__panneau--unite { grid-template-columns: 5.4rem minmax(0, 1fr); gap: var(--e-2); }
  #siege #recrutement .caserne__nom { font-size: 1.05rem; }
  #siege #recrutement .caserne__forces { font-size: .8rem; gap: .2rem .7rem; }
}

/* Téléphone couché (16 octobre 2026) : la barre tient 190 pixels à droite des médaillons (parure-domaine.css) ; la
   fiche de la troupe choisie couvre la barre et sa croix y ramène. */
@media (orientation: landscape) and (max-height: 520px) {
  #siege #recrutement .caserne { position: relative; gap: 0; }
  #siege #recrutement .caserne__barre { width: 100%; gap: 4px; padding: 4px; box-sizing: border-box; }
  html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__carte-bouton { width: 5.8rem; height: 8.8rem; }
  #siege #recrutement .caserne__carte-image { bottom: 1.4rem; }
  #siege #recrutement .caserne__carte-pied { height: 1.4rem; font-size: .85rem; }
  #siege #recrutement .caserne__carte-nom { font-size: .62rem; padding-bottom: .6rem; }
  #siege #recrutement :is(.caserne__carte-niveau, .caserne__carte-pastille) { top: 1.2rem; }
  html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__file { width: 6.2rem; padding: .3rem .4rem; }
  #siege #recrutement .caserne__file-ordre { font-size: .76rem; }
  html:not(#c#c#c#c#c#c) #siege #recrutement button.caserne__outil { width: 3.4rem; font-size: .66rem; }
  #siege #recrutement .caserne__panneau { position: absolute; inset: 0; z-index: 2; width: auto; padding: var(--e-1) var(--e-2);
    background: linear-gradient(180deg, rgb(34 28 22), rgb(18 15 12)); }
  #siege #recrutement .caserne__panneau--unite { grid-template-columns: 5.4rem minmax(0, 1fr); gap: var(--e-2); }
  #siege #recrutement .caserne__nom { font-size: 1.05rem; }
  #siege #recrutement .caserne__forces { font-size: .8rem; gap: .2rem .7rem; }
}