/* ── HIC SUNT · Sillage — overlays: secondary screens ───────────────── */

/* ── onboarding ── */
.onb{flex:1;display:flex;flex-direction:column;padding:0 28px 44px;position:relative}
.onb-rule{position:absolute;left:28px;top:120px;bottom:230px;width:2px;background:var(--gold-soft);opacity:0.8}
.onb-main{flex:1;display:flex;flex-direction:column;justify-content:center;padding-left:24px}
.onb-kw{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--gold)}
.onb-h{font-family:var(--serif);font-weight:600;font-size:44px;line-height:1.08;letter-spacing:-0.8px;margin-top:16px}
.onb-h em{font-style:italic;color:var(--gold)}
.onb-s{font-size:14px;font-weight:300;color:var(--sub);line-height:1.6;margin-top:16px;max-width:280px}
.onb-acts{display:flex;flex-direction:column;gap:12px}
.dots{display:flex;justify-content:center;gap:8px;margin-top:22px}
.dots i{width:8px;height:8px;border-radius:50%;background:var(--line)}
.dots i.on{background:var(--gold)}

/* ── login ── */
.login-h{font-family:var(--serif);font-weight:600;font-size:34px;letter-spacing:-0.5px;margin-top:18px}
.login-s{font-size:14px;font-weight:300;color:var(--sub);line-height:1.6;margin-top:8px;margin-bottom:26px}
.sep{display:flex;align-items:center;gap:14px;margin:20px 0;color:var(--sub);font-size:12px}
.sep::before,.sep::after{content:'';flex:1;height:1px;background:var(--line)}
.apple-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:var(--tap-comfortable);border:none;border-radius:var(--btn-radius);background:var(--ink);color:var(--onink);font-family:var(--sf);font-size:15px;font-weight:600;cursor:pointer;transition:transform 0.12s cubic-bezier(0.34,1.2,0.4,1)}
.apple-btn:active{transform:scale(0.97)}
.login-link{text-align:center;margin-top:22px;font-size:13px;color:var(--sub)}
.login-link b{color:var(--gold);cursor:pointer;font-weight:700;transition:opacity 0.1s}
.login-link b:active{opacity:0.55}

/* ── destination detail ── */
.dest-hero{height:220px;position:relative;overflow:hidden;flex:none}
.dest-hero .wash{position:absolute;inset:0}
/* Photo floutée : même image que la tuile Découvrir, mais en arrière-plan
   discret plutôt qu'en répétition nette de la tuile qu'on vient de toucher.
   scale(1.12) compense le flou pour éviter tout bord transparent visible. */
