/* ─────────────────────────────────────────────────────────────────────────────
   LIAOS FLIGHT V21 — COUCHE DE DESIGN
   Présentation uniquement : couleurs, typographie, rythme, corrections de mise
   en page. Aucun calcul, aucun parseur, aucune règle de validation n'est touché.
   Cette feuille est injectée après liaos-flight-v20 pour gagner la cascade sans
   multiplier les !important.
   ───────────────────────────────────────────────────────────────────────────── */

#atlas-flight-experience{
  /* Fond clair dominant, turquoise/vert profond, or discret. */
  --ld-paper:#f7faf9;        /* surface de travail */
  --ld-card:#ffffff;
  --ld-ink:#0f2b30;          /* texte principal */
  --ld-ink-soft:#4c6b70;     /* texte secondaire */
  --ld-line:#dbe7e5;
  --ld-line-soft:#eaf1ef;
  --ld-deep:#0d4f4a;         /* vert profond */
  --ld-deep-2:#11625c;
  --ld-teal:#1d8d85;
  --ld-gold:#b1853a;         /* accent discret */
  --ld-gold-soft:#f4e9d2;
  --ld-warn:#8a5a14;
  --ld-warn-bg:#fdf4e4;
  --ld-ok:#17625c;
  --ld-ok-bg:#e7f3f0;
  --ld-shadow:0 1px 2px #0f2b300f, 0 10px 28px -16px #0f2b3040;
  --ld-serif:Georgia,"Iowan Old Style","Times New Roman",serif;
  --ld-sans:system-ui,-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;
}

/* ── Chiffres comparables partout ───────────────────────────────────────────
   Le cahier demande des chiffres faciles à comparer : chasse fixe pour les
   tableaux, les métriques et les champs numériques, pour que les colonnes
   s'alignent verticalement. */
#atlas-flight-experience table,
#atlas-flight-experience .ls-metric,
#atlas-flight-experience .fx-metric,
#atlas-flight-experience input[type=number],
#atlas-flight-experience .l17-f-value,
#atlas-flight-experience .v21-table,
#atlas-flight-experience #v21-pair table{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}

/* ── Zone de travail : claire, calme, respirante ────────────────────────── */
#atlas-flight-experience[data-l15="work"] .fx-work{
  background:var(--ld-paper);
  color:var(--ld-ink);
  box-shadow:0 -2px 0 #ffffff5c,0 -26px 54px #02101a59;
}
#atlas-flight-experience .fx-work{font-family:var(--ld-sans)}
#atlas-flight-experience .fx-work h1,
#atlas-flight-experience .fx-work h2,
#atlas-flight-experience .fx-work h3{
  font-family:var(--ld-serif);font-weight:400;color:var(--ld-ink);
  letter-spacing:-.01em;text-wrap:balance;
}
#atlas-flight-experience .fx-work h2{font-size:clamp(21px,2.3vw,27px);line-height:1.22;margin:0 0 10px}
#atlas-flight-experience .fx-work h3{font-size:18px;line-height:1.3}
#atlas-flight-experience .fx-work p{color:var(--ld-ink-soft);max-width:78ch}
#atlas-flight-experience .fx-eyebrow,
#atlas-flight-experience .fx-kicker{
  font:600 10.5px/1.4 var(--ld-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ld-teal);
}

/* Cartes : une seule famille, bord doux, ombre légère, air intérieur. */
#atlas-flight-experience .fx-card{
  background:var(--ld-card);
  border:1px solid var(--ld-line);
  border-radius:14px;
  box-shadow:var(--ld-shadow);
  padding:clamp(16px,2vw,24px);
}
#atlas-flight-experience .fx-card + .fx-card{margin-top:16px}

/* ── Tableaux : lisibles, alignés, sans bruit ───────────────────────────── */
#atlas-flight-experience .fx-work table{
  border-collapse:collapse;width:100%;font-size:13.5px;
}
#atlas-flight-experience .fx-work th{
  text-align:left;font:600 11px/1.4 var(--ld-sans);letter-spacing:.07em;
  text-transform:uppercase;color:var(--ld-ink-soft);
  background:var(--ld-line-soft);border-bottom:1px solid var(--ld-line);
  padding:9px 12px;vertical-align:bottom;
}
#atlas-flight-experience .fx-work td{
  padding:10px 12px;border-bottom:1px solid var(--ld-line-soft);vertical-align:top;color:var(--ld-ink);
}
#atlas-flight-experience .fx-work tbody tr:last-child td{border-bottom:0}

