/* La carte d'accueil, plus compacte et plus sobre (Henri, 12/10/2026, sur une capture d'iPhone en thème clair :
   « améliore les boutons, le i de IGN, les filtres et tout le reste soit plus compact et le texte plus sobre et
   premium »). Référence d'esprit : Apple Plans ; une hiérarchie par la taille et la graisse, modérées.
   Constats sur la capture : recherche haute, pastille « Filtres » isolée sous elle, colonne de neuf boutons sur
   près de la moitié de l'écran, attribution IGN en gros cadre carré, titre de la feuille en 28 px gras.
   Chargée APRÈS instrument.css (scripts/modules.json) : à spécificité égale, elle l'emporte. Jetons --i-* seulement
   (aucune couleur nouvelle : scripts/palette.mjs). Les cibles tactiles restent à 44 px. */

/* ── 1. Recherche et filtres : une seule barre ── */
/* « Filtres » rejoint le bout de la barre de recherche (une icône, comme le bouton de liste d'Apple Plans) au lieu
   d'une pastille seule sur sa ligne. Le mot reste le nom du bouton pour la lecture d'écran (taille nulle, pas caché). */
html[data-theme] .page-app .haut { --cc-barre: 44px; }
html[data-theme] .page-app .haut .recherche-carte { height: var(--cc-barre); padding: 0 calc(var(--cc-barre) + 2px) 0 7px; gap: 4px; border-radius: var(--r-carte); }
html[data-theme] .page-app .haut .recherche-carte input { height: var(--cc-barre); padding: 0 2px; font-size: 1rem; }
html[data-theme] .page-app .haut .recherche-carte .marque-mini img { width: 24px; height: 24px; border-radius: var(--r-pastille); }
/* le logo garde son dessin de 24 px ; sa zone d'appui de 44 px est un pseudo-élément (instrument.css), pas une largeur prise au champ */
html[data-theme] .page-app .haut .recherche-carte .marque-mini { min-width: 28px !important; min-height: 28px !important; }
html[data-theme] .page-app .haut .recherche-carte .recherche-avancee { width: 38px; min-width: 38px; height: var(--cc-barre); }
html[data-theme] .page-app .haut .puces { position: absolute; z-index: 4; top: 0; right: 0; height: var(--cc-barre); margin: 0; padding: 0; overflow: visible; }
html[data-theme] .page-app .haut .puces .puce-filtres { position: relative; width: var(--cc-barre); min-width: var(--cc-barre); height: var(--cc-barre); min-height: var(--cc-barre); padding: 0; gap: 0; justify-content: center;
  border-radius: 0 12px 12px 0; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; color: var(--i-encre-2); font-size: 0; }
html[data-theme] .page-app .haut .puces .puce-filtres::before { content: ""; position: absolute; left: 0; top: 11px; bottom: 11px; width: 1px; background: var(--i-trait); }
html[data-theme] .page-app .haut .puces .puce-filtres::after { display: none; }
html[data-theme] .page-app .haut .puces .puce-filtres > svg { width: 17px; height: 17px; }
@media (hover: hover) { html[data-theme] .page-app .haut .puces .puce-filtres:hover { background: var(--i-survol); color: var(--i-encre); } }
html[data-theme] .page-app .haut .puces .puce-filtres:is(:active, :focus:not(:focus-visible)) { background: none; box-shadow: none; transform: none; }
html[data-theme] .page-app .haut .puces .puce-filtres[aria-pressed="true"] { background: none; color: var(--i-encre); }
html[data-theme] .page-app .haut .puces .puce-filtres .puce-compte { position: absolute; top: 7px; right: 6px; min-width: 15px; height: 15px; padding: 0 4px; border-radius: var(--r-bouton); background: var(--i-plein); color: var(--i-sur-plein); font-size: var(--t-10); font-weight: 600; line-height: 15px; }

/* au bureau, la feuille montait sous la ligne des filtres (138 px) : elle remonte sous la barre seule */
@media (min-width: 900px) {
  html[data-theme] .page-app .feuille { top: 70px; max-height: calc(100dvh - 86px); }
  html[data-theme] .page-app .panneau-ouvrir { top: 70px; }
}

/* ── 2. La colonne de commandes : serrée, en verre, sans jeu entre les boutons ── */
@media (max-width: 899px) {
  html[data-theme] .page-app .commandes { top: calc(env(safe-area-inset-top) + 64px); right: 10px; gap: 0; padding: 0; border-radius: var(--r-carte); overflow: hidden; }
  html[data-theme] .page-app .commandes > .commande { width: 44px; height: 44px; border-radius: 0; }
  html[data-theme] .page-app .commandes > .commande + .commande { box-shadow: inset 0 1px 0 var(--i-trait); }
  html[data-theme] .page-app .commandes > .commande[aria-pressed="true"] { box-shadow: none; }
  html[data-theme] .page-app .commandes > .commande[aria-pressed="true"] + .commande { box-shadow: none; }
  html[data-theme] .page-app .commandes > .commande > svg { width: 19px; height: 19px; }
}
.commandes-plus[hidden] { display: none !important; }

