/* Benchmark-dashboard /rekenstraat, v2 24-10-2026. Bron: ontwerp/rekenstraat-benchmark (buiten git). Kleur- en lettertokens staan op .urmb zodat ze niet botsen met de sitetokens. */
.urmb{
  --ground:#FBFAF6; --zand:#F1ECDE; --lijn:#E6E1D5; --ink:#1B2430; --muted:#6E6A5E;
  --groen:#1F4E4A; --groen-sterk:#163B38; --groen-tint:#E4EEEB;
  --oker:#B07D2B; --oker-tekst:#8A5D13; --oker-tint:#F1E7D2;
  --rood:#9B2C2C; --rood-tint:#F5E3E3; --wit:#FFFFFF;
  --f-kop:"Space Grotesk","Inter",system-ui,sans-serif;
  --f-tekst:"Inter",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ===== component ===== */
.urmb{container-type:inline-size;container-name:urmb;position:relative}
.urmb button{font:inherit;color:inherit}
.urmb :focus-visible{outline:2px solid var(--oker);outline-offset:2px;border-radius:6px}
.urmb .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.urmb-eyebrow{font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--groen);margin:0 0 10px}
.urmb h2{font-family:var(--f-kop);font-weight:600;font-size:clamp(26px,3.4vw,36px);line-height:1.12;letter-spacing:-.015em;margin:0 0 12px;text-wrap:balance}
.urmb-lead{color:var(--muted);max-width:820px;margin:0 0 26px;font-size:16.5px}