.dest-hero .wash.photo{background-size:cover;background-position:center;filter:blur(16px) saturate(1.05) brightness(0.9);transform:scale(1.12)}
.dest-hero .wm{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--ink);opacity:0.16}
.dest-hero .veil{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,17,14,0.55),rgba(20,17,14,0.06) 55%,rgba(20,17,14,0.12))}
.dest-hero .navbar{position:absolute;top:8px;left:0;right:0}
.dest-cap{position:absolute;left:24px;right:24px;bottom:16px;color:var(--onink)}
.dest-cap .eyebrow{color:var(--gold-bright)}
/* Destination name — biggest serif in the app */
.dest-cap h1{font-family:var(--serif);font-weight:600;font-size:44px;letter-spacing:-0.8px;line-height:1;margin-top:6px}
.dest-pills{display:flex;gap:8px;margin-top:11px}
.pill{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.8px;text-transform:uppercase;padding:7px 12px;border-radius:var(--r-lg);background:var(--surface2);border:1px solid var(--line);color:var(--ink-soft)}
.dest-cap .pill{background:rgba(244,238,223,0.14);border-color:rgba(244,238,223,0.25);color:var(--onink);backdrop-filter:blur(6px)}
.lede{font-size:14px;font-weight:300;color:var(--ink-soft);line-height:1.65;margin-top:20px}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.info-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:14px}
.info-card .ic-l{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--sub)}
.info-card .ic-v{font-family:var(--serif);font-weight:600;font-size:17px;margin-top:7px}
.hl{display:flex;gap:14px;padding:15px 0;border-bottom:1px solid var(--line2);align-items:flex-start}
.hl:last-child{border-bottom:none}
.hl .ico{color:var(--gold);margin-top:2px}
.hl .h-t{font-family:var(--serif);font-weight:600;font-size:16px}
.hl .h-d{font-size:13px;font-weight:300;color:var(--sub);line-height:1.5;margin-top:3px}
.season{display:flex;align-items:flex-end;gap:6px;height:62px;margin-top:14px}
.season .m{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.season .m i{display:block;width:100%;background:var(--line);border-radius:3px}
.season .m.best i{background:var(--gold)}
.season .m span{font-family:var(--mono);font-size:8px;color:var(--sub)}
.season .m.best span{color:var(--gold-deep);font-weight:700}
.season-note{font-size:13px;font-weight:300;color:var(--sub);line-height:1.55;margin-top:12px}

/* ── itinerary — hero plein cadre façon carte postale ── */
.itin-hero-panel{position:relative;min-height:300px;flex:none;overflow:hidden;padding-top:env(safe-area-inset-top,0px);display:flex;flex-direction:column}
.itin-hero-waves{position:absolute;inset:0;width:100%;height:100%}
.itin-hero-wm{position:absolute;top:110px;right:-10px;color:var(--onink);opacity:0.16;pointer-events:none;z-index:1}
.itin-hero-top{display:flex;justify-content:space-between;align-items:center;padding:6px 18px 0;position:relative;z-index:2;flex:none}
/* Référence UNIQUE pour tout bouton retour/fermer de l'app — cercle blanc
   à filet fin, 36px (au-dessus du minimum tactile iOS de 44pt visé par le
   padding autour, cohérent avec .tab-it etc.). Avant, trois styles
   coexistaient selon l'écran (44px carré via .nav-btn/navbar(), 40px carré
   ici, 34px cercle propre à .itn-hd) — un seul maintenant, partout. */
/* Cercle blanc de 36px inchangé visuellement (repris sur une quinzaine
   d'écrans, un agrandissement direct risquerait de casser des rangées de
   boutons déjà serrées) — ::after ajoute une zone tactile invisible de
   --tap-min (44px) tout autour, sans rien changer à l'apparence. */
.ihx-btn{position:relative;width:36px;height:36px;border-radius:50%;background:#FFFFFF;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-1);color:var(--ink);cursor:pointer;transition:transform 0.12s var(--spring)}
.ihx-btn::after{content:'';position:absolute;inset:calc((36px - var(--tap-min)) / 2)}
.ihx-btn:active{transform:scale(0.88)}
/* Le déclencheur de l'assistant IA se distingue des autres actions (retour,
   partager) par un liseré doré plutôt qu'une icône identique aux autres. */
.ihx-btn.ai{border:1.5px solid var(--gold);color:var(--gold-deep)}
.itin-hero-coords{position:relative;padding:8px 20px 0;font-size:12px;color:var(--onink);opacity:0.8;letter-spacing:.1em;z-index:2;line-height:1.4}
.itin-hero-cap{position:relative;margin-top:auto;padding:0 20px 18px;z-index:2}
.itin-hero-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:var(--r-pill);background:var(--ink);margin-bottom:12px;color:var(--gold-bright)}
.itin-hero-badge .mono{font-size:10px;color:var(--onink);letter-spacing:.14em}
.itin-hero-cap h1{font-family:var(--serif);font-weight:600;font-size:44px;line-height:.92;color:var(--onink);margin:0}
.itin-hero-tag{font-family:var(--serif);font-style:italic;font-size:21px;color:var(--gold-bright);margin-top:4px}

.itin-stat{flex:1;padding:14px 15px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line)}
.itin-stat .mono{font-size:9px;color:var(--gold);letter-spacing:.14em;margin-bottom:6px}
.itin-stat .serif{font-size:21px}
/* Ancien fond noir plein retiré : même carte claire, juste un liseré plus
   marqué pour distinguer le Budget des deux autres puces. */
.itin-stat.dark{border-color:var(--ink);border-width:1.5px}

