/* /brasil/ (26-10): deel reis, de tocht dag voor dag. Alleen opacity en transform bewegen; elk vak houdt zijn maat. */
/* stijl.css zet op een telefoon overflow-x:hidden op html en body; dat maakt body een schuifvak en breekt position:sticky (kaart en kop).
   clip knipt zonder schuifvak, zoals artikel.css doet. */
html:has(.rs),body:has(.rs){overflow-x:clip}
.rs{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r);padding:14px;display:flex;flex-direction:column;gap:12px;min-width:0}
.rs-kop{display:flex;gap:12px;align-items:flex-start}
.rs-plaat{flex:none;width:88px;height:auto;aspect-ratio:900/878;border-radius:12px;background:var(--lijn-2);display:block}
.rs-titelrij{flex:1;min-width:0;display:flex;align-items:flex-start;gap:8px}
.rs-vandaag{margin-left:auto;min-height:44px;padding:0 14px;border:1px solid var(--lijn);border-radius:var(--r-pil);background:var(--papier);color:var(--inkt);font:700 13px/1 var(--tekst);cursor:pointer;white-space:nowrap}
.rs-vandaag[hidden]{display:none}
.rs-vandaag:hover{border-color:var(--inkt)}
.rs-vandaag:focus-visible{outline:2px solid var(--inkt);outline-offset:2px}
.rs-titelrij .br-ib{margin-left:0}
.rs-titelrij h2+.br-ib{margin-left:auto}
.rs-h{font-size:18px;margin:1.5px 0 0;min-height:22px;white-space:nowrap}   /* 1,5 px: de kop van de andere kaarten staat in een rij van 30 px */
.rs-h small{display:block;font-size:12.5px;line-height:1.3;font-weight:600;color:var(--zacht);margin-top:2px}
/* Op een telefoon is er naast de plaat te weinig breedte voor titel, knop en (i) op een regel: de knop zakt naar een eigen regel (29-10). */
@media(max-width:599.98px){ .rs-titelrij{flex-wrap:wrap;row-gap:6px} .rs-titelrij .br-ib{order:2;margin-left:auto} .rs-vandaag{order:3;margin-left:0} }


.rs-bord{display:flex;flex-direction:column;gap:12px;min-width:0}
.rs-kaartvak{position:sticky;top:calc(var(--rs-top,0px) + 6px);z-index:6;border-radius:12px;overflow:hidden;border:1px solid var(--lijn);box-shadow:var(--schaduw);background:var(--lijn-2);height:190px}
.rs-kaart{width:100%;height:100%}
.rs-balk{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);z-index:1000;display:flex;align-items:center;background:rgba(255,255,255,.94);border:1px solid var(--lijn);border-radius:var(--r-pil);box-shadow:var(--schaduw);backdrop-filter:blur(6px)}
.rs-balk-t{min-width:138px;text-align:center;font-size:13px;font-weight:800;white-space:nowrap;padding:0 2px}
.rs-pijl{width:44px;height:44px;border:0;background:transparent;color:var(--inkt);font:800 26px/1 var(--tekst);padding:0 0 3px;cursor:pointer;border-radius:50%}
.rs-pijl:hover:not(:disabled){background:var(--lijn-2)}
.rs-pijl:disabled{color:var(--lijn);cursor:default}
.rs-pijl:focus-visible{outline:2px solid var(--inkt);outline-offset:-2px}
.rs-kaart .leaflet-top.leaflet-right{margin:10px 10px 0 0}
.rs-kaart .leaflet-bar{border:1px solid var(--lijn);border-radius:14px;box-shadow:var(--schaduw);background:rgba(255,255,255,.94);overflow:hidden}
.rs-kaart .leaflet-bar a,.rs-kaart .leaflet-touch .leaflet-bar a{width:44px;height:44px;line-height:42px;font:800 22px/42px var(--tekst);color:var(--inkt);background:transparent;border:0;border-radius:0;text-indent:0}
.rs-kaart .leaflet-bar a+a{border-top:1px solid var(--lijn)}
.rs-kaart .leaflet-bar a:hover{background:var(--lijn-2);color:var(--inkt)}
.rs-kaart .leaflet-bar a.leaflet-disabled{color:var(--lijn);background:transparent}
.rs-kaart .leaflet-bar a:focus-visible{outline:2px solid var(--inkt);outline-offset:-2px}
.rs-kaart.klein .rs-km{display:none}
.rs-km span{display:block;transform:translate(-50%,-50%);white-space:nowrap;font:700 11px/1 var(--tekst);color:var(--inkt);background:rgba(255,255,255,.92);border:1px solid var(--lijn);border-radius:var(--r-pil);padding:3px 7px}
.rs-bord.zonder .rs-kaartvak{display:none}
.rs-lijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;min-width:0}

