/* blad.css — alleen /blad (en de kaarten van /bibliotheek gebruiken hun eigen css) */
[hidden]{display:none!important}
.gereedschap{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 .5rem}
.gereedschap input{flex:1 1 14rem;min-height:40px}
.gereedschap select{min-height:40px}
.pillen{display:flex;flex-wrap:wrap;gap:.35rem;margin:.4rem 0}
.pillen button{min-height:34px;padding:.25rem .75rem;border-radius:999px;border:1px solid var(--rand-accent);background:transparent;color:var(--tab);font:600 .8rem var(--sans);cursor:pointer}
.pillen button:hover{color:var(--tekst);border-color:var(--rand-hover)}
.pillen button[aria-pressed=true]{background:var(--tekst);border-color:var(--tekst);color:var(--nav)}
.toc{display:flex;flex-wrap:wrap;gap:.35rem;margin:.6rem 0 1.2rem}
.toc a{font:600 .75rem var(--mono);color:var(--tab);text-decoration:none;border:1px solid var(--rand-accent);border-radius:999px;padding:.25rem .7rem}
.toc a:hover{color:var(--tekst);border-color:var(--rand-hover)}
.lijst{display:flex;flex-direction:column}
.lijst.vast{margin:1rem 0 .5rem}
details.groep{margin:1rem 0 0;border:2px solid var(--laag);border-radius:12px;background:color-mix(in srgb,var(--laag) 6%,transparent)}
details.groep>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.8rem;padding:.65rem .9rem;background:var(--laag);color:#0b1220;border-radius:9px 9px 0 0}
details.groep:not([open])>summary{border-radius:9px}
details.groep>summary::-webkit-details-marker{display:none}
details.groep>summary::before{content:"▸";font-size:.8rem}details.groep[open]>summary::before{content:"▾"}
details.groep>summary b{display:block;font-size:1.05rem}
details.groep>summary small{display:block;font-size:.82rem;color:#0b1220}
details.groep>summary .tel{margin-left:auto;flex:none;font:700 .72rem var(--mono);background:rgba(255,255,255,.5);border-radius:999px;padding:.25rem .7rem}
details.groep>.lijst{padding:.8rem .8rem .1rem}
details.groep .leg{margin:.7rem .9rem 0}
ul.leg{list-style:none;padding:0 .9rem;margin:.3rem 0 0;display:grid;gap:.3rem;font-size:.85rem;color:var(--tab)}
.blok .kick{order:-1;flex-basis:100%;padding-left:1.4em;font:700 .66rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--geel);font-weight:700}
.blok .t{flex:1 1 12rem}
.blok .chips{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;font-weight:400}
.blok .lijf>.rij{margin:.2rem 0 .5rem}
.stek{display:inline-block;background:var(--k);color:#0b1220;border:2px dashed rgba(11,18,32,.45);border-radius:6px;padding:.02rem .38rem;font:800 .66rem var(--mono);text-transform:uppercase;letter-spacing:.05em}
.label.rood{color:var(--rood);border-color:rgba(248,113,113,.55)}
.test h3{margin:0 0 .3rem;font-size:1rem}
.test pre{margin:.5rem 0 0;white-space:pre-wrap;word-break:break-all}
.test .knoppen{margin:.5rem 0 0}
.live-uit{max-height:16rem;overflow:auto;white-space:pre-wrap}
ul.log{padding-left:1.1rem}ul.log li{margin:.45rem 0}
.tabel th[scope=row]{font:700 .9rem var(--sans);text-transform:none;letter-spacing:0;color:var(--tekst);background:none;white-space:nowrap}
.lijf .label,.test .label{white-space:normal}
details.uitklap>summary>*{min-width:0}.blok .t,.blok .blok-pitch,.blok .kick,.lijf{overflow-wrap:anywhere}