/* kaarten */
.urmb-kaarten{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
@container urmb (max-width:980px){.urmb-kaarten{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container urmb (max-width:560px){.urmb-kaarten{grid-template-columns:1fr}}
.urmb-kaart{display:flex;flex-direction:column;gap:8px;width:100%;height:100%;text-align:left;background:var(--wit);border:1px solid var(--lijn);border-radius:14px;padding:16px 16px 14px;cursor:pointer;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.urmb-kaart:hover{border-color:var(--groen)}
.urmb-kaart[aria-current="true"]{border-color:var(--groen);box-shadow:inset 0 0 0 1px var(--groen)}
.urmb-kaart .k-nr{font-family:var(--f-mono);font-size:11px;color:var(--muted);letter-spacing:.06em}
.urmb-kaart .k-titel{font-family:var(--f-kop);font-weight:600;font-size:16.5px;line-height:1.25}
.urmb-kaart .k-getal{font-family:var(--f-mono);font-weight:600;font-size:21px;line-height:1.2;color:var(--groen-sterk);letter-spacing:-.01em}
.urmb-kaart .k-sub{font-size:13px;color:var(--muted);line-height:1.45}
.urmb-kaart .k-voet{margin-top:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.urmb-status{font-family:var(--f-mono);font-size:11px;line-height:1.35;padding:4px 8px;border-radius:6px;display:inline-block}
.st-groen{background:var(--groen-tint);color:var(--groen-sterk)}
.st-oker{background:var(--oker-tint);color:var(--oker-tekst)}
.st-grijs{background:var(--zand);color:var(--muted)}
.st-rood{background:var(--rood-tint);color:var(--rood)}
.k-mini{display:flex;gap:4px;align-items:center}
.k-mini i{display:block;width:9px;height:9px;border-radius:50%;background:var(--groen)}
.k-mini i.r{background:var(--rood)}
.urmb-grens{margin:14px 0 22px;padding:11px 14px;border-left:3px solid var(--oker);background:var(--oker-tint);font-size:14px;color:var(--ink);border-radius:0 8px 8px 0}

/* filters */
.urmb-filters{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:flex-end;padding:14px 0 6px;border-top:1px solid var(--lijn)}
.urmb-fgroep{border:0;margin:0;padding:0;min-width:0}
.urmb-fgroep legend{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0;margin-bottom:5px}
.urmb-seg{display:flex;flex-wrap:wrap;gap:4px}
.urmb-seg button{font-size:13px;padding:6px 11px;border-radius:999px;border:1px solid var(--lijn);background:var(--wit);cursor:pointer;line-height:1.2}
.urmb-seg button[aria-pressed="true"]{background:var(--groen);border-color:var(--groen);color:var(--wit)}
.urmb-seg button[aria-disabled="true"]{background:transparent;border-style:dashed;color:var(--muted);cursor:not-allowed}
.urmb-seg button[aria-disabled="true"][aria-pressed="true"]{background:transparent;color:var(--muted);border-color:var(--muted)}
.urmb-fuitleg{min-height:22px;font-size:13px;color:var(--oker-tekst);margin:4px 0 0}
.urmb-legenda{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--muted);margin:6px 0 14px}
.urmb-legenda span{display:inline-flex;align-items:center;gap:6px}
.urmb-legenda i{width:10px;height:10px;border-radius:3px;display:inline-block}

/* podium */
.urmb-podium{background:var(--wit);border:1px solid var(--lijn);border-radius:16px;padding:20px 22px 16px}
@container urmb (max-width:560px){.urmb-podium{padding:16px 14px 14px}}
.urmb-scenekop{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:4px}
.urmb-scenenr{font-family:var(--f-mono);font-size:12px;color:var(--oker-tekst);font-weight:600}
.urmb-scenekop h3{font-family:var(--f-kop);font-weight:600;font-size:clamp(19px,2.2vw,24px);line-height:1.2;margin:0;letter-spacing:-.01em}
.urmb-scenekop h3:focus{outline:none}
.urmb-subkop{font-size:14px;color:var(--muted);margin:0 0 14px}
.urmb-visual{min-height:260px;position:relative}
.urmb-conclusie{font-family:var(--f-kop);font-size:clamp(16px,1.7vw,19px);font-weight:500;line-height:1.35;color:var(--groen-sterk);margin:16px 0 8px;max-width:860px;opacity:0;transform:translateY(6px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.urmb-conclusie.on{opacity:1;transform:none}
.urmb-bronregel{font-family:var(--f-mono);font-size:11.5px;color:var(--muted);line-height:1.5;margin:0;padding-top:10px;border-top:1px solid var(--lijn)}
.urmb-acties{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.urmb-knop{font-size:13.5px;padding:7px 14px;border-radius:999px;border:1px solid var(--groen);background:var(--wit);color:var(--groen);cursor:pointer;font-weight:500}
.urmb-knop[aria-expanded="true"]{background:var(--groen-tint)}
.urmb-knop.vol{background:var(--groen);color:var(--wit)}
.urmb-lade{margin-top:12px;background:var(--zand);border-radius:12px;padding:14px 16px}
.urmb-lade dl{display:grid;grid-template-columns:140px 1fr;gap:6px 14px;margin:0;font-size:14px}
@container urmb (max-width:560px){.urmb-lade dl{grid-template-columns:1fr;gap:2px}.urmb-lade dd{margin-bottom:8px}}
.urmb-lade dt{font-family:var(--f-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding-top:2px}
.urmb-lade dd{margin:0}
.urmb-lade h4{font-family:var(--f-kop);font-size:15px;margin:14px 0 6px}
.urmb-lade h4:first-child{margin-top:0}
.urmb-tabelwrap{margin-top:12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.urmb-tabelwrap table{border-collapse:collapse;font-size:13.5px;min-width:100%}
.urmb-tabelwrap caption{text-align:left;font-weight:600;font-size:13.5px;padding-bottom:6px}
.urmb-tabelwrap th,.urmb-tabelwrap td{text-align:left;padding:7px 12px 7px 0;border-bottom:1px solid var(--lijn);vertical-align:top}
.urmb-tabelwrap th{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
.urmb-tabelwrap td.num{font-family:var(--f-mono);white-space:nowrap}

/* bediening */
.urmb-bediening{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.urmb-ctrl{display:flex;gap:6px}
.urmb-ctrl button{border:1px solid var(--lijn);background:var(--wit);border-radius:999px;height:38px;min-width:38px;padding:0 12px;cursor:pointer;font-size:13.5px;display:inline-flex;align-items:center;gap:6px}
.urmb-ctrl .urmb-play{background:var(--groen);color:var(--wit);border-color:var(--groen);font-weight:500}
.urmb-ctrl svg{width:14px;height:14px}
.urmb-stappen{display:flex;gap:4px;list-style:none;margin:0;padding:0;flex:1;min-width:240px}
.urmb-stappen li{flex:1;min-width:0}
.urmb-stappen button{width:100%;border:0;background:none;padding:4px 0;cursor:pointer;text-align:left}
.urmb-stappen .bar{display:block;height:4px;border-radius:2px;background:var(--lijn);overflow:hidden}
.urmb-stappen .bar i{display:block;height:100%;width:0;background:var(--groen)}
.urmb-stappen .lab{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:4px}
.urmb-stappen button[aria-current="step"] .lab{color:var(--ink);font-weight:600}
.urmb-stappen button.klaar .bar i{width:100%}
.urmb-stappen button[aria-current="step"].vast .bar i{width:100%}
.urmb-stappen button[aria-current="step"].loopt .bar i{animation:urmb-voortgang var(--dur,8s) linear forwards}
.urmb-stappen.pauze button .bar i{animation-play-state:paused!important}
@keyframes urmb-voortgang{from{width:0}to{width:100%}}
@container urmb (max-width:640px){.urmb-stappen .lab{display:none}.urmb-stappen{order:3;flex-basis:100%}}

/* tooltip */
.urmb-tip{position:absolute;z-index:20;max-width:270px;background:var(--ink);color:var(--wit);font-size:12.5px;line-height:1.45;padding:8px 10px;border-radius:8px;pointer-events:none;box-shadow:0 4px 16px rgba(27,36,48,.18)}
.urmb-tip b{font-family:var(--f-mono);font-weight:600}

/* animatie-basis */
.a{opacity:0;transform:translateY(6px);transition:opacity .55s var(--ease),transform .55s var(--ease)}
.in .a,.a.on{opacity:1;transform:none}
.urmb-stil *,.urmb-stil *::before,.urmb-stil *::after{transition:none!important;animation:none!important}
@media (prefers-reduced-motion:reduce){.urmb *,.urmb *::before,.urmb *::after{transition:none!important;animation:none!important}}

/* panelen algemeen */
.urmb-paneel{display:grid;gap:18px}
.urmb-paneel.twee{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
@container urmb (max-width:860px){.urmb-paneel.twee{grid-template-columns:1fr}}
.urmb-ptitel{font-size:13.5px;font-weight:600;margin:0 0 2px}
.urmb-psub{font-size:12.5px;color:var(--muted);margin:0 0 8px}
.urmb svg text{font-family:var(--f-tekst)}
.urmb svg .mono{font-family:var(--f-mono)}

/* scene 1 proces */
.p-keten{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:0;position:relative}
.p-keten li{position:relative;padding:0 6px;text-align:center}
.p-keten li::before{content:"";position:absolute;top:15px;left:0;right:0;height:2px;background:var(--lijn)}
.p-keten li:first-child::before{left:50%}
.p-keten li:last-child::before{right:50%}
.p-lamp{position:relative;z-index:1;width:32px;height:32px;margin:0 auto 10px;border-radius:50%;background:var(--wit);border:2px solid var(--lijn);display:grid;place-items:center;font-family:var(--f-mono);font-size:12px;color:var(--muted);transition:background .5s var(--ease),border-color .5s var(--ease),color .5s var(--ease),transform .5s var(--ease)}
.p-keten li.on .p-lamp{background:var(--groen);border-color:var(--groen);color:var(--wit)}
.p-keten li.poort .p-lamp{border-radius:6px;transform:rotate(45deg) scale(.86)}
.p-keten li.poort .p-lamp span{transform:rotate(-45deg)}
.p-keten li.poort.on .p-lamp{background:var(--wit);border-color:var(--oker);color:var(--oker-tekst)}
.p-keten li.poort.uitv.on .p-lamp{border-color:var(--ink);color:var(--ink)}
.p-naam{font-weight:600;font-size:13.5px;line-height:1.25;display:block}
.p-uitleg{font-size:12px;color:var(--muted);line-height:1.35;display:block;margin-top:3px}
.p-wie{font-family:var(--f-mono);font-size:10.5px;margin-top:6px;display:inline-block;padding:2px 6px;border-radius:5px}
.p-eig{display:grid;grid-template-columns:7fr 1fr 1fr;margin-top:18px;gap:6px}
.p-eig div{border-top:3px solid var(--groen);padding-top:6px;font-size:12.5px;color:var(--muted)}
.p-eig div:nth-child(2){border-color:var(--oker)}
.p-eig div:nth-child(3){border-color:var(--ink)}
.p-eig b{color:var(--ink);font-weight:600;display:block;font-size:13px}
@container urmb (max-width:860px){
  .p-keten{grid-template-columns:1fr;gap:0}
  .p-keten li{display:grid;grid-template-columns:40px 1fr;text-align:left;padding:0 0 12px;column-gap:10px}
  .p-keten li::before{top:0;bottom:0;left:15px;right:auto;width:2px;height:auto}
  .p-keten li:first-child::before{top:16px;left:15px}
  .p-keten li:last-child::before{bottom:auto;height:16px;right:auto}
  .p-lamp{margin:0}
  .p-eig{display:none}
}

/* scene 2/3 svg */
.s-dot{transition:transform .6s var(--ease),opacity .35s var(--ease);opacity:0}
.s-dot.on{opacity:1;transform:none!important}
.s-draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.4s var(--ease)}
.s-draw.on{stroke-dashoffset:0}
.s-bar{transform-box:fill-box;transform:scaleX(0);transition:transform .7s var(--ease)}
.s-bar.on{transform:scaleX(1)}
.s-fade{opacity:0;transition:opacity .5s var(--ease)}
.s-fade.on{opacity:1}
.f7{display:grid;grid-template-columns:62px 1fr 64px;gap:6px 10px;align-items:center;font-size:13px;margin-top:4px}
.f7 .trk{height:14px;position:relative}
.f7 .br{position:absolute;left:0;top:0;bottom:0;border-radius:3px;transform-origin:left;transform:scaleX(0);transition:transform .7s var(--ease)}
.f7 .br.on{transform:scaleX(1)}
.f7 .br.hol{background:var(--groen-tint);border:1.5px solid var(--groen-sterk)}
.f7 .br.vol{background:var(--groen)}
.f7 .v{font-family:var(--f-mono);font-size:12.5px}
.notitie{font-size:12.5px;color:var(--muted);margin:8px 0 0}
.lab-hyp{font-family:var(--f-mono);font-size:10.5px;background:var(--oker-tint);color:var(--oker-tekst);padding:2px 6px;border-radius:5px;margin-right:6px;white-space:nowrap}

/* scene 4 heatmap */
.h-wrap{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:22px;align-items:start}
@container urmb (max-width:760px){.h-wrap{grid-template-columns:1fr}}
.h-raster{display:grid;grid-template-columns:96px repeat(3,minmax(0,1fr));gap:6px;align-items:center;max-width:680px}
@container urmb (max-width:560px){.h-raster{grid-template-columns:62px repeat(3,minmax(0,1fr))}}
.h-kolkop,.h-rijkop{font-size:12px;color:var(--muted)}
.h-kolkop{text-align:center}
.h-tegel{display:grid;grid-template-columns:repeat(12,1fr);gap:2px;padding:5px;border:1px solid var(--lijn);border-radius:8px;background:var(--wit)}
.h-tegel span{aspect-ratio:1;border-radius:2px;background:var(--lijn);transition:background .25s linear}
.h-tegel span.ok{background:var(--groen)}
.h-kpi{display:grid;gap:10px}
.h-kpi div{border:1px solid var(--lijn);border-radius:10px;padding:10px 12px}
.h-kpi .l{font-size:12px;color:var(--muted);display:block}
.h-kpi .g{font-family:var(--f-mono);font-weight:600;font-size:24px;color:var(--groen-sterk);line-height:1.2}
.h-kpi .g.nul{color:var(--groen)}
.h-combos{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 0}
.h-combo{border:1px solid var(--lijn);background:var(--wit);border-radius:10px;padding:7px 11px;font-size:12.5px;cursor:pointer;text-align:left;line-height:1.35}
.h-combo b{font-family:var(--f-mono);font-weight:600}
.h-combo[aria-pressed="true"]{border-color:var(--groen);box-shadow:inset 0 0 0 1px var(--groen);background:var(--groen-tint)}
.h-combo.nietgemeten{border-style:dashed;color:var(--muted);cursor:default;background:transparent}

/* scene 5 checker */
.c-matrix{display:grid;grid-template-columns:150px repeat(3,minmax(0,1fr));gap:8px;align-items:stretch}
@container urmb (max-width:700px){.c-matrix{grid-template-columns:repeat(3,minmax(0,1fr))}.c-rijkop{grid-column:1/-1;padding:8px 0 0}.c-leeg{display:none}}
.c-kolkop{font-size:12.5px;color:var(--muted);text-align:center;align-self:end}
.c-rijkop{font-size:13px;font-weight:600;align-self:center;line-height:1.3}
.c-rijkop small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.c-tegel{border:1px solid var(--lijn);border-radius:10px;background:var(--wit);padding:10px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:7px;min-width:0}
.c-tegel[aria-pressed="true"]{border-color:var(--groen);box-shadow:inset 0 0 0 1px var(--groen)}
.c-tegel .naam{font-size:13px;font-weight:600;display:flex;align-items:center;gap:6px}
.c-tegel .rec{font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.c-checks{display:grid;grid-template-columns:repeat(8,1fr);gap:3px}
.c-checks i{display:block;aspect-ratio:1;border-radius:3px;background:var(--lijn);transition:background .3s var(--ease)}
.c-checks i.ok{background:var(--groen)}
.c-checks i.sig{background:var(--oker)}
.c-checks i.nvt{background:var(--wit);border:1.5px dashed var(--muted)}
.c-uitslag{font-family:var(--f-mono);font-size:11px;line-height:1.35;color:var(--groen-sterk);opacity:0;transition:opacity .5s var(--ease)}
.c-uitslag.on{opacity:1}
.c-uitslag em{font-style:normal;color:var(--oker-tekst)}
.c-detail{margin-top:14px;border-left:3px solid var(--groen);padding:4px 0 4px 14px;font-size:14px}
.c-detail ul{margin:6px 0 0;padding-left:18px}
.c-detail li{margin-bottom:3px}
.c-legenda{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--muted);margin-top:10px}
.c-legenda span{display:inline-flex;align-items:center;gap:5px}
.c-legenda i{width:10px;height:10px;border-radius:3px;display:inline-block}

/* scene 6 bandtoets */
.b-groep{margin-bottom:10px}
.b-gkop{font-size:13px;font-weight:600;margin:0 0 4px}
.b-rij{display:grid;grid-template-columns:118px minmax(0,1fr) 150px;gap:12px;align-items:center;padding:7px 0;border-bottom:1px solid var(--lijn)}
@container urmb (max-width:620px){.b-rij{grid-template-columns:1fr;gap:4px}.b-uit{text-align:left!important}}
.b-maat{font-size:13px}
.b-maat small{display:block;font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.b-rij.focus .b-maat{font-weight:600}
.b-trk{position:relative;height:30px}
.b-as{position:absolute;left:0;right:0;top:15px;height:1px;background:var(--lijn)}
.b-band{position:absolute;top:7px;height:16px;background:var(--groen-tint);border:1px solid var(--groen);border-radius:3px;opacity:.95}
.b-band .bl{position:absolute;top:-15px;left:0;font-family:var(--f-mono);font-size:10.5px;color:var(--groen-sterk);white-space:nowrap}
.b-dot{position:absolute;top:8px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--groen);border:2px solid var(--wit);box-shadow:0 0 0 1px var(--groen);left:0;transition:left .7s var(--ease),opacity .3s;opacity:0}
.b-dot.on{opacity:1}
.b-rij.buiten .b-dot{background:var(--rood);box-shadow:0 0 0 1px var(--rood)}
.b-tick{position:absolute;top:24px;font-family:var(--f-mono);font-size:10px;color:var(--muted);transform:translateX(-50%)}
.b-uit{text-align:right;font-size:12.5px}
.b-uit .w{font-family:var(--f-mono);font-weight:600;font-size:14px}
.b-uit .urmb-status{margin-left:6px}
.b-duiding{margin:10px 0 0;padding:10px 12px;background:var(--zand);border-left:3px solid var(--rood);border-radius:0 8px 8px 0;font-size:13.5px;color:var(--ink)}
.b-uitslag{display:flex;gap:6px;align-items:center;margin-top:12px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.b-uitslag i{width:12px;height:12px;border-radius:50%;display:inline-block;background:var(--lijn);transition:background .4s}
.b-uitslag i.g{background:var(--groen)}
.b-uitslag i.r{background:var(--rood)}

/* scene 7 rollen */
.r-banen{position:relative;border:1px solid var(--lijn);border-radius:12px;margin-top:28px}
.r-baan:first-child{border-radius:12px 12px 0 0}
.r-baan:last-child{border-radius:0 0 12px 12px}
.r-baan{position:relative;height:96px;border-bottom:1px solid var(--lijn);padding:12px 14px}
.r-baan:last-child{border-bottom:0}
.r-baan:nth-child(1){background:var(--groen-tint)}
.r-baan:nth-child(2){background:var(--oker-tint)}
.r-baan:nth-child(3){background:var(--zand)}
.r-baan .wie{font-weight:600;font-size:14px;display:block;max-width:34%;position:relative;z-index:2}
.r-baan .wat{font-size:12.5px;color:var(--muted);display:block;max-width:34%;line-height:1.4;position:relative;z-index:2}
@container urmb (max-width:700px){.r-baan{height:auto;min-height:118px;padding-bottom:40px}.r-baan .wie,.r-baan .wat{max-width:100%;width:fit-content;background:inherit}}
.r-poort{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed var(--muted)}
.r-poort .pl{position:absolute;top:-22px;transform:translateX(-50%);font-family:var(--f-mono);font-size:11px;white-space:nowrap;background:var(--wit);padding:1px 6px;border-radius:5px;border:1px solid var(--lijn);transition:border-color .4s,color .4s}
.r-poort.on{border-left-color:var(--oker)}
.r-poort.on .pl{border-color:var(--oker);color:var(--oker-tekst)}
.r-map{position:absolute;width:46px;height:36px;margin:-18px 0 0 -23px;transition:left 1.1s var(--ease),top 1.1s var(--ease);z-index:3}
.r-poortstatus{font-size:12.5px;color:var(--muted);margin-top:10px}
.r-poortstatus .urmb-status{margin-right:6px}
@container urmb (max-width:700px){.r-poort .pl{font-size:10px}.r-banen{margin-top:52px}.r-poort.tweede .pl{top:-44px}}


/* route (v2) */
.rt{position:relative;display:grid;grid-template-columns:1fr 1fr 1.35fr 1.1fr 1.1fr;gap:34px;align-items:center;padding:8px 0}
.rt .rt-lijnen{position:absolute;left:0;top:0;pointer-events:none;overflow:visible;z-index:0}
.rt-kol{position:relative;z-index:1;display:grid;gap:12px}
.rt-node{background:var(--wit);border:1px solid var(--lijn);border-radius:12px;padding:11px 12px;font-size:12.5px;line-height:1.4;color:var(--muted);display:flex;flex-direction:column;gap:3px}
.rt-kop{font-family:var(--f-kop);font-weight:600;font-size:15px;color:var(--ink);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rt-kop .urmb-status{font-size:10.5px;padding:2px 6px}
.rt-kern{background:var(--groen);border-color:var(--groen);color:#E4EEEB}
.rt-kern .rt-kop{color:var(--wit)}
.rt-groen{border:2px solid var(--groen);box-shadow:0 2px 0 var(--groen-tint)}
.rt-groen .rt-kop{font-size:17px}
.rt-oker{background:transparent;border-style:dashed;border-color:var(--muted)}
.rt-oker .rt-kop{color:var(--muted);font-size:14px}
.rt-chip{display:inline-block;align-self:flex-start;font-family:var(--f-mono);font-size:11.5px;padding:3px 8px;border-radius:6px;background:var(--groen-tint);color:var(--groen-sterk);margin-top:5px}
.rt-chip.zacht{background:var(--zand);color:var(--muted);margin-top:2px}
.rt-r{display:flex;align-items:center;gap:7px;color:var(--ink);font-size:12.5px}
.rt-r i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--groen);flex:none}
.rt-r i.ruit{border-radius:2px;transform:rotate(45deg);background:var(--wit);border:2px solid var(--oker);width:9px;height:9px}
.rt-r i.ruit.ink{border-color:var(--ink)}
.rt-r .k-mini i{width:7px;height:7px}
.st-wit{background:var(--wit);color:var(--ink);border:1px solid var(--lijn)}
.rt.smal{grid-template-columns:1fr;gap:0}
.rt.smal .rt-kol{gap:8px}
.rt.smal .rt-kol+.rt-kol::before{content:"";display:block;width:2px;height:16px;background:var(--groen);margin:4px auto}
/* 20.000 naast 100.000 (v2) */
.hk-wrap{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:22px;align-items:start}
@container urmb (max-width:760px){.hk-wrap{grid-template-columns:1fr}}
/* rekentijd */
.t-rij{display:grid;grid-template-columns:210px minmax(0,1fr) 90px;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--lijn);font-size:13.5px}
@container urmb (max-width:620px){.t-rij{grid-template-columns:1fr 80px}.t-rij .trk{grid-column:1/-1;order:3}}
.t-rij .trk{height:14px;position:relative;background:var(--zand);border-radius:3px}
.t-rij .br{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--groen);transform-origin:left;transform:scaleX(0);transition:transform .7s var(--ease)}
.t-rij .br.on{transform:scaleX(1)}
.t-rij .br.node{background:var(--groen-tint);border:1.5px solid var(--groen-sterk)}
.t-rij .v{font-family:var(--f-mono);text-align:right}
.t-rij.open .v{color:var(--muted);font-family:var(--f-tekst);font-size:12.5px}
.t-rij.open .trk{background:repeating-linear-gradient(90deg,var(--lijn) 0 6px,transparent 6px 12px)}