.rs-dag{position:relative;scroll-margin-top:12px;display:grid;grid-template-columns:64px 32px minmax(0,1fr);column-gap:10px;padding:12px 0;border-top:1px solid var(--lijn-2);cursor:pointer;
  opacity:0;transform:translateY(8px);transition:opacity .45s ease,transform .45s ease}
.rs-dag.in{opacity:1;transform:none}
.rs-dag:first-child{border-top:0}
.rs-dat{display:flex;flex-direction:column;font-size:13px;line-height:1.25;padding-top:4px}
.rs-dat b{font-weight:800}
.rs-dat small{color:var(--zacht);font-size:11px}
.rs-nr{width:32px;height:32px;border-radius:50%;border:0;padding:0;background:var(--inkt);color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center}
.rs-nr::after{content:"";position:absolute;inset:-6px -6px -6px -6px}
.rs-nr i{font-style:normal}
.rs-nr:focus-visible{outline:2px solid var(--inkt);outline-offset:3px}
.rs-dag.voorbij{color:var(--zacht)}
.rs-dag.voorbij .rs-nr{background:var(--weinig)}
.rs-dag.vandaag .rs-nr{background:var(--br-geel);color:var(--inkt);box-shadow:0 0 0 3px var(--br-groen)}
.rs-dag.gekozen:not(.vandaag) .rs-nr{box-shadow:0 0 0 2px var(--inkt),0 0 0 4px var(--papier)}
.rs-dag.vertrek .rs-nr{background:transparent;color:var(--inkt);border:2px solid var(--inkt)}
.rs-tekst{min-width:0;display:flex;flex-direction:column;gap:3px}
.rs-plek{display:flex;align-items:center;gap:8px;min-height:24px}
.rs-plek b{font-family:var(--kop);font-size:16px}
.rs-hier{display:none;font-size:11px;font-weight:800;padding:2px 8px;border-radius:var(--r-pil);background:var(--br-geel);color:var(--br-blauw);box-shadow:inset 0 -2px 0 var(--br-groen);white-space:nowrap}
.rs-dag.vandaag .rs-hier{display:inline-block}
.rs-rol{font-size:12.5px;color:var(--zacht);font-weight:600}
.rs-bul{margin:4px 0 0;padding-left:16px;font-size:13.5px;line-height:1.4;display:flex;flex-direction:column;gap:2px}
.rs-wind{margin-top:6px;min-height:26px;box-sizing:border-box;line-height:20px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;align-self:flex-start;max-width:100%;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;padding:3px 8px;border-radius:var(--r-pil);background:var(--weinig-v);color:var(--weinig-t)}
.rs-wind[data-niveau=ok]{background:var(--perfect-v);color:var(--perfect-t)}
.rs-wind[data-niveau=mid]{background:var(--matig-v);color:var(--matig-t)}
.rs-wind[data-niveau=hard],.rs-wind[data-niveau=off]{background:var(--aflandig-v);color:var(--aflandig-t)}
.rs-wind[data-niveau=leeg]{font-weight:500}
.rs-fest{margin-top:8px;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:12px;background:var(--br-blauw);color:#fff;font-size:13px}
.rs-fest b{font-family:var(--kop);font-size:15px}
.rs-fest em{font-style:normal;opacity:.85}
.rs-fest a{color:var(--br-geel);font-weight:700;display:inline-flex;align-items:center;min-height:44px;align-self:flex-start}
.rs-fest a:focus-visible{outline:2px solid var(--br-geel);outline-offset:2px}

/* kaartspelden */
.rs-pin i{display:flex;width:30px;height:30px;border-radius:50%;background:var(--inkt);color:#fff;border:2px solid #fff;font:800 13px/1 var(--tekst);font-style:normal;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.35);transition:transform .3s,background .3s;cursor:pointer;box-sizing:border-box}
.rs-pin i{position:relative}
.rs-pin.aan i{background:var(--br-geel);color:var(--inkt);transform:scale(1.2)}
.rs-pin.aan i::before{content:"";position:absolute;inset:-2px;border-radius:50%;border:2px solid var(--br-geel);animation:rs-puls 2s ease-out infinite;pointer-events:none}
@keyframes rs-puls{from{transform:scale(1);opacity:.9}to{transform:scale(2.1);opacity:0}}
.rs-pin::after{content:"";position:absolute;left:-7px;top:-7px;width:44px;height:44px}

@media(min-width:1000px){
  .rs-plaat{width:112px}
  .rs-bord{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
  .rs-kaartvak{top:24px;height:min(560px,calc(100vh - 48px))}
}
@media(prefers-reduced-motion:reduce){
  .rs-dag{opacity:1;transform:none;transition:none}
  .rs-pin i{transition:none}
  .rs-pin.aan i::before{animation:none;display:none}
}