/* Travel2World — outils v2 : styles communs (préfixe ot-), chargés à la demande par tools.js.
   Langage « carnet de voyage » : étiquettes de bagage, tableau des départs à volets, tickets, tampons encreurs.
   Règles : on n'anime que transform/opacity ; pas de backdrop-filter ; pas de filtre sur un calque animé ;
   couleurs par jetons (--ink, --muted, --line, --orange, --surface, --bg) → thème sombre html[data-theme=dark]. */

#app .ot-root{--ot-nuit:#141c28;--ot-creme:#f3ede2;--ot-or:#f2b33d;--ot-saumon:#f6a27a;--ot-tampon:#b4381a;--ot-alerte:#b4381a;--ot-ok:#2d7a4f;--ot-mono:var(--f-mono,ui-monospace,"SF Mono","Cascadia Mono","Segoe UI Mono",Menlo,Consolas,monospace);--ot-ressort:cubic-bezier(.34,1.56,.64,1);--ot-sortie:cubic-bezier(.16,1,.3,1);--ot-claque:cubic-bezier(.55,0,1,.45);--ot-haut:88px;--c:var(--orange);position:relative;padding:clamp(18px,3vw,40px) 0 clamp(56px,7vw,96px)}
html[data-theme=dark] #app .ot-root{--ot-tampon:#f08a5d;--ot-alerte:#f08a5d;--ot-ok:#7fd3a0}
#app .ot-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ------------------------------------------------------------ en-tête */
#app .ot-tete{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-bottom:clamp(22px,3vw,36px)}
#app .ot-eyebrow{margin:0;font:700 .7rem/1.3 var(--ot-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
#app .ot-eyebrow span{color:var(--orange-ink)}
#app .ot-tete h1{margin:0;max-width:24ch;font-family:var(--f-display);font-weight:400;font-variation-settings:"SOFT" 60,"WONK" 1;font-size:clamp(2.1rem,4.4vw,3.6rem);line-height:1.03;letter-spacing:-.025em;text-wrap:balance}
#app .ot-question{margin:0;max-width:62ch;color:var(--muted);font-size:1.06rem;line-height:1.55}

