

.sv-held-beeld{background-size:contain;background-repeat:no-repeat;background-color:var(--sv-merk-licht)}

.rh-cv{width:100%;max-width:600px;margin:0 auto;display:grid;gap:var(--sv-s2)}
.rh-vac{display:grid;gap:2px;padding:12px 16px;border-radius:var(--sv-radius-klein);background:var(--sv-papier);border:1px solid var(--sv-lijn);border-left:4px solid var(--sv-merk)}
.rh-vac small{font-size:13px;font-weight:600;color:var(--sv-merk-tekst);text-transform:uppercase;letter-spacing:.06em}
.rh-vac b{font-size:17px;color:var(--sv-inkt-sterk)}
.rh-vac span{font-size:15px;color:var(--sv-inkt-zacht)}
.rh-prompt{font-size:15px;line-height:1.4;padding:10px 14px;border-radius:12px;background:var(--sv-inkt-sterk);color:#fff;max-height:0;opacity:0;overflow:hidden;padding-top:0;padding-bottom:0;transition:max-height .4s var(--sv-ease),opacity .4s,padding .4s}
.rh-cv.prompt .rh-prompt{max-height:90px;opacity:1;padding-top:10px;padding-bottom:10px}
.rh-blad{position:relative;background:var(--sv-papier);border:1px solid var(--sv-lijn);border-radius:var(--sv-radius);box-shadow:var(--sv-schaduw);padding:var(--sv-s3);min-height:330px;overflow:hidden}
.rh-naam{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sv-s2);padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--sv-lijn)}
.rh-naam b{font-family:var(--sv-font-kop);font-size:20px;color:var(--sv-inkt-sterk)}
.rh-naam span{font-size:14px;color:var(--sv-inkt-licht)}
.rh-versies{display:grid;min-height:250px}
.rh-versie{grid-area:1 / 1;display:flex;flex-direction:column;gap:8px;opacity:0;transform:translateY(8px);transition:opacity .45s var(--sv-ease),transform .45s var(--sv-ease)}
.rh-versie.aan{opacity:1;transform:none}
.rh-versielabel{align-self:flex-start;font-size:14px;font-weight:700;color:var(--sv-merk-tekst);background:var(--sv-merk-licht);border:1px solid var(--sv-merk-rand);border-radius:999px;padding:4px 12px}
.rh-r{position:relative;display:grid;gap:2px;padding:10px 14px;border-radius:10px;padding-right:124px}
.rh-r b{font-size:16px;color:var(--sv-inkt-sterk);line-height:1.3}
.rh-r span{font-size:14px;color:var(--sv-inkt-zacht)}
.rh-r.v small{font-size:13px;font-weight:600;color:var(--sv-inkt-licht);text-transform:uppercase;letter-spacing:.06em}
.rh-r.v b{font-weight:500;font-size:15px}
.rh-r.h{background:var(--sv-merk-licht)}
.rh-r.x{background:var(--sv-accent-licht);box-shadow:inset 4px 0 0 var(--sv-accent)}
.rh-tag{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-style:normal;font-size:13px;font-weight:700;padding:3px 10px;border-radius:999px}
.rh-tag.h{background:var(--sv-papier);color:var(--sv-merk-tekst);border:1px solid var(--sv-merk-rand)}
.rh-tag.x{background:var(--sv-accent);color:var(--sv-op-accent)}
.rh-beoord{position:absolute;left:var(--sv-s2);right:var(--sv-s2);bottom:var(--sv-s2);display:grid;gap:8px;padding:var(--sv-s2);border-radius:var(--sv-radius-klein);background:var(--sv-papier);border:2px solid var(--sv-merk);box-shadow:0 20px 40px -18px rgba(0,0,0,.35);transform:translateY(110%);transition:transform .55s var(--sv-ease)}
.rh-cv.beoord .rh-beoord{transform:none}
.rh-b-kop{font-size:15px;font-weight:700;color:var(--sv-merk-tekst)}
.rh-b{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center}
.rh-b b{font-size:15px;color:var(--sv-inkt-sterk)}
.rh-b span{grid-column:1;font-size:14px;color:var(--sv-inkt-zacht)}
.rh-b em{grid-column:1 / -1;font-style:normal;font-size:14px;color:var(--sv-merk-tekst);font-weight:600}
.rh-ster{grid-column:2;grid-row:1 / span 2;width:96px;height:18px;background:linear-gradient(90deg,var(--sv-accent) calc(var(--s) * 20%),var(--sv-lijn) 0);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M10 1l2.6 5.4 5.9.8-4.3 4.1 1 5.9L10 14.4 4.8 17.2l1-5.9L1.5 7.2l5.9-.8z'/%3E%3C/svg%3E") 0 0/19.2px 18px repeat-x;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M10 1l2.6 5.4 5.9.8-4.3 4.1 1 5.9L10 14.4 4.8 17.2l1-5.9L1.5 7.2l5.9-.8z'/%3E%3C/svg%3E") 0 0/19.2px 18px repeat-x}
.rh-b-voet{font-size:14px;font-weight:600;color:var(--sv-inkt-sterk);padding-top:6px;border-top:1px solid var(--sv-lijn)}
.rh-voorbeeld{margin:0;font-size:14px;color:var(--sv-inkt-licht)}
@media (max-width:1100px){#scene-cv .sv-plak,#scene-app .sv-plak,#scene-daling .sv-plak{max-height:none}#scene-cv .sv-plak > *,#scene-app .sv-plak > *,#scene-daling .sv-plak > *{transform:none!important}}
@media (max-width:600px){.rh-blad{padding:var(--sv-s2);min-height:0}.rh-r{padding-right:14px}.rh-tag{position:static;transform:none;justify-self:start;margin-top:4px}.rh-versies{min-height:0}.rh-vac b{font-size:16px}}

.rh-app{position:relative;width:100%;max-width:600px;aspect-ratio:1200/1235;max-height:calc((100vh - var(--sv-kop)) * .88);margin:0 auto}
.rh-app-b{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .5s var(--sv-ease)}
.rh-app-b.aan{opacity:1}
#scene-app .sv-bronrij{text-align:center;margin-top:var(--sv-s2)}

.rh-daling{width:100%;max-width:640px;margin:0 auto;background:var(--sv-papier);border:1px solid var(--sv-lijn);border-radius:var(--sv-radius);box-shadow:var(--sv-schaduw);padding:var(--sv-s3)}
.rh-d-titel{font-size:15px;font-weight:600;color:var(--sv-inkt-zacht);margin-bottom:var(--sv-s2)}
.rh-d-rij,.rh-d-as{display:grid;grid-template-columns:150px 1fr;gap:var(--sv-s2);align-items:end}
.rh-d-rij{padding:10px 0;border-bottom:1px solid var(--sv-lijn);opacity:.35;transition:opacity .4s}
.rh-d-rij.aan{opacity:1}
.rh-d-naam b{display:block;font-size:15px;color:var(--sv-inkt-sterk);line-height:1.25}
.rh-d-naam small{font-size:13px;color:var(--sv-inkt-licht)}
.rh-d-cellen,.rh-d-as > div{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;align-items:end}
.rh-d-c{display:flex;flex-direction:column;align-items:center;gap:4px}
.rh-d-c i{display:block;width:100%;height:calc(var(--h) * .44px);min-height:3px;border-radius:5px 5px 2px 2px;background:var(--sv-lijn-sterk);transition:background .4s}
.rh-d-rij.aan .rh-d-c i{background:var(--sv-merk)}
.rh-d-rij.aan .rh-d-c.piek i{background:var(--sv-merk-donker)}
.rh-d-rij.aan .rh-d-c:last-child i{background:var(--sv-accent)}
.rh-d-c span{font-size:13px;font-weight:700;color:var(--sv-inkt-sterk);font-variant-numeric:tabular-nums;white-space:nowrap}
.rh-d-c.leeg span{color:var(--sv-inkt-licht)}
.rh-d-as{padding-top:6px}
.rh-d-as span{font-size:13px;font-weight:600;color:var(--sv-inkt-licht);text-align:center}
.rh-daling .sv-bronrij{margin-top:var(--sv-s2)}
@media (max-width:600px){.rh-daling{padding:var(--sv-s2)}.rh-d-rij,.rh-d-as{grid-template-columns:1fr}.rh-d-as > span{display:none}.rh-d-cellen,.rh-d-as > div{gap:3px}.rh-d-c span{font-size:13px}}

.rh-spel{background:var(--sv-papier);border:1px solid var(--sv-lijn);border-radius:var(--sv-radius);box-shadow:var(--sv-schaduw);padding:var(--sv-s5);display:grid;grid-template-columns:1fr 1.1fr;gap:var(--sv-s3) var(--sv-s5);align-items:start}
.rh-s-kop h3{font-size:clamp(24px,2.4vw,32px);margin:var(--sv-s1) 0}
.rh-s-kop p{margin:0;font-size:16px;color:var(--sv-inkt-zacht)}
.rh-s-cv{grid-row:span 2;display:grid;gap:8px;padding:var(--sv-s3);border-radius:var(--sv-radius-klein);background:var(--sv-bg-zacht);border:1px solid var(--sv-lijn)}
.rh-s-r{display:grid;gap:2px;text-align:left;font:inherit;padding:12px 14px;border-radius:10px;border:2px solid var(--sv-lijn);background:var(--sv-papier);cursor:pointer;transition:border-color .2s,background .3s}
.rh-s-r b{font-size:16px;color:var(--sv-inkt-sterk);line-height:1.3}
.rh-s-r span{font-size:14px;color:var(--sv-inkt-zacht)}
.rh-s-r:hover{border-color:var(--sv-merk-rand)}
.rh-s-r.gekozen{border-color:var(--sv-inkt-sterk)}
.rh-spel.klaar .rh-s-r{cursor:default}
.rh-spel.klaar .rh-s-r[data-x="1"]{background:var(--sv-accent-licht);border-color:var(--sv-accent)}
.rh-spel.klaar .rh-s-r[data-x="1"] b::after{content:" · verzonnen";color:var(--sv-inkt-sterk);font-weight:700}
.rh-s-uit{min-height:120px}
.rh-s-uit b{display:block;font-family:var(--sv-font-kop);font-size:24px;line-height:1.2;color:var(--sv-inkt-sterk)}
.rh-s-uit p{margin:8px 0 0;font-size:16px;line-height:1.55;color:var(--sv-inkt-zacht)}
@media (max-width:760px){.rh-spel{grid-template-columns:1fr;padding:var(--sv-s3)}.rh-s-cv{grid-row:auto}}

.rh-meter{background:var(--sv-papier);border:1px solid var(--sv-lijn);border-radius:var(--sv-radius);box-shadow:var(--sv-schaduw);padding:var(--sv-s5)}
.rh-m-kop h3{font-size:clamp(24px,2.4vw,32px);margin:var(--sv-s1) 0 var(--sv-s4)}
.rh-m-schaal{position:relative;height:120px;margin:0 var(--sv-s3)}
.rh-m-schaal::before{content:"";position:absolute;left:0;right:0;top:56px;height:14px;border-radius:7px;background:var(--sv-lijn)}
.rh-m-band{position:absolute;top:56px;height:14px;left:calc(var(--a) * 1%);width:calc((var(--b) - var(--a)) * 1%);border-radius:7px;background:linear-gradient(90deg,var(--sv-merk),var(--sv-accent));transform-origin:left;transform:scaleX(0);transition:transform 1.2s var(--sv-ease)}
.rh-meter.zicht .rh-m-band{transform:none}
.rh-m-p{position:absolute;left:calc(var(--x) * 1%);top:0;transform:translateX(-50%);text-align:center;font-size:14px;font-weight:600;color:var(--sv-inkt-zacht);white-space:nowrap}
.rh-m-p b{display:block;font-family:var(--sv-font-kop);font-size:24px;font-weight:800;color:var(--sv-inkt-sterk);line-height:1}
.rh-m-p::after{content:"";position:absolute;left:50%;top:44px;width:2px;height:12px;background:var(--sv-inkt-sterk)}
.rh-m-p:first-of-type{transform:translateX(-12px);text-align:left}.rh-m-p:first-of-type::after{left:11px}
.rh-m-as{position:absolute;left:0;right:0;top:80px;display:flex;justify-content:space-between;font-size:13px;color:var(--sv-inkt-licht)}
.rh-m-uitleg{margin:var(--sv-s2) 0 var(--sv-s4);font-size:15px;color:var(--sv-inkt-zacht)}
.rh-m-kaarten{display:grid;grid-template-columns:1fr 1fr;gap:var(--sv-s2)}
.rh-m-k{padding:var(--sv-s3);border-radius:var(--sv-radius-klein);background:var(--sv-bg-zacht);border:1px solid var(--sv-lijn)}
.rh-m-k > b{display:block;font-family:var(--sv-font-kop);font-size:44px;font-weight:800;line-height:1;color:var(--sv-merk-tekst)}
.rh-m-k p{margin:8px 0 0;font-size:15px;line-height:1.5;color:var(--sv-inkt-zacht)}
@media (max-width:760px){.rh-meter{padding:var(--sv-s3)}.rh-m-kaarten{grid-template-columns:1fr}.rh-m-schaal{margin:0 var(--sv-s1)}.rh-m-p:last-of-type{transform:translateX(calc(-100% + 12px));text-align:right}.rh-m-p:last-of-type::after{left:auto;right:11px}}

.rh-reken{background:var(--sv-papier);border:1px solid var(--sv-lijn);border-radius:var(--sv-radius);box-shadow:var(--sv-schaduw);padding:var(--sv-s5)}
.rh-k-kop h3{font-size:clamp(24px,2.4vw,32px);margin:var(--sv-s1) 0}
.rh-k-kop p{margin:0;font-size:16px;color:var(--sv-inkt-zacht)}
.rh-k-in{display:grid;grid-template-columns:1fr 1fr;gap:var(--sv-s3) var(--sv-s5);margin:var(--sv-s4) 0 var(--sv-s3)}
.rh-k-in label{display:flex;flex-direction:column;gap:var(--sv-s1)}
.rh-k-in label > span{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sv-s2);font-size:15px;font-weight:600;color:var(--sv-inkt-sterk)}
.rh-k-in b{font-family:var(--sv-font-kop);font-size:18px;color:var(--sv-merk-tekst);white-space:nowrap}
.rh-reken input[type=range]{width:100%;accent-color:var(--sv-merk);height:28px;margin:0}
.rh-k-balk{display:flex;height:16px;border-radius:8px;overflow:hidden;background:var(--sv-lijn);margin-bottom:var(--sv-s3)}
.rh-k-balk .met{background:var(--sv-merk);width:20%;transition:width .3s}
.rh-k-balk .zonder{background:var(--sv-lijn-sterk);flex:1}
.rh-k-uit{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:var(--sv-s2)}
.rh-k-cel{background:var(--sv-bg-zacht);border:1px solid var(--sv-lijn);border-radius:var(--sv-radius-klein);padding:var(--sv-s3);display:flex;flex-direction:column;gap:6px;min-width:0}
.rh-k-cel small{font-size:14px;font-weight:600;color:var(--sv-inkt-zacht)}
.rh-k-cel b{font-family:var(--sv-font-kop);font-size:clamp(28px,2.8vw,40px);font-weight:800;line-height:1.05;color:var(--sv-inkt-sterk);font-variant-numeric:tabular-nums}
.rh-k-cel.met b{color:var(--sv-merk-tekst)}
.rh-k-cel.groot{background:var(--sv-merk-licht);border-color:var(--sv-merk-rand)}
.rh-k-cel.groot b{color:var(--sv-merk-tekst);font-size:clamp(32px,3.4vw,48px)}
.rh-k-cel em{font-style:normal;font-size:14px;color:var(--sv-inkt-licht);line-height:1.4}
@media (max-width:760px){.rh-reken{padding:var(--sv-s3)}.rh-k-in,.rh-k-uit{grid-template-columns:1fr}}