.minimap{height:180px;border-radius:var(--card-radius);border:1px solid var(--line);background:var(--surface);position:relative;overflow:hidden;cursor:pointer;box-shadow:var(--shadow-raised);transition:transform 0.15s var(--spring)}
.minimap:active{transform:scale(0.98)}
.minimap-real{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.minimap .wx-chip{position:absolute;top:12px;right:12px;z-index:3}
.minimap .mm-cap{position:absolute;left:14px;bottom:12px;font-family:var(--mono);font-size:9px;letter-spacing:1px;color:var(--sub);z-index:3}
.minimap-cta{position:absolute;bottom:12px;right:12px;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:13px;font-weight:700;box-shadow:0 6px 16px -8px rgba(31,26,20,.25)}

/* ── tool grid — more generous spacing ── */
.tools{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tool{
  background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 16px;cursor:pointer;text-align:left;color:var(--ink);
  box-shadow:var(--sh-1);
  transition:transform 0.15s var(--spring),box-shadow 0.18s ease;
  min-height:var(--tap-comfortable);
}
.tool:active{transform:scale(0.95)}
.tool:hover{box-shadow:var(--shadow-raised)}
.tool .ico{color:var(--gold)}
/* iOS Headline size */
.tool .tl-t{font-family:var(--serif);font-weight:500;font-size:18px;margin-top:12px;color:inherit;letter-spacing:-0.2px}
.tool .tl-s{font-family:var(--mono);font-size:8.5px;letter-spacing:0.8px;text-transform:uppercase;color:var(--sub);margin-top:5px}
.tool.dark{background:var(--ink);border-color:var(--ink)}
.tool.dark .ico{color:var(--gold-bright)}
.tool.dark .tl-t{color:var(--onink)}
.tool.dark .tl-s{color:#B8AE98}

.ai-banner{display:flex;align-items:center;gap:14px;border:1px solid var(--line);background:var(--surface);border-radius:var(--card-radius);padding:16px;margin-top:20px;cursor:pointer;transition:transform 0.15s cubic-bezier(0.34,1.2,0.4,1)}
.ai-banner:active{transform:scale(0.985)}
.ai-av{width:46px;height:46px;border-radius:var(--r-md);background:var(--gold);color:var(--onink);display:flex;align-items:center;justify-content:center;flex:none}
.ai-banner .ab-k{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--sub)}
.ai-banner .ab-t{font-family:var(--serif);font-weight:500;font-size:17px;margin-top:3px}
.ai-banner .ico.chev{color:var(--gold);margin-left:auto}

/* ── day rows — carnet de route, spine + nœuds (référence "Carnet de route") ── */
.dayrow{display:flex;gap:16px;cursor:pointer;position:relative;padding-bottom:26px;
  transition:opacity 0.1s;
}
.dayrow:active{opacity:0.7}
.dayrow .dr-rail{display:flex;flex-direction:column;align-items:center;flex:none;width:28px;padding-top:5px}
.dayrow .dr-pin{width:28px;height:28px;border-radius:50%;border:1.5px solid;flex:none;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:11px;font-weight:700;color:#FFFFFF}
.dayrow .dr-line{flex:1;width:2px;opacity:0.3;margin-top:6px;border-radius:2px}
.dayrow:last-child .dr-line{display:none}
.dayrow .dr-main{flex:1;min-width:0}
.dayrow .dr-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.dayrow .dr-l{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--sub)}
.dayrow .dr-l b{font-weight:600}
.dayrow .dr-t{font-family:var(--serif);font-weight:600;font-size:21px;letter-spacing:-0.3px;margin-top:5px}
.dayrow .dr-d{font-size:13.5px;color:var(--ink-soft);line-height:1.5;margin-top:6px;max-width:34ch}
.dayrow .dr-tags{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}
.mini-tag{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:0.6px;text-transform:uppercase;color:var(--ink-soft);background:var(--surface2);border:1px solid var(--line2);padding:5px 9px;border-radius:var(--r-lg)}
.dayrow .wx-chip{flex:none}

/* ── accommodation card ──
   Le contenu (accRow, screens-detail.js) est entièrement en styles inline
   depuis que la carte a gagné la photo réelle, le badge "Non confirmé" et
   la teinte selon le type d'hébergement — .a-img/.a-info/.a-top/.a-n/
   .a-tag/.a-rate/.a-meta/.a-price ne correspondent plus à rien de rendu
   et ont été retirées. Seule .acc (le conteneur) reste utilisée. */
.acc{background:var(--surface);border:1px solid var(--line);border-radius:var(--card-radius);overflow:hidden;margin-bottom:14px;cursor:pointer;
  transition:transform 0.15s cubic-bezier(0.34,1.2,0.4,1),opacity 0.12s;
}
.acc:active{transform:scale(0.982);opacity:0.9}

/* ── itinerary footer ── */
.foot-price{display:flex;align-items:center;justify-content:space-between;gap:14px}
.foot-price .fp-v{font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:-0.3px}
.foot-price .fp-l{font-family:var(--mono);font-size:8.5px;letter-spacing:1px;text-transform:uppercase;color:var(--sub);margin-top:2px}
/* Actions : Garder (texte discret) · Modifier (bulle ronde) — voir da.css
   §22 pour .fa-txt/.fa-chat, une seule action principale. */
.foot-actions{display:flex;align-items:center;gap:8px;flex:none}
.foot-price .btn{width:auto;flex:1;max-width:220px}

/* ── day detail — moments with iOS minimum tap height ── */
.dayd-h{font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:-0.5px;margin-top:8px;line-height:1.12}
.dayd-s{font-size:14px;font-weight:300;color:var(--sub);line-height:1.6;margin-top:9px}
.moment{
  display:flex;gap:13px;
  /* iOS minimum row height 44px */
  min-height:var(--tap-min);padding:14px 0;
  border-bottom:1px solid var(--line2);align-items:flex-start;
}
.moment:last-child{border-bottom:none}
.moment .mo-t{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:0.6px;color:var(--sub);width:38px;flex:none;padding-top:6px}
.moment .mo-i{width:32px;height:32px;border-radius:50%;background:var(--surface2);color:var(--gold);display:flex;align-items:center;justify-content:center;flex:none}
/* iOS Body size: 15px — clear above sub */
.moment .mo-ti{font-size:15px;font-weight:600;line-height:1.3;letter-spacing:-0.1px}
.moment .mo-d{font-size:13px;font-weight:300;color:var(--sub);line-height:1.5;margin-top:3px}
/* Lien de réservation (GetYourGuide) — uniquement sur les moments payants
   (free:false, voir buildDaysPrompt) : location, excursion, visite guidée… */
/* « Voir sur la carte » ne fait que 14 px de haut : l'audit tactile l'a
   relevé comme la plus petite cible de l'app. On ne le grossit pas — il
   doit rester un lien discret sous le texte du moment — on élargit sa
   ZONE tactile sans toucher au dessin, exactement comme .ihx-btn le fait
   déjà plus haut. L'inset négatif déborde le lien pour atteindre les
   44 px recommandés par Apple. */
.moment .mo-book{position:relative;display:inline-flex;align-items:center;gap:5px;margin-top:7px;
  font-family:var(--serif);font-size:12px;font-weight:600;color:var(--accent-texte,var(--accent));
  text-decoration:none}
.moment .mo-book::after{content:'';position:absolute;left:0;right:0;
  top:50%;height:var(--tap-min);transform:translateY(-50%)}
.moment .mo-book svg{flex:none}
.day-nav{display:flex;gap:10px}
.day-nav .btn,.day-nav .btn-ghost{flex:1;height:50px;font-size:14px}

/* ── booking ── */
.book-hero{position:relative;flex:none}
.book-hero .navbar{position:absolute;top:54px;left:0;right:0}
.book-h{font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:-0.4px;margin-top:7px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.book-meta{font-family:var(--mono);font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--sub);margin-top:6px}
.book-desc{font-size:14px;font-weight:300;color:var(--ink-soft);line-height:1.6;margin-top:14px}
.host{display:flex;align-items:center;gap:12px;padding:15px 0;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2);margin-top:18px}
.host .h-n{font-size:14px;font-weight:600}
.host .h-s{font-family:var(--mono);font-size:9px;letter-spacing:0.8px;text-transform:uppercase;color:var(--sub);margin-top:2px}
.stay-row{display:flex;align-items:center;gap:13px;min-height:var(--tap-min);padding:13px 0;border-bottom:1px solid var(--line2)}
.stay-row:last-child{border-bottom:none}
.stay-row .ico{color:var(--gold)}
.stay-row .sr-l{font-size:14px;font-weight:500;flex:1}
.stay-row .sr-v{font-family:var(--mono);font-size:10px;font-weight:700;color:var(--ink-soft)}
.price-l{display:flex;justify-content:space-between;font-size:14px;font-weight:300;color:var(--ink-soft);padding:8px 0}
.price-l.total{border-top:1px solid var(--line);margin-top:8px;padding-top:14px;font-family:var(--serif);font-weight:600;font-size:17px;color:var(--ink)}

/* ── budget lines ── */
.bline{display:flex;align-items:center;gap:14px;min-height:var(--tap-comfortable);padding:14px 0;border-bottom:1px solid var(--line2)}
.bline:last-child{border-bottom:none}
.bline .ico{color:var(--gold);flex:none}
.bline .bl-m{flex:1;min-width:0}
.bline .bl-n{font-size:16px;font-weight:500;letter-spacing:-0.1px}
.bline .bl-s{font-family:var(--mono);font-size:9px;letter-spacing:0.4px;text-transform:uppercase;color:var(--sub);margin-top:4px;line-height:1.4}
.bline .bl-r{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}
.bline .bl-v{font-family:var(--serif);font-weight:600;font-size:17px;letter-spacing:-0.2px}
/* .exp-del : définie une seule fois désormais, dans features.css (chargé
   après ce fichier — cette redéfinition ici ne servait donc plus à rien,
   masquée par la cascade ; supprimée pour ne garder qu'une source). */
/* .bud-card : définie une seule fois désormais, dans features.css (chargé
   après ce fichier — cette version-ci n'apportait plus que margin-bottom,
   repris là-bas ; le reste de ses propriétés était déjà masqué par la
   cascade, silencieusement, sans que l'ordre des <link> ne le dise nulle
   part). */
.bud-l{font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:var(--sub)}
/* .bud-v : définie une seule fois désormais, dans features.css (chargé
   après ce fichier — cette version-ci était entièrement masquée). */
.bud-s{font-family:var(--mono);font-size:9px;letter-spacing:0.8px;text-transform:uppercase;color:var(--sub);margin-top:8px}

/* ── payment ── */
.pay-sum{display:flex;gap:13px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:13px;align-items:center;margin-top:12px}
.pay-sum .th{width:62px;height:62px;border-radius:var(--r-sm);background:var(--tile-bg);display:flex;align-items:center;justify-content:center;color:var(--ink);flex:none}
.pay-sum .th .ico{opacity:0.3}
.pay-sum .ps-n{font-family:var(--serif);font-weight:600;font-size:16px}
.pay-sum .ps-s{font-family:var(--mono);font-size:9px;letter-spacing:0.6px;text-transform:uppercase;color:var(--sub);margin-top:3px}
.pay-sum .ps-v{margin-left:auto;font-family:var(--serif);font-weight:600;font-size:17px;flex:none}
.cardform{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.cf{background:var(--surface2);border:1px solid var(--line2);border-radius:var(--r-sm);padding:10px 13px}
.cf.full{grid-column:1 / -1}
.cf label{display:block;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--sub)}
.cf input{width:100%;border:none;background:transparent;outline:none;font-family:var(--serif);font-size:16px;color:var(--ink);margin-top:5px}
.cf input::placeholder{color:var(--ph)}
.secure{display:flex;align-items:center;justify-content:center;gap:7px;font-family:var(--mono);font-size:9px;letter-spacing:0.8px;text-transform:uppercase;color:var(--sub);margin-top:18px}

/* ── confirmation ── */
.conf{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 36px;opacity:0;transform:translateY(28px);transition:all 0.5s cubic-bezier(0.22,1,0.36,1)}
.conf.show{opacity:1;transform:none}
.conf .c-badge{width:72px;height:72px;border-radius:50%;background:var(--ink);color:var(--gold-soft);display:flex;align-items:center;justify-content:center;margin-bottom:24px;position:relative}
.conf .c-badge::before{content:'';position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--gold-soft);opacity:0;transform:scale(0.7)}
.conf.show .c-badge::before{animation:cbadgePulse 0.9s cubic-bezier(.22,.68,.2,1) 0.25s forwards}
.conf .c-badge .ico path{stroke-dasharray:48;stroke-dashoffset:48}
.conf.show .c-badge .ico path{animation:cbadgeCheck 0.5s ease-out 0.3s forwards}
@keyframes cbadgePulse{0%{opacity:0.6;transform:scale(0.7)}100%{opacity:0;transform:scale(1.35)}}
@keyframes cbadgeCheck{to{stroke-dashoffset:0}}
.conf h1{font-family:var(--serif);font-weight:600;font-size:27px;letter-spacing:-0.4px}
.conf .c-s{font-size:14px;font-weight:300;color:var(--sub);line-height:1.6;margin-top:11px}
.conf .c-ref{font-family:var(--mono);font-size:10px;letter-spacing:1.4px;color:var(--sub);margin-top:16px}
.conf-acts{padding:0 28px 46px;display:flex;flex-direction:column;gap:11px}

