/* Polices hébergées par Cofront (plus de Google Fonts : aucune donnée envoyée à Google, et plus rapide) */
@font-face{font-family:'Sora';font-style:normal;font-weight:600;font-display:swap;src:url(font-sora-600.woff2) format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:700;font-display:swap;src:url(font-sora-700.woff2) format('woff2')}
@font-face{font-family:'Sora';font-style:normal;font-weight:800;font-display:swap;src:url(font-sora-800.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url(font-dmsans-400.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url(font-dmsans-500.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;src:url(font-dmsans-600.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url(font-dmsans-700.woff2) format('woff2')}
/* =====================================================================
   COFRONT — feuille de style (design « France ⇄ Suisse », octobre 2026)
   Layout : appli téléphone sur une colonne — en-tête, bandeau douane
   animé, carte zoomable, cartes arrondies, barre de navigation flottante.
   ===================================================================== */
:root{
  --bg:#F3F5F9; --surface:#FFFFFF; --ink:#0E1630; --muted:#5A6378; --line:#E1E6EF; --soft:#EDF0F5;
  --ch:#DA291C; --ch-dark:#B4231A; --ch-soft:#FBEAE8;
  --fr:#0055A4; --fr-red:#EF4135; --fr-soft:#E3ECF8;
  --ok:#1E8E5A; --ok-soft:#E2F4EA; --gold:#FFC83D;
  --f-display:"Sora","Avenir Next",system-ui,sans-serif;
  --f-body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --solid:#0E1630; --r:22px; --shadow:0 2px 10px rgba(14,22,48,.06); --shadow-lg:0 10px 30px rgba(14,22,48,.12);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;
  padding-inline:16px;padding-block:env(safe-area-inset-top,0px) calc(110px + env(safe-area-inset-bottom,0px))}
[hidden]{display:none!important}
button,input,select,textarea{font-family:inherit}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--fr);outline-offset:2px}
.app{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:16px}

/* ---------- En-tête ---------- */
header{padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.logo{width:44px;height:44px;flex:none}
.word{font:800 24px/1 var(--f-display);letter-spacing:-.02em}
.tag{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:12px;font-weight:600;color:var(--muted)}
.flag{display:inline-block;flex:none;border-radius:3px;vertical-align:middle}
.me-btn{width:44px;height:44px;border-radius:50%;border:0;background:var(--fr);color:#fff;font:700 17px var(--f-display);cursor:pointer;flex:none}

/* ---------- Bandeau douane ---------- */
.banner{border-radius:24px;overflow:hidden;box-shadow:var(--shadow-lg);line-height:0}
.banner svg{width:100%;height:auto;display:block}
.cf-car{transform:translate(-80px,70px);animation:cfdrive 7s linear infinite}
.cf-arm{transform-box:fill-box;transform-origin:0% 50%;animation:cflift 7s linear infinite}
@keyframes cfdrive{from{transform:translate(-80px,70px)}to{transform:translate(380px,70px)}}
@keyframes cflift{0%,30%{transform:rotate(0deg)}38%,58%{transform:rotate(-78deg)}66%,100%{transform:rotate(0deg)}}
@media (prefers-reduced-motion:reduce){.cf-car{animation:none;transform:translate(232px,70px)}.cf-arm{animation:none;transform:rotate(-78deg)}}

/* ---------- Chiffres du jour ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.stat{background:var(--surface);border-radius:18px;padding:12px 8px;text-align:center;box-shadow:var(--shadow)}
.stat b{display:block;font:800 26px/1 var(--f-display);font-variant-numeric:tabular-nums}
.stat span{font-size:12px;font-weight:600;color:var(--muted)}
.stat:nth-child(1) b{color:var(--fr)}.stat:nth-child(2) b{color:var(--ch)}.stat:nth-child(3) b{color:var(--ok)}

/* ---------- Carte ---------- */
.map-wrap{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-lg);background:#E8EEF6}
.map{height:240px;width:100%;z-index:0}
.map-chip{position:absolute;left:12px;top:12px;z-index:500;background:var(--solid);color:#fff;border-radius:999px;padding:7px 13px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:8px;pointer-events:none}
.map-chip::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ch)}
.map-off{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-weight:600;font-size:14px;padding:20px;text-align:center}
.leaflet-container{font-family:var(--f-body)!important}
.leaflet-control-zoom{border:0!important;box-shadow:none!important;display:flex;flex-direction:column;gap:8px}
.leaflet-control-zoom a{width:44px!important;height:44px!important;line-height:44px!important;border-radius:14px!important;border:0!important;background:#fff!important;color:var(--ink)!important;font:600 22px/44px var(--f-body)!important;box-shadow:0 4px 12px rgba(14,22,48,.15)}
.leaflet-control-attribution{font-size:10px!important;background:rgba(255,255,255,.75)!important}
.pin{width:18px;height:18px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 6px rgba(14,22,48,.35)}
.pin.fr{background:var(--fr)}.pin.ch{background:var(--ch)}
.price-pin{background:var(--solid);color:#fff;border-radius:999px;padding:6px 11px;font:700 13px var(--f-body);white-space:nowrap;box-shadow:0 4px 12px rgba(14,22,48,.3);transform:translate(-50%,-50%);display:inline-block}
.price-pin.free{background:var(--ch)}
.price-pin.taken{background:#fff;color:var(--muted);text-decoration:line-through}
.leaflet-popup-content-wrapper{border-radius:16px!important;box-shadow:var(--shadow-lg)!important}
.leaflet-popup-content{margin:12px 14px!important;font:600 14px/1.4 var(--f-body)!important;color:var(--ink)}

/* ---------- Titres, champs ---------- */
.panel{display:flex;flex-direction:column;gap:14px}
h2{font:700 21px/1.15 var(--f-display);margin:6px 0 0;letter-spacing:-.01em;text-wrap:balance}
.note{font-size:14px;color:var(--muted);font-weight:500;margin:0}
.filters{display:grid;grid-template-columns:1fr 1fr;gap:10px}
label,.field{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;min-width:0}
input,select,textarea{font:600 16px var(--f-body);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;width:100%;text-transform:none;letter-spacing:0}
input::placeholder{color:#9AA3B5;font-weight:500}
.count{font-size:13px;font-weight:600;color:var(--muted)}
.list{display:flex;flex-direction:column;gap:12px}

/* Dates */
.dates{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;margin:0 -2px;scroll-snap-type:x proximity;scrollbar-width:none}
.dates::-webkit-scrollbar{display:none}
.date{flex:none;scroll-snap-align:start;width:60px;height:70px;border-radius:18px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.date small{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase}
.date b{font:700 20px/1.1 var(--f-display);font-variant-numeric:tabular-nums}
.date[aria-pressed="true"]{background:var(--solid);border-color:var(--solid);color:#fff}
.date[aria-pressed="true"] small{color:#C9D0DE}

/* Jours, paiements */
.days,.pays{display:flex;gap:6px;flex-wrap:wrap}
.days button{font:700 14px var(--f-body);width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.days button[aria-pressed="true"]{background:var(--fr);border-color:var(--fr);color:#fff}
.pays button{font:700 14px var(--f-body);padding:10px 15px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.pays button[aria-pressed="true"]{background:var(--ok);border-color:var(--ok);color:#fff}

/* ---------- Boutons ---------- */
.btn{font:700 15px var(--f-body);border:0;border-radius:999px;padding:11px 18px;min-height:44px;cursor:pointer;background:var(--ch);color:#fff;transition:transform .08s,background .15s}
.btn:active{transform:scale(.97)}
.btn:hover{background:var(--ch-dark)}
.btn.ghost{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.btn.ghost:hover{background:var(--soft)}
.btn.ok{background:var(--ok)}
.btn.sm{padding:8px 14px;font-size:14px;min-height:40px}
.btn.wide{width:100%;padding:15px;font-size:17px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.toggle{align-self:flex-start}
.confirm{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-weight:600;font-size:14px}

/* ---------- Cartes trajet / parking ---------- */
.card{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);display:grid;grid-template-columns:78px 1fr;overflow:hidden}
.stub{background:var(--soft);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:14px 4px;text-align:center}
.stub .h{font:800 21px/1 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stub .s{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.stub .r{margin-top:6px;font-size:11px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.card.mine .stub{background:var(--ok-soft)}
.card.full{opacity:.7}
.card.park .stub{background:var(--fr-soft);color:var(--fr)}
.card.park .stub .s{color:var(--fr)}
.stub .bigP{font:800 26px/1 var(--f-display);width:48px;height:48px;border-radius:14px;background:var(--fr);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.card.hl{box-shadow:0 0 0 2px var(--ch),var(--shadow-lg)}
.body{padding:14px 14px 14px 14px;display:flex;flex-direction:column;gap:10px;min-width:0}
.route{display:flex;flex-direction:column;gap:3px}
.route .p{font:700 16px/1.25 var(--f-body);display:flex;align-items:center;gap:7px;overflow-wrap:anywhere}
.route .arrow{font-size:12px;font-weight:600;color:var(--muted);padding-left:2px}
.meta{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--soft);color:var(--ink)}
.chip.price{background:var(--fr-soft);color:var(--fr)}
.chip.ok{background:var(--ok-soft);color:var(--ok)}
.chip.when{background:var(--ch-soft);color:var(--ch-dark)}
.who{font-size:13px;color:var(--muted);font-weight:500;overflow-wrap:anywhere}
.who b{color:var(--ink);font-weight:700}
.seats{display:flex;gap:4px}
.seat{width:14px;height:14px;border-radius:4px;border:1.5px solid var(--line);background:var(--surface)}
.seat.taken{background:var(--ch);border-color:var(--ch)}
.foot{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.acts{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- États vides ---------- */
.empty{background:var(--surface);border:1.5px dashed var(--line);border-radius:var(--r);padding:22px 18px;text-align:center;color:var(--muted);display:flex;flex-direction:column;gap:10px;align-items:center;font-weight:500}
.empty svg{width:88px;height:auto}
.empty strong{font:700 18px var(--f-display);color:var(--ink)}

/* ---------- Formulaires ---------- */
form.card{display:flex;flex-direction:column;gap:14px;padding:18px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hint{font-size:13px;color:var(--muted);font-weight:500;background:var(--soft);border-radius:12px;padding:10px 12px}

/* ---------- Messages ---------- */
.thread{display:flex;gap:12px;align-items:center;background:var(--surface);border:0;border-radius:18px;padding:12px;box-shadow:var(--shadow);cursor:pointer;text-align:left;color:var(--ink);width:100%}
.thread .av{flex:none;width:42px;height:42px;border-radius:50%;background:var(--ch-soft);color:var(--ch-dark);display:flex;align-items:center;justify-content:center;font:700 17px var(--f-display)}
.thread .tx{min-width:0;display:flex;flex-direction:column}
.thread .tx b{font-weight:700}
.thread .tx span{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- Barre de navigation flottante ---------- */
nav{position:fixed;left:12px;right:12px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:1000}
nav .in{max-width:540px;margin:0 auto;height:68px;border-radius:24px;background:var(--solid);display:grid;grid-template-columns:repeat(4,1fr);align-items:center;box-shadow:0 10px 30px rgba(14,22,48,.3);padding:0 4px}
nav button{position:relative;background:none;border:0;color:#9AA4BC;font:700 11px var(--f-body);display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;height:60px;border-radius:18px}
nav button svg{width:22px;height:22px}
nav button[aria-selected="true"]{color:#fff}
nav .badge{position:absolute;top:4px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--ch);color:#fff;font-size:11px;line-height:18px}

/* ---------- Discussion ---------- */
.scrim{position:fixed;inset:0;background:rgba(14,22,48,.45);z-index:1100;display:flex;align-items:flex-end;justify-content:center}
.sheet{width:100%;max-width:560px;max-height:86%;background:var(--bg);border-radius:26px 26px 0 0;display:flex;flex-direction:column;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));gap:10px}
.sheet .top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.sheet .top h3{margin:0;font:700 20px/1.15 var(--f-display)}
.sheet .top p{margin:2px 0 0;font-size:13px;color:var(--muted);font-weight:600}
.msgs{flex:1;min-height:180px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:6px 2px}
.bubble{max-width:80%;padding:10px 14px;border-radius:18px 18px 18px 6px;background:var(--surface);font-weight:500;overflow-wrap:anywhere;align-self:flex-start;box-shadow:var(--shadow)}
.bubble.me{align-self:flex-end;background:var(--fr);color:#fff;border-radius:18px 18px 6px 18px}
.bubble time{display:block;font-size:11px;font-weight:600;opacity:.7;margin-top:2px}
.quick{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.quick button{flex:none;font:600 13px var(--f-body);border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:8px 12px;cursor:pointer}
.compose{display:flex;gap:8px}
.compose input{flex:1;min-width:0}
.privacy{font-size:12px;color:var(--muted);font-weight:500;margin:0}

/* ---------- Suggestions de lieux ---------- */
.sug-host{position:relative}
.sug{position:absolute;left:0;right:0;top:100%;margin:6px 0 0;padding:6px;list-style:none;z-index:900;background:var(--surface);border-radius:16px;box-shadow:var(--shadow-lg);max-height:280px;overflow-y:auto;min-width:220px}
.sug li{padding:10px;border-radius:10px;font:600 15px var(--f-body);color:var(--ink);cursor:pointer;text-transform:none;letter-spacing:0;display:flex;align-items:center;gap:10px}
.sug li small{display:block;font-size:12px;color:var(--muted);font-weight:500}
.sug li:hover,.sug li.on{background:var(--soft)}

/* ---------- Écran de connexion ---------- */
.gate{max-width:440px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.gate .card{display:flex;flex-direction:column;gap:14px;padding:22px}
.gate h1{font:800 28px/1.1 var(--f-display);margin:0;letter-spacing:-.02em;text-wrap:balance}
.gate p{margin:0;color:var(--muted);font-weight:500}
.perks{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.perks li{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.perks li::before{content:"";flex:none;width:10px;height:10px;margin-top:6px;border-radius:50%;background:var(--ch)}
.err{color:var(--ch);font-weight:700;font-size:14px;margin:0}
.loading{padding:28px 0;display:flex;flex-direction:column;gap:14px}
.linkbtn{background:none;border:0;color:var(--muted);font:600 14px var(--f-body);text-decoration:underline;cursor:pointer;padding:6px 0;align-self:flex-start}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(96px + env(safe-area-inset-bottom,0px));background:var(--solid);color:#fff;padding:12px 18px;border-radius:16px;font-weight:600;font-size:14px;max-width:calc(100% - 40px);text-align:center;z-index:1200;box-shadow:var(--shadow-lg)}
#confetti{position:fixed;inset:0;pointer-events:none;z-index:1150}
@media (max-width:380px){.filters,.row2{grid-template-columns:1fr}}
@media (prefers-reduced-motion:no-preference){.card{animation:pop .25s ease-out}@keyframes pop{from{transform:translateY(4px);opacity:.6}to{transform:none;opacity:1}}
  .sheet{animation:up .25s ease-out}@keyframes up{from{transform:translateY(30px)}to{transform:none}}}

/* ---------- Favoris ---------- */
.fav-btn{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:700 14px var(--f-body);cursor:pointer}
.fav-btn svg{fill:none}
.fav-btn[aria-pressed="true"]{background:var(--gold);border-color:var(--gold)}
.fav-btn[aria-pressed="true"] svg{fill:var(--ink)}
.fav-row{display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:18px;padding:10px 12px;box-shadow:var(--shadow)}
.fav-go{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;background:none;border:0;padding:4px 0;cursor:pointer;text-align:left;color:var(--ink)}
.fav-go b{font-weight:700;font-size:15px}
.fav-go span{font-size:12px;color:var(--muted);font-weight:500}

/* ---------- Carte notifications ---------- */
.notif-card{display:flex;align-items:center;gap:12px;background:var(--solid);color:#fff;border-radius:20px;padding:14px 16px;box-shadow:var(--shadow-lg)}
.notif-card .notif-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.notif-card b{font:700 16px var(--f-display)}
.notif-card span{font-size:13px;color:#C9D0DE;font-weight:500}
.notif-card .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}

.date.week{background:var(--gold);border-color:var(--gold)}
.date.week small{color:var(--ink)}
.date.week b{font-size:15px}

/* ---------- Douane en direct ---------- */
.douane{background:var(--surface);border-radius:22px;padding:4px 0;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px}
.douane-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;flex-wrap:wrap}
.douane h2{margin:0;font-size:18px;display:flex;align-items:center;gap:8px}
.live-dot{width:10px;height:10px;border-radius:50%;background:var(--ch);box-shadow:0 0 0 0 rgba(218,41,28,.5)}
@media (prefers-reduced-motion:no-preference){.live-dot{animation:live 1.8s ease-out infinite}@keyframes live{0%{box-shadow:0 0 0 0 rgba(218,41,28,.5)}100%{box-shadow:0 0 0 10px rgba(218,41,28,0)}}}
.seg{display:inline-flex;background:var(--soft);border-radius:999px;padding:3px;gap:2px}
.seg button{border:0;background:none;border-radius:999px;padding:7px 12px;font:700 13px var(--f-body);color:var(--muted);cursor:pointer;min-height:36px}
.seg button[aria-pressed="true"]{background:var(--solid);color:#fff}
.seg.wide{display:flex}.seg.wide button{flex:1}
.douane-list{display:flex;gap:10px;overflow-x:auto;padding:2px 14px 4px;scroll-snap-type:x proximity;scrollbar-width:none}
.douane-list::-webkit-scrollbar{display:none}
.dz{flex:none;scroll-snap-align:start;width:144px;border:1px solid var(--line);background:var(--surface);border-radius:18px;padding:11px 12px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:3px;color:var(--ink)}
.dz .n{font:700 14px var(--f-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dz .r{font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dz .w{font:800 20px/1.1 var(--f-display);white-space:nowrap;display:flex;align-items:center;gap:7px;margin-top:2px}
.dz .w::before{content:"";width:10px;height:10px;border-radius:50%;background:#B8C0CF;flex:none}
.dz.ok .w::before{background:#1E8E5A}.dz.mid .w::before{background:#E8890C}.dz.bad .w::before{background:var(--ch)}
.dz.ok{border-color:#BFE3CF}.dz.mid{border-color:#F3D3A6}.dz.bad{border-color:#F2B8B2}
.dz.none .w{font-size:14px;color:var(--muted);font-family:var(--f-body)}
.douane-hint{margin:0;padding:0 14px;font-size:12px;color:var(--muted);font-weight:500}
.waits{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.waits button{border:0;border-radius:16px;padding:14px 12px;font:700 15px var(--f-body);cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:2px;min-height:64px}
.waits button small{font-size:12px;font-weight:600;opacity:.8}
.waits .ok{background:#E2F4EA;color:#14653F}.waits .mid{background:#FCEBD3;color:#8A4F05}.waits .bad{background:var(--ch-soft);color:var(--ch-dark)}
.douane-pin{background:#fff;border:2px solid #B8C0CF;color:var(--ink);border-radius:999px;padding:2px 7px;font:800 11px var(--f-body);white-space:nowrap;transform:translate(-50%,-50%);display:inline-block;box-shadow:0 2px 6px rgba(14,22,48,.25)}
.douane-pin.ok{border-color:#1E8E5A}.douane-pin.mid{border-color:#E8890C}.douane-pin.bad{border-color:var(--ch);color:var(--ch-dark)}

/* ---------- Plan B retour ---------- */
.planb-card{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:20px;padding:14px 16px;box-shadow:var(--shadow);border-left:6px solid var(--gold)}
.planb-card .planb-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.planb-card b{font:700 16px var(--f-display)}
.planb-card span{font-size:13px;color:var(--muted);font-weight:500}
.sheet.planb{max-height:92%}
.pb-scroll{overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:2px 2px 6px;margin:0 -2px}
.sheet h4{margin:6px 0 0;font:700 16px var(--f-display)}
.pb-car{display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:16px;padding:12px;box-shadow:var(--shadow)}
.pb-car .pb-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pb-car b{font-weight:700;font-size:15px}
.pb-car span{font-size:13px;color:var(--muted);font-weight:500;overflow-wrap:anywhere}
.pb-links{display:flex;flex-direction:column;gap:8px}
a.btn{display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none}

/* ---------- Octobre 2026 : prochain trajet ---------- */
.next{background:var(--surface);border-radius:24px;box-shadow:var(--shadow-lg);padding:16px;display:flex;flex-direction:column;gap:10px;border-top:6px solid var(--ch)}
.nx-head{display:flex;justify-content:space-between;align-items:center;gap:10px}
.nx-when{font:800 20px/1.15 var(--f-display);letter-spacing:-.01em}
.nx-role{flex:none;font-size:12px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--solid);color:#fff}
.nx-route{font:700 16px/1.3 var(--f-body)}
.nx-who{font-size:14px;color:var(--muted);font-weight:500;overflow-wrap:anywhere}
.nx-adv{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:0;border-radius:14px;padding:10px 12px;font:500 14px/1.35 var(--f-body);cursor:pointer;background:var(--soft);color:var(--ink)}
.nx-adv b{font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.nx-adv.ok{background:#E2F4EA;color:#14653F}.nx-adv.mid{background:#FCEBD3;color:#8A4F05}.nx-adv.bad{background:var(--ch-soft);color:var(--ch-dark)}
.nx-live{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;color:var(--ok)}
.nx-live::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ok);flex:none}
@media (prefers-reduced-motion:no-preference){.nx-live::before{animation:livegr 1.6s ease-out infinite}@keyframes livegr{0%{box-shadow:0 0 0 0 rgba(30,142,90,.5)}100%{box-shadow:0 0 0 9px rgba(30,142,90,0)}}}
.nx-zone:empty{display:none}
.nx-crew{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--line);padding-top:10px}
.nx-crew-row{display:flex;flex-direction:column;align-items:flex-start;gap:1px;background:none;border:0;padding:2px 0;text-align:left;cursor:pointer;color:var(--ink);font:500 14px var(--f-body)}
.nx-crew-row b{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--fr)}

/* Guide de bienvenue */
.guide{background:var(--solid);color:#fff;border-radius:22px;padding:18px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-lg)}
.guide>b{font:700 19px var(--f-display)}
.guide ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.guide li{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:15px}
.guide li span{flex:none;width:24px;height:24px;border-radius:50%;background:var(--ch);display:flex;align-items:center;justify-content:center;font:700 13px var(--f-body)}
.guide p{margin:0;font-size:14px;color:#C9D0DE}.guide p b{color:#fff}
.guide .btn{align-self:flex-start}

/* Recherche */
.search-acts{display:flex;gap:8px;flex-wrap:wrap}
.search-acts .fav-btn{align-self:auto}
.chip.gold{background:#FFF1C9;color:#7A5600}

/* Économies */
.savings{background:linear-gradient(135deg,#0E1630,#1B2A57);color:#fff;border-radius:22px;padding:16px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-lg)}
.sv-head{display:flex;justify-content:space-between;align-items:baseline}
.sv-head b{font:700 17px var(--f-display)}.sv-head span{font-size:12px;color:#C9D0DE;font-weight:600}
.sv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sv{background:rgba(255,255,255,.08);border-radius:14px;padding:10px 8px;display:flex;flex-direction:column;gap:2px;text-align:center}
.sv b{font:800 20px/1.1 var(--f-display);color:var(--gold);font-variant-numeric:tabular-nums}
.sv span{font-size:11px;color:#C9D0DE;font-weight:600}
.sv-note{margin:0;font-size:12px;color:#C9D0DE;font-weight:500}

.h2row{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;flex-wrap:wrap}

/* Équipages */
.crew{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);padding:14px;display:flex;flex-direction:column;gap:10px}
.crew-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.crew-tt{display:flex;flex-direction:column;min-width:0}
.crew-tt b{font:700 17px var(--f-display)}.crew-tt small{font-size:12px;color:var(--muted);font-weight:600}
.crew-mem{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.crew-mem .av{width:30px;height:30px;border-radius:50%;background:var(--fr-soft);color:var(--fr);display:flex;align-items:center;justify-content:center;font:700 13px var(--f-display);border:2px solid #fff}
.crew-mem .av.me{background:var(--ch);color:#fff}
.crew-names{margin-left:6px;font-size:13px;color:var(--muted);font-weight:500}
.crew-lbl{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.crew-week{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.cd{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:8px 2px;display:flex;flex-direction:column;align-items:center;gap:1px;cursor:pointer;color:var(--ink);min-width:0}
.cd small{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase}
.cd b{font:700 13px var(--f-body);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}
.cd.me{background:var(--solid);border-color:var(--solid);color:#fff}.cd.me small{color:#C9D0DE}
.cd.off{background:var(--soft);color:var(--muted)}
.crew-day{background:var(--soft);border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;font-size:14px}
.crew-area:empty{display:none}
.bubble .from{display:block;font-size:12px;font-weight:700;color:var(--fr);margin-bottom:1px}

/* Inviter, compte */
.invite-card{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:20px;padding:14px 16px;box-shadow:var(--shadow);border-left:6px solid var(--fr)}
.invite-card .planb-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.invite-card b{font:700 16px var(--f-display)}.invite-card span{font-size:13px;color:var(--muted);font-weight:500}
.legal{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;font-weight:600}
.legal a{color:var(--muted)}
.linkbtn.danger{color:var(--ch-dark)}
.del-box:empty{display:none}
.del-box{background:var(--ch-soft);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:10px}
.note a{color:inherit}

/* Télétravail */
.tele-row{flex-direction:row;align-items:flex-start;gap:12px;background:var(--surface);border-radius:16px;padding:12px;box-shadow:var(--shadow);text-transform:none;letter-spacing:0;color:var(--ink);font-size:15px;cursor:pointer}
.tele-row input{width:22px;height:22px;flex:none;margin:2px 0 0;padding:0;accent-color:var(--ch)}
.tele-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.tele-tx b{font-weight:700}.tele-tx small{font-size:13px;color:var(--muted);font-weight:500}

/* Suivre la voiture */
.fol-map{height:300px}
.fol-info{margin:0;font-weight:700;font-size:15px;text-align:center}
.car-pin{width:28px;height:28px;border-radius:50%;background:var(--ch);border:4px solid #fff;box-shadow:0 0 0 3px rgba(218,41,28,.3),0 3px 10px rgba(14,22,48,.35)}

/* Montants rapides, monnaie, parkings */
.price-pick{display:flex;gap:10px;flex-wrap:wrap;align-items:center;text-transform:none;letter-spacing:0}
.price-pick .seg button{min-width:52px}
.near-pin{width:22px;height:22px;border-radius:50%;background:var(--fr);border:4px solid #fff;box-shadow:0 0 0 3px rgba(0,85,164,.3),0 3px 10px rgba(14,22,48,.35)}
.route-link{font-weight:700;color:var(--fr);white-space:nowrap}

/* Prix juste, badge vérifié */
.fair{display:flex;align-items:center;gap:12px;background:var(--ok-soft);color:#14653F;border-radius:14px;padding:10px 12px;font-size:14px;font-weight:500}
.fair.over{background:var(--ch-soft);color:var(--ch-dark)}
.fair-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.fair-tx b{font-weight:700;font-size:15px}
.fair .btn{flex:none}
.chip.verif{background:var(--fr-soft);color:var(--fr)}
.verif{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column;gap:10px}
.verif-head b{font:700 16px var(--f-display)}
.verif-ok{margin:0;font-weight:600;color:var(--ok)}
.verif .linkbtn{padding:0}

/* ---------- Accueil allégé (v13) ---------- */
.douane-sum{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;padding:12px 14px;cursor:pointer;min-height:52px;border-radius:22px}
.douane-sum:focus-visible{outline:3px solid var(--ch);outline-offset:-3px}
.dtitle{font:700 17px var(--f-display);display:flex;align-items:center;gap:8px;flex:none;color:var(--ink)}
.douane-line{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}
.douane-sum .chev{flex:none;color:var(--muted);transition:transform .2s}
.douane-sum[aria-expanded="true"] .chev{transform:rotate(180deg)}
.douane-body{display:flex;flex-direction:column;gap:10px;padding-bottom:10px}
#p-find>.next,#p-find>.douane{margin-bottom:2px}

/* ---------- Scène de la douane (v13) : jour / nuit, feu de la douane en direct ---------- */
.douane{overflow:hidden;padding:0}
.douane-sum{flex-direction:column;align-items:stretch;padding:0;gap:0}
.cf-scene{display:block;width:100%;height:auto}
.douane-cap{display:flex;align-items:center;gap:10px;padding:12px 14px;min-height:52px}
.douane-body{padding-top:4px}
.sky-fr{fill:#E3ECF8}.sky-ch{fill:#FBE9E7}
.cf-mnt{fill:#0E1630;fill-opacity:.07}
.cf-sun{fill:#FFC83D}
.cf-stars{fill:#fff;opacity:0}
.cf-lbl{font:700 10px Sora,sans-serif;letter-spacing:1.6px}.cf-lbl.fr{fill:#0055A4}.cf-lbl.ch{fill:#B4231A}
.cf-border{stroke:#0E1630;stroke-opacity:.25;stroke-width:2;stroke-dasharray:4 5}
.cf-win{fill:#BFD9EE}
.cf-beam{fill:#FFE9A8;opacity:0}
.cf-light{fill:#B8C0CF;stroke:#fff;stroke-width:1.5}
.cf-glow{fill:#B8C0CF;opacity:0}
.douane[data-state="ok"] .cf-light,.douane[data-state="ok"] .cf-glow{fill:#1E8E5A}
.douane[data-state="mid"] .cf-light,.douane[data-state="mid"] .cf-glow{fill:#E8890C}
.douane[data-state="bad"] .cf-light,.douane[data-state="bad"] .cf-glow{fill:#DA291C}
.douane:not([data-state="none"]) .cf-glow{opacity:.35}
@media (prefers-reduced-motion:no-preference){.douane:not([data-state="none"]) .cf-glow{animation:cfglow 2s ease-in-out infinite}}
@keyframes cfglow{0%,100%{opacity:.15}50%{opacity:.5}}
/* La nuit (avant 7 h, après 19 h) */
.douane.night .sky-fr{fill:#16224A}.douane.night .sky-ch{fill:#2A1E3F}
.douane.night .cf-mnt{fill:#000;fill-opacity:.35}
.douane.night .cf-sun{fill:#F4EFD8}
.douane.night .cf-stars{opacity:.9}
.douane.night .cf-lbl.fr{fill:#9DBBF0}.douane.night .cf-lbl.ch{fill:#F2A39B}
.douane.night .cf-border{stroke:#fff;stroke-opacity:.3}
.douane.night .cf-win{fill:#FFD66B}
.douane.night .cf-beam{opacity:.45}
.cf-booth{fill:#0E1630}.douane.night .cf-booth{fill:#3B4A7A}
.douane.night .cf-beam{fill:#FFF3C4;opacity:.3}
.douane-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;text-align:left}
.douane-txt .douane-line{text-align:left;font-size:13px}
.douane-cap .live-dot{flex:none}
/* Sens de l'animation : vers la France, la voiture roule de droite à gauche */
.douane.back .cf-car{transform:translate(470px,70px) scaleX(-1);animation-name:cfdriveback}
.douane.back .cf-arm{animation-name:cfliftback}
@keyframes cfdriveback{from{transform:translate(470px,70px) scaleX(-1)}to{transform:translate(-70px,70px) scaleX(-1)}}
@keyframes cfliftback{0%,22%{transform:rotate(0deg)}30%,58%{transform:rotate(-78deg)}66%,100%{transform:rotate(0deg)}}
@media (prefers-reduced-motion:reduce){.douane.back .cf-car{animation:none;transform:translate(150px,70px) scaleX(-1)}}

/* ---------- Photos de profil ---------- */
.av{flex:none;width:30px;height:30px;border-radius:50%;background:var(--fr-soft);color:var(--fr);display:inline-flex;align-items:center;justify-content:center;font:700 13px var(--f-display);overflow:hidden;border:0;padding:0;vertical-align:middle;position:relative}
.av img{width:100%;height:100%;object-fit:cover;display:block}
button.av{cursor:zoom-in}
button.av:focus-visible{outline:3px solid var(--ch);outline-offset:2px}
.av.ph{background:#E8EEF6}
.who .av{width:28px;height:28px;font-size:12px;margin-right:8px}
.who .av+.av{margin-left:-14px;box-shadow:0 0 0 2px var(--surface)}
.thread .av.ph{background:#E8EEF6}
.av.lg{width:46px;height:46px;font-size:18px;background:var(--ch-soft);color:var(--ch-dark)}
.av.xl{width:76px;height:76px;font-size:30px;background:var(--fr-soft)}
.crew-mem .av.ph{border:2px solid #fff}
.me-btn.ph{padding:0;overflow:hidden;background:#E8EEF6}
.me-btn img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.chat-who{display:flex;align-items:center;gap:12px;min-width:0}
.top-acts{display:flex;gap:6px;flex:none}
.photo-row{display:flex;gap:14px;align-items:center}
.photo-tx{display:flex;flex-direction:column;gap:6px;min-width:0}
.photo-tx .note{margin:0}
.photo-view{background:rgba(14,22,48,.88);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;z-index:3000}
.photo-view figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.photo-view img{width:min(78vw,340px);height:min(78vw,340px);object-fit:cover;border-radius:28px;box-shadow:0 20px 60px rgba(0,0,0,.4)}
.photo-view figcaption{color:#fff;font:700 20px var(--f-display)}
.photo-view .btn{background:#fff}
/* ---------- Supprimer un message ---------- */
.bubble.mine-tap{cursor:pointer}
.bubble.mine-tap:focus-visible{outline:3px solid var(--ch);outline-offset:2px}
.del-msg{display:block;margin-top:8px;border:0;border-radius:999px;background:#fff;color:var(--ch-dark);font:700 13px var(--f-body);padding:8px 12px;cursor:pointer;min-height:36px}
.confirm-del{display:flex;flex-direction:column;gap:8px;width:100%;font-weight:600;font-size:14px}

/* ---------- Confiance : fiche membre, avis, signaler, bloquer ---------- */
.name-link{all:unset;font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:rgba(14,22,48,.25);text-underline-offset:3px;cursor:pointer}
.name-link:focus-visible{outline:3px solid var(--ch);outline-offset:2px;border-radius:4px}
.chip.rate{background:#E2F4EA;color:#14653F}
.sheet.prof{gap:14px}
.prof-head{display:flex;align-items:center;gap:14px;min-width:0}
.prof-hx{display:flex;flex-direction:column;gap:6px;min-width:0}
.prof-hx h3{margin:0;font:700 22px/1.15 var(--f-display)}
.av.xxl{width:84px;height:84px;font-size:34px;background:var(--fr-soft)}
.prof-rev{display:flex;flex-direction:column;gap:8px}
.prof-score{margin:0;font:800 20px var(--f-display);color:#14653F}
.prof-quote{margin:0;font-style:italic;color:var(--muted);font-weight:500}
.prof-acts{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:12px}
.prof-acts textarea,.rate input{width:100%;border:1px solid var(--line);border-radius:14px;padding:10px 12px;font:500 15px var(--f-body);resize:vertical;min-height:44px;background:var(--surface);color:var(--ink)}
.btn.danger{color:var(--ch-dark)}
.report-reasons{display:flex;flex-wrap:wrap;gap:8px}
.report-reasons .opt{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:9px 14px;font:600 14px var(--f-body);cursor:pointer;min-height:40px}
.report-reasons .opt[aria-pressed="true"]{background:var(--solid);color:#fff;border-color:var(--solid)}
.rate{background:var(--surface);border-radius:22px;padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:12px;border:2px solid #BFE3CF}
.rate-head{display:flex;gap:12px;align-items:center}
.rate-tx{display:flex;flex-direction:column;min-width:0}
.rate-tx b{font:700 17px/1.25 var(--f-display)}
.rate-tx span{font-size:13px;color:var(--muted);font-weight:600}
.rate-btns{display:flex;gap:8px;flex-wrap:wrap}
.rate-q{font-weight:700;font-size:14px}
.rate .linkbtn{align-self:flex-start}
.blocked{display:flex;flex-direction:column;gap:8px}
.blocked:empty{display:none}
.blk-row{display:flex;align-items:center;gap:10px;background:var(--surface);border-radius:16px;padding:8px 10px;box-shadow:var(--shadow)}
.blk-row span:not(.av){flex:1;font-weight:600}
.fb-card{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:18px;padding:14px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink)}
.fb-ic{font-size:26px;flex:none}
.fb-tx{display:flex;flex-direction:column}
.fb-tx span{font-size:13px;color:var(--muted);font-weight:500}

/* ---------- Paiement direct ---------- */
.pay-form{display:flex;flex-direction:column;gap:12px;padding:18px}
.pay-form .note{margin:0}
.sheet.pay{gap:14px}
.pay-amt{display:flex;flex-direction:column;background:var(--fr-soft);border-radius:18px;padding:12px 14px}
.pay-amt b{font:800 24px var(--f-display);color:var(--fr)}
.pay-amt span{font-size:13px;font-weight:600;color:var(--muted)}
.pay-ways{display:flex;flex-direction:column;gap:10px}
.pay-way{display:flex;flex-direction:column;gap:4px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:12px 14px}
.pw-name{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pw-val{font:700 18px var(--f-body);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.pw-help{font-size:13px;color:var(--muted);font-weight:500}
.pay-way .btn{margin-top:6px}
.pw-cash{margin:0;font-weight:600}
a.btn{text-decoration:none;display:inline-flex;align-items:center}

/* ---------- Jours où le conducteur roule ---------- */
.date{position:relative}
.date.has::after{content:"";position:absolute;bottom:6px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#1E8E5A}
.date[aria-pressed="true"].has::after{background:#7BE0A8}
.date.has small:last-child{margin-bottom:4px}
.days-mini{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.dm-l{font-size:13px;color:var(--muted);font-weight:600;margin-right:4px}
.dm{min-width:28px;height:28px;padding:0 4px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font:700 12px var(--f-body);background:var(--soft);color:#9AA3B5}
.dm.on{background:var(--fr);color:#fff}
.suggest-days{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:4px}
.pay-details{display:flex;flex-direction:column;gap:10px;background:var(--fr-soft);border-radius:16px;padding:12px}
.pay-details[hidden]{display:none}
.pay-details .note{margin:0}
.lang-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--surface);border-radius:18px;padding:12px 14px;box-shadow:var(--shadow);font-weight:600}
.gate-lang{align-self:flex-end}
.month-box,.month-edit{display:flex;flex-direction:column;gap:10px;background:var(--fr-soft);border-radius:16px;padding:12px}
.month-box[hidden]{display:none}
#kMode{margin:2px 0}

/* Alertes « Préviens-moi » dans les listes vides */
.alert-block{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:6px;width:100%}
.alert-block .note{max-width:34ch}
.alert-ok{margin:0;font-weight:700;color:var(--ink)}
.alert-block .linkbtn{font-size:14px;align-self:center}
/* Lien webcam douane */
.cam-link{display:inline-block;margin-top:8px;font-weight:700;font-size:14px;color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* ---------- Écran de chargement : logo + squelette qui brille ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ld-brand{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.ld-brand .logo{width:46px;height:46px}
.ld-brand .word{font:800 26px var(--f-display);color:var(--ink)}
.skel{border-radius:22px;background:var(--soft);position:relative;overflow:hidden}
.skel-hero{height:150px}.skel-line{height:22px;width:55%;border-radius:999px}.skel-card{height:120px}
@media (prefers-reduced-motion:no-preference){
  .ld-brand{animation:ldin .5s cubic-bezier(.2,.8,.2,1.2) both}
  @keyframes ldin{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
  .skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);animation:shimmer 1.3s ease-in-out infinite}
  @keyframes shimmer{to{transform:translateX(100%)}}
  /* Transition douce entre les onglets */
  .panel:not([hidden]){animation:tabin .22s ease-out}
  @keyframes tabin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

/* ---------- Mode sombre automatique (suit le réglage du téléphone) ---------- */

  html.dark{color-scheme:dark;
    --bg:#0B1020; --surface:#151C33; --ink:#EEF1F8; --muted:#9AA3B8; --line:#26304E; --soft:#1C2540;
    --ch-soft:#3A1D22; --fr-soft:#1A2848; --ok-soft:#15352A; --solid:#2C3D78;
    --shadow:0 2px 10px rgba(0,0,0,.35); --shadow-lg:0 10px 30px rgba(0,0,0,.5)}
  html.dark input::placeholder{color:#6F7A93}
  html.dark .waits .ok,html.dark .nx-adv.ok,html.dark .chip.rate{background:#15352A;color:#7FD8A6}
  html.dark .waits .mid,html.dark .nx-adv.mid{background:#3A2A12;color:#F2B866}
  html.dark .chip.gold{background:#3A3015;color:#F5D27A}
  html.dark .av.ph,html.dark .thread .av.ph,html.dark .me-btn.ph,html.dark .map-wrap{background:#1C2540}
  html.dark .price-pin.taken,html.dark .douane-pin,html.dark .photo-view .btn,html.dark .del-msg{background:#151C33}
  html.dark .douane-pin{border-color:#3A4567}
  html.dark .skel::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent)}
  html.dark .stat:nth-child(1) b,html.dark .card.park .stub,html.dark .card.park .stub .s,html.dark .chip.price,html.dark .chip.verif,html.dark .av,html.dark .crew-mem .av,html.dark .bubble .from,html.dark .route-link,html.dark .nx-crew-row b,html.dark .pay-amt b{color:#8DB4F0}
  html.dark .stat:nth-child(3) b,html.dark .chip.ok,html.dark .nx-live,html.dark .verif-ok,html.dark .fair,html.dark .prof-score{color:#7FD8A6}
  html.dark .chip.when,html.dark .thread .av,html.dark .waits .bad,html.dark .douane-pin.bad,html.dark .nx-adv.bad,html.dark .linkbtn.danger,html.dark .fair.over,html.dark .av.lg,html.dark .del-msg,html.dark .btn.danger{color:#FF8A80}
  html.dark .chip.rate{background:#15352A!important;color:#7FD8A6!important;border-color:#2B6B4C!important}
  html.dark .leaflet-tile-pane{filter:brightness(.78) contrast(1.08) saturate(.85)}
  html.dark .savings{background:linear-gradient(135deg,#1B2750,#2C3D78)}


/* Douane : « d'habitude » (plus discret) et boutons Waze / Maps */
.dz.hab{opacity:.8;border-style:dashed}
.ds-hab{font-weight:700;color:var(--ink)}
.ds-go{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.ds-go a{text-decoration:none}

/* Mon bilan du mois */
.bilan-card{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:20px;padding:14px 16px;box-shadow:var(--shadow);border:1.5px solid var(--gold)}
.bilan-tx{flex:1;display:flex;flex-direction:column;gap:3px}
.bilan-tx b{font:700 16px var(--f-display);color:var(--ink)}
.bilan-tx span{font-size:14px;color:var(--muted);line-height:1.35}

/* =====================================================================
   v25 — Design « route » : panneaux d'autoroute, asphalte, LED
   ===================================================================== */
:root{--asph:#23262B;--asph2:#1B1D21;--paint:#ECE7DA;--sign-ch:#0B7A4B;--sign-fr:#1F4E9E;--led:#FFB233}
/* Écran de démarrage : fond bleu nuit (comme l'icône), le C se dessine, le point rouge s'allume */
.loading{position:fixed;inset:0;z-index:3000;background:#0E1630;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0;transition:opacity .38s ease}
.loading.bye{opacity:0;pointer-events:none}
.sp-logo{width:104px;height:104px;overflow:visible}
.sp-c{fill:none;stroke:#fff;stroke-width:5.5;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0}
.sp-dot{fill:#DA291C;transform-box:fill-box;transform-origin:center}
.sp-glow{fill:#DA291C;opacity:.0;transform-box:fill-box;transform-origin:center}
.sp-word{font:800 34px var(--f-display);color:#fff;letter-spacing:-.5px;margin-top:6px}
.sp-tag{display:flex;align-items:center;gap:7px;font:600 14px var(--f-body);color:#AEB8D6;letter-spacing:.3px}
.sp-road{position:absolute;bottom:calc(64px + env(safe-area-inset-bottom,0px));left:50%;width:150px;height:3px;transform:translateX(-50%);border-radius:2px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.55) 0 14px,transparent 14px 26px);background-size:26px 3px}
@media (prefers-reduced-motion:no-preference){
  .sp-c{stroke-dashoffset:-100;animation:spdraw .7s cubic-bezier(.6,0,.2,1) .08s forwards}
  .sp-dot{transform:scale(0);animation:sppop .45s cubic-bezier(.2,.9,.3,1.4) .62s forwards}
  .sp-glow{animation:spglow 1.6s ease-out .85s infinite}
  .sp-word{opacity:0;animation:spup .45s ease-out .55s forwards}
  .sp-tag{opacity:0;animation:spup .45s ease-out .72s forwards}
  .sp-road{animation:sproad .5s linear infinite}
  @keyframes spdraw{to{stroke-dashoffset:0}}
  @keyframes sppop{to{transform:scale(1)}}
  @keyframes spglow{0%{opacity:.55;transform:scale(.45)}100%{opacity:0;transform:scale(1.5)}}
  @keyframes spup{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  @keyframes sproad{to{background-position:-26px 0}}
}

/* Bandeau douane : toujours en « asphalte », de jour comme de nuit */
.douane{background:var(--asph);color:var(--paint);box-shadow:0 10px 26px rgba(10,12,18,.28);
  background-image:radial-gradient(rgba(255,255,255,.035) 1px,transparent 1.2px),radial-gradient(rgba(0,0,0,.22) 1px,transparent 1.2px);background-size:7px 7px,11px 11px;background-position:0 0,3px 5px}
.douane .dtitle{color:var(--paint);font-family:var(--f-display)}
.douane .douane-line,.douane .douane-txt .douane-line{color:#C2C6CD}
.douane-sum .chev{color:#C2C6CD}
.douane-sum:focus-visible{outline:3px solid var(--led)}
.rd-hero{display:block;position:relative;aspect-ratio:390/236;overflow:hidden;border-radius:22px 22px 0 0;background:#101521}
.rd-scene,.rd-front,.rd-tails{position:absolute;inset:0;width:100%;height:100%;display:block}
.rd-pmv{position:absolute;left:7%;right:7%;top:9.5%;background:#070707;border:3px solid #3A3E45;border-radius:9px;padding:5px;box-shadow:inset 0 0 0 2px #000,0 8px 18px rgba(0,0,0,.45)}
.rd-pmv canvas{display:block;width:100%}
.rd-edge{stroke:var(--paint);stroke-width:1.5;opacity:.5;fill:none}
.rd-dash{stroke:var(--paint);stroke-width:2.4;opacity:.75}
.rd-canopy rect{fill:#E9E4D8}.rd-canopy .red{fill:#D7261E}
.rd-hero .to-fr{display:none}.rd-hero.to-fr .to-fr{display:inline}.rd-hero.to-fr .to-ch{display:none}
.rd-stars{fill:#fff;opacity:0;transition:opacity 1s}
.rd-sun{transition:fill 1s}
/* ciel selon l'heure */
.rd-hero .s1{stop-color:#0E1734}.rd-hero .s2{stop-color:#3B3A6B}.rd-hero .s3{stop-color:#C7684A}.rd-hero .s4{stop-color:#F2A65A}
.rd-hero .g1{stop-color:#FFD9A0}.rd-hero .g2{stop-color:#FFD9A0}
.rd-sun{fill:#FFE2B0}.rd-mnt1{fill:#2B2547}.rd-mnt2{fill:#1E1A33}
.rd-hero.dawn .rd-stars{opacity:.5}
.rd-hero.night .s1{stop-color:#04070F}.rd-hero.night .s2{stop-color:#0C1430}.rd-hero.night .s3{stop-color:#18214A}.rd-hero.night .s4{stop-color:#2A3160}
.rd-hero.night .g1,.rd-hero.night .g2{stop-color:#C9D6F2}.rd-hero.night .rd-sun{fill:#F4EFD8}.rd-hero.night .rd-halo{opacity:.35}
.rd-hero.night .rd-stars{opacity:.9}.rd-hero.night .rd-mnt1{fill:#121633}.rd-hero.night .rd-mnt2{fill:#0B0E22}
.rd-hero.day .s1{stop-color:#4F86D3}.rd-hero.day .s2{stop-color:#86B3E6}.rd-hero.day .s3{stop-color:#C6DDF2}.rd-hero.day .s4{stop-color:#E8EFF4}
.rd-hero.day .g1,.rd-hero.day .g2{stop-color:#FFFBEA}.rd-hero.day .rd-sun{fill:#FFF8DC}.rd-hero.day .rd-mnt1{fill:#6D86A8}.rd-hero.day .rd-mnt2{fill:#52698A}
.rd-hero.dusk .s1{stop-color:#1A1F4A}.rd-hero.dusk .s2{stop-color:#6B3D6E}.rd-hero.dusk .s3{stop-color:#D9764A}.rd-hero.dusk .s4{stop-color:#F4B163}
.rd-hero.dusk .g1,.rd-hero.dusk .g2{stop-color:#FFC07A}.rd-hero.dusk .rd-sun{fill:#FFB86B}.rd-hero.dusk .rd-mnt1{fill:#3A2747}.rd-hero.dusk .rd-mnt2{fill:#26192F}

/* Les voies : une vraie file de voitures vue du ciel, une barrière, un panneau */
.douane-list{flex-direction:column;overflow:visible;gap:8px;padding:2px 12px 4px;scroll-snap-type:none}
.lane{all:unset;box-sizing:border-box;position:relative;display:block;height:62px;border-radius:10px;background:var(--asph2);overflow:hidden;cursor:pointer;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.04)}
.lane:focus-visible{outline:3px solid var(--led);outline-offset:2px}
.lane:active{transform:scale(.99)}
.ln-top{position:absolute;left:10px;right:76px;top:6px;display:flex;gap:8px;align-items:baseline;white-space:nowrap;overflow:hidden}
.ln-n{font:700 13.5px var(--f-body);color:var(--paint);flex:none}
.ln-s{font:500 11px var(--f-body);color:#8D939C;overflow:hidden;text-overflow:ellipsis;min-width:0}
.ln-road{position:absolute;left:0;right:68px;bottom:5px;height:27px;overflow:hidden}
.ln-dash{position:absolute;left:0;right:0;top:0;height:2px;background:repeating-linear-gradient(90deg,rgba(236,231,218,.45) 0 14px,transparent 14px 26px)}
.ln-q{position:absolute;right:6px;top:6px;display:flex;gap:4px}
.tcar{width:32px;height:17px;flex:none;display:block;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6))}
.ln-bar{position:absolute;right:62px;bottom:4px;width:4px;height:30px;border-radius:2px;background:repeating-linear-gradient(180deg,#D7261E 0 6px,#fff 6px 12px)}
.ln-light{position:absolute;right:60px;bottom:36px;width:8px;height:8px;border-radius:50%;background:#4A4F59}
.lane.ok .ln-light{background:#3DDC84;box-shadow:0 0 8px #3DDC84}
.lane.mid .ln-light{background:var(--led);box-shadow:0 0 8px var(--led)}
.lane.bad .ln-light{background:#FF3B30;box-shadow:0 0 8px #FF3B30}
.ln-sign{position:absolute;right:0;top:0;bottom:0;width:58px;background:var(--sign-ch);border-left:3px solid #fff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;gap:1px}
.ln-sign b{font:800 21px/1 var(--f-display);letter-spacing:-.5px}
.ln-sign i{font:600 10px var(--f-body);font-style:normal;opacity:.85}
.lane.to-fr .ln-sign{background:var(--sign-fr)}
.lane.none .ln-sign{background:#3A3E45}
.lane.none .ln-sign i{white-space:nowrap;font-size:9.5px}
.lane.hab .ln-sign{background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.1) 0 5px,transparent 5px 11px)}
.lane.hab .tcar{opacity:.5}
/* vers la France : la file part vers la gauche */
.lane.to-fr .ln-sign{right:auto;left:0;border-left:0;border-right:3px solid #fff}
.lane.to-fr .ln-road{left:68px;right:0;transform:scaleX(-1)}
.lane.to-fr .ln-bar{right:auto;left:62px}.lane.to-fr .ln-light{right:auto;left:60px}
.lane.to-fr .ln-top{left:76px;right:10px}
@media (prefers-reduced-motion:no-preference){
  .lane .ln-q{animation:inch 3.2s cubic-bezier(.5,0,.3,1) infinite}
  .lane.ok .ln-q{animation:flow 1.5s linear infinite}
  .lane.bad .ln-q{animation-duration:6s}
  .lane.hab .ln-q,.lane.none .ln-q{animation:none}
  @keyframes inch{0%,55%{transform:translateX(0)}88%,100%{transform:translateX(36px)}}
  @keyframes flow{to{transform:translateX(36px)}}
}
.douane .seg{background:var(--asph2)}
.douane .seg button{color:#C2C6CD}
.douane .seg button[aria-pressed="true"]{background:var(--paint);color:var(--asph)}
.douane .douane-hint{color:#9AA0A8}
.douane .cam-link{color:var(--paint);margin:0 14px}
.rd-ground{fill:#25233A}.rd-hero.night .rd-ground{fill:#0C0F1C}.rd-hero.day .rd-ground{fill:#5E7A52}.rd-hero.dusk .rd-ground{fill:#2C2234}

/* ---------- v25 étape 2 : trajets en panneaux, Conduire en panneaux d'autoroute, parkings LED ---------- */
/* Trajet : la colonne de gauche devient un vrai panneau (vert = vers la Suisse, bleu = vers la France) */
.card.trip .stub{background:var(--sign-ch);color:#fff;margin:8px 0 8px 8px;border-radius:12px;box-shadow:inset 0 0 0 2.5px #fff,0 0 0 1.5px rgba(14,22,48,.25);padding:12px 4px;gap:3px}
.card.trip.to-fr .stub{background:var(--sign-fr)}
.card.trip .stub .s,.card.trip .stub .r{color:rgba(255,255,255,.82)}
.card.trip .stub .h{font-size:23px;color:#fff}
.card.trip .stub .seats{margin-top:8px;gap:3px;justify-content:center;flex-wrap:wrap;max-width:60px}
.card.trip .stub .seat{width:10px;height:14px;border-radius:3px;border:0;background:#fff}
.card.trip .stub .seat.taken{background:rgba(255,255,255,.28)}
.card.trip.mine .stub{background:#2F6E4F}
.card.trip{grid-template-columns:86px 1fr}
/* Parking : panneau P bleu + afficheur LIBRE / PRIS */
.card.park .stub{gap:5px}
.stub .bigP{border-radius:10px;box-shadow:inset 0 0 0 2.5px #fff,0 0 0 1.5px rgba(14,22,48,.25);background:var(--sign-fr)}
.led-mini{display:block;border-radius:4px;border:2px solid #3A3E45;box-sizing:content-box;margin:2px 0 4px}
/* Champs « Je pars de / Je vais à » : panneaux de direction */
input.sign-in{background:var(--sign-ch);color:#fff;border:3px solid #fff;box-shadow:0 0 0 1.5px rgba(14,22,48,.35),0 4px 10px rgba(14,22,48,.15);border-radius:12px;font:700 17px var(--f-display);padding:11px 40px 11px 13px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V5M5 11l7-7 7 7'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:20px}
input.sign-in[data-c="fr"]{background-color:var(--sign-fr)}
input.sign-in[data-c="park"]{background-color:var(--sign-fr);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 19V5h5a4.5 4.5 0 0 1 0 9H8' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
input.sign-in::placeholder{color:rgba(255,255,255,.72);font-weight:600}
input.sign-in:focus-visible{outline:3px solid var(--led);outline-offset:2px}
/* Heures : horloges à LED */
#oGo,#oBack{background:#070707;color:var(--led);border:4px solid #3A3E45;border-radius:12px;font:800 22px var(--f-display);letter-spacing:1px;text-shadow:0 0 8px rgba(255,165,31,.75);font-variant-numeric:tabular-nums;color-scheme:dark;padding:9px 12px}
#oGo::-webkit-calendar-picker-indicator,#oBack::-webkit-calendar-picker-indicator{filter:invert(.75) sepia(1) saturate(5) hue-rotate(-10deg)}
/* Jours : plaques carrées */
.days button{border-radius:8px;font:800 14px var(--f-display);border:2px solid var(--line)}
.days button[aria-pressed="true"]{background:var(--asph);border-color:var(--asph);color:var(--paint);box-shadow:inset 0 0 0 2px var(--paint)}
/* Prix : ticket de péage */
.price-pick .pays button{border-radius:6px;border:1.5px dashed #9AA3B5;font:800 15px var(--f-display);position:relative}
.price-pick .pays button[aria-pressed="true"]{background:var(--yellow,#F2C230);border:1.5px solid #C99A12;color:#2A2200}
/* Carte : le vrai fond OpenStreetMap, en version nuit, et des prix en panneaux */
.leaflet-tile-pane{filter:invert(1) hue-rotate(185deg) brightness(.92) contrast(.88) saturate(.55)}
.map-wrap{background:#1E2230}
.price-pin{background:var(--sign-fr);border-radius:7px;box-shadow:inset 0 0 0 2px #fff,0 4px 10px rgba(0,0,0,.4);font:800 13px var(--f-display);padding:6px 10px}
.price-pin.free{background:var(--sign-ch)}
.price-pin.taken{background:#3A3E45;color:#C2C6CD;box-shadow:inset 0 0 0 2px #8D939C}
.card.trip .stub{align-self:start;min-height:112px}
input.sign-in{font-size:16px;padding-right:34px;background-size:16px;background-position:right 10px center}
input.sign-in::placeholder{font-size:14px}
#oGo,#oBack{font-size:19px;letter-spacing:0}
html.dark .days button[aria-pressed="true"]{background:var(--paint);color:var(--asph);box-shadow:none;border-color:var(--paint)}
/* ---------- v25 étape 3 : points d'éclaireur, télétravail, prix conseillé ---------- */
.pts-card,.tele-card{background:var(--surface);border-radius:20px;padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px}
.pts-card h3,.tele-card h3{margin:0;font:700 17px var(--f-display);color:var(--ink)}
.pts-top{display:flex;align-items:center;gap:12px}
.pts-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.pts-tx b{font:800 16px var(--f-display);color:var(--ink)}.pts-tx span{font-size:13px;color:var(--muted)}
.pts-bar,.tele-gauge{height:10px;border-radius:999px;background:var(--soft);overflow:hidden}
.pts-bar span{display:block;height:100%;background:linear-gradient(90deg,#F2C230,#FFB233);border-radius:inherit}
.badges{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.bdg{display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}
.bdg svg{width:40px;height:36px}.bdg small{font-size:10px;font-weight:700;color:var(--muted);line-height:1.15}
.bdg.on small{color:var(--ink)}
.top-week{display:flex;flex-direction:column;gap:4px;background:var(--asph);border-radius:12px;padding:10px 12px;color:var(--paint)}
.top-week>b{font:700 13px var(--f-display);margin-bottom:2px}
.tw-row{display:flex;align-items:center;gap:10px;font-size:14px}
.tw-rank{width:22px;height:22px;border-radius:5px;background:var(--sign-ch);color:#fff;font:800 12px var(--f-display);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1.5px #fff}
.tw-name{flex:1;font-weight:700}.tw-n{color:#C2C6CD;font-size:12px}
.tw-row.me .tw-name{color:var(--led)}
.tele-big{display:flex;align-items:baseline;gap:8px}.tele-big b{font:800 40px/1 var(--f-display);color:var(--ink)}.tele-big span{color:var(--muted);font-weight:600}
.tele-gauge span{display:block;height:100%;background:var(--ok);border-radius:inherit}
.tele-gauge.near span{background:#E8890C}.tele-gauge.over span{background:var(--ch)}
.tele-lim{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink);font-size:14px}.tele-lim input{width:90px;padding:8px 10px}
.tele-add{position:relative;overflow:hidden}.tele-add .tele-date{position:absolute;inset:0;opacity:0;cursor:pointer}
.tele-chips{display:flex;flex-wrap:wrap;gap:6px}.tele-chips .chip{border:0;cursor:pointer;font:inherit;font-size:12px}
.note.fine{font-size:11.5px}
.soir-row{flex-direction:row;align-items:flex-start;gap:10px;text-transform:none;letter-spacing:0;font-size:13px;font-weight:600;color:var(--ink);border-top:1px solid var(--line);padding-top:10px}
.soir-row input{width:20px;height:20px;flex:none;margin-top:1px}
.suggest{display:flex;align-items:center;gap:10px;background:#FFF6D6;border:1.5px solid #F2C230;border-radius:12px;padding:10px 12px}
.sg-tx{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.sg-tx b{font:800 15px var(--f-display);color:#2A2200}.sg-tx small{font-size:12px;color:#6B5A1E}
html.dark .suggest{background:#3A3015;border-color:#8C6D17}html.dark .sg-tx b{color:#F5D27A}html.dark .sg-tx small{color:#D9C38A}
.tele-add{text-transform:none;letter-spacing:0;font:700 14px var(--f-body);color:var(--ink);flex-direction:row}
/* ---------- v26 : mode visiteur ---------- */
.guest-banner{display:none}
body.guest .guest-banner{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:18px;padding:12px 14px;box-shadow:var(--shadow);border:1.5px solid var(--gold);margin-bottom:12px}
.gb-tx{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.gb-tx b{font:700 15px var(--f-display);color:var(--ink)}.gb-tx span{font-size:13px;color:var(--muted);line-height:1.35}
.guest-why{margin:0;background:#FFF6D6;border:1.5px solid #F2C230;border-radius:12px;padding:10px 12px;font-weight:700;color:#2A2200;font-size:14px}
html.dark .guest-why{background:#3A3015;border-color:#8C6D17;color:#F5D27A}
body.guest #bilanCard,body.guest #savings{display:none}
.sp-rescue{position:absolute;left:24px;right:24px;bottom:calc(120px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.sp-rescue p{margin:0 0 4px;color:#D6DCEE;font:600 15px var(--f-body)}
.sp-rescue button{min-width:220px;border:0;border-radius:999px;padding:13px 22px;font:700 15px var(--f-body);background:#DA291C;color:#fff;cursor:pointer}
.sp-rescue button.ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.45)}

/* ---------- Ta douane du jour (v26) ---------- */
.mdo{background:var(--surface);border-radius:24px;box-shadow:var(--shadow-lg);padding:16px;display:flex;flex-direction:column;gap:10px;border-top:6px solid var(--ok)}
.mdo.pitch{background:linear-gradient(135deg,#0E1630 0%,#1B2A55 100%);color:#fff;border-top:0}
.mdo.pitch .mdo-pitch{margin:0;font-size:15px;line-height:1.45;color:#D7DDEA}
.mdo.pitch .btn{align-self:flex-start;background:var(--ok)}
.mdo-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mdo-head b{font:700 18px var(--f-display)}
.mdo-ic{font-size:20px}
.mdo-dir{margin-left:auto;font:700 12px var(--f-body);background:var(--soft);color:var(--ink);border-radius:999px;padding:4px 10px}
button.mdo-dir{border:1.5px solid var(--ink);cursor:pointer}button.mdo-dir:active{transform:scale(.96)}
.mdo-route{font:700 15px var(--f-display);color:var(--muted)}
.mdo-list{display:flex;flex-direction:column;gap:6px}
.th-waze{position:relative;margin:0 0 10px;font-size:13.5px;line-height:1.35;opacity:.9}
.mdo-waze{display:grid;gap:8px;margin-top:10px;padding:12px;border-radius:14px;background:var(--surface-2,rgba(255,255,255,.05))}
.mdo-waze p{margin:0;font-size:14px;line-height:1.4}
.mdo-waze-go{justify-self:start;text-decoration:none}
.mdo-waze-force{font-size:13px;text-decoration:underline;color:inherit;opacity:.85}
.mdo-gain{background:var(--ok-soft);color:var(--ok);font:800 15px var(--f-display);border-radius:14px;padding:10px 12px}
.mdo-row{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none}
.mdo-row.best{border:2px solid var(--ok);background:#F5FBF8;padding-top:16px}
.mdo-n{display:flex;flex-direction:column;min-width:0}
.mdo-n b{font:700 15px var(--f-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mdo-n small{font-size:12px;color:var(--muted);font-weight:600}
.mdo-bar{height:8px;border-radius:999px;background:var(--soft);overflow:hidden}
.mdo-bar i{display:block;height:100%;border-radius:999px;background:#C5CCDA}
.mdo-row.best .mdo-bar i{background:var(--ok)}
.mdo-min{font:800 16px var(--f-display);white-space:nowrap}
.mdo-row.best .mdo-min{color:var(--ok)}
.mdo-tag{position:absolute;top:-9px;left:12px;background:var(--ok);color:#fff;font:700 11px var(--f-body);border-radius:999px;padding:2px 8px}
.mdo-at{font-size:12px}
.mdo-wait{animation:mdoPulse 1.2s ease-in-out infinite}
@keyframes mdoPulse{50%{opacity:.45}}
.mdo-vois{text-align:left;border:0;border-radius:14px;padding:11px 12px;background:var(--fr-soft);color:var(--fr);font:700 14px var(--f-body);cursor:pointer}
.mdo-push{display:flex;align-items:center;gap:10px;background:var(--soft);border-radius:14px;padding:10px 12px;font-size:13px;font-weight:600}
.mdo-push span{flex:1}
.mdo-form{display:flex;flex-direction:column;gap:12px;overflow:auto}
.mdo-chk{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:10px;font-size:14px;font-weight:600;color:var(--ink);text-transform:none;letter-spacing:0}
.mdo-chk input{width:22px;height:22px;flex:none;margin:1px 0 0;accent-color:var(--ok)}
@media (prefers-reduced-motion:reduce){.mdo-wait{animation:none}}

/* ---------- Signalement en 1 appui (v27) ---------- */
.qrep{background:var(--solid);color:#fff;border-radius:22px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--shadow-lg)}
.qrep b{font:700 17px var(--f-display)}
.qrep span{font-size:13px;color:#C9D0DE;font-weight:500}
.qrep-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.qrep-row button{border:0;border-radius:14px;min-height:56px;font:700 14px var(--f-body);cursor:pointer;color:#fff}
.qrep-bad{background:#C8352B}.qrep-mid{background:#C98A12}.qrep-ok{background:var(--ok)}
.qrep-x{align-self:flex-end;background:none;border:0;color:#C9D0DE;font:600 13px var(--f-body);text-decoration:underline;cursor:pointer}
.qrep-btn{margin-top:8px;width:100%}
.mdo-gps{display:flex;align-items:center;gap:8px;margin-top:8px;font:600 13px var(--f-body);color:var(--ink)}
.mdo-gps-b{border:1.5px solid var(--line,#d9dee8);background:transparent;color:var(--ink);border-radius:999px;padding:5px 12px;font:700 12px var(--f-body);cursor:pointer}
.mdo-gps-b.on{background:var(--ink);color:#fff;border-color:var(--ink)}
/* Téléphone à l'horizontale : barre du bas plus compacte (rapport de test M-03) */
@media (orientation:landscape) and (max-height:520px){
  nav{bottom:calc(6px + env(safe-area-inset-bottom,0px))}
  nav .in{height:46px;max-width:380px;border-radius:16px}
  nav button{height:42px;font-size:0;gap:0}
  nav button svg{width:20px;height:20px}
}
/* iPhone / Android en mode sombre (retour test iPhone du 20/10) */

  html.dark .mdo-row.best{background:#163A2A;border-color:#2fbf71}
  html.dark .mdo-row.best .mdo-n b{color:#fff}
  html.dark .mdo-gps-b{color:#F3EBDD;border-color:rgba(243,235,221,.35)}
  html.dark .mdo-gps-b.on{background:#F3EBDD;color:#0E1630;border-color:#F3EBDD}
  html.dark .leaflet-control-zoom a{color:#0E1630!important}

/* la dernière ligne d'une carte ne doit jamais finir cachée sous la barre du bas */
.mdo{scroll-margin-bottom:120px}

.dz-share{background:#2fbf71;color:#fff;border-color:#2fbf71}
.mdo-week{margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(47,191,113,.12);color:var(--ok);font:700 14px var(--f-body)}
html.dark .mdo-week{color:#5dff9b}

/* Bandeau de lancement des applis */
.launch{position:relative;margin:0 0 14px;padding:18px 18px 16px;border-radius:22px;color:#fff;overflow:hidden;
  background:radial-gradient(120% 140% at 100% 0%,#1f8f55 0%,#0E1630 55%);box-shadow:var(--shadow-lg)}
.launch b{display:block;font-size:1.12rem;margin-bottom:4px}
.launch span{display:block;opacity:.85;font-size:.92rem;margin-bottom:12px}
.launch .l-row{display:flex;gap:10px;flex-wrap:wrap}
.launch a{flex:1 1 140px;text-align:center;background:#F3EBDD;color:#0E1630;font-weight:700;border-radius:999px;padding:11px 14px;text-decoration:none}
.launch .l-x{position:absolute;top:8px;right:10px;background:none;border:0;color:#fff;opacity:.7;font-size:1.3rem;cursor:pointer}

/* Légende de la carte des parkings */
.map-legend{position:absolute;left:10px;bottom:10px;z-index:500;display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.94);color:#0E1630;border-radius:12px;padding:6px 10px;font:600 12px var(--f-body);box-shadow:0 4px 12px rgba(14,22,48,.18)}
.map-legend b{font-weight:800}
.lg-it{display:inline-flex;align-items:center;gap:4px}
.lg-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.lg-dot.free{background:var(--ch)}
.lg-dot.taken{background:#fff;box-shadow:inset 0 0 0 2px #aab}
.price-hint{width:100%;margin-top:4px}
html.dark .map-legend{background:rgba(21,28,51,.94);color:#F3EBDD}

/* ---------- v52 : files d'attente modernes (style A) ---------- */
.lane2{all:unset;box-sizing:border-box;display:block;position:relative;cursor:pointer;flex:none;border-radius:18px;padding:12px 14px 12px;
  background:linear-gradient(160deg,#141c38,#0d1429);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);color:#F3EBDD;--c:#8f9ab8}
.lane2.ok{--c:#5dff9b}.lane2.mid{--c:#ffb21e}.lane2.bad{--c:#ff5a4d}.lane2.none{--c:#6b7593}
.lane2:focus-visible{outline:3px solid var(--led);outline-offset:2px}.lane2:active{transform:scale(.99)}
.l2-top{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.l2-n{font:800 16px var(--f-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.l2-v{font:800 22px/1 var(--f-display);color:var(--c);white-space:nowrap;text-shadow:0 0 14px color-mix(in srgb,var(--c) 45%,transparent)}
.l2-v small{font:600 12px var(--f-body);opacity:.85}
.l2-mid{display:flex;justify-content:space-between;gap:10px;margin-top:3px;font:600 11.5px var(--f-body)}
.l2-tr{color:var(--c)}.l2-src{color:#8f9ab8;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.l2-track{position:relative;display:block;height:30px;margin-top:10px;border-radius:999px;background:#1a2242;overflow:hidden}
.l2-fill{position:absolute;top:0;bottom:0;right:0;border-radius:999px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c) 55%,transparent));box-shadow:0 0 16px color-mix(in srgb,var(--c) 35%,transparent)}
.l2-q{position:absolute;top:0;bottom:0;right:16px;display:flex;align-items:center;gap:4px}
.l2-q .tcar{width:34px;height:18px}
.l2-gate{position:absolute;right:7px;top:5px;bottom:5px;width:4px;border-radius:2px;background:repeating-linear-gradient(180deg,#D7261E 0 4px,#fff 4px 8px)}
.lane2.none .l2-track{display:none}
.lane2.to-fr .l2-track{transform:scaleX(-1)}
.l2-best{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:18px;cursor:pointer;color:#F3EBDD;
  background:linear-gradient(90deg,#123d2a,#0f1630);box-shadow:inset 0 0 0 1px rgba(93,255,155,.45),0 0 22px rgba(93,255,155,.12)}
.l2-best.mid{background:linear-gradient(90deg,#3d2f0f,#0f1630);box-shadow:inset 0 0 0 1px rgba(255,178,30,.45)}
.l2-best.bad{background:linear-gradient(90deg,#3d1512,#0f1630);box-shadow:inset 0 0 0 1px rgba(255,90,77,.45)}
.l2-bt b{display:block;font:800 15px var(--f-display)}.l2-bt span{font:600 12px var(--f-body);color:#5dff9b}
.l2-best.mid .l2-bt span{color:#ffc54d}.l2-best.bad .l2-bt span{color:#ff7a6e}
.l2-best strong{font:800 22px var(--f-display);color:#5dff9b;white-space:nowrap}.l2-best.mid strong{color:#ffc54d}.l2-best.bad strong{color:#ff7a6e}
@media (prefers-reduced-motion:no-preference){
  .lane2.mid .l2-q,.lane2.bad .l2-q{animation:inch2 3.4s cubic-bezier(.5,0,.3,1) infinite}
  .lane2.bad .l2-q{animation-duration:6s}
  .lane2.ok .l2-q{animation:flow2 1.8s linear infinite}
  @keyframes inch2{0%,60%{transform:translateX(-10px)}90%,100%{transform:translateX(0)}}
  @keyframes flow2{from{transform:translateX(-38px)}to{transform:translateX(0)}}
}
/* Radar des douanes */
.douane-head{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between}
.douane-radar{margin:4px 12px 6px;border-radius:20px;background:radial-gradient(120% 90% at 50% 45%,#121a36,#080c1a);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);padding:6px 4px 10px}
.douane-radar svg{display:block;width:100%;height:auto}
.rd-b{cursor:pointer;outline:none}.rd-b:focus-visible circle{stroke-width:4}
.rd-v{font-family:var(--f-display);font-weight:800}
.rd-n{fill:#F3EBDD;font-family:var(--f-display);font-weight:800;letter-spacing:-.2px}
.rd-city{fill:#8f9ab8;font:800 12px var(--f-display)}.rd-fr{fill:#56607e;font:600 11px var(--f-body)}
.rd-me{fill:#F3EBDD;font:800 12px var(--f-display)}
.rd-b{transform-box:fill-box;transform-origin:center}
.rd-leg{display:flex;flex-wrap:wrap;gap:6px 12px;justify-content:center;margin:2px 10px 0;font:600 11px var(--f-body);color:#8f9ab8}
.rd-leg i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px;vertical-align:-1px}
@media (prefers-reduced-motion:no-preference){
  .rd-b{animation:rdf 7s ease-in-out infinite}
  .rd-b:nth-child(3n){animation-name:rdf2;animation-duration:8.5s}
  .rd-b:nth-child(3n+1){animation-name:rdf3;animation-duration:6.2s}
  .rd-b.best{animation:rdf 7s ease-in-out infinite,rdp 2.2s ease-in-out infinite}
  @keyframes rdf{0%,100%{transform:translate(0,0) scale(1)}25%{transform:translate(5px,-6px) scale(1.03)}50%{transform:translate(-3px,-9px) scale(1)}75%{transform:translate(-6px,-2px) scale(.98)}}
  @keyframes rdf2{0%,100%{transform:translate(0,0) scale(1)}30%{transform:translate(-6px,5px) scale(.98)}60%{transform:translate(4px,8px) scale(1.03)}}
  @keyframes rdf3{0%,100%{transform:translate(0,0) scale(1)}40%{transform:translate(7px,4px) scale(1.02)}70%{transform:translate(2px,-7px) scale(.99)}}
  @keyframes rdp{50%{filter:drop-shadow(0 0 12px #5dff9b)}}
  .rd-b:active{transform:scale(1.12)!important;transition:transform .15s}
}
/* ---------- v52 : trajets façon billet ---------- */
.card.trip2{display:block;padding:14px 16px 14px}
.card.trip2 .body{padding:0}
.tk{margin-bottom:8px}
.tk-drv{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.tk-drv .avatar,.tk-drv img{flex:none}
.tk-nm{font:800 16px var(--f-display);min-width:0}
.tk-nm .name-link,.tk-nm b{font:inherit;color:inherit}
.tk-mine{font:800 15px var(--f-display);margin-bottom:8px}
.tk-line{display:flex;align-items:center;gap:8px;margin-top:4px}
.tk-h{font:800 24px/1 var(--f-display);letter-spacing:-.5px}
.tk-o{width:11px;height:11px;border-radius:50%;border:2.5px solid currentColor;flex:none;opacity:.75}
.tk-o.end{background:currentColor}
.tk-bar{flex:1;position:relative;height:3px;border-radius:3px;background:linear-gradient(90deg,currentColor,#9aa6c8 50%,currentColor);opacity:.95;display:flex;justify-content:center;align-items:center;min-width:60px}
.tk-bar.ok{background:linear-gradient(90deg,currentColor,#2fbf71 50%,currentColor)}
.tk-bar.mid{background:linear-gradient(90deg,currentColor,#e09412 50%,currentColor)}
.tk-bar.bad{background:linear-gradient(90deg,currentColor,#d93a2e 50%,currentColor)}
.tk-dz{position:relative;white-space:nowrap;font:700 11.5px var(--f-body);padding:4px 9px;border-radius:999px;background:var(--surface,#fff);border:1.5px solid #9aa6c8;color:var(--ink,#0E1630)}
.tk-dz.ok{border-color:#2fbf71;color:#1e9e57}.tk-dz.mid{border-color:#e09412;color:#b87508}.tk-dz.bad{border-color:#d93a2e;color:#c22f24}
.tk-pl{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font:600 12.5px var(--f-body);color:var(--muted)}
.tk-pl span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:48%}
.tk-pl span:last-child{text-align:right}
.tk-ret{font:600 12px var(--f-body);color:var(--muted);margin-top:4px}
.card.trip2 .chip.price{display:none}
.card.trip2 .route{display:none}
.tk-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin:2px 0 10px}
.tk-foot .seats{display:flex;gap:5px;margin:0}
.tk-foot .seat{width:20px;height:20px;border-radius:6px;background:rgba(47,191,113,.15);border:2px solid #2fbf71}
.tk-foot .seat.taken{background:var(--line,#e4e7ee);border-color:var(--line,#cfd5e1)}
.tk-price b{font:800 22px var(--f-display)}.tk-price small{font:600 12px var(--f-body);color:var(--muted)}
.card.trip2 .foot{flex-wrap:wrap}
html.dark .tk-dz{background:#151C33;color:#F3EBDD}html.dark .tk-dz.ok{color:#5dff9b}html.dark .tk-dz.mid{color:#ffc54d}html.dark .tk-dz.bad{color:#ff7a6e}html.dark .tk-foot .seat.taken{background:#1d2647;border-color:#2a355c}

/* =====================================================================
   v28 — 5 rubriques : Aujourd'hui · Douanes · Covoit. · Parkings · Moi
   ===================================================================== */
:root{--night:#0D1428;--night2:#141E3A;--neon:#3BE38A;--neon-d:#1E8E5A;--amber:#FFC54D;--hot:#FF6B5E}
nav .in{grid-template-columns:repeat(5,1fr)}
nav button{font-size:10.5px;letter-spacing:-.1px}
nav button span:not(.badge){white-space:nowrap}
nav button[aria-selected="true"] svg{color:var(--neon)}
nav button[aria-selected="true"]::after{content:"";position:absolute;bottom:3px;width:18px;height:3px;border-radius:2px;background:var(--neon)}

/* En-têtes de rubrique */
.ph{padding:4px 2px 0}
.ph-t{font:800 30px/1.05 var(--f-display);letter-spacing:-.03em;margin:0}
.ph-s{margin:6px 0 0;color:var(--muted);font-size:14px;font-weight:600;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ph-s .live-dot{position:static;margin:0}

/* Bonjour */
.hello{display:flex;flex-direction:column;gap:2px;padding:2px 2px 0}
.hl-d{font-size:13px;font-weight:600;color:var(--muted)}
.hl-n{font:800 26px/1.1 var(--f-display);letter-spacing:-.02em}

/* Ton départ : carte héros (toujours nuit, comme l'aperçu) */
.t-hero{position:relative;overflow:hidden;border-radius:26px;padding:16px 16px 14px;color:#fff;
  background:radial-gradient(120% 90% at 100% 0%,rgba(59,227,138,.18),transparent 55%),linear-gradient(160deg,var(--night2),var(--night));
  border:1.5px solid rgba(59,227,138,.45);box-shadow:0 14px 34px rgba(13,20,40,.35),inset 0 0 40px rgba(59,227,138,.06);display:flex;flex-direction:column;gap:12px}
.th-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.th-lab{display:flex;align-items:center;gap:7px;font:800 12px var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--neon)}
.th-dot{width:8px;height:8px;border-radius:50%;background:var(--neon);box-shadow:0 0 0 0 rgba(59,227,138,.6);animation:thp 2s infinite}
@keyframes thp{70%{box-shadow:0 0 0 8px rgba(59,227,138,0)}100%{box-shadow:0 0 0 0 rgba(59,227,138,0)}}
.th-dir{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:#C9D2EA;border-radius:999px;padding:6px 11px;font:700 12px var(--f-body);cursor:pointer;min-height:32px}
.th-mid{display:flex;align-items:center;gap:12px}
.th-left{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.th-time{font:800 54px/1 var(--f-display);letter-spacing:-.04em;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.th-time small{font:700 15px var(--f-body);letter-spacing:0;color:#C9D2EA}
.th-time.th-free{font-size:30px}
.th-sub{font-size:15px;color:#C9D2EA}.th-sub b{color:var(--neon)}
.th-off{font-size:13px;color:#8E9AB8}
.th-ring{position:relative;width:84px;height:84px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center}
.th-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}
.th-ring circle{fill:none;stroke-width:6;stroke-linecap:round}
.tr-bg{stroke:rgba(255,255,255,.1)}.tr-fg{stroke:var(--neon);filter:drop-shadow(0 0 5px rgba(59,227,138,.7));transition:stroke-dasharray .6s}
.th-ring b{font:800 20px/1 var(--f-display)}.th-ring small{font-size:10px;color:#8E9AB8;font-weight:600}
.th-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.th-tile{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:8px 6px;text-align:center;display:flex;flex-direction:column;gap:2px;min-width:0}
.th-tile span{font-size:11px;color:#8E9AB8;font-weight:600}
.th-tile b{font:800 15px/1.15 var(--f-display);overflow-wrap:anywhere}
.th-tile.ok b{color:var(--neon)}.th-tile.mid b{color:var(--amber)}.th-tile.bad b{color:var(--hot)}
.th-acts{display:flex;gap:8px}
.th-go,.th-cv{flex:1;display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:16px;font:800 15px var(--f-body);text-decoration:none;cursor:pointer;border:0}
.th-go{background:var(--neon);color:#062814;box-shadow:0 6px 18px rgba(59,227,138,.35)}
.th-cv{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.14)}

/* Tableau des douanes façon aéroport */
.t-board{border-radius:22px;background:#0A0F1E;padding:14px 12px 10px;color:#fff;box-shadow:0 10px 26px rgba(10,15,30,.3);display:flex;flex-direction:column;gap:10px}
.tb-head{display:flex;align-items:center;gap:8px}
.tb-head b{font:800 12px var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:#AEB8D6;flex:1}
.tb-dir{border:1px solid rgba(255,255,255,.16);background:none;color:#C9D2EA;border-radius:999px;padding:4px 10px;font:700 12px var(--f-body);cursor:pointer;min-height:30px}
.tb-live{font:800 11px var(--f-body);letter-spacing:.1em;color:var(--neon);display:flex;align-items:center;gap:5px}
.tb-live::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;animation:thp 2s infinite}
.tb-live.off{color:#7D879E}.tb-live.off::before{animation:none}
.tb-rows{display:flex;flex-direction:column;gap:6px}
.tb-row{display:flex;align-items:center;gap:8px;background:#121A30;border:1px solid #1C2644;border-radius:12px;padding:8px 9px;cursor:pointer;color:inherit;font:inherit;text-align:left;min-height:46px}
.tb-name{display:flex;gap:2px;flex:1;min-width:0;overflow:hidden}
.tb-f{display:inline-flex;align-items:center;justify-content:center;width:15px;height:24px;flex:none;border-radius:3px;
  background:linear-gradient(#1D2540 0 49%,#0B1022 49% 51%,#1A2139 51%);color:#FFD34D;font:800 13px/1 "Sora",monospace;box-shadow:inset 0 -1px 0 rgba(0,0,0,.5)}
.tb-f.flip{animation:tbflip .5s cubic-bezier(.3,.7,.4,1) both}
@keyframes tbflip{0%{transform:rotateX(90deg);opacity:.2}60%{transform:rotateX(-12deg);opacity:1}100%{transform:none}}
.tb-tr{width:18px;text-align:center;font-weight:800;color:#8E9AB8}.tb-tr.up{color:var(--hot)}.tb-tr.down{color:var(--neon)}
.tb-v{flex:none;border-radius:999px;padding:4px 10px;font:800 13px var(--f-display);min-width:62px;text-align:center}
.tb-v.ok{background:rgba(59,227,138,.15);color:var(--neon)}.tb-v.mid{background:rgba(255,197,77,.15);color:var(--amber)}
.tb-v.bad{background:rgba(255,107,94,.16);color:var(--hot)}.tb-v.none{background:#1C2644;color:#8E9AB8}
.tb-more{border:0;background:none;color:#AEB8D6;font:700 13px var(--f-body);padding:6px;cursor:pointer;min-height:36px}
@media (max-width:370px){.tb-f{width:13px;height:22px;font-size:12px}}

/* Ils passent par toi */
.t-vois{display:flex;flex-direction:column;gap:8px}
.tv-head{display:flex;align-items:center;justify-content:space-between;padding:0 2px}
.tv-head b{font:800 12px var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.tv-n{font:800 13px var(--f-display);color:var(--muted)}
.tv-row{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;margin:0 -16px;padding-inline:16px;scrollbar-width:none}
.tv-row::-webkit-scrollbar{display:none}
.tv-card{flex:0 0 min(72%,240px);scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:12px;box-shadow:var(--shadow);cursor:pointer;color:var(--ink);font:inherit}
.tv-top{display:flex;align-items:center;gap:8px}.tv-top .av{width:32px;height:32px;font-size:14px}
.tv-top b{font:700 16px var(--f-display)}
.tv-t{font-size:13px;color:var(--muted);font-weight:600}
.tv-s{font-size:13px;font-weight:700;color:var(--ok)}

/* Covoit. : chercher / conduire + puces */
.cv-chips{display:flex;gap:8px;flex-wrap:wrap}
.cv-chip{border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:8px 14px;font:700 14px var(--f-body);cursor:pointer;min-height:40px}
.cv-chip.on{background:var(--neon-d);border-color:var(--neon-d);color:#fff}

/* Parkings : P+R */
.pr-box{display:flex;flex-direction:column;gap:10px}
.pr-row{display:flex;align-items:center;gap:12px;background:var(--surface);border-radius:18px;padding:12px 14px;box-shadow:var(--shadow);text-decoration:none;color:var(--ink);border:1px solid var(--line)}
.pr-ic{flex:none;width:46px;height:46px;border-radius:14px;background:var(--fr);color:#fff;display:flex;align-items:center;justify-content:center;font:800 13px var(--f-display)}
.pr-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pr-tx b{font:700 16px var(--f-display)}.pr-tx small{font-size:13px;color:var(--muted);line-height:1.3}
.pr-go{flex:none;font:700 13px var(--f-body);color:var(--fr)}
.pr-note a{color:var(--fr);font-weight:700}
#placesBox{display:flex;flex-direction:column;gap:14px}

/* Moi : en-tête */
.me-head{display:flex;flex-direction:column;gap:12px}
.mh-top{display:flex;align-items:center;gap:14px}
.mh-av.av{width:64px;height:64px;font-size:26px;border:3px solid var(--neon);flex:none}
.mh-tx{display:flex;flex-direction:column;gap:3px;min-width:0}
.mh-tx b{font:800 24px/1.1 var(--f-display)}
.mh-tx span{font-size:14px;color:var(--muted);font-weight:600}
.mh-tx .mh-lvl{align-self:flex-start;background:var(--ok-soft);color:var(--ok);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:800}
.mh-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mh-t{background:var(--surface);border-radius:18px;padding:12px 14px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:3px}
.mh-t span{font-size:12px;color:var(--muted);font-weight:600}
.mh-t b{font:800 24px/1 var(--f-display);color:var(--ok)}

  html.dark .tv-s,html.dark .mh-t b{color:#7FD8A6}html.dark .mh-tx .mh-lvl{color:#7FD8A6}
  html.dark .pr-ic{background:#2C3D78}html.dark .pr-go,html.dark .pr-note a{color:#8DB4F0}
  html.dark .t-board{border:1px solid #1C2644}

@media (prefers-reduced-motion:reduce){.th-dot,.tb-live::before{animation:none}}
@media (orientation:landscape) and (max-height:520px){nav button span:not(.badge){display:none}nav button[aria-selected="true"]::after{display:none}}
.tv-row{scroll-padding-inline:16px}
.me-head:not([hidden]) ~ #savings{display:none}
.tb-name{gap:1.5px}

/* =====================================================================
   v29 — Nuit premium (toujours sombre) · accents néon · animations
   ===================================================================== */
html.dark{color-scheme:dark;--bg:#070B18;--surface:#0E152B;--line:#1C2644;--soft:#121A30;--ink:#EEF1F8;--muted:#8E9AB8;--solid:#0E152B;
  --shadow:0 2px 12px rgba(0,0,0,.4);--shadow-lg:0 14px 34px rgba(0,0,0,.55)}
html.dark,html.dark body{background:var(--bg)}
html.dark .card,html.dark .tv-card,html.dark .pr-row,html.dark .mh-t,html.dark .cv-chip,html.dark .btn.ghost{border:1px solid var(--line)}
html.dark .seg{background:var(--surface);border:1px solid var(--line);padding:4px;border-radius:16px}
html.dark .seg button{border-radius:12px}
html.dark .seg button[aria-pressed="true"]{background:var(--neon);color:#062814;box-shadow:0 4px 16px rgba(59,227,138,.3)}
html.dark nav .in{background:rgba(14,21,43,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line)}
html.dark nav button{transition:color .25s}
html.dark nav button[aria-selected="true"]{background:rgba(59,227,138,.12);box-shadow:inset 0 0 0 1px rgba(59,227,138,.3);margin:0 2px}
html.dark nav button[aria-selected="true"]::after{display:none}
html.dark .me-btn{background:#1B2750;box-shadow:0 0 0 2px var(--neon)}
html.dark .toast{background:#0E152B;border:1px solid var(--neon);box-shadow:0 10px 30px rgba(0,0,0,.6)}
html.dark .cv-chip.on{background:rgba(59,227,138,.14);border-color:var(--neon);color:var(--neon)}
html.dark .ph-t{color:#fff}
/* apparition en cascade quand on change de rubrique */
@media (prefers-reduced-motion:no-preference){
  .panel.enter>*{animation:cfRise .55s cubic-bezier(.2,.9,.3,1) both}
  .panel.enter>*:nth-child(2){animation-delay:.05s}.panel.enter>*:nth-child(3){animation-delay:.1s}.panel.enter>*:nth-child(4){animation-delay:.15s}
  .panel.enter>*:nth-child(5){animation-delay:.2s}.panel.enter>*:nth-child(6){animation-delay:.25s}.panel.enter>*:nth-child(n+7){animation-delay:.3s}
  @keyframes cfRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
}
/* Ton départ : ciel vivant derrière */
.t-hero{background:#0D1428;min-height:300px}
.th-sky{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.t-hero>*:not(.th-sky){position:relative;z-index:1}
.th-time{font-size:60px;text-shadow:0 4px 22px rgba(0,0,0,.45)}
.th-sub{font-size:16px;color:#E3E8F5;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.th-tile{background:rgba(7,11,24,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-color:rgba(255,255,255,.1)}
.th-acts{margin-bottom:112px}
.th-go{flex:1.3}
.th-mus{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:16px;font:800 15px var(--f-body);cursor:pointer;
  background:rgba(7,11,24,.55);color:#fff;border:1px solid rgba(30,215,96,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.eq{display:inline-flex;gap:2px;align-items:flex-end;height:16px}.eq i{width:3px;height:6px;background:#1ED760;border-radius:2px}
@media (prefers-reduced-motion:no-preference){.eq i{animation:eqb 1s ease-in-out infinite}.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.6s}}
@keyframes eqb{0%,100%{height:4px}50%{height:16px}}
/* choix de la musique */
.mu-list{display:flex;flex-direction:column;gap:8px;overflow:auto}
.mu-row{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font:800 16px var(--f-body);cursor:pointer;min-height:56px;text-align:left}
.mu-row.sel{border-color:var(--neon);box-shadow:inset 0 0 0 1px var(--neon)}
.mu-row small{margin-left:auto;color:var(--neon);font-size:12px}
.mu-ic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:19px;color:#fff;flex:none}
/* accueil des nouveaux */
.obx{position:fixed;inset:0;z-index:3500;background:radial-gradient(90% 60% at 50% 30%,rgba(59,227,138,.16),transparent 70%),#070B18;color:#fff;overflow:hidden;transition:opacity .45s}
.obx.bye{opacity:0;pointer-events:none}
.ob-skip{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:16px;background:none;border:0;color:#8E9AB8;font:700 15px var(--f-body);padding:10px;cursor:pointer;z-index:2}
.ob-s{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:40px 30px 150px;text-align:center;
  transform:translateX(100%);opacity:0;transition:transform .6s cubic-bezier(.7,0,.2,1),opacity .6s}
.ob-s.on{transform:none;opacity:1}.ob-s.past{transform:translateX(-30%);opacity:0}
.ob-s h1{font:800 30px/1.12 var(--f-display);letter-spacing:-.03em;margin:0;max-width:340px}
.ob-s p{font-size:17px;color:#AEB8D6;line-height:1.4;margin:0;max-width:320px}
.ob-art{width:240px;height:220px;position:relative}
.ob-b{position:absolute;width:96px;height:96px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 12px var(--f-display);color:#fff}
.ob-b b{font-size:20px}.ob-b.g{background:radial-gradient(circle at 35% 30%,#5BF0A0,#1E8E5A);box-shadow:0 0 40px rgba(59,227,138,.45)}
.ob-b.y{width:80px;height:80px;background:radial-gradient(circle at 35% 30%,#FFD77A,#C98A12)}.ob-b.r{width:112px;height:112px;background:radial-gradient(circle at 35% 30%,#FF8C80,#B3261E);box-shadow:0 0 40px rgba(255,107,94,.45)}
.ob-road{position:absolute;left:0;right:0;top:110px;height:8px;border-radius:4px;background:repeating-linear-gradient(90deg,#3A4567 0 18px,transparent 18px 30px)}
.ob-car{position:absolute;top:56px;left:20px;font-size:60px}.ob-pin{position:absolute;top:140px;font-size:32px}
.ob-a3{display:flex;align-items:center;justify-content:center}.ob-time{font:800 92px var(--f-display);color:var(--neon);text-shadow:0 0 40px rgba(59,227,138,.6)}
.ob-dots{position:absolute;bottom:calc(122px + env(safe-area-inset-bottom,0px));left:0;right:0;display:flex;justify-content:center;gap:8px}
.ob-dots i{width:8px;height:8px;border-radius:9px;background:#2A3456;transition:all .4s}.ob-dots i.on{width:26px;background:var(--neon)}
.ob-next{position:absolute;left:28px;right:28px;bottom:calc(40px + env(safe-area-inset-bottom,0px));max-width:500px;margin:0 auto;height:58px;border:0;border-radius:18px;background:var(--neon);color:#062814;font:800 18px var(--f-body);cursor:pointer;box-shadow:0 10px 30px rgba(59,227,138,.4)}
@media (prefers-reduced-motion:no-preference){
  .ob-b{animation:obf 3s ease-in-out infinite}.ob-b.y{animation-delay:-1s}.ob-b.r{animation-delay:-2s}@keyframes obf{50%{transform:translateY(-10px)}}
  .ob-car{animation:obd 2.6s cubic-bezier(.5,0,.5,1) infinite}@keyframes obd{0%{left:-30px}100%{left:200px}}
}

/* Radar : lac Léman discret, bulles pleines */
.rd-lake{fill:#7E9CC2;font:italic 700 12px var(--f-body)}
.douane-radar .rd-n{fill:#fff!important}
.rd-b circle{transition:r .4s}
/* Douanes : gros boutons Aller / Retour */
.dz-dir{display:flex;width:100%;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:4px;gap:4px}
.dz-dir button{flex:1;border:0;background:none;color:var(--muted);font:800 14px var(--f-body);padding:11px 6px;border-radius:12px;cursor:pointer;min-height:44px}
.dz-dir button[aria-pressed="true"]{background:var(--neon);color:#062814;box-shadow:0 4px 16px rgba(59,227,138,.35)}

.pr-ln{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}.pr-ln i{font-style:normal;font-size:11px;font-weight:800;border-radius:6px;padding:2px 6px}
.pr-ic{background:linear-gradient(135deg,#1F4E9E,#2C3D78)}.pr-go{color:var(--neon)}
.cv-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}.cv-chips::-webkit-scrollbar{display:none}.cv-chip{flex:none}
/* Moi : réglages */
.ms-hide{display:none!important}
.ms-menu{display:flex;flex-direction:column}
.ms-h{font:800 11.5px var(--f-body);letter-spacing:.13em;text-transform:uppercase;color:#6F7B99;margin:18px 6px 8px}
.ms-grp{background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.ms-row{display:flex;align-items:center;gap:12px;width:100%;padding:11px 14px;min-height:54px;border:0;border-top:1px solid var(--line);background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.ms-row:first-child{border-top:0}.ms-row:active{background:var(--soft)}
.ms-ic{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px;flex:none}
.ms-t{flex:1;min-width:0;font-weight:700;font-size:15.5px}
.ms-v{color:var(--muted);font-size:14px;font-weight:600;max-width:46%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-c{color:#4A5576;font-size:22px;line-height:1}
.ms-bdg{background:#DA291C;color:#fff;border-radius:999px;min-width:22px;height:22px;padding:0 7px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800}
.ms-sub{display:flex;flex-direction:column;gap:14px}
.ms-hd{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.ms-hd h2{font:800 28px/1.1 var(--f-display);margin:0;letter-spacing:-.02em}
.ms-back{border:0;background:none;color:var(--neon);font:800 16px var(--f-body);padding:8px 0;cursor:pointer;min-height:40px}
.ms-choose{display:flex;flex-direction:column;gap:8px}
.ms-foot{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:22px}
.ms-logout{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px;color:var(--ink);font:700 16px var(--f-body);cursor:pointer}
.ms-ver{color:#4A5576;font-size:12px;margin:0}
.ms-foot .legal{justify-content:center}
@media (prefers-reduced-motion:no-preference){.ms-sub.ms-in{animation:msIn .35s cubic-bezier(.2,.9,.3,1)}@keyframes msIn{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:none}}}
.me-head .mh-grid{grid-template-columns:repeat(4,1fr);gap:6px}
.me-head .mh-t{padding:9px 4px;text-align:center;border:1px solid var(--line)}
.me-head .mh-t b{font-size:17px;color:var(--neon)}.me-head .mh-t span{font-size:10.5px;order:2}
.me-head .mh-top{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:14px}

.ms-sub .pts-card>h3:first-child,.ms-sub .tele-card>h3:first-child{display:none}

/* v29 audit : lisibilité (rien sous 12 px), Douanes plus courte, foule réelle */
nav button{font-size:11.5px}
.me-head .mh-t span,.th-tile span,.tb-head b{font-size:12px}
.ms-h{color:#8592B0}
.tb-crowd{margin:-2px 2px 0;font-size:13px;font-weight:600;color:#AEB8D6}
#p-douane .rd-hero{max-height:150px;overflow:hidden}
#p-douane .douane-sum{border-radius:22px}

/* Apparence claire : quelques réglages pour les nouveautés v29 */
html:not(.dark) .ms-c{color:#9AA4BC}
html:not(.dark) .ms-h{color:#5A6378}
html:not(.dark) .ph-t{color:var(--ink)}
html:not(.dark) .seg button[aria-pressed="true"]{background:var(--solid);color:#fff;box-shadow:none}
html:not(.dark) .cv-chip.on{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
html:not(.dark) .tb-crowd{color:var(--muted)}
html:not(.dark) .pr-go,html:not(.dark) .ms-back{color:var(--ok)}
.mdo-chk[hidden]{display:none!important}

.douane-src{font-size:12px;color:var(--muted);margin:10px 14px 4px;line-height:1.4}

.test-band{position:sticky;top:0;z-index:2500;margin:0 -16px;padding:8px 12px;background:#FFC54D;color:#1a1300;font:800 13px var(--f-body);text-align:center}

/* l'emoji 🚗 regarde à gauche : on le retourne pour qu'il avance vers la Suisse */
.ob-car{transform:scaleX(-1)}

/* =====================================================================
   v29 — corrections du test du 2 novembre
   ===================================================================== */
/* 2 jours choisis en vert */
html.dark .days button[aria-pressed="true"]{background:var(--neon)!important;color:#062814!important;border-color:var(--neon)!important}
html.dark .days button[aria-pressed="false"]{background:var(--surface);color:var(--muted);border-color:var(--line)}
/* 3 · 14 boutons principaux en vert (plus de rouge de l'ancien style) */
html.dark .btn:not(.ghost):not(.danger):not(.ok){background:var(--neon);color:#062814}
html.dark .btn:not(.ghost):not(.danger):not(.ok):hover{background:#2FCB78}
html.dark .chip.when{background:rgba(255,197,77,.14);color:var(--amber)}
/* 4 cases d'adresse sobres */
html.dark input.sign-in{background-color:#101A36!important;border:2px solid #2B4B8C;box-shadow:none;font-size:16px}
html.dark input.sign-in[data-c="ch"]{border-color:#1E8E5A}
html.dark input.sign-in::placeholder{color:#7D89A8}
/* 5 · 24 fenêtres : fond nuit opaque, fond derrière bien assombri */
html.dark .scrim{background:rgba(3,6,14,.78)}
html.dark .sheet{background:#0B1124;border-top:1px solid var(--line)}
html.dark .sheet .mu-row{background:#121A30}
/* 6 Douanes : bandeau plus petit et nuit */
html.dark .douane{background:var(--surface)!important;border:1px solid var(--line);box-shadow:none}
html.dark #p-douane .rd-hero{max-height:120px}
html.dark .douane-sum{background:transparent}
/* 7 textes foncés sur les boutons verts sélectionnés */
html.dark .seg button[aria-pressed="true"],html.dark .dz-dir button[aria-pressed="true"],html.dark .douane .seg button[aria-pressed="true"]{background:var(--neon)!important;color:#062814!important;text-shadow:none}
/* 8 bulles jaunes : texte foncé */
.douane-radar .rd-b.mid .rd-n,.douane-radar .rd-b.mid .rd-v{fill:#2A1C00!important}
/* 10 · légende jamais sous la barre du bas */
#p-douane{padding-bottom:24px}
/* 11 encadré d'aide au style nuit */
html.dark .guide{background:var(--surface);border:1px solid var(--line);box-shadow:none}
html.dark .guide li span{background:var(--neon);color:#062814}
/* 12 « Toute la semaine » lisible */
.date.week,.date.week small,.date.week b{color:#1a1300!important}
/* 15 pastilles des lignes plus lisibles */
.pr-ln i{font-size:12px;padding:2px 7px;font-weight:800}
/* 19 « par Thônex-Vallard » lisible sur le ciel */
.th-sub,.th-sub b{text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 14px rgba(0,0,0,.7)}
/* 20 bouton « Comparer les douanes » */
.th-cmp{position:relative;z-index:1;align-self:flex-end;margin-top:-100px;margin-bottom:64px;border:0;background:rgba(7,11,24,.55);color:#C9D2EA;border-radius:999px;padding:7px 14px;font:700 13px var(--f-body);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* 23 « Me déconnecter » sobre */
html.dark .ms-logout{background:transparent;color:#AEB8D6}
/* 25 boutons d'attente francs et lisibles */
html.dark .waits button.ok{background:#14532D;color:#D1FAE5}
html.dark .waits button.mid{background:#78350F;color:#FEF3C7}
html.dark .waits button.bad{background:#7F1D1D;color:#FEE2E2}
html.dark .waits button small{opacity:.85}
/* 16 Moi sans compte */
.ms-guest{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:16px}
.ms-guest b{font:800 19px var(--f-display)}.ms-guest span{color:var(--muted);font-size:14px}
.ms-logout[hidden],#delAcc[hidden]{display:none!important}
/* 26 ton trajet en haut de Covoit. */
.cv-mine-h{font:800 12px var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:4px 2px}

/* Moi : photo cliquable pour la changer */
.mh-avw{position:relative;border:0;background:none;padding:0;cursor:pointer;flex:none}
.mh-cam{position:absolute;right:-2px;bottom:-2px;width:26px;height:26px;border-radius:50%;background:var(--neon);display:flex;align-items:center;justify-content:center;font-size:13px;box-shadow:0 0 0 3px var(--surface)}
.mh-top.tap{cursor:pointer}.mh-top .ms-c{margin-left:auto}

a.mu-row{text-decoration:none}

.pv-acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
html.dark .photo-view{background:rgba(3,6,14,.92)}
html.dark .photo-view .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}

.th-role{display:inline-block;align-self:flex-start;width:max-content;margin:2px 0 4px;padding:3px 10px;border-radius:999px;font-weight:800;font-size:12.5px;background:rgba(59,227,138,.16);color:#3BE38A;position:relative;z-index:1}
html:not(.dark) .th-role{background:rgba(22,130,72,.12);color:#16824a}

/* 3 nov : modifier son trajet depuis le grand cadre, choix de la douane */
.th-tr{display:flex;gap:6px;align-items:center;flex:none}
.th-edit{padding-left:11px;padding-right:11px}
.qrep-pick{grid-template-columns:1fr}
.qrep-pick button{width:100%;text-align:left}

/* 3 nov : bandeau Douanes discret mais proportionné (on réduit tout, on ne coupe plus les voitures) */
#p-douane .rd-hero,html.dark #p-douane .rd-hero{max-height:none;aspect-ratio:390/236;width:68%;max-width:290px;margin:14px auto 0;border-radius:18px}
#p-douane .rd-pmv{border-width:2px;padding:3px;border-radius:6px}

/* 4 nov : « Je pars à / Je dois arriver à » */
.mdo-mode{display:flex;margin:2px 0 10px}
.mdo-mode button{flex:1}
.mdo-mode[hidden]{display:none!important}
.mdo-arrnote{margin-top:-4px}

.qrep-safe,.ds-safe{font-size:.82rem;line-height:1.35;opacity:.85;margin:.4rem 0 0}

/* accueil nouveau venu (v82) */
.th-ptitle{font:800 38px/1.05 var(--f-display);letter-spacing:-.03em;text-shadow:0 4px 22px rgba(0,0,0,.45);margin-top:6px}
.th-pitch .th-sub{margin-top:4px}
.t-hero .th-pitch+.th-acts .th-go{flex:1}
body.guest .guest-banner{padding:8px 12px;border-width:1px;margin:12px 0}
body.guest .guest-banner .gb-tx{font-size:.88rem;flex:1}
.t-hero.pitch{min-height:0}.t-hero.pitch .th-acts{margin-bottom:64px}
.tb-none{font-size:13px;line-height:1.4;color:var(--muted);margin:10px 4px 0;text-align:center}

/* v97 : invitation à créer un compte (visiteur qui revient) */
.cf-invite{position:fixed;inset:0;z-index:9999;background:rgba(6,11,26,.62);display:flex;align-items:flex-end;justify-content:center;padding:16px;animation:cfIn .25s ease}
.cf-invite-box{width:100%;max-width:420px;background:var(--surface);color:var(--ink);border-radius:26px;padding:26px 22px 18px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.4);margin-bottom:max(8px,env(safe-area-inset-bottom))}
.cf-invite-ico{font-size:40px;line-height:1}
.cf-invite .cf-invite-box h2{margin:10px 0 8px;font-size:25px!important;line-height:1.15;font-weight:800!important;letter-spacing:-.3px;font-family:var(--f-display)}
.cf-invite-box p{margin:0 0 8px;font-size:16px;line-height:1.45}
.cf-invite-small{color:var(--muted);font-size:14px!important}
.cf-invite-go{width:100%;margin-top:10px;min-height:52px;font-size:17px}
.cf-invite-later{background:none;border:0;color:var(--muted);font:600 15px var(--f-body);padding:14px;cursor:pointer;width:100%}
@keyframes cfIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.cf-invite{animation:none}}
