/* Boekpagina's (demo/assets/boekpagina.js) en het scherm Preview van je boek (#preview in /mijn/).
   Paginastijlen volgen het designcanvas (Preview-boek, Boek-*, Familie-pagina, Verjaardagskalender, Bijlagen,
   Familiewaaier): Source Serif 4 voor de tekst, IM Fell English voor koppen, Pinyon Script voor citaten, Plus Jakarta
   Sans voor labels. Eén pagina is 500 × 707 (A4-verhouding); een spread 1000 × 707, geschaald naar het vlak (--s). */
:root{--bk-mz:42.9px;--bk-mt:45.2px;--bk-mo:54.8px}
.bk{ /* witruimte zij, boven, onder: 18, 19 en 23 mm op A4 (500 pt = 210 mm); de instellingen in het beheer overschrijven ze (mijn.js, bkMarges) */
--papier:var(--perk-l);--bk-rand:#D9C7A0;--leeg:#EDE8DE} /* het boek: iets donkerdere perkamentrand dan op de site */
.bk-spr{display:flex;width:1000px;transform:scale(var(--s,1));transform-origin:top left;box-shadow:0 2px 4px rgba(16,24,40,.08),0 24px 48px rgba(16,24,40,.18);user-select:none;-webkit-user-select:none}
.bk-spr.een{width:500px}
.bk .pg{position:relative;flex:none;width:500px;height:707px;background:var(--papier);box-sizing:border-box;padding:var(--bk-mt) var(--bk-mz) var(--bk-mo);font-family:'Source Serif 4',Georgia,serif;color:var(--galnoot);overflow:hidden;cursor:default}
.bk .pg + .pg{box-shadow:inset 10px 0 14px -12px rgba(58,38,20,.35)}
.bk .pg.leeg{background:var(--leeg)}
.bk .pg.breed{width:1000px;padding:calc(var(--bk-mt)*.66) calc(var(--bk-mz)*.93)}
.bk .pg img{-webkit-user-drag:none;pointer-events:none}
.bk .pnr{position:absolute;bottom:calc(var(--bk-mo)*.4);left:0;right:0;text-align:center;font-family:'Plus Jakarta Sans',sans-serif;font-size:10px;letter-spacing:.14em;color:var(--sepia)}
.bk .pnr.l{text-align:left;left:var(--bk-mz);right:auto}.bk .pnr.r{text-align:right;right:var(--bk-mz);left:auto}
.bk .vouw{position:absolute;top:0;bottom:0;left:500px;width:1px;background:rgba(58,38,20,.18)}
.bk .kk{font-family:'Plus Jakarta Sans',sans-serif;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--sepia)}
.bk .h{font-family:'IM Fell English',serif;font-weight:400;font-size:27px;line-height:1.1;margin:8px 0 12px;color:var(--galnoot)}
.bk .h.m{font-size:23px}
.bk .h.groot{font-size:36px;margin-top:12px}
.bk .sub{font-family:'IM Fell English',serif;font-style:italic;font-size:15px;margin:-4px 0 14px}
.bk .h2{font-family:'IM Fell English',serif;font-size:18px;margin:12px 0 5px}
.bk .t{font-size:12.2px;line-height:1.6;margin:0 0 9px;text-align:justify;hyphens:auto}
.bk .t.dc::first-letter{font-family:'IM Fell English',serif;float:left;font-size:48px;line-height:.85;padding:4px 6px 0 0;color:var(--lak)}
.bk .fig{margin:0 0 10px}
.bk .fig img{display:block;width:100%;height:auto;filter:sepia(.15)}
.bk .fig figcaption{font-size:10px;font-style:italic;color:var(--sepia);margin-top:4px;line-height:1.4}
.bk .kader{border:1px solid var(--bk-rand);background:var(--perk);padding:10px 12px;margin:8px 0}
.bk .kader b{font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--lak);display:block;margin-bottom:3px}
.bk .kader p{margin:0;font-size:11.5px;line-height:1.5}
.bk .cit{font-family:'Pinyon Script',cursive;font-size:21px;line-height:1.3;color:var(--galnoot);margin:6px 0}
.bk .ph{background:repeating-linear-gradient(45deg,#E9DCC0,#E9DCC0 8px,#E4D5B5 8px,#E4D5B5 16px);border:1px solid var(--bk-rand);display:flex;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;color:var(--sepia);text-align:center;padding:8px;box-sizing:border-box;margin:0 0 10px}
.bk .pers{border:1px solid var(--bk-rand);background:var(--perk);padding:7px 9px;font-size:11px;line-height:1.4}
.bk .pers .n{font-family:'IM Fell English',serif;font-size:14px}
.bk .pers-g{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.bk .tl{list-style:none;margin:6px 0 0;padding:0;border-left:1.5px solid var(--lak)}
.bk .tl li{position:relative;padding:0 0 8px 15px;font-size:11.5px;line-height:1.5}
.bk .tl li:before{content:"";position:absolute;left:-5px;top:5px;width:8px;height:8px;border-radius:50%;background:var(--lak)}
.bk .tl b{font-family:'Plus Jakarta Sans',sans-serif;font-size:10.5px}
.bk .bron{font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;color:var(--sepia);line-height:1.4}
.bk .vb{font-family:'Plus Jakarta Sans',sans-serif;font-size:10px;font-weight:700;color:var(--groen);letter-spacing:.04em}
.bk .orn{text-align:center;color:var(--lak);font-size:14px;letter-spacing:.6em;margin:8px 0}
.bk .vbp{position:absolute;left:var(--bk-mz);right:var(--bk-mz);bottom:40px;margin:0;font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;font-weight:700;color:var(--sepia);text-align:center;border-top:1px dashed var(--bk-rand);padding-top:6px;background:var(--papier)}
.bk .wm{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:2}
.bk .wm .wm-in{transform:rotate(-30deg);display:flex;flex-direction:column;align-items:center;gap:6px;opacity:.09;font-family:'Plus Jakarta Sans',sans-serif;color:#3a2614;white-space:nowrap;user-select:none}
.bk .wm .wm-in img{width:64px;height:64px;filter:grayscale(1) brightness(.4)}
.bk .wm .wm-in b{font-size:26px;font-weight:800;letter-spacing:.04em}
.bk .wm .wm-in i{font-style:normal;font-size:36px;font-weight:800;letter-spacing:.24em;text-transform:uppercase}
.bk .breed .wm .wm-in{gap:10px}.bk .breed .wm .wm-in img{width:96px;height:96px}.bk .breed .wm .wm-in b{font-size:38px}.bk .breed .wm .wm-in i{font-size:56px}
/* omslag */
.bk .pg.omslag{padding:0}
.bk .om{position:absolute;inset:0;background:var(--galnoot);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:var(--perk);text-align:center;padding:40px}

.bk .om .kk{color:var(--bk-rand)}
.bk .omslag .wm span{color:rgba(243,233,210,.08)}
/* inhoud */
.bk .inh{font-size:13px;line-height:2;border-top:1px solid var(--bk-rand);padding-top:8px}
.bk .inh div{display:flex;justify-content:space-between;gap:12px}
.bk .inh span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk .inh.k2,.bk .inh.k3{column-count:2;column-gap:22px;line-height:1.7}.bk .inh.k2 div,.bk .inh.k3 div{break-inside:avoid}
.bk .inh.kl{font-size:11.5px;line-height:1.55}.bk .inh.k3{column-count:3;column-gap:16px;font-size:10px;line-height:1.5}
.bk .ov-l{height:11px}
/* stambomen */
.bk .boom{display:flex;flex-direction:column;gap:9px;margin-top:16px}
.bk .boom-r{display:flex;justify-content:center;gap:4px}
.bk .cel{flex:1 1 0;min-width:0;max-width:120px;background:var(--perk);border:1px solid var(--bk-rand);padding:6px 3px;font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;text-align:center;line-height:1.3;overflow:hidden;text-overflow:ellipsis;word-break:break-word}
.bk .boom-r.vol .cel{font-size:8px;padding:5px 1px}
.bk .cel small{display:block;font-size:8.5px;color:var(--sepia)}
.bk .cel.leeg{background:none;border-style:dashed}
.bk .cel.nu{background:#fff;border:1.5px solid var(--inkt)}
.bk .cel.hl{outline:2.5px solid var(--kobalt);outline-offset:2px}
/* kalender en notities */
.bk .kal{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.bk .kal>div{border-top:2px solid var(--lak);padding-top:4px;min-height:92px}
.bk .kal-m{font-family:'IM Fell English',serif;font-size:15px}
.bk .kal-r{font-size:10.5px;line-height:1.35}
.bk .kal-r.oud{font-style:italic;color:var(--sepia)}
/* verjaardagskalender in drie vormen (6-11-2026) */
.bk .kal-sp{height:44px}
.bk .kal.kal2{grid-template-columns:1fr 1fr;gap:12px 18px}
.bk .kal.kal2>div{min-height:150px}
.bk .kal-m{margin-bottom:2px}
.bk .kal-r b{font-weight:600;display:inline-block;min-width:16px}
.bk .kal-lijn{border-bottom:1px solid var(--bk-rand);height:16px}
.bk .kald{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.bk .kald-m{font-family:'IM Fell English',serif;font-size:17px;border-bottom:2px solid var(--lak);padding-bottom:2px;margin-bottom:2px}
.bk .kald-r{display:flex;gap:6px;height:16.4px;border-bottom:1px solid var(--bk-rand);font-size:10px;line-height:16.4px}
.bk .kald-r span:first-child{width:14px;flex:none;font-family:'Plus Jakarta Sans',sans-serif;font-size:8.5px;font-weight:700;color:var(--sepia)}
.bk .kald-r span:last-child{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk .kald-r .oud{font-style:italic;color:var(--sepia)}
.bk .kalrad-l{columns:2;column-gap:16px}.bk .kalrad-l .kal-r{break-inside:avoid;line-height:1.5}
.bk .kalrad{display:block;width:100%;height:auto}
.bk .kalrad .kr-o{fill:none;stroke:var(--bk-rand)}.bk .kalrad .kr-ring{fill:none;stroke:var(--lak);stroke-width:1.5}.bk .kalrad .kr-c{fill:var(--perk);stroke:var(--bk-rand)}
.bk .kalrad .kr-sp{stroke:var(--bk-rand)}
.bk .kalrad .kr-m{font-family:'IM Fell English',serif;font-size:13px;fill:var(--galnoot);text-anchor:middle;dominant-baseline:middle}
.bk .kalrad .kr-p{fill:var(--galnoot)}.bk .kalrad .kr-p.oud{fill:var(--sepia)}
.bk .kalrad .kr-n{font-family:'Source Serif 4',Georgia,serif;font-size:11px;fill:var(--galnoot);dominant-baseline:middle}.bk .kalrad .kr-n.oud{font-style:italic;fill:var(--sepia)}
.bk .kalrad .kr-t{font-family:'IM Fell English',serif;font-size:18px;fill:var(--galnoot);text-anchor:middle}
.bk .lijn{border-bottom:1px solid var(--bk-rand);height:30px}
/* bijlagen en code */
.bk .lijst{font-size:11.5px;line-height:1.7;padding-left:18px;margin:0}
.bk .code{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;gap:14px}
.bk .qr{width:120px;height:120px;background:repeating-conic-gradient(var(--galnoot) 0 25%,var(--perk-l) 0 50%) 0 0/16px 16px;border:6px solid var(--perk-l);outline:1px solid var(--bk-rand)}
.bk .code-c{font-family:'Plus Jakarta Sans',sans-serif;font-size:18px;font-weight:800;letter-spacing:.2em;margin:0}
.bk .code .vbp{position:static;border:0}
.bk .code-twee{display:grid;grid-template-columns:1fr 1fr;gap:16px;width:100%}
.bk .code-vak{display:flex;flex-direction:column;align-items:center;gap:10px;background:#F3E9D2;padding:14px 10px;border-radius:3px}
.bk .code-vak .t{text-align:center;font-size:9.5px;line-height:1.45;margin:0}
.bk .code-vak .qr{width:96px;height:96px}
.bk .code-vak .qr.echt{background:#fff;border-width:4px}
.bk .code-vak .qr.echt svg{width:100%;height:100%;display:block}
.bk .code2 .code-c{font-size:13px;letter-spacing:.14em}
.bk .fotos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bk .fotos img{height:180px;object-fit:cover}
/* familiewaaier */
.bk .waaier{display:block;width:100%;height:auto;margin-top:34px}
.bk .waaier path.w0{fill:var(--perk);stroke:var(--perk-l);stroke-width:1.5}
.bk .waaier path.w1{fill:#E9DCC0;stroke:var(--perk-l);stroke-width:1.5}
.bk .waaier path.wl{fill:none;stroke:#D9C7A0;stroke-width:1;stroke-dasharray:3 3}
.bk .waaier path.wm0{fill:var(--lak)}
.bk .waaier text{font-family:'Source Serif 4',Georgia,serif;fill:var(--galnoot);text-anchor:middle}
.bk .waaier text.wo{fill:#98825F;font-style:italic}
.bk .waaier tspan.wj{font-family:'Plus Jakarta Sans',sans-serif;font-size:.8em;fill:var(--sepia)}
.bk .waaier .wmn{font-family:'IM Fell English',serif;fill:var(--perk)}
.bk .waaier .wmj{font-family:'Plus Jakarta Sans',sans-serif;fill:var(--bk-rand)}

/* ---------- Scherm: Preview van je boek ---------- */
.pv{display:grid;grid-template-columns:330px minmax(0,1fr);grid-template-areas:"intro kijker" "links kijker";column-gap:32px;row-gap:14px;align-items:start}

.pv-links{grid-area:links;display:flex;flex-direction:column;gap:12px}
.pv-kijker{grid-area:kijker;display:flex;flex-direction:column;align-items:center;gap:12px;position:sticky;top:calc(var(--kb-h,0px) + 12px);min-width:0}
.pv-toc{display:flex;flex-direction:column;gap:6px}
/* Volgorde verslepen (Ortwin 6-11-2026): greep links; voorkant, voorwoord en het slot staan vast */
.pv-grp{display:flex;gap:4px;align-items:stretch}
.pv-grp-in{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.pv-greep,.pv-greep-leeg{flex:0 0 20px}
.pv-greep{border:0;background:none;padding:0;border-radius:8px;color:var(--grijs-400);cursor:grab;touch-action:none;font:inherit;font-size:16px;line-height:1;display:flex;align-items:flex-start;justify-content:center;padding-top:14px}
.pv-greep:hover{color:var(--inkt);background:var(--grijs-200)}
.pv-greep:focus-visible{outline:3px solid var(--kobalt);outline-offset:1px;color:var(--inkt)}
.pv-toc.sleep,.pv-toc.sleep *{cursor:grabbing;user-select:none}
.pv-grp.sleept{opacity:.75}.pv-grp.sleept .pv-sec{border-color:var(--kobalt);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.pv-sec{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;border:1.5px solid var(--grijs-200);border-radius:12px;padding:10px 12px;background:#fff;cursor:pointer;font:inherit;text-align:left;color:var(--inkt);min-height:52px}
.pv-sec:hover{border-color:var(--grijs-400)}
.pv-sec.sel{border-color:var(--kobalt);box-shadow:0 0 0 2px var(--kobalt);background:var(--kobalt-25)}
.pv-sec b{font-size:14px;display:block}
.pv-sec small{font-size:12px;color:var(--grijs)}
.pv-sec.opt{border-style:dashed;background:var(--zacht-warm)}
.pv-sec:focus-visible,.pv-du:focus-visible,.pv-rond:focus-visible{outline:3px solid var(--kobalt);outline-offset:2px}
.pv-st{font-size:12px;font-weight:800;border-radius:999px;padding:3px 9px;white-space:nowrap}
.pv-st.ok{background:var(--mint);color:var(--groen)}.pv-st.nog{background:var(--grijs-100);color:var(--grijs)}.pv-st.con{background:#FEF0C7;color:#93370D}.pv-st.uit{background:#fff;color:var(--kobalt);border:1.5px dashed var(--kobalt)}

.pv-tip{margin:0;font-size:13px;line-height:1.5;color:var(--grijs)}
.pv-tip b{color:var(--inkt)}
.pv-eind{width:100%;box-sizing:border-box}
.mj-knop.pv-eind{min-height:56px;font-size:17px}
.pv-over{border:1.5px solid #DC6803;background:var(--geel);border-radius:12px;padding:12px 14px;font-size:14px;line-height:1.5}
.pv-boven{display:flex;justify-content:space-between;align-items:baseline;width:100%;gap:12px;font-size:14px;color:var(--grijs)}
.pv-vak{position:relative;width:100%;max-width:100%;overflow:hidden}
.pv-nav{display:flex;align-items:center;gap:14px;font-size:14px;font-weight:700}
.pv-rond{width:44px;height:44px;border-radius:999px;border:1.5px solid var(--grijs-300);background:#fff;display:inline-flex;align-items:center;justify-content:center;color:var(--inkt);cursor:pointer}
.pv-rond[disabled]{opacity:.4;cursor:default}

.pv-gew{display:block;margin-top:4px;color:#93370D;font-weight:700;font-size:14px}

.pv-strip{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;width:100%;padding-top:5px}
.pv-du{height:40px;min-width:46px;border-radius:3px;border:1px solid var(--perk-r);background:var(--perk-l);font:inherit;font-size:10px;font-weight:700;color:var(--sepia);padding:0 5px;cursor:pointer}
.pv-du.sel{outline:3px solid var(--kobalt);outline-offset:2px}
.pv-du.dok{border-bottom:3px solid var(--groen)}.pv-du.dcon{border-bottom:3px solid #DC6803}
.pv-du{position:relative}
.pv-du.nieuw::after{content:"";position:absolute;top:-4px;right:-4px;width:10px;height:10px;border-radius:50%;background:var(--kobalt);border:2px solid #fff;box-sizing:border-box}

.pv-nietgezien{border:1.5px solid var(--kobalt);background:var(--kobalt-25);border-radius:12px;padding:12px 14px;font-size:14px;line-height:1.5;color:var(--inkt)}
.pv-nietgezien .mj-link{font-weight:700}
.pv-nietgezien small{display:block;margin-top:6px;font-size:12.5px;color:var(--grijs)}
.pv-terugbalk{display:flex;gap:14px;align-items:center;flex-wrap:wrap;border:1.5px solid var(--kobalt);background:var(--kobalt-25);border-radius:14px;padding:10px 14px}
.pv-terugbalk .mj-twee{border-color:var(--kobalt);color:var(--kobalt)}
@media (max-width:1100px){.pv{grid-template-columns:270px minmax(0,1fr)}}
@media (max-width:820px){
  .pv{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "kijker" "links"}
  .pv-kijker{position:static}

  .pv-strip{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding:4px 2px 8px}
  .pv-du{flex:none}

}
.pv-boven span:last-child{white-space:nowrap}
.mj-twee.pv-eind{font-size:15px;min-height:52px}

/* KB: terug naar het startscherm (preview-als-startscherm.md) */
.kb-klaar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:28px 0 8px;padding:16px 18px;border:1.5px solid var(--kobalt);background:var(--kobalt-25);border-radius:14px}
.kb-klaar .mj-stil{flex:1;min-width:220px}
.kb-melding{margin:0 0 14px;padding:10px 14px;border-radius:12px;background:var(--mint);border:1.5px solid #2E7D4F;color:#1F4D33;transition:opacity .6s}
.kb-melding.weg{opacity:0}
.pv-sec.kb-net{outline:2px solid #2E7D4F;outline-offset:2px}
.kb-net-l{color:#2E7D4F;font-weight:700}
@media (prefers-reduced-motion:reduce){.kb-melding{transition:none}}

/* KZ: je boek is klaar (keuzescherm), familie en reacties */
.kz{display:flex;flex-direction:column;gap:10px;padding:16px;border:1.5px solid var(--kobalt);border-radius:16px;background:var(--kobalt-25)}
.kz-t{font-size:17px}
.kz-opt{display:flex;flex-direction:column;gap:6px;padding:12px 14px;border-radius:12px;background:#fff;border:1px solid var(--grijs-200)}
.kz-opt .mj-knop,.kz-opt .mj-twee{align-self:flex-start;min-height:44px}
.kz-fam{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.kz-fam .mj-twee{align-self:flex-start}
.kz-reacties{display:flex;flex-direction:column;gap:10px;margin:0 0 12px;padding:14px 16px;border-radius:14px;border:1.5px solid #E7DDA6;background:#FFFBEA}
.kz-r{display:flex;flex-direction:column;gap:4px;padding-top:10px;border-top:1px solid #EFE6C2}
.kz-tel{color:#8A5A00;font-weight:700}
.pv-sec.opt.aan{border-style:dashed;padding-top:8px;padding-bottom:8px}.pv-sec.opt.aan b{font-size:14px;font-weight:600}
/* Tweede klik op een onderdeel opent het om aan te passen */
.pv-hint{grid-column:1/-1;margin-top:-4px;color:var(--kobalt);font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
#pv-vak .pg[data-sectie]{cursor:pointer}
.pv-hint:hover{text-decoration:underline}
.pv-sec [data-pv-stand]{cursor:pointer}.pv-sec [data-pv-stand]:hover{outline:2px solid currentColor;outline-offset:1px}
.pv-sec.opt.aan{grid-template-columns:1fr}
/* De familie op de kaart (demo/assets/familiekaart.js, claude/familiekaart.md): kaart met lakzegels, plaatsen en routes */
.bk .fk-in{margin:-6px 0 10px;font-size:13.5px}
.bk .fk-kaart{border:1px solid var(--bk-rand);line-height:0;margin:0 0 8px}
.bk .fk-kaart svg{display:block;width:100%;height:auto}
.bk .fk-zoom{margin-bottom:10px}
.bk .fk-bs{margin:0}
.bk .fk-leg{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 10px}
.bk .fk-leg>div{display:flex;align-items:center;gap:8px}
.bk .fk-leg span{font-family:'Plus Jakarta Sans',sans-serif;font-size:9px;line-height:1.35;color:var(--sepia)}
.bk .fk-lijst{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bk .fk-kop{font-family:'Plus Jakarta Sans',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--sepia);border-bottom:1px solid var(--bk-rand);padding-bottom:4px;margin-bottom:2px}
.bk .fk-r{display:grid;grid-template-columns:20px 1fr auto;align-items:center;gap:6px;border-bottom:1px dotted var(--bk-rand);padding:3px 0;font-size:10.5px;line-height:1.3}
.bk .fk-r b{font-family:'IM Fell English',serif;font-weight:400;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bk .fk-r>span:last-child{font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;color:var(--sepia)}
.bk .fk-n{width:18px;height:18px;border-radius:50%;background:var(--lak);color:var(--perk);font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:8.5px;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 2px var(--lak),inset 0 0 0 2.6px rgba(243,233,210,.75)}
.bk .fk-l{display:block;width:18px;border-radius:3px;background:rgba(91,58,30,.6)}
.bk .fk-ob{margin-top:8px}
/* Voorbeeld van de familiekaart in de preview, vóór je hem toevoegt */

.pv-vbk{align-self:flex-start;margin:-2px 0 4px 12px;font-size:14px;font-weight:700}
.fk-vb-vak{position:relative;width:100%;overflow:hidden;margin:4px 0 12px}
.fk-vb-vak .bk-spr{position:absolute;left:0;top:0} /* de spread (1000px) bepaalt niet de breedte van de dialoog */
/* De kaart aanpassen (in de preview, onder het onderdeel De familie op de kaart) */
.pv-fk{width:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;border:1px solid var(--grijs-200);border-radius:16px;padding:16px;background:#fff}
.pv-fk-t{margin:0;font-size:17px;font-weight:800}
.pv-fk .mj-vink{font-size:15px}
.pv-fk .mj-vink input{width:20px;height:20px;margin:1px 0 0;flex:none}
.pv-fk-ob{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--lijn);padding-top:12px}
.pv-fk-ob p{margin:0;font-size:15px;line-height:1.5}
.pv-fk-r{display:flex;flex-direction:column;gap:6px}
.pv-fk-r label{font-size:15px}
.pv-fk-k{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pv-fk-k input{flex:1 1 180px;min-height:48px;box-sizing:border-box;border:2px solid var(--grijs-300);border-radius:12px;padding:0 12px;font:inherit;font-size:16px}
.pv-fk-k input:focus-visible{outline:3px solid var(--kobalt);outline-offset:2px}
.pv-fk-k .mj-twee{min-height:48px;font-size:15px}
.pv-fk-gek{display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--lijn);padding-top:12px;font-size:14px}
.jb-fk{border:1px solid var(--perk-r);background:var(--perk-l);line-height:0;margin:8px 0}
.jb-fk svg{display:block;width:100%;height:auto}
/* Voorkant met afbeelding (scherm Voorkant): de prent of oude foto in een lijst boven de titel */

 /* recht (feedback Marjolein 7-11-2026: stond scheef) */

/* VK: scherm Voorkant */
.vk-vak{position:relative;overflow:hidden;width:100%;border-radius:4px}

.vw-onder{margin-top:14px}

/* familiewaaier als eigen onderdeel (6-11-2026): vorm en stijl uit samenstelling.waaier */
.bk .wv2-vlak{position:absolute;inset:0}
.bk .wv2-t{position:absolute;text-align:center}
.bk .wv2-t>div:first-child{font-size:26px;line-height:1.1}
.bk .wv2-s{font-family:'Source Serif 4',Georgia,serif;font-style:italic;font-size:14px;margin-top:4px}
.bk .wv2-f{position:absolute}
.bk .wv2-f svg{display:block;width:100%;height:100%}
/* onder de preview: de waaier aanpassen (vorm, generaties, wie in het midden, stijl) */
.pv-wv{width:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:20px;border:1px solid var(--grijs-200);border-radius:16px;padding:18px 20px;background:#fff;color:var(--inkt)}
.pv-wv h2{margin:0;font-size:19px;font-weight:800}
.pv-wv h3,.pv-wv legend{margin:0 0 8px;font-size:16px;font-weight:800;padding:0}
.pv-wv-kop{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.pv-wv-rij{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:24px;align-items:start}
.pv-wv-l{display:flex;flex-direction:column;gap:18px;min-width:0}
.pv-wv-r{display:flex;flex-direction:column;gap:8px;min-width:0;border:1px solid var(--grijs-200);border-radius:14px;padding:14px 16px}
.wv-vormen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.wv-vorm{min-height:120px;border:1px solid var(--lijn);border-radius:14px;background:#fff;padding:10px;display:flex;flex-direction:column;align-items:center;gap:6px;font:inherit;color:var(--grijs);cursor:pointer;text-align:center}
.wv-vorm b{font-size:15px;color:var(--inkt)}.wv-vorm small{font-size:12px;line-height:16px}
.wv-vorm.aan{border:2px solid var(--kobalt);background:var(--kobalt-25);color:var(--kobalt)}
.wv-vorm:disabled{opacity:.55;cursor:not-allowed}
.wv-uitleg{margin:8px 0 0;font-size:14px;line-height:20px}
.wv-gen{border:0;margin:0;padding:0;min-width:0}.wv-gen .mj-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:300px}.wv-gen .mj-stil{font-size:13px;margin:6px 0 0}
.wv-nu{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1.5px solid var(--kobalt);border-radius:12px;background:var(--kobalt-25);color:var(--kobalt)}
.wv-nu>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column;color:var(--inkt)}.wv-nu small{color:var(--grijs);font-size:13px}
.wv-tag{font-size:12px;font-weight:700;background:#fff;border:1px solid var(--kobalt-200);border-radius:999px;padding:2px 8px}
.wv-zl{font-size:13px;font-weight:700;margin-top:6px}
#wv-zoek{height:46px;border:1.5px solid var(--grijs-300);border-radius:12px;padding:0 12px;font:inherit;font-size:16px;width:100%;box-sizing:border-box}
.wv-res{border:1px solid var(--grijs-200);border-radius:12px;overflow:hidden;max-height:320px;overflow-y:auto}

.wv-res button{width:100%;min-height:52px;border:0;border-top:1px solid var(--grijs-200);background:#fff;padding:6px 12px;display:flex;align-items:center;gap:10px;text-align:left;font:inherit;color:var(--grijs);cursor:pointer}
.wv-res button:hover{background:var(--zacht)}.wv-res button[aria-selected=true]{background:#F6FEF9}
.wv-res button>span{flex:1;min-width:0;display:flex;flex-direction:column}.wv-res button>span>span{color:var(--inkt);font-size:15px}.wv-res small{font-size:13px}
.wv-res mark{background:#FFF1C2;border-radius:3px;color:inherit;font-weight:700}.wv-res em{font-style:normal;font-weight:700;color:var(--groen);font-size:13px}
.wv-res p{margin:0;padding:12px;font-size:14px}
.wv-stijlen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.wv-stijl{border:1px solid var(--lijn);border-radius:14px;background:#fff;padding:8px;display:flex;flex-direction:column;gap:6px;font:inherit;color:var(--grijs);cursor:pointer;text-align:left;min-width:0}
.wv-stijl.aan{border:2px solid var(--kobalt)}.wv-stijl b{font-size:15px;color:var(--inkt)}.wv-stijl small{font-size:13px;line-height:18px}
.wv-ok{font-size:12px;color:var(--groen)}
.wv-dum{display:block;border-radius:8px;overflow:hidden;background:var(--perk-l);padding:6px}.wv-dum svg{display:block;width:100%;height:auto}
.wv-stijl[data-wv-stijl=modern] .wv-dum,.wv-stijl[data-wv-stijl=zwartwit] .wv-dum{background:#fff;box-shadow:inset 0 0 0 1px var(--grijs-200)}
.wv-stijl[data-wv-stijl=kleuren] .wv-dum{background:#F3EEE2}
.pv-wv-hulp{border-top:1px solid var(--grijs-200);padding-top:14px}
@media (max-width:900px){.pv-wv-rij{grid-template-columns:minmax(0,1fr)}.wv-stijlen{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.wv-vormen{grid-template-columns:minmax(0,1fr)}.wv-vorm{min-height:0;flex-direction:row;text-align:left}}
.wv-los{display:flex;flex-wrap:wrap;gap:4px 14px}.wv-los .mj-link{min-height:36px;font-size:14px}

/* Verjaardagskalender: instellingen onder de preview (6-11-2026) */
.pv-vk-kop{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}.pv-vk-kop>div:first-child{flex:1;min-width:240px}
.pv-vk .vk-in{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--grijs-100);border-radius:12px;width:320px;max-width:100%}
.pv-vk .vk-in button{min-height:44px;border:0;border-radius:9px;background:transparent;font:inherit;font-size:15px;font-weight:700;color:var(--grijs-600);cursor:pointer}
.pv-vk .vk-in button.aan{background:#fff;border:1px solid var(--grijs-300);color:var(--inkt)}
.vk-vormen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.vk-vorm{border:1px solid var(--grijs-200);border-radius:14px;background:#fff;padding:12px;display:flex;gap:12px;align-items:flex-start;text-align:left;font:inherit;color:var(--inkt);cursor:pointer}
.vk-vorm.aan{border:2px solid var(--kobalt);background:var(--kobalt-25);padding:11px}
.vk-vorm:disabled{opacity:.6;cursor:not-allowed}
.vk-mini{flex:none;width:64px;height:46px;border-radius:4px;background:var(--perk-l);border:1px solid var(--perk-r);display:flex;align-items:center;justify-content:center}
.vk-vorm b{display:block;font-size:15px}.vk-vorm small{display:block;font-size:13px;line-height:18px;color:var(--grijs-600);margin-top:2px}.vk-vorm em{display:block;font-style:normal;font-size:12px;font-weight:700;color:var(--kobalt-h);margin-top:6px}
.vk-vinken{display:flex;flex-wrap:wrap;gap:8px 24px}
@media (max-width:760px){.vk-vormen{grid-template-columns:1fr}}
/* Verhalen uit de akten (6-11-2026): lijstpagina (jaar links) en uitgelicht verhaal */

.bk .avh-t{font-family:'IM Fell English',serif;font-size:16px;line-height:1.2;margin:0 0 2px}
.bk .avh-w{font-family:'Plus Jakarta Sans',sans-serif;font-size:8.8px;letter-spacing:.14em;text-transform:uppercase;color:var(--sepia);margin:0 0 6px}

.bk .avh-k ul{list-style:none;margin:4px 0 0;padding:0;font-size:11px;line-height:1.5}
.bk .avh-k i{font-family:'Plus Jakarta Sans',sans-serif;font-style:normal;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--sepia);display:inline-block;min-width:92px}
.bk .avh-akte{margin:6px 0 4px}
.bk .avh-akte.klein{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;align-items:start}
.bk .avh-akte.klein .ph{margin:0}
.bk .avh-akte.klein .kader{margin:0;padding:6px 8px}
/* Verhalen en aktes in twee kolommen, met de tijdsverhalen (9-11-2026). De maten horen bij de schatting in verhalen.js (hoogte) */
.bk .avk{display:grid;grid-template-columns:1fr 1fr;column-gap:16px;align-items:start}
.bk .avk-k{min-width:0}
.bk .avk-v{padding:0 0 9px;margin:0 0 9px;border-bottom:1px dotted var(--bk-rand)}
.bk .avk-k .avk-v:last-child{border-bottom:0;margin-bottom:0}
.bk .avk-j{font-family:'Plus Jakarta Sans',sans-serif;font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--lak);margin:0 0 2px}
.bk .avk .avh-t{font-size:14.5px;margin:0 0 2px}
.bk .avk .avh-w{font-size:8.2px;margin:0 0 4px}
.bk .avk .t{font-size:10.4px;line-height:1.45;margin:0 0 4px;text-align:justify;hyphens:auto}
.bk .avk .bron{font-size:8.6px;margin:2px 0 0}
.bk .avk-f{margin:2px 0 6px;height:92px;overflow:hidden;border:1px solid var(--bk-rand)}
.bk .avk-f img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:sepia(.25)}
.bk .avk .ph{margin:2px 0 6px}
.bk .avk .avh-akte.klein{grid-template-columns:1fr;gap:4px}
.bk .avk .avh-akte.klein .ph{height:64px!important}
.bk .avh-akte.klein .avh-k ul{font-size:10px}
.bk .avh-akte.klein .avh-k i{min-width:60px}

/* Waar ze vandaan kwamen (7-11-2026) */
.bk .wz-kader{border:1px solid var(--bk-rand);line-height:0}.bk .wz-kader.prent{border:2px solid #6B4E1E}
.bk .wz-svg{display:block;width:100%;height:auto}
.bk .wz-svg .wz-nr{font-family:'IM Fell English',serif;font-size:10px;fill:var(--perk-l);text-anchor:middle;dominant-baseline:central}
.bk .wz-svg .wz-st{font-family:'IM Fell English',serif;font-size:12px;fill:var(--galnoot);dominant-baseline:central}
.bk .wz-svg .wz-j{font-family:'Source Serif 4',Georgia,serif;font-size:9.5px;font-style:italic;fill:var(--sepia);dominant-baseline:central}
.bk .wz-svg .wz-e{font-family:'Source Serif 4',Georgia,serif;font-size:10px;font-style:italic;fill:var(--galnoot)}
.bk .wz-svg .wz-n{font-family:'IM Fell English',serif;font-size:10px;fill:#6B4E1E;text-anchor:middle}
.bk .wz-svg .wz-c1{font-family:'IM Fell English',serif;font-size:13px;fill:var(--galnoot);text-anchor:middle}
.bk .wz-svg .wz-c2{font-family:'IM Fell English',serif;font-size:9.5px;font-style:italic;fill:var(--sepia);text-anchor:middle}
.bk .wz-leg{display:grid;grid-template-columns:1fr 1fr;gap:5px 16px;margin-top:10px}
.bk .wz-leg>div{display:flex;gap:7px;align-items:flex-start;font-size:10.5px;line-height:1.35}
.bk .wz-leg b{font-weight:600}
.bk .wz-bol{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;padding:0 3px;box-sizing:border-box;border-radius:999px;color:var(--perk-l);font-family:'IM Fell English',serif;font-size:9.5px;line-height:1}
.bk .wz-be{font-family:'IM Fell English',serif;font-size:14px;text-align:center;margin:10px 0 0}
.bk .wz-fam{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.bk .wz-fam p{margin:0}.bk .wz-fn{display:flex;gap:6px;align-items:center;font-family:'IM Fell English',serif;font-size:15px;margin-top:6px!important}
.bk .wz-fs{font-size:10.5px;line-height:1.4;margin-top:2px!important}.bk .wz-fb{font-size:10px;font-style:italic;color:var(--sepia)}
.pv-vk .wz-zoom{width:auto}.pv-vk .wz-zoom button{padding:0 14px;font-size:14px}

/* Uit het archief: de akten (7-11-2026) */
.bk .ak-stuk{position:relative;width:100%;overflow:hidden;border:1px solid var(--bk-rand);box-shadow:0 1px 3px rgba(58,38,20,.2);background:var(--perk)}
.bk .ak-stuk img{position:absolute;max-width:none;height:auto;filter:sepia(.1)}
.bk .ak-bs{margin:3px 0 8px}
.bk .ak-k{font-family:'Plus Jakarta Sans',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--lak);margin:6px 0 2px}
.bk .ak-trans{font-family:'IM Fell English',serif;font-style:italic;font-size:14px;line-height:1.45;white-space:pre-line;margin:0 0 8px}
.bk .ak-l{border-top:2px solid var(--lak);padding:7px 0 12px}
.bk .ak-l p{margin:0}.bk .ak-lt{display:flex;gap:8px;align-items:baseline;font-family:'IM Fell English',serif;font-size:17px}.bk .ak-lt span:first-child{flex:1}.bk .ak-z{font-size:11px}
.bk .ak-lw{font-size:10.5px;font-style:italic;color:var(--sepia);margin:1px 0 5px!important}
.bk .ak-lg{margin-bottom:3px!important}
.bk .ak-lq{font-family:'IM Fell English',serif;font-style:italic;font-size:12.5px;color:var(--sepia);margin:2px 0 4px!important}
.pv-ak .ak-tel{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;justify-content:space-between;border:1px solid var(--grijs-200);border-radius:14px;padding:14px 16px}.pv-ak .ak-tel>div{display:flex;flex-direction:column;gap:2px}
.pv-ak .ak-k2{margin:0 0 6px;font-size:14px;font-weight:800}
/* Tot slot en bijlagen (7-11-2026): slotwoord, open vragen, register, akten en archieven */
.bk .sw-h{font-size:30px;margin-bottom:16px}
.bk .sw-naam{font-family:'Pinyon Script',cursive;font-size:24px;margin:16px 0 0;color:var(--galnoot)}
.bk .sw-naam.vbt{color:var(--sepia)}
.bk .sw-pl{font-size:11px;font-style:italic;color:var(--sepia);margin:0}
.bk .sw-orn{position:absolute;left:0;right:0;bottom:70px;text-align:center}
.bk .bl-sub{font-size:12px;margin:-4px 0 8px}
.bk .bl-kop{font-family:'Plus Jakarta Sans',sans-serif;font-size:8.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--lak);border-bottom:1px solid var(--bk-rand);padding:6px 0 3px;margin-top:4px}
.bk .bl-r{display:flex;justify-content:space-between;gap:10px;font-size:10.5px;line-height:15.5px;border-bottom:1px dotted var(--bk-rand)}
.bk .bl-r i{font-style:normal;font-size:9px;color:var(--sepia)}
.bk .bl-r span:last-child{color:var(--sepia);font-size:9.5px;white-space:nowrap}
.bk .bl-arch{font-family:'IM Fell English',serif;font-size:14px;margin:8px 0 2px}
.bk .bl-ak{display:grid;grid-template-columns:34px 1fr;gap:6px;font-size:9.8px;line-height:14px}
.bk .bl-ak span:first-child{color:var(--lak)}
.bk .bl-ak i{font-style:normal;color:var(--sepia)}
.bk .bl-voet{margin-top:10px}
.bk .ov-r{display:flex;gap:8px;padding:6px 0;border-bottom:1px solid var(--bk-rand)}
.bk .ov-o{color:var(--lak);font-size:12px}
.bk .ov-r>div{flex:1}
.bk .ov-v{margin:0;font-size:11.5px;line-height:1.4}
.bk .ov-r .bron{margin:2px 0 0}
.bk .ov-l{border-bottom:1px dotted var(--sepia);height:14px}
/* De stamboom als kwartierstaat (7-11-2026): één pagina, over twee pagina's, of hem en haar; vier stijlen zoals de waaier */
.bk .pg.kw{padding:0}
.bk .kw-pag{position:absolute;inset:0;overflow:hidden}
.bk .kw-kop{position:absolute;left:var(--bk-mz);top:38px;right:var(--bk-mz)}
.bk .kw-k{font-family:'Plus Jakarta Sans',sans-serif;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.bk .kw-t{font-size:27px;line-height:1.15;margin-top:4px}
.bk .kw-veld{position:absolute;top:0;bottom:0}
.bk .kw-l{position:absolute;display:block}
.bk .kw-v{position:absolute;box-sizing:border-box;border-radius:3px;padding:2px 6px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.bk .kw-v b{display:block;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk .kw-v small{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:7.5px;white-space:nowrap}
.bk .kw-v.st{writing-mode:vertical-rl;padding:4px 2px;justify-content:flex-start}
.bk .kw-nu{position:absolute;left:var(--bk-mz);font-size:10px;line-height:15px}
.bk .kw-nu>b{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:8px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:3px}
.bk .kw-voet{position:absolute;left:var(--bk-mz);bottom:44px;font-family:'Plus Jakarta Sans',sans-serif;font-size:8px}
.bk .boom-r.veel{flex-wrap:wrap}
.bk .boom-r.veel .cel{flex:0 0 calc(12.5% - 4px);font-size:8px;padding:4px 1px}
/* De verjaardagskalender in de vier stijlen van de waaier en de stamboom (7-11-2026); kleuren als --k-* op .kal-st */
.bk .kal-st{color:var(--k-t);font-family:var(--k-f)}
.bk .kal-bg{position:absolute;inset:0;background:var(--k-pap);pointer-events:none}
.bk .kal-st>*:not(.kal-bg){position:relative}
.bk .kal-st .kk,.bk .kal-st .bron{color:var(--k-s)}
.bk .kal-st .h,.bk .kal-st .h2{font-family:var(--k-k);color:var(--k-t)}
.bk .kal-st .t{color:var(--k-t)}
.bk .kal-st .kal>div{border-top-color:var(--k-a)}
.bk .kal-st .kal-m,.bk .kal-st .kald-m{font-family:var(--k-k);color:var(--k-t)}
.bk .kal-st .kald-m{border-bottom-color:var(--k-a)}
.bk .kal-st .kal-r.oud,.bk .kal-st .kald-r .oud,.bk .kal-st .kald-r span:first-child{color:var(--k-s)}
.bk .kal-st .kal-lijn,.bk .kal-st .kald-r{border-bottom-color:color-mix(in srgb,var(--k-l) 40%,transparent)}
.bk .kal-st .kader{border-color:color-mix(in srgb,var(--k-l) 55%,transparent);background:color-mix(in srgb,var(--k-l) 10%,var(--k-pap))}
.bk .kal-st .kader b{color:var(--k-a)}
.bk .kal-st .kalrad .kr-o,.bk .kal-st .kalrad .kr-sp{stroke:color-mix(in srgb,var(--k-l) 55%,transparent)}
.bk .kal-st .kalrad .kr-ring{stroke:var(--k-a)}
.bk .kal-st .kalrad .kr-c{fill:var(--k-m);stroke:none}
.bk .kal-st .kalrad .kr-t{fill:var(--k-mt);font-family:var(--k-mff)}
.bk .kal-st .kalrad .kr-m{font-family:var(--k-k);fill:var(--k-t)}
.bk .kal-st .kalrad .kr-p,.bk .kal-st .kalrad .kr-n{fill:var(--k-t)}
.bk .kal-st .kalrad .kr-n{font-family:var(--k-f)}
.bk .kal-st .kalrad .kr-p.oud,.bk .kal-st .kalrad .kr-n.oud{fill:var(--k-s)}
/* Familiekleuren: maandnamen op een vlak in de kleur van de waaier */
.bk .kal-kleuren .mk{background:var(--mf);padding:1px 7px;border-radius:2px}
.bk .kal-kleuren .kal>div{border-top:0}
.bk .kal-kleuren .kald-m.mk{border-bottom:0;margin-bottom:3px}
.bk .kal-kleuren .kalrad .kr-ring{stroke:var(--k-pap);stroke-width:1.4}
.bk .kal-kleuren .kalrad .kr-sp{stroke:var(--k-pap)}
/* Modern: strak, dunne lijnen, maand in kapitalen */
.bk .kal-modern .kal>div{border-top-width:1px}
.bk .kal-modern .kal-m,.bk .kal-modern .kald-m{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.bk .kal-modern .kald-m{border-bottom-width:1px;padding-bottom:4px;margin-bottom:4px}
.bk .kal-modern .h{font-weight:600;letter-spacing:-.01em}
.bk .kal-modern .kalrad .kr-m{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
/* Zwart-wit: sierlijke letter, maanden cursief */
.bk .kal-zwartwit .kal-m,.bk .kal-zwartwit .kald-m{font-style:italic}
.bk .kal-zwartwit .kal>div{border-top-width:1px}
.bk .kal-zwartwit .kald-m{border-bottom-width:1px}
.bk .kal-kleuren .kal-r,.bk .kal-kleuren .kald-r,.bk .kal-kleuren .kalrad .kr-n{font-family:'Source Serif 4',Georgia,serif}

/* de familie van nu als stamboom (8-11-2026): paren naast elkaar, kinderen eronder, met lijnen */
.bk .nb{position:relative;margin:18px auto 0}
.bk .nb-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.bk .nb-l line{stroke:#9C8358;stroke-width:1;vector-effect:non-scaling-stroke}
.bk .nb-c{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;box-sizing:border-box;border:1px solid #3D2A10;background:#FBF7EE;padding:1px 2px;line-height:1.15;overflow:hidden;overflow-wrap:normal;word-break:normal;hyphens:manual}
.bk .nb-c.ik{font-weight:700;border-width:1.5px}
.bk .nb-c.hl{background:#F6E3C6;box-shadow:0 0 0 2px #9E2B25}

/* te breed voor een tekening: ingesprongen lijst met lijnen */
.bk .nl,.bk .nl ul{list-style:none;margin:0;padding:0}
.bk .nl{margin-top:14px;font-size:9.5px;line-height:1.35;columns:2;column-gap:18px}
.bk .nl>li{break-inside:avoid;margin-bottom:5px}
.bk .nl ul{margin-left:6px;padding-left:9px;border-left:1px solid #B79A63}
.bk .nl ul>li{position:relative}
.bk .nl ul>li::before{content:'';position:absolute;left:-9px;top:7px;width:7px;border-top:1px solid #B79A63}
.bk .nl-p{padding:1px 0}
.bk .nl-p i{color:#8C6A3C;font-style:normal}
.bk .nl .ik{font-weight:700}
.bk .nl .hl{background:#F6E3C6;box-shadow:0 0 0 2px #F6E3C6}

/* ---------- PV2: de preview volgens het redesign "De nieuwe schermen" (8-11-2026) ----------
   Niveau 1: inhoud als compacte rijen links (300px), het boek rechtsboven, instellingen eronder.
   Niveau 2: de inhoud schuift in tot symbolen; de instellingen staan links naast het boek. */
.pv.pv-n1{grid-template-columns:300px minmax(0,1fr);grid-template-areas:"fase fase" "links kijker";column-gap:28px}
.pv.pv-n2{grid-template-columns:56px 400px minmax(0,1fr);grid-template-areas:"fase fase fase" "rail zij kijker";column-gap:20px}
.pv-fase{grid-area:fase;margin:0;padding:10px 14px;border-radius:12px;background:var(--zacht-warm);border:1px solid var(--perk-r);font-size:15px}
.pv-kijker>.k-gids{width:100%;box-sizing:border-box;margin:0}
.k-gids-ander{border:0;background:none;color:var(--kobalt);cursor:pointer;font-family:inherit;padding:0 6px;min-height:40px}
.k-gids-ander:hover{text-decoration:underline}
/* het kaartje boven de inhoud */

/* de lijst */
.pv-lijstkop{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 0}
.pv-lijstkop>span{font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--grijs-600)}
.pv-volg{font-size:13px;font-weight:700;min-height:32px}
.pv-sorteer-uitleg{margin:0;padding:8px 10px;border-radius:10px;background:var(--kobalt-25);font-size:13px;color:var(--inkt)}
.pv-n1 .pv-toc,.pv-n1 .pv-grp-in{gap:1px}
.pv-n1 .pv-toc.sorteer .pv-grp-in{gap:2px}
.pv-n1 .pv-grp{gap:2px}
.pv-n1 .pv-greep{padding-top:8px}
.pv-rij{display:flex;align-items:center;gap:8px;padding-left:4px}
.pv-rij.sub{padding-left:22px}
.pv-vink{flex:none;width:18px;height:18px;margin:0;accent-color:var(--inkt);cursor:pointer}
.pv-slot{flex:none;width:18px;display:flex;justify-content:center;color:var(--grijs-400)}
.pv-n1 .pv-sec{flex:1;min-width:0;display:flex;align-items:center;gap:8px;min-height:36px;padding:2px 6px;border:1px solid transparent;border-radius:10px;background:transparent;box-shadow:none}
.pv-n1 .pv-sec:hover{background:var(--grijs-50);border-color:var(--grijs-200)}
.pv-n1 .pv-sec.sel{border:2px solid var(--kobalt);background:var(--kobalt-25);box-shadow:none}
.pv-n1 .pv-sec.gew{border-color:var(--geel-r)}
.pv-n1 .pv-rij.uit .pv-sec{color:var(--grijs);cursor:pointer}
.pv-n1 .pv-rij.uit .pv-ik{opacity:.6}
.pv-nm{flex:1;min-width:0;font-size:13.5px;font-weight:700;line-height:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pv-rij.uit .pv-nm{font-weight:600}
.pv-p{font-size:11.5px;color:var(--grijs);white-space:nowrap}
.pv-n1 .pv-st{font-size:11px;padding:2px 7px}
.pv-st.maak{background:var(--grijs-100);color:var(--grijs-700)}
.pv-st.leeg{background:var(--geel);color:var(--bruin)}
.pv-n1 .pv-st.uit{border-width:1px;color:var(--grijs);border-color:var(--grijs-300);border-style:solid;font-weight:700}
.pv-n1 .pv-vbk{margin:0 0 4px 52px;font-size:12.5px}
.pv-ik{position:relative;flex:none;width:30px;height:30px;border-radius:8px;background:var(--grijs-100);color:var(--grijs-700);display:flex;align-items:center;justify-content:center}
.pv-ik.sel{background:var(--inkt);color:#fff}
.pv-ik-n{position:absolute;right:-5px;top:-5px;min-width:18px;height:18px;padding:0 4px;box-sizing:border-box;border-radius:999px;background:var(--kobalt,#2B4EFF);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
/* niveau 1: de instellingen onder het boek */
.pv-inst{width:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:10px}
.pv-inst.kort{flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px;padding:12px 14px;border:1px solid var(--grijs-200);border-radius:14px;background:#fff}
.pv-inst-t{flex:1;min-width:220px;font-size:15px;color:var(--grijs-700)}
.pv-inst-k{min-height:44px;font-size:15px;padding:0 16px}
.pv-inst-kop{display:flex;align-items:center;gap:10px}
.pv-inst-kop b{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--grijs-600)}
.pv-i{width:28px;height:28px;border-radius:999px;border:1.5px solid var(--grijs-300);background:#fff;color:var(--grijs-700);font:italic 700 14px/1 Georgia,serif;cursor:pointer;flex:none}
.pv-i[aria-pressed="true"]{background:var(--inkt);border-color:var(--inkt);color:#fff}
.pv-ruim{margin-left:auto;font-size:14px;font-weight:700;min-height:32px}
/* compact: zonder ⓘ geen uitlegregels in de instellingen */
.pv-inst:not(.uitleg) .pv-fk>p.mj-stil,.pv-inst:not(.uitleg) .pv-wv>p.mj-stil,.pv-inst:not(.uitleg) .pv-vk-kop p.mj-stil,.pv-inst:not(.uitleg) .pv-wv h2+p,.pv-inst:not(.uitleg) .pv-fk h2+p{display:none}
.pv-inst:not(.uitleg) [role="radio"] small,.pv-inst:not(.uitleg) [role="radiogroup"] small{display:none}
.pv-inst .pv-wv,.pv-inst .pv-fk{padding:14px;gap:12px}
.pv-inst .pv-wv h2,.pv-inst .pv-fk h2,.pv-inst .pv-fk-t{display:none}
.pv-inst .pv-vk-kop{align-items:center}
/* niveau 2: symbolen links, instellingen naast het boek */
.pv-rail{grid-area:rail;position:sticky;top:calc(var(--kb-h,0px) + 12px);border-right:1px solid var(--grijs-200)}
.pv-rail ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1px}
.pv-ri{position:relative;width:46px;height:38px;border:0;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:8px}
.pv-ri:hover .pv-ik{background:var(--grijs-200)}.pv-ri:hover .pv-ik.sel{background:var(--inkt)}
.pv-ri:focus-visible{outline:3px solid var(--kobalt);outline-offset:1px}
.pv-tip{display:none;position:absolute;left:50px;top:50%;transform:translateY(-50%);z-index:30;width:230px;padding:10px 12px;border-radius:10px;background:var(--inkt);color:#fff;text-align:left;font-size:13px;line-height:18px;box-shadow:0 8px 24px rgba(16,24,40,.25);pointer-events:none}
.pv-tip b{display:block;font-size:14px}.pv-tip em{display:block;margin-top:4px;font-style:normal;color:var(--grijs-300);font-size:12px}
.pv-ri:hover .pv-tip,.pv-ri:focus-visible .pv-tip{display:block}
.pv-zij{grid-area:zij;display:flex;flex-direction:column;gap:12px;min-width:0;position:sticky;top:calc(var(--kb-h,0px) + 12px);max-height:calc(100vh - var(--kb-h,0px) - 24px);overflow:auto;padding:2px 4px 16px 2px}
.pv-zij-kop{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pv-zij-kop h2{margin:0;font-size:22px}
.pv-zij-x{width:40px;height:40px;border-radius:999px;border:1px solid var(--grijs-200);background:#fff;font-size:22px;line-height:1;cursor:pointer;color:var(--grijs-700);flex:none}
.pv-zij-x:hover{border-color:var(--grijs-400)}
.pv-zij .pv-wv,.pv-zij .pv-fk{padding:14px}
.pv-zij .pv-wv h2,.pv-zij .pv-fk h2,.pv-zij .pv-fk-t{font-size:16px}
.pv-n2 .pv-kijker{min-width:0}
.pv-vw{display:flex;flex-direction:column;gap:12px}
.pv-vw-vb{display:flex;gap:8px;flex-wrap:wrap}
.pv-vw-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pv-vw textarea{min-height:220px}
.pv-vw-st{margin:0;font-size:13px}
.pv-vw-geen{align-self:flex-start}
@media (max-width:1100px){.pv.pv-n1{grid-template-columns:270px minmax(0,1fr)}.pv.pv-n2{grid-template-columns:56px 340px minmax(0,1fr)}}
@media (max-width:820px){
  .pv.pv-n1,.pv.pv-n2{grid-template-columns:minmax(0,1fr);grid-template-areas:"fase" "kijker" "links"}
  .pv-rail,.pv-zij{display:none}
  .pv-n1 .pv-sec{min-height:44px}
  .pv-vink{width:22px;height:22px}
  .pv-inst-k{width:100%}
}

/* niveau 2: de smalle zijkolom stapelt alles onder elkaar */
.pv-zij .pv-wv-rij,.pv-zij .bm-twee{grid-template-columns:minmax(0,1fr)}
.pv-zij .wv-stijlen,.pv-zij .vk-vormen{grid-template-columns:repeat(2,minmax(0,1fr))}
.pv-zij .wv-vormen{grid-template-columns:repeat(3,minmax(0,1fr))}
.pv-zij .sl-bij{grid-template-columns:1fr auto}
.pv-zij .av-r{grid-template-columns:auto 1fr}.pv-zij .av-vorm{grid-column:2}
.pv-zij .pv-vk .vk-in{width:100%}
.pv-rail{z-index:40}
.pv-n1 .pv-nm{font-size:13px}.pv-n1 .pv-st{padding:2px 6px;font-size:10.5px}
/* namen mogen over twee regels in de inhoud (niet afkappen) */
.pv-nm{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:1100px) and (min-width:821px){.pv-n1 .pv-p{display:none}.pv-n1 .pv-ik{width:26px;height:26px}}
.pv-tip b{color:#fff}
/* Hoofdstukken onder het boek (board "Hoofdstuk") en Hun tijd naast het boek (board "HunTijd") */
.pv-hf-rij{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:flex-start}
.pv-hf-c{display:flex;flex-direction:column;gap:4px;min-width:120px}
.pv-hf-c b{font-size:14px}.pv-hf-c small{font-size:12.5px;color:var(--grijs)}
.pv-hf-c .mj-link{font-size:14px;font-weight:700;align-self:flex-start;min-height:28px}
.pv-hf-k{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--grijs-600)}
.pv-hf-vorm{display:inline-flex;gap:4px;padding:4px;background:var(--grijs-100);border-radius:10px}
.pv-hf-vorm button{min-height:34px;padding:0 12px;border:0;border-radius:8px;background:transparent;font:inherit;font-size:13.5px;font-weight:700;color:var(--grijs-700);cursor:pointer}
.pv-hf-vorm button.aan{background:#fff;color:var(--inkt);box-shadow:0 1px 3px rgba(16,24,40,.15)}
.pv-inst .pv-hf-n2deel,.pv-zij .pv-hf-n2{display:none}
.pv-hf-n2deel h3{margin:6px 0 4px;font-size:16px}
.pv-hf-tijd{list-style:none;margin:0;padding:0}
.pv-hf-tijd li{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--grijs-200)}
.pv-hf-tt b{display:block;font-size:14px}.pv-hf-tt small{font-size:12px;color:var(--grijs)}
.pv-hf-tt details{margin-top:2px;font-size:13px}.pv-hf-tt summary{cursor:pointer;color:var(--kobalt);font-weight:700}
.pv-hf-tt p{margin:6px 0 0;padding:8px 10px;border-radius:8px;background:var(--perk-l);line-height:1.45}
.pv-sw{width:48px;height:28px;border-radius:999px;border:0;background:var(--grijs-300);position:relative;cursor:pointer;flex:none}
.pv-sw i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:999px;background:#fff;transition:left .15s}
.pv-sw[aria-checked="true"]{background:var(--groen)}.pv-sw[aria-checked="true"] i{left:23px}
.pv-sw[disabled]{opacity:.5;cursor:default}
/* een lege pagina nodigt uit (board "LegePagina") */
.pv-leeg{position:absolute;left:3%;top:22%;width:44%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 16px;border-radius:14px;background:rgba(255,255,255,.94);border:1.5px dashed var(--kobalt);text-align:center;z-index:2}
.pv-leeg b{font-size:17px}.pv-leeg span{font-size:14px;color:var(--grijs-700)}
.pv-leeg .mj-knop{margin-top:6px;min-height:44px;font-size:15px;padding:0 18px}
.st-rood{color:var(--rood)}
@media (max-width:820px){.pv-leeg{left:6%;width:88%;top:30%}}
/* Voorkant onder het boek */
.pv-om-v{display:flex;flex-direction:column;gap:6px}
.pv-om-v input{height:40px;box-sizing:border-box;padding:0 10px;border:1.5px solid var(--grijs-300);border-radius:10px;font:inherit;font-size:14px;max-width:100%}
.pv-om-rij{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pv-om .vk-voorrij{display:flex;align-items:center;gap:6px}
.pv-om-kleuren{display:flex;gap:6px}
.pv-om-k{width:40px;height:40px;border-radius:10px;border:1px solid var(--grijs-300);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.pv-om-k i{display:block;width:12px;height:24px;border-radius:2px}
.pv-om-k.aan{border:2px solid var(--kobalt)}
.pv-om-foto{align-self:flex-start;font-size:13px;font-weight:700;min-height:28px}
/* telefoon: symbolenstrook, kopregel met Volgende, en de instellingen als onderblad (boards M_…) */
.pv-strook,.pv-mkop{display:none}
@media (max-width:820px){
  .pv.pv-mob{grid-template-areas:"fase" "strook" "mkop" "kijker" "links";row-gap:8px}
  .pv-strook{grid-area:strook;display:flex;align-items:center;position:relative;margin:0 -16px;border-bottom:1px solid var(--grijs-200)}
  .pv-strook-in{display:flex;gap:2px;overflow-x:auto;padding:4px 50px 4px 8px;scrollbar-width:none}
  .pv-strook-in::-webkit-scrollbar{display:none}
  .pv-strook .pv-ri{flex:none;width:44px;height:44px}
  .pv-strook .pv-ri.sel{box-shadow:inset 0 -3px 0 var(--kobalt)}
  .pv-strook-alle{position:absolute;right:0;top:0;bottom:0;width:54px;border:0;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 45%);font-size:20px;text-align:right;padding-right:12px;cursor:pointer;color:var(--inkt)}
  .pv-mkop{grid-area:mkop;display:flex;align-items:center;gap:8px;min-height:48px}
  .pv-mkop b{font-size:18px}

  .pv-blad{position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-radius:20px 20px 0 0;box-shadow:0 -8px 24px rgba(16,24,40,.14);max-height:76px;overflow:hidden;padding:0 16px;transition:max-height .2s}
  .pv-blad.open{max-height:78vh;overflow-y:auto;padding-bottom:24px}
  .pv-blad-greep{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;min-height:72px;border:0;background:#fff;cursor:pointer;font:inherit;position:sticky;top:0;z-index:1;padding:8px 0}
  .pv-blad-streep{width:40px;height:5px;border-radius:999px;background:var(--grijs-300);margin-bottom:4px}
  .pv-blad-greep b{font-size:15px}.pv-blad-greep span{font-size:12px;color:var(--grijs)}
  .pv.pv-mob:has(.pv-blad){padding-bottom:96px}
  .pv-blad .pv-wv,.pv-blad .pv-fk{border:0;padding:0}
}
@media (prefers-reduced-motion:reduce){.pv-blad{transition:none}}
@media (max-width:820px){.pv-mob .pv-boven .mj-kicker{visibility:hidden}}
/* Alleen de variant met de symbolen (Ortwin 8-11-2026): symbolenbalk, paneel, boek */
.pv-rail{display:flex;flex-direction:column;gap:6px}
.pv-ri.uit .pv-ik{background:transparent;border:1.5px dashed var(--grijs-300);color:var(--grijs-400)}
.pv-ri.uit.sel .pv-ik{background:var(--grijs-100);border-color:var(--kobalt);color:var(--inkt)}
.pv-ri-volg{margin-top:4px;border-top:1px solid var(--grijs-200);border-radius:0;padding-top:6px;height:46px}
.pv-ik-ok{position:absolute;right:-5px;bottom:-5px;width:16px;height:16px;border-radius:999px;background:var(--groen);color:#fff;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
.pv-zij-kop{flex-wrap:wrap}

.pv-st.ok{background:#ECFDF3;color:var(--groen)}
.pv-zij .pv-st.uit{border:1px solid var(--grijs-300);color:var(--grijs);padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700}
.pv-zijstd,.pv-uitp{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:14px;border:1px solid var(--grijs-200);border-radius:14px}
.pv-zijstd p,.pv-uitp p{margin:0;font-size:15px}
.pv-zijstd .mj-knop,.pv-uitp .mj-knop{min-height:44px;font-size:15px;padding:0 16px}

.pv-volg-klaar{min-height:40px;padding:0 16px}
.pv-zij .pv-toc .pv-sec{flex:1;min-width:0;display:flex;align-items:center;gap:8px;min-height:36px;padding:2px 6px;border:1px solid transparent;border-radius:10px;background:transparent;box-shadow:none}
.pv-zij .pv-toc .pv-sec.sel{border:2px solid var(--kobalt);background:var(--kobalt-25)}
.pv-zij .pv-toc .pv-st{font-size:10.5px;padding:2px 6px}
.pv-zij .pv-grp{display:flex;gap:4px;align-items:flex-start}.pv-zij .pv-grp-in{flex:1;display:flex;flex-direction:column;gap:1px}
.pv-zij .pv-over,.pv-zij .pv-nietgezien,.pv-zij .pv-eind{margin-top:4px}
@media (max-width:820px){
  .pv-mob .pv-links{display:none}
  .pv-mob .pv-links.open{display:flex}
  .pv-mob .pv-toc .pv-sec{flex:1;min-width:0;display:flex;align-items:center;gap:8px;min-height:44px;padding:2px 6px;border:1px solid transparent;border-radius:10px;background:transparent;box-shadow:none}
  .pv-mob .pv-toc .pv-sec.sel{border:2px solid var(--kobalt);background:var(--kobalt-25)}
  .pv-strook .pv-ri.uit .pv-ik{border-style:dashed}
  .pv-inst.kort .pv-uitp{border:0;padding:0}
}
.pv-zij .pv-toc.sorteer{display:flex;flex-direction:column;gap:2px}
.pv-zij .pv-toc.sorteer .pv-slot{width:28px;justify-content:center;padding-top:10px}
.pv-zij .pv-toc.sorteer .pv-greep{width:28px}
.pv-zij .pv-toc.sorteer .pv-grp{align-items:center}.pv-zij .pv-toc.sorteer .pv-slot{padding-top:0}.pv-zij .pv-toc.sorteer .pv-greep{padding-top:0}
/* onder het boek: akkoord (en de volgende stap) naast Deel; de uitleg bij Deel verschijnt bij de muis erover */

.pv-acties-st{display:contents}

/* Tabbladen Instellingen en Voorbeeld (eerst bij de voorkant) */
.pv.pv-tabs-inst{grid-template-columns:56px minmax(0,1fr) 250px;grid-template-areas:"rail kop kop" "rail tvak mini";column-gap:24px;row-gap:14px}
.pv.pv-tabs-vb{grid-template-columns:56px minmax(0,1fr);grid-template-areas:"rail kop" "rail kijker";column-gap:20px;row-gap:14px}
.pv-tabs-inst .pv-rail,.pv-tabs-vb .pv-rail{grid-row:1 / span 2}
.pv-tabkop{grid-area:kop;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pv-tabkop h2{margin:0;font-size:26px}
.pv-tabs{display:flex;gap:4px;padding:4px;border-radius:12px;background:var(--grijs-100)}
.pv-tabs button{min-height:44px;padding:0 16px;border:0;border-radius:9px;display:flex;align-items:center;gap:8px;font:inherit;font-size:15px;font-weight:700;cursor:pointer;background:transparent;color:var(--grijs-600)}
.pv-tabs button[aria-selected="true"]{background:#fff;color:var(--inkt);box-shadow:0 1px 3px rgba(16,24,40,.18)}
.pv-tabvak{grid-area:tvak;min-width:0;display:flex;flex-direction:column;gap:14px}
.pv-tabvak .pv-om .pv-hf-rij{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 28px}
.pv-tabvak .pv-om input{width:100%!important}
.pv-tabvak .pv-wv{padding:20px}
.pv-mini-w{grid-area:mini;display:flex;flex-direction:column;gap:14px;position:sticky;top:calc(var(--kb-h,0px) + 12px);align-self:start}
.pv-mini{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px;border:1.5px solid var(--grijs-200);border-radius:14px;background:#fff;cursor:pointer;font:inherit;width:100%}
.pv-mini:hover{border-color:var(--kobalt)}
.pv-mini-pg{display:block;width:200px;height:283px;overflow:hidden;box-shadow:0 6px 18px rgba(16,24,40,.16)}
.pv-mini-in{display:block;width:500px;transform:scale(.4);transform-origin:0 0}
.pv-mini-l{font-size:14px;font-weight:700;color:var(--kobalt)}

.pv-tabs-vb .pv-kijker{grid-area:kijker}
.pv.pv-tabs-inst,.pv.pv-tabs-vb{grid-template-rows:auto 1fr;align-content:start}
.pv-tabvak .pv-om input{width:auto!important}
.pv-tabvak .pv-om input:not([type=checkbox]){width:100%!important}
.pv-tabvak .pv-om .pv-om-v:last-child{grid-column:1 / -1}
.pv-mini-pg{pointer-events:none}
.pv-tabvak .pv-vw{padding:20px;border:1px solid var(--grijs-200);border-radius:14px}
.pv-tabvak .pv-vw textarea{min-height:300px}
.pv-mini-in.breed{width:1000px;transform:scale(.2)}
.pv-mini-pg:has(.breed){height:142px}
.pv-tabvak .pv-hf-n2{display:none}
.pv-mini-w .st-knop{white-space:normal;height:auto;min-height:48px;text-align:center;line-height:1.3;padding-top:10px;padding-bottom:10px}
.pv-nav .pv-uk-aan{min-height:40px;padding:0 16px;font-size:15px}
/* Familieleden (claude/plan-onderdeel-de-familie.md, 8-11-2026): per generatie, twee kolommen */
.bk .fl-s{margin-top:8px}
.bk .fl-k{display:flex;align-items:baseline;justify-content:space-between;gap:10px;border-bottom:1px solid var(--bk-rand);padding-bottom:4px;margin-bottom:5px}
.bk .fl-h{margin:0;font-family:'IM Fell English',serif;font-size:19px;line-height:1.15;color:var(--galnoot)}
.bk .fl-k span{font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;letter-spacing:.06em;color:var(--sepia);white-space:nowrap}
.bk .fl-t{margin:0 0 9px;font-size:11px;line-height:1.45;font-style:italic;color:#4A3B28}
.bk .fl-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;align-items:start}
.bk .fl-p{min-width:0;max-height:192px;overflow:hidden;display:flex;flex-direction:column;gap:3px}
.bk .fl-r{display:flex;align-items:center;gap:9px;min-width:0}
.bk .fl-b{flex:none;width:52px;height:52px;border-radius:999px;object-fit:cover;display:block}
.bk .fl-g.vk .fl-b{border-radius:3px}
.bk .fl-ini{box-sizing:border-box;background:var(--perk);border:1px solid var(--bk-rand);display:flex;align-items:center;justify-content:center;font-family:'IM Fell English',serif;font-size:19px;color:var(--sepia)}
.bk .fl-g.sep .fl-b,.bk .fl-g.sep .fl-akte{filter:sepia(.85) saturate(.8) contrast(.95)}
.bk .fl-n{min-width:0;display:flex;flex-direction:column}
.bk .fl-n b{font-size:13px;line-height:1.2;font-weight:700}
.bk .fl-n span{font-family:'Plus Jakarta Sans',sans-serif;font-size:9.5px;color:var(--sepia)}
.bk .fl-o,.bk .fl-v,.bk .fl-a,.bk .fl-tr,.bk .fl-bron{margin:0;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.bk .fl-o{font-size:10.6px;line-height:1.35;-webkit-line-clamp:2}
.bk .fl-v{font-size:10.2px;line-height:1.35;color:#3B2E1F;-webkit-line-clamp:3}
.bk .fl-a{font-family:'Plus Jakarta Sans',sans-serif;font-size:8.2px;line-height:1.35;color:#7A6440;-webkit-line-clamp:2}
.bk .fl-akte{overflow:hidden;border-radius:2px}
.bk .fl-akte .ak-stuk{margin:0}
.bk .fl-bron{font-family:'Plus Jakarta Sans',sans-serif;font-size:7.5px;letter-spacing:.08em;text-transform:uppercase;color:#8A7658;-webkit-line-clamp:1}
.bk .fl-tr{font-size:9.6px;line-height:1.3;font-style:italic;color:#4A3B28;-webkit-line-clamp:2}
.bk .fl-kaart{box-sizing:border-box;padding:6px 8px;border:1px dashed #C7B48C;border-radius:3px;background:var(--perk);font-size:9.6px;line-height:1.3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.bk .fl-kaart span{display:block;font-family:'Plus Jakarta Sans',sans-serif;font-size:7.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sepia);margin-bottom:2px}
.bk .fl-nog{margin-top:14px}
.bk .fl-nog .lijn{height:24px;border-bottom:1px solid var(--bk-rand)}
/* Familieleden: instellingen */
.pv-fl .fl-pk{margin:14px 0 8px;font-size:16px}
.pv-fl .fl-twee{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 22px}
.pv-fl .vk-vormen.fl-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pv-fl .vk-vormen.fl-4{grid-template-columns:repeat(3,minmax(0,1fr))}
.pv-fl .vk-vorm{align-items:center}
.pv-fl .fl-noot{margin:8px 0 0;font-size:13px;line-height:19px}
.pv-fl .fl-trans{margin-top:16px}
.pv-fl .fl-trans small{display:block;font-size:13px}
.fl-vb{flex:none;width:36px;height:36px;background:#D9CDB6;border-radius:999px}.fl-vb.vierkant{border-radius:5px}
.fl-kl{flex:none;width:36px;height:36px;border-radius:8px;background:linear-gradient(135deg,#8FA7BF 0 50%,#C89B6D 50% 100%)}.fl-kl.sepia{background:linear-gradient(135deg,#A68F6E 0 50%,#C7A57B 50% 100%)}
@media (max-width:1100px){.pv-fl .vk-vormen.fl-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.pv-fl .fl-twee{grid-template-columns:1fr}}
/* Fotoalbum (ontwerp "Foto's en het familiealbum", 8-11-2026): rijen van 1, 2 of 3, alle foto's 3:2 */
.bk .fa-kop{margin:10px 0 8px;font-family:'IM Fell English',serif;font-size:19px;border-bottom:1px solid var(--bk-rand);padding-bottom:4px}
.bk .fa-rij{display:grid;gap:12px;margin:0 0 14px;align-items:start}
.bk .fa-rij.n1{grid-template-columns:1fr}.bk .fa-rij.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.bk .fa-rij.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.bk .fa-k{margin:0;min-width:0}
.bk .fa-f{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--perk)}.bk .fa-f.p{aspect-ratio:2/3}
.bk .fa-f img{display:block;max-width:none}
.bk .fa-k figcaption{margin-top:5px;display:flex;flex-direction:column;gap:2px}
.bk .fa-k b{font-size:12px;line-height:1.3}
.bk .fa-k b span{font-family:'Plus Jakarta Sans',sans-serif;font-size:9px;font-weight:700;color:var(--sepia)}
.bk .fa-k i{font-size:11px;line-height:1.36;color:#4A3B28}
.bk .fa-rij.n3 b{font-size:10.5px}.bk .fa-rij.n3 i{font-size:10px}
.pv-al .pv-vk-kop .mj-knop{flex:none}.pv-al .vk-vorm .al-bl{margin-right:4px}
/* Telefoon: tabbladen Voorbeeld en Instellingen (Ortwin 9-11-2026) */
.pv-mtabs{margin:4px 0 10px}
.pv-mtabs .pv-tabs button{flex:1;justify-content:center}
.pv-mtabvak{display:flex;flex-direction:column;gap:14px;padding:4px 0 24px}
.pv-mtabvak .pv-mnaarvb{align-self:flex-start;min-height:48px}
@media (max-width:820px){
  .pv.pv-mob.pv-mtabs-vb,.pv.pv-mob.pv-mtabs-inst{grid-template-areas:"fase" "strook" "mkop" "mtabs" "kijker" "links"}
  .pv-mtabs{grid-area:mtabs}
  .pv-mtabs-inst .pv-mtabvak{grid-area:kijker;min-width:0}
}
/* Familiewaaier: generaties met een schuifbalk 3-12 (9-11-2026) */
.wv-gen legend label{cursor:pointer}
.wv-schuif{max-width:360px;margin-top:6px}
.wv-schuif input[type=range]{width:100%;height:28px;accent-color:#2F55FF;cursor:pointer;margin:0}
.wv-schuif input[type=range]:focus-visible{outline:3px solid #2F55FF;outline-offset:3px;border-radius:6px}
.wv-schaal{display:flex;justify-content:space-between;font-size:12px;color:#667085;margin-top:-2px}
.wv-schuif output{display:block;margin-top:6px;font-weight:700;font-size:15px;color:#101828}
/* Wie er nu bij hoort in de vorm van de stamboom (9-11-2026) */
.bk .nb-vak{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 58px);bottom:calc(var(--bk-mo) + (16px));display:flex;align-items:flex-start;justify-content:center;overflow:hidden}
.bk .nb-vak .nb{margin:8px auto 0}
.bk .nb-vak .nl{font-size:11px}
.bk .nb-st .nb-c{border-radius:3px}
.bk .nb-st .nb-c span{display:flex;flex-direction:column;align-items:center;gap:1px;max-width:100%}
.bk .nb-st .nb-c b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.bk .nb-st .nb-c small{font-size:.82em;opacity:.85;font-family:'Plus Jakarta Sans',sans-serif}
.bk .nb-st .nb-c.ik{box-shadow:0 0 0 1.5px currentColor}
/* Familie in cijfers (10-11-2026, designcanvas "Familie in cijfers"): grafieken in boekstijl, getekend door cijfers.js */
.bk .cf{display:flex;flex-direction:column;height:100%}
.bk .cf .cf-h{margin:6px 0 8px}
.bk .cf .cf-t{text-align:left;hyphens:manual;font-size:11.6px;line-height:1.5;margin:0 0 8px;color:#5B3A1E}
.bk .cf .cf-svg{font-family:'Source Serif 4',Georgia,serif;margin:4px 0 8px;flex:none}
.bk .cf .cf-noot{margin:4px 0 0;font-size:9.8px;line-height:1.45;color:#7A6248;font-style:italic}
.bk .cf .cf-leg,.bk .cf .cf-leg2{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:9.8px;color:#5B3A1E}
.bk .cf .cf-leg2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:6px}
.bk .cf .cf-leg i,.bk .cf .cf-leg2 i{display:inline-block;width:14px;height:6px;border-radius:3px;vertical-align:middle;margin-right:4px}
.bk .cf .cf-leg2 i{width:10px;height:10px;border-radius:1px;vertical-align:-1px}
.bk .cf .cf-leg2 b{color:#3A2614}
.bk .cf-tegels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;margin-top:2px}
.bk .cf-tegel{display:flex;flex-direction:column;gap:1px;padding:10px 0;border-top:1px solid #D9CBAE}
.bk .cf-tegel span{font-family:'IM Fell English',serif;font-size:36px;line-height:1}
.bk .cf-tegel b{font-weight:400;font-size:11.8px;line-height:1.4;color:#3A2614}
.bk .cf-tegel i{font-size:9.8px;line-height:1.35;color:#7A6248}
.bk .cf-wist{padding:9px 12px;background:#F3E9D2;font-size:11.4px;line-height:1.5}
.bk .cf-wist b{font-family:'IM Fell English',serif;font-weight:400;font-size:15px;display:block}
.bk .cf-lijn{height:1px;background:#D9CBAE;margin:4px 0 8px}
.bk .cf-drie{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border-top:1px solid #D9CBAE;padding-top:8px;font-size:10.4px;line-height:1.35;color:#3A2614}
.bk .cf-drie span{display:block;font-family:'IM Fell English',serif;font-size:24px;line-height:1.1}
.bk .cf-recs{display:flex;flex-direction:column}
.bk .cf-rec{display:flex;gap:14px;align-items:baseline;padding:10px 0;border-top:1px solid #D9CBAE}
.bk .cf-rec>span:first-child{width:118px;flex:none;font-family:'IM Fell English',serif;font-size:23px;line-height:1.05}
.bk .cf-rec>span:last-child{display:flex;flex-direction:column;gap:2px}
.bk .cf-rec b{font-size:12.5px;color:#3A2614}.bk .cf-rec i{font-style:normal;font-size:11.4px;line-height:1.4;color:#5B3A1E}
/* het paneel onder de preview */
.pv-cf .cf-stand{margin:12px 0 4px;font-size:15px;color:var(--grijs-700,#475467)}
.pv-cf .cf-lijst{list-style:none;margin:0 0 16px;padding:0}
.pv-cf .cf-rij{display:flex;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--grijs-200,#EAECF0)}
.pv-cf .cf-rij .mj-vink{flex:1;min-width:0}
.pv-cf .cf-rij .mj-vink>span{display:flex;flex-direction:column;gap:2px}
.pv-cf .cf-rij small{font-size:13px;color:var(--grijs-600,#475467)}
.pv-cf .cf-st{font-size:12.5px;font-weight:700}.pv-cf .cf-st.ok{color:#067647}.pv-cf .cf-st.mist{color:#B54708}
.pv-cf .cf-vul{font-size:12.5px;font-weight:700;color:var(--kobalt,#1D3BD8)}
.pv-cf .cf-rij.kan-niet b{color:var(--grijs-600,#475467)}
.pv-cf .cf-p{font-size:12.5px;color:var(--grijs-600,#475467);white-space:nowrap}
.pv-cf .cf-rij label .cf-st+.cf-vul{display:inline}

/* ---------- Volgende release (ontwerp "Volgende release familieboek – alle onderdelen", 10-11-2026) ---------- */
/* De kaft zoals in het AI-boek: beeld bovenaan over de hele breedte, tekst en logo onderaan */
.bk .om2{position:absolute;inset:0;color:var(--perk);overflow:hidden}
.bk .om2-beeld{position:absolute;left:0;top:0;width:100%;height:66%}
.bk .om2-beeld img{width:100%;height:100%;object-fit:cover;display:block;filter:sepia(.35) saturate(.85)}
.bk .om2-beeld span{position:absolute;inset:0}
.bk .om2-tekst{position:absolute;left:var(--bk-mz);right:var(--bk-mz);bottom:calc(var(--bk-mo) + (-4px));display:flex;flex-direction:column;gap:9px;text-align:left}
.bk .om2-logo{display:flex;align-items:center;gap:7px;font:800 9px/12px 'Plus Jakarta Sans',sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#C9A877}
.bk .om2-logo img{width:28px;height:28px}
.bk .om2-t{font-family:'IM Fell English',serif;font-size:42px;line-height:1.02;color:var(--perk)}
.bk .om2-o{font-family:'IM Fell English',serif;font-style:italic;font-size:14px;line-height:1.3;color:#E2D2AE}
.bk .om2-v{font-family:'Pinyon Script',cursive;font-size:22px;line-height:1.25;overflow-wrap:break-word}
.bk .om2-v.m{font-size:19px}.bk .om2-v.l{font-size:16px}.bk .om2-v.xl{font-size:13px}
.bk .om2-c{display:flex;gap:22px;margin-top:6px;border-top:1px solid rgba(226,210,174,.45);padding-top:9px}
.bk .om2-c b{display:block;font:400 25px/1 'IM Fell English',serif;color:var(--perk)}
.bk .om2-c span{display:block;font:700 6.5px/9px 'Plus Jakarta Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#E2D2AE;margin-top:3px}
/* Je familie in 10 seconden */
.bk .pg.tienpag{padding:0}
.bk .tien{position:absolute;inset:0;padding:var(--bk-mt) calc(var(--bk-mz) - 6px) var(--bk-mo) var(--bk-mz);display:flex;flex-direction:column;gap:10px;color:var(--perk)}
.bk .tien .kk{color:#E2D2AE}.bk .tien .h{color:var(--perk);font-size:25px;margin:0}
.bk .tien-r{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.bk .tien-t{background:rgba(243,233,210,.08);border:1px solid rgba(226,210,174,.35);border-radius:2px;padding:11px 11px 9px}
.bk .tien-t.groot{grid-column:span 2;background:var(--lak);border-color:#B8473F}
.bk .tien-t b{display:block;font:400 25px/1 'IM Fell English',serif;color:var(--perk)}.bk .tien-t.groot b{font-size:33px}
.bk .tien-t span{display:block;font:700 6.5px/9px 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#E2D2AE;margin-top:5px}
.bk .tien-n{margin:auto 0 0;font:400 7.5px/10px 'Plus Jakarta Sans',sans-serif;color:#E2D2AE}
/* Voorwoord: de aktesnede en de verantwoording */
.bk .vw-snede{margin:0 0 10px;background:var(--perk);border:1px solid var(--bk-rand);padding:7px 10px}
.bk .vw-snede figcaption{font-family:'IM Fell English',serif;font-style:italic;font-size:10px;color:var(--sepia)}
.bk .vw-snede blockquote{margin:2px 0;font-family:'Pinyon Script',cursive;font-size:17px;line-height:1.3;color:var(--galnoot)}
.bk .vw-snede p{margin:0;font:500 7px/10px 'Plus Jakarta Sans',sans-serif;color:#6E5843}
.bk .vw-disc{position:absolute;left:var(--bk-mz);right:var(--bk-mz);bottom:36px;margin:0;padding-top:5px;border-top:1px solid var(--bk-rand);font:400 6px/8.4px 'Plus Jakarta Sans',sans-serif;color:#6E5843}
/* Over deze stamboom */
.bk .tl-arch{width:100%;border-collapse:collapse;font-size:10px;margin-top:6px}
.bk .tl-arch th{text-align:left;font-family:'IM Fell English',serif;font-style:italic;font-weight:400;color:var(--sepia);border-bottom:1px solid var(--bk-rand);padding:4px 3px}
.bk .tl-arch th:last-child,.bk .tl-arch td:last-child{text-align:right}
.bk .tl-arch td{border-bottom:1px solid var(--bk-rand);padding:3px}.bk .tl-arch .rest td{color:#6E5843;border-bottom:0}
/* Zo kwamen ze samen */
.bk .team{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bk .team section{background:#fff;border:1px solid var(--bk-rand);border-top:3px solid;padding:7px 9px}
.bk .team-k{margin:0 0 4px;font-family:'IM Fell English',serif;font-size:13px}
.bk .team-f{margin:0 0 3px;display:flex;gap:5px;font-size:9px;line-height:1.35}.bk .team-f i{font-style:normal;font-weight:800;font-family:'Plus Jakarta Sans',sans-serif}
.bk .team-kaart{margin:8px auto 0;width:100%}.bk .team-kaart .wz-svg{display:block;width:100%;height:auto}
.bk .team-s{margin:6px 0 0;text-align:center;font-family:'IM Fell English',serif;font-style:italic;font-size:11px;color:var(--lak)}
/* Ontmoet je voorouders (8 per pagina, in de stijl van de stamboom) */
.bk .hd{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 54px);display:grid;grid-template-columns:1fr 1fr;gap:7px}
.bk .hd-k{border:1px solid;border-radius:2px;padding:7px 9px;min-height:96px;box-sizing:border-box}
.bk .hd-n{font-size:12.5px;line-height:1.15}.bk .hd-j{font:700 8px/11px 'Plus Jakarta Sans',sans-serif;margin:2px 0 3px}
.bk .hd-r{display:flex;gap:5px;font-size:8.5px;line-height:1.35}.bk .hd-r span:first-child{flex:none;width:44px;font:700 6.5px/12px 'Plus Jakarta Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;opacity:.75}
/* Zo weten we het zeker */
.bk .bw{border-top:2px solid var(--lak);padding:6px 0 10px}.bk .bw p{margin:0}
.bk .bw-k{font:700 6.5px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--lak);margin-top:4px!important}.bk .bw-k.ok{color:#4E6B3A}
.bk .bw-v{font-family:'IM Fell English',serif;font-size:13px;line-height:1.2}
.bk .bw-2{display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:9px;line-height:1.4}
.bk .bw-s{background:var(--perk);padding:3px 7px 5px}
/* Jij en je generatie */
.bk .gn-boom{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 50px);height:230px;display:flex;justify-content:center;overflow:hidden}
.bk .gn-boom .nb{margin:4px auto 0}
.bk .gn-lijst{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 294px);bottom:calc(var(--bk-mo) + (12px));overflow:hidden}
.bk .gn-k{font:700 7px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid;padding-bottom:2px;margin:6px 0 2px}
.bk .gn-r{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.bk .gn-r div{display:flex;justify-content:space-between;gap:6px;border-bottom:1px dotted;font-size:8.5px;line-height:13px}
/* Wist je dat? */
.bk .wj{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bk .wj-k{background:#fff;border:1px solid var(--bk-rand);border-left:3px solid var(--lak);padding:8px 10px}.bk .wj-k.perk{background:var(--perk)}
.bk .wj-k b{display:block;font:400 21px/1 'IM Fell English',serif;color:var(--lak)}.bk .wj-k p{margin:4px 0 0;font-size:9.5px;line-height:1.4}
/* De quiz in het boek */
.bk .qp{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px}
.bk .qp div{border-bottom:1px solid var(--bk-rand);padding-bottom:4px}.bk .qp p{margin:0}
.bk .qp-v{font-weight:600;font-size:9px;line-height:1.3;margin-bottom:2px!important}.bk .qp-o{font-size:8.5px;line-height:1.35;color:var(--sepia)}
.bk .qp-a{margin-top:10px;background:var(--perk);border:1px solid var(--bk-rand);padding:6px 9px}.bk .qp-a span{font:700 6.5px/9px 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--sepia)}
.bk .qp-a p{margin:2px 0 0;transform:rotate(180deg);text-align:right;font-size:8.5px}
/* Jouw hoofdstuk */
.bk .iv{margin-bottom:6px}.bk .iv p{margin:0 0 2px;font-weight:600;font-size:10px}.bk .iv .lijn{height:15px}
/* Akten: 1, 2 of 4 per pagina */
.bk .ak-per4{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.bk .ak-per4 .ak-l .ak-lt{font-size:13px}
.bk .ak-ul{font-size:8.5px;line-height:1.4;color:var(--sepia);margin:4px 0!important}
.bk .ak-heel{border:1px solid var(--bk-rand);margin:4px 0 6px}
.bk .ak-rol{display:grid;grid-template-columns:repeat(3,1fr);gap:1px 10px;font-size:8.5px;line-height:1.35}
.bk .ak-rol span{display:block;font:700 6px/9px 'Plus Jakarta Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#6E5843}
.bk .code-uit{margin:12px 0 0;font-size:8.5px;line-height:1.45;color:var(--sepia);text-align:center}

.bk .hd-leeg{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 74px)}

/* Familieleden compact: 12 per pagina, twee naast elkaar (volgende release) */
.bk .fl-g.dicht{gap:6px 16px}
.bk .fl-g.dicht .fl-p{max-height:74px;gap:1px}
.bk .fl-g.dicht .fl-b{width:34px;height:34px}.bk .fl-g.dicht .fl-ini{font-size:13px}
.bk .fl-g.dicht .fl-n b{font-size:11.5px}.bk .fl-g.dicht .fl-n span{font-size:8.5px}
.bk .fl-g.dicht .fl-o{font-size:9.4px;line-height:1.3;-webkit-line-clamp:2}
.bk .fl-g.dicht .fl-v{display:none}.bk .fl-g.dicht .fl-a{font-size:7.6px;-webkit-line-clamp:1}
.bk .fl-g.dicht~.fl-t,.bk .fl-s .fl-t{margin-bottom:5px}

/* Fotoalbum: raster en plakboek (volgende release) */
.bk .fa-raster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.bk .fa-raster .fa-f img,.bk .fa-plakboek .fa-f img{position:absolute!important;left:0!important;top:0!important;width:100%!important;height:100%!important;object-fit:cover;transform:none!important}
.bk .fa-raster .fa-f.p,.bk .fa-plakboek .fa-f.p{aspect-ratio:3/2}
.bk .fa-raster .fa-k i{font-size:9px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}.bk .fa-raster .fa-k b{font-size:10px}
.bk .fa-plakboek{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px;background:var(--perk);padding:12px;margin:0}
.bk .fa-plak{position:relative;background:#fff;padding:7px 7px 6px;box-shadow:0 2px 5px rgba(58,38,20,.2)}
.bk .fa-tape{position:absolute;top:-7px;left:38%;width:46px;height:13px;background:rgba(201,168,119,.55)}
.bk .fa-plakboek .fa-k i{font-size:9.5px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}

/* De familie naast de geschiedenis (volgende release) */
.bk .ns{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 50px);bottom:calc(var(--bk-mo) + (2px));overflow:hidden}
.bk .ns-leg{display:flex;flex-wrap:wrap;gap:4px 12px;font:700 6.5px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
.bk .ns-leg i{display:inline-block;width:8px;height:8px;border-radius:999px;margin-right:4px;vertical-align:-1px}.bk .ns-leg i.nl{background:#3A2614;border-radius:1px}
.bk .ns-n{border:1px solid;border-radius:2px;padding:4px 6px;margin-bottom:5px}
.bk .ns-n b{font-weight:400;font-size:13px}.bk .ns-n b small{font:700 6px/8px 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.bk .ns-n p{margin:0;font-size:8.3px;line-height:1.35}.bk .ns-n .ns-nt{font-size:10.5px;line-height:1.2}
.bk .ns-e{position:relative;display:flex;gap:5px;align-items:baseline;font-size:8.6px;line-height:1.3;padding:3px 0 3px 6px;border-left:2px solid}
.bk .ns-e b{font-family:'IM Fell English',serif;font-weight:400;font-size:12px;flex:none;width:30px}
.bk .ns-ic{display:inline-block;flex:none;width:7px;height:7px;border-radius:999px;align-self:center}
.bk .ns-ic.huw,.bk .ns-ic.huw2{background:transparent!important;border:1.5px solid;width:6px;height:6px}.bk .ns-ic.huw2{margin-left:-8px}
.bk .ns-oevers{display:grid;grid-template-columns:1fr 1.15fr;gap:12px}
.bk .ns-oevers .fam{border-left:1px dashed;padding-left:8px}
.bk .ns-rits{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.bk .ns-rits .ns-k:not(.mid){border-top:3px solid;padding-top:4px}.bk .ns-rits .ns-e.l{flex-direction:row}
.bk .ns-band{border-top:1px solid;padding:3px 0 5px}.bk .ns-bj{margin:0 0 3px;font-size:12px}
.bk .ns-3{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:8px}.bk .ns-leeg{margin:0;font-size:7.5px;font-style:italic;opacity:.6}
.bk .ns-slot{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:200px;text-align:center}
.bk .ns-twee{display:flex;justify-content:center;gap:16px}.bk .ns-twee span{border-top:4px solid;padding-top:6px;font:700 8px/12px 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase}
.bk .ns-samen{margin:26px 0 10px;font-size:24px;line-height:1.2}
.bk .ns-paar{margin:0;font-family:'Pinyon Script',cursive;font-size:24px;line-height:1.35}.bk .ns-paar span{font-family:'IM Fell English',serif;font-size:16px}

/* Vier families, vier streken (volgende release) */
.bk .st-sub{font-style:italic;margin:-6px 0 8px}
.bk .st{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.bk .st section{background:#fff;border:1px solid var(--bk-rand);border-top:3px solid;padding:8px 10px;display:flex;flex-direction:column;gap:4px}
.bk .st p{margin:0}.bk .st-f{display:flex;align-items:center;gap:6px;font-family:'IM Fell English',serif;font-size:14px}
.bk .st-f span{width:17px;height:17px;border-radius:999px;color:#fff;font-size:8.5px;line-height:17px;text-align:center;flex:none}
.bk .st-s{font:700 6.8px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase}
.bk .st-t{font-size:9.6px;line-height:1.45}.bk .st-leeg{font-style:italic;color:#8A7658}
.bk .st-a{font-size:9px;line-height:1.4;font-style:italic;color:var(--sepia)}

/* Toen zij 13 waren (volgende release) */
.bk .dt{display:flex;gap:12px;background:#fff;border:1px solid var(--bk-rand);padding:9px 11px;margin-bottom:9px}
.bk .dt p{margin:0}.bk .dt-j{width:52px;flex:none;text-align:center}.bk .dt-j b{display:block;font:400 25px/1 'IM Fell English',serif;color:var(--lak)}
.bk .dt-j span{font:700 6.5px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--sepia)}
.bk .dt-t{display:flex;flex-direction:column;gap:3px}.bk .dt-n{font-family:'IM Fell English',serif;font-size:14px}.bk .dt-f{font-size:9.5px;font-weight:600;line-height:1.4}
.bk .dt-k{font:700 6.5px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#6E5843;margin-top:2px!important}
.bk .dt-s{font-size:9.4px;line-height:1.45;margin:0;text-align:left}.bk .dt-e{font-size:9.4px;font-style:italic;color:var(--lak)}

/* De tijdreis en het Verteld boek (AI, volgende release) */
.bk .ai-wacht{margin-top:40px;background:var(--perk);border:1px dashed var(--bk-rand);padding:16px 18px}.bk .ai-wacht .h{margin-top:0}
.bk .tr{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 50px);bottom:calc(var(--bk-mo) + (6px));display:flex;flex-direction:column;gap:8px;overflow:hidden}
.bk .tr p{margin:0}.bk .tr-o{font-style:italic;font-size:10px;line-height:1.45}
.bk .tr-s{position:relative;background:rgba(255,255,255,.55);border:1px solid;padding:8px 10px;display:flex;flex-direction:column;gap:3px}
.bk .tr-j{display:flex;gap:8px;align-items:baseline}.bk .tr-j b{font-weight:400;font-size:20px;line-height:1}.bk .tr-j span{font:700 6.5px/9px 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em}
.bk .tr-k{font-size:13px;line-height:1.2}.bk .tr-t{font-size:9.2px;line-height:1.45}
.bk .tr-b{align-self:flex-start;border:1px solid;border-radius:999px;padding:1px 8px;font:600 7px/12px 'Plus Jakarta Sans',sans-serif}
.bk .tr-f{margin:0}.bk .tr-f img{display:block;width:100%;height:150px;object-fit:cover;filter:sepia(.25)}.bk .tr-f figcaption{font-size:7.5px;font-style:italic;opacity:.8;margin-top:2px}
.bk .tr-tijdlijn .tr-s{border-width:0 0 0 3px;background:transparent;padding-left:12px}
.bk .tr-route .tr-s{padding-left:34px}.bk .tr-stop{position:absolute;left:8px;top:9px;width:19px;height:19px;border-radius:999px;font:700 9px/19px 'Plus Jakarta Sans',sans-serif;text-align:center}

.bk .tr-t{font-size:8.7px;line-height:1.4}.bk .tr-f img{height:118px}
.bk .tr.zonder{gap:6px}.bk .tr.zonder .tr-t{font-size:8px;line-height:1.36}.bk .tr.zonder .tr-s{padding:6px 9px}
.bk .t.vt{font-size:11px;line-height:1.55}
.bk .tr.tr-route .tr-s{padding-left:34px}

/* Stijl Jong en trots voor het hele boek (volgende release): dezelfde inhoud en boekkleuren, een moderne letter en ronde vormen */
.bk .pg.th-jong{font-family:'Plus Jakarta Sans',sans-serif}
.bk .pg.th-jong .h,.bk .pg.th-jong .kw-t,.bk .pg.th-jong .om2-t,.bk .pg.th-jong .fl-h,.bk .pg.th-jong .tr-k,.bk .pg.th-jong .st-f,.bk .pg.th-jong .team-k,.bk .pg.th-jong .hd-n,.bk .pg.th-jong .dt-n,.bk .pg.th-jong .bw-v,.bk .pg.th-jong .ak-lt{font-family:'Plus Jakarta Sans',sans-serif!important;font-weight:800;letter-spacing:-.02em}
.bk .pg.th-jong .kk{color:var(--lak);letter-spacing:.14em}
.bk .pg.th-jong .t{font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;line-height:1.6;text-align:left}
.bk .pg.th-jong .t.dc::first-letter{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;color:var(--lak)}
.bk .pg.th-jong .kader,.bk .pg.th-jong .tr-s,.bk .pg.th-jong .st section,.bk .pg.th-jong .team section,.bk .pg.th-jong .hd-k,.bk .pg.th-jong .dt,.bk .pg.th-jong .wj-k,.bk .pg.th-jong .tien-t,.bk .pg.th-jong .ns-n,.bk .pg.th-jong .vw-snede{border-radius:12px}
.bk .pg.th-jong .tien-t b,.bk .pg.th-jong .om2-c b,.bk .pg.th-jong .wj-k b,.bk .pg.th-jong .dt-j b{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800}
.bk .pg.th-jong .kw-pag,.bk .pg.th-jong .tr-j b,.bk .pg.th-jong .ns-e b,.bk .pg.th-jong .ns-n b{font-family:'Plus Jakarta Sans',sans-serif!important}

/* Twee families komen samen: de openingspagina (volgende release) */
.bk .so{position:absolute;left:var(--bk-mz);right:var(--bk-mz);top:calc(var(--bk-mt) + 54px);bottom:calc(var(--bk-mo) + (20px));display:flex;flex-direction:column}
.bk .so p{margin:0}.bk .so-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bk .so-k{border-top:4px solid;background:rgba(255,255,255,.5);padding:9px 10px;display:flex;flex-direction:column;gap:2px}
.bk .so-n{font-size:15px}.bk .so-g{font-size:26px;line-height:1.1}.bk .so-g span{font:600 8px/10px 'Plus Jakarta Sans',sans-serif}
.bk .so-l{font:700 6.5px/10px 'Plus Jakarta Sans',sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-top:5px!important}.bk .so-w{font-size:9.5px;line-height:1.35}
.bk .so-r{display:block;width:100%;height:auto;margin:6px 0 0}
.bk .so-s{text-align:center;font-size:20px;margin-top:6px!important}.bk .so .ns-paar{text-align:center;margin-top:4px}
.bk .so-u{text-align:center;font-size:8.5px;font-style:italic;opacity:.8;margin-top:auto!important}

/* Nog niet bekeken (Ortwin 10-11-2026): in de zwarte uitleg bij het pictogram en als melding bij het onderdeel */

.pv-nog{margin:8px 0 0;padding:8px 12px;border-radius:10px;background:#FDECEA;border:1px solid #F3C4BE;color:#7A1F17;font-size:13px;line-height:1.45}
.pv-nog.flits{animation:pvnog .6s ease 2}@keyframes pvnog{50%{background:#F8C9C2}}
@media (prefers-reduced-motion:reduce){.pv-nog.flits{animation:none;outline:2px solid #9E2B25}}
.pv-schakel .pv-ak-nog{opacity:.55;cursor:not-allowed}
/* melding "Bekijk nog N pagina's" in de tabbladen: eigen rij onder de kop */
.pv.pv-tabs-inst:has(> .pv-nog){grid-template-areas:"rail kop kop" "rail nog nog" "rail tvak mini";grid-template-rows:auto auto 1fr}
.pv.pv-tabs-vb:has(> .pv-nog){grid-template-areas:"rail kop" "rail nog" "rail kijker";grid-template-rows:auto auto 1fr}
.pv-tabs-inst:has(> .pv-nog) .pv-rail,.pv-tabs-vb:has(> .pv-nog) .pv-rail{grid-row:1 / span 3}
.pv-tabs-inst > .pv-nog,.pv-tabs-vb > .pv-nog{grid-area:nog;margin:0}
/* Hoofdstukken, Instellingen als lijst en vervallen onderdelen (Ortwin 11-11-2026, claude/voorstel-preview-onderdelen-samenvoegen.md) */
.pv-acc{display:grid;gap:8px}
.pv-acc-h{margin:0 0 2px;font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--grijs-600,#475467)}
.pv-acc-r{border:1px solid var(--grijs-200,#EAECF0);border-radius:12px;background:#fff}
.pv-acc-r.open{border-color:#C9D3FF;box-shadow:0 0 0 1px #C9D3FF}
.pv-acc-r.verv{border-color:#FDA29B;background:#FFFBFA}
.pv-acc-k{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:8px 12px;background:none;border:0;font:inherit;text-align:left;cursor:pointer;border-radius:12px}
.pv-acc-k:hover{background:var(--grijs-50,#F9FAFB)}
.pv-acc-k:focus-visible{outline:3px solid var(--kobalt);outline-offset:2px}
.pv-acc-n{flex:1;min-width:0;font-weight:800;font-size:15px}
.pv-acc-k .pv-p{font-size:13px;color:var(--grijs-600,#475467)}
.pv-acc-k .pv-st{padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.pv-st.verv{background:#FEE4E2;color:#912018}
.pv-acc-pijl{font-size:20px;line-height:1;color:var(--grijs-400,#98A2B3);transition:transform .15s}
.pv-acc-k[aria-expanded="true"] .pv-acc-pijl{transform:rotate(90deg)}
.pv-acc-in{padding:4px 14px 14px;display:grid;gap:10px}
.pv-acc-items{margin-top:4px}
.pv-acc-verv{margin:0;padding:8px 10px;border-radius:8px;background:#FEF3F2;color:#912018;font-size:14px}
/* Vervallen: lichtrood in de schakelaar boven het boek, plaatshouder in het boek en in de miniaturen */
.pv-schakel [data-pv-ak-zet="vervallen"][aria-pressed="true"]{background:#FEE4E2;color:#912018;border-color:#FDA29B}
.pv-ph{position:relative;display:flex;justify-content:center}
.pv-ph-pg{opacity:.35;filter:grayscale(1);pointer-events:none}
.pv-ph-leeg{display:flex;align-items:center;justify-content:center;background:var(--perk-l,#FBF7EF)}
.pv-ph-x{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-28deg);font-size:clamp(28px,6vw,64px);font-weight:900;letter-spacing:.12em;color:#D92D20;border:4px solid #D92D20;border-radius:10px;padding:4px 18px;background:rgba(255,255,255,.75);pointer-events:none}
.pv-du.ph{border:1.5px dashed #FDA29B;background:#FEF3F2;color:#D92D20;font-size:14px}
.pv-nav small{font-weight:400;color:var(--grijs-600,#475467)}
.pv-acc-items{display:grid;gap:6px}
.pv-acc-items .pv-rij{display:flex;align-items:center;gap:10px;width:100%}
.pv-acc-items .pv-sec{flex:1;display:flex;flex-direction:row;align-items:center;gap:10px;min-height:44px;padding:6px 10px;border:1px solid var(--grijs-200,#EAECF0);border-radius:10px;background:#fff;font:inherit;text-align:left;width:auto;height:auto}
.pv-acc-items .pv-nm{flex:1;min-width:0;font-weight:700}
.pv-acc-items .pv-p{font-size:13px;color:var(--grijs-600,#475467)}
.pv-acc-vb{justify-self:start}
.pv-ph .pnr{visibility:hidden} /* de plaatshouder telt niet mee: geen paginanummer */

/* ---------- MB: de preview op de telefoon (Ortwin 12-11-2026): het boek direct onder de tabbladen en zo groot als het
   scherm breed is; naam, Concept/Akkoord en Volgende staan eronder. Instellingen in één kolom met grote klikdoelen. ---------- */
@media (max-width:760px){
  body.mb-aan .pv.pv-mob.pv-mtabs-vb{grid-template-areas:"fase" "strook" "mtitel" "mtabs" "kijker" "mkop" "links"}
  body.mb-aan .pv.pv-mob.pv-mtabs-inst{grid-template-areas:"fase" "strook" "mtitel" "mtabs" "mkop" "kijker" "links"}
  body.mb-aan .pv-mtabs{margin:0}
  body.mb-aan .pv-mob .pv-boven{display:none}
  body.mb-aan .pv-mob .pv-kijker{gap:8px}
  body.mb-aan .pv-mob .pv-hf-rij,body.mb-aan .pv-mob .pv-tabvak .pv-om .pv-hf-rij{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
  body.mb-aan .pv-mob .pv-hf-rij input[type=text],body.mb-aan .pv-mob .pv-hf-rij textarea{height:auto;min-height:48px;font-size:17px;width:100%;box-sizing:border-box}
  body.mb-aan .pv-mob .pv-hf-rij input[type=text]{height:48px}
  body.mb-aan .pv-mob .pv-om-kleuren{gap:10px;flex:1}
  body.mb-aan .pv-mob .pv-om-k{flex:1;min-width:44px;height:48px}
  body.mb-aan .pv-mob .pv-om-k i{width:60%;height:28px}
  body.mb-aan .pv-mob .pv-hf-rij button:not(.pv-om-k){min-height:44px}
  body.mb-aan .pv-mob .pv-om-foto{min-height:44px;display:inline-flex;align-items:center;font-size:15px}
  body.mb-aan .pv-mob .mj-vink{min-height:44px;align-items:center}
  body.mb-aan .pv-mob input[type=checkbox]{width:22px;min-width:22px;height:22px;flex:none}
  body.mb-aan .pv-mob .pv-om-v input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),body.mb-aan .pv-mob .pv-links input[type=text]{height:48px;font-size:17px;box-sizing:border-box}
  body.mb-aan .pv-mob .pv-hf-k,body.mb-aan .pv-mob .pv-st{font-size:13px}
  /* Voorbeeld: het hele boek in één scherm. De kop van de site maakt plaats en Takje wordt een klein rond knopje rechtsonder
     (tik erop voor zijn advies of je post). Zo passen boek én bladerpijlen boven de onderbalk. */
  body.mb-aan:has(.pv-mob.pv-mtabs-vb) .mj-kop{display:none}
  body.mb-aan:has(.pv-mob.pv-mtabs-vb) .mb-takje{position:absolute;right:8px;bottom:100%;min-height:0;padding:0 0 8px;background:transparent;border:0}
  body.mb-aan:has(.pv-mob.pv-mtabs-vb) .mb-takje .mb-zin,body.mb-aan:has(.pv-mob.pv-mtabs-vb) .mb-takje [data-mb-doe]{display:none}
  body.mb-aan:has(.pv-mob.pv-mtabs-vb) .mb-takje .mb-tk{background:var(--perk-l);border:1px solid var(--perk-r);border-radius:50%;box-shadow:0 2px 10px rgba(16,24,40,.18)}
  /* bladeren: de pijlen blijven in beeld boven de regel van Takje, ook als het boek eronder doorloopt */
  /* voorbeeld op de telefoon (Ortwin 13-11-2026): de symbolenstrook blijft bovenaan staan, de boekbalk met pagina's en Bestel
     valt weg (paginanummer en Bestel staan onderaan bij het bladeren). Is het boek te vol, dan blijft de balk: dat moet je zien. */
  /* Takje staat op het voorbeeld bovenaan naast de tabs, niet onderaan bij het bladeren */
  body.mb-aan:has(.pv-mob.pv-mtabs-vb .pv-tk) .mb-takje{display:none}
  body.mb-aan .pv-mtabs:has(.pv-fs){display:flex;align-items:center;gap:10px}
  body.mb-aan .pv-mtabs:has(.pv-fs) .pv-tabs{flex:1;min-width:0}
  body.mb-aan .pv-fs{order:2;flex:none;width:52px;height:52px;padding:0;display:flex;align-items:center;justify-content:center;background:#fff;color:var(--inkt);border:1px solid var(--grijs-300,#D0D5DD);border-radius:14px;cursor:pointer}
  body.mb-aan .pv-fs:focus-visible{outline:3px solid var(--kobalt);outline-offset:2px}
  body.mb-aan .pv-mtabs:has(.pv-tk){display:flex;align-items:center;gap:10px}
  body.mb-aan .pv-mtabs:has(.pv-tk) .pv-tabs{flex:1;min-width:0}
  body.mb-aan .pv-tk{order:-1;flex:none;width:52px;height:52px;padding:0;display:flex;align-items:center;justify-content:center;background:var(--perk-l);border:1px solid var(--perk-r);border-radius:50%;box-shadow:0 2px 10px rgba(16,24,40,.18);cursor:pointer}
  body.mb-aan .pv-tk.gd-licht{background:var(--perk)}
  body.mb-aan .pv-tk:focus-visible{outline:3px solid var(--kobalt);outline-offset:2px}
  body.mb-aan .pv-mob .pv-strook{position:sticky;top:0;z-index:6;background:#fff}
  .pv-nav-best{display:inline-flex;align-items:center;min-height:44px;padding:0 10px 0 12px;margin-left:-4px;border-left:1px solid var(--grijs-200);color:var(--kobalt);font-weight:700;font-size:15px;white-space:nowrap;text-decoration:none}
  /* Concept en Akkoord in de bladerbalk, bij elk onderdeel op dezelfde plek; de statusregel eronder valt weg */

  body.mb-aan:has(.pv-mob.pv-mtabs-vb) #mj-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  body.mb-aan .pv-mob .pv-kijker .pv-nav{position:fixed;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 16px);bottom:calc(72px + env(safe-area-inset-bottom));z-index:4;padding:4px 6px;border-radius:999px;background:rgba(255,255,255,.95);box-shadow:0 2px 10px rgba(16,24,40,.2)}
}

/* Wie er nu bij hoort (13-11-2026): toelichting, stamboom, en daaronder foto's met namen in twee kolommen */
.bk .nb-vak.nu-vak{flex-direction:column;align-items:center;justify-content:flex-start}
.bk .nu-uitleg{margin:0 0 2px;font-size:9.5px;line-height:1.4;font-style:italic;text-align:center;max-width:340px}
.bk .nu-wie{display:grid;grid-template-columns:1fr 1fr;column-gap:22px;row-gap:6px;width:100%;margin-top:14px;font-family:'Plus Jakarta Sans',sans-serif}
.bk .nu-p{display:flex;align-items:center;gap:8px;height:24px;min-width:0;font-size:9px;line-height:1.15}
.bk .nu-p img,.bk .nu-p i{flex:none;width:24px;height:24px;border-radius:999px;object-fit:cover;box-sizing:border-box}
.bk .nu-p i{display:flex;align-items:center;justify-content:center;border:1px solid;font-style:normal;font-size:8px;font-weight:700}
.bk .nu-p span{display:flex;flex-direction:column;min-width:0}
.bk .nu-p b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk .nu-p small{font-size:7.5px}
.bk .nu-meer{font-style:italic}
/* instellingen: wat er op die pagina staat */
.bm-nupag{display:grid;gap:6px}
.bk .nu-wie.mid{row-gap:8px}.bk .nu-wie.mid .nu-p{height:38px;font-size:11px;gap:10px}.bk .nu-wie.mid .nu-p img,.bk .nu-wie.mid .nu-p i{width:38px;height:38px;font-size:11px}.bk .nu-wie.mid .nu-p small{font-size:8.5px}
.bk .nu-wie.groot{row-gap:14px;margin-top:6px}.bk .nu-wie.groot .nu-p{height:58px;font-size:12.5px;gap:12px}.bk .nu-wie.groot .nu-p img,.bk .nu-wie.groot .nu-p i{width:58px;height:58px;font-size:16px}.bk .nu-wie.groot .nu-p small{font-size:9.5px}.bk .nu-wie.groot .nu-p b{white-space:normal}
/* vijf onder elkaar, kolommen van boven naar beneden; meer dan 10 personen: drie kolommen */
.bk .nu-wie{grid-auto-flow:column}
.bk .nu-wie.k3{grid-template-columns:1fr 1fr 1fr;column-gap:12px}
.bk .nu-wie.k3.mid .nu-p{height:46px;font-size:10px;gap:8px}.bk .nu-wie.k3.mid .nu-p img,.bk .nu-wie.k3.mid .nu-p i{width:44px;height:44px;font-size:12px}.bk .nu-wie.k3.mid .nu-p b{white-space:normal}
.bk .nu-wie.k3 .nu-p{font-size:8.5px;gap:6px}
.bk .nu-kopje{margin:12px 0 0;width:100%;font-size:13px;line-height:1.2}
.bk .nu-wie{margin-top:6px;row-gap:4px}
/* telefoon, tabblad Instellingen: de naam van het onderdeel altijd op een eigen regel, Concept/Akkoord altijd op de regel eronder (13-11-2026) */
@media (max-width:820px){ body.mb-aan .pv-mkop{flex-wrap:wrap} body.mb-aan .pv-mkop>b{flex:0 0 100%} }

/* Volledig scherm (13-11-2026): het boek schermvullend, met bladeren */
.pv-fs{display:none}
dialog.pv-vol{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#17130f;color:#fff;overflow:hidden}
dialog.pv-vol[open]{display:grid;grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr)}
dialog.pv-vol::backdrop{background:#17130f}
.pv-vol-vak{min-height:0;display:flex;align-items:center;justify-content:center;padding:calc(8px + env(safe-area-inset-top)) 8px 4px;touch-action:pan-y}
.pv-vol-in{position:relative;overflow:hidden;flex:none}
.pv-vol-in .bk-spr{box-shadow:none}
.pv-vol-nav{display:flex;align-items:center;justify-content:center;gap:16px;padding:8px 12px calc(10px + env(safe-area-inset-bottom));font-size:15px;font-weight:700}
.pv-vol-nav span{min-width:150px;text-align:center}
.pv-vol-nav .pv-rond{background:#fff;color:#101828}
.pv-vol-nav .pv-rond:disabled{opacity:.35}
.pv-vol-x{position:absolute;top:calc(8px + env(safe-area-inset-top));right:10px;z-index:2;width:48px;height:48px;border-radius:999px;border:0;background:rgba(255,255,255,.92);color:#101828;font-size:28px;line-height:1;cursor:pointer}
.pv-vol-x:focus-visible,.pv-vol-nav .pv-rond:focus-visible{outline:3px solid #9db4ff;outline-offset:2px}
body.pv-vol-open{overflow:hidden}
@media (max-width:820px){
  body.mb-aan .pv-mtabs:has(.pv-fs) .pv-tabs button{min-width:0;padding:0 6px;font-size:15px;gap:6px;white-space:nowrap}
  body.mb-aan .pv-mtabs:has(.pv-fs):has(.pv-tk) .pv-tabs button svg{display:none}
}
/* telefoon: de bladerbalk staat bij elk onderdeel vast op dezelfde plek onderaan; het boek staat in het midden (13-11-2026) */
@media (max-width:820px){ body.mb-aan .pv-mob .pv-kijker{padding-bottom:76px} body.mb-aan .pv-mob .pv-vak{margin-left:auto;margin-right:auto} }
.pv-nogak{flex:0 0 100%;margin:2px 0 0;font-size:14px;line-height:1.4;color:var(--grijs-600,#475467)}
/* telefoon, Instellingen: Concept/Akkoord in de kop van het open onderdeel, op de plek van het label (13-11-2026) */
.pv-acc-kop{display:flex;flex-wrap:wrap;align-items:center;column-gap:8px}
.pv-acc-kop .pv-acc-k{flex:1 1 100%}
.pv-acc-sch{flex:1 1 100%;display:flex;justify-content:flex-end;padding:0 12px 10px}
.pv-acc-sch .pv-schakel button{min-height:44px}
.pv-acc-kop{min-width:0}.pv-acc-sch{min-width:0;box-sizing:border-box}.pv-acc-sch .pv-schakel{max-width:100%}.pv-acc-sch .pv-schakel button{padding:0 12px;font-size:15px}
/* Eén stijl voor het hele boek, die van de familiewaaier (13-11-2026): papier en kleuren op alle gewone pagina's */
.bk .pg.st-kleuren:not(.omslag):not(.tienpag){--papier:#F3EEE2;--galnoot:#3A2614;--sepia:#5B3A1E;--lak:#8C2620;--bk-rand:#CDB89A;--perk:#EADFC9;background:#F3EEE2;color:#3A2614}
.bk .pg.st-modern:not(.omslag):not(.tienpag){--papier:#FFFFFF;--galnoot:#101828;--sepia:#475467;--lak:#2B4EFF;--bk-rand:#D0D5DD;--perk:#F3F5FF;background:#FFFFFF;color:#101828}
/* telefoon: de titel van het onderdeel boven de tabs Instellingen en Voorbeeld (13-11-2026) */
.pv-mtitel{display:none}
@media (max-width:820px){ body.mb-aan .pv-mtitel{grid-area:mtitel;display:flex;align-items:center;gap:10px;min-height:44px;padding:2px 4px 0} body.mb-aan .pv-mtitel b{flex:1;min-width:0;font-size:18px;font-weight:800} body.mb-aan .pv-mtitel .pv-p{font-size:13px;color:var(--grijs-600,#475467)}
  body.mb-aan .pv-acc-kop:not(:has(.pv-acc-k)) .pv-acc-sch{padding-top:10px} }
/* In mijn boek / Niet opnemen bij elk optioneel onderdeel (13-11-2026) */
.pv-inboek{margin:0 0 12px}.pv-acc-sch .pv-inboek,.pv-mkop .pv-inboek,.pv-zij-kop .pv-inboek{margin:0}

/* Fotoalbum: voorbeeld van de opmaak zolang er geen foto's gekozen zijn (13-11-2026) */
.fa-vbr{display:grid;gap:10px;margin:0 0 10px}.fa-vbr.n1{grid-template-columns:1fr}.fa-vbr.n2{grid-template-columns:1fr 1fr}.fa-vbr.n3{grid-template-columns:1fr 1fr 1fr}
.fa-vb{margin:0}.fa-vb .ph{display:flex;align-items:center;justify-content:center}.fa-vb figcaption{font-size:9.5px;font-style:italic;color:#6b5a45;margin-top:3px;text-align:center}

/* Instellingen op de telefoon: inhoud mag het paneel niet breder maken dan het scherm (13-11-2026) */
.pv-acc-in{grid-template-columns:minmax(0,1fr)}.pv-acc,.pv-acc-r{min-width:0;max-width:100%}

/* Preview (Ortwin 13-11-2026): de regel met pagina's en Bestel valt overal weg (Bestel staat in de kop, op de plek van Beheer);
   is het boek te vol, dan blijft de regel staan, want dat moet je zien. Bij Instellingen scrollt de naam van het onderdeel
   weg en blijven de tabs Instellingen en Voorbeeld bovenaan staan, onder de symbolenstrook. */
.mj-kop-best{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--kobalt);color:#fff;font-weight:700;font-size:16px;text-decoration:none;white-space:nowrap}
.mj-kop-best:hover{background:var(--kobalt-h,#1F35A8);color:#fff}.mj-kop-best:focus-visible{outline:3px solid var(--kobalt);outline-offset:2px}
@media (max-width:760px){
  body.mb-aan .pv-mob.pv-mtabs-inst .pv-mtabs{position:sticky;top:var(--pv-sh,0px);z-index:5;background:#fff;padding:6px 0 8px;margin:0}
}
@media (max-width:760px){body.mb-aan .mj-main:has(> .pv-mob){padding-top:6px}}

/* De familie in feitjes: 2, 3 of 4 grafieken per pagina (13-11-2026). Elk vak toont de hele grafiekpagina verkleind. */
.bk .cf-multi{display:grid;grid-template-columns:repeat(2,203px);grid-auto-rows:300px;gap:6px;justify-content:center;align-content:start;height:100%}
.bk .cf-multi.n2{grid-template-columns:203px;grid-auto-rows:300px}
.bk .cf-multi.n3 .cf-cel:last-child{grid-column:1/-1;justify-self:center}
.bk .cf-cel{width:203px;height:300px;overflow:hidden;border-bottom:1px solid #E7DCC5}
.bk .cf-cel-in{width:412px;height:607px;transform:scale(.4925);transform-origin:0 0}
.bk .cf-multi.n2 .cf-cel{border-bottom:1px solid #E7DCC5}

/* In mijn boek / Niet opnemen en Concept / Akkoord op één regel in de kop van een open onderdeel (13-11-2026) */
.pv-acc-sch.met-in{justify-content:space-between;align-items:center;gap:2px;flex-wrap:nowrap;padding-left:4px!important;padding-right:4px!important}
.pv-acc-sch.met-in .pv-inboek{margin:0;flex:none}
.pv-acc-sch.met-in .vk-in{display:inline-grid;grid-template-columns:auto auto;width:auto;padding:3px;gap:2px;border-radius:999px}
.pv-acc-sch.met-in .vk-in button{min-height:40px;padding:0 9px;font-size:13px;border-radius:999px;white-space:nowrap}
.pv-acc-sch.met-in .pv-schakel{flex:none}
.pv-acc-sch.met-in .pv-schakel button{min-height:40px;padding:0 8px;font-size:13px}

/* Telefoon, ☰: alle onderdelen direct onder de symbolenstrook, vanaf het eerste onderdeel; de rest van het scherm wijkt (13-11-2026) */
@media (max-width:760px){
  .pv.pv-mob.pv-alle-open{grid-template-areas:"strook" "links"!important}
  .pv.pv-mob.pv-alle-open > :not(.pv-strook):not(.pv-links){display:none!important}
  .pv.pv-mob.pv-alle-open .pv-links{padding-top:8px}
}
/* ☰ links in de symbolenstrook (Ortwin 13-11-2026); aan = de lijst van alle onderdelen staat open */
@media (max-width:820px){
  .pv-strook-alle{position:static;flex:none;width:48px;height:44px;margin-left:8px;background:#fff;text-align:center;padding:0;border-radius:10px;font-size:22px}
  .pv-strook-alle.aan{background:var(--inkt);color:#fff}
  .pv-strook-in{padding:4px 8px 4px 6px;flex:1;min-width:0}
  .pv-alle-open .pv-strook .pv-ri.sel{box-shadow:none}
}

/* De boekbalk is terug (Ortwin 13-11-2026): links stamboom of preview, in het midden de pagina's met wat akkoord is (groen),
   rechts Bestel. Ook op de telefoon, ook bij het voorbeeld. */
@media (max-width:760px){
  body.mb-aan .st-regel{position:static}
  body.mb-aan .st-regel .st-stam:not(.st-best){display:inline-flex}
  body.mb-aan .st-regel .st-balk{display:flex}
  body.mb-aan .st-regel .st-okdeel{display:inline}
  body.mb-aan:has(.pv-mob.pv-mtabs-vb) .mj-kop{display:block}
}
@media (max-width:760px){
  body.mb-aan .st-regel .st-best{width:46px;height:46px;flex:none;padding:0;border:1.5px solid #C9D3FF;border-radius:14px;background:#EEF2FF;color:var(--inkt);display:inline-flex;align-items:center;justify-content:center}
  body.mb-aan .st-regel .st-best svg{display:block;width:26px;height:26px}
  body.mb-aan .st-regel .st-best::after{content:none}
  body.mb-aan .st-regel .st-stam:not(.st-best){width:46px;height:46px;flex:none}
  body.mb-aan .st-regel .st-in{display:flex;align-items:center;gap:8px;padding-left:12px;padding-right:12px}
  body.mb-aan .st-regel .st-boek{flex:1;min-width:0}
  body.mb-aan .st-regel .st-tekst{font-size:13px}
}
/* Wie is wie (13-11-2026): namen onder de albumfoto, en een rondje uit een foto als portret */
.bk .fa-k figcaption .fa-wie{display:block;font-style:normal;font-size:.86em;opacity:.8;margin-top:1px}
.bk .nu-p .nu-pf{flex:none;width:24px;height:24px;border-radius:999px}
.bk .nu-wie.mid .nu-p .nu-pf{width:38px;height:38px}
.bk span.fl-b{flex:none}

/* Fotoalbum (Ortwin 13-11-2026) */
/* Rijen op maat: de foto heel, niet bijgesneden en niet uitvergroot; het vak houdt zijn plek */
.bk .fa-heel .fa-f{background:transparent}
/* Raster: 3 staande of 2 liggende per rij, even hoog, in het midden met gelijke afstand */
.bk .fa-raster2{display:flex;flex-direction:column;gap:10px}
.bk .fa-r2{display:flex;justify-content:center;gap:18px;align-items:flex-start}
.bk .fa-v2{margin:0;flex:none}
.bk .fa-f2{position:relative;overflow:hidden;background:var(--perk)}
.bk .fa-f2 img{display:block;max-width:none}
.bk .fa-v2 figcaption{margin-top:4px;display:flex;flex-direction:column;gap:1px}
.bk .fa-v2 b{font-size:9.5px;line-height:1.25;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.bk .fa-v2 b span{font-family:'Plus Jakarta Sans',sans-serif;font-size:8px;font-weight:700;color:var(--sepia)}
.bk .fa-v2 i{font-size:8.5px;line-height:1.3;color:#4A3B28;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
/* Plakboek: 6 per pagina, rijen van 2 */
.bk .fa-plak6{display:flex;flex-direction:column;gap:20px;background:var(--perk);padding:14px 10px}
.bk .fa-p6r{display:flex;justify-content:center;gap:24px;align-items:flex-start}
.bk .fa-plak6 .fa-plak{flex:none}
.bk .fa-rij.n4{grid-template-columns:repeat(4,minmax(0,1fr))}.bk .fa-rij.n4 b{font-size:10px}.bk .fa-rij.n4 i{font-size:9.5px}
.bk .fa-v2 i{-webkit-line-clamp:3;font-size:8.5px}.bk .fa-v2 small.fa-wie{display:block;font-size:8px;line-height:1.3;color:var(--sepia);margin-top:1px}.bk .fa-r2{gap:12px}

/* Wie er nu bij hoort: de afbeelding van elke persoon in het stamboomvakje (Ortwin 13-11-2026) */
.bk .nb-c .nb-fw,.bk .nb-st .nb-c span{flex-direction:column}
.bk .nb-c .nb-fw{display:flex;align-items:center;gap:2px;max-width:100%;min-width:0}
.bk .nb-c .nb-fw b{font-weight:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.bk .nb-c .nb-f{flex:none;border-radius:999px;object-fit:cover;box-sizing:border-box}
.bk .nb-c .nb-fi{display:flex;align-items:center;justify-content:center;border:1px solid currentColor;font-style:normal;font-weight:700;opacity:.8}

/* Laptop: de ☰ bovenaan de rail opent dezelfde lijst met alle onderdelen en subonderdelen als op de telefoon (Ortwin 13-11-2026) */
.pv-ri-alle{margin-bottom:4px}
.pv-ri-alle.aan .pv-ik{background:var(--inkt);color:#fff}
.pv-ri-alle:hover .pv-ik.sel{background:var(--inkt)}
.pv-links-d{position:absolute;left:calc(100% + 10px);top:0;z-index:60;width:440px;max-height:calc(100vh - var(--kb-h,0px) - 24px);overflow:auto;background:#fff;border:1px solid var(--grijs-200);border-radius:14px;box-shadow:0 16px 40px rgba(16,24,40,.2);padding:14px 14px 18px;gap:12px;text-align:left}
.pv-links-d .pv-lijstkop{position:sticky;top:-14px;background:#fff;padding:2px 0 8px;z-index:1}

.pv-ri-alle.aan .pv-tip{display:none!important}
.pv-links-d .pv-toc .pv-sec{flex:1;min-width:0;display:flex;align-items:center;gap:8px;min-height:44px;padding:2px 6px;border:1px solid transparent;border-radius:10px;background:transparent;box-shadow:none}
.pv-links-d .pv-toc .pv-sec:hover{background:var(--grijs-50);border-color:var(--grijs-200)}
.pv-links-d .pv-toc .pv-sec.sel{border:2px solid var(--kobalt);background:var(--kobalt-25)}
.pv-links-d .pv-rij.uit .pv-sec{color:var(--grijs);cursor:pointer}
.pv-links-d .pv-rij.uit .pv-ik{opacity:.6}
.pv-links-d .pv-rij.uit .pv-nm{font-weight:600}
.pv-links-d .pv-nm{flex:1;min-width:0;text-align:left}
.pv-links-d .pv-grp{display:flex;gap:4px;align-items:flex-start}.pv-links-d .pv-grp-in{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}