/* ── generation — rose des vents (direction Hic Sunt) ── */
@keyframes hs-spin{to{transform:rotate(360deg)}}
@keyframes hs-pulse{0%,100%{opacity:.25;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}
.gen{flex:1;display:flex;flex-direction:column;color:var(--ink);opacity:0;transition:opacity 0.7s ease;background:var(--bg);position:relative;overflow:hidden}
.gen.run{opacity:1}
.gen2-head{padding:54px 26px 0;flex:none}
.gen2-eyebrow-row{display:flex;align-items:center;justify-content:space-between}
.gen2-title{
  font-family:var(--serif);font-weight:600;font-size:34px;
  line-height:1.06;letter-spacing:-0.5px;margin-top:20px;
  display:flex;align-items:baseline;gap:12px;
}
.gen2-flag{width:9px;height:9px;border-radius:50%;background:var(--accent,var(--gold));display:inline-block;transform:translateY(-4px);flex:none}
.gen2-status{font-size:13px;color:var(--sub);margin-top:12px;min-height:18px;transition:opacity 0.28s ease}
.gen2-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--accent,var(--gold));margin-right:8px;vertical-align:middle;animation:hs-pulse 1.1s ease-in-out infinite}
.gen2-meta{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--sub);margin-top:9px}
.gen-compass-wrap{position:relative;height:260px;display:flex;align-items:center;justify-content:center;flex:none}
.gen-loader{overflow:visible}
/* Radar de localisation : anneaux qui grandissent et s'effacent depuis
   le pin, en boucle décalée — façon "recherche de position" GPS. */