/* le menu « Plus » : une liste d'Apple, icône et libellé, opaque (il passe sur la carte et sur la feuille) */
html[data-theme] .page-app .commandes-tiroir { position: fixed; z-index: 45; min-width: 216px; padding: 4px; border-radius: var(--r-carte); background: var(--i-panneau); box-shadow: var(--i-filet), var(--i-ombre); animation: surgir 0.14s ease-out; }
html[data-theme] .page-app .commandes-tiroir[hidden] { display: none; }
html[data-theme] .page-app .commandes-tiroir > .commande { display: flex; align-items: center; justify-content: flex-start; gap: 12px; width: 100%; height: 44px; min-height: 44px; padding: 0 12px; border: 0; border-radius: var(--r-bouton);
  background: none; box-shadow: none; color: var(--i-encre); font: inherit; font-size: var(--t-15); font-weight: 400; text-decoration: none; cursor: pointer; }
html[data-theme] .page-app .commandes-tiroir > .commande + .commande { border-top: 0; }
html[data-theme] .page-app .commandes-tiroir > .commande:hover { background: var(--i-survol); }
html[data-theme] .page-app .commandes-tiroir > .commande:focus-visible { outline: 2px solid var(--i-anneau, currentColor); outline-offset: -2px; }
html[data-theme] .page-app .commandes-tiroir > .commande > svg { flex: none; width: 19px; height: 19px; color: var(--i-encre-2); }
html[data-theme] .page-app .commandes-tiroir > .commande::after { content: attr(data-plus-l); position: static; width: auto; height: auto; transform: none; background: none; box-shadow: none; }
html[data-theme] .page-app .commandes-tiroir > .commande::before { display: none; }

/* ── 3. L'attribution : « ⓘ © IGN » en petit, toujours lisible (la licence l'exige), dépliable ── */
/* MapLibre (compact) dessine un rond de 24 px dans un cadre blanc, agrandi à 44 px par l'audit tactile : un gros
   carré au bas de l'écran. Ici une pastille de 20 px : la mention reste affichée sur une ligne (coupée si elle est
   longue) ; le (i) la déplie en entier. La zone d'appui du (i) garde 44 px (pseudo-élément d'instrument.css). */
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib.maplibregl-compact { display: flex; align-items: center; gap: 3px; box-sizing: border-box; min-height: 20px; margin: 0 0 8px 10px; padding: 0 8px 0 3px;
  border-radius: var(--r-moyen); background: var(--i-verre); -webkit-backdrop-filter: var(--i-flou); backdrop-filter: var(--i-flou); box-shadow: var(--i-filet); color: var(--i-lib); font-size: var(--t-10); line-height: 1.3; }
html[data-theme] .page-app #carte .maplibregl-ctrl-bottom-right > .maplibregl-ctrl-attrib.maplibregl-compact { margin: 0 10px 8px; }
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-button { position: relative; display: block; flex: none; order: -1; width: 16px; min-width: 16px; height: 16px; min-height: 16px;
  border-radius: 50%; background-color: transparent; background-size: 16px 16px; background-repeat: no-repeat; background-position: center; opacity: 0.6; }
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib.maplibregl-compact .maplibregl-ctrl-attrib-inner { display: block; max-width: 34vw; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* replié (MapLibre le replie au premier geste sur la carte) : un rond de 20 px, le (i) seul */
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib.maplibregl-compact:not(.maplibregl-compact-show) { padding: 2px; }
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib.maplibregl-compact-show { align-items: flex-start; padding: 2px 8px 2px 3px; }
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib.maplibregl-compact-show .maplibregl-ctrl-attrib-inner { max-width: min(320px, calc(100vw - 60px)); white-space: normal; }
html[data-theme] .page-app #carte .maplibregl-ctrl-attrib a { color: inherit; }

/* ── 4. La feuille d'accueil : un titre sobre, un chapeau qui se lit ── */
/* 28 px en graisse 700 sur deux lignes : la taille d'un titre de page, pas d'un panneau. 18 px en 600, comme le
   titre d'une feuille d'Apple Plans ; le chapeau en 14 px gris. Les fiches (parcelle, commune) gardent leur titre. */
html[data-theme] .page-app .feuille .feuille-titre { font-size: var(--t-17); font-weight: 600; line-height: 1.2; letter-spacing: -0.015em; }
html[data-theme] .page-app .feuille .feuille-chapo { margin-top: 4px; color: var(--i-lib); font-size: var(--t-14); line-height: 1.4; }