/* Gedeelde leesbare basis. Functionele werkruimte en tekstkolom zijn afzonderlijk:
   modules gebruiken .bt-werkruimte voor bediening en .bt-leestekst voor proza. */
.bt-werkruimte{inline-size:100%;max-inline-size:var(--bt-werkruimte);min-inline-size:0;margin-inline:auto;box-sizing:border-box}
.bt-leestekst{max-inline-size:var(--bt-leesbreedte);line-height:var(--bt-regelhoogte);overflow-wrap:anywhere}
body[data-schil] :is(.n-main,main>.in){min-inline-size:0;box-sizing:border-box}
body[data-schil] :is(.btn-acc,.btn-ghost,.btn-good,.chipbtn,.x-knop,.n-knop){
  font-size:var(--bt-bediening);line-height:1.35;min-block-size:var(--bt-tikdoel);white-space:normal}
body[data-schil] :is(.btn-acc,.n-knop-primair){min-block-size:var(--bt-hoofdactie)}
body[data-schil] :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){
  font-size:var(--bt-bediening);line-height:1.5;max-inline-size:100%;box-sizing:border-box}
body[data-schil] :is(.n-zb-item,.x-zb-item,.n-top-seg-btn,.x-kop-tab,.bt-subtab){
  font-size:var(--bt-bediening);min-block-size:var(--bt-tikdoel);line-height:1.35}

/* Het opzoekwerkblad volgt de beschikbare inhoudsruimte, niet de vensterbreedte.
   Bij grotere tekst of een zijbalk blijft het één kolom totdat beide kolommen leesbaar zijn. */
body[data-schil] .n-main:has(.oz-shell){max-width:var(--bt-werkruimte);padding-inline:var(--bt-ruimte)}
body[data-schil] .n-main:has(.oz-shell) .n-uitg{min-inline-size:0;max-inline-size:none}
.oz-shell{container:bt-opzoeken / inline-size;min-inline-size:0}
body[data-schil] .oz-shell .oz-cols{display:grid;grid-template-columns:minmax(0,1fr);
  grid-template-areas:none;grid-template-rows:none;align-items:start;gap:1.25rem}
body[data-schil] .oz-shell :is(.oz-left,.oz-right){display:flex;flex-direction:column;gap:1rem;min-inline-size:0}
body[data-schil] .oz-shell .oz-right{position:static;max-height:none;overflow:visible;padding-right:0}
body[data-schil] .oz-shell :is(.oz-nav,.oz-main,.oz-detail,.oz-side,.oz-ladder){grid-area:auto;order:0;min-inline-size:0}
@container bt-opzoeken (min-width:64rem){
  body[data-schil] .oz-shell .oz-cols:not(.oz-start){grid-template-columns:minmax(0,1.2fr) minmax(22rem,.9fr)}
}

/* Betekenis en acties delen geen krimpbare flexregel. De betekenis krijgt de
   volle regel; de bediening kan onafhankelijk afbreken, ook bij 200% tekst. */
.ql-ladder-row{display:flex;flex-direction:column;min-inline-size:0}
.ql-ladder-row .ql-step{display:grid;grid-template-columns:1.25rem auto minmax(0,1fr) auto;
  align-items:start;gap:.5rem;padding:clamp(10px,2cqi,14px);border:0;background:transparent;text-align:left;
  font:inherit;color:var(--txt);cursor:pointer;inline-size:100%;min-inline-size:0;box-sizing:border-box}
.ql-step .ql-step-content{grid-column:1/-1;grid-row:2;min-inline-size:0}
.ql-step-meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:.5rem;margin-bottom:.3rem;font-size:var(--bt-klein);color:var(--muted)}
.ql-step-role{font-weight:700;letter-spacing:.03em;border-radius:.35rem;padding:.15rem .45rem;text-transform:uppercase}
.ql-step-summary{display:block;font-size:var(--bt-tekst);line-height:var(--bt-regelhoogte);white-space:normal;overflow-wrap:anywhere;text-wrap:pretty}
.ql-step-indicator{grid-column:4;grid-row:1;color:var(--brand);font-weight:700}
.ql-step-actions{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;padding:0 .75rem .75rem}
.ql-step-actions :is(button,.iconbtn,.x-altknop){min-inline-size:var(--bt-tikdoel);min-block-size:var(--bt-tikdoel);
  inline-size:auto;block-size:auto;font-size:var(--bt-bediening);line-height:1.35;white-space:normal}
.ql-step .bidchip{font-size:1.1rem;min-inline-size:2.5rem;min-block-size:2.5rem}
.ql-step-notes{padding:0 .75rem .75rem;font-size:var(--bt-klein);line-height:1.5}
.ql-step-annotation{font-size:var(--bt-klein);line-height:1.5}
.ql-step-notes .ql-back{font:inherit;min-block-size:var(--bt-tikdoel);white-space:normal}
.ql-ladder-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.5rem;
  padding:.75rem;background:var(--panel2);border-bottom:1px solid var(--line)}
.ql-ladder-head .eyebrow,.ql-ladder-head-note{font-size:var(--bt-klein);color:var(--muted)}