.gen-loader .gl-ping{
  fill:none;stroke:var(--accent,var(--gold));stroke-width:2;
  transform-origin:115px 115px;opacity:0;
  animation:genPing 2.7s cubic-bezier(.22,.68,.2,1) infinite;
}
@keyframes genPing{
  0%{transform:scale(0.3);opacity:.9}
  65%{opacity:.12}
  100%{transform:scale(2.15);opacity:0}
}
.gen-loader .gl-pin path{fill:var(--accent,var(--ink))}
.gen-loader .gl-pin .gl-pin-hole{fill:var(--bg)}
.gen-checklist{
  margin:22px 24px 0;background:var(--surface);border:1px solid var(--line);border-radius:var(--card-radius);
  padding:18px 20px;box-shadow:var(--shadow-card);
  display:flex;flex-direction:column;gap:13px;flex:none;
}
.gen-check-it{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--ph);transition:color 0.25s ease}
.gci-mark{width:18px;height:18px;border-radius:50%;border:2px solid var(--line2);flex:none;display:flex;align-items:center;justify-content:center;position:relative;transition:border-color 0.25s ease,background 0.25s ease}
.gci-dot{display:none}
.gci-check{color:var(--surface);opacity:0;transition:opacity 0.2s ease}
.gen-check-it.active{color:var(--ink);font-weight:600}
.gen-check-it.active .gci-mark{border-color:var(--gold);border-top-color:transparent;animation:hs-spin .9s linear infinite}
.gen-check-it.done{color:var(--ink-soft)}
.gen-check-it.done .gci-mark{border-color:var(--gold);background:var(--gold);animation:none}
.gen-check-it.done .gci-check{opacity:1}
.gen-progress-wrap{margin:auto 24px 54px;flex:none}
.gen-progress-row{display:flex;justify-content:space-between;margin-bottom:9px}
.gen-progress-label{font-family:var(--mono);font-size:10px;color:var(--sub);letter-spacing:.16em;text-transform:uppercase}
.gen-progress-pct{font-family:var(--mono);font-size:11px;color:var(--gold)}
.gen-progress-track{height:5px;border-radius:3px;background:var(--line2);overflow:hidden}
.gen-progress-fill{height:100%;border-radius:3px;background:var(--gold-deep);transition:width 0.3s linear}
/* Une barre à l'arrêt ne dit pas si le travail avance ou s'il est mort. Ce
   reflet qui la traverse ne promet aucun avancement — il dit seulement que
   l'app est vivante, ce qui est la seule chose qu'elle sache vraiment
   pendant qu'elle attend le serveur. */