/* ── Boutons : hiérarchie claire, focus visible ─────────────────────────── */
#atlas-flight-experience .fx-work button,
#atlas-flight-experience .fx-work .fx-secondary{
  font-family:var(--ld-sans);border-radius:9px;
}
#atlas-flight-experience .fx-work .fx-primary{
  background:linear-gradient(180deg,var(--ld-deep-2),var(--ld-deep));
  border:1px solid #0b443f;color:#f2fbf9;font-weight:600;
  box-shadow:0 1px 0 #ffffff26 inset,0 6px 16px -8px #0d4f4a9c;
}
#atlas-flight-experience .fx-work .fx-primary:hover{filter:brightness(1.07)}
#atlas-flight-experience .fx-work .fx-secondary{
  background:#fff;border:1px solid var(--ld-line);color:var(--ld-deep);
}
#atlas-flight-experience .fx-work .fx-secondary:hover{background:#f2f8f6;border-color:#c3d8d4}
#atlas-flight-experience button:focus-visible,
#atlas-flight-experience a:focus-visible,
#atlas-flight-experience summary:focus-visible,
#atlas-flight-experience input:focus-visible,
#atlas-flight-experience select:focus-visible,
#atlas-flight-experience textarea:focus-visible{
  outline:2px solid var(--ld-gold);outline-offset:2px;border-radius:8px;
}

/* ── Champs de saisie ───────────────────────────────────────────────────── */
#atlas-flight-experience .fx-work input[type=text],
#atlas-flight-experience .fx-work input[type=number],
#atlas-flight-experience .fx-work input[type=date],
#atlas-flight-experience .fx-work input[type=time],
#atlas-flight-experience .fx-work select,
#atlas-flight-experience .fx-work textarea{
  background:#fff;border:1px solid var(--ld-line);border-radius:9px;
  color:var(--ld-ink);font-family:var(--ld-sans);
}
/* Le champ GPX s'affichait avec le bouton brut du navigateur, en anglais.
   Il reprend ici l'habillage des autres commandes, sans changer son champ. */
#atlas-flight-experience input[type=file]{
  font:13px var(--ld-sans);color:var(--ld-ink-soft);max-width:100%;
}
#atlas-flight-experience input[type=file]::file-selector-button{
  font:600 13px var(--ld-sans);
  background:linear-gradient(180deg,#ffffff,#f3f8f6);
  color:var(--ld-deep);border:1px solid var(--ld-line);
  border-radius:9px;padding:9px 14px;margin-right:12px;cursor:pointer;
  min-height:40px;
}
#atlas-flight-experience input[type=file]::file-selector-button:hover{
  background:#eef6f3;border-color:#c3d8d4;
}

/* ── Panneau d'accueil : il était coupé net en bas ──────────────────────── */
#atlas-flight-experience #l17-entry{
  background:#07202bf0;
  border:1px solid #ffffff2b;
  border-radius:16px;
  scrollbar-width:thin;
  scrollbar-color:#ffffff40 transparent;
  /* Un dégradé en bas annonce la suite au lieu d'une coupure franche. */
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 26px),#0000 100%);
  mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - 26px),#0000 100%);
  padding-bottom:26px;
}
#atlas-flight-experience #l17-entry::-webkit-scrollbar{width:8px}
#atlas-flight-experience #l17-entry::-webkit-scrollbar-thumb{background:#ffffff33;border-radius:8px}

/* ── Vue aérienne : la rangée de commandes recouvrait la ligne d'état ────
   Les enfants du panneau sont positionnés en absolu par le moteur et le
   restent. Seul leur ancrage vertical change : chacun est accroché par le bas,
   ce qui supprime le recouvrement de 11 px sans toucher à la structure. */
#atlas-flight-experience #lf-aerial .la-actions{
  top:auto;bottom:46px;display:flex;flex-wrap:wrap;gap:8px;
}
#atlas-flight-experience #lf-aerial .la-bottom{
  top:auto;bottom:13px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;
}
#atlas-flight-experience #lf-aerial #la-status{font-size:11.5px;color:#cfe4e6}
/* L'attribution IGN débordait du coin arrondi. */
#atlas-flight-experience #lf-aerial{overflow:hidden}
#atlas-flight-experience #lf-aerial .leaflet-control-attribution{
  border-radius:8px 0 0 0;font-size:10px;padding:2px 8px;
}

/* ── Plaque d'en-tête : le trajet était tronqué trop tôt ──────────────────
   La plaque s'étend selon son contenu, jusqu'à une limite raisonnable ; elle
   ne prend pas toute la largeur disponible quand le texte est court. */
#atlas-flight-experience .l15-plate{flex:0 1 auto;min-width:0;max-width:min(46vw,560px)}
#atlas-flight-experience .l15-plate i{max-width:none;font-size:11px}
#atlas-flight-experience .l15-plate b{font-size:12.5px}

/* ── Console des neuf rubriques ──────────────────────────────────────────
   Chaque carte contient un numéro, un intitulé, un état et un petit témoin.
   Les intitulés sur deux lignes (« Altitude en croisière ») allongeaient leur
   carte : la zone de titre réserve désormais deux lignes partout, si bien que
   les neuf cartes ont la même hauteur et que les témoins s'alignent. */
