:root{
    --paper:#EFF1EB; --panel:#FAFAF7; --sunk:#E5E8DF;
    --line:#D2D6CA; --line-2:#BFC4B7;
    --ink:#15181A; --body:#41484A; --mute:#78807D;
    --red:#A5322A; --green:#0C6152; --blue:#1E3E6B; --sand:#8F6C0C;
    --red-w:#F3E2DF; --green-w:#DDECE7; --sand-w:#F4EBD3;

    --display:"Arial Narrow","Helvetica Neue Condensed","Roboto Condensed","Liberation Sans Narrow",Arial,sans-serif;
    --text:"Segoe UI",Roboto,-apple-system,system-ui,"Helvetica Neue",sans-serif;
    --mono:ui-monospace,"Cascadia Mono","SF Mono",Consolas,"Liberation Mono",monospace;

    --w:1080px;
  }
  @media (prefers-color-scheme:dark){
    :root{
      --paper:#0D1011; --panel:#161A1C; --sunk:#111517;
      --line:#282E31; --line-2:#394145;
      --ink:#ECEEE9; --body:#A6AEAD; --mute:#6E7676;
      --red:#E4736A; --green:#45BBA2; --blue:#8AAADD; --sand:#DCB84C;
      --red-w:#2A1A18; --green-w:#0F2320; --sand-w:#241E10;
    }
  }
  :root[data-theme="dark"]{
    --paper:#0D1011; --panel:#161A1C; --sunk:#111517;
    --line:#282E31; --line-2:#394145;
    --ink:#ECEEE9; --body:#A6AEAD; --mute:#6E7676;
    --red:#E4736A; --green:#45BBA2; --blue:#8AAADD; --sand:#DCB84C;
    --red-w:#2A1A18; --green-w:#0F2320; --sand-w:#241E10;
  }
  :root[data-theme="light"]{
    --paper:#EFF1EB; --panel:#FAFAF7; --sunk:#E5E8DF;
    --line:#D2D6CA; --line-2:#BFC4B7;
    --ink:#15181A; --body:#41484A; --mute:#78807D;
    --red:#A5322A; --green:#0C6152; --blue:#1E3E6B; --sand:#8F6C0C;
    --red-w:#F3E2DF; --green-w:#DDECE7; --sand-w:#F4EBD3;
  }

  body{background:var(--paper);color:var(--body);font-family:var(--text);
       font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased;}
  .wrap{max-width:var(--w);margin:0 auto;padding:0 22px 96px;}

  h1,h2,h3,h4{color:var(--ink);font-family:var(--display);font-weight:700;
              text-transform:uppercase;text-wrap:balance;letter-spacing:.01em;margin:0;}
  p{margin:0;}
  a{color:var(--blue);text-decoration:none;border-bottom:1px solid currentColor;}
  a:hover{color:var(--ink);}
  :focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px;}
  strong{color:var(--ink);font-weight:600;}
  .num{font-variant-numeric:tabular-nums;}

  .mast{padding:52px 0 30px;border-bottom:3px solid var(--ink);}
  .kicker{font-family:var(--mono);font-size:11px;letter-spacing:.22em;
          text-transform:uppercase;color:var(--mute);}
  .mast h1{font-size:clamp(44px,8.6vw,100px);line-height:.86;letter-spacing:-.015em;margin:14px 0 0;}
  .mast h1 em{font-style:normal;color:var(--red);}
  .mast h1 i{font-style:normal;color:var(--green);}
  .lede{max-width:62ch;margin-top:20px;font-size:17.5px;}

  .stats{display:flex;flex-wrap:wrap;gap:0;margin-top:30px;
         border:1px solid var(--line);background:var(--panel);}
  .stat{flex:1 1 148px;padding:16px 18px;border-right:1px solid var(--line);}
  .stat:last-child{border-right:0;}
  .stat b{display:block;font-family:var(--display);font-size:34px;line-height:1;
          color:var(--ink);font-variant-numeric:tabular-nums;}
  .stat span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
             text-transform:uppercase;color:var(--mute);margin-top:7px;}

  section{padding-top:58px;}
  .shead{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
         border-bottom:1px solid var(--line-2);padding-bottom:9px;margin-bottom:26px;}
  .shead h2{font-size:30px;letter-spacing:.005em;}
  .shead .tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;
              text-transform:uppercase;color:var(--mute);margin-left:auto;}
  .prose{display:flex;flex-direction:column;gap:14px;max-width:70ch;}

  .mapbox{border:1px solid var(--line);background:var(--panel);padding:16px 12px 10px;overflow-x:auto;}
  .mapbox svg{display:block;width:100%;min-width:680px;height:auto;}
  .legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px;padding:0 6px;
          font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);}
  .legend i{display:inline-block;width:22px;height:3px;vertical-align:middle;margin-right:7px;}

  .tw{overflow-x:auto;border:1px solid var(--line);background:var(--panel);}
  table{border-collapse:collapse;width:100%;min-width:620px;font-size:14px;}
  th{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
     color:var(--mute);text-align:left;padding:11px 12px;border-bottom:1px solid var(--line-2);
     font-weight:400;white-space:nowrap;background:var(--sunk);}
  td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top;}
  tbody tr:last-child td{border-bottom:0;}
  .r{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--mono);font-size:13px;white-space:nowrap;}
  .d{font-family:var(--mono);font-size:12px;color:var(--mute);white-space:nowrap;}
  td.stage{color:var(--ink);}
  tr.leg-n td:first-child{box-shadow:inset 3px 0 0 var(--red);}
  tr.leg-s td:first-child{box-shadow:inset 3px 0 0 var(--green);}
  tr.leg-y td:first-child{box-shadow:inset 3px 0 0 var(--line-2);}
  tfoot td{padding:11px 12px;border-top:2px solid var(--ink);color:var(--ink);font-weight:600;background:var(--sunk);}

  .book{display:flex;flex-direction:column;gap:0;}
  .day{display:grid;grid-template-columns:62px minmax(0,1fr);gap:0;position:relative;}
  .rail{position:relative;}
  .rail::before{content:"";position:absolute;left:19px;top:0;bottom:0;width:2px;background:var(--line-2);}
  .day:first-child .rail::before{top:26px;}
  .day:last-child .rail::before{bottom:auto;height:26px;}
  .pin{position:absolute;left:8px;top:16px;width:24px;height:24px;border-radius:50%;
       display:grid;place-items:center;font-family:var(--mono);font-size:11px;font-weight:700;
       color:var(--paper);background:var(--red);z-index:1;}
  .day.s .pin{background:var(--green);}
  .day.z .pin{background:var(--ink);}
  .day.own .pin{background:var(--paper);color:var(--mute);border:2px solid var(--line-2);}
  .card{padding:14px 0 30px 4px;}

  .dline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
  .date{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--red);}
  .day.s .date{color:var(--green);}
  .day.z .date,.day.own .date{color:var(--mute);}
  .yours{font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
         color:var(--mute);border:1px solid var(--line-2);padding:2px 7px;}
  .dist{font-family:var(--mono);font-size:11px;letter-spacing:.08em;color:var(--mute);margin-left:auto;
        font-variant-numeric:tabular-nums;}
  .day h3{font-size:24px;line-height:1.1;margin:5px 0 9px;}
  .card p{margin-bottom:9px;max-width:68ch;}
  .card p:last-of-type{margin-bottom:0;}
  .card ul{margin:0 0 9px;padding-left:17px;max-width:68ch;}
  .card li{margin-bottom:5px;}

  .note{display:block;border-left:3px solid;padding:9px 13px;margin:11px 0;max-width:70ch;font-size:14.5px;}
  .note b.lbl{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
              text-transform:uppercase;margin-bottom:4px;font-weight:400;}
  .odd{border-color:var(--sand);background:var(--sand-w);}
  .odd b.lbl{color:var(--sand);}
  .warn{border-color:var(--red);background:var(--red-w);}
  .warn b.lbl{color:var(--red);}
  .good{border-color:var(--green);background:var(--green-w);}
  .good b.lbl{color:var(--green);}

  .bed{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:13px;
       padding:9px 12px;background:var(--sunk);border:1px solid var(--line);font-size:14px;}
  .bed .k{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);}
  .bed .v{color:var(--ink);}
  .chip{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
        padding:3px 8px;border:1px solid var(--line-2);color:var(--mute);white-space:nowrap;}
  .chip.free{color:var(--green);border-color:var(--green);}
  .chip.full{color:var(--blue);border-color:var(--blue);}
  .chip.dry{color:var(--sand);border-color:var(--sand);}
  .bed .price{margin-left:auto;font-family:var(--mono);font-size:13px;color:var(--ink);
              font-variant-numeric:tabular-nums;}

  .alert{border:2px solid var(--red);background:var(--panel);padding:22px 24px;
         display:flex;flex-direction:column;gap:12px;}
  .alert h3{color:var(--red);font-size:22px;}
  .alert .big{font-family:var(--display);font-size:clamp(30px,5vw,44px);line-height:1;color:var(--ink);
              font-variant-numeric:tabular-nums;}

  .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:16px;}
  .box{border:1px solid var(--line);background:var(--panel);padding:17px 19px;
       display:flex;flex-direction:column;gap:9px;}
  .box h4{font-size:17px;}
  .box .n{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);}
  .box ul{margin:0;padding-left:16px;font-size:14.5px;}
  .box li{margin-bottom:5px;}
  .box p{font-size:14.5px;}

  /* la route du boeuf — 4 mouvements */
  .beef{display:flex;flex-direction:column;gap:0;}
  .mv{display:grid;grid-template-columns:96px minmax(0,1fr);gap:20px;padding:22px 0;
      border-bottom:1px solid var(--line);}
  .beef .mv:last-child{border-bottom:0;}
  .mv .stage2{font-family:var(--display);font-size:15px;text-transform:uppercase;color:var(--red);
              line-height:1.15;letter-spacing:.02em;border-top:3px solid var(--red);padding-top:7px;}
  .mv h4{font-size:20px;margin-bottom:7px;}
  .mv p{font-size:14.8px;margin-bottom:8px;max-width:66ch;}
  .mv p:last-child{margin-bottom:0;}

  .task{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 15px;align-items:start;
        padding:13px 0;border-bottom:1px solid var(--line);}
  .task:last-child{border-bottom:0;}
  .task .idx{font-family:var(--mono);font-size:12px;color:var(--mute);padding-top:2px;
             font-variant-numeric:tabular-nums;}
  .task .t{color:var(--ink);font-weight:600;}
  .task .s{grid-column:2;font-size:14.5px;}
  .task .w{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
           padding:3px 9px;border:1px solid;white-space:nowrap;}
  .w.now{color:var(--red);border-color:var(--red);}
  .w.soon{color:var(--sand);border-color:var(--sand);}
  .w.ok{color:var(--mute);border-color:var(--line-2);}

  .lnk{display:flex;flex-direction:column;gap:0;}
  .lnk a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 12px;padding:10px 0;
         border:0;border-bottom:1px solid var(--line);text-decoration:none;
         color:var(--body);align-items:baseline;}
  .lnk a:last-child{border-bottom:0;}
  .lnk a b{font-size:14.5px;font-weight:600;color:var(--ink);}
  .lnk a:hover b{color:var(--blue);}
  .lnk a em{grid-column:1;font-style:normal;font-size:13.2px;color:var(--mute);line-height:1.45;}
  .lnk a i{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;
           color:var(--mute);white-space:nowrap;font-style:normal;}
  .lnk a:hover i{color:var(--blue);}

  .moments{display:grid;grid-template-columns:repeat(auto-fit,minmax(298px,1fr));gap:0;
           border-top:1px solid var(--line);border-left:1px solid var(--line);}
  .moment{border-right:1px solid var(--line);border-bottom:1px solid var(--line);
          padding:19px 21px;display:flex;flex-direction:column;gap:7px;background:var(--panel);}
  .moment .j{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
             text-transform:uppercase;color:var(--red);}
  .moment.s .j{color:var(--green);}
  .moment h4{font-size:19px;line-height:1.08;}
  .moment p{font-size:14.3px;}
  .moment .where{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--mute);
                 text-transform:uppercase;margin-top:auto;padding-top:6px;}

  .gmap{font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
        color:var(--blue);border:1px solid var(--line-2);padding:3px 9px;white-space:nowrap;
        text-decoration:none;}
  .gmap:hover{border-color:var(--blue);background:var(--panel);color:var(--blue);}
  .dline .gmap{margin-left:10px;}

  .node{cursor:pointer;}
  .node text{fill:var(--ink);}
  .node .hit{fill:transparent;}
  .node:hover text{fill:var(--blue);}
  .node:hover .dot{stroke:var(--blue);stroke-width:3;}
  .node:focus-visible .dot{stroke:var(--blue);stroke-width:3;}

  .seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;}
  .segbtn{display:flex;flex-direction:column;gap:5px;padding:14px 16px;border:1px solid var(--line);
          background:var(--panel);text-decoration:none;border-left:3px solid var(--red);}
  .segbtn:hover{border-color:var(--line-2);background:var(--sunk);}
  .segbtn.s{border-left-color:var(--green);}
  .segbtn b{font-family:var(--display);font-size:18px;text-transform:uppercase;color:var(--ink);font-weight:700;}
  .segbtn span{font-size:13.5px;color:var(--body);}
  .segbtn em{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
             color:var(--mute);font-style:normal;}

  .steps{counter-reset:st;display:flex;flex-direction:column;gap:0;}
  .step{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;padding:11px 0;
        border-bottom:1px solid var(--line);align-items:baseline;}
  .step:last-child{border-bottom:0;}
  .step::before{counter-increment:st;content:counter(st);font-family:var(--mono);font-size:11px;
                color:var(--paper);background:var(--ink);width:20px;height:20px;border-radius:50%;
                display:grid;place-items:center;}

  footer{margin-top:70px;padding-top:22px;border-top:3px solid var(--ink);
         font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);
         display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}

  @media (max-width:620px){
    .mast{padding-top:34px;}
    .day{grid-template-columns:40px minmax(0,1fr);}
    .rail::before{left:12px;}
    .pin{left:1px;}
    .dist{margin-left:0;width:100%;}
    .bed .price{margin-left:0;}
    .stat{flex:1 1 46%;border-bottom:1px solid var(--line);}
    .mv{grid-template-columns:1fr;gap:10px;}
  }
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}