.gen-progress-fill.vivant{position:relative;overflow:hidden}
.gen-progress-fill.vivant::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:translateX(-100%);animation:genVivant 1.9s ease-in-out infinite;
}
@keyframes genVivant{ to{ transform:translateX(100%) } }
.gen-progress-note{display:flex;justify-content:space-between;gap:12px;margin-top:9px;min-height:14px}
.gen-progress-note span{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--sub);font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){
  .gen-progress-fill.vivant::after{animation:none;opacity:0}
}
/* Composition interrompue : la barre morte cède la place à une explication
   et à une sortie. Reprend la carte de la checklist qu'elle remplace, pour
   que l'écran ne change pas de nature — seulement de propos. */
.gen-panne{
  margin:22px 24px auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--card-radius);
  padding:20px;box-shadow:var(--shadow-card);flex:none;
}
.gen-panne-lieu{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--sub);margin:0 0 10px}
.gen-panne-txt{font-size:14px;line-height:1.6;color:var(--ink-soft);margin:0 0 18px}
.gen-panne-acts{display:flex;flex-direction:column;gap:10px}
/* Plus rien ne doit tourner : le radar, le point et la coche affirmaient
   tous les trois qu'une composition était en cours. */
.gen.gen-arret .gl-ping,
.gen.gen-arret .gen2-dot,
.gen.gen-arret .gen-check-it.active .gci-mark{animation:none}
.gen.gen-arret .gl-ping{opacity:.14;transform:scale(1)}
.gen.gen-arret .gen-check-it.active .gci-mark{border-color:var(--line2);border-top-color:var(--line2)}
/* Bloquer animations sur SVG carte géo */
.map-svg path,.map-svg circle,.map-svg g,.minimap svg path,.minimap svg circle,.bigmap svg path,.bigmap svg circle{animation:none !important;stroke-dashoffset:unset !important}