#atlas-flight-experience #l16-console{padding-bottom:max(14px,env(safe-area-inset-bottom,0px))}
#atlas-flight-experience .l16-sw{
  border-radius:12px;
  background:linear-gradient(180deg,#0e2c37f2,#09212bf2);
  border:1px solid #ffffff22;
  box-shadow:0 1px 0 #ffffff14 inset,0 12px 26px -18px #000;
  transition:border-color .15s ease,background .15s ease;
}
#atlas-flight-experience .l16-sw:hover{
  background:linear-gradient(180deg,#133a46f2,#0b2834f2);
  border-color:#ffffff3d;
}
#atlas-flight-experience .l16-sw strong{
  display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:2.6em;line-height:1.3;font-size:13px;letter-spacing:.005em;
  font-family:var(--ld-sans);
}
#atlas-flight-experience .l16-sw .v19-switch-number{
  font-variant-numeric:tabular-nums;letter-spacing:.14em;opacity:.78;
}
#atlas-flight-experience .l16-sw .v19-switch-status{font-size:11px;opacity:.82}
#atlas-flight-experience .l16-sw.l16-on,
#atlas-flight-experience .l16-sw[aria-current="step"]{
  border-color:#6fd3cf99;
  background:linear-gradient(180deg,#14484cf2,#0c3038f2);
  box-shadow:0 0 0 1px #6fd3cf3d inset,0 0 24px -10px #6fd3cf80;
}

/* ── Bandeau des étapes et barre de temps ───────────────────────────────── */
#atlas-flight-experience #l18-time{
  background:linear-gradient(180deg,#0a2530f2,#07202bf2);
  border-bottom:1px solid #ffffff1a;
}
#atlas-flight-experience #l18-time small{letter-spacing:.14em;color:#8fc0c2}
#atlas-flight-experience #l18-steps{
  background:linear-gradient(180deg,#123340,#0b2531);
  border-bottom:1px solid #ffffff1f;gap:6px;
}
#atlas-flight-experience #l18-steps button{
  border-radius:10px;min-height:46px;font-family:var(--ld-sans);
}

/* ── Provenance : une seule grammaire visuelle ──────────────────────────── */
#atlas-flight-experience .l17-chip,
#atlas-flight-experience .v21-tag,
#atlas-flight-experience .fx-tag{
  display:inline-block;font:600 10px/1.5 var(--ld-sans);letter-spacing:.04em;
  padding:2px 9px;border-radius:999px;border:1px solid currentColor;
  background:#ffffff12;
}

/* ── Comparaison PDF / GPX : lecture en colonnes ────────────────────────── */
#atlas-flight-experience #v21-pair .ls-scroll,
#atlas-flight-experience #v21-pair .v21-scroll{overflow-x:auto}
#atlas-flight-experience #v21-pair table{font-size:13px}
#atlas-flight-experience #v21-pair td small,
#atlas-flight-experience #v21-pair td .v21-sub{
  display:block;color:var(--ld-ink-soft);font-size:11.5px;margin-top:3px;
}
#atlas-flight-experience #v21-pair tbody tr:hover td{background:#f4f9f8}

/* ── Détails repliables : affordance nette ──────────────────────────────── */
#atlas-flight-experience .fx-work details{
  border:1px solid var(--ld-line);border-radius:12px;background:#fff;
}
#atlas-flight-experience .fx-work details > summary{
  font:600 13.5px var(--ld-sans);color:var(--ld-deep);padding:12px 14px;cursor:pointer;
}
#atlas-flight-experience .fx-work details[open] > summary{border-bottom:1px solid var(--ld-line-soft)}

/* ── Messages : information, attention, limite documentaire ─────────────── */
#atlas-flight-experience .fx-work .fx-banner,
#atlas-flight-experience .fx-work .fx-note{
  border-radius:12px;border:1px solid var(--ld-line);background:#fff;
}
#atlas-flight-experience .fx-work .fx-banner.warning,
#atlas-flight-experience .fx-work .warning{
  background:var(--ld-warn-bg);border-color:#f0dfbf;color:var(--ld-warn);
}

/* ── Téléphone et tablette ──────────────────────────────────────────────── */
@media(max-width:900px){
  #atlas-flight-experience #l17-entry{border-radius:14px}
  #atlas-flight-experience .l15-plate{max-width:none}
  #atlas-flight-experience .fx-work table{font-size:12.5px}
  #atlas-flight-experience .fx-work th,
  #atlas-flight-experience .fx-work td{padding:8px 10px}
}
@media(max-width:700px){
  #atlas-flight-experience .fx-card{padding:14px;border-radius:12px}
  #atlas-flight-experience #lf-aerial .la-copy{padding:12px 14px;position:static;background:#04161e}
}

/* ── Mouvement réduit ───────────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  #atlas-flight-experience .l16-sw{transition:none}
}

/* ── Impression : papier sobre, chiffres alignés, rien de décoratif ─────── */
@media print{
  #atlas-flight-experience{background:#fff!important}
  #atlas-flight-experience .fx-work{background:#fff!important}
  #atlas-flight-experience .fx-card{
    box-shadow:none!important;border:1px solid #c9d6d4!important;break-inside:avoid;
  }
  #atlas-flight-experience table{font-variant-numeric:tabular-nums}
  #atlas-flight-experience .fx-work th{background:#eef3f2!important;color:#2a4a4e!important}
}