/* ============ reset ============ */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;}
img,svg,video{display:block;max-width:100%;}
button{font:inherit;color:inherit;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

/* ============ navigation ============ */
.topbar{position:sticky;top:0;z-index:60;background:var(--paper);border-bottom:1px solid var(--line-2);}
.topin{max-width:var(--w);margin:0 auto;padding:0 22px;display:flex;align-items:center;gap:8px;min-height:56px;}
.brand{font-family:var(--display);font-size:19px;text-transform:uppercase;color:var(--ink);
       font-weight:700;letter-spacing:.02em;text-decoration:none;border:0;white-space:nowrap;}
.brand span{color:var(--red);}
.nav{display:flex;gap:2px;margin-left:auto;flex-wrap:wrap;align-items:center;}
.nav a{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
       color:var(--mute);padding:7px 11px;border:0;text-decoration:none;white-space:nowrap;}
.nav a:hover{color:var(--ink);background:var(--sunk);}
.nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--red);}
.themebtn{width:32px;height:32px;border:1px solid var(--line-2);background:var(--panel);color:var(--body);
          cursor:pointer;border-radius:50%;display:grid;place-items:center;font-size:13px;line-height:1;
          padding:0;margin-left:6px;flex:none;}
.themebtn:hover{border-color:var(--blue);color:var(--blue);}
@media print{.topbar,.themebtn{display:none;}}
@media (max-width:700px){
  .topin{flex-wrap:wrap;padding:8px 16px;min-height:0;}
  .nav{margin-left:0;width:100%;order:3;border-top:1px solid var(--line);padding-top:4px;}
  .nav a{padding:7px 9px;font-size:10px;}
  .themebtn{margin-left:auto;}
}