/* ── suggestion de destination (mode Surprenez-moi) ── */
.gen-body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 32px;gap:28px;position:relative}
.gen.suggest .gen-body{gap:14px;text-align:center}
.sugg-dest{font-family:var(--serif);font-weight:600;font-size:44px;letter-spacing:-0.5px;color:var(--onink)}
.sugg-tag{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--gold-soft);line-height:1.4}
.sugg-teaser{font-size:14px;font-weight:300;color:rgba(246,246,243,0.7);line-height:1.6;max-width:280px}
.sugg-coords{font-family:var(--mono);font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(246,246,243,0.4);margin-top:4px}
.sugg-acts{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:18px}
.btn-ghost.on-dark{color:var(--onink);border-color:var(--sub);background:transparent}

/* ── activités ── */
/* Définition complète : voir features.css (chargé après, seule source
   désormais — ce bloc-ci était dupliqué avec des valeurs divergentes,
   silencieusement fusionné propriété par propriété par la cascade). */

/* ── Chat IA — design iOS premium ─────────────────────────────────── */
/* Retour de Charlotte : "remonte le titre aussi" — padding-top comptait
   déjà l'encoche (env(safe-area-inset-top)) EN PLUS de celle posée par
   .ov (parent, core.css), doublant l'espace tout en haut de cet écran
   par rapport à .navbar (core.css) ou .itn-hd (da.css), qui ne comptent
   chacun QUE le petit espace propre à l'écran, jamais l'encoche une
   deuxième fois. */
.chat-nav{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;
  background:rgba(252,251,250,0.92);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-bottom:0.5px solid var(--line);
  flex:none;position:relative;z-index:2;
}
.chat-id{display:flex;align-items:center;gap:10px;flex:1}
.chat-av{
  width:40px;height:40px;border-radius:50%;
  background:var(--accent,var(--ink));
  color:white;display:flex;align-items:center;justify-content:center;
  position:relative;flex:none;
  box-shadow:var(--sh-1);
}
.on-dot{position:absolute;bottom:1px;right:1px;width:10px;height:10px;border-radius:50%;background:#34C759;border:2px solid var(--bg)}
.chat-n{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:-0.2px;color:var(--ink);line-height:1.15}
.chat-st{font-family:var(--mono);font-size:8.5px;letter-spacing:1.4px;color:var(--sub);text-transform:uppercase;margin-top:2px}
.chat-context{text-align:center;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--sub);padding:10px 0 2px;flex:none;background:var(--bg)}
/* ── Carte de changement appliqué (façon "réservation confirmée") ── */
.chat-change-card{
  align-self:flex-start;max-width:86%;margin:2px 0 4px 4px;
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:var(--r-md);
  background:var(--surface);border:1px solid var(--line);
}
.ccc-ico{width:34px;height:34px;border-radius:var(--r-sm);background:var(--surface2);color:var(--gold-deep);display:flex;align-items:center;justify-content:center;flex:none}
.ccc-t{font-family:var(--serif-text);font-weight:600;font-size:14px;color:var(--ink);line-height:1.3}
.ccc-s{font-family:var(--mono);font-size:9.5px;letter-spacing:.5px;color:var(--gold-deep);text-transform:uppercase;margin-top:3px}
/* mise en avant d'un repère de jour dans une réponse ("Jour 5 — flâner") */
.chat-hl{font-family:var(--serif-text);font-style:italic;color:var(--gold-deep);font-weight:600}
/* Léger lavis teinté --accent (même idiome que minimapBg, itineraryView) —
   sans lui, cet écran restait la seule zone de conversation de l'app sur
   un blanc plat, sans le moindre repère de la couleur du voyage en cours
   (retour de Charlotte : "esthétiquement on a rien fait sur cette page"). */
