/* V49 · Sem: Pro in het dure blauw, Free gewoon grijs. Twee extra schuiven, ronder en rustig (?kaart=d of e). */
.plannen .plan:first-child{background:var(--vak);color:var(--fg);box-shadow:none}
.plannen .plan:first-child::after{display:none}
.plannen .plan:first-child .mono{color:var(--mut)}
.plannen .plan:last-child{background:radial-gradient(120% 130% at 88% 0%,#2A5F92 0%,#17416B 38%,#0E2A47 72%,#0A1F33 100%);color:#ECEAE4;box-shadow:0 0 0 1px rgba(143,182,218,.32) inset}
.plannen .plan:last-child .mono{color:#A9C4DC}
.tabel .rij>:nth-child(2){background:none}
.tabel .rij>:nth-child(3){background:rgba(26,70,112,.34)}
.tabel .rij:first-child>:nth-child(2){color:var(--fg)}
.tabel .rij:first-child>:nth-child(3){color:#A9C4DC}
.kies-rij .meer{color:#A9C4DC;border-color:rgba(143,182,218,.4)}
.pro-merk{color:#8FB6DA}
/* D · capsule: de hele balk is de schuif, helemaal rond, met naam en waarde erin */
html[data-kaart=d] .diep .vlak{border-radius:26px;background:#2A2B2F;padding:14px}
html[data-kaart=d] .diep .doek{border-radius:16px}
html[data-kaart=d] .kromme{height:48px;margin-top:12px}
html[data-kaart=d] .rijen{gap:6px;margin-top:12px}
html[data-kaart=d] .rij-s{display:block;position:relative;height:44px}
html[data-kaart=d] .rij-s .sch{--g:4px;position:absolute;inset:0;height:100%}
html[data-kaart=d] .rij-s .spoor{inset:0;height:auto;border-radius:999px;background:#1B1C1F}
html[data-kaart=d] .rij-s .vul{background:rgba(236,234,228,.2);border-radius:999px;width:max(44px,calc(var(--p)*100%))}
html[data-kaart=d] .rij-s .greep{top:12px;width:4px;height:20px;border-radius:999px;box-shadow:none;left:max(32px,calc(var(--p)*100% - 12px))}
html[data-kaart=d] .rij-s>span,html[data-kaart=d] .rij-s output{position:absolute;top:0;bottom:0;display:flex;align-items:center;z-index:2;pointer-events:none;color:#ECEAE4;text-transform:none;letter-spacing:0;font:500 14px/1 var(--sans)}
html[data-kaart=d] .rij-s>span{left:48px;text-align:left}
html[data-kaart=d] .rij-s output{right:18px;font-variant-numeric:tabular-nums}
html[data-kaart=d] .rij-s.slaapt{opacity:.45}
/* E · instellingen: naam en waarde boven een dunne schuif met een grote ronde knop; de kaart kleurt zacht mee met het shot */
html[data-kaart=e] .diep .vlak{--tint:#4a4b50;border-radius:26px;padding:14px;background:color-mix(in srgb,var(--tint) 20%,#26272B)}
html[data-kaart=e] .diep[data-shot=silhouette] .vlak{--tint:#8A4516}
html[data-kaart=e] .diep[data-shot=sun] .vlak{--tint:#9A6212}
html[data-kaart=e] .diep[data-shot=studio] .vlak{--tint:#5A6068}
html[data-kaart=e] .diep[data-shot=nature] .vlak{--tint:#6C6A45}
html[data-kaart=e] .diep .doek{border-radius:16px}
html[data-kaart=e] .rijen{gap:14px;margin:14px 6px 6px}
html[data-kaart=e] .rij-s{display:grid;grid-template-columns:1fr auto;grid-template-areas:"naam waarde" "sch sch";gap:6px 12px;font:500 14px/1.1 var(--sans);text-transform:none;letter-spacing:0}
html[data-kaart=e] .rij-s>span{grid-area:naam;text-align:left}
html[data-kaart=e] .rij-s output{grid-area:waarde;color:rgba(236,234,228,.66);font-variant-numeric:tabular-nums}
html[data-kaart=e] .rij-s .sch{grid-area:sch;--g:26px;height:28px}
html[data-kaart=e] .rij-s .spoor{left:0;right:0;top:12px;height:4px;background:rgba(0,0,0,.42)}
html[data-kaart=e] .rij-s .vul{background:#ECEAE4}
html[data-kaart=e] .rij-s .greep{top:1px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.42),0 0 0 .5px rgba(0,0,0,.2)}