/* ============ carte + panneau de detail ============ */
.mapshell{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:0;
          border:1px solid var(--line);background:var(--panel);}
.mapcol{display:flex;flex-direction:column;min-width:0;border-right:1px solid var(--line);}
#map{height:min(70vh,600px);width:100%;background:var(--sunk);z-index:1;flex:1;}
.mapbar{display:flex;flex-wrap:wrap;gap:7px;padding:11px 13px;border-top:1px solid var(--line);align-items:center;}
.mf{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;
    letter-spacing:.11em;text-transform:uppercase;color:var(--mute);background:transparent;
    border:1px solid var(--line-2);padding:5px 10px;cursor:pointer;}
.mf i{width:9px;height:9px;border-radius:50%;background:var(--c);flex:none;opacity:.28;}
.mf span{font-variant-numeric:tabular-nums;opacity:.7;}
.mf.on{color:var(--ink);border-color:var(--c);}
.mf.on i{opacity:1;}
.mf:hover{border-color:var(--c);}
.maphint{font-family:var(--mono);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
         color:var(--mute);margin-left:auto;}

.mapdetail{min-width:0;overflow-y:auto;max-height:min(70vh,600px);display:flex;flex-direction:column;}
.dhint{padding:22px 20px;font-size:14px;color:var(--mute);line-height:1.6;}
.dhint strong{color:var(--ink);}
.dphoto{position:relative;background:var(--sunk);}
.dphoto img{width:100%;height:190px;object-fit:cover;}
.dcredit{position:absolute;right:0;bottom:0;background:rgba(0,0,0,.62);color:#fff;
         font-family:var(--mono);font-size:8.5px;letter-spacing:.08em;padding:3px 7px;
         max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dnophoto{height:6px;background:var(--sunk);}
.dbody{padding:16px 20px 20px;display:flex;flex-direction:column;gap:9px;}
.dmeta{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.dchip{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
       color:var(--c);border:1px solid var(--c);padding:3px 8px;}
.dday{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);}
.mapdetail h3{font-size:23px;line-height:1.06;}
.dadr{font-size:12.5px;color:var(--mute);font-family:var(--mono);line-height:1.45;}
.dnote{font-size:14.5px;}
.dlinks{display:flex;gap:8px;flex-wrap:wrap;margin-top:3px;}
.dlinks a{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
          color:var(--blue);border:1px solid var(--line-2);padding:6px 11px;text-decoration:none;}
.dlinks a:hover{border-color:var(--blue);background:var(--sunk);}

@media (max-width:900px){
  .mapshell{grid-template-columns:1fr;}
  .mapcol{border-right:0;border-bottom:1px solid var(--line);}
  #map{height:56vh;}
  .mapdetail{max-height:none;}
  .dphoto img{height:170px;}
}

/* boutons de journee dans le roadbook */
.daybtn{font-family:var(--mono);font-size:9px;letter-spacing:.13em;text-transform:uppercase;
        color:var(--mute);background:transparent;border:1px solid var(--line-2);padding:3px 9px;
        cursor:pointer;margin-left:10px;white-space:nowrap;}
.daybtn:hover{border-color:var(--blue);color:var(--blue);}
.daybtn.on{border-color:var(--red);color:var(--red);}

/* habillage Leaflet aux couleurs du site */
.leaflet-tooltip{background:var(--panel);color:var(--ink);border:1px solid var(--line-2);
                 border-radius:0;box-shadow:none;font-family:var(--mono);font-size:10px;
                 letter-spacing:.08em;text-transform:uppercase;padding:3px 7px;}
.leaflet-tooltip-top:before{border-top-color:var(--line-2);}
.leaflet-bar a{background:var(--panel);color:var(--ink);border-bottom-color:var(--line);}
.leaflet-bar a:hover{background:var(--sunk);color:var(--ink);}
.leaflet-control-attribution{background:var(--panel)!important;color:var(--mute)!important;font-size:10px!important;}
.leaflet-control-attribution a{color:var(--mute)!important;}

/* ============ liens bas de page ============ */
.pagenav{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:56px;}
.pn2{border:1px solid var(--line);background:var(--panel);padding:15px 17px;text-decoration:none;
     display:flex;flex-direction:column;gap:4px;border-left:3px solid var(--line-2);}
.pn2:hover{border-left-color:var(--red);background:var(--sunk);}
.pn2 em{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
        color:var(--mute);font-style:normal;}
.pn2 b{font-family:var(--display);font-size:18px;text-transform:uppercase;color:var(--ink);font-weight:700;}