.chat-scroll{
  flex:1;overflow-y:auto;
  padding:16px 14px;
  display:flex;flex-direction:column;gap:6px;
  scrollbar-width:none;
  background:linear-gradient(180deg,var(--accent-tint,var(--bg)) 0%,var(--bg) 220px);
}
.chat-scroll::-webkit-scrollbar{display:none}
.day-sep{
  text-align:center;font-family:var(--mono);font-size:9px;
  font-weight:700;letter-spacing:1px;text-transform:uppercase;
  color:var(--sub);padding:8px 0;
}
.bub{
  max-width:80%;padding:10px 14px;
  font-size:15px;font-weight:400;line-height:1.5;
  word-break:break-word;
}
.bub.them{
  background:var(--surface);
  border:0.5px solid var(--line);
  border-radius:var(--r-md) var(--r-md) var(--r-md) 4px;
  align-self:flex-start;color:var(--ink);
  box-shadow:var(--sh-1);
}
.bub.me,.bub.us{
  background:var(--ink);color:var(--onink);
  border-radius:var(--r-md) var(--r-md) 4px var(--r-md);
  align-self:flex-end;
}
.quick{
  display:flex;gap:8px;padding:10px 14px;
  overflow-x:auto;scrollbar-width:none;flex:none;
  border-top:0.5px solid var(--line);
  background:rgba(252,251,250,0.7);
}
.quick::-webkit-scrollbar{display:none}
/* Teintées --accent plutôt qu'un gris neutre générique — ce sont des
   suggestions actives (un tap déclenche une vraie modification), pas de
   simples étiquettes ; la couleur du voyage en cours les distingue
   mieux qu'un même gris que n'importe quelle autre pilule de l'app.

   ── Ce raisonnement vaut pour LES SUGGESTIONS DU CHAT, et pour elles
   seules. Le sélecteur disait « .quick .chip, .chip » : la virgule
   l'appliquait à TOUTES les pastilles de l'app. Dans les Préférences,
   les sept phrases de « Styles favoris » — chacune sur près de 300 px de
   large — étaient donc en accent pâle EN PERMANENCE, y compris quand
   aucune n'était choisie. L'accent n'y distinguait même plus ce qui
   était sélectionné : il était le fond.

   Relevé par banc-vieilleries, qui compte désormais les grands panneaux
   d'accent — l'angle mort entre la gommette (qui exige un contenu vide)
   et l'aplat (qui exige une couleur opaque).

   Une pastille non choisie reprend donc le gris de .chip (screens.css),
   et .chip.on garde l'accent : sélectionné se voit, non sélectionné se
   tait. C'est la troisième fois aujourd'hui qu'une règle écrite pour un
   endroit précis agit ailleurs — après .itn-hero-photo .ihx-btn, qui
   n'atteignait jamais l'endroit pour lequel elle était écrite. */
.quick .chip{
  flex:none;padding:8px 14px;
  background:var(--accent-tint,var(--surface));
  border:0.5px solid var(--accent-soft,var(--line));
  border-radius:var(--r-lg);font-size:13px;
  color:var(--ink);cursor:pointer;white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
  font-family:var(--sf);
}
.chip:active{background:var(--accent-soft,var(--line2))}
.composer{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;
  padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  background:rgba(252,251,250,0.92);
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border-top:0.5px solid var(--line);flex:none;
}
.composer input{
  flex:1;height:40px;
  background:var(--surface);
  border:0.5px solid var(--line);
  border-radius:var(--r-lg);padding:0 16px;
  font-family:var(--sf);font-size:15px;
  color:var(--ink);outline:none;
  -webkit-appearance:none;
}
.send-btn{
  width:38px;height:38px;border-radius:var(--r-sm);
  background:transparent;color:var(--ink);
  border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;
  flex:none;cursor:pointer;
  transition:transform 0.12s cubic-bezier(0.34,1.2,0.4,1),opacity 0.12s;
  -webkit-tap-highlight-color:transparent;
}
.send-btn:active{transform:scale(0.88)}
.typing{display:flex;gap:5px;padding:10px 14px;background:var(--surface);border:0.5px solid var(--line);border-radius:var(--r-md);align-self:flex-start;width:56px}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--sub);animation:typingDot 1.2s ease-in-out infinite;display:block}
.typing i:nth-child(2){animation-delay:.2s}
.typing i:nth-child(3){animation-delay:.4s}
@keyframes typingDot{0%,80%,100%{transform:scale(0.7);opacity:0.5}40%{transform:scale(1);opacity:1}}