/* Recherche (A4.3) : la palette (chargée par recherche.js au premier usage) et la page de résultats, qui seule la lie. */
html.palette-ouverte { overflow: hidden; }
.palette { position: fixed; inset: 0; z-index: 60; display: grid; align-items: start; justify-items: center; padding: max(8vh, 16px) 16px 16px; background: rgba(10, 14, 24, .82); }
.palette[hidden] { display: none; }
.palette-boite { width: min(640px, 100%); max-height: calc(100vh - 2 * max(8vh, 16px)); display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; gap: 8px; padding: 16px; background: var(--ardoise); border: 1px solid var(--cadre); border-radius: var(--r-md); box-shadow: 0 18px 48px rgba(0, 0, 0, .55); }
.palette-form { display: grid; gap: 8px; margin: 0; }
.palette-champ { display: flex; gap: 8px; }
/* (0,2,1) comme la règle de base des champs, et lue après elle : 17 px, sans quoi iOS agrandit la page au focus. */
.palette-champ input[type="search"] { flex: 1; min-width: 0; font-size: 17px; }
.palette-fermer { flex: none; min-height: 44px; padding: 0 12px; background: transparent; color: var(--brume); border-color: var(--cadre); font-size: 14px; }
.palette-fermer:hover { background: var(--ardoise-2); color: var(--parchemin); }
.palette-etat { margin: 0; font-size: 14px; color: var(--brume); }
.palette-liste { list-style: none; margin: 0; padding: 0; overflow-y: auto; overscroll-behavior: contain; }
.palette-option { display: grid; grid-template-columns: auto 1fr; gap: 0 10px; align-items: baseline; min-height: 44px; padding: 8px 10px; border: 2px solid transparent; border-radius: var(--r-sm); color: var(--parchemin); text-decoration: none; }
.palette-option:hover { background: var(--ardoise-2); }
.palette-option[aria-selected="true"] { background: var(--ardoise-2); border-color: var(--or); }
.palette-sorte, .recherche-sorte { font: 600 14px/1.3 var(--f-display); letter-spacing: .08em; text-transform: uppercase; color: var(--or); }
.palette-titre { font-weight: 600; overflow-wrap: anywhere; }
.palette-contexte { grid-column: 2; font-size: 14px; color: var(--brume); }
.palette-pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin: 0; font-size: 14px; color: var(--brume); }
.palette-pied a, .recherche-groupe a { display: inline-flex; align-items: center; min-height: 44px; }
@media (prefers-reduced-motion: no-preference) {
  .palette:not([hidden]) .palette-boite { animation: palette-arrivee .16s ease-out; }
}
@keyframes palette-arrivee { from { opacity: 0; transform: translateY(-8px); } }

.recherche-form { display: grid; gap: 8px; max-width: 640px; margin-bottom: 24px; }
.recherche-form .palette-champ input { font-size: 17px; }
.recherche-groupes { display: grid; gap: 28px; }
.recherche-groupe h2 { margin-bottom: 4px; }
.recherche-groupe ul { list-style: none; margin: 0; padding: 0; }
.recherche-groupe li { display: grid; padding: 4px 0; border-bottom: 1px solid var(--trait); }
.recherche-groupe li:last-child { border-bottom: 0; }
.recherche-groupe a { font-weight: 600; text-decoration: underline 1px var(--bronze); text-underline-offset: 3px; overflow-wrap: anywhere; }
.recherche-contexte { font-size: 14px; color: var(--brume); }
.recherche-essais { margin: 0; padding-left: 20px; }
@media (max-width: 760px) {
  .palette { padding: 8px; }
  .palette-boite { max-height: calc(100vh - 16px); }
}