/* bande des six pays : de vraies étiquettes de bagage (liens ?pays=) */
#app .ot-pays{min-width:0;margin-top:6px}
#app .ot-pays ul{display:flex;gap:10px;margin:0;padding:6px 4px 12px;list-style:none;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
#app .ot-pays ul::-webkit-scrollbar{display:none}
#app .ot-pays li{flex:none;scroll-snap-align:center;filter:drop-shadow(0 1px 0 rgba(27,36,51,.22)) drop-shadow(0 6px 9px rgba(58,42,20,.1))}
#app .ot-ptag{position:relative;display:flex;align-items:center;gap:9px;min-height:46px;padding:7px 16px 7px 30px;background:var(--surface);color:var(--ink);text-decoration:none;border-radius:4px 10px 10px 4px;clip-path:polygon(14px 0,100% 0,100% 100%,14px 100%,0 calc(100% - 14px),0 14px);transform-origin:16px 50%;transition:transform .5s var(--ot-ressort),background-color .2s,color .2s}
#app .ot-ptag-trou{position:absolute;left:12px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--bg);box-shadow:inset 0 1px 2px rgba(0,0,0,.35),0 0 0 2px color-mix(in srgb,var(--c) 55%,transparent)}
#app .ot-ptag b{font:700 .95rem/1 var(--ot-mono);letter-spacing:.08em;color:var(--c)}
#app .ot-ptag span:last-child{font-size:.88rem;font-weight:600;white-space:nowrap}
#app .ot-ptag.is-on{background:var(--ink);color:var(--bg)}
#app .ot-ptag.is-on b{color:var(--ot-or)}
html[data-theme=dark] #app .ot-ptag b{color:color-mix(in srgb,var(--c) 45%,#f3ede2)}
html[data-theme=dark] #app .ot-ptag.is-on b{color:#8e2f3c}
html[data-theme=dark] #app .ot-ptag.is-on{color:#1b2433}
#app .ot-pays li:has(>.ot-ptag:focus-visible){outline:3px solid var(--orange);outline-offset:3px;border-radius:10px}
#app .ot-ptag:focus-visible{outline:none}
@media (hover:hover) and (pointer:fine){#app .ot-ptag:not(.is-on):hover{transform:rotate(-2deg)}#app .ot-pays li:nth-child(even) .ot-ptag:not(.is-on):hover{transform:rotate(2deg)}}

/* ------------------------------------------------------------ volets (split-flap) */
#app .ot-flaps{display:inline-flex;gap:.08em;vertical-align:middle}
#app .ot-flaps>span[aria-hidden]{display:inline-flex;gap:.08em}
#app .ot-fl{position:relative;display:inline-block;width:.78em;height:1.15em;perspective:260px;font-family:var(--f-poster);font-weight:400;color:#f6efe0;border-radius:6px;background:#1b2433}
#app .ot-fl>span{position:absolute;left:0;right:0;height:50%;overflow:hidden;background:#1b2433;backface-visibility:hidden;-webkit-backface-visibility:hidden}
#app .ot-fl>span>i{display:block;height:1.15em;line-height:1.15em;text-align:center;font-style:normal}
#app .ot-fl-u,#app .ot-fl-fu{top:0;border-radius:6px 6px 0 0;transform-origin:50% 100%}
#app .ot-fl-d,#app .ot-fl-fd{bottom:0;border-radius:0 0 6px 6px;transform-origin:50% 0}
#app .ot-fl-d>i,#app .ot-fl-fd>i{transform:translateY(-50%)}
#app .ot-fl-fu,#app .ot-fl-fd{z-index:2}
#app .ot-fl-fd{transform:rotateX(90deg)}
#app .ot-fl:after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;margin-top:-.5px;background:rgba(0,0,0,.55);z-index:3}
#app .ot-board .ot-fl,html[data-theme=dark] #app .ot-fl{box-shadow:0 0 0 1px rgba(255,255,255,.1)}

/* ------------------------------------------------------------ tableau des départs */
#app .ot-board{background:var(--ot-nuit);color:var(--ot-creme);border-radius:18px;box-shadow:6px 6px 0 var(--orange);padding:14px 16px 6px;overflow:hidden}
html[data-theme=dark] #app .ot-board{box-shadow:0 0 0 1px #f3ede224,6px 6px 0 #f08a5d}
#app .ot-board-tete{display:flex;justify-content:space-between;gap:10px;font:700 .7rem var(--ot-mono);letter-spacing:.14em;color:var(--ot-or);padding:2px 4px 10px;border-bottom:1px solid #f3ede21f}
#app .ot-board-l{list-style:none;margin:0;padding:0}
#app .ot-board-l>li+li{border-top:1px solid #f3ede214}
#app .ot-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:16px;min-height:60px;padding:11px 8px;color:inherit;text-decoration:none;border-radius:10px;transition:background-color .2s}
#app .ot-row-code{font-size:1.55rem;line-height:1}
#app .ot-row-nom b{display:block;font-family:var(--f-display);font-weight:400;font-variation-settings:"SOFT" 60,"WONK" 1;font-size:1.28rem;line-height:1.15}
#app .ot-row-nom small{display:block;margin-top:2px;font:.76rem/1.35 var(--ot-mono);color:#f3ede2a6}
#app .ot-row-statut{font:700 .64rem var(--ot-mono);letter-spacing:.12em;padding:5px 8px;border-radius:6px;background:#f2b33d24;color:var(--ot-or);white-space:nowrap}
#app .ot-row-go{font-weight:700;font-size:.86rem;color:var(--ot-saumon);white-space:nowrap;transition:transform .3s var(--ot-ressort)}
#app .ot-row:focus-visible{outline:3px solid var(--ot-or);outline-offset:-3px}
#app .ot-row.is-choisi .ot-row-statut{background:var(--orange);color:#fff}
@media (hover:hover) and (pointer:fine){#app .ot-row:hover{background:#f3ede20f}#app .ot-row:hover .ot-row-go{transform:translateX(4px)}}
#app .ot-choix h2{margin:0;font-family:var(--f-display);font-weight:400;font-variation-settings:"SOFT" 60,"WONK" 1;font-size:clamp(1.6rem,3vw,2.3rem);letter-spacing:-.02em}
#app .ot-choix-sous{margin:6px 0 18px;color:var(--muted);max-width:60ch}

/* ------------------------------------------------------------ mise en page outil */
#app .ot-grille{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(20px,3vw,44px);align-items:start}
#app .ot-resultat{position:sticky;top:var(--ot-haut);scroll-margin-top:calc(var(--ot-haut) + 8px)}
#app .ot-carte{background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:clamp(16px,2.4vw,26px)}
#app .ot-carte>h2,#app .ot-h2{margin:0 0 14px;font-family:var(--f-display);font-weight:400;font-variation-settings:"SOFT" 60,"WONK" 1;font-size:clamp(1.35rem,2.2vw,1.75rem);letter-spacing:-.02em}
#app .ot-onglets{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;padding:0;list-style:none}
#app .ot-onglets a,#app .ot-onglets button{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--ink);background:var(--surface);color:var(--ink);font-weight:700;font-size:.9rem;text-decoration:none;cursor:pointer}
#app .ot-onglets [aria-current],#app .ot-onglets [aria-pressed=true]{background:var(--ink);color:var(--bg);box-shadow:3px 3px 0 var(--orange)}

/* ------------------------------------------------------------ champs */
#app .ot-form{display:grid;gap:14px}
#app .ot-champs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 18px}
#app .ot-champ label{display:block;margin-bottom:6px;font:700 .66rem/1.3 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
#app .ot-saisie{display:flex;align-items:stretch;min-height:48px;border:1.5px solid var(--ink);border-radius:10px;background:var(--surface);overflow:hidden;transition:box-shadow .15s}
#app .ot-saisie:focus-within{box-shadow:3px 3px 0 var(--orange);outline:2px solid var(--orange);outline-offset:2px}
#app .ot-saisie input{flex:1;min-width:0;width:100%;border:0;border-radius:0;background:transparent;color:var(--ink);font:500 16px/1.2 var(--ot-mono);font-variant-numeric:tabular-nums;padding:12px 12px;box-shadow:none;outline:none}
#app .ot-saisie input::placeholder{color:var(--muted);opacity:.8}
#app .ot-unite{display:flex;align-items:center;flex:none;padding:0 12px;background:var(--soft);border-left:1.5px solid var(--line);font:600 .8rem var(--ot-mono);color:var(--muted);white-space:nowrap}
#app .ot-aide{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:7px 0 0;font-size:.78rem;line-height:1.45;color:var(--muted)}
#app .ot-limite{font-family:var(--ot-mono);font-size:.72rem}
#app .ot-champ.is-vide .ot-saisie{border-style:dashed}
#app .ot-champ.is-vide .ot-erreur{color:var(--muted);font-weight:600}
#app .ot-champ.is-erreur .ot-saisie{border-color:var(--ot-alerte)}
#app .ot-erreur{font-weight:700;color:var(--ot-alerte)}
#app .ot-modifie{display:inline-flex;align-items:center;min-height:44px;margin:-12px 0;padding:0 6px;border:0;background:none;color:var(--orange-ink);font:700 .74rem var(--f-body);cursor:pointer}
#app .ot-modifie[hidden]{display:none}
#app .ot-champ.is-modifie .ot-saisie{border-color:var(--orange)}

/* ------------------------------------------------------------ sources et chiffres */
#app .ot-chiffre{font-family:var(--ot-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
#app .ot-chiffre-verif,#app .ot-chiffre-vide{font-family:var(--f-body);font-style:italic;color:var(--muted);white-space:normal}
#app .ot-src{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:2px 9px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font:600 .7rem/1.6 var(--ot-mono);text-decoration:none;vertical-align:middle;overflow-wrap:anywhere}
#app a.ot-src:hover{border-color:var(--ink);color:var(--ink)}
#app a.ot-src:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
#app .ot-src-hyp{border-style:dashed;background:transparent}
#app .ot-src-verif{border-color:var(--orange);color:var(--orange-ink)}
#app .ot-revoir{display:inline-block;padding:2px 7px;border-radius:6px;background:#f2b33d38;color:#7a4f00;font:700 .62rem/1.5 var(--ot-mono);letter-spacing:.08em;text-transform:uppercase;vertical-align:middle}
html[data-theme=dark] #app .ot-revoir{color:var(--sun)}
#app .ot-eur{display:block;margin-top:6px;font:500 .86rem/1.45 var(--ot-mono);color:var(--muted)}
#app .ot-eur small{font-size:.72rem}
#app .ot-eur-court{display:inline;margin:0}
#app .ot-eur-ko{font-family:var(--f-body)}
#app .ot-lien-btn{display:inline-flex;align-items:center;min-height:44px;margin:-12px 0;padding:0 4px;border:0;background:none;color:var(--orange-ink);font:700 .86rem var(--f-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* ------------------------------------------------------------ ticket de résultat */
#app .ot-ticket{position:relative;background:var(--surface);color:var(--ink);border:1.5px solid var(--ink);border-radius:18px;box-shadow:5px 5px 0 var(--ink);outline:none}
#app .ot-ticket:focus-visible{box-shadow:5px 5px 0 var(--orange)}
#app .ot-ticket-tete{display:flex;justify-content:space-between;gap:10px;padding:10px 18px;border-radius:16px 16px 0 0;background:var(--ink);color:var(--bg);font:700 .66rem/1.3 var(--ot-mono);letter-spacing:.16em;text-transform:uppercase}
#app .ot-ticket-corps{padding:18px 20px 20px}
#app .ot-ticket-chiffre{margin:0;font-family:var(--f-poster);font-weight:400;font-size:clamp(2.3rem,5vw,3.3rem);line-height:1.02;letter-spacing:.01em;color:var(--orange-ink);overflow-wrap:anywhere}
#app .ot-ticket-chiffre.is-neg{color:var(--ot-alerte)}
#app .ot-verdict{margin:12px 0 0;font-size:1.04rem;line-height:1.5}
#app .ot-lignes{margin:16px 0 0;padding-top:6px;border-top:2px dashed var(--line)}
#app .ot-lignes>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
#app .ot-lignes>div:last-child{border-bottom:0}
#app .ot-lignes dt{font:700 .64rem/1.35 var(--f-body);letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
#app .ot-lignes dd{margin:0;font:600 .92rem/1.35 var(--ot-mono);font-variant-numeric:tabular-nums;text-align:right}
#app .ot-lignes .is-total dd{color:var(--orange-ink);font-size:1rem}
#app .ot-ticket-talon{position:relative;padding:12px 20px 14px;border-top:2px dashed var(--line);font-size:.86rem;color:var(--muted)}
#app .ot-ticket-talon:before,#app .ot-ticket-talon:after{content:"";position:absolute;top:-12px;width:22px;height:22px;border-radius:50%;background:var(--bg);border:1.5px solid var(--ink)}
#app .ot-ticket-talon:before{left:-12px;clip-path:inset(0 0 0 50%)}
#app .ot-ticket-talon:after{right:-12px;clip-path:inset(0 50% 0 0)}

/* ------------------------------------------------------------ graphique */
#app .ot-graphe{margin:16px 0 0}
#app .ot-graphe figcaption{margin-bottom:6px;font:700 .64rem var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
#app .ot-graphe svg{display:block;width:100%;height:auto;max-height:260px;overflow:visible}
#app .ot-graphe rect{fill:var(--c,var(--orange))}
#app .ot-graphe .is-neg rect{fill:var(--ot-alerte)}
#app .ot-graphe .is-on rect{fill:var(--ink)}
#app .ot-g-zero{stroke:var(--ink);stroke-width:1.5}
#app .ot-g-v{font:600 12px var(--ot-mono);fill:var(--ink)}
#app .ot-g-x{font:600 12px var(--ot-mono);fill:var(--muted)}
#app .ot-g-table summary{display:inline-flex;align-items:center;min-height:44px;font-weight:700;font-size:.86rem;cursor:pointer;color:var(--orange-ink)}
#app .ot-g-table table{width:100%;border-collapse:collapse;font:.84rem var(--ot-mono)}
#app .ot-g-table th,#app .ot-g-table td{padding:6px 4px;border-bottom:1px solid var(--line);text-align:left}
#app .ot-g-table td{text-align:right}

/* ------------------------------------------------------------ tampon encreur */
#app .ot-tampon{position:absolute;left:72%;top:42%;width:96px;height:96px;color:var(--ot-tampon);opacity:.92;pointer-events:none;mix-blend-mode:multiply;font-family:var(--f-poster);z-index:3}
#app .ot-tampon-date{font-family:var(--f-body);font-weight:700}
html[data-theme=dark] #app .ot-tampon{mix-blend-mode:normal;opacity:.85}

/* ------------------------------------------------------------ fin d'outil : sources, étape suivante, offre */
#app .ot-fin{display:grid;gap:clamp(20px,2.6vw,30px);margin-top:clamp(44px,5vw,68px)}
#app .ot-sources{border-top:2px dashed var(--line);padding-top:6px}
#app .ot-sources summary{display:flex;align-items:center;gap:10px;min-height:46px;cursor:pointer;list-style:none;font:700 .72rem var(--ot-mono);letter-spacing:.14em;text-transform:uppercase}
#app .ot-sources summary::-webkit-details-marker{display:none}
#app .ot-sources summary:before{content:"+";display:inline-grid;place-items:center;width:26px;height:26px;border:1.5px solid var(--ink);border-radius:50%;font:700 1rem/1 var(--f-body);transition:transform .25s var(--ot-ressort)}
#app .ot-sources[open] summary:before{content:"\2212"}
#app .ot-sources summary:focus-visible{outline:3px solid var(--orange);outline-offset:2px;border-radius:8px}
#app .ot-sources-c{max-width:78ch;padding:2px 0 8px 36px;font-size:.9rem;line-height:1.6;color:var(--muted)}
#app .ot-sources-c ul{margin:8px 0;padding-left:1.1em}
#app .ot-sources-c li{margin:3px 0}
#app .ot-sources-c a{color:var(--ink);font-weight:600}
#app .ot-sources-pied{font-size:.8rem}
#app .ot-suite{background:var(--ink);color:var(--bg);border-radius:18px;padding:16px clamp(16px,2.4vw,24px) 8px;box-shadow:5px 5px 0 var(--orange)}
#app .ot-suite-k{margin:0 0 6px;font:700 .66rem var(--ot-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ot-or)}
html[data-theme=dark] #app .ot-suite-k{color:#8a5a00}
#app .ot-suite ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 18px;margin:0;padding:0;list-style:none}
#app .ot-suite-a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;min-height:56px;padding:10px 0;color:inherit;text-decoration:none;border-top:1px solid color-mix(in srgb,var(--bg) 18%,transparent)}
#app .ot-suite-a b{font-family:var(--f-display);font-weight:400;font-size:1.15rem}
#app .ot-suite-a small{grid-column:1;font-size:.82rem;opacity:.75}
#app .ot-suite-a span{grid-row:1/3;grid-column:2;display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--orange);color:#fff;transition:transform .3s var(--ot-ressort)}
html[data-theme=dark] #app .ot-suite-a span{color:#1b2433}
#app .ot-suite-a:focus-visible{outline:3px solid var(--ot-or);outline-offset:2px;border-radius:8px}
@media (hover:hover) and (pointer:fine){#app .ot-suite-a:hover span{transform:translateX(4px)}}
#app .ot-offre{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px 26px;padding:clamp(18px,2.6vw,28px);background:var(--surface);color:var(--ink);border:1.5px solid var(--ink);border-radius:20px;box-shadow:5px 5px 0 var(--c,var(--orange))}
#app .ot-offre h2{margin:2px 0 6px;font-family:var(--f-display);font-weight:400;font-variation-settings:"SOFT" 60,"WONK" 1;font-size:clamp(1.35rem,2.4vw,1.8rem);letter-spacing:-.02em}
#app .ot-offre p{margin:0;color:var(--muted);line-height:1.5}
#app .ot-offre-k{font:700 .66rem var(--ot-mono)!important;letter-spacing:.16em;text-transform:uppercase}
#app .ot-offre-badge{display:inline-block;padding:3px 8px;border-radius:6px;background:var(--orange);color:#fff;letter-spacing:.1em}
html[data-theme=dark] #app .ot-offre-badge{color:#1b2433}
#app .ot-offre-act{display:grid;justify-items:end;gap:8px;text-align:right}
#app .ot-offre-prix{font-family:var(--f-poster);font-weight:400;font-size:2.3rem;line-height:1;color:var(--orange-ink)}
#app .ot-offre-act s{color:var(--muted);font-size:.9rem}

/* ------------------------------------------------------------ boutons et liens */
#app .ot-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:0 20px;border:0;border-radius:999px;background:var(--ink);color:var(--bg);font:700 .95rem var(--f-body);text-decoration:none;box-shadow:3px 3px 0 var(--orange);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}
#app .ot-btn-clair{background:var(--surface);color:var(--ink);border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
#app .ot-btn:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
#app .ot-btn.in-cart{background:#2d7a4f;color:#fff}
#app .ot-btn.in-cart:after{content:" ✓"}
@media (hover:hover) and (pointer:fine){#app .ot-btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--orange)}#app .ot-btn-clair:hover{box-shadow:4px 4px 0 var(--ink)}}
#app .ot-btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--orange);transition-duration:.06s}
#app .ot-lien{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange);text-decoration-thickness:2px;text-underline-offset:4px}

/* ------------------------------------------------------------ réglette (téléphone) et toast */
#app .ot-reglette{display:none;--ot-nuit:#141c28;--ot-creme:#f3ede2;--ot-or:#f2b33d;--ot-mono:var(--f-mono,ui-monospace,"SF Mono",Menlo,Consolas,monospace);--ot-sortie:cubic-bezier(.16,1,.3,1)}
.ot-toast{position:fixed;z-index:9600;left:50%;bottom:calc(26px + env(safe-area-inset-bottom,0px));max-width:calc(100vw - 32px);padding:10px 16px;border-radius:999px;background:var(--ink,#1b2433);color:var(--bg,#f3ede2);font:700 .9rem var(--f-body,system-ui);box-shadow:3px 3px 0 var(--orange,#c94d23);opacity:0;transform:translate(-50%,16px);pointer-events:none;transition:opacity .2s,transform .3s cubic-bezier(.16,1,.3,1)}
.ot-toast.is-on{opacity:1;transform:translate(-50%,0)}

/* ------------------------------------------------------------ tablette et téléphone */
@media (max-width:900px){
  #app .ot-grille{grid-template-columns:minmax(0,1fr)}
  #app .ot-resultat{position:static}
}
@media (max-width:760px){
  #app .ot-root{padding-top:12px}
  #app .ot-tete{gap:8px;margin-bottom:18px}
  #app .ot-eyebrow,#app .ot-question{display:none}
  #app .ot-tete h1{font-size:clamp(1.5rem,6.4vw,1.85rem);line-height:1.08;max-width:none}
  #app .ot-pays{margin:0 -20px}
  #app .ot-pays ul{padding:4px 20px 8px;gap:8px}
  #app .ot-ptag{min-height:44px;padding:6px 12px 6px 26px}
  #app .ot-ptag span:last-child{font-size:.8rem}
  #app .ot-champs{grid-template-columns:minmax(0,1fr)}
  #app .ot-row{grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;padding:10px 4px}
  #app .ot-row-code{font-size:1.25rem;grid-row:1/3}
  #app .ot-row-statut{grid-column:3;grid-row:1/3;justify-self:end;align-self:center;max-width:8.5em;white-space:normal;text-align:center;line-height:1.35}
  #app .ot-row-go{display:none}
  #app .ot-row-nom b{font-size:1.12rem}
  #app .ot-row-nom small{font-size:.7rem}
  #app .ot-board{padding:10px 10px 4px;box-shadow:4px 4px 0 var(--orange)}
  #app .ot-offre{grid-template-columns:minmax(0,1fr)}
  #app .ot-offre-act{justify-items:start;text-align:left;grid-template-columns:auto auto;align-items:center}
  #app .ot-offre-act .ot-btn{grid-column:1/-1}
  #app .ot-ticket-corps{padding:16px}
  #app .ot-sources-c{padding-left:0}
  #app .ot-reglette{position:fixed;z-index:8700;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 14px;background:var(--ot-nuit);color:var(--ot-creme);border-radius:14px;box-shadow:3px 3px 0 var(--orange);text-decoration:none;transition:transform .32s var(--ot-sortie),opacity .2s}
  #app .ot-reglette-l{font:700 .6rem/1.2 var(--ot-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ot-or);max-width:7.5em}
  #app .ot-reglette b{font:400 1.35rem/1 var(--f-poster);white-space:nowrap}
  #app .ot-reglette-e{flex:1;min-width:0;font:.76rem var(--ot-mono);color:#f3ede2b3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #app .ot-reglette-go{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--orange);color:#fff;flex:none}
  #app .ot-reglette.is-cache{opacity:0;transform:translateY(14px);pointer-events:none}
  html.mc-barre-on #app .ot-reglette{bottom:calc(80px + env(safe-area-inset-bottom,0px))}
  html.mc-range #app .ot-reglette{transform:translateY(72px)}
  html.mc-range #app .ot-reglette.is-cache{transform:translateY(86px)}
  html.ot-reglette-on #app .ot-root{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  html.ot-reglette-on.mc-barre-on .globi{bottom:calc(146px + env(safe-area-inset-bottom,0px))!important}
  html.ot-actif.mc-barre-on .ot-toast{bottom:calc(146px + env(safe-area-inset-bottom,0px))}
}

/* ------------------------------------------------------------ mouvement réduit */
@media (prefers-reduced-motion:reduce){
  #app .ot-root *,#app .ot-root *:before,#app .ot-root *:after,.ot-toast{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* ------------------------------------------------------------ impression */
@media print{
  #app>header,#app>footer,header,.mc-barre,.globi,.ot-toast,#app .ot-pays,#app .ot-reglette,#app .ot-offre,#app .ot-suite,.cn-annonce,.cookie-banner{display:none!important}
  #app .ot-root{padding:0}
  #app .ot-root *{box-shadow:none!important}
  #app .ot-root .reveal,#app .ot-root .m-rv{opacity:1!important;transform:none!important;translate:none!important}
  #app .ot-board{background:none!important;color:#000!important;border:1px solid #000}
  #app .ot-board *{color:#000!important}
  #app .ot-fl,#app .ot-fl>span{background:none!important;color:#000!important}
  #app .ot-ticket,#app .ot-carte{break-inside:avoid;border-color:#000}
  #app .ot-sources-c a[href^="http"]:after{content:" (" attr(href) ")";font-size:.72em;word-break:break-all}
  #app .ot-root button,#app .ot-root .ot-modifie{display:none!important}
  #app .ot-resultat{position:static}
}
/* 16/10 : drapeau à la place du code d'aéroport dans « Les 6 pays en un coup d'œil » */
#app .ot-row-code img{display:block;width:30px;height:22px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px #f3ede229}

/* 16/10 : pages d'outils courtes (option court de T2W_OT.page) : choix du pays en 6 boutons, 3 étapes, offre en une ligne */
#app .ot-choix-court h2{font-size:clamp(1.25rem,2.2vw,1.6rem)}
#app .ot-choix-g{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:760px}
#app .ot-choix-p{display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 14px;border:1px solid var(--line);border-radius:var(--tp-r,12px);background:var(--surface);color:var(--ink);font-weight:600;text-decoration:none;transition:border-color .15s,background-color .15s}
#app .ot-choix-p:hover{border-color:var(--c)}
#app .ot-choix-p:focus-visible{outline:2px solid var(--c);outline-offset:2px}
#app .ot-choix-p img{flex:none;width:30px;height:22px;border-radius:3px;object-fit:cover;box-shadow:0 0 0 1px var(--line)}
#app .ot-choix-p span{min-width:0;overflow-wrap:anywhere}
#app .ot-etapes{list-style:none;counter-reset:ot-e;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--muted);font-size:.95rem}
#app .ot-etapes li{counter-increment:ot-e;display:flex;align-items:baseline;gap:7px}
#app .ot-etapes li:before{content:counter(ot-e);flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--ink);color:var(--bg);font-size:.72rem;font-weight:700;transform:translateY(-1px)}
#app .ot-fin-court{gap:14px;margin-top:clamp(28px,4vw,44px)}
#app .ot-offre-ligne{margin:0;color:var(--muted);font-size:.95rem}
#app .ot-offre-ligne a{color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:3px}
@media (max-width:560px){#app .ot-choix-g{grid-template-columns:repeat(2,minmax(0,1fr))}#app .ot-etapes{flex-direction:column;gap:4px}}