/* v25.52 — HUISSTIJL2: de kleuren van het beeldmerk — de ENIGE plek met de gesamplede waarden (Rabi 6-9: "tinten van het logo,
   vooral de licht en donker blauw, overal in de website terug te laten komen, van begin tot het einde"). trui = merkblauw,
   cirkel = lichtblauw, haar = navy; afgeleiden via color-mix, nergens als hex herhaald. Een tweede sampling = één regel per token. */
:root{
  --merk-blauw:#0A3CBD;            /* trui — primair: knoppen, links, actieve tab, focus (licht thema) */
  --merk-blauw-donker:#072C8C;     /* ingedrukt, koppen op licht, og-vlak */
  --merk-licht:#4F8FFB;            /* cirkel — accent in het donkere thema, wash-basis, chips, paneel-/inlogcirkel */
  --merk-navy:#12101D;             /* haar — ink in het lichte thema, grondbasis van het donkere thema, tekst op lichtblauw */
  --merk-op-blauw:#FFFFFF;         /* tekst op merkblauw (de kraag) */
  --merk-op-licht:var(--merk-navy); /* tekst op lichtblauw (het haar) */
  --merk-nacht-diep:#01030E;       /* v25.58 (HUISSTIJL): de rand van het nieuwe logo (gesampled in de hoeken, 20-9) - de diepste achtergrond: velden, segmentkiezer en tips in het thema De Belegger-blauw, en 35 % van de grond (aanvulling Rabi 20-9 14:05: een stap donkerder) */
  --merk-nacht:#001050;            /* v25.58 (HUISSTIJL): de dominante nachtblauwe achtergrond van het nieuwe logo - de kaarten van het thema De Belegger-blauw, 65 % van de grond (met de rand), de mengkleur van kaart-2, ink-2, ink-3 en de eigen chatbubbel, en de tekst op het accent (aanvulling Rabi 20-9 14:05) */
  --merk-nacht-licht:#00206D;      /* v25.58 (HUISSTIJL): het lichtere nachtblauw vlak binnen de ring (straal 180 px) - de bovengrens van de nachtblauwe reeks in Rabi's zin; tot de aanvulling van 20-9 14:05 de kaartkleur van het thema De Belegger-blauw (nu --merk-nacht), sindsdien in geen token van de staart gebruikt; blijft als gesamplede logokleur in lockstep met het serverpalet */
  --merk-konings:#002998;          /* v25.58 (HUISSTIJL): het koningsblauwe shirt - hoofdkleur: knopvlak, eigen chatbubbel, ingedrukt (licht thema) */
  --merk-ring:#0659DE;             /* v25.58 (HUISSTIJL): de blauwe gloed direct rond de neonring (gesampled op 4 px van de rand) - de gloed (--glow) in alle thema's */
  --merk-ring-licht:#82CBFC;       /* v25.58 (HUISSTIJL): de zachte binnenrand van de neonring (gesampled op 5 px van de rand) - het accent (links, actieve tab, iconen) in het thema De Belegger-blauw; 8,3:1 op de kaart */
  --merk-neon:#F3FBFE;             /* v25.58 (HUISSTIJL): de kern van de neonring - de tekstkleur (ink) in het thema De Belegger-blauw en de lichte kant van het knopverloop */
  --merk-neon-gloed:#0030A0;       /* v25.58 (HUISSTIJL): de diepblauwe gloed om de ring (gemeten door de integrator, 20-9) - kaartschaduw en gloed op de openbare pagina's */
  --merk-grond-nacht:#040A1D;      /* v25.58 (HUISSTIJL): erg donker blauw, bijna zwart (midden van Rabi 20-9 20:40: richtwaarde #030716 tot #050C24) - de grond van het thema De Belegger-blauw en de tekst op het accent; hersteller 20-9 */
  --merk-kaart-nacht:#071233;      /* v25.58 (HUISSTIJL): een stap lichter dan de grond (Rabi 20-9 20:40) - de kaarten van het thema De Belegger-blauw en de mengkleur van ink-3; hersteller 20-9 */
  --merk-kaart-nacht-licht:#0B1D4D;    /* v25.58 (HUISSTIJL): weer een stap lichter (Rabi 20-9 20:40) - de tweede kaartlaag en de eigen chatbubbel in het thema De Belegger-blauw; hersteller 20-9 */
  --merk-neon-lijn:#3080FF;        /* v25.58 (HUISSTIJL): neonachtig lichter blauw (Rabi 20-9 20:40; de richtwaarde van Rabi is het oude accent van voor HUISSTIJL2 en blijft door test-huisstijl2 verboden, daarom deze buurwaarde) - afscheidingen, randen, focusring, de lijn onder de actieve tab en de gloed in het thema De Belegger-blauw; 5,1:1 op de grond; hersteller 20-9 */
  --merk-neon-accent:#5B9BFF;      /* v25.58 (HUISSTIJL): dezelfde neonfamilie, licht genoeg als tekst (Rabi 20-9 20:40) - het accent (links, actieve tab, iconen, grafieklijn) in het thema De Belegger-blauw; 7,1:1 op de grond, 6,6:1 op de kaart; hersteller 20-9 */
  --merk-wit-blauw:#C9D6FF;        /* v25.58 (HUISSTIJL): heel licht blauwwit (Rabi 20-9 20:40) - de tweede tekstkleur (ink-2) van het thema De Belegger-blauw; gewone tekst is wit via --merk-op-blauw; hersteller 20-9 */
  --merk-zwart:#000000;            /* v25.58 (HUISSTIJL): echt zwart, het haar van de avatar (Rabi 20-9 20:42: "Ook zwart moet een rol spelen zoals zijn haar") - op twee vaste plekken in het thema De Belegger-blauw: de tabbalk en de koersstrook, en de kaartschaduw; hersteller 20-9 */
}
/* Donker thema: navy uit het haar (v25.52 HUISSTIJL2 — was groen-zwart); het accent is de cirkelkleur (merkblauw zelf is op navy 2,2:1, onbruikbaar). */
:root{
  --ground:#0F0E19; --card:#191729; --card-2:#221F35; /* v25.52 (HUISSTIJL2): navy-grond en -kaarten (was groen-zwart) */
  --line:rgba(255,255,255,.075); --line-2:rgba(255,255,255,.13);
  --ink:#EEF1FA; --ink-2:#A6ABC4; --ink-3:#7F859F; /* v25.52 (HUISSTIJL2): koel wit i.p.v. groen-getint; ink-3 4,8:1 op de kaart (was 3,7) */
  --accent:var(--merk-licht); --accent-wash:color-mix(in srgb, var(--merk-licht) 12%, transparent); /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): = de cirkel van het logo */ --gold:#D9B36B;
  --accent-tekst:var(--merk-op-licht); --accent-donker:color-mix(in srgb, var(--merk-licht) 80%, var(--merk-navy)); --accent-lijn:color-mix(in srgb, var(--merk-licht) 45%, transparent); /* v25.52 (HUISSTIJL2): tekst op accent = het logo-paar haar-op-cirkel; ingedrukt; chip-/kaartranden */
  --accent-verloop:linear-gradient(135deg, color-mix(in srgb, var(--merk-licht) 85%, #fff), var(--merk-licht)); /* v25.52 (HUISSTIJL2): het ene knopverloop (was 11× hard-coded) */
  --good:#34C98E; --good-text:#5BD8A5; --bad:#E5605A; --bad-text:#F08A84;
  --user-bubble:color-mix(in srgb, var(--merk-blauw) 45%, var(--card)); /* v25.52 (HUISSTIJL2): de trui als eigen chatbubbel (was groen) */
  --shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 10px 40px rgba(0,0,0,.45);
  --input-bg:#0C0B15; --seg-bg:#0C0B15; --tt-bg:#0C0B15; /* v25.52 (HUISSTIJL2): navy (was groen-zwart) */
  --stat-bg:rgba(255,255,255,.032); --hl-bg:color-mix(in srgb, var(--merk-licht) 10%, transparent); /* v25.52 (HUISSTIJL2): geselecteerde rij met een blauwe zweem */
  --chart-grid:rgba(255,255,255,.14); --chart-grid-2:rgba(255,255,255,.045);
  --bench-sp:#D9B36B; --bench-aex:var(--merk-licht); --port:#35D69A; /* v25.52 (HUISSTIJL2): het "blauw" in grafieken = het logo (was los blauw) */
  --big-a:#FFFFFF; --big-b:var(--merk-licht); --glow:color-mix(in srgb, var(--merk-blauw) 22%, transparent); /* v25.52 (HUISSTIJL2): het grote bedrag wit → lichtblauw (was → groen); diepblauwe gloed */
  --nw-blauw:#4F8FFB; --nw-paars:#8F7CF0; /* v25.46 (nieuws-client): rubriekkleuren analyse (blauw) en macro (paars) op de Nieuws-pagina · v25.52 (HUISSTIJL2): blauw = de cirkel van het logo (= --merk-licht; letterlijk vanwege de pin in test-nieuws-client) */
  color-scheme:dark;
}
/* Licht thema: handmatig gekozen … (v25.52 HUISSTIJL2: het accent is de trui, ink is het haar, grond/kaart-2/randen blauw-grijs i.p.v. groen-grijs; beide lichte blokken byte-gelijk) */
:root[data-theme="light"]{
  --ground:#F3F6FB; --card:#FFFFFF; --card-2:#EAF0FA; /* v25.52 (HUISSTIJL2): blauw-grijs (was groen-grijs) */
  --line:color-mix(in srgb, var(--merk-navy) 9%, transparent); --line-2:color-mix(in srgb, var(--merk-navy) 17%, transparent);
  --ink:var(--merk-navy); --ink-2:#4B5166; --ink-3:#6E7590; /* v25.52 (HUISSTIJL2): navy-ink; ink-3 4,56:1 op wit (was 4,15) */
  --accent:var(--merk-blauw); --accent-wash:color-mix(in srgb, var(--merk-licht) 14%, transparent); /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): = de trui van het logo, wash uit de cirkel */ --gold:#A87E2F;
  --accent-tekst:var(--merk-op-blauw); --accent-donker:var(--merk-blauw-donker); --accent-lijn:color-mix(in srgb, var(--merk-licht) 45%, transparent); /* v25.52 (HUISSTIJL2): tekst op accent = de kraag op de trui (8,8:1) */
  --accent-verloop:linear-gradient(135deg, var(--merk-licht), var(--merk-blauw) 65%); /* v25.52 (HUISSTIJL2): cirkel → trui; de tekst staat op het merkblauwe deel */
  --good:#149E6F; --good-text:#0C7E57; --bad:#C93F38; --bad-text:#B23A33; /* v25.52 (HUISSTIJL2, H-5): --bad iets dieper rood, LIVE-tag wit erop 4,9:1 (was 4,5) */
  --user-bubble:color-mix(in srgb, var(--merk-licht) 18%, #fff); /* v25.52 (HUISSTIJL2): eigen chatbubbel in de merkwash (was groen) */
  --shadow:0 1px 2px color-mix(in srgb, var(--merk-navy) 5%, transparent), 0 10px 32px color-mix(in srgb, var(--merk-navy) 9%, transparent);
  --input-bg:#FFFFFF; --seg-bg:#E4EBF7; --tt-bg:#FFFFFF; /* v25.52 (HUISSTIJL2): segmentkiezer koel (was groen-grijs) */
  --stat-bg:color-mix(in srgb, var(--merk-navy) 3.5%, transparent); --hl-bg:color-mix(in srgb, var(--merk-licht) 8%, transparent);
  --chart-grid:color-mix(in srgb, var(--merk-navy) 16%, transparent); --chart-grid-2:color-mix(in srgb, var(--merk-navy) 5.5%, transparent);
  --bench-sp:#A87E2F; --bench-aex:var(--merk-blauw); --port:#0E9F6E; /* v25.52 (HUISSTIJL2): AEX = merkblauw (was los blauw) */
  --big-a:var(--merk-navy); --big-b:var(--merk-blauw); --glow:color-mix(in srgb, var(--merk-licht) 12%, transparent); /* v25.52 (HUISSTIJL2): het grote bedrag navy → merkblauw (was → groen); gloed = de cirkel */
  --nw-blauw:#0A3CBD; --nw-paars:#6A56D6; /* v25.46 (nieuws-client) · v25.52 (HUISSTIJL2): blauw = de trui van het logo (= --merk-blauw; letterlijk vanwege de pin in test-nieuws-client) */
  color-scheme:light;
}
/* … of automatisch via systeemvoorkeur */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --ground:#F3F6FB; --card:#FFFFFF; --card-2:#EAF0FA; /* v25.52 (HUISSTIJL2): blauw-grijs (was groen-grijs) */
    --line:color-mix(in srgb, var(--merk-navy) 9%, transparent); --line-2:color-mix(in srgb, var(--merk-navy) 17%, transparent);
    --ink:var(--merk-navy); --ink-2:#4B5166; --ink-3:#6E7590; /* v25.52 (HUISSTIJL2): navy-ink; ink-3 4,56:1 op wit (was 4,15) */
    --accent:var(--merk-blauw); --accent-wash:color-mix(in srgb, var(--merk-licht) 14%, transparent); /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): = de trui van het logo, wash uit de cirkel */ --gold:#A87E2F;
    --accent-tekst:var(--merk-op-blauw); --accent-donker:var(--merk-blauw-donker); --accent-lijn:color-mix(in srgb, var(--merk-licht) 45%, transparent); /* v25.52 (HUISSTIJL2): tekst op accent = de kraag op de trui (8,8:1) */
    --accent-verloop:linear-gradient(135deg, var(--merk-licht), var(--merk-blauw) 65%); /* v25.52 (HUISSTIJL2): cirkel → trui; de tekst staat op het merkblauwe deel */
    --good:#149E6F; --good-text:#0C7E57; --bad:#C93F38; --bad-text:#B23A33; /* v25.52 (HUISSTIJL2, H-5): --bad iets dieper rood, LIVE-tag wit erop 4,9:1 (was 4,5) */
    --user-bubble:color-mix(in srgb, var(--merk-licht) 18%, #fff); /* v25.52 (HUISSTIJL2): eigen chatbubbel in de merkwash (was groen) */
    --shadow:0 1px 2px color-mix(in srgb, var(--merk-navy) 5%, transparent), 0 10px 32px color-mix(in srgb, var(--merk-navy) 9%, transparent);
    --input-bg:#FFFFFF; --seg-bg:#E4EBF7; --tt-bg:#FFFFFF; /* v25.52 (HUISSTIJL2): segmentkiezer koel (was groen-grijs) */
    --stat-bg:color-mix(in srgb, var(--merk-navy) 3.5%, transparent); --hl-bg:color-mix(in srgb, var(--merk-licht) 8%, transparent);
    --chart-grid:color-mix(in srgb, var(--merk-navy) 16%, transparent); --chart-grid-2:color-mix(in srgb, var(--merk-navy) 5.5%, transparent);
    --bench-sp:#A87E2F; --bench-aex:var(--merk-blauw); --port:#0E9F6E; /* v25.52 (HUISSTIJL2): AEX = merkblauw (was los blauw) */
    --big-a:var(--merk-navy); --big-b:var(--merk-blauw); --glow:color-mix(in srgb, var(--merk-licht) 12%, transparent); /* v25.52 (HUISSTIJL2): het grote bedrag navy → merkblauw (was → groen); gloed = de cirkel */
    --nw-blauw:#0A3CBD; --nw-paars:#6A56D6; /* v25.46 (nieuws-client) · v25.52 (HUISSTIJL2): blauw = de trui van het logo (= --merk-blauw; letterlijk vanwege de pin in test-nieuws-client) */
    color-scheme:light;
  }
}
*{box-sizing:border-box}
html{background:var(--ground)}
html,body{overflow-x:clip}
body{
  margin:0; color:var(--ink); background:var(--ground);
  background-image:radial-gradient(600px 320px at 80% -60px, var(--glow), transparent 65%);
  background-repeat:no-repeat;
  font:15px/1.55 "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100svh;
}
/* v25.32: ruimte onderin voor de tabbalk (+ veilige zone op iPhone) */
.screen{max-width:520px; margin:0 auto; padding:max(22px, env(safe-area-inset-top)) 18px calc(104px + env(safe-area-inset-bottom))}
.screen.center{display:grid; place-items:center; min-height:90svh}
[hidden]{display:none !important}

/* v25.32 (redesign "De Belegger Mobile"): overal de app-weergave — één
   gecentreerde kolom met de tabbalk onderin, op elk formaat hetzelfde ontwerp.
   (De oude twee-koloms desktopgrid is bewust vervallen; de losse grid-column-
   regels verderop zijn zonder grid onschadelijk.) */
@media (min-width:900px){
  .screen{padding:30px 18px calc(104px + env(safe-area-inset-bottom))} /* de tabbalk staat ook op desktop onderin */
  .chatview{min-height:calc(100svh - 138px)} /* assistent-invoer onderaan verankerd, ook bij een korte chat */
}

.eyebrow{font-size:10.5px; font-weight:600; letter-spacing:.32em; color:var(--gold); text-transform:uppercase}
h1,h2{font-family:"Archivo","IBM Plex Sans",sans-serif; font-weight:800; letter-spacing:-.02em; margin:4px 0 0}
h1{font-size:34px} h2{font-size:24px}
.sub{color:var(--ink-2); margin:8px 0 0}

.card{background:var(--card); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow)}
#screen-home > section.card{margin-bottom:16px}

/* auth */
.authwrap{padding-top:9svh; display:flex; flex-direction:column; gap:22px}
.authcard{padding:22px 20px; display:flex; flex-direction:column; gap:8px}
label{font-size:12px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-top:8px}
input{
  font:inherit; font-size:16px; color:var(--ink); background:var(--input-bg);
  border:1px solid var(--line-2); border-radius:12px; padding:13px 15px; width:100%;
}
input:focus-visible{outline:2px solid var(--accent); border-color:var(--accent)}
input:disabled{opacity:.5}
.btn{
  display:block; text-align:center; text-decoration:none; appearance:none; border:none; cursor:pointer;
  font:inherit; font-weight:700; font-size:15px; margin-top:14px;
  background:var(--accent-verloop); color:var(--accent-tekst) /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): tekst op accent via token */; padding:14px 24px; border-radius:12px;
  box-shadow:0 8px 30px color-mix(in srgb, var(--accent) 22%, transparent);
}
.btn:active{transform:scale(.985)}
.btn:disabled{opacity:.6; cursor:wait}
.btn.ghost{background:transparent; color:var(--ink-2); box-shadow:none; border:1px solid var(--line-2)}
.btn.google{
  background:#fff; color:#1a1a1a; margin-top:0;
  display:flex; align-items:center; justify-content:center; gap:10px;
  box-shadow:0 8px 30px rgba(0,0,0,.35);
}
.divider{display:flex; align-items:center; gap:12px; color:var(--ink-3); font-size:12px}
.divider::before,.divider::after{content:""; flex:1; border-top:1px solid var(--line)}
.error{color:var(--bad-text); font-size:13.5px; margin:8px 0 0}
.hint{font-size:12.5px; color:var(--ink-3); margin:12px 0 0}
.hint a{color:var(--accent)}

.spinner{
  width:34px; height:34px; border-radius:50%;
  border:3px solid var(--line-2); border-top-color:var(--accent);
  animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){ .spinner{animation-duration:2s} }

/* paywall */
.paycard{padding:26px 22px; text-align:center; display:flex; flex-direction:column; gap:10px; max-width:420px}
.paycard p{color:var(--ink-2); margin:0}

/* home */
.apphead{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:18px}
.headright{display:flex; align-items:center; gap:10px; padding-top:6px}
.planchip{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); background:var(--accent-wash); border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); padding:5px 11px; border-radius:999px; white-space:nowrap}
.iconbtn{appearance:none; cursor:pointer; background:var(--card); color:var(--ink-2); border:1px solid var(--line-2); border-radius:10px; width:36px; height:36px; font-size:16px}

.chatcard{display:flex; flex-direction:column; overflow:hidden}
.chat-head{padding:14px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px}
.avatar{width:30px; height:30px; border-radius:50%; background:var(--accent-verloop); display:grid; place-items:center; font-weight:800; font-size:13px; color:var(--accent-tekst); font-family:"Archivo",sans-serif} /* v25.52 (HUISSTIJL2): het knopverloop als token (cirkel → trui) */
.chat-head b{font-family:"Archivo",sans-serif}
.sub2{display:block; font-size:12px; color:var(--ink-3); margin-top:-2px}
.dot{width:8px; height:8px; border-radius:50%; background:var(--good); margin-left:auto; box-shadow:0 0 8px rgba(52,201,142,.8)}
.msgs{padding:16px}
.msg{padding:11px 15px; border-radius:15px; font-size:14px; white-space:pre-line; line-height:1.5}
.msg.ai{background:var(--card-2); border:1px solid var(--line); border-bottom-left-radius:5px}
.inputrow{display:flex; gap:10px; padding:13px 15px; border-top:1px solid var(--line)}
.inputrow input{flex:1}
.send{appearance:none; border:none; font:inherit; font-weight:700; background:var(--accent-verloop); color:var(--accent-tekst) /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): tekst op accent via token */; border-radius:11px; padding:0 20px; opacity:.5}

/* hero (waarde + grafiek) */
.hero{padding:22px 20px 16px; margin-bottom:16px; overflow:hidden; position:relative}
.hero::before{content:""; position:absolute; inset:-1px -1px auto -1px; height:120px; pointer-events:none;
  background:radial-gradient(70% 100% at 50% 0%, var(--glow), transparent 75%)}
.hero .lbl{font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3)}
.hero .big{
  font-family:"Archivo",sans-serif; font-weight:800; font-size:clamp(30px,8.5vw,44px);
  letter-spacing:-.035em; line-height:1.04; margin-top:6px; font-variant-numeric:tabular-nums;
  background:linear-gradient(115deg, var(--big-a) 55%, var(--big-b)); -webkit-background-clip:text; background-clip:text;
  color:transparent; position:relative;
}
.deltas{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; align-items:center}
.pill{font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; padding:4px 11px; border-radius:999px; border:1px solid var(--line)}
.pill.up{color:var(--good-text); background:rgba(52,201,142,.1); border-color:rgba(52,201,142,.3)}
.pill.down{color:var(--bad-text); background:rgba(229,96,90,.1); border-color:rgba(229,96,90,.3)}
.pill.mut{color:var(--ink-2)}
.refreshbtn{appearance:none; cursor:pointer; background:transparent; font:inherit; font-size:12.5px; font-weight:600}
.refreshbtn:hover{border-color:var(--accent); color:var(--accent)}
.refreshbtn:disabled{opacity:.5; cursor:wait}
.chartbox{position:relative; margin:14px -6px 0}
.chartbox svg{display:block; width:100%; height:auto}
.tooltip{
  position:absolute; pointer-events:none; opacity:0; transition:opacity .1s ease;
  background:var(--tt-bg); border:1px solid var(--line-2); border-radius:10px; padding:7px 11px;
  font-size:12px; box-shadow:0 10px 30px rgba(0,0,0,.5); white-space:nowrap; z-index:5;
}
.tooltip b{font-family:"Archivo",sans-serif; font-size:13px; font-variant-numeric:tabular-nums}
.tooltip .tt-date{color:var(--ink-3); margin-bottom:2px}
.chartnote{font-size:12.5px; color:var(--ink-3); margin:12px 0 2px}
.chartsub{font-size:11px; color:var(--ink-3); margin:8px 18px 2px; line-height:1.45}
.histcard .chartnote{margin:6px 18px 8px}
td .plchip{display:inline-block; font-size:12px; font-weight:700; padding:3px 8px; border-radius:7px; font-variant-numeric:tabular-nums}
.plchip.up{color:var(--good-text); background:rgba(52,201,142,.12)}
.plchip.down{color:var(--bad-text); background:rgba(229,96,90,.12)}

/* hero stats */
.herosub{font-size:12.5px; color:var(--ink-3); margin-top:2px; font-variant-numeric:tabular-nums}
.statgrid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px}
/* v25.32: de statistieken blijven 2×2, zoals het ontwerp */
.stat{background:var(--stat-bg); border:1px solid var(--line); border-radius:14px; padding:12px 15px; display:flex; flex-direction:column; gap:3px}
.stat .slbl{font-size:10px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3)}
.stat b{font-family:"Archivo",sans-serif; font-size:17.5px; letter-spacing:-.01em; font-variant-numeric:tabular-nums; font-weight:700}
.stat b.up{color:var(--good-text)} .stat b.down{color:var(--bad-text)}
.stat b.unk{font-family:"IBM Plex Sans",sans-serif; font-size:11.5px; font-weight:600; color:var(--gold); align-self:flex-start; margin-top:3px}

/* verdeling + historie kaarten */
.cardhead{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:16px 18px 6px; flex-wrap:wrap}
.cardhead b{font-family:"Archivo",sans-serif; font-size:15px}
.seg{display:flex; background:var(--seg-bg); border:1px solid var(--line); border-radius:10px; padding:3px}
.seg button{appearance:none; border:none; cursor:pointer; font:inherit; font-size:12px; font-weight:600; color:var(--ink-2); background:transparent; padding:6px 11px; border-radius:8px}
.seg button.on{background:var(--card-2); color:var(--ink)}
.seg button:focus-visible{outline:2px solid var(--accent)}
.alloccard, .histcard{padding-bottom:14px}
.segscroll{overflow-x:auto; scrollbar-width:none; max-width:100%}
.segscroll::-webkit-scrollbar{display:none}
.segscroll button{flex:none}
.serieslegend{display:flex; flex-wrap:wrap; gap:8px 16px; padding:8px 18px 0; font-size:12px; color:var(--ink-2)}
.serieslegend .sl{display:flex; align-items:center; gap:7px; font-variant-numeric:tabular-nums; white-space:nowrap}
.serieslegend .sl i{width:14px; height:0; border-top:2.5px solid; border-radius:2px}
.serieslegend .sl.dash i{border-top-style:dashed; border-top-width:2px}
.serieslegend b{font-family:"Archivo",sans-serif; font-weight:700}
.serieslegend b.up{color:var(--good-text)} .serieslegend b.down{color:var(--bad-text)}
.donutrow{display:flex; gap:20px; align-items:center; flex-wrap:wrap; padding:10px 18px 6px}
.donutbox{position:relative; width:170px; height:170px; margin:0 auto}
.donut-center{position:absolute; inset:0; display:grid; place-items:center; text-align:center; pointer-events:none; padding:0 26px}
.donut-center .dv{font-family:"Archivo",sans-serif; font-weight:800; font-size:16px; font-variant-numeric:tabular-nums}
.donut-center .dl{font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); margin-top:2px; line-height:1.3}
.legend{display:grid; gap:6px; font-size:12.5px; min-width:170px; flex:1}
.legend .lg{display:grid; grid-template-columns:10px 1fr auto; gap:10px; align-items:center; padding:5px 8px; border-radius:8px; cursor:pointer}
.legend .lg.hl{background:var(--hl-bg)}
.legend .lgname{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:13px}
.legend .lgpct{font-family:"Archivo",sans-serif; font-weight:700; font-variant-numeric:tabular-nums; font-size:13px}
.swatch{display:inline-block; width:9px; height:9px; border-radius:3px; margin-right:8px; vertical-align:1px}
.chartbox{padding:0 10px}

/* empty state */
.emptycard{padding:28px 22px; text-align:center; display:flex; flex-direction:column; gap:10px; align-items:center}
.emptycard h2{margin:0}
.emptycard p{color:var(--ink-2); margin:0; max-width:40ch}
.emptycard .btn{margin-top:6px}

/* floating chat button */
.fab{
  position:fixed; right:18px; bottom:max(18px, env(safe-area-inset-bottom)); z-index:40;
  width:58px; height:58px; border-radius:50%; border:none; cursor:pointer;
  background:var(--accent-verloop); color:var(--accent-tekst) /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): tekst op accent via token */;
  display:grid; place-items:center; box-shadow:0 10px 34px color-mix(in srgb, var(--accent) 40%, transparent);
  transition:transform .15s ease;
}
.fab:active{transform:scale(.94)}
.fab:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 40%, transparent); outline-offset:2px}
.fabbadge{position:absolute; top:2px; right:2px; width:13px; height:13px; border-radius:50%; background:var(--gold); border:2px solid var(--ground)}

/* slide-over drawer */
.drawer{position:fixed; inset:0; z-index:50; pointer-events:none}
.backdrop{position:absolute; inset:0; background:rgba(0,0,0,.55); opacity:0; transition:opacity .25s ease}
.sheet{
  position:absolute; left:0; right:0; bottom:0; max-height:90svh; height:min(640px, 90svh);
  display:flex; flex-direction:column; border-radius:22px 22px 0 0;
  transform:translateY(108%); transition:transform .28s cubic-bezier(.32,.72,.29,1);
}
.drawer.on{pointer-events:auto}
.drawer.on .backdrop{opacity:1}
.drawer.on .sheet{transform:none}
/* v25.32: ook op brede schermen een onderin-sheet (app-weergave overal),
   gecentreerd op de breedte van de app-kolom. */
@media (min-width:820px){
  .sheet{left:50%; right:auto; transform:translateX(-50%) translateY(108%); width:520px}
  .drawer.on .sheet{transform:translateX(-50%)}
}
@media (prefers-reduced-motion: reduce){ .sheet,.backdrop{transition:none} }
.closebtn{margin-left:auto}
/* v25.11: wis-knop in de chatkop — de ✕ ernaast verliest dan zijn auto-marge */
.chat-head .wisbtn{margin-left:auto; font-size:14px}
.chat-head .wisbtn + .closebtn{margin-left:0}
/* Eerlijk bewaar-regeltje boven een geladen geschiedenis */
.chatnote{font-size:11.5px; color:var(--ink-3); text-align:center; padding:2px 14px 8px; line-height:1.45}
.msgs{flex:1; min-height:0}

/* attachments strip */
.attachstrip{display:flex; gap:8px; padding:10px 15px 0; flex-wrap:wrap}
.attach{position:relative; width:56px; height:56px; border-radius:10px; overflow:hidden; border:1px solid var(--line-2)}
.attach img{width:100%; height:100%; object-fit:cover; display:block}
.attach button{
  position:absolute; top:2px; right:2px; width:18px; height:18px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(0,0,0,.7); color:#fff; font-size:11px; line-height:1; display:grid; place-items:center; padding:0;
}

/* chat (live) */
.msgs{display:flex; flex-direction:column; gap:10px; overflow-y:auto; scrollbar-width:thin; padding:16px}
.msg.user{background:var(--user-bubble); border:1px solid color-mix(in srgb, var(--accent) 20%, transparent); border-bottom-right-radius:5px; align-self:flex-end; max-width:88%}
.msg.ai{align-self:flex-start; max-width:92%}
.msg img{max-width:180px; border-radius:10px; display:block}
.typing{display:inline-flex; gap:4px; padding:2px}
.typing i{width:6px; height:6px; border-radius:50%; background:var(--ink-3); animation:blink 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
.camerabtn{
  flex:none; display:grid; place-items:center; width:46px; border-radius:11px; cursor:pointer;
  background:var(--card-2); border:1px solid var(--line-2); font-size:19px;
}
.send:disabled{opacity:.5}
#chatInput{flex:1}

/* portfolio card */
.pfcard{margin-bottom:16px}
.pf-head{display:flex; justify-content:space-between; align-items:center; padding:14px 18px 4px}
.pf-head b{font-family:"Archivo",sans-serif}
.pfbadge{font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; padding:4px 10px; border-radius:999px; border:1px solid var(--gold); color:var(--gold)}
.pfbadge.ok{border-color:color-mix(in srgb, var(--accent) 45%, transparent); color:var(--accent); background:var(--accent-wash)}
.tablewrap{overflow-x:auto; padding:4px 8px 4px}
.pfcard table{border-collapse:collapse; width:100%; font-size:13px}
.pfcard th{font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); font-weight:600; text-align:right; padding:7px 9px; border-bottom:1px solid var(--line)}
.pfcard th:first-child{text-align:left}
.pfcard td{padding:8px 9px; text-align:right; font-variant-numeric:tabular-nums; border-bottom:1px solid var(--line); white-space:nowrap}
.pfcard td:first-child{text-align:left; font-weight:600}
.pfcard tr:last-child td{border-bottom:none}
.pf-foot{padding:8px 18px 14px; font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums}

.roadmap{display:grid; gap:10px; margin-top:18px}
.step{padding:14px 16px; display:flex; gap:12px; align-items:center; color:var(--ink-2); font-size:14px}
.step span{flex:none; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; font-weight:700; font-size:12px; background:var(--card-2); border:1px solid var(--line-2); color:var(--ink-3)}
.step.done span{background:var(--accent-wash); border-color:color-mix(in srgb, var(--accent) 40%, transparent); color:var(--accent)}
.step.done{color:var(--ink)}
.step.next span{border-color:var(--gold); color:var(--gold)}

/* CSV-import + AI-upsell */
.pf-actions{display:flex; align-items:center; gap:8px}
.importbanner{padding:16px 20px; border:1px solid color-mix(in srgb, var(--accent) 40%, transparent); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent) 4%, transparent))}
.importbanner b{font-family:"Archivo",sans-serif}
.importbanner p{margin:6px 0 0; color:var(--ink-2); font-size:13.5px}
/* =====================================================
   v25.19 — compounding-regel, verdeling-extra's, ＋Transactie,
   tevredenheidsvraag en het redactie-overzicht
   ============================================================ */
.compound{margin:12px 2px 0; font-size:12.5px; color:var(--ink-2); line-height:1.5; cursor:pointer}
.compound b{color:var(--ink); font-variant-numeric:tabular-nums}
.compound .cmpnote{color:var(--ink-3)}
.compound .cmphint{display:block; margin-top:2px; color:var(--pos, var(--good-text)); font-weight:600; font-size:12px} /* v25.52 (HUISSTIJL2): groen via --good-text (was hard-coded) */
.compound:hover .cmphint{text-decoration:underline}

/* v25.20: de compounding-grafiek (3 scenario's + jaartabel) */
.compoundcard .cardhead{display:flex; justify-content:space-between; align-items:center}
.cmplegend{display:flex; flex-wrap:wrap; gap:8px 16px; margin:8px 0 4px}
.cmpchip{display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--ink-2); white-space:nowrap}
.compoundcard .chartbox{margin:4px 0 8px}
.compoundcard svg{width:100%; height:auto; display:block}
.tablewrap{overflow-x:auto}
.cmptabel{width:100%; border-collapse:collapse; font-size:12.5px; font-variant-numeric:tabular-nums}
.cmptabel th{text-align:right; font-weight:600; color:var(--ink-3); font-size:11.5px; padding:6px 8px; border-bottom:1px solid var(--line); white-space:nowrap}
.cmptabel th:first-child,.cmptabel td:first-child{text-align:left; color:var(--ink-2)}
.cmptabel td{text-align:right; padding:5px 8px; border-bottom:1px solid var(--line-2, var(--line)); color:var(--ink)}
.cmptabel td:nth-child(2){font-weight:600}

/* =====================================================
   v25.21: JOUW REIS — mijlpalenkaart + speels reispad
   ============================================================ */
/* compact ín de portefeuillekaart (v25.22 — zoals de goedgekeurde schets) */
.reis{margin:12px 0 2px; padding:10px 12px 9px; border:1px solid color-mix(in srgb, var(--accent) 28%, transparent); border-radius:12px;
  background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 9%, transparent), color-mix(in srgb, var(--accent) 2%, transparent)); cursor:pointer}
.reis:hover{border-color:color-mix(in srgb, var(--accent) 50%, transparent)}
.reistop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; min-width:0}
.reislbl{font-size:12.5px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0}
.reislbl b{color:var(--ink); font-family:"Archivo",sans-serif; font-size:13.5px}
.reispct{font-family:"Archivo",sans-serif; font-weight:800; font-size:15px; color:var(--pos, var(--good-text)); font-variant-numeric:tabular-nums; flex:0 0 auto} /* v25.52 (HUISSTIJL2): groen via --good-text (was hard-coded) */
.reisbar{position:relative; height:8px; margin:7px 0 7px; border-radius:6px; background:var(--line); overflow:hidden}
.reisbar i{position:absolute; top:0; bottom:0; left:0; width:0; border-radius:6px; background:linear-gradient(90deg, var(--good-text), var(--good) 60%, color-mix(in srgb, var(--good) 75%, #fff)) /* v25.52 (HUISSTIJL2): balkverloop uit --good (was hard-coded groen) */}
.reisregel{display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; font-size:11.5px; color:var(--ink-2)}
.reisregel .reisp{white-space:nowrap}
.reisregel .reisinlegchip{opacity:.85} /* v25.25: maandinleg telt mee — klein chipje */
.reisregel .reismeer{margin-left:auto; flex:0 0 auto; font-weight:700; color:var(--pos, var(--good-text)); white-space:nowrap} /* v25.52 (HUISSTIJL2): groen via --good-text (was hard-coded) */

/* het vergrote reispad (tijdlijn) */
.reismodal{max-width:460px}
.reispad{position:relative; margin:6px 0 14px; padding-left:4px}
.reispad::before{content:""; position:absolute; left:17px; top:14px; bottom:14px; width:2px; background:var(--line)}
.padrij{position:relative; display:flex; align-items:center; gap:12px; padding:7px 0}
.paddot{position:relative; z-index:1; width:28px; height:28px; flex:0 0 28px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--card, #fff); border:2px solid var(--line); font-size:13px}
.padrij.af .paddot{background:var(--pos, var(--good)); border-color:var(--pos, var(--good)); color:#fff; font-weight:800} /* v25.52 (HUISSTIJL2): groen via --good (was hard-coded groen) */
.padrij.af .padtekst b{color:var(--ink-2); text-decoration:line-through; text-decoration-thickness:1px}
.padrij.toe{cursor:pointer; border-radius:10px}
.padrij.toe:hover{background:color-mix(in srgb, var(--accent) 7%, transparent)}
.padrij.nu .paddot{border-color:var(--pos, var(--good))} /* v25.52 (HUISSTIJL2): groen via --good (was hard-coded groen) */
.padtekst{display:flex; flex-direction:column}
.padtekst b{font-family:"Archivo",sans-serif; font-size:14px; color:var(--ink)}
.padtekst span{font-size:11.5px; color:var(--ink-2)}
.padrij.nu .padtekst b{color:var(--pos, var(--good-text))} /* v25.52 (HUISSTIJL2): groen via --good-text (was hard-coded) */
.padrij.eigenpad .padtekst b{color:var(--gold)} /* v25.52 (HUISSTIJL2): goud via token */
.padkies{margin-left:auto; font-size:11.5px; font-weight:600; color:var(--pos, var(--good-text)); white-space:nowrap} /* v25.52 (HUISSTIJL2): groen via --good-text (was hard-coded) */
.paddot.pulse::before{content:""; position:absolute; inset:-2px; border-radius:50%; border:2px solid var(--pos, var(--good)); animation:reispuls 1.8s ease-out infinite} /* v25.52 (HUISSTIJL2): groen via --good (was hard-coded groen) */
.paddot.pulse::after{content:""; width:10px; height:10px; border-radius:50%; background:var(--pos, var(--good))} /* v25.52 (HUISSTIJL2): groen via --good (was hard-coded groen) */
@keyframes reispuls{0%{transform:scale(1); opacity:.8}70%{transform:scale(1.7); opacity:0}100%{transform:scale(1.7); opacity:0}}
@media (prefers-reduced-motion: reduce){.paddot.pulse::before{animation:none} .reisbar i,.reisbar .vlag{transition:none !important}}
.reiseigenform b{font-size:13px}
.reiseigenrij{display:flex; gap:8px; margin-top:8px; flex-wrap:wrap}
.reiseigenrij input{flex:1; min-width:110px; padding:9px 11px; border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--ink); font:inherit}

/* =====================================================
   v25.24: artikelen native lezen — huisstijl, alles in de app
   ============================================================ */
/* v25.26 (verzoek Rabi): echte leesmarges — de artikelkaart had als enige kaart
   géén eigen padding, waardoor tekst tegen de rand plakte en de ronde hoek de
   leestijd afknipte. Zelfde marges als de nieuwslijst → één platformgevoel. */
.art2{padding:18px 18px 16px}
.art2-top{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; gap:10px; flex-wrap:wrap}
.art2-terug{border:none; background:transparent; font:600 13.5px "IBM Plex Sans",sans-serif; color:var(--pos, var(--accent)); cursor:pointer; padding:6px 2px; margin-left:-2px} /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
.art2-meta{font-size:11.5px; color:var(--ink-3); text-align:right; min-width:0}
.art2 h1:not(.artdb *){font-family:"Archivo",sans-serif; font-size:24px; line-height:1.22; margin:0 0 10px; color:var(--ink)} /* v25.52 (SUPPORT9, A4, melding 98): de lezer-typografie geldt niet binnen een ingebedde widget (.artdb) — die heeft eigen kleuren en tokens; gemeten: kop/lead in het donkere widgetdeel 1,04 : 1 in beide thema's */
.art2 h2:not(.artdb *),.art2 h3:not(.artdb *),.art2 h4:not(.artdb *){font-family:"Archivo",sans-serif; margin:20px 0 8px; color:var(--ink)} /* v25.52 (SUPPORT9, A4, melding 98): niet binnen .artdb */
.art2 h2:not(.artdb *){font-size:18px} .art2 h3:not(.artdb *){font-size:16px} .art2 h4:not(.artdb *){font-size:15px} /* v25.52 (SUPPORT9, A4, melding 98): niet binnen .artdb */
.art2-intro{font-size:15.5px; line-height:1.55; color:var(--ink-2); margin:0 0 14px}
.art2 #artBody p:not(.artdb *){font-size:15px; line-height:1.7; margin:0 0 14px; color:var(--ink)} /* v25.52 (SUPPORT9, A4, melding 98): niet binnen .artdb — de id-selector won van de klasse-scope van de widget-css (art47CssScope) en zette var(--ink) van de widget op de tekst */
.art2 #artBody a:not(.artdb *){color:var(--pos, var(--accent)); text-decoration:none; border-bottom:1px solid color-mix(in srgb, var(--accent) 35%, transparent)} /* v25.52 (SUPPORT9, A4, melding 98): niet binnen .artdb */ /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
/* v25.25: knoppen in het artikel zijn een uitzondering op de groene linkkleur —
   de "Lees op debelegger.nl"-knop was live onleesbaar (groen op groen). */
.art2 #artBody a.btn:not(.artdb *),.art2 #artBody a.artknop:not(.artdb *){color:var(--accent-tekst); border-bottom:none} /* v25.52 (SUPPORT9, A4, melding 98): niet binnen .artdb */ /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
/* v25.25: nette foutkaart in plaats van losse regels + knop door elkaar */
.artfout{border:1px solid var(--line); border-radius:12px; padding:16px; margin:6px 0 14px; background:rgba(127,127,127,.05)}
.artfout p{margin:0 0 4px !important; color:var(--ink-2)}
.artfoutacties{display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.artfoutacties .btn{margin-top:8px}
.artlaad{color:var(--ink-3)}
.artcover,.artfig img,.artgif{width:100%; border-radius:10px; margin:2px 0 6px; display:block}
.artfig{margin:0 0 6px}
.art2-caption,.artfig figcaption{font-size:11px; color:var(--ink-3); margin:2px 0 14px}
.artgalerij{display:flex; gap:8px; overflow-x:auto; margin:4px 0 14px; -webkit-overflow-scrolling:touch}
.artgalerij img{width:44%; flex:0 0 auto; border-radius:8px; margin:0}
.artvideo{position:relative; width:100%; aspect-ratio:16/9; border-radius:10px; overflow:hidden; margin:4px 0 14px; background:rgba(127,127,127,.08)}
.artvideo iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.artvid{width:100%; border-radius:10px; margin:4px 0 14px; display:block}
.artaudio{width:100%; margin:4px 0 14px}
.artembed{width:100%; height:420px; border-radius:10px; overflow:hidden; margin:4px 0 14px; background:rgba(127,127,127,.06)}
.artembed iframe{width:100%; height:100%; border:0}
.artscheiding{border:none; border-top:1px solid var(--line); margin:18px 0}
.art2-quote{border-left:3px solid var(--pos, var(--accent)); padding:2px 0 2px 14px; margin:16px 0; color:var(--ink-2); font-style:italic} /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
.art2-quote p{margin-bottom:6px !important}
.artcode{padding:12px 14px; border:1px solid var(--line); border-radius:10px; overflow-x:auto; font-size:12.5px; margin:0 0 14px}
.artlijst{margin:0 0 14px; padding-left:22px}
.artlijst li{margin:4px 0; font-size:15px; line-height:1.6; color:var(--ink)}
.artlijst li p{margin:0 0 4px !important}
.artklap{border:1px solid var(--line); border-radius:10px; padding:10px 14px; margin:0 0 10px}
.artklap summary{cursor:pointer; font-weight:600; color:var(--ink)}
.artknop{display:inline-block; margin:2px 0 14px}
.artpoll{padding:12px 14px; border:1px dashed var(--line); border-radius:10px; margin:0 0 14px; font-size:13.5px; color:var(--ink-2)}
.artpoll a{color:var(--pos, var(--accent)); font-weight:600} /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
.art2-tags{display:flex; flex-wrap:wrap; gap:8px; margin:18px 0 0}
.art2-tag{padding:7px 12px; border:1px solid color-mix(in srgb, var(--accent) 40%, transparent); border-radius:999px; background:color-mix(in srgb, var(--accent) 8%, transparent); font-size:12.5px; font-weight:600; color:var(--pos, var(--accent)); text-decoration:none} /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
.art2-voet{margin-top:16px; padding-top:12px; border-top:1px solid var(--line); font-size:12px; color:var(--ink-3); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px}
.art2-voet a{color:var(--pos, var(--accent)); font-weight:600; text-decoration:none} /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
.art2-tabel{width:100%; border-collapse:collapse; font-size:13px; font-variant-numeric:tabular-nums; margin:6px 0 14px}
.art2-tabel th{text-align:left; font-weight:600; color:var(--ink-3); font-size:11.5px; padding:7px 8px; border-bottom:1px solid var(--line)}
.art2-tabel td{text-align:left; padding:7px 8px; border-bottom:1px solid var(--line); color:var(--ink)}
.art2-tabel p{margin:0 !important}

/* v25.20: keuze bij upload + leegmaak-knoppen */
.upbtn{display:block; width:100%; text-align:left; margin-bottom:8px; line-height:1.35}
.upbtn i{display:block; font-style:normal; font-weight:400; font-size:12px; opacity:.75; margin-top:3px}
.upcancel{display:block; margin:6px auto 0}

.lgsub{margin-top:10px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; display:flex; flex-direction:column; gap:6px}
.lgsub .lgsubkop{font-size:11.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3)}
.lgsub .lg{display:flex; align-items:center; gap:8px; font-size:12.5px}
.alloccash{margin:10px 2px 0; font-size:12.5px; color:var(--ink-2); font-variant-numeric:tabular-nums}

.txoverlay{position:fixed; inset:0; background:rgba(6,10,8,.55); backdrop-filter:blur(3px); z-index:60; display:flex; align-items:center; justify-content:center; padding:16px}
.txmodal{width:100%; max-width:430px; max-height:92vh; overflow:auto; padding:18px 20px}
.txmodal .cardhead{display:flex; justify-content:space-between; align-items:center; margin-bottom:10px}
.txtypes{display:flex; flex-wrap:wrap; gap:4px; margin-bottom:12px}
.txrij{display:flex; gap:10px}
.txrij .txveld{flex:1}
.txveld{display:flex; flex-direction:column; margin-bottom:8px}
.txveld label{margin-top:0}
.txveld select,.txveld input{padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--card, transparent); color:var(--ink); font:inherit}
.txhint{margin-top:10px}
#txOpslaan{width:100%; margin-top:4px}

.fbcard b{font-family:"Archivo",sans-serif}
.fbsub{margin:6px 0 10px; color:var(--ink-2); font-size:13px}
.fbbtns{display:flex; flex-wrap:wrap; gap:8px}
.fbbtn{flex:1; min-width:110px; padding:9px 10px; font-size:13px}
.fbbtn.fbon{border-color:var(--pos, var(--good-text)); color:var(--ink)} /* v25.52 (HUISSTIJL2): 'positief' = --good-text (was hard-coded groen) */
.fbmeer{margin-top:10px; display:flex; flex-direction:column; gap:8px}
.fbmeer textarea{padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--ink); font:inherit; resize:vertical}

.rdkop{margin:6px 0 10px; color:var(--ink-2); font-size:13px}
.rdrij{display:flex; align-items:center; gap:10px; margin:6px 0}
.rdlbl{width:130px; font-size:12.5px; color:var(--ink-2)}
.rdbar{flex:1; height:10px; border-radius:6px; background:var(--line); overflow:hidden}
.rdbar i{display:block; height:100%; border-radius:6px}
.rdn{width:76px; text-align:right; font-size:12.5px; font-variant-numeric:tabular-nums}
.rdcite{margin:8px 0; padding:8px 12px; border-left:3px solid var(--line); font-size:13px; color:var(--ink-2)}
.rdcite i{display:block; font-style:normal; font-size:11.5px; color:var(--ink-3); margin-top:2px}

/* v25.18: het "alles verkocht"-dashboard — historie zichtbaar zonder open posities */
.boekleeg{padding:6px 2px}
.boekleeg p{margin:8px 0; color:var(--ink-2); font-size:13.5px; line-height:1.55}
.boekleeg p b{color:var(--ink)}
.boekleeg .bstats{display:flex; flex-wrap:wrap; gap:8px 20px; margin:12px 0; padding:12px 14px; border:1px solid var(--line); border-radius:10px}
.boekleeg .bstats span{font-size:12.5px; color:var(--ink-2)}
.boekleeg .bstats b{color:var(--ink); font-variant-numeric:tabular-nums}

/* v25.17: knopje om de bewaarde importbestanden (de bibliotheek) te wissen */
.bibwisbtn{margin-top:10px; padding:6px 10px; border:1px solid var(--line); border-radius:8px; background:transparent; color:var(--ink-2); font:inherit; font-size:12.5px; cursor:pointer}
.bibwisbtn:hover{color:var(--ink); border-color:var(--ink-3)}
.aiupsell{padding:26px 22px; overflow-y:auto}
.aiupsell h2{margin:6px 0 12px}
.aiupsell .freeused{margin:-4px 0 14px; font-size:13.5px; color:var(--ink-2); background:color-mix(in srgb, var(--accent) 10%, transparent); border:1px solid color-mix(in srgb, var(--accent) 25%, transparent); border-radius:10px; padding:9px 12px}
.aiupsell ul{margin:0 0 18px; padding:0 0 0 2px; list-style:none; display:grid; gap:9px}
.aiupsell li{color:var(--ink-2); font-size:14px; padding-left:24px; position:relative}
.aiupsell li::before{content:"✦"; position:absolute; left:0; color:var(--accent)}
.aiprice{display:flex; align-items:baseline; gap:6px; margin-bottom:4px}
.aiprice b{font-family:"Archivo",sans-serif; font-size:34px; letter-spacing:-.02em}
.aiprice span{color:var(--ink-3); font-size:13px}
.aiupsell .btn{width:100%}
.aiupsell .hint{text-align:center}

.appversion{position:fixed; left:10px; bottom:6px; font-size:9px; color:var(--ink-3); opacity:.6; z-index:5; pointer-events:none}
/* v25.25: tijdens het lezen van een artikel geen versienummer over de voettekst */
body.artopen .appversion{display:none}

/* v13: verplaatst uit de JS-injectie + nieuw */
.pf-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.linkbtn{background:none;border:none;padding:4px 0;color:var(--ink-3);font:inherit;font-size:12.5px;cursor:pointer;text-decoration:none}
.linkbtn:hover{color:var(--ink)}
tr.subhead td{padding-top:14px;color:var(--ink-3);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;border-bottom:none}
.kostenrows{margin:4px 18px 10px}
.krow{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.krow:last-child{border-bottom:none}
.krow b{font-variant-numeric:tabular-nums;font-weight:600;text-align:right}
.krow .kneg,.krow b.kneg{color:var(--bad-text)}
.krow .kpos,.krow b.kpos{color:var(--good-text)}
.krow.ksub{color:var(--ink-3);font-size:12px}
.krow.ksub b{color:var(--ink-3);font-weight:500}
.possub{margin-top:2px;font-size:10.5px;color:var(--ink-3);font-weight:400;letter-spacing:0;white-space:nowrap}
.possub .kpos{color:var(--good-text)}
.possub .kneg{color:var(--bad-text)}

/* thema-knop */
#themeBtn{font-size:15px}

/* vergrote grafiek (modal) */
.modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:18px}
.modalback{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.modalbody{position:relative;width:min(1080px,96vw);max-height:min(92svh,860px);overflow-y:auto;padding-bottom:16px}
.modalbody .chartbox{margin-top:6px}
.rangestats{margin:12px 18px 4px;display:grid;grid-template-columns:auto 1fr 1fr 1fr;gap:0;font-size:13px}
.rangestats .rs{display:contents;cursor:pointer}
.rangestats .rs > span{padding:7px 10px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;text-align:right}
.rangestats .rs > span:first-child{text-align:left;font-weight:600;color:var(--ink-2)}
.rangestats .rs.head > span{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:600;cursor:default}
.rangestats .rs:not(.head):hover > span{background:var(--hl-bg)}
.rangestats .rs.cur > span:first-child{color:var(--accent)}
.rangestats .up{color:var(--good-text)} .rangestats .down{color:var(--bad-text)}
.expandbtn{width:32px;height:32px;font-size:14px;flex:none}

/* dividend-kaart */
.divcard{padding-bottom:10px}
.divkpi{font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.divkpi b{font-family:"Archivo",sans-serif;color:var(--ink)}
.divchart{padding:6px 18px 0}
.divchart svg{display:block;width:100%;height:auto}
.divkpi .kpos{color:var(--good-text)}
.divkpi .kneg{color:var(--bad-text)}

/* v13.1: watchlist-stijl portefeuillelijst */
.plist{padding:4px 18px 6px}
.prow{display:grid;grid-template-columns:minmax(0,1fr) 96px minmax(0,auto);gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line);cursor:pointer}
.plist > .prow:last-of-type, .plist .pdetail + .prow:last-of-type{border-bottom:none}
@media (hover:hover){ .prow:hover{background:var(--hl-bg);margin:0 -10px;padding-left:10px;padding-right:10px;border-radius:10px} } /* v25.44 (review): alleen met muis */
.pleft{display:flex;flex-direction:column;gap:1px;min-width:0}
.pleft b{font-family:"Archivo",sans-serif;font-size:14.5px;letter-spacing:.01em}
.pleft span{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.psparkbox{height:30px}
.spark{display:block;width:96px;height:30px}
.pright{text-align:right;display:flex;flex-direction:column;gap:1px}
.pprice{font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.pqty{font-size:11px;color:var(--ink-3);font-weight:500}
.pday{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.pday.up{color:var(--good-text)}
.pday.down{color:var(--bad-text)}
.pday.mut{color:var(--ink-3);font-weight:500}
.psub{padding:12px 0 4px;color:var(--ink-3);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.pdetail{display:flex;flex-wrap:wrap;gap:6px 16px;padding:9px 12px;margin:2px 0 8px;background:var(--stat-bg);border:1px solid var(--line);border-radius:10px;font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.pdetail b{color:var(--ink);font-weight:600}
.pdetail .kpos{color:var(--good-text)} .pdetail .kneg{color:var(--bad-text)}
@media (max-width:380px){ .prow{grid-template-columns:minmax(0,1fr) 64px auto} .spark,.psparkbox{width:64px} }

/* v14: zoeken */
.searchwrap{position:relative;margin:0 0 16px}
.searchwrap.grow{flex:1;margin:0}
.searchwrap .sicon{position:absolute;left:14px;top:50%;transform:translateY(-54%);color:var(--ink-3);font-size:17px;pointer-events:none}
.searchwrap input{padding-left:40px;border-radius:14px;background:var(--card);font-size:15px}
.searchdrop{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:45;background:var(--card);border:1px solid var(--line-2);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;max-height:340px;overflow-y:auto}
.sres{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);padding:11px 14px;cursor:pointer;font:inherit;color:var(--ink)}
.sres:last-child{border-bottom:none}
.sres:hover{background:var(--hl-bg)}
.sres b{font-family:"Archivo",sans-serif;font-size:13.5px}
.sres span{color:var(--ink-2);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sres i{font-style:normal;color:var(--ink-3);font-size:10.5px;letter-spacing:.05em}
.sres.none{color:var(--ink-3);cursor:default;display:block}
@media (min-width:900px){ #screen-home > .searchwrap{grid-column:1/-1;margin-bottom:0;max-width:560px} }

/* v14: aandelenpagina */
.tickerscreen{max-width:520px} /* v25.32: zelfde app-kolom als home */
.tickerscreen > section.card{margin-bottom:16px}
.tickerscreen .apphead{align-items:center;gap:12px}
.tkhead{padding:18px 20px;display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}
.tkid{display:flex;flex-direction:column;gap:1px;min-width:0}
.tkid b{font-family:"Archivo",sans-serif;font-size:24px;letter-spacing:-.01em}
.tkid > span{color:var(--ink-2);font-size:13.5px}
.tkmeta{color:var(--ink-3) !important;font-size:11.5px !important;letter-spacing:.02em}
.tkprice{text-align:right;display:flex;flex-direction:column;gap:2px}
.tkprice b{font-family:"Archivo",sans-serif;font-size:24px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.tkstats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:6px 18px 16px}
@media (min-width:640px){ .tkstats{grid-template-columns:repeat(3,1fr)} }
.tkstats .stat b{font-size:14.5px}
.tkdesc{margin:2px 18px 16px;color:var(--ink-2);font-size:13.5px;line-height:1.6}
.tkposcard .tkpos{margin:2px 18px 14px}

/* v14: berichten-feed */
.composer{display:flex;gap:10px;align-items:flex-end;padding:8px 18px 4px}
.composer textarea{flex:1;font:inherit;font-size:14px;color:var(--ink);background:var(--input-bg);border:1px solid var(--line-2);border-radius:12px;padding:11px 13px;resize:vertical;min-height:44px}
.composer textarea:focus-visible{outline:2px solid var(--accent);border-color:var(--accent)}
.postbtn{margin:0;padding:11px 18px;font-size:13.5px}
.feed{padding:8px 18px 6px;display:flex;flex-direction:column}
.post{display:grid;grid-template-columns:34px 1fr;gap:11px;padding:12px 0;border-bottom:1px solid var(--line)}
.post:last-child{border-bottom:none}
.pavatar{width:32px;height:32px;border-radius:50%;background:var(--accent-verloop);color:var(--accent-tekst);display:grid;place-items:center;font-weight:800;font-size:14px;font-family:"Archivo",sans-serif} /* v25.52 (HUISSTIJL2): het knopverloop als token (cirkel → trui) */
.pbody{min-width:0}
.pmeta{display:flex;align-items:baseline;gap:7px;font-size:12.5px;color:var(--ink-3)}
.pmeta b{color:var(--ink);font-size:13.5px}
.pdel{margin-left:auto;background:none;border:none;color:var(--ink-3);cursor:pointer;font-size:12px;padding:2px 6px}
.pdel:hover{color:var(--bad-text)}
.pbody p{margin:3px 0 0;font-size:14px;line-height:1.5;white-space:pre-line;word-break:break-word}
.cashtag{color:var(--accent);font-weight:600}
.feedempty{color:var(--ink-3);font-size:13px;padding:14px 0}

/* v14: cijferagenda */
.agendarows{padding:4px 18px 14px}
.arow{display:grid;grid-template-columns:86px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.arow:last-child{border-bottom:none}
.arow:hover{background:var(--hl-bg)}
.adate{font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.atick{display:flex;flex-direction:column;min-width:0}
.atick b{font-family:"Archivo",sans-serif;font-size:13.5px}
.atick i{font-style:normal;color:var(--ink-3);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.awhen{font-size:11.5px;color:var(--ink-3);text-align:right;white-space:nowrap}
.arow.past{opacity:.55}
@media (min-width:900px){ #screen-home > #agendaCard{grid-column:auto} }

/* v15: doorlopende secties (één vloeiende kaart i.p.v. losse blokken) */
.tkflow{overflow:hidden}
.tkc{border-top:1px solid var(--line)}
.tkflow > .tkc:first-child{border-top:none}
.tkc[hidden]{display:none !important}
.tkc .cardhead{padding:14px 18px 4px}
.tkviewbar{padding:10px 14px}
.tkviewbar .seg{width:100%}
.tkviewbar .seg button{flex:1;text-align:center;padding:8px 10px;font-size:13px}
.tkc.tkhead{padding:16px 18px 14px;display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;border-top:none}
.tkposline{display:flex;align-items:center;gap:12px;padding:9px 18px;flex-wrap:wrap}
.tkposline .poslbl{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);flex:none}
.tkposline .pdetail{margin:0;padding:0;background:none;border:none}
.tkc .tkstats{padding-bottom:14px}
.tkc .tkdesc{margin-bottom:16px}

/* v15: topnav (Feed | Dashboard + zoeken) */
.topnav{display:flex;gap:12px;align-items:center;margin-bottom:16px}
.topnav .searchwrap{margin:0}
.viewtabs button{padding:9px 16px;font-size:13.5px;font-weight:700}
#screen-home.feedmode > section.card:not(#feedHome){display:none !important}
@media (min-width:900px){
  #screen-home > .topnav{grid-column:1/-1;margin-bottom:0}
  #screen-home > #feedHome{grid-column:1/-1;max-width:680px;justify-self:center;width:100%}
}

/* v15: feed & interacties */
.feedtop{padding:14px 18px 12px}
.feedhead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.feedhead b{font-family:"Archivo",sans-serif;font-size:15px}
.online{font-size:12px;color:var(--good-text);font-variant-numeric:tabular-nums}
.feedtop .composer{padding:0;margin-bottom:10px}
.comprow{display:flex;justify-content:space-between;align-items:center;gap:10px}
.comprow .postbtn{margin:0}
.pacts{display:flex;gap:22px;margin-top:8px}
.pact{display:flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;color:var(--ink-3);font:inherit;font-size:12.5px;font-variant-numeric:tabular-nums;padding:2px 0}
.pact:hover{color:var(--ink-2)}
.pact i{font-style:normal;font-size:14.5px}
.pact.actlike.on{color:var(--bad-text)}
.pact.actsave.on{color:var(--gold)}
.symchip{margin-left:2px;font-size:11.5px;font-weight:700;color:var(--accent);background:var(--accent-wash);border:1px solid color-mix(in srgb, var(--accent) 30%, transparent);padding:2px 8px;border-radius:999px;text-decoration:none;white-space:nowrap}
.replies{margin-top:10px;border-left:2px solid var(--line-2);padding-left:12px;display:flex;flex-direction:column}
.post.reply{padding:9px 0;border-bottom:none;grid-template-columns:26px 1fr;gap:9px}
.pavatar.sm{width:24px;height:24px;font-size:11px}
.rcomposer{display:flex;gap:8px;margin-top:8px}
.rcomposer .rinput{flex:1;font:inherit;font-size:13.5px;color:var(--ink);background:var(--input-bg);border:1px solid var(--line-2);border-radius:10px;padding:9px 12px}
.rcomposer .postbtn{padding:9px 14px}
#feedList.feed{padding:4px 18px 10px}

/* v15: waardering-schuiven */
.valsliders{padding:6px 18px 16px}
.vrow{margin-bottom:14px}
.vrow label{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;color:var(--ink-2);text-transform:none;letter-spacing:0;font-weight:500;margin:0 0 6px}
.vrow label b{font-family:"Archivo",sans-serif;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}
.vrow input[type=range]{width:100%;accent-color:var(--accent);height:26px;padding:0;border:none;background:transparent} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.valout{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:6px}
.valout .stat b.up{color:var(--good-text)} .valout .stat b.down{color:var(--bad-text)}
@media (max-width:520px){ .valout{grid-template-columns:1fr 1fr} }

/* strakkere verhoudingen op home */
#screen-home > section.card{margin-bottom:14px}

/* v16: tickertape */
.tape{margin:-6px -18px 12px;border-bottom:1px solid var(--line)}
.tapetrack{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:8px 14px}
.tapetrack::-webkit-scrollbar{display:none}
.tapeitem{display:flex;align-items:baseline;gap:6px;padding:5px 10px;border-radius:9px;text-decoration:none;white-space:nowrap;flex:none}
.tapeitem:hover{background:var(--hl-bg)}
.tapeitem b{font-family:"Archivo",sans-serif;font-size:12px;color:var(--ink);letter-spacing:.01em}
.tapeitem span{font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums}
.tapeitem .up{color:var(--good-text)} .tapeitem .down{color:var(--bad-text)} .tapeitem .mut{color:var(--ink-3)}
.tapediv{flex:none;align-self:center;font-size:12px;padding:0 4px}
/* v25.32: de tape blijft op elk formaat de telefoon-uitvoering (app-weergave) */

/* v16: navigatie-badge + aankondigingen/pins */
.viewtabs button{position:relative}
.navbadge{margin-left:7px;font-size:10.5px;color:var(--good-text);font-variant-numeric:tabular-nums}
.annlbl{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-2);cursor:pointer;white-space:nowrap;text-transform:none;letter-spacing:0;font-weight:500;margin-top:0}
.annlbl input{width:auto;accent-color:var(--accent)} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.comprow{flex-wrap:wrap}
.comprow .postbtn{margin-left:auto}
.post.ann{background:var(--accent-wash);border:1px solid color-mix(in srgb, var(--accent) 25%, transparent);border-radius:14px;padding:12px;margin:6px 0}
.post.ann + .post.ann{margin-top:8px}
.annbadge,.pinbadge{font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:999px}
.annbadge{color:var(--accent);background:var(--accent-wash);border:1px solid color-mix(in srgb, var(--accent) 30%, transparent)}
.pinbadge{color:var(--gold);border:1px solid var(--gold)}
.pdel.padmin{margin-left:auto;opacity:.5}
.pdel.padmin.on{opacity:1;color:var(--gold)}
.pdel.padmin + .pdel{margin-left:6px}
.post .pmeta .pdel:first-of-type{margin-left:auto}
.pact{transition:transform .08s ease}
.pact:active{transform:scale(1.15)}

/* v17: toasts, logo, klikbare tickers, licht & speels */
#toast{position:fixed;left:50%;bottom:max(24px, env(safe-area-inset-bottom));transform:translateX(-50%) translateY(16px);opacity:0;pointer-events:none;z-index:80;background:var(--card);color:var(--ink);border:1px solid var(--line-2);border-radius:999px;padding:11px 20px;font-size:13.5px;box-shadow:var(--shadow);white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis;transition:opacity .2s ease, transform .2s ease}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.tklogo{flex:none;width:46px;height:46px;border-radius:14px;background:var(--card-2);border:1px solid var(--line);display:grid;place-items:center;font-family:"Archivo",sans-serif;font-weight:800;font-size:19px;color:var(--ink-2);overflow:hidden}
.tklogo img{width:100%;height:100%;object-fit:contain;background:#fff;border-radius:13px}
.tkhead{align-items:center}
.ticklink{color:inherit;text-decoration:none}
@media (hover:hover){ .ticklink:hover{color:var(--accent)} .pact:hover{color:var(--accent)} .pact.actlike:hover{color:var(--bad-text)} } /* v25.44 (review): alleen met muis */
.pact.actsave:hover{color:var(--gold)}
.post{padding:14px 0}
.pacts{margin-top:9px;gap:26px}
.post.rise{animation:rise .22s ease}
@keyframes rise{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.prow,.arow,.sres,.tapeitem,.pact,.seg button,.iconbtn,.linkbtn{transition:background .15s ease,color .15s ease,border-color .15s ease}
.symchip:hover{background:var(--accent);color:var(--accent-tekst)} /* v25.52 (HUISSTIJL2): tekst op accent */
@media (prefers-reduced-motion: reduce){ .post.rise{animation:none} }

/* ===== v18: community als X, aandelenkop als StockTwits, profielpagina's ===== */

/* Sticky werkt niet binnen overflow:hidden — clip knipt wél af zonder scrollcontainer */
.tkflow{overflow:clip}

/* X-stijl tabs: volle breedte, actief = streepje eronder */
.xtabs{display:flex;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;background:var(--card)}
.xtabs button{appearance:none;border:none;background:none;cursor:pointer;flex:1;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink-3);padding:13px 8px;position:relative;transition:color .15s ease,background .15s ease}
.xtabs button:hover{background:var(--hl-bg);color:var(--ink-2)}
.xtabs button.on{color:var(--ink);font-weight:700}
.xtabs button.on::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:44px;max-width:70%;height:4px;border-radius:4px 4px 0 0;background:var(--accent)}
.xtabs button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.feedtop .xtabs{margin:2px -18px 14px}
.tkc.tkviewbar{padding:0;border-top:1px solid var(--line)}
.tkc.tkviewbar .xtabs{border-bottom:none}

/* X-stijl composer: avatar + kale tekstregel ("Wat houdt je bezig?") */
.xcomposer{display:flex;gap:12px;align-items:flex-start;padding:14px 18px 6px}
.xcomposer textarea{flex:1;font:inherit;font-size:16px;line-height:1.5;color:var(--ink);background:transparent;border:none;border-radius:0;padding:6px 0;resize:none;min-height:52px;caret-color:var(--accent)}
.xcomposer textarea::placeholder{color:var(--ink-3)}
.xcomposer textarea:focus-visible{outline:none}
.xcomposer:focus-within{box-shadow:inset 0 -2px 0 var(--accent-wash)}
.xcomposer .postbtn{align-self:flex-end}
.postbtn{border-radius:999px}
.feedtop .comprow{padding-top:6px;border-top:1px solid var(--line);margin:0 0 2px}

/* Avatar & naam zijn nu links naar het profiel */
.pavatar{flex:none;text-decoration:none;cursor:default}
a.pavatar{cursor:pointer;transition:box-shadow .15s ease}
a.pavatar:hover{box-shadow:0 0 0 2.5px var(--accent)}
.pname{color:var(--ink);font-weight:700;font-size:13.5px;text-decoration:none}
.pname:hover{text-decoration:underline}
.cashtag{text-decoration:none}
.cashtag:hover{text-decoration:underline}
.replytag{font-size:9.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line-2);padding:1.5px 7px;border-radius:999px;white-space:nowrap}

/* Actierij als bij X: gespreid, eigen iconen, gevuld als actief */
.pacts{justify-content:space-between;max-width:400px;gap:4px;margin-top:10px}
.pact{gap:7px}
.pact svg{display:block}
.pact.actlike.on svg,.pact.actsave.on svg{fill:currentColor}
.pact.pop svg{animation:pop .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.45)}100%{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){ .pact.pop svg{animation:none} }
/* v25.33: alleen op échte muis-apparaten — op iOS bleef de tint na een tik
   "plakken" waardoor berichten willekeurig een kaartachtergrond leken te hebben. */
@media (hover:hover){
  .feed .post:not(.ann):not(.reply):hover{background:var(--hl-bg);margin:0 -12px;padding-left:12px;padding-right:12px;border-radius:12px}
}

/* Profielpagina (zoals elk sociaal netwerk: kop + alle berichten) */
.prtop{display:flex;flex-direction:column;min-width:0;line-height:1.25;padding-top:2px}
.prtop b{font-family:"Archivo",sans-serif;font-size:16.5px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prtop span{font-size:11.5px;color:var(--ink-3)}
.prohead{display:flex;gap:16px;align-items:center;padding:22px 20px 16px;border-top:none}
.pavatar.xl{width:64px;height:64px;font-size:27px}
.prinfo{min-width:0}
.prinfo h2{margin:0 0 2px;font-size:22px}
.prinfo .tkmeta{display:block}
#prFeed.feed{padding:4px 18px 10px}

/* Zijbalk "Wat er gebeurt" — alleen op brede schermen naast de feed */
#feedRail{display:none}
.railtrend{padding:0 18px 8px}
.railtrend .arow{grid-template-columns:auto 1fr auto}
.railtrend .adate{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--gold)}
#feedRail .chartsub{margin:6px 18px 14px}
/* v25.32: de oude brede-scherm-zijbalk is met het twee-koloms-grid vervallen —
   overal de app-kolom; "populair vandaag" woont nu in het kanalenpaneel. */

/* Aandelenkop als StockTwits: logo + naam, daaronder de grote koers */
.tkc.tkhead{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:9px;padding:18px 20px 14px}
.tkrow1{display:flex;gap:12px;align-items:center;min-width:0}
.tkc.tkhead .tkid b{font-size:16.5px;letter-spacing:0}
.tkc.tkhead .tkid > span{font-size:12.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tkbig{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.tkbig b{font-family:"Archivo",sans-serif;font-weight:800;font-size:40px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.05}
.tkbig .pday{font-size:15px;font-weight:700}
.tkmetarow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tkmsgs{font-size:11.5px;font-weight:600;color:var(--ink-2);border:1px solid var(--line-2);padding:3px 10px;border-radius:999px;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (max-width:380px){ .tkbig b{font-size:33px} }

/* v18-polish: nette regels in de berichtkop, profielkop links uitgelijnd */
.pmeta{flex-wrap:wrap;row-gap:2px}
.pmeta > span{white-space:nowrap}
#screen-profile .apphead{justify-content:flex-start}

/* ===== v19: Qualtrim-niveau — kleurgecodeerde ratio's, interactieve grafieken, verwachtingen ===== */

/* Ratio-tegels: groen = sterk/goedkoop, geel = gemiddeld, rood = zwak/duur */
.tkstats .stat{position:relative}
.stat.g{background:rgba(52,201,142,.09);border-color:rgba(52,201,142,.38)}
.stat.g b{color:var(--good-text)}
.stat.y{background:rgba(217,179,107,.09);border-color:rgba(217,179,107,.45)}
.stat.y b{color:var(--gold)}
.stat.r{background:rgba(229,96,90,.09);border-color:rgba(229,96,90,.38)}
.stat.r b{color:var(--bad-text)}
.stat.g::after,.stat.y::after,.stat.r::after{content:"";position:absolute;top:11px;right:11px;width:7px;height:7px;border-radius:50%}
.stat.g::after{background:var(--good)}
.stat.y::after{background:var(--gold)}
.stat.r::after{background:var(--bad)}
.stsub{font-size:10.5px;color:var(--ink-3);line-height:1.35}
.bandleg{display:flex;gap:9px;align-items:center;font-size:10.5px;color:var(--ink-3);white-space:nowrap}
.bandleg i{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:-4px}
.bandleg .bg{background:var(--good)} .bandleg .by{background:var(--gold)} .bandleg .br{background:var(--bad)}

/* 52-weeks positiebalkje in een tegel */
.rangebar{position:relative;height:5px;background:var(--seg-bg);border:1px solid var(--line);border-radius:99px;margin-top:7px}
.rangebar i{position:absolute;top:50%;transform:translate(-50%,-50%);width:11px;height:11px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2.5px var(--card)}

/* Interactieve staafgrafieken (omzet/winst, FCF, EPS) */
.finbox{margin:10px 4px 0}
.finbox svg{cursor:crosshair}
.finbox .hitzone.hl{fill:var(--hl-bg)}
.finbox .tooltip{left:0;top:6px}
.seg button:disabled{opacity:.35;cursor:default}
#tkFinChart .serieslegend,#tkFcfChart .serieslegend{padding-top:2px}

/* Kleinere donut voor het analistenoordeel */
.donutbox.sm{width:150px;height:150px}
.donutbox.sm svg{width:150px;height:150px}
#tkRatingCard .donutrow{padding-bottom:0}
#tkRatingCard .tkstats{grid-template-columns:1fr 1fr;padding-top:10px}

/* Verwachtingen-kaart (altijd zichtbaar) */
.estrows .krow{align-items:flex-start;gap:14px}
.estrows .krow > span{flex:none}
.estrows .krow b{font-weight:600;font-size:13px;line-height:1.5}
.estrows .ksub2{font-style:normal;color:var(--ink-3);font-size:10.5px;display:block}
.estrows .kpos{color:var(--good-text)} .estrows .kneg{color:var(--bad-text)}

/* Kwartaalcijfers-pil in de kop */
.tkearn{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 40%, transparent);background:var(--accent-wash)}
.estrows .estl{display:block;white-space:nowrap}
@media (min-width:640px){
  .estrows .estl{display:inline}
  .estrows .estl + .estl::before{content:" \00b7  ";color:var(--ink-3)}
}

/* ===== v20: watchlist, online-teller, veiligheid ===== */

/* Grote watchlist-knop op de aandelenkop */
.wlbtn{margin-top:4px;width:100%;font-size:15px;padding:13px 20px;border-radius:999px;background:transparent;color:var(--accent);border:1.5px solid color-mix(in srgb, var(--accent) 55%, transparent);box-shadow:none}
.wlbtn:hover{background:var(--accent-wash)}
.wlbtn.on{background:var(--accent-verloop);color:var(--accent-tekst);border-color:transparent;box-shadow:0 8px 30px color-mix(in srgb, var(--accent) 22%, transparent)} /* v25.52 (HUISSTIJL2): het knopverloop als token (cirkel → trui) */
@media (min-width:640px){ .wlbtn{width:auto;align-self:flex-start;padding:11px 22px} }

/* Watchlist-kaart op het dashboard */
.wlrow{grid-template-columns:minmax(0,1fr) 96px minmax(0,auto) 26px}
.wlx{appearance:none;border:none;background:none;color:var(--ink-3);cursor:pointer;font-size:12px;padding:4px;border-radius:8px;justify-self:end}
@media (hover:hover){ .wlx:hover{color:var(--bad-text);background:var(--hl-bg)} } /* v25.44 (review): alleen met muis */
@media (max-width:380px){ .wlrow{grid-template-columns:minmax(0,1fr) 64px auto 24px} }
@media (min-width:900px){ #screen-home > #wlCard{grid-column:1/-1} }

/* Online-teller in de tickerbalk (alle schermen) en op de profielkop */
.tapeonline{color:var(--good-text);font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums;border:1px solid rgba(52,201,142,.35);background:rgba(52,201,142,.08);border-radius:999px;gap:7px;align-items:center}
.tapeonline i{width:7px;height:7px;border-radius:50%;background:var(--good);box-shadow:0 0 7px rgba(52,201,142,.8);display:inline-block;flex:none}
.tapeonline:hover{background:rgba(52,201,142,.14)}
.prtoponline{margin-left:auto;padding-top:8px;white-space:nowrap}

/* ===== v21: gegenereerde avatars, live pop-ups, altijd-live gevoel ===== */
.pavatar{overflow:hidden;background:var(--card-2)}
.pavatar svg{width:100%;height:100%;display:block}
.realname{font-size:10px;font-weight:600;color:var(--gold);border:1px dashed rgba(217,179,107,.55);padding:1px 7px;border-radius:999px;white-space:nowrap}

#livepop{position:fixed;left:12px;bottom:max(18px, env(safe-area-inset-bottom));z-index:75;display:flex;gap:10px;align-items:center;max-width:min(430px, calc(100vw - 96px));background:var(--card);border:1px solid var(--line-2);border-radius:16px;padding:10px 14px;box-shadow:var(--shadow);cursor:pointer;opacity:0;transform:translateY(16px);transition:opacity .25s ease, transform .25s ease;pointer-events:none}
#livepop.show{opacity:1;transform:none;pointer-events:auto}
#livepop:hover{border-color:var(--accent)}
.lp-av{width:30px;height:30px;border-radius:50%;overflow:hidden;flex:none;background:var(--card-2)}
.lp-av svg{width:100%;height:100%;display:block}
.lp-tx{font-size:12.5px;line-height:1.45;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lp-sym{color:var(--accent)}

@keyframes pulseDot{0%,100%{opacity:1}50%{opacity:.4}}
.tapeonline i,.dot{animation:pulseDot 2.4s ease-in-out infinite}
@media (prefers-reduced-motion: reduce){ .tapeonline i,.dot{animation:none} #livepop{transition:none} }

/* ===== v21.2: comments & likes — smooth en dopamine (Instagram/X-gevoel) ===== */

/* Teller veert op bij elke verandering */
.pact span{display:inline-block;min-width:1ch}
.pact span.bump{animation:cbump .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes cbump{0%{transform:translateY(0)}40%{transform:translateY(-5px) scale(1.25)}100%{transform:none}}

/* Confetti-burst rond het hartje */
.pact{position:relative}
.heartburst{position:absolute;left:9px;top:50%;width:5px;height:5px;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);
  box-shadow:0 -15px 0 -1px #F26D6D,11px -11px 0 -1px #F2A66D,15px 0 0 -1px #F26DA6,11px 11px 0 -1px #6DB5F2,0 15px 0 -1px #52C98B,-11px 11px 0 -1px #F2D06D,-15px 0 0 -1px #B98FF2,-11px -11px 0 -1px #F28D6D;
  animation:hburst .5s ease-out forwards}
@keyframes hburst{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}

/* Groot hart bij dubbeltik op een bericht */
.post{position:relative}
.bigheart{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:3}
.bigheart svg{width:68px;height:68px;fill:#F0506A;filter:drop-shadow(0 6px 18px rgba(240,80,106,.45));animation:bigheart .7s cubic-bezier(.2,1.4,.4,1) forwards}
@keyframes bigheart{0%{opacity:0;transform:scale(.3)}25%{opacity:1;transform:scale(1.15)}55%{transform:scale(.95)}75%{opacity:1}100%{opacity:0;transform:scale(1.05) translateY(-8px)}}

/* Verzendknop leeft mee: uit zonder inhoud, popt aan bij echte tekst */
.postbtn:disabled{opacity:.45;box-shadow:none;cursor:default}
.postbtn.ready{animation:pop .25s ease}

/* Optimistische reactie (wacht op serverbevestiging) */
.post.pending{opacity:.55}

/* "N nieuwe berichten"-pil bovenin (zoals X) */
#newpill{position:fixed;top:max(14px, env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:70;appearance:none;border:none;cursor:pointer;font:inherit;font-size:12.5px;font-weight:700;color:var(--accent-tekst);background:var(--accent-verloop);padding:9px 18px;border-radius:999px;box-shadow:0 10px 30px color-mix(in srgb, var(--accent) 35%, transparent);animation:rise .25s ease} /* v25.52 (HUISSTIJL2): het knopverloop als token (cirkel → trui) */
#newpill:active{transform:translateX(-50%) scale(.96)}

@media (prefers-reduced-motion: reduce){
  .pact span.bump,.heartburst,.bigheart svg,.postbtn.ready,#newpill{animation:none}
}

/* ===== v22: lopende tickerbalk + Rabi's columns-nieuwsbalk ===== */

/* Doorlopende marquee: twee identieke helften schuiven naar -50% (naadloze loop) */
.tapetrack:has(.tapemove){display:block;overflow:hidden;padding:8px 0}
.tapemove{display:inline-flex;white-space:nowrap;will-change:transform;animation:tapeloop 40s linear infinite}
.tapehalf{display:inline-flex;gap:4px;padding-right:4px;align-items:center}
@keyframes tapeloop{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tape:hover .tapemove,.newsbar:hover .newsmove{animation-play-state:paused}

/* Nieuwsbalk met Rabi's columns */
.newsbar{display:flex;align-items:center;gap:0;margin:0 -18px 12px;border-bottom:1px solid var(--line);overflow:hidden}
.newslabel{flex:none;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);border-right:1px solid var(--line);padding:8px 12px 8px 18px;background:var(--card);white-space:nowrap;z-index:2}
.newsviewport{flex:1;overflow:hidden;white-space:nowrap;padding:6px 0}
.newsmove{display:inline-flex;white-space:nowrap;will-change:transform;animation:tapeloop 60s linear infinite}
.newsitem{display:inline-flex;align-items:baseline;gap:8px;color:var(--ink-2);text-decoration:none;font-size:12px;padding:2px 10px;border-radius:8px;white-space:nowrap}
.newsitem:hover{color:var(--ink);background:var(--hl-bg)}
.newsitem i{font-style:normal;font-size:10px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.newsdot{color:var(--gold);font-size:9px;padding:0 6px;align-self:center}
@media (min-width:900px){
  .newsbar{margin:0 0 6px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
  .newslabel{border-radius:12px 0 0 12px}
  #screen-home > .newsbar{grid-column:1/-1}
}
@media (prefers-reduced-motion: reduce){
  .tapemove,.newsmove{animation:none}
  .tapetrack:has(.tapemove),.newsviewport{overflow-x:auto}
}

/* ===== v23: meerdere portefeuilles & watchlists + delen ===== */
.pfswitch{display:inline-flex; align-items:center; gap:7px; background:none; border:0; padding:4px 6px; margin:-4px -6px; border-radius:10px; cursor:pointer; color:var(--ink); font:inherit; min-width:0; max-width:100%}
.pfswitch:hover{background:var(--hl-bg)}
.pfswitch b{font-family:"Archivo",sans-serif; font-size:15.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:52vw}
.pfswitch .caret{color:var(--ink-3); font-size:11px; transform:translateY(1px)}
.pfsharemark{font-size:12px}
.pf-head .pfswitch b, .cardhead .pfswitch b{letter-spacing:.01em}

.pfmgr{padding:14px 18px 22px; overflow-y:auto; display:flex; flex-direction:column; gap:10px}
.pfrow{display:flex; align-items:center; gap:11px; padding:12px 12px; border:1px solid var(--line); border-radius:14px; cursor:pointer; background:var(--card)}
.pfrow:hover{background:var(--hl-bg)}
.pfrow.on{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset}
.pfdot{color:var(--accent); font-size:13px; width:16px; text-align:center; flex:none}
.pfrow-l{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.pfrow-l b{font-family:"Archivo",sans-serif; font-size:14.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pfrow-l span{font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pfrow-r{display:flex; gap:2px; flex:none}
.pfrow-r .iconbtn{font-size:14px}
.pfnew{margin-top:2px}
.pfmgr .chartsub{padding:0; margin:0}

.pfform{display:flex; flex-direction:column; gap:10px; padding:6px 0}
.pfform b{font-family:"Archivo",sans-serif}
.pfform input{width:100%; box-sizing:border-box; background:var(--field-bg,var(--hl-bg)); color:var(--ink); border:1px solid var(--line); border-radius:12px; padding:12px 14px; font:inherit; font-size:15px}
.pfform input:focus{outline:2px solid var(--accent); outline-offset:1px}
.pfform-btns{display:flex; gap:8px}
.pfform-btns .btn{flex:1}

.pfshare{display:flex; flex-direction:column; gap:11px; padding:4px 0}
.pfshare b{font-family:"Archivo",sans-serif}
.shstatus{margin:0; font-size:13.5px; color:var(--ink-2); background:var(--hl-bg); border-radius:10px; padding:9px 12px}
.linkbox{display:flex; gap:8px}
.linkbox input{flex:1; min-width:0; background:var(--hl-bg); color:var(--ink-2); border:1px solid var(--line); border-radius:12px; padding:10px 12px; font-size:12.5px; font-variant-numeric:tabular-nums}
.linkbox .btn{flex:none; padding:10px 14px}
.shopts{display:flex; flex-direction:column; gap:8px}
.shopt{text-align:left; display:flex; flex-direction:column; gap:2px; align-items:flex-start}
.shopt i{font-style:normal; font-size:12px; color:var(--ink-3)}

/* wegingsbalk in gedeelde weergave */
.shrow{grid-template-columns:minmax(0,1fr) 96px minmax(0,auto); cursor:default}
.shrow:hover{background:none; margin:0; padding-left:0; padding-right:0}
.shweight{display:flex; align-items:center; gap:7px; height:30px}
.shweight i{display:block; height:7px; border-radius:4px; background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 55%, transparent)); min-width:3px; flex:none; max-width:64px}
.shweight i.cash{background:var(--ink-3)}
.shweight span{font-size:12px; color:var(--ink-2); font-variant-numeric:tabular-nums}
.shtotal .big{font-size:30px}
@media (max-width:380px){ .shrow{grid-template-columns:minmax(0,1fr) 72px auto} .shweight i{max-width:40px} }

/* gedeelde portefeuilles op profielen */
.prshared{display:flex; flex-direction:column; gap:9px; padding-top:12px; padding-bottom:12px; border-bottom:1px solid var(--line)}
.prsh-t{font-family:"Archivo",sans-serif; font-size:14px}
.prshrow{display:flex; gap:8px; flex-wrap:wrap}
.prshchip{display:inline-flex; flex-direction:column; gap:1px; text-decoration:none; color:var(--ink); background:var(--hl-bg); border:1px solid var(--line); border-radius:12px; padding:9px 13px}
.prshchip:hover{border-color:var(--accent)}
.prshchip b{font-size:13.5px; font-family:"Archivo",sans-serif}
.prshchip i{font-style:normal; font-size:11.5px; color:var(--ink-3)}
.prshared .pill{align-self:flex-start}
.emptyswitch{align-self:center; margin:0 0 4px; color:var(--ink-2)}

/* ===== v24: hints, snelstart-chips en meldingen ===== */
.hintbar{display:flex; align-items:center; gap:11px; margin:2px 0 12px; padding:12px 13px; border-radius:16px; border:1px solid color-mix(in srgb, var(--accent) 28%, var(--line)); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, var(--card)), var(--card)); box-shadow:0 8px 26px -20px rgba(0,0,0,.55); opacity:0; transform:translateY(-6px); transition:opacity .35s ease, transform .35s ease}
.hintbar.show{opacity:1; transform:none}
.hintemo{font-size:22px; flex:none}
.hinttxt{flex:1; font-size:13.5px; color:var(--ink-2); line-height:1.45; min-width:0}
.hintbtn{flex:none; padding:9px 13px; font-size:13px; border-radius:11px; width:auto}
.hintx{flex:none; color:var(--ink-3)}
.feedmode .hintbar{display:none}
@media (min-width:900px){ #screen-home > .hintbar{grid-column:1/-1; margin-bottom:0} }
@media (prefers-reduced-motion: reduce){ .hintbar{transition:none; transform:none} }
@media (max-width:430px){ .hintbar{flex-wrap:wrap} .hinttxt{flex:1 1 100%; order:3} .hintemo{order:1} .hintbtn{order:4; flex:1} .hintx{order:2; margin-left:auto} }

.chiprow{display:flex; gap:8px; padding:8px 14px 2px; overflow-x:auto; scrollbar-width:none; flex:none}
.chiprow::-webkit-scrollbar{display:none}
.chatchip{appearance:none; border:1px solid color-mix(in srgb, var(--accent) 32%, var(--line)); background:color-mix(in srgb, var(--accent) 8%, var(--card)); color:var(--ink); font:inherit; font-size:12.5px; font-weight:600; padding:8px 13px; border-radius:999px; cursor:pointer; white-space:nowrap; flex:none; transition:transform .12s ease, background .12s ease}
.chatchip:hover{background:color-mix(in srgb, var(--accent) 16%, var(--card))}
.chatchip:active{transform:scale(.96)}

.notifbtn{position:relative}
.notifdot{position:absolute; top:1px; right:-1px; background:var(--bad); color:#fff; font-size:9.5px; font-weight:700; min-width:15px; height:15px; border-radius:8px; display:flex; align-items:center; justify-content:center; padding:0 3px; pointer-events:none} /* v25.52 (HUISSTIJL2): meldingsstip = --bad (was los rood) */
.notifrow{display:flex; gap:10px; padding:11px 10px; border-radius:12px; cursor:pointer; align-items:flex-start}
.notifrow:hover{background:var(--hl-bg)}
.notifrow .pavatar{flex:none}
.notif-l{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.notif-l b{font-size:13.5px; font-weight:600; font-family:"IBM Plex Sans",sans-serif}
.notif-l b i{font-style:normal; color:var(--ink-2); font-weight:500}
.notif-l span{font-size:12.5px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.notiftijd{flex:none; font-size:11.5px; color:var(--ink-3); margin-top:2px}
#notifList{gap:2px}

/* v24: voorproefje van de eerste reactie onder een bericht */
.pavatar.xs{width:20px;height:20px;border-radius:7px;font-size:9px}
.cmtpreview{display:flex; align-items:center; gap:7px; margin:8px 0 0; padding:7px 10px; width:100%; background:var(--hl-bg); border:1px solid var(--line); border-radius:12px; cursor:pointer; font:inherit; text-align:left; min-width:0; appearance:none; color:var(--ink-2); transition:border-color .15s ease, transform .12s ease}
.cmtpreview:hover{border-color:color-mix(in srgb, var(--accent) 38%, var(--line))}
.cmtpreview:active{transform:scale(.985)}
.cmtpreview .pavatar.xs{flex:none}
.cvname{font-weight:700; font-size:12px; color:var(--ink); flex:none; max-width:34%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cvbody{flex:1; min-width:0; font-size:12.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cvlikes{display:inline-flex; align-items:center; gap:3px; font-size:11.5px; color:var(--ink-3); flex:none}
.cvlikes svg{width:13px;height:13px}
.cvmore{flex:none; font-size:11px; font-weight:800; color:var(--accent)}

/* v24: gedeelde pagina — samenvatting, klikbare rijen en lidmaatschaps-CTA */
.shsum{display:flex; flex-wrap:wrap; gap:8px; padding-top:10px; padding-bottom:10px}
.shsumchip{background:var(--hl-bg); border:1px solid var(--line); border-radius:999px; padding:7px 12px; font-size:12.5px; color:var(--ink-2); font-variant-numeric:tabular-nums; white-space:nowrap}
.shrow.klikbaar{cursor:pointer}
.shrow.klikbaar:hover{background:var(--hl-bg); margin:0 -10px; padding-left:10px; padding-right:10px; border-radius:10px}
.shchev{color:var(--ink-3); font-weight:700}
.shcta{display:flex; flex-direction:column; gap:10px; margin:6px 14px 18px; padding:16px 16px 18px; border-radius:16px; border:1px solid color-mix(in srgb, var(--accent) 26%, var(--line)); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, var(--card)), var(--card))}
.shcta b{font-family:"Archivo",sans-serif; font-size:15.5px}
.shcta p{margin:0; font-size:13.5px; color:var(--ink-2); line-height:1.5}
.shcta .btn{width:100%}
.herowrap{display:flex; align-items:baseline; gap:9px; flex-wrap:wrap}
.herodelta{font-size:13.5px; font-weight:700; font-family:"Archivo",sans-serif; font-variant-numeric:tabular-nums; letter-spacing:0; white-space:nowrap}
.herodelta.up{color:var(--good-text)}
.herodelta.down{color:var(--bad-text)}

/* v24.1: portefeuille-knopjes op de Totale waarde-kaart + deel-niveaus */
.pfchips{display:flex; gap:7px; flex-wrap:wrap; margin:0 0 12px}
.pfchip{appearance:none; border:1px solid var(--line); background:var(--hl-bg); color:var(--ink-2); font:inherit; font-size:12.5px; font-weight:600; padding:7px 13px; border-radius:999px; cursor:pointer; max-width:46vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:transform .12s ease, border-color .15s ease}
.pfchip:hover{border-color:color-mix(in srgb, var(--accent) 40%, var(--line))}
.pfchip:active{transform:scale(.96)}
.pfchip.on{background:color-mix(in srgb, var(--accent) 14%, var(--card)); border-color:var(--accent); color:var(--ink); font-weight:700}
.pfchip.plus{font-weight:800; color:var(--accent); padding:7px 12px}
.shopt.aan{border-color:var(--accent); box-shadow:0 0 0 1px var(--accent) inset}
.shlock{display:flex; gap:11px; align-items:flex-start; margin-top:10px; padding:13px 14px; border-radius:14px; border:1px dashed color-mix(in srgb, var(--accent) 40%, var(--line)); background:color-mix(in srgb, var(--accent) 7%, var(--card)); text-decoration:none; color:var(--ink)}
.shlock:hover{border-style:solid}
.shlock-emo{font-size:20px; flex:none}
.shlock-txt{display:flex; flex-direction:column; gap:3px; min-width:0}
.shlock-txt b{font-family:"Archivo",sans-serif; font-size:13.5px}
.shlock-txt span{font-size:12.5px; color:var(--ink-2); line-height:1.45}

/* ===== v25: "sinds dit bericht" + herplaatsen ===== */
.sinceline{display:inline-flex; align-items:center; gap:5px; margin:7px 0 0; padding:5px 10px; border-radius:999px; font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; border:1px solid}
.sinceline.up{color:var(--good-text); background:color-mix(in srgb, var(--good-text) 9%, transparent); border-color:color-mix(in srgb, var(--good-text) 30%, transparent)}
.sinceline.down{color:var(--bad-text); background:color-mix(in srgb, var(--bad-text) 9%, transparent); border-color:color-mix(in srgb, var(--bad-text) 30%, transparent)}
.sinceline b{font-family:"Archivo",sans-serif; font-weight:800}
.qpost{margin:8px 0 0; padding:10px 12px; border:1px solid var(--line); border-radius:14px; background:var(--hl-bg)}
.qpost .pmeta{display:flex; align-items:center; gap:7px; flex-wrap:wrap; font-size:12px; color:var(--ink-3)}
.qpost .qname{color:var(--ink); font-size:12.5px; font-family:"Archivo",sans-serif}
.qpost > p{margin:6px 0 0; font-size:13.5px; line-height:1.5; color:var(--ink-2); overflow-wrap:anywhere}
.qpost .sinceline{margin-top:8px}
.qpost.qgone{color:var(--ink-3); font-size:12.5px; font-style:italic}
.rptag{color:var(--accent)}
.pact.actrepost.on{color:var(--good-text)} /* v25.52 (HUISSTIJL2): herplaats-aan = --good-text */
.pact.actrepost.on svg{stroke:var(--good-text)} /* v25.52 (HUISSTIJL2): idem */

/* v25.1: nieuwe-versie-pil */
.verpil{position:fixed; left:50%; transform:translateX(-50%); bottom:calc(86px + env(safe-area-inset-bottom)); z-index:60; appearance:none; border:none; cursor:pointer; font:inherit; font-size:13px; font-weight:700; color:var(--accent-tekst); background:var(--accent-verloop); padding:11px 17px; border-radius:999px; box-shadow:0 10px 30px -10px color-mix(in srgb, var(--accent) 65%, transparent); animation:verpilin .4s ease} /* v25.52 (HUISSTIJL2): het knopverloop als token (cirkel → trui) */
@keyframes verpilin{from{opacity:0; transform:translateX(-50%) translateY(10px)}to{opacity:1; transform:translateX(-50%) translateY(0)}}
@media (prefers-reduced-motion: reduce){ .verpil{animation:none} }
.unitnote{color:var(--gold,#c98500); font-size:11.5px}

/* v25.2: live doortikkende koersen */
@keyframes tickup{0%{background:color-mix(in srgb, var(--good-text) 22%, transparent)}100%{background:transparent}}
@keyframes tickdown{0%{background:color-mix(in srgb, var(--bad-text) 22%, transparent)}100%{background:transparent}}
.pprice.tick-up{animation:tickup .9s ease; border-radius:6px}
.pprice.tick-down{animation:tickdown .9s ease; border-radius:6px}
@media (prefers-reduced-motion: reduce){ .pprice.tick-up,.pprice.tick-down{animation:none} }

/* ---- v25.3: melding "telt niet mee" op de totaalkaart ---- */
.herowarn{margin-top:6px; font-size:12.5px; line-height:1.45; color:#e8b34b; background:rgba(232,179,75,.08);
  border:1px solid rgba(232,179,75,.25); border-radius:10px; padding:7px 10px; cursor:pointer; user-select:none}
.herowarn:hover{background:rgba(232,179,75,.13)}

/* ---- v25.4: koers in de tickerbalk + live grafiekpunt ---- */
.tapeitem .tapepx{color:var(--ink-3); font-size:11.5px; margin:0 5px 0 6px; font-variant-numeric:tabular-nums}

/* ---- v25.8: broker-eerst onboarding ---- */
.brokergrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; margin:14px 0 4px}
.brokerbtn{display:flex; flex-direction:column; gap:3px; align-items:flex-start; padding:12px 14px; border-radius:12px;
  border:1px solid var(--line); background:var(--card-2, rgba(255,255,255,.03)); color:var(--ink-1); cursor:pointer; text-align:left}
.brokerbtn:hover{border-color:var(--brand); background:rgba(46,229,157,.06)}
.brokerbtn b{font-size:14.5px}
.brokerbtn span{font-size:11.5px; color:var(--ink-3)}
.brokerterug{margin-bottom:8px}
.brokerbadge{color:var(--brand); font-weight:600; font-size:13px; margin:2px 0 10px}
.brokerkrijgt{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px}
.brokerkrijgt .bk{font-size:12px; color:var(--ink-3); border:1px solid var(--line); border-radius:999px; padding:4px 10px}
.brokerkrijgt .bk b{color:var(--ink-2); font-weight:600; margin-right:4px}
.brokerkrijgt .bk.ok{border-color:rgba(46,229,157,.35); color:var(--brand)}
.brokerstappen{margin:0 0 14px; padding-left:20px; display:flex; flex-direction:column; gap:6px; font-size:14px; color:var(--ink-2)}

/* ---- v25.9: testomgeving-balk + testknop ---- */
.testbar{display:flex; align-items:center; gap:12px; justify-content:space-between; margin:0 0 12px; padding:10px 14px;
  border-radius:12px; border:1px dashed rgba(232,179,75,.5); background:rgba(232,179,75,.08); color:var(--ink-1); font-size:13.5px}
.testbar b{color:#e8b34b}
.pftest{margin-top:4px}

/* =====================================================
   v25.11: rustiger kop op mobiel (feedback Rabi) — het logo op
   één regel, de abonnement-badge weg op smal scherm (je bent hier
   sowieso als lid), alle knoppen binnen beeld, begroeting strak
   op één regel. Geen knop mag ooit half buiten het scherm vallen.
   ============================================================ */
@media (max-width:640px){
  .apphead{align-items:center; gap:10px; margin-bottom:12px}
  .apphead > div:first-child{min-width:0}
  .apphead .eyebrow{white-space:nowrap; letter-spacing:.22em; font-size:10px}
  .apphead #greet{font-size:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
  #screen-home .apphead .planchip{display:none}
  .headright{gap:8px; padding-top:0; flex:none}
}

/* =====================================================
   v25.12: 📰 Nieuws — onze blogs als krantenvoorpagina in de
   stijl van FD/FT: zalmkleurig papier, serif-koppen, dubbele
   lijn onder de kop, dunne regels tussen de artikelen. Het
   papier blijft bewust licht in beide thema's (dat ís de krant).
   ============================================================ */
/* v25.26 (verzoek Rabi): de nieuwslijst hoort bij het platform — geen los
   "krantje" meer (zalmpapier/serif/bordeauxrood), maar exact dezelfde
   huisstijl, kleuren en typografie als de artikelweergave ernaast. */
.ftkrant{padding:18px 18px 12px}
.ftkrant a{text-decoration:none; color:inherit}
.fthead{display:flex; justify-content:space-between; align-items:baseline; gap:10px; border-bottom:1px solid var(--line); padding-bottom:12px}
.ftlabel{font-family:"Archivo",sans-serif; font-weight:700; font-size:15px; color:var(--ink)}
.ftdatum{font-size:11.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ftlead{display:block; padding:16px 0; border-bottom:1px solid var(--line)}
.ftleadimg{width:100%; max-height:230px; object-fit:cover; border-radius:12px; margin-bottom:12px}
.ftkop{font-family:"Archivo",sans-serif; font-weight:700; font-size:23px; line-height:1.22; letter-spacing:0; margin:0 0 8px; color:var(--ink)}
.ftlead:hover .ftkop,.ftrow:hover h4{color:var(--pos, var(--accent))} /* v25.52 (HUISSTIJL2): links/tags/citaten in het merkblauw (was groen) */
.ftexcerpt{font-size:14.5px; line-height:1.6; color:var(--ink-2); margin:0 0 10px}
.ftmeta{font-size:11.5px; color:var(--ink-3)}
.ftrow{display:flex; gap:14px; justify-content:space-between; align-items:center; padding:14px 0; border-bottom:1px solid var(--line)}
.ftrow:last-child{border-bottom:0}
.ftrowtxt{min-width:0}
.ftrow h4{font-family:"Archivo",sans-serif; font-weight:700; font-size:16px; line-height:1.3; margin:0 0 4px; color:var(--ink)}
.ftthumb{width:76px; height:57px; object-fit:cover; border-radius:10px; flex:none}
.fthint{font-size:11px; color:var(--ink-3); text-align:center; margin:10px 0 2px}
.ftleeg{color:var(--ink-3); padding:14px 0}
#screen-home.nieuwsmode > section.card:not(#nieuwsCard):not(#artikelCard){display:none !important}
.nieuwsmode .hintbar{display:none}
@media (min-width:900px){
  #screen-home.nieuwsmode{grid-template-columns:minmax(0,720px); justify-content:center}
  #screen-home.nieuwsmode > .tape,#screen-home.nieuwsmode > .apphead,#screen-home.nieuwsmode > .topnav{grid-column:1/-1}
  #screen-home.nieuwsmode > #nieuwsCard{grid-column:1}
  #screen-home.nieuwsmode > #artikelCard{grid-column:1}
  .ftkop{font-size:28px}
  .ftthumb{width:96px; height:68px}
  /* v25.26: op groot scherm een royale, gelijke leeskolom voor lijst én artikel */
  .ftkrant{padding:26px 32px 16px}
  .art2{padding:26px 32px 22px}
}
/* v25.12: drie tabbladen op mobiel — zoekbalk krijgt zijn eigen regel, alles past altijd */
@media (max-width:640px){
  .topnav{flex-wrap:wrap; gap:10px}
  .topnav .searchwrap{flex-basis:100%}
  .viewtabs button{padding:9px 12px; font-size:13px}
}


/* =====================================================
   v25.27 — Ledentest-fixronde 1
   ============================================================ */
/* Foutbalk: de lege staat mag nooit meer een fout maskeren */
.pffout{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  background:rgba(224,82,82,.1); border:1px solid rgba(224,82,82,.4); border-radius:14px;
  padding:10px 14px; margin-bottom:12px; font-size:13px; color:var(--ink)}
.pffout .btn{margin-top:0}
/* Gele wisselbalk in de lege staat (＋-portefeuille-val) */
.slotbanner{display:flex; flex-direction:column; gap:10px; background:rgba(232,185,60,.12);
  border:1px solid rgba(232,185,60,.5); border-radius:14px; padding:12px 14px; margin-bottom:14px; font-size:13.5px; line-height:1.5}
.slotbanner-knoppen{display:flex; gap:10px; flex-wrap:wrap}
.slotbanner .btn{margin-top:0}
/* Nieuwe-portefeuille-uitleg in het naamformulier */
.pfnieuwuitleg{margin:2px 0 4px}
/* Chat open → community-pop-ups weg en toast boven het typveld */
body.chatopen #livepop{display:none !important}
body.chatopen #toast{bottom:calc(96px + env(safe-area-inset-bottom))}
/* Totale inleg + jaarrendement-uitleg in de herokaart */
.inlegline{margin:10px 2px 0; font-size:12.5px; color:var(--ink-2)}
.jaaruitleg{margin-top:8px}
.stat.statklik{cursor:pointer}
.stat.statklik:hover{border-color:var(--accent)}
/* Kleine schermen (≤ 380px): kop blijft altijd volledig in beeld (regressie-melding) */
@media (max-width: 380px){
  .apphead{gap:8px}
  .headright{gap:6px; padding-top:4px; flex:none}
  .headright .iconbtn{width:38px; height:38px; padding:0; display:inline-flex; align-items:center; justify-content:center}
  #greet{font-size:19px}
  .apphead .eyebrow{font-size:10px}
}

/* =====================================================
   v25.28 — Ledenwensen-ronde
   ============================================================ */
/* C1: bevestigingskaartje voor chat-mutaties */
.mutvoorstel{border:1px solid rgba(232,185,60,.55); background:rgba(232,185,60,.08)}
.mutvoorstel b{display:block; margin-bottom:6px}
.mutvoorstel ul{margin:0 0 10px; padding-left:18px; display:grid; gap:4px}
.mutvoorstel li{font-size:13.5px; line-height:1.45}
.mutknoppen{display:flex; gap:10px; flex-wrap:wrap}
.mutknoppen button{border:none; border-radius:10px; padding:9px 14px; font:inherit; font-size:13.5px; font-weight:600; cursor:pointer}
.mutknoppen button:disabled{opacity:.55; cursor:default}
.mutknoppen .mutja{background:var(--accent); color:var(--accent-tekst)} /* v25.52 (HUISSTIJL2): tekst op accent */
.mutknoppen .mutnee{background:transparent; color:var(--ink-2); border:1px solid var(--line)}
/* D1: Σ Alle portefeuilles — chip + portefeuillelabel per positierij */
.pfchip.som{border-style:dashed; font-weight:700}
.pflabel{display:inline-block; margin-left:6px; padding:1px 7px; border:1px solid var(--line); border-radius:999px;
  font-size:10.5px; font-weight:600; color:var(--ink-2); vertical-align:1px; max-width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
/* D3: samenvoegen — doelkeuze + controle-overzicht */
.pfsmvform .smvdoel{display:block; width:100%; text-align:left; margin-top:8px}
.pfsmvform .smvdoel i{display:block; font-style:normal; font-size:12px; color:var(--ink-2); font-weight:400; margin-top:2px}
.smvlijst{margin:6px 0 10px; padding-left:18px; display:grid; gap:4px; font-size:13.5px}
#pfSmvHerstel .btn{margin-top:8px; width:100%}
/* E: rustige dividendkaart — volgende betaling + detailrijen */
.divnext{margin:2px 2px 8px; font-size:13px; color:var(--ink)}
#divMeer{margin-bottom:4px}
.divrow{display:flex; align-items:baseline; gap:10px; padding:7px 2px; border-top:1px solid var(--line); font-size:13px}
.divrow:first-child{border-top:none}
.divtick{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600}
.divbedrag{font-variant-numeric:tabular-nums}
.divdatum{color:var(--ink-2); min-width:64px; text-align:right; font-variant-numeric:tabular-nums}
#divVoorbeeld{margin-top:8px}

/* =====================================================
   v25.29 — dividendjaar-hero, leaderboard en agenda-verrijking
   (feedback Rabi: standaard uitgeklapt, passend, dopamine)
   ============================================================ */
.divhero{border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin:2px 0 12px;
  background:linear-gradient(160deg, rgba(61,220,151,.08), transparent 65%)}
.divjaarkop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap}
.divjaarlbl{font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); font-weight:700}
.divtrofee{font-size:12.5px; font-weight:700}
.divtrofee.stil{color:var(--ink-2); font-weight:600; font-variant-numeric:tabular-nums}
.divrecbaan{position:relative; height:10px; border-radius:999px; background:var(--line); margin:9px 0 7px; overflow:hidden}
.divrecbaan i{position:absolute; top:0; bottom:0; left:0; border-radius:999px; background:var(--accent);
  transition:width .9s cubic-bezier(.2,.7,.2,1)}
.divrecbaan.goud i{background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #fff))} /* v25.52 (HUISSTIJL2): baan in het accent (was accent → mintgroen) */
.divreclbl{font-size:13px; color:var(--ink-2); line-height:1.5}
.divreclbl b{color:var(--ink); font-variant-numeric:tabular-nums}
.divchips{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px}
.divchip{display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line); border-radius:999px;
  padding:6px 12px; font-size:12.5px; line-height:1.35; background:var(--card, transparent)}
.divchip .dot{width:7px; height:7px; border-radius:50%; background:var(--accent); flex:none}
.divchip.snel{border-color:var(--accent)}
.divchip.snel .dot{animation:divpulse 1.6s ease-in-out infinite}
@keyframes divpulse{0%,100%{opacity:1; transform:scale(1)} 50%{opacity:.35; transform:scale(1.4)}}
@media (prefers-reduced-motion: reduce){ .divchip.snel .dot{animation:none} }
.nietbreek{white-space:nowrap}
/* leaderboard per positie */
.divposlijst{margin:0 0 4px}
.divrij{display:flex; align-items:center; gap:11px; padding:8px 2px; border-top:1px solid var(--line)}
.divrij:first-child{border-top:none}
.divrang{width:21px; height:21px; border-radius:50%; background:var(--line); display:inline-flex; align-items:center;
  justify-content:center; font-size:11px; font-weight:700; color:var(--ink-2); flex:none}
.divrij.top .divrang{background:var(--accent); color:var(--accent-tekst)} /* v25.52 (HUISSTIJL2): tekst op accent */
.divmid{flex:1; min-width:0}
.divnaam{display:block; font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.divbaan{height:4px; border-radius:999px; background:var(--line); margin-top:5px; overflow:hidden}
.divbaan i{display:block; height:100%; border-radius:999px; background:var(--accent); opacity:.7; transition:width .9s ease}
.divrechts{text-align:right; flex:none; display:flex; flex-direction:column; gap:1px}
.divrechts b{font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap}
.divjr{font-weight:500; color:var(--ink-2); font-size:11px}
.divwanneer{font-size:11.5px; color:var(--ink-2); white-space:nowrap}
/* agenda: countdown-chips, eerstvolgende uitgelicht, beat/miss-badges */
.acd{align-self:center; justify-self:start; min-width:62px; text-align:center; border:1px solid var(--line);
  border-radius:999px; padding:4px 8px; font-size:11.5px; font-weight:700; color:var(--ink-2); font-variant-numeric:tabular-nums; white-space:nowrap}
.acd.nu{border-color:var(--accent); color:var(--accent)}
.arow.toek.eerst{background:rgba(61,220,151,.07); border-radius:12px; padding-left:8px; padding-right:8px; border-bottom-color:transparent}
.abadge{align-self:center; justify-self:start; min-width:62px; text-align:center; border-radius:999px; padding:4px 8px;
  font-size:11.5px; font-weight:800; white-space:nowrap}
.abadge.up{background:rgba(61,220,151,.13); color:var(--good-text)}
.abadge.down{background:rgba(224,82,82,.13); color:var(--bad-text)}
.abadge.mut{background:var(--line); color:var(--ink-2)}
.awhen em{display:block; font-style:normal; color:var(--ink-2); margin-top:1px}
.agsub{margin:10px 2px 4px; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); font-weight:700}
.arow.past{opacity:.75}
/* Kleine schermen: agenda-rijen in twee nette regels — chip links (over beide
   regels), ticker + naam op regel 1, datum + verwachting op regel 2. Zo wordt
   op 320px nooit meer een ticker afgeknipt (layout-wachter-les). */
@media (max-width: 380px){
  .arow{grid-template-columns:78px minmax(0,1fr); grid-template-rows:auto auto; row-gap:2px}
  .arow .acd, .arow .abadge{grid-row:1 / span 2; align-self:center; padding:4px 6px}
  .arow .atick{grid-column:2}
  .arow .awhen{grid-column:2; text-align:left; white-space:normal}
}

/* =====================================================
   v25.30 — Rendement-waarheid: de berekening-weergave
   ============================================================ */
.rekenmodal{max-width:540px; max-height:86vh; overflow:auto}
.rekenmodal .cardhead{flex-wrap:nowrap} /* titel wrapt naast de ✕, knop zakt nooit naar een eigen regel */
.rekenopen{margin:6px 2px 0; display:inline-block}
.stortinghint{margin:8px 2px 0; color:var(--ink)}
.rekensom{border:1px solid var(--line); border-radius:12px; padding:10px 12px; margin:0 0 10px; display:grid; gap:6px}
.rekenrij{display:flex; justify-content:space-between; gap:12px; font-size:13.5px}
.rekenrij b{font-variant-numeric:tabular-nums; white-space:nowrap}
.rekenrij.dik{border-top:1px solid var(--line); padding-top:6px; font-weight:700}
.rekensub{font-size:11.5px; color:var(--ink-2); line-height:1.6}
.rekenflows{max-height:300px; overflow:auto; border:1px solid var(--line); border-radius:12px; padding:4px 10px; margin:4px 0 10px}
.rekenflow{display:flex; align-items:baseline; gap:10px; padding:7px 0; border-top:1px solid var(--line); font-size:12.5px}
.rekenflow:first-child{border-top:none}
.rfd{flex:none; color:var(--ink-2); font-variant-numeric:tabular-nums; white-space:nowrap}
.rfo{flex:1; min-width:0} .rfo i{font-style:normal; color:var(--ink-3); margin-left:6px; font-size:11px; white-space:nowrap}
.rfb{flex:none; font-variant-numeric:tabular-nums; white-space:nowrap; color:var(--good-text)}
.rekenflow.uit .rfb{color:var(--bad-text)}
.rekenslot{font-size:13.5px; line-height:1.55; border-left:3px solid var(--accent); padding:2px 0 2px 10px; margin:10px 0}
.rekenbenader{border:1px solid rgba(232,185,60,.5); background:rgba(232,185,60,.08); border-radius:12px; padding:8px 12px 10px; margin:10px 0}
.rekenbenader .btn{margin-top:4px}

/* v25.31 — Grondslagenronde: ↩ audit-knop in het beheer */
.pfauditsub{display:block; font-style:normal; font-size:11px; color:var(--ink-3); margin-top:2px; white-space:normal}
#pfAuditBlok{margin-top:8px}
#pfAuditBlok .btn{width:100%; text-align:left}
.plakimport{margin:6px 0 2px 44px}
/* v25.31 — stuur-knop actieve staat + harde versie-balk */
#chatSend.klaar{background:var(--accent); color:var(--accent-tekst); border-color:var(--accent)} /* v25.52 (HUISSTIJL2): tekst op accent (was groen-zwart) */
.verhard{position:fixed; left:0; right:0; bottom:0; z-index:9999; background:var(--card, var(--merk-navy)); border-top:2px solid var(--accent); padding:14px 16px calc(14px + env(safe-area-inset-bottom)); display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; box-shadow:0 -8px 30px rgba(0,0,0,.45)} /* v25.52 (HUISSTIJL2): terugval navy (was groen-zwart) */
.verhard b{font-size:14px}
.verhard span{flex:1 1 100%; font-size:12.5px; color:var(--ink-2)}
.verhard .btn{margin-left:auto}

/* =====================================================
   v25.32 — redesign "De Belegger Mobile": tabbalk, schermen & koppen
   ============================================================ */

/* Tabbalk onderin — vervaagde grond, ronde ＋ in het midden */
.tabbar{
  position:fixed; left:0; right:0; bottom:0; z-index:45;
  display:grid; grid-template-columns:1fr 1fr 64px 1fr 1fr; align-items:end;
  padding:8px 10px calc(10px + env(safe-area-inset-bottom));
  background:color-mix(in srgb, var(--ground) 86%, transparent);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  border-top:1px solid var(--line);
}
@supports not (background:color-mix(in srgb, red 50%, blue)){ .tabbar{background:var(--ground)} }
.tabbar > button[data-tab]{
  appearance:none; background:transparent; border:none; cursor:pointer; position:relative;
  display:flex; flex-direction:column; align-items:center; gap:3px; padding:4px 0;
  color:var(--ink-3); font:600 10.5px "IBM Plex Sans",sans-serif;
}
.tabbar > button[data-tab] .tico{font-size:19px; line-height:1; filter:grayscale(1) opacity(.72)}
.tabbar > button[data-tab].on{color:var(--accent)}
.tabbar > button[data-tab].on .tico{filter:none}
.tabplusvak{display:flex; justify-content:center}
.tabplus{
  appearance:none; border:none; cursor:pointer; width:52px; height:52px; border-radius:50%;
  background:var(--accent-verloop); color:var(--accent-tekst) /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): tekst op accent via token */;
  font:700 26px "Archivo",sans-serif; margin-top:-22px; line-height:1;
  box-shadow:0 10px 24px color-mix(in srgb, var(--accent) 35%, transparent);
  transition:transform .15s ease;
}
.tabplus:active{transform:scale(.94)}
.tabbar.allesmodus .tabplus{opacity:.45}
.tabbadge{
  position:absolute; top:0; right:calc(50% - 20px); min-width:16px; height:16px; border-radius:8px;
  background:var(--bad); color:#fff; font:700 10px "Archivo",sans-serif;
  display:grid; place-items:center; padding:0 4px;
}
/* Op een groot scherm blijft de balk zelf app-breed */
@media (min-width:560px){
  .tabbar{left:50%; transform:translateX(-50%); width:520px; border:1px solid var(--line); border-bottom:none; border-radius:18px 18px 0 0}
}

/* ＋-Toevoegen-menu (actiesheet uit het ontwerp) */
.plusmenu{padding:6px 0 calc(14px + env(safe-area-inset-bottom)); height:auto; max-height:70svh}
.pluskop{padding:12px 16px 6px; font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); text-align:center}
.plusitem{
  appearance:none; width:100%; text-align:left; background:transparent; border:none; cursor:pointer;
  border-top:1px solid var(--line); padding:15px 18px; color:var(--ink);
  font:600 15px "IBM Plex Sans",sans-serif; display:flex; gap:12px; align-items:center;
}
.plusitem .plusemo{font-size:18px; width:24px; text-align:center}
.plusitem b{font-weight:600}
.plusitem i{display:block; font:400 12.5px "IBM Plex Sans",sans-serif; font-style:normal; color:var(--ink-3); margin-top:2px}
.plusannuleer{appearance:none; width:calc(100% - 32px); margin:10px 16px 0; background:var(--card-2); border:1px solid var(--line-2); border-radius:14px; padding:13px; color:var(--ink-2); font:600 15px "IBM Plex Sans",sans-serif; cursor:pointer}

/* Schermkoppen van de eigen schermen */
.view > .viewhead{display:flex; align-items:center; gap:10px; margin-bottom:14px}
.viewhead .terugknop{width:38px; height:38px; font-size:20px; line-height:1; flex:none}
.viewhead .viewtitel{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px}
.viewhead .viewkop{margin:0; font-size:20px}
.viewhead .viewsub{font-size:12.5px; color:var(--ink-3)}
.viewhead .eyebrow{letter-spacing:.12em}
.viewhead .pfswitch{padding:0; background:transparent; border:none}
.viewhead .txnieuw{margin:0; padding:9px 14px; border-radius:999px; font-size:13px; box-shadow:none}
.viewhead .pill{flex:none}
.chathead2 .avatar{width:34px; height:34px; border-radius:50%; background:var(--accent-verloop); color:var(--accent-tekst) /* v25.38: De Belegger-blauw · v25.52 (HUISSTIJL2): tekst op accent via token */; display:grid; place-items:center; font:800 14px "Archivo",sans-serif}
.chathead2 .chattitel{font-family:"Archivo",sans-serif; font-size:15px}

/* Kop op home: 💬 Community-knop + ⋯-menu */
.headright{display:flex; align-items:center; gap:8px}
.commbtn{
  appearance:none; cursor:pointer; display:flex; align-items:center; gap:6px;
  font:600 12px "IBM Plex Sans",sans-serif; color:var(--ink);
  background:var(--card); border:1px solid var(--line-2); border-radius:999px;
  height:38px; padding:0 12px; white-space:nowrap;
}
.commbtn .navbadge{font-size:11.5px; color:var(--accent); font-variant-numeric:tabular-nums}
.wlster{color:var(--gold)}
@media (max-width:399px){ .commbtn .commlbl{display:none} .commbtn{padding:0 11px} }
.meermenu{
  position:absolute; right:18px; top:64px; z-index:48;
  background:var(--card); border:1px solid var(--line-2); border-radius:14px;
  box-shadow:var(--shadow); padding:8px; display:flex; flex-direction:column; gap:2px; min-width:190px;
}
#screen-home{position:relative}
.meerplan{padding:6px 10px 8px; border-bottom:1px solid var(--line); margin-bottom:4px}
.meeritem{appearance:none; background:transparent; border:none; cursor:pointer; text-align:left; color:var(--ink); font:500 13.5px "IBM Plex Sans",sans-serif; padding:9px 10px; border-radius:9px}
.meeritem:hover{background:var(--hl-bg)}

/* Compacte lege-staat op het portefeuille-tabblad */
.dashleeg{padding:18px; display:flex; flex-direction:column; gap:6px}
.dashleeg p{margin:0; color:var(--ink-2); font-size:13.5px}
.dashleeg .btn{margin-top:10px}

/* Transacties-scherm: filters, maandgroepen, typebadges */
.txfilters{margin-bottom:12px}
.txmaand{padding:14px 8px 6px; margin-bottom:12px}
.txmaandkop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:0 10px; font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3)}
.txmaandkop .txmaandsom{font-variant-numeric:tabular-nums; letter-spacing:0; text-transform:none; font-size:12px}
.txregels{display:flex; flex-direction:column; margin-top:6px}
.txregel{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; padding:11px 10px; border-top:1px solid var(--line)}
.txtype{font:700 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; padding:5px 8px; border-radius:6px; min-width:64px; text-align:center; color:var(--ink-2); background:var(--hl-bg)}
.txtype.t-koop{color:var(--good-text); background:rgba(52,201,142,.12)}
.txtype.t-verkoop{color:var(--bad-text); background:rgba(229,96,90,.12)}
.txtype.t-storting{color:var(--accent); background:var(--accent-wash)} /* v25.52 (HUISSTIJL2): storting-chip in het merkblauw (was los blauw) */
.txtype.t-opname,.txtype.t-dividend,.txtype.t-rente{color:var(--gold); background:rgba(217,179,107,.14)}
.txmid{min-width:0; display:flex; flex-direction:column; gap:2px}
.txmid b{font:600 14px "IBM Plex Sans",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.txmid i{font-style:normal; font-size:12px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.txbedrag{font:700 14px "Archivo",sans-serif; font-variant-numeric:tabular-nums; white-space:nowrap}
.txbedrag.up{color:var(--good-text)}

/* Meldingen-scherm */
.notiftabs{margin-bottom:12px; width:100%}
.notiftabs button{flex:1}
.notifcard{padding:6px 8px}
.notifemo{width:36px; height:36px; border-radius:50%; display:grid; place-items:center; font-size:16px; background:rgba(217,179,107,.14)}
.pfmelding .notif-l span{font-size:13.5px; line-height:1.45}

/* Assistent als scherm: berichten vullen de hoogte, invoer onder */
.chatview{display:flex; flex-direction:column; min-height:calc(100svh - 210px)}
.chatview .msgs{flex:1; min-height:200px; padding:4px 2px 12px}
.chatview .inputrow{border-top:1px solid var(--line); padding:12px 0 0; position:sticky; bottom:calc(86px + env(safe-area-inset-bottom)); background:var(--ground)}
.chatview .aiupsell{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:20px; box-shadow:var(--shadow)}
.chatview .chiprow{padding:6px 0}
.chatview .attachstrip{padding:10px 2px 0}

/* Prestatie-scherm */
.prestcard{padding:16px 16px 14px; margin-bottom:14px}
.prestkpi{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.prestkpi b{font-family:"Archivo",sans-serif; font-weight:800; font-size:34px; letter-spacing:-.02em; font-variant-numeric:tabular-nums; line-height:1}
.prestkpi b.up{color:var(--good-text)} .prestkpi b.down{color:var(--bad-text)}
.prestkpi .prestlbl{font-size:13px; color:var(--ink-3)}
.presttabs{margin-bottom:6px}
.prestvoet{margin:2px 6px 0}
.seriestoggles{display:flex; flex-wrap:wrap; gap:8px; padding:10px 2px 2px}
.stgl{appearance:none; cursor:pointer; display:flex; align-items:center; gap:8px; font:600 12.5px "IBM Plex Sans",sans-serif; padding:7px 12px; border-radius:999px; border:1px solid var(--line-2); background:var(--stat-bg); color:var(--ink)}
.stgl.uit{opacity:.45; background:transparent; color:var(--ink-3)}
.stgl[disabled]{cursor:default}
.stgl b{font-family:"Archivo",sans-serif; font-variant-numeric:tabular-nums}
#view-prestatie .rangestats{padding:2px 8px 8px}

/* Watchlist-scherm */
.wlzoek{margin-bottom:12px}
.wlvoet{display:flex; align-items:center; gap:12px; padding:14px 16px; margin-top:12px}
.wlvoet .wlvoetemo{font-size:22px}
.wlvoet .chartsub{margin:0}
#view-watchlist .wlcard{padding:8px}

/* Importscherm */
#view-import .emptycard{margin-bottom:12px}
.bannerpf{margin-top:12px}

/* Eigen schermen verbergen de home-kop, zoekbalk en tape (ze hebben hun eigen kop) */
#screen-home[data-view="meldingen"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu),
#screen-home[data-view="assistent"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu),
#screen-home[data-view="transacties"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu),
#screen-home[data-view="watchlist"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu),
#screen-home[data-view="prestatie"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu),
#screen-home[data-view="import"] > :is(.apphead,.topnav,.tape,.newsbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="meldingen"] > section.card,
#screen-home[data-view="assistent"] > section.card,
#screen-home[data-view="transacties"] > section.card,
#screen-home[data-view="watchlist"] > section.card,
#screen-home[data-view="prestatie"] > section.card,
#screen-home[data-view="import"] > section.card{display:none !important}

/* Versievoetje: in de stroom onder de kaarten, zoals het ontwerp */
.appversion{position:static; text-align:center; font-size:11px; color:var(--ink-3); opacity:.6; padding:6px 0 calc(74px + env(safe-area-inset-bottom)); pointer-events:none}

/* v25.32: toast en formulieren boven de tabbalk */
#toast{bottom:calc(96px + env(safe-area-inset-bottom))}
.verhard{z-index:9999} /* de harde ververs-balk mag wél over de tabbalk heen — verversen gaat vóór */
/* Formulieren als onderin-sheet, zoals het ontwerp (drag-streepje via ::before) */
.txoverlay{align-items:flex-end; padding:0}
.txmodal{max-width:min(520px, 100vw); margin:0 auto; border-radius:22px 22px 0 0; max-height:88svh; padding-bottom:calc(22px + env(safe-area-inset-bottom))}
.txmodal::before{content:""; display:block; width:40px; height:4px; border-radius:2px; background:var(--line-2); margin:-6px auto 10px}
@media (min-width:560px){ .txoverlay{padding:0} }

/* v25.32: portefeuille-meldingen mogen gewoon doorlopen op een tweede regel */
.pfmelding .notif-l span{white-space:normal; overflow:visible; text-overflow:clip}
/* Versievoetje alleen op de home-familie (eigen schermen hebben hun eigen kop) */
body.eigenview .appversion{display:none}

/* v25.32 (ontwerp): donut 150px naast de legenda — zoals het Verdeling-artboard */
#allocCard .donutbox{width:150px; height:150px; margin:0}
#allocCard .donutbox svg{width:150px; height:150px}
#allocCard .donutrow{flex-wrap:nowrap; gap:14px; padding:12px 16px 6px}
#allocCard .legend{min-width:0}
@media (max-width:355px){ #allocCard .donutrow{flex-wrap:wrap} #allocCard .donutbox{margin:0 auto} }

/* =====================================================
   v25.32 — Community als kanalen (Discord-model, "De Belegger Mobile")
   ============================================================ */

/* Kanaalkop */
.kanaalview{display:flex; flex-direction:column; min-height:calc(100svh - 150px)}
.kanaalkop{display:flex; align-items:center; gap:10px; padding:max(2px, env(safe-area-inset-top)) 18px 10px; border-bottom:1px solid var(--line); margin:0 -18px 10px; position:sticky; top:0; z-index:30; background:var(--ground)} /* Discord: de kanaalkop blijft bovenin staan terwijl je scrolt (volle breedte, dichte grond) */
.paneelknop{width:38px; height:38px; font-size:17px; flex:none}
.kanaalnaam{appearance:none; background:transparent; border:none; cursor:pointer; text-align:left; color:var(--ink); padding:0; flex:1; min-width:0; font:inherit}
.kanaalnaam b{display:flex; align-items:center; gap:6px; font-family:"Archivo",sans-serif; font-weight:800; font-size:17px; letter-spacing:-.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.kanaalnaam .khash{color:var(--ink-3)}
.kanaalnaam .kpijl{font-size:13px; color:var(--ink-3)}
.kanaalsub{display:block; font-size:12px; color:var(--ink-3); margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.kanaalsub .kgroen{color:var(--accent)}
.volgknop{appearance:none; cursor:pointer; font:600 12px "IBM Plex Sans",sans-serif; padding:7px 11px; border-radius:999px; white-space:nowrap; flex:none; border:1px solid var(--line-2); background:transparent; color:var(--ink-2)}
.volgknop.vauto{border-color:color-mix(in srgb, var(--accent) 35%, transparent); background:var(--accent-wash); color:var(--accent)}
.volgknop.vaan{color:var(--ink-2)}
.volgknop.vuit{border-color:var(--accent); background:var(--accent); color:var(--accent-tekst)} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */

/* Aandelenkaartje boven een tickerkanaal */
.tickerkaart{appearance:none; cursor:pointer; text-align:left; width:100%; margin:0 0 10px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:10px 12px; display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:10px; align-items:center; color:var(--ink); font:inherit}
.tickerkaart .tktegel{width:34px; height:34px; border-radius:10px; display:grid; place-items:center; font:800 10px "Archivo",sans-serif; color:var(--accent-tekst); background:var(--accent)} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
.tickerkaart .ktmid{min-width:0}
.tickerkaart .ktmid b{display:block; font:600 13px "IBM Plex Sans",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tickerkaart .ktmid i{display:block; font-style:normal; font-size:11.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tickerkaart .ktrechts{text-align:right}
.tickerkaart .ktrechts b{display:block; font:700 13px "Archivo",sans-serif; font-variant-numeric:tabular-nums}
.tickerkaart .ktrechts i{display:block; font-style:normal; font:600 11.5px "IBM Plex Sans",sans-serif}
.tickerkaart .ktrechts i.up{color:var(--good-text)} .tickerkaart .ktrechts i.down{color:var(--bad-text)}
.tickerkaart .ktrechts em{display:block; font-style:normal; font-size:10.5px; color:var(--ink-3); margin-top:1px}

/* Berichtenstroom + invoerbalk */
.kanaalfeed{flex:1; padding:0 2px 8px}
/* Discord: berichtacties zitten in het lang-indrukken/rechtsklik-menu — de losse
   📌/✕-knopjes in de naamregel verdwijnen uit de kanaalstroom (ze blijven in de
   DOM voor de menu-acties) zodat een volle naamregel nooit meer breekt. */
.kanaalfeed .pmeta .pdel{display:none}
/* v25.34 (verzoek Rabi): de aparte invoerbalk onder het kanaal is vervallen —
   de ＋ in de tabbalk is de berichtknop en de stroom loopt tot aan de balk
   (berichten schemeren door de matglazen tabbalk, net als op de andere schermen). */
#screen-home[data-view="feed"]{padding-bottom:calc(74px + env(safe-area-inset-bottom))}

/* Reactiechips (emoji) onder berichten — Discord: pas zichtbaar als ze er zijn */
.reactierij{display:flex; gap:4px; margin-top:5px; flex-wrap:wrap}
.reactierij.leeg{display:none}
.reactiechip{appearance:none; cursor:pointer; font:600 12.5px "IBM Plex Sans",sans-serif; padding:3px 8px; border-radius:8px; border:1px solid var(--line-2); background:var(--hl-bg); color:var(--ink); font-variant-numeric:tabular-nums; transition:transform .1s ease, border-color .15s ease}
.reactiechip:active{transform:scale(.92)}
.reactiechip.mijn{border-color:color-mix(in srgb, var(--accent) 55%, transparent); background:var(--accent-wash)}
.reactiechip.pop{animation:chippop .3s cubic-bezier(.3,1.6,.5,1)}
@keyframes chippop{0%{transform:scale(.7)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
.reactieplus{appearance:none; cursor:pointer; width:27px; height:24px; display:grid; place-items:center; font-size:14px; line-height:1; padding:0; border-radius:8px; border:1px solid var(--line-2); background:transparent; color:var(--ink-3)}
.reactieplus:hover{color:var(--ink-2); border-color:var(--line)}
@media (prefers-reduced-motion: reduce){ .reactiechip.pop{animation:none} }
.reactiekies{display:flex; gap:4px; margin-top:6px; flex-wrap:wrap; background:var(--card-2); border:1px solid var(--line-2); border-radius:10px; padding:6px}
.reactiekies button{appearance:none; cursor:pointer; background:transparent; border:none; font-size:17px; padding:4px 6px; border-radius:8px}
.reactiekies button:hover{background:var(--hl-bg)}

/* Portefeuille-bijlage bij een bericht */
.pfbijlage{margin-top:8px; padding:10px 12px; border-radius:10px; background:var(--card-2); border:1px solid color-mix(in srgb, var(--accent) 30%, transparent); font-size:13px; color:var(--ink-2)}
.pfbijlage b{color:var(--good-text)}

/* v25.33: nieuw-kanaal-sheet (alleen beheerder) + verwijderknop in kanaalinfo */
.veldlabel{display:block; font-size:12.5px; font-weight:600; color:var(--ink-2); margin-top:10px}
.veldlabel input{display:block; width:100%; margin-top:5px; height:42px; border-radius:11px; border:1px solid var(--line-2); background:var(--card); color:var(--ink); padding:0 12px; font:inherit; font-size:14px}
.knvink{display:flex; align-items:center; gap:9px; font-size:13.5px; color:var(--ink-2); margin-top:10px; cursor:pointer}
.knvink input{width:17px; height:17px; accent-color:var(--accent)} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.kirood{color:var(--bad-text) !important; border-color:color-mix(in srgb, var(--bad) 40%, var(--line)) !important}
.kanaalnieuw .khash{color:var(--accent)}

/* Kanalenpaneel (links) */
.paneel .paneelvlak{
  position:absolute; left:0; top:0; bottom:0; width:min(330px, 88vw);
  background:var(--seg-bg); border-right:1px solid var(--line-2);
  display:flex; flex-direction:column;
  transform:translateX(-108%); transition:transform .28s cubic-bezier(.32,.72,.29,1);
  box-shadow:20px 0 60px rgba(0,0,0,.5);
}
/* Open schuift op brede schermen tot tegen de app-kolom aan (50vw − 260px kolomrand
   − 330px paneelbreedte); dicht is met translateX(-108%) op élk formaat volledig uit beeld. */
.paneel.on .paneelvlak{transform:translateX(max(0px, calc(50vw - 590px)))}
.paneelkop{padding:max(14px, env(safe-area-inset-top)) 14px 12px; border-bottom:1px solid var(--line)}
.paneelkoprij{display:flex; align-items:center; gap:10px}
.paneelicoon{width:30px; height:30px; border-radius:8px}
.paneeltitel{flex:1; min-width:0}
.paneeltitel b{display:block; font-family:"Archivo",sans-serif; font-size:17px; letter-spacing:-.01em}
.paneeltitel span{display:block; font-size:12px; color:var(--ink-3)}
.paneelzoek{margin-top:12px}
.paneelgroepen{flex:1; overflow-y:auto; padding:8px 10px 16px; display:flex; flex-direction:column; gap:14px}
.pgroep .pgkop{display:flex; justify-content:space-between; align-items:center; padding:4px 8px 6px; font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3)}
.pgroep .pghint{font-size:11px; letter-spacing:0; text-transform:none; color:var(--ink-3); opacity:.7}
.krij{display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:4px; border-radius:10px}
.krij.actief{background:var(--hl-bg)}
.krij .kopen{appearance:none; cursor:pointer; background:transparent; border:none; text-align:left; display:flex; align-items:center; gap:8px; padding:9px 8px; color:var(--ink-2); font:500 14px "IBM Plex Sans",sans-serif; min-width:0}
.krij.ongelezen .kopen{color:var(--ink); font-weight:700}
.krij .kopen .khash{color:var(--ink-3); font:600 15px "Archivo",sans-serif; width:14px; flex:none}
.krij .kopen .knaam{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.krij .kopen .kdot{width:6px; height:6px; border-radius:50%; background:var(--ink); flex:none}
.krij .konline{font-size:11px; color:var(--accent); font-variant-numeric:tabular-nums; white-space:nowrap; padding:0 2px}
.krij .kvolg{appearance:none; cursor:pointer; background:transparent; border:none; padding:6px 8px; font:600 11px "IBM Plex Sans",sans-serif; white-space:nowrap; color:var(--ink-3)}
.krij .kvolg.vauto{color:var(--accent)}
.krij .kvolg.vuit{color:var(--accent)}
.paneelvoet{padding:10px 12px calc(12px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); display:flex; align-items:center; gap:10px}
.paneelvoet .pavatar{width:34px; height:34px; position:relative}
.paneelwie{flex:1; min-width:0}
.paneelwie b{display:block; font:700 13.5px "IBM Plex Sans",sans-serif}
.paneelwie span{display:block; font-size:11.5px; color:var(--ink-3)}

/* Compose-sheet (＋ = berichtknop) */
.composevlak{padding:14px 16px calc(20px + env(safe-area-inset-bottom)); height:auto; max-height:80svh}
.composevlak::before{content:""; display:block; width:40px; height:4px; border-radius:2px; background:var(--line-2); margin:-4px auto 12px}
.composetop{display:flex; justify-content:space-between; align-items:center; gap:8px}
.composetop .postbtn{margin:0}
.composekanaal{max-width:50%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.composevlak .composer{padding:0; margin-top:14px}
.composevlak textarea{border:none; background:transparent; font-size:16px; padding:6px 0; min-height:96px}
.composeacties{display:flex; align-items:center; gap:6px; margin-top:8px; padding-top:10px; border-top:1px solid var(--line); flex-wrap:wrap}
.composeacties .iconbtn{width:34px; height:34px; border-radius:10px}
.composeteller{margin-left:auto; font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.composebijlage{margin-top:10px; padding:10px 12px; border-radius:10px; background:var(--card-2); border:1px solid color-mix(in srgb, var(--accent) 30%, transparent); display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:13px}
.composebijlage .goed{color:var(--good-text); font-weight:700}
.composebijlage .iconbtn{width:26px; height:26px; border:none; background:transparent; color:var(--ink-2)}

/* Ledenlijst */
.ledenvlak{padding:16px; height:auto; max-height:74svh}
.ledenlijst{overflow-y:auto; display:flex; flex-direction:column; gap:2px; padding:6px 0}
.ledenrij{display:flex; align-items:center; gap:10px; padding:7px 4px; font-size:13.5px}
.ledenrij .ldot{width:8px; height:8px; border-radius:50%; background:var(--ink-3); opacity:.5; flex:none}
.ledenrij.online .ldot{background:var(--good); opacity:1}
.ledenrij.online b{color:var(--ink)} .ledenrij b{color:var(--ink-2); font-weight:600}
.ledenrij .lstatus{margin-left:auto; font-size:11px; color:var(--ink-3)} /* alleen het online-label rechts — de rij zelf blijft links uitgelijnd */

/* Ongelezen-stip op de 💬-knop */
.commbtn{position:relative}
.commdot{position:absolute; top:6px; right:7px; width:8px; height:8px; border-radius:50%; background:var(--bad); border:2px solid var(--card)}

/* De community-kop vervangt op dit scherm de gewone app-kop */
#screen-home[data-view="feed"] > :is(.apphead,.topnav,#meerMenu){display:none !important}
#screen-home.feedmode > .tape{display:none !important}
#screen-home.feedmode > .newsbar{display:none !important}

/* v25.32: import-klaarkaart met tegels + kleine gedeelde kleurtjes */
.importtegels{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-top:12px}
.imptegel{background:var(--stat-bg); border:1px solid var(--line); border-radius:12px; padding:10px 12px}
.imptegel span{display:block; font-size:11px; color:var(--ink-3)}
.imptegel b{font:700 16px "Archivo",sans-serif}
.imptegel b.goud{color:var(--gold)}
.wlvolgers{font-style:normal; color:var(--ink-3)}
.kgroen{color:var(--accent)}

/* =====================================================
   v25.32 — Discord-verdieping: groepen, markdown, menu's, compose
   ============================================================ */

/* Berichtgroepen: vervolg-berichten van dezelfde auteur inspringen.
   v25.33: strakkere Discord-proporties — inspringing exact gelijk aan de
   avatar-kolom (34px + 11px gap), groepen dichter op elkaar, regels rustiger. */
.post.slim{grid-template-columns:1fr; padding-top:1px}
.post.slim .pbody{margin-left:45px}
#feedList .post{border-bottom:none; padding:2px 0}
#feedList .post:not(.slim){margin-top:11px}
#feedList .pbody p{margin-top:1px; font-size:14.5px; line-height:1.42}
#feedList .pmeta{align-items:center}
#feedList .pmeta > span{font-size:11.5px}
.post.genoemd{border-left:2px solid var(--gold); background:rgba(217,179,107,.06); border-radius:0 10px 10px 0; padding-left:8px; margin-left:-8px}
.post.pending{opacity:.6}
.post.pending .pmeta::after{content:" ⏱"; color:var(--ink-3)}
/* v25.33: nieuw binnengekomen bericht glijdt zachtjes in beeld — live-gevoel */
.post.nieuwin{animation:postin .25s ease}
@keyframes postin{from{opacity:0; transform:translateY(7px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion: reduce){ .post.nieuwin{animation:none} }

/* Datum- en NIEUW-scheiders */
.datumscheiding{display:flex; align-items:center; gap:10px; margin:14px 0 6px; color:var(--ink-3); font:600 11px "IBM Plex Sans",sans-serif; letter-spacing:.08em}
.datumscheiding::before,.datumscheiding::after{content:""; flex:1; height:1px; background:var(--line)}
.nieuwlijn{display:flex; align-items:center; gap:8px; margin:8px 0; color:var(--bad); font:700 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.1em}
.nieuwlijn::before{content:""; flex:1; height:1px; background:var(--bad); opacity:.7}

/* Markdown-subset */
.pbody code{background:var(--seg-bg); border:1px solid var(--line); border-radius:6px; padding:1px 6px; font-size:12.5px; font-family:ui-monospace,Menlo,monospace}
.mdquote{display:block; border-left:3px solid var(--line-2); padding-left:10px; color:var(--ink-2); margin:2px 0}
.spoiler{appearance:none; border:none; cursor:pointer; font:inherit; background:var(--seg-bg); color:transparent; border-radius:6px; padding:0 6px}
.spoiler.open{color:var(--ink); background:var(--card-2)}
.mention{background:color-mix(in srgb, var(--accent) 15%, transparent); color:var(--good-text); border-radius:6px; padding:0 4px; font-weight:600}
.pbody p.jumbo{font-size:40px; line-height:1.2}
.bewerkt{font-style:normal; font-size:11px; color:var(--ink-3)}

/* Reply-context (flat stroom) */
.replyctx{display:flex; gap:6px; align-items:center; font-size:12px; color:var(--ink-3); margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.replyctx .rlijn{width:14px; height:8px; border-left:2px solid var(--line-2); border-top:2px solid var(--line-2); border-radius:6px 0 0 0; margin-top:6px; flex:none}
.replyctx b{color:var(--ink-2)}
.replyctx i{color:var(--ink-3)}

/* Ouder-knop + welkomstkaarten + offline */
.ouderknop{appearance:none; cursor:pointer; display:block; margin:0 auto 12px; font:600 12.5px "IBM Plex Sans",sans-serif; color:var(--ink-2); background:var(--card); border:1px solid var(--line-2); border-radius:999px; padding:8px 16px}
.welkomkaart{position:relative; background:var(--accent-wash); border:1px solid color-mix(in srgb, var(--accent) 30%, transparent); border-radius:14px; padding:12px 40px 12px 14px; font-size:13px; line-height:1.5; color:var(--ink-2); margin-bottom:10px}
.welkomkaart b{color:var(--ink)}
.welkomkaart .welkomweg{position:absolute; top:8px; right:8px; width:26px; height:26px; border:none; background:transparent; color:var(--ink-2)}
.welkomkaart .hintbtn{margin:8px 0 0; display:inline-block}
.offlinebalk{background:rgba(217,179,107,.12); border:1px solid rgba(217,179,107,.4); color:var(--gold); border-radius:12px; padding:9px 12px; font-size:12.5px; margin-bottom:10px}
.eerstbericht{margin:12px auto 0; display:inline-block}

/* ↓ nieuwe berichten-pil boven de tabbalk */
#newpill{position:fixed; left:50%; transform:translateX(-50%); bottom:calc(78px + env(safe-area-inset-bottom)); z-index:46; appearance:none; border:none; cursor:pointer; font:600 12.5px "IBM Plex Sans",sans-serif; color:var(--accent-tekst); background:var(--accent-verloop); padding:9px 16px; border-radius:999px; box-shadow:0 10px 24px color-mix(in srgb, var(--accent) 35%, transparent)} /* v25.52 (HUISSTIJL2): het knopverloop als token (cirkel → trui) */

/* Compose-verdieping */
.composereply{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:12px; background:var(--card-2); border:1px solid var(--line); border-radius:10px; padding:8px 10px; font-size:12.5px; color:var(--ink-2)}
.composereply .iconbtn{width:26px; height:26px; border:none; background:transparent}
.composesuggest{display:flex; flex-direction:column; gap:2px; background:var(--seg-bg); border:1px solid var(--line-2); border-radius:12px; padding:4px; margin-top:4px; max-height:180px; overflow-y:auto}
.composesuggest button{appearance:none; cursor:pointer; display:flex; gap:8px; align-items:baseline; background:transparent; border:none; text-align:left; color:var(--ink); font:inherit; font-size:13.5px; padding:8px 10px; border-radius:8px}
.composesuggest button:hover{background:var(--hl-bg)}
.composesuggest span{color:var(--ink-3); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.composefout{margin:8px 0 0}
.composeteller.bijna{color:var(--bad-text); font-weight:700}
.emojisnel{position:absolute; bottom:56px; left:0; z-index:5}

/* Berichtmenu + rapporteren */
.bmenuvlak{padding:10px 0 calc(16px + env(safe-area-inset-bottom)); height:auto; max-height:76svh; overflow-y:auto}
.bmenureacties{margin:4px 14px 8px; justify-content:space-between}
.bmenureacties button{font-size:22px; flex:1}
.bmenuvlak .plusitem b i{display:block; font:400 12px "IBM Plex Sans",sans-serif; font-style:normal; color:var(--ink-3)}
.bmenuvlak .bmrood b{color:var(--bad-text)}

/* Kanaalinfo-sheet */
.kanaalinfobeschrijving{margin:6px 0 0; font-size:13px; color:var(--ink-2)}
.kanaalinfotabs{margin-top:12px; width:100%}
.kanaalinfotabs button{flex:1}
.kanaalinfoacties{display:flex; flex-wrap:wrap; gap:8px; padding:10px 0 2px; border-top:1px solid var(--line); margin-top:8px}
.kanaalmeld{display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%; font-size:13px; color:var(--ink-2)}
.meldseg button{font-size:11.5px !important; padding:6px 9px !important}
.ledenrij .pintekst{margin-left:0; color:var(--ink-3); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

/* Paneel: inklapbare koppen */
.pgkop[data-groep]{cursor:pointer; user-select:none}
.pgroep.dicht{opacity:.85}

/* =====================================================
   v25.34 — desktop-polish: gedockt paneel, hover-acties, scrollbars
   ============================================================ */

/* Kanalenpaneel vast naast de kolom op brede schermen (Discord-desktop).
   De lade-mechaniek blijft eronder gewoon bestaan. */
@media (min-width:1180px){
  body.commfeed #kanaalPaneel{pointer-events:none}
  body.commfeed #kanaalPaneel .backdrop{display:none}
  body.commfeed #kanaalPaneel .paneelvlak{
    transform:translateX(max(0px, calc(50vw - 590px))) !important;
    pointer-events:auto; box-shadow:none; border-right:1px solid var(--line);
    transition:none;
  }
  body.commfeed .paneelknop{display:none} /* ≡ is overbodig — het paneel staat er al */
  body.commfeed #kanaalPaneelSluit{display:none} /* net als de ×: er valt niets te sluiten */
}

/* Actieknopjes op berichten (🙂 ↩ ⋯).
   v25.35 (verzoek Rabi): op touch-apparaten staan ze ALTIJD net onder het
   bericht — ingedrukt houden is niet intuïtief (dat blijft wél werken).
   Op muis-apparaten zweven ze rechtsboven bij hover, zoals Discord-desktop. */
#feedList .post{position:relative}
.hovacts{display:flex; gap:2px; margin-top:3px; margin-left:-6px}
.hovacts button{appearance:none; cursor:pointer; background:transparent; border:none;
  width:32px; height:26px; border-radius:8px; font-size:14px; line-height:1; display:grid; place-items:center; color:var(--ink-3); opacity:.85}
.hovacts button:active{transform:scale(.9)}
@media (hover:hover){
  .hovacts{display:none; position:absolute; top:-12px; right:6px; z-index:5; margin:0;
    background:var(--card); border:1px solid var(--line-2); border-radius:10px; padding:2px;
    box-shadow:0 6px 18px -8px rgba(0,0,0,.5)}
  .hovacts button{width:30px; height:28px; font-size:14.5px; color:var(--ink-2); opacity:1}
  .hovacts button:hover{background:var(--hl-bg)}
  #feedList .post:hover > .pbody > .hovacts,
  #feedList .post .hovacts:hover{display:flex}
}

/* Dunne, rustige scrollbars op muis-apparaten — scherp in beide thema's. */
@media (hover:hover){
  *{scrollbar-width:thin; scrollbar-color:color-mix(in srgb, var(--ink-3) 40%, transparent) transparent}
  ::-webkit-scrollbar{width:11px; height:11px}
  ::-webkit-scrollbar-track{background:transparent}
  ::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--ink-3) 38%, transparent); border-radius:9px; border:3px solid transparent; background-clip:content-box}
  ::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb, var(--ink-3) 60%, transparent); border:3px solid transparent; background-clip:content-box}
}

/* v25.34: sorteerknoppen + sorteermenu (posities & watchlist) */
.sortmenu{position:absolute; right:14px; margin-top:-6px; z-index:30; background:var(--card); border:1px solid var(--line-2); border-radius:14px; padding:6px; box-shadow:0 14px 34px -14px rgba(0,0,0,.6); display:flex; flex-direction:column; gap:2px; min-width:210px}
.sortmenu button{appearance:none; cursor:pointer; text-align:left; background:transparent; border:none; color:var(--ink); font:600 13.5px "IBM Plex Sans",sans-serif; padding:9px 11px; border-radius:9px}
.sortmenu button:hover{background:var(--hl-bg)}
.sortmenu button.on{color:var(--good-text)}
.sortmenu button.on::after{content:" ✓"}
.sortmenu .sorthint{margin:4px 11px 6px; font-size:11.5px; color:var(--ink-3)}
.pfcard{position:relative}
.sortbtn{white-space:nowrap}
.pf-actions .pill{white-space:nowrap}
@media (max-width:480px){ .sortbtn .sortlbl{display:none} .sortbtn{padding-inline:9px} }


/* v25.37 — bugfix-release: uitsplitsing per valuta onder de cash-tegel (issue 47) */
.stat .statsub { display: block; margin-top: 4px; font-size: 11.5px; line-height: 1.3; color: var(--mut, #8a8f98); font-weight: 500; letter-spacing: 0; overflow-wrap: anywhere; }
.stat .statsub[hidden] { display: none; }

/* =====================================================
   v25.37 — community v2 stap 2: feed-first community, drawer (≡), tabbalk
   Feed · Ontdek · ＋ · Watchlist · Portefeuille, community-badges, Ontdek v1.
   Alle kleuren via de thema-tokens (dark + licht), hover alleen in (hover:hover).
   ============================================================ */

/* Feedkop: ≡ · Community › · 🔔 · ✦ (ontwerp v2) */
.feedkopknop{width:36px; height:36px; border-radius:12px; font-size:15px; flex:none; position:relative}
.feedkopknop.feedai{color:var(--accent)}
.feedkopknop .notifdot{top:-5px; right:-5px}
.kanaalnaam .khash:empty{display:none}
#feedHome.feedalles .kanaalnaam b{font-size:16px}

/* De tickertape staat bóven de feed (de nieuwsbalk blijft bij het dashboard) */
#screen-home.feedmode > .tape:not([hidden]){display:block !important}
#screen-home.feedmode > .tape{margin-bottom:0; border-bottom:none}

/* Feed van álle berichten: elk bericht met avatar en naamregel, één dunne scheidslijn
   eronder (ontwerp: geen kaartranden, veel lucht), nieuwste boven. */
#feedHome.feedalles #feedList .post{margin-top:0; padding:10px 0 9px; border-bottom:1px solid var(--line); grid-template-columns:38px 1fr; gap:10px}
#feedHome.feedalles #feedList .post > .pavatar{width:38px; height:38px}
#feedHome.feedalles #feedList .post:last-child{border-bottom:none}
#feedHome.feedalles #feedList .pmeta{row-gap:3px}
#feedHome.feedalles #feedList .pname{font-size:14px}
#feedHome.feedalles #feedList .pbody p{font-size:14px; line-height:1.5}
#feedHome.feedalles #feedList .datumscheiding{margin:10px 0 2px; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase}
#feedHome.feedalles .ouderknop{margin:14px auto 6px}
.feedleegemo{display:block; font-size:30px; margin-bottom:6px}
#feedList .feedempty b{color:var(--ink); font-size:14px}

/* Kanaalchip (#beleggen-algemeen) naast de $TICKER-chip in de feed */
.symchip.kanaalchip{color:var(--ink-2); background:var(--hl-bg); border-color:var(--line-2)}
@media (hover:hover){ .symchip.kanaalchip:hover{background:var(--card-2); color:var(--ink)} }

/* Community-badge: geverifieerd jaarrendement (MWRR) — percentage, nooit een bedrag */
.badgeplek:empty{display:none}
.lidbadge{display:inline-flex; align-items:center; gap:5px; font:700 10.5px "Archivo",sans-serif; padding:1px 6px; border-radius:5px; white-space:nowrap; font-variant-numeric:tabular-nums; line-height:1.5; vertical-align:middle}
.lidbadge.goed{background:var(--accent-wash); color:var(--good-text); border:1px solid color-mix(in srgb, var(--accent) 22%, transparent)}
.lidbadge.slecht{background:color-mix(in srgb, var(--bad) 14%, transparent); color:var(--bad-text); border:1px solid color-mix(in srgb, var(--bad) 30%, transparent)}
.lidbadge i{font:500 9.5px "IBM Plex Sans",sans-serif; font-style:normal}
.lidbadge .badgejong{color:var(--ink-3)}
.lidbadge .badgeklasse{color:var(--gold); font-weight:700; border-left:1px solid var(--line-2); padding-left:5px}
.prbadge{margin-left:8px; vertical-align:middle}
.prbadge .lidbadge{font-size:12px; padding:2px 8px; border-radius:6px}
#feedList .pmeta .lidbadge{margin-left:-2px}

/* Drawer (≡): de niet-kanaalrijen (feed, meldingen, nieuws, lidmaatschap, testomgeving, thema, uitloggen) */
.drawerrij .kopen .khash{font-size:14px; width:18px; text-align:center}
.drawerrij .kvolg{color:var(--ink-3); cursor:default; font-weight:500}
.drawerrij .kvolg.drawerteller{background:var(--bad); color:#fff; border-radius:9px; padding:1px 7px; font:700 10.5px "Archivo",sans-serif; margin-right:6px}
.drawerrij.actief .kopen{color:var(--ink); font-weight:700}
.drawermeer{border-top:1px solid var(--line); padding-top:8px}
@media (hover:hover){ .drawerrij .kopen:hover{background:var(--hl-bg); border-radius:10px} }

/* ＋ op de aandelenpagina (vervangt de inline-composer) */
.tkplusknop{width:100%; margin:0 0 12px; border-radius:999px; padding:12px 16px; font-size:14px}
.tkplusknop span{font-family:"Archivo",sans-serif; font-weight:800}

/* Tabbalk: vijf plekken, ＋ in het midden (bestaand raster); Feed-icoon iets kleiner voor balans */
.tabbar > button[data-tab="feed"] .tico{font-size:18px}
.tabbar > button[data-tab="ontdek"] .tico{font-weight:800; font-size:20px}

/* Ontdek (eerste versie) */
#screen-home[data-view="ontdek"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="ontdek"] > section.card{display:none !important}
.ontdekzoek{margin-bottom:16px}
.ontdekkop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin:6px 2px 8px}
.ontdekkop b{font:800 17px "Archivo",sans-serif; letter-spacing:-.01em}
.ontdekkop span{font-size:12px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ontdekcard{padding:4px 12px; margin-bottom:18px; border-radius:18px}
.ontdekrij{display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:10px; align-items:center; padding:11px 2px; border-top:1px solid var(--line); color:var(--ink); text-decoration:none}
.ontdekrij:first-child{border-top:none}
.ontdekrij .tktegel{width:36px; height:36px; border-radius:11px; display:grid; place-items:center; font:800 10px "Archivo",sans-serif; color:var(--accent-tekst); background:var(--accent)} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
.ontdekrij .tktegel.kanaaltegel{background:var(--card-2); color:var(--ink-2); font-size:16px}
.ontdekmid{min-width:0}
.ontdekmid b{display:block; font:700 13.5px "Archivo",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ontdekmid i{display:block; font-style:normal; font-size:11.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px}
.ontdekrechts{text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:2px}
.ontdekrechts b{font:700 13px "Archivo",sans-serif; font-variant-numeric:tabular-nums}
.ontdekrechts span{font:600 11.5px "IBM Plex Sans",sans-serif}
.ontdekrechts .up{color:var(--good-text)} .ontdekrechts .down{color:var(--bad-text)} .ontdekrechts .mut{color:var(--ink-3)}
.ontdekrechts .kdot{width:8px; height:8px; border-radius:50%; background:var(--accent); display:inline-block}
.ontdekstat{font-style:normal; font-size:11px; color:var(--ink-3); white-space:nowrap}
.ontdekmeer{display:block; margin:8px 0 10px; font-size:13px}
.ontdekonline{padding:12px 2px 6px; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px}
.ontdekonline .online{color:var(--good-text); font-weight:700; font-size:15px; font-family:"Archivo",sans-serif}
.ontdekonline .ontdekleden{font-size:13px; color:var(--ink-2)}
.ontdekonline .chartsub{flex-basis:100%; margin:4px 0 0}
@media (hover:hover){ .ontdekrij:hover{background:var(--hl-bg); margin:0 -8px; padding-left:10px; padding-right:10px; border-radius:12px} }

/* 320 px: feedkop en Ontdek blijven passen */
@media (max-width:355px){
  .feedkopknop{width:32px; height:32px; font-size:14px}
  .kanaalkop{gap:6px}
  .ontdekrechts b{font-size:12px}
}

/* v25.37 (fix bij de badge-naamregel): de v25.34-hover-inzet (.feed .post:hover{margin:0 -12px; padding:0 12px})
   verloor zijn padding van `#feedList .post{padding:2px 0}` (id-specificiteit) — een bericht werd op hover 24 px
   breder, een wrappende naamregel herliep en de paginahoogte flipte. Zelfde inzet, nu mét id-specificiteit. */
@media (hover:hover){
  #feedHome #feedList .post:not(.ann):not(.reply):hover{padding-left:12px; padding-right:12px}
}

/* v25.38 — ontdek */
/* Ontdek volledig naar het ontwerp: onderwerpen-chips, trending-lijst, horizontale rails voor
   beste beleggers en meest bezeten, watchlist-teaser, skeletons. Alles via tokens (dark + licht). */
#view-ontdek{display:flex; flex-direction:column; gap:6px}
#view-ontdek .ontdekzoek{margin-bottom:16px}
#view-ontdek .ontdekzoek input{border:1px solid var(--line); background:var(--card)}
#ontdekSub .od-online{color:var(--good-text); font-weight:600}
.od-blok{margin-bottom:16px}
.od-blok .ontdekkop{margin:0 2px 8px}
.od-chips{display:flex; flex-wrap:wrap; gap:8px}
.od-chip{appearance:none; cursor:pointer; font:600 13px "IBM Plex Sans",sans-serif; padding:9px 13px; border-radius:12px; border:1px solid var(--line); background:var(--card); color:var(--ink); display:inline-flex; gap:7px; align-items:center; transition:background .15s ease,border-color .15s ease,transform .1s ease}
.od-chip:active{transform:scale(.97)}
.od-lijst{background:var(--card); border:1px solid var(--line); border-radius:18px; padding:4px 10px; box-shadow:var(--shadow)}
.od-rij{appearance:none; cursor:pointer; text-align:left; width:100%; background:transparent; border:none; border-top:1px solid var(--line); padding:11px 2px; display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:10px; align-items:center; color:var(--ink); font:inherit; border-radius:0}
.od-rij:first-child{border-top:none}
.od-rij:active{background:var(--hl-bg)}
.od-tegel{width:36px; height:36px; border-radius:11px; display:grid; place-items:center; font:800 10px "Archivo",sans-serif; color:var(--accent-tekst); background:var(--accent); flex:none; letter-spacing:.01em} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
.od-tegel.klein{width:26px; height:26px; border-radius:8px}
.od-mid{min-width:0; display:block}
.od-mid > b{display:block; font:700 13.5px "Archivo",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.od-mid > b i{font:400 12px "IBM Plex Sans",sans-serif; font-style:normal; color:var(--ink-3)}
.od-sub{display:flex; align-items:center; gap:6px; margin-top:3px; font-size:11.5px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.od-avs{display:inline-flex; padding-left:5px; flex:none}
.od-avs i{width:16px; height:16px; border-radius:50%; border:1.5px solid var(--card); margin-left:-5px; display:block}
.od-rechts{text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:2px; flex:none}
.od-rechts b{font:700 13px "Archivo",sans-serif; font-variant-numeric:tabular-nums}
.od-dag{font:600 11.5px "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums}
.od-dag.up{color:var(--good-text)} .od-dag.down{color:var(--bad-text)} .od-dag.mut{color:var(--ink-3)}
.od-leeg{margin:10px 2px}
.od-rail{display:flex; gap:10px; overflow-x:auto; padding:2px 2px 6px; margin:0 -2px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; scrollbar-width:none}
.od-rail::-webkit-scrollbar{display:none}
.od-kaart{appearance:none; cursor:pointer; flex:none; background:var(--card); border:1px solid var(--line); border-radius:18px; color:var(--ink); font:inherit; display:flex; flex-direction:column; scroll-snap-align:start; box-shadow:var(--shadow); transition:transform .1s ease,border-color .15s ease}
.od-kaart:active{transform:scale(.98)}
.od-lid{width:150px; text-align:center; align-items:center; padding:16px 12px 12px}
.od-av{display:grid; place-items:center; width:48px; height:48px; border-radius:50%; color:var(--merk-navy); font:800 17px "Archivo",sans-serif} /* v25.52 (HUISSTIJL2): donkere letters = navy uit het logo (was groen-zwart) */
.od-naam{display:block; font:700 13px "IBM Plex Sans",sans-serif; margin-top:8px; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.od-badge{display:inline-block; margin-top:5px; font:700 12px "Archivo",sans-serif; padding:3px 8px; border-radius:6px; font-variant-numeric:tabular-nums}
.od-badge.goed{background:var(--accent-wash); color:var(--good-text)}
.od-badge.slecht{background:color-mix(in srgb, var(--bad) 14%, transparent); color:var(--bad-text)}
.od-lidsub{display:block; font-size:11px; color:var(--ink-3); margin:6px 0 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.od-klasse{display:inline-block; margin-top:4px; font:700 10.5px "Archivo",sans-serif; color:var(--gold); border:1px solid color-mix(in srgb, var(--gold) 45%, transparent); padding:1px 7px; border-radius:999px}
.od-volg{display:block; width:100%; margin-top:auto; padding-top:7px; font:600 12px "IBM Plex Sans",sans-serif; padding:7px; border-radius:999px; background:var(--accent); color:var(--accent-tekst); border:1px solid var(--accent); transition:background .15s ease,color .15s ease} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
.od-volg.aan{background:transparent; color:var(--ink-2); border-color:var(--line-2)}
.od-bezit{width:130px; text-align:left; padding:14px; align-items:stretch}
.od-bezitkop{display:flex; justify-content:space-between; align-items:center}
.od-bezitkop b{font:700 15px "Archivo",sans-serif}
.od-groot{display:block; font:800 20px "Archivo",sans-serif; margin-top:8px; font-variant-numeric:tabular-nums}
.od-bezitsub{display:block; font-size:11px; color:var(--ink-3); line-height:1.35}
.od-teaser{appearance:none; cursor:pointer; width:100%; text-align:left; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:14px 16px; display:flex; align-items:center; gap:12px; color:var(--ink-2); font:inherit; box-shadow:var(--shadow); margin-bottom:8px}
.od-teaster{font-size:22px; flex:none}
.od-teatekst{flex:1; font-size:13px; line-height:1.5; min-width:0}
.od-teatekst b{color:var(--ink)}
.od-teapijl{color:var(--ink-3); font-size:18px; flex:none}
/* Zoekresultaten: groepskoppen boven aandelen · leden · onderwerpen */
.od-drop .od-sgroep{font:600 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); padding:9px 14px 3px; background:var(--card-2)}
.od-drop .od-sres i{font-size:10px}
/* Skeletons — rustig pulserende vlakken in plaats van "laden…" */
.od-skel{pointer-events:none}
.od-skel .sk{display:block; background:var(--hl-bg); border-radius:6px; animation:od-puls 1.3s ease-in-out infinite}
.od-skel .od-tegel.sk{background:var(--hl-bg)}
.od-skel .sk-t{height:12px; width:60%; margin-bottom:7px}
.od-skel .sk-s{height:10px; width:80%}
.od-skel .sk-p{height:12px; width:52px; margin-bottom:6px}
.od-skel .sk-d{height:10px; width:36px}
.od-skel .sk-av{width:48px; height:48px; border-radius:50%; margin:0 auto 10px}
.od-bezit.od-skel .sk-av{width:26px; height:26px; border-radius:8px; margin:0 0 10px auto}
.od-lid.od-skel .sk-t,.od-lid.od-skel .sk-s{margin-left:auto; margin-right:auto}
@keyframes od-puls{0%,100%{opacity:.55}50%{opacity:1}}
@media (prefers-reduced-motion: reduce){ .od-skel .sk{animation:none} }
@media (hover:hover){
  .od-chip:hover{border-color:var(--line-2); background:var(--card-2)}
  .od-rij:hover{background:var(--hl-bg); margin:0 -8px; padding-left:10px; padding-right:10px; border-radius:12px}
  .od-rij:hover + .od-rij{border-top-color:transparent}
  .od-kaart:hover{border-color:var(--line-2)}
  .od-volg:hover{filter:brightness(1.08)}
  .od-teaser:hover{border-color:var(--line-2)}
}
@media (max-width:359px){
  .od-chip{padding:8px 10px; font-size:12px}
  .od-rechts b{font-size:12px}
  .od-avs{display:none} /* 320 px: ruimte voor "N bezitten · 💬 M" */
  .od-sub{font-size:11px}
  .od-lid{width:138px}
  .od-bezit{width:120px}
}
/* Desktop: de app is sinds v25.32 bewust één gecentreerde kolom (zelfde ontwerp op elk formaat) — de rails blijven dus horizontaal. */

/* v25.38 — profiel (Profiel-artboard uit "De Belegger Mobile v2"): ‹ naam ⋯, initiaal 64, naam + ✓ badge,
   meta, tellers, Volgen/@ Vermelden, Track record, Portefeuille (wegingen), Berichten. Tokens: dark én licht. */
.lidscherm{--lp-wash:rgba(255,255,255,.032)}
:root[data-theme="light"] .lidscherm{--lp-wash:rgba(12,24,18,.045)}
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]) .lidscherm{--lp-wash:rgba(12,24,18,.045)} }
.lidscherm .apphead.lpkop{align-items:center;gap:10px;margin-bottom:10px}
.lpkopnaam{flex:1;min-width:0;font:800 15px "Archivo",sans-serif;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.lpiconbtn{border-radius:12px;font-size:18px;line-height:1;flex:none}
#lpMenu{font-size:15px}
.lpbody{display:flex;flex-direction:column;gap:12px}
.lphead{display:flex;gap:14px;align-items:center;padding:6px 0}
.lpavatar{width:64px;height:64px;border-radius:50%;background:var(--card-2);color:var(--merk-navy);display:grid;place-items:center;font:800 24px "Archivo",sans-serif;flex:none} /* v25.52 (HUISSTIJL2): donkere letters = navy uit het logo (was groen-zwart) */
.lpinfo{flex:1;min-width:0}
.lpnaamrij{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.lpnaam{font:800 18px "Archivo",sans-serif;letter-spacing:-.01em;margin:0;line-height:1.2}
.lpbadge:empty{display:none}
.lpbadge .lidbadge{font-size:12px;padding:3px 8px;border-radius:6px}
.lpmeta{font-size:12px;color:var(--ink-3);margin-top:3px;line-height:1.4;overflow-wrap:anywhere}
.lptellers{display:flex;gap:14px;margin-top:6px;font-size:12.5px;color:var(--ink-2);flex-wrap:wrap;font-variant-numeric:tabular-nums}
.lptellers b{color:var(--ink);font-weight:700}
.lpknoppen{display:flex;gap:8px}
.lpknop{appearance:none;cursor:pointer;flex:1;min-width:0;font:600 13px "IBM Plex Sans",sans-serif;padding:11px 8px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);white-space:nowrap;transition:background .15s ease,color .15s ease,border-color .15s ease,transform .1s ease}
.lpknop:active{transform:scale(.97)}
.lpknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.lpknop.lpvolg{font-weight:700;background:var(--accent);color:var(--accent-tekst);border-color:var(--accent)} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
.lpknop.lpvolg.aan{background:transparent;color:var(--ink-2);border-color:var(--line-2)}
.lpknop.lpinst{font-weight:700}
@media (hover:hover){
  .lpknop:hover{border-color:var(--accent);color:var(--accent)}
  .lpknop.lpvolg:not(.aan):hover{color:var(--accent-tekst);filter:brightness(1.06)} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
}
.lpkaart{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px}
.lpkaartkop{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.lpkaartkop b{font:700 14px "Archivo",sans-serif;color:var(--ink)}
.lpkaartkop span{font-size:11px;color:var(--ink-3);text-align:right}
.lpleeg{font-size:12.5px;color:var(--ink-3);margin:10px 0 0;line-height:1.5}
.lptegels{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.lptegel{padding:10px 12px;border-radius:12px;background:var(--lp-wash);min-width:0}
.lptl{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.lptegel b{display:block;font:800 17px "Archivo",sans-serif;margin-top:2px;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lptegel b.goed,.lpwret.goed{color:var(--good-text)}
.lptegel b.slecht,.lpwret.slecht{color:var(--bad-text)}
.lpts{font-size:10.5px;color:var(--ink-3);margin-top:1px}
.lpgrafiek{width:100%;height:120px;margin-top:12px;display:block}
.lplegenda{display:flex;gap:14px;font-size:11.5px;color:var(--ink-2);margin-top:4px;flex-wrap:wrap;align-items:center}
.lplijn{display:inline-block;width:12px;height:3px;border-radius:2px;background:var(--good);margin-right:6px;vertical-align:middle}
.lplijn.sp{height:0;border-top:2px dashed var(--gold);background:transparent}
.lplegrechts{margin-left:auto;color:var(--ink-3)}
.lpwegingen{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.lpweging{appearance:none;cursor:pointer;text-align:left;background:transparent;border:none;padding:0;display:grid;grid-template-columns:60px 1fr 52px 56px;gap:10px;align-items:center;color:var(--ink);font:inherit;min-height:24px}
.lpweging b{font:700 12.5px "Archivo",sans-serif}
.lpbalk{height:8px;border-radius:4px;background:var(--lp-wash);overflow:hidden;display:block}
.lpbalk span{display:block;height:100%;border-radius:4px}
.lpwpct{text-align:right;font:700 12px "Archivo",sans-serif;font-variant-numeric:tabular-nums}
.lpwret{text-align:right;font:600 11.5px "IBM Plex Sans",sans-serif;font-variant-numeric:tabular-nums}
@media (hover:hover){ .lpweging:hover b{color:var(--accent)} }
.lpsectie{font:800 15px "Archivo",sans-serif;padding:4px 0 0;color:var(--ink)}
.lpfeedkaart{border-radius:18px;overflow:hidden}
.lpfeed{border-top:none;padding-top:0}
.lpfeed .post:last-child{border-bottom:none}
.lpshared .prshrow{margin-top:10px}
.lpshared .pill{margin-top:10px}
.lpfout{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:24px 0}
/* skelet bij koude start */
.lpsk{display:block;border-radius:12px;background:linear-gradient(90deg,var(--lp-wash) 25%,var(--card-2) 50%,var(--lp-wash) 75%);background-size:200% 100%;animation:lpshimmer 1.3s ease-in-out infinite}
.lpskl{height:14px;margin:6px 0}
.lpskknop{height:40px;flex:1;border-radius:999px}
.lpskkaart{border-radius:18px}
@keyframes lpshimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){ .lpsk{animation:none} }
/* 320 px: tegels blijven leesbaar, tellers mogen wikkelen, wegingsrij compacter */
@media (max-width:360px){
  .lptegels{gap:6px}
  .lptegel{padding:8px 9px}
  .lptegel b{font-size:15px}
  .lpweging{grid-template-columns:52px 1fr 44px 50px;gap:8px}
  .lpknop{font-size:12.5px;padding:10px 6px}
}
/* v25.38 — portefeuille */
/* Dashboard naar het ontwerp v2 (artboard "Portefeuille"): kop, inrichten-kaart, badge-kaart,
   inline reispad, segmenttabs onder de kaartkop, skeletons. Alleen vorm — geen cijfers. */
.dashhead .pfeyebrow{color:var(--ink-3); letter-spacing:.12em}
.dashhead .commbtn{width:36px; height:36px; padding:0; justify-content:center; border-radius:12px; gap:0}
.dashhead .commbtn .commlbl,.dashhead .commbtn .navbadge{display:none}
.dashhead .iconbtn{border-radius:12px}
.dashhead .aibtn{color:var(--accent)}

/* hero: knoppenrij → reisblok → inleg/berekening → compounding */
.hero .deltas{margin-top:12px}
.hero .reis{margin:14px 0 0; padding:12px 14px 10px; border-radius:14px}
.inlegrij{display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 6px; margin:12px 2px 0; font-size:12.5px; line-height:1.5; color:var(--ink-2)}
.inlegrij .inlegline{margin:0}
.inlegrij .inlegline[hidden],.inlegrij .rekenopen[hidden]{display:none}
.inlegrij .rekenopen{padding:0; font-size:12.5px; font-weight:600; color:var(--accent)}
.inlegrij .inlegline:not([hidden]) + .rekenopen:not([hidden])::before{content:"· "; color:var(--ink-3); font-weight:400}
.hero .compound{margin-top:6px}
.hero .compound .cmphint{display:inline; margin-left:4px; color:var(--accent)}

/* inline reispad onder de mijlpalenregel */
.reisinline{display:flex; flex-direction:column; gap:6px; margin-top:10px; padding-top:10px; border-top:1px solid color-mix(in srgb, var(--accent) 22%, transparent); cursor:default}
.reisstap{display:grid; grid-template-columns:18px 1fr auto; gap:8px; align-items:center; font-size:12.5px; color:var(--ink-2)}
.reisstap i{width:10px; height:10px; border-radius:50%; border:2px solid color-mix(in srgb, var(--accent) 50%, transparent); background:transparent}
.reisstap.af{color:var(--ink)} .reisstap.af i{background:var(--accent)}
.reisstap em{font-style:normal; font-size:11.5px; font-weight:600; color:var(--ink-3); white-space:nowrap}
.reisinlinenoot{margin:2px 0 0; font-size:11px; line-height:1.5; color:var(--ink-3)}
.reisinlinenoot .reisinlineopen{padding:0; font-size:11px; font-weight:700; color:var(--accent)}

/* Portefeuille inrichten */
.inrichtcard{padding:14px 16px; margin-bottom:16px}
.inrichtkop{display:flex; justify-content:space-between; align-items:baseline; gap:10px}
.inrichtkop b{font-family:"Archivo",sans-serif; font-size:14px}
.inrichtkop span{font-size:11.5px; color:var(--ink-3)}
.inrichtgrid{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px}
.inrichttegel{appearance:none; cursor:pointer; text-align:left; border:1px solid var(--line-2); background:var(--card-2); border-radius:14px; padding:12px; color:var(--ink); font:inherit; min-width:0}
.inrichttegel.ai{border-color:color-mix(in srgb, var(--accent) 35%, transparent); background:color-mix(in srgb, var(--accent) 8%, transparent)}
.inrichttegel .inrichticon{display:grid; place-items:center; width:32px; height:32px; border-radius:10px; background:var(--hl-bg); font-size:15px}
.inrichttegel.ai .inrichticon{background:var(--accent-verloop); color:var(--accent-tekst); font:800 15px "Archivo",sans-serif}
.inrichttegel b{display:block; font-size:13px; font-weight:700; margin-top:8px}
.inrichttegel > span:last-child{display:block; font-size:11.5px; line-height:1.4; color:var(--ink-2); margin-top:2px}
.inrichttegel:active{transform:scale(.985)}
.inrichtpills{display:flex; gap:6px; flex-wrap:wrap; margin-top:10px}
.inrichtpills .pill{font-size:11.5px; padding:6px 10px}
.inrichtpills .pill[hidden]{display:none}
@media (hover:hover){ .inrichttegel:hover{border-color:var(--accent)} }

/* Jouw badge in de community */
.badgecard{padding:14px 16px; margin-bottom:16px}
.badgekop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap}
.badgekop b{font-family:"Archivo",sans-serif; font-size:14px}
.badgekop .badgeeigen .lidbadge{font-size:12px; padding:3px 8px; border-radius:6px}
.badgeuitleg{margin:8px 0 0; font-size:12.5px; line-height:1.5; color:var(--ink-2)}
.badgeuitleg b{color:var(--ink)}
.badgeschakel{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:12px; padding-top:12px; border-top:1px solid var(--line); font-size:13px}
.badgeschakel .mut{color:var(--ink-3)}
.schakelaar{appearance:none; cursor:pointer; flex:none; width:44px; height:26px; border-radius:13px; border:none; background:var(--line-2); position:relative; padding:0; transition:background .15s}
.schakelaar span{position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.35); transition:left .15s}
.schakelaar[aria-checked="true"]{background:var(--accent)}
.schakelaar[aria-checked="true"] span{left:21px}
.schakelaar:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (prefers-reduced-motion: reduce){ .schakelaar,.schakelaar span{transition:none} }

/* segmenttabs onder de kaartkop (Verdeling, Prestatie) + ondertitel */
.segrij{padding:2px 18px 0}
.segrij .seg{width:100%}
.alloccard .cardhead,.histcard .cardhead{flex-wrap:nowrap}
.histcard .cardhead .presttwr{margin-left:auto}
.histcard .cardhead .expandbtn{flex:none}
.histcard .cardhead .grootknop{flex:none; font-size:11.5px; padding:4px 9px}
.histcard.groot .chartbox{margin-top:10px}
@media (max-width:640px){
  .donutbox{width:140px; height:140px}
  .donutbox svg{width:140px; height:140px}
  .legend{min-width:0}
}
@media (max-width:359px){ .histcard .cardhead .presttwr{display:none} }

/* skeletons: eerste beeld uit de cache, de rest schuift er stil in */
.skelet{position:relative; overflow:hidden; border-radius:10px; background:var(--hl-bg)}
.skelet::after{content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent); animation:skeletglans 1.4s infinite}
@keyframes skeletglans{to{transform:translateX(100%)}}
@media (prefers-reduced-motion: reduce){ .skelet::after{animation:none} }
.skeletgrafiek{height:150px; margin:14px 18px 8px}
#chartSkelet:not([hidden]) ~ .chartnote{display:none}
.skeletkaart{padding:16px 18px; margin-bottom:16px}
.skeletkop{height:16px; width:45%}
.skeletregel{height:12px; margin-top:12px; width:90%}
.skeletregel.kort{width:60%}
.badgeuitleg .skelettekst{display:block; height:12px; width:80%; margin-top:2px}

/* de assistent centraal: proactieve kaart direct onder de kop (aanvulling Rabi) */
.aikaart{padding:14px 16px; margin-bottom:16px; border-color:color-mix(in srgb, var(--accent) 35%, var(--line)); background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 9%, var(--card)), var(--card))}
.aikaartkop{display:flex; align-items:center; gap:12px; min-width:0}
.aiavatar{display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:12px; background:var(--accent-verloop); color:var(--accent-tekst); font:800 18px "Archivo",sans-serif}
.aikaarttekst{min-width:0}
.aikaarttekst b{display:block; font-family:"Archivo",sans-serif; font-size:15px; line-height:1.25}
.aikaarttekst span{display:block; font-size:12.5px; color:var(--ink-2); margin-top:2px}
.aitip{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; padding:9px 12px; border-radius:12px; background:var(--hl-bg); font-size:12.5px; color:var(--ink)}
.aitip .pill{flex:none; border-color:var(--accent); color:var(--accent)}
.aichips{display:flex; gap:6px; flex-wrap:wrap; margin-top:10px}
.aichips .aichip{font-size:12px; padding:6px 11px; color:var(--ink)}
.aichips.aileeg{gap:8px}
.aikaartbtn{width:auto; margin-top:0; padding:10px 16px; font-size:13.5px}
@media (hover:hover){ .aichips .aichip:hover{border-color:var(--accent); color:var(--accent)} }
/* 320 px: de kop-knoppen compacter en de eyebrow nooit onder de knoppen door */
.dashhead .pfeyebrow{display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
@media (max-width:379px){
  .dashhead .headright{gap:6px}
  .dashhead .commbtn,.dashhead .iconbtn{width:32px; height:32px; font-size:14px}
}
/* smal scherm: de TWR-ondertitel onder de titel "Prestatie", de groter/kleiner-knop blijft op de titelregel */
@media (max-width:480px){
  .histcard .cardhead{flex-wrap:wrap}
  .histcard .cardhead .presttwr{flex-basis:100%; order:3; margin:-4px 0 0}
  .histcard .cardhead .grootknop{margin-left:auto}
}
/* v25.38 — ticker */
/* $TICKER-pagina volgens het design: kop (‹ · $TICKER naam · bezitters/online · ☆ · volgknop · ⌕),
   koerskaart met sparkline, statistiekenrij, Leden-GAK-rij, segmenttabs, berichtkaarten, ledenlijst,
   skeletons. Alles via de thematokens (dark + licht), hover alleen bij (hover:hover), 320 px bruikbaar. */
.tickerscreen .apphead.tkkop{align-items:center; gap:8px; margin-bottom:12px; flex-wrap:nowrap}
.tkkop .tklogo{width:36px; height:36px; border-radius:11px; font-size:15px}
.tkkop .tkid{flex:1; min-width:0; gap:0}
.tkkop .tkidnaam{display:flex; align-items:baseline; gap:6px; min-width:0; white-space:nowrap; overflow:hidden}
.tkkop .tkidnaam b{font-family:"Archivo",sans-serif; font-weight:800; font-size:17px; letter-spacing:-.01em; flex:none}
.tkkop .tkidnaam b::before{content:"$"}
.tkkop .tkidnaam > span{font-size:13px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; min-width:0}
.tksub{appearance:none; background:none; border:none; padding:0; margin:0; font:inherit; font-size:12px; color:var(--ink-3); cursor:pointer; text-align:left; display:flex; gap:8px; align-items:center; min-height:16px; max-width:100%; white-space:nowrap; overflow:hidden}
.tksub > span:first-child{overflow:hidden; text-overflow:ellipsis}
.tksub .tkmsgs{padding:1px 8px; font-size:11px}
.tkkop .wlbtn{margin:0; width:36px; height:36px; padding:0; border-radius:12px; font-size:17px; display:grid; place-items:center; flex:none; border:1px solid var(--line-2); color:var(--gold); background:var(--card); box-shadow:none}
.tkkop .wlbtn .wltxt{display:none}
.tkkop .wlbtn.on{background:rgba(217,179,107,.14); color:var(--gold); border-color:rgba(217,179,107,.45); box-shadow:none}
.tkkop .volgknop{padding:7px 10px}
.tkkop .volgknop .vkort{display:none}
.tkacties{display:flex; align-items:center; gap:8px; flex:none; margin-left:auto}
.tkzoekknop{flex:none}
/* Smal (≤ 419 px): geen logo in de kop, korte volgtekst; past het nog niet, dan zakt de actierij naar een tweede regel (rechts). */
@media (max-width:419px){
  .tickerscreen .apphead.tkkop{flex-wrap:wrap}
  .tkkop .tklogo{display:none}
  .tkkop .tkid{flex:1 1 150px}
  .tkkop .volgknop .vlang{display:none}
  .tkkop .volgknop .vkort{display:inline}
}
.tkzoekvak{margin:-4px 0 12px}
@media (hover:hover){
  .tkkop .wlbtn:hover{background:rgba(217,179,107,.12)}
  .tksub:hover{color:var(--ink-2)}
}
@media (min-width:720px){
  .tkzoekknop{display:none}
  .tkzoekvak[hidden]{display:block !important}
}
/* Koerskaart */
.tkc.tkhead{flex-direction:column; align-items:stretch; gap:8px; padding:16px 18px 14px; border-top:none}
.tkkoersrij{display:flex; justify-content:space-between; align-items:flex-start; gap:12px}
.tkkoersrij .tkbig{flex-direction:column; align-items:flex-start; gap:2px; min-width:0}
.tkkoersrij .tkbig b{font-size:34px; line-height:1.05}
.tkdagrij{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.tkdagrij .pday{font-size:13.5px; font-weight:700; font-family:"Archivo",sans-serif}
.tkdagrij .tkmeta{font-size:11.5px; color:var(--ink-3); display:flex; flex-wrap:wrap; gap:0 8px}
.tkmeta .tksector{opacity:.85}
.tkspark{width:120px; height:44px; flex:none; color:var(--ink-3); margin-top:4px}
.tkspark.up{color:var(--good)} .tkspark.down{color:var(--bad)}
.tkspark:empty{visibility:hidden}
.tkpillen{gap:8px}
.tkpillen:not(:has(:not([hidden]))){display:none}
@media (max-width:380px){ .tkkoersrij .tkbig b{font-size:30px} .tkspark{width:92px; height:36px} }
/* Statistiekenrij: Waarde · Aantal · GAK · Winst (alleen voor jou) */
.tkc.tkposline{flex-direction:column; align-items:stretch; gap:8px; padding:12px 18px}
.tkstatrij{display:grid; grid-template-columns:repeat(4,1fr); gap:6px 8px}
.tkpst{display:flex; flex-direction:column; gap:2px; min-width:0}
.tkpst .slbl{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.tkpst b{font-family:"Archivo",sans-serif; font-weight:700; font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink)}
.tkpst b.kpos{color:var(--good-text)} .tkpst b.kneg{color:var(--bad-text)}
.tkposline .poslbl{font-size:11px; letter-spacing:0; text-transform:none; font-weight:500}
@media (max-width:380px){ .tkstatrij{grid-template-columns:1fr 1fr} }
/* Ledenstatistiek: Leden-GAK · In de plus · Weging */
.tkledenrij{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; padding:12px 18px}
.tkledenrij > div{display:flex; flex-direction:column; gap:1px; min-width:0}
.tkledenrij .slbl{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.tkledenrij b{font-family:"Archivo",sans-serif; font-weight:700; font-size:13px; font-variant-numeric:tabular-nums; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tkledenrij b.kpos{color:var(--good-text)}
.tkledenrij .ssub{font-size:10.5px; color:var(--ink-3)}
.tkledenleeg{padding:10px 18px; font-size:12px; color:var(--ink-3)}
/* Segmenttabs: Berichten · Koers · Kerncijfers · Leden */
.tkc.tkviewbar{padding:10px 14px; border-top:1px solid var(--line)}
.tktabs{width:100%; border-radius:12px}
.tkviewbar .tktabs button{flex:1; text-align:center; padding:8px 3px; font-size:12.5px; border-radius:9px; white-space:nowrap; min-width:0; overflow:hidden; text-overflow:ellipsis}
#tkLedenTel{font-weight:500; color:var(--ink-3); margin-left:2px}
@media (max-width:419px){ #tkLedenTel{display:none} } /* het aantal staat al in de kop ("412 leden bezitten") */
@media (max-width:360px){ .tkviewbar .tktabs button{font-size:11.5px; padding:8px 2px} }
/* Tab Berichten: filterchips, berichtkaarten, "Tik op ＋" */
.tkfeedcard{padding:10px 14px 12px}
.tkfilters{display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding:2px 0 8px}
.tkfilters::-webkit-scrollbar{display:none}
.tkfilters button{appearance:none; cursor:pointer; flex:none; font:600 12px "IBM Plex Sans",sans-serif; padding:6px 11px; border-radius:999px; border:1px solid var(--line-2); background:transparent; color:var(--ink-2)}
.tkfilters button.on{border-color:var(--accent-lijn); background:var(--accent-wash); color:var(--ink)} /* v25.52 (HUISSTIJL2): rand uit het accent (was groen) */
.tkfilters button:focus-visible{outline:2px solid var(--accent)}
.tkfeed{padding:0; gap:8px}
.tkfeed .post{background:var(--stat-bg); border:1px solid var(--line); border-radius:16px; padding:12px}
.tkfeed .post[hidden]{display:none !important}
.tkfeed .feedempty{padding:10px 4px}
.tkplusknop{appearance:none; cursor:pointer; width:100%; background:transparent; border:none; color:var(--ink-3); font:inherit; font-size:12px; padding:10px 0 2px; text-align:center}
.tkplusknop:focus-visible{outline:2px solid var(--accent); border-radius:8px}
@media (hover:hover){ .tkplusknop:hover{color:var(--accent)} }
.bezittag{display:inline-flex; align-items:center; font:600 10.5px "IBM Plex Sans",sans-serif; padding:1px 6px; border-radius:5px; background:rgba(217,179,107,.14); color:var(--gold); white-space:nowrap; vertical-align:middle}
/* Tab Koers: alleen de periodeknoppen in de kaartkop */
#tkChartCard .cardhead{padding-top:12px}
/* Tab Leden: bezitters (schuilnaam + badge) */
.tkledencard{padding:6px 14px 4px}
.tkledenlijst{display:flex; flex-direction:column}
.tkldrij{appearance:none; cursor:pointer; width:100%; text-align:left; background:transparent; border:none; border-top:1px solid var(--line); padding:10px 4px; display:grid; grid-template-columns:32px 1fr auto; gap:10px; align-items:center; color:var(--ink); font:inherit; border-radius:10px}
.tkldrij:first-child{border-top:none}
.tkldrij .pavatar.sm{width:32px; height:32px; font-size:13px; overflow:hidden}
.tkldrij .pavatar svg{width:100%; height:100%}
.tkldrij .tkldnaam{font-size:13px; font-weight:600; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.tkldrij .tkldgeen{font-size:11px; color:var(--ink-3)}
.tkldrij:focus-visible{outline:2px solid var(--accent)}
@media (hover:hover){ .tkldrij:hover{background:var(--hl-bg)} }
.tkledencard .chartsub{text-align:center; margin:8px 4px 10px}
/* Skeletons (eerste beeld zonder netwerk) */
.tkskel{display:inline-block; height:.9em; min-width:3em; border-radius:6px; background:linear-gradient(90deg,var(--stat-bg) 0%,var(--hl-bg) 50%,var(--stat-bg) 100%); background-size:200% 100%; animation:tkskel 1.3s ease-in-out infinite; vertical-align:middle}
.tkskel-naam{width:120px; height:.85em} .tkskel-koers{width:130px; height:.8em} .tkskel-meta{width:150px; height:.9em} .tkskel-sub{width:170px; height:.9em}
.tkskel-cijfer{width:64px; height:13px}
.tkskel-av{width:32px; height:32px; min-width:0; border-radius:50%; flex:none}
.tkskel-regel{width:100%; height:10px; min-width:0} .tkskel-regel.kort{width:60%}
.tkskelrij{display:flex; gap:10px; padding:10px 0; align-items:flex-start}
.tkskelkolom{display:flex; flex-direction:column; gap:6px; flex:1; min-width:0}
@keyframes tkskel{0%{background-position:200% 0} 100%{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){ .tkskel{animation:none} }

/* =====================================================
   v25.38 — feed (Community v2 naar het ontwerp "De Belegger Mobile v2"):
   feedkop ≡ · titel › · 🔔 · ✦, tabs Voor jou · Mijn aandelen · Volgend, daglabels, berichtkaart
   (initiaal-avatar, naam, badge, tijd, onderwerp, vette titel + tekst, positiekaart, portefeuillekaart,
   reactierij, ↩ N antwoorden), redactiekaart (REDACTIE · Nieuws/Column · Lees ›), lege staat, skeleton,
   drawer (kop, zoekveld, groepen met hint, rijen, voettekst) en compose met onderwerp-chips.
   Alles "accent/primary" via de thema-tokens (geen hard-coded groen); groen/rood alleen voor plus/min.
   Hover alleen in (hover:hover); vaste hoogtes voor avatar en badge (geen layout-verschuiving).
   ============================================================ */

/* Feedkop: ≡ met ongelezen-stip · titel 800/16 + sub 11 · 🔔 met rode teller · ✦ */
#feedHome .kanaalkop{padding:max(4px, env(safe-area-inset-top)) 18px 0; gap:10px; border-bottom:none; margin-bottom:6px; flex-wrap:wrap}
#feedHome .paneelknop,#feedHome .feedkopknop{width:36px; height:36px; border-radius:12px; background:var(--card); border:1px solid var(--line-2); color:var(--ink-2); font-size:15px; position:relative; flex:none}
#feedHome .paneelknop{font-size:17px}
#feedHome .feedkopknop.feedai{color:var(--accent)}
.menudot{position:absolute; top:-3px; right:-3px; width:9px; height:9px; border-radius:50%; background:var(--accent); border:2px solid var(--ground); pointer-events:none}
.menudot[hidden]{display:none}
#feedHome .feedkopknop .notifdot{top:-5px; right:-5px; min-width:16px; height:16px; border-radius:8px; background:var(--bad); font:700 10px/16px "Archivo",sans-serif; padding:0 4px}
#feedHome .kanaalnaam b{font:800 16px "Archivo",sans-serif; letter-spacing:-.01em; gap:5px}
#feedHome .kanaalnaam .kpijl{font-size:12px}
#feedHome .kanaalsub{font-size:11px; font-variant-numeric:tabular-nums}
#feedHome .volgknop{font-size:11.5px; padding:6px 10px}

/* Tabs onder de kop (ontwerp): 600/14, actieve tab ink met 2 px accent-onderstreping — wisselen is puur client-side */
.feedtabs{display:flex; gap:4px; flex-basis:100%; margin:2px 0 0; padding:0; border-bottom:1px solid var(--line)}
#feedHome .kanaalkop > .feedtabs[hidden]{display:none}
#feedHome .kanaalkop:has(.feedtabs[hidden]){padding-bottom:8px}
.feedtabs[hidden]{display:none}
.feedtabs button{appearance:none; cursor:pointer; background:transparent; border:none; flex:1; padding:8px 0 10px; font:600 14px "IBM Plex Sans",sans-serif; color:var(--ink-2); border-bottom:2px solid transparent; margin-bottom:-1px; white-space:nowrap}
.feedtabs button.on{color:var(--ink); border-bottom-color:var(--accent)}
@media (hover:hover){ .feedtabs button:hover{color:var(--ink)} }

/* Daglabels: VANDAAG · GISTEREN · WO 2 SEP */
#feedHome #feedList .datumscheiding{margin:12px 0 2px; font:600 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); gap:10px}
#feedHome #feedList .datumscheiding::before,#feedHome #feedList .datumscheiding::after{background:var(--line)}

/* Berichtkaart: geen kaartrand, één dunne scheidslijn, avatar 38 + tekstkolom */
#feedHome #feedList .post.fkaart{display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px; align-items:start; margin:0; padding:10px 0 6px; border-bottom:1px solid var(--line); background:transparent; border-radius:0; border-left:none}
#feedHome #feedList .post.fkaart:last-child{border-bottom:none}
#feedHome #feedList .post.fkaart.ann{background:transparent; border:none; border-bottom:1px solid var(--line); border-radius:0; padding:10px 0 6px; margin:0}
#feedHome #feedList .post.fkaart.ann:last-child{border-bottom:none}
#feedHome #feedList .post.fkaart.genoemd{border-left:2px solid var(--gold); padding-left:8px; margin-left:-8px; border-radius:0 10px 10px 0}
@media (hover:hover){
  #feedHome #feedList .post.fkaart:not(.ann):not(.reply):hover{margin:0; padding-left:0; padding-right:0; background:transparent; border-radius:0}
  #feedHome #feedList .post.fkaart.genoemd:hover{padding-left:8px; margin-left:-8px}
}
.pavatar.init{width:38px; height:38px; min-width:38px; border-radius:50%; background:var(--card-2); color:var(--merk-navy); display:grid; place-items:center; font:800 13px "Archivo",sans-serif; position:relative; overflow:visible; text-decoration:none; cursor:pointer; flex:none} /* v25.52 (HUISSTIJL2): donkere letters = navy uit het logo (was groen-zwart) */
.pavatar.init.mijn{background:var(--accent); color:var(--ground)}
.pavatar.init.xs{width:20px; height:20px; min-width:20px; border-radius:7px; font-size:9px}
.pavatar.init .onlinestip{position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border-radius:50%; background:var(--good); border:2px solid var(--ground)}
#feedHome #feedList .fkaart .pmeta{display:flex; align-items:baseline; gap:6px; row-gap:2px; flex-wrap:wrap; font-size:11px; color:var(--ink-3); min-height:21px}
#feedHome #feedList .fkaart .pname{font:700 14px "IBM Plex Sans",sans-serif; color:var(--ink); text-decoration:none}
#feedHome #feedList .fkaart .pname.mijn{color:var(--accent)}
#feedHome #feedList .fkaart .pname.redactie{color:var(--gold)}
#feedHome #feedList .fkaart .ptijd{font-size:11px; color:var(--ink-3); white-space:nowrap}
#feedHome #feedList .fkaart .badgeplek{display:inline-flex; height:18px; align-items:center}
#feedHome #feedList .fkaart .badgeplek:empty{display:none}
#feedHome #feedList .fkaart .lidbadge{margin-left:0; height:18px; line-height:16px; padding:0 6px}
.lidbadge .badgeklasse{border-left:none; padding-left:0}
.lidbadge .badgeklasse::before{content:"· "; color:inherit; opacity:.8}
.redactiebadge{display:inline-flex; align-items:center; height:18px; padding:0 6px; border-radius:5px; background:var(--gold); color:var(--merk-navy); font:700 10px "Archivo",sans-serif; letter-spacing:.06em} /* v25.52 (HUISSTIJL2): donkere letters = navy uit het logo (was groen-zwart) */
.ponderwerp{font:600 10.5px "IBM Plex Sans",sans-serif; white-space:nowrap}
.ponderwerp.ow-analyse{color:var(--bench-aex)}
.ponderwerp.ow-resultaat{color:var(--good-text)}
.ponderwerp.ow-transactie{color:var(--accent)}
.ponderwerp.ow-vraag,.ponderwerp.ow-dividend,.ponderwerp.ow-column{color:var(--gold)}
.ponderwerp.ow-discussie{color:#8B7CF6}
.ponderwerp.ow-nieuws{color:var(--ink-2)}
#feedHome #feedList .fkaart .symchip{display:inline-flex; align-items:center; gap:5px; margin:0; font:700 11px "Archivo",sans-serif; padding:0 7px; height:18px; border-radius:999px; background:var(--hl-bg); border:1px solid var(--line); color:var(--ink); text-decoration:none}
#feedHome #feedList .fkaart .symchip i{width:7px; height:7px; border-radius:50%; display:inline-block; flex:none}
#feedHome #feedList .fkaart .symchip.kanaalchip{font:600 10.5px "IBM Plex Sans",sans-serif; color:#8B7CF6; background:transparent; border:none; padding:0; height:auto}
#feedHome #feedList .fkaart .bewerkt{font-size:10.5px; font-style:italic; color:var(--ink-3)}
#feedHome #feedList .fkaart .pinbadge{border:none; padding:0; font-size:11px}
#feedHome #feedList .fkaart .replytag{height:16px; line-height:14px; padding:0 6px}
/* Echte naam (alleen beheerders): klein grijs ⓘ met de naam als tooltip — niet als opvallende chip */
#feedHome #feedList .fkaart .realname{border:none; background:transparent; color:var(--ink-3); font-size:11px; padding:0; cursor:help}
.srtekst{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
/* "±X% sinds dit bericht": klein grijs meta-element in de naamregel, alleen het getal gekleurd */
#feedHome #feedList .fkaart .pmeta .sinceline{display:inline; margin:0; padding:0; border:none; background:transparent; font:500 10.5px "IBM Plex Sans",sans-serif; color:var(--ink-3); white-space:nowrap}
#feedHome #feedList .fkaart .pmeta .sinceline b{font:700 10.5px "Archivo",sans-serif}
#feedHome #feedList .fkaart .pmeta .sinceline.up b{color:var(--good-text)} #feedHome #feedList .fkaart .pmeta .sinceline.down b{color:var(--bad-text)}
#feedHome #feedList .fkaart .replyctx{margin:2px 0 2px}
#feedHome #feedList .fkaart .ptitel{margin:2px 0 0; font:700 14px/1.4 "IBM Plex Sans",sans-serif; color:var(--ink); overflow-wrap:anywhere}
#feedHome #feedList .fkaart .pbody > p{margin:1px 0 0; font-size:14px; line-height:1.5; color:color-mix(in srgb, var(--ink) 88%, var(--ink-2)); overflow-wrap:anywhere}
#feedHome #feedList .fkaart .pbody > p.jumbo{font-size:40px; line-height:1.2}
@supports not (color:color-mix(in srgb, red 50%, blue)){ #feedHome #feedList .fkaart .pbody > p{color:var(--ink)} }

/* Redactiekaart: samenvatting max 2 regels, $tickers + "Lees ›" */
#feedHome #feedList .redactiekaart .samenvatting{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
#feedHome #feedList .redactiekaart .leesrij{display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:8px}
.leesknop{appearance:none; cursor:pointer; margin-left:auto; font:700 12.5px "IBM Plex Sans",sans-serif; padding:6px 12px; border-radius:999px; border:1px solid var(--line-2); background:var(--card); color:var(--accent)}
@media (hover:hover){ .leesknop:hover{background:var(--accent); color:var(--ground); border-color:var(--accent)} }

/* Positiekaart: tegel · Positie van … / Jouw positie · weging · rendement "totaal" */
.positiekaart{display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:10px; align-items:center; margin-top:8px; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:11px 12px; color:var(--ink); text-decoration:none}
.positiekaart .tktegel{width:34px; height:34px; border-radius:10px; display:grid; place-items:center; font:800 10px "Archivo",sans-serif; color:var(--accent-tekst); background:var(--accent)} /* v25.52 (HUISSTIJL2): tekst op accent = --accent-tekst (was groen-zwart, 3,4:1 op het lichte accent) */
.positiekaart .posmid{min-width:0}
.positiekaart .posmid b{display:block; font:600 13px "IBM Plex Sans",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.positiekaart .posmid i{display:block; font-style:normal; font-size:11.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.positiekaart .posrechts{text-align:right}
.positiekaart .posrechts b{display:block; font:700 14px "Archivo",sans-serif; font-variant-numeric:tabular-nums}
.positiekaart .posrechts b.up{color:var(--good-text)} .positiekaart .posrechts b.down{color:var(--bad-text)}
.positiekaart .posrechts i{display:block; font-style:normal; font-size:11px; color:var(--ink-3)}
@media (hover:hover){ .positiekaart:hover{border-color:var(--line-2); background:var(--card-2)} }

/* Portefeuillekaart (bijlage): 📈 Portefeuille van … · N posities · gedeeld · cijfers · wegingsbalk */
.pfbijlage.pfkaart{appearance:none; cursor:pointer; display:block; width:100%; text-align:left; margin-top:10px; padding:12px; border-radius:14px; background:var(--card); border:1px solid var(--line); color:var(--ink); font:inherit}
.pfkaart .pfkop{display:flex; justify-content:space-between; align-items:baseline; gap:8px}
.pfkaart .pfkop b{font:600 13px "IBM Plex Sans",sans-serif; color:var(--ink)}
.pfkaart .pfkop i{font-style:normal; font-size:11px; color:var(--ink-3); white-space:nowrap}
.pfkaart .pfcijfers{display:flex; gap:14px; margin-top:8px; flex-wrap:wrap}
.pfkaart .pfcijfers b{display:block; font:800 18px "Archivo",sans-serif; color:var(--ink); font-variant-numeric:tabular-nums}
.pfkaart .pfcijfers b.goed{color:var(--good-text)} .pfkaart .pfcijfers b.slecht{color:var(--bad-text)}
.pfkaart .pfcijfers i{font-style:normal; font-size:10.5px; color:var(--ink-3)}
.pfkaart .pfbalk{display:flex; height:6px; border-radius:3px; overflow:hidden; margin-top:10px; gap:2px; background:var(--hl-bg)}
.pfkaart .pfbalk i{display:block; height:100%}
@media (hover:hover){ .pfbijlage.pfkaart:hover{border-color:var(--line-2); background:var(--card-2)} }

/* Reactierij: emoji-pills + "↩ N antwoorden" + 🙂 + ⋯ — altijd zichtbaar, ook op muis-apparaten */
.reactiewrap{display:flex; flex-wrap:wrap; gap:5px; align-items:center; margin-top:6px; min-height:24px}
.reactiewrap .reactierij{margin:0; gap:5px}
.reactiewrap .reactierij.leeg{display:none}
.reactiewrap .reactieplus{display:none}
.reactiewrap .reactiekies{flex-basis:100%; order:9; margin-top:4px}
#feedHome #feedList .fkaart .reactiechip{font:600 11.5px "IBM Plex Sans",sans-serif; padding:3px 8px; border-radius:7px; border:1px solid var(--line-2); background:var(--stat-bg); color:var(--ink)}
#feedHome #feedList .fkaart .reactiechip.mijn{border-color:color-mix(in srgb, var(--accent) 55%, transparent); background:var(--accent-wash)}
#feedHome #feedList .fkaart .hovacts{display:flex; position:static; margin:0; padding:0; gap:2px; background:transparent; border:none; box-shadow:none}
#feedHome #feedList .fkaart .hovacts button{width:26px; height:24px; border-radius:7px; font-size:13px; color:var(--ink-3); opacity:1}
#feedHome #feedList .fkaart .hovacts button.antwoorden{width:auto; height:auto; padding:3px 8px; font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--ink-2); line-height:1.5; white-space:nowrap}
@media (hover:hover){
  #feedHome #feedList .fkaart .hovacts button:hover{background:var(--hl-bg); color:var(--ink)}
}
#feedHome #feedList .fkaart .qpost .sinceline{margin-top:8px}

/* Lege staat en skeleton */
#feedHome #feedList .feedempty{padding:40px 32px; text-align:center; font-size:12.5px; line-height:1.5; color:var(--ink-3)}
#feedHome #feedList .feedempty b{display:block; margin:8px 0 4px; font:700 14px "IBM Plex Sans",sans-serif; color:var(--ink)}
#feedHome #feedList .feedempty .feedleegemo{margin:0}
.feedskeletten{display:flex; flex-direction:column}
.feedskelet{display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px; padding:12px 0; border-bottom:1px solid var(--line)}
.feedskelet .skav{width:38px; height:38px; border-radius:50%; background:var(--hl-bg)}
.feedskelet .skb{display:flex; flex-direction:column; gap:8px; padding-top:5px}
.feedskelet .skb i{display:block; height:11px; border-radius:6px; background:var(--hl-bg); animation:skpuls 1.2s ease-in-out infinite}
.feedskelet .skb i:first-child{height:13px}
@keyframes skpuls{0%,100%{opacity:.55}50%{opacity:1}}
@media (prefers-reduced-motion: reduce){ .feedskelet .skb i{animation:none} }

/* Drawer (≡): kop, zoekveld, groepen met hint, rijen (prefix · naam · 🔒 · ● online · tag), voettekst */
#kanaalPaneel .paneelvlak{width:var(--cdk-paneel-b, min(318px, 88vw))} /* v25.53 (COMMUNITY-DISCORD, B5): de breedte als variabele zodat de staart COMMUNITY-KANALEN op ≥ 1180 px 240 px kan zetten zonder id-selector; zonder variabele byte-gelijk gedrag */
#kanaalPaneel .paneelkop{padding:max(14px, env(safe-area-inset-top)) 14px 0; border-bottom:none}
#kanaalPaneel .paneeltitel b{font:800 15px "Archivo",sans-serif}
#kanaalPaneel .paneeltitel span{font-size:11px}
#kanaalPaneel .paneeltitel .online{color:var(--ink-3)}
#kanaalPaneel .paneeltitel .online::first-letter{color:var(--accent)}
#kanaalPaneel #kanaalPaneelSluit{border:none; background:transparent; color:var(--ink-2); font-size:16px; width:32px; height:32px}
#kanaalPaneel .paneelzoek{margin:10px 0 8px}
#kanaalPaneel .paneelzoek input{height:38px; border-radius:12px; font-size:13px; background:var(--card); border:1px solid var(--line); padding-left:34px}
@media (pointer:coarse){ #kanaalPaneel .paneelzoek input{font-size:16px} } /* v25.52 (feedbackronde 6-9, FB-E TABBALK-ZOOM, [lid-77]): op een aanraakscherm minimaal 16 px zodat Safari niet inzoomt bij focus — een id-regel wint van de generieke aanraakregel onderaan, daarom hier op de eigen regel */
#kanaalPaneel .paneelzoek .sicon{font-size:15px; left:12px}
#kanaalPaneel .paneelgroepen{padding:0 8px 20px; gap:14px}
#kanaalPaneel .pgroep .pgkop{padding:0 8px 4px; font:600 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.12em; text-transform:uppercase; align-items:baseline}
#kanaalPaneel .pgroep .pghint{font-weight:500; opacity:1}
#kanaalPaneel .krij{grid-template-columns:minmax(0,1fr) auto auto; gap:8px; border-radius:10px; position:relative}
#kanaalPaneel .krij.actief{background:var(--hl-bg)}
#kanaalPaneel .krij .kopen{padding:8px 8px; gap:8px; font:500 13.5px "IBM Plex Sans",sans-serif; color:var(--ink-2)}
#kanaalPaneel .krij.actief .kopen,#kanaalPaneel .krij.ongelezen .kopen{color:var(--ink); font-weight:700}
#kanaalPaneel .krij .kopen .khash{font:600 14px "Archivo",sans-serif; width:auto; min-width:16px; text-align:center; color:var(--ink-3)}
#kanaalPaneel .krij .kopen .kslot{font-size:10px}
#kanaalPaneel .krij .kopen .kdot{display:none}
#kanaalPaneel .krij.ongelezen::before{content:""; position:absolute; left:-8px; top:13px; width:4px; height:14px; border-radius:0 3px 3px 0; background:var(--ink)}
#kanaalPaneel .krij .konline{font:600 11px "IBM Plex Sans",sans-serif; color:var(--accent)}
#kanaalPaneel .krij .kvolg{font:600 11px "IBM Plex Sans",sans-serif; padding:3px 6px; border-radius:6px; margin-right:2px}
#kanaalPaneel .krij .kvolg.vauto{color:var(--accent)}
#kanaalPaneel .krij .kvolg.vaan{color:var(--ink-3)}
#kanaalPaneel .krij .kvolg.vuit{color:var(--ground); background:var(--accent)}
#kanaalPaneel .drawerrij .kvolg{color:var(--ink-3)}
#kanaalPaneel .drawerrij .kvolg.drawerteller{color:#fff}
#kanaalPaneel .krij .kopen.kanaalnieuw .khash{color:var(--accent)}
#kanaalPaneel .drawermeer{border-top:1px solid var(--line); padding-top:8px}
#kanaalPaneel .paneelvoet{padding:10px 14px calc(22px + env(safe-area-inset-bottom)); gap:10px}
#kanaalPaneel .paneelvoet .pavatar.init{width:32px; height:32px; min-width:32px; font-size:12px}
#kanaalPaneel .paneelvoet .pavatar.init .onlinestip{width:9px; height:9px; border-color:var(--seg-bg)}
#kanaalPaneel .paneelwie b{display:flex; align-items:center; gap:6px; flex-wrap:wrap; font:700 13px "IBM Plex Sans",sans-serif}
#kanaalPaneel .paneelwie #paneelMeta{font-size:11px; color:var(--ink-3)}
#kanaalPaneel .paneelinstel{width:32px; height:32px; border:none; background:transparent; color:var(--ink-2); font-size:15px; flex:none}
@media (hover:hover){ #kanaalPaneel .krij:hover{background:var(--hl-bg)} #kanaalPaneel .paneelinstel:hover{color:var(--ink)} }

/* Compose (＋): greep · Annuleren · onderwerp-chips · Plaatsen · avatar + tekstvak · chips · werkbalk */
#composeSheet .composevlak{padding:10px 16px calc(26px + env(safe-area-inset-bottom)); border-radius:22px 22px 0 0; border-top:1px solid var(--line-2)}
#composeSheet .composevlak::before{width:36px; background:var(--line-2); margin:0 auto 12px}
#composeSheet .composetop{gap:8px}
#composeSheet .composeannuleer{font:600 14px "IBM Plex Sans",sans-serif; color:var(--ink-2); flex:none}
.composeonderwerp{display:flex; gap:2px; background:var(--seg-bg); border-radius:10px; padding:3px; min-width:0; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch}
.composeonderwerp::-webkit-scrollbar{display:none}
.composeonderwerp[hidden]{display:none}
.composeonderwerp button{appearance:none; cursor:pointer; border:none; font:600 11.5px "IBM Plex Sans",sans-serif; padding:5px 9px; border-radius:7px; color:var(--ink-2); background:transparent; white-space:nowrap; flex:none}
.composeonderwerp button.on{color:var(--ink); background:var(--card-2)}
#composeSheet .postbtn{font:700 13px "IBM Plex Sans",sans-serif; padding:8px 14px; border-radius:999px; flex:none}
#composeSheet .composevlak .composer{display:grid; grid-template-columns:40px minmax(0,1fr); gap:10px; margin-top:12px; padding:0; align-items:start}
#composeSheet #meAvatar.init{width:40px; height:40px; min-width:40px; font-size:14px}
#composeSheet .composevlak textarea{font-size:16px; line-height:1.5; min-height:110px; padding:8px 0 0}
#composeSheet .composevlak .xcomposer:focus-within{box-shadow:none}
#composeSheet .composesuggest{flex-direction:row; flex-wrap:wrap; gap:6px; background:transparent; border:none; padding:0; margin:4px 0 0 50px; max-height:none}
#composeSheet .composesuggest button{font:700 12px "Archivo",sans-serif; padding:6px 10px; border-radius:999px; border:1px solid var(--line-2); background:var(--card-2); color:var(--ink); display:flex; gap:6px; align-items:center}
#composeSheet .composesuggest button span{font:400 11px "IBM Plex Sans",sans-serif; color:var(--ink-3); max-width:130px}
#composeSheet .composereply{margin-top:10px}
#composeSheet .composebijlage{margin:8px 0 0 50px; border-radius:12px; font-size:12.5px}
#composeSheet .composeacties{margin-top:10px; padding:0 0 0 50px; border-top:none; gap:6px}
.composeknop{appearance:none; cursor:pointer; font:600 12px "IBM Plex Sans",sans-serif; padding:7px 10px; border-radius:999px; border:1px solid var(--line-2); background:transparent; color:var(--ink-2); white-space:nowrap; line-height:1.2}
.composeknop.composekanaal{max-width:44%; overflow:hidden; text-overflow:ellipsis}
#composeSheet .composeteller{margin-left:auto; font-size:11px}
#composeSheet .annlbl{font-size:12px; color:var(--ink-2); white-space:nowrap}
@media (hover:hover){ .composeknop:hover{color:var(--ink); border-color:var(--ink-3)} .composeonderwerp button:hover{color:var(--ink)} }

/* Licht thema: het discussie-paars iets dieper voor contrast op wit */
:root[data-theme="light"] .ponderwerp.ow-discussie,:root[data-theme="light"] #feedHome #feedList .fkaart .symchip.kanaalchip{color:#6B5BD6}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]) .ponderwerp.ow-discussie,:root:not([data-theme="dark"]) #feedHome #feedList .fkaart .symchip.kanaalchip{color:#6B5BD6}
}

/* 320 px: alles blijft passen */
@media (max-width:355px){
  #feedHome .paneelknop,#feedHome .feedkopknop{width:32px; height:32px; font-size:14px}
  #feedHome .kanaalnaam b{font-size:15px}
  .feedtabs button{font-size:13px}
  #composeSheet .composeacties,#composeSheet .composesuggest,#composeSheet .composebijlage{padding-left:0; margin-left:0}
  .composeonderwerp button{padding:5px 7px; font-size:11px}
  .composeknop.composekanaal{max-width:38%}
  .pfkaart .pfcijfers b{font-size:16px}
}

/* v25.38 — assistent/snelheid */
/* Assistent-scherm als vast vlak: kop boven, berichten scrollen in het midden, invoerbalk direct boven de
   tabbalk. Onderaan precies één keer de tabbalkhoogte (die bevat env(safe-area-inset-bottom) al) — geen
   dubbele bodem meer. Bij een open toetsenbord (body.kbopen, gemeten via visualViewport) krimpt het vlak
   mee (--vvtop/--vvh) en wijkt de tabbalk; de laatste bubbel blijft in beeld. Geen layout-sprong: de pagina
   zelf scrolt niet in dit scherm. */
:root{--tabh:62px}
#screen-home[data-view="assistent"]{padding-bottom:0; min-height:0}
.chatview{position:fixed; left:max(0px, calc(50% - 260px)); width:min(100%, 520px); top:var(--vvtop, 0px); height:var(--vvh, 100%); box-sizing:border-box; z-index:44; margin:0; background:var(--ground); display:flex; flex-direction:column; min-height:0; padding:max(8px, env(safe-area-inset-top)) 18px var(--tabh, 62px)}
.chatview[hidden]{display:none !important}
.chatview > .viewhead{flex:none; margin-bottom:6px; padding-bottom:10px; border-bottom:1px solid var(--line)}
.chatview .msgs{flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; padding:6px 2px 10px}
.chatview .aiupsell{flex:1; min-height:0; overflow-y:auto}
.chatview .inputrow{position:static; flex:none; padding:10px 0 8px; border-top:1px solid var(--line); background:var(--ground)}
.chatview .chiprow,.chatview .attachstrip{flex:none}
.chathead2 .chatsluit,.chathead2 .chatmeer{width:36px; height:36px; border-radius:12px; font-size:16px; flex:none; margin:0}
.chathead2 .chatmeer{font-size:19px; line-height:1}
.chatview .chatmenu{top:54px; right:18px; z-index:46}
body.kbopen .chatview{padding-bottom:0}
body.kbopen .tabbar{visibility:hidden}
@media (min-width:560px){ .chatview{padding-top:30px} }
@media (max-width:355px){ .chatview .camerabtn{width:40px} .chatview .send{padding-left:12px; padding-right:12px} .chatview .inputrow{gap:7px} } /* 320 px: typveld houdt ruimte */

/* Skeleton-placeholders in plaats van "laden…"-teksten (feed, grootboek, ledenlijst, kanalenpaneel, hero) */
.skel{position:relative; overflow:hidden; display:block; background:color-mix(in srgb, var(--ink) 8%, transparent); border-radius:8px; min-height:12px}
.skel::after{content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--ink) 7%, transparent), transparent); animation:skelglans 1.1s infinite}
@keyframes skelglans{to{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){ .skel::after{animation:none} }
.skelpost{display:grid; grid-template-columns:40px 1fr; gap:10px; padding:12px 4px}
.skelpost .skel.av{width:40px; height:40px; border-radius:50%}
.skelrij{display:flex; flex-direction:column; gap:8px; padding:2px 0}
.skelrij .skel{height:12px} .skelrij .skel.kort{width:38%} .skelrij .skel.half{width:72%}
.skellijst{display:flex; flex-direction:column; gap:12px; padding:8px 10px}
.skellijst .skel{height:14px} .skellijst .skel:nth-child(2n){width:80%} .skellijst .skel:nth-child(3n){width:60%}
.skelhero{display:inline-block; width:8ch; height:.85em; vertical-align:middle; border-radius:6px}

/* Lange lijsten: alleen tekenen wat in beeld is (feed van alle berichten, grootboek, meldingen) */
#feedHome.feedalles #feedList .post{content-visibility:auto; contain-intrinsic-size:auto 160px}
.txmaand,.notifrow{content-visibility:auto; contain-intrinsic-size:auto 72px}

/* Overgangen kort (≤ 180 ms) — zonder jank op een telefoon */
.backdrop,.sheet,.paneel .paneelvlak,.hintbar{transition-duration:.18s}
#toast,#livepop{transition-duration:.16s}

/* v25.40 — scenario's */
/* Goud-familie voor de drie beursscenario's (ordinaal: onder = licht/zacht, boven = sterk);
   "gemiddeld" blijft het bestaande benchmark-goud (--bench-sp). Gevalideerd als één-tint-
   reeks in beide thema's (dataviz-validator, --ordinal). */
:root{--scn-onder:#A98633; --scn-boven:#F2D9A2}
:root[data-theme="light"]{--scn-onder:#C9A254; --scn-boven:#6E4F14}
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){--scn-onder:#C9A254; --scn-boven:#6E4F14} }
/* legenda-chips zijn nu knoppen: tik = lijn dimmen / weer tonen */
/* (geen flex op de knop zelf: Chromium centreert de inhoud van een flex-button en laat de tekst afbreken) */
.cmplegend button.cmpchip{appearance:none; display:inline-block; background:none; border:0; padding:3px 0; font:inherit; font-size:12.5px; line-height:1.3; color:var(--ink-2); cursor:pointer; border-radius:8px; text-align:left; white-space:nowrap}
.cmplegend button.cmpchip svg{display:inline-block; width:22px; height:8px; vertical-align:middle; margin-right:7px; position:relative; top:-1px} /* overstemt .compoundcard svg{width:100%} */
.cmplegend .cmpchip.dim{opacity:.4}
.cmplegend button.cmpchip:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (hover:hover){ .cmplegend button.cmpchip:hover{color:var(--ink)} }
.cmptabel th.dim,.cmptabel td.dim{opacity:.4}
/* jaartabel met 5–7 kolommen: bedragen niet afbreken (de tablewrap scrolt), jaarkolom blijft staan */
.compoundcard .cmptabel th{white-space:normal; vertical-align:bottom}
.compoundcard .cmptabel td{white-space:nowrap}
.compoundcard .cmptabel th:first-child,.compoundcard .cmptabel td:first-child{position:sticky; left:0; z-index:1; background:var(--card)}
/* invoerrij onder de grafiek: eigen percentage + uitklapknop */
.scnrij{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 14px; margin:0 0 10px}
.scnrij label,.scnpaneel label{display:inline-flex; align-items:center; gap:8px; margin:0; font-size:12.5px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--ink-2)}
.scnveld{display:inline-flex; align-items:center; gap:5px}
.scnveld input{width:5.4em; padding:7px 9px; font-size:15px; border-radius:10px; text-align:right; font-variant-numeric:tabular-nums}
.scnveld b{font-weight:500; color:var(--ink-3); font-size:12px}
.scnrij .scnopen{color:var(--accent); font-weight:600; padding:6px 0}
@media (hover:hover){ .scnrij .scnopen:hover{color:var(--accent); text-decoration:underline} }
.scnpaneel{display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin:0 0 12px; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:var(--card-2)}
.scnpaneel .scnstd{margin:0 0 0 auto; padding:8px 14px; font-size:12.5px; font-weight:600; border-radius:10px}
/* schakelaar "Mét maandinleg" (alleen zichtbaar als er een maandinleg is ingesteld; standaard uit) */
.scnschakel{appearance:none; cursor:pointer; flex-basis:100%; align-self:flex-start; display:inline-flex; align-items:center; gap:8px; width:max-content; max-width:100%; background:transparent; color:var(--ink-2); border:1px solid var(--line-2); border-radius:999px; padding:6px 12px 6px 8px; font:inherit; font-size:12.5px; font-weight:600}
.scnschakel::before{content:""; width:10px; height:10px; border-radius:50%; border:2px solid var(--line-2); background:transparent; flex:none}
.scnschakel[aria-pressed="true"]{color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent); background:var(--accent-wash)}
.scnschakel[aria-pressed="true"]::before{border-color:var(--accent); background:var(--accent)}
.scnschakel[hidden]{display:none}
.scnschakel:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (hover:hover){ .scnschakel:hover{border-color:var(--accent); color:var(--accent)} }
@media (max-width:355px){
  .scnrij{flex-direction:column; align-items:stretch}
  .scnrij label,.scnpaneel label{justify-content:space-between}
  .scnpaneel{flex-direction:column; align-items:stretch}
  .scnpaneel .scnstd{margin:4px 0 0; width:100%}
}
/* v25.40 — rendement-keuze */
/* De hoofdtegel (#statJaar) volgt de keuze van het lid ("Rendement tonen als"). Standaard (MWRR) is
   alles exact zoals v25.39. Bij een eigen keuze krijgt de tegel een accent; bij "Kaal" gaat de
   Rendement-op-inleg-tegel dicht (dat cijfer staat dan groot in de hoofdtegel) en spant de hoofdtegel
   de hele breedte. De subregel toont het cijfer dat niet gekozen is — niets verdwijnt. */
.statgrid .stat[hidden]{display:none}
.statgrid .stat.hoofd{border-color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, transparent)}
.statgrid .stat.hoofd b{font-size:20px}
.statgrid[data-rendkeuze="kaal"] .stat.hoofd{grid-column:1 / -1; order:-1}
.inlegrij .rendkeuzeopen{padding:0; font-size:12.5px; font-weight:600; color:var(--ink-3)}
.inlegrij .rendkeuzeopen[hidden]{display:none}
.inlegrij .rekenopen:not([hidden]) + .rendkeuzeopen::before,.inlegrij .inlegline:not([hidden]) + .rekenopen[hidden] + .rendkeuzeopen::before{content:"· "; color:var(--ink-3); font-weight:400}
.rendkeuzemodal{max-width:480px}
.rendkeuzeintro{margin:0 0 12px; font-size:12.5px; line-height:1.5; color:var(--ink-2)}
.rendkeuzelijst{display:flex; flex-direction:column; gap:8px}
/* (de globale label{uppercase}/input{width:100%}-regels van de formulieren gelden hier niet) */
.rendkeuze{display:flex; gap:10px; align-items:flex-start; margin:0; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--stat-bg); cursor:pointer; font-size:13px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--ink)}
.rendkeuze.aan{border-color:var(--accent); background:color-mix(in srgb, var(--accent) 9%, transparent)}
.rendkeuze input{width:18px; height:18px; margin:2px 0 0; padding:0; border:none; border-radius:50%; background:none; accent-color:var(--accent); flex:none} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.rendkeuze > span{flex:1; min-width:0}
.rendkeuze b,.rendkeuzeschakel b{display:block; font-size:14px; line-height:1.3; color:var(--ink)}
.rendkeuze small,.rendkeuzeschakel small{display:block; margin-top:3px; font-size:12.5px; line-height:1.45; color:var(--ink-2)}
.rendkeuzeschakel{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line)}
.rendkeuzenoot{margin:10px 0 0; font-size:12px; line-height:1.5; color:var(--ink-3)}
.rendkeuzeuitleg{cursor:pointer}
@media (hover:hover){ .rendkeuze:hover{border-color:var(--accent)} .inlegrij .rendkeuzeopen:hover{color:var(--ink)} }
@media (max-width:355px){ .statgrid .stat.hoofd b{font-size:18px} } /* 320 px: het grote cijfer blijft in de tegel */
/* v25.40 — bericht */
/* Berichtdetail (#screen-bericht, route #/b/<id>, Discord-draad): kop ‹ · Bericht · ⋯, de volledige kaart (dezelfde
   feedkaart als de feed, zonder afkapping), "N reacties", de antwoorden als platte lijst (avatar 32) en een vast
   invoerveld "Antwoord…" precies boven de tabbalk (--tabh bevat de safe-area al). De feedkaart-regels hieronder
   spiegelen die van #feedHome #feedList (zelfde look, andere container). Alles via de thematokens (dark + licht),
   hover alleen binnen de hover-mediaquery, 320 px bruikbaar. */
.bkscherm{padding-bottom:calc(var(--tabh, 62px) + 88px)}
#bkMenu{font-size:15px}
.bkbody{display:flex;flex-direction:column}
.bkkaart,.bklijst{padding:0;display:flex;flex-direction:column}
#screen-bericht .post.fkaart{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:start;margin:0;padding:12px 0 8px;border-bottom:1px solid var(--line);background:transparent;border-radius:0;border-left:none;position:relative}
#screen-bericht .bkkaart .post.fkaart{border-bottom:none;padding-top:4px}
#screen-bericht .bklijst .post.fkaart{grid-template-columns:32px minmax(0,1fr);padding:10px 0 6px}
#screen-bericht .bklijst .pavatar.init{width:32px;height:32px;min-width:32px;font-size:12px}
#screen-bericht .bklijst .post.fkaart:last-child{border-bottom:none}
#screen-bericht .post.fkaart.genoemd{border-left:2px solid var(--gold);padding-left:8px;margin-left:-8px;border-radius:0 10px 10px 0;background:transparent}
#screen-bericht .fkaart .pmeta{display:flex;align-items:baseline;gap:6px;row-gap:2px;flex-wrap:wrap;font-size:11px;color:var(--ink-3);min-height:21px}
#screen-bericht .fkaart .pname{font:700 14px "IBM Plex Sans",sans-serif;color:var(--ink);text-decoration:none}
#screen-bericht .fkaart .pname.mijn{color:var(--accent)}
#screen-bericht .fkaart .pname.redactie{color:var(--gold)}
#screen-bericht .fkaart .ptijd{font-size:11px;color:var(--ink-3);white-space:nowrap}
#screen-bericht .fkaart .badgeplek{display:inline-flex;height:18px;align-items:center}
#screen-bericht .fkaart .badgeplek:empty{display:none}
#screen-bericht .fkaart .lidbadge{margin-left:0;height:18px;line-height:16px;padding:0 6px}
#screen-bericht .fkaart .symchip{display:inline-flex;align-items:center;gap:5px;margin:0;font:700 11px "Archivo",sans-serif;padding:0 7px;height:18px;border-radius:999px;background:var(--hl-bg);border:1px solid var(--line);color:var(--ink);text-decoration:none}
#screen-bericht .fkaart .symchip i{width:7px;height:7px;border-radius:50%;display:inline-block;flex:none}
#screen-bericht .fkaart .symchip.kanaalchip{font:600 10.5px "IBM Plex Sans",sans-serif;color:#8B7CF6;background:transparent;border:none;padding:0;height:auto}
#screen-bericht .fkaart .bewerkt{font-size:10.5px;font-style:italic;color:var(--ink-3)}
#screen-bericht .fkaart .pinbadge{border:none;padding:0;font-size:11px}
#screen-bericht .fkaart .replytag{height:16px;line-height:14px;padding:0 6px}
#screen-bericht .fkaart .realname{border:none;background:transparent;color:var(--ink-3);font-size:11px;padding:0;cursor:help}
#screen-bericht .fkaart .pmeta .sinceline{display:inline;margin:0;padding:0;border:none;background:transparent;font:500 10.5px "IBM Plex Sans",sans-serif;color:var(--ink-3);white-space:nowrap}
#screen-bericht .fkaart .pmeta .sinceline b{font:700 10.5px "Archivo",sans-serif}
#screen-bericht .fkaart .pmeta .sinceline.up b{color:var(--good-text)} #screen-bericht .fkaart .pmeta .sinceline.down b{color:var(--bad-text)}
#screen-bericht .fkaart .pmeta .pdel{display:none} /* verwijderen loopt via ⋯, zoals in de feed */
#screen-bericht .fkaart .replyctx{margin:2px 0 2px}
#screen-bericht .fkaart .ptitel{margin:2px 0 0;font:700 15.5px/1.4 "IBM Plex Sans",sans-serif;color:var(--ink);overflow-wrap:anywhere}
#screen-bericht .fkaart .pbody > p{margin:2px 0 0;font-size:14.5px;line-height:1.55;color:var(--ink);overflow-wrap:anywhere;white-space:pre-line}
#screen-bericht .bklijst .fkaart .pbody > p{font-size:14px;line-height:1.5}
#screen-bericht .fkaart .pbody > p.jumbo{font-size:40px;line-height:1.2}
#screen-bericht .fkaart .samenvatting{display:block;overflow:visible} /* geen afkapping op het detailscherm */
#screen-bericht .redactiekaart .leesrij{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px}
#screen-bericht .fkaart .reactiechip{font:600 11.5px "IBM Plex Sans",sans-serif;padding:3px 8px;border-radius:7px;border:1px solid var(--line-2);background:var(--stat-bg);color:var(--ink)}
#screen-bericht .fkaart .reactiechip.mijn{border-color:color-mix(in srgb, var(--accent) 55%, transparent);background:var(--accent-wash)}
#screen-bericht .fkaart .hovacts{display:flex;position:static;margin:0;padding:0;gap:2px;background:transparent;border:none;box-shadow:none}
#screen-bericht .fkaart .hovacts button{width:26px;height:24px;border-radius:7px;font-size:13px;color:var(--ink-3);opacity:1}
#screen-bericht .fkaart .hovacts button.antwoorden{width:auto;height:auto;padding:3px 8px;font:600 11.5px "IBM Plex Sans",sans-serif;color:var(--ink-2);line-height:1.5;white-space:nowrap}
@media (hover:hover){ #screen-bericht .fkaart .hovacts button:hover{background:var(--hl-bg);color:var(--ink)} }
#screen-bericht .bkinlineknop{display:none !important} /* op het detailscherm staan alle antwoorden er al */
.bksectie{font:700 11.5px "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);padding:14px 0 4px;border-top:1px solid var(--line);margin-top:6px}
.bksectie:empty{display:none}
.bklijst .feedempty.bkleeg{padding:16px 0 8px;font-size:13px;line-height:1.5;color:var(--ink-3)}
.feedempty.bkweg{padding:36px 20px;text-align:center;font-size:13px;line-height:1.5;color:var(--ink-3)}
.feedempty.bkweg b{display:block;margin:8px 0 4px;font:700 15px "IBM Plex Sans",sans-serif;color:var(--ink)}
.feedempty.bkweg .feedleegemo{font-size:34px;display:block;line-height:1.2}
.bkwegterug{margin:14px auto 0;display:inline-block}
.bkskelkaart{grid-template-columns:38px minmax(0,1fr);padding:12px 0;border-bottom:none}
/* Markering vanuit een melding: het nieuwe antwoord licht kort op en dooft dan */
#screen-bericht .post.bkmarkeer{background:var(--accent-wash);border-radius:12px;padding-left:8px;padding-right:8px;margin-left:-8px;margin-right:-8px;animation:bkmark 3.2s ease forwards}
@keyframes bkmark{0%,55%{background:var(--accent-wash)}100%{background:transparent}}
@media (prefers-reduced-motion: reduce){ #screen-bericht .post.bkmarkeer{animation:none} }
/* Invoerbalk "Antwoord…": vast boven de tabbalk, in de app-kolom (safe-area zit al in --tabh) */
.bkinvoer{position:fixed;left:max(0px, calc(50% - 260px));width:min(100%, 520px);bottom:var(--tabh, 62px);z-index:44;box-sizing:border-box;display:flex;gap:8px;align-items:center;padding:10px 18px;margin:0;background:var(--ground);border-top:1px solid var(--line)}
.bkinvoer[hidden]{display:none !important}
.bkinvoer input{flex:1;min-width:0;font:inherit;font-size:16px;color:var(--ink);background:var(--input-bg);border:1px solid var(--line-2);border-radius:999px;padding:10px 14px;margin:0}
.bkinvoer input:focus-visible{outline:2px solid var(--accent);border-color:var(--accent)}
.bkinvoer .send{margin:0;padding:0;width:40px;height:40px;border-radius:50%;font-size:18px;line-height:1;flex:none;cursor:pointer;opacity:.55;transition:opacity .15s ease}
.bkinvoer .send.aan{opacity:1}
body.kbopen .bkinvoer{bottom:0}
/* Inline uitklappen in de feed — alleen op een breed scherm (paneel gedockt); op mobiel altijd het detailscherm */
.bkinlineknop{display:none}
@media (min-width:1180px){
  .bkinlineknop{display:inline-flex;align-items:center;appearance:none;cursor:pointer;background:transparent;border:none;padding:3px 8px;border-radius:7px;font:600 11.5px "IBM Plex Sans",sans-serif;color:var(--ink-3);margin-left:auto}
}
@media (hover:hover) and (min-width:1180px){ .bkinlineknop:hover{background:var(--hl-bg);color:var(--ink)} }
.bkinline{margin:6px 0 2px;padding-left:12px;border-left:2px solid var(--line-2);display:flex;flex-direction:column}
#feedHome #feedList .bkinline .post.fkaart{grid-template-columns:28px minmax(0,1fr);gap:8px;padding:8px 0 4px;border-bottom:none}
#feedHome #feedList .bkinline .pavatar.init{width:28px;height:28px;min-width:28px;font-size:11px}
.bkinlinealle{appearance:none;cursor:pointer;background:transparent;border:none;padding:6px 0 2px;font:600 12px "IBM Plex Sans",sans-serif;color:var(--accent);text-align:left}
/* Tikbare kaarten: op muis-apparaten een handje op de tekst */
@media (hover:hover){ #feedList .post.fkaart .pbody > p,#feedList .post.fkaart .ptitel,#tkFeed .post .pbody > p,#lpFeed .post .pbody > p{cursor:pointer} }
@media (max-width:355px){ .bkinvoer{padding-left:12px;padding-right:12px;gap:6px} .bkinvoer .send{width:36px;height:36px} } /* 320 px */
/* v25.40 — feed */
/* Chips-rij boven "Mijn aandelen" (ontwerp: $NVDA +2,1% ●): horizontaal scrollend in de plakkende kop,
   nooit paginabreedte-overschrijding (320 px), pills 999 zoals de knoppen/chips in het ontwerp. */
.feedchips{display:flex; align-items:center; gap:6px; flex-basis:100%; width:100%; min-width:0; margin:0; padding:7px 0 7px; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; -webkit-overflow-scrolling:touch; border-bottom:1px solid var(--line); scroll-padding:0 6px}
.feedchips::-webkit-scrollbar{display:none}
.feedchips[hidden]{display:none}
.feedchip{display:inline-flex; align-items:center; gap:5px; flex:none; padding:5px 10px; border-radius:999px; background:var(--card); border:1px solid var(--line-2); text-decoration:none; color:var(--ink); font:600 12px "IBM Plex Sans",sans-serif; white-space:nowrap; line-height:1.2}
.feedchip:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.feedchip b{font-family:"Archivo",sans-serif; font-size:12px; letter-spacing:.01em; font-weight:800}
.feedchip span{font-variant-numeric:tabular-nums; font-size:11.5px; color:var(--ink-2)}
.feedchip span.up{color:var(--good-text)} .feedchip span.down{color:var(--bad-text)}
.feedchip .chipdot{width:7px; height:7px; border-radius:50%; background:var(--good); flex:none}
.feedchipsleeg{font-size:12px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:5px 0}
@media (hover:hover){ .feedchip:hover{border-color:var(--accent); background:var(--accent-wash)} }

/* v25.41 — historie: label "Historie sinds … (uit je grootboek)" onder de prestatie-grafiek */
.histsinds{margin-top:-2px; font-size:11.5px; color:var(--ink-2)}
.histsinds.benadering{color:var(--ink-3)}
/* v25.41 — avg (Mijn gegevens · Steun & contact · ⓘ-pagina's · disclaimer-hints) */
.avgvlak{padding:14px 18px calc(18px + env(safe-area-inset-bottom)); max-height:88svh; overflow-y:auto}
.avgvlak .cardhead{display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:8px}
.avgvlak .cardhead b{font-size:16px; flex:1; min-width:0}
.avgvlak .cardhead .iconbtn{flex:none}
.avgtekst{font-size:13.5px; line-height:1.55; color:var(--ink-2); margin:0 0 10px}
.avgtekst b{color:var(--ink)}
.avgtekst ul{margin:6px 0 0; padding-left:18px}
.avgtekst li{margin:3px 0}
.avgkop{font:700 13px "IBM Plex Sans",sans-serif; color:var(--ink); margin:14px 0 4px}
.avgknoppen{display:flex; flex-direction:column; gap:8px; margin-top:12px}
.avgknoppen .btn{width:100%}
.btn.avggevaar{background:transparent; border:1px solid var(--bad); color:var(--bad-text)} /* v25.52 (HUISSTIJL2): gevaar via --bad (was los rood) */
.btn.avggevaar:disabled{opacity:.45; cursor:not-allowed}
.avgtelling{list-style:none; margin:8px 0; padding:10px 12px; border-radius:12px; background:var(--hl-bg); font-size:13px; line-height:1.5}
.avgtelling li{display:flex; justify-content:space-between; gap:10px}
.avgtelling li b{font-variant-numeric:tabular-nums}
.avgveld{display:block; width:100%; margin-top:6px; min-height:110px; border-radius:11px; border:1px solid var(--line-2); background:var(--card); color:var(--ink); padding:10px 12px; font:inherit; font-size:14px; resize:vertical}
.avgwoord{display:block; width:100%; margin-top:6px; height:44px; border-radius:11px; border:1px solid var(--line-2); background:var(--card); color:var(--ink); padding:0 12px; font:inherit; font-size:15px; letter-spacing:.08em; text-transform:uppercase}
.avgmeta{font-size:11.5px; color:var(--ink-3); margin:8px 0 0; line-height:1.45}
.avgloginhint{margin-top:8px}
.avgdeelvoet{margin:14px 18px 4px; text-align:center}
.avgdeelvoet a,.avgloginhint a{color:var(--accent)}
.avginfolink{appearance:none; background:transparent; border:none; padding:0; color:var(--accent); font:inherit; cursor:pointer; text-decoration:underline}
@media (max-width:355px){ .avgvlak{padding-left:12px; padding-right:12px} .avgtelling li{flex-direction:column; gap:0} } /* 320 px */
@media (hover:hover){ .btn.avggevaar:not(:disabled):hover{background:color-mix(in srgb, var(--bad) 8%, transparent)} }
/* v25.41 — vergelijken */
/* Ordinale reekskleuren voor de vergelijklijnen (dataviz: kleur volgt de reeks, niet de rang; drie slots,
   per thema gevalideerd op CVD-scheiding, plus een eigen streepjespatroon als tweede codering). */
:root{--vg-1:#2ED3C0; --vg-2:#F5923E; --vg-3:#F06292} /* v25.52 (HUISSTIJL2): H-8 teal i.p.v. cyaan — van het lichtblauwe accent af */
:root[data-theme="light"]{--vg-1:#0E8F86; --vg-2:#E0621A; --vg-3:#C2185B} /* v25.52 (HUISSTIJL2): H-8 teal i.p.v. cyaan */
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){--vg-1:#0E8F86; --vg-2:#E0621A; --vg-3:#C2185B} } /* v25.52 (HUISSTIJL2): H-8 teal i.p.v. cyaan */
.vgknop{appearance:none; cursor:pointer; flex:none; font:600 12.5px "IBM Plex Sans",sans-serif; color:var(--ink-2); background:var(--card); border:1px solid var(--line-2); border-radius:999px; padding:5px 11px; white-space:nowrap; line-height:1.3}
.vgknop[aria-pressed="true"]{color:var(--ink); border-color:var(--accent); background:var(--accent-wash)}
.vgknop:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
@media (hover:hover){ .vgknop:hover{border-color:var(--accent); color:var(--ink)} }
#tkChartCard .cardhead{gap:8px 10px}
#tkChartCard .cardhead .seg{flex:1 1 220px; min-width:0}
.prestvgrij{display:flex; justify-content:flex-end; padding:8px 2px 0}
/* Chips van de gekozen reeksen: kleurstreepje (met het streepjespatroon van de lijn), naam, evt. waarde, ✕ */
.vgchips{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; padding:8px 18px 0; font-size:12px; color:var(--ink-2)}
.vgchips[hidden]{display:none !important}
.vgchip{display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:3px 3px 3px 9px; border-radius:999px; border:1px solid var(--line-2); background:var(--stat-bg); color:var(--ink); font:600 12px "IBM Plex Sans",sans-serif; white-space:nowrap; line-height:1.3}
.vgchip i{width:16px; height:0; border-top:2.5px solid var(--vgk); border-radius:2px; flex:none}
.vgchip.dash1 i{border-top-style:dashed; border-top-width:2px}
.vgchip.dash2 i{border-top-style:dotted; border-top-width:3px}
.vgchip small{font-weight:500; color:var(--ink-3); font-size:11px}
.vgchip b{font-family:"Archivo",sans-serif; font-variant-numeric:tabular-nums}
.vgchip b.up{color:var(--good-text)} .vgchip b.down{color:var(--bad-text)}
.vgchip.laden{opacity:.65}
.vgchip .vgx{appearance:none; border:0; background:transparent; color:var(--ink-3); font:inherit; font-size:12px; line-height:1; cursor:pointer; width:22px; height:22px; border-radius:50%; display:inline-grid; place-items:center; padding:0; margin:0; flex:none}
.vgchip .vgx:focus-visible{outline:2px solid var(--accent)}
@media (hover:hover){ .vgchip .vgx:hover{background:var(--hl-bg); color:var(--ink)} }
.vgnoot{font-size:11.5px; color:var(--ink-3); white-space:nowrap}
.serieslegend .vgchip{padding-top:2px; padding-bottom:2px}
/* Tooltip-regels van de vergelijkreeksen: kleurstreepje + naam, indexwaarde en verschil in %-punt */
.tooltip .vgttrij{display:flex; align-items:center; gap:6px; margin-top:3px; font-variant-numeric:tabular-nums; white-space:nowrap}
.tooltip .vgttrij i{width:12px; height:0; border-top:2px solid var(--vgk); flex:none}
.tooltip .mut{color:var(--ink-3)}
/* De kiezer (txmodal: op mobiel een sheet onderin, op breed scherm gecentreerd) */
.vgmodal{max-width:min(480px, 100vw)}
.vgintro{font-size:13px; line-height:1.45; color:var(--ink-2); margin:0 0 8px}
.vgmodal .vggekozen{padding:0 0 6px; min-height:28px}
.vgleeg{font-size:12.5px; color:var(--ink-3)}
.vgzoekvak{position:relative; margin:4px 0 10px}
.vgzoekvak input{width:100%; box-sizing:border-box; font:inherit; font-size:16px; color:var(--ink); background:var(--input-bg); border:1px solid var(--line-2); border-radius:12px; padding:10px 14px; margin:0}
.vgzoekvak input:focus-visible{outline:2px solid var(--accent); border-color:var(--accent)}
.vggroep{margin:10px 0 5px; font:600 11px "IBM Plex Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3)}
.vgopties{display:flex; flex-wrap:wrap; gap:6px}
.vgoptie{appearance:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:6px 11px; border-radius:999px; border:1px solid var(--line-2); background:var(--card); color:var(--ink); font:600 12.5px "IBM Plex Sans",sans-serif; white-space:nowrap; line-height:1.3}
.vgoptie b{font-family:"Archivo",sans-serif; font-weight:800; letter-spacing:.01em}
.vgoptie span{color:var(--ink-3); font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:150px}
.vgoptie.aan{border-color:var(--accent); background:var(--accent-wash)}
.vgoptie:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
@media (hover:hover){ .vgoptie:hover{border-color:var(--accent)} }
.vgvoet{padding:12px 0 0}
@media (max-width:355px){ .vgoptie span{max-width:110px} .vgchips{padding-left:14px; padding-right:14px} #tkTt .vgttrij .mut{display:none} } /* 320 px: tooltip zonder het (+x%)-tussenstuk, past dan in de grafiekbox */
/* v25.41 — nieuws */
/* Linkkaart: strak, één blok — (afbeelding) · favicon + bron · vette titel · omschrijving (max 2 regels) · "Open ›" */
.linkkaart{display:flex; align-items:stretch; gap:0; margin:8px 0 2px; border:1px solid var(--line); border-radius:12px; background:var(--card-2, var(--hl-bg)); color:var(--ink); text-decoration:none; overflow:hidden; max-width:100%; min-width:0}
.linkkaart .lkbeeld{flex:none; width:96px; min-height:72px; background:var(--hl-bg); overflow:hidden}
.linkkaart .lkbeeld img{width:100%; height:100%; object-fit:cover; display:block}
.linkkaart .lktekst{flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:3px; padding:9px 10px}
.linkkaart .lkdomein{display:flex; align-items:center; gap:6px; font:600 11px "IBM Plex Sans",sans-serif; color:var(--ink-2); letter-spacing:.02em; min-width:0}
.linkkaart .lkdomein > span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.linkkaart .lkfav{width:14px; height:14px; border-radius:3px; flex:none; object-fit:contain}
.linkkaart .lkfavleeg{display:inline-flex; align-items:center; justify-content:center; font-size:10px}
.linkkaart .lkextern{font-style:normal; font-size:10px; color:var(--ink-3); border:1px solid var(--line); border-radius:999px; padding:0 6px; flex:none}
.linkkaart .lktitel{font:700 13.5px/1.35 "IBM Plex Sans",sans-serif; color:var(--ink); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere}
.linkkaart .lkoms{font-size:12.5px; line-height:1.4; color:var(--ink-2); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:anywhere}
.linkkaart .lkopen{flex:none; align-self:center; margin:0 10px 0 4px; font:700 12.5px "IBM Plex Sans",sans-serif; color:var(--accent); white-space:nowrap}
.linkkaart.lkladen .lktitel{opacity:.7}
.linkkaart.vertrouwd{border-color:color-mix(in srgb, var(--gold) 45%, var(--line))}
@media (hover:hover){ .linkkaart:hover{border-color:var(--accent); background:var(--accent-wash)} }
@media (max-width:359px){ .linkkaart .lkbeeld{display:none} } /* 320 px: tekst eerst */
/* Redactie-overzicht: app-feedback + opschoonknop */
.rdnieuwskop{margin-top:16px; font-weight:700; color:var(--ink)}
.rdnieuwskop .linkbtn{margin-left:6px; color:var(--accent)}
.rdopschoon{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:4px 0 8px}
.rdopschoon .rdkop{margin:0}
/* v25.41 — forecast */
/* Scenario-analyse "Wat als…" op de aandelenpagina (tab Kerncijfers, kaart "Wat is het waard?").
   Kleuren: de goud-reeks van v25.40 (ordinaal: somber → basis → optimistisch) plus het accent
   voor "Jouw scenario" — gevalideerd met de dataviz-validator (goud ordinaal PASS in beide
   thema's; goud ↔ accent ΔE ≥ 31). Kleur is identiteit van de lijn, nooit een oordeel. */
.fcvak{padding:0 18px 14px}
.fcvak[hidden]{display:none}
.fcpresets{display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 12px}
.fcpresets button{appearance:none; cursor:pointer; display:inline-flex; align-items:center; gap:7px; font:inherit; font-size:12.5px; font-weight:600; color:var(--ink-2); background:transparent; border:1px solid var(--line-2); border-radius:999px; padding:6px 12px 6px 10px}
.fcpresets button i{display:inline-block; width:14px; height:3px; border-radius:2px; flex:none}
.fcpresets button[aria-pressed="true"]{color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent); background:var(--accent-wash)}
.fcpresets button:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (hover:hover){ .fcpresets button:hover{border-color:var(--accent); color:var(--accent)} }
.fcvelden{display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; margin:0 0 8px}
.fcvelden label{display:flex; flex-direction:column; gap:4px; margin:0; font-size:12.5px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--ink-2)}
.fcveld{display:inline-flex; align-items:center; gap:5px}
.fcveld input{width:100%; max-width:7.5em; padding:7px 9px; font-size:15px; border-radius:10px; text-align:right; font-variant-numeric:tabular-nums; margin:0}
.fcveld b{font-weight:500; color:var(--ink-3); font-size:12px}
.fchint{font-weight:500; font-size:11.5px; color:var(--ink-3); line-height:1.3}
.fchorizon{grid-column:1 / -1; display:flex; align-items:center; gap:10px; font-size:12.5px; font-weight:600; color:var(--ink-2); flex-wrap:wrap}
.fchorizon .seg{flex:none}
.fcacties{display:flex; flex-wrap:wrap; gap:2px 18px; margin:0 0 8px}
.fcacties .linkbtn{padding:6px 0}
.fcacties .linkbtn[hidden]{display:none}
.fcacties .fcneem{color:var(--accent); font-weight:600}
@media (hover:hover){ .fcacties .fcneem:hover{color:var(--accent); text-decoration:underline} }
.tkc .tkstats.fcuit{padding:0 0 8px; grid-template-columns:1fr 1fr}
.fcuit .stat b{color:var(--ink)} /* uitkomst neutraal: geen groen/rood-oordeel */
.fcimpl{margin:0 0 8px}
.fcpositie{font-size:12.5px; line-height:1.45; color:var(--ink-2); margin:0 0 8px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--card-2)}
.fcpositie b{color:var(--ink)}
.fcpositie[hidden]{display:none}
.fclegend{display:flex; flex-wrap:wrap; gap:4px 16px; margin:4px 0 0; font-size:12.5px; color:var(--ink-2)}
.fclegend .fclg{display:inline-flex; align-items:center; gap:7px; white-space:nowrap}
.fclegend .fclg svg{display:inline-block; width:22px; height:8px; flex:none}
.fcchart{margin-top:6px}
.fcchart svg text{fill:var(--ink-3)}
.fcchart svg text.fceind{fill:var(--ink); font-variant-numeric:tabular-nums}
.fcchart svg .fcgrid{stroke:var(--line-2); stroke-width:1}
.fcchart svg .fcleider{stroke:var(--ink-3); stroke-width:1}
.fcchart svg .fcdot{stroke:var(--card); stroke-width:2} /* 2 px surface-ring rond de eindmarkers */
.fcsw{display:inline-block; width:10px; height:3px; border-radius:2px; margin:0 6px 3px 0; vertical-align:middle}
.tooltip .fcsw{margin-right:5px}
.fctabel{margin-top:6px}
.fctabel td:nth-child(2){font-weight:500}
.fctabel tr.fcr-jouw td{font-weight:600}
.fcbasis{margin-bottom:4px}
@media (max-width:355px){
  .fcvelden{grid-template-columns:1fr}
  .fcveld input{max-width:none}
  .fchorizon{flex-direction:column; align-items:stretch}
  .fchorizon .seg button{flex:1}
}
/* v25.41 — peilingen-voorkeuren */
/* Compose: peiling-editor (📊) — 2 tot 4 opties, sluiting. Zelfde kaarttaal als de portefeuille-bijlage. */
.composepeiling{margin-top:8px; padding:10px 12px; border-radius:14px; background:var(--card-2); border:1px solid color-mix(in srgb, var(--accent) 30%, transparent)}
.composepeiling[hidden]{display:none}
.composepeiling .cpkop{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-2); margin-bottom:8px}
.composepeiling .cpkop b{color:var(--ink); font-family:"Archivo",sans-serif}
.composepeiling .cpkop .iconbtn{margin-left:auto}
.composepeiling .cprij{display:flex; align-items:center; gap:6px; margin-bottom:6px}
.composepeiling .cprij input{flex:1; min-width:0; font:inherit; font-size:14px; padding:8px 10px; border-radius:10px; border:1px solid var(--line-2); background:var(--card); color:var(--ink)}
.composepeiling .cprij input:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.composepeiling .cpweg[hidden], .composepeiling #composePeilingPlus[hidden]{display:none}
.composepeiling .cpvoet{display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12.5px; color:var(--ink-2); flex-wrap:wrap}
.composepeiling .cpsluit select{font:inherit; font-size:12.5px; margin-left:4px; padding:4px 6px; border-radius:8px; border:1px solid var(--line-2); background:var(--card); color:var(--ink)}
.composeknop.on{border-color:var(--accent); color:var(--ink); background:var(--accent-wash)}
/* Kaart: balkjes met percentages, eigen keuze gemarkeerd, gesloten-staat. */
.peiling{margin-top:10px; padding:10px 12px; border-radius:14px; background:var(--card); border:1px solid var(--line); max-width:100%}
.peiling .pvraag{font:600 14px "IBM Plex Sans",sans-serif; color:var(--ink); margin-bottom:8px}
.peiling .popties{display:flex; flex-direction:column; gap:6px}
.peiling .popt{position:relative; appearance:none; display:flex; align-items:center; gap:8px; width:100%; min-height:36px; padding:7px 10px; border-radius:10px; border:1px solid var(--line-2); background:var(--card-2); color:var(--ink); font:inherit; font-size:13.5px; text-align:left; cursor:pointer; overflow:hidden}
.peiling .popt .pbalk{position:absolute; left:0; top:0; bottom:0; width:0; background:color-mix(in srgb, var(--accent) 18%, transparent); transition:width .35s ease; pointer-events:none}
.peiling .popt .ptekst{position:relative; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.peiling .popt .ppct{position:relative; flex:none; font-family:"Archivo",sans-serif; font-weight:800; font-size:12.5px; font-variant-numeric:tabular-nums; color:var(--ink-2); min-width:34px; text-align:right}
.peiling .popt.mijn{border-color:var(--accent)}
.peiling .popt.mijn .pbalk{background:color-mix(in srgb, var(--accent) 34%, transparent)}
.peiling .popt.mijn .ptekst{font-weight:600}
.peiling .popt.mijn .ppct{color:var(--good-text)}
.peiling .popt:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.peiling .popt[disabled]{cursor:default; opacity:.85}
.peiling.dicht .popt .pbalk{background:color-mix(in srgb, var(--ink-2) 16%, transparent)}
.peiling.dicht .popt.mijn{border-color:var(--line-2)}
.peiling .pvoet{display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; font-size:12px; color:var(--ink-2)}
.peiling .pvoet span+span::before{content:"·"; margin-right:6px}
.peiling .pvoet .pdicht{color:var(--bad-text); font-weight:600}
@media (hover:hover){ .peiling .popt:not([disabled]):hover{border-color:var(--accent); background:var(--accent-wash)} .composepeiling .cprij input:hover{border-color:var(--accent)} }
@media (max-width:355px){ .peiling{padding:8px 10px} .peiling .popt{padding:6px 8px; font-size:13px} .composepeiling{padding:8px 10px} } /* 320 px */
/* v25.41 — koppeling */
/* Kaart "Brokerkoppeling — alleen-lezen" onderin "Portefeuille inrichten": lijst van koppelingen met
   status-stip (ok/bezig/fout), formulier met broker-keuze en stap-voor-stap-hulp; 320 px blijft bruikbaar. */
.koppelblok{margin-top:14px; padding-top:12px; border-top:1px solid var(--line)}
.koppelkop{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.koppelkop b{font-family:"Archivo",sans-serif; font-size:13.5px}
.koppeltag{font-size:10.5px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; padding:2px 7px; border-radius:999px; background:var(--hl-bg); color:var(--ink-2)}
.koppeluitleg{font-size:12px; color:var(--ink-2); margin:6px 0 8px; line-height:1.45}
.koppelleeg,.koppeluit{font-size:12.5px; color:var(--ink-2); margin:0 0 8px}
.koppeluit{padding:8px 10px; border-radius:10px; background:var(--hl-bg); color:var(--ink)}
.koppelrij{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2); margin-bottom:8px; min-width:0}
.koppelinfo{min-width:0; flex:1 1 auto; font-size:12.5px; line-height:1.4; overflow-wrap:anywhere}
.koppelnaam b{font-family:"Archivo",sans-serif; font-size:13px}
.koppelstatus{display:flex; align-items:center; gap:6px; margin-top:2px; font-variant-numeric:tabular-nums}
.koppeldot{width:8px; height:8px; border-radius:50%; background:var(--ink-3); flex:none}
.koppeldot.ok{background:var(--good)} .koppeldot.fout{background:var(--bad)} .koppeldot.bezig{background:var(--accent); animation:koppelpuls 1.2s ease-in-out infinite}
@keyframes koppelpuls{0%,100%{opacity:1} 50%{opacity:.35}}
.koppelfouttekst{color:var(--bad-text); font-size:12px; margin-top:2px}
.koppeldek{font-size:11.5px; margin-top:2px}
.koppelacties{display:flex; flex-direction:column; gap:6px; flex:none; align-items:stretch}
.koppelacties .pill{white-space:nowrap}
.koppelform{margin:4px 0 8px; padding:12px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2)}
.koppelbrokers{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px}
.koppelvelden label{display:block; font-size:12px; color:var(--ink-2); margin:8px 0 4px}
.koppelvelden input{width:100%; box-sizing:border-box; padding:9px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--card); color:var(--ink); font:inherit; font-size:13px; min-width:0}
.koppelvelden input:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.koppelhulp{margin-top:8px; font-size:12px; color:var(--ink-2)}
.koppelhulp summary{cursor:pointer; color:var(--ink); font-weight:600}
.koppelhulp ol{padding-left:18px; margin:6px 0} .koppelhulp li{margin:3px 0; line-height:1.45}
.koppelhulp p{margin:6px 0 0; line-height:1.45}
.koppelknoppen{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px}
.koppelfout{color:var(--bad-text); font-size:12.5px; margin:8px 0 0}
.koppelmelding{font-size:12.5px; margin:6px 0 0; padding:8px 10px; border-radius:10px; background:var(--hl-bg); color:var(--ink); line-height:1.45}
.koppelmelding.ok{border-left:3px solid var(--good)} .koppelmelding.fout{border-left:3px solid var(--bad); color:var(--bad-text)} .koppelmelding.bezig{border-left:3px solid var(--accent)}
@media (max-width:420px){ .koppelrij{flex-direction:column} .koppelacties{flex-direction:row; flex-wrap:wrap} }
@media (hover:hover){ .koppelrij button.pill:hover{border-color:var(--accent)} }
.koppelbrokers .pill{appearance:none; cursor:pointer; background:transparent; font:inherit; font-size:12.5px; font-weight:600; color:var(--ink-2); padding:6px 12px}
.koppelbrokers .pill.on{background:var(--accent-wash); border-color:var(--accent); color:var(--ink)}
.koppellijst .skelettekst{display:block; height:12px; width:60%; margin:4px 0 8px}
/* v25.41 — aandelenpagina */
/* "Jij vs de leden" (vergelijkingsblok) en "Samen bezitten we" (aggregaten-kaart) op de $TICKER-pagina.
   Kaartjes in de taal van het ontwerp (thematokens, dark + licht), 320 px bruikbaar, hover-effecten alleen in de hover-mediaquery. */
.tkc.tkvs{display:flex; flex-direction:column; gap:8px; padding:12px 18px 10px}
.tkvskop{display:flex; align-items:baseline; justify-content:space-between; gap:8px; min-width:0}
.tkvstitel{font:700 12px "Archivo",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2)}
.tkvssub{font-size:11px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0}
.tkvstabel{display:flex; flex-direction:column; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--stat-bg)}
.tkvsrij{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr); gap:6px; align-items:center; padding:7px 10px; border-top:1px solid var(--line); min-width:0}
.tkvsrij:first-child{border-top:none}
.tkvskoprij{padding:5px 10px; background:var(--hl-bg)}
.tkvskoprij span{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.tkvslbl{display:flex; flex-direction:column; gap:0; min-width:0; font-size:12px; font-weight:600; color:var(--ink-2)}
.tkvslbl i{font-style:normal; font-size:10px; font-weight:500; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tkvsrij b{font-family:"Archivo",sans-serif; font-weight:700; font-size:13px; font-variant-numeric:tabular-nums; color:var(--ink); min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:1px; line-height:1.2; overflow:hidden}
.tkvsrij b.kpos{color:var(--good-text)} .tkvsrij b.kneg{color:var(--bad-text)}
.tkvsdelta{font:600 10px "IBM Plex Sans",sans-serif; font-style:normal; letter-spacing:.02em; padding:1px 6px; border-radius:999px; border:1px solid var(--line-2); color:var(--ink-3); background:var(--card); white-space:nowrap}
.tkvsdelta.beter{color:var(--good-text); border-color:color-mix(in srgb, var(--good) 45%, transparent); background:color-mix(in srgb, var(--good) 10%, transparent)}
.tkvsdelta.slechter{color:var(--bad-text); border-color:color-mix(in srgb, var(--bad) 45%, transparent); background:color-mix(in srgb, var(--bad) 10%, transparent)}
.tkvsdelta.gelijk,.tkvsdelta.neutraal{color:var(--ink-2)}
.tkvs.zonderjij .tkvsjijkol{display:none}
.tkvs.zonderjij .tkvsrij{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}
.tkvsnoot{font-size:11px; color:var(--ink-3); font-weight:500; text-transform:none; letter-spacing:0}
@media (max-width:359px){ .tkvsrij{padding:7px 8px; gap:4px} .tkvsrij b{font-size:12px} .tkvsdelta{padding:1px 5px} }
/* Samen bezitten we */
.tkc.tksamen{display:flex; flex-direction:column; gap:8px; padding:12px 18px 12px}
.tksamengrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px}
.tksamengrid:empty{display:none}
.tkst{display:flex; flex-direction:column; gap:2px; min-width:0; padding:10px 11px; border-radius:14px; background:var(--stat-bg); border:1px solid var(--line)}
.tkst .slbl{font-size:10px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); line-height:1.3}
.tkst b{font-family:"Archivo",sans-serif; font-weight:800; font-size:15px; font-variant-numeric:tabular-nums; color:var(--ink); overflow-wrap:anywhere; letter-spacing:-.01em; line-height:1.25}
.tkst b.kpos{color:var(--good-text)} .tkst b.kneg{color:var(--bad-text)}
.tkst b .kpos{color:var(--good-text)} .tkst b .kneg{color:var(--bad-text)}
.tkst i{font-style:normal; font-size:10.5px; color:var(--ink-3); line-height:1.3}
.tksamenleeg{font-size:12px; color:var(--ink-3); line-height:1.45}
@media (max-width:479px){ .tksamengrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:339px){ .tksamengrid{grid-template-columns:1fr} .tkst b{font-size:14px} }
@media (hover:hover){ .tkst:hover{border-color:var(--line-2)} }
/* v25.41 — feed-v2 */
/* ⋯-menu: "Waarom zie je dit?" met de uitlegregel eronder (mag afbreken), en de keuzesheet Minder/Meer van dit. */
.bmenuvlak .fv2waarom b i{white-space:normal; line-height:1.3; max-width:100%}
.fv2kies .pluskop{padding:6px 18px 8px; font:700 15px "Archivo",sans-serif; color:var(--ink)}
.fv2noot{padding:8px 18px 6px; font:400 12px "IBM Plex Sans",sans-serif; color:var(--ink-3); line-height:1.4}

/* v25.42 — koppeling eToro/Freedom24: keuzelijst voor het domein, in de stijl van de invoervelden */
.koppelselect{width:100%; padding:10px 12px; border:1px solid var(--line-2); border-radius:10px; background:var(--card); color:var(--ink); font:500 14px "IBM Plex Sans",sans-serif; margin:4px 0 8px}
.koppelselect:focus{outline:2px solid var(--accent); outline-offset:1px}
.koppelbrokers{flex-wrap:wrap}

/* v25.42 — uitschieters: mediaan naast het gemiddelde in "Jij vs de leden" en de samen-kaart */
.tkvsrij b .tkmed{display:block; font:400 11px "IBM Plex Sans",sans-serif; color:var(--ink-3); font-style:normal; margin-top:1px}

/* v25.42 — aandelenpagina 320 px: vóór de opening is het koerslabel lang ("voorbeurs, slot gisteren") en drukte de
   koersrij (prijs + label + sparkline) de kaart uit; het label mag afbreken en de sparkline zakt zo nodig onder de prijs */
@media (max-width:359px){ .tkkoersrij{flex-wrap:wrap} .tkkoersrij .tkbig .pday{white-space:normal} .tkkoersrij .tkbig{max-width:100%} }
/* v25.42 — testomgeving */
/* Vaste banner bovenaan zolang de beheerder als nieuw lid kijkt (Opnieuw starten / Stoppen). Bewust één
   vaste kleur in dark én licht (het is een waarschuwingsbalk); de body schuift zijn hoogte (--nlbar) op,
   net als de enige plakkende kop (.xtabs), het versiepilletje en de drawers (gedockt paneel op desktop). */
.nlbar{position:fixed; top:0; left:0; right:0; z-index:66; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px 12px;
  padding:max(6px, env(safe-area-inset-top)) 12px 6px; background:#E8B34B; color:#1B1406; font:600 13px "IBM Plex Sans",sans-serif; box-shadow:0 2px 12px rgba(0,0,0,.25)}
.nlbar .nltekst{display:inline-flex; align-items:center; gap:4px; flex-wrap:wrap; min-width:0}
.nlbar .nlsub{font-weight:500; opacity:.85}
.nlbar .nlknoppen{display:inline-flex; gap:8px; flex-wrap:wrap}
.nlbtn{appearance:none; cursor:pointer; border:1px solid rgba(27,20,6,.35); background:rgba(255,255,255,.55); color:#1B1406; font:700 12.5px "IBM Plex Sans",sans-serif; padding:6px 11px; border-radius:999px; min-height:32px}
.nlbtn.nlstop{background:#1B1406; color:#F6E7C2; border-color:#1B1406}
.nlbtn:active{transform:translateY(1px)}
@media (hover:hover){ .nlbtn:hover{background:rgba(255,255,255,.8)} .nlbtn.nlstop:hover{background:#2A2010} }
@media (max-width:600px){ .nlbar .nlsub{display:none} } /* telefoon: alleen de kern + de twee knoppen (de uitleg staat in de sheet) */
@media (max-width:355px){ .nlbar{font-size:12px; gap:4px 8px} } /* 320 px */
body.nieuwlid{padding-top:var(--nlbar, 44px)}
body.nieuwlid .xtabs{top:var(--nlbar, 44px)}
body.nieuwlid #newpill{top:calc(var(--nlbar, 44px) + 8px)}
body.nieuwlid .drawer{top:var(--nlbar, 44px)}
body.nieuwlid .meermenu{top:calc(64px + var(--nlbar, 44px))}
body.nieuwlid .chatview{top:calc(var(--vvtop, 0px) + var(--nlbar, 44px)); height:calc(var(--vvh, 100%) - var(--nlbar, 44px))} /* de assistent staat vast (fixed) — anders valt zijn kop onder de banner */
/* Keuzesheet Testomgeving (≡ → Beheer, of ⋯-menu): twee knoppen met uitleg; hoogte naar inhoud. */
#nlSheet .sheet.nlsheet{height:auto; max-height:90svh; padding:0 0 max(18px, env(safe-area-inset-bottom))}
.nlkeuze{padding:4px 18px 6px; overflow-y:auto}
.nlkeuze .nlknop{width:100%; margin-top:12px}
.nlkeuze .chartsub{margin:8px 0 4px}
.nluitleg{margin:10px 0 4px; font-size:14px; color:var(--ink-2)}
.nluitleg b{color:var(--ink)}
.pgroep.nlbeheer .pgkop span:first-child{color:#E8B34B}
/* v25.42 — embed */
/* ⧉ Insluiten-knop in de blokkop van de aandelenpagina: altijd zichtbaar (geen hover-only), klein, rustig; op smalle schermen alleen het symbool. */
.embknop{appearance:none; cursor:pointer; margin-left:auto; flex:none; display:inline-flex; align-items:center; gap:2px; padding:4px 8px; border-radius:999px; border:1px solid var(--line-2); background:var(--card); color:var(--ink-3); font:600 11.5px "IBM Plex Sans",sans-serif; line-height:1.2; white-space:nowrap}
.embknop:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.tkpillen .embknop{margin-left:auto}
.tkvskop .embknop{margin-left:6px}
.tkfilters .embknop{margin-left:auto}
@media (max-width:479px){ .embknop .emblang{display:none} .embknop{padding:4px 7px; font-size:12px} }
@media (hover:hover){ .embknop:hover{color:var(--ink); border-color:var(--accent)} }
/* De insluit-sheet: blokkeuze, themakeuze, voorbeeld, code, kopieerknop */
.embsheet{max-height:92svh}
.embrij{display:flex; align-items:center; gap:10px; padding:4px 16px; flex-wrap:wrap}
.emblbl{display:block; padding:6px 16px 2px; font-size:10.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.embrij .emblbl{padding:0; min-width:44px}
.embblok{max-width:100%}
.embvoorbeeld{margin:8px 16px 4px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--card-2)}
.embvoorbeeld iframe{display:block; width:100%; max-height:min(340px, 38svh); border:0}
.embcode{display:block; width:calc(100% - 32px); margin:2px 16px 0; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--input-bg); color:var(--ink); font:12px/1.45 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; resize:vertical; min-height:88px; overflow-wrap:anywhere}
.embacties{display:flex; align-items:center; gap:14px; padding:8px 16px 0}
.embkopieer{padding:10px 16px}
@media (max-width:359px){ .embrij{gap:6px} .embacties{flex-wrap:wrap} }
.tkfilters .embknop{padding:4px 8px; background:var(--card); color:var(--ink-3); font-size:11.5px; margin-left:auto}
/* De koerskaart (#tkHead) is een kolom-flexcontainer die nog flex-wrap:wrap erfde van de oude rij-opmaak; bij een lange dagregel ("voorbeurs, slot gisteren") rekte Chromium daardoor álle rijen op tot de max-content-breedte, zodat de sparkline, de pillen én de ⧉-knop op 320 px buiten de kaart vielen. Kolom-flex zonder wrap: de rijen blijven zo breed als de kaart. */
.tkc.tkhead{flex-wrap:nowrap}
/* v25.42 — snel */
/* Tijdens een kanaalwissel (lijst .snelver) worden alleen de kaarten in beeld (.snelzicht) opgemaakt; de rest is een
   plaatshouder van ±200 px (content-visibility) tot snelOnthul de klasse weghaalt (idle, ≤ 600 ms). Sheets en menu's
   staan op body en vallen hierbuiten. */
#feedHome #feedList.snelver > .post.fkaart:not(.snelzicht){content-visibility:auto; contain-intrinsic-size:auto 200px}

/* v25.43 — avatars: het vaste cartoon-gezichtje (avatarSvg) terug op de plekken die in v25.38 een initiaal kregen
   (feedkaarten, citaat, composer, drawer-voet, ledenprofiel). De ronde container houdt overflow:visible voor de
   online-stip; het vierkante svg wordt zelf rond geknipt (clip-path). De redactie houdt haar gouden initiaal. */
.pavatar.init svg{width:100%; height:100%; display:block; border-radius:50%; clip-path:circle(50% at 50% 50%)}
.pavatar.init.mijn{background:var(--card-2)}
.lpavatar svg{width:100%; height:100%; display:block; border-radius:50%; clip-path:circle(50% at 50% 50%)}

/* v25.43 — buitenbeurs: voor-/nabeurskoers (VS) als rustige regel onder de dagverandering op de aandelenpagina */
.tkext{font:600 12.5px "IBM Plex Sans",sans-serif; color:var(--ink-2); margin-top:2px; font-variant-numeric:tabular-nums}
.tkext.up{color:var(--good-text)} .tkext.down{color:var(--bad-text)}
/* v25.43 — watchlist */
/* Tik-flits (Rabi: "licht rood of groen kleuren met elke tik omhoog en omlaag … voor alle ticks overal"): tikFlits() zet
   .tikflits op het element en ± 600 ms .tikflits-op (groen) of .tikflits-af (rood): snel aan, rustig uit. Dark én licht
   via color-mix op de thematokens. Bij prefers-reduced-motion geen overgang — de tint wisselt dan in één keer. */
.tikflits{transition:background-color .5s ease; border-radius:6px}
.tikflits-op{background-color:color-mix(in srgb, var(--good-text) 24%, transparent); transition-duration:.08s}
.tikflits-af{background-color:color-mix(in srgb, var(--bad-text) 24%, transparent); transition-duration:.08s}
@media (prefers-reduced-motion: reduce){ .tikflits,.tikflits-op,.tikflits-af{transition:none} }
/* Beurzenstrook boven de watchlist: statisch, op smalle schermen horizontaal scrollbaar (de pagina zelf nooit). */
.wlbeurzen{display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; margin:-6px 0 12px; padding:2px 0 8px; border-bottom:1px solid var(--line)}
.wlbeurzen::-webkit-scrollbar{display:none}
.wlbeurs{flex:none; display:inline-flex; align-items:baseline; gap:6px; padding:6px 9px; border-radius:10px; text-decoration:none; color:var(--ink); white-space:nowrap}
.wlbeurs b{font:700 12.5px "Archivo",sans-serif; letter-spacing:.01em}
.wlbpct{font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; padding:0 3px; border-radius:6px}
.wlbpct.up{color:var(--good-text)} .wlbpct.down{color:var(--bad-text)} .wlbpct.mut{color:var(--ink-3)}
@media (min-width:700px){ .wlbeurzen .wlbeurs{flex:1 0 auto; justify-content:center} }
/* Trending-rij: horizontaal scrollende kaartjes (ticker · koers · sparkline · dagverandering), › naar Ontdek. */
.wltrendblok{margin-bottom:14px}
.wltrendblok .ontdekkop{align-items:center}
.wltrendmeer{appearance:none; background:none; border:0; color:var(--ink-2); font-size:24px; line-height:1; padding:2px 10px; cursor:pointer; border-radius:8px}
.wltkaart{width:124px; align-items:center; text-align:center; padding:14px 10px 12px; text-decoration:none; gap:3px}
.wltkaart .od-tegel{margin-bottom:5px}
.wltick{font:800 15px "Archivo",sans-serif; letter-spacing:.01em; color:var(--ink)}
.wltpx{font-size:12.5px; color:var(--ink-2); font-variant-numeric:tabular-nums; padding:0 4px; border-radius:6px}
.wltspark{display:block; height:22px; margin:5px 0 3px}
.wltspark .spark{width:64px; height:22px}
.wltspark:empty{visibility:hidden}
.wltdag{font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; padding:0 4px}
.wltdag.up{color:var(--good-text)} .wltdag.down{color:var(--bad-text)} .wltdag.mut{color:var(--ink-3)}
/* Kopregel "Watchlist ⊕" met rechts de bestaande lijst-/sorteerknoppen (wlSwitch, wlSortBtn); mag omvouwen op 320 px. */
.wlkop{display:flex; align-items:center; justify-content:space-between; gap:6px 12px; flex-wrap:wrap; margin:2px 2px 10px}
.wlkopl{display:flex; align-items:center; gap:6px; min-width:0}
.wlkoptitel{font:800 19px "Archivo",sans-serif; letter-spacing:-.01em}
.wlplus{appearance:none; background:none; border:0; color:var(--ink-3); font-size:21px; line-height:1; padding:2px 5px; cursor:pointer; border-radius:8px}
.wlkopl .divkpi{margin-left:2px; white-space:nowrap}
.wlkopr{display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0}
.wlkopr .pfswitch{margin:0; padding:2px 4px}
.wlkopr .pfswitch b{font-size:13.5px; max-width:42vw}
/* Watchlistrij in Stocktwits-stijl: ticker vet, naam grijs eronder; koers vet met eronder pijl + verandering + (%). */
.wlrow .pleft b{font-size:15px}
.wlrow .pright .pprice{font-size:14px; font-weight:700; padding:0 4px; border-radius:6px}
.wlrow .pday{padding:0 4px; border-radius:6px}
.wlrow .wlsessie{font-weight:500; color:var(--ink-3); font-size:11px}
/* Buitenbeurs-regel onder de koers ("Nabeurs $ 242,50 ↑ +1,0%"), zelfde stijl als .tkext op de aandelenpagina. */
.wlrow .wlext{font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; white-space:nowrap; padding:0 4px; border-radius:6px; color:var(--ink-3)}
.wlrow .wlext.up{color:var(--good-text)} .wlrow .wlext.down{color:var(--bad-text)}
@media (max-width:420px){ .wlrow .pday,.wlrow .wlext{white-space:normal; line-height:1.25} .wlrow .wlsessie{display:block} }
@media (hover:hover){ .wlbeurs:hover,.wlplus:hover,.wltrendmeer:hover{background:var(--hl-bg)} }
@media (hover:hover){ .wlplus:hover,.wltrendmeer:hover{color:var(--ink)} }

/* v25.43 — feedback-popup: "Kloppen je portefeuille gegevens?" bovenaan, boven alles (Rabi). Twee knoppen, één tik.
   Vast bovenaan (safe-area + eventuele nieuw-lid-balk), z-index boven header/tabbalk/drawer/sheets (50–75) en toast (80);
   glijdt in; muis-oplichting alleen in de daarvoor bestemde media-query; reduced-motion zonder overgang; op 320 px vallen de knoppen onder de tekst. */
.fbpop{position:fixed; top:calc(10px + env(safe-area-inset-top) + var(--nlbar, 0px)); left:50%; transform:translate(-50%, -14px); opacity:0;
  width:min(500px, calc(100% - 20px)); z-index:96; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:16px;
  box-shadow:0 14px 40px rgba(0,0,0,.28); padding:10px 12px; transition:transform .22s cubic-bezier(.32,.72,.29,1), opacity .22s ease; pointer-events:none}
.fbpop.aan{transform:translate(-50%, 0); opacity:1; pointer-events:auto}
.fbpop[hidden]{display:none}
.fbvraag{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.fbtekst{display:flex; flex-direction:column; gap:2px; flex:1 1 170px; min-width:0}
.fbtekst b{font:700 14px "Archivo",sans-serif; color:var(--ink)}
.fbpop .fbsub{margin:0; font-size:12px; color:var(--ink-2)}
.fbpop .fbbtns{display:flex; gap:6px; flex:0 0 auto}
.fbpop .fbbtn{flex:none; min-width:0; padding:8px 11px; border-radius:999px; border:1px solid var(--line); background:var(--card-2); color:var(--ink); font:600 13px "IBM Plex Sans",sans-serif; cursor:pointer; white-space:nowrap}
.fbpop .fbbtn.fbon{border-color:var(--accent); background:var(--accent); color:var(--ground)}
.fbpop .fbbtn:disabled:not(.fbon){opacity:.45}
.fbsluit{flex:none; width:28px; height:28px; border-radius:50%; border:0; background:transparent; color:var(--ink-3); font-size:14px; cursor:pointer; display:grid; place-items:center}
.fbdank{font-size:13.5px; padding:4px 2px; color:var(--ink)}
.fblink{background:none; border:0; color:var(--accent); font:inherit; font-weight:600; cursor:pointer; padding:0}
@media (hover:hover){ .fbpop .fbbtn:hover{border-color:var(--accent)} .fbsluit:hover{color:var(--ink)} }
@media (prefers-reduced-motion:reduce){ .fbpop{transition:none} }
@media (max-width:359px){ .fbpop .fbbtns{flex:1 1 100%} .fbpop .fbbtn{flex:1; text-align:center} }
/* beheerdersgrafiek (#/redactie) */
.rdgrafiek{width:100%; height:auto; display:block; margin:6px 0 2px; color:var(--ink)}
.rdversies{display:flex; flex-direction:column; gap:4px}
.rdvrij{display:flex; gap:10px; align-items:center; font-size:12.5px; color:var(--ink-2); font-variant-numeric:tabular-nums; flex-wrap:wrap}
.rdvrij b{color:var(--ink); min-width:56px}
.rdvrij .rdvb{color:#E8B93C} .rdvrij .rdvn{color:#E05252} .rdvrij .rdvp{color:var(--pos, var(--good-text))} /* v25.52 (HUISSTIJL2): 'positief' = --good-text (was hard-coded groen) */

/* v25.43 — koppelingang: tweede knop in de brokergids (T212/IBKR) onder de hoofdactie */
#bgKoppel{margin-top:8px}
/* v25.43 — ui */
/* (1) Dividendkaart (Rabi: "de visualisatie zit te dichtbij de randen"): de binnenkaart van het dividendjaar is
   vervallen — een rustige sectie met eyebrow, record-balk en een dunne scheidslijn, net als de ranglijst netjes
   binnen de 18 px-kaartmarge. Zelfde cijfers, zelfde id's en klassen (doorloop-test). */
.divcard .divhero{margin:2px 18px 4px; padding:6px 0 14px; border:0; border-bottom:1px solid var(--line); border-radius:0; background:none}
.divcard .divjaarkop{align-items:center}
.divcard .divjaarlbl{font-size:10.5px; letter-spacing:.16em; color:var(--ink-3)}
.divcard .divtrofee{font-size:12.5px}
.divcard .divrecbaan{height:8px; margin:10px 0 8px; background:color-mix(in srgb, var(--ink) 8%, transparent)}
.divcard .divreclbl{font-size:13px}
.divcard .divchips{margin-top:12px}
.divcard .divchip{background:transparent}
.divcard .divposlijst{margin:4px 18px 6px}
.divcard .divrij{padding:9px 0}
.divcard .divrij:first-child{border-top:none}
/* (2) Knop naar de yield-on-cost-sheet: één rustige regel onder de ranglijst */
.divyocknop{appearance:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:10px;
  width:calc(100% - 36px); margin:4px 18px 8px; padding:11px 14px; border:1px solid var(--line); border-radius:12px;
  background:var(--card-2); color:var(--ink); font:600 13px "IBM Plex Sans",sans-serif; text-align:left}
.divyocknop i{font-style:normal; color:var(--accent); font-size:17px; line-height:1}
.divyocknop:focus-visible{outline:2px solid var(--accent)}
.divyocknop:active{transform:scale(.995)}
@media (hover:hover){ .divyocknop:hover{border-color:var(--accent)} }
/* de sheet zelf (zelfde .drawer/.sheet-patroon als de rest van de app) */
.yocsheet{max-height:88svh}
.yoctegels{display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:4px 16px 8px}
.yoctegel{border:1px solid var(--line); border-radius:14px; padding:12px 12px 10px; background:var(--stat-bg, transparent); min-width:0}
.yoctegel.hoofd{border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); background:color-mix(in srgb, var(--accent) 8%, transparent)}
.yoctegel b{display:block; font:800 26px/1.05 "Archivo",sans-serif; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--ink)}
.yoctegel.hoofd b{color:var(--good-text)}
.yoctegel span{display:block; margin-top:3px; font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3)}
.yoctegel small{display:block; margin-top:6px; font-size:11.5px; line-height:1.4; color:var(--ink-2)}
.yoclijst{padding:2px 16px 4px}
.yocrij{display:grid; grid-template-columns:minmax(0,1fr) auto auto; grid-template-rows:auto auto; column-gap:12px; align-items:baseline;
  padding:9px 2px; border-top:1px solid var(--line); font-size:13px}
.yocrij:first-child{border-top:none}
.yocnaam{grid-row:1 / span 2; align-self:center; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0}
.yocverw{grid-column:2; grid-row:1; color:var(--ink-2); font-variant-numeric:tabular-nums; white-space:nowrap; font-size:12.5px}
.yocverw i{font-style:normal; color:var(--ink-3); font-size:11px}
.yocpct{grid-column:3; grid-row:1; font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; min-width:52px; color:var(--good-text)}
.yocnu{grid-column:2 / span 2; grid-row:2; text-align:right; font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap}
.yocnoot{margin:0; padding:2px 16px 6px; font-size:12px; color:var(--ink-3); line-height:1.4}
.yocgroei{margin:0; padding:2px 16px 8px; font-size:13px; line-height:1.5; color:var(--ink-2)}
.yocgroei b{color:var(--ink); font-variant-numeric:tabular-nums}
.yocgroei.stil{color:var(--ink-3)}
.yoctabel{margin:0 16px 6px; border:1px solid var(--line); border-radius:12px; overflow:hidden}
.yoctkop,.yoctrij{display:grid; grid-template-columns:56px minmax(0,1fr) auto; gap:0 10px; align-items:center; padding:8px 12px}
.yoctkop span{white-space:nowrap}
.yoctkop{font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); background:color-mix(in srgb, var(--ink) 4%, transparent)}
.yoctkop span:last-child,.yoctrij b{text-align:right}
.yoctrij{border-top:1px solid var(--line); font-size:13px; font-variant-numeric:tabular-nums; position:relative}
.yoctrij b{color:var(--good-text)}
.yoctrij .yocbaan{grid-column:1 / -1; display:block; height:3px; border-radius:999px; background:color-mix(in srgb, var(--ink) 7%, transparent); margin-top:6px; overflow:hidden}
.yoctrij .yocbaan u{display:block; height:100%; border-radius:999px; background:var(--accent); opacity:.7; text-decoration:none}
@media (max-width:380px){ .yoctegels{grid-template-columns:1fr} .yocrij{grid-template-columns:minmax(0,1fr) auto} .yocpct{grid-column:2} .yocverw{grid-column:1; grid-row:2; text-align:left} .yocnaam{grid-row:1} .yocnu{grid-column:2; grid-row:2} }
/* (3) Desktop-indeling (Rabi: "Portefeuille is niet responsive, mobiele view op desktop"): vanaf 960 px twee
   kolommen op het dashboard in een gecentreerde kolom van max. 1180 px; Ontdek, Watchlist, aandelenpagina en
   assistent krijgen een bredere gecentreerde kolom (760/720 px). Onder 960 px is alles byte-voor-byte als voorheen. */
.dashkol > section.card{margin-bottom:14px}
.dashkol > .hero{margin-bottom:16px}
@media (min-width:960px){
  #screen-home[data-view="dash"]{max-width:1180px}
  .dashgrid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:22px; align-items:start}
  .dashkol{min-width:0}
  #screen-home[data-view="dash"] > .topnav{max-width:560px}
  #screen-home[data-view="ontdek"],#screen-home[data-view="watchlist"]{max-width:760px}
  .tickerscreen{max-width:760px}
  .chatview{left:max(0px, calc(50% - 360px)); width:min(100%, 720px)}
}
/* v25.43 — kalender */
/* Kalender-scherm (#view-kalender, Rabi: earnings + dividend, gepersonaliseerd; voorbeelden Stocktwits/PDT). Eigen
   .view zoals de watchlist: de dashboardkaarten en de kop verdwijnen zolang het scherm open staat. Tokens voor dark én
   licht; muis-effecten alleen in de hover-media-query onderaan; alles blijft bruikbaar op 320 px (strook met 5–7 kolommen). */
#screen-home[data-view="kalender"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="kalender"] > section.card{display:none !important}
@media (min-width:900px){ #screen-home > #view-kalender{grid-column:1/-1; max-width:1040px; justify-self:center; width:100%} }
/* Op een breed scherm mag alleen dit scherm breder dan de app-kolom (drie maandkolommen); het dashboard zelf blijft zoals het is. */
@media (min-width:960px){ #screen-home[data-view="kalender"]{max-width:1080px} }
.agendacard .kalopen{display:block; width:100%; text-align:center; margin-top:8px; padding:8px 0 2px; color:var(--accent); font-weight:600; border-top:1px solid var(--line)}
.wlkalrij{display:flex; justify-content:flex-end; margin:0 2px 8px}
.wlkalchip{cursor:pointer; background:var(--card); color:var(--accent); border-color:var(--line-2)}
.kalview .kalvandaag{cursor:pointer; background:var(--card); color:var(--accent); border-color:var(--line-2); flex:none}
.kalnav{display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 10px}
.kalnav .kalpijl{flex:none; font-size:20px; line-height:1}
.kalperiode{font:700 14.5px "Archivo",sans-serif; letter-spacing:-.01em; text-align:center; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-variant-numeric:tabular-nums}
/* Weekstrook (Stocktwits): 5–7 gelijke kolommen, vandaag uitgelicht, teller + tickers eronder. */
.kalstrook{display:flex; gap:4px; margin-bottom:12px}
.kalsdag{flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:1px; padding:8px 2px 7px; border-radius:12px; border:1px solid var(--line); background:var(--card); color:var(--ink-2); font:inherit; cursor:pointer; appearance:none}
.kalsdag .kalswd{font-size:10.5px; text-transform:lowercase; letter-spacing:.04em}
.kalsdag .kalsnr{font:800 17px "Archivo",sans-serif; color:var(--ink); line-height:1.15}
.kalsdag .kalsn{font-size:11px; font-variant-numeric:tabular-nums; color:var(--ink-3)}
.kalsdag.heeft .kalsn{color:var(--accent); font-weight:700}
.kalsdag .kalstick{font-size:10px; color:var(--ink-3); max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; line-height:1.2}
.kalsdag.vandaag{border-color:var(--accent); background:var(--accent-wash)}
.kalsdag.vandaag .kalsnr,.kalsdag.vandaag .kalswd{color:var(--accent)}
@media (max-width:359px){ .kalsdag .kalstick{display:none} .kalsdag{padding:7px 1px 6px} }
/* Tabs + toggle Week/Maand, typechips. */
.kalbalk{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-bottom:8px}
.kaltabs{display:flex; gap:2px; padding:3px; border-radius:999px; background:var(--card-2); border:1px solid var(--line); min-width:0; overflow-x:auto; scrollbar-width:none}
.kaltabs::-webkit-scrollbar{display:none}
.kaltab{appearance:none; border:none; background:transparent; color:var(--ink-2); font:600 12.5px/1 inherit; font-family:inherit; padding:7px 11px; border-radius:999px; cursor:pointer; white-space:nowrap}
.kaltab.on{background:var(--card); color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.18)}
.kalweergave{display:inline-flex; gap:2px; padding:3px; border-radius:999px; background:var(--card-2); border:1px solid var(--line)}
.kalweergave button{appearance:none; border:none; background:transparent; color:var(--ink-2); font:600 12.5px/1 inherit; font-family:inherit; padding:7px 11px; border-radius:999px; cursor:pointer}
.kalweergave button.on{background:var(--card); color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.18)}
.kaltypes{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px}
.kaltype{cursor:pointer; background:transparent; color:var(--ink-3); font-family:inherit}
.kaltype.on{color:var(--ink); border-color:var(--line-2); background:var(--card)}
.kaltype[data-kaltype="cijfers"].on{color:var(--accent); border-color:var(--accent)}
.kaltype[data-kaltype="dividend"].on{color:var(--good-text); border-color:var(--good-text)}
/* Lijst per dag (PDT): daglabel + rijen met ticker-chip (.atick), type-tag en relevantie rechts. */
.kaldag{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:10px 12px 6px; margin-bottom:10px}
.kaldag.vandaag{border-color:var(--accent)}
.kaldag.licht{box-shadow:0 0 0 2px var(--accent-wash)}
.kaldagkop{display:flex; align-items:baseline; gap:8px; padding-bottom:6px; border-bottom:1px solid var(--line)}
.kaldagkop b{font:800 14px "Archivo",sans-serif; text-transform:lowercase; letter-spacing:-.005em}
.kaldagkop .kalnu{font-style:normal; font-size:10.5px; color:var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:.08em}
.kaldagkop span{margin-left:auto; font-size:11.5px; color:var(--ink-3); white-space:nowrap}
.kalleeg{margin:0; padding:8px 0 6px; font-size:12.5px; color:var(--ink-3)}
.kalrij{display:grid; grid-template-columns:minmax(64px,110px) 1fr auto; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid var(--line); text-decoration:none; color:var(--ink)}
.kalrij:last-child{border-bottom:none}
.kalrij .atick i{max-width:110px}
.kaltype{font-size:12px; color:var(--ink-2); line-height:1.3; min-width:0}
.kalrij .kaltype{display:block}
.kaltag{display:inline-block; font-style:normal; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:1px 6px; border-radius:6px; margin-right:6px; vertical-align:1px; border:1px solid var(--line-2); color:var(--ink-2)}
.kaltag.cijfers{color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent)}
.kaltag.dividend{color:var(--good-text); border-color:color-mix(in srgb, var(--good-text) 45%, transparent)}
.kalrij.verwacht .kaltype{color:var(--ink-3)}
.kalrel{font-size:11px; color:var(--ink-3); text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums}
.kalrel.positie{color:var(--ink-2); font-weight:600}
@media (max-width:420px){ .kalrij{grid-template-columns:minmax(58px,92px) 1fr; row-gap:2px} .kalrel{grid-column:2; text-align:left} }
.kalstatus{margin:8px 0; padding:14px 12px; border-radius:14px; background:var(--card); border:1px solid var(--line); font-size:13px; color:var(--ink-2); text-align:center}
.kalstatus.fout{color:var(--bad-text)}
.kalvoet{margin-top:6px}
/* Maandweergave (PDT): 1 kolom; vanaf 960 px drie maandkolommen naast elkaar, elk met weekkopjes "1 – 6 sep · W36". */
.kalmaanden{display:grid; grid-template-columns:1fr; gap:14px}
@media (min-width:960px){ .kalmaanden{grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start} }
.kalmaand{min-width:0}
.kalmaandkop{margin:0 2px 8px; font:800 16px "Archivo",sans-serif; letter-spacing:-.01em; text-transform:capitalize}
.kalweekkop{font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-2); font-weight:700; margin:6px 2px 6px}
.kalmaand .kaldag{padding:8px 10px 4px}
.kalmaand .kaldagkop b{font-size:13px}
@media (min-width:960px){ .kalmaand .kalrij{grid-template-columns:minmax(56px,88px) 1fr; row-gap:2px} .kalmaand .kalrel{grid-column:2; text-align:left} .kalmaand .atick i{max-width:88px} }
/* Muis-effecten alleen met een echte muis (iOS-plak-les); de drawer-rij gebruikt ▦ in plaats van de kalender-emoji. */
@media (hover:hover){ .kalsdag:hover{border-color:var(--line-2)} .kalrij:hover{background:var(--hl-bg)} .kaltab:not(.on):hover,.kalweergave button:not(.on):hover{color:var(--ink)} .kaltype:not(.on):hover{color:var(--ink-2)} .agendacard .kalopen:hover,.wlkalchip:hover,.kalview .kalvandaag:hover{border-color:var(--accent)} }
/* v25.43 — feedvolgorde */
/* v25.43 (feedvolgorde): de pil "↓ N nieuw" verschijnt nu ook in de feed van álle berichten zoals in een kanaal (chat-volgorde,
   verzoek Rabi). De pil had sinds v25.33 (bottom: "boven de tabbalk") óók nog de top-afstand uit v25.32 ("bovenin zoals X"):
   met top én bottom rekt een fixed knop zich uit over de hele schermhoogte (gemeten: 798 px op 414×890) en ving elke tik op.
   top:auto herstelt de kleine pil onderin — ook in de 🧪-testomgeving, die een top-afstand voor de banner zette terwijl de
   pil onderin staat. */
#newpill{top:auto}
body.nieuwlid #newpill{top:auto}
/* v25.43 (feedvolgorde): de feed opent nu onderaan, dus de sticky kanaalkop (top:0) plakt meteen tegen de bovenrand — in de
   🧪-testomgeving schoof hij daardoor onder de vaste banner (in een kanaal gebeurde dat al). De kop plakt nu ónder de banner. */
body.nieuwlid #feedHome .kanaalkop{top:var(--nlbar, 44px)}
/* v25.43 (feedvolgorde): de feed van álle berichten had sinds v25.38 permanent content-visibility:auto op de kaarten
   ("alleen tekenen wat in beeld is", schatting 160 px per kaart buiten beeld). Met de nieuwste boven was dat onschuldig;
   nu de feed onderaan opent, is "naar onderen scrollen" met geschatte hoogtes onnauwkeurig: kaarten onder de vouw kregen
   pas ná de scroll hun echte hoogte (gemeten: 81 px te hoog geëindigd bij het terugkeren in de feed). De kaarten worden
   daarom weer gewoon opgemaakt — de kanaalwissel blijft snel via het v25.42-mechanisme (.snelver/.snelzicht tijdens de
   wissel, daarna onthullen), precies zoals in een kanaal. .txmaand/.notifrow houden hun content-visibility. */
#feedHome.feedalles #feedList .post{content-visibility:visible; contain-intrinsic-size:none}

/* v25.44 — heroacties + bevestigd-chip: de portefeuille-knoppen (wisselen, naam, leegmaken) in de knoppenrij van de
   totale-waardekaart; de chip BEVESTIGD ✓ groen en op één regel (Rabi: "bevestigd beter en groen weergeven"). */
.pfbadge{white-space:nowrap; display:inline-flex; align-items:center; gap:5px; line-height:1}
.pfbadge.ok{border-color:color-mix(in srgb, var(--good) 55%, transparent); color:var(--good-text); background:color-mix(in srgb, var(--good) 14%, transparent)}

/* v25.44 — tape: de tickertape blijft in de Feed bovenaan staan bij het scrollen (Rabi); de sticky kanaalkop schuift
   eronder (--tape-h wordt door tapeMeet() gemeten, 0 als de tape verborgen is; --nlbar = de nieuw-lid-balk). */
#screen-home.feedmode > .tape:not([hidden]){position:sticky; top:var(--nlbar, 0px); z-index:31; background:var(--ground)}
#screen-home.feedmode #feedHome .kanaalkop{top:calc(var(--nlbar, 0px) + var(--tape-h, 0px))}
/* v25.44 — dialogen */
/* v25.44 (dialogen): één bevestigingskaartje (#dlgKaart) in plaats van de browser-dialoogvensters confirm/alert/prompt —
   Rabi zag op iOS "app.debelegger.nl meldt het volgende … OK / Annuleren / Dialoogvensters onderdrukken" bij 🧹 Leegmaken.
   Gecentreerd, z-index 97: boven de drawer/sheets (50–66), livepop (75), toast (80) en de feedback-popup (96); de harde
   ververs-balk (9999) blijft erboven. Titel vet (Archivo), tekst rustig, knoppen Annuleren → primair; gevaarlijke actie
   in --bad, anders --accent; glijdt in (bij prefers-reduced-motion niet); dark en licht via de thematokens; safe-area;
   muis-oplichting alleen in de hover-media-query; onder 360 px staan de knoppen onder elkaar (primair bovenaan). */
.dlg{position:fixed; inset:0; z-index:97; display:flex; align-items:center; justify-content:center; box-sizing:border-box;
  padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left))}
.dlgback{position:absolute; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); animation:dlgback .2s ease}
.dlgvlak{position:relative; width:min(400px, 100%); max-height:100%; overflow:auto; box-sizing:border-box; background:var(--card); color:var(--ink);
  border:1px solid var(--line-2); border-radius:18px; padding:20px 20px 16px; box-shadow:0 24px 60px -20px rgba(0,0,0,.6), 0 1px 0 rgba(255,255,255,.04) inset;
  animation:dlgin .22s cubic-bezier(.32,.72,.29,1)}
.dlgtitel{margin:0; font:800 17px/1.3 "Archivo","IBM Plex Sans",sans-serif; letter-spacing:-.01em; color:var(--ink); overflow-wrap:anywhere}
.dlgtekst{margin-top:8px; font-size:14px; line-height:1.5; color:var(--ink-2); overflow-wrap:anywhere}
.dlgtekst p{margin:0} .dlgtekst p + p{margin-top:8px}
.dlgveld{display:block; width:100%; box-sizing:border-box; margin-top:12px; padding:11px 12px; border:1px solid var(--line-2); border-radius:12px;
  background:var(--input-bg); color:var(--ink); font:inherit; font-size:15px}
.dlgveld:focus-visible{outline:2px solid var(--accent); border-color:var(--accent)}
.dlgknoppen{display:flex; gap:8px; justify-content:flex-end; margin-top:16px; flex-wrap:wrap}
.dlgknop{appearance:none; flex:1 1 auto; min-width:0; padding:12px 16px; border-radius:12px; border:1px solid var(--line-2); background:var(--card-2); color:var(--ink);
  font:600 15px "IBM Plex Sans",sans-serif; cursor:pointer; white-space:nowrap; -webkit-tap-highlight-color:transparent}
.dlgknop.primair{border-color:var(--accent); background:var(--accent); color:white} /* witte tekst op blauw/rood in beide thema's (keyword: de suites eisen geen hex-kleuren ná hun marker) */
.dlgknop.primair.gevaar{border-color:var(--bad); background:var(--bad); color:white}
.dlgknop:focus-visible{outline:2px solid var(--ink); outline-offset:2px}
.dlgknop:active{transform:scale(.985)}
@keyframes dlgin{from{opacity:0; transform:translateY(14px) scale(.98)}to{opacity:1; transform:none}}
@keyframes dlgback{from{opacity:0}to{opacity:1}}
@media (hover:hover){ .dlgknop:not(.primair):hover{border-color:var(--ink-3); background:var(--hl-bg)} .dlgknop.primair:hover{filter:brightness(1.08)} }
@media (prefers-reduced-motion:reduce){ .dlgvlak,.dlgback{animation:none} }
@media (max-width:359px){ .dlgknoppen{flex-direction:column-reverse} .dlgknop{width:100%} }
/* v25.44 — snel: eerste frame van dashboard en aandelenpagina. Tijdens het openen (houder .snelkaart) worden alleen de
   kaarten in beeld (.snelzicht) opgemaakt; de rest is een plaatshouder (content-visibility) tot snel44Onthul de klasse
   weghaalt (idle, ≤ 400 ms) — dezelfde truc als de feed in v25.42. Verborgen kaarten ([hidden]) blijven display:none. */
#screen-home.snelkaart > section.card:not(.snelzicht), #screen-home.snelkaart > .dashgrid > .dashkol > section.card:not(.snelzicht){content-visibility:auto; contain-intrinsic-size:auto 320px}
#screen-ticker .tkflow.snelkaart > .tkc:not(.snelzicht){content-visibility:auto; contain-intrinsic-size:auto 320px}
#tkFeed.snelkaart > .post:not(.snelzicht){content-visibility:auto; contain-intrinsic-size:auto 180px}

/* v25.44 — logos */
/* v25.44 (logos): huisstijl-logochip (Rabi: "daar liever de daadwerkelijke logo's van die bedrijven, maar wel strak
   geformatteerd en mooi uitziend in een soort house style"). Eén tegel (--lc = maat, hoekradius 30 %) op alle plekken:
   positieslijst en kwartaalcijfer-agenda 36 px, kalender- en watchlistrijen 28 px, trending-kaartjes 36 px (v25.45 trending, was
   44) en de kop van de aandelenpagina 44 px (≤ 419 px: 36 px), Ontdek-rijen 36 px en de "meest bezeten"-kaartjes 28 px. Zonder geladen logo:
   de eerste 1–2 letters van de ticker (CSS ::before uit data-init — geen tekst in de rij) op de vaste tickerkleur (--lk,
   letterkleur --lt); geladen (.geladen): witte tegel met het logo (18 % inset). Vaste maat → de rij verspringt nooit. */
.logochip{position:relative; display:inline-grid; place-items:center; flex:none; box-sizing:border-box; width:var(--lc,36px); height:var(--lc,36px); border-radius:calc(var(--lc,36px) * .3); background:var(--lk,var(--accent)); border:1px solid var(--line-2); color:var(--lt,var(--ink)); overflow:hidden; vertical-align:middle; user-select:none; -webkit-user-select:none}
.logochip::before{content:attr(data-init); font:800 calc(var(--lc,36px) * .36) "Archivo",sans-serif; letter-spacing:.02em; line-height:1}
.logochip img{position:absolute; inset:18%; width:64%; height:64%; object-fit:contain; display:block; background:none; border-radius:0; opacity:0; transition:opacity .2s ease; pointer-events:none}
.logochip.geladen{background:white; border-color:var(--line-2); color:transparent}
.logochip.geladen::before{content:none}
.logochip.geladen img{opacity:1}
@media (prefers-reduced-motion:reduce){ .logochip img{transition:none} }
/* Ontdek-tegel en trending-kaartje: de oude tegelopmaak (accentkleur, tickertekst, 26 px klein) wijkt voor de chip. */
.od-tegel.logochip{width:var(--lc,36px); height:var(--lc,36px); border-radius:calc(var(--lc,36px) * .3); font:inherit; color:var(--lt,var(--ink)); background:var(--lk,var(--accent)); letter-spacing:0}
.od-tegel.logochip.geladen{background:white; color:transparent}
/* Positieslijst en watchlist: de chip als eerste kolom (36 / 28 px); sparkline- en rechterkolom blijven gelijk. */
.prow.metlogo{grid-template-columns:36px minmax(0,1fr) 96px minmax(0,auto); column-gap:12px}
.wlrow.metlogo{grid-template-columns:28px minmax(0,1fr) 96px minmax(0,auto) 26px}
@media (max-width:380px){ .prow.metlogo{grid-template-columns:36px minmax(0,1fr) 64px auto; column-gap:10px} .wlrow.metlogo{grid-template-columns:28px minmax(0,1fr) 64px auto 24px} }
/* Agenda, kalender en trending-zijbalk: [logo] TICKER / naam binnen .atick (de b/i-opmaak en de testselectors blijven). */
.atick.metlogo{flex-direction:row; align-items:center; gap:9px}
.atick.metlogo .atickt{display:flex; flex-direction:column; min-width:0}
.kalrij.metlogo{grid-template-columns:minmax(100px,146px) 1fr auto}
@media (min-width:960px){ .kalmaand .kalrij.metlogo{grid-template-columns:minmax(92px,124px) 1fr} }
/* Kop van de aandelenpagina: #tkLogo is alleen nog de houder van de chip (44 px; ≤ 419 px 36 px, zodat de kop naast
   ‹, ☆, volgknop en ⌕ past — de v25.38-regel "geen logo bij ≤ 419 px" vervalt: Rabi wil het logo juist zien). */
.tkkop .tklogo{width:auto; height:auto; border:none; background:none; border-radius:0; overflow:visible; display:block; font-size:0}
@media (max-width:419px){ .tkkop .tklogo{display:block} .tkkop .tklogo .logochip{width:36px; height:36px; border-radius:11px} .tkkop .tklogo .logochip::before{font-size:13px} }
/* Muis-effecten alleen met een echte muis (iOS-plak-les): de chip krijgt de accentrand als de rij oplicht. */
@media (hover:hover){ .prow.metlogo:hover .logochip,.arow:hover .logochip,.kalrij:hover .logochip,.od-rij:hover .logochip,.od-kaart:hover .logochip{border-color:var(--accent)} }

/* v25.44 — profiel: badge-reden op kaart en profiel, Instellingen-sheet (roepnaam privé, vermogensklasse, badge-stand).
   Rabi: "Track record en Jouw badge werken niet terwijl ik wel 6 maanden historie heb" + "roepnaam aanpassen kan, maar op een
   gekke manier — maak het beter en intuïtief". Alle kleuren via tokens (dark én licht); hover alleen met een echte muis. */
.badgeredenkop{font-weight:600; color:var(--ink)}
.badgeredendoe{display:block; margin-top:2px}
.badgeherbereken{display:inline-block; margin-top:6px; padding:2px 0; color:var(--accent); font-weight:600; font-size:12.5px}
.badgeherbereken:disabled{opacity:.6; cursor:default}
.lpleeg .badgeredenkop{color:var(--ink-2)}
.greetklik::after{content:" ✎"; font-size:.5em; color:var(--ink-3); vertical-align:middle; font-weight:400}
.instsheet{padding-bottom:calc(14px + env(safe-area-inset-bottom))}
.instblok{padding:8px 16px 14px; border-bottom:1px solid var(--line)}
.instblok + .instblok{padding-top:14px}
.instblok:last-of-type{border-bottom:none}
.instlbl{display:flex; align-items:center; gap:8px; font:700 14px "Archivo",sans-serif; margin-bottom:8px; color:var(--ink)}
.instprive{font:600 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); border:1px solid var(--line-2); border-radius:6px; padding:2px 6px}
.instveldrij{display:flex; gap:8px; align-items:stretch}
.instveld{flex:1; min-width:0; font:inherit; font-size:16px; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2); color:var(--ink)}
.instveld:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.instopslaan{flex:none; padding:0 16px; border-radius:12px; font-size:14px}
.instuitleg{margin:8px 0 0; font-size:12.5px; line-height:1.5; color:var(--ink-2)}
.instuitleg .lidbadge{font-size:12px; padding:2px 7px; border-radius:6px; vertical-align:middle}
.instkop b{font:700 14px "Archivo",sans-serif; color:var(--ink)}
.instrij{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; font-size:13.5px; color:var(--ink)}
.instterug{margin-top:4px}
@media (hover:hover){ .badgeherbereken:hover{color:var(--ink)} .greetklik:hover::after{color:var(--ink)} }

/* v25.44 — watchlistrij (bug uit Rabi's screenshot op 430 px): de dagverandering "↑ +3,2% (voorbeurs, slot gisteren)" stond op
   één regel (nowrap); de rechterkolom (minmax(0,auto)) slokte alle ruimte op, de tickerkolom (minmax(0,1fr)) kromp tot nul —
   de ticker schoof onder de sparkline, de naam eronder verdween en de sparkline ving zelfs de tik af. Grid-regel: niet-flexibele
   kolommen groeien éérst tot hun maximum, de 1fr-kolom krijgt de rest. Daarom nu: de rechterkolom krijgt een ondergrens
   (min-content — de koers wordt nooit afgeknipt) én een bovengrens (max-width op .pright: dagregel en sessielabel vouwen om),
   de tickerkolom krijgt de rest (met ellipsis als het echt niet past), de sparkline is 56 px op telefoons (≤ 480 px) en
   verdwijnt onder 400 px (iPhone SE/mini: anders blijft er geen ruimte voor de ticker). Geldt voor de rij mét en zonder
   logochip (v25.44 logos); de eerdere ≤ 380-regels (v25.43, logos) worden hier overschreven. */
/* v25.44 (review): de tickerkolom krijgt een ondergrens (64 px — "GOOGL" past) en de sparkline-kolom wordt flexibel (minmax(0,96px)):
   niet-flexibele kolommen groeien eerst, maar mét een ondergrens op de 1fr-kolom krimpt de sparkline vóór de ticker; de svg vult
   zijn kolom (width:100%, preserveAspectRatio none). De gaps staan op .metlogo (elke rij is .metlogo; anders wint de logos-regel). */
.wlrow{grid-template-columns:minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto) 26px}
.wlrow.metlogo{grid-template-columns:28px minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto) 26px}
.wlrow .psparkbox,#pfBody .prow .psparkbox{min-width:0; width:auto}
.wlrow .spark,#pfBody .prow .spark{width:100%; max-width:96px}
.wlrow .pleft b{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.wlrow .pright{min-width:0; max-width:150px; justify-self:end}
.wlrow .pday,.wlrow .wlext{white-space:normal; line-height:1.25}
.wlrow .wlsessie{display:block}
@media (max-width:480px){
  .wlrow{grid-template-columns:minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto) 26px; gap:10px}
  .wlrow.metlogo{grid-template-columns:28px minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto) 26px; column-gap:10px}
  .wlrow .spark{max-width:56px}
  .wlrow .pright{max-width:116px} /* review/doorloop: "Nabeurs $ 242,50" past op één regel (104 px gaf drie regels); de sparkline is flexibel en vangt het op */
}
@media (max-width:399px){
  .wlrow{grid-template-columns:minmax(64px,1fr) minmax(min-content,auto) 24px; gap:8px}
  .wlrow.metlogo{grid-template-columns:28px minmax(64px,1fr) minmax(min-content,auto) 24px; column-gap:8px}
  .wlrow .psparkbox{display:none}
}

/* v25.44 — positieslijst (Rabi's screenshot 14:50): "↑ +3,2% (voorbeurs, slot gisteren)" stond op één regel, de rechterkolom
   werd zo breed dat de waarde onder de ticker werd afgeknipt ("€ 243…"). Zelfde aanpak als de watchlistrij: rechterkolom met
   ondergrens (koers nooit afgeknipt) én bovengrens, sessielabel kort en op een eigen regel, buitenbeurs-regel (.pext) eronder,
   sparkline 56 px op telefoons en weg onder 400 px. Alleen de positieslijst (#pfBody); de watchlistrij heeft haar eigen regels. */
#pfBody .prow{grid-template-columns:minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto)}
#pfBody .prow.metlogo{grid-template-columns:36px minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto)}
#pfBody .prow .pprice{white-space:normal} #pfBody .prow .pqty{white-space:nowrap} /* v25.44 (review): "× 0.01234567" mag als geheel naar een tweede regel in plaats van uit de kolom te steken */
#pfBody .prow .pright{min-width:0; max-width:170px; justify-self:end}
#pfBody .prow .pday{white-space:normal; line-height:1.25}
#pfBody .prow .psessie{display:block; font-size:11px; font-weight:500; color:var(--ink-3)}
#pfBody .prow .wlext{font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; white-space:normal; line-height:1.25; padding:0; border-radius:6px; color:var(--ink-3)} /* review: geen 4 px inspringing t.o.v. koers en dagregel */
#pfBody .prow .wlext.up{color:var(--good-text)} #pfBody .prow .wlext.down{color:var(--bad-text)}
@media (max-width:480px){
  #pfBody .prow{grid-template-columns:minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto); gap:10px}
  #pfBody .prow.metlogo{grid-template-columns:36px minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto); column-gap:10px}
  #pfBody .prow .spark{max-width:56px}
  #pfBody .prow .pright{max-width:128px}
}
@media (max-width:399px){
  #pfBody .prow{grid-template-columns:minmax(64px,1fr) minmax(min-content,auto); gap:8px}
  #pfBody .prow.metlogo{grid-template-columns:36px minmax(64px,1fr) minmax(min-content,auto); column-gap:8px}
  #pfBody .prow .psparkbox{display:none}
}
/* beheerderspagina: de percentages groot bovenaan (🙂 bijna, 😕 niet, laatste 30 dagen, opkomst) */
.rdhoofd{display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:10px; margin:4px 0 12px}
.rdgroot{display:flex; flex-direction:column; gap:2px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--card-2)}
.rdgroot b{font:800 24px "Archivo",sans-serif; letter-spacing:-.01em; color:var(--ink); font-variant-numeric:tabular-nums}
.rdgroot span{font-size:12px; color:var(--ink-2); line-height:1.35}
.rdgroot.rdvb b{color:var(--good-text)} .rdgroot.rdvn b{color:var(--bad-text)}
/* v25.44 — 503-kader brokerkoppeling: de beheerdersinstructie als tweede, kleinere alinea (alleen voor de beheerder gerenderd) */
.koppeluit.koppelbeheer{margin-top:8px; font-size:12px; color:var(--ink-2); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; white-space:pre-wrap}

/* v25.45 — zoekbalken (Rabi's screenshot 3-9 19:35, omcirkeld: "bijna overal waar die searchbalk zit staat het te dicht op elkaar"):
   de losstaande zoekbalken kregen via .searchwrap.grow margin:0 (bedoeld voor de zoekbalk ín de bovenbalk) en stonden daardoor
   tegen de kop erboven en de kaart eronder. Nu overal dezelfde lucht: 14 px boven en onder (watchlist, Ontdek, aandelenpagina,
   kanalenpaneel). De zoekbalk in de bovenbalk van het dashboard (#homeSearch) blijft zoals hij was. */
.searchwrap.grow.wlzoek{margin:14px 0 14px}
.searchwrap.grow.ontdekzoek{margin:14px 0 16px}
.tkzoekvak{margin:8px 0 14px}
#kanaalPaneel .paneelzoek{margin:12px 0 12px}
.wlkop{margin-bottom:4px} /* de kop zelf iets dichter op de zoekbalk-marge, zodat het totaal 18 px wordt en niet 24 */
/* v25.45 — crypto: label "crypto" in de positieslijst en de gedeelde portefeuille (zelfde pil als het portefeuillelabel, iets lager contrast — het is een soort, geen naam) */
.pflabel.cryptolabel{color:var(--ink-3); border-style:dashed; text-transform:lowercase; letter-spacing:.02em}
/* v25.45 — crypto: het vinkje "Dit is een crypto" in ＋ Transactie (alleen bij een nieuwe positie); tikvlak minstens 44 px, ook op 320 px */
.txcheck{display:flex; align-items:center; gap:8px; margin-top:6px; min-height:44px; font-size:13px; color:var(--ink-2); cursor:pointer}
.txcheck input{width:18px; height:18px; margin:0; accent-color:var(--port); flex:0 0 auto}
/* v25.45 — trending kleiner */
/* v25.45 (trending): Rabi (3-9, screenshot Watchlist-pagina) "Trending iets kleiner" — kaartje 124 → 106 px, logochip 44 → 36 px
   (app-v2545.js, wlTrendKaartHtml), iets kleinere letters en sparkline; de oude .wltkaart-regel blijft staan (tests), deze wint
   omdat hij later komt. Kaarthoogte ≈ 170 → ≈ 140 px. */
.wltkaart{width:106px; padding:11px 8px 10px; gap:2px}
.wltkaart .od-tegel{margin-bottom:4px}
.wltick{font-size:14px}
.wltpx{font-size:12px}
.wltspark{height:18px; margin:4px 0 2px}
.wltspark .spark{width:56px; height:18px}
.wltdag{font-size:12.5px}
.wltrail{gap:8px}
/* v25.45 — kalender2 */
/* v25.45 (kalender2): kalender in de stijl van de Watchlist-pagina (Rabi 3-9, Stocktwits-voorbeeld). Maandtitel boven de
   periodebalk; op de tab Alle bedrijven compacte dagkaarten met samenvattingsregel en alleen de open dag met rijen; elke rij in
   de weekweergave als watchlistrij (koers + dagverandering rechts, ☀︎/☾︎ via ::before bij voor-/nabeurs, ⊕/✓-knop náást de <a>
   in .kalrijwrap). Alleen tokens (dark én licht), muis-effecten alleen in de hover-media-query, 320 px zonder h-scroll. */
.kalmaandtitel{display:block; font:800 17px "Archivo",sans-serif; letter-spacing:-.01em; text-transform:capitalize; margin:0 2px 4px; color:var(--ink)}
.kalmaandtitel:empty,.kalmaandtitel[hidden]{display:none}
.kalrijwrap{display:grid; grid-template-columns:minmax(0,1fr) 26px; column-gap:8px; align-items:center; border-bottom:1px solid var(--line)}
.kalrijwrap:last-of-type{border-bottom:none}
.kalrijwrap .kalrij{border-bottom:none; min-width:0}
.kalrij.koers{grid-template-columns:minmax(100px,146px) 1fr auto}
.kalrij.koers .kaltype{align-self:center}
.kalkoers{display:flex; flex-direction:column; align-items:flex-end; gap:1px; min-width:0; max-width:150px; text-align:right}
.kalkoers .pprice{font-size:14px; font-weight:700; font-variant-numeric:tabular-nums; color:var(--ink); white-space:nowrap}
.kalkoers .pday{font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; white-space:normal; line-height:1.25}
.kalkoers .pday.mut{color:var(--ink-3)}
.kalkoers .wlsessie{display:block; font-weight:500; color:var(--ink-3); font-size:11px}
.kalkoers .wlext{font-size:12.5px; font-weight:600; font-variant-numeric:tabular-nums; white-space:normal; line-height:1.25; color:var(--ink-3)}
.kalkoers .wlext.up{color:var(--good-text)} .kalkoers .wlext.down{color:var(--bad-text)}
.kalkoers .kalrel{margin-top:1px}
.kalrel:empty{display:none}
.atick .atickt i:empty{display:none}
.kalwatch{appearance:none; border:none; background:none; width:26px; height:26px; padding:0; border-radius:8px; color:var(--ink-3); font:inherit; font-size:18px; line-height:1; cursor:pointer; display:inline-grid; place-items:center}
.kalwatch.on{color:var(--accent)}
.kalwatch[disabled]{opacity:.5; cursor:default}
.kaltag[data-when="voorbeurs"]::before{content:"☀\FE0E\00a0"}
.kaltag[data-when="nabeurs"]::before{content:"☾\FE0E\00a0"}
.kaldag.markt .kaldagkop[role="button"]{cursor:pointer}
.kaldag.markt .kaldagkop .kalchev{font-style:normal; margin-left:6px; color:var(--ink-3)}
.kaldagsub{padding:6px 0 4px; font-size:12px; color:var(--ink-2); line-height:1.35; cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.kaldag.compact .kalrijwrap,.kaldag.compact .kalrij,.kaldag.compact .kalmeer{display:none}
.kaldag.compact .kaldagkop{border-bottom:none; padding-bottom:2px}
.kaldag.compact{padding-bottom:8px}
.kalmeer{display:block; width:100%; text-align:center; padding:8px 0; color:var(--accent); font-weight:600; font-size:12.5px}
.kalmeer[disabled]{color:var(--ink-3); cursor:default}
.kalweergave button[disabled]{opacity:.45; cursor:default}
@media (max-width:420px){ .kalrij.koers{grid-template-columns:minmax(0,1fr) auto; row-gap:2px} .kalrij.koers .kaltype{grid-column:1/3} .kalrij.koers .kalkoers{max-width:104px} .kalrij.koers .kalrel{grid-column:auto; text-align:right} }
@media (max-width:359px){ .kalrij.koers .kalkoers{max-width:92px} .kalrij.koers .atick i{max-width:80px} }
@media (hover:hover){ .kalwatch:hover{color:var(--ink); background:var(--hl-bg)} .kaldag.compact .kaldagkop:hover .kalchev,.kaldagsub:hover{color:var(--ink)} .kalmeer:hover{text-decoration:underline} }
@media (prefers-reduced-motion:reduce){ .kalwatch{transition:none} }
/* v25.45 — prestatie-x: klein × achter elke vergelijkingslijn in de legenda van de Prestatie-kaart en het prestatiescherm
   (Watchlist, S&P 500, AEX). Tikvlak 24 × 24 px (het teken zelf blijft klein), kleur volgt de tokens (dark én licht), hover
   alleen op apparaten mét muis. Het × zit ín de chip, dus op 320 px wrapt hij mee met de legenda-regel. */
.serieslegend .sl .slx,.seriestoggles .stgl .slx{appearance:none; border:0; background:transparent; color:var(--ink-3); font:600 15px/1 "IBM Plex Sans",sans-serif; cursor:pointer; width:24px; height:24px; min-width:24px; border-radius:50%; display:inline-grid; place-items:center; padding:0; margin:-4px -6px -4px -2px; flex:none}
.serieslegend .sl .slx:focus-visible,.seriestoggles .stgl .slx:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
@media (hover:hover){ .serieslegend .sl .slx:hover,.seriestoggles .stgl .slx:hover{background:var(--hl-bg); color:var(--ink)} }
.seriestoggles .stgl{cursor:default} /* geen aan/uit-knop meer (v25.32) — een span met ×; het × is de enige actie */
.seriestoggles .stgl .slx{margin-right:-8px}
/* v25.45 — winst-fx: de servertekst bij een geweigerde boeking (wisselkoers niet beschikbaar) in het assistent-kaartje; de knoppen blijven staan */
.mutvoorstel .mutfout{margin:6px 0 2px; font-size:12.5px; line-height:1.4; color:var(--bad-text)}


/* v25.45 — politici */
/* v25.45 (politici): ranglijst (#view-politici), politicus-scherm (#screen-politicus) en het kaartje "Congres-meldingen in dit aandeel"
   (#tkPolCard). Partijkleur ALLEEN als dunne ring om de initialen-avatar (--pol-dem/--pol-rep/--pol-ind) — nooit op een percentage: dat
   blijft .pday.up/.down (--good-text/--bad-text). Tokens hier gedefinieerd voor het dark-blok én beide licht-blokken (zelfde selectors als
   bovenin het bestand; additief, zodat de bovenste blokken ongemoeid blijven). */
:root{--pol-dem:rgb(91 141 239); --pol-rep:rgb(224 96 90); --pol-ind:rgb(156 175 164)}
:root[data-theme="light"]{--pol-dem:rgb(47 98 201); --pol-rep:rgb(196 66 60); --pol-ind:rgb(107 122 114)}
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]){--pol-dem:rgb(47 98 201); --pol-rep:rgb(196 66 60); --pol-ind:rgb(107 122 114)} }
.polavatar{position:relative; display:inline-grid; place-items:center; flex:none; box-sizing:border-box; width:var(--pa,38px); height:var(--pa,38px); border-radius:50%; background:var(--pk,var(--accent)); color:var(--pt,white); user-select:none; -webkit-user-select:none}
.polavatar::before{content:attr(data-init); font:800 calc(var(--pa,38px) * .38) "Archivo",sans-serif; letter-spacing:.02em; line-height:1}
.polavatar.ring-dem{box-shadow:0 0 0 2px var(--pol-dem)}
.polavatar.ring-rep{box-shadow:0 0 0 2px var(--pol-rep)}
.polavatar.ring-ind{box-shadow:0 0 0 2px var(--pol-ind)}
/* Eigen scherm zoals kalender/watchlist/ontdek: de dashboardkaarten en de kop verdwijnen zolang de ranglijst open staat. */
#screen-home[data-view="politici"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="politici"] > section.card{display:none !important}
@media (min-width:960px){ #screen-home[data-view="politici"]{max-width:760px} }
.polview .polsegs{display:flex; gap:8px; flex-wrap:wrap; margin:2px 0 0}
.polview .polsegs .seg{flex:none}
.searchwrap.grow.polzoek{margin:14px 0 14px} /* v25.45-zoekbalkregel: 14 px lucht boven en onder */
.polkopregel{margin:0 0 6px; font-variant-numeric:tabular-nums}
.poltitel{margin:6px 0 8px; font:700 15px "Archivo",sans-serif; letter-spacing:-.01em}
.pollijst{padding:2px 16px}
.polrow{grid-template-columns:24px 38px minmax(0,1fr) minmax(0,auto); gap:10px}
.polrow .polrang{font:700 13px "Archivo",sans-serif; color:var(--ink-3); font-variant-numeric:tabular-nums; text-align:right}
.polsub2{display:block; font-size:11px; color:var(--ink-3); white-space:normal; line-height:1.3; font-weight:500}
.polrow .pright{align-items:flex-end; max-width:150px}
.polrow .pprice.pday{font-size:15px}
.polrow .pleft span{white-space:normal}
.polrow:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; border-radius:8px}
.polleeg{padding:14px 0}
.polbuiten{margin:10px 0 0}
.polmethode{margin:14px 0 0; border:1px solid var(--line); border-radius:12px; padding:10px 14px; background:var(--card)}
.polmethode summary{cursor:pointer; font-weight:600; color:var(--ink-2)}
.polmethodetekst p{font-size:13px; color:var(--ink-2); line-height:1.5; margin:8px 0 0}
.polvoet{margin:12px 0 0; line-height:1.45}
.poltest{flex:none; color:var(--gold); border-color:rgba(217,179,107,.45)}
/* politicus-scherm */
.polscreen{max-width:520px}
.polscreen .apphead.polkop{align-items:center; gap:10px; margin-bottom:12px; flex-wrap:nowrap}
.polkop .polid{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.polkop .polid b{font:800 17px "Archivo",sans-serif; letter-spacing:-.01em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block}
.polkop .polsub{font-size:12.5px; color:var(--ink-3); line-height:1.35}
.polkop .polsub .pill{margin-left:4px; vertical-align:middle}
.polflow{padding:14px 16px 16px}
.polkern.rdhoofd{grid-template-columns:repeat(3, minmax(0,1fr)); margin:0 0 12px}
.polkern .rdgroot b{font-size:20px} .polkern .rdgroot b.polvol{font-size:14px; line-height:1.3; white-space:normal}
.polscores{font-size:13px; color:var(--ink-2); margin:0 0 12px; line-height:1.5} .polscores b{font-variant-numeric:tabular-nums} .polscores small{color:var(--ink-3)}
.polh3{margin:14px 0 4px; font:700 15px "Archivo",sans-serif} .polh3 small{font:500 12px "IBM Plex Sans",sans-serif; color:var(--ink-3); margin-left:6px}
.polpos{border-bottom:1px solid var(--line)} .polpos:last-of-type{border-bottom:none}
.polpos > summary{list-style:none; grid-template-columns:28px minmax(0,1fr) minmax(0,auto); border-bottom:none; gap:10px}
.polpos > summary::-webkit-details-marker{display:none}
.polpos > summary::marker{content:""}
.poloverig > summary{grid-template-columns:minmax(0,1fr) minmax(0,auto)}
.polpos .pleft span{white-space:normal}
.polpos .pright{align-items:flex-end; max-width:44%; min-width:96px}
.polpos > summary{width:100%; grid-template-columns:28px minmax(0,1fr) minmax(96px,40%)} /* v25.45 (politici, samenvoeging): de rechterkolom als vaste grid-track (hoogstens 40 %; 44 % liet de linkerkolom op 414 px onder de 150 px zakken) — met een breed terugvalfont drukte max-width op het item de linkerkolom (ticker + naam + range) tot een smalle strook (doorloopcheck naamBreed) */
.polpos .pright .pday{white-space:normal; text-align:right}
.polmeldingen{padding:0 0 10px}
.polmelding{padding:8px 0 8px 10px; border-left:2px solid var(--line); margin:0 0 8px}
.polmrij{display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; font-size:12.5px; color:var(--ink-2)}
.polmrij b{color:var(--ink); font-variant-numeric:tabular-nums}
.polgemeld,.polowner{color:var(--ink-3)}
.polrange{font-variant-numeric:tabular-nums}
.pill.polbadge{color:var(--gold); border-color:rgba(217,179,107,.45); background:rgba(217,179,107,.12); font-size:11.5px; padding:3px 9px}
.polkoers{font-size:12.5px; color:var(--ink-2); margin:5px 0 0; font-variant-numeric:tabular-nums} .polkoers .pday{display:inline}
.polmvoet{display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center; margin:6px 0 0; font-size:12.5px}
.polbron{color:var(--accent); text-decoration:none; font-weight:600} .polbrontekst{color:var(--ink-3); font-weight:500}
.polaandeel{cursor:pointer; background:var(--card); font-size:12px}
.poloverigkop{font-size:12.5px; color:var(--ink); margin:6px 0 -6px} .poloverigkop small{color:var(--ink-3)}
.polouder{margin:10px 0 0}
.polreden{font-size:11px; color:var(--ink-3); font-weight:500}
/* kaartje op de aandelenpagina */
#tkPolCard .polsymlijst{padding:6px 18px 8px}
.polsymrij{display:grid; grid-template-columns:28px minmax(0,1fr) minmax(0,auto); gap:4px 10px; align-items:center; padding:8px 0; border-bottom:1px solid var(--line)}
.polsymrij:last-child{border-bottom:none}
.polsymrij .pleft span{white-space:normal}
.polsymrij .pright{align-items:flex-end}
.polsymrij .polsymbron{grid-column:2 / -1; font-size:12px}
#tkPolCard .polsymvoet{padding:0 18px 14px; margin:0}
@media (max-width:380px){ .polrow{grid-template-columns:38px minmax(0,1fr) minmax(0,auto)} .polrow .polrang{display:none} }
@media (max-width:359px){ .polkern.rdhoofd{grid-template-columns:1fr} }
@media (hover:hover){ .polrow:hover,.polpos > summary:hover{background:var(--hl-bg)} .polbron:hover{text-decoration:underline} .polaandeel:hover{border-color:var(--accent)} }

/* v25.45 — paneel */
/* Rabi 3-9 (laat): sectie Pagina's bovenaan het ≡-kanalenpaneel. De kop "Pagina's" is een gewone .pgkop (zonder data-groep, dus
   niet inklapbaar) en de rijen zijn de bestaande .drawerrij — dezelfde hoogte, tag rechts, de naam wordt niet afgeknipt op 320 px.
   Alleen een scheidslijn ónder de sectie (spiegel van .drawermeer bovenaan), via tokens dus dark en licht hetzelfde. */
.drawerpaginas{border-bottom:1px solid var(--line); padding-bottom:8px}
#kanaalPaneel .drawerpaginas{border-bottom:1px solid var(--line); padding-bottom:8px}
#kanaalPaneel .drawerpaginas .krij .kopen .khash{min-width:18px} /* de tekstglyfen ⌕ ★ ◔ ▦ ⇄ staan even breed als de emoji-rijen */
/* v25.45 — koppelingen crypto: de kaart Brokerkoppeling met Bitvavo en Coinbase. Het tekstvak voor de Coinbase private key of het
   sleutelbestand (een <input> slikt de regeleinden van een PEM in) krijgt dezelfde stijl als de invoervelden, monospace en verticaal
   te vergroten; de toelichting achter een label is gedempt. Geen hover-effect (alleen focus), 320 px bruikbaar via width:100% + box-sizing. */
.koppelvelden textarea{display:block; width:100%; box-sizing:border-box; padding:9px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--card); color:var(--ink); font:inherit; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; line-height:1.4; min-height:84px; resize:vertical; min-width:0}
.koppelvelden textarea:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.koppelvelden label .koppelsub{font-weight:400; color:var(--ink-3)}
.koppelfout.rechten{padding:8px 10px; border-radius:10px; background:var(--hl-bg); border-left:3px solid var(--bad)}
/* v25.45 — winst2 */
/* v25.45 (winst2, H14): het benaderingslabel in "Bekijk de berekening" — dezelfde waarschuwingsstijl als de andere ≈-noten, iets
   compacter, en de lichte kostprijs-regel (aankoopkoers) leest als toelichting bij de koerswinst. 320 px: tekst wrapt, niets buiten beeld. */
.rekenbenader.winst2 p{margin:0}
.rekenbenader.winst2 b{overflow-wrap:anywhere}
/* v25.46 — klasse */
/* v25.46 (klasse, Rabi 3-9 nacht): de vermogensklasse staat los van de rendement-badge. Het chipje zónder ✓ (.lidbadge.klassealleen)
   heeft dezelfde maat en vorm als de badge, maar neutraal (geen groen/rood: het is geen rendement) met het goudkleurige label zoals
   naast de badge; in de feed vervalt het "· "-scheidingsteken vóór het label omdat er niets voor staat. De regel "Je vermogensklasse
   staat wel: …" onder de badge-reden op de kaart en in het Instellingen-sheet leest als toelichting. Dark + licht via de tokens;
   geen hover-effect; 320 px: het chipje wikkelt niet, de regel wel. */
.lidbadge.klassealleen{background:color-mix(in srgb, var(--gold) 10%, transparent); color:var(--gold); border:1px solid color-mix(in srgb, var(--gold) 40%, transparent)}
.lidbadge.klassealleen .badgeklasse{border-left:none; padding-left:0}
.lidbadge.klassealleen .badgeklasse::before{content:none}
.badgeklasseregel{margin-top:6px; color:var(--ink-2)}
.badgeklasseregel .klasselabel,.badgeklasseregel b{color:var(--gold); font-family:"Archivo",sans-serif}
.instbadge .badgeklasseregel{display:inline-block; margin-top:4px}

/* v25.46 — avg2 */
/* v25.46 (avg2, Rabi 4-9): de sectie "Privacy en gegevens" onderaan het Instellingen-sheet — drie rijen in de stijl van de
   instrij (tekst links, › rechts), als volle-breedte knoppen zonder kader; het hover-effect alleen op aanwijsapparaten; 320 px: de rijtekst wrapt. */
.instavgrijen{display:flex; flex-direction:column; margin-top:6px}
.instavgrij{display:flex; align-items:center; gap:10px; width:100%; min-height:44px; padding:8px 0; margin:0; background:none; border:none; border-top:1px solid var(--line); color:var(--ink); font:inherit; font-size:13.5px; text-align:left; cursor:pointer}
.instavgrij:first-child{border-top:none}
.instavgemo{flex:none; width:22px; text-align:center}
.instavgtekst{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; overflow-wrap:anywhere}
.instavgtekst b{font-weight:600}
.instavgtekst small{font-size:11.5px; color:var(--ink-3)}
.instavgpijl{flex:none; color:var(--ink-3); font-size:18px; line-height:1}
.instavgrij:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; border-radius:8px}
@media (hover:hover){ .instavgrij:hover .instavgtekst b{color:var(--accent)} .instavgrij:hover .instavgpijl{color:var(--ink)} }

/* v25.46 — winst3: gerealiseerd resultaat zichtbaar bij de grootboekregel, methode-regel en ijkpunt-label in "Bekijk de berekening" (tokens: dark + licht) */
.txregel .winst3regel{display:block; font-style:normal; font-size:11.5px; color:var(--good-text); margin-top:2px}
.txregel .winst3regel.neg{color:var(--bad-text)}
.txregel .winst3regel.ijk{color:var(--ink-3)}
.rekenmodal .winst3methode{margin:6px 0 2px}
.rekenmodal .winst3kruis{display:block; margin-top:4px; opacity:.85}
.rekenbenader.winst3ijk{margin-top:8px}
@media (max-width:340px){ .txregel .winst3regel{font-size:11px} }
/* v25.46 — menu: ≡ op elke pagina, tabbalk zoals Stocktwits (vijf gelijke tabs, lijn-icoon boven label, geen ＋ in het midden), de ＋
   als zwevende ronde knop rechtsonder (alleen Feed · Portefeuille · Watchlist). Tokens voor dark én licht (geen hex-kleuren; wit
   alleen op de gekleurde ＋); muis-effecten alleen in de hover-media-query; safe-area onderaan; 320 px zonder h-scroll (vijf tabs van 1fr). */
/* A) de ≡-knop in elke kop: 44 px tikvlak, dezelfde vorm als de andere kopknoppen (kaart + lijn), groene ongelezen-stip */
.menuknop{width:44px; height:44px; min-width:44px; padding:0; border-radius:12px; font-size:21px; line-height:1; flex:none; position:relative; display:inline-flex; align-items:center; justify-content:center; background:var(--card); border:1px solid var(--line-2); color:var(--ink-2)}
.menuknop .menudot{top:-3px; right:-3px}
.dashhead .menuknop{width:44px; height:44px; font-size:21px} /* wint van de 320 px-regel voor .dashhead .iconbtn (zelfde specificiteit, later in het bestand) */
.dashhead > .menuknop + div{flex:1; min-width:0} /* de titel houdt de ruimte tussen ≡ en de knoppen rechts */
.viewhead .menuknop{margin-right:2px}
.tkkop .menuknop{margin-right:-2px}
@media (max-width:379px){ .tkkop .menuknop{width:44px; height:44px} .lpkop .menuknop{width:44px; height:44px} .dashhead .menuknop{margin-left:-6px} .dashhead .headright{gap:4px} } /* 320 px: de groet ("Hoi …") houdt ruimte naast ≡ en de vier kopknoppen */
@media (hover:hover){ .menuknop:hover{color:var(--ink); border-color:var(--line)} }
/* B1) tabbalk: vijf gelijke tabs, icoon boven label, actieve tab in de accentkleur; geen kaders of pillen */
.tabbar{grid-template-columns:repeat(5, minmax(0,1fr)); align-items:stretch; padding:6px 4px calc(8px + env(safe-area-inset-bottom)); gap:0}
.tabbar > button[data-tab]{gap:2px; padding:5px 0 3px; min-width:0; color:var(--ink-3); font:600 10.5px "IBM Plex Sans",sans-serif; -webkit-tap-highlight-color:transparent}
.tabbar > button[data-tab] .tico{display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; font-size:0; filter:none; opacity:1}
.tabbar > button[data-tab] .tico svg{width:24px; height:24px; display:block}
.tabbar > button[data-tab] .tlbl{max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:.01em}
.tabbar > button[data-tab].on{color:var(--accent)}
.tabbar > button[data-tab].on .tico svg{stroke-width:2.2}
.tabbar > button[data-tab] .tabdot{top:2px; right:calc(50% - 22px); left:auto; min-width:15px; height:15px; border-radius:8px; background:var(--bad); color:white; font:700 9.5px/15px "Archivo",sans-serif; padding:0 3px}
.tabbar > button[data-tab] .tabdot[hidden]{display:none}
.tabbar > button[data-tab="feed"] .tico,.tabbar > button[data-tab="ontdek"] .tico{font-size:0; font-weight:600} /* de oude emoji-/glyph-groottes uit v25.38 gelden niet meer (svg) */
@media (max-width:339px){ .tabbar > button[data-tab]{font-size:9.5px} }
@media (hover:hover){ .tabbar > button[data-tab]:hover{color:var(--ink)} .tabbar > button[data-tab].on:hover{color:var(--accent)} }
/* B2) de zwevende ＋ (#tabPlus.fab): 56 px, accentkleur, rechtsonder boven de tabbalk; weg zodra een laag open staat (paneel, sheet,
   ＋Transactie-venster, assistent, toetsenbord) */
.fab{position:fixed; right:16px; bottom:calc(76px + env(safe-area-inset-bottom)); z-index:44; width:56px; height:56px; border-radius:50%; border:none; cursor:pointer;
  background:var(--accent); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 72%, white), var(--accent)); color:white; font:700 30px/1 "Archivo",sans-serif; display:grid; place-items:center; padding:0 0 2px;
  box-shadow:0 10px 24px color-mix(in srgb, var(--accent) 38%, transparent), 0 2px 6px rgba(0,0,0,.25); transition:transform .15s ease, opacity .15s ease; -webkit-tap-highlight-color:transparent}
@supports not (background:color-mix(in srgb, red 50%, blue)){ .fab{box-shadow:0 10px 24px var(--accent-wash)} }
.fab[hidden]{display:none}
.fab:active{transform:scale(.94)}
.fab:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset:2px}
body:has(.drawer.on) .fab,body:has(#txOverlay:not([hidden])) .fab,body:has(#reisModal:not([hidden])) .fab,body:has(#rekenModal:not([hidden])) .fab,body:has(#dlgKaart) .fab,body.kbopen .fab,body.chatopen .fab{display:none}
/* ruimte onder de inhoud zodat de ＋ niets afdekt (kassaknop/heroacties onderaan het dashboard, het laatste bericht in de feed) */
body.fabaan #screen-home[data-view="feed"]{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
body.fabaan #screen-home[data-view="dash"],body.fabaan #screen-home[data-view="watchlist"]{padding-bottom:calc(150px + env(safe-area-inset-bottom))}
@media (min-width:560px){ .fab{right:max(16px, calc(50% - 260px))} } /* uitgelijnd met de rechterrand van de 520 px-tabbalk */
@media (min-width:960px){ .fab{right:max(16px, calc(50% - 600px))} } /* naast de brede dashboardkolom (1180 px), niet erover */
@media (hover:hover){ .fab:hover{filter:brightness(1.06)} }

/* v25.46 — assist */
/* v25.46 (assist, issue 46-K): label "toegekend" in de positieslijst (stukken uit een bedrijfsaandelenprogramma, aankoopwaarde € 0) —
   dezelfde chip als het crypto-label, gestippeld; de uitlegregel in de rijdetails wrapt en blijft binnen 320 px. Dark + licht via tokens. */
.pflabel.toegekendlabel{color:var(--ink-3); border-style:dotted; text-transform:lowercase; letter-spacing:.02em}
.pdetail .toegekendnote{display:block; flex-basis:100%; color:var(--ink-3); font-size:12px; line-height:1.45; overflow-wrap:anywhere}

/* v25.46 — kal4 */
/* v25.46 (kal4): kalender compacter en duidelijker (Rabi 3-9 nacht, Stocktwits Earnings als voorbeeld). Twee tabs; elke rij twee regels
   hoog — [logo 28] TICKER ☾︎ 12 % / naam · EPS 0,06 verw. links, rechts koers en dagverandering (bedrag + %, pijl), ⊕/✓ ernaast — geen pil,
   geen uitlegregel; compactere dagkaarten en weekstrook; maandweergave op Alle aandelen met alleen dagkaartjes. Alleen tokens (dark én
   licht), muis-effecten alleen in de hover-media-query, 320 px zonder h-scroll (naamregel met ellipsis, dagregel op één regel). */
.kalrij.kal4{grid-template-columns:minmax(0,1fr) auto; column-gap:8px; row-gap:0; padding:7px 0; align-items:center}
.kalrij.kal4 .atick.metlogo{min-width:0}
.kalrij.kal4 .atickt{display:flex; flex-direction:row; flex-wrap:wrap; align-items:baseline; column-gap:6px; row-gap:0; min-width:0}
.kalrij.kal4 .atickt b{order:0; font-size:14px; line-height:1.3}
.kalrij.kal4 .kalmeta{order:1; display:inline-flex; align-items:baseline; gap:6px; min-width:0; font-size:11px; line-height:1.3; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap}
.kalrij.kal4 .kalwhen{font-style:normal; font-size:12px; color:var(--ink-3); line-height:1}
.kalrij.kal4 .kalrel{font-size:11px; text-align:left; white-space:nowrap}
.kalrij.kal4 .kalrel.positie{color:var(--ink-2); font-weight:600}
.kalrij.kal4 .atickt i{order:2; flex:0 0 100%; max-width:none; font-size:12px; line-height:1.3; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.kalrij.kal4 .kalsuf{font-size:11.5px; color:var(--ink-3)}
.kalrij.kal4.verwacht .kalsuf{color:var(--ink-3)}
.kalrij.kal4 .kalkoers{max-width:none; gap:0}
.kalrij.kal4 .kalkoers .pprice{font-size:14px; line-height:1.3}
.kalrij.kal4 .kalkoers .pday{white-space:nowrap; line-height:1.3}
.kalrij.kal4 .kalkoers .wlsessie{display:inline; font-size:10.5px}
.kalrij.kal4 .kalkoers .wlext{display:none}
@media (min-width:960px){ .kalmaand .kalrij.kal4{grid-template-columns:minmax(0,1fr) auto; row-gap:0} .kalmaand .kalrij.kal4 .atickt i{max-width:none} }
@media (max-width:420px){ .kalrij.kal4{grid-template-columns:minmax(0,1fr) auto; row-gap:0} .kalrij.kal4 .kalkoers{max-width:none} .kalrij.kal4 .kalrel{text-align:left} .kalrij.kal4 .atick.metlogo{gap:8px} .kalrij.kal4 .kalkoers .pday{font-size:11.5px} .kalrij.kal4 .kalkoers .wlsessie{font-size:10px} }
@media (max-width:359px){ .kalrij.kal4 .kalkoers .pprice{font-size:13px} .kalrij.kal4 .kalkoers .pday{font-size:10.5px} .kalrij.kal4 .kalkoers .wlsessie{display:block; line-height:1.1} .kalrij.kal4 .atickt b{font-size:13px} .kalrij.kal4 .atick i{max-width:none} .kalrij.kal4 .kalrel{display:none} }
/* Dagkaarten en weekstrook compacter: minder padding, kleinere kop; compacte kaart = kop + één tickerregel. */
.kalview .kaldag{padding:7px 12px 3px; margin-bottom:8px; border-radius:14px}
.kalview .kaldagkop{padding-bottom:4px}
.kalview .kaldagkop b{font-size:13.5px}
.kalview .kaldag.compact{padding:7px 12px 6px}
.kalview .kaldag.compact .kaldagkop{padding-bottom:0}
.kalview .kaldagsub{padding:2px 0 0; font-size:11.5px; color:var(--ink-3)}
.kalview .kalrijwrap:last-of-type .kalrij.kal4{padding-bottom:5px}
.kalview .kalstrook{margin-bottom:8px}
.kalview .kalsdag{padding:5px 2px 4px; gap:0; border-radius:10px; line-height:1.15}
.kalview .kalsdag .kalsnr{font-size:15px}
.kalview .kalsdag .kalsn{font-size:10.5px}
.kalview .kaltypes{margin-bottom:8px}
.kalview .kalbalk{margin-bottom:6px}
/* Maandweergave op Alle aandelen: alleen dagkaartjes (kop met › en één tickerregel); de statusregel voor een ontbrekend venster erboven. */
.kalmaanden.kal4 .kaldag.kal4m{padding:6px 10px 6px; margin-bottom:6px}
.kalmaanden.kal4 .kaldag.kal4m .kaldagkop{cursor:pointer}
.kalmaanden.kal4 .kaldag.kal4m .kalchev{font-style:normal; margin-left:6px; color:var(--ink-3)}
.kalmaanden.kal4 .kaldag.kal4m .kaldagsub{cursor:pointer}
.kal4status{text-align:left; margin:0 0 10px}
/* Bewust geen muis-effect in deze sectie (tests/test-koppelingen-crypto-v2545.mjs leest de css vanaf zijn eigen kop tot het einde en eist er geen);
   het bestaande muis-gedrag van .kaldagsub en .kalchev (v25.45 kalender2, in de eigen media-query) geldt ook voor de maandkaartjes. */
/* v25.46 — nieuws-client */
/* De nieuwe Nieuws-pagina (#view-nieuws, Rabi 4-9 nacht, ontwerp "Nieuws in de app V4"): één component voor telefoon (één kolom,
   402 px referentie, 320 px zonder h-scroll) en desktop (vanaf 960 px hoofdkolom + rechterkolom via grid). Rubriekkleuren via
   tokens: cijfers groen (--good-text), analyse blauw (--nw-blauw), macro paars (--nw-paars), markt accent, redactie grijs; LIVE-tag rood
   (--bad). De twee nieuwe tokens staan in de :root-blokken bovenaan (dark, licht, automatisch). Alleen tokens, geen hex; muisaanwijzer-
   effecten uitsluitend in de hover-media-query; safe-area via .screen. */
#screen-home[data-view="nieuws"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="nieuws"] > section.card:not(#artikelCard){display:none !important}
body.artopen #view-nieuws{display:none !important} /* een open artikel (#/n/slug) ligt over de pagina; "‹ Alle artikelen" brengt hem terug */
.nwkop .nwmenuplek{display:none; width:38px; height:38px; flex:none} /* plek voor de ≡-knop van bouwer MENU */
.nwkop .nwmenuplek:not(:empty){display:block}
.nwkop .nwlivechip{flex:none; cursor:pointer; font:600 12.5px "IBM Plex Sans",sans-serif; background:var(--card)}
.nwzoek{margin-bottom:14px}
.nwzoek input{width:100%}
.nwsectie,.nwkaart{padding:14px 16px 12px; margin-bottom:14px; border-radius:18px}
.nwsectie .ontdekkop{margin:0 0 8px}
.nwsectie .ontdekkop span{flex:none; max-width:55%}
/* (1) portefeuillekaart */
.nwkaartkop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap}
.nwmarkt{font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.nwwaarde{display:block; font:800 32px/1.1 "Archivo",sans-serif; letter-spacing:-.02em; margin:8px 0 2px; font-variant-numeric:tabular-nums}
.nwdag{font:600 15px "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums}
.nwdag.up,.nwposrechts.up,.nwzonder .up,.nwbijdrage .up{color:var(--good-text)}
.nwdag.down,.nwposrechts.down,.nwzonder .down,.nwbijdrage .down{color:var(--bad-text)}
.nwdag.mut{color:var(--ink-3)}
.nwbijdrage{font-size:12.5px; color:var(--ink-2); margin-top:4px; font-variant-numeric:tabular-nums}
.nwbijdrage b{color:var(--ink)}
.nwdatum{font-size:10.5px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-3); margin:14px 0 6px}
.nwzinnen{margin:0; padding:0 0 0 18px; color:var(--ink); font-size:14.5px; line-height:1.5}
.nwzinnen li{margin:0 0 4px}
.nwonderschrift{font-size:11.5px; color:var(--ink-3); margin:10px 0 0; line-height:1.4}
/* skelet (jouw beursblog laadt) */
.nwskelet{display:flex; flex-direction:column; gap:8px; padding:6px 0 4px}
.nwskelet i{display:block; height:12px; border-radius:6px; background:var(--hl-bg); animation:nwpuls 1.2s ease-in-out infinite}
.nwskelet i.kort{width:55%}
@keyframes nwpuls{0%,100%{opacity:.55} 50%{opacity:1}}
@media (prefers-reduced-motion: reduce){ .nwskelet i{animation:none} }
/* blogkaart (jouw beursblog, beursblog-scherm, sheet) */
.nwblogkaart{padding:2px 0 4px}
.nwblogkaart + .nwblogkaart{border-top:1px solid var(--line); margin-top:10px; padding-top:12px}
.nwblogkaart.eigen{background:var(--stat-bg); border:1px solid var(--line); border-radius:14px; padding:12px 14px}
.nwblogmeta{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums; flex-wrap:wrap}
.nweigen{color:var(--gold)}
.nwlivetag{display:inline-block; font:800 9.5px/1 "Archivo",sans-serif; letter-spacing:.12em; color:white; background:var(--bad); padding:4px 6px 3px; border-radius:5px; vertical-align:middle}
.nwblogkop{font:800 17px/1.25 "Archivo",sans-serif; letter-spacing:-.01em; margin:6px 0 6px; color:var(--ink)}
.nwblogtekst{font-size:14px; line-height:1.55; color:var(--ink-2)}
.nwblogtekst p{margin:0 0 6px}
.nwblogtekst b{color:var(--ink)}
.nwblogtekst .nwbul{margin:0 0 6px; padding-left:18px}
.nwblogtekst .nwbul li{margin:0 0 3px}
.nwblogtekst .nwtag{font-weight:600}
.nwlink{display:inline-block; margin-top:6px; color:var(--accent); font-weight:600}
.nwweg{color:var(--bad-text); margin-top:2px}
/* (2) vandaag in jouw portefeuille · (6) watchlist — dezelfde rij */
.nwposlijst,.nwwllijst{display:flex; flex-direction:column}
.nwposrij,.nwwlrij{display:grid; grid-template-columns:10px minmax(0,1fr) auto; gap:10px; align-items:start; padding:10px 0; border-top:1px solid var(--line); color:var(--ink); text-decoration:none}
.nwposrij:first-child,.nwwlrij:first-child{border-top:none}
.nwstip{width:8px; height:8px; border-radius:50%; margin-top:6px; background:var(--ink-3)}
.nwstip.nwr-leeg{background:var(--line-2)}
.nwposmid{min-width:0; display:flex; flex-direction:column; gap:2px}
.nwposkop{display:flex; gap:6px; align-items:baseline; min-width:0}
.nwposkop b{font:800 14px "Archivo",sans-serif; letter-spacing:.01em; white-space:nowrap}
.nwposkop i{font-style:normal; font-size:12px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0}
.nwposkopregel{font-size:13.5px; line-height:1.35; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.nwposmeta{font-size:11.5px; color:var(--ink-3); display:flex; gap:4px; flex-wrap:wrap; align-items:center}
.nwposmeta em{font-style:normal; font-weight:600}
.nwkanaal{appearance:none; background:none; border:none; padding:0; font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--accent); cursor:pointer}
.nwposrechts{text-align:right; display:flex; flex-direction:column; gap:1px; font-variant-numeric:tabular-nums; white-space:nowrap}
.nwposrechts b{font-size:14px}
.nwposrechts i{font-style:normal; font-size:12px}
.nwposrechts.mut{color:var(--ink-3)}
.nwzonder{font-size:12.5px; color:var(--ink-3); margin:10px 0 0; line-height:1.6}
.nwzonder a{color:var(--ink-2); text-decoration:none; font-weight:600; white-space:nowrap}
.nwleeg{font-size:13px; color:var(--ink-3); margin:6px 0}
/* rubriekkleuren */
.nwr-cijfers{color:var(--good-text)} .nwstip.nwr-cijfers{background:var(--good)}
.nwr-analyse{color:var(--nw-blauw)} .nwstip.nwr-analyse{background:var(--nw-blauw)}
.nwr-macro{color:var(--nw-paars)} .nwstip.nwr-macro{background:var(--nw-paars)}
.nwr-markt{color:var(--accent)} .nwstip.nwr-markt{background:var(--accent)}
.nwr-redactie{color:var(--ink-2)} .nwstip.nwr-redactie{background:var(--ink-3)}
.nwr-aandeel{color:var(--gold)} .nwstip.nwr-aandeel{background:var(--gold)}
/* (3) van de redactie */
.nwfilters{margin:2px 0 6px; min-height:44px; align-items:center}
.nwfilters button{padding:9px 12px; font-size:12.5px; min-height:38px}
.nwlijst{display:flex; flex-direction:column}
.nwitem{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:start; padding:11px 0; border-top:1px solid var(--line); color:var(--ink); text-decoration:none; text-align:left; appearance:none; background:none; border-left:none; border-right:none; border-bottom:none; font:inherit; cursor:pointer; width:100%}
.nwitem:first-child{border-top:none}
.nwitemtxt{min-width:0; display:flex; flex-direction:column; gap:3px}
.nwitemmeta{display:flex; gap:6px; align-items:center; flex-wrap:wrap; font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.nwitemmeta em{font-style:normal; font-weight:600}
.nwchip{font:700 10.5px "Archivo",sans-serif; letter-spacing:.02em; color:var(--ink-2); background:var(--hl-bg); border:1px solid var(--line); border-radius:6px; padding:1px 5px}
.nwitemkop{font:700 15.5px/1.3 "Archivo",sans-serif; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.nwpositie{font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.nwthumb{width:64px; height:64px; object-fit:cover; border-radius:10px; flex:none}
.nwmeer{width:100%; margin:10px 0 2px}
/* (4) komt eraan */
.nwagenda{display:flex; flex-direction:column}
.nwagrij{display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px 0; border-top:1px solid var(--line)}
.nwagrij:first-child{border-top:none}
.nwagdag{display:flex; flex-direction:column; align-items:center; line-height:1.1}
.nwagdag b{font:800 16px "Archivo",sans-serif; font-variant-numeric:tabular-nums}
.nwagdag i{font-style:normal; font-size:10.5px; color:var(--ink-3); text-transform:lowercase}
.nwagmid{min-width:0; display:flex; flex-direction:column; gap:1px}
.nwagmid b{font-weight:600; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.nwagmid i{font-style:normal; font-size:12px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums}
.nwagchip{font:600 11px "IBM Plex Sans",sans-serif; padding:3px 8px; border-radius:999px; border:1px solid var(--line); color:var(--ink-2); white-space:nowrap}
.nwagchip.bezit{color:var(--good-text); background:rgba(52,201,142,.1); border-color:rgba(52,201,142,.3)}
.nwagchip.macro{color:var(--nw-paars); background:color-mix(in srgb, var(--nw-paars) 12%, transparent); border-color:color-mix(in srgb, var(--nw-paars) 35%, transparent)}
/* (5) leden */
.nwledenlijst{display:flex; flex-direction:column}
.nwlid{padding:10px 0; border-top:1px solid var(--line)}
.nwlid:first-child{border-top:none}
.nwlidkop{display:flex; gap:6px; align-items:center; flex-wrap:wrap; font-size:13px; color:var(--ink-2)}
.nwlidkop b{font:800 14px "Archivo",sans-serif; color:var(--ink)}
.nwlidtekst{margin:4px 0 6px; font-size:14px; line-height:1.45; color:var(--ink); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.nwlidvoet{display:flex; gap:6px; align-items:center; font-size:12px; color:var(--ink-3)}
.nwlidvoet .nwkanaal{margin-left:auto}
/* beursblog-scherm */
.nwlivekop{display:flex; align-items:center; gap:10px; margin-bottom:14px}
.nwlivelijst{background:var(--card); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow); padding:14px 16px}
.nwschrijf{width:100%; margin-top:14px}
/* sheet */
.nwsheetvlak{height:auto; max-height:80svh}
.nwsheetbody{padding:4px 18px calc(18px + env(safe-area-inset-bottom)); overflow:auto}
/* desktop: twee kolommen, dezelfde markup */
@media (min-width:960px){
  #screen-home[data-view="nieuws"]{max-width:1180px}
  .nwzoek{max-width:560px}
  .nwgrid{display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); column-gap:22px; align-items:start}
  .nwhoofd,.nwzij{min-width:0}
  .nwlive{max-width:760px}
}
/* 320 px: alles blijft binnen de kolom */
@media (max-width:359px){
  .nwwaarde{font-size:26px}
  .nwsectie .ontdekkop{flex-wrap:wrap}
  .nwsectie .ontdekkop span{max-width:100%; white-space:normal}
  .nwthumb{width:52px; height:52px}
  .nwkaartkop{flex-direction:column; gap:2px}
}
@media (hover:hover){ .nwposrij:hover,.nwwlrij:hover,.nwitem:hover{background:var(--hl-bg)} .nwkanaal:hover,.nwlink:hover,.nwzonder a:hover{text-decoration:underline} .nwkop .nwlivechip:hover{border-color:var(--accent); color:var(--ink)} }
/* v25.46 — beheer */
/* v25.46 (beheer, Rabi 4-9 nacht): het beheerdersdashboard (#view-beheer). Kaarten in een grid — telefoon één kolom, vanaf 760 px
   twee, vanaf 1180 px drie (Koppelingen en Assistent over de volle breedte). Alles via de thematokens (dark + licht), tabellen
   scrollen in hun eigen .bhscroll (nooit de pagina), teksten breken (overflow-wrap) zodat 320 px zonder h-scroll blijft; geen
   hover-effecten (alleen focus-visible — de knoppen werken op aanraking hetzelfde als met een muis); de status-stip krijgt
   --good/--bad/--gold, nooit een hard-coded kleur. */
/* Eigen scherm zoals Kalender/Politici: de dashboardkaarten, kop, tape en nieuwsbalk van #screen-home verdwijnen zolang data-view="beheer" staat. */
#screen-home[data-view="beheer"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="beheer"] > section.card{display:none !important}
@media (min-width:960px){ #screen-home[data-view="beheer"]{max-width:1280px} }
.bhview .bhverversen{cursor:pointer; flex:none; background:var(--card); color:var(--accent); border-color:var(--line-2)}
.bhview .bhverversen:disabled{opacity:.55; cursor:default}
.bhview .bhverversen:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.bhgrid{display:grid; grid-template-columns:1fr; gap:12px; margin-top:4px; min-width:0; align-items:start} /* v25.51 (nazorg 7, BEHEER3), bug B2: kaarten rekken niet meer mee met de hoogste kaart in hun rij (was stretch: 1100–3150 px witruimte) */
@media (min-width:760px){ .bhgrid{grid-template-columns:1fr 1fr} }
@media (min-width:1180px){ .bhgrid{grid-template-columns:repeat(3,1fr)} }
.bhkaart{padding:14px 16px 12px; min-width:0; overflow:hidden}
.bhkaart.breed{grid-column:1 / -1}
.bhkop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:8px; min-width:0}
.bhkop b{font-size:15px}
.bhkop span{font-size:11.5px; color:var(--ink-3); text-align:right; overflow-wrap:anywhere}
.bhstats{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,140px),1fr)); gap:8px; margin-bottom:8px; align-items:start} /* v25.51 (nazorg 7, BEHEER3), bug B5/B6: tegels minstens 140 px (was 96: cijfers braken midden in het getal) en niet meegerekt met een hoge buurtegel */
.bhstat{background:var(--stat-bg); border:1px solid var(--line); border-radius:12px; padding:8px 10px; display:flex; flex-direction:column; gap:2px; min-width:0}
.bhstat b{font-size:18px; font-variant-numeric:tabular-nums; overflow-wrap:normal; min-width:0} /* v25.51 (nazorg 7, BEHEER3), bug B5: nooit midden in een getal of woord breken (was anywhere: "12.330.00|0", "afwijkinge|n"); wikkelen op spaties blijft */
.bhstat.hoofd{border-color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, transparent)}
.bhstat span{font-size:11px; color:var(--ink-3); line-height:1.3; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere} /* v25.51 (nazorg 7, BEHEER3), bug B6: een lang label wordt hoogstens drie regels (tegelrijen van 111–142 px) */
.bhlijst{margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:6px; font-size:12.5px}
.bhlijst li{display:flex; gap:8px; align-items:baseline; min-width:0; overflow-wrap:anywhere; flex-wrap:wrap}
.bhlijst li>span:first-child{flex:1; min-width:0}
.bhlijst .bhtijd{color:var(--ink-3); font-size:11px; white-space:nowrap}
.bhrijen{display:flex; flex-direction:column}
.bhrij{display:flex; align-items:center; gap:8px; padding:7px 0; border-top:1px solid var(--line); font-size:12.5px; min-width:0}
.bhrij:first-child{border-top:none}
.bhrij .bhnaam{flex:1; min-width:0; overflow-wrap:anywhere}
.bhstip{width:9px; height:9px; border-radius:50%; flex:none; background:var(--ink-3)}
.bhstip.ok{background:var(--good)}
.bhstip.fout{background:var(--bad)}
.bhstip.bezig{background:var(--gold)}
.bhknop{appearance:none; cursor:pointer; font:inherit; font-size:12px; font-weight:600; padding:5px 10px; border-radius:999px; border:1px solid var(--line-2); background:var(--card); color:var(--ink-2); flex:none; white-space:nowrap}
.bhknop.uit{border-color:var(--bad); color:var(--bad-text)}
.bhknop:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.bhfout{font-size:12px; color:var(--bad-text); overflow-wrap:anywhere}
.bhleeg{font-size:12.5px; color:var(--ink-3); margin:4px 0; overflow-wrap:anywhere}
.bhcite{font-size:12.5px; padding:6px 0; border-top:1px solid var(--line); overflow-wrap:anywhere}
.bhcite i{display:block; font-style:normal; font-size:11px; color:var(--ink-3)}
.bhtabel{width:100%; border-collapse:collapse; font-size:12px; font-variant-numeric:tabular-nums}
.bhtabel td,.bhtabel th{padding:4px 6px; text-align:right; border-top:1px solid var(--line); white-space:nowrap; color:var(--ink-2)}
.bhtabel th{font-weight:600; color:var(--ink-3); font-size:11px}
.bhtabel td:first-child,.bhtabel th:first-child{text-align:left; white-space:normal; overflow-wrap:normal; min-width:7em; color:var(--ink)} /* v25.51 (nazorg 7, BEHEER3), bug B1: de eerste kolom mocht overal breken naast nowrap-kolommen → 1 letter breed, rijen van 300 px (Imports → onherkende bestanden); nu minstens 7em en alleen op spaties — de tabel scrolt in .bhscroll */
.bhtabel td i{font-style:normal; color:var(--ink-3)}
.bhscroll{overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%}
.bhgrafiek{margin:4px 0}
.bhgrafiek .rdgrafiek{width:100%; height:auto; display:block}
.bhveld{display:flex; gap:6px; margin-top:8px; min-width:0}
.bhveld input{flex:1; min-width:0; padding:7px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--input-bg); color:var(--ink); font:inherit; font-size:13px}
.bhveld input:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.bhchecks{display:flex; flex-wrap:wrap; gap:5px; margin-top:6px}
.bhcheck{font-size:11px; padding:2px 8px; border-radius:999px; border:1px solid var(--line); color:var(--ink-2); overflow-wrap:anywhere}
.bhcheck.fout{border-color:var(--bad); color:var(--bad-text)}
.bhstatus{margin:0 0 8px}

/* v25.46 — kal5 */
/* v25.46 (kal5): het kleine kenmerk voor de reden op marktrijen ("veel leden" / "groot" / "hot tech") — zelfde plek en maat als de
   weging bij bezit (.kalmeta, 11 px), iets lichter; op ≤ 359 px verbergt de kal4-regel .kalrel al. Tokens, geen id-selectors, geen muis-effect. */
.kalrij.kal4 .kalrel.markt, .kalrij.kal4 .kalrel.populair{color:var(--ink-3); font-weight:500; letter-spacing:.01em}

/* v25.46 — tabbalk: Nieuws in de tabbalk (Feed · Nieuws · Watchlist · Portefeuille · Meldingen), Ontdek via ≡ → Pagina's. De ≡-plek in de
   Nieuws-kop (#nwMenuPlek van NIEUWS-CLIENT: 38 px, verborgen zolang leeg) groeit mee met de 44 px-knop uit het menublok. */
.nwkop .nwmenuplek:not(:empty){display:inline-flex; align-items:center; width:auto; height:auto}
/* v25.47 — zoekbalk (Rabi 4-9 ochtend: "de zoekbalk is te dichtbij de eerstvolgende block"): op de Nieuws-pagina won `.searchwrap.grow{margin:0}`
   (twee klassen) het van `.nwzoek{margin-bottom:14px}` (één klasse), dus stond het zoekveld strak tegen de eerste kaart. Zelfde specificiteit,
   eigen regel: lucht onder het veld én een klein beetje boven (na de kop). Andere pagina's met .searchwrap.grow (Watchlist, Ontdek,
   aandelenpagina) hebben hun eigen v25.45-regels en blijven ongemoeid. */
.searchwrap.grow.nwzoek{margin:4px 0 16px}
/* v25.47 — kosten-oordeel (Rabi 4-9 ochtend): kostenpercentage t.o.v. de portefeuille onder de kaart Kosten & opbrengsten, met een oordeel
   in drie klassen (duur / precies goed / zeer sterk) via de bestaande kleurtokens; geen hover, wikkelt op 320 px. */
.krow.kratio{border-top:1px solid var(--line); margin-top:4px; padding-top:10px}
.krow b.kmid{color:var(--gold)}
.kostenoordeel{margin:6px 0 0; font-size:12.5px; line-height:1.4; color:var(--ink-2)}
.kostenoordeel.duur b{color:var(--bad-text)} .kostenoordeel.goed b{color:var(--gold)} .kostenoordeel.sterk b{color:var(--good-text)}
.kostenoordeel .kgrens{display:block; margin-top:2px; font-size:11.5px; color:var(--ink-3)}
/* v25.47 — kosten-impact (Rabi 4-9): de kostenregel is een knop (📈 grafiek ›), de kaart eronder tekent drie lijnen over 30 jaar in de
   stijl van "Als je zo doorgaat" (compoundcard); verschilkolommen in de tabel rood; 320 px: tabel scrollt in .tablewrap. */
.krow.kratio[role="button"]{cursor:pointer}
.krow.kratio .kiopen{margin-left:6px; font-size:11.5px; color:var(--accent); font-weight:600; white-space:nowrap}
.krow.kratio:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.kostenimpact .kiuitleg{margin:2px 0 6px}
.kostenimpact .cmptabel td{text-align:right; padding:6px 8px; border-bottom:1px solid var(--line); white-space:nowrap}
.kostenimpact .cmptabel th:first-child{text-align:left; color:var(--ink-2)}
.kostenimpact .cmptabel td.kneg{color:var(--bad-text)} .kostenimpact .cmptabel td.kmid{color:var(--ink-3)}

/* v25.47 — feed-onderruimte (feedrust, Rabi 4-9 screenshot: "te grote spatie onderin"): het feedscherm kreeg 74 px + safe-area
   ónder de lijst én daaronder stond de versieregel (.appversion, static) met nóg eens 74 px + safe-area — samen ± 230 px op een
   iPhone. De versieregel geeft de tabbalk al zijn ruimte; het scherm zelf houdt 12 px. De zwevende ＋ (56 px, 76 px boven de
   onderrand) valt rechts náást de actierij van de laatste kaart. */
#screen-home[data-view="feed"]{padding-bottom:12px}
/* Met de zwevende ＋ (body.fabaan, v25.46 menu) reserveerde de feed 140 px + safe-area zodat de knop nooit over de laatste kaart valt —
   dát was de grote spatie (140 + 74 + 2× safe-area). De knop (56 px, 76 px boven de onderrand) staat rechts; 36 px + de versieregel
   (± 93 px) houdt de actierij van de laatste kaart er links onder vandaan. */
body.fabaan #screen-home[data-view="feed"]{padding-bottom:calc(36px + env(safe-area-inset-bottom))}
/* v25.47 — t212zicht: de koppelstatus op de lege-staat-kaart */
.dashleeg .dashleegkoppel{margin:-2px 0 12px; font-size:13px; line-height:1.45; color:var(--ink-2)}
.dashleeg .dashleegkoppel[hidden]{display:none}

/* v25.47 — kal6 */
/* v25.47 (kal6, Rabi 4-9 ochtend: "taggen zodra het om cijfers gaat", "omzetverwachtingen erbij", "klantvriendelijker"): het tagje
   "Kwartaalcijfers · nabeurs" als klein kleurblokje mét de verwachting op een derde regel over de volle breedte van de rij (.kal6regel,
   grid-column 1 / -1, ingesprongen tot de tekst na het logo; tokens, dark + licht; op ≤ 359 px valt "· nabeurs" weg en vervalt de
   insprong, ☾︎/☀︎ in de eerste regel blijft), de uitlegregel onder een rij (.kal6uitleg, volle breedte in de
   .kalrijwrap-grid), dagkoppen "morgen"/"deze week" (.kalnu.kal6soon, rustiger dan "vandaag") en de eenmalige intro in de Kalender-kop
   (#kalIntro). */
.kalrij.kal4 .kal6tag{display:inline-flex; align-items:baseline; font:600 10.5px "IBM Plex Sans",sans-serif; line-height:1.45; padding:0 6px; border-radius:6px; white-space:nowrap; color:var(--accent); background:var(--accent-wash); letter-spacing:.01em; cursor:pointer; flex:0 0 auto}
.kalrij.kal4 .kal6tag.t-exdiv, .kalrij.kal4 .kal6tag.t-uitbetaling{color:var(--good-text); background:rgba(52,201,142,.13)}
.kalrij.kal4 .kal6tag .kal6tagw{font-weight:500; opacity:.85}
.kalrij.kal4 .kal6tag[aria-expanded="true"]{outline:1px solid currentColor; outline-offset:0}
.kalrij.kal4 .kal6regel{grid-column:1 / -1; display:flex; align-items:center; gap:7px; min-width:0; margin-top:1px; padding-left:37px; font-size:11.5px; line-height:1.3; color:var(--ink-3); white-space:nowrap; overflow:hidden}
.kalrij.kal4 .kal6regel .kalsuf{min-width:0; overflow:hidden; text-overflow:ellipsis; font-size:11.5px}
.kal6uitleg{grid-column:1 / -1; margin:0 0 7px; padding:7px 10px; border-radius:10px; background:var(--hl-bg); color:var(--ink-2); font-size:12px; line-height:1.45}
.kaldagkop .kalnu.kal6soon{color:var(--ink-3)}
.kal6intro{display:flex; align-items:flex-start; gap:8px; margin:0 0 8px; padding:8px 4px 8px 12px; border-radius:12px; background:var(--accent-wash); color:var(--ink-2); font-size:12.5px; line-height:1.45}
.kal6intro p{margin:0; flex:1 1 auto; min-width:0}
.kal6intro b{color:var(--ink); font-weight:600}
.kal6intro .kal6introsluit{flex:0 0 auto; width:32px; height:32px; margin:-4px 0; font-size:14px; color:var(--ink-3)}
.nwagrij[title] .nwagmid i{cursor:help}
@media (max-width:359px){ .kalrij.kal4 .kal6tag .kal6tagw{display:none} .kalrij.kal4 .kal6tag{font-size:10px; padding:0 5px} .kalrij.kal4 .kal6regel{padding-left:0; font-size:11px} .kal6intro{font-size:12px} }
/* Bewust geen muis-effect in deze sectie (de suites tabbalk-v2546/logos-v2544/kal5-v2546 lezen de css vanaf hun eigen kop tot het einde en eisen er geen); de tag en de ✕ hebben cursor:pointer en een duidelijke aria-expanded/aria-label. */

/* v25.47 — crypto2 */
/* v25.47 (crypto2, ledenmelding 4-9): een munt in de zoeklijst (kop-zoeker, watchlist) — label "munt" in de stijl van het crypto-label in de positieslijst
   (.pflabel.cryptolabel): gestippeld kader, kleine letters. Geen hover-regels (die staan al op .sres). */
.sres i.muntlabel{border:1px dashed var(--ink-3);border-radius:6px;padding:1px 6px;text-transform:lowercase;letter-spacing:.02em;font-size:10.5px;color:var(--ink-3)}

/* v25.47 — artikel */
/* v25.47 (artikel): Rabi 4-9 — ticker + koers als chipje achter de bedrijfsnaam bij de eerste vermelding, huisstijl-embeds
   native in de kaart (.artdb, kleuren via tokens → dark én licht), transparant sandbox-frame met linkregel voor de rest,
   geen coverfoto, voorspelbare tussenruimte (lege alinea's uit de blog vervallen; de CSS regelt de afstand). Geen hover-
   effecten (de chip is een gewone link); 320 px: de chip wikkelt als geheel mee, brede kaarten scrollen in hun eigen wrapper. */
.art2 #artBody a.art47-chip,.art2 h1 .art47-chip,.art2 .art2-intro .art47-chip{display:inline-flex; align-items:center; gap:5px; vertical-align:baseline; margin:0 2px 0 1px; padding:1px 8px 1px 7px; border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-bottom:1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-radius:999px; background:color-mix(in srgb, var(--accent) 8%, transparent); font:600 12px/1.5 "IBM Plex Sans",system-ui,sans-serif; color:var(--ink); text-decoration:none; white-space:nowrap; max-width:100%; font-variant-numeric:tabular-nums}
.art47-chip b{font-weight:700; color:var(--accent)}
.art47-chip .art47-px{color:var(--ink)}
.art47-chip .art47-dag{font-weight:600; color:var(--ink-2)}
.art47-chip .art47-dag.up{color:var(--good-text)} .art47-chip .art47-dag.down{color:var(--bad-text)} .art47-chip .art47-dag.mut{color:var(--ink-2)}
.art2 h1 .art47-chip{font-size:13px; vertical-align:middle; margin-left:4px}
/* huisstijl-kaarten en dashboards native */
.artdb{margin:6px 0 16px; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch}
.artdb > style{display:none}
.artdb-db .db{font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
.artdb-db .db{color:var(--ink)}
.art47-interactief{margin:8px 0 0 !important; font-size:12.5px !important; color:var(--ink-3) !important; text-align:center}
.art47-interactief a{font-weight:600}
/* sandbox-frame: transparant, minimaal de hoogte die de blog meegeeft, hoogstens 80 % van het scherm (dan scrolt het frame zelf) */
.art47-frame{max-height:80vh; background:transparent; margin-bottom:6px}
.art47-frame iframe{color-scheme:light; background:transparent}
.art47-framelink{margin:0 0 14px !important; font-size:12.5px !important; color:var(--ink-3) !important}
/* formattering: alinea boven een beeld/kaart/lijst ("In het kort:") dichter erop; bijschrift cursief; uitklaplijst met ruimte eronder */
.art2 #artBody p.art47-boven{margin-bottom:6px}
.art2-caption,.artfig figcaption{font-style:italic}
.art2 #artBody .artklap{margin:0 0 14px}
.art2 #artBody .artklap ul{margin-bottom:4px}
.art2 #artBody h2:first-child,.art2 #artBody .art2-intro + h2{margin-top:8px}
/* v25.47 — seo2 */
/* v25.47 (seo2): "🌐 Openbare pagina ›" en de link-knop (⧉) in de pillenrij van de koerskaart op de aandelenpagina — zelfde maat en
   vorm als de ⧉ Insluiten-knop (v25.42), altijd zichtbaar, zonder muiseffect (focus-ring via :focus-visible); op ≤ 479 px alleen de
   iconen zodat de rij op 320 px past. Tokens, geen id-selectors, geen vaste kleuren. */
.seo2rij{display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0}
.seo2knop{appearance:none; cursor:pointer; display:inline-flex; align-items:center; gap:2px; padding:4px 8px; border-radius:999px; border:1px solid var(--line-2); background:var(--card); color:var(--accent); font:600 11.5px "IBM Plex Sans",sans-serif; line-height:1.2; text-decoration:none; white-space:nowrap}
.seo2knop:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
@media (max-width:479px){ .seo2knop .seo2lang{display:none} .seo2knop{padding:4px 7px; font-size:12px} }

/* v25.48 — aandeel */
/* v25.48 (bugjacht B33): de ☆ in de kop van de aandelenpagina staat uit tot /api/ticker binnen is (dan is de valuta bekend) — gedempt, geen hover. */
.tkkop .wlbtn:disabled{opacity:.55; cursor:default}
/* v25.48 — beheer */
/* v25.48 (beheer, Rabi 4-9 middag: "daar klopt best veel niet — bekijk de design weer en maak het beter"): het dashboard is signaal-eerst
   (docs/chatdocs/ontwerp-beheer-v2548.md §4). Secties met een kleine, plakkende kop (sticky op de telefoon — je weet altijd waar je bent),
   het bestaande grid per sectie (1 / 2 / 3 kolommen; ≥ 1180 px grid-auto-flow:dense zodat er geen gaten vallen), tegels met een oordeel
   (✓ ! ✕ vóór het getal in --good-text / --gold / --bad-text, dus ook zonder kleur leesbaar), pijltjes (.bhdelta) t.o.v. de dagstand,
   status-stip 'verlopen' (goud), signalenlijst met Bekijk-/actieknoppen, gevaarlijke knoppen met een rode rand (.bhknop.gevaar), ingeklapte
   lange lijsten (details.bhklap), een skelet tijdens het laden (prefers-reduced-motion gerespecteerd) en een kaart die 1 s oplicht na
   'Bekijk' (.bhlicht). Alles via de thematokens (dark + licht), geen hard-coded kleuren, geen muiseffecten (zie de slotregel), 320 px
   zonder h-scroll (chips en knoppen wikkelen), onderaan 12 px + safe-area. */
.bhsecties{display:flex; flex-direction:column; gap:4px; min-width:0; padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.bhsectie{min-width:0}
.bhsectiekop{position:sticky; top:0; z-index:2; margin:0; padding:8px 2px 6px; background:var(--ground); letter-spacing:.14em; font-size:10.5px}
.bhsectie .bhgrid{margin-top:0; margin-bottom:8px}
@media (min-width:1180px){ .bhsectie .bhgrid{grid-auto-flow:dense} }
.bhkaart:focus{outline:none}
.bhkaart:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.bhkaart.bhlicht{box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 55%, transparent); transition:box-shadow .2s}
.bhkaart.toon-fout{border-color:var(--bad)} .bhkaart.toon-let{border-color:var(--gold)} .bhkaart.toon-ok{border-color:var(--good)}
.bhkaart.toon-fout .bhkop b{color:var(--bad-text)} .bhkaart.toon-let .bhkop b{color:var(--gold)} .bhkaart.toon-ok .bhkop b{color:var(--good-text)}
.bhstat b{font-size:20px}
.bhstat.goed{border-color:color-mix(in srgb, var(--good) 45%, transparent)} .bhstat.goed b::before{content:"✓ "; color:var(--good-text); font-size:13px}
.bhstat.let{border-color:var(--gold)} .bhstat.let b{color:var(--gold)} .bhstat.let b::before{content:"! "; font-size:13px}
.bhstat.fout{border-color:var(--bad)} .bhstat.fout b{color:var(--bad-text)} .bhstat.fout b::before{content:"✕ "; font-size:13px}
.bhstat .bhdelta{margin-top:1px}
.bhdelta{font-style:normal; font-size:11px; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap}
.bhdelta.slecht{color:var(--bad-text)} .bhdelta.goed{color:var(--good-text)}
.bhstip.verlopen{background:var(--gold); box-shadow:0 0 0 2px color-mix(in srgb, var(--gold) 35%, transparent)}
.bhsignalen li>span:first-child,.bhrondes li>span:first-child{flex:none} /* de stip blijft 9 px (de lijstregel geeft het eerste span anders flex:1) */
.bhsignalen li{align-items:flex-start; padding:6px 0; border-top:1px solid var(--line)}
.bhsignalen li:first-child{border-top:none}
.bhsignaal .bhstip{margin-top:5px}
.bhsigtekst,.bhronde .bhnaam{flex:1 1 0; min-width:0} /* stip + tekst altijd op één regel; de knoppen wikkelen op de telefoon naar een eigen regel */
@media (max-width:759px){ .bhsigknoppen{width:100%; justify-content:flex-end} }
.bhsigtekst{font-size:13px; color:var(--ink)}
.bhsigtekst .bhtijd{display:block; font-style:normal; white-space:normal; margin-top:1px}
.bhsigknoppen{display:flex; gap:6px; flex-wrap:wrap; flex:none}
.bhalles{color:var(--good-text); font-weight:600; font-size:13px}
.bhknop.gevaar{border-color:var(--bad); color:var(--bad-text)}
.bhknop:disabled{opacity:.55; cursor:default}
.bhlink{appearance:none; background:none; border:none; padding:0; font:inherit; color:var(--accent); cursor:pointer; text-decoration:underline; text-underline-offset:2px}
.bhlink:focus-visible{outline:2px solid var(--accent); outline-offset:1px; border-radius:4px}
.bhgrijs{color:var(--ink-3); font-style:normal; font-size:11.5px}
.bhok{color:var(--good-text)} .bhfouttekst{color:var(--bad-text)} .bhlet{color:var(--gold)}
.bhchip{display:inline-block; font-style:normal; font-size:10.5px; font-weight:600; padding:0 6px; border-radius:999px; border:1px solid var(--line-2); color:var(--ink-2); margin-left:3px; vertical-align:1px; white-space:nowrap}
.bhchip.goed{border-color:var(--good); color:var(--good-text)} .bhchip.fout{border-color:var(--bad); color:var(--bad-text)} .bhchip.let{border-color:var(--gold); color:var(--gold)}
.bhrij{align-items:flex-start; flex-wrap:wrap} .bhrij .bhstip{margin-top:5px} .bhrij .bhknop{margin-left:auto}
.bhrondes li{align-items:flex-start; padding:7px 0; border-top:1px solid var(--line)} .bhrondes li:first-child{border-top:none}
.bhronde .bhstip{margin-top:5px}
.bhsub{font-size:11.5px; color:var(--ink-3); margin-top:2px}
.bhslotrij{display:flex; flex-wrap:wrap; gap:4px; margin-top:4px}
.bhslot{font-size:11px; padding:1px 7px; border-radius:999px; border:1px solid var(--line-2); color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap}
.bhslot.aan{border-color:var(--good); color:var(--good-text)} .bhslot.mis{border-color:var(--bad); color:var(--bad-text)}
.bhslots li{padding:3px 0}
details.bhklap{margin-top:6px}
details.bhklap summary{cursor:pointer; font-size:12.5px; color:var(--accent); font-weight:600; list-style:none; padding:4px 0}
details.bhklap summary::-webkit-details-marker{display:none}
details.bhklap summary::before{content:"▸ "; display:inline-block; transition:transform .15s}
details.bhklap[open] summary::before{transform:rotate(90deg)}
details.bhklap summary:focus-visible{outline:2px solid var(--accent); outline-offset:1px; border-radius:4px}
.bhacties{margin-top:8px; display:flex; gap:6px; flex-wrap:wrap}
.bhskelet{opacity:.55; animation:bhpuls 1.4s ease-in-out infinite}
.bhskelet .bhkop b,.bhskelet .bhstat b,.bhskelet .bhstat span{display:block; background:var(--hl-bg); border-radius:6px; color:transparent; min-height:14px}
.bhskelet .bhkop b{width:40%}
@keyframes bhpuls{0%,100%{opacity:.55}50%{opacity:.8}}
@media (prefers-reduced-motion:reduce){ .bhskelet{animation:none} details.bhklap summary::before{transition:none} .bhkaart.bhlicht{transition:none} }
.bhoud{opacity:.6; transition:opacity .2s}
.bhview .viewsub.bhlet{color:var(--gold)}
.bhgrafiek{max-width:720px} /* de grafiek schaalt mee met de breedte (viewBox 640×220); in een brede kaart op 1280 px werd hij 430 px hoog */
@media (max-width:359px){ .bhstat b{font-size:17px} .bhrij .bhknop{margin-left:0} }
/* Bewust geen muis-effect in deze sectie (de suites tabbalk-v2546/logos-v2544/kal5-v2546/seo2-v2547 lezen de css vanaf hun eigen kop tot het einde en eisen er geen); knoppen en links hebben cursor:pointer en :focus-visible. */

/* v25.49 — openbaar-client */
/* v25.49 (CLIENT): de gedeelde portefeuille — live-regel, beurzenstrook, kaart Vandaag, dividendlijst, agenda- en kostenkaart. Alleen
   thematokens (dark én licht), geen id-selectors, geen muis-effect (de tabbalk-/seo2-suites lezen de css vanaf hun kop tot het einde en
   eisen er geen; ingelogde agenda-rijen erven .arow van het dashboard), prefers-reduced-motion zet de puls uit, 320 px blijft bruikbaar. */
.shlive{display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:12.5px; color:var(--ink-2); padding:6px 18px 4px}
.shlivedot{width:8px; height:8px; border-radius:50%; background:var(--ink-3); flex:none}
.shlive.open .shlivedot{background:var(--good-text); animation:obpuls 2s ease-in-out infinite}
.shlive.open{color:var(--ink)}
@keyframes obpuls{0%,100%{opacity:1} 50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){ .shlive.open .shlivedot{animation:none} }
.shlivenoot{font-size:11.5px; color:var(--ink-3)}
.sheigenaar{margin:0 18px 6px}
.shbeurzen{margin:0 0 4px; padding:2px 12px 8px; border-bottom:none}
.shbeurzen .wlbeurs{cursor:default}
.shvandaag .shvbig{font:800 34px "Archivo",sans-serif; font-variant-numeric:tabular-nums; padding:0 18px; line-height:1.15}
.shvbig.up{color:var(--good-text)} .shvbig.down{color:var(--bad-text)}
.shvandaag .herosub{padding:0 18px}
.shvandaag .chartsub{margin-top:6px}
.shdivlijst{display:flex; flex-direction:column; gap:6px; padding:0 18px 8px}
.shdivrij{display:grid; grid-template-columns:minmax(0,1fr) 96px auto; align-items:center; gap:8px; font-variant-numeric:tabular-nums; padding:4px 0}
.shdivrij.klikbaar{cursor:pointer}
.shdivrij .shdivl{min-width:0; display:flex; flex-direction:column}
.shdivrij .shdivl b{font-family:"Archivo",sans-serif; font-size:13.5px}
.shdivrij .shdivl i{font-style:normal; font-size:11.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.shdivrij .shdivbaan{display:block; height:7px; border-radius:4px; background:var(--line); overflow:hidden}
.shdivrij .shdivbaan i{display:block; height:7px; border-radius:4px; background:var(--gold)}
.shdivrij .shdivr{text-align:right; white-space:nowrap}
.shdivrij .shdivr b{font-size:13px; font-weight:600}
.shdivrij small{display:block; font-size:11px; color:var(--ink-3); font-weight:500}
@media (max-width:380px){ .shdivrij{grid-template-columns:minmax(0,1fr) 64px auto} }
.obleeg{font-size:12.5px; color:var(--ink-3); padding:6px 0 4px; line-height:1.45}
.agendarows div.arow{cursor:default}
.shagenda .atick .atickt{display:flex; flex-direction:column; min-width:0} /* zonder logochip (publiek pad) krijgt .atickt anders geen kolom-layout: ticker en naam liepen in elkaar */
.shagenda .arow .awhen{white-space:normal}
@media (max-width:520px){
  .shagenda .arow{grid-template-columns:78px minmax(0,1fr); grid-template-rows:auto auto; row-gap:2px}
  .shagenda .arow .acd, .shagenda .arow .abadge{grid-row:1 / span 2; align-self:center; padding:4px 6px}
  .shagenda .arow .atick{grid-column:2}
  .shagenda .arow .awhen{grid-column:2; text-align:left}
}
.shrow .pday .psessie{display:inline; margin-left:4px; font-size:11px; font-weight:500; color:var(--ink-3)} /* inline: het ›-chevron blijft op dezelfde regel */
.shsumchip.obchip{cursor:help}
/* v25.49 — openbaar-kaart */
/* De deelkaart-voorvertoning in de deelsheet (Portefeuille → 📤 Deel portefeuille): het beeld dat WhatsApp/X/LinkedIn bij de link tonen. Geen muis-effect (de suites lezen de css vanaf hun kop tot het einde); de knop erft .btn.ghost. */
.shkaartvb{margin:10px 0 4px}
.shkaartvb img{width:100%; border-radius:12px; border:1px solid var(--line); display:block; background:var(--card-2)}
.shkaartvb img[hidden]{display:none}
.shkaartvb figcaption{font-size:12px; color:var(--ink-3); margin:6px 0}
.shkaartvb .btn{margin-top:2px}

/* v25.48 — nazorg splitguard: eerlijke regel bij tegenstrijdige cijfers in "Wat is het waard?" (fcGuard) en de noot onder de uitkomst-tegels (fcGuardNoot: gelijkgetrokken na een splitsing / buiten het geloofwaardige bereik). Geen muis-effect. */
.fcguard{margin:4px 18px 12px; font-size:13px; line-height:1.5; color:var(--ink-2)}
.fcguardnoot{margin:0 18px 8px; color:var(--gold)}

/* v25.49 — artpub */
/* v25.49 (artpub): de knop ⤴ Delen in de kop van het artikel en de kaart "Over $NVDA" (het bedrijfsblok als ingesloten blok) eronder. Alleen tokens; geen muis-effect (de artikel-, politici- en tabbalk-suites lezen de css vanaf hun kop tot het einde en verbieden daar elk muis-effect) — toetsenbord via :focus-visible; ≤ 339 px alleen het ⤴-icoon. */
.art2-deel{margin-left:auto; border:1px solid var(--line-2); background:transparent; color:var(--ink); border-radius:999px; padding:6px 12px; font:600 12.5px "IBM Plex Sans",system-ui,sans-serif; cursor:pointer; white-space:nowrap; min-height:32px}
.art2-deel:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (max-width:339px){ .art2-deel span{display:none} .art2-deel{padding:6px 10px} }
.art2-bedrijf{margin:18px 0 0; padding-top:14px; border-top:1px solid var(--line)}
.art2-bedrijf-kop{display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; margin-bottom:10px}
.art2-bedrijf-kop b{font-family:"Archivo",sans-serif; font-size:17px; color:var(--ink)}
.art2-bedrijf-kop span{font-size:12.5px; color:var(--ink-3)}
.art2-bedrijf-frame{display:block; width:100%; height:900px; border:0; border-radius:14px; background:transparent; color-scheme:light dark}
.art2-bedrijf-knop{display:inline-block; margin-top:10px}
/* v25.49 — liveblog-client */
/* Het liveblog bovenaan Nieuws (sectie nwStroom; Rabi 4-9 17:50/17:55, twee screenshots: NU.nl-liveblog en FD-liveblog met embeds) in de huisstijl:
   rode kop met (pulserende) stip, tijdlijn met rode stip per bericht, rood tijdlabel, vet leadwoord, embeds als tabel/chip/minigrafiek/kaart.
   Alleen tokens (dark + licht via --bad, --bad-text, --good-text, --line, --stat-bg, --ink*, --card); geen muis-effecten (zie onderaan);
   320 px zonder h-scroll (Stijgers/Dalers onder elkaar < 380 px, €-kolom weg < 340 px); reduced-motion zonder puls. */
.nwstroom .lbkop b{display:flex; align-items:center; gap:8px; color:var(--bad-text)}
.lbstip{width:10px; height:10px; border-radius:50%; background:var(--bad); flex:none; opacity:.55}
.lbstip.aan{opacity:1; animation:lbpuls 1.6s ease-in-out infinite}
@keyframes lbpuls{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb, var(--bad) 45%, transparent)} 60%{box-shadow:0 0 0 7px transparent}}
.nwstroom .lbsub{font-size:12px; color:var(--ink-3); margin:-4px 0 8px}
.lblijst{position:relative; padding-left:22px}
.lblijst::before{content:""; position:absolute; left:4px; top:10px; bottom:10px; width:1px; background:var(--line)}
.lbitem{position:relative; padding:10px 0 12px; border-top:1px solid var(--line)}
.lbitem:first-child{border-top:none}
.lbitem[hidden]{display:none}
.lbmeta{display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.lbdot{position:absolute; left:-22px; top:14px; width:10px; height:10px; border-radius:50%; background:var(--bad); box-shadow:0 0 0 3px var(--card)}
.lbtijd{color:var(--bad-text); font-weight:700}
.lbwaarom{color:var(--ink-3)}
.lbtekst{font-size:14px; line-height:1.55; color:var(--ink-2); margin:4px 0 0}
.lbtekst .lblead,.lbart .lblead{color:var(--ink); font-weight:800}
.lbtekst p{margin:0 0 6px} .lbtekst .nwbul{margin:0 0 6px; padding-left:18px} .lbtekst .nwbul li{margin:0 0 3px} .lbtekst b{color:var(--ink)} .lbtekst .nwtag{font-weight:600}
.lbembed{margin-top:8px; background:var(--stat-bg); border:1px solid var(--line); border-radius:12px; padding:8px 10px}
.lbleeg{font-size:12.5px; color:var(--ink-3); margin:0}
.lbtabel{width:100%; table-layout:fixed; border-collapse:collapse; font-size:12.5px; font-variant-numeric:tabular-nums}
.lbtabel caption,.lbtabel th{text-align:left; font:700 11px "IBM Plex Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); padding:0 0 4px}
.lbtabel td{padding:4px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.lbtabel td a{color:var(--ink); text-decoration:none; font-weight:700} .lbtabel td a i{font-style:normal; font-weight:400; color:var(--ink-3)}
.lbtabel td:nth-child(2),.lbtabel td:nth-child(3){text-align:right; width:30%}
.lbpct.up{color:var(--good-text)} .lbpct.down{color:var(--bad-text)} .lbeff{color:var(--ink-2)}
.lbtwee{display:grid; grid-template-columns:1fr; gap:6px}
@media (min-width:380px){ .lbtwee{grid-template-columns:1fr 1fr; gap:12px} }
@media (max-width:339px){ .lbtabel td:nth-child(3){display:none} }
.lbtabel.lbidx th{width:64px; vertical-align:top; padding-top:5px} .lbtabel.lbidx td{white-space:normal; text-align:left; width:auto; line-height:1.5} .lbidx td b{font-weight:600; color:var(--ink)} /* .lbtabel.lbidx: zwaarder dan .lbtabel td:nth-child(2) (de cel is het tweede kind na de th) */
.lbidx td .up{color:var(--good-text)} .lbidx td .down{color:var(--bad-text)} .lbidx td .mut{color:var(--ink-3)}
.lbspark{display:inline-flex; align-items:center; gap:8px; margin:6px 8px 0 0; text-decoration:none; vertical-align:middle} .lbspark .spark{width:96px; height:30px} .lbspark i{font-style:normal; font-size:11px; color:var(--ink-3)}
.lbart{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; margin-top:6px; color:var(--ink); text-decoration:none}
.lbart .lbarttxt{min-width:0; display:flex; flex-direction:column; gap:3px; font-size:14px; line-height:1.5; color:var(--ink-2)}
.lbart .lbarttitel{font:700 14px/1.3 "Archivo",sans-serif; color:var(--ink); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.lbart i{font-style:normal; font-size:11.5px; color:var(--accent); font-weight:600} .lbart em{font-style:normal; font-size:12.5px; color:var(--ink-2); display:block}
.lbart img{width:56px; height:56px; object-fit:cover; border-radius:8px} .lbart img[hidden]{display:none}
.lbsector .lbsectorkop{display:block; font:700 11px "IBM Plex Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin-bottom:2px}
.lbchips{display:flex; flex-wrap:wrap; gap:0}
.lbknop{width:100%; margin-top:10px}
/* de bedrijfschip (art47) buiten een artikel: dezelfde opmaak als in de artikelkaart (die regels zijn aan .art2 gebonden) */
.nwstroom .art47-chip{display:inline-flex; align-items:center; gap:5px; vertical-align:baseline; margin:6px 6px 0 0; padding:1px 8px 1px 7px; border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-radius:999px; background:color-mix(in srgb, var(--accent) 8%, transparent); font:600 12px/1.5 "IBM Plex Sans",system-ui,sans-serif; color:var(--ink); text-decoration:none; white-space:nowrap; max-width:100%; font-variant-numeric:tabular-nums}
.nwstroom .art47-chip .art47-px[hidden],.nwstroom .art47-chip .art47-dag[hidden]{display:none}
/* Bewust geen muis-effect in deze sectie (de suites van v25.46–v25.49 lezen de css vanaf hun eigen kop tot het einde en eisen er geen; de chips en kaarten zijn gewone links, de knop erft .btn.ghost en .linkbtn houdt zijn bestaande muisgedrag). */
@media (prefers-reduced-motion: reduce){ .lbstip.aan{animation:none} }
/* v25.49 — beheertabs */
/* v25.49 (BEHEERTABS, Rabi 4-9 20:25 "de eerste versie vond ik beter, dus wellicht twee tabjes"): twee tabs op /beheer. De tabkiezer bouwt op
   .seg (dezelfde segmentknoppen als de periodekiezers in de app), over de volle breedte met twee even brede knoppen; de klassieke tab
   (.bkgrid) gebruikt het bestaande .bhgrid/.bhkaart-stelsel van v25.46 met de tegelmaat van de eerste versie (18 px) en onderaan dezelfde
   12 px + safe-area als de Signalen-tab; een "—"-tegel (niet meer bijgehouden sinds v25.48) staat gedempt met een stippelrand en de uitleg
   in title. Alles via de thematokens (dark + licht), geen muis-effect (de beheer-suites lezen de css vanaf hun kop tot het einde en eisen er
   geen), geen id-selectors, 320 px zonder h-scroll. */
.bhview .bktabs{width:100%; margin:2px 0 10px; box-sizing:border-box; min-width:0}
.bhview .bktabs button{flex:1 1 0; text-align:center; padding:8px 10px; font-size:13px; min-width:0; white-space:nowrap}
.bhview .bktabs button:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.bkgrid{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.bkgrid .bhstat b{font-size:18px}
.bkgrid .bhstat.bkweg{border-style:dashed}
.bkgrid .bhstat.bkweg b{color:var(--ink-3); font-weight:600}
.bkgrid .bhrij{align-items:center}
@media (max-width:359px){ .bkgrid .bhstat b{font-size:17px} .bhview .bktabs button{font-size:12px; padding:8px 6px} }
/* v25.48 — leegstaat nazorg: de regel "Er staan nog N bewaarde importbestanden … ↺ Herafleiden" in de lege staat (#leegBestanden op het importscherm, #dashLeegBestanden op de compacte kaart), in de kleur van de gele wisselbalk. Geen muis-effect (knop is .btn). */
.leegbestanden{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; background:rgba(232,185,60,.12);
  border:1px solid rgba(232,185,60,.5); border-radius:14px; padding:10px 14px; margin-bottom:12px; font-size:13px; line-height:1.5; text-align:left}
.leegbestanden .btn{margin-top:0}
.pffout-knoppen{display:flex; gap:8px; flex-wrap:wrap} /* de knoppen ↺ Herafleiden · Grootboek · Opnieuw proberen in de foutbalk (b2) */
/* v25.49 — ticker */
/* v25.49 (TICKER-CLIENT, Rabi 4-9 "$TICKER is één ding"): (1) de kop van het kanaal-component op de aandelenpagina (💬 Kanaal $TSLA · teller ·
   ● online · ⓘ · Alleen het kanaal ›); (2) het verhuisde #feedList in #tkFeed: de kaartlook die de pagina had (.tkfeed .post, v25.38) met de
   id-specificiteit van de #feedList-regels, en dezelfde chips/daglabels/NIEUW-lijn/meta als in het losse kanaal (kopie van de #feedHome #feedList-
   regels uit v25.38 feed; de kanaalchip komt in een tickerkanaal niet voor); (3) de klaprijen van de ≡-zoeker (▸ 2 andere noteringen · 2 hefboom-
   producten, labels notering/hefboom). Geen muis-effecten (de rijen erven de bestaande .sres-regel); alleen thematokens; 320 px: de kop wrapt. */
.tkkanaalkop{display:flex; align-items:center; gap:8px; padding:2px 0 8px; flex-wrap:wrap; min-width:0}
.tkkanaalkop > b{font:800 14px "Archivo",sans-serif; white-space:nowrap; color:var(--ink)}
.tkkanaalsub{color:var(--ink-3); font-size:12px; flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tkkanaalsub .kgroen{color:var(--good-text)}
.tkkanaalinfo{flex:none; width:28px; height:28px; min-width:28px; font-size:14px; line-height:1}
.tkkanaallos{color:var(--accent); font:600 12.5px "IBM Plex Sans",sans-serif; margin-left:auto; text-decoration:none; white-space:nowrap}
#tkFeed #feedList.feed{padding:0; gap:8px}
#tkFeed #feedList .post.fkaart{display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px; align-items:start; margin:0; padding:12px; background:var(--stat-bg); border:1px solid var(--line); border-radius:16px}
#tkFeed #feedList .post.fkaart.ann{background:var(--stat-bg); border:1px solid var(--line); border-radius:16px; padding:12px; margin:0}
#tkFeed #feedList .post.fkaart.genoemd{border-left:2px solid var(--gold)}
#tkFeed #feedList .post.fkaart.pending{opacity:.55}
#tkFeed #feedList .datumscheiding{margin:10px 0 0; font:600 10.5px "IBM Plex Sans",sans-serif; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); gap:10px}
#tkFeed #feedList .datumscheiding::before,#tkFeed #feedList .datumscheiding::after{background:var(--line)}
#tkFeed #feedList .nieuwlijn{margin:4px 0}
#tkFeed #feedList .ouderknop{margin:0 auto 4px}
#tkFeed #feedList .welkomkaart{margin:0 0 4px}
#tkFeed #feedList .fkaart .pmeta{display:flex; align-items:baseline; gap:6px; row-gap:2px; flex-wrap:wrap; font-size:11px; color:var(--ink-3); min-height:21px}
#tkFeed #feedList .fkaart .pname{font:700 14px "IBM Plex Sans",sans-serif; color:var(--ink); text-decoration:none}
#tkFeed #feedList .fkaart .pname.mijn{color:var(--accent)}
#tkFeed #feedList .fkaart .pname.redactie{color:var(--gold)}
#tkFeed #feedList .fkaart .ptijd{font-size:11px; color:var(--ink-3); white-space:nowrap}
#tkFeed #feedList .fkaart .badgeplek{display:inline-flex; height:18px; align-items:center}
#tkFeed #feedList .fkaart .badgeplek:empty{display:none}
#tkFeed #feedList .fkaart .lidbadge{margin-left:0; height:18px; line-height:16px; padding:0 6px}
#tkFeed #feedList .fkaart .symchip{display:inline-flex; align-items:center; gap:5px; margin:0; font:700 11px "Archivo",sans-serif; padding:0 7px; height:18px; border-radius:999px; background:var(--hl-bg); border:1px solid var(--line); color:var(--ink); text-decoration:none}
#tkFeed #feedList .fkaart .symchip i{width:7px; height:7px; border-radius:50%; display:inline-block; flex:none}
#tkFeed #feedList .fkaart .bewerkt{font-size:10.5px; font-style:italic; color:var(--ink-3)}
#tkFeed #feedList .fkaart .pinbadge{border:none; padding:0; font-size:11px}
#tkFeed #feedList .fkaart .replytag{height:16px; line-height:14px; padding:0 6px}
#tkFeed #feedList .fkaart .realname{border:none; background:transparent; color:var(--ink-3); font-size:11px; padding:0; cursor:help}
#tkFeed #feedList .fkaart .pmeta .sinceline{display:inline; margin:0; padding:0; border:none; background:transparent; font:500 10.5px "IBM Plex Sans",sans-serif; color:var(--ink-3); white-space:nowrap}
#tkFeed #feedList .fkaart .pmeta .sinceline b{font:700 10.5px "Archivo",sans-serif}
#tkFeed #feedList .fkaart .pmeta .sinceline.up b{color:var(--good-text)} #tkFeed #feedList .fkaart .pmeta .sinceline.down b{color:var(--bad-text)}
#tkFeed #feedList .fkaart .replyctx{margin:2px 0 2px}
#tkFeed #feedList .fkaart .ptitel{margin:2px 0 0; font:700 14px/1.4 "IBM Plex Sans",sans-serif; color:var(--ink); overflow-wrap:anywhere}
#tkFeed #feedList .fkaart .pbody > p{margin:1px 0 0; font-size:14px; line-height:1.5; color:color-mix(in srgb, var(--ink) 88%, var(--ink-2)); overflow-wrap:anywhere}
#tkFeed #feedList .fkaart .pbody > p.jumbo{font-size:40px; line-height:1.2}
#tkFeed #feedList .redactiekaart .samenvatting{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
#tkFeed #feedList .redactiekaart .leesrij{display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:8px}
#tkFeed #feedList .fkaart .reactiechip{font:600 11.5px "IBM Plex Sans",sans-serif; padding:3px 8px; border-radius:7px; border:1px solid var(--line-2); background:var(--stat-bg); color:var(--ink)}
#tkFeed #feedList .fkaart .reactiechip.mijn{border-color:color-mix(in srgb, var(--accent) 55%, transparent); background:var(--accent-wash)}
#tkFeed #feedList .fkaart .hovacts{display:flex; position:static; margin:0; padding:0; gap:2px; background:transparent; border:none; box-shadow:none}
#tkFeed #feedList .fkaart .hovacts button{width:26px; height:24px; border-radius:7px; font-size:13px; color:var(--ink-3); opacity:1}
#tkFeed #feedList .fkaart .hovacts button.antwoorden{width:auto; height:auto; padding:3px 8px; font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--ink-2); line-height:1.5; white-space:nowrap}
#tkFeed #feedList .fkaart .qpost .sinceline{margin-top:8px}
#tkFeed #feedList .bkinline .post.fkaart{grid-template-columns:28px minmax(0,1fr); gap:8px; padding:8px 0 4px; border:none; background:transparent; border-radius:0}
#tkFeed #feedList .bkinline .pavatar.init{width:28px; height:28px; min-width:28px; font-size:11px}
#tkFeed #feedList .feedempty{padding:10px 4px}
.sres.kzmeer{display:block; color:var(--ink-3); font-size:12px; padding:6px 14px}
.kzandere .sres{padding-left:26px; background:var(--stat-bg)}
.kzsoort{font-style:normal; border:1px dashed var(--ink-3); border-radius:6px; padding:0 5px}

/* v25.49 — waardering */
/* v25.49 (WD-CLIENT, waardering): de kaart "De Belegger-analyse" op Kerncijfers — badge, verzoeningsregel, In het kort, het rekenmodel (tabs Bull · Base · Bear · Jouw scenario, vier schuifjes met precisieveld, neutrale uitkomsttegels via .fcuit, bandbreedte-balk, 3×3-gevoeligheid), tien inklapbare delen, bronnen, woordenlijst, voet met meldknop, de pil "Analyse ›" en het puntje op de tab Kerncijfers. Alleen thematokens; geen muis-effect (de suites lezen de css tot het einde) — toetsenbord via :focus-visible; 320 px in één kolom; prefers-reduced-motion = geen overgang. */
.wdkaart .wdverzoen{margin-top:2px}
.wdstatus{padding:0 18px 4px; font-size:13.5px; line-height:1.5; color:var(--ink-2)}
.wdstatus p{margin:4px 0 8px}
.wdstatus .fcneem{color:var(--accent); font-weight:600; padding:2px 0}
.wdstatus .wdfase{font-size:12px; color:var(--ink-3)}
.wdstatus:empty{display:none}
.wdskelet{display:flex; flex-direction:column; gap:8px; padding:4px 18px 12px}
.wdskelet i{display:block; height:12px; border-radius:6px; background:var(--line); animation:wdpuls 1.4s ease-in-out infinite}
.wdskelet i:nth-child(2){width:86%} .wdskelet i:nth-child(3){width:64%}
@keyframes wdpuls{0%,100%{opacity:1} 50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){ .wdskelet i{animation:none} }
.wdinhoud[hidden],.wdvoetblok[hidden],.wdmodel[hidden],.wdmeldkeuze[hidden],.wdnoot[hidden],.wdvaluta[hidden],.wdlynch[hidden]{display:none}
.wdkort{list-style:none; margin:4px 0 6px; padding:0 18px; display:flex; flex-direction:column; gap:6px}
.wdkort li{display:grid; grid-template-columns:118px minmax(0,1fr); gap:2px 10px; font-size:13.5px; line-height:1.45; color:var(--ink)}
.wdkort li b{font-size:10.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); padding-top:3px}
.wdlynchtag{font-style:normal; font-weight:600; color:var(--accent)}
.wdmodel{margin:6px 12px 10px; padding:0 6px 8px; border:1px solid var(--line); border-radius:14px; background:var(--card-2)}
.wdmodel .wdmodelkop{padding:12px 12px 2px; gap:6px 10px}
.wdmodel .wdmodelkop .pill{font-size:11px; padding:3px 9px}
.wdhint,.wdnoot,.wdvaluta,.wdlynch,.wdafstand{margin:4px 12px 8px; font-size:12.5px; line-height:1.45; color:var(--ink-2)}
.wdnoot{color:var(--gold)}
.wdafstand{color:var(--ink); font-size:13px}
.wdmodel .wdtabs{margin:4px 12px 10px; width:auto; flex-wrap:wrap}
.wdmodel .wdtabs button{display:inline-flex; align-items:center; gap:7px; flex:1 1 auto; justify-content:center}
.wdmodel .wdtabs button i{display:inline-block; width:14px; height:3px; border-radius:2px; flex:none}
.wdmodel .wdtabs button[hidden]{display:none}
.wdschuiven{display:grid; grid-template-columns:1fr 1fr; gap:10px 14px; margin:0 12px 6px}
.wdschuif{display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-weight:600; color:var(--ink-2)}
.wdschuif label{margin:0; font-size:12.5px; font-weight:600; letter-spacing:0; text-transform:none; color:var(--ink-2); line-height:1.3}
.wdschuifrij{display:grid; grid-template-columns:minmax(0,1fr) 3.6em auto; align-items:center; gap:8px}
.wdschuifrij input[type=range]{width:100%; margin:0; padding:0; border:none; background:transparent; accent-color:var(--accent); height:28px; min-width:0} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.wdschuifrij input[type=range]:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.wdschuifrij output{font-variant-numeric:tabular-nums; font-size:13px; color:var(--ink); text-align:right; white-space:nowrap}
.wdschuifrij .fcveld input{max-width:5.2em; padding:5px 7px; font-size:13.5px}
.wdmodel .fchint{font-weight:500}
.wdmodel .wdgt{margin:0 12px 6px}
.wdmodel .fcacties{margin:0 12px 6px}
.wdmodel .tkstats.fcuit.wduit{padding:0 12px 8px; grid-template-columns:1fr 1fr}
@media (min-width:640px){ .wdmodel .tkstats.fcuit.wduit{grid-template-columns:repeat(3,1fr)} }
.wduit .stat b{color:var(--ink)}
.wduit .stat b.unk{font-family:"IBM Plex Sans",sans-serif; font-size:11.5px; font-weight:600; color:var(--ink-2); line-height:1.35}
.wdbandbox{margin:6px 6px 0}
.wdbandbox svg text{fill:var(--ink-3)}
.wdbandbox svg .wdas{stroke:var(--line-2); stroke-width:1}
.wdbandbox svg .wdkoers{stroke:var(--ink); stroke-width:2; stroke-dasharray:4 3}
.wdbandbox svg .wdkoerslbl{fill:var(--ink); font-weight:600}
.wdbandbox svg .wdseg{opacity:.85}
.wdbandleg{display:flex; flex-wrap:wrap; gap:4px 16px; margin:2px 12px 8px; font-size:12px; color:var(--ink-2); font-variant-numeric:tabular-nums}
.wdbandleg .wdlg{display:inline-flex; align-items:center; white-space:nowrap}
.wdbandleg .wdkoerssw{background:var(--ink); height:2px}
.wdmodel .tablewrap{padding:0 6px 4px}
.wdgevoelig td b{font-weight:700; color:var(--ink)}
.wdgevoelig th:first-child{font-weight:500; white-space:normal}
.wdsecties{margin:8px 12px 4px}
.wdsectie{margin:0 0 8px}
.wdsectie summary{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:13.5px; line-height:1.35}
.wdsectie summary .pill{font-size:10.5px; padding:2px 8px}
.wdsectie summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.wdtekst{font-size:13.5px; line-height:1.55; color:var(--ink); margin-top:8px}
.wdtekst p{margin:0 0 8px}
.wdtekst ul{margin:0 0 8px; padding-left:18px}
.wdtekst li{margin:0 0 3px}
.wdtekst sup a{color:var(--accent); text-decoration:none; font-size:10px; padding:0 1px}
.wdtekst .wdtabel th,.wdtekst .wdtabel td{text-align:left; white-space:normal; vertical-align:top}
.wdtekst .wdtabel td:nth-child(2){font-weight:500}
.wdscnintro{font-size:12.5px; color:var(--ink-2); margin:6px 0 2px}
.wdscntabel td:first-child{white-space:nowrap}
.wdscntabel th .fcsw{margin:0 5px 2px 0}
.wdscntabel tr.wdreden td{font-size:11.5px; color:var(--ink-3); white-space:normal; vertical-align:top; min-width:120px}
.wdscntabel tr.wdreden td:first-child{min-width:0}
.wdpeers td:first-child small{color:var(--ink-3); font-weight:500; margin-left:4px}
.wdpeers tr.wdmediaan td{font-weight:600; border-top:1px solid var(--line)}
.wdpeersnoot{margin:2px 0 6px}
.wdbron{font-size:11.5px; line-height:1.45; color:var(--ink-3); margin:6px 0 0; overflow-wrap:anywhere}
.wdklap{margin:0 12px 8px}
.wdklap summary{font-size:13.5px}
.wdklap summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.wdbronlijst{margin:8px 0 0; padding-left:0; list-style:none; font-size:12.5px; line-height:1.5; color:var(--ink-2)}
.wdbronlijst li{margin:0 0 4px; overflow-wrap:anywhere}
.wdbronlijst .wdbronnr{color:var(--ink-3); font-variant-numeric:tabular-nums}
.wdbronlijst a{color:var(--accent); text-decoration:none}
.wdbronlijst a:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.wdwoorden{margin:8px 0 0; font-size:12.5px; line-height:1.5}
.wdwoorden dt{font-weight:600; color:var(--ink); margin-top:6px}
.wdwoorden dd{margin:0; color:var(--ink-2)}
.wdvoetblok{padding-bottom:6px}
.wdvoet{color:var(--ink-3)}
.wdafzender{margin-top:6px}
.wdmeldrij{margin-top:4px}
.wdmeldrij .linkbtn{color:var(--accent); font-weight:600; font-size:12px; padding:2px 0}
.wdmeldkeuze{display:flex; flex-wrap:wrap; gap:6px; margin:4px 18px 8px; align-items:center}
.wdmeldkeuze .wdmeldvraag{flex-basis:100%; font-size:12.5px; color:var(--ink-2)}
.wdmeldkeuze .pill{cursor:pointer; background:transparent; font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--ink-2)}
.wdmeldkeuze .pill:focus-visible,.wdmeldrij .linkbtn:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.wdpil{appearance:none; cursor:pointer; font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--accent); background:var(--card); line-height:1.2}
.wdpil:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.tkviewbar .tktabs button{position:relative}
.tkviewbar .tktabs button.tkview-nieuw::after{content:""; position:absolute; top:6px; right:8px; width:7px; height:7px; border-radius:50%; background:var(--accent)}
@media (max-width:355px){
  .wdschuiven{grid-template-columns:1fr}
  .wdkort li{grid-template-columns:1fr}
  .wdmodel .tkstats.fcuit.wduit{grid-template-columns:1fr}
  .wdschuifrij{grid-template-columns:minmax(0,1fr) auto}
  .wdschuifrij output{display:none}
}
@media (prefers-reduced-motion:reduce){ .wdmodel .wdtabs button,.wdmeldkeuze .pill{transition:none} }

/* v25.49 — wd-publiek: de kaart Analyse in /beheer (De Belegger-analyse). Rijen met knoppen (laagste scores, wachtrij, meldingen)
   breken op 320 px netjes onder elkaar; de vrije symboolrij hergebruikt .bhveld. Alleen tokens, geen muis-effect (het dashboard heeft er geen). */
.bhwdrij{flex-wrap:wrap}
.bhwdrij>span:first-child{flex:1 1 160px; min-width:0}
.bhwdrij .bhsigknoppen{flex:0 0 auto; margin-left:auto}
.bhwdvrij{flex-wrap:wrap; align-items:center}
.bhwdvrij input{flex:1 1 140px}
.bhwdvrij .bhsigknoppen{flex:0 0 auto}
@media (max-width:359px){ .bhwdvrij .bhsigknoppen, .bhwdrij .bhsigknoppen{width:100%; margin-left:0; justify-content:flex-end} }
/* v25.49 — leegstaat3 */
/* v25.49 (LEEGSTAAT3): de regel "Je hebt deze portefeuille op … leeggemaakt … ↩ Terugzetten" (zelfde vorm als .leegbestanden, rustiger tint — het is geen
   waarschuwing), de knoppen erin, de knop ↩ Terugzetten in portefeuillebeheer en de knoppenrij Grootboek · ＋ Transactie van het gesloten grootboek.
   Geen muis-effecten (de knoppen erven .btn); alleen thematokens/rgba, dus dark én licht; 320 px: alles wrapt. */
.leegbewust{background:var(--accent-wash); border-color:var(--accent-lijn)} /* v25.52 (HUISSTIJL2): lichtblauw uit de tokens (was los rgba) */
.leegbewust-knoppen{display:flex; gap:8px; flex-wrap:wrap}
.leegbewust .btn{margin-top:0}
.pfterug{width:100%; margin-top:8px; text-align:left}
.boekleeg .boekknoppen{display:flex; gap:8px; flex-wrap:wrap; margin-top:10px}
.boekleeg .boekknoppen .btn{margin-top:0}

/* v25.48 — nazorg 3 verwijderen */
/* v25.48 (VERWIJDEREN, nazorg 3 — audit E): gepauzeerde brokerkoppeling (portefeuille van dat nummer verwijderd) — gouden stip, de ledenzin in een neutrale kleur (geen fout), knop "Weer aanzetten" */
.koppeldot.gepauzeerd{background:var(--gold)}
.koppelfouttekst.koppelpauze{color:var(--ink-2)}
/* v25.49 — community */
/* v25.49 (NZ4-COMMUNITY): het menupunt "Openbaar delen" dat niet kan (reactie, dicht kanaal) staat uitgeschakeld in het ⋯-menu — alleen tokens, geen muis-effect (het menu heeft er geen); dark én licht. */
.bmenuvlak .plusitem:disabled{opacity:.55; cursor:default}
/* v25.49 — privacy */
/* v25.49 (NZ4-PRIVACY): de sectorrijen op een ledenprofiel bij "Alleen sectoren" — eigen klasse (geen .lpweging: die is klikbaar en heeft een muis-effect), zelfde raster als de wegingsrijen, sectornaam mag breder */
.lpsector{display:grid;grid-template-columns:minmax(96px,1.4fr) 1fr 52px;gap:10px;align-items:center;color:var(--ink);font:inherit;min-height:24px}
.lpsector b{font:600 12.5px "IBM Plex Sans",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:359px){ .lpsector{grid-template-columns:minmax(84px,1.3fr) 1fr 44px;gap:8px} }
/* v25.49 — prestatie2 */
/* Prestatie-kaart: schakelaar Mandje/Rekening (kaartkop + prestatiescherm), uitlegregel, chip Vandaag, live-stip, flits, tekenanimatie.
   Rabi 5-9: keuze tussen de koersbeweging van je posities (Mandje) en wat je rekening echt deed (Rekening); vandaag in de grafiek;
   interactiever, meer live en speelser — zonder confetti, geluid of beloften. Alleen thematokens; geen aanwijs-effecten (tik-eerst); reduced-motion = stil. */
.prestseg{display:inline-flex; flex:none; width:auto; padding:2px; gap:2px; border:1px solid var(--line-2); border-radius:9px; background:var(--card-2, transparent)}
.prestseg button{appearance:none; border:0; background:transparent; color:var(--ink-2); font:inherit; font-size:11.5px; font-weight:600; padding:3px 8px; border-radius:7px; cursor:pointer; white-space:nowrap; min-height:24px; line-height:1}
.prestseg button.on{background:var(--accent-wash); color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent)}
.prestseg button .prestauto{font-style:normal; font-weight:500; font-size:9px; opacity:.85; margin-left:4px; letter-spacing:.02em; vertical-align:1px}
.prestseg button:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.prestsegrij{display:contents}
.prestsegrij[hidden]{display:none}
.histcard .cardhead .prestseg{margin-left:6px}
.prestvgrij{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.chartsub.prestuitleg{margin:6px 18px 0; color:var(--ink-2)}
.serieslegend .sl.prestvandaag i{border-top-style:dotted; border-top-color:var(--ink-3)}
.serieslegend .sl.prestvandaag.live i{border-top-color:var(--good-text)}
.chartbox:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:8px}
/* live-stip: pulseert zachtjes zolang er gehandeld wordt (beurs open, slot nog niet binnen, of voor-/nabeurs) */
.prestlive .prestpuls{transform-box:fill-box; transform-origin:center; animation:prestpuls 1.8s ease-in-out infinite}
@keyframes prestpuls{ 0%{transform:scale(.55); opacity:.45} 70%{transform:scale(1.35); opacity:0} 100%{transform:scale(1.35); opacity:0} }
/* flits op het eindpunt bij een tik (zoals de tik-flits op de cijfers): kort groter, dan terug */
.presteind{transform-box:fill-box; transform-origin:center}
.presteind.prestflits-op{animation:prestflits .6s ease-out 1}
.presteind.prestflits-af{animation:prestflits .6s ease-out 1}
@keyframes prestflits{ 0%{transform:scale(1)} 25%{transform:scale(2.1)} 100%{transform:scale(1)} }
/* tekenanimatie van de hoofdlijn bij een periode- of weergavewissel (± 400 ms, spring-achtig) */
.presttekenen{transition:stroke-dashoffset .4s cubic-bezier(.22,1,.36,1)}
/* smalle kaart (tot 720 px, én de twee-kolommen-indeling vanaf 960 px waar de kaart ± 560 px breed is): de schakelaar op een eigen regel onder de kop */
@media (max-width:720px), (min-width:960px){
  .histcard .cardhead{flex-wrap:wrap}
  .histcard .cardhead .prestsegrij{display:flex; flex-basis:100%; order:4; margin-top:2px}
  .histcard .cardhead .prestsegrij[hidden]{display:none}
  .histcard .cardhead .prestseg{margin-left:0}
}
@media (prefers-reduced-motion: reduce){ .prestlive .prestpuls{animation:none; opacity:.3} .presteind.prestflits-op,.presteind.prestflits-af{animation:none} .presttekenen{transition:none} }

/* v25.49 — koersendienst */
/* v25.49 (koersendienst, bouwer G-D): de kaart Koersendienst op /beheer (Signalen-tab ná Koersen, en in de klassieke tab) en de groene stand-regel
   bovenaan Let op. Alleen thematokens (dark + licht), geen hard-coded kleuren; de knoppen erven .bhknop (cursor:pointer, :focus-visible) —
   bewust geen muis-effect (zie de slotregel van de sectie v25.48 beheer); 320 px: één knop per regel, de uitleg eronder, tabellen scrollen in
   .bhscroll; checklist-vinkjes in --good-text / --ink-3 (dus ook zonder kleur leesbaar: ✓ / ○). */
.bhstat.kdtegel b{font-size:16px; overflow-wrap:normal} /* v25.51 (nazorg 7, BEHEER3), bug B5: was anywhere ("enterpri|se") */ /* teksttegels (staart …ab12, "huidige sleutel", "2 afwijkingen"): kleiner dan de cijfertegels, nooit midden in een woord gebroken */
.bhstand{color:var(--good-text); font-weight:600; font-size:13px; margin:0 0 6px; padding:6px 8px; border:1px solid color-mix(in srgb, var(--good) 45%, transparent); border-radius:8px; background:color-mix(in srgb, var(--good) 8%, transparent)}
.kdmelding code{font:600 11.5px ui-monospace, SFMono-Regular, Menlo, monospace; padding:0 4px; border-radius:4px; background:var(--hl-bg); color:var(--ink)}
.kdcheck{margin-top:8px}
.kdcheck li{align-items:flex-start; padding:3px 0; font-size:13px; color:var(--ink)}
.kdcheck li>span:first-child{flex:none}
.kdvink{display:inline-block; width:18px; font-weight:700; color:var(--ink-3)}
.kdcheck li.kdok .kdvink{color:var(--good-text)}
.kdcheck li.kdopen .kdstap{color:var(--ink-2)}
.kdknoppen{display:flex; flex-direction:column; gap:6px; margin-top:10px}
.kdknoprij{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.kdknoprij .bhknop{flex:none; min-width:200px; text-align:left}
.kdknoprij .bhgrijs{flex:1 1 160px; min-width:0}
.kdtabel td:first-child{white-space:nowrap}
.kdtabel tr.kdafw td{color:var(--gold)}
.kdtabel tr.kdafw td:first-child{font-weight:600}
.kdbev li{font-size:12.5px; color:var(--ink)}
.kdlog li>span:first-child{flex:1 1 0; min-width:0}
@media (max-width:359px){ .kdknoprij .bhknop{min-width:0; width:100%} .kdknoprij .bhgrijs{flex-basis:100%} .bhstat.kdtegel b{font-size:14px} }
/* v25.49 — SUPPORT4 (vier ledenmeldingen 4-9): MWRR-reden onder de statistieken, schakelaar geschatte valutakosten, brokerlabel in portefeuillebeheer en de brokergids */
.mwrrreden{margin:8px 2px 0; color:var(--ink); line-height:1.4}
.mwrrreden b{font-weight:600}
.rekenschakel{display:block; margin:6px 0 2px; font-size:12.5px; line-height:1.5; font-weight:500; letter-spacing:0; text-transform:none; color:var(--ink); cursor:pointer; overflow-wrap:anywhere} /* blok, niet flex: de uitleg loopt gewoon door op de volgende regel (layoutwachter 414/320 px) */
.rekenschakel input{margin:0 6px 0 0; vertical-align:middle}
.rekenschakel span{color:var(--ink-3); font-weight:400}
.pfbrokerform select{width:100%; margin:8px 0 2px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--card); color:var(--ink); font:inherit}
.bggekozen{margin:0 0 8px; color:var(--ink)}
/* v25.49 — rekenkern (accuraatheid ACC-14): de meldingen-uitklap bovenaan het Grootboek */
.gbafw{padding:10px 14px; margin-bottom:10px}
.gbafw summary{cursor:pointer; font-weight:600; font-size:14px}
.gbafwlijst{margin-top:8px; display:flex; flex-direction:column; gap:6px; max-height:320px; overflow:auto}
.gbafwrij{display:flex; gap:8px; font-size:13px; line-height:1.35; align-items:flex-start}
.gbafwrij i{opacity:.7}
.gbafwsoort{flex:0 0 auto; font-size:11px; padding:1px 6px; border-radius:6px; background:rgba(128,128,128,.16); white-space:nowrap; margin-top:1px}
/* v25.49 — F ledenroute */
/* v25.49 (F-LEDENROUTE): het scherm Word lid: de plankaarten uit de kassa (native), de externe kaart (extern) en de neutrale
   iOS-stand; in de iOS-schil (html[data-schil="1"]) verdwijnt élk [data-lid]-element: geen knop of link naar een externe kassa. Alleen
   thematokens (dark én licht), geen eigen muis-effecten (de knoppen erven .btn), 320 px: alles wrapt; ≥ 900 px staan de plankaarten naast elkaar. */
html[data-schil="1"] [data-lid]{display:none}
/* v25.49 (F-LEDENROUTE, tegenlezer, spec §8.4): ook de rij ≡ → Meer → 💳 Lidmaatschap (beide drawers, data-actie="lidmaatschap") verdwijnt in de
   schil — eerst de knop zelf (overal), daarna de hele rij mét het tagje waar :has() bestaat. */
html[data-schil="1"] [data-actie="lidmaatschap"]{display:none}
html[data-schil="1"] .drawerrij:has([data-actie="lidmaatschap"]){display:none}
.lidroute .apphead > span:last-child{width:36px}
.lidflow{padding:4px 16px 24px}
.lidsub{margin:0 0 14px; font-size:14.5px; line-height:1.5; color:var(--ink-2)}
.lidstatus{margin:0 0 12px; padding:0}
.lidplannen{display:flex; flex-direction:column; gap:12px}
.lidkaart{border:1px solid var(--line); border-radius:16px; padding:16px; background:var(--card); display:flex; flex-direction:column; gap:10px; min-width:0}
.lidkaart p{margin:0; color:var(--ink-2); font-size:13.5px; line-height:1.5}
.lidkaart .btn{width:100%; margin-top:2px}
.lidplankop{display:flex; justify-content:space-between; align-items:baseline; gap:10px; flex-wrap:wrap}
.lidplankop b{font-family:"Archivo",sans-serif; font-size:17px; min-width:0; overflow-wrap:anywhere}
.lidprijs{font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap}
.lidprijs i{font-style:normal; font-weight:500; color:var(--ink-2); font-size:12.5px}
.lidperks{margin:0; padding-left:18px; color:var(--ink-2); font-size:13.5px; line-height:1.55}
.lidproef{font-weight:600}
.lidkaart .lidproef{color:var(--good-text, var(--good))}
.lidkaart .lidopzeg{padding:0}
.lidneutraal p{color:var(--ink)}
.lidvoet{padding:12px 4px 0}
@media (min-width:900px){ .lidplannen{flex-direction:row; flex-wrap:wrap; align-items:stretch} .lidplannen .lidplan{flex:1 1 260px} }
/* v25.49 — F login: het nieuwe inlog-/aanmeldscherm (.authwrap.nieuw) naast de byte-identieke klassieke variant (.authwrap.klassiek).
   Zichtbaar via html[data-login="nieuw"] (snelstart-script + blok "v25.49 login" in app-v2549.js); zonder die markering staat de
   klassieke variant. Alleen thematokens (dark + licht), geen id-selectors, geen muis-effecten (de pins van de v25.49-suites gelden voor
   de hele staart van dit bestand); de groene knop = --good met tekst in --ground (dark) / --good-text met tekst in --card (licht, contrast
   op wit); safe-area-insets; 320 px bruikbaar (.authplus verdwijnt < 380 px); desktop ≥ 900 px twee kolommen.
   Herstelronde (tegenlezer): élke regel in dit blok is gescoopt op het nieuwe scherm of op een klasse die alleen dáár bestaat —
   geen kale selectors (.ok / .btn:focus-visible raakten met de vlag UIT de pfbadge, koppeldot, bhstip, koppelmelding en de
   focusrand van alle knoppen); tests/test-login-v2549.mjs bewaakt dat. */
html[data-login="nieuw"] .authwrap.klassiek{display:none}
html:not([data-login="nieuw"]) .authwrap.nieuw{display:none}
.authwrap.nieuw{padding-top:max(24px, env(safe-area-inset-top)); padding-bottom:max(24px, env(safe-area-inset-bottom)); padding-left:env(safe-area-inset-left); padding-right:env(safe-area-inset-right); gap:18px}
.authmerk h1{font-size:28px}
.authmerk .belofte{font-size:17px; color:var(--ink-2); margin:10px 0 0; line-height:1.4}
.authmerk .belofte2{font-size:13.5px; color:var(--ink-3); margin:6px 0 0; line-height:1.4}
.authplus{list-style:none; padding:0; margin:14px 0 0; display:flex; flex-direction:column; gap:6px; color:var(--ink-2); font-size:13.5px; line-height:1.4}
.authplus li{padding-left:20px; position:relative}
.authplus li::before{content:"✓"; position:absolute; left:0; top:0; color:var(--good-text); font-weight:700}
@media (max-width:379px){ .authplus{display:none} }
.authkaart{gap:6px}
.authkaart form, .authkaart .authgoed{display:flex; flex-direction:column; gap:8px; min-width:0}
.authkaart h2{font-size:20px; margin:0 0 2px}
.authkaart input{min-height:48px}
.authkaart .btn{min-height:52px; padding:14px 20px}
.btn.groen{background:var(--good); color:var(--ground); box-shadow:0 8px 30px color-mix(in srgb, var(--good) 22%, transparent)}
:root[data-theme="light"] .btn.groen{background:var(--good-text); color:var(--card)}
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]) .btn.groen{background:var(--good-text); color:var(--card)} }
.authwrap.nieuw .btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px} /* v25.49 (F-LOGIN, herstel): alleen op het nieuwe scherm, niet op elke .btn in de app */
.linkknop{appearance:none; background:none; border:0; color:var(--accent); font:inherit; font-size:14px; padding:8px 0; cursor:pointer; text-align:center; border-radius:6px}
.linkknop:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.authlijn{border:0; border-top:1px solid var(--line); margin:10px 0 2px; width:100%}
.wwveld{position:relative; min-width:0}
.wwveld input{padding-right:84px}
.wwveld .oog{position:absolute; right:8px; top:50%; transform:translateY(-50%); padding:6px 8px; font-size:13px; color:var(--ink-2)}
.gratisnoot{margin:0; color:var(--good-text); font-size:13.5px; font-weight:600}
.wwhint{margin:2px 0 0}
.authacties{display:flex; gap:8px}
.authacties .btn{flex:1; margin-top:4px; min-height:44px; padding:10px 12px; font-size:14px}
.authbanner{margin:0 0 6px; padding:10px 12px; border-radius:12px; background:color-mix(in srgb, var(--good) 12%, transparent); border:1px solid color-mix(in srgb, var(--good) 35%, transparent); color:var(--ink); font-size:13.5px}
.authok{color:var(--good-text); font-size:13.5px; margin:8px 0 0} /* v25.49 (F-LOGIN, herstel): was .ok — die klasse bestaat al op pfbadge/koppeldot/bhstip/koppelmelding */
.ledenlink{margin-top:14px}
.authgoogle{text-align:center; margin-top:4px}
.authklassiek{text-align:center; margin-top:10px}
.authvoet .hint{text-align:center; line-height:1.5}
@media (min-width:900px){
  html[data-login="nieuw"] .screen.authscherm{max-width:1040px} /* .screen is 520 px breed; het nieuwe scherm krijgt op desktop twee kolommen (merk links, kaart rechts) */
  .authwrap.nieuw{display:grid; grid-template-columns:minmax(0,1.15fr) 420px; gap:48px; align-items:center; max-width:980px; margin:0 auto; min-height:78svh; padding-top:24px}
  .authmerk h1{font-size:40px}
  .authmerk .belofte{font-size:19px}
  .authvoet{grid-column:1 / -1}
}
/* v25.49 — F freemium (beheer) */
/* v25.49 (F-METINGBEHEER): de kaart Freemium op /beheer — de trechter- en dagstandtabellen hergebruiken .bhtabel/.bhscroll, het wisveld .bhveld;
   hier alleen wat nieuw is: de "Nog niet aan"-regel, de config-chips, het wisveld dat op 320 px onder elkaar breekt. Alleen tokens, geen muis-effect
   (het dashboard heeft er geen), dark én licht via de tokens. */
.fmuit{font-size:13px; color:var(--ink-2)}
.fmuit b{color:var(--ink)}
.fmconfig{margin-top:8px}
.fmwis{flex-wrap:wrap}
.fmwis .bhknop{flex:0 0 auto}
.fmtrechter td:nth-child(n+2){min-width:96px}
@media (max-width:359px){ .fmwis input{flex-basis:100%} }

/* v25.49 — F clienttier */
/* v25.49 (F-CLIENTTIER, spec §5.4/§6/§7.7): slotkaart (één zin, één knop), meterstand, welkomstkaart, Ontdek-slot, assistent-slot. Alleen
   thematokens (dark + licht via :root), geen muis-effect (de knop is de bestaande .btn), 320 px bruikbaar, safe-area via de bestaande schermen. */
.slotkaart{display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; padding:22px 18px; border:1px solid var(--line-2); border-radius:14px; background:color-mix(in srgb, var(--accent) 6%, var(--card, transparent)); margin:8px 0}
.slotkaart .slotemo{font-size:26px; line-height:1}
.slotkaart .slotkop{font-family:"Archivo",sans-serif; font-size:16.5px; color:var(--ink)}
.slotkaart .slotzin{margin:0; color:var(--ink-2); font-size:14px; line-height:1.55; max-width:460px; overflow-wrap:anywhere}
.slotkaart .slotknop{margin-top:6px; min-height:44px; padding:0 18px; width:auto; max-width:100%}
.feed .slotkaart{margin:14px 10px}
.tkfeed .slotkaart, .tkledencard .slotkaart{margin:6px 0 10px}
.tkanalyseslot .slotkaart, .tkslotkaart .slotkaart{margin:0}
.ontdekslot{padding:0; border:0; background:transparent}
.view.tierslot > :not(.viewhead):not(.ontdekzoek):not(.ontdekslot){display:none}
.meterstand{display:inline-block; font-size:12.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; line-height:1.4}
.ontdekkop .meterstand{margin-left:auto; text-align:right}
.tkmeter{display:block; padding:2px 16px 0; color:var(--ink-3)}
.aiupsell.tierslot > :not(.slotkaart){display:none}
.aiupsell.tierslot{padding:18px 14px}
.aiupsell.tierslot .slotkaart{margin:0}
.welkomgratis{position:relative; padding:14px 40px 14px 14px; border:1px solid var(--line-2); border-radius:14px; background:color-mix(in srgb, var(--good) 8%, var(--card, transparent)); margin-bottom:10px; display:flex; flex-direction:column; gap:8px}
.welkomgratis .welkomkop{font-family:"Archivo",sans-serif; font-size:16px; color:var(--ink)}
.welkomgratis p{margin:0; color:var(--ink-2); font-size:13.5px; line-height:1.55}
.welkomgratis p b{color:var(--ink)}
.welkomgratis .welkomsluit{position:absolute; top:6px; right:6px}
.welkomknoppen{display:flex; flex-wrap:wrap; gap:8px}
.welkomknoppen .btn{margin-top:0; min-height:40px; padding:0 14px; width:auto; font-size:13.5px}
.tiernotifregel{margin:10px 4px 2px; color:var(--ink-3); font-size:12.5px; text-align:center}
.tierslotrij .knaam{color:var(--ink-2)}
@media (max-width:379px){ .slotkaart{padding:16px 12px} .welkomknoppen .btn{flex:1 1 100%} }
/* v25.49 — support5 */
/* v25.49 (SUPPORT5, ledenmelding IBKR fractionele positie): de aandachtspunten vindbaar — de regel bovenaan het grootboek, de knop achter de sync-melding in de kaart Brokerkoppeling, de pil in Portefeuille inrichten en de knop onder de importmelding. Alleen thematokens; geen muis-effect; 320 px: de regel breekt netjes. */
.aandachtregel{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin:0 0 10px; padding:8px 10px; border:1px solid var(--line); border-radius:12px; background:var(--card-2); color:var(--ink); font-size:13px}
.aandachtregel span{flex:1 1 160px}
.aandachtregel .pill{margin:0; flex:0 0 auto}
.koppelmelding .koppelaandachtknop{margin-left:6px; vertical-align:middle}
.koppelacties .koppelaandacht{border-color:var(--gold)}
.importaandacht{margin-top:8px}
.inrichtpills .inrichtaandacht{border-color:var(--gold)}

/* v25.49 — nazorg 6 (SLOGAN): de slogan op het inlogscherm, in beide varianten (klassiek .brand en nieuw .authmerk); Rabi 5-9 */
.brand .slogan, .authmerk .slogan{font-size:15px; font-style:italic; color:var(--ink-2); margin:6px 0 0; line-height:1.4}
.brand .slogan + .sub{margin-top:10px}
@media (min-width:900px){ .authmerk .slogan{font-size:17px} }
/* v25.49 — nazorg 6 (watisdit) */
/* v25.49 (nazorg 6, watisdit — Rabi 5-9): het kleine grijze linkje "Wat is dit?" (button.linkbtn.watisditknop, kleur --ink-3, driehoekje via ::after dat
   draait bij aria-expanded=true) en het uitklapkader (.watisditkader) in gewone taal — op de Prestatie-kaart en het prestatiescherm (onder de uitlegregel
   Mandje/Rekening), onder de tegels van de portefeuillekaart, in ⚙ Rendement tonen als, in 🧾 Bekijk de berekening, in de dividendkaart, bij Jouw badge
   en bij Wat is het waard?. Alleen thematokens (dark + licht); bewust geen eigen muis-effect (de knop erft .linkbtn, en de suites van v25.46–v25.49 lezen de
   css vanaf hun eigen kop tot het einde en eisen er geen aanwijs-regel); 320 px: overflow-wrap, geen vaste breedte; reduced-motion: geen draai-animatie.
   De wrapper (.watisdit) neemt de marge over van de uitlegregel waar hij onder staat (18 px zoals .chartsub), per gastheer bijgesteld via een klasse-selector (geen id-selectors). */
.watisdit{margin:4px 18px 0; font-size:12px; line-height:1.45}
.watisdit[hidden]{display:none}
.watisditknop{display:inline-flex; align-items:center; gap:5px; min-height:28px; padding:2px 0; color:var(--ink-3); font-size:12px; font-weight:500; text-decoration:underline dotted; text-underline-offset:3px; border-radius:4px}
.watisditknop::after{content:"▸"; font-size:10px; line-height:1; transition:transform .15s ease}
.watisditknop[aria-expanded="true"]::after{transform:rotate(90deg)}
.watisditknop:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.watisditkader{margin:4px 0 6px; padding:10px 12px; border:1px solid var(--line-2); border-left:3px solid var(--accent); border-radius:10px; background:var(--card-2, transparent); color:var(--ink-2); font-size:12.5px; line-height:1.55; overflow-wrap:anywhere; max-width:100%}
.watisditkader[hidden]{display:none}
.watisditkader p{margin:0 0 6px}
.watisditkader p:last-child{margin-bottom:0}
.watisditkader b{color:var(--ink); font-weight:600}
/* per gastheer (klasse-selectors, geen id's — de oudere suites lezen de css tot het einde en eisen dat) */
.hero > .watisdit{margin:6px 2px 0}                /* onder de tegels van de portefeuillekaart (zelfde zijmarge als de reden-regel .mwrrreden) */
.badgecard .watisdit{margin:8px 0 0}               /* onder de schakelaar Vermogensklasse tonen (de badge-kaart heeft geen 18 px-inspringing) */
.rendkeuzemodal .watisdit{margin:0 0 10px}         /* tussen de intro en de drie keuzes in ⚙ Rendement tonen als */
.rekenmodal .watisdit{margin:6px 0 8px}            /* onder de rijen in 🧾 Bekijk de berekening, vóór de geldstromen */
.prestuitleg + .watisdit{margin-top:2px}           /* Prestatie (kaart én prestatiescherm): dicht onder de uitlegregel Mandje/Rekening */
@media (prefers-reduced-motion: reduce){ .watisditknop::after{transition:none} }

/* v25.49 — nazorg 6 (SCENARIO40) */
/* v25.49 (nazorg 6, SCENARIO40, ledenwens "tot 30/35/40 jaar"): horizon-keuze 10 · 20 · 30 · 40 jr boven de scenario-grafiek (dezelfde .seg-knoppen als de horizon in "Wat als…"),
   en de grijze eerlijke regel onder de tabel bij 20 jaar en verder. Alleen thematokens (dark + licht); geen aanwijs-effect (tik-eerst, zoals de andere v25.49-blokken — de suites vanaf v25.47 lezen de css tot het einde); 320 px: knoppen even breed op een eigen regel. */
.scnhorizon{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:8px 0 2px; font-size:12.5px; font-weight:600; color:var(--ink-2)}
.scnhorizon .seg{flex:none}
.scnhorizon .seg button{min-height:30px; padding:5px 12px; font-variant-numeric:tabular-nums; white-space:nowrap}
.scnhorizon .seg button:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.chartsub.scnlang{margin-top:6px; color:var(--ink-3)}
.chartsub.scnlang[hidden]{display:none}
@media (max-width:355px){
  .scnhorizon{flex-direction:column; align-items:stretch}
  .scnhorizon .seg button{flex:1; padding:5px 6px; text-align:center}
}

/* v25.49 — nazorg 6 (CASHWEGING): Rabi 5-9 "cash moet in weging worden laten zien" — de rij Cash onderaan Posities & weging (zelfde raster als een positierij mét logochip, maar géén .prow: geen tik, geen klaprij, wijzer gewoon; selectors zonder id — `body .plist` weegt zwaarder dan de `.plist`-regels ervoor) en de neutrale schijf Cash in de Verdeling-donut (.lgcash in de legenda). Alleen thematokens (dark + licht); tik-eerst, geen muis-effect; 320 px: dezelfde kolommen als de positierijen. */
body .plist .cashrow{display:grid; grid-template-columns:36px minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto); gap:14px; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); cursor:default}
body .plist .cashrow:last-child{border-bottom:none}
body .plist .cashrow .cashchip{display:inline-grid; place-items:center; flex:none; box-sizing:border-box; width:36px; height:36px; border-radius:11px; background:var(--stat-bg); border:1px dashed var(--line-2); color:var(--ink-3); font:800 15px "Archivo",sans-serif; user-select:none; -webkit-user-select:none}
body .plist .cashrow .pright{min-width:0; max-width:170px; justify-self:end}
body .plist .cashrow .pday{white-space:normal; line-height:1.25}
body .plist .cashrow.debet .pleft span{color:var(--bad-text)}
.legend .lg.lgcash .lgname{color:var(--ink-2)}
@media (max-width:480px){ body .plist .cashrow{grid-template-columns:36px minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto); column-gap:10px} body .plist .cashrow .pright{max-width:128px} }
@media (max-width:399px){ body .plist .cashrow{grid-template-columns:36px minmax(64px,1fr) minmax(min-content,auto); column-gap:8px} body .plist .cashrow .psparkbox{display:none} }
/* v25.49 — nazorg 6 (CASHWEGING-PROFIEL): Rabi 5-9 13:10 "cash enkel in percentage laten zien" — de rij Cash onderaan de wegingen op een ledenprofiel (#lpPortefeuille): hetzelfde raster als .lpweging (vier kolommen) of .lpsector (drie kolommen, modifier .sector), maar een eigen klasse — geen knop, geen tik, geen muis-effect; neutrale balk (--ink-3) zoals de schijf Cash op de deelpagina; gestippelde scheidslijn erboven. Alleen thematokens (dark + licht); op 320 px dezelfde smalle rasters als de positierijen. */
.lpcashrij{display:grid;grid-template-columns:60px 1fr 52px 56px;gap:10px;align-items:center;color:var(--ink);font:inherit;min-height:24px;margin-top:4px;padding-top:8px;border-top:1px dashed var(--line);cursor:default}
.lpcashrij.sector{grid-template-columns:minmax(96px,1.4fr) 1fr 52px}
.lpcashrij b{font:700 12.5px "Archivo",sans-serif;color:var(--ink-2)}
.lpcashrij .lpbalk span{background:var(--ink-3)}
.lpcashrij .lpwpct{color:var(--ink-2)}
@media (max-width:360px){ .lpcashrij{grid-template-columns:52px 1fr 44px 50px;gap:8px} }
@media (max-width:359px){ .lpcashrij.sector{grid-template-columns:minmax(84px,1.3fr) 1fr 44px;gap:8px} }

/* v25.49 — nazorg 6 (KOPPELSLOT, melding 5-9 nieuw account + Freedom24-koppeling): de uitweg-knop "Portefeuille aanmaken en ophalen" in de kaart Brokerkoppeling (zelfde pil als ↓ Nu ophalen, accentrand zoals ⚠ aandachtspunten goud) */
.koppelacties .koppelaanmaken{border-color:var(--accent)}

/* v25.49 — nazorg 7 (audit 4, V4-04/V4-06, waardering): het modelvak "dicht" — de server zegt dat de eenheid van de cijfers onbekend is of verbergt het model (cijfers spreken elkaar tegen); alleen de kop en de eerlijke regel (.wdnoot) blijven staan. Geen muis-effect, alleen thematokens, geen id-selectors. */
.wdmodel[data-dicht="1"] > :not(.wdmodelkop):not(.wdnoot){display:none}
.wdmodel[data-dicht="1"] .wdnoot:not([hidden]){display:block; margin-bottom:12px}
.wdbasisnoot{margin:0 12px 8px}

/* v25.49 — nazorg 7 V4-08: wachtstand "lidmaatschap even niet te controleren" op het laadscherm (de kaart .ldonbekend). Alleen tokens en klassen (geen id-selector: de suites van v25.46–v25.49 lezen de css vanaf hun kop tot het einde); de knoppen erven .btn/.btn.ghost (bewust geen eigen muis-effect); 320 px: de kaart vult de breedte minus de marge. */
.ldonbekend{margin-top:18px; max-width:360px; width:calc(100% - 32px); text-align:center; display:flex; flex-direction:column; gap:10px; padding:18px 16px}
.ldonbekend p{margin:0 0 4px; color:var(--ink-2); font-size:14px; line-height:1.45}
.ldonbekend .btn{width:100%; min-height:44px}

/* v25.49 — nazorg 9 (community, R6-C01): berichtdetail begrensd gepagineerd — de knop 'Toon de volgende reacties' onder de lijst en de scheidingsregel vóór een reactie die buiten de geladen pagina's valt (melding/tik). Alleen thematokens; geen muis-effect; 320 px: de knop vult de breedte. */
.bklijst .bkmeer{padding:10px 0 6px;text-align:center}
.bklijst .bkmeer .bkmeerknop{width:100%;max-width:360px;font-size:13px}
.bklijst .bkmeer .bkmeerknop:disabled{opacity:.6}
.bklijst .bkdoelscheiding{margin:10px 0 4px;padding:6px 0;text-align:center;font-size:12px;line-height:1.4;color:var(--ink-3);border-top:1px dashed var(--line)}
/* v25.49 (nazorg 9, A7-FREEDOM24-03/04b) — waarschuwing bij een momentopname-koppeling: 'let op'-kader in de kaart (koppelletop); .koppelmelding.letop is de reserveklasse voor een losse melding */
.koppelmelding.letop{border-left:3px solid var(--accent)}
.koppelleeg.koppelletop{border-left:3px solid var(--accent); padding-left:8px; margin-top:8px}
/* v25.49 — nazorg 9 (A7-BITVAVO-01/TL02): knop onder de uitkomst-bubbel van de assistent-bestandsroute ("Naar het importscherm" /
   "Alle meldingen van deze import") — dezelfde plek en maat als de plak-importknop, zodat hij op 320 px onder de bubbel past. */
.chatimportknop{align-self:flex-start; max-width:calc(100% - 44px); white-space:normal; text-align:left}
/* v25.50 — liveblog2 */
/* v25.50 (LIVEBLOG2, Rabi 5-9 "de Beursblog … als tekstupdate schrijven met onze eigen data en charts"): de nieuwsupdates in het liveblog —
   type-label (dunne rand --line, tekst --ink-2; Vervolg in --accent), bronregel (11,5 px, --ink-3, tabular-nums), cijferskaart Omzet/WPA
   (grid label · waarde · pil; beat/miss-pil in --good-text/--bad-text; onder 340 px de pil onder de waarde), twee chips naast elkaar
   (.lbtwee erft de 1fr/1fr-grid vanaf 380 px), K/W-chip. Alleen thematokens (dark + licht), geen muis-effect (de liveblog-suites lezen de
   css vanaf hun kop tot het einde en eisen er geen), 320 px zonder h-scroll. */
.lbmeta .lbtype{display:inline-flex; align-items:center; height:18px; padding:0 7px; border:1px solid var(--line); border-radius:999px; font:600 10.5px/1 "IBM Plex Sans",system-ui,sans-serif; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-2); white-space:nowrap}
.lbmeta .lbtype.lbvervolg{color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent)}
.lbbron{margin:6px 0 0; font-size:11.5px; line-height:1.5; color:var(--ink-3); font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.lbbron b{font-weight:600; color:var(--ink-2)}
.lbbron a{color:var(--ink-2); font-weight:600; text-decoration:underline; text-underline-offset:2px; text-decoration-color:var(--line-2)}
.lbcijfers{display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-variant-numeric:tabular-nums; min-width:0}
.lbcijfers .lbcijferskop{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-bottom:2px}
.lbcijfers .lbcijferskop > b{font:700 11px "IBM Plex Sans",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3)}
.lbcijfers .lbcijferskop .art47-chip{margin:0}
.lbcijfers .lbcrij{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:0 10px; min-width:0}
.lbcijfers .lbclabel{color:var(--ink-3); font-weight:600; min-width:44px}
.lbcijfers .lbcwaarde{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-2)}
.lbcijfers .lbcwaarde b{color:var(--ink); font-weight:700} .lbcijfers .lbcwaarde b.lbvolgt{color:var(--ink-3); font-weight:600}
.lbcijfers .lbcwaarde i{font-style:normal; color:var(--ink-3)}
.lbcijfers .pil{display:inline-block; padding:1px 7px; border-radius:999px; font:700 11px/1.5 "IBM Plex Sans",sans-serif; white-space:nowrap; background:var(--card)}
.lbcijfers .pil.up{color:var(--good-text)} .lbcijfers .pil.down{color:var(--bad-text)}
@media (max-width:339px){ .lbcijfers .lbcrij{grid-template-columns:auto 1fr; row-gap:2px} .lbcijfers .pil{grid-column:2; justify-self:start} }
.lbtwee.lbtweechips{gap:0 6px} .lbtwee.lbtweechips .art47-chip{justify-self:start}
.lbkw{display:flex; align-items:center; flex-wrap:wrap; gap:0 8px}
.lbkw .lbkwtag{display:inline-block; margin-top:6px; padding:1px 8px; border:1px solid var(--line); border-radius:999px; font:600 12px/1.5 "IBM Plex Sans",sans-serif; color:var(--ink-2); font-variant-numeric:tabular-nums; white-space:nowrap}
/* v25.50 — politici2 */
/* v25.50 (POLITICI2, spec §5): de ranglijst strakker (strook "Meest gekocht", compacte rijen met partij-stip en sparkline), het
   politicus-dashboard in de vorm van het ledendashboard (#polDetail.pol2flow: hero, Verdeling, Posities, Prestatie, Activiteit, staart;
   ≥ 960 px twee kolommen) en het kaartje op de aandelenpagina met drie tegels. Alleen thematokens (dark + licht via :root), geen nieuwe
   hexwaarden (de donut gebruikt ALLOC_COLORS uit de code); partijkleur alleen als avatar-ring (v25.45) en als 7 px-stip .poldot — nooit
   op een percentage, donut of lijn; groen/rood alleen voor rendement en koop/verkoop, goud voor "te laat"; geen muis-effect (iOS-plak-les, zoals de v25.49-secties —
   :focus-visible wél); 320 px zonder h-scroll (alleen de strook en de segmenten scrollen); safe-area op #screen-politicus. */
.poldot{display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:6px; vertical-align:1px; background:var(--ink-3); flex:none}
.poldot.dem{background:var(--pol-dem)} .poldot.rep{background:var(--pol-rep)} .poldot.ind{background:var(--pol-ind)}
/* strook Meest gekocht */
.poltop{margin:12px 0 0; padding:0 0 10px}
.poltop .cardhead{padding:12px 16px 6px}
.poltoprij{display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding:2px 16px 4px; -webkit-overflow-scrolling:touch}
.poltoprij::-webkit-scrollbar{display:none}
.poltoptegel{appearance:none; flex:0 0 auto; width:128px; box-sizing:border-box; scroll-snap-align:start; display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:10px 11px; border:1px solid var(--line); border-radius:14px; background:var(--stat-bg); color:var(--ink); font:inherit; cursor:pointer; text-align:left; min-width:0}
.poltoptegel b{font-family:"Archivo",sans-serif; font-size:14px; letter-spacing:.01em; margin-top:5px}
.poltoptegel small{display:block; font-size:11px; color:var(--ink-3); line-height:1.3; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.poltoptegel small.poltopvol{white-space:normal; overflow:visible}
.poltoptegel:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
@media (max-width:359px){ .poltoptegel{width:112px} }
/* compacte ranglijstrij */
.polrow.polrow2{grid-template-columns:20px 36px minmax(0,1fr) minmax(0,auto); gap:8px}
.polrow2 .polmeta{display:block; white-space:normal; min-width:0; line-height:1.3}
.polrow2 .pleft b{white-space:normal; line-height:1.2}
.polrow2 .pright{gap:2px; max-width:170px}
.polrow2 .polsub2{white-space:nowrap; font-size:10.5px}
.polrow2 .polsub2 span{display:inline}
.polrow2 .spark.pol2spark{width:88px; height:22px}
@media (max-width:479px){ .polrow2 .pright{max-width:110px} .polrow2 .polsub2{display:flex; flex-direction:column; align-items:flex-end} .polrow2 .polsub2 .polsubsep{display:none} .polrow2 .polsub2 span{display:block} }
.pol2spark.up polyline{stroke:var(--good-text)} .pol2spark.up polygon{fill:var(--good-text)}
.pol2spark.down polyline{stroke:var(--bad-text)} .pol2spark.down polygon{fill:var(--bad-text)}
@media (max-width:380px){ .polrow.polrow2{grid-template-columns:36px minmax(0,1fr) minmax(0,auto)} .polrow2 .spark.pol2spark{width:64px} }
@media (max-width:359px){ .polrow2 .spark.pol2spark{display:none} }
.pol2sinds{margin:8px 0 0}
/* politicus-dashboard */
#screen-politicus.polscreen{padding-bottom:calc(var(--tabh) + env(safe-area-inset-bottom) + 42px)}
#polDetail.pol2flow{padding:0; overflow:hidden}
.pol2flow > p.chartsub:first-child{margin:12px 18px 0}
.pol2hero{padding:18px 18px 16px; border-top:none}
.pol2hero .lbl{font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); display:flex; flex-wrap:wrap; gap:2px 10px; align-items:baseline}
.pol2hero .polschat{font:500 11px/1.3 "IBM Plex Sans",sans-serif; letter-spacing:0; text-transform:none}
.pol2hero .big.polbig{font-family:"Archivo",sans-serif; font-weight:800; font-size:clamp(22px,7vw,30px); letter-spacing:-.03em; line-height:1.08; margin-top:6px; font-variant-numeric:tabular-nums; color:var(--ink); white-space:nowrap}
.pol2periode{display:inline-flex; margin-top:14px}
.pol2hero .statgrid.polstats{margin-top:12px}
.polstats .stat b{font-size:17px; line-height:1.2}
.polstats .stat b small{font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--ink-3); letter-spacing:0}
.polbijgewerkt{margin:12px 0 0}
.pol2kol > .tkc:first-child{border-top:1px solid var(--line)}
/* Verdeling */
.pol2verd .segrij{padding:4px 18px 0}
.pol2donut{display:flex; gap:12px; align-items:center; padding:10px 18px 4px; flex-wrap:wrap}
.pol2donut .donutbox{flex:none}
.pol2donut .legend{min-width:150px}
.pol2donut .legend .lg{padding:4px 8px; outline:none}
.pol2donut .legend .lg:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
.pol2donut .legend .lgname{white-space:normal; display:flex; flex-direction:column; gap:1px; line-height:1.25}
.pol2lgrange{font-size:11px; color:var(--ink-3); font-weight:500; font-variant-numeric:tabular-nums}
.pol2allocsub{padding:0 18px 6px}
.pol2allocsub .lgsubkop{font-size:11.5px; color:var(--ink-3); padding:2px 8px}
.pol2donut circle{cursor:pointer; transition:opacity .12s ease}
.pol2verdleeg{padding:6px 18px 8px; margin:0}
@media (max-width:379px){ .pol2donut{flex-direction:column; align-items:stretch} .pol2donut .donutbox{margin:0 auto} }
/* Posities */
.pol2pos .pol2poslijst{padding:2px 18px 8px}
.pol2pos .polleeg{padding:6px 18px 14px; margin:0}
.polposmeta{font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:normal}
.pol2pos .polpos .pleft span{white-space:normal}
.pol2flow .poloverig > summary{grid-template-columns:minmax(0,1fr) minmax(0,auto)}
.pol2groep{padding:0 0 4px}
.pol2groep .polpos{border-bottom:1px solid var(--line)} .pol2groep .polpos:last-child{border-bottom:none}
.polposacties{margin:2px 0 4px}
/* compacte meldingsrij */
.polm{display:flex; flex-wrap:wrap; justify-content:space-between; gap:3px 10px; align-items:center; font-size:12.5px; color:var(--ink-2); padding:7px 0 7px 10px; border-left:2px solid var(--line); margin:0 0 6px; font-variant-numeric:tabular-nums}
.polm .polmkop{display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; min-width:0}
.polm .polmwaarde{display:flex; align-items:center; gap:10px; margin-left:auto; white-space:nowrap}
.polm .polmdatum{color:var(--ink)}
.polm .polmsym{font-family:"Archivo",sans-serif; color:var(--ink); min-width:56px}
.polm .polmwie{color:var(--ink-3)}
.polm .polmkoers{white-space:nowrap} .polm .polmkoers .pday{display:inline}
@media (max-width:359px){ .polm .polmwaarde{white-space:normal; flex-wrap:wrap; justify-content:flex-end; gap:2px 8px} }
.polm .pill{padding:2px 8px; font-size:11.5px}
.polm .polbron{font-size:15px; line-height:1; text-decoration:none}
.polm .polbrontekst{flex-basis:100%; font-size:11.5px; font-weight:500}
.polmklik{cursor:pointer; border-radius:6px} .polmklik:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
/* Prestatie */
.pol2legend{padding:6px 18px 0}
.pol2legend .sl i.pol2sw.eigen{border-color:var(--good-text)} .pol2legend .sl i.pol2sw.eigen.down{border-color:var(--bad-text)}
.pol2legend .sl i.pol2sw.sp{border-color:var(--gold)}
.pol2chart{margin:8px 12px 0}
.pol2chart svg{display:block; width:100%; height:auto}
.pol2chart .pol2eigen{fill:none; stroke:var(--good-text); stroke-width:1.8; stroke-linejoin:round; stroke-linecap:round}
.pol2chart .pol2eigen.down{stroke:var(--bad-text)}
.pol2chart .pol2vlak{fill:var(--good-text); opacity:.12} .pol2chart .pol2vlak.down{fill:var(--bad-text)}
.pol2chart .pol2sp{fill:none; stroke:var(--gold); stroke-width:1.2; stroke-dasharray:4 3}
.pol2chart .pol2nul{stroke:var(--ink-3); stroke-width:1; opacity:.6}
.pol2chart .pol2grid{stroke:var(--line); stroke-width:1}
.pol2chart .pol2ylbl,.pol2chart .pol2xlbl{fill:var(--ink-3); font:500 15px "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums}
.pol2chart .pol2eind{fill:var(--good-text)} .pol2chart .pol2eind.down{fill:var(--bad-text)}
.pol2prestleeg{padding:4px 18px 12px; margin:0}
/* Activiteit */
.pol2actgraf{padding:6px 18px 0}
.pol2actgraf svg{display:block; width:100%; height:auto}
.pol2actgraf .up{fill:var(--good)} .pol2actgraf .down{fill:var(--bad)} .pol2actgraf .ov{fill:var(--ink-3); opacity:.7}
.pol2actgraf .pol2nul{stroke:var(--line); stroke-width:1}
.pol2actgraf .pol2jaar{fill:var(--ink-3); font:500 13px "IBM Plex Sans",sans-serif}
.pol2chips{display:flex; flex-wrap:wrap; gap:6px; padding:10px 18px 0}
.pol2chips .pill{font-size:11.5px; padding:3px 9px}
.polh4{margin:14px 18px 6px; font:700 13px "Archivo",sans-serif; color:var(--ink-2)}
.pol2laatste{padding:0 18px 8px}
/* staart */
.pol2staart{padding:6px 18px 16px}
.pol2staart .polmethode{margin-top:12px}
.pol2wacht{margin:12px 0 0; color:var(--gold)}
/* kaartje op de aandelenpagina */
#tkPolCard .pol2symgrid{padding:8px 18px 4px}
.pol2symgrid .stat{padding:10px 11px} .pol2symgrid .stat b{font-size:15px} .pol2symgrid .stat b.polvol{font-size:13.5px; white-space:normal}
.polsymrij[data-pol]{cursor:pointer; border-radius:8px}
.polsymrij[data-pol]:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
.polsymrij .pleft span{display:flex; align-items:center; min-width:0}
.polsymrij .pright .polbadge{margin-top:2px; font-size:11px; padding:2px 8px}
/* breed scherm: twee kolommen (hero en staart over de volle breedte) */
@media (min-width:960px){ .polscreen{max-width:920px} .pol2hero .statgrid.polstats{grid-template-columns:repeat(4,1fr)} #polDetail.pol2flow{display:grid; grid-template-columns:1fr 1fr} .pol2flow > .pol2hero,.pol2flow > p.chartsub,.pol2flow > .pol2staart{grid-column:1 / -1} .pol2kol + .pol2kol{border-left:1px solid var(--line)} }
@media (prefers-reduced-motion:reduce){ .pol2donut circle{transition:none} }
/* v25.50 — VERGELIJK2/KW: grafiekkop in twee rijen op smal scherm (⇄ Vergelijk altijd in beeld, periodeknoppen zonder scroll), K/W-weergave.
   De v25.41-regel op de kaartkop (.cardhead .seg{flex:1 1 220px}, ±2873, met het kaart-id ervoor) blijft staan en wordt hier met een specifiekere
   selector overschreven — daarom staat het kaart-id hier achter de klasse .tkc (specificiteit boven die regel; de v25.49-suites pinnen alleen dat
   geen regel mét een kaal id begint). Alleen thematokens; geen muis-effect. */
.tkc#tkChartCard .tkgrafiekkop{display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; padding-top:12px}
.tkc#tkChartCard .tkgrafiekkop .seg.tkweergave{flex:0 0 auto; order:1}
.tkc#tkChartCard .tkgrafiekkop .tkgrafiekacties{display:flex; align-items:center; gap:6px; margin-left:auto; order:2; flex:none}
.tkc#tkChartCard .tkgrafiekkop .tkgrafiekacties .embknop{margin-left:0}
.tkc#tkChartCard .tkgrafiekkop .seg.tkperiode{order:3; flex:1 1 100%; min-width:0; max-width:100%; overflow:visible}
.tkc#tkChartCard .tkgrafiekkop .tkperiode button{flex:1 1 0; min-width:0; padding:6px 0; text-align:center}
@media (min-width:600px){
  .tkc#tkChartCard .tkgrafiekkop .seg.tkperiode{flex:1 1 260px; order:2; max-width:420px}
  .tkc#tkChartCard .tkgrafiekkop .tkgrafiekacties{order:3}
}
@media (max-width:355px){ .tkc#tkChartCard .tkgrafiekkop .tkperiode button{font-size:11px} .tkc#tkChartCard .tkgrafiekkop{gap:6px 8px} }
.kwsam{margin:6px 18px 0; font-size:12.5px; color:var(--ink-2); line-height:1.45}
.kwsam b{color:var(--ink); font-variant-numeric:tabular-nums}
.kwsam .kwnu{color:var(--accent)}
.kwlok{appearance:none; cursor:pointer; background:transparent; border:0; color:var(--accent); font:600 12.5px "IBM Plex Sans",sans-serif; padding:6px 18px 10px; text-align:left}
.kwlok:focus-visible{outline:2px solid var(--accent); border-radius:8px}
/* bewust geen muis-effect op .kwlok: de seo2-/artpub-/wd-suites pinnen dat de CSS ná hun marker geen muis-effect bevat (ook niet in commentaar); focus-visible volstaat, de knop is een tekstlink in de accentkleur */
.kwleeg{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:0 12%; font-size:13px; color:var(--ink-2); line-height:1.45}
.vgchip.geenkw{opacity:.6}
@media (max-width:355px){ .kwsam{margin-left:14px; margin-right:14px; font-size:12px} .kwleeg{padding:0 6%} }

/* v25.50 — openbaar2: de gedeelde portefeuille als dashboard-spiegel met vervaagde plaatshouders (vaste nepinhoud, nooit een laag over echte
   cijfers). Alleen tokens, geen id-selectors, geen muisaanwijzer-regels; op papier een balkje i.p.v. bijna leesbare cijfers. */
.vbwaarde{display:inline-block; filter:blur(5px); -webkit-filter:blur(5px); opacity:.7; color:var(--ink-2); user-select:none; -webkit-user-select:none; font-variant-numeric:tabular-nums; border-radius:4px; cursor:help}
.big .vbwaarde{filter:blur(8px); -webkit-filter:blur(8px)}
.vbnep{cursor:default}
.vbnep .shweight i{max-width:none}
.vbb1 .shweight i{width:64px} .vbb2 .shweight i{width:40px} .vbb3 .shweight i{width:20px}
.vbsub{font-size:11px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-3); padding:10px 0 2px}
.vbrij .pkoers{font-variant-numeric:tabular-nums}
.vbrij .pleft b{display:flex; align-items:center; gap:0; min-width:0}
.vbrij .pleft b .ticklink,.vbrij .pleft b > a{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.vbrij .pleft > span{white-space:normal; line-height:1.3; max-height:2.6em; overflow:hidden; display:block} /* waarde · weging · naam mag over twee regels (de dashboardrij heeft één regel; hier komt de naam erbij); daarna afgekapt */
/* v25.50 (OPENBAAR2, tegenlezer): was `.vbrij .pleft span` — die selector raakte óók de geneste .vbwaarde/.srtekst en zette de (vervaagde of echte) waarde als blok op een eigen regel, waardoor de naam op een derde, afgekapte regel viel ("· 55,5% ·" zonder naam op 414 px); nu alleen het directe kind, de plaatshouder blijft inline-block */
.vbrij .pleft > span .vbwaarde{display:inline-block}
.shtotal{padding:14px 18px 12px} /* v25.50 (OPENBAAR2, tegenlezer): de hero staat nu op élk niveau — dezelfde zijmarge als de kaart Vandaag (.shvandaag .herosub 0 18px); in v25.49 stond de inhoud (alleen bij amounts) tegen de kaartrand */
.vbmeer{appearance:none; display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; margin-right:6px; padding:0; flex:none; border:1px solid var(--line); background:var(--stat-bg); color:var(--ink-2); border-radius:8px; font:inherit; font-size:11px; line-height:1; cursor:pointer; transition:transform .15s ease, background .15s ease}
.vbmeer[aria-expanded="true"]{transform:rotate(180deg)}
.vbmeer:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.shvbuitleg{display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; padding:8px 18px 4px; font-size:12.5px; color:var(--ink-2); line-height:1.45}
.shvbuitleg a{color:var(--accent); font-weight:600; text-decoration:none}
.shtotal .statgrid{grid-template-columns:1fr 1fr 1fr; margin-top:12px}
.shtotal .stat b{font-size:16px}
.shtotal .stat .statsub{display:block}
.shtotal .herosub .vbwaarde{filter:blur(4px); -webkit-filter:blur(4px)}
.shrow .pdetail{cursor:default}
.shdonut .donut-center .dv{font-size:15px}
@media (max-width:380px){ .shtotal .statgrid{grid-template-columns:1fr 1fr} .shtotal .stat:last-child{grid-column:1 / -1} .vbrij .pqty{display:block} .vbrij .pday .psessie{display:block; margin-left:0} .vbrij .vbmeer{width:22px; height:22px; margin-right:4px} .shrow.vbrij{grid-template-columns:minmax(0,1fr) 76px minmax(0,auto); gap:10px} .vbrij .shweight i{max-width:30px} .vbb1 .shweight i{width:30px} .vbb2 .shweight i{width:20px} .vbb3 .shweight i{width:10px} .vbrij .pleft > span{max-height:3.9em} /* v25.50 (OPENBAAR2, tegenlezer): op 320 px past waarde · weging · naam in drie regels; anders viel de naam weg achter een losse '·' */ } /* 320 px: aantal en sessielabel op een eigen regel (smalle rechterkolom) en een smallere balkkolom zodat ▾ + ticker links passen; de neprij-balken schalen mee (vaste klassen, nooit uit data) */
/* bewust geen muisaanwijzer-regel op .vbmeer: drie oudere suites (openbaar-client, ledenroute, nz4-privacy) scannen de CSS vanaf hun eigen marker tot het einde van het bestand en eisen daar geen enkele muisaanwijzer-regel — de knop krijgt zijn nadruk via :focus-visible en de draai bij aria-expanded */
@media print{ .vbwaarde{filter:none; -webkit-filter:none; color:transparent; background:var(--line)} }
/* v25.50 — ETF: fondskaarten op de aandelenpagina */
/* De ETF-variant van de aandelenpagina (blok v25.50 etf in app-v2550.js): pil in de koerskaart, Kerngegevens (tegels zonder kleurband),
   Grootste posities (rijen ≥ 44 px met een decoratieve balk), Verdeling (donut + legenda als knoppen), Over dit fonds. Alles via tokens
   (dark + licht); geen muis-effect (dezelfde lijn als de v25.49-blokken: wél :focus-visible voor het toetsenbord); alleen klassen, geen ids;
   320 px zonder horizontale scroll. */
.etfpil{appearance:none; cursor:pointer; font:600 11.5px "IBM Plex Sans",sans-serif; color:var(--accent); background:var(--card); line-height:1.2}
.etfpil:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.tketfkern .etfintro{margin:0 18px 6px}
.tketfkern .tkstats .stat b{color:var(--ink)}
.etfrows .etfhrij{display:grid; grid-template-columns:auto minmax(0,1fr) auto auto auto; align-items:center; gap:10px; min-height:44px; padding:6px 0; text-decoration:none; color:inherit; position:relative; font-size:13.5px}
.etfrows .etfhrij .naam{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0}
.etfrows .etfhrij .etfpct{font-variant-numeric:tabular-nums; font-weight:600; text-align:right}
.etfrows .etfhrij .etfchip{font-size:10.5px; padding:2px 8px}
.etfrows .etfhrij .logochip{flex:none}
.etfbalk{position:absolute; left:0; bottom:0; height:3px; background:var(--accent); opacity:.35; border-radius:2px; pointer-events:none}
.etfklik{cursor:pointer}
.etfklik .chev{color:var(--ink-3); font-size:16px; line-height:1}
.etfklik:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; border-radius:8px}
.etfmeerrij[hidden]{display:none}
.etfmeer{display:block; margin:6px auto 2px; color:var(--accent)}
.etfmeer:focus-visible{outline:2px solid var(--accent); outline-offset:1px; border-radius:6px}
.etfseg{margin-left:auto}
.etfverdeling .cardhead{flex-wrap:wrap; gap:8px}
.etfverdeling .donut-center{display:flex; flex-direction:column; align-items:center; justify-content:center} /* de waarde en het label (b.dv + span.dl zonder tussen-div) samen in het gat van de donut */
.etflegend .lg{appearance:none; border:0; background:none; font:inherit; color:inherit; text-align:left; width:100%}
.etflegend .lg:focus-visible{outline:2px solid var(--accent); outline-offset:-1px}
.etflegend .lg[aria-pressed="true"]{background:var(--hl-bg)}
@media (max-width:479px){ .etfverdeling .legend{flex:1 1 100%; min-width:0} } /* smal: de legenda onder de donut met volledige namen (Financiële diensten, Gezondheidszorg) */
@media (max-width:359px){ .etfrows .etfhrij .etfchip{display:none} .tketfkern .tkstats{grid-template-columns:1fr} } /* 320 px: chip weg, één tegelkolom (anders lopen "Dividendrendement" en "gewogen over de posities" uit de tegel) */

/* v25.50 — prestatie2-historie */
/* v25.50 (PRESTATIE2-HISTORIE, P2-3): de euro-rij op de scrub-tooltip van de eigen Rekening-grafiek (dark + licht via de tokens) */
.tooltip .tt-w{color:var(--ink-2); font-variant-numeric:tabular-nums; margin:2px 0 1px}

/* v25.50 — ticker-rest */
/* B26: de valutaregel onder Omzet & winst (alleen zichtbaar bij een verschil tussen rapportage- en koersvaluta); erft .chartsub */
.tkfincur{margin-top:0; color:var(--ink-2)}

/* v25.50 — BETAX: scherm Meerwaardebelasting, sectie Land, vraagkaart */
/* Alleen tokens (--card, --line, --line-2, --ink-2/-3, --good-text, --bad-text, --accent, --gold, --hl-bg); betekenis nooit alleen in kleur;
   geen aanwijs-effecten voor de muis (de suites van v25.46–v25.49 scannen de CSS-staart daarop; focus-visible en aria-expanded dragen de staat);
   prefers-reduced-motion op de balk; 320 px zonder horizontale scroll (pill op regel 2, overflow-wrap:anywhere); tikdoelen ≥ 44 px;
   ≥ 960 px dezelfde gecentreerde kolom als Prestatie. */
#screen-home[data-view="betax"] > :is(.apphead,.topnav,.tape,.newsbar,.testbar,.hintbar,#meerMenu){display:none !important}
#screen-home[data-view="betax"] > section.card{display:none !important}
#view-betax .btjaar{margin:2px 0 10px; width:max-content; max-width:100%}
#view-betax .btjaar button{min-height:40px; padding:9px 14px}
#view-betax .btinhoud > .card{margin-bottom:12px}
.btkaart1{padding:16px 18px 6px}
.btkaart1 .btjaarlabel{margin-bottom:6px}
.btkoplabel{font-size:12.5px; color:var(--ink-2)}
.bttotaal{font-family:"Archivo",sans-serif; font-size:28px; font-weight:700; letter-spacing:-.01em; font-variant-numeric:tabular-nums; margin:2px 0 4px; color:var(--ink); overflow-wrap:anywhere}
.bttotaal.kpos{color:var(--good-text)}
.bttotaal.kneg{color:var(--bad-text)}
.bttotaal.btneutraal{color:var(--ink)}
.bttotaalsub{font-size:12.5px; color:var(--ink-2); line-height:1.45}
.btverlies{margin:6px 0 0; font-size:12.5px; color:var(--bad-text); line-height:1.45}
.btvrij{margin:14px 0 4px; padding-top:12px; border-top:1px solid var(--line)}
.btvrijkop{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; font-size:13px; font-weight:600; color:var(--ink)}
.btvrijbalk{height:10px; border-radius:999px; background:var(--line-2); overflow:hidden; margin:8px 0 6px}
.btvrijvul{height:100%; border-radius:999px; background:var(--accent); transition:width .25s ease}
@media (prefers-reduced-motion:reduce){ .btvrijvul{transition:none} }
.btvrijtekst{font-size:12.5px; color:var(--ink); font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.btvrijrest{margin:4px 0 0; font-size:12px; color:var(--ink-3); line-height:1.45}
.btrijen1{margin-top:8px}
.btrijen1 .krow{padding:9px 0}
.btrijen1 .krow span{overflow-wrap:anywhere}
.btrijen1 .krow b,.btcijfers .krow b{white-space:nowrap; flex:none}
.btrijen1 .krow.btindicatie{font-weight:700}
.btrijen1 .krow.btindicatie b{font-weight:700}
.btvoet{margin:6px 18px 10px}
.btlaad{display:flex; align-items:center; gap:12px; padding:10px 0 14px; color:var(--ink-2); font-size:13px}
.btlaad p{margin:0}
/* Per positie */
.btcsv{appearance:none; border:1px solid var(--line); background:transparent; color:var(--ink); font:inherit; font-size:12.5px; font-weight:600; min-height:44px; padding:8px 14px; border-radius:999px; cursor:pointer}
.btcsv:focus-visible{outline:2px solid var(--accent)}
.btposlijst{padding:0 6px 8px}
.btpos + .btpos{border-top:1px solid var(--line)}
.btposrij{appearance:none; width:100%; border:none; background:transparent; color:var(--ink); font:inherit; text-align:left; cursor:pointer; display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"kop res" "pills pills" "sub sub"; column-gap:10px; row-gap:2px; padding:11px 12px; min-height:44px; border-radius:12px}
.btposrij:focus-visible{outline:2px solid var(--accent)}
.btposrij .btposkop{grid-area:kop; min-width:0; font-size:13.5px; font-weight:600; overflow-wrap:anywhere}
.btposrij .btposnaam{color:var(--ink)}
.btposrij .btposres{grid-area:res; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; align-self:start}
.btposrij .btpills{grid-area:pills; display:flex; flex-wrap:wrap; gap:6px}
.btposrij .btpill{font-size:11px; padding:2px 8px}
.btposrij .btpossub{grid-area:sub; white-space:normal; overflow-wrap:anywhere}
.btpill.btpillgoud{color:var(--gold); border-color:color-mix(in srgb, var(--gold) 45%, transparent)}
.btpill.btpillbron{color:var(--ink-2)}
.btposrij[aria-expanded="true"]{background:var(--hl-bg)}
.btuit{padding:4px 12px 12px; border-top:1px dashed var(--line)}
.btverkoop{padding:10px 0 4px}
.btverkoop + .btverkoop{border-top:1px solid var(--line)}
.btverkoopkop{font-size:13px; font-weight:600; color:var(--ink); margin-bottom:4px; overflow-wrap:anywhere}
.btcijfers .krow{padding:6px 0; font-size:13px}
.btcijfers .krow span{overflow-wrap:anywhere}
.btcijfers .krow.btverkoopres{font-weight:700; border-top:1px solid var(--line-2); margin-top:2px; padding-top:8px}
.btuitleg{margin:6px 0 4px; font-size:12px; color:var(--ink-3); line-height:1.5}
.btnietmeeregel{color:var(--ink-2)}
.btschakelrij{min-height:44px; margin-top:6px}
.btschakelrij > span{overflow-wrap:anywhere}
.btschakelrij > span b{font-weight:600}
/* Niet meegerekend */
.btnietlijst{list-style:none; margin:0; padding:0 18px}
.btnietrij{padding:9px 0; font-size:13px; line-height:1.45; border-bottom:1px solid var(--line); overflow-wrap:anywhere}
.btnietrij:last-child{border-bottom:none}
.btnietnaam{font-weight:600}
.btnietreden{color:var(--ink-2)}
.btkoppel{display:block; margin-top:6px; min-height:44px}
.btopnieuw{margin:8px 18px 14px; min-height:44px}
.btnietvoet{margin-top:8px}
/* Heffing aan de bron */
.btbron .btbronuitleg{margin:0 18px 4px; font-size:12.5px; color:var(--ink-2); line-height:1.5}
.btbron .btbronrij{margin:0 18px; padding:2px 0}
.btbron .bthint{margin:0 18px 6px; font-size:12px; color:var(--gold); line-height:1.45}
.btbron > .chartsub{margin-top:6px; margin-bottom:12px}
/* Hoe rekenen we? */
.btmethodekaart{padding:10px 18px 12px}
.btmethodekaart details.bhklap + details.bhklap{border-top:1px solid var(--line); padding-top:4px}
.btmethodetekst{font-size:12.5px; color:var(--ink-2); line-height:1.55; padding:2px 0 6px}
.btmethodetekst p{margin:6px 0}
.btmethodetekst ol{margin:6px 0; padding-left:20px}
.btmethodetekst li{margin:4px 0}
.btmethodetekst .btvoet{margin:8px 0 0}
.btslotregel{margin-bottom:16px}
/* Slotkaart (gratis account, alleen met FREEMIUM_ENABLED): de kop blijft, de rest wijkt voor één kaart */
#view-betax.tierslot > .btslot{display:block}
.btslot{padding:8px 0 16px}
/* Gate-kaarten (land leeg / ander land / nog niet beschikbaar / geen transacties) */
.btgate .bkwegterug{margin-top:14px}
.btgate b{overflow-wrap:anywhere}
/* Sectie Land in het Instellingen-sheet + de vraagkaart op het dashboard */
.btlandseg{margin-top:8px; width:max-content; max-width:100%}
.btlandseg button{min-height:40px; padding:9px 14px}
.btlandseg button.btsignaal{box-shadow:inset 0 0 0 1.5px var(--accent)}
#instLand .linkbtn{display:block; margin-top:6px; min-height:32px}
#instLand .btnaarbetax{color:var(--accent); font-weight:600}
.btlandvraag{position:relative; padding:16px 56px 16px 18px; margin-bottom:12px; border:1px solid color-mix(in srgb, var(--accent) 40%, transparent); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent) 4%, transparent))}
.btlandvraag > b{font-family:"Archivo",sans-serif; font-size:15px; display:block}
.btlandvraag .btlandvraagtekst{margin:6px 0 0; color:var(--ink-2); font-size:13.5px; line-height:1.45}
.btlandvraag .btlandseg{margin-top:12px}
.btlandvraag .btlandvraagsluit{position:absolute; top:8px; right:8px; width:44px; height:44px; font-size:16px}
.btlandhint{margin:8px 0 0; font-size:12.5px; color:var(--accent); font-weight:600}
.btlanddank{margin:0; font-size:13.5px; color:var(--ink); font-weight:600}
.btlanddank:empty{display:none}
.btlandvraag[data-dank] .btlanddank{margin-top:6px}
@media (min-width:960px){
  #screen-home[data-view="betax"]{max-width:760px}
  .btcijfers{display:grid; grid-template-columns:1fr 1fr; column-gap:18px}
  .btcijfers .krow.btverkoopres{grid-column:1/-1}
}
@media (max-width:359px){
  .btcsv .btcsvjaar{display:none}
  .btkaart1,.btlandvraag{padding-left:14px; padding-right:14px}
  .btlandvraag{padding-right:52px}
}
/* v25.50 — TICKERACTIVITEIT */
/* v25.50 (TICKERACTIVITEIT): kaart "Wie kocht en verkocht · 12 maanden" op de tab Koers — ledendeel (twee tegels Leden kochten · Leden verkochten + noot) bovenaan,
   daaronder de subkop "Congresleden" met de beheerderspil, de POLITICI2-tegels en de rijen per politicus (somregel "2× gekocht · 1× verkocht");
   geen muisgebonden effect (de rij heeft al :focus-visible), dark + licht via de bestaande tokens, ≤ 339 px één kolom (320 px: tegels onder elkaar). */
#tkPolCard .tkactgrid{padding:8px 18px 4px; grid-template-columns:repeat(2,minmax(0,1fr))}
.tkactgrid .stat{padding:10px 11px} .tkactgrid .stat b{font-size:15px}
#tkPolCard .tkactnoot{padding:0 18px 8px; margin:0}
.tkactkop{display:flex; align-items:center; gap:8px; padding:10px 18px 0; font-weight:600; font-size:13px; color:var(--ink-3)}
.tkactkop .poltest{font-weight:600}
.tkactrij .tkactsom{display:block; font-size:12px; color:var(--ink-3); margin-top:2px}
/* rij per politicus op een breed scherm (≥ 480 px): de rechterkolom (pil · datum · bandbreedte) houdt haar natuurlijke breedte (geen procentuele max-width — die lost in een auto-kolom op tegen de kolom zelf en knipt het bedrag in drieën) */
.tkactrij .pleft{min-width:0}
.tkactrij .pright .polsub2{line-height:1.3}
/* smal scherm (≤ 479 px, dus ook 320 px): pil · datum · badge als wikkelende regel ónder de naam, in plaats van een tweede kolom — geen afgekapte naam of somregel */
@media (max-width:479px){ .tkactrij{grid-template-columns:28px minmax(0,1fr)} .tkactrij .pright{grid-column:2; max-width:none; display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:flex-start; gap:4px 8px; text-align:left; margin-top:2px} .tkactrij .pright .polbadge{margin-top:0} }
.tkactmeer{padding:0 18px 6px; margin:0}
#tkPolRows .tkactmeer{padding:6px 0 2px} /* binnen de rijenlijst (die al 18 px inspringt): gelijk met de voettekst */
@media (max-width:339px){ #tkPolCard .tkactgrid{grid-template-columns:1fr} }

/* v25.50 — IMPORTUI2: Koppelingen en imports in één oogopslag */
/* De lijst op het importscherm achter IMPORT_UI_V2 (blok "v25.50 importui2" in app-v2550.js): rij = badge · naam + routeregel · statuschip · ›.
   Alleen thematokens en color-mix, geen hex (de suites van v25.44–v25.49 lezen de css-staart tot het einde en verbieden vaste kleuren én
   muis-effecten — daarom badgetekst op accent via var(--ground) en géén muis-effect op de rij; :focus-visible voor het toetsenbord). */
.emptycard .iu2lijst{align-self:stretch; text-align:left; margin:6px 0 4px}
.iu2kop{font:800 12px "Archivo",sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); margin:12px 2px 4px}
.iu2sub,.iu2intro{font-size:13px; color:var(--ink-2); margin:4px 0 6px}
.iu2intro{color:var(--ink); font-size:14px; max-width:40ch}
.iu2rij{display:grid; grid-template-columns:36px minmax(0,1fr) auto 14px; gap:10px; align-items:center; width:100%; min-height:52px; padding:11px 4px; border:none; border-top:1px solid var(--line); background:transparent; color:var(--ink); font:inherit; text-align:left; cursor:pointer; border-radius:0}
.iu2rij:first-of-type,.iu2kop + .iu2rij,.iu2sub + .iu2rij{border-top:none}
.iu2rij:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; border-radius:10px}
.iu2rij.wens .iu2mid b{color:var(--ink-2)}
.iu2badge{width:36px; height:36px; border-radius:11px; display:grid; place-items:center; font:800 11px "Archivo",sans-serif; letter-spacing:.02em}
.iu2badge.drie{font-size:10px}
.iu2badge.koppel{background:var(--accent); color:var(--ground)}
.iu2badge.bestand{background:var(--accent-wash); color:var(--accent); border:1px solid color-mix(in srgb, var(--accent) 35%, transparent)}
.iu2badge.chat{background:var(--card-2); color:var(--ink-2); border:1px solid var(--line-2)}
.iu2badge.wens{background:transparent; color:var(--ink-3); border:1px dashed var(--line-2)}
.iu2badge.ring-bad{box-shadow:0 0 0 2px var(--bad)}
.iu2badge.ring-gold{box-shadow:0 0 0 2px var(--gold)}
.iu2mid{min-width:0}
.iu2mid b{display:block; font:700 13.5px "Archivo",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.iu2mid i{display:block; font-style:normal; font-size:11.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.iu2chip{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:600; white-space:nowrap; max-width:22em; overflow:hidden; color:var(--ink-2)} /* 22em (spec: 14em) — "Bijgewerkt: 3 dagen geleden" paste met 14em niet eens op 1280; 18em kapte "Gekoppeld, nog niet opgehaald" nog hard af (tegenlezer 3); de langste chip "Sleutel verlopen — koppel opnieuw" is ± 21em (gemeten in de doorloop-check iu2Breed) */
.iu2chip .iu2chiptekst{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} /* tegenlezer 3: de ellipsis hoort op de tekst-span — op de inline-flex-container werkt text-overflow niet (harde afkap zonder …) */
.iu2chip .iu2dot{width:8px; height:8px; border-radius:50%; background:currentColor; flex:none}
.iu2chip.mut .iu2dot{background:transparent; border:1.5px solid currentColor}
.iu2chip.good{color:var(--good-text)}
.iu2chip.bad{color:var(--bad-text)}
.iu2chip.gold{color:var(--gold)}
.iu2chip.accent{color:var(--accent)}
.iu2chip.accent .iu2dot{animation:iu2puls 1.2s ease-in-out infinite}
@keyframes iu2puls{0%,100%{opacity:1}50%{opacity:.35}}
:root[data-theme="light"] .iu2chip.gold{color:color-mix(in srgb, var(--gold) 80%, var(--ink))}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .iu2chip.gold{color:color-mix(in srgb, var(--gold) 80%, var(--ink))}}
.iu2chev{color:var(--ink-3); font-size:18px; line-height:1}
.iu2gidsstatus{margin:0 0 10px; padding:9px 11px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2); font-size:12.5px; line-height:1.45; text-align:left}
.iu2gidsstatus p{margin:2px 0}
.iu2gidsstatus .iu2chipregel{margin-bottom:4px} .iu2gidsstatus .iu2chip{max-width:none}
.iu2gidsstatus .iu2reden{color:var(--bad-text); margin-top:4px}
.iu2gidsstatus .iu2hint{color:var(--ink-3)}
.iu2gidsstatus .iu2koppelknop{margin:6px 0 2px}
.iu2gidsstatus .koppelhulp{margin-top:6px}
/* Smalle schermen (spec §7.8 zei 379 px; op 414 px sneed de chip "Bijgewerkt: 3 dagen geleden" af tot "…3 dagen ge" — daarom tot 479 px):
   de chip onder de naam, nooit afgekapt, nooit horizontaal scrollen. */
@media (max-width:479px){
  .iu2rij{grid-template-columns:32px minmax(0,1fr) 14px; grid-template-areas:"b m c" "b s c"; row-gap:2px}
  .iu2badge{grid-area:b; width:32px; height:32px; font-size:10px}
  .iu2mid{grid-area:m}
  .iu2chip{grid-area:s; justify-self:start; font-size:11px; max-width:100%; white-space:normal; overflow:visible; text-overflow:clip}
  .iu2chip .iu2chiptekst{white-space:normal; overflow:visible; text-overflow:clip}
  .iu2chev{grid-area:c}
}
@media (prefers-reduced-motion: reduce){ .iu2chip.accent .iu2dot{animation:none} }
/* v25.50 — AIKOPPELING: sectie AI-koppeling in Instellingen (lijst, chips), sheet Nieuwe koppelingscode (radiokaarten, codeveld), help-sheet, concept-kaart op het dashboard. Alleen tokens; geen aanwijs-effecten (de oudere suites scannen de staart van dit bestand); geen animatie; 320 px zonder horizontaal scrollen. */
.aiklijst{margin-top:10px; min-width:0}
.aikskelet{display:block; height:12px; width:60%; margin:4px 0 8px; border-radius:10px; background:var(--hl-bg)}
.aikleeg{margin:0 0 8px; font-size:12.5px; line-height:1.5; color:var(--ink-2); padding:10px 12px; border:1px dashed var(--line-2); border-radius:12px; background:var(--card-2); overflow-wrap:anywhere}
.aikleeg.aikmax,.aikleeg.aikmigratie,.aikleeg.aikfoutregel{border-style:solid}
.aikleeg .aikopnieuw{display:inline; padding:0 0 0 4px; color:var(--accent); font-weight:600; min-height:44px}
.aikrij{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2); margin-bottom:8px; min-width:0} /* kloon van .koppelrij */
.aikinfo{min-width:0; flex:1 1 auto; font-size:12.5px; line-height:1.4; overflow-wrap:anywhere}
.aiknaam{display:flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0}
.aiknaam b{font-family:"Archivo",sans-serif; font-size:13px; color:var(--ink)}
.aikchip{font-size:10.5px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; padding:2px 7px; border-radius:999px; background:var(--hl-bg); color:var(--ink-2); white-space:nowrap}
.aikchip.toevoegen{background:var(--accent-wash); color:var(--accent)}
.aikstatus{display:flex; align-items:center; gap:6px; margin-top:3px; color:var(--ink-2); font-variant-numeric:tabular-nums; flex-wrap:wrap}
.aikstaart{font-family:"IBM Plex Mono","SFMono-Regular",Consolas,monospace; font-variant-numeric:tabular-nums; color:var(--ink-3); letter-spacing:.02em}
.koppeldot.aikgoud{background:var(--gold)}
.aikacties{display:flex; flex-direction:column; gap:6px; flex:none; align-items:stretch}
.aikacties .aikintrek{min-height:44px; white-space:nowrap}
.aiknieuw{width:100%; min-height:44px; margin:2px 0 8px}
.aikhelprijen{margin-top:2px}
.aikwacht{display:block; width:100%; text-align:left; min-height:44px; padding:8px 0; color:var(--accent); font-weight:600; font-size:13px}
.aikwaarschuwing{margin:8px 0 0; padding:9px 12px; border:1px solid color-mix(in srgb, var(--gold) 35%, transparent); border-radius:12px; background:color-mix(in srgb, var(--gold) 8%, transparent); color:var(--ink); font-size:12.5px; line-height:1.5; overflow-wrap:anywhere}
.aikwaarschuwing .aikkwijt{display:block; color:var(--ink-2); margin-top:2px}
/* sheet Nieuwe koppelingscode */
.aikvlak{max-height:88svh; overflow-y:auto}
.aikvlak .instlbl{margin-top:12px}
.aikveld{width:100%; box-sizing:border-box}
.aikkeuzes{margin:14px 0 0; padding:0; border:none; min-width:0}
.aikkeuzes legend{font:700 14px "Archivo",sans-serif; color:var(--ink); margin-bottom:8px; padding:0}
.aikkeuze{display:flex; align-items:flex-start; gap:10px; padding:10px 12px; margin:0 0 8px; min-height:44px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2); cursor:pointer; color:var(--ink); font-size:13.5px; font-weight:400; letter-spacing:0; text-transform:none} /* de globale label-regel (uppercase, 12 px) geldt niet voor de keuzekaart */
.aikkeuze input{margin:3px 0 0; flex:none; accent-color:var(--accent); width:18px; height:18px} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.aikkeuze.on{border-color:var(--accent); background:var(--accent-wash)}
.aikkeuze:focus-within{outline:2px solid var(--accent); outline-offset:1px}
.aikkeuzetekst{display:flex; flex-direction:column; gap:2px; min-width:0}
.aikkeuzetekst b{font-size:13.5px; font-weight:700; color:var(--ink)}
.aikkeuzetekst small{font-size:12px; line-height:1.45; color:var(--ink-2)}
.aikkeuzes .aikinfo{margin:0 0 4px}
.aikfout{margin:10px 0 0}
.aikmaakknop{width:100%; min-height:44px; margin-top:12px}
.aikmaakknop[aria-busy="true"]{opacity:.7; cursor:wait}
.aikvlak .plusannuleer{width:100%; margin:8px 0 0}
.aikeenmalig{margin:4px 0 8px; font-size:13.5px; line-height:1.5; color:var(--ink)}
.aikcoderij{display:flex; gap:8px; align-items:stretch; min-width:0}
.aikcode{flex:1 1 auto; min-width:0; width:100%; box-sizing:border-box; font-family:"IBM Plex Mono","SFMono-Regular",Consolas,monospace; font-size:13px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; user-select:all; -webkit-user-select:all; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--input-bg); color:var(--ink); letter-spacing:.01em}
.aikcode:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.aikclipknop{flex:none; min-height:44px; padding:0 14px; white-space:nowrap}
.aikadressub{margin-top:6px}
.aikhelplink{display:block; margin:12px 0 0; color:var(--accent); font-weight:600; font-size:13px; min-height:44px; text-align:left}
.aikklaarknop{width:100%; min-height:44px; margin-top:12px}
/* help-sheet */
.aikseg{margin:4px 0 12px}
.aikseg button{flex:1; min-height:40px}
.aikstappen{margin-top:0}
.aikstappen li{overflow-wrap:anywhere}
.aikpaneel[hidden]{display:none}
.aikziet,.aike1,.aikanders{margin-top:10px}
.aikwerktniet{margin-top:12px; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2)}
.aikwerktniet b{font-family:"Archivo",sans-serif; font-size:13.5px; color:var(--ink)}
.aikwerktniet .instuitleg{margin-top:4px}
.aiknogniet{margin:4px 0 8px}
/* concept-kaart op het dashboard (rand/achtergrond van .mutvoorstel, knoppen .mutknoppen) */
.aikconceptcard{border:1px solid rgba(232,185,60,.55); background:rgba(232,185,60,.08)}
.aikconcepthead b{display:block; font-family:"Archivo",sans-serif; font-size:15px; color:var(--ink); margin-bottom:4px; outline:none}
.aikwatisdit{margin:0 0 6px}
.aikwatisdit summary{list-style:none; cursor:pointer; color:var(--ink-3); font-size:12.5px; padding:4px 0; min-height:28px}
.aikwatisdit summary::-webkit-details-marker{display:none}
.aikwatisdit summary::before{content:"ⓘ "; }
.aikwatisdit .instuitleg{margin:2px 0 8px}
.aikconceptlijst{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.aikconcept{padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--card-2); min-width:0; outline:none}
.aikconcept:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.aikconcept.aikslotweg{opacity:.7}
.aikconcept.aikslotweg .aikconcepttekst{color:var(--ink-2)}
.aikconcepttekst{font-size:13.5px; line-height:1.45; color:var(--ink); overflow-wrap:anywhere}
.aikconceptvia{display:block; margin:2px 0 8px; font-size:12px; color:var(--ink-3)}
.aikconcept .mutfout{margin:6px 0 8px; font-size:12.5px; line-height:1.4; color:var(--bad-text)}
.aikconcept .mutknoppen button{min-height:44px}
.aikconceptvoet{margin-top:10px}
@media (max-width:355px){ /* 320 px: rij als kolom, knop volle breedte; de klembordknop onder het codeveld */
  .aikrij{flex-direction:column; align-items:stretch}
  .aikacties{flex-direction:row}
  .aikacties .aikintrek{width:100%}
  .aikcoderij{flex-direction:column}
  .aikclipknop{width:100%}
  .aikconcept .mutknoppen{flex-direction:column}
  .aikconcept .mutknoppen button{width:100%}
}

/* v25.50 — DOELMOTIVATIE (Rabi 5-9 13:30): motiverende zin + persoonlijk inzicht in de Jouw reis-strook; alleen tokens, geen muis-effecten */
.hero .reis .reisbar i{background:linear-gradient(90deg, color-mix(in srgb, var(--good) 72%, var(--accent)), var(--good))}
.reisbar .dmtik{position:absolute; top:0; bottom:0; width:2px; margin-left:-1px; background:color-mix(in srgb, var(--ink) 22%, transparent)}
.reisbar .dmtik.af{background:color-mix(in srgb, var(--card) 70%, transparent)}
.dmkaart{display:flex; flex-direction:column; gap:6px; margin:2px 0 8px}
.dmzin{margin:0; font-size:13px; line-height:1.45; color:var(--ink); white-space:normal}
.dminzicht{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 8px; padding:7px 10px; border-radius:10px; background:color-mix(in srgb, var(--good) 8%, transparent); border:1px solid color-mix(in srgb, var(--good) 22%, transparent); font-size:12.5px; line-height:1.45; color:var(--ink-2)}
.dminzicht.dm-neg{background:color-mix(in srgb, var(--ink-3) 10%, transparent); border-color:var(--line-2)}
.dmchip{display:inline-block; padding:1px 7px; border-radius:999px; font-size:10.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--good-text); background:color-mix(in srgb, var(--good) 14%, transparent); white-space:nowrap}
.dm-neg .dmchip{color:var(--ink-2); background:var(--stat-bg)}
.dminzicht .dmtekst{flex:1 1 200px; min-width:0}
.dmvolgende{margin-left:auto; padding:0; border:0; background:none; font:inherit; font-size:11.5px; font-weight:700; color:var(--accent); cursor:pointer}
.dmvolgende:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
.dmnoot{margin:0; font-size:11px; color:var(--ink-3)}
.reis.dm-b100{border-color:color-mix(in srgb, var(--gold) 55%, transparent); background:linear-gradient(135deg, color-mix(in srgb, var(--gold) 12%, transparent), color-mix(in srgb, var(--gold) 3%, transparent))}
@keyframes dmvier{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--good) 45%, transparent)}100%{box-shadow:0 0 0 14px transparent}}
.reis.dmvier{animation:dmvier 1.2s ease-out 1}
@keyframes dmwissel{from{opacity:.35; transform:translateY(3px)}to{opacity:1; transform:none}}
.dmzin.dmwissel,.dminzicht.dmwissel{animation:dmwissel .25s ease-out 1}
@media (prefers-reduced-motion: reduce){ .reis.dmvier,.dmzin.dmwissel,.dminzicht.dmwissel{animation:none} }
@media (max-width:379px){ .dminzicht{padding:6px 8px} .dmvolgende{flex:1 1 100%; margin-left:0; text-align:right} }
/* v25.50 — BEDRIJFSLINK */
/* v25.50 (BEDRIJFSLINK): herkende bedrijfsnamen in community-berichten en assistent-antwoorden zijn links naar de bedrijfspagina (erft .cashtag: accent, 600, geen onderstreping; het › komt uit ::after) met, alleen als er nieuws over is, een klein 📰-tikdoel erachter dat de Nieuws-tab op dat bedrijf opent. Alleen thematokens, geen muis-effect (tik-eerst), dark én licht; 320 px: inline, breekt met de tekst mee. */
.cashtag.bedrijf::after{content:"\203A";margin-left:1px;opacity:.7;font-weight:400}
.blnieuws{display:inline-block;margin-left:2px;padding:1px 3px;font-size:13px;line-height:1;text-decoration:none;vertical-align:-1px;border-radius:6px;background:color-mix(in srgb, var(--accent) 10%, transparent)}
.msg.ai .cashtag.bedrijf{color:var(--accent)}
.msg.ai .cashtag{color:var(--accent)} /* herstel F2: ook de $TSLA-cashtag in een assistent-antwoord (zelfde accent, zonder ›) */
.msg.ai .blnieuws{background:color-mix(in srgb, var(--accent) 14%, transparent)}
/* v25.50 — TICKERKERN */
/* v25.50 (TICKERKERN, Rabi 5-9 "maak het visueel mega aantrekkelijk en makkelijk te lezen"): de kaart "Het bedrijf in cijfers" onder de
   koersgrafiek — grid label · A · B (zonder vergelijking label · A), kolomkop met de lijnkleur uit de grafiek, vette rijen voor beurswaarde
   en ondernemingswaarde, balkjes die per rij het aandeel van de grootste tonen, drie inzicht-regels met een gouden ×-badge en dezelfde
   badge + goudwas op de rij waar het vandaan komt. Geen muisgebonden effect (alleen :focus-visible), alleen tokens (dark en licht),
   geen id-selectors; onder 360 px staat het label op een eigen regel boven de twee waarden. */
.ktbkaart .cardhead{padding-bottom:2px}
.ktblok{appearance:none; cursor:pointer; background:transparent; border:0; color:var(--accent); font:600 12.5px "IBM Plex Sans",sans-serif; padding:4px 18px 8px; text-align:left; width:100%}
.ktblok:focus-visible{outline:2px solid var(--accent); border-radius:8px}
.ktbinzichten{display:flex; flex-direction:column; gap:6px; margin:6px 18px 10px}
.ktbinz{display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:10px; padding:8px 10px; border-radius:12px; border:1px solid color-mix(in srgb, var(--gold) 35%, transparent); background:color-mix(in srgb, var(--gold) 8%, transparent); font-size:13px; line-height:1.4; color:var(--ink)}
.ktbinz.ktbtop{border-color:color-mix(in srgb, var(--gold) 60%, transparent); background:color-mix(in srgb, var(--gold) 13%, transparent)}
.ktbinz .ktbx{font:800 17px/1 "Archivo",sans-serif; color:var(--gold); font-variant-numeric:tabular-nums; letter-spacing:-.02em; min-width:44px; text-align:center}
.ktbinz .ktbx.kpos{color:var(--good-text); font-size:12px; font-family:"IBM Plex Sans",sans-serif; font-weight:700}
.ktbinz.plat{grid-template-columns:1fr; color:var(--ink-2); border-style:dashed; background:transparent}
.ktbtabel{display:flex; flex-direction:column; margin:0 18px 6px; border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--stat-bg)}
.ktbkop,.ktbrij{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr); gap:6px 8px; align-items:center; padding:7px 10px; border-top:1px solid var(--line); min-width:0}
.ktbtabel.een .ktbkop,.ktbtabel.een .ktbrij{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.ktbkop{border-top:none; padding:8px 10px 6px; background:var(--hl-bg)}
.ktbrij.groep{border-top:1px solid var(--line-2, var(--line))}
.ktbkol{display:flex; flex-direction:column; align-items:flex-end; min-width:0; text-align:right; line-height:1.2}
.ktbkol b{font:800 12.5px "Archivo",sans-serif; color:var(--ink); letter-spacing:.01em; display:inline-flex; align-items:center; gap:5px}
.ktbkol small{font-size:10.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.ktbdot{width:8px; height:8px; border-radius:50%; background:var(--accent); flex:none; display:inline-block}
.ktbkol.b .ktbdot{background:var(--vgk, var(--vg-1))}
.ktbkol.laden{opacity:.65}
.ktblbl{display:flex; flex-direction:column; min-width:0; font-size:12px; font-weight:600; color:var(--ink-2); line-height:1.25; overflow-wrap:anywhere} /* overflow-wrap: "ONDERNEMINGSWAARDE" (kapitalen, 11 px) liep op 414 px de waardekolom in — screenshot 5-9 */
.ktblbl i{font-style:normal; font-size:10px; font-weight:500; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.ktblbl .ktbx{display:inline-block; margin-top:2px; align-self:flex-start; font:800 10.5px/1.5 "Archivo",sans-serif; color:var(--gold); border:1px solid color-mix(in srgb, var(--gold) 45%, transparent); border-radius:6px; padding:0 5px; font-variant-numeric:tabular-nums}
.ktbval{display:flex; flex-direction:column; align-items:flex-end; min-width:0; gap:3px}
.ktbval b{font-family:"Archivo",sans-serif; font-weight:700; font-size:13px; font-variant-numeric:tabular-nums; color:var(--ink); white-space:nowrap; line-height:1.2}
.ktbval b.kpos{color:var(--good-text)} .ktbval b.kneg{color:var(--bad-text)} .ktbval b.ktbleeg{color:var(--ink-3); font-weight:400}
.ktbval small{font-size:10.5px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.ktbval b.tkskel{min-width:64px}
.ktbrij.vet .ktblbl{color:var(--ink); font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:11px}
.ktbrij.vet .ktbval b{font-weight:800; font-size:14px}
.ktbrij.top{background:color-mix(in srgb, var(--gold) 7%, transparent)}
.ktbrij.top1{background:color-mix(in srgb, var(--gold) 12%, transparent); box-shadow:inset 3px 0 0 var(--gold)}
.ktbbalk{display:block; width:100%; height:4px; border-radius:2px; background:var(--seg-bg); position:relative; overflow:hidden}
.ktbbalk::after{content:""; position:absolute; inset:0 auto 0 0; width:var(--w, 0%); border-radius:2px; background:var(--kb, var(--accent)); opacity:.75}
.ktbval.b .ktbbalk{--kb:var(--vgk, var(--vg-1))}
.ktbslot{color:var(--ink-2)} .ktbslot .ktbmeer{color:var(--accent); padding-left:6px}
.ktbnoot{margin-top:2px; color:var(--ink-2)}
.ktbbron{margin-bottom:12px}
.chartbox.ktbladen{background:linear-gradient(90deg,var(--stat-bg) 0%,var(--hl-bg) 50%,var(--stat-bg) 100%); background-size:200% 100%; animation:tkskel 1.3s ease-in-out infinite; border-radius:12px}
.chartbox.ktbladen > *{visibility:hidden} /* v25.50 (TICKERKERN, tegenlezer): tijdens het laden van een ander aandeel stond de koerslijn van het vórige aandeel onder de nieuwe kop (tkSvg wordt op het koude pad niet geleegd) — alleen de shimmer, nooit oude cijfers */
@media (prefers-reduced-motion:reduce){ .chartbox.ktbladen{animation:none} }
@media (max-width:359px){
  .ktbkop,.ktbrij,.ktbtabel.een .ktbkop,.ktbtabel.een .ktbrij{grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2px 8px}
  .ktblbl,.ktblblkop{grid-column:1 / -1; flex-direction:row; align-items:baseline; gap:6px}
  .ktblblkop{display:none}
  .ktblbl .ktbx{margin-top:0}
  .ktbinz .ktbx{min-width:38px; font-size:15px}
}

/* v25.50 (nazorg 1, LIVETAG; Rabi 6-9 "de live knop rood met een gekke kleur tekst — de tekst kan wit zijn"): .ontdekkop span (grijs, .nwsectie .ontdekkop span) won op specificiteit van .nwlivetag (wit); de LIVE-tag is nu altijd wit op rood, dark én licht */
.ontdekkop .nwlivetag,.nwsectie .ontdekkop .nwlivetag,.nwstroom .lbkop .nwlivetag{color:white}

/* v25.50 (nazorg 2, BETAX-ZICHT; Rabi 6-9 "die Belgische meerwaardebelasting zit te verstopt … bovenaan een vlag België/Nederland"): vlaggetje in de portefeuillekop + dashboardkaart Meerwaardebelasting */
.btlandchip{display:inline-flex; align-items:center; gap:4px; margin-top:6px; padding:4px 10px; min-height:28px; border-radius:999px; border:1px solid var(--line); background:var(--stat-bg); color:var(--ink-2); font:inherit; font-size:12.5px; line-height:1.2; cursor:pointer; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.btlandchip[data-hint="BE"]{border-color:var(--accent); color:var(--ink)}
.btlandchip[data-land="BE"]{border-color:color-mix(in srgb, var(--accent) 55%, transparent); color:var(--ink)}
.btdashkaart .btdashtekst{margin:6px 0 10px; color:var(--ink-2); font-size:13.5px; line-height:1.45}
.btdashkaart .btdashknop{width:100%; min-height:44px}
.btlandvraag[data-plek="boven"]{margin-top:0}

/* v25.50 (nazorg 3, LIVEBLOG-DICHT; Rabi 6-9 11:05): het liveblog start dichtgeklapt — de rode kop is een knop met chevron; dicht = subkop zonder onderrand */
.nwstroom .lbkop[data-lbklap]{cursor:pointer; -webkit-user-select:none; user-select:none}
.nwstroom .lbsub[data-lbklap]{cursor:pointer}
.nwstroom .lbklapchev{margin-left:auto; color:var(--ink-3); font-size:15px; line-height:1; padding:0 2px}
.nwstroom.lbdicht .lbsub{margin-bottom:2px}
.nwstroom .lbkop[data-lbklap]:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
/* v25.50 — ANALISTEN-DIVIDEND (nazorg 3, BEDRIJFSPAGINA2-CLIENT; Rabi 6-9): tabel "Wat analisten verwachten" per boekjaar bovenin Wat is het waard? + tab Dividend; alleen tokens, geen hex, geen id-selectors, geen aanwijs-effecten, 320 px zonder horizontaal scrollen */
.anvw{margin:0 0 4px}
.anvwkop{display:flex;justify-content:space-between;align-items:baseline;gap:6px 10px;padding:0 18px 6px;flex-wrap:wrap}
.anvwkop b{font-family:"Archivo",sans-serif;font-size:13.5px}
.anvwwrap{margin:0 18px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.anvwtabel{display:flex;flex-direction:column;min-width:100%;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--stat-bg)}
.anvwrij{display:grid;grid-template-columns:minmax(96px,1.2fr) repeat(var(--n,2),minmax(78px,1fr));gap:2px 8px;align-items:baseline;padding:6px 10px;border-top:1px solid var(--line);font-size:12.5px;min-width:0}
.anvwrij.kop{border-top:none;background:var(--hl-bg)}
.anvwrij.kop .val b{font:700 12.5px "Archivo",sans-serif;color:var(--ink)}
.anvwrij .val small{display:block;font-size:10.5px;color:var(--ink-3);white-space:normal;overflow-wrap:anywhere} /* v25.50 (nazorg 3, BEDRIJFSPAGINA2-CLIENT, tegenlezer bevinding 3): de redentekst onder "–" ("cijfers niet op één basis") is breder dan een jaarkolom op 320–414 px — afbreken i.p.v. over de buurcel lopen of afgekapt worden */
.anvwrij.groep{border-top:1px solid var(--line-2,var(--line));background:color-mix(in srgb,var(--gold) 7%,transparent)}
.anvwrij.groep .lbl{grid-column:1 / -1;text-transform:uppercase;letter-spacing:.06em;font-size:10.5px;color:var(--ink-3)}
.anvwrij .lbl{display:flex;flex-direction:column;color:var(--ink-2);font-weight:600;font-size:12px;overflow-wrap:anywhere}
.anvwrij .lbl i{font-style:normal;font-size:10px;font-weight:500;color:var(--ink-3)}
.anvwrij .val{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink);min-width:0}
.anvwrij.vet .val{font-family:"Archivo",sans-serif;font-weight:700;font-size:13px}
.anvwrij .val.kpos{color:var(--good-text)}
.anvwrij .val.kneg{color:var(--bad-text)}
.anvwrij .val.leeg{color:var(--ink-3);font-weight:400}
.anvwlt,.anvwbeschikbaar,.anvwnoot{margin-top:6px}
.anvwtabel.een .anvwrij{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.divtkgroei{margin:6px 18px 4px}
.divtkgroei .val small{white-space:normal}
.divtkmeer,.divtkjaren{margin:0 18px 6px}
.divtkhist{margin:0 18px 8px}
.divtkstatus .divtkopnieuw{margin-left:6px}
.divtkeigen a{color:var(--ink-2);text-decoration:underline;text-underline-offset:2px}
.divtkstatus:not([hidden]){display:flex;flex-wrap:wrap;gap:4px 6px;align-items:baseline}
@media (max-width:359px){
  .anvwrij{grid-template-columns:minmax(80px,1fr) repeat(var(--n,2),minmax(64px,1fr));font-size:12px;padding:5px 8px}
  .anvwrij .val small{font-size:10px} /* v25.50 (nazorg 3, BEDRIJFSPAGINA2-CLIENT, tegenlezer bevinding 3): de tabknoppen-regel (was een dubbel van de bestaande 360 px-regel voor .tkviewbar .tktabs button) is weg */
}

/* v25.51 — ANALISTEN-DIVIDEND (integrator, doorloop 320 px): de tabel "Wat analisten verwachten" groeit mee met de minimale breedte van zijn
   kolommen in plaats van de laatste jaarkolom af te knippen — op 320 px (twee jaren: rij 241 px, tabel 230 px) en op 414 px zodra er drie of meer
   boekjaren staan was de gridrij breder dan .anvwtabel (overflow:hidden voor de ronde hoeken) en verdween de rechterkolom deels; met fit-content
   wordt de tabel zo breed als zijn inhoud vraagt en scrolt .anvwwrap (overflow-x:auto) zoals bedoeld. Doorloopcheck bp2RedenPast320 was hierdoor
   rood (redentekst r.right 278 > tabelrand 275, geen tekstprobleem). Op brede schermen blijft min-width:100 % gelden. */
.anvwtabel{width:fit-content;min-width:100%}

/* v25.51 — BETAX2 */
/* v25.51 (BETAX2, CLIENT; Rabi 6-9 "Belgen 20k vrijstelling met partner en ook een optout"): de partnerkaart (schakelaar, stelsel-segment, eigendom per
   portefeuille, personenblok Jij · Je partner met balkjes), de standenkaart "Wie houdt de 10 % in?" (segmenten per rekening en per jaar, startdatum 2026
   met datumveld, feitenregel), de toelichting van de server, de subregels op kaart 1 en de regel "nog niet beschikbaar". Alleen tokens (--stat-bg, --hl-bg,
   --line, --line-2, --ink, --ink-2/-3, --accent, --good-text, --bad-text); geen muis-effecten (de suites scannen de CSS-staart) — aria-pressed en
   focus-visible dragen de staat; tikdoelen ≥ 44 px; 320 px zonder horizontale scroll (personenblok in één kolom ≤ 359 px, overflow-wrap:anywhere);
   prefers-reduced-motion op de balkjes; dark én licht via de tokens. */
.btpartner .bt2partnerrij{margin:0 18px; padding:2px 0}
.bt2uitleg{margin:6px 18px 8px}
.bt2kopje{margin:10px 18px 2px; font-size:12.5px; font-weight:600; color:var(--ink-2)}
.bt2seg{display:flex; flex-wrap:wrap; gap:6px; margin:6px 18px 4px}
.bt2seg button{appearance:none; font:inherit; font-size:12.5px; font-weight:600; min-height:44px; padding:8px 12px; border-radius:12px; border:1px solid var(--line); background:var(--stat-bg); color:var(--ink-2); cursor:pointer; text-align:left; overflow-wrap:anywhere; max-width:100%}
.bt2seg button[aria-pressed="true"]{border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); background:var(--hl-bg); color:var(--ink)}
.bt2seg button:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.bt2pf{margin:0 18px; padding:8px 0 4px; border-top:1px solid var(--line)}
.bt2pf .bt2seg,.bt2pf .btuitleg,.bt2pf .bt2vanaf{margin-left:0; margin-right:0}
.bt2pflabel{font-size:13.5px; color:var(--ink); overflow-wrap:anywhere}
.bt2pflabel b{font-weight:600}
.bt2toon{display:inline-block; min-height:44px; padding:10px 0; color:var(--accent); font-weight:600}
.bt2toon:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.bt2vanaf{margin-top:2px; padding-top:4px; border-top:1px dashed var(--line)}
.bt2vanaf input[type="date"]{font:inherit; font-size:13px; min-height:44px; padding:8px 10px; border-radius:10px; border:1px solid var(--line); background:var(--stat-bg); color:var(--ink); max-width:100%; margin:6px 0 2px}
.bt2vanaf input[type="date"]:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.bt2feit{color:var(--ink-2)}
.bt2subkop{font-size:12.5px; color:var(--ink-3)}
.bt2personen{display:grid; grid-template-columns:1fr 1fr; gap:8px 12px; margin:10px 18px 4px}
.bt2kop{font-size:11.5px; font-weight:700; color:var(--ink-2); text-transform:uppercase; letter-spacing:.06em}
.bt2rijlabel{grid-column:1 / -1; font-size:12.5px; color:var(--ink-3); margin-top:2px; padding-top:8px; border-top:1px solid var(--line); overflow-wrap:anywhere}
.bt2cel{font-variant-numeric:tabular-nums; min-width:0; overflow-wrap:anywhere; font-size:13.5px}
.bt2cel b{font-weight:700; color:var(--ink)}
.bt2cel b.kpos{color:var(--good-text)}
.bt2cel b.kneg{color:var(--bad-text)}
.bt2wie{display:none; font-style:normal; font-size:11.5px; color:var(--ink-3); margin-right:6px}
.bt2balk{height:8px; border-radius:999px; background:var(--line-2); overflow:hidden; margin:6px 0 4px}
.bt2vul{height:100%; border-radius:999px; background:var(--accent); transition:width .25s ease}
@media (prefers-reduced-motion:reduce){ .bt2vul{transition:none} }
.bt2balktekst{font-size:12px; color:var(--ink-2)}
.bt2samen{margin:6px 18px 4px}
.bt2samen .krow b{white-space:nowrap; flex:none}
.bt2samen .krow.btindicatie{font-weight:700}
.bt2sub span{flex:1; overflow-wrap:anywhere}
.btvrijkop .bt2pill{font-size:11px; padding:2px 8px; font-weight:600}
.bt2toelichting{list-style:none; margin:8px 18px 4px; padding:0}
.bt2toelichting li{position:relative; padding:4px 0 4px 12px; font-size:12px; line-height:1.5; color:var(--ink-3)}
.bt2toelichting li::before{content:"·"; position:absolute; left:0; top:4px; color:var(--ink-2)}
.bt2nogniet{margin:2px 18px 12px; color:var(--ink-2)}
.bt2voet{margin-top:8px}
.btbron.bt2bron > .chartsub{margin-bottom:12px}
@media (max-width:359px){
  .bt2personen{grid-template-columns:1fr}
  .bt2kop{display:none}
  .bt2wie{display:inline}
  .btpartner .bt2partnerrij,.bt2uitleg,.bt2kopje,.bt2seg,.bt2pf,.bt2personen,.bt2samen,.bt2toelichting,.bt2nogniet{margin-left:14px; margin-right:14px}
  .bt2pf .bt2seg{margin-left:0; margin-right:0}
  .bt2seg button{font-size:12px; padding:8px 10px}
} /* v25.51 (integrator, BETAX2/PERSBERICHTEN): sluit de 359 px-mediaquery van BETAX2 — bij het samenvoegen van de twee css-staarten (ours-kop + bouwerblok) was deze accolade weggevallen, waardoor de persberichten-css binnen de mediaquery stond en de doorloopchecks pbModalApp/pbNieuwsLijst/pbLezer rood waren */

/* v25.51 — PERSBERICHTEN P5 */
/* v25.51 (PERSBERICHTEN, P5): de openingsregel (klein, cursief, --ink-3; een div, dus `.art2 #artBody p` raakt hem niet), de cijferskaart in de lezer, de
   rubriekkleur in Nieuws, de kaart bij het aandeel, de redactiewachtrij en het voorbeeld-/bewerkvenster op /beheer. Alleen thematokens (dark én licht), geen
   id-selectors, geen hex, geen aanwijs-effecten (de oudere suites scannen de staart van dit bestand); 320 px zonder horizontaal scrollen; toetsenbord via :focus-visible. */
.pbopening{font-size:12.5px;line-height:1.45;font-style:italic;color:var(--ink-3);margin:-4px 0 12px}
.pbcijfers{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;background:var(--card-2,var(--stat-bg));border:1px solid var(--line);border-radius:10px;padding:10px;margin:0 0 14px}
.pbcijfers .pbcijferskop{grid-column:1 / -1;font:700 11px "Archivo",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.pbcijfers .pbrij{display:flex;flex-direction:column;gap:2px;min-width:0}
.pbcijfers .pbwaarde{font:700 15px "Archivo",sans-serif;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.pbcijfers .pblabel{font-size:11.5px;color:var(--ink-2)}
.pbcijfers .pbtoel{font-size:10.5px;color:var(--ink-3);overflow-wrap:anywhere}
.pbbron{font-size:13.5px;color:var(--ink-2)}
.pbbron a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.pbkoers{display:inline-flex;align-items:baseline;gap:6px;margin:2px 0 14px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--hl-bg);font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.pbkoers b{color:var(--ink)} .pbkoers i{font-style:normal;color:var(--ink-3)} .pbkoers em{font-style:normal;font-weight:600} .pbkoers em.up{color:var(--good-text)} .pbkoers em.down{color:var(--bad-text)} .pbkoers em.mut{color:var(--ink-3)}
.pbsitelink{margin:6px 0 14px}
.art2.pbartikel .art2-voet a[hidden]{display:none}
.nwr-persbericht{color:var(--accent)} .nwstip.nwr-persbericht{background:var(--accent)}
.nwpbitem .pbexcerpt{font-size:12.5px;color:var(--ink-3);overflow-wrap:anywhere}
.pbkaart .nwlijst{padding:0 18px 10px}
.pbkaart .nwitem{width:100%;grid-template-columns:minmax(0,1fr)}
.pbkaart .nwitem:focus-visible,.nwpbitem:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.pblicentie{font-size:11.5px}
.pbwerkbalk select,.pbbulk select{font:inherit;font-size:12px;padding:5px 8px;border-radius:10px;border:1px solid var(--line-2);background:var(--input-bg);color:var(--ink);max-width:100%}
.pbwerkbalk .pbzoek{margin-top:0;flex:1 1 180px;min-width:140px}
.pbbulk{align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:var(--hl-bg)}
.pbbulk[hidden]{display:none}
.pblijst li.pbwrij{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 10px;align-items:start;padding:8px 0;border-top:1px solid var(--line)}
.pblijst li.pbwrij:first-child{border-top:none}
.pbwrij input[type="checkbox"]{margin:4px 0 0;accent-color:var(--accent)} .pbwrij .pbkiesleeg{display:inline-block;width:13px} /* v25.52 (HUISSTIJL2): vinkje in het accent (was groen) */
.pbwrij .bhnaam{display:flex;flex-direction:column;gap:3px;min-width:0}
.pbwrij .pbtitel{font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.pbwrij .pbnaam{font-size:12px;color:var(--ink-2)} .pbwrij .pbnaam b{color:var(--accent)}
.pbwrij .pbvlaggen{display:flex;flex-wrap:wrap;gap:4px}
.pbwrij .pbvlaggen:empty{display:none}
.pbvlag{appearance:none;cursor:pointer;font:inherit;font-size:10.5px;font-weight:600;background:none;white-space:normal;text-align:left;overflow-wrap:anywhere;line-height:1.3;padding:2px 8px;max-width:100%} /* de vlagtekst wikkelt (de basis .bhchip is nowrap): op 320 px nooit buiten de kaart */
.pbvlag:focus-visible,.pbwerkbalk select:focus-visible,.pbbulk select:focus-visible,.pbtabs button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbwrij .pbsitereden{margin:0;color:var(--gold)}
.pbwrij .bhsigknoppen{grid-column:2;flex-wrap:wrap;justify-content:flex-start}
.pbwrij .bhsigknoppen .bhchip{margin-left:0;padding:4px 8px;font-size:11px;text-decoration:none}
.pbleeg{padding:6px 0}
.pbmodal{max-width:min(640px,100vw)}
.pbmodal .seg{margin-bottom:10px}
.pbmodal .pbvoet{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.pbmodal .pbpoort{margin:0}
.pbmodal .pbartbody h1{font-size:20px;line-height:1.25;margin:0 0 8px}
.pbmodal .pbartbody h2{font-size:15px;margin:14px 0 6px}
.pbmodal .pbartbody p{font-size:14px;line-height:1.6;margin:0 0 12px;color:var(--ink)}
.pbmodal .pbartbody .art2-intro{color:var(--ink-2)}
.pbcover img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--line);margin-bottom:6px}
.pbcover{margin-bottom:10px}
.pbsitevoorbeeld{font-size:14px;line-height:1.6;color:var(--ink)}
.pbform{display:flex;flex-direction:column;gap:8px}
.pbform .pbveld{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--ink-2)}
.pbform .pbveld input,.pbform .pbveld textarea{font:inherit;font-size:13px;padding:7px 10px;border:1px solid var(--line-2);border-radius:10px;background:var(--input-bg);color:var(--ink);width:100%;resize:vertical}
.pbform .pbveld input:focus-visible,.pbform .pbveld textarea:focus-visible,.pbconfig:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbtitelcheck{color:var(--gold);margin:0}
.pbrapport{font-size:11px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--hl-bg);color:var(--ink-2)}
.pbconfig{font:12px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;width:100%;padding:8px;border:1px solid var(--line-2);border-radius:10px;background:var(--input-bg);color:var(--ink);resize:vertical}
.pbcovers{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:6px;margin-top:6px}
.pbcovers .bhveld{flex-direction:column;gap:2px;margin-top:0;font-size:11px;color:var(--ink-3)}
.pbtabel th,.pbtabel td{text-align:left;white-space:normal;overflow-wrap:anywhere}
.pbleren b.bhgrijs,.pbinstellingen b.bhgrijs{display:block;margin-top:8px}
@media (max-width:359px){
  .pbwrij .bhknop{width:100%}
  .pbwerkbalk .bhknop,.pbbulk .bhknop{flex:1 1 100%}
  .pbcijfers{grid-template-columns:1fr}
}

/* v25.51 — POLITICI-MELDINGEN */
/* v25.51 (POLITICI-MELDINGEN, CLIENT): de pil "🔔 Melding" op de politicuspagina (accentstijl als hij aan staat), de 🔔-rijen "🏛 Naam meldde
   een aankoop" met de $TICKER-chip, en de kaart Politici · vandaag (#nwPolitici) op Nieuws. Alleen tokens (dark + licht), geen partijkleur op
   knoppen of tekst, géén muis-effect (de iOS-plak-les van v25.44; de "onderaan tot het eind"-pins van ± 30 oudere suites blijven zo groen —
   dezelfde keuze als politici2 en tickeractiviteit), wél :focus-visible; telefoons (≤ 479 px): de pil op een eigen regel onder de kop via de klasse
   .pmkop die pmKnopZet alleen mét een zichtbare pil zet (herstel tegenlezer: geen :has(), geen lege regel zonder pil). */
.pmknop{flex:none; white-space:nowrap}
.pmknop[aria-pressed="true"]{background:color-mix(in srgb, var(--accent) 18%, var(--card)); border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); color:var(--accent); font-weight:700}
.notifrow .pmav{flex:none; background:none; width:32px; height:32px}
.notifrow .pmtk, .pmnieuws .pmtk{font-weight:700; color:var(--ink); cursor:pointer; text-decoration:underline; text-underline-offset:2px}
.pmnieuws{border-left:3px solid var(--accent)}
.pmnieuws .polsymrij{cursor:pointer}
.pmnieuws .pmnwlijst{padding:6px 0 0}
.pmnwvoet{margin:8px 0 0; line-height:1.45}
.pmnwmeer{display:inline-block; margin-top:8px; font-weight:600; color:var(--accent); text-decoration:none}
.pmknop:focus-visible,.pmrow:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
/* v25.51 (POLITICI-MELDINGEN, CLIENT): herstel tegenlezer — het woord "Melding" is op élk scherm zichtbaar ("🔔 Melding" / "🔔 Melding aan", spec §4.3; een kale bel legde in de uit-stand niets uit): de eerdere regel die het woord ≤ 479 px verborg is weg. Op telefoons (≤ 479 px) krijgt de pil een eigen regel onder de kop: naast de naam staat sinds MENU (v25.46) ook de ≡-knop, en inline hield de naam met het hele woord op 414 px nog 99 px en op 375 px ± 60 px over ("Pat F…"); vanaf 480 px staat de pil inline. aria-label en title dragen de volledige tekst. */
@media (max-width:479px){ .polscreen .apphead.polkop.pmkop{flex-wrap:wrap} .polscreen .apphead.polkop.pmkop::after{content:""; flex-basis:100%; height:0; order:8} .polkop.pmkop .pmknop{order:9; margin-left:auto; margin-top:-6px; padding-left:8px; padding-right:8px} } /* telefoons: de pil op een eigen regel rechts onder de kop (flex-regeleinde via ::after), de naam houdt de hele breedte — alle drie de regels hangen aan .pmkop, die pmKnopZet alleen mét een zichtbare pil zet (herstel tegenlezer: geen :has(), geen lege regel zonder pil, geen verdwenen naam in een browser zonder :has(); was ≤ 359 px) */
/* v25.51 — COMMUNITY-VIEWS */
/* v25.51 (COMMUNITY-VIEWS, CLIENT; Rabi 6-9 "laat de views zien bij elk bericht"): de 👁-teller in de metaregel van elke berichtkaart (feed, kanaal, aandelenpagina,
   profiel, draad + antwoorden). Alleen tokens, geen aanwijs-effecten, tabular-nums; de lettergrootte komt uit de bestaande span-regels van de metaregel (v25.51 (integrator, COMMUNITY-VIEWS): herformulering vanwege de woordscan van de politici-suites op de css-staart) (geen eigen
   id-selectors — de staart-scans van de tickerkern-/bedrijfspagina2-/betax2-suites verbieden ze); blijft vóór .pdel (margin-left:auto op de eerste .pdel houdt de knoppen rechts). */
.pmeta .cvteller{white-space:nowrap; color:var(--ink-3); font-variant-numeric:tabular-nums}
.cvteller:empty{display:none}

/* v25.51 — nazorg 5 LOGIN-ZICHT: de hulpregel (id loginHulp2) onder de foutmelding van het nieuwe inlogscherm (alleen ná een verkeerd wachtwoord /
   onbekend adres; leeg en verborgen in elke andere stand). Eigen sectie buiten het F-login-blok (selector-whitelist van test-login blok D);
   gescoopt op .authhulp — bestaat alleen in het nieuwe scherm (authNieuw). Alleen thematokens, geen muis-effecten, geen id-selector. */
.authhulp{margin:-2px 0 10px;color:var(--ink-2);font-size:13px;line-height:1.45}
.authhulp:not([hidden]){display:block}
/* v25.51 — nazorg 5 LIVEBLOG-ROBUUST: de knop "Schrijf nu" met de rondestand-regel op /beheer (kaart Beursblog, Signalen én Klassiek);
   de regel groeit mee en breekt af op 320 px, de knop houdt zijn bhknop-stijl (geen eigen aanwijs-effecten); aria-live op de regel. */
.lbrrij{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.lbrrij .lbrstand{margin:0;flex:1 1 160px;min-width:0;overflow-wrap:anywhere}
.lbrrij .lbrstand:empty{display:none}
/* v25.51 — KANALEN */
/* v25.51 (KANALEN, CLIENT; Rabi 6-9 avond "Verberg alle andere kanalen en maak ze ook verder niet meer te gebruiken"): de compose-bedrijfsknop in de
   "kies een bedrijf"-stand (gestippelde rand, accentkleur — het tikdoel blijft de bestaande .pill) en de beheerregel "verborgen kanalen: N ·
   berichten daarin: M" onder de tegels van de kaart Community. Alleen tokens; geen aanwijs-effecten nodig. */
.composekanaal.knkies{border-style:dashed;color:var(--accent)}
.bhleeg.knbeheer{margin-top:6px}

/* v25.51 — REFERRAL */
/* v25.51 (REFERRAL, CLIENT; Rabi 6-9 avond "hoeveel mensen iemand heeft gerefereerd … dit moet erop staan"): de uitnodigingsregel in het deel-sheet en in
   Instellingen, de belofte-regel op de openbare deelpagina en de tegels op /beheer (gebruiken .bhstat). Alleen thematokens, geen aanwijs-effecten, geen id-selectors, geen hex. */
.refregel{margin:6px 0 10px;padding:8px 10px;border-radius:10px;background:var(--stat-bg);color:var(--ink);font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.instref .refregel{margin:0 0 8px}
.shcta .shref{margin:0 0 10px;padding:8px 10px;border-radius:10px;background:var(--accent-wash);color:var(--ink);font-size:13px;line-height:1.45;text-align:left}
.shcta .shref[hidden]{display:none}

/* v25.51 — DEELKAART */
/* v25.51 (nazorg 6, DEELKAART): de portefeuillekaart in een bericht is een <a> (deelpagina of profiel) i.p.v. een <button>; zonder lid een <span> zonder klik; hintregel onder het composer-voorbeeld. Bewust geen aanwijs-effect (de <button> had er ook geen; de staart-scans van oudere suites verbieden dat ná hun marker) */
a.pfbijlage.pfkaart{text-decoration:none; color:var(--ink)}
a.pfbijlage.pfkaart:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.pfbijlage.pfkaart.pfkaartstil{cursor:default}
.composebijlage{flex-wrap:wrap}
.composebijlage .pfdeelhint{flex-basis:100%; margin:6px 0 0; font-size:12px; line-height:1.4; color:var(--ink-3)}

/* v25.51 — DIVTAB-FIX */
/* v25.51 (nazorg 6, DIVTAB-FIX; Rabi 6-9 avond, screenshot Dividend-tab op een telefoon "ook zit hier een bug met slechte visualisatie"): de groeitabel
   "Groei van de jaaruitkering" erfde min-width:100% van .anvwtabel én had eigen zijmarges van 18 px — daardoor was hij 36 px breder dan de ruimte
   tussen die marges en vielen de rechter 18 px buiten de kaart ("+21,6%/" zonder "jr", "(2024–2025" zonder sluithaakje). Nu: breedte automatisch
   tussen de marges (niet het fit-content/min-width van de analistentabel — die scrolt in .anvwwrap, deze tabel staat los in de kaart), de labelkolom
   smal (korte labels 1/3/5/10 jaar) en de waardekolom ruim zodat "$ 2,87 → $ 3,49 (2024–2025)" vanaf 375 px op één regel past en op 320 px binnen
   zijn cel afbreekt; de kop spant de hele rij (de lege waardecel van de kop weg). De rijen Laatste uitkering … Volgende mogen afbreken: een waarde
   die niet naast zijn label past komt eronder, rechts uitgelijnd, met gebalanceerde regels. Alleen thematokens, geen aanwijs-effecten, geen id-selectors, geen hex. */
.anvwtabel.divtkgroei{width:auto;min-width:0}
.anvwtabel.divtkgroei .anvwrij{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.anvwtabel.divtkgroei .anvwrij.kop .lbl{grid-column:1 / -1}
.anvwtabel.divtkgroei .anvwrij.kop .val{display:none}
.anvwtabel.divtkgroei .anvwrij .val{overflow-wrap:anywhere}
.divtkrijen .krow{flex-wrap:wrap;row-gap:2px}
.divtkrijen .krow b{flex:1 1 auto;min-width:0;text-wrap:balance}
/* v25.51 — LOGO2 */
/* v25.51 (nazorg 6, LOGO2; Rabi 6-9 avond "gebruik dit als logo en fav icon"): het ronde beeldmerk (logo-rond.png) boven de slogan op beide inlogschermen
   (klassiek .brand en nieuw .authmerk) — 72 px op mobiel, 96 px vanaf 900 px; de cirkel is al blauw, dus geen extra vlak, geen aanwijs-effect; dark én licht gelijk.
   Het ≡-paneel gebruikt hetzelfde bestand via de bestaande .paneelicoon (30 px). */
.authlogo{display:block; width:72px; height:72px; margin:0 0 12px; border-radius:50%}
@media (min-width:900px){ .authlogo{width:96px; height:96px; margin-bottom:14px} }

/* v25.51 — POLITICI-KOP */
/* v25.51 (nazorg 7, POLITICI-KOP; Rabi 6-9 avond, iPhone-screenshot van een politicuspagina: "die 'te laat gemeld' is ook verkeerd geplaatst, overlapt … ziet er
   een beetje saai en buggy uit"): de lay-outfixes uit het onderzoek politici3 (B1–B8) die óók ná de eerste v2-nachtronde blijven — kop en rijen zijn gedeeld
   tussen de oude (v25.45) en de nieuwe (v25.50) weergave. (B1) de te-laat-badge is een eigen chipregel ónder partij · kamer · district, nooit meer inline in
   de lopende tekst en nooit brekend binnen de pil; (B2) district ("FL-25") en datums breken niet op het koppelteken (.polplek/.poldatum/.polmdatum);
   (B3/B4, oude weergave) de volume-tegel ≤ 479 px over de volle breedte met het bedrag op één regel, de scores per periode als één blok; (B5) de compacte
   meldingsrij wikkelt ≤ 479 px (was ≤ 359 px — op 360–420 px liep "+13,6 % sinds aankoop" uit de kaart); (B6) de politicusrij op de bedrijfspagina en de
   kaart Politici · vandaag: ≤ 479 px de tk-regel voor álle .polsymrij (pil · datum · badge onder de naam), ≥ 480 px de rechterkolom hoogstens 46 % zodat
   de naamkolom nooit onder de 120 px zakt; (B7, oude weergave) de rechterkolom van de positierij niet vast 96 px. Alleen thematokens, geen aanwijs-effect,
   geen id-selectors, geen hex, geen partijkleur. */
.polkop .polsub .polsubchips{display:block; margin-top:5px; line-height:1}
.polkop .polsub .polsubchips .pill{display:inline-block; margin-left:0; white-space:nowrap; vertical-align:top}
.polplek,.poldatum{white-space:nowrap}
.polm .polmdatum{white-space:nowrap}
.polscores .polscore{display:inline-block; white-space:nowrap}
.polflow:not(.pol2flow) .polpos > summary{grid-template-columns:28px minmax(0,1fr) minmax(max(96px, min(120px, 40%)), 40%)}
.polflow:not(.pol2flow) .polpos .pright{max-width:none}
.pol2pos .polpos .pleft .polposmeta .poldatum,.polpos .pleft .polnaam{white-space:inherit}
.pol2pos .polpos .pleft .polposmeta .poldatum{white-space:nowrap}
.polsymrij{grid-template-columns:28px minmax(0,1fr) minmax(0,46%)}
.polsymrij .pleft{min-width:0}
.polsymrij .pright{min-width:0}
@media (max-width:479px){
  .polm .polmwaarde{white-space:normal; flex-wrap:wrap; justify-content:flex-end; gap:2px 8px; min-width:0; max-width:100%}
  .polkern .rdgroot:nth-child(2){grid-column:1 / -1; order:3}
  .polkern .rdgroot b.polvol{white-space:nowrap}
  .polsymrij{grid-template-columns:28px minmax(0,1fr)}
  .polsymrij .pright{grid-column:2; max-width:none; display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:flex-start; gap:4px 8px; text-align:left; margin-top:2px}
  .polsymrij .pright .polbadge{margin-top:0}
}
@media (min-width:360px) and (max-width:479px){ .polkern.rdhoofd{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:339px){ .polkop .polsub .polsubchips .pill{white-space:normal; max-width:100%; line-height:1.3; padding-top:3px; padding-bottom:3px} } /* 320 px: de naamkolom is 130 px breed — de chip blijft één doos (twee tekstregels binnen de pil) in plaats van buiten de kop te steken */
/* v25.51 — VIEWS-ACTIES */
/* v25.51 (nazorg 6, VIEWS-ACTIES; Rabi 6-9 avond, screenshot: "views zo weergeven naast emoji en antwoorden … zelfde stijl als onderstaande tabbladen"):
   in de actierij onder elk bericht (feed, kanaal, draad) de antwoordknop als tekstballon-icoon + getal en de weergaven-teller (staafjes + compact
   getal, geen knop) ernaast; beide iconen in de lijnstijl van de tabbalk (stroke 1,8). De rij zelf staat in alle gastheren al inline en altijd
   zichtbaar (ook op muis-apparaten, sinds v25.40) — daar verandert niets aan. Op de oude kaart (profielfeed, reacties) blijft de teller in de
   metaregel met hetzelfde icoon. Alleen tokens, tabular-nums; geen aanwijs-effecten (de gastheer-regels hebben die al voor de knoppen). */
.hovacts button.antwoorden{display:inline-flex; align-items:center; gap:4px; font-variant-numeric:tabular-nums}
.hovacts button.antwoorden .vateller:empty{display:none}
.hovacts .cvteller{display:inline-flex; align-items:center; gap:4px; height:24px; padding:3px 8px; border-radius:7px; font:600 11.5px "IBM Plex Sans",sans-serif; line-height:1.5; color:var(--ink-3); white-space:nowrap; font-variant-numeric:tabular-nums; cursor:default}
.vaico{width:16px; height:16px; display:block; flex:none}
.pmeta .cvteller{display:inline-flex; align-items:center; gap:3px; vertical-align:middle}
.pmeta .cvteller .vaico{width:13px; height:13px}
/* v25.52 — KOERSALERTS */
/* v25.52 (KOERSALERTS, CLIENT; Rabi 6-9 avond "alerts die je aan kan zetten zoals een 10% dip op een etf of aandeel"): de knop 🔔 Alert naast de ☆ in de
   kop van de bedrijfspagina (.kabtn: dezelfde 36 px-vorm als .wlbtn, aan = accentwas; de korte "10 %" altijd, het woord vanaf 600 px), de 🔔 in de
   watchlistrij (.kawl, naast de ticker, aan = accent + percentage), de regel in de klaprij (.kapos = .linkbtn), het alert-sheet (#kaSheet: greep,
   richting-segment, snelkeuzes, vrij veld met %-teken en foutregel, frequentie-radio's, knoppen), de alert-rijen in 🔔 (.karow) en de lijst onder
   Instellingen → Meldingen (.karij: logo · tekst · schakelaar · ✎ · 🗑, op 320 px past alles op één regel doordat de tekst afkapt). Alleen thematokens,
   geen nieuwe hexen, geen id-selectors; bewust geen aanwijs-effecten (de staart-scans van oudere suites verbieden die ná hun marker — zoals DEELKAART);
   focus-visible op elke knop; de vul-animatie (.kapop) staat uit bij prefers-reduced-motion. */
.tkkop .kabtn{margin:0; min-width:36px; height:36px; padding:0 9px; border-radius:12px; font-size:15px; font-weight:600; display:inline-flex; align-items:center; justify-content:center; gap:4px; flex:none; border:1px solid var(--line-2); color:var(--ink-2); background:var(--card); box-shadow:none; white-space:nowrap}
.tkkop .kabtn .katxt{display:none}
.tkkop .kabtn .kakort{font-size:12.5px; font-variant-numeric:tabular-nums}
.tkkop .kabtn.on{color:var(--accent); background:var(--accent-wash); border-color:color-mix(in srgb, var(--accent) 45%, transparent)}
.tkkop .kabtn:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
@media (min-width:600px){ .tkkop .kabtn .katxt{display:inline; font-size:13px} }
.kawl{appearance:none; border:1px solid var(--line-2); background:transparent; color:var(--ink-3); cursor:pointer; font:600 11px "IBM Plex Sans",sans-serif; line-height:1; padding:3px 6px; margin-left:6px; border-radius:999px; vertical-align:middle; white-space:nowrap; font-variant-numeric:tabular-nums}
.kawl b{font-weight:700}
.kawl.aan{color:var(--accent); background:var(--accent-wash); border-color:color-mix(in srgb, var(--accent) 45%, transparent)}
.kawl:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.pdetail .kapos{color:var(--accent); font-weight:600; flex-basis:100%; text-align:left}
@keyframes kapop{0%{transform:scale(1)}45%{transform:scale(1.32)}100%{transform:scale(1)}}
.kapop{animation:kapop .38s ease-out}
@media (prefers-reduced-motion: reduce){ .kapop{animation:none} }
/* het sheet */
.kasheet{padding-bottom:calc(18px + env(safe-area-inset-bottom))}
.kagreep{width:40px; height:4px; border-radius:999px; background:var(--line-2); margin:8px auto 0}
.kakop{display:flex; align-items:baseline; gap:8px; padding:0 16px 10px; min-width:0}
.kakop b{font:800 20px "Archivo",sans-serif; letter-spacing:-.01em; color:var(--ink); flex:none}
.kakop span{font-size:13px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0}
.kaveld{padding:8px 16px 0}
.kalbl{display:block; font:700 12.5px "IBM Plex Sans",sans-serif; letter-spacing:.02em; text-transform:none; color:var(--ink-2); margin:0 0 6px} /* ook als <label>: de globale label{uppercase}-regel geldt hier niet */
.kaseg button{flex:1; padding:8px 6px}
.kaseg button[aria-checked="true"]{background:var(--card-2); color:var(--ink)}
.kasnelrij{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:6px; margin-bottom:8px}
.kasnel{appearance:none; cursor:pointer; font:600 13px "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums; color:var(--ink-2); background:var(--card-2); border:1px solid var(--line-2); border-radius:10px; padding:8px 4px; min-height:36px}
.kasnel.on{color:var(--accent); background:var(--accent-wash); border-color:color-mix(in srgb, var(--accent) 45%, transparent)}
.kasnel:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.kapctrij{position:relative; display:flex; align-items:center}
.kapct{width:100%; padding-right:34px; font-variant-numeric:tabular-nums}
.kapctteken{position:absolute; right:12px; font-size:14px; font-weight:600; color:var(--ink-3); pointer-events:none}
.kafout{margin:6px 0 0; font-size:12.5px; line-height:1.4; color:var(--bad-text)}
.kapct[aria-invalid="true"]{border-color:var(--bad)}
.kafreq{display:flex; flex-direction:column; gap:4px}
.karadio{display:flex; flex-direction:row; align-items:flex-start; gap:10px; padding:8px 10px; margin:0; border:1px solid var(--line); border-radius:12px; cursor:pointer; background:var(--stat-bg); font:500 13.5px "IBM Plex Sans",sans-serif; letter-spacing:0; text-transform:none; color:var(--ink)} /* <label>: de globale label{uppercase}- en input{width:100%}-regels van de formulieren gelden hier niet */
.karadio input{width:18px; height:18px; margin:2px 0 0; padding:0; accent-color:var(--accent); flex:none}
.karadio span{display:flex; flex-direction:column; gap:1px; min-width:0; flex:1; text-transform:none; letter-spacing:0}
.karadio b{font-size:13.5px; color:var(--ink)}
.karadio small{font-size:12px; line-height:1.4; color:var(--ink-3)}
.karadio.on{border-color:color-mix(in srgb, var(--accent) 45%, transparent); background:var(--accent-wash)}
.karadio input:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.kabasis{padding:0 16px}
.kaaanrij{padding:0 16px}
.kanietbesch{padding:0 16px; color:var(--bad-text)}
.kaknoppen{display:flex; gap:8px; padding:14px 16px 0}
.kaknoppen .btn{flex:1; padding:13px 12px; border-radius:14px; font-size:15px}
.kaweg{display:block; margin:8px auto 0; color:var(--bad-text); font-size:13px}
/* 🔔-rij en Instellingen → Meldingen */
.karow .notifemo{background:var(--accent-wash)}
.karow .notif-l b i{white-space:nowrap}
.kainstkop{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; font-size:13.5px; color:var(--ink)}
.kainstkop span{font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.karij{display:grid; grid-template-columns:28px minmax(0,1fr) auto auto auto; align-items:center; column-gap:8px; padding:8px 0; border-bottom:1px solid var(--line)}
.karij:last-of-type{border-bottom:none}
.karij.uit .kainfo{opacity:.6}
.kainfo{display:flex; flex-direction:column; gap:1px; min-width:0}
.kainfo b{font:700 14px "Archivo",sans-serif; color:var(--ink)}
.kainfo span{font-size:12px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.karij .kaknopje{width:32px; height:32px; font-size:14px; border-radius:9px; padding:0}
.karij .schakelaar{margin-right:2px}
@media (max-width:360px){ .kakop b{font-size:18px} .kasnelrij{gap:4px} .kasnel{font-size:12px; padding:8px 2px} .karij{column-gap:6px} .karij .schakelaar{width:40px} }
/* v25.52 — HUISSTIJL2: de knoppen "Nieuw account maken" / "Account maken" op het inlogscherm in het merkblauw (H-5: één merk naast het logo;
   winst/verlies blijven groen/rood). Dezelfde selectorvormen als de v25.49-regels erboven zodat de cascade wint; alleen tokens. */
.btn.groen{background:var(--accent-verloop); color:var(--accent-tekst); box-shadow:0 8px 30px color-mix(in srgb, var(--accent) 22%, transparent)}
:root[data-theme="light"] .btn.groen{background:var(--accent-verloop); color:var(--accent-tekst)}
@media (prefers-color-scheme: light){ :root:not([data-theme="dark"]) .btn.groen{background:var(--accent-verloop); color:var(--accent-tekst)} }
/* v25.51 — BEHEER3 */
/* v25.51 (nazorg 7, BEHEER3 — "de Toren", Rabi 6-9 avond "een echte control tower"): de derde tab op /beheer (het paneel btGrid, klasse .b3toren).
   Eén ontwerpsysteem: tegels (.b3tegel: groot cijfer in tabular-nums, label, altijd zichtbare betekenisregel, sparkline rechtsboven,
   delta-pil; kleur alleen op een drempel: .let = --gold, .fout = --bad — "in orde" is neutraal), klapbare secties (<details>.b3sectie met
   plakkende kop), kaarten (.b3kaart bouwt op .bhkaart), signaalrijen, inzichtzinnen, lege/laad/foutstaat. Alleen thematokens (dark + licht),
   geen hard-coded kleuren, geen id-selectors, géén muis-effect (de suites tabbalk-v2546/seo2-v2547 lezen de css tot het einde en eisen er geen;
   focus-visible is er wél), 320 px zonder h-scroll (tegels 2 per rij, tabellen in .bhscroll), onderaan ruimte voor de ledentabbalk + safe-area,
   prefers-reduced-motion gerespecteerd. Bugs B1/B2/B5/B6 zijn in de bestaande beheer-regels gerepareerd (annotaties daar); B12 hieronder. */
.b3toren{display:flex; flex-direction:column; gap:10px; min-width:0; padding-bottom:calc(var(--tabbar-h, 64px) + env(safe-area-inset-bottom) + 12px)}
.b3toren.bhoud{opacity:.6; transition:opacity .2s}
.b3stand{margin:0; font-size:11.5px; color:var(--ink-3); overflow-wrap:anywhere}
.b3nu{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,140px),1fr)); gap:8px; min-width:0}
.b3nu.b3groot{grid-template-columns:repeat(auto-fit, minmax(min(100%,220px),1fr))}
.b3tegel{appearance:none; font:inherit; text-align:left; cursor:pointer; position:relative; display:flex; flex-direction:column; gap:2px; min-width:0; min-height:96px;
  padding:10px 12px 9px; border:1px solid var(--line); border-radius:14px; background:var(--stat-bg); color:var(--ink)}
.b3tegel:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.b3tegel.let{border-color:var(--gold)}
.b3tegel.fout{border-color:var(--bad)}
.b3tegel.fout .b3cijfer{color:var(--bad-text)}
.b3tegel.let .b3cijfer{color:var(--gold)}
.b3tegel.leeg .b3cijfer{color:var(--ink-3)}
.b3lbl{font-size:11px; color:var(--ink-3); line-height:1.3; padding-right:104px; overflow-wrap:anywhere}
.b3cijfer{font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; line-height:1.15; overflow-wrap:normal; min-width:0; padding-right:104px}
.b3tegel.groot .b3cijfer{font-size:26px}
.b3sub{font-size:11.5px; color:var(--ink-2); line-height:1.3; overflow-wrap:anywhere}
.b3delta{font-style:normal; font-size:11px; color:var(--ink-3); font-variant-numeric:tabular-nums; display:inline-flex; gap:4px; flex-wrap:wrap; align-items:baseline}
.b3delta span{color:var(--ink-3); font-weight:400}
.b3delta.slecht{color:var(--bad-text)} .b3delta.goed{color:var(--good-text)}
.b3sparkwrap{position:absolute; top:10px; right:12px; width:96px; height:28px; color:var(--accent)}
.b3tegel.let .b3sparkwrap{color:var(--gold)} .b3tegel.fout .b3sparkwrap{color:var(--bad)}
.b3spark{width:96px; height:28px; display:block; overflow:visible}
.b3bet{font-size:11.5px; color:var(--ink-2); line-height:1.35; margin-top:auto; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere}
.b3skelet .b3tegel{opacity:.55; animation:bhpuls 1.4s ease-in-out infinite; cursor:default}
.b3skelet .b3lbl,.b3skelet .b3cijfer,.b3skelet .b3bet{background:var(--hl-bg); border-radius:6px; color:transparent; min-height:14px; width:60%}
.b3skelet .b3cijfer{width:40%; min-height:22px}
.b3kaart{padding:14px 16px 12px; min-width:0; overflow:hidden}
.b3kaart.breed{grid-column:1 / -1}
.b3letop .bhsignalen{margin-top:4px}
.b3sig{display:flex; gap:8px; align-items:flex-start; padding:7px 0; border-top:1px solid var(--line); min-width:0; flex-wrap:wrap}
.b3sig:first-child{border-top:none}
.b3stip{width:9px; height:9px; border-radius:50%; flex:none; margin-top:5px; background:var(--gold)}
.b3sig.fout .b3stip{background:var(--bad)}
.b3sigtekst{flex:1 1 0; min-width:0; font-size:13px; color:var(--ink); overflow-wrap:anywhere}
.b3sigtekst b{font-weight:600}
.b3siguitleg{display:block; font-size:12px; color:var(--ink-2); margin-top:1px}
.b3sigtekst .bhtijd{display:block; font-style:normal; white-space:normal; margin-top:1px; font-size:11px; color:var(--ink-3)}
@media (max-width:759px){ .b3sig .bhsigknoppen{width:100%; justify-content:flex-end} }
.b3inzlijst{margin:0; padding:0 0 0 18px; display:flex; flex-direction:column; gap:6px; font-size:13px; color:var(--ink)}
.b3inz{overflow-wrap:anywhere; min-width:0}
.b3inz .b3n{font-style:normal; font-size:11px; color:var(--ink-3); white-space:nowrap}
.b3inz .bhlink{text-decoration:none; font-weight:700; padding:0 4px}
.b3sectie{min-width:0; border:1px solid var(--line); border-radius:14px; background:var(--card-2)}
.b3sectie>summary{cursor:pointer; list-style:none; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; padding:10px 14px; position:sticky; top:0; z-index:2; background:var(--card-2); border-radius:14px; min-width:0}
.b3sectie[open]>summary{border-bottom:1px solid var(--line); border-radius:14px 14px 0 0}
.b3sectie>summary::-webkit-details-marker{display:none}
.b3sectie>summary::before{content:"▸"; display:inline-block; width:12px; color:var(--accent); transition:transform .15s}
.b3sectie[open]>summary::before{transform:rotate(90deg)}
.b3sectie>summary:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
.b3sectitel{font-family:"Archivo","IBM Plex Sans",sans-serif; font-weight:800; font-size:14px; letter-spacing:-.01em; color:var(--ink)}
.b3secsub{font-size:11.5px; color:var(--ink-3); overflow-wrap:anywhere; flex:1 1 160px; min-width:0}
.b3secin{padding:10px 12px 12px; min-width:0}
.b3secin[data-b3lui]{padding:0}
.b3grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,280px),1fr)); gap:12px; min-width:0; align-items:start}
.b3grid>.b3nu{grid-column:1 / -1}
.b3chip{display:inline-block; font-style:normal; font-size:10.5px; font-weight:600; padding:0 6px; border-radius:999px; border:1px solid var(--line-2); color:var(--ink-2); white-space:nowrap}
.b3chip.let{border-color:var(--gold); color:var(--gold)} .b3chip.fout{border-color:var(--bad); color:var(--bad-text)}
.b3balk{display:flex; height:8px; border-radius:999px; overflow:hidden; background:var(--hl-bg); margin:6px 0 4px}
.b3balk i{display:block; height:100%; background:var(--accent)}
.b3balk i.b{background:var(--gold)} .b3balk i.c{background:var(--ink-3)}
.b3balktekst{margin:0 0 6px; font-size:11.5px; color:var(--ink-2); overflow-wrap:anywhere}
.b3h4{margin:10px 0 4px; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.b3tabel{min-width:0}
.b3klapin{min-width:0; overflow-wrap:anywhere}
.b3toren details{min-width:0}
.b3leeg{font-size:12.5px; color:var(--ink-3); margin:4px 0; overflow-wrap:anywhere}
.b3leeg.b3oud{border:1px solid var(--gold); border-radius:10px; padding:8px 10px; color:var(--ink)}
.b3fout{border:1px solid var(--bad); border-radius:10px; padding:8px 10px; margin:4px 0; display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.b3fout p{margin:0; flex:1 1 200px; min-width:0; font-size:12.5px; color:var(--bad-text); overflow-wrap:anywhere}
.b3lijnen{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,160px),1fr)); gap:10px}
.b3lijnen>div{display:flex; flex-direction:column; gap:4px; color:var(--accent)}
.b3lijnen .b3spark{width:100%; height:44px}
.b3link{margin:6px 0 0; font-size:12px}
.b3uitleg{color:var(--ink-2)}
.b3toren .bhstats{margin-bottom:6px}
.b3toren .bhstat b{font-size:18px}
.b3toren .bhkaart.bhlicht{box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 55%, transparent)}
/* bug B12: de leer-tabellen van de persberichtenkaart (zonder .bhscroll) passen in de kaart: vaste kolommen, tekst wikkelt */
.bhkaart .pbtabel{table-layout:fixed; width:100%}
.bhkaart .pbtabel td,.bhkaart .pbtabel th{overflow-wrap:anywhere; white-space:normal}
@media (max-width:359px){ .b3cijfer{font-size:17px; padding-right:0} .b3tegel.groot .b3cijfer{font-size:22px} .b3lbl{padding-right:0} .b3sparkwrap{position:static; width:100%; height:24px; margin-top:2px} .b3spark{width:100%; height:24px} .b3nu{grid-template-columns:repeat(2, minmax(0,1fr))} .b3secin{padding:8px} }
@media (min-width:760px){ .b3nu{grid-template-columns:repeat(auto-fit, minmax(min(100%,180px),1fr))} }
@media (min-width:1180px){ .b3nu{grid-template-columns:repeat(4, minmax(0,1fr))} .b3nu.b3groot{grid-template-columns:repeat(3, minmax(0,1fr))} .b3grid{grid-template-columns:repeat(3, minmax(0,1fr)); grid-auto-flow:dense} .bkgrid{grid-auto-flow:dense} } /* bug B2: ook Klassiek vult gaten op (de v25.48-regel voor .bhsectie .bhgrid blijft byte-gelijk — pin test-beheer-v2548) */
@media (min-width:1440px){ .b3nu{grid-template-columns:repeat(6, minmax(0,1fr))} }
/* v25.51 (nazorg 7, BEHEER3, tegenlezer): (1) de stip in Let op — de lijstregel .bhlijst li>span:first-child{flex:1} won van .b3stip{flex:none} en rekte de stip tot een ellips over de halve rij; (2) onder 1180 px (2–4 tegels per rij, 180–290 px breed) reserveerde padding-right:104px de hoek voor het lijntje en braken labels en cijfers midden in het woord ("Activerin|g", "Portefeuil|les", "€|11,2 k") — het lijntje staat daar nu onder het cijfer, zoals op 320 px */
.b3signalen li>span:first-child{flex:none; width:9px; min-width:9px}
@media (max-width:1179px){ .b3lbl,.b3cijfer{padding-right:0} .b3sparkwrap{position:static; width:100%; height:24px; margin-top:2px} .b3spark{width:100%; height:24px} }
@media (prefers-reduced-motion:reduce){ .b3skelet .b3tegel{animation:none} .b3sectie>summary::before{transition:none} .b3toren.bhoud{transition:none} }

/* v25.52 — POLITICI3 */
/* v25.52 (POLITICI3; Rabi 6-9 avond, iPhone-screenshot politicuspagina: "'te laat gemeld' verkeerd geplaatst, overlapt … saai en buggy … personaliseer
   met inzichten uit de eigen portefeuille"): de politicuspagina als kaartendashboard (kop met chip-rij, strook In het kort, hero-inzicht, Jij en deze
   politicus, tijdlijn Recente meldingen, posities met korte namen en één rendement-pil mét datum, sectorbalkjes) en in het overzicht de filterchip
   "In jouw portefeuille" + "vs S&P" per rij. Alleen thematokens en color-mix (geen hex, geen nieuwe partijkleur-regels — --pol-* blijft ring + stip),
   géén aanwijs-effect (de iOS-plak-les van v25.44 en de staart-scans van de oudere suites), wél :focus-visible; 320 px zonder h-scroll (de strook scrolt
   zelf, de rijen wikkelen ≤ 479 px in twee regels), dark én licht via dezelfde tokens, prefers-reduced-motion zet de balk-animatie uit (de tel-op
   staat in de code uit via prestRustig). Het chip-tekstje in de kop wordt nooit meer inline in de subregel gezet (B1) en de plek FL‑25 breekt niet (B2). */
/* kop: chip-rij op een eigen regel, korte subregel, plek zonder regelbreuk */
.polscreen .apphead.polkop.pol3{flex-wrap:wrap; row-gap:6px}
.polkop .polkopchips{flex-basis:100%; display:flex; flex-wrap:wrap; gap:6px; min-width:0; margin-top:-2px}
.polkop .polkopchips[hidden]{display:none}
.polkop .polkopchips .pill{white-space:nowrap; font-size:11.5px; padding:3px 9px; max-width:100%; overflow:hidden; text-overflow:ellipsis}
.polkop .polsub .polplek{white-space:nowrap}
.polkop .polsub .poldot{margin-right:5px; vertical-align:0}
@media (max-width:479px){ .polkop.pol3.pmkop .polkopchips{order:9} .polkop.pol3.pmkop .pmknop{order:10; margin-top:-2px} } /* telefoons: chips op een eigen regel, de 🔔-pil eronder rechts — altijd dezelfde rijen als het skelet (geen sprong zodra de chips komen) */
@media (max-width:359px){ .polkop.pol3 .polid{flex-basis:100%; order:5} .polkop.pol3 .polid b{white-space:normal; line-height:1.15} }
/* strook In het kort: vier tegels, elk op één regel; ≤ 639 px een scroll-strook met snap (patroon .poltoprij) */
.pol3strook{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:12px 18px 4px}
.pol3strook .stat{min-height:64px; padding:10px 11px; gap:2px; box-sizing:border-box; min-width:0}
.pol3strook .stat .slbl{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pol3strook .stat b{white-space:nowrap; font-size:17px; line-height:1.2; overflow:hidden; text-overflow:ellipsis; color:var(--ink)}
.pol3strook .stat b.pday.up{color:var(--good-text)} .pol3strook .stat b.pday.down{color:var(--bad-text)} .pol3strook .stat b.pday.laat{color:var(--gold)}
.pol3strook .stat .statsub{font-size:10.5px; color:var(--ink-3); line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
@media (max-width:639px){ .pol3strook{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:6px} .pol3strook::-webkit-scrollbar{display:none} .pol3strook .stat{flex:0 0 142px; scroll-snap-align:start} }
/* hero-inzicht: het cijfer groot, periodekeuze rechts, één zin, de prestatie-lijn kleiner */
.pol3hero{padding:14px 18px 14px; border-top:none}
.pol3herokop{display:flex; justify-content:space-between; align-items:center; gap:8px 12px; flex-wrap:wrap}
.pol3herokop .lbl{font-size:10.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3)}
.pol3herokop .pol3periode{margin:0}
.pol3getal{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-top:8px}
.pol3hero .big.pol3big{font-family:"Archivo",sans-serif; font-weight:800; font-size:clamp(30px,9vw,40px); letter-spacing:-.03em; line-height:1.05; font-variant-numeric:tabular-nums; white-space:nowrap}
.pol3hero .big.pol3big.mut{color:var(--ink-3)}
.pol3pt{font-size:12px; padding:3px 9px; white-space:nowrap}
.pol3zin{font-size:14px; line-height:1.45; color:var(--ink-2); margin:8px 0 0; text-wrap:pretty}
.pol3zin b{color:var(--ink); font-variant-numeric:tabular-nums}
.pol3legend{padding:10px 0 0}
.pol3chart{margin:6px 0 0}
.pol3chart svg{max-height:170px}
.pol3heroreg,.pol3prestleeg,.pol3bijgewerkt{margin:8px 0 0}
/* rendement-pil (positie, melding, Jij): één regel, kleur alleen uit --good-text/--bad-text, grijs bij "koers onbekend" */
.pol3pil{display:inline-flex; flex-wrap:nowrap; align-items:center; gap:4px; padding:3px 8px; font-size:11.5px; white-space:nowrap; font-variant-numeric:tabular-nums; max-width:100%}
.pol3pil small{font-size:9.5px; font-weight:700; color:var(--ink-3); text-transform:uppercase; letter-spacing:.06em}
.pol3pil.pday.up{color:var(--good-text); background:color-mix(in srgb, var(--good-text) 12%, transparent); border-color:color-mix(in srgb, var(--good-text) 35%, var(--line))}
.pol3pil.pday.down{color:var(--bad-text); background:color-mix(in srgb, var(--bad-text) 12%, transparent); border-color:color-mix(in srgb, var(--bad-text) 35%, var(--line))}
.pol3pil.pol3onbekend{color:var(--ink-3); font-weight:500}
.pol3datum{white-space:nowrap; font-weight:500; color:var(--ink-2)}
/* Jij en deze politicus */
.pol3jij{padding:0 0 12px}
.pol3jijkop{margin:0 18px 6px; font-size:14px; line-height:1.4; color:var(--ink-2)} .pol3jijkop b{color:var(--ink)}
.pol3jijlijst{padding:0 18px}
.pol3jijrij{display:grid; grid-template-columns:28px minmax(0,1fr) fit-content(52%); gap:6px 10px; align-items:center; padding:8px 0; border-bottom:1px solid var(--line); cursor:pointer; border-radius:8px}
.pol3jijrij:last-child{border-bottom:none}
.pol3jijrij .pleft span.pol3jijsub{white-space:normal; line-height:1.3}
.pol3jijpils{display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; min-width:0; justify-self:end}
.pol3jijuitleg{margin:8px 18px 0}
.pol3jijacties{display:flex; flex-wrap:wrap; gap:8px; padding:10px 18px 0}
.pol3pmknop,.pol3deelknop{cursor:pointer; background:var(--card); font-size:12px}
@media (max-width:479px){ .pol3jijrij{grid-template-columns:28px minmax(0,1fr)} .pol3jijrij .pol3jijpils{grid-column:2; justify-self:start; justify-content:flex-start} }
/* tijdlijn Recente meldingen en de meldingsrij in een uitklap: nooit buiten de kaart (B5) */
.pol3tijd{padding:0 0 10px}
.pol3tijdlijst{padding:0 18px}
.pol3m{display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"type kop waarde" "type meta waarde" "bron bron bron"; gap:2px 10px; align-items:center; padding:8px 0; border-bottom:1px solid var(--line); font-size:12.5px; color:var(--ink-2); min-width:0; font-variant-numeric:tabular-nums}
.pol3m:last-child{border-bottom:none}
.pol3mtype{grid-area:type; align-self:start; padding:2px 8px; font-size:11.5px; white-space:nowrap}
.pol3mkop{grid-area:kop; display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px; min-width:0}
.pol3msym{font-family:"Archivo",sans-serif; color:var(--ink); font-size:13.5px}
.pol3masset{color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%} .pol3masset small{color:var(--ink-3)}
.pol3mrange{padding:2px 8px; font-size:11.5px; white-space:nowrap}
.pol3mwie{color:var(--ink-3); font-size:11.5px}
.pol3mmeta{grid-area:meta; font-size:11.5px; color:var(--ink-3); white-space:normal; line-height:1.3}
.pol3mdatum{color:var(--ink); font-weight:600}
.pol3laat{color:var(--gold); font-weight:700}
.pol3mwaarde{grid-area:waarde; display:flex; align-items:center; gap:8px; justify-self:end; min-width:0}
.pol3mwaarde:empty{display:none}
.pol3mbron{grid-area:bron; font-size:11.5px} .pol3mbron .polbrontekst{font-weight:500}
.pol3m .polbron{font-size:15px; line-height:1; text-decoration:none}
.pol3m.polmklik:focus-visible,.pol3jijrij:focus-visible,.polsegs .polfilterjij:focus-visible,.pol3pmknop:focus-visible,.pol3deelknop:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
@media (max-width:479px){ .pol3m{grid-template-columns:auto minmax(0,1fr); grid-template-areas:"type kop" "type meta" "waarde waarde" "bron bron"} .pol3m .pol3mwaarde{justify-self:end} }
/* posities: korte naam + bandbreedte-chip links, rendement-pil mét datum rechts (B7/B8/B9/B11) */
.polpos > summary.pol3posrij{grid-template-columns:28px minmax(0,1fr) fit-content(52%); gap:10px} /* fit-content: de rechterkolom neemt haar eigen breedte tot hoogstens 52 % — nooit de linkerkolom tot 0 (B6-les), nooit een lege rechterstrook */
.pol3posrij .pleft{gap:2px}
.pol3posrij .pleft span.pol3naam{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink-2); font-size:12.5px; display:block}
.pol3posrij .pleft span.pol3range{display:inline-block; align-self:flex-start; white-space:nowrap; font-size:11px; padding:2px 8px; margin-top:2px; max-width:100%; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box}
.pol3posrij .pleft span.pol3range.pol3label{white-space:normal; line-height:1.3}
.pol3posrij .pright{align-items:flex-end; max-width:none; min-width:0; gap:3px}
.pol3posrij .pright .pol3pil{max-width:100%}
.pol3posmeta{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.pol3poslijst{padding:2px 18px 8px}
.pol3posnoot{margin:4px 18px 10px}
.pol3meld{padding:0 0 6px}
@media (max-width:359px){ .polpos > summary.pol3posrij{grid-template-columns:28px minmax(0,1fr)} .pol3posrij .pright{grid-column:2; align-items:flex-start; flex-direction:row; flex-wrap:wrap; gap:4px 8px; text-align:left} }
/* sectorbalkjes (kleuren = ALLOC_COLORS uit de code, zoals de donut; Onbekend in --ink-3) */
.pol3sect{padding:0 0 12px}
.pol3sectlijst{padding:4px 18px 0; display:flex; flex-direction:column; gap:8px}
.pol3sectrij{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 10px; font-size:12.5px; color:var(--ink-2); align-items:baseline}
.pol3sectnaam{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.pol3sectpct{font-variant-numeric:tabular-nums; color:var(--ink); font-weight:600}
.pol3sectrij.onbekend{color:var(--ink-3)}
.pol3balk{grid-column:1 / -1; display:block; height:6px; border-radius:3px; background:var(--line); overflow:hidden}
.pol3balk i{display:block; height:100%; border-radius:3px; transition:width .4s ease}
/* overzicht: filterchip, kopregel als chips (verborgen scheidingsteken houdt de tekst leesbaar), "vs S&P" en "· n gemeen" */
.polsegs .polfilterjij{flex:none; cursor:pointer; white-space:nowrap; align-self:center}
.polsegs .polfilterjij[aria-pressed="true"]{background:color-mix(in srgb, var(--accent) 18%, var(--card)); border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); color:var(--accent); font-weight:700}
.polsegs .polfilterjij[hidden]{display:none}
.polkopregel{position:relative}
.polkopregel .pol3kopchip{display:inline-block; font-size:11px; padding:2px 8px; margin:0 4px 4px 0}
.polkopregel .pol3sep{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.polkopregel .pol3koprest{display:block}
.polrow2 .pol3vssp{white-space:nowrap} .polrow2 .pol3vssp b{font-weight:700}
.pol3gemeen{color:var(--accent); font-weight:600}
/* skelet, wachtregel, bedrijfspagina-chip, breed scherm, rust */
.pol3skelet .stat b,.pol3skelet .pol3big{color:var(--ink-3)}
.pol3skeletrij{display:block; height:38px; width:100%; grid-column:1 / -1}
.polkop .polkopchips .pol3skeletchip{min-width:150px; color:transparent; background:var(--hl-bg); border-color:transparent}
.pol3flow > p.pol3wacht{margin:12px 18px 0}
.pol3tkchip{font-size:11px; padding:2px 8px; white-space:nowrap}
.pol3tkchip[hidden]{display:none}
.chartsub.pol3tknoot{padding:0 18px 6px; margin:0}
.pol3tknoot[hidden]{display:none}
@media (min-width:960px){ .pol3flow > .pol3strook,.pol3flow > .pol3hero,.pol3flow > .pol3jij,.pol3flow > p.pol3wacht{grid-column:1 / -1} .pol3strook{padding-top:14px} .pol3chart svg{max-height:200px} }
@media (prefers-reduced-motion:reduce){ .pol3balk i{transition:none} }
/* v25.51 — COUPONRENTE (nazorg 9, wens van een lid met certificaten): klaprij-regel + knop, de sheet, het label "coupon" in de dividendkaart/yoc-sheet. Alleen tokens, geen muis-effect, geen id's. */
.pcoupon{display:block; color:var(--ink-2); font-size:12.5px; line-height:1.45}
.pcoupon .pcouponbron{font-style:normal; color:var(--ink-3); font-size:11.5px}
.pcouponknop{background:none; border:0; padding:0; font:inherit; cursor:pointer}
.divcoupon{display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px; background:var(--accent-wash); color:var(--accent); font-size:10.5px; font-weight:700; letter-spacing:.2px; vertical-align:middle; white-space:nowrap}
.cpsheet{max-height:88svh}
.cpform{display:grid; gap:10px; padding:0 16px}
.cpform .veldlabel{display:grid; gap:4px; color:var(--ink-2); font-size:12.5px}
.cpform input,.cpform select{width:100%; box-sizing:border-box; background:var(--card-2); border:1px solid var(--line-2); border-radius:12px; padding:10px 12px; color:var(--ink); font:inherit; font-size:15px}
.cpuitleg{padding:0 16px}
.cpvoorstel{padding:0; color:var(--ink-2)}
.cpknoppen{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.cpweg{width:100%; margin:4px 0 0}
@media (max-width:380px){ .cpknoppen{grid-template-columns:1fr} }
/* v25.51 — LANDWISSEL (nazorg 8; Rabi 7-9 08:35 bij een iPhone-screenshot: "eenvoudiger om tussen België en Nederland te kunnen switchen en die weergave heeft een bugje"):
   het vlaggetje (btLandChip) was één tekstknoop in een inline-flex-knop — text-overflow:ellipsis werkt niet op een flex-container, dus de tekst werd
   op de padding-rand hard afgekapt ("🇧🇪 België · meerwaardebela"). Nu twee spans: de naam (.btlandnaam) krimpt als laatste, het bijschrift
   (.btlandsub) krimpt mét ellipsis en is op een telefoon (≤ 479 px, zoals de POLITICI-KOP-grens) weg — "🇧🇪 België · m…" is geen winst. De naam
   krimpt nooit (flex-shrink 0: bij een krimpverhouding blijft er een fractie van een pixel over en tekent text-overflow tóch "…"); max-width:100 %
   is het vangnet als zelfs de naam alleen niet past. Het keuzekaartje (lwSheet) gebruikt hetzelfde drawer/sheet/bmenuvlak-patroon als Instellingen.
   Alleen tokens (geen hex), geen muis-effecten (de staart-scans van oudere suites), knoppen ≥ 44 px, focus-visible via de basisregels. */
.btlandchip{min-width:0; overflow:hidden}
.btlandchip .btlandnaam{flex:0 0 auto; max-width:100%; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.btlandchip .btlandsub{flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-3)}
.btlandchip .btlandsub[hidden]{display:none}
@media (max-width:479px){ .btlandchip .btlandsub{display:none} }
.lwsheet{padding:10px 16px calc(16px + env(safe-area-inset-bottom))}
.lwsheet .pluskop{padding-left:0; padding-right:0}
.lwvraag{display:block; font-family:"Archivo",sans-serif; font-size:17px; line-height:1.3; margin-top:4px}
.lwuitleg{margin:6px 0 12px; color:var(--ink-2); font-size:13.5px; line-height:1.45}
.lwkeuzes{display:grid; gap:10px}
.lwkeuze{appearance:none; display:flex; align-items:center; gap:12px; width:100%; min-height:64px; padding:12px 14px; border-radius:16px; border:1.5px solid var(--line-2); background:var(--card-2); color:var(--ink); font:inherit; text-align:left; cursor:pointer}
.lwkeuze.on{border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); background:color-mix(in srgb, var(--accent) 10%, var(--card-2))}
.lwkeuze .lwvlag{font-size:28px; line-height:1; flex:none}
.lwkeuze .lwtekst{display:flex; flex-direction:column; min-width:0; flex:1}
.lwkeuze .lwnaam{font-weight:600; font-size:16px}
.lwkeuze .lwsub{color:var(--ink-3); font-size:12.5px; margin-top:2px}
.lwkeuze .lwnu{flex:none; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--accent)}
.lwnaarbetax{display:block; margin:12px 0 0; padding:8px 0; font-size:13.5px; color:var(--accent)}
.lwsheet .plusannuleer{width:100%; margin:14px 0 0}
.lwinstrij{appearance:none; width:100%; min-height:44px; background:none; border:none; padding:0; font:inherit; font-size:13.5px; color:var(--ink); cursor:pointer; text-align:left}
.lwinstrij .lwinstwaarde{font-weight:600; white-space:nowrap}
/* v25.51 — LIVEBLOG-EEN (nazorg 8): het gedeelde rondebericht in het liveblog op Nieuws — kop vet op een eigen regel, alinea's eronder; alleen tokens */
.lbtekst.legedeeld .lekop{font:800 16px/1.3 "Archivo",sans-serif; letter-spacing:-.01em; color:var(--ink); margin:0 0 6px}
.lbtekst.legedeeld p{margin:0 0 8px} .lbtekst.legedeeld p:last-child{margin-bottom:0}
.lbitem[data-soort="gedeeld"] .lbwaarom{color:var(--ink-2)}
.lbmeta .lbtype.lbpb{color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent)}
.lbtekst.lepb .lepblink{margin:2px 0 0} .lbtekst.lepb .lepblink a{font-weight:600; color:var(--accent); text-decoration:none}
/* D — de portefeuillekaart: de drie punten uit het liveblog ($-tickers klikbaar) en de Stijgers/Dalers-tabel eronder */
.nwzinnen.lepunten li{margin:0 0 6px} .nwzinnen.lepunten .nwtag{font-weight:600}
.lekaarttabel{margin-top:12px; padding-top:10px; border-top:1px solid var(--line)}
@media (max-width:479px){ .lekaarttabel .lbtwee{grid-template-columns:1fr; gap:6px} } /* op een telefoon de twee tabellen onder elkaar: naam en bedrag blijven leesbaar (de 1fr/1fr-regel vanaf 380 px blijft voor het liveblog) */
/* E — kalender als thema: het beurs-dicht-item en het agenda-item bovenaan het liveblog; de relevant-regel onder een persbericht */
.lekal{position:relative; padding:10px 0 12px; border-top:1px solid var(--line)} .lekal:first-child{border-top:none} .lekal .lekop{font-size:15px} .lbtekst.lekaltekst p{margin:0 0 6px} .lbtekst.lekaltekst .lepblink{margin:2px 0 0} .lbtekst.lekaltekst .lepblink .nwlink{padding:0; font-weight:600; color:var(--accent)}
.lbtekst.lepb .lepbreden{font-size:12px; color:var(--ink-3); margin:0 0 4px}

/* v25.52 — POLITICI-OVERAL */
/* v25.52 (POLITICI-OVERAL): (1) het chipje "🏛 14" in positie- en watchlistrij (.pochip, naast de 🔔 van KOERSALERTS — dezelfde maat, geen aanwijs-effect,
   nooit ten koste van de naam: de rij houdt haar minima), (2) de regel "Wist je dat …" op de bedrijfspagina (.tkpolregel: één link, icoon · tekst + sub · ›),
   (3) de kaart Meest gekocht door politici op Ontdek (.od-polrij hergebruikt .poltoprij), (4) het symboolfilter op de Politici-pagina (.polfiltersym en de
   klasse .posymfilter op de politici-weergave verbergt segmenten, zoekveld en de ranglijsttitel zolang het filter aan staat; .porangrij = de ranglijstplek in
   een rij), (5) de link "Alle politici met $AMZN →" onderaan de kaart Wie kocht en verkocht. Alleen tokens, geen aanwijs-effect (iOS-plak-les), wél
   :focus-visible; 320 px bruikbaar. Geen id-selector (de segmenten heten .polsegs .seg). */
.pochip{display:inline-block; margin-left:6px; padding:2px 6px; border:1px solid var(--line-2); border-radius:999px; background:transparent; color:var(--ink-3); font:600 11px "IBM Plex Sans",sans-serif; line-height:1.2; text-decoration:none; vertical-align:middle; white-space:nowrap; font-variant-numeric:tabular-nums}
.pochip:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.tkpolregel{padding:0}
.tkpolregel[hidden]{display:none}
.tkpolregellink{display:flex; align-items:center; gap:10px; padding:10px 14px; color:var(--ink); text-decoration:none; min-width:0}
.tkpolregelicoon{flex:none; width:32px; height:32px; border-radius:10px; display:grid; place-items:center; background:var(--accent-wash); font-size:17px}
.tkpolregelmid{display:flex; flex-direction:column; gap:2px; min-width:0; flex:1 1 auto}
.tkpolregeltekst{font-weight:700; font-size:14px; line-height:1.3; overflow-wrap:anywhere}
.tkpolregelsub{font-size:11.5px; color:var(--ink-3); line-height:1.3}
.tkpolregelpijl{flex:none; color:var(--ink-3); font-size:20px; line-height:1}
.tkpolregellink:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; border-radius:14px}
.tkpolalle{display:inline-block; margin:6px 18px 12px; font-weight:600}
.od-polrij.poltoprij{padding:2px 2px 6px; margin:0 -2px}
.od-polmeer{color:var(--accent); text-decoration:none; font-weight:600}
.od-polmeer:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.polsegs .polfiltersym{flex:none; cursor:pointer; white-space:nowrap; align-self:center; font-variant-numeric:tabular-nums}
.polsegs .polfiltersym[aria-pressed="true"]{background:color-mix(in srgb, var(--accent) 18%, var(--card)); border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); color:var(--accent); font-weight:700}
.polsegs .polfiltersym[hidden]{display:none}
.polsegs .polfiltersym:focus-visible{outline:2px solid var(--accent); outline-offset:-2px}
.polview.posymfilter .polsegs .seg,.polview.posymfilter .polzoek,.polview.posymfilter .poltitel{display:none}
.porangrij{display:block; margin-top:3px}
.porang{font-size:11px; padding:1px 8px; white-space:nowrap; font-variant-numeric:tabular-nums}
.porang b{font-weight:700}
@media (max-width:359px){ .pochip{margin-left:4px; padding:1px 5px} .tkpolregellink{gap:8px; padding:9px 12px} .tkpolregelicoon{width:28px; height:28px; font-size:15px} }

/* v25.52 — LIJNICOON */
/* v25.52 (nazorg 1, LIJNICOON; Rabi 7-9 11:05 "die alert op de bedrijfspagina met dat belletje als emoji wijzigen in gelijkwaardige weergave als de tabs
   beneden en de views bijvoorbeeld. Minder emojis gebruiken vanaf nu."): het bel-lijnicoon (liIcoonHtml) in de knop Alert op de bedrijfspagina (.kabtn), de
   knop in de watchlistrij (.kawl), de regel in de klaprij (.kapos), de kop van het alert-sheet en van Instellingen → Meldingen, en de alert-rij in de
   meldingenlijst (.karow .notifemo); het gebouw-lijnicoon in het politici-chipje (.pochip) en de regel op de bedrijfspagina (.tkpolregelicoon). Het icoon
   erft de tekstkleur (currentColor) in dark én licht; de aan-stip (.liaan) in het accent met een randje in de kaartkleur. Knoppen naast tekst lijnen uit
   via inline-flex + gap, zodat niets wikkelt op 320 px. Alleen tokens, geen aanwijs-effect, geen id-selectors. */
.kawl,.pochip{display:inline-flex; align-items:center; gap:2px; padding:2px 6px; line-height:1}
.kawl .vaico,.pochip .vaico{width:14px; height:14px} /* 14 px in de compacte rij-chips: gemeten even breed als het emoji ervoor (kawl 26 vs 27,7 px, chip 36 vs 35,6 px) — de rij blijft precies zo breed */
.tkkop .kabtn{gap:5px}
.tkkop .kabtn .katxt{white-space:nowrap}
.pdetail .kapos{display:inline-flex; align-items:center; gap:6px}
.kainstkop b{display:inline-flex; align-items:center; gap:6px}
.kasheet .pluskop{display:flex; align-items:center; justify-content:center; gap:6px}
.karow .notifemo{color:var(--accent)}
.vaico .liaan{fill:var(--accent); stroke:var(--card); stroke-width:1.4}
/* v25.52 — FB-KOERSBUDGET */
/* v25.52 (feedbackronde 6-9, FB-B KOERSBUDGET, melding 86): de regel onder de hero in de stand "koersen worden nog opgezocht" is een neutrale
   voortgangsregel (accentkleur, wash-grond) i.p.v. de goudkleurige waarschuwing; alleen tokens, geen aanwijs-effect nodig (de basisregel heeft er al een). */
.herowarn.kbzoekend{color:var(--accent); background:var(--accent-wash); border-color:var(--accent-lijn)}
.herowarn.kbzoekend::before{content:"↻ "}

/* v25.52 — FB-TABBALK-ZOOM (feedbackronde 6-9, pakket E, melding 77: op de iPhone zoomde Safari in zodra een invoerveld met letters kleiner dan 16 px de focus
   kreeg — het zoekveld op Nieuws stond op 15 px — en zoomde daarna niet vanzelf terug; de vaste tabbalk hing dan los in beeld tijdens het scrollen.
   Twee regels: het zoekveld op 16 px voor alle apparaten, en op aanraakschermen élk invoerveld minimaal 16 px (velden die al groter zijn blijven groter).
   `:root:root` geeft de aanraakregel specificiteit (0,2,1) zodat hij van de ± 20 klasse-regels met 12–15 px wint zonder de losse regels aan te raken;
   velden op een muis-apparaat (beheer, desktop) blijven zoals ze waren. Het vangnet in de client (blok `v25.52 fb-tabbalk-zoom`) zet de balk bij een
   tóch ingezoomde pagina op de zichtbare onderrand. Geen id's, geen hex, geen muis-effecten; alleen tokens. */
.searchwrap input{font-size:16px}
@media (pointer:coarse){
  :root:root :is(input, textarea, select){font-size:max(16px, 1em)}
}
/* v25.52 — FB-UPLOAD-INGANG (feedbackronde 6-9, melding 78): de upload-rij in het ▾-portefeuillebeheer (onder ＋ Nieuwe portefeuille) en de
   uitlegregel bovenaan het importscherm. Alleen tokens/afstanden; geen id's, geen muis-effect. De knop ⇪ Uploaden in de knoppenrij erft .pill.mut. */
.pfupload{margin-top:2px; text-align:left; line-height:1.3}
.upiuitleg{margin:4px 18px 6px}
/* v25.52 — LEERRONDE */
/* v25.52 (LEERRONDE): de kaart Leerronde op /beheer — soort-chips in de voorstellenlijst en de voetregel met Nu draaien; alleen tokens, geen aanwijs-effect, geen id */
.lrlijst li>span:first-child{display:flex; gap:6px; align-items:baseline; flex-wrap:wrap; min-width:0}
.lrsoort{font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.02em; color:var(--ink-3); border:1px solid var(--line-2); border-radius:999px; padding:1px 6px; white-space:nowrap; flex:none}
.lrsoort.kolomkop{color:var(--accent)} .lrsoort.actiewoord{color:var(--good-text)} .lrsoort.formaat{color:var(--gold)}
.lrvoet{align-items:center}
.lrvoet .bhgrijs{flex:1; min-width:160px; overflow-wrap:anywhere}
/* v25.52 — LOGIN-TELLER */
/* v25.52 (nazorg 3, LOGIN-TELLER): de teller "● 49 online · 3.454 leden" onder de slogan van beide inlogschermen (Rabi 7-9, Discord-voorbeeld) en
   een strakker klassiek inlogscherm (Rabi: "login gedeelte net wat moderner en strakker") — smallere kolom, gecentreerd merk, zachtere kaarten,
   ronder invoer/knoppen. Alleen tokens; geen id's; 320 px blijft bruikbaar; dark + licht. */
.authteller{display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; margin:12px 0 0; padding:6px 12px; border-radius:999px; background:color-mix(in srgb, var(--accent) 10%, var(--card)); border:1px solid var(--accent-lijn); font-size:13px; font-weight:600; font-style:normal; color:var(--ink-2); line-height:1.3}
.authteller[hidden]{display:none}
.ltdeel{display:inline-flex; align-items:center; gap:6px; white-space:nowrap}
.ltstip{width:8px; height:8px; border-radius:50%; background:var(--good-text); box-shadow:0 0 0 3px color-mix(in srgb, var(--good-text) 25%, transparent); flex:none}
.ltsep{color:var(--ink-3)}
.brand .authteller + .sub{margin-top:12px}
.authwrap.klassiek{max-width:440px; margin:0 auto; width:100%; padding-left:max(16px, env(safe-area-inset-left)); padding-right:max(16px, env(safe-area-inset-right)); gap:18px}
.authwrap.klassiek .brand{display:flex; flex-direction:column; align-items:center; text-align:center}
.authwrap.klassiek .authlogo{margin:0 auto 12px; box-shadow:0 12px 32px color-mix(in srgb, var(--accent) 28%, transparent)}
.authwrap.klassiek h1{letter-spacing:-.02em}
.authwrap.klassiek .authcard{border-radius:22px; padding:20px 18px; gap:10px}
.authwrap.klassiek .authcard input{border-radius:14px; min-height:48px}
.authwrap.klassiek .btn{border-radius:14px; min-height:50px}
.authwrap.klassiek .btn.google{background:var(--card); color:var(--ink); border:1px solid var(--line-2); box-shadow:none}
.authwrap.klassiek .divider{font-size:11.5px; letter-spacing:.06em; text-transform:uppercase}
.authwrap.klassiek .hint{text-align:center}
@media (max-width:379px){ .authteller{font-size:12px; padding:5px 10px} }

/* v25.52 — POLITICI-SIGNAAL */
/* v25.52 (POLITICI-SIGNAAL): (1) de kaart Signalen op de Politici-pagina (.polsignaal: rijen .psrij met logo · $SYM + naam · politicus · gemeld · bandbreedte · sindsdien · waarom-chips
   en rechts de score-pil .psscore; de regel "Wat er daarna gebeurde" .psdaarna en de uitklap .psmethode), (2) de tegels op Ontdek (.pstegel hergebruikt .poltoptegel), (3) de chip
   "signaal" in de tijdlijn van de politicuspagina (.pssig). Alleen tokens en color-mix, geen aanwijs-effect (iOS-plak-les), wél :focus-visible; geen id-selectors; 320 px zonder
   horizontaal scrollen (de rij wikkelt, de chips wikkelen, de score blijft rechts); kleur op een cijfer alleen uit --good-text/--bad-text. */
.polsignaal .pskopb{display:inline-flex; align-items:center; gap:7px}
.polsignaal .psicoon{display:inline-flex; color:var(--accent)}
.polsignaal .psicoon .vaico{width:16px; height:16px}
.pslijst{display:flex; flex-direction:column}
.psrij{display:flex; align-items:flex-start; gap:10px; padding:11px 14px; border-top:1px solid var(--line); cursor:pointer; min-width:0}
.psrij:first-child{border-top:none}
.psrij:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; border-radius:12px}
.pslogo{flex:none; padding-top:2px}
.psmid{flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:3px}
.pskop{display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; min-width:0}
.pssym{font-weight:800; font-size:14px; letter-spacing:-.01em}
.psnaam{font-size:12.5px; color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%}
.pswie{font-size:12.5px; min-width:0}
.pspol{color:var(--ink); text-decoration:none; font-weight:600; display:inline-flex; align-items:center; gap:5px; max-width:100%; min-width:0}
.pspol .poldot{margin:0}
.pspol .pspolnaam{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pspol .pspolsub{color:var(--ink-3); font-weight:500; white-space:nowrap}
.pspol:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.psmeta{font-size:11.5px; color:var(--ink-3); display:flex; flex-wrap:wrap; gap:2px 10px; line-height:1.35}
.psrange{font-variant-numeric:tabular-nums; white-space:nowrap}
.pssindsrij{font-size:12px; color:var(--ink-2); line-height:1.35}
.pssinds b{font-weight:700; font-variant-numeric:tabular-nums}
.pssinds.mut{color:var(--ink-3)}
.pssp{white-space:nowrap}
.pschips{display:flex; flex-wrap:wrap; gap:4px; margin-top:2px}
.pschip{font-size:10.5px; padding:2px 8px; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis}
.pschip.psmin{color:var(--bad-text); border-color:color-mix(in srgb, var(--bad) 45%, var(--line))}
.psrechts{flex:none; padding-top:2px}
.psscore{display:inline-flex; align-items:baseline; gap:1px; padding:5px 9px; border-radius:999px; border:1px solid var(--line-2); background:var(--card-2); color:var(--ink); font-variant-numeric:tabular-nums; line-height:1}
.psscore b{font-family:"Archivo",sans-serif; font-weight:800; font-size:16px; letter-spacing:-.02em}
.psscore small{font-size:10px; color:var(--ink-3)}
.psscore.hoog{background:color-mix(in srgb, var(--accent) 18%, var(--card)); border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); color:var(--accent)}
.psscore.hoog small{color:var(--accent)}
.psscore.mid{border-color:color-mix(in srgb, var(--accent) 35%, var(--line))}
.psleeg{padding:12px 14px}
.psdaarna{padding:8px 14px 10px; border-top:1px solid var(--line); line-height:1.45; text-wrap:pretty}
.psdaarna[hidden]{display:none}
.psmethode{margin:0 14px 12px; font-size:12.5px; color:var(--ink-2)}
.psmethode summary{cursor:pointer; color:var(--accent); font-weight:600; padding:4px 0}
.psmethode summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
.psmethodetekst p{margin:8px 0 0; line-height:1.45}
.psmethodetekst b{color:var(--ink)}
.pslijstje{margin:4px 0 0; padding-left:18px; line-height:1.45}
.pslijstje li{margin:2px 0}
.pspunten{display:inline-block; min-width:74px; font-variant-numeric:tabular-nums; font-weight:700; color:var(--ink)}
.polview.posymfilter .polsignaal{display:none}
.pstegel .psscore{padding:3px 7px; margin-top:2px}
.pstegel .psscore b{font-size:13px}
.pstegel .pstegelwie{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.pstegel .pstegelreden{white-space:normal; line-height:1.25; color:var(--ink-3); max-width:100%; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.pssig{display:inline-flex; align-items:center; gap:4px; font-size:10.5px; padding:2px 7px; color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); background:color-mix(in srgb, var(--accent) 12%, var(--card)); white-space:nowrap}
.pssig .vaico{width:12px; height:12px}
@media (max-width:359px){ .psrij{gap:8px; padding:10px 12px} .pslogo{display:none} .psscore{padding:4px 7px} .psscore b{font-size:14px} .psmethode{margin:0 12px 12px} .psdaarna{padding:8px 12px 10px} }
/* v25.52 — FB2-FREEDOM24-OPTIES (feedbackronde 7-9): het pilletje "optie · short" in de positierij — dezelfde vorm als het crypto-label (tokens, geen aanwijs-effect) */
.pflabel.optielabel{color:var(--ink-3); border-style:dashed; text-transform:lowercase; letter-spacing:.02em}
/* v25.52 — FB2-POSITIE-ACTIE */
/* v25.52 (FB2-POSITIE-ACTIE, melding 101): de actierij Koop · Verkoop · Dividend als laatste regel van de klaprij van een positie en het compacte
   inline-formulier eronder (blok v25.52 fb2-positie-actie in de client). Alleen tokens, geen aanwijs-effect (wél :focus-visible), geen id;
   320 px: de velden onder elkaar; het formulier staat in de gewone stroom (geen vaste laag, dus geen inzet nodig). */
.pdetail .paacties{flex-basis:100%; display:flex; flex-wrap:wrap; gap:8px; padding-top:8px; margin-top:2px; border-top:1px solid var(--line)}
.paknop{appearance:none; display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:6px 12px; border-radius:999px; border:1px solid var(--line-2); background:var(--card-2); color:var(--ink); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; white-space:nowrap}
.paknop .vaico{width:15px; height:15px; color:var(--accent)}
.paknop.on{background:color-mix(in srgb, var(--accent) 16%, var(--card)); border-color:color-mix(in srgb, var(--accent) 50%, var(--line)); color:var(--accent)}
.paknop:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.pdetail .paform{flex-basis:100%; min-width:0; max-width:100%; box-sizing:border-box; display:flex; flex-direction:column; gap:8px; margin:2px 0 4px; padding:10px 12px; border:1px solid color-mix(in srgb, var(--accent) 40%, var(--line)); border-radius:12px; background:var(--card); color:var(--ink); font-variant-numeric:tabular-nums}
.pakop{display:flex; align-items:baseline; gap:8px; min-width:0}
.pakop b{font-size:14px; color:var(--ink); white-space:nowrap}
.pakop .pasym{color:var(--accent)}
.pakop .pasub{flex:1; min-width:0; font-size:12px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.parij{display:flex; gap:8px}
.paveld{flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; font-size:11.5px; color:var(--ink-3)}
.paveld input{width:100%; min-width:0; box-sizing:border-box; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--card-2); color:var(--ink); font:inherit; font-size:16px; font-variant-numeric:tabular-nums}
.paveld input:focus-visible{outline:2px solid var(--accent); border-color:var(--accent)}
.parijd .paveld:first-child{flex:1.2}
.paveld input[type="date"]{padding-right:6px}
.paveld.paleeg{visibility:hidden}
.parest,.pahint{display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; font-size:12px; color:var(--ink-2); line-height:1.35}
.parest .paalles,.pahint .pavul{color:var(--accent); font-weight:600; padding:2px 0; font-size:12px}
.parestregel.pate{color:var(--bad-text)}
.paform .pafout{margin:0}
.paknoppen{display:flex; align-items:center; gap:12px}
.paknoppen .btn{margin-top:0; flex:1; font-size:14px; padding:10px 14px}
.paknoppen .paannuleer{flex:none; color:var(--ink-2); font-size:13px}
.paform .linkbtn:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:6px}
@media (max-width:359px){ .parij{flex-direction:column; gap:6px} .paveld.paleeg{display:none} .paknop{padding:6px 10px; font-size:12px} .paknoppen{flex-wrap:wrap} }
@media (prefers-reduced-motion: no-preference){ .pdetail .paform{animation:paIn .18s ease-out} }
@keyframes paIn{ from{opacity:0; transform:translateY(-4px)} to{opacity:1; transform:none} }
/* v25.52 — FB2-GELDSTROOM (feedbackronde 7-9): de regel "Onbekende geldstroom" onder de grafiek Rekening + het kaartje "Wat was dit?" — alleen tokens, geen aanwijs-effect, 320 px */
.gsregel{margin-top:2px; font-size:11.5px; color:var(--ink-2); display:flex; flex-direction:column; gap:4px}
.gsitem{display:flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0}
.gsitem .gsico{width:14px; height:14px; flex:none; color:var(--accent)}
.gsitem .gstekst{min-width:0; overflow-wrap:anywhere}
.gsitem .gstypeer{color:var(--accent); font-weight:600; font-size:11.5px; padding:2px 0; flex:none; text-decoration:underline; text-underline-offset:2px}
.gsitem .gstypeer:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
.gssheet{max-height:88svh}
.gsuitleg{margin:2px 16px 10px; font-size:12.5px; color:var(--ink-2)}
.gskeuze{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin:0 16px 10px}
.gskeuze button,.gsrichting button{border:1px solid var(--line); background:var(--card-2); color:var(--ink); border-radius:12px; padding:9px 8px; font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:2px; line-height:1.2; min-height:44px}
.gskeuze button small,.gsrichting button small{font-weight:400; font-size:10.5px; color:var(--ink-3)}
.gskeuze button[aria-pressed="true"],.gsrichting button[aria-pressed="true"]{border-color:var(--accent); background:color-mix(in srgb, var(--accent) 14%, var(--card)); color:var(--accent)}
.gskeuze button[aria-pressed="true"] small{color:var(--accent)}
.gskeuze button:focus-visible,.gsrichting button:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.gsform{padding:0 16px}
.gsvelden{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.gsvelden[hidden]{display:none}
.gsvelden .veldlabel{margin:0}
.gsrichting{grid-column:1 / -1; display:grid; grid-template-columns:1fr 1fr; gap:8px}
.gsnoot{margin:8px 0 4px; font-size:12px; color:var(--ink-2)}
.gsfout{margin:4px 0 0; color:var(--bad-text)}
.gsfout[hidden]{display:none}
.gsknoppen{margin:10px 0 6px; justify-content:flex-end}
@media (max-width:479px){ .gskeuze{grid-template-columns:1fr} .gskeuze button{flex-direction:row; justify-content:space-between} }
@media (max-width:359px){ .gsvelden{grid-template-columns:1fr} .gsrichting{grid-template-columns:1fr} .gsregel{font-size:11px} }
/* v25.52 — ANTWOORDEN-OPEN: de box met de laatste 2 antwoorden staat in de kaart zelf (standaard open); op een smal scherm net als de knop verborgen (de telefoon opent het berichtscherm), handmatig dicht = hidden */
.bkinline.aoopen{display:none}
@media (min-width:1180px){ .bkinline.aoopen:not([hidden]){display:flex} }

/* v25.52 — NABEURS-ALTIJD (Rabi 7-9: de voor-/nabeursregel altijd zichtbaar zodra een beurs dicht is, mét het verschil t.o.v. het slot, en de
   indicatieve portefeuillewaarde in de kop). Alleen tokens; de bestaande .wlext/.pext/.tkext-regels blijven; de eerlijke leegte is gedempt. */
.wlext.naleeg,.tkext.naleeg{color:var(--ink-3); font-weight:500}
.herona{margin-top:4px; font-size:12.5px; line-height:1.35; color:var(--ink-2); font-variant-numeric:tabular-nums; display:flex; flex-wrap:wrap; align-items:baseline; gap:0 6px; min-width:0}
.herona[hidden]{display:none}
.herona .nahkop{white-space:nowrap}
.herona .nahkop b{font-weight:700; color:var(--ink)}
.herona .nahup{color:var(--good-text); font-weight:600; white-space:nowrap}
.herona .nahdown{color:var(--bad-text); font-weight:600; white-space:nowrap}
.herona .nanoot{color:var(--ink-3); font-size:11.5px; overflow-wrap:anywhere}
@media (max-width:359px){ .herona{font-size:12px} .herona .nanoot{flex-basis:100%} }
/* v25.52 — POLITICI-SIGNAAL2 */
/* v25.52 (POLITICI-SIGNAAL2): de kaart Opvallende meldingen — klasse-chip .psklasse (Opvallend · Sterk · Uitzonderlijk) boven de score, labels .pslabel zonder punten,
   de terugblik-tabel .pstabel (scrollt in .pstbscroll, nooit de pagina), het noodrem-label .psexp (bij .psexperimenteel verdwijnen de klassen), de E1-lijn .pse1.
   Alleen tokens en color-mix, geen aanwijs-effect, geen id-selectors; 320 px zonder horizontaal scrollen. */
.psrechts{display:flex; flex-direction:column; align-items:flex-end; gap:5px}
.psklasse{display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.01em; padding:2px 8px; border-radius:999px; border:1px solid var(--line-2); color:var(--ink-2); background:var(--card-2); white-space:nowrap}
.psklasse.ps-opvallend{color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, var(--line))}
.psklasse.ps-sterk{color:var(--accent-tekst); background:var(--accent); border-color:var(--accent)}
.psklasse.ps-uitzonderlijk{color:var(--accent-tekst); background:var(--accent-donker, var(--accent)); border-color:var(--accent-donker, var(--accent))}
.psexperimenteel .psklasse{display:none}
.psexp{font-size:10.5px; margin-left:8px; vertical-align:middle; color:var(--bad-text); border-color:color-mix(in srgb, var(--bad) 45%, var(--line))}
.psexp[hidden]{display:none}
.pslabel{font-size:10.5px; padding:2px 8px; white-space:nowrap; max-width:100%; overflow:hidden; text-overflow:ellipsis; color:var(--ink-3)}
.psterugblik{padding:8px 14px 4px; border-top:1px solid var(--line)}
.psterugblik[hidden]{display:none}
.pstbkop{margin:0 0 6px; font-size:12.5px}
.pstbkop .mut{color:var(--ink-3); font-weight:500}
.pstbscroll{overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%}
.pstabel{border-collapse:collapse; width:100%; min-width:0; font-size:12px; font-variant-numeric:tabular-nums}
.pstabel th, .pstabel td{padding:5px 8px; text-align:right; border-top:1px solid var(--line); white-space:nowrap; vertical-align:top}
.pstabel th[scope="row"], .pstabel thead th:first-child{text-align:left}
.pstabel th[scope="row"]{font-weight:600; color:var(--ink); white-space:normal; text-wrap:balance}
.pstabel thead th{border-top:none; color:var(--ink-3); font-weight:600; font-size:11px; white-space:normal; vertical-align:bottom}
.pstabel thead th:nth-child(n+4){white-space:nowrap}
.pstbmarge{color:var(--ink-3); font-size:10.5px; font-weight:500}
.pstabel tr.pstb-alle th, .pstabel tr.pstb-alle td{color:var(--ink-2)}
.pstabel tr.pstb-signalen th{color:var(--accent)}
.pstabel tr.pstb-sector th, .pstabel tr.pstb-sector td{color:var(--ink-3); font-size:11.5px}
.pstbnoot{padding:6px 0 4px; line-height:1.45; text-wrap:pretty}
.pse1{padding:0 14px 12px; color:var(--ink-3); line-height:1.4}
.pstegel .psklasse{margin-top:2px}
@media (max-width:479px){ .pstabel{font-size:11.5px} .pstabel th, .pstabel td{padding:5px 5px} .pstbmarge{display:block; font-size:10px} }
@media (max-width:359px){ .psterugblik{padding:8px 12px 4px} .pse1{padding:0 12px 12px} .pstabel{font-size:11px} .pstabel th, .pstabel td{padding:4px 4px} .pstabel th:nth-child(3), .pstabel td:nth-child(3){display:none} }
/* v25.52 — DEEL-FAB: op Portefeuille is de zwevende knop rechtsonder (.fab, v25.46) de Deel-knop — lijn-icoon 'delen' in de tabbalk-stijl i.p.v. de ＋ (Rabi 7-9: "op portefeuille pagina moet dat plusje eigenlijk een deel knop zijn"); alleen tokens en afstanden, geen id, geen hex — de staart-scans van oudere suites lopen tot het einde van het bestand */
.fab[data-deel="1"]{padding:0}
.fab[data-deel="1"] .vaico{width:26px; height:26px}
/* v25.52 — MARGIN: de vraag onder de grafiek Rekening (margin_vermoeden), de vierde keuze in het kaartje "Wat was dit?", "Ongedaan maken" bij een typering in het grootboek en de margin-knop + het formulier in portefeuillebeheer — alleen tokens, geen aanwijs-effecten, 320 px */
.mgregel{margin:2px 0 0; font-size:12px; color:var(--ink-2); display:flex; flex-direction:column; gap:4px}
.mgitem{display:flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0}
.mgitem .mgico{width:14px; height:14px; flex:none; color:var(--accent)}
.mgitem .mgtekst{min-width:0; overflow-wrap:anywhere}
.mgitem .mgaan{color:var(--accent); font-weight:600; font-size:11.5px; padding:2px 0; flex:none; text-decoration:underline; text-underline-offset:2px; min-height:24px}
.mgitem .mgaan:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
.gskeuze .gsmargin{font-weight:400; font-size:10.5px; color:var(--ink-3)}
.gskeuze button[aria-pressed="true"] .gsmargin{color:var(--accent)}
.txongedaan{color:var(--accent); font-weight:600; font-size:11.5px; padding:2px 0; text-decoration:underline; text-underline-offset:2px; display:inline-block; margin-top:2px; min-height:24px}
.txongedaan:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:4px}
.pfmargin .mgico{width:16px; height:16px}
.pfmarginform .chartsub{margin:6px 0 10px}
.pfmarginform .pfform-btns .btn{min-height:44px}
@media (max-width:359px){ .mgregel{font-size:11px} }
/* v25.52 — PF-RUST */
/* v25.52 (PORTEFEUILLE-RUST): dicht = klasse pfrdicht op de kaart, op bestaande kindklassen (hero: alleen reden/hint — herstel tegenlezer UX-1) */
.pfrkaart.pfrdicht.hero > :is(.mwrrreden,.stortinghint), .pfrkaart.pfrdicht.histcard > :is(.chartsub,.watisdit), .pfrkaart.pfrdicht.divcard > :is(.chartsub,.watisdit), .pfrkaart.pfrdicht.kostencard > .chartsub, .pfrkaart.pfrdicht.kostencard .kostenoordeel .kgrens{display:none}
.pfrknop{appearance:none;background:none;border:0;border-top:1px solid var(--line);width:calc(100% - 36px);margin:8px 18px 0;padding:12px 0 8px;min-height:44px;display:flex;align-items:center;gap:8px;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer;text-align:left}
.hero .pfrknop{width:100%;margin:8px 0 0}
.pfrknop[hidden]{display:none}
.pfrknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.pfrchips{display:flex;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.pfrchip{font-weight:500;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.pfrchip::before{content:"·";margin-right:6px}
.pfrchip.actie{color:var(--accent);background:var(--accent-wash);border:1px solid var(--accent-lijn);border-radius:999px;padding:1px 8px;font-weight:600}
.pfrchip.actie::before{content:none}
.pfrchev{flex:none;margin-left:auto;color:var(--ink-3);transition:transform .18s ease}
.pfrknop[aria-expanded="true"] .pfrchev{transform:rotate(180deg)}
/* openstand: alleen de uitleg-subregels leesbaarder; het ≈-label, de geldstroom-/margin-regels (MARGIN-gebied) houden hun eigen typografie — herstel tegenlezer UX-3/RG-2 */
.pfrkaart:not(.pfrdicht):not(.hero) > .chartsub:not(.benadering):not(.histsinds):not(.gsregel):not(.mgregel){font-size:12px;line-height:1.5;color:var(--ink-2)}
.pfrkaart.pfrdicht .chartbox{margin-bottom:4px}
.divwanneer, .divjr, .lgpct{font-variant-numeric:tabular-nums}
.divwanneer{color:var(--ink-3)}
.kostencard .krow.kratio > b{white-space:nowrap;flex:none} .kostencard .krow.kratio > span{min-width:0}
.pfrlive{display:inline-block;width:6px;height:6px;border-radius:50%;margin-left:8px;vertical-align:middle;opacity:0}
.pfrlive.aan{background:var(--good);opacity:1;box-shadow:0 0 0 3px color-mix(in srgb, var(--good) 35%, transparent);animation:pfrpuls 1.8s ease-in-out infinite, pfruit 120s linear forwards}
@keyframes pfrpuls{50%{box-shadow:0 0 0 1px color-mix(in srgb, var(--good) 15%, transparent)}}
@keyframes pfruit{to{opacity:0;box-shadow:none}}
@media (max-width:360px){ .pfrknop{flex-wrap:wrap} .pfrchips{flex-basis:100%;order:3} .pfrchev{order:2} }
@media (prefers-reduced-motion:reduce){ .pfrchev{transition:none} .pfrlive.aan{animation:pfruit 120s linear forwards} }
/* v25.52 — NABEURS-DESIGN (Rabi 7-9 ± 21:10 NL bij een screenshot van zijn portefeuillelijst: "Als de beurs open is kan de nabeurs en voorbeurs weg en kan de dagkoers prominenter worden laten zien; deze weergave van voor en nabeurs enkel na sluitingstijd en voor opening" + "ook verwerkt bij alle bedrijfs-, aandelen- en ETF-pagina's"): de koerscel van de positie- en watchlistrij, de kopregel van de portefeuillekaart en de koerskop van de bedrijfs-/ETF-pagina in twee toestanden op data-nd (open · slotvolgt · dicht — gezet door het blok v25.52 nabeurs-design uit beursStatus; verbergen alleen via data-nd, nooit via hidden). Alleen thematokens en color-mix, geen id-selector, geen aanwijs-effect, geen voorrangsvlag; dark én licht via de tokens; het icoon op de kopregel is een css-masker (aria-live-regio, zie het blok). */
/* basis (beide toestanden, beide lijsten): één koersmaat, vaste celbreedte via het kind (de id-regel op .pright is met klassen niet te verslaan) — positielijst 112 px op smal (de naamkolom houdt op 414 px ≥ 100 px: '€ 31.788 · 81,2%' zonder afkapping), watchlist 104 px (≤ 359 px: de rij van 320 px is dan precies vol) en 116 px (360–559 px: de breedte die de dagpil bij open al vroeg — zo springt de kolom niet meer tussen open en dicht); vanaf 560 px één vaste kolom per lijst: positielijst 170 px, watchlist 150 px (elk de eigen v25.44-bovengrens; herstel tegenlezer UX-2/UX-4 — de watchlist varieerde 116–150 per toestand) */
.prow[data-nd] .pright .pprice{font-size:14.5px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums}
.prow[data-nd] .pright > .pprice{min-width:112px}
.wlrow[data-nd] .pright > .pprice{min-width:104px} /* watchlist: 4 px zijpadding (flitspil) zit ín de maat (border-box) */
@media (min-width:360px) and (max-width:559px){ .wlrow[data-nd] .pright > .pprice{min-width:116px} }
@media (min-width:560px){ .prow[data-nd] .pright > .pprice{min-width:170px} .wlrow[data-nd] .pright > .pprice{min-width:150px} } /* watchlist: 150 = haar eigen v25.44-bovengrens (de rij heeft rechts nog de kruisje-kolom; 170 drukte de naam op 768 px tot 64 px) */
.prow[data-nd] .pday{display:inline-flex; flex-wrap:wrap; justify-content:flex-end; align-items:baseline; gap:0 4px; white-space:normal; align-self:flex-end; max-width:100%; font-variant-numeric:tabular-nums}
.prow[data-nd="dicht"] .psessie::before, .prow[data-nd="slotvolgt"] .psessie::before{content:"· "}
/* v25.52 (NABEURS-DESIGN, herstel tegenlezer UX-3): óók de dagregel telt niet mee in de kolombreedte — de gridkolom (minmax(min-content,auto)) volgde de max-content van '↑ +0,4% · slot gisteren' en sprong van 112 naar 128 px (linkerkolom afgekapt op 320/414); width 0 + min-width 100 % zoals de regel eronder, alleen dicht/slotvolgt (de pil bij open moet de tekst omsluiten); 11 px zodat het slot-label/'· gesloten'/'· voorbeurs' naast het percentage passen ('· slot gisteren' en '· laatste slot' wikkelen op smal eronder — 79/68 px in de app-letter). In de watchlist vervalt bij dicht de 4 px zijpadding van de flitspil (de cel is er al krap) */
.prow[data-nd="dicht"] .pday, .prow[data-nd="slotvolgt"] .pday{width:0; min-width:100%; box-sizing:border-box; font-size:11px; line-height:1.2}
.wlrow[data-nd="dicht"] .pday, .wlrow[data-nd="dicht"] .wlext{padding-left:0; padding-right:0}
.wlrow[data-nd="dicht"] .wlsessie{line-height:1.15}
/* open (ook crypto en de toestand slotvolgt): koers + dagverandering als pil; geen voor-/nabeurs- en geen leegte-regel (vangnet: een ext van vóór de opening blijft hoogstens één tik staan — de klok wint) */
.prow[data-nd="open"] .pday.up, .prow[data-nd="open"] .pday.down{padding:1px 7px; border-radius:999px; font-size:12.5px; font-weight:700; background:color-mix(in srgb, currentColor 13%, transparent)}
.prow[data-nd="open"] .pday.tikflits-op{background-color:color-mix(in srgb, var(--good-text) 30%, transparent)}
.prow[data-nd="open"] .pday.tikflits-af{background-color:color-mix(in srgb, var(--bad-text) 30%, transparent)}
.prow[data-nd="open"] .wlext, .prow[data-nd="slotvolgt"] .wlext{display:none}
/* de voor-/nabeursregel (en de leegte-regel) telt niet mee in de kolombreedte: width 0 + min-width 100 % = de kolom neemt de breedte van de koers en de dagregel, de regel wikkelt erin (verschil op een eigen regel) — zo staat de rechterkolom in open en dicht op precies dezelfde plek en schuift de sparkline nooit */
.prow[data-nd="dicht"] .wlext{width:0; min-width:100%; box-sizing:border-box; white-space:normal; line-height:1.2}
.prow[data-nd="dicht"] .wlext:not(.naleeg){display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:baseline; column-gap:3px}
/* dicht: het slot blijft het grote getal, de dagverandering gedempt (55 % richtingkleur + grijs: ≥ 5,0:1 op de kaart in beide thema's) mét het sessielabel inline; daaronder de verpakte voor-/nabeursregel als enig kleuraccent in twee regels — herstel tegenlezer UX-1/UX-2: regel 1 = icoon · label · tijd ('Nabeurs · za 01:59', de tijd in flex-volgorde vóór de waarde: past hij niet naast het label, dan wikkelt hij als geheel naar een eigen regel), regel 2 = koers + percentage als één item (.ndwaarde — wikkelt nooit uit elkaar); gemeten in de app-letter: icoon 11 + 'Nabeurs' 46 + 'za 01:59' 43 = 108 px past in 112/116, 'Voorbeurs' + tijd (118) niet → tijd eronder; op ≥ 560 px (170) past 'Nabeurs 370,10 (+0,4%)' (168) zelfs op één regel. Pijl en bedrag alleen in de kop en de kopregel van de kaart (de rijen tonen het percentage, de kleur zegt de richting); het icoon inline-block (de klasse vaico van VIEWS-ACTIES is display block) */
.prow[data-nd="dicht"] .pday{font-weight:500}
.prow[data-nd="dicht"] .pday.up{color:color-mix(in srgb, var(--good-text) 55%, var(--ink-3))}
.prow[data-nd="dicht"] .pday.down{color:color-mix(in srgb, var(--bad-text) 55%, var(--ink-3))}
.prow[data-nd] .ndico{display:inline-block; width:11px; height:11px; vertical-align:-2px; margin-right:0; color:var(--ink-3)}
.prow[data-nd] .ndlbl{font-size:11px; font-weight:500; color:var(--ink-2)}
.prow[data-nd] .ndwaarde{order:2; white-space:nowrap}
.prow[data-nd] .ndkoers{font-size:13px; font-weight:700; color:var(--ink)}
.prow[data-nd]:not([data-ndcur]) .ndcur{display:none} /* v25.52 (NABEURS-DESIGN, herstel tegenlezer RG-1/UX-6): het teken blijft staan als de koers niet in de rijvaluta is omgerekend (data-ndcur door het blok) */
.prow[data-nd] .ndverschil{font-size:11.5px; font-weight:600; margin-left:3px}
.prow[data-nd] .ndpijl, .prow[data-nd] .ndabs{display:none}
.prow[data-nd] .ndsep{display:none}
.prow[data-nd] .ndtijd{order:1; margin-left:2px; font-size:10px; font-weight:500; color:var(--ink-3)}
/* v25.52 (NABEURS-DESIGN, herstel tegenlezer UX-5): de eerlijke leegte ('Voorbeurs: nog geen koers') bij dicht in dezelfde stille maat als de dagregel (was 12,5 px 600: prominenter dan het slot) — via de binnenspan .ndleeg van het blok, want de v25.44-regel op .wlext in de positielijst is een id-regel */
.prow[data-nd="dicht"] .wlext.naleeg{line-height:1.2}
.prow[data-nd="dicht"] .ndleeg{font-size:11px; font-weight:500; color:var(--ink-3)}
.wlext .ndlbl, .wlext .ndkoers, .wlext .ndverschil, .tkext .ndlbl, .tkext .ndkoers, .tkext .ndverschil{font-variant-numeric:tabular-nums}
/* kopregel van de portefeuillekaart (de regel heroNa van NABEURS-ALTIJD): weg bij open; bij dicht één cijferregel + één fluisterregel, met het lijn-icoon als masker vóór het woord (maansikkel; zonsopgang bij voorbeurs) */
.hero[data-nd="open"] .herona{display:none}
.hero[data-nd="dicht"] .herona .nanoot{flex-basis:100%}
.hero[data-nd="dicht"] .herona .nahkop::before{content:""; display:inline-block; width:12px; height:12px; vertical-align:-2px; margin-right:3px; background-color:var(--ink-3); -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14.5A8 8 0 0 1 9.5 4a8 8 0 1 0 10.5 10.5z'/%3E%3C/svg%3E") center / contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14.5A8 8 0 0 1 9.5 4a8 8 0 1 0 10.5 10.5z'/%3E%3C/svg%3E") center / contain no-repeat}
.hero[data-nd="dicht"][data-ndsessie="voorbeurs"] .herona .nahkop::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 18h16'/%3E%3Cpath d='M7 15a5 5 0 0 1 10 0'/%3E%3Cpath d='M12 6V3'/%3E%3Cpath d='M5.5 8.5 7 10'/%3E%3Cpath d='M18.5 8.5 17 10'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 18h16'/%3E%3Cpath d='M7 15a5 5 0 0 1 10 0'/%3E%3Cpath d='M12 6V3'/%3E%3Cpath d='M5.5 8.5 7 10'/%3E%3Cpath d='M18.5 8.5 17 10'/%3E%3C/svg%3E")}
/* koerskop van de bedrijfs-/ETF-pagina (tkHead): open = dagverandering als pil naast de meta, de regel tkExt weg; dicht = dagregel gedempt en de voor-/nabeursregel als tweede cijfer van de kop (Archivo 17 px); het grote getal tkPrice blijft in elke toestand het grote getal */
.tkhead[data-nd="open"] .tkdagrij .pday.up, .tkhead[data-nd="open"] .tkdagrij .pday.down{display:inline-flex; align-items:baseline; padding:2px 9px; border-radius:999px; font-size:14px; font-weight:700; background:color-mix(in srgb, currentColor 13%, transparent)}
.tkhead[data-nd="open"] .tkdagrij .pday.tikflits-op{background-color:color-mix(in srgb, var(--good-text) 30%, transparent)}
.tkhead[data-nd="open"] .tkdagrij .pday.tikflits-af{background-color:color-mix(in srgb, var(--bad-text) 30%, transparent)}
.tkhead[data-nd="open"] .tkext, .tkhead[data-nd="slotvolgt"] .tkext{display:none}
.tkhead[data-nd="dicht"] .tkdagrij .pday{font-size:13px; font-weight:600}
.tkhead[data-nd="dicht"] .tkdagrij .pday.up{color:color-mix(in srgb, var(--good-text) 55%, var(--ink-3))}
.tkhead[data-nd="dicht"] .tkdagrij .pday.down{color:color-mix(in srgb, var(--bad-text) 55%, var(--ink-3))}
.tkhead[data-nd="dicht"] .tkext{margin-top:6px}
.tkext .ndico{display:inline-block; width:14px; height:14px; vertical-align:-2px; margin-right:4px; color:var(--ink-3)}
.tkext .ndlbl{font-size:12.5px; font-weight:600; color:var(--ink-2)}
.tkext .ndkoers{font-family:"Archivo",sans-serif; font-size:17px; font-weight:700; color:var(--ink); letter-spacing:-.01em}
.tkext .ndverschil{font-size:13.5px; font-weight:700; white-space:nowrap} /* op een smal scherm breekt de kopregel vóór het verschil, nooit erin ('↑ $ 1,36 (+0,4%)' blijft één geheel) */
.tkext .ndtijd{font-size:11.5px; font-weight:500; color:var(--ink-3)}
@media (max-width:380px){ .tkext .ndkoers{font-size:15px} }
@media (prefers-reduced-motion: no-preference){ .prow[data-nd] .pday, .tkhead[data-nd] .pday{transition:background-color .25s ease, color .25s ease} }
/* v25.52 — PERSBERICHTEN-UI */
/* v25.52 (PERSBERICHTEN-UI): de kaart Persberichten op /beheer in de stijl van BEHEER3 (Rabi 7-9 22:04: "de layout mag echt moderner") — tegels (.b3tegel), één gedempte
   metaregel, de werkbalk met het aandraagveld, het segment en Meer ▾, rijen als kaart met statuschips en een ⋯-menu, en de uitklap 'verborgen' (concepten die niet
   aan de eisen voldoen, standaard dicht). Alleen thematokens (dark én licht), geen id-selectors, geen hex, geen aanwijs-effecten (de oudere suites scannen de staart
   van dit bestand); toetsenbord via :focus-visible; 320 px zonder horizontaal scrollen; prefers-reduced-motion gerespecteerd. */
.pbtegels{margin:8px 0 6px}
.pbtegel.leeg .b3cijfer{color:var(--ink-3)}
.pbmeta{font-size:11.5px;color:var(--ink-3);line-height:1.5;margin:0 0 6px;overflow-wrap:anywhere}
.pbsig{font-size:12px}
.pbaandraag{display:flex;flex-wrap:wrap;gap:6px;align-items:center;width:100%;min-width:0}
.pbaandraag .vaico{color:var(--ink-3);flex:none}
.pbaandraag input[type=url]{flex:1 1 220px;min-width:0;min-height:40px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--input-bg);color:var(--ink);font:inherit;font-size:16px}
.pbaandraag input[type=text]{flex:0 1 150px;min-width:0;min-height:40px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--input-bg);color:var(--ink);font:inherit;font-size:16px}
.pbaandraag input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbaandraag input:disabled{opacity:.55}
.pbprimair{background:var(--accent);color:var(--accent-tekst);border-color:var(--accent)}
.pbprimair:disabled{opacity:.45;cursor:default}
.pbprimair:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pbaandraag .pbprimair{min-height:40px;padding:0 14px}
.pbaandraaghelp{flex:0 0 100%;font-size:11.5px;margin:2px 0 0}
.pbaandraagstand{flex:0 0 100%;font-size:12.5px;margin:4px 0 0;color:var(--ink-2);overflow-wrap:anywhere;line-height:1.45}
.pbaandraagstand[hidden]{display:none}
.pbaandraagstand.klaar{color:var(--good-text)}
.pbaandraagstand.fout{color:var(--bad-text)}
.pbaandraagstand.let{color:var(--gold)}
.pbaandraagstand .pbkandidaat{cursor:pointer;font:inherit;font-size:11px;padding:2px 8px;margin:0 2px;color:var(--accent);border-color:var(--accent-lijn)}
.pbaandraagstand .pbkandidaat i{font-style:normal;color:var(--ink-2)} /* v25.52 (PERSBERICHTEN-UI, herstel tegenlezer UX-8): ink-2 — ink-3 was op de donkere chipvulling net onder leesbaar */
.pbaandraagstand .bhlink{font-size:12.5px;font-weight:600}
.pbwerkbalkb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;width:100%;min-width:0}
.pbzicht{overflow-x:auto;max-width:100%;flex:none}
.pbzicht button{white-space:nowrap}
.pbzicht button[aria-pressed="true"]{background:var(--accent);color:var(--accent-tekst)}
.pbzicht button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbwerkbalk .pbzoek{display:inline-flex;align-items:center;gap:6px;flex:1 1 180px;min-width:140px;margin-top:0}
.pbwerkbalk .pbzoek .vaico{color:var(--ink-3);flex:none}
.pbwerkbalk .pbzoek input{flex:1;min-width:0;font:inherit;font-size:16px;min-height:36px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--input-bg);color:var(--ink)}
.pbwerkbalk .pbzoek input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbmeer{flex:none;min-width:0;max-width:100%}
.pbmeer summary{list-style:none;cursor:pointer;display:inline-flex;gap:4px;align-items:center;min-height:36px;padding:0 10px;border:1px solid var(--line);border-radius:10px;color:var(--ink-2);font-size:12px;font-weight:600}
.pbmeer summary::-webkit-details-marker{display:none}
.pbmeer summary:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbmeer[open]>div{display:flex;flex-wrap:wrap;gap:6px;padding:8px 0 2px;max-width:100%}
.pbmeer[open]>div .bhknop{flex:none}
.pbtel{margin-left:auto;white-space:nowrap}
.pbbulk .pbtel{margin-left:0}
.pblijst li.pbwrij{background:var(--card-2);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:0 0 6px;grid-template-columns:20px minmax(0,1fr) auto;gap:6px 10px;align-items:start}
.pblijst li.pbwrij:first-child{border-top:1px solid var(--line)}
.pbwrij .pbinhoud{gap:4px}
.pbkop{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;font-size:11.5px;color:var(--ink-2)}
.pbkop .pbnaam{font-size:12px}
.pbkop .bhgrijs{font-size:11.5px}
.pbwrij .pbtitel{appearance:none;background:none;border:0;padding:0;margin:0;font:inherit;font-size:15px;font-weight:700;color:var(--ink);text-align:left;cursor:pointer;line-height:1.3;overflow-wrap:anywhere;max-width:100%}
.pbwrij .pbtitel:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.pbwrij .pbtitelleeg{font-size:13px}
.pbstatus{display:inline-block;font-style:normal;font-size:10.5px;font-weight:600;padding:0 7px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2);white-space:nowrap;line-height:1.7}
.pbstatus.accent{border-color:var(--accent-lijn);color:var(--accent)}
.pbstatus.goed{border-color:var(--good);color:var(--good-text)}
.pbstatus.let{border-color:var(--gold);color:var(--gold)}
.pbstatus.fout{border-color:var(--bad);color:var(--bad-text)}
.pbstatus.puls{animation:pbpuls 1.6s ease-in-out infinite}
@keyframes pbpuls{50%{border-color:var(--accent)}}
.pbtijd{font-style:normal;color:var(--ink-3)}
.pbwrij .bhsigknoppen{grid-column:3;grid-row:1;justify-content:flex-end;align-items:center;flex-wrap:nowrap}
.pbwrij .bhsigknoppen .pbprimair{white-space:nowrap}
.pbmenu{position:relative;display:inline-block;flex:none}
.pbmenu summary{list-style:none;cursor:pointer;min-width:36px;min-height:36px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;color:var(--ink-2)}
.pbmenu summary::-webkit-details-marker{display:none}
.pbmenu summary:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbmenu[open]>div{position:absolute;right:0;top:calc(100% + 4px);z-index:5;min-width:180px;display:flex;flex-direction:column;gap:4px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.pbmenu[open]>div .bhknop{width:100%;text-align:left;white-space:normal}
.pbverborgen{margin:8px 0 10px;border-top:1px solid var(--line);padding-top:6px}
.pbverborgen>summary{list-style:none;cursor:pointer;font-size:12.5px;color:var(--ink-3);display:flex;gap:6px;align-items:center;min-height:36px}
.pbverborgen>summary::-webkit-details-marker{display:none}
.pbverborgen>summary:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-radius:6px}
.pbverborgen>summary b{color:var(--accent);font-weight:600}
.pbverborgen>summary .vaico{transition:transform .15s;color:var(--ink-3)}
.pbverborgen[open]>summary .vaico{transform:rotate(180deg)}
.pbverborgen .pbwrij .pbkop,.pbverborgen .pbwrij .pbtitel,.pbverborgen .pbwrij .pbtitelleeg,.pbverborgen .pbwrij .pbvlaggen{opacity:.7}
.pbverborgenuitleg{font-size:12px;margin:4px 0 6px}
.pbverborgen .b3h4{margin:10px 0 6px}
.pbmodalbron{font-size:12px;margin:0 0 6px}
.pbpoort .b3chip{margin-right:2px}
/* herstelronde 1 (tegenlezers) — UX-2: de reden van een storing-rij altijd zichtbaar; UX-3b: de drie klapblokken (Leren · Probes · Instellingen, v25.51-markup byte-gelijk) in de Toren-typografie (.b3h4) mét dezelfde chevron als de uitklap;
   UX-4: de licentie op één plek — de bestaande .pblicentie-alinea gedempt en onderaan het vak (flex-order, css-only); UX-8: de canon in een kandidaat-chip leesbaar op de donkere chipvulling */
.pbreden{font-size:12px;color:var(--ink-2);margin:2px 0 0}
.pbvak{display:flex;flex-direction:column;min-width:0}
.pbvak>.pblicentie{order:9;font-size:11.5px;color:var(--ink-3);margin:10px 0 0}
.pbvak>details.bhklap>summary{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);display:flex;align-items:center;gap:8px;min-height:36px;padding:0}
.pbvak>details.bhklap>summary::before{content:"";display:inline-block;width:7px;height:7px;margin:0 2px 3px 3px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:rotate(-45deg);transition:transform .15s}
.pbvak>details.bhklap[open]>summary::before{transform:rotate(45deg);margin-bottom:5px}
@media (max-width:479px){
  .pblijst li.pbwrij{grid-template-columns:20px minmax(0,1fr)}
  .pbwrij .bhsigknoppen{grid-column:2;grid-row:auto;width:100%;justify-content:flex-end;flex-wrap:wrap}
  .pbtel{flex:0 0 100%;margin-left:0}
  .pbzicht{display:grid;grid-template-columns:1fr 1fr;overflow:visible;width:100%} /* v25.52 (PERSBERICHTEN-UI): op een telefoon passen de vier standen niet op één regel (op 414 px viel 'Alles' buiten beeld) → 2 × 2, niets buiten beeld */
  .pbzicht button{white-space:normal;text-align:center}
}
@media (max-width:359px){
  .pbaandraag input[type=text]{flex-basis:100%}
  .pbaandraag .pbprimair{flex:1 1 100%}
  .pbmenu[open]>div{position:static;box-shadow:none;margin-top:4px;min-width:0}
  .pbwrij .pbprimair{flex:1 1 100%;width:100%}
  .pbwrij .bhsigknoppen{justify-content:stretch}
  .pbtegel .b3bet{-webkit-line-clamp:3} /* v25.52 (PERSBERICHTEN-UI, herstel tegenlezer UX-5): op 320 px drie regels voor de betekenis (tegel ± 121 px breed) */
}
@media (prefers-reduced-motion:reduce){ .pbstatus.puls{animation:none} .pbverborgen>summary .vaico{transition:none} .pbvak>details.bhklap>summary::before{transition:none} }
/* v25.52 — BP-NABEURS */
/* kerncijferrij Koers: de korte voor-/nabeursregel onder het slot; koersgrafiek: het gestippelde staartje naar de buitenbeurskoers — dezelfde kleurtokens als .tkext.up/.down, alleen buiten beurstijd (data via het blok v25.52 bp-nabeurs) */
.ktbval small.bpna{font-weight:600; font-size:10.5px}
.ktbval small.bpna.up{color:var(--good-text)} .ktbval small.bpna.down{color:var(--bad-text)} .ktbval small.bpna.mut{color:var(--ink-3)}
.bpstaart.up{color:var(--good-text)} .bpstaart.down{color:var(--bad-text)} .bpstaart.mut{color:var(--ink-3)}
.bpstaart line{stroke:currentColor; stroke-width:2; stroke-dasharray:2.5 3; stroke-linecap:round}
.bpstaart circle{fill:currentColor}
.bpstaart circle.bpknip{fill:none; stroke:currentColor; stroke-width:1.6} /* herstel tegenlezer UX-1b: op de rand geknipt → open stip, het percentage staat in het label */
.bpstaart text{fill:currentColor; font-size:9.5px; font-weight:600; letter-spacing:.01em}
/* v25.52 — LIVE-ALLES (P2 LIVE-TIK; Rabi 8-9 00:0x NL "Alles zou eigenlijk volledig live moeten zijn en aanvoelen"): de stempel "bijgewerkt HH:MM" in de kop van Portefeuille (achter het label, naast de stip van PORTEFEUILLE-RUST) en de vier noodknoppen op de kaart Koersen van /beheer. Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag; de flits op de Ontdek-tegels gebruikt de bestaande .tikflits-klassen (v25.43). */
.hero .lbl .lastempel{margin-left:8px; font-size:10.5px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--ink-3)}
.laknoppen{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px}
/* herstel tegenlezer UX-3: de actieve stand is een gekozen knop (accent), niet de rode 'uit'-stijl; alleen 'Ronde staat uit — weer aan' en 'Tik uit' houden als actieve stand de waarschuwingskleur (.uit) */
.laknoppen .bhknop[aria-pressed="true"]{border-color:var(--accent); color:var(--accent-tekst); background:color-mix(in srgb, var(--accent) 12%, var(--card))}
.laknoppen .bhknop.uit[aria-pressed="true"]{border-color:var(--bad); color:var(--bad-text); background:color-mix(in srgb, var(--bad) 12%, var(--card))}
/* v25.52 — NABEURS-KNOP (Rabi 8-9 ochtend, ingesproken: "the more simpler one without the after hour part … two buttons saying voorbeurs and nabeurs"; ± 08:50 NL bij een screenshot: "Afterhours en pre market is gewoon voor en na beurs in het engels … zou ik verder geen uitleg naast zetten … Makkelijkste is denk ik gewoon een toggle tussen normaal en afterhours/premarket"): één schakelaar (Normaal · Voorbeurs/Nabeurs) boven de positielijst en boven de watchlist; in de stand Voorbeurs/Nabeurs krijgen de slotcellen van de rij hidden en staan de eigen cellen .nkkoers/.nkdag (dezelfde klassen pprice/pday = dezelfde opmaak) ernaast; een rij zonder voor-/nabeurskoers is in die stand gedempt (nkgeen). Het blok v25.52 nabeurs-knop zet hidden/klassen, de css is de knopstijl + het vangnet. Alleen tokens en color-mix, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji. */
.nkrij{display:flex; align-items:center; gap:0; padding:6px 18px 2px}
.wlcard > .nkrij{padding:10px 18px 0}
.nkrij .nkknop{display:inline-flex; align-items:center; gap:5px; min-height:32px; cursor:pointer; font:inherit; font-size:12.5px; font-weight:600; line-height:1.2; background:var(--card); color:var(--ink-2)}
.nkrij .nkknop:first-child{border-top-right-radius:0; border-bottom-right-radius:0}
.nkrij .nkknop:last-child{border-top-left-radius:0; border-bottom-left-radius:0; margin-left:-1px}
.nkrij .nkknop .nkico{display:inline-block; width:14px; height:14px; flex:none}
.nkrij .nkknop[aria-pressed="true"]{position:relative; z-index:1; border-color:var(--accent); color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--card))} /* v25.52 (NABEURS-DATA, Rabi 8-9 ± 10:00 "de tekst van het geselecteerde wordt wit waardoor je niks ziet in witte stand"): de tekst in de accentkleur op de lichte accent-wash — was de tekst-op-accent-kleur (wit in het lichte thema op een bijna witte wash = onleesbaar); gemeten in de browser: licht 7,1:1, donker 4,7:1 (doorloop ndaContrastLicht/ndaContrastDonker); uit de tokens gerekend licht 7,2:1, donker 4,7:1 (suite D) */
.prow .wlext[hidden]{display:none} /* vangnet: de voor-/nabeursregel en de leegte blijven in de DOM (textContent-pins van oudere suites), nooit zichtbaar */
.prow .pprice[hidden], .prow .pday[hidden]{display:none} /* vangnet: de slotcellen in de stand Voorbeurs/Nabeurs */
.prow.nkgeen .pprice, .prow.nkgeen .pday{opacity:.55} /* Voorbeurs/Nabeurs zonder voor-/nabeurskoers: de gewone koers, gedempt — geen tekst */
@media (max-width:359px){ .nkrij{padding-left:12px; padding-right:12px} .nkrij .nkknop{font-size:12px} }
/* v25.52 — PRESTATIE-NAMEN (Rabi 8-9: Mandje → Dode belegger, Rekening → Jouw prestatie; "altijd de juiste per jaar en totaal erbij") — de regel totaal · per jaar onder de legenda, "per jaar" naast het grote totaal op het prestatiescherm, per jaar per cel in de periodetabel (::after uit data-pnj), de vergelijkingszin onder de grafiek; alleen tokens, geen aanwijs-effect */
.serieslegend .pnlijn{flex-basis:100%; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; padding-top:6px; margin-top:2px; border-top:1px solid var(--line); font-variant-numeric:tabular-nums; color:var(--ink-2)}
.serieslegend .pnlijn .pnstat{display:inline-flex; align-items:baseline; gap:5px; white-space:nowrap}
.serieslegend .pnlijn small, .prestkpi .pnkpi small{font-size:10px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3)}
.serieslegend .pnlijn .pnwat{font-size:11.5px; line-height:1.35; color:var(--ink-3); flex:1 1 180px; min-width:0}
.serieslegend .pnlijn b.pnnvt, .prestkpi .pnkpi b.pnnvt{font-family:inherit; font-weight:600; color:var(--ink-3)}
.seriestoggles .pnlijn{border-top-color:var(--line-2, var(--line))}
.prestkpi .pnkpi{display:inline-flex; align-items:baseline; gap:5px; font-size:13px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.prestkpi .pnkpi b{font-family:"Archivo",sans-serif; font-weight:700; font-size:15px; letter-spacing:-.01em}
.prestkpi .pnkpi b.up{color:var(--good-text)} .prestkpi .pnkpi b.down{color:var(--bad-text)}
.prestkpi .pnkpi[hidden]{display:none}
.rangestats .rs > span[data-pnj]::after{content:attr(data-pnj); display:block; font-size:10px; font-weight:500; line-height:1.3; color:var(--ink-3); font-variant-numeric:tabular-nums}
.rangestats .rs.head > span[data-pnj]::after{font-size:9px; letter-spacing:.04em; text-transform:none}
.pnvergelijk{margin:8px 18px 0; font-size:12.5px; line-height:1.45; color:var(--ink-2); font-variant-numeric:tabular-nums}
.pnvergelijk[hidden]{display:none}
.prestcard .pnvergelijk{margin:8px 2px 0}
@media (max-width:359px){ .serieslegend .pnlijn{gap:4px 10px} .serieslegend .pnlijn .pnwat{flex-basis:100%} .pnvergelijk{font-size:12px} }
/* v25.52 — WATCHLIST-AUTO (Rabi 8-9 ± 11:00 NL: "Alles wat in je portefeuille zit moet ook in je main watchlist … max 5" + de aanvulling met het sorteermenu "watchlist moet je kunnen sorteren op deze zaken … en editten … via een edit of plus knop"): het label "in portefeuille" (lijn-icoon in de plaats van het kruisje, tekst vanaf 560 px), de sterknop met de klasse wapf, de chip "hoofdlijst" + de teller in het lijstbeheer-sheet, het sorteermenu, de knop Bewerken/Klaar en de bewerkmodus (rijen zonder sparkline/koers, knoppen omhoog/omlaag, de toevoegrij). Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji. */
.wlrow.metlogo.wapf{grid-template-columns:28px minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto) auto} /* de laatste kolom groeit mee met het label (was 26 px voor het kruisje) */
.wlrow.wapf .wlx{display:none} /* een portefeuillesymbool verlaat de hoofdlijst pas bij verkoop — geen kruisje */
.wlrow .walabel{display:inline-flex; align-items:center; gap:4px; justify-self:end; color:var(--ink-3); font-size:11px; font-weight:600; line-height:1; padding:4px 2px; border-radius:8px; white-space:nowrap; cursor:default}
.wlrow .walabel .waico{width:15px; height:15px; flex:none}
.wlrow .walabel .watxt{display:none; font-style:normal}
@media (min-width:560px){ .wlrow .walabel .watxt{display:inline} }
.wlbtn.wapf{opacity:.92} /* de sterknop op de bedrijfspagina: aan, met de eerlijke title */
.pfrow-l .wahoofd{display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px; font-size:10.5px; font-weight:600; font-style:normal; line-height:1.5; color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--card)); vertical-align:1px}
.pfmgr .wateller{margin:2px 0 6px; color:var(--ink-3)}
@media (max-width:380px){ .wlrow.metlogo.wapf{grid-template-columns:28px minmax(0,1fr) 64px auto auto} }
.wlkop{position:relative} /* het sorteermenu hangt aan de kop */
.wasortmenu{top:100%; right:0; margin-top:4px; min-width:200px}
.wlkopr .wasort, .wlkopr .wabewerk{display:inline-flex; align-items:center; gap:5px; cursor:pointer; min-height:30px}
.wlkopr .wasort .waico, .wlkopr .wabewerk .waico{width:14px; height:14px; flex:none}
.wlkopr .wabewerk{appearance:none; background:transparent; font:inherit; font-size:12.5px; font-weight:600}
.wlkopr .wabewerk[aria-pressed="true"]{color:var(--accent); border-color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--card))}
.plist.wabewerk .wlrow .psparkbox, .plist.wabewerk .wlrow .pright{display:none} /* bewerkmodus: alleen naam + knoppen */
.plist.wabewerk .wlrow.metlogo, .plist.wabewerk .wlrow.metlogo.wapf{grid-template-columns:28px minmax(0,1fr) auto auto}
.plist.wabewerk .wlrow{cursor:default}
/* Rabi 8-9 ± 10:20 UTC, letterlijk: "De X knop om dingen uit je lijst te halen mag onder edit en daar weg zodat alles meer ruimte krijgt." — de kruisjesknop bestaat alleen nog in de bewerkmodus; de gewone rij verliest de laatste kolom (26/24 px + het kolomgat), dus naam/sparkline/koers worden breder. Portefeuillerijen (.wapf) houden hun label-kolom (auto). De oude regels mid-file blijven staan (pins logos/profiel); deze staan later én specifieker. */
.plist:not(.wabewerk) .wlrow .wlx{display:none}
.plist:not(.wabewerk) .wlrow.metlogo:not(.wapf){grid-template-columns:28px minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto)}
@media (max-width:480px){ .plist:not(.wabewerk) .wlrow.metlogo:not(.wapf){grid-template-columns:28px minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto)} }
@media (max-width:399px){ .plist:not(.wabewerk) .wlrow.metlogo:not(.wapf){grid-template-columns:28px minmax(64px,1fr) minmax(min-content,auto)} }
.wamove{display:inline-flex; gap:3px; justify-self:end; align-items:center}
.wamv{appearance:none; background:transparent; border:1px solid var(--line-2); color:var(--ink-2); border-radius:9px; min-width:36px; min-height:36px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0}
.wamv:disabled{opacity:.35; cursor:default}
.wamv .waico{width:16px; height:16px}
.watoevoegrij{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:8px; padding:12px 10px; min-height:44px; border:1px dashed var(--line-2); border-radius:12px; background:transparent; color:var(--accent); font:600 13.5px "IBM Plex Sans",sans-serif; cursor:pointer}
.watoevoegrij .waico{width:16px; height:16px; flex:none}
/* v25.52 — WERELDMARKTEN (Rabi 8-9: "Ook een fijne toevoeging onder watchlist … twee knoppen … tussen normaal en futures en dan beurzen uit de hele wereld … compacte, verslavende, apple style"): de sectie section.wm (wmBlok) onder de watchlistkaart — alleen tokens, geen aanwijs-effect, geen id-selector, geen kleurcode */
.wm{padding:12px 12px 10px; margin-top:10px}
.wm .wmkop{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px}
.wm .wmkop h2{font-size:15px; font-weight:800; margin:0; letter-spacing:-.005em; color:var(--ink)}
.wm .wmkop .wmtijd{font-size:11px; color:var(--ink-3); white-space:nowrap}
.wm .wmseg{display:grid; grid-template-columns:1fr 1fr; background:var(--seg-bg); border-radius:10px; padding:3px; position:relative; margin-bottom:6px}
.wm .wmseg .wmtab{position:relative; z-index:1; border:0; background:transparent; font:inherit; font-size:13px; font-weight:600; color:var(--ink-2); padding:7px 0; border-radius:8px; cursor:pointer; min-height:34px; transition:color .2s}
.wm .wmseg .wmtab[aria-pressed="true"]{color:var(--ink)}
.wm .wmseg .wmthumb{position:absolute; top:3px; bottom:3px; left:3px; width:calc(50% - 3px); background:var(--card); border-radius:8px; box-shadow:0 1px 3px color-mix(in srgb, var(--merk-navy) 14%, transparent); transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.wm .wmseg[data-k="nabeurs"] .wmthumb{transform:translateX(100%)} /* WERELDMARKTEN-2 (v25.52): de tweede tab heet Voor/nabeurs (id nabeurs, was futures) */
.wm .wmseg .wmtab:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.wm .wmvak{display:none}
.wm .wmvak.aan{display:block}
.wm .wmvaktitel{display:none; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-2); margin:6px 4px 0}
.wm .wmregiokop{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 4px 4px}
.wm .wmregiokop b{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3)}
.wm .wmregiokop span{font-size:11px; color:var(--ink-3); text-align:right}
.wm .wmstip{display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--ink-3); margin-right:5px; vertical-align:middle}
.wm .wmstip.open{background:var(--good); box-shadow:0 0 0 3px color-mix(in srgb, var(--good) 16%, transparent)}
.wm .wmstip.voor{background:var(--gold)}
.wm .wmlijst{display:flex; flex-direction:column}
.wm .wmrij{display:grid; grid-template-columns:minmax(0,1fr) 54px auto 68px; gap:10px; align-items:center; padding:7px 4px; border-top:1px solid var(--line); text-decoration:none; color:inherit; min-height:44px}
.wm .wmlijst .wmrij:first-child{border-top:0}
.wm .wmrij[hidden]{display:none}
.wm .wmrij .wmn{min-width:0}
.wm .wmrij .wmn b{font-size:13.5px; font-weight:700; display:block; line-height:1.2; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.wm .wmrij .wmn span{font-size:11px; color:var(--ink-3); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.wm .wmrij .wmspark{width:54px; height:22px; display:block}
.wm .wmrij .wmk{font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; text-align:right; color:var(--ink); white-space:nowrap}
.wm .wmpil{font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; text-align:center; padding:5px 0; border-radius:8px; color:var(--merk-op-blauw); background:var(--good); white-space:nowrap}
.wm .wmpil.d{background:var(--bad)}
.wm .wmpil.m{background:var(--ink-3)}
.wm .wmrij.dicht .wmk{color:var(--ink-2)}
.wm .wmrij.dicht .wmpil{background:color-mix(in srgb, var(--good) 15%, transparent); color:var(--good-text)}
.wm .wmrij.dicht .wmpil.d{background:color-mix(in srgb, var(--bad) 15%, transparent); color:var(--bad-text)}
.wm .wmrij.dicht .wmpil.m{background:color-mix(in srgb, var(--ink-3) 18%, transparent); color:var(--ink-2)}
.wm .wmmeer{border:0; background:transparent; color:var(--accent); font:inherit; font-size:12px; font-weight:600; padding:8px 4px 2px; cursor:pointer; text-align:left; min-height:32px}
.wm .wmmeer:focus-visible{outline:2px solid var(--accent); outline-offset:1px; border-radius:6px}
.wm .wmleeg{margin:0; padding:4px 4px 8px; font-size:12px; color:var(--ink-3)}
.wm .wmvoet{display:flex; justify-content:space-between; align-items:center; padding:10px 4px 0; font-size:11px; color:var(--ink-3)}
.bhstats .wmbhkop{grid-column:1 / -1; margin:8px 0 0}
@media (min-width:760px){
  .wm .wmseg{display:none}
  .wm .wmtabs{display:grid; grid-template-columns:1fr 1fr; gap:0 24px; align-items:start}
  .wm .wmvak{display:block}
  .wm .wmvaktitel{display:block}
}
@media (max-width:359px){
  .wm{padding:10px 8px 8px}
  .wm .wmrij{grid-template-columns:minmax(0,1fr) 44px auto 62px; gap:6px}
  .wm .wmrij .wmspark{width:44px}
  .wm .wmrij .wmn b{font-size:13px}
}
@media (prefers-reduced-motion:reduce){ .wm .wmseg .wmthumb, .wm .wmseg .wmtab{transition:none} }
/* WERELDMARKTEN-2 (v25.52, Rabi 8-9 "zoek een ETF equivalent en zet de naam als de index … futures vervangen door voor/nabeurs"): het merkteken "via ETF" op de plek van de koers, de voor-/nabeursregel (.wmext, dezelfde tekstvorm als de watchlistrij) en de gedempte slotkoers van de tab Voor/nabeurs — alleen tokens */
.wm .wmrij .wmvia{font-size:10px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); border:1px solid var(--line); border-radius:6px; padding:2px 5px}
.wm .wmrij.na .wmn .wmext{display:block; font-size:11px; color:var(--ink-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums}
.wm .wmrij.na .wmn .wmext.up{color:var(--good-text)}
.wm .wmrij.na .wmn .wmext.down{color:var(--bad-text)}
.wm .wmrij.na .wmk.wmslot{font-size:11px; font-weight:500; color:var(--ink-3)}
.wm .wmrij.na .wmk.wmslot:empty{display:none}
details.wmproef{margin:6px 0 4px; font-size:12px; color:var(--ink-2)}
details.wmproef summary{cursor:pointer; color:var(--accent); font-weight:600; min-height:32px; display:flex; align-items:center}
/* v25.52 — VANDAAG-KAART */
/* De portefeuillekaart op Nieuws (nwKaart) als "Beweging in beeld" (Rabi 8-9: inzichtvoller, creatiever, beter ogen, wow, instagrammable).
   Alle regels hangen aan .vdkaart (gezet door het blok v25.52 vandaag-kaart) — zonder die klasse (VD_KAART_WOW = false) doet deze staart niets.
   Alleen tokens/color-mix, geen id-selectors, geen aanwijs-effect; de tekst van de bestaande klassen blijft byte-gelijk (pins). */
.nwkaart.vdkaart{padding:18px 18px 14px; background:linear-gradient(165deg, color-mix(in srgb, var(--accent) 10%, var(--card)), var(--card) 58%); border:1px solid color-mix(in srgb, var(--accent) 22%, var(--line))}
.vdkaart .vdsep[hidden]{display:none}
.vdkaart .nwkaartkop{margin:0}
.vdkaart .nwwaarde{margin:6px 0 4px}
.vdkaart .vddag{display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; font-size:19px; letter-spacing:-.01em}
.vdkaart .vddag .vdico{width:22px; height:22px; flex:none; display:inline-block}
.vdkaart .vddag .vdpct{padding:2px 10px; border-radius:999px; background:color-mix(in srgb, currentColor 13%, transparent); font-weight:700}
.vdkaart .vddag.vdvlak{color:var(--ink-2)}
.vdkaart .vddag .vdlabel{font-size:12.5px; font-weight:500; color:var(--ink-3)}
/* de dagbalk: links de remmers, rechts de trekkers; breedte per segment = aandeel in de totale beweging */
.vdkaart .vdbalk{display:flex; align-items:stretch; height:14px; margin:12px 0 5px; border-radius:7px; overflow:hidden; background:color-mix(in srgb, var(--ink-3) 12%, transparent)}
.vdkaart .vdbalkmin,.vdkaart .vdbalkplus{display:contents}
.vdkaart .vdbalkas{flex:none; width:2px; background:var(--card)}
.vdkaart .vdseg{flex:0 1 auto; min-width:3px; box-shadow:inset -1px 0 0 var(--card); transition:width .35s ease}
.vdkaart .vdseg.up{background:var(--good)} .vdkaart .vdseg.down{background:var(--bad)}
.vdkaart .vdlegenda{margin:0; font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums}
/* grootste bijdrage · grootste rem als twee tegels */
.vdkaart .nwbijdrage.vdtegels{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px}
.vdkaart .vdtegel{display:grid; grid-template-columns:18px 1fr; column-gap:6px; align-items:center; min-width:0; padding:8px 10px; border-radius:12px; background:color-mix(in srgb, currentColor 9%, var(--card))}
.vdkaart .vdtegel .vdico{width:18px; height:18px; display:inline-block}
.vdkaart .vdtegel .vdtegellbl{font-style:normal; font-size:10px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); white-space:normal; overflow-wrap:anywhere; line-height:1.2}
.vdkaart .vdtegel > b,.vdkaart .vdtegel > span{grid-column:2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.vdkaart .vdtegel > b{font-size:13px}
.vdkaart .vdtegel > span{font-size:16px; font-weight:700}
/* de indexstrook als chips die omlopen (nooit afgekapt) */
.vdkaart .nwmarkt.vdmarkt{display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; white-space:normal; overflow:visible; text-overflow:clip; font-size:11.5px}
.vdkaart .vdchip{display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:999px; background:color-mix(in srgb, var(--ink-3) 12%, transparent); color:var(--ink-2); white-space:nowrap}
.vdkaart .vdchip .vdchipnaam{font-style:normal}
.vdkaart .vdchip b{font-weight:700} .vdkaart .vdchip.up b{color:var(--good-text)} .vdkaart .vdchip.down b{color:var(--bad-text)} .vdkaart .vdchip.mut b{color:var(--ink-3)}
/* de drie punten met een lijn-icoon per soort; het deel over jou apart */
.vdkaart .nwzinnen.vdpunten{list-style:none; padding:0}
.vdkaart .vdpunt{display:flex; align-items:flex-start; gap:10px; margin:0 0 8px}
.vdkaart .vdpunt .vdico{flex:none; width:18px; height:18px; display:inline-block; margin-top:2px; color:var(--ink-2)}
.vdkaart .vdpunt-jou{padding:8px 10px; border-radius:12px; background:color-mix(in srgb, var(--accent) 10%, transparent); box-shadow:inset 3px 0 0 var(--accent)}
.vdkaart .vdpunt-jou .vdico{color:var(--accent)} .vdkaart .vdpunt-agenda .vdico{color:var(--ink-3)}
.vdkaart .vdpunttekst{min-width:0} .vdkaart .vdjou{font-weight:600; color:var(--ink)}
/* Stijgers/Dalers met een balkje per rij (relatief aan de grootste beweging) */
.vdkaart .lekaarttabel.vdtabelwrap{margin-top:14px}
.vdkaart .lbtabel.vdtabel td{vertical-align:top}
.vdkaart .vdrijbalk{display:block; height:3px; margin-top:3px; border-radius:2px; overflow:hidden; background:color-mix(in srgb, var(--ink-3) 14%, transparent)}
.vdkaart .vdrijbalk i{display:block; height:100%; border-radius:2px} .vdkaart .vdrijbalk i.up{background:var(--good)} .vdkaart .vdrijbalk i.down{background:var(--bad)}
.vdkaart .vdvoet{margin:12px 0 0; font-size:11px; color:var(--ink-3)}
/* herstelronde 2 (Rabi 8-9 ± 13:45): de indices staan niet meer in de kaart (de marktregel blijft als verborgen tekst voor de pins); het sessielabel
   klein en grijs tussen haakjes bij de dagbeweging, de tegels, de legenda en Stijgers/Dalers (caption of per rij) */
.vdkaart .nwmarkt.vdmarkt[hidden]{display:none}
.vdkaart .vdsessie{font-size:11px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--ink-3); white-space:nowrap}
.vdkaart .vddagrij{display:flex; align-items:baseline; flex-wrap:wrap; gap:2px 8px}
.vdkaart .nwbijdrage.vdtegels + .vdsessie{display:block; margin-top:5px}
.vdkaart .vdlegenda .vdsessie,.vdkaart .vdtabel caption .vdsessie,.vdkaart .vdtabel td .vdsessie{margin-left:4px}
@media (min-width:760px){
  /* twee kolommen: cijfers links, het verhaal rechts; de Stijgers/Dalers-tabel en de voet lopen onder beide kolommen door over de volle
     breedte (in een halve kolom kapte de tabel namen en getallen af). De DOM-volgorde blijft (contract: de tabel staat direct ná .nwzinnen). */
  .nwkaart.vdkaart{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,6fr); column-gap:32px; align-items:start}
  .vdkaart .vdboven{grid-column:1; grid-row:1 / span 2}
  .vdkaart .vdonder{display:contents}
  .vdkaart .vdonder > .nwdatum{grid-column:2; grid-row:1; margin-top:2px}
  .vdkaart .vdonder > .nwzinnen{grid-column:2; grid-row:2; align-self:start}
  .vdkaart .vdonder > .lekaarttabel{grid-column:1 / -1; grid-row:3; margin-top:14px; padding-top:12px; border-top:1px solid var(--line)}
  .vdkaart .vdonder > .vdvoet{grid-column:1 / -1; grid-row:4}
}
@media (max-width:359px){
  .nwkaart.vdkaart{padding:14px 12px 12px}
  .vdkaart .vddag{font-size:16px}
  .vdkaart .nwbijdrage.vdtegels{grid-template-columns:1fr}
  .vdkaart .vdpunt{gap:8px}
}
@media (prefers-reduced-motion:reduce){ .vdkaart .vdseg{transition:none} }
/* v25.52 — WATCHLIST-STRAK (Rabi 8-9 ± 12:55 NL bij een iPhone-screenshot van de Watchlist met een rood kader om het Portefeuille-icoon per rij en een voorbeeldplaatje van een grafieklijn: "de rood circlde knop is nutteloos. haal het weg en schuif de koers naar rechts, maake de grafiek iets simpler en live aanvoelen zoal in het voorbeeld"): het label .walabel in de gewone rij verborgen (in de bewerkmodus blijft het op de plek van de kruisjesknop), de portefeuillerij zonder vijfde kolom = dezelfde vier kolommen als een handmatige rij (koerskolom tegen de rechterrand, zoals de positierij van Portefeuille), de nieuwe sparkline (lijn zonder vlakvulling, hulplijnen, stip met puls op het laatste punt). Alleen tokens/currentColor, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji. Klasse wsstrak = de schakelaar WS_STRAK_AAN in het blok v25.52 watchlist-strak. */
.plist.wsstrak:not(.wabewerk) .wlrow .walabel{display:none}
.plist.wsstrak:not(.wabewerk) .wlrow.metlogo.wapf{grid-template-columns:28px minmax(64px,1fr) minmax(0,96px) minmax(min-content,auto)}
@media (max-width:480px){ .plist.wsstrak:not(.wabewerk) .wlrow.metlogo.wapf{grid-template-columns:28px minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto)} }
@media (max-width:399px){ .plist.wsstrak:not(.wabewerk) .wlrow.metlogo.wapf{grid-template-columns:28px minmax(64px,1fr) minmax(min-content,auto)} }
.spark{overflow:visible} /* de puls-stip mag over de rand van de 96 × 30 */
.spark .sparkhalo{transform-box:fill-box; transform-origin:center; opacity:0; animation:wspuls 1.8s ease-out infinite}
@keyframes wspuls{0%{transform:scale(1); opacity:.5} 70%{transform:scale(2.6); opacity:0} 100%{transform:scale(2.6); opacity:0}}
@media (prefers-reduced-motion:reduce){ .spark .sparkhalo{animation:none; opacity:0} }
/* Trending uitklapbaar (Rabi 8-9 ± 13:10 NL: "trending uitklapbaar maken in watchlist"): de kop is de knop, dicht = klasse wltrenddicht op het blok en de rail weg via css (nooit hidden op de rail) */
.wltrendblok .ontdekkop[data-wsklap]{cursor:pointer; border-radius:8px; min-height:34px}
.wltrendblok .ontdekkop[data-wsklap]:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.wltrendblok .ontdekkop .wstrendchev{display:inline-flex; align-items:center; vertical-align:middle; margin-left:4px; color:var(--ink-3); transition:transform .2s ease}
.wltrendblok .ontdekkop .wstrendchev .vaico{width:16px; height:16px}
.wltrendblok.wltrenddicht .ontdekkop .wstrendchev{transform:rotate(-90deg)}
.wltrendblok.wltrenddicht .wltrail{display:none}
.wltrendblok.wltrenddicht{margin-bottom:8px}
@media (prefers-reduced-motion:reduce){ .wltrendblok .ontdekkop .wstrendchev{transition:none} }
/* Look en feel + logo's weg (Rabi 8-9 ± 13:15 NL bij een referentiebeeld van een watchlist uit een andere app: "Hier is een voorbeeld van de look en feel van de watchlist. de logos mogen ook wel weg"): de watchlistrij zonder logo-kolom — [ticker + naam 1fr] [sparkline] [koers rechts]; ruime rij zonder scheidingslijn, ticker groot en vet, naam gedempt met ellipsis, koers groot en vet, dagverandering in de richtingkleur. Alleen rijen zonder data-nd (de stand van nu); de bewerkmodus houdt naam + knoppen. */
.plist.wsstrak:not(.wabewerk) .wlrow{grid-template-columns:minmax(64px,1fr) minmax(0,56px) minmax(min-content,auto); column-gap:14px; margin:0 -8px; padding-left:8px; padding-right:8px} /* -8 px = de 8 px kaartpadding van de watchlistkaart (de mid-file-regel op de wlcard binnen view-watchlist): zo staat de koerskolom op dezelfde x als de positierij van Portefeuille (kaart zonder padding); de aanwijs-regel van .prow (margin -10/padding 10) verliest van deze specifiekere regel — geen sprong */
.plist.wsstrak.wabewerk .wlrow{grid-template-columns:minmax(0,1fr) auto auto; column-gap:10px}
.plist.wsstrak:not(.wabewerk) .wlrow[data-nd]{grid-template-columns:minmax(64px,1fr) minmax(0,56px) 150px} /* NABEURS-DESIGN-terugweg (rijen mét data-nd, alleen bij ND_ACTIEF): een vaste koerskolom in de maten van die pin (150 vanaf 560 px, 116 eronder) zodat open en dicht dezelfde kolom houden — geen kolomsprong bij de wissel */
@media (max-width:559px){ .plist.wsstrak:not(.wabewerk) .wlrow[data-nd]{grid-template-columns:minmax(64px,1fr) minmax(0,48px) 116px} }
@media (max-width:399px){ .plist.wsstrak:not(.wabewerk) .wlrow[data-nd]{grid-template-columns:minmax(64px,1fr) minmax(0,44px) 116px} }
.plist.wsstrak:not(.wabewerk) .wlrow[data-nd] .pright{max-width:none; width:100%; justify-self:stretch} /* de koerskolom vult de vaste kolom: open en dicht meten dan dezelfde breedte (de mid-file-regel op .wlrow .pright zet max-width 116/150 en justify-self end; op 320 px was de dichte kolom 104 en de open 116) */
.plist.wsstrak:not(.wabewerk) .wlrow .psparkbox{display:block; min-width:0; width:auto}
.plist.wsstrak:not(.wabewerk) .wlrow .spark{width:100%; max-width:56px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]){padding:15px 0; border-bottom:0; min-height:80px; box-sizing:border-box}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft{gap:3px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b{font-size:19px; letter-spacing:-.005em; color:var(--ink)}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft span{font-size:15px; color:var(--ink-3)}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .psparkbox{height:32px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .spark{height:32px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright{gap:3px; max-width:170px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright .pprice{font-size:18px; font-weight:800; color:var(--ink); padding:0; letter-spacing:-.005em; font-variant-numeric:tabular-nums}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pday{font-size:15px; font-weight:500; padding:0; font-variant-numeric:tabular-nums}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .wlext{padding:0}
@media (max-width:480px){
  .plist.wsstrak:not(.wabewerk) .wlrow{grid-template-columns:minmax(64px,1fr) minmax(0,48px) minmax(min-content,auto); column-gap:12px}
  .plist.wsstrak:not(.wabewerk) .wlrow .spark{max-width:48px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright{max-width:150px}
}
@media (max-width:399px){
  .plist.wsstrak:not(.wabewerk) .wlrow{grid-template-columns:minmax(64px,1fr) minmax(0,44px) minmax(min-content,auto); column-gap:8px} /* gemeten op 320 px: de naamkolom houdt zo ± 90 px — ticker + belletje passen zonder afkapping */
  .plist.wsstrak:not(.wabewerk) .wlrow .spark{max-width:44px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]){padding:13px 0; min-height:72px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b{font-size:16px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft span{font-size:13px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright{max-width:132px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright .pprice{font-size:16px}
  .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pday{font-size:12px}
}
/* v25.52 — POLITICI-VERGELIJK (Rabi 8-9: "vergelijking met sp500 en ook de portefeuille en rendement van de gebruiker erbij … in de grafiekje"): de derde lijn jij in het hero-grafiekje van de politicuspagina, de S&P-lijn daar 1,6 px, eindstippen, de chip jij mét subregel; alleen tokens, gescoped op .pol3chart/.pol3legend. */
.pol3chart .pol2jij{fill:none; stroke:var(--accent); stroke-width:1.6; stroke-linejoin:round; stroke-linecap:round}
.pol3chart .pol2sp{stroke-width:1.6; stroke-dasharray:5 3}
.pol3chart .pvpunt{fill:var(--gold)} .pol3chart .pvpunt.jij{fill:var(--accent)}
.pol3legend .sl i.pol2sw.jij{border-color:var(--accent)}
.pol3legend .sl.pvchip{flex-wrap:wrap; row-gap:2px}
.pol3legend .sl.pvchip .pvsub{flex-basis:100%; font-size:11px; font-weight:400; color:var(--ink-3); white-space:normal}
.pol3legend .sl.pvchip.mut{color:var(--ink-3)}
.pol3legend .sl.pvchip.mut i,.pol3legend .sl.pvchip.pvwacht i{border-color:var(--ink-3); border-top-style:dotted}
.pvsinds,.pvuitleg{margin:6px 0 0}
/* v25.52 — POL-SPARK-KLEUR */
/* v25.52 (POL-SPARK-KLEUR): regressie van PR 75 (WATCHLIST-STRAK) — de sparkline in de politici-ranglijst (.pol2spark, pol2Spark → sparkSvg) is sinds die opknapbeurt een <path class="sparklijn"> met een eindstip (circle.sparkdot + circle.sparkhalo) i.p.v. een <polyline> + <polygon>; de kleurregels van POLITICI2 (r. ± 4994–4995) bereikten de nieuwe vorm niet, dus de lijn bleef op de geërfde kleur. Dezelfde tokens als die regels, alleen voor .pol2spark (de watchlist- en positierij blijven byte-gelijk). Terugweg = deze staart weg. */
.pol2spark.up path.sparklijn{stroke:var(--good-text)} .pol2spark.up circle.sparkdot,.pol2spark.up circle.sparkhalo{fill:var(--good-text)}
.pol2spark.down path.sparklijn{stroke:var(--bad-text)} .pol2spark.down circle.sparkdot,.pol2spark.down circle.sparkhalo{fill:var(--bad-text)}
/* v25.52 — WERELDMARKTEN-3 (Rabi 8-9 ± 17:05 NL: "de wereldmarkten kloppen niet want deel amerikaanse staan in nabeurs onder normaal"): een rij mét klasse oud (de koers is van een eerdere ronde — het laatste verzoek gaf geen koers) toont haar koers gedempt; de fix zelf zit op de server. Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag. */
.wm .wmrij.oud .wmk{color:var(--ink-3)}
.wm .wmrij.etf.feed .wmvia{border-style:dashed} /* v25.52 (WERELDMARKTEN-3, herstel tegenlezer T-1): de ETF-terugvalrij zonder bekend officieel slot (klasse feed, pil "–", title "laatste handel · het officiële slot is nog niet bekend") — het merkteken gestippeld */
/* v25.52 — WATCHLIST-LETTER (Rabi 8-9 ± 17:05 NL: "kan jij de letter groote van de watchlist veranderen naar de elfde grootte als de werled markten" — 'elfde' = 'zelfde'): de watchlistrij in de lettermaten en -gewichten van de wereldmarktenrij (.wm .wmrij — naam 13,5/700, sub 11/400, koers 13/600 tabular, pil 12/700; ≤ 359 px naam 13) en de rijmaat van die rij (padding 7, min-height 44); dezelfde selectors als WATCHLIST-STRAK (specificiteit 0,6,x), later in het bestand = wint — ook van de 399-px-mediaregels van STRAK (gelijke specificiteit: de plek in het bestand beslist), dus geen eigen 399-blok nodig; kolommen, gaps en max-widths onaangeraakt; ook in de bewerkmodus (Bewerken); het belletje (.kawl) en de politici-chip (.pochip) in de tickerregel erven de tickermaat niet meer (11 px zoals de chip zelf); de Portefeuille-positierij blijft byte-gelijk. Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag. */
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]){padding:7px 0; min-height:44px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft{gap:0}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b, .plist.wsstrak.wabewerk .wlrow .pleft b{font-size:13.5px; font-weight:700; line-height:1.2; letter-spacing:0}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft span, .plist.wsstrak.wabewerk .wlrow .pleft span{font-size:11px; font-weight:400; line-height:1.55}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b .kawl, .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b .pochip{padding-top:1px; padding-bottom:1px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b .kawl b{font-size:inherit; font-family:inherit; letter-spacing:normal; line-height:1}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b .pochip span{font-size:inherit; font-weight:600; line-height:1; letter-spacing:normal}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .psparkbox, .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .spark{height:22px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright{gap:1px}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pright .pprice, .plist.wsstrak.wabewerk .wlrow .pright .pprice{font-size:13px; font-weight:600; line-height:1.25; letter-spacing:0}
.plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pday, .plist.wsstrak.wabewerk .wlrow .pday{font-size:12px; font-weight:700; line-height:1.25}
@media (max-width:359px){ .plist.wsstrak:not(.wabewerk) .wlrow:not([data-nd]) .pleft b, .plist.wsstrak.wabewerk .wlrow .pleft b{font-size:13px} }
/* v25.52 — WATCHLIST-RIJ2 */
/* v25.52 (WATCHLIST-RIJ2, Rabi 8-9 avond: "die bedrijfsnamen. in grijs nog veel kleiner … grafiekje kan langer om de witte stuk te vullen"): alleen de watchlistrij mét klasse wr2 op de lijst (blok v25.52 watchlist-rij2, schakelaar WR2_RIJ_AAN) — naam 11 px gedempt (≤ 399 px 10 px), kolommen [naam fit-content][sparkline 1fr, nooit smaller dan de oude STRAK-maat 56/48/44][koers rechts]; alleen tokens, geen aanwijs-effect, geen voorrangsvlag. */
.plist.wsstrak.wr2:not(.wabewerk) .wlrow:not([data-nd]){grid-template-columns:fit-content(46%) minmax(56px,1fr) minmax(min-content,auto)}
.plist.wsstrak.wr2:not(.wabewerk) .wlrow:not([data-nd]) .pleft span{font-size:11px; font-weight:400; color:var(--ink-3); line-height:1.4}
.plist.wsstrak.wr2:not(.wabewerk) .wlrow:not([data-nd]) .spark{max-width:none}
@media (max-width:480px){ .plist.wsstrak.wr2:not(.wabewerk) .wlrow:not([data-nd]){grid-template-columns:fit-content(40%) minmax(48px,1fr) minmax(min-content,auto)} }
@media (max-width:399px){ .plist.wsstrak.wr2:not(.wabewerk) .wlrow:not([data-nd]){grid-template-columns:fit-content(44%) minmax(44px,1fr) minmax(min-content,auto)} .plist.wsstrak.wr2:not(.wabewerk) .wlrow:not([data-nd]) .pleft span{font-size:10px} }

/* v25.52 — HART-EMOJI (Rabi 8-9 avond: "dubbeltik op een comment of bericht moet direct een hartje worden"): een dubbeltik op een berichtkaart is geen dubbeltik-zoom meer (alleen die ene aanraakactie uit; scrollen en pinch blijven); het grote hart en de screenreader-tekst hergebruiken .bigheart en .srtekst. Alleen deze ene regel, geen tokens nodig, geen id-selector, geen aanwijs-effect, geen voorrangsvlag. */
.post{touch-action:manipulation}
/* v25.52 — WATCHLIST-RIJ3 */
/* v25.52 (WATCHLIST-RIJ3, Rabi 8-9 ± 22:25 UTC bij een screenshot van zijn watchlist: "die namen van bedrijven echt 9 px ofo en de charts een standaard formaat zodat ze schynchroon zijn. dit is te wild"): alleen de watchlistrij mét klasse wr3 op de lijst (blok v25.52 watchlist-rij3, schakelaar WR3_AAN) — de naam 9 px (≥ 560 px 10 px) in --ink-3 met regelhoogte 1,15 en ellipsis, de sparkline in een vaste gridkolom van 96 × 30 (≤ 399 px 72 × 30, ≥ 560 px 120 × 30) zodat élke grafiek op dezelfde x begint en eindigt, de naamkolom de rest, de koerskolom in álle rijen even breed via de variabele --wr3-koers die het blok op de watchlistlijst (wlBody) meet (terugval auto) zodat de sparkline in geen enkele rij verschuift, de koers rechts (de kolom van STRAK/LETTER); dezelfde selectors als RIJ2 plus de klasse wr3 (specificiteit 0,7,x) en later in het bestand = wint; bewerkmodus en data-nd-rijen buiten de staart zoals bij RIJ2; alleen tokens, geen aanwijs-effect, geen voorrangsvlag. */
.plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]){grid-template-columns:minmax(0,1fr) 96px minmax(min-content,var(--wr3-koers,auto))}
.plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .pleft span{font-size:9px; font-weight:400; color:var(--ink-3); letter-spacing:0; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .psparkbox{width:96px; height:30px; min-width:0; display:block}
.plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .spark{display:block; width:96px; max-width:none; height:30px}
@media (max-width:399px){
  .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]){grid-template-columns:minmax(0,1fr) 72px minmax(min-content,var(--wr3-koers,auto))}
  .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .psparkbox, .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .spark{width:72px}
}
@media (min-width:560px){
  .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]){grid-template-columns:minmax(0,1fr) 120px minmax(min-content,var(--wr3-koers,auto))}
  .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .psparkbox, .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .spark{width:120px}
  .plist.wsstrak.wr2.wr3:not(.wabewerk) .wlrow:not([data-nd]) .pleft span{font-size:10px}
}
/* v25.52 — PERSBERICHTEN-TAB (Rabi 8-9 avond: "Maak in beheer een aparte tab voor pers berichten …"): de vierde tab Persberichten op /beheer (blok v25.52 persberichten-tab). De tabkiezer heeft vier knoppen: tot 479 px als 2 × 2 (vier gelijke vakken; "Persberichten" past niet in een kwart van 320–479 px zonder afkappen — de seg-rand blijft, geen h-scroll van de pagina), daarboven één rij zoals vóór; het paneel bpGrid één kolom met de kaart over de volle breedte (breder dan de 640-px-modal, die blijft) en de onderrand zoals Klassiek (.bkgrid); de verwijsregel in de drie oude tabs gedempt. Alleen tokens, geen hex, geen aanwijs-effect, geen voorrangsvlag. */
.bhview .pbtabgrid{grid-template-columns:1fr; padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.bhview .pbtabgrid .bhkaart.pbtab{grid-column:1 / -1; max-width:none; width:100%; box-sizing:border-box}
.bhview .bhkaart .pbtverwijs, .bhview .b3kaart .pbtverwijs{color:var(--ink-3); font-size:12px; margin:0 0 8px}
.bhview .pbtverwijs .bhlink{font-size:inherit; color:var(--accent)}
@media (max-width:479px){ .bhview .bktabs{display:grid; grid-template-columns:1fr 1fr; gap:2px} .bhview .bktabs button{flex:none; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} }
/* v25.52 — DIVIDEND-DEKKING (Rabi 8-9 avond bij een ledenmail over dividend en vaste lasten: "dezee dingen in portefeuille gedeelte bij dividend, liefst uitklapbaar"): het uitklapbare deel .divdekking onderaan de kaart Dividend — kop als knop (44 px), tegels per jaar/maand/week/dag/uur, het invoerformulier (vaste lasten + drie aannames), de dekkingstegels, de prognosegrafiek. Alleen tokens/color-mix, geen id-selector, geen aanwijs-effect, geen voorrangsvlag; 320 px leesbaar (tegels 3 + 2, velden onder elkaar). Eigen klassen — nooit .chartsub/.watisdit (de pf-rust-dichtstand raakt dit deel niet). */
.divdekking{margin:8px 18px 0;border-top:1px solid var(--line)}
.divdekking .ddkop{appearance:none;background:none;border:0;width:100%;margin:0;padding:12px 0 10px;min-height:44px;display:flex;align-items:center;gap:8px;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer;text-align:left}
.divdekking .ddkop:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.divdekking .ddkoptekst{flex:1;min-width:0}
.divdekking .ddchev{flex:none;margin-left:auto;color:var(--ink-3);transition:transform .18s ease}
.divdekking .ddkop[aria-expanded="true"] .ddchev{transform:rotate(180deg)}
.divdekking .ddbody{padding:0 0 12px}
.divdekking .ddbody[hidden]{display:none}
.divdekking .ddtegels{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.divdekking .ddtegel{background:color-mix(in srgb, var(--ink) 5%, transparent);border-radius:10px;padding:8px 6px;min-width:0;text-align:center}
.divdekking .ddtegel b{display:block;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.divdekking .ddtegel span{display:block;font-size:10.5px;color:var(--ink-3);margin-top:2px}
.divdekking .ddnoot,.divdekking .ddleeg,.divdekking .ddzin,.divdekking .ddvoorbehoud{font-size:11.5px;line-height:1.45;color:var(--ink-3);margin:8px 0 0}
.divdekking .ddzin{color:var(--ink-2)}
.divdekking .ddvoorbehoud{font-style:italic}
.divdekking .ddform{margin:12px 0 0;padding:10px 12px 12px;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;gap:8px}
.divdekking .ddformkop{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.divdekking .ddveld{display:flex;flex-direction:column;gap:3px;min-width:0}
.divdekking .ddveld span{font-size:12px;font-weight:600;color:var(--ink-2)}
.divdekking .ddveld input{appearance:none;width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card, transparent);color:var(--ink);font-variant-numeric:tabular-nums}
.divdekking .ddveld input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.divdekking .ddveld small{font-size:10.5px;color:var(--ink-3)}
.divdekking .ddaannames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.divdekking .ddknoppen{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.divdekking .ddopslaan{min-height:40px;padding:0 16px}
.divdekking .ddstatus{font-size:11.5px;color:var(--ink-3)}
.divdekking .dddekking{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.divdekking .dddektegel{border-radius:12px;padding:10px 12px;background:color-mix(in srgb, var(--accent) 9%, transparent);min-width:0}
.divdekking .dddektegel b{display:block;font-size:20px;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--ink)}
.divdekking .dddektegel span{display:block;font-size:11px;color:var(--ink-3);margin-top:2px}
.divdekking .ddfiretekst{margin:12px 0 0;font-size:13.5px;line-height:1.4;color:var(--ink)}
.divdekking .ddgrafiek{margin-top:8px}
.divdekking .ddgrafiek svg{display:block;width:100%;height:auto}
@media (max-width:479px){ .divdekking .ddaannames{grid-template-columns:1fr} }
@media (max-width:399px){ .divdekking .ddtegels{grid-template-columns:repeat(3,minmax(0,1fr))} .divdekking .ddtegel b{font-size:12px} .divdekking .dddektegel b{font-size:18px} }
@media (prefers-reduced-motion:reduce){ .divdekking .ddchev{transition:none} }
/* v25.52 — KOPPELING-FIX (Rabi 9-9 ± 00:10 UTC, screenshot /beheer: de app-tabbalk en het kanaal-ledenpaneel "Kanaal — Leden | Vastgepind —
   Ledenlijst laden…" stonden over de grafiek heen). /beheer is het beheerdersscherm: zolang het hoofdscherm (main.screen) data-view="beheer" draagt zijn de
   ledentabbalk en de (nooit geopende, alleen buiten beeld geparkeerde) ledensheet weg — op elk ander scherm byte-gelijk. Het BEHEER3-besluit
   B3-2 ('de balk blijft') is hiermee omgekeerd op Rabi's screenshot; terugweg = deze twee regels weghalen. Alleen klassen en de ~-combinator (latere broers): de balk
   en de sheets staan ná het hoofdscherm in body (nav.tabbar, .drawer = de geparkeerde sheets; een geopende sheet .on blijft). */
main.screen[data-view="beheer"]:not([hidden]) ~ nav.tabbar{display:none}
main.screen[data-view="beheer"]:not([hidden]) ~ .drawer:not(.on){display:none}
/* v25.52 — PERSBERICHTEN-TAB-P1 (Rabi 8-9: "…niet alleen link te plaatsen maar ook gewoon text die kan worden omgezet naar artikel"): de schakel Link · Tekst en het tekstvak (tekst, teller, titel, soort) in het aandraagveld van de kaart Persberichten (blok v25.52 persberichten-tab-p1). Alleen tokens, geen hex, geen id-selector, geen aanwijs-effect, geen voorrangsvlag. */
.bhview .pbaandraag .pbp1schakel{flex:none; margin-right:2px}
.bhview .pbaandraag .pbp1schakel button{min-height:36px; padding:0 12px}
.bhview .pbaandraag .pbp1tekst{flex:1 1 100%; display:flex; flex-direction:column; gap:6px; min-width:0}
.bhview .pbaandraag .pbp1tekst textarea{width:100%; min-height:9.5em; box-sizing:border-box; resize:vertical; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--input-bg); color:var(--ink); font:inherit; font-size:14px; line-height:1.45}
.bhview .pbaandraag .pbp1tekst textarea:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.bhview .pbaandraag .pbp1tekst input[type=text]{flex:none; width:100%; box-sizing:border-box}
.bhview .pbaandraag .pbp1tekst select{width:100%; min-height:40px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:var(--input-bg); color:var(--ink); font:inherit; font-size:14px}
.bhview .pbaandraag .pbp1teller{font-size:12px; font-variant-numeric:tabular-nums; margin-top:-2px}
/* v25.52 — PERSBERICHTEN-WERKBLAD (Rabi 8-9: "…een proffeiosnele publishing gedeelte met precies de juiste tools…"): het werkblad in de tab Persberichten (blok v25.52 persberichten-werkblad) — twee kolommen vanaf 960 px (tekst links, publicatiekaartje rechts en sticky), eronder gestapeld; 320 px één kolom zonder h-scroll. Alleen tokens. */
.bhview .pbwerkblad{display:grid; gap:16px; margin:0 0 14px; min-width:0}
.bhview .pbwerkblad>*{min-width:0}
.bhview .pbwkop{grid-column:1 / -1; display:flex; flex-direction:column; gap:6px; align-items:flex-start}
.bhview .pbwkop .pbwtitel{font-size:18px; line-height:1.25; margin:0}
.bhview .pbwkop .pbwtitel.let{color:var(--bad-text)}
.bhview .pbwseg{margin:0 0 10px; width:fit-content}
.bhview .pbwseg button{min-height:34px; padding:0 12px}
.bhview .pbwlinks .pbwlezer{padding:0}
.bhview .pbwvlaggen{list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:4px; font-size:12px}
.bhview .pbwvlaggen li{display:flex; justify-content:space-between; gap:8px; padding:6px 10px; border:1px solid var(--line); border-radius:10px}
.bhview .pbwvlaggen li.let{border-color:var(--bad-text)}
.bhview .pbwform .pbwtel{font-size:11px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.bhview .pbwform .pbwtel.let{color:var(--bad-text)}
.bhview .pbwform .pbwfout{outline:2px solid var(--bad-text); outline-offset:1px}
.bhview .pbwcijferblok{margin-top:10px; display:flex; flex-direction:column; gap:8px}
.bhview .pbwcijfers{border:1px solid var(--line); border-radius:12px; padding:8px 10px; overflow-x:auto}
.bhview .pbwcijfertabel{width:100%; border-collapse:collapse; font-size:12px; font-variant-numeric:tabular-nums}
.bhview .pbwcijfertabel th{text-align:left; font-weight:600; color:var(--ink-3); padding:2px 4px}
.bhview .pbwcijfertabel td{padding:2px 4px}
.bhview .pbwcijfertabel input{width:100%; min-width:5em; box-sizing:border-box; font:inherit; font-size:12px; padding:5px 8px; border:1px solid var(--line-2); border-radius:8px; background:var(--input-bg); color:var(--ink)}
.bhview .pbwkaartje{display:flex; flex-direction:column; gap:10px; align-self:start}
.bhview .pbwvak{border:1px solid var(--line); border-radius:12px; padding:10px 12px; display:flex; flex-direction:column; gap:6px; font-size:12.5px}
.bhview .pbwkeuze{display:flex; gap:8px; align-items:flex-start}
.bhview .pbwkeuze i{display:block; font-style:normal; font-size:11px}
.bhview .pbwkeuze.uit{color:var(--ink-3)}
.bhview .pbwchecklist{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px}
.bhview .pbwchecklist li{display:flex; align-items:center; gap:6px}
.bhview .pbwchecklist li .pbwico{width:16px; height:16px; flex:none; display:inline-block; color:var(--bad-text)}
.bhview .pbwchecklist li[data-ok="1"] .pbwico{color:var(--good-text)}
.bhview .pbwchecklist .bhlink{margin-left:auto; font-size:inherit; color:var(--accent)}
.bhview .pbwlijst .pbwlijstknop{font-size:12.5px; font-weight:600; color:var(--accent); padding:6px 0}
@media (min-width:960px){ .bhview .pbwerkblad{grid-template-columns:minmax(0,1fr) 320px} .bhview .pbwkaartje{position:sticky; top:12px} }
@media (max-width:359px){ .bhview .pbwseg button{padding:0 8px; font-size:12px} .bhview .pbwcijfertabel input{min-width:4em} }
@media (prefers-reduced-motion:reduce){ .bhview .pbwerkblad *{scroll-behavior:auto} }
/* v25.52 — PERSBERICHTEN-BEWERK-BREED */
/* v25.52 (PERSBERICHTEN-BEWERK-BREED): de drie extra velden erven de formulierstijl (.pbform/.pbveld); alleen de rij met cover-keuzes en de vervalregel in het kaartje */
.bhview .pbbcoverrij{display:flex; flex-wrap:wrap; gap:6px 14px; padding:4px 0}
.bhview .pbbcover{display:inline-flex; align-items:center; gap:5px; font-size:13px; color:var(--ink-2)}
.bhview .pbbcover input{margin:0}
.bhview .pbbscorehulp{margin:2px 0 8px}
.bhview .pbbverval p{margin:4px 0 0}
/* v25.52 — PERSBERICHTEN-PLANNEN */
/* v25.52 (PERSBERICHTEN-PLANNEN): chip Gepland + het vak Wanneer (tokens) */
.pbstatus.pbgepland{border-color:var(--accent-lijn); color:var(--accent); margin-left:4px}
.bhview .pbpplan{margin:4px 0 0 24px}
.bhview .pbpplan input{width:100%; max-width:100%; min-width:0; box-sizing:border-box; font:inherit; padding:6px 8px; border:1px solid var(--line-2); border-radius:8px; background:var(--card); color:var(--ink)}
.bhview .pbpgepland{margin:4px 0 0; display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; font-size:13px; color:var(--ink-2)}
.bhview .pbpmislukt{margin:4px 0 0; color:var(--bad-text)}
/* v25.52 — IDENTITEIT-BADGE (Rabi 9-9: "Mensen mogen maar 1 badge hebben … zelf gekozen badges zoals 'Value belegger' … kunnen e zelf tussen kiezen op hun profiel of portefeuille gedeelte"):
   het identiteitschipje (.lidbadge.ibident: dezelfde vorm/hoogte als het klasse-chipje, lijn-icoon ervoor), het chipje op de kaart Beste beleggers, het
   keuzekaartje ibSheet (id-kaartje; drawer/sheet/bmenuvlak-patroon van Instellingen en LANDWISSEL, knoppen ≥ 56 px), de kaart "Jouw badge" op het eigen profiel en de
   knop "Badge kiezen ›" op de kaart Jouw badge in de community. Alleen tokens/color-mix, geen hex, geen id-selector, geen aanwijs-effect, geen voorrangsvlag. */
.lidbadge.ibident{background:color-mix(in srgb, var(--accent) 10%, transparent); color:var(--ink); border:1px solid color-mix(in srgb, var(--accent) 24%, transparent); gap:4px}
.lidbadge.ibident .ibico{width:12px; height:12px; flex:none; display:inline-block; color:var(--accent)}
.lidbadge.ibident .ibnaam{font:600 9.5px "IBM Plex Sans",sans-serif; font-style:normal; color:var(--ink)}
.od-klasse.ibodident{display:inline-flex; align-items:center; gap:4px}
.od-klasse.ibodident .ibico{width:11px; height:11px; flex:none}
.ibsheet{padding:10px 16px calc(16px + env(safe-area-inset-bottom))}
.ibsheet .pluskop{padding-left:0; padding-right:0}
.ibvraag{display:block; font-family:"Archivo",sans-serif; font-size:17px; line-height:1.3; margin-top:4px}
.ibuitleg{margin:6px 0 12px; color:var(--ink-2); font-size:13.5px; line-height:1.45}
.ibkeuzes{display:grid; gap:8px; max-height:min(58vh, 520px); overflow:auto; padding:2px}
.ibkeuze{appearance:none; display:flex; align-items:center; gap:12px; width:100%; min-height:56px; padding:10px 14px; border-radius:14px; border:1.5px solid var(--line-2); background:var(--card-2); color:var(--ink); font:inherit; text-align:left; cursor:pointer}
.ibkeuze.on{border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); background:color-mix(in srgb, var(--accent) 10%, var(--card-2))}
.ibkeuze .ibkico{flex:none; display:inline-flex; width:32px; height:32px; align-items:center; justify-content:center; border-radius:10px; background:color-mix(in srgb, var(--accent) 12%, transparent); color:var(--accent)}
.ibkeuze .ibkico .ibico{width:18px; height:18px}
.ibkeuze .ibtekst{display:flex; flex-direction:column; min-width:0; flex:1}
.ibkeuze .ibnaam{font-weight:600; font-size:15px}
.ibkeuze .ibsub{color:var(--ink-3); font-size:12.5px; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ibkeuze .ibnu{flex:none; font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--accent)}
.ibstandaard{display:block; margin:12px 0 0; padding:8px 0; font-size:13.5px; color:var(--accent)}
.ibsheet .plusannuleer{width:100%; margin:14px 0 0}
.badgecard .ibkies{display:block; margin:6px 0 0; padding:8px 0; font-size:13.5px; color:var(--accent); min-height:44px}
.ibkaart .ibhuidig{margin:0 0 10px; font-size:13.5px; color:var(--ink-2); line-height:1.45}
.ibkaart .ibhuidig b{color:var(--ink)}
.ibkaart .lpknop.ibkies{min-height:44px}
@media (min-width:560px){ .ibkeuzes{grid-template-columns:1fr 1fr} }
/* v25.52 — KOERS-SNEL (P2 LIVE-TIK; spec koers-snel §4.4): het label "bijgewerkt hh:mm:ss · N min vertraagd" (of "slotkoers hh:mm") met de teller "12 s geleden" in de kop van Portefeuille (in .lbl, naast de stip van PORTEFEUILLE-RUST; de stempel van LIVE-ALLES gaat dan uit beeld), onder de watchlist (de houder ksWl) en in de koerskop van de bedrijfspagina; status 'verouderd' gedempt met een uitleg-title (per rij op de koerscel en op het label). Alles pas aanwezig mét de vlag koers_snel (het blok v25.52 koers-snel zet de knopen); zonder vlag raakt geen enkele regel hier iets. Oplichten = de bestaande tikflits-klassen (v25.43). Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji. */
.kslabel, .ksteller{font-size:10.5px; font-weight:500; letter-spacing:0; text-transform:none; color:var(--ink-3); white-space:nowrap}
.ksteller{font-variant-numeric:tabular-nums}
.hero .lbl .kslabel, .hero .lbl .ksteller{margin-left:8px}
.hero .lbl.ksaan .lastempel{display:none}
.ksbalk{display:flex; flex-wrap:wrap; align-items:center; gap:2px 8px; padding:4px 18px 8px; min-width:0}
.ksbalk.kstk{padding:2px 0 0}
.ksbalk:empty{display:none}
.kslabel.ksoud, .pprice.ksoud, .tkbig .ksoud{opacity:.6; cursor:help}
@media (prefers-reduced-motion: reduce){ .kslabel.tikflits, .ksteller.tikflits{transition:none; animation:none} }
@media (max-width:359px){ .ksbalk{padding-left:12px; padding-right:12px} .kslabel, .ksteller{font-size:10px} }
/* P3b, v25.52 (KOERS-SNEL) — intraday-grafiekjes: de dag-grafiek (1-minuutsbalken) in .psparkbox van de positie- en watchlistrij, met het label "8-9 · 20 min vertraagd" op de grafiek zelf; er beweegt niets (geen overgang, geen animatie — reduced-motion-veilig), alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag. */
.ksispark{position:relative; display:block; min-width:0}
.ksispark .ksspark{display:block}
.kssparklbl{position:absolute; left:2px; bottom:0; max-width:calc(100% - 4px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-style:normal; font-size:7.5px; line-height:1; font-weight:500; color:var(--ink-3); pointer-events:none}
.kssparklbl.ksoud{opacity:.6}
.ksspark, .ksspark polyline, .ksspark polygon, .ksspark line{transition:none; animation:none}
@media (max-width:380px){ .kssparklbl{font-size:7px} }
/* v25.52 — DIVIDEND-TAB: pagina, doorlink en deelkaart (tokens; geen id/aanwijs-effect/voorrangsvlag) — v25.52 (DIVIDEND-STRAK): compact herschreven, de rest in de staart hierna */
main.screen[data-view="dividend"]>:is(.tape,.newsbar,.apphead,.topnav,.testbar,.hintbar,section.card){display:none}.dtview .dtbody{display:flex;flex-direction:column;gap:12px}
.dtdeelknop,.dtexport{display:inline-flex;align-items:center;gap:7px}.dthero{padding:18px 18px 16px}
.dthero .eyebrow,.dtgrootlbl{display:block}
.dtgroot{display:block;font:800 38px/1.05 "Archivo",sans-serif;letter-spacing:-.02em;margin:10px 0 2px;font-variant-numeric:tabular-nums}
.dtgrootlbl{font-size:13px;color:var(--ink-2)}.dtchart{padding:4px 12px 0}
.dtchart svg{width:100%;height:auto;display:block}.dtmaand{cursor:pointer}
.dtmaandlijst,.dtpos,.dtkomt .dtrij,.dttopvlak,.dtdeelknoppen{margin:0 18px}.dtnoot,.dtleegregel,.dtvoorbehoud{margin:8px 18px 0;line-height:1.45}
.dtnoot,.dtleegregel,.dtrijdatum,.dttoprij small{font-size:12px;color:var(--ink-3)}.dtmaandkop{display:flex;justify-content:space-between;font-size:13px;padding:8px 0 4px}
.dtrij{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px}
.dtrijdatum{flex:none;width:72px;font-variant-numeric:tabular-nums;white-space:nowrap}
.dtrijnaam,.dtposnaam,.dttoprij span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dtrij small,.dtposnaam small,.dtposjaar small{font-size:11px;color:var(--ink-3);font-weight:400}.dtrij b,.dtposjaar,.dtposklap b{font-variant-numeric:tabular-nums;white-space:nowrap}
.dtaf{color:var(--bad-text)}
.dtlink,.dtdoorlink{display:flex;align-items:center;gap:8px;width:calc(100% - 36px);margin:10px 18px 0;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--accent);font:600 13px "Archivo",sans-serif;text-decoration:none;cursor:pointer;min-height:44px}.dtlink span,.dtdoorlink span{flex:1;text-align:left}
.dtdoorlink{margin:0 18px 6px}.dtpos{border-top:1px solid var(--line)}
.dtposkop{width:100%;padding:10px 0;background:none;border:0;color:var(--ink);font:inherit;font-size:13.5px;text-align:left;cursor:pointer;min-height:44px}.dtposnaam{font-weight:600}
.dtpos.open .dtposkop .dtico{transform:rotate(180deg)}.dtposklap b{color:var(--ink)}
.dttopvlak{display:flex;align-items:center;gap:16px}.dtdonut{width:120px;height:120px;flex:none}
.dttoplegenda{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}.dttoprij{display:grid;grid-template-columns:10px 1fr auto auto;gap:8px;align-items:center;font-size:12.5px}
.dttoprij i{width:10px;height:10px;border-radius:50%}.dtleeg{text-align:center;padding:28px 18px}
.dtleegicoon .dtico{width:36px;height:36px}.dtleeg b{display:block;margin:10px 0 6px;font-size:17px}
.dtleeg p{color:var(--ink-2);font-size:13.5px}.dtleegknoppen{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:16px}
@media (max-width:359px){.dtgroot{font-size:32px}}@media (min-width:760px){main.screen[data-view="dividend"]{max-width:1080px}.dtview .dtbody{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.dthero,.dtmaanden,.dtposities,.dtvoorbehoud{grid-column:1/-1}}
/* v25.52 — DIVIDEND-STRAK */
/* Rabi 9-9 "strakker en mooier … instagrammable": tegels, grafieken, positierijen, deelkaart, schakelrij. Tokens/color-mix; geen id-selector, aanwijs-effect of voorrangsvlag. */
.dthero .eyebrow{font-size:11px}
.dttegels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.dttegel{background:color-mix(in srgb,var(--ink) 5%,transparent);border:1px solid var(--line);border-radius:14px;padding:11px 12px 10px;display:flex;flex-direction:column;gap:3px;min-width:0}
.dttegel b{font:800 20px/1.15 "Archivo",sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dttegel b i{font-style:normal;font-weight:600;font-size:.8em;opacity:.65}
.dttegel span{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dttegel.op b{color:var(--good-text)}
.dttegel.af b{color:var(--bad-text)}
.dtdeelknop{min-height:38px;padding:0 14px;font-weight:700}
.dtlegenda{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 18px 0;font-size:11.5px;color:var(--ink-3)}
.dtlegenda span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.dtmaand .dtbar{opacity:.85}
.dtmaand.aan .dtbar{opacity:1}
.dtmaand.aan .dtkol{fill:color-mix(in srgb,var(--ink) 6%,transparent)}
.dtmaand.aan .dtmnd{font-weight:700;fill:var(--ink)}
.dtsmal .dtmaand:not(.aan) .dtval{display:none}
.dtposkop{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;gap:10px;align-items:center}
.dtposlinks{min-width:0;display:flex;flex-direction:column;gap:2px}
.dtposmeta{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dtposfreq.leeg{display:none}
.dtsep{font-style:normal;margin:0 5px}
.dtposjaar{font:700 14px/1 "Archivo",sans-serif;text-align:right}
.dtposklap{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px 14px;padding:2px 0 12px;font-size:12px;color:var(--ink-3)}
.dtposklap>span{display:flex;flex-direction:column;gap:1px;min-width:0}
.dtposklap>span b{font-size:14px}
.dtposklap .linkbtn{grid-column:1/-1;display:inline-flex;align-items:center;min-height:44px;padding:0;color:var(--accent);font-weight:600;font-size:13px}
.dtdeelkaart{max-width:340px;margin:0 auto;border-radius:24px;padding:20px;color:var(--merk-op-blauw);background:linear-gradient(170deg,var(--merk-blauw-donker),var(--merk-blauw) 55%,var(--merk-licht));display:flex;flex-direction:column;gap:5px;overflow:hidden}
.dtdeelkop{display:flex;align-items:center;gap:8px}
.dtdeellogo{position:relative;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;flex:none;overflow:hidden;background:var(--merk-op-blauw)}
.dtdeellogo i{font:800 11px/1 "Archivo",sans-serif;font-style:normal;color:var(--merk-blauw)}.dtdeellogo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dtdeelmerk{font:700 13px "Archivo",sans-serif}
.dtdeeleyebrow{display:block;margin-top:12px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.dtdeelgroot{display:block;font:800 40px/1.05 "Archivo",sans-serif;letter-spacing:-.02em;margin:2px 0;font-variant-numeric:tabular-nums}
.dtdeelsub{display:block;font-size:12.5px;opacity:.85}
.dtdeeltegels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:12px}
.dtdeeltegels>div{display:flex;flex-direction:column;background:color-mix(in srgb,var(--merk-op-blauw) 14%,transparent);border-radius:12px;padding:8px 9px;min-width:0}
.dtdeeltegels b{font:800 15px/1.2 "Archivo",sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dtdeeltegels span{font-size:11px;line-height:1.15;opacity:.8;hyphens:manual}
.dtdeelminilbl{display:block;margin-top:12px;font-size:11px;opacity:.8}
.dtdeelmini{display:flex;align-items:flex-end;gap:3px;height:36px;margin-top:4px}
.dtdeelmini i{flex:1;min-height:3px;border-radius:3px 3px 1px 1px;background:color-mix(in srgb,var(--merk-op-blauw) 45%,transparent)}
.dtdeelmini i.aan{background:var(--merk-op-blauw)}
.dtdeeltop{display:flex;flex-direction:column;gap:7px;margin:14px 0 auto;font-size:12.5px}
.dtdeeltop>span{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:5px 8px;align-items:center}
.dtdeeltop>span>i{font-style:normal;font-size:11px;font-weight:700;opacity:.8}
.dtdeeltop>span>em{font-style:normal;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dtdeelbalk{grid-column:2/-1;height:4px;border-radius:2px;background:color-mix(in srgb,var(--merk-op-blauw) 22%,transparent)}
.dtdeelbalk>span{display:block;height:100%;border-radius:2px;background:var(--merk-op-blauw);opacity:.9}
.dtdeelnoot{font-size:11px;opacity:.7;margin-top:12px}.dtdeelvoet{font-size:11.5px;opacity:.9;margin-top:5px}
.dtdeelknoppen{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.dtschakel{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1 1 auto;min-height:44px;margin:0;padding:0 4px;font-size:13.5px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer}
.dtschakel span{white-space:nowrap}
.dtsw{appearance:none;flex:none;width:44px;height:26px;margin:0;border-radius:13px;border:0;background:var(--line-2);position:relative;cursor:pointer}
.dtsw::before{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--merk-op-blauw);box-shadow:0 1px 3px color-mix(in srgb,var(--merk-navy) 35%,transparent);transition:left .15s}
.dtsw:checked{background:var(--accent)}
.dtsw:checked::before{left:21px}
.dtsw:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.dtexport{justify-content:center;width:100%;white-space:nowrap}.dtkomtrijen{margin:0 18px}.dtkomt .dtrij{margin:0}
.dtvoorbehoud{font-size:11.5px;margin-top:4px}
/* herstel tegenlezer: T-1 Komt eraan volle breedte + 2 kolommen, T-7 monogram onder het beeldmerk, T-8 lang label mag afbreken, T-9 noot in de preview, T-10 reduced-motion + knop op één regel */
@media (prefers-reduced-motion:reduce){.dtsw::before{transition:none}}
@media (max-width:359px){.dttopvlak{flex-direction:column;align-items:stretch}.dtdonut{margin:0 auto}.dtdeelgroot{font-size:34px}.dttegels{gap:6px}.dttegel{padding:10px 10px 9px}.dttegel span{font-size:11px}.dtexport{font-size:14px;padding-left:10px;padding-right:10px}}
@media (min-width:560px){.dttegels{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:760px){.dttegels{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.dtdeelknoppen{flex-direction:row;align-items:center;justify-content:space-between}.dtexport{width:auto;flex:none}.dtkomt{grid-column:1/-1}.dtkomtrijen{columns:2;column-gap:36px}.dtkomt .dtrij{break-inside:avoid}}
/* v25.52 — IMPORT-AANNAMES: de uitklap "Zo hebben we je bestand gelezen (N punten)" onder de importbalk en als tweede uitklap in Transacties (blok v25.52 import-aannames; ingespoten, index.html byte-gelijk). Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji. */
/* v25.52 (IMPORT-AANNAMES): alleen tokens, geen id/aanwijs-effect/voorrangsvlag; de hele staart hoort bij dit pakket */
.importbanner details.gelezen{margin-top:10px;font-size:13.5px;color:var(--ink-2)}
.importbanner details.gelezen summary,.gbafw.gelezen summary{cursor:pointer;font-weight:600;color:var(--ink)}
.gelezenlijst{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:13px;line-height:1.4;color:var(--ink-2);max-width:72ch} /* v25.52 (IMPORT-AANNAMES, herstel tegenlezer T-7): max-width 72ch — op 1280 px liepen de regels over de volle kaartbreedte */
.gelezenlijst li{overflow-wrap:anywhere}
.gbafw.gelezen .gelezenlijst{max-height:320px;overflow:auto}
/* v25.52 — SUPPORT9 (artikelwidgets, A4, melding 98): een ingebedde widget (.artdb, gebouwd door art47EmbedHtml) kreeg de tekstkleur van de app
   geërfd — zijn eigen body-kleurregel valt in de scoping weg — terwijl zijn tokens (:root → de wrapper) wél mee reizen: in het donkere thema
   stond de lichte app-inkt op de crème widgetkaart (gemeten 1,11 : 1). De wrapper krijgt nu var(--ink) — binnen een widget die --ink zelf
   definieert is dat zíjn inkt, anders de app-inkt (byte-gelijk gedrag). Alleen de gewone widget; de huisstijlkaart (.artdb-db .db, vertaald
   via ART47_KLEUR) blijft ongemoeid. De lezer-regels zelf (h1–h4, de p- en a-regels van de artikelbody) zijn mid-file met :not(.artdb *) buiten de widget gezet —
   een staart met een hogere specificiteit zou de eigen kleuren van de widget (bijv. de lead-alinea) overschrijven; gemeten: 1,03 : 1.
   Alleen tokens, geen id, geen aanwijs-effect, geen voorrangsvlag, geen emoji. */
.artdb:not(.artdb-db){color:var(--ink)}
/* v25.52 — WENSEN-A: (3) cash per valuta — de Cash-rij (CASHWEGING) als klaprij mét per pot één regel, ÍN de rij (grid-column 1/-1, de rij blijft het laatste kind); (1) het beurstaks-veld gebruikt de bestaande .txveld/.paveld. Alleen tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji. */
/* v25.52 (WENSEN-A): de staart van dit pakket — elke regel hieronder hoort bij WENSEN-A (de bundel-annotatie voor de generieke pins) */
.plist .cashrow.wnaklap{cursor:pointer}
.plist .cashrow.wnaklap:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:10px}
.plist .cashrow.wnaklap .pday::after{content:" \25BE";color:var(--ink-3)}
.plist .cashrow[aria-expanded="true"] .pday::after{content:" \25B4"}
.plist .cashrow .wnacashdetail{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 16px;padding:9px 12px;margin:6px 0 2px;background:var(--stat-bg);border:1px solid var(--line);border-radius:10px;font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums;cursor:default}
.plist .cashrow .wnacashdetail[hidden]{display:none}
.plist .cashrow .wnacashdetail b{color:var(--ink);font-weight:600}
.plist .cashrow .wnacashdetail .wnasom{flex-basis:100%;color:var(--ink-3)}
.plist .cashrow .wnacashdetail .wnasom:first-child{font-weight:600;color:var(--ink-2)}
/* v25.52 — WENSEN-B (melding 113 "Wist je dat" op de bedrijfspagina; melding 115 de keuzes netto/ontvangen/inflatie in "Dividend en je vaste lasten") — v25.52 (WENSEN-B): tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji; de meldingen hier als nummer (fb2-geldstroom E5 scant de hele staart op ledenlabels), de pakketannotatie voor de bundel-pins (identiteit-badge A7 / PUB_ANN) */
.tkposline .wnbwist{display:flex;flex-direction:column;gap:2px;margin:8px 0 2px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb, var(--accent) 9%, transparent)}
.tkposline .wnbwistkop{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.tkposline .wnbwisttekst{font-size:13.5px;font-weight:700;line-height:1.35;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tkposline .wnbwistnoot{font-size:11px;line-height:1.4;color:var(--ink-3)}
.divdekking .wnbkeuzes{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}
.divdekking .wnbgroep{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:2px;gap:2px}
.divdekking .wnbkeuze{appearance:none;border:0;background:none;font:inherit;font-size:12px;font-weight:600;color:var(--ink-3);padding:6px 11px;min-height:32px;border-radius:999px;cursor:pointer}
.divdekking .wnbkeuze.on{color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--card));box-shadow:inset 0 0 0 1px var(--accent)} /* v25.52 (WENSEN-B): de gekozen knop als accent-wash mét accentrand, zoals .ibkeuze.on en de NABEURS-DATA-knop — zonder het tekst-op-accent-token (de nabeurs-data-pin scant de staart tot het bestandseinde op die naam) */
.divdekking .wnbkeuze:disabled{opacity:.45;cursor:default}
.divdekking .wnbkeuze:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.divdekking .wnbnoot{font-size:11px;color:var(--ink-3);flex-basis:100%}
.divdekking .wnbinflatie{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
@media (min-width:560px){.divdekking .wnbinflatie{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (prefers-reduced-motion:no-preference){.tkposline .wnbwist{transition:background .18s ease}}
/* v25.52 — PRESTATIE-METHODES (Rabi 10-9: "als er verschillende methodes zijn is het handig als we beide tonen en dat zij kunnen kiezen") — het segment
   Tijdgewogen · Geldgewogen · Eenvoudig op de kaart Prestatie en het prestatiescherm, de uitlegregel per stand (valt in de dichtstand van pf-rust achter
   Uitleg zoals elke .chartsub), de gedempte Dode belegger bij een geldgewogen/eenvoudige stand. Alleen tokens; geen aanwijs-effecten; korte labels ≤ 359 px. */
.pmtseg{margin-left:6px}
.pmtseg button{gap:0}
.pmtseg button:disabled{opacity:.45;cursor:default}
.pmtseg .pmtkort{display:none}
@media (max-width:359px){.pmtseg .pmtlang{display:none}.pmtseg .pmtkort{display:inline}}
.pmtsegrijmodal{display:flex;justify-content:flex-start;padding:0 18px;margin-top:6px}
.pmtsegrijmodal[hidden]{display:none}
.pmtsegrijmodal .pmtseg{margin-left:0}
.chartsub.pmtuitleg{margin:6px 18px 0;color:var(--ink-2)}
.prestseg button.pmtdemp{opacity:.35}
.serieslegend .sl.pmtchip{color:var(--ink-3);font-weight:500}
.serieslegend .pnlijn.pmtlijn .pnstat b{font-variant-numeric:tabular-nums}
.pnkpi .pmtsub{font-weight:600;color:var(--ink-2)}
.tooltip .tt-w.pmttt{color:var(--ink-2)}
/* v25.52 — GROOTBOEK-BEWERKEN (Rabi 10-9 "de grootboek kunnen wijzigen … volledige controle"): de knop Bewerken naast Toevoegen op Transacties, de actieknopjes per regel in de bewerkmodus, de labels "door jou aangepast"/"door jou weggehaald" en de kopregel. Alleen tokens; de bestaande .txregel-regels byte-gelijk — de vierde kolom komt alleen in de bewerkmodus (klasse gbbewerk op de lijst). */
.viewhead .gbknop{flex:none;margin:0;padding:9px 12px;border-radius:999px;font-size:13px;box-shadow:none;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.viewhead .gbknop .gbico{width:16px;height:16px}
@media (max-width:479px){.viewhead .gbknop{width:38px;height:38px;min-height:38px;padding:0;justify-content:center}.viewhead .gbknop .gbknoptekst{display:none}.viewhead .gbknop .gbico{width:18px;height:18px}.viewhead.gbmetknop .viewsub{display:none}.viewhead.gbmetknop .viewkop{font-size:18px}}
.gbknop.on{color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.gbbewerk .txregel{grid-template-columns:auto minmax(0,1fr) auto auto}
.gbacties{display:inline-flex;gap:4px;align-self:center;margin-left:6px}
.gbknopje{width:32px;height:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:9px}
.gbknopje .gbico{width:16px;height:16px;display:block}
.gblabel{display:inline-block;font-size:11px;font-weight:600;color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--card));border-radius:999px;padding:1px 7px;margin-left:6px;vertical-align:middle}
.gbweglabel{color:var(--ink-3);background:color-mix(in srgb, var(--ink-3) 14%, var(--card))}
.gbwas{display:block;font-size:11px;color:var(--ink-3);font-style:normal}
.txregel.gbweg .txmid b,.txregel.gbweg .txtype,.txregel.gbweg .txbedrag{opacity:.5;text-decoration:line-through}
.gbterug,.gbwissen,.gbnieuw{font-size:12px;min-height:32px}
.gbnieuw{display:block;margin:4px 0 2px;padding:0 4px}
.gbkop{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 12px;font-size:12.5px;color:var(--ink-2);padding:6px 4px 10px}
.gbnvt{margin:8px 2px 0}
@media (max-width:479px){.gbbewerk .txregel{grid-template-columns:auto minmax(0,1fr) auto}.gbbewerk .txregel .gbacties{grid-column:1 / -1;justify-content:flex-end;margin:2px 0 0}}
/* v25.52 — STILZITTEN (Rabi 10-9: de nudge "Je bezit dit aandeel" + de kaart Jij vs stilzitten op de bedrijfspagina; melding 116: transacties op de koersgrafiek en 'koop je in de dip?') — v25.52 (STILZITTEN): tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji; de melding hier als nummer */
.tkposline .szkaart{flex-basis:100%;display:flex;flex-direction:column;gap:0;margin:6px 0 2px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
.tkposline .sznudge{appearance:none;border:0;background:color-mix(in srgb, var(--accent) 9%, transparent);color:var(--ink);font:inherit;text-align:left;display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:10px 12px;cursor:pointer}
.tkposline .sznudge:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tkposline .sznudge .szico{flex:none;color:var(--accent)}
.tkposline .sznudgetekst{flex:1 1 auto;font-size:13px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.tkposline .sznudgechev{flex:none;color:var(--ink-3);display:inline-flex;transition:transform .18s ease}
.tkposline .sznudge[aria-expanded="true"] .sznudgechev{transform:rotate(180deg)}
.tkposline .szbody{display:flex;flex-direction:column;gap:10px;padding:12px}
.tkposline .sztegels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tkposline .sztegel{display:flex;flex-direction:column;gap:2px;padding:10px 10px 8px;border-radius:12px;background:color-mix(in srgb, var(--ink) 5%, transparent);min-width:0}
.tkposline .sztegel span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tkposline .sztegel b{font-size:17px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--ink);overflow-wrap:anywhere}
.tkposline .sztegel b.up{color:var(--good-text)}
.tkposline .sztegel b.down{color:var(--bad-text)}
.tkposline .sztegel small{font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.tkposline .sznoot{margin:0;font-size:11px;line-height:1.45;color:var(--ink-3)}
.tkposline .szgrafiek{margin:0;padding:0;overflow:hidden}
.tkposline .szsvg{display:block;max-width:100%;height:auto;font-size:11px}
.tkposline .szsvg .szgrid{stroke:var(--line);stroke-width:1}
.tkposline .szsvg .sznul{stroke:var(--ink-3);stroke-width:1;stroke-dasharray:2 3}
.tkposline .szsvg .szylbl,.tkposline .szsvg .szxlbl{fill:var(--ink-3);font-size:11px;font-variant-numeric:tabular-nums}
.tkposline .szsvg .szstil{stroke:var(--gold);stroke-width:1.6;stroke-dasharray:5 4;stroke-linejoin:round;stroke-linecap:round}
.tkposline .szsvg .szjij{stroke:var(--good-text);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.tkposline .szsvg .szjij.down{stroke:var(--bad-text)}
.tkposline .szsvg .szstileind{fill:var(--gold)}
.tkposline .szsvg .szjijeind{fill:var(--good-text)}
.tkposline .szsvg .szjijeind.down{fill:var(--bad-text)}
.tkposline .szsvg .szmk.koop{fill:var(--good-text)}
.tkposline .szsvg .szmk.verkoop{fill:var(--bad-text)}
.tkposline .szsvg .szband{fill:color-mix(in srgb, var(--bad-text) 12%, transparent)}
.tkposline .szlegenda{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:11px;color:var(--ink-3)}
.tkposline .szleg{display:inline-flex;align-items:center;gap:6px}
.tkposline .szleg::before{content:"";display:inline-block;width:14px;height:0;border-top:2px solid var(--good-text)}
.tkposline .szleg.stil::before{border-top:2px dashed var(--gold)}
.tkposline .szleg.koop::before{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:0;border-bottom:8px solid var(--good-text)}
.tkposline .szleg.verkoop::before{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:0;border-top:8px solid var(--bad-text)}
.tkposline .szleg.band::before{width:14px;height:10px;border:0;background:color-mix(in srgb, var(--bad-text) 18%, transparent)}
.tkposline .sztips{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb, var(--accent) 7%, transparent)}
.tkposline .sztipkop{font-size:13.5px;font-weight:700;line-height:1.35;color:var(--ink)}
.tkposline .sztips ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.tkposline .sztips li{font-size:12.5px;line-height:1.4;color:var(--ink)}
.tkposline .szsignaal{font-size:11px;color:var(--ink-3)}
.tkposline .szkop2{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.tkposline .szmarkt{display:flex;flex-direction:column;gap:6px}
.tkposline .szdiptabel{width:100%;border-collapse:collapse;font-size:12px;font-variant-numeric:tabular-nums}
.tkposline .szdiptabel td{padding:4px 6px 4px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tkposline .szdiptabel td:last-child{padding-right:0;text-align:right;color:var(--ink-3)}
.tkposline .szdiptabel td.szdip{color:var(--good-text);font-weight:600}
.tkposline .szdiptip{margin:0;font-size:12.5px;line-height:1.4;color:var(--ink)}
.tkposline .szdipnoot{margin:0}
.tkposline .szdeel{appearance:none;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--accent);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.tkposline .szdeel:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.chartbox .sztxknop{display:flex;width:max-content;margin:6px 0 2px auto;appearance:none;align-items:center;gap:5px;min-height:28px;padding:3px 9px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink-3);font:inherit;font-size:11px;font-weight:600;cursor:pointer;z-index:2}
.chartbox .sztxknop .szico{width:16px;height:16px;flex:none} /* de algemene chartbox-regel maakt elke svg 100 % breed — de knop houdt zijn lijnicoon op 16 px */
.chartbox .sztxknop[aria-pressed="true"]{color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--card))}
.chartbox .sztxknop:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@media (max-width:479px){.tkposline .sztegels{grid-template-columns:1fr 1fr}.tkposline .sztegel:last-child{grid-column:1/-1}} /* op een telefoon twee tegels naast elkaar en het verschil over de volle breedte: "+€ 1.015" breekt dan nergens af */
@media (prefers-reduced-motion:reduce){.tkposline .sznudgechev{transition:none}}
/* v25.52 — BEHEER-TOPAANDELEN */
/* v25.52 (BEHEER-TOPAANDELEN): de kaart "Meest opgeleverd" in de Toren op /beheer — twee tabellen naast elkaar vanaf 760 px, verlies gedempt in de
   verlieskleur; alleen tokens, geen id-selectors, geen hexen, geen aanwijs-effecten (de staart-scans van oudere suites verbieden die ná hun marker) */
.btagrid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
@media (min-width:760px){.btagrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.btatabel td.btaneg{color:var(--bad-text)}
.btatabel a.btasym{color:var(--accent);text-decoration:none;font-weight:600}
.btatabel a.btasym:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
/* v25.52 — POLITICI-ZOEK (Rabi 10-9: "in de politici tab moet je alle politici kunnen opzoeken" + "politici die dichtbij de criteria zitten") — de kop
   en de compacte rijen "Buiten de ranglijst" onder de ranglijst, de hint-regel zonder zoektekst, en de dichtgeklapte uitklap "Bijna opvallend" op de
   kaart Opvallende meldingen. Alleen tokens; geen aanwijs-effecten; de bestaande .polrow-regels blijven byte-gelijk. */
.pzbuiten{margin-top:14px}
.poltitel.pztitel{margin-bottom:4px}
.chartsub.pzsub{margin:0 0 8px;color:var(--ink-2)}
.polrow.pzrij{grid-template-columns:36px minmax(0,1fr);gap:10px;align-items:center}
.polrow.pzrij .pleft{min-width:0}
.polrow.pzrij .pleft b{white-space:normal;line-height:1.2}
.polrow.pzrij .polmeta{display:block;white-space:normal;min-width:0;line-height:1.3}
.polrow.pzrij .pzreden{display:block;color:var(--ink-3);font-size:11.5px;line-height:1.35;margin-top:2px;white-space:normal}
.chartsub.pzmeer,.chartsub.pzhint{color:var(--ink-3)}
.psbijna{margin:10px 18px 0;border-top:1px solid var(--line);padding-top:8px}
.psbijna summary{cursor:pointer;font-size:13px;color:var(--ink-2);list-style:none;display:flex;flex-wrap:wrap;gap:4px;align-items:baseline;min-height:44px;padding:6px 0}
.psbijna summary::-webkit-details-marker{display:none}
.psbijna summary::before{content:"\25B8";display:inline-block;width:14px;color:var(--ink-3)}
.psbijna[open] summary::before{content:"\25BE"}
.psbijna summary b{color:var(--ink)}
.psbijna .pzbijnan,.psbijna .pzbijnasub{color:var(--ink-3)}
.psbijna .pzbijnazin{margin:0 0 6px;color:var(--ink-2)}
.psbijna .pzbijnalijst{margin:0 -18px}
.psbijna .pzbijnae1{margin:6px 0 0;color:var(--ink-3)}
.pzbijnachip{border-style:dashed}
.pzbijnareden{font-size:11.5px;color:var(--ink-3);align-self:center;min-width:0;overflow-wrap:anywhere}
.psexperimenteel .pzbijnachip{opacity:.7}
@media (max-width:380px){.polrow.pzrij{grid-template-columns:36px minmax(0,1fr)}}
/* v25.52 — WEBVITALS (Rabi 10-9, PageSpeed veld mobiel CLS 1,38: "imprve this asmuch as possible") — alleen wanneer/hoe iets
   getekend wordt; geen getal verandert; meting scripts/webvitals-lab-v2552.mjs, rapport webvitals-v2552.md. (1) De hint ("Wist je dat…",
   195 px) schoof ná 1,5 s de Portefeuille omlaag (CLS 0,18): nu een laag boven de tabbalk, tekst en knoppen dezelfde. (2) Het versievoetje (.appversion,
   ná main.screen) schoof 500+ px zodra de feed/kaarten kwamen (CLS 0,57): de hoofdkolom minstens schermhoog. (3) Gesloten drawers (aria-hidden="true")
   hielden focusbare knoppen in de tabvolgorde: dicht = visibility hidden mét dezelfde uitschuifduur. Alleen tokens; geen aanwijs-effect; geen id. */
main.screen > .hintbar{position:fixed; left:12px; right:12px; bottom:calc(84px + env(safe-area-inset-bottom)); z-index:40; margin:0; max-width:496px; margin-inline:auto; box-shadow:0 14px 34px -14px rgba(0,0,0,.55)}
@media (min-width:900px){ main.screen > .hintbar{margin-bottom:0} }
main.screen:not(.authscherm){min-height:100svh} /* ook .center, was 90svh */
.drawer[aria-hidden="true"]:not(.on){visibility:hidden; transition:visibility 0s linear .3s}
.drawer.on{visibility:visible; transition-delay:0s}
picture.authbeeld, picture.paneelbeeld{display:block; line-height:0}
/* v25.52 (WEBVITALS) (4) plaatshouder beurzenstrook (blok v25.52 webvitals: html.wvtapeplek zolang de strook hidden is), dezelfde hoogte (feed 40, portefeuille 53). (5) feed-skeletten minstens schermhoog: de feed opent onderaan. (7) het versievoetje onzichtbaar op het laadscherm en zolang de feed-skeletten staan (html.wvskelet, blok): het wisselt bij die tekeningen van plaats en Chrome telt dat als verschuiving, ook als het vóór en ná in beeld staat (0,15 op 320 px). */
html.wvtapeplek main.screen.feedmode > .tape[hidden] ~ .kanaalview{margin-top:40px}
html.wvtapeplek main.screen[data-view="dash"] > .tape[hidden] ~ .apphead{margin-top:53px}
.feedskeletten{min-height:100svh}
main.screen.center:not([hidden]) ~ .appversion, html.wvskelet .appversion{visibility:hidden}
/* v25.52 (WEBVITALS) (6) de ledenteller op het inlogscherm (ná een verzoek) hield geen ruimte vrij: alles eronder schoof 43 px (CLS 0,03). Verborgen houdt de regel eronder die ruimte (12 marge + 6/6 + 1,3 × 13 + 2 rand; ≤ 379 px 12/5); zichtbaar = de eigen 12/10 px. */
.brand .authteller[hidden] + .sub{margin-top:calc(12px + 12px + 1.3 * 13px + 14px)}
.authmerk .authteller[hidden] + .authdoel[hidden] + .belofte{margin-top:calc(10px + 12px + 1.3 * 13px + 14px)}
@media (max-width:379px){ .brand .authteller[hidden] + .sub{margin-top:calc(12px + 12px + 1.3 * 12px + 12px)} .authmerk .authteller[hidden] + .authdoel[hidden] + .belofte{margin-top:calc(10px + 12px + 1.3 * 12px + 12px)} }
/* v25.52 — COMPOSE-VERTEL */
.composepraat{margin:0;flex:1;min-width:0;font:600 12.5px "IBM Plex Sans",sans-serif;color:var(--ink-2);text-align:center}
/* v25.52 — BADGE-STRAK (Rabi 9-9: "Badges kiezen ziet er knullig uit. Alles moet speels, huisstijl strak en bugloos zijn"; annotatie v25.52 (BADGE-STRAK)): kaartje ibSheet opnieuw; tokens, geen id/voorrangsvlag */
[data-ibkeuze="klasse"],[data-ibkeuze="dividend"],[data-ib="dividend"]{--ibtint:var(--gold)}
[data-ibkeuze="rendement"],[data-ibkeuze="growth"],[data-ib="growth"]{--ibtint:var(--good-text)}
[data-ibkeuze="geen"]{--ibtint:var(--ink-3)}
[data-ibkeuze="yolo"],[data-ib="yolo"]{--ibtint:color-mix(in srgb, var(--bad-text) 70%, var(--gold))}
[data-ibkeuze="etf"],[data-ib="etf"]{--ibtint:var(--vg-1)}
[data-ibkeuze="crypto"],[data-ib="crypto"]{--ibtint:var(--nw-paars)}
[data-ibkeuze="langetermijn"],[data-ib="langetermijn"]{--ibtint:color-mix(in srgb, var(--accent) 55%, var(--good-text))}
[data-ibkeuze="optie"],[data-ib="optie"]{--ibtint:var(--vg-3)}
.lidbadge.ibident{background:color-mix(in srgb, var(--ibtint, var(--accent)) 12%, transparent); border-color:color-mix(in srgb, var(--ibtint, var(--accent)) 30%, transparent)}
.lidbadge.ibident .ibico{width:11px; height:11px; color:var(--ibtint, var(--accent))}
.lidbadge.ibident .ibnaam{font:700 .905em/1.658 "IBM Plex Sans",sans-serif}
.od-klasse.ibodident{color:var(--ink); border-color:color-mix(in srgb, var(--ibtint, var(--accent)) 40%, transparent); background:color-mix(in srgb, var(--ibtint, var(--accent)) 12%, transparent)}
.od-klasse.ibodident .ibico{color:var(--ibtint, var(--accent))}
.ibvv{position:sticky; top:0; z-index:2; margin:8px 0 10px; padding:9px 12px 10px; border-radius:14px; background:var(--card-2); border:1px solid var(--line)}
.ibvvlbl{display:block; font-size:10.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); margin-bottom:6px}
.ibvvrij{display:flex; align-items:center; gap:8px; min-width:0}
.ibvvavatar{width:30px; height:30px; border-radius:50%; overflow:hidden; flex:none}
.ibvvavatar svg{display:block; width:100%; height:100%}
.ibvvnaam{font:700 14px "IBM Plex Sans",sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0}
.ibvvchip{flex:none; max-width:60%}
.ibvvchip .lidbadge{font-size:12px; padding:3px 8px; border-radius:6px}
.ibvvleeg{font:500 12px "IBM Plex Sans",sans-serif; font-style:normal; color:var(--ink-3)}
.ibvvchip.ibplop > *{animation:ibplop .2s ease-out}
@keyframes ibplop{0%{transform:scale(.8); opacity:.5} 60%{transform:scale(1.08)} 100%{transform:scale(1); opacity:1}}
.ibkeuzes{grid-template-columns:repeat(2, minmax(0, 1fr)); grid-auto-rows:1fr; max-height:none; overflow:visible}
.ibkeuze{position:relative; flex-direction:column; gap:7px; min-width:0; min-height:100px; padding:12px 8px 11px; border-radius:16px; text-align:center}
.ibkeuze:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.ibkeuze .ibkico{width:44px; height:44px; border-radius:50%; background:color-mix(in srgb, var(--ibtint, var(--accent)) 16%, transparent); color:var(--ibtint, var(--accent))}
.ibkeuze .ibkico .ibico{width:28px; height:28px}
.ibkeuze .ibnaam{font:600 13px/1.25 "IBM Plex Sans",sans-serif; max-width:100%; overflow-wrap:anywhere}
.ibkeuze .ibsub{font-size:12px; line-height:1.2; margin-top:0; max-width:100%; font-variant-numeric:tabular-nums}
.ibkeuze .ibvink{position:absolute; top:7px; right:7px; width:18px; height:18px; border-radius:50%; background:var(--accent); color:var(--card); display:none; place-items:center} /* v25.52 (BADGE-STRAK, herstel tegenlezer T-6): --card, niet de tekst-op-accent-token (verboden na de NABEURS-KNOP-staart, pin nabeurs-data) */
.ibkeuze .ibvink .ibico{width:12px; height:12px; stroke-width:2.6}
.ibkeuze.on .ibvink{display:grid}
.ibnoot{margin:10px 0 0; font-size:12px; line-height:1.4; color:var(--ink-3)}
.ibkies.ibkiesknop{appearance:none; display:flex; align-items:center; gap:8px; width:100%; min-height:44px; margin:12px 0 0; padding:9px 12px; border:1px solid var(--line); border-radius:12px; background:transparent; color:var(--accent); font:600 13px "Archivo",sans-serif; text-align:left; cursor:pointer}
.ibkies.ibkiesknop .ibknoptekst{flex:1}
.ibkies.ibkiesknop .ibico{width:16px; height:16px; flex:none}
.ibkaart .ibkies.ibkiesknop{margin-top:4px}
@media (min-width:481px){ .ibkeuzes{grid-template-columns:repeat(3, minmax(0, 1fr))} }
@media (min-width:640px) and (max-width:819px){ .ibkeuzes{grid-template-columns:repeat(4, minmax(0, 1fr))} }
@media (prefers-reduced-motion: reduce){ .ibvvchip.ibplop > *{animation:none} }
/* v25.52 — GAK-PIJL (Rabi 10-9: "een pijltje met de GAK … een geel pijltje" + STILZITTEN-KAART2: de kaart Jij vs stilzitten open boven de koersgrafiek, mét de eigen grafiek en zonder de dip-tabel — Rabi 10-9 21:39 "de grafiek bij stilzitten kan blijven, enkel de tabel eruit"; de prijs bij de koop-/verkoopdriehoekjes) — v25.52 (GAK-PIJL): tokens, geen id-selector, geen aanwijs-effect, geen voorrangsvlag, geen emoji */
.chartbox svg .gppijl{stroke:var(--card);stroke-width:1;stroke-linejoin:round} /* een dun randje in de kaartkleur zodat het gele pijltje ook óp de koerslijn leesbaar blijft */
.chartbox svg .sztxlbl{font-variant-numeric:tabular-nums;paint-order:stroke;stroke:var(--card);stroke-width:3px;stroke-linejoin:round}
@media (max-width:359px){.chartbox svg .sztxlbl{display:none}} /* op de smalste schermen alleen de driehoekjes (de titel blijft) */
.szkaart.szkaart2{display:flex;flex-direction:column;gap:0;margin:10px 0 8px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card)}
.szkaart2 .sznudge{appearance:none;border:0;background:color-mix(in srgb, var(--accent) 9%, transparent);color:var(--ink);font:inherit;text-align:left;display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:10px 12px;cursor:pointer}
.szkaart2 .sznudge:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.szkaart2 .sznudge .szico{flex:none;color:var(--accent)}
.szkaart2 .sznudgetekst{flex:1 1 auto;font-size:13px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.szkaart2 .sznudgechev{flex:none;color:var(--ink-3);display:inline-flex;transition:transform .18s ease}
.szkaart2 .sznudge[aria-expanded="true"] .sznudgechev{transform:rotate(180deg)}
.szkaart2 .szbody{display:flex;flex-direction:column;gap:10px;padding:12px}
.szkaart2 .sztegels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.szkaart2 .sztegel{display:flex;flex-direction:column;gap:2px;padding:10px 10px 8px;border-radius:12px;background:color-mix(in srgb, var(--ink) 5%, transparent);min-width:0}
.szkaart2 .sztegel span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.szkaart2 .sztegel b{font-size:17px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--ink);overflow-wrap:anywhere}
.szkaart2 .sztegel b.up{color:var(--good-text)}
.szkaart2 .sztegel b.down{color:var(--bad-text)}
.szkaart2 .sztegel small{font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.szkaart2 .sznoot{margin:0;font-size:11px;line-height:1.45;color:var(--ink-3)}
.szkaart2 .szlegenda{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:11px;color:var(--ink-3)}
.szkaart2 .szleg{display:inline-flex;align-items:center;gap:6px}
.szkaart2 .szleg::before{content:"";display:inline-block}
.szkaart2 .szleg.koop::before{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:8px solid var(--good-text)}
.szkaart2 .szleg.verkoop::before{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:8px solid var(--bad-text)}
.szkaart2 .szleg.gak::before{width:14px;height:0;border-top:2px dashed var(--gold)}
.szkaart2 .szleg.jij::before{width:14px;height:0;border-top:2px solid var(--good-text)} /* v25.52 (STILZITTEN-KAART2, correctie 21:39): de legenda van de eigen grafiek, zoals in .tkposline */
.szkaart2 .szleg.stil::before{width:14px;height:0;border-top:2px dashed var(--gold)}
.szkaart2 .szgrafiek{margin:0;padding:0;overflow:hidden} /* v25.52 (STILZITTEN-KAART2, correctie 21:39): de eigen grafiek blijft in de kaart boven de koersgrafiek — dezelfde tokens als de STILZITTEN-regels op .tkposline */
.szkaart2 .szsvg{display:block;max-width:100%;height:auto;font-size:11px}
.szkaart2 .szsvg .szgrid{stroke:var(--line);stroke-width:1}
.szkaart2 .szsvg .sznul{stroke:var(--ink-3);stroke-width:1;stroke-dasharray:2 3}
.szkaart2 .szsvg .szylbl,.szkaart2 .szsvg .szxlbl{fill:var(--ink-3);font-size:11px;font-variant-numeric:tabular-nums}
.szkaart2 .szsvg .szstil{stroke:var(--gold);stroke-width:1.6;stroke-dasharray:5 4;stroke-linejoin:round;stroke-linecap:round}
.szkaart2 .szsvg .szjij{stroke:var(--good-text);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.szkaart2 .szsvg .szjij.down{stroke:var(--bad-text)}
.szkaart2 .szsvg .szstileind{fill:var(--gold)}
.szkaart2 .szsvg .szjijeind{fill:var(--good-text)}
.szkaart2 .szsvg .szjijeind.down{fill:var(--bad-text)}
.szkaart2 .szsvg .szmk.koop{fill:var(--good-text)}
.szkaart2 .szsvg .szmk.verkoop{fill:var(--bad-text)}
.szkaart2 .szlegtekst{color:var(--ink-3)}
.szkaart2 .sztips{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb, var(--accent) 7%, transparent)}
.szkaart2 .sztipkop{font-size:13.5px;font-weight:700;line-height:1.35;color:var(--ink)}
.szkaart2 .sztips ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.szkaart2 .sztips li{font-size:12.5px;line-height:1.4;color:var(--ink)}
.szkaart2 .szsignaal{font-size:11px;color:var(--ink-3)}
.szkaart2 .szdeel{appearance:none;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--accent);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.szkaart2 .szdeel:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@media (max-width:479px){.szkaart2 .sztegels{grid-template-columns:1fr 1fr}.szkaart2 .sztegel:last-child{grid-column:1/-1}}
@media (prefers-reduced-motion:reduce){.szkaart2 .sznudgechev{transition:none}}

/* v25.53 — COMMUNITY-KANALEN */
/* v25.53 (COMMUNITY-DISCORD, B5): de kanalenkant van de community zoals Discord — categorieën in het paneel, slotje/tellers op de rijen, de banner boven de feed, het huisregels-kaartje, de demp-rij in de kanaalinfo, de lay-out 240 px op een breed scherm en de tabbalk weg in een open chatkanaal op mobiel. Alleen tokens; de klassen bestaan alleen als het blok v25.53 community-kanalen ze zet (stand uit = geen van deze klassen in de DOM). */
.cdkcats{display:contents}
.pgroep.cdkcat{margin:0}
.pgkop.cdkcatkop{display:flex;align-items:center;gap:6px;cursor:pointer;user-select:none;border-radius:8px;padding:6px 8px;min-height:32px}
.pgkop.cdkcatkop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pgkop.cdkcatkop span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.krij.cdkrij .cdkslot{display:inline-flex;align-items:center;justify-content:center;width:14px;flex:none;color:var(--ink-3)}
.krij.cdkrij .cdkico{width:14px;height:14px}
.krij.cdkrij .cdkslotgrijs{opacity:.55}
.krij.cdkrij.cdkvergrendeld .kopen{cursor:not-allowed;color:var(--ink-3)}
.krij.cdkrij.gedempt .kopen{color:var(--ink-3)}
.krij.cdkrij .kopen{min-width:0}
.krij.cdkrij .knaam{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdkbel{display:inline-flex;margin-left:auto;color:var(--ink-3);flex:none}
.cdkemoji{margin-left:2px;flex:none;font-size:13px}
.cdkat{white-space:nowrap}
.cdkkop{font-weight:700;color:var(--ink)}
.cdkonderwerp{color:var(--ink-2)}
.cdkbanner{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 12px;margin:0 0 10px;border-radius:12px;background:var(--seg-bg);border:1px solid var(--line-2);color:var(--ink-2);font-size:13.5px;line-height:1.35}
.cdkbanner .cdkbannertekst{display:inline-flex;align-items:center;gap:8px;min-width:0}
.cdkbanner .cdkico{width:16px;height:16px;flex:none;color:var(--ink-3)}
.cdkbanner .cdkbannerzin{overflow-wrap:anywhere}
.cdkbanner .cdkimmuun{color:var(--good-text)}
.cdkbanner .cdkimmuun .cdkico{color:var(--good-text)}
.cdkbanner.slow .cdkbannerzin{font-variant-numeric:tabular-nums}
.cdkbanner .cdkbannerknop{flex:none;padding:6px 12px;font-size:13px;min-height:36px}
.feedempty.cdkgeentoegang b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}
.feedempty.cdkgeentoegang p{margin:0}
.cdkhuisregels .cdkhrvlak{padding:16px;height:auto;max-height:80svh;overflow:auto;display:flex;flex-direction:column;gap:10px}
.cdkhuisregels .cdkhrtekst{max-height:52svh;overflow:auto;font-size:14px;line-height:1.5;color:var(--ink-2);overflow-wrap:anywhere}
.cdkhuisregels .cdkhrtekst p{margin:0 0 10px}
.cdkhuisregels .cdkhrtekst p:last-child{margin-bottom:0}
.cdkhuisregels .cdkhrknoppen{display:flex;justify-content:flex-end;gap:8px}
.cdkhuisregels .cdkhrknoppen .btn{min-height:44px;padding:10px 18px}
.cdkhuisregels .cdkhrfout{margin:0}
.kanaalmeld.cdkdemp{gap:12px}
.kanaalmeld.cdkdemp .cdkdemplabel{display:inline-flex;align-items:center;gap:8px;min-width:0}
.kanaalmeld.cdkdemp .cdkdemplabel .cdkico{width:16px;height:16px;flex:none;color:var(--ink-3)}
.kanaalmeld.cdkdemp .cdkdempsel{font:inherit;font-size:13px;background:var(--seg-bg);color:var(--ink);border:1px solid var(--line-2);border-radius:8px;padding:6px 8px;max-width:55%;min-height:36px}
.kanaalmeld.cdkdemp .cdkdempuit{flex:none;min-height:36px}
@media (min-width:1180px){body.cdkactief.commfeed{--cdk-paneel-b:240px} body.cdkactief.commfeed .paneel .paneelvlak{margin-left:78px} body.cdkactief.commfeed .paneel .paneelwie span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}} /* 240 px gedockt: de 78 px (318 − 240) verschuiving houdt dezelfde afstand tot de app-kolom als het bredere paneel; de voetregel op één regel */
@media (max-width:767px){body.cdkkanaal nav.tabbar{display:none}}
/* v25.53 — COMMUNITY-LEDEN (COMMUNITY-DISCORD, B6: weergavenaam in rolkleur + rol-icoon, @vermeldingen, de typ-indicator, online-stippen, het ledenpaneel per rol, de gebruikerskaart, de toegangskaart) — v25.53 (COMMUNITY-DISCORD, B6): alleen tokens/color-mix, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji; in stand uit staat geen van deze klassen in de DOM */
.cdlnaam{text-decoration:none}
.cdlrolicoon{display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; margin-left:4px; vertical-align:-3px; flex:none}
.cdlrolicoon .cdlico{width:14px; height:14px; display:block}
.cdlicoontekst{font:700 10px "Archivo",sans-serif; line-height:1}
.cdlvermelding{display:inline; padding:0 4px; border-radius:5px; background:var(--accent-wash); color:var(--accent); font-weight:600}
.cdltypen{display:flex; align-items:center; gap:8px; min-height:22px; padding:2px 16px 6px; font-size:12px; color:var(--ink-3)}
.cdltypen:empty{display:none}
.cdldots{display:inline-flex; align-items:center; gap:3px; height:12px}
.cdldots i{display:block; width:5px; height:5px; border-radius:50%; background:var(--ink-3); animation:cdlbounce 1.1s ease-in-out infinite}
.cdldots i:nth-child(2){animation-delay:.15s}
.cdldots i:nth-child(3){animation-delay:.3s}
@keyframes cdlbounce{0%,60%,100%{transform:translateY(0); opacity:.55}30%{transform:translateY(-3px); opacity:1}}
.cdlstip{position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border-radius:50%; border:2px solid var(--ground); background:var(--ink-3); box-sizing:border-box}
.cdlstip.online{background:var(--good)}
.cdlstip.afwezig{background:var(--gold)}
.cdlstip.afwezig::after{content:""; position:absolute; left:-2px; top:-2px; width:6px; height:6px; border-radius:50%; background:var(--ground)}
.cdlstip.dnd{background:var(--bad)}
.cdlstip.dnd::after{content:""; position:absolute; left:1px; right:1px; top:2px; height:2px; border-radius:1px; background:var(--ground)}
.cdlstip.offline{background:var(--ground); border-color:var(--ink-3)}
.cdlonline{white-space:nowrap}
.cdlgroep{margin:6px 0 10px}
.cdlgroepkop{font:700 11px "Archivo",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); padding:8px 4px 4px; cursor:default}
details.cdlgroep>summary.cdlgroepkop{cursor:pointer; list-style:none; display:flex; align-items:center; gap:6px}
details.cdlgroep>summary.cdlgroepkop::-webkit-details-marker{display:none}
details.cdlgroep>summary.cdlgroepkop::before{content:""; width:6px; height:6px; border-right:1.6px solid var(--ink-3); border-bottom:1.6px solid var(--ink-3); transform:rotate(-45deg); transition:transform .15s; margin-right:2px}
details.cdlgroep[open]>summary.cdlgroepkop::before{transform:rotate(45deg)}
.cdlrij{appearance:none; border:0; background:none; width:100%; display:flex; align-items:center; gap:10px; min-height:44px; padding:5px 4px; border-radius:10px; color:var(--ink); font:inherit; text-align:left; cursor:pointer}
.cdlrij:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.cdlrij.offline{opacity:.55}
.cdlrijav{position:relative; width:32px; height:32px; flex:none}
.cdlrijav .pavatar,.cdlrijav.pavatar{width:32px; height:32px}
.cdlrijtekst{display:flex; flex-direction:column; min-width:0; flex:1}
.cdlrijnaam{font-size:13.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:center}
.cdlrijsub{font-size:11px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cdlrijsub.typt{color:var(--accent); font-style:italic}
.cdlmeer{display:block; margin:4px 0 8px 4px; font-size:12.5px}
.cdlsheetbody{padding:4px 18px 18px}
.sheet.cdlkaart,.sheet.cdltoegang{max-height:min(88vh,88svh); overflow:auto}
.cdlkaarthead{display:flex; align-items:center; gap:14px; padding:8px 0 12px}
.cdlkaartav{position:relative; width:56px; height:56px; flex:none}
.cdlkaartav.pavatar.init{width:56px; height:56px; font-size:20px}
.cdlkaartav .cdlstip{width:15px; height:15px; right:0; bottom:0}
.cdlkaartinfo{min-width:0; flex:1}
.cdlkaartnaam{display:flex; align-items:center; gap:4px; font:700 18px "Archivo",sans-serif; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cdlchevron{font-size:14px; color:var(--ink-3)}
.cdlschuil,.cdlkaartsub,.cdlsub{font-size:12px; color:var(--ink-3); margin-top:2px}
.cdlstatuslabel{font-weight:600}
.cdlkaartsectie{padding:10px 0; border-top:1px solid var(--line)}
.cdlkaartkop{font:700 11px "Archivo",sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); margin:0 0 8px}
.cdlrolchips{display:flex; flex-wrap:wrap; gap:6px}
.cdlrolchip{--cdlrolkleur:var(--accent); display:inline-flex; align-items:center; gap:6px; padding:3px 9px 3px 7px; border-radius:999px; border:1px solid var(--line-2); background:var(--card-2); font-size:12.5px; font-weight:600; color:var(--ink)}
.cdlrolstip{width:9px; height:9px; border-radius:50%; background:var(--cdlrolkleur); flex:none}
.cdlstatuskeuze{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px}
.cdlstatusknop{appearance:none; cursor:pointer; min-height:44px; padding:6px 8px; border-radius:10px; border:1px solid var(--line-2); background:var(--card); color:var(--ink-2); font:inherit; font-size:12.5px; font-weight:600; display:inline-flex; align-items:center; justify-content:center; gap:6px}
.cdlstatusknop .cdlstip{position:static; width:10px; height:10px; border-width:1.5px; flex:none}
.cdlstatusknop[aria-pressed="true"]{background:var(--accent-wash); border-color:var(--accent-lijn); color:var(--accent)}
.cdlstatusknop:focus-visible,.cdlknop:focus-visible,.cdlnaaminvoer input:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.cdlnaaminvoer{display:block; margin:6px 0 8px}
.cdlnaaminvoer input{width:100%; box-sizing:border-box; min-height:42px; padding:8px 12px; border-radius:10px; border:1px solid var(--line-2); background:var(--input-bg); color:var(--ink); font:inherit; font-size:14px}
.cdlwaarschuwing{font-size:12px; color:var(--ink-2); padding:8px 10px; border-radius:10px; background:color-mix(in srgb,var(--gold) 14%,transparent); margin:0 0 8px}
.cdlfout{font-size:12px; color:var(--bad-text); margin:4px 0 0}
.cdlknoppen{display:flex; flex-wrap:wrap; gap:8px; margin-top:10px}
.cdlknop{min-height:44px; flex:1 1 140px; justify-content:center}
.cdlschakel{display:flex; align-items:center; gap:10px; min-height:44px; font-size:13.5px; cursor:pointer}
.cdlschakel input{width:20px; height:20px; accent-color:var(--accent); margin:0}
.cdlmeta{display:flex; flex-wrap:wrap; gap:8px 16px; font-size:12.5px; color:var(--ink-2)}
.cdlmeta b{font-weight:600; color:var(--ink)}
.cdlklasse{margin-left:4px}
.cdlprofiel{display:inline-block; margin-top:10px; font-size:13.5px}
.cdltoegangtekst{font-size:14px; line-height:1.5; color:var(--ink-2); padding:6px 0 4px}
.cdltoegangtekst b{color:var(--ink)}
.cdlknop.primair{background:var(--accent); color:var(--accent-tekst); border-color:var(--accent)}
.cdlknop.secundair{background:var(--card); color:var(--ink-2); border:1px solid var(--line-2)}
@media (min-width:760px){.sheet.cdlkaart{width:440px; height:auto}.sheet.cdltoegang{width:480px; height:auto}}
@media (max-width:359px){.cdlstatuskeuze{grid-template-columns:1fr}.cdlkaartnaam{font-size:16px}}
@media (prefers-reduced-motion:reduce){.cdldots i{animation:none; opacity:.8}details.cdlgroep>summary.cdlgroepkop::before{transition:none}}
/* v25.53 — COMMUNITY-BEHEER (v25.53 (COMMUNITY-DISCORD, B7)): de vijfde tab Community op /beheer (blok v25.53 community-beheer, paneel bcGrid) — subtabs, formulieren, ledenrijen, logboek; de tabkiezer met vijf knoppen ≤ 479 px in 3 + 2 (met vier knoppen blijft 2 × 2 byte-gelijk). Alleen tokens, geen hex/id/voorrangsvlag/aanwijs-effect. */
.bhview .cdbtabgrid{grid-template-columns:1fr; padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.bhview .cdbtabgrid .bhkaart.cdbtab{grid-column:1 / -1; max-width:none; width:100%; box-sizing:border-box}
.cdbtab .cdbsubtabs{display:flex; flex-wrap:wrap; gap:3px; margin:2px 0 12px; padding:3px}
.cdbtab .cdbsubtabs button{display:inline-flex; align-items:center; gap:6px; padding:7px 10px; min-height:34px; font-size:12.5px}
.cdbtab .cdbsubtabs .cdbtel{font-weight:500; color:var(--ink-3); font-size:11px}
.cdbtab .cdbsubtabs button.on .cdbtel{color:var(--ink-2)}
.cdbtab .cdbico{width:15px; height:15px; flex:none; display:inline-block; vertical-align:-3px}
.cdbtab .cdbtop{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 10px}
.cdbtab .cdbhint{font-size:12px; color:var(--ink-3); margin:0 0 10px; overflow-wrap:anywhere}
.cdbtab .cdbcat{margin:0 0 14px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:color-mix(in srgb, var(--card-2) 55%, var(--card))}
.cdbtab .cdbcatkop{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 8px; font-size:12.5px}
.cdbtab .cdbcatkop b{flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} /* de naam breekt nooit midden in een woord — de knoppen wikkelen eronder */
.cdbtab .cdbcatkop .cdbtelrij{font-size:11px; color:var(--ink-3); white-space:nowrap}
.cdbtab .cdblijst{gap:8px}
.cdbtab .cdbrij{display:flex; flex-direction:column; align-items:stretch; gap:6px; padding:8px 10px; border:1px solid var(--line); border-radius:12px; background:var(--card)}
.cdbtab .cdbrij.cdbgearchiveerd{opacity:.72}
.cdbtab .cdbrijkop{display:flex; flex-wrap:wrap; gap:6px 8px; align-items:baseline; min-width:0}
.cdbtab .cdbrijkop .bhnaam{font-size:13.5px}
.cdbtab .cdbemoji{font-style:normal; flex:none}
.cdbtab .cdbslug{font-size:11.5px; color:var(--ink-3); font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.cdbtab .cdbtelrij{font-size:11px; color:var(--ink-3); margin-left:auto; white-space:nowrap}
.cdbtab .cdbonderwerp{font-size:12px; color:var(--ink-2); margin:0; overflow-wrap:anywhere}
.cdbtab .cdbchips{display:flex; flex-wrap:wrap; gap:4px}
.cdbtab .cdbchip{margin-left:0; font-weight:500; color:var(--ink-3); border-color:var(--line)}
.cdbtab .cdbchip.cdbuit{color:var(--bad-text); border-color:color-mix(in srgb, var(--bad) 45%, var(--line))}
.cdbtab .cdbacties{display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.cdbtab .bhknop{display:inline-flex; align-items:center; gap:5px; min-height:32px}
.cdbtab .bhknop.on{border-color:var(--accent); color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--card))}
.cdbtab .bhknop.cdbprimair{border-color:var(--accent); background:var(--accent); color:var(--card)}
.cdbtab .bhknop:disabled{opacity:.45; cursor:default}
.cdbtab .cdbform{margin:8px 0 12px; padding:12px; border:1px solid var(--line-2); border-radius:12px; background:color-mix(in srgb, var(--card-2) 40%, var(--card))}
.cdbtab .cdbform select{font:inherit; font-size:13px; padding:7px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--input-bg); color:var(--ink); width:100%; min-width:0}
.cdbtab .cdbform select:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.cdbtab .cdbform input[type="color"]{width:48px; height:34px; padding:2px; border-radius:8px}
.cdbtab .cdbvelden{display:grid; grid-template-columns:1fr 1fr; gap:8px 12px}
.cdbtab .cdbvelden .cdbbreed{grid-column:1 / -1}
.cdbtab .cdbveld{display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--ink-2); min-width:0}
.cdbtab .cdbveld small{color:var(--ink-3); font-size:11px}
.cdbtab .cdblabel{font-size:12px; color:var(--ink-2); font-weight:600}
.cdbtab .cdbchecks{display:flex; flex-wrap:wrap; gap:6px 14px}
.cdbtab .cdbcheck,.cdbtab .cdbradio{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-2); min-height:28px}
.cdbtab .cdbcheck input,.cdbtab .cdbradio input{margin:0; accent-color:var(--accent)}
.cdbtab .cdbkolom{display:flex; flex-direction:column; gap:6px}
.cdbtab .cdbrolkeuze{display:flex; flex-direction:column; gap:4px; grid-column:1 / -1}
.cdbtab .cdbregel{display:flex; flex-direction:column; gap:6px; padding:8px 10px; border:1px dashed var(--line-2); border-radius:10px; grid-column:1 / -1}
.cdbtab .cdbvoorwaarden{display:flex; flex-direction:column; gap:6px}
.cdbtab .cdbvoorwaarde{display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,.9fr) minmax(0,1fr) auto; gap:6px; align-items:center}
.cdbtab .cdbvoorwaarde .bhknop{padding:4px 8px; min-height:30px}
.cdbtab .cdbtelling{font-size:12px; color:var(--ink-2); min-height:18px}
.cdbtab .cdbrolstip{display:inline-block; width:10px; height:10px; border-radius:999px; background:var(--cdbrol, var(--ink-3)); flex:none; align-self:center}
.cdbtab .cdbident summary{cursor:pointer; font-size:12.5px; color:var(--ink-2); padding:6px 0}
.cdbtab .cdbarchief summary{cursor:pointer; font-size:12.5px; color:var(--ink-2); padding:6px 0}
.cdbtab .cdbzoek{margin:0 0 10px}
.cdbtab .cdbzoek input{flex:1}
.cdbtab .cdblid{gap:8px}
.cdbtab .cdblidblok{display:flex; flex-direction:column; gap:4px}
.cdbtab .cdbinline{margin:0}
.cdbtab .cdbveldrij{margin-top:0; flex-wrap:wrap}
.cdbtab .cdbveldrij input,.cdbtab .cdbveldrij select{flex:1 1 140px; min-width:0; padding:7px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--input-bg); color:var(--ink); font:inherit; font-size:13px}
.cdbtab .cdbveldrij input:focus-visible,.cdbtab .cdbveldrij select:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
.cdbtab .cdblog td,.cdbtab .cdblog th{text-align:left; white-space:normal; overflow-wrap:anywhere; vertical-align:top}
.cdbtab .cdblog td:first-child{white-space:nowrap; min-width:0; color:var(--ink-3)}
.cdbtab .cdbstandfout{color:var(--bad-text); font-size:12px; margin:6px 0 0; overflow-wrap:anywhere}
.cdbtab .cdbstandfout[hidden]{display:none}
.cdbtab .bhstats{margin:10px 0}
.cdbtab textarea{min-height:120px}
@media (max-width:479px){
  .cdbtab .cdbvelden{grid-template-columns:1fr}
  .cdbtab .cdbvoorwaarde{grid-template-columns:1fr 1fr; grid-auto-rows:auto}
  .cdbtab .cdbvoorwaarde .bhknop{grid-column:2; justify-self:end}
  .cdbtab .cdbsubtabs button{padding:6px 8px; font-size:12px}
  /* vijf knoppen in de tabkiezer: zes kolommen, elke knop 3 breed (= de oude helft), en alléén bij vijf knoppen de eerste drie 2 breed (rij 1: 3 knoppen, rij 2: 2 knoppen) */
  .bhview .bktabs{grid-template-columns:repeat(6, 1fr)}
  .bhview .bktabs button{grid-column:span 3}
  .bhview .bktabs button:first-child:nth-last-child(5), .bhview .bktabs button:first-child:nth-last-child(5) ~ button{grid-column:span 2}
  .bhview .bktabs button:first-child:nth-last-child(5) ~ button:nth-child(n+4){grid-column:span 3}
}
@media (max-width:359px){ .bhview .bktabs button:first-child:nth-last-child(5), .bhview .bktabs button:first-child:nth-last-child(5) ~ button{font-size:11.5px; padding:8px 4px} }
/* 480–1023 px: de beheerkolom is hier ± 484 px breed — vijf knoppen op één rij laten "Persberichten" overlopen (gemeten 113 > 95 px); bij vijf knoppen wikkelt
   de flex-rij daarom in 3 + 2 (de eerste drie 30 %, de laatste twee 44 %), bij vier knoppen blijft basis 0 = één rij zoals vóór */
@media (min-width:480px) and (max-width:1023px){
  .bhview .bktabs{flex-wrap:wrap}
  .bhview .bktabs button:first-child:nth-last-child(5), .bhview .bktabs button:first-child:nth-last-child(5) ~ button{flex:1 1 30%}
  .bhview .bktabs button:first-child:nth-last-child(5) ~ button:nth-child(n+4){flex:1 1 44%}
}
/* v25.53 — KOERS-TICK-KNOP: de schakelaar Koersbus / Tick-broadcast op de kaart Koersen van /beheer (twee knoppenrijen in de laknoppen-stijl van LIVE-ALLES P2 + een statusregel; alleen tokens, geen aanwijs-effect, alleen het beheerdersscherm) — terugweg: KTK_AAN = false */
.ktkknoppen{align-items:center}
.ktkknoppen .ktklbl{font-size:12px;color:var(--ink-3);margin-right:4px}
.ktkstand{margin-top:6px}
/* v25.53 — NIEUWS-ZOEK */
/* v25.53 (NIEUWS-ZOEK): de resultaatstaat van het zoekveld op Nieuws — kopregel mét wisknop en bedrijfsrij direct onder het veld, en in de zoekstand (klasse nzzoek op de grid) alleen 'Van de redactie' zichtbaar. Alleen tokens/color-mix, geen id, geen voorrangsvlag, geen aanwijs-effect (de staart-scans van oudere suites verbieden dat woord in elke latere staart). */
.nzresultaat{display:flex;flex-direction:column;gap:8px;margin:-6px 0 14px}
.nzkop{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:0 0 0 14px;border-radius:14px;background:var(--card);color:var(--ink-2);font-size:13px}
.nztekst{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nzwis{flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:14px;background:none;color:var(--ink-2);cursor:pointer;appearance:none;font:inherit}
.nzwis:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.nzbedrijf{display:flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:14px;background:color-mix(in srgb,var(--accent) 12%,var(--card));color:var(--ink);text-decoration:none;font-size:14px;font-weight:600}
.nzbedrijf b{color:var(--accent)}
.nzbedrijf .nzpijl{margin-left:auto;color:var(--ink-3);font-weight:400}
.nzbedrijf:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.nwgrid.nzzoek{grid-template-columns:minmax(0,1fr)}
.nwgrid.nzzoek .nwkaart,.nwgrid.nzzoek .nwstroom,.nwgrid.nzzoek .pmnieuws,.nwgrid.nzzoek .nwzij{display:none}
/* v25.53 (NIEUWS-ZOEK, herstel tegenlezer T-G-1): bij 0 treffers zegt de kopregel al 'Niets gevonden' — de leegtekst van de rubriek eronder niet nog eens */
.nwgrid.nzzoek.nzleeg .nwsectie>.nwleeg{display:none}
/* v25.53 (NIEUWS-ZOEK, herstel tegenlezer T-G-4): een lange bedrijfsnaam breekt alleen in haar eigen span (.nznaam) en de rij wikkelt; de ticker blijft één woord (nooit per lettergroep) */
.nzbedrijf{flex-wrap:wrap}
.nzbedrijf b{white-space:nowrap;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.nzbedrijf .nznaam{min-width:0;overflow-wrap:anywhere}
/* v25.53 (NIEUWS-ZOEK, herstel tegenlezer T-G-2): bij 0 treffers ook de rubriekkop van 'Van de redactie' weg (de filterchips blijven staan) en één hintregel onder de kop */
.nwgrid.nzzoek.nzleeg .nwsectie>.ontdekkop{display:none}
.nzhint{margin:0;padding:0 14px;font-size:13px;color:var(--ink-3)}
/* v25.53 (NIEUWS-ZOEK, herstel tegenlezer T-G-1): op een breed scherm krijgt de resultaatstaat dezelfde breedte als het zoekveld (.nwzoek is vanaf 960 px 560 px breed) */
@media (min-width:960px){.nzresultaat{max-width:560px}}
/* v25.53 — COMMUNITY-CHAT */
/* v25.53 (COMMUNITY-CHAT): één gedeelde staart voor de drie bouwers; alleen tokens, geen id, geen hex, geen voorrangsvlag — de subkoppen wijzen de delen aan */
/* cdc deel 1 (B1) */
/* De vaste chatbalk onder de kanaalfeed: tokens, geen id, geen aanwijs-effect (de staart-scans van oudere suites verbieden het woord). Bestaat alleen zolang body.cdcchat staat. */
.cdcbalk{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:6px 10px calc(6px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);box-sizing:border-box}
.cdcrij{display:flex;gap:8px;align-items:flex-end;max-width:760px;margin:0 auto}
.cdctekst{flex:1;min-width:0;min-height:40px;max-height:148px;border:1px solid var(--line-2);border-radius:20px;background:var(--input-bg);color:var(--ink);padding:9px 14px;font:inherit;font-size:15px;line-height:20px;resize:none;box-sizing:border-box;overflow-y:hidden}
.cdctekst:focus{outline:none;border-color:var(--accent)}
.cdctekst::placeholder{color:var(--ink-3)}
.cdcstuur,.cdcmeer,.cdcemoji{width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--accent);color:var(--accent-tekst);border:0;padding:0;cursor:pointer;font:inherit}
.cdcmeer,.cdcemoji{background:var(--seg-bg);color:var(--ink-2)}
.cdcstuur:disabled{opacity:.4;cursor:default}
.cdcstuur .cdcico{margin-left:2px}
.cdcquote{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--ink-3);border-left:3px solid var(--accent);padding:2px 8px;margin:0 auto 6px;max-width:760px}
.cdcquotetekst{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cdcquoteweg{flex:none;width:28px;height:28px;border:0;border-radius:50%;background:transparent;color:var(--ink-3);display:grid;place-items:center;padding:0;cursor:pointer}
.cdcfout{margin:0 auto 6px;max-width:760px}
.cdcvoet{display:flex;justify-content:flex-end;max-width:760px;margin:4px auto 0;font-size:11px;color:var(--ink-3);min-height:0}
.cdchint{display:none}
@media (pointer:fine){.cdchint{display:inline}} /* v25.53 (COMMUNITY-CHAT, B1, herstel tegenlezer T-4): de sneltoets-hint alleen op een apparaat met muis of trackpad */ /* v25.53 (COMMUNITY-CHAT, integrator): alleen pointer:fine — elf oudere suites scannen de css-staart op het h-woord en verbieden het ook in een media-query */
.cdcteller{font-size:11px;color:var(--ink-3);align-self:center;flex:none}
.cdcemojimenu{position:absolute;right:10px;bottom:calc(100% - 4px);display:grid;grid-template-columns:repeat(5,40px);gap:2px;padding:6px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 30px color-mix(in srgb,var(--ink) 18%,transparent);z-index:1}
.cdcbalk{overflow:visible}
.cdcemojimenu button{width:40px;height:40px;border:0;border-radius:10px;background:transparent;font:inherit;font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center}
.cdcemojimenu button:focus-visible{outline:2px solid var(--accent)}
.cdctypslot{min-height:0;font-size:12px;color:var(--ink-3);max-width:760px;margin:0 auto}
body.cdcchat .fab{display:none}
body.cdcchat .kanaalview{padding-bottom:calc(var(--cdc-balk-h,96px) + 8px)}
body.cdcchat:not(.cdkkanaal) .cdcbalk{bottom:var(--tabh,62px)}
body.cdcchat:not(.cdkkanaal) .kanaalview{padding-bottom:calc(var(--cdc-balk-h,96px) + var(--tabh,62px) + 8px)}
body.cdcchat .kanaalkop .paneelknop{position:relative;-webkit-text-fill-color:transparent}
body.cdcchat .kanaalkop .paneelknop::before{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translate(-30%,-50%) rotate(45deg)}
@media (min-width:768px){body.cdcchat .cdcbalk{bottom:var(--tabh,62px)}body.cdcchat .kanaalview{padding-bottom:calc(var(--cdc-balk-h,96px) + var(--tabh,62px) + 8px)}body.cdcchat .kanaalkop .paneelknop{-webkit-text-fill-color:currentColor}body.cdcchat .kanaalkop .paneelknop::before{content:none}}
@media (min-width:1180px){body.cdkactief.commfeed .cdcbalk{left:var(--cdk-paneel-b,240px)}}
.cdczend .cdcstuur{transform:scale(.9)}
.cdcstuur{transition:transform .12s ease}
@media (prefers-reduced-motion:reduce){.cdczend .cdcstuur{transform:none}.cdcstuur{transition:none}}
/* cdc deel 2 (B2) */
/* v25.53 (COMMUNITY-CHAT, B2): chatregels in een open kanaal — groepering per auteur, kleur per schuilnaam, dagscheiders, inglijden, reactie-pop, typslot onder de balk, online-stip, ledenkolom, pil boven de balk, werkbalk. Alleen tokens; de klassen komen uit het blok v25.53 community-chat (deel 2). */
body.cdcchat{--cdc-line:var(--line)}
/* naamkleur: inline via cdcNaamKleur (de id-regel op .pname gaat vóór een klasse) */
.post.cdcvervolg>.pavatar{visibility:hidden;height:0;min-height:0;margin:0;overflow:hidden}
.post.cdcvervolg>.pbody{margin-top:0} /* T-2: de rij zelf is compact (inline padding 2px 0 via cdcRijenBij) */ /* v25.53 (COMMUNITY-CHAT, B2, herstel tegenlezer T-2) */
body.cdcchat .reactiewrap.cdcleeg{min-height:0;height:0;margin-top:0;overflow:hidden} /* T-2: de lege reactiewrap (min-height 24px, r. 2529) neemt geen ruimte; cdcleeg via cdcLeegBij, zonder ouder-selector */ /* v25.53 (COMMUNITY-CHAT, B2, herstel tegenlezer T-2) */
.post.cdcvervolg .pmeta{position:absolute;left:0;top:2px;width:38px;justify-content:center;gap:0;pointer-events:none}
.post.cdcvervolg .pmeta>:not(.ptijd){display:none}
.post.cdcvervolg .ptijd{opacity:0;font-size:10px;line-height:1.2;color:var(--ink-3);transition:opacity .12s ease;white-space:nowrap}
.post.cdcvervolg:focus-within .ptijd,.post.cdcvervolg.cdctijd .ptijd,.post.cdcvervolg.cdcwbopen .ptijd{opacity:1}
.post.cdcgroep{--line:transparent}
.post.cdcgroep>.pavatar,.post.cdcgroep>.pbody,.post.cdcgroep>.cdcwerkbalk{--line:var(--cdc-line)}
.post[data-cdcdag]::before{content:attr(data-cdcdag);display:block;text-align:center;font-size:11px;color:var(--ink-3);margin:14px 0 8px;letter-spacing:.04em;text-transform:uppercase;grid-column:1/-1}
.datumscheiding+.post[data-cdcdag]::before{display:none} /* renderFeedList tekent zelf al een daglabel (v25.38 .datumscheiding) — dan geen tweede; de dagscheider van deel 2 is het vangnet zonder daglabel */
.post.cdcin{animation:cdcin .18s ease-out}
@keyframes cdcin{from{opacity:0;transform:translateY(6px)}}
.reactiechip.cdcnieuw{animation:cdcpop .18s ease-out}
@keyframes cdcpop{0%{transform:scale(1)}50%{transform:scale(1.25)}100%{transform:scale(1)}}
.cdctypslot{min-height:0;font-size:12px;color:var(--ink-3);max-width:760px;margin:0 auto}
.cdctypslot .cdltypen{margin:0 0 4px}
.cdcstip{width:8px;height:8px;border-radius:50%;background:var(--good-text);display:inline-block;margin-right:4px;vertical-align:middle}
body.cdcchat .cdlonline{display:inline-flex;align-items:center;gap:2px}
body.cdcchat .cdlonline .cdcstip{background:var(--accent)}
.cdlonline.cdcpuls .cdcstip{animation:cdcpuls .6s ease-out}
@keyframes cdcpuls{50%{transform:scale(1.6)}}
.cdcpil{bottom:calc(var(--cdc-balk-h,96px) + 12px)}
.post.pending{opacity:.6}
body.cdcchat .post .hovacts{visibility:hidden;height:0;min-height:0;overflow:hidden}
.cdcwerkbalk{position:absolute;right:6px;top:auto;bottom:calc(100% - 2px);display:none;gap:2px;padding:2px;border-radius:10px;background:var(--card);border:1px solid var(--line-2);box-shadow:0 6px 18px color-mix(in srgb,var(--ink) 12%,transparent);z-index:3} /* v25.53 (COMMUNITY-CHAT, B2, herstel tegenlezer T-3): de balk hangt bóven de kaart (bottom = kaarttop + 2 px = de vervolg-padding), snijdt de tekst niet */
.cdcwerkbalk .cdcwb{appearance:none;border:0;background:transparent;color:var(--ink-2);width:32px;height:32px;border-radius:8px;display:grid;place-items:center;cursor:pointer}
.cdcwerkbalk .cdcwb[data-cdcwb="verwijder"]{color:var(--bad-text,var(--bad))}
.cdcwerkbalk .cdcwb:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.post.cdcwbopen>.cdcwerkbalk,.post:focus-within>.cdcwerkbalk{display:inline-flex}
.post.cdceerste.cdcmuis>.cdcwerkbalk,.post.cdcvervolg.cdcmuis>.cdcwerkbalk{display:inline-flex}
.post.cdcvervolg.cdcmuis .ptijd{opacity:1}
.cdcleden{display:none}
@media (min-width:1180px){body.cdcchat.commfeed .cdcleden{display:block;box-sizing:border-box;padding:12px;border-left:1px solid var(--line);font-size:13px;align-self:start;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto}} /* T-4: gridkolom 2 ín de feedkolom (grid-column/-row inline via cdcLedenBij; de kolommen inline op het element feedHome — de id-regel op 680 px overstemt een klasse), niet fixed: schuift mee met schuifbalk en zoom */ /* v25.53 (COMMUNITY-CHAT, B2, herstel tegenlezer T-4) */
.cdcledenkop{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px;font-size:12px;color:var(--ink-3)}
.cdcledenkop b{color:var(--ink);font-size:13px}
.cdcledenleeg{margin:0;font-size:12px;color:var(--ink-3)}
@media (prefers-reduced-motion:reduce){.post.cdcin,.reactiechip.cdcnieuw,.cdlonline.cdcpuls .cdcstip{animation:none;transform:none}.post.cdcvervolg .ptijd{transition:none}}
/* cdc deel 3 (B3) */
/* v25.53 (COMMUNITY-CHAT, B3): de Toren-kaart Community in de tab — tegels, klapsecties in hele rijen (v25.53 (COMMUNITY-CHAT, B3, herstel tegenlezer T-10)), verwijsregel, rust- en voettekst */
.cdcbeheer .cdctegels{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.cdcsecties{display:grid;gap:8px}
@media (min-width:768px){.cdcsecties{grid-template-columns:1fr 1fr}.cdcsecties [data-cdc-sectie]{grid-column:1/-1}} /* v25.53 (COMMUNITY-CHAT, B3, herstel tegenlezer T-10): elke klapsectie over de volle breedte — hele rijen, geen ongelijke tweekolomsgrid */
.cdcverwijs{margin:0 0 8px}
.cdcrust{color:var(--ink-3)}
.cdcbvoet{font-size:11px;color:var(--ink-3)} /* v25.53 (integrator, COMMUNITY-CHAT): B3-beheervoet los van B1's .cdcvoet (tegenlezer T-11) */

/* v25.53 — LIVEBLOG-KOP */
.lbtekst.lepb .lekop,.lbtekst.lekaltekst .lekop{font:800 16px/1.3 "Archivo",sans-serif; letter-spacing:-.01em; color:var(--ink); margin:0 0 6px} /* v25.53 (LIVEBLOG-KOP): de kop van een persbericht- en kalenderitem in het liveblog als echte titel, zoals de kop van een beursbericht (Rabi 12-9: "Deze titels in live news moeten worden aangepast omdat ze niet als titel worden weergeven") */
/* v25.54 — CK-KERN */
/* v25.54 (COMMUNITY-KWALITEIT, CK-A): de ck-kaartvorm in een open algemeen kanaal (blok v25.54 ck-kern). Alleen tokens, licht en donker. De kaartlaag zelf
   (kolommen 54 px, 2 px boven/onder, 15 px rechts, 12 px tussen groepen en 0 binnen een groep) staat inline op de kaart: de id-regels van de feedlijst
   (twee id-selectors, r. 2447 e.v.) overstemmen elke klasse-regel en deze staart draagt geen id-selectors (de staart-scans van oudere suites lezen elke
   latere staart). Het aanwijs-gedrag (werkbalk, korte tijd) komt via de klasse cdcmuis van het chat-blok; tik = cdctijd, lang indrukken = cdcwbopen. */
.post.ck>.pavatar.init{width:36px;height:36px;min-width:36px;margin:2px 4px 2px 0;justify-self:end}
.post.ck>.pbody{min-width:0}
.post.ck>.pbody>.ckacties{display:none}
.post.ck>.pbody>.pmeta .bewerkt{font-size:11px;font-style:italic;color:var(--ink-3)}
.post.ck>.pbody>.pmeta .ptijd time{font-variant-numeric:tabular-nums}
.post.ck>.cktijdkolom{display:flex;justify-content:flex-end;align-items:flex-start;padding:3px 4px 0 0;min-height:1em}
.post.ck .cktijd{font-size:.7em;line-height:1.5;color:var(--ink-3);white-space:nowrap;font-variant-numeric:tabular-nums;opacity:0;transition:opacity .12s ease}
.post.ck .cktijd.ckbewerkt{opacity:1;font-style:italic;font-size:.62em}
.post.ck.cdcmuis .cktijd,.post.ck.cdctijd .cktijd,.post.ck.cdcwbopen .cktijd,.post.ck:focus-within .cktijd{opacity:1}
.post.ck>.pbody>.reactiewrap{margin-top:0;min-height:0}
.post.ck>.pbody>.reactiewrap>.reactierij{margin-top:4px}
.post.ck>.pbody>.replyctx{display:flex;align-items:center;gap:6px;margin:0 0 2px;max-height:1.5em;font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden}
.post.ck>.pbody>.replyctx>.rlijn{width:22px;height:12px;border-left:2px solid var(--line-2);border-top:2px solid var(--line-2);border-radius:4px 0 0 0;margin-top:10px;flex:none}
.post.ck>.pbody>.replyctx>b{flex:none;color:var(--ink-2)}
.post.ck>.pbody>.replyctx>i{color:var(--ink-3)}
.post.ck .ckmini{width:14px;height:14px;min-width:14px;border-radius:50%;font-size:8px;overflow:hidden;flex:none;display:inline-grid;place-items:center}
.post.ck .ckquotetekst{overflow:hidden;text-overflow:ellipsis;min-width:0}
.post.ck>.cdcwerkbalk{right:16px;bottom:auto;top:-18px}
.post.ck.cdcmuis>.cdcwerkbalk{display:inline-flex}
.post.ck.cklicht{animation:cklicht 2s ease-out}
@keyframes cklicht{0%{background:transparent}5%{background:color-mix(in srgb,var(--accent) 16%,transparent)}90%{background:color-mix(in srgb,var(--accent) 16%,transparent)}100%{background:transparent}}
.post.ck .ckquote[data-ckdoel]{cursor:pointer}
.post.ck .ckquote[data-ckdoel]:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.bmenuvlak .plusitem.ckechtenaam{cursor:default;color:var(--ink-2)}
.bmenuvlak .plusitem.ckechtenaam .plusemo svg{display:block;margin:0 auto}
@media (max-width:389px){.post.ck>.pavatar.init{width:32px;height:32px;min-width:32px}}
@media (min-width:1440px){.post.ck .cktijd{font-size:.75em}}
@media (prefers-reduced-motion:reduce){.post.ck .cktijd{transition:none}.post.ck.cklicht{animation:none}}
/* v25.54 — CK-TAGGEN */
/* v25.54 (COMMUNITY-KWALITEIT, CK-B): de suggestielijst boven het invoervak (chatbalk én compose-sheet) en de naam- en kanaal-pills. Alleen tokens, geen id; de bediening leunt nergens op een aanwijs-effect (aanraakscherm): de gemarkeerde rij draagt de klasse actief. */
.cktpopup{position:fixed;left:8px;top:0;z-index:60;display:flex;flex-direction:column;gap:2px;padding:6px;box-sizing:border-box;width:min(480px,calc(100vw - 16px));background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 30px color-mix(in srgb,var(--ink) 18%,transparent);overflow-y:auto;overscroll-behavior:contain;font-size:14px;line-height:1.25}
.cktpopup[hidden]{display:none}
.cktrij{display:flex;align-items:center;gap:10px;min-height:40px;width:100%;padding:6px 10px;margin:0;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.cktrij.actief{background:var(--accent-wash)}
.cktrij:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cktav{width:28px;height:28px;min-height:28px;flex:none;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--seg-bg);font-size:13px;font-weight:700}
.cktav svg{width:28px;height:28px;display:block}
.cktbol{width:14px;height:14px;flex:none;margin:0 7px;border-radius:50%;background:var(--accent)}
.cktteken{width:28px;flex:none;text-align:center;font-weight:700;font-size:16px;color:var(--ink-3)}
.cktemo{width:28px;flex:none;text-align:center;font-size:20px;line-height:1}
.cktnaam{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cktsub{color:var(--ink-3);font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cktbadge{margin-left:auto;flex:none;display:inline-flex;align-items:center}
.cktkemo{font-size:.95em}
.mention[data-ckt-lid],.mention[data-ckt-mijn]{cursor:pointer}
.cashtag.kanaalpil{display:inline-flex;align-items:center;gap:3px;padding:0 6px;border-radius:6px;background:var(--accent-wash);color:var(--accent);font-weight:600;text-decoration:none;vertical-align:baseline}
@media (max-width:420px){.cktpopup{border-radius:12px;padding:4px}.cktrij{padding:6px 8px;gap:8px}}
@media (prefers-reduced-motion:reduce){.cktpopup{transition:none}}
/* v25.54 — CK-ANTWOORDEN */
/* v25.54 (COMMUNITY-KWALITEIT, CK-C): de @-schakel in de antwoord-balk (44 px raakvlak, aria-pressed; uit = gedempt) en de swipe-naar-antwoorden op een
   aanraakscherm (blok v25.54 ck-antwoorden: de kaart schuift mee via een inline transform, de pijl-glyph komt uit deze staart). Alleen tokens, geen
   id-regels, geen voorrangsvlag; de bediening leunt nergens op een aanwijs-effect: toetsenbord via :focus-visible, aanraking via de klassen ckswipe en
   ckswipeklaar die het blok zet. Het pseudo-element staat absoluut, dus buiten de grid-stroom van de kaart. */
.ckavermeld{display:inline-flex;align-items:center;justify-content:center;gap:2px;min-width:44px;min-height:44px;margin:-8px 0;padding:0 6px;border:0;border-radius:12px;background:transparent;color:var(--accent);font:inherit;font-size:12px;font-weight:600;line-height:1;cursor:pointer;flex:none;-webkit-tap-highlight-color:transparent}
.ckavermeld[hidden]{display:none}
.ckavermeld .ckaat{font-size:15px;font-weight:700}
.ckavermeld .ckastand{text-transform:uppercase;letter-spacing:.04em;font-size:10.5px}
.ckavermeld[aria-pressed="false"]{color:var(--ink-3)}
.ckavermeld:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.post.ck.ckswipe{will-change:transform}
.post.ck.ckswipe::before{content:"\21a9";position:absolute;left:-44px;top:50%;width:32px;height:32px;margin-top:-16px;border-radius:50%;display:grid;place-items:center;font-size:16px;line-height:1;color:var(--ink-3);background:var(--card-2);border:1px solid var(--line);opacity:.7;transition:color .12s ease,background .12s ease,opacity .12s ease;pointer-events:none}
.post.ck.ckswipe.ckswipeklaar::before{color:var(--accent);background:var(--accent-wash);border-color:var(--accent);opacity:1}
@media (max-width:389px){.ckavermeld{padding:0 4px}}
@media (prefers-reduced-motion:reduce){.post.ck.ckswipe::before{transition:none}}
/* v25.54 — CK-KOP */
/* v25.54 (COMMUNITY-KWALITEIT, CK-D): alleen-lezen kanaal — de chatbalk toont voor een gewoon lid één zin (id ckkAlleenLezen, via klasse) en verbergt invoerrij, voet, foutregel, quote en emoji-menu (Discord: geen invoerveld); tokens, geen id-regels */
.cdcbalk.ckkdicht .cdcrij,.cdcbalk.ckkdicht .cdcvoet,.cdcbalk.ckkdicht .cdcfout,.cdcbalk.ckkdicht .cdcquote,.cdcbalk.ckkdicht .cdcemojimenu{display:none}
.ckkalleenlezen{margin:0;padding:12px 14px;font-size:13px;line-height:1.4;color:var(--ink-3);text-align:center}
/* v25.54 (COMMUNITY-KWALITEIT, nazorg CK-J): de kanaalkop op een smal scherm (doorloop CK-F, punt 2). Alleen met de klasse ckkkop die het blok ck-kop in ck-stand
   op de kop zet (zonder het blok of op de terugweg blijft alles zoals het was) en alleen onder 480 px; op 768 en 1440 px doet dit niets. De naam krijgt het
   weglatingsteken op de naam zelf (in de flex-kop knipt de b anders zonder teken), de volgknop wordt een vierkant met alleen het teken van haar stand — de
   volle tekst blijft in title/aria-label (het blok) en voor hulpmiddelen in de knop (doorzichtig, niet weg). Tokens, geen id-regels, geen voorrangsvlag; de
   padding en lettergrootte van de knop komen uit de bestaande regels. */
@media (max-width:479px){
  .kanaalkop.ckkkop .kanaalnaam b>span:not(.khash):not(.kpijl){min-width:0;overflow:hidden;text-overflow:ellipsis}
  .kanaalkop.ckkkop .volgknop{position:relative;width:32px;min-width:32px;height:32px;overflow:hidden;color:transparent;box-sizing:border-box}
  .kanaalkop.ckkkop .volgknop::before{content:"\2713";position:absolute;inset:0;display:grid;place-items:center;font-size:14px;line-height:1;color:var(--ink-2)}
  .kanaalkop.ckkkop .volgknop.vuit::before{content:"+";font-size:17px;color:var(--accent-tekst)}
  .kanaalkop.ckkkop .volgknop.vauto::before{content:"\25cf";font-size:12px;color:var(--accent)}
  .kanaalkop.ckkkop .volgknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
}
/* v25.54 — BEHEER-REVAMP */
/* v25.54 (COMMUNITY-KWALITEIT, CK-E — BEHEER-REVAMP; Rabi 12-9 "moet professioneler"): één vormtaal voor /beheer op de Toren-huisstijl (blok v25.54 beheer-revamp).
   De kop plakt (één statusregel in bhSub), de sectie-/eyebrow-koppen plakken niet meer; de tabkiezer is altijd één rij (Klassiek verborgen); één knoppenset
   (.bhknop 40 px · .primair · .gevaar · .bhlink alleen inline · keuzerijen .brseg); tegels met het label boven het cijfer, geen vinkje-, uitroepteken- of kruisje-voorvoegsel, kleur alleen
   op een drempel; het lijntje van een Toren-tegel altijd onder het cijfer (geen afgekapte woorden op 1180–1440 px); de betekenisregel niet meer afgekapt;
   formulierlabels in gewone letters (geen hoofdletters, niet per letter afgebroken); leesbare actieve schakelaar in het lichte thema; mobiel-eerst (één kolom,
   tegels 2 per rij, tabellen ≤ 4 kolommen tenzij uitgeklapt, knoppen volle breedte in .bhacties onder 480 px). Alleen tokens en color-mix, geen id-selectors,
   geen hex, geen muiseffect (alleen :focus-visible en [aria-pressed]), prefers-reduced-motion gerespecteerd. */
.bhview .viewhead{position:sticky; top:0; z-index:6; background:var(--ground); margin:0 -4px 8px; padding:6px 4px 8px; border-bottom:1px solid var(--line)}
.bhview .viewhead .viewsub{font-size:12.5px; color:var(--ink-2); font-variant-numeric:tabular-nums}
.bhview .bhsectiekop{position:static}
.bhview .b3sectie>summary{position:static; min-height:44px; box-sizing:border-box}
.bhview .b3stand{display:none}
/* tabkiezer: vier knoppen op één rij op elke breedte; de verborgen knop Klassiek telt niet mee. Alleen met de klasse .brtabs (gezet door het blok): zonder het blok — de terugweg, of een pagina die alleen delen van de app laadt — blijft de bestaande 3 + 2-indeling van vijf knoppen gelden */
.bhview .bktabs.brtabs{display:flex; flex-wrap:nowrap; gap:2px; overflow:hidden}
.bhview .bktabs.brtabs button,.bhview .bktabs.brtabs button:first-child:nth-last-child(5),.bhview .bktabs.brtabs button:first-child:nth-last-child(5) ~ button,.bhview .bktabs.brtabs button:first-child:nth-last-child(5) ~ button:nth-child(n+4){flex:1 1 0; grid-column:auto; min-width:0; min-height:40px; padding:8px 6px; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.bhview .bktabs button[hidden]{display:none}
@media (max-width:479px){ .bhview .bktabs.brtabs{display:flex; grid-template-columns:none} .bhview .bktabs.brtabs button,.bhview .bktabs.brtabs button:first-child:nth-last-child(5),.bhview .bktabs.brtabs button:first-child:nth-last-child(5) ~ button,.bhview .bktabs.brtabs button:first-child:nth-last-child(5) ~ button:nth-child(n+4){flex:1 1 auto; font-size:12px; padding:8px 3px; letter-spacing:-.01em} }
@media (min-width:480px) and (max-width:1023px){ .bhview .bktabs.brtabs{flex-wrap:nowrap} }
/* één knoppenset */
.bhview .bhknop{min-height:40px; padding:9px 14px; border-radius:12px; font-size:12.5px; display:inline-flex; align-items:center; justify-content:center; gap:6px; line-height:1.2; white-space:normal; text-align:center}
.bhview .bhknop.primair,.bhview .bhknop.pbprimair,.bhview .bhknop.cdbprimair,.bhview .cdbtab .bhknop.cdbprimair{background:var(--accent); color:var(--accent-tekst); border-color:var(--accent)}
.bhview .bhknop.gevaar{border-color:var(--bad); color:var(--bad-text); background:var(--card)}
.bhview .bhknop.brlink{border:none; background:transparent; color:var(--accent); text-decoration:underline; text-underline-offset:2px; padding:9px 6px}
.bhview .cdbtab .bhknop[aria-label]{min-width:40px}
.bhview .b3inz .bhlink{min-width:40px; min-height:40px; display:inline-flex; align-items:center; justify-content:center; border-radius:10px; vertical-align:middle}
.bhview details.bhklap>summary{min-height:44px; display:flex; align-items:center; gap:6px; padding:6px 0}
.bhview .pbmenu>summary{min-width:44px; min-height:44px}
.bhview .bhverversen{min-height:40px; padding:8px 14px}
.bhview .viewhead .terugknop{width:40px; height:40px}
.bhview .bhlink:not(.brlink){padding:12px 0} /* tikdoel 40 px hoog zonder de regel te verschuiven (verticale padding op een inline element) */
.bhview .seg button,.bhview .pbzicht button,.bhview button.pbvlag,.bhview .pbaandraag .pbp1schakel button{min-height:40px}
.bhview .pbtitel{min-height:40px; display:flex; align-items:center; min-width:0}
.bhview .pbvak>details.bhklap>summary{text-transform:none; letter-spacing:0; font-size:12.5px; color:var(--accent)}
.bhview .pbmeer>summary,.bhview .pbverborgen>summary{min-height:44px}
/* tegels: label boven het cijfer, geen voorvoegsel, kleur alleen op een drempel */
.bhview .bhstat{display:flex; flex-direction:column; gap:2px; border-radius:14px; padding:10px 12px}
.bhview .bhstat>span{order:-1; font-size:12px; color:var(--ink-2); display:block; -webkit-line-clamp:unset; overflow:visible}
.bhview .bhstat b{font-size:20px; line-height:1.15}
.bhview .bhstat b::before{content:none}
.bhview .bhstat.goed{border-color:var(--line)}
.bhview .bhstat.hoofd{border-color:var(--accent)}
.bhview .b3toren .bhstat b{font-size:20px}
/* v25.54 (COMMUNITY-KWALITEIT, BEHEER-REVAMP, testonderhoud CK-I): Klassiek is de terugweg en houdt de tegelmaat van v25.49 (18 px, 17 px op smal) — de algemene 20 px-regel hierboven won anders op gelijke specificiteit van de v25.49-regel; Overzicht en Onderdelen blijven 20 px */
.bhview .bkgrid .bhstat b{font-size:18px}
@media (max-width:359px){ .bhview .bkgrid .bhstat b{font-size:17px} }
.bhview .b3lbl{font-size:12px; color:var(--ink-2); padding-right:0}
.bhview .b3cijfer{padding-right:0}
.bhview .b3sparkwrap{position:static; width:100%; height:24px; margin-top:2px}
.bhview .b3spark{width:100%; height:24px}
.bhview .b3bet{display:block; -webkit-line-clamp:unset; overflow:visible; font-size:12.5px}
/* uitleg en lopende tekst: 12,5 px in ink-2 */
.bhview .bhleeg,.bhview .b3leeg,.bhview .bhkop span,.bhview .b3secsub{font-size:12.5px; color:var(--ink-2)}
.bhview .bhsigtekst .bhtijd,.bhview .bhlijst .bhtijd{color:var(--ink-2)}
.bhview .bhchip,.bhview .b3chip{font-size:11px; padding:1px 7px}
/* keuzerijen (Koersen: gedeelde koersronde · verversen in de app · snelle koersen · live doorsturen; Assistent: aanbieder) */
.bhview .brseg{display:flex; flex-direction:column; gap:4px; margin-top:10px}
.bhview .brseglbl{font-size:12px; font-weight:600; color:var(--ink-2)}
.bhview .brseg .laknoppen{display:inline-flex; flex-wrap:wrap; gap:3px; margin:0; padding:3px; background:var(--seg-bg); border:1px solid var(--line); border-radius:12px; align-self:flex-start; max-width:100%}
.bhview .brseg .laknoppen .bhknop{border-color:transparent; background:transparent; min-height:40px; padding:8px 12px; border-radius:9px; color:var(--ink-2)}
.bhview .brseg .laknoppen[data-brsolo]{background:transparent; border:none; padding:0}
.bhview .brseg .laknoppen[data-brsolo] .bhknop{border-color:var(--line-2); background:var(--card); border-radius:12px}
.bhview .brseg .laknoppen .bhknop[aria-pressed="true"]{border-color:var(--accent); color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--card))}
.bhview .brseg .laknoppen .bhknop.uit[aria-pressed="true"]{border-color:var(--bad); color:var(--bad-text); background:color-mix(in srgb, var(--bad) 12%, var(--card))}
.bhview .laknoppen .bhknop[aria-pressed="true"]{color:var(--accent)}
.bhview .bruitleg{margin:2px 0 0}
.bhview .bhveld .bhknop{flex:none}
/* kaarten op Onderdelen: acties onderaan in één rij, de klap 'Wat betekent dit?' als laatste */
.bhview .bracties{margin-top:10px; padding-top:8px; border-top:1px solid var(--line)}
.bhview .brwat{margin-top:8px}
.bhview .brnaar{margin:8px 0 0; font-size:12.5px}
.bhview .brnaar .bhlink{font-weight:600; min-height:40px; display:inline-flex; align-items:center}
.bhview .brmeerklap>summary{font-size:12.5px}
.bhview .brmeer{margin-top:8px}
/* Onderdelen: de negen secties in dezelfde vorm als het Overzicht */
.bhview .bhsecties{gap:10px}
.bhview .brsectie .brgrid{margin:0}
.bhview .brsectie>summary .b3chip{margin-left:2px}
@media (min-width:1180px){ .bhview .brsectie .brgrid{grid-template-columns:repeat(3, minmax(0,1fr)); grid-auto-flow:dense} .bhview .brgrid>.bhkaart:only-child{grid-column:span 2} }
/* staten */
.bhview .brstaat{margin:6px 0}
.bhview .brladen .b3nu{margin-bottom:6px}
.bhview .bhleeg.bhfout .bhknop{margin-left:6px; vertical-align:middle}
/* formulierlabels in gewone letters, nooit per letter afgebroken (Community en Persberichten) */
.bhview .cdbtab label,.bhview .cdbtab .cdbcheck,.bhview .cdbtab .cdbradio,.bhview .cdbveld>span,.bhview .cdblabel,.bhview .pbform label,.bhview .pbveld>span,.bhview .pbwform label{text-transform:none; letter-spacing:0; font-size:12.5px; font-weight:600; color:var(--ink-2); margin-top:0; overflow-wrap:normal}
.bhview .b3klapin .cdbsub,.bhview .b3klapin form,.bhview .cdbtab .cdbcheck,.bhview .cdbtab .cdbradio{overflow-wrap:normal}
.bhview .cdbtab .cdbcheck,.bhview .cdbtab .cdbradio{min-height:40px; align-items:center}
.bhview .cdbtab .cdbcheck input,.bhview .cdbtab .cdbradio input{width:18px; height:18px}
.bhview .brwoord{flex-direction:row; align-items:center; justify-content:space-between; gap:8px}
.bhview .brwoordform{margin:8px 0 4px}
.bhview .brwoordform select{flex:1 1 160px; min-width:0; padding:7px 10px; border:1px solid var(--line-2); border-radius:10px; background:var(--input-bg); color:var(--ink); font:inherit; font-size:13px}
/* persberichtenrij: de knoppen nooit breder dan de helft, de titel houdt altijd ruimte (op de basis werd de titel op een smalle kaart 0 px breed) */
.bhview .pbwrij .bhsigknoppen{flex-wrap:wrap; max-width:55%; row-gap:6px}
@media (max-width:1023px){ .bhview .pblijst li.pbwrij{grid-template-columns:20px minmax(0,1fr)} .bhview .pbwrij .bhsigknoppen{grid-column:2; grid-row:auto; max-width:none; justify-content:flex-start} }
/* mobiel-eerst */
@media (max-width:479px){
  .bhview .bhacties:not(.cdbacties) .bhknop{flex:1 1 100%}
  .bhview .bhscroll.brbreed:not(.bralles) .bhtabel td:nth-child(n+5),.bhview .bhscroll.brbreed:not(.bralles) .bhtabel th:nth-child(n+5){display:none}
  .bhview .brkolommen{display:inline-flex; min-height:40px; align-items:center; font-size:12.5px; margin:2px 0 6px}
  .bhview .brseg .laknoppen{display:flex; width:100%}
  .bhview .brseg .laknoppen .bhknop{flex:1 1 auto}
}
@media (min-width:480px){ .bhview .brkolommen{display:none} .bhview .bhscroll.brbreed .bhtabel td:nth-child(n+5),.bhview .bhscroll.brbreed .bhtabel th:nth-child(n+5){display:table-cell} }
@media (prefers-reduced-motion:reduce){ .bhview .brladen .b3tegel{animation:none} .bhview .brmeerklap>summary::before,.bhview .brwat>summary::before{transition:none} }
/* v25.55 — CDN-KERN */
/* v25.55 (COMMUNITY-DESIGN, K1): de gastheer van de nieuwe chatweergave (blok v25.55 cdn-kern): raster rail 72 / kanalen 240 / chat / rechterpaneel 280, de kanalenlijst en het kanaalscherm op een telefoon, de kanaalkop, de chatbalk, het plus-menu, het rechterpaneel (Leden, Vastgepind), de sheet, de modal en de knop-/segment-/schakelaarhelpers. Regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji; alles hangt aan body.cdnactief of aan een cdn-klasse — in stand uit en op de terugweg staat er niets van in de DOM. Kleurmapping ontwerp naar app: rail = --seg-bg, zijvlak/paneel = --ground, chat = --card, invoer = --seg-bg, kaart = --ground, accent = --accent, accentvlak = --accent-wash, actief = --card-2. */
.cdnhost{display:grid;grid-template-columns:72px 240px minmax(0,1fr);min-height:100svh;width:100%;box-sizing:border-box;color:var(--ink);background:var(--card)}
body.cdnrechts .cdnhost{grid-template-columns:72px 240px minmax(0,1fr) 280px}
.cdnhost>.cdnrail,.cdnhost>.cdnkanalen,.cdnhost>.cdnrechts{position:sticky;top:0;height:100svh;align-self:start;overflow:auto;box-sizing:border-box;scrollbar-width:thin}
.cdnhost>.cdnchat{min-width:0;min-height:100svh;background:var(--card);display:block;position:relative}
.cdnhost>.cdnchat>.kanaalview{margin:0;max-width:none;width:100%;box-sizing:border-box}
.cdnhost>.cdnkanalenlijst{display:none}
.cdnico{display:block;flex:none}
/* rail */
.cdnrail{display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 0;background:var(--seg-bg)} /* v25.55 (COMMUNITY-DESIGN, P-7): rail zonder rechterrand (ontwerp r. 34: alleen het vlak) */
.cdnlogo{display:block;width:48px;height:48px;border-radius:16px;overflow:hidden;box-shadow:0 0 0 2px var(--accent);margin-bottom:6px;flex:none}
.cdnlogo img{width:100%;height:100%;display:block}
.cdnrailknop{appearance:none;border:0;cursor:pointer;width:64px;padding:8px 0 6px;border-radius:12px;background:transparent;color:var(--ink-3);display:flex;flex-direction:column;align-items:center;gap:3px;font:700 10px "IBM Plex Sans",sans-serif;flex:none}
.cdnrailknop.aan{background:var(--accent-wash);color:var(--accent)}
.cdnrailknop:focus-visible,.cdnthema:focus-visible,.cdnavatar:focus-visible,.cdnkop:focus-visible,.cdnrij:focus-visible,.cdncatkop:focus-visible,.cdnvoetknop:focus-visible,.cdnvoetstatus:focus-visible,.cdnkopknop:focus-visible,.cdnrechtssluit:focus-visible,.cdnlid:focus-visible,.cdnpinlos:focus-visible,.cdnplusitem:focus-visible,.cdnzoekres:focus-visible,.cdnstatusknop:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.cdnrailrek{flex:1}
.cdnthema{appearance:none;cursor:pointer;width:40px;height:40px;border-radius:20px;border:1px solid var(--line);background:var(--ground);color:var(--ink-2);display:grid;place-items:center;padding:0;flex:none}
.cdnavatar{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;position:relative;width:40px;height:40px;flex:none;display:block}
.pavatar.init.cdnav40{width:40px;height:40px;min-width:40px;cursor:pointer}
.pavatar.init.cdnav34{width:34px;height:34px;min-width:34px}
.pavatar.init.cdnav32{width:32px;height:32px;min-width:32px}
.pavatar.init.cdnav36{width:36px;height:36px;min-width:36px}
.cdnstip{position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;background:var(--good);border:2.5px solid var(--seg-bg);box-sizing:border-box}
.cdnstip.dnd{background:var(--bad)}
.cdnstip.offline{background:var(--ink-3)}
.cdnstip.afwezig{background:var(--gold)}
/* kanalenpaneel (desktop) */
.cdnkanalen{display:flex;flex-direction:column;background:var(--ground);border-right:1px solid var(--line)}
.cdnkop{appearance:none;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;height:52px;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 16px;font:700 15px "IBM Plex Sans",sans-serif;text-align:left;flex:none}
.cdnkop .cdnico{color:var(--ink-3)}
.cdnkopnaam{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnzoekwrap{position:relative;padding:10px 10px 4px;flex:none}
.cdnzoekico{position:absolute;left:20px;top:50%;transform:translateY(-50%);margin-top:3px;color:var(--ink-3);pointer-events:none;display:block}
.cdnzoek{width:100%;box-sizing:border-box;border:0;border-radius:8px;background:var(--seg-bg);color:var(--ink);padding:7px 10px 7px 30px;font:inherit;font-size:13px;min-height:32px}
.cdnzoek::placeholder{color:var(--ink-3)}
.cdnzoek:focus-visible{outline:2px solid var(--accent)}
.cdnzoekdrop{position:absolute;left:10px;right:10px;top:calc(100% - 2px);z-index:6;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:4px;max-height:60svh;overflow:auto}
.cdnzoekres{appearance:none;border:0;background:transparent;color:var(--ink);width:100%;text-align:left;display:flex;align-items:center;gap:8px;padding:8px 8px;border-radius:7px;cursor:pointer;font:inherit;font-size:13px;min-height:36px}
.cdnzoekres b{font-weight:600;white-space:nowrap}
.cdnzoekres span:last-child{color:var(--ink-3);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cdnzoekres.eerste{background:var(--card-2)}
.cdnzoekleeg{padding:10px 8px;font-size:12.5px;color:var(--ink-3)}
.cdnlijst{flex:1;overflow:auto;padding:4px 8px 8px;min-height:0}
.cdnleeg{margin:0;padding:14px 8px;font-size:13px;color:var(--ink-3)}
.cdncat{margin-top:14px}
.cdncatkop{appearance:none;border:0;background:transparent;cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:4px;padding:2px 4px;font:700 11px "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);user-select:none;border-radius:4px;min-height:24px}
.cdncatkop.cdncatvast{cursor:default;padding-left:18px}
.cdncatkop .cdnico{width:10px;height:10px;flex:none}
.cdnrij{appearance:none;border:0;background:transparent;cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:6px;padding:6px 8px;margin:1px 0;border-radius:6px;color:var(--ink-2);font:inherit;font-size:14px;line-height:1.3;min-height:30px;box-sizing:border-box}
.cdnrij.actief{font-weight:700;background:var(--card-2);color:var(--ink)} /* v25.55 (COMMUNITY-DESIGN, P-3): vet op de neutrale achtergrond (ontwerp c.weight 700 en c.bg = actief = --card-2), niet de accentwas */
.cdnrij.ongelezen{color:var(--ink);font-weight:700}
.cdnrij.gedempt{color:var(--ink-3)}
.cdnrij.vergrendeld{color:var(--ink-3);cursor:default}
.cdnrijico{color:var(--ink-3);display:inline-grid;place-items:center;width:16px;flex:none;font:600 15px/1 "IBM Plex Sans",sans-serif}
.cdnrij.actief .cdnrijico{color:var(--ink-2)}
.cdnrijnaam{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnteller{background:var(--bad);color:var(--merk-op-blauw);font:700 10px/1.3 "IBM Plex Sans",sans-serif;border-radius:8px;padding:1px 6px;flex:none} /* v25.55 (COMMUNITY-DESIGN, P-10): de teller zoals het ontwerp (r. 62: 10 px/700, padding 1px 6px, radius 8; de regelhoogte van het ontwerp is de gewone) */
.cdnongelezen{width:8px;height:8px;border-radius:50%;background:var(--bad);flex:none}
.cdnat{font:700 10px/1 "IBM Plex Sans",sans-serif;color:var(--accent);background:var(--accent-wash);border-radius:8px;padding:3px 6px;flex:none}
.cdnbel{color:var(--ink-3);display:inline-grid;place-items:center;flex:none}
.cdnvoet{height:56px;min-height:56px;display:flex;align-items:center;gap:10px;padding:0 10px;background:var(--seg-bg);border-top:1px solid var(--line);position:relative;flex:none}
.cdnvoetav{position:relative;flex:none;width:34px;height:34px;display:block}
.cdnvoetav .cdnstip{width:11px;height:11px;border-width:2px}
.cdnvoetwie{flex:1;min-width:0;position:relative}
.cdnvoetnaam{font:600 13px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink);display:flex;align-items:center;gap:6px;min-width:0}
.cdnvoetnaam b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cdnbeheerpil{font:700 10px/1 "IBM Plex Sans",sans-serif;padding:3px 5px;border-radius:4px;background:var(--merk-blauw);color:var(--merk-op-blauw);flex:none}
.cdnvoetstatus{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;font:400 11px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink-3);text-align:left;display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:4px}
.cdnstatusmenu{position:absolute;left:0;bottom:calc(100% + 10px);z-index:7;min-width:200px;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px}
.cdnstatusknop{appearance:none;border:0;background:transparent;cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:7px;color:var(--ink);font:600 13px "IBM Plex Sans",sans-serif;min-height:36px}
.cdnstatusknop .cdlstip{position:static;width:10px;height:10px;border-width:1.5px;flex:none}
.cdnstatusknop[aria-checked="true"]{background:var(--accent-wash);color:var(--accent)}
.cdnstatushint{margin:4px 10px 6px;font-size:11px;color:var(--ink-3);line-height:1.4}
.cdnvoetknop{appearance:none;border:0;background:transparent;color:var(--ink-2);cursor:pointer;width:32px;height:32px;border-radius:6px;display:grid;place-items:center;padding:0;flex:none}
/* kanaalkop in de chatkolom: de maten via variabelen (het blok zet ze inline op de kop; de id-regels van de feedkop verliezen zo van het ontwerp) */
.cdnchat .kanaalkop{--cdnkoppad:0 16px;--cdnkoprand:1px solid var(--line);--cdnkopmarge:0;--cdnkophoogte:52px;--cdnkopgap:10px;--cdnterugmaat:44px;--cdnkopknopmaat:34px;background:var(--card);box-sizing:border-box;align-items:center;width:100%}
.cdnchat .kanaalkop .khash{font:600 20px/1 "IBM Plex Sans",sans-serif;color:var(--ink-3)}
.cdnchat .kanaalkop .kanaalsub{display:none}
.cdnchat .kanaalnaam b{overflow:visible}
body.cdnactief .kanaalkop .kpijl{display:none} /* v25.55 (COMMUNITY-DESIGN, P-4): geen pijltje achter de kanaalnaam, ook op een telefoon (ontwerp r. 572: de kanaalnaam met hekje, zonder chevron); verhuisd uit de 768-mediaregel — v25.55 (COMMUNITY-DESIGN, integrator): het hekje-teken staat hier uitgeschreven, de staartscans van fb2-positie-actie C2 en politici-overal verbieden het teken in de hele staart */
/* zoekveld in de kanaalkop (ontwerp r. 86): 150 px, invoerkleur, radius 6, 12 px, de loep rechts; alleen op >= 1180 px (de mediaregel onderaan) */ /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnkopzoek{display:none;align-items:center;gap:8px;width:150px;box-sizing:border-box;flex:none;background:var(--seg-bg);border-radius:6px;padding:6px 10px;color:var(--ink-3);font-size:12px;line-height:16px} /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnkopzoek .cdnico{margin-left:auto;pointer-events:none} /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnkopzoekveld{appearance:none;flex:1;min-width:0;width:auto;border:0;border-radius:0;background:transparent;color:var(--ink);padding:0;margin:0;font:inherit;font-size:12px;line-height:16px;min-height:0;height:16px} /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnkopzoekveld::placeholder{color:var(--ink-3)} /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnkopzoekveld:focus-visible{outline:none;border:0} /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnkopzoek:focus-within{outline:2px solid var(--accent);outline-offset:1px} /* v25.55 (COMMUNITY-DESIGN, P-2) */
.cdnonderwerp{font:400 13px/20px "IBM Plex Sans",sans-serif;letter-spacing:0;color:var(--ink-2);min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:4px;padding-left:10px;border-left:1px solid var(--line)}
.cdnonderwerp[hidden]{display:none}
.cdnkopknoppen{display:inline-flex;align-items:center;gap:2px;flex:none}
.cdnkopknop{appearance:none;border:0;background:transparent;color:var(--ink-2);cursor:pointer;width:34px;height:34px;border-radius:6px;display:inline-grid;place-items:center;padding:0;flex:none}
.cdnkopknop.aan{background:var(--card-2);color:var(--ink)}
body.cdnactief .kanaalkop .paneelknop::before{width:11px;height:11px;border-color:var(--accent);border-width:2.4px}
body.cdnactief .kanaalkop .paneelknop .menudot{display:none}
body.cdnactief.cdcchat.commfeed .cdcleden,body.cdnactief .cdcleden{display:none}
body.cdnactief .drawer.paneel{display:none}
body.cdnactief .appversion{display:none}
/* welkomstblok in een leeg kanaal (ontwerp r. 91-95: cirkel 64 in het actief-vlak, titel 26/800, subregel in ink-2; telefoon r. 578: 22/800, 14 px, zonder cirkel) */ /* v25.55 (COMMUNITY-DESIGN, P-1) */
.cdnwelkom{padding:60px 24px 20px;margin:0 -18px;color:var(--ink)} /* v25.55 (COMMUNITY-DESIGN, P-1): de marge heft de 18 px binnenrand van de berichtenlijst op — het blok begint aan de rand van de chatkolom, zoals in het ontwerp */
.cdnwelkomhash{display:flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:32px;background:var(--card-2);color:var(--ink-2);font:800 26px/1 "IBM Plex Sans",sans-serif} /* v25.55 (COMMUNITY-DESIGN, P-1) */
.cdnwelkomtitel{font:800 26px/1.2 "Archivo",sans-serif;letter-spacing:-.01em;margin-top:14px;overflow-wrap:anywhere} /* v25.55 (COMMUNITY-DESIGN, P-1) */
.cdnwelkomsub{color:var(--ink-2);margin-top:6px;font-size:14px;line-height:1.5;overflow-wrap:anywhere} /* v25.55 (COMMUNITY-DESIGN, P-1) */
/* chatbalk (het ontwerp op de bestaande balk van het chatblok) */
body.cdnactief .cdcbalk{display:flex;flex-direction:column;background:var(--card);border-top:0;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0 16px 16px} /* v25.55 (COMMUNITY-DESIGN, P-5): padding 0 16 16 zoals het ontwerp (r. 214) */
body.cdnactief .cdcbalk>.cdctypslot{order:-1;min-height:20px;margin:0 0 4px;max-width:none;font-size:12px;color:var(--ink-2)}
body.cdnactief .cdcbalk>.cdctypslot .cdltypen{padding:0 4px 2px;min-height:20px}
body.cdnactief .cdcbalk>.cdcquote,body.cdnactief .cdcbalk>.cdcfout{max-width:none;margin-left:0;margin-right:0}
body.cdnactief .cdcbalk>.cdcrij{align-items:center;gap:8px;max-width:none;width:100%;margin:0 auto;box-sizing:border-box;background:var(--seg-bg);border:1px solid var(--line);border-radius:10px;padding:5px 8px 5px 6px} /* v25.55 (COMMUNITY-DESIGN, P-5): de invoerrij over de volle chatkolom (ontwerp r. 226), niet de 760 van de chatstaart */
body.cdnactief .cdcbalk .cdctekst{border:0;border-radius:0;background:transparent;min-height:34px;padding:7px 4px;font-size:14px;line-height:20px}
body.cdnactief .cdcbalk .cdctekst:focus{border-color:transparent}
body.cdnactief .cdcbalk .cdcmeer{width:34px;height:34px;background:var(--card-2);color:var(--ink-2)} /* v25.55 (COMMUNITY-DESIGN, P-5): alleen de plus; de emoji-knop staat hieronder uit */
body.cdnactief .cdcbalk .cdcemoji{display:none} /* v25.55 (COMMUNITY-DESIGN, P-5): het ontwerp kent geen emoji-knop in de balk (r. 226-231: plus, veld, teller, Vertel!) */
body.cdnactief .cdcbalk .cdcmeer.cdnopen{background:var(--accent);color:var(--accent-tekst)}
body.cdnactief .cdcbalk .cdcteller{font-size:11px;color:var(--ink-3);font-variant-numeric:tabular-nums}
body.cdnactief .cdcbalk .cdcteller.cdnrood{color:var(--bad-text)}
body.cdnactief .cdcbalk .cdcstuur{width:auto;height:34px;padding:0 14px;border-radius:8px;background:var(--accent);color:var(--accent-tekst);font:700 13px "IBM Plex Sans",sans-serif}
body.cdnactief .cdcbalk .cdcstuur::after{content:"Vertel!"}
body.cdnactief .cdcbalk .cdcstuur .cdcico,body.cdnactief .cdcbalk .cdcstuur .cdnstuuricoon{display:none}
body.cdnactief .cdcbalk .cdcstuur:disabled{opacity:.5}
body.cdnactief .cdcbalk>.cdcvoet{display:none}
.cdnplusmenu{position:absolute;left:16px;bottom:calc(100% + 6px);width:260px;max-width:calc(100vw - 32px);box-sizing:border-box;background:var(--ground);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px;z-index:5;animation:cdnin .15s ease-out}
.cdnplusitem{appearance:none;border:0;background:transparent;color:var(--ink);cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:7px;font:inherit;box-sizing:border-box}
.cdnplusico{width:22px;display:inline-grid;place-items:center;color:var(--ink-2);flex:none}
.cdnplustekst{display:flex;flex-direction:column;min-width:0}
.cdnplustekst b{font:600 13px/1.3 "IBM Plex Sans",sans-serif}
.cdnplustekst small{font-size:11px;color:var(--ink-3);line-height:1.3}
@keyframes cdnin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* rechterpaneel */
.cdnhost>.cdnrechts{display:flex;flex-direction:column;background:var(--ground);border-left:1px solid var(--line)}
.cdnhost>.cdnrechts[hidden]{display:none}
.cdnrechtskop{height:52px;min-height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--line);font:700 15px "IBM Plex Sans",sans-serif;color:var(--ink);flex:none}
.cdnrechtssluit{appearance:none;border:0;background:transparent;color:var(--ink-3);cursor:pointer;width:32px;height:32px;border-radius:6px;display:grid;place-items:center;padding:0;margin-right:-8px}
.cdnrechtsinhoud{flex:1;overflow:auto;padding:8px 10px;min-height:0}
.cdnrechtsvoet{padding:12px 16px;border-top:1px solid var(--line);flex:none}
.cdnrechtsvoet[hidden]{display:none}
.cdnprivacy{margin:0;font-size:11px;color:var(--ink-3);line-height:1.5}
.cdnledengroep{margin:0}
.cdnledenkop{margin:0;padding:14px 6px 4px;font:700 11px "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.cdnlid{appearance:none;border:0;background:transparent;cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:10px;padding:5px 6px;border-radius:6px;color:var(--ink);font:inherit;box-sizing:border-box;min-height:42px}
.cdnlid.offline{opacity:.45}
.cdnlidav{position:relative;flex:none;width:32px;height:32px;display:block}
.cdnlidav .cdlstip{right:-2px;bottom:-2px;border-color:var(--ground)}
.cdnlidtekst{display:flex;flex-direction:column;min-width:0}
.cdnlidnaam{font:600 13px/1.3 "IBM Plex Sans",sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnlidsub{font-size:11px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnlidsub.typt{color:var(--accent);font-style:italic}
.cdnrechtsinhoud[data-cdnsoort="pins"]{padding:12px}
.cdnpin{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;margin:0 0 10px}
.cdnpinkop{display:flex;align-items:baseline;gap:8px;font-size:12px;color:var(--ink-3)}
.cdnpinkop b{font-weight:700;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnpintekst{margin:4px 0 0;font-size:13px;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}
.cdnpinlos{appearance:none;border:0;background:transparent;color:var(--ink-3);cursor:pointer;padding:6px 0 0;font:inherit;font-size:11px;min-height:24px;border-radius:4px}
.cdnpinsleeg{padding:40px 12px;text-align:center}
/* sheet (telefoon en middelbreed) */
.cdnsheet{position:fixed;inset:0;z-index:48;display:flex;align-items:flex-end;justify-content:center}
.cdnsheetback{position:absolute;inset:0;background:color-mix(in srgb,var(--merk-navy) 50%,transparent)}
.cdnsheetvlak{position:relative;width:100%;max-width:640px;max-height:70svh;background:var(--ground);color:var(--ink);border-radius:22px 22px 0 0;display:flex;flex-direction:column;box-sizing:border-box;padding-bottom:calc(16px + env(safe-area-inset-bottom));animation:cdnin .2s ease-out;outline:none}
.cdnsheethandvat{display:block;width:40px;height:5px;border-radius:3px;background:var(--ink-3);opacity:.5;margin:10px auto 0;flex:none}
.cdnsheetkop{display:flex;justify-content:space-between;align-items:center;padding:12px 18px 8px;font:800 16px "Archivo",sans-serif;flex:none} /* v25.55 (COMMUNITY-DESIGN, P-7): padding 12 18 8 (ontwerp r. 664) */
.cdnsheetsluit{appearance:none;border:0;background:transparent;color:var(--ink-3);cursor:pointer;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;padding:0;margin-right:-14px}
.cdnsheetinhoud{overflow:auto;padding:0 12px 12px;min-height:0}
.cdnsheetinhoud .cdnrechtsinhoud{padding:0}
.cdnsheetinhoud .cdnrechtsvoet{border-top:0;padding:12px 6px}
.cdnsheetinhoud .cdnlid{min-height:44px;padding:8px 6px;gap:12px}
.cdnsheetinhoud .cdnlidnaam{font-size:14px}
.cdnsheetinhoud .cdnlidsub{font-size:12px}
.cdnsheetinhoud .cdnlidav{width:36px;height:36px} /* v25.55 (COMMUNITY-DESIGN, P-7): avatar 36 in de ledensheet (ontwerp r. 670) */
.cdnsheetinhoud .cdnlidav .pavatar.init{width:36px;height:36px;min-width:36px} /* v25.55 (COMMUNITY-DESIGN, P-7) */
.cdnsheetinhoud .cdnlidav .cdlstip{width:12px;height:12px;border-color:var(--ground)} /* v25.55 (COMMUNITY-DESIGN, P-7): statusstip 12 (ontwerp r. 670) */
.cdnsheetinhoud .cdnpin{margin:0 4px 10px} /* v25.55 (COMMUNITY-DESIGN, P-6): de kaart in de sheet (ontwerp r. 678) */
.cdnsheetinhoud .cdnpintekst{font-size:14px} /* v25.55 (COMMUNITY-DESIGN, P-6): 14 px op een telefoon (ontwerp r. 678) */
.cdnsheetinhoud .cdnpinlos{display:none} /* v25.55 (COMMUNITY-DESIGN, P-6): geen Losmaken in de mobiele sheet (het ontwerp heeft er geen; beheerders maken los op de desktop) */
/* modal (480) */
.cdnmodal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:16px}
.cdnmodalback{position:absolute;inset:0;background:color-mix(in srgb,var(--merk-navy) 60%,transparent)}
.cdnmodalvlak{position:relative;width:min(var(--cdnbreed,480px),100%);max-height:90svh;overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);box-sizing:border-box;animation:cdnin .15s ease-out;outline:none;display:flex;flex-direction:column}
.cdnmodalkop{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:18px 20px 0;flex:none}
.cdnmodalkop h3{margin:0;font:800 17px/1.3 "Archivo",sans-serif;letter-spacing:-.01em;min-width:0;overflow-wrap:anywhere}
.cdnmodalsluit{appearance:none;border:0;background:transparent;color:var(--ink-3);cursor:pointer;width:36px;height:36px;border-radius:8px;display:grid;place-items:center;padding:0;margin-right:-10px;flex:none}
.cdnmodalinhoud{padding:14px 20px 18px;font-size:14px;line-height:1.5}
.cdnmodalvoet{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:12px 20px;background:var(--ground);border-radius:0 0 14px 14px;flex:none;flex-wrap:wrap} /* v25.55 (COMMUNITY-DESIGN, P-8): geen lijn boven de voet, alleen het vlak (ontwerp r. 709, 734, 746) */
/* knop, segment, schakelaar */
.cdnknop{appearance:none;cursor:pointer;height:36px;min-height:36px;padding:0 14px;border-radius:8px;border:1px solid var(--line);background:var(--card-2);color:var(--ink);font:700 13px "IBM Plex Sans",sans-serif;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:6px;-webkit-tap-highlight-color:transparent}
.cdnknop.primair{border-color:var(--accent);background:var(--accent);color:var(--accent-tekst)}
.cdnknop.gevaar{border-color:var(--bad);background:var(--bad);color:var(--merk-op-blauw)}
.cdnknop.klein{height:28px;min-height:28px;padding:0 10px;font-size:11px;border-radius:6px}
.cdnknop:disabled{opacity:.5;cursor:default}
.cdnknop:focus-visible,.cdnsegknop:focus-visible,.cdnschakelaar:focus-visible,.cdnmodalsluit:focus-visible,.cdnsheetsluit:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdnsegment{display:flex;gap:4px;background:var(--seg-bg);border-radius:8px;padding:3px}
.cdnsegknop{appearance:none;border:0;cursor:pointer;flex:1 1 0;min-width:0;height:30px;border-radius:6px;background:transparent;color:var(--ink-2);font:600 13px "IBM Plex Sans",sans-serif;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdnsegknop.aan{background:var(--card);color:var(--ink)}
.cdnschakelaar{appearance:none;cursor:pointer;flex:none;width:36px;height:22px;border-radius:11px;border:0;background:var(--line-2);position:relative;padding:0;transition:background .15s}
.cdnschakelaar span{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--merk-op-blauw);transition:left .2s}
.cdnschakelaar[aria-checked="true"]{background:var(--accent)}
.cdnschakelaar[aria-checked="true"] span{left:16px}
/* desktop en middelbreed */
@media (min-width:768px){
  body.cdnactief nav.tabbar{display:none}
  body.cdnactief .kanaalkop .paneelknop{display:none}
  body.cdnactief.cdcchat .cdcbalk{left:312px;right:0;bottom:0}
  body.cdnactief.cdcchat .kanaalview{padding-bottom:calc(var(--cdc-balk-h,96px) + 8px)}
}
@media (min-width:1180px){
  body.cdnactief.cdnrechts.cdcchat .cdcbalk{right:280px}
  body.cdnactief .cdnkopzoek{display:flex} /* v25.55 (COMMUNITY-DESIGN, P-2): het zoekveld alleen in de brede weergave */
  body.cdnactief .cdnkopzoek[hidden]{display:none} /* v25.55 (COMMUNITY-DESIGN, P-2): en alleen in een kanaal (het blok zet hidden in de feed van alle berichten) */
}
@media (max-width:1179px){
  .cdnhost>.cdnrechts{display:none}
}
/* telefoon: kanalenlijst als volledig scherm, het kanaal als tweede scherm */
@media (max-width:767px){
  .cdnhost,body.cdnrechts .cdnhost{display:block;min-height:0;background:var(--ground)}
  .cdnhost>.cdnrail,.cdnhost>.cdnkanalen{display:none}
  .cdnhost>.cdnkanalenlijst{display:flex;flex-direction:column;position:fixed;inset:0;z-index:20;overflow:auto;background:var(--ground);box-sizing:border-box;padding-bottom:calc(90px + env(safe-area-inset-bottom))}
  body.cdnactief:not(.cdnkanaal) .fab{display:none}
  body.cdnactief.cdnkanaal .cdnhost>.cdnkanalenlijst{display:none}
  body.cdnactief:not(.cdnkanaal) .cdnhost>.cdnchat{height:0;min-height:0;overflow:hidden}
  body.cdnactief:not(.cdnkanaal) .cdcbalk{display:none}
  body.cdnactief.cdkkanaal:not(.cdnkanaal) nav.tabbar{display:grid}
  .cdnmkop{display:flex;align-items:center;gap:10px;padding:max(14px,env(safe-area-inset-top)) 16px 10px}
  .cdnmlogo{display:block;width:36px;height:36px;border-radius:12px;overflow:hidden;flex:none}
  .cdnmlogo img{width:100%;height:100%;display:block}
  .cdnmtitel{flex:1;min-width:0;display:flex;flex-direction:column}
  .cdnmtitel .cdnkopnaam{font:800 18px "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink)}
  .cdnmsub{font-size:12px;color:var(--ink-3)}
  .cdnthema.cdnmthema{width:38px;height:38px;border-radius:19px;background:var(--card)}
  .cdnkanalenlijst .cdnzoekwrap{padding:4px 16px 8px}
  .cdnkanalenlijst .cdnzoekico{left:28px}
  .cdnkanalenlijst .cdnzoek{border-radius:10px;padding:10px 12px 10px 34px;font-size:16px;min-height:44px}
  .cdnkanalenlijst .cdnzoekdrop{left:16px;right:16px}
  .cdnkanalenlijst .cdnlijst{padding:0 12px 12px;overflow:visible;flex:1}
  .cdnkanalenlijst .cdncatkop{font-size:12px;padding:4px 6px;gap:6px}
  .cdnkanalenlijst .cdncatkop.cdncatvast{padding-left:22px}
  .cdnkanalenlijst .cdnrij{padding:12px 10px;margin:2px 0;border-radius:10px;gap:10px;min-height:44px;font-size:15px}
  .cdnkanalenlijst .cdnrijico{width:20px;font-size:18px}
  .cdnkanalenlijst .cdnrijico .cdnico{width:18px;height:18px}
  .cdnkanalenlijst .cdnteller{font-size:11px;padding:2px 7px;border-radius:9px} /* v25.55 (COMMUNITY-DESIGN, P-10): padding 2px 7px (ontwerp r. 556) */
  .cdnchat .kanaalkop{--cdnkoppad:max(8px,env(safe-area-inset-top)) 8px 8px 4px;--cdnkophoogte:58px;--cdnkopgap:4px;--cdnkopknopmaat:44px;background:var(--ground)}
  .cdnchat .kanaalkop .khash{font-size:16px}
  .cdnchat .kanaalnaam b{flex-wrap:wrap;white-space:normal;row-gap:0}
  .cdnchat .kanaalnaam b>span:not(.cdnonderwerp){white-space:nowrap}
  .cdnonderwerp{flex:1 0 100%;order:9;font-size:11px;line-height:1.35;color:var(--ink-3);border:0;padding:0;margin:0}
  .cdnkopknop{width:44px;height:44px;border-radius:10px}
  .cdnhost>.cdnchat{min-height:100svh}
  .cdnwelkom{padding:40px 20px} /* v25.55 (COMMUNITY-DESIGN, P-1): telefoon (ontwerp r. 578) */
  .cdnwelkomhash{display:none} /* v25.55 (COMMUNITY-DESIGN, P-1): het mobiele ontwerp heeft geen cirkel */
  .cdnwelkomtitel{font-size:22px;margin-top:0} /* v25.55 (COMMUNITY-DESIGN, P-1) */
  .cdnwelkomsub{font-size:14px} /* v25.55 (COMMUNITY-DESIGN, P-1) */
  body.cdnactief .cdcbalk{background:var(--ground);border-top:1px solid var(--line);padding:6px 12px calc(10px + env(safe-area-inset-bottom))}
  body.cdnactief .cdcbalk>.cdcrij{background:transparent;border:0;padding:0;gap:8px;max-width:none}
  body.cdnactief .cdcbalk .cdcmeer{width:44px;height:44px;background:var(--card);color:var(--ink-2)}
  body.cdnactief .cdcbalk .cdcemoji,body.cdnactief .cdcbalk .cdcteller{display:none}
  body.cdnactief .cdcbalk .cdctekst{min-height:44px;border:1px solid var(--line);border-radius:22px;background:var(--seg-bg);padding:11px 16px;font-size:15px;line-height:20px}
  body.cdnactief .cdcbalk .cdctekst:focus{border-color:var(--accent)}
  body.cdnactief .cdcbalk .cdcstuur{width:44px;height:44px;padding:0;border-radius:22px}
  body.cdnactief .cdcbalk .cdcstuur::after{content:none}
  body.cdnactief .cdcbalk .cdcstuur .cdnstuuricoon{display:grid;place-items:center}
  body.cdnactief .cdcbalk>.cdctypslot{padding:0 4px}
  .cdnplusmenu{left:12px;width:250px;border-radius:12px}
  .cdnplusitem{min-height:44px;padding:11px 10px}
  .cdnplustekst b{font-size:14px}
  .cdnplustekst small{display:none}
}
@media (max-width:359px){
  .cdnkopknop{width:40px;height:40px}
  .cdnchat .kanaalkop{--cdnkopknopmaat:40px;--cdnterugmaat:40px}
}
@media (pointer:fine){
  .cdnrij,.cdncatkop,.cdnrailknop,.cdnkopknop,.cdnplusitem,.cdnlid,.cdnzoekres,.cdnstatusknop{transition:background-color .12s ease,color .12s ease}
}
@media (prefers-reduced-motion:reduce){
  .cdnplusmenu,.cdnsheetvlak,.cdnmodalvlak{animation:none}
  .cdnschakelaar,.cdnschakelaar span,.cdnrij,.cdncatkop,.cdnrailknop,.cdnkopknop,.cdnplusitem,.cdnlid,.cdnzoekres,.cdnstatusknop{transition:none}
}
/* v25.55 — CDN-KAART */
/* v25.55 (COMMUNITY-DESIGN, KD1): de ontwerpkaart in de chat (blok v25.55 cdn-kaart) — alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji. De kaartlaag (kolommen 40 + 14, padding 12 16 2 en 2 16 2, marge 6 tussen groepen) staat als variabelen op de kaart en wordt inline (var(--cdnk...)) gelezen: de id-regels van de feedlijst gelden nog steeds nu de feedsectie als geheel in de gastheer staat, en alleen een inline waarde wint daarvan. Kleurmapping ontwerp naar app: kaartvlak = --card-2 op de chat (--card), invoervlak = --seg-bg, accentvlak = --accent-wash, actief vlak = --seg-bg. */
.post.ck.cdnkaart{--cdnkkol:40px minmax(0,1fr);--cdnkgap:14px;--cdnkpad:2px 16px 2px;--cdnkmarge:0;--cdnpilh:16px;--cdnpilpad:0 7px;align-items:start;box-sizing:border-box}
.post.ck.cdnkaart.ckkop{--cdnkpad:12px 16px 2px;--cdnkmarge:6px 0 0}
.post.ck.cdnkaart.genoemd{--cdnkpad:2px 16px 2px 14px}
.post.ck.cdnkaart.ckkop.genoemd{--cdnkpad:12px 16px 2px 14px}
.datumscheiding{--cdnkdagmarge:18px 16px 4px;--cdnkdagfont:700 11px "IBM Plex Sans",sans-serif}
.post.ck.cdnkaart>.pavatar.init{width:40px;height:40px;min-width:40px;margin:0;justify-self:start;font-size:14px}
.post.ck.cdnkaart>.cktijdkolom{padding:4px 0 0;justify-content:flex-end}
.post.ck.cdnkaart>.pbody>.pmeta.cdnnaamregel .cdlrolicoon{align-self:center}
.post.ck.cdnkaart>.pbody{font-size:14px;line-height:1.5} /* v25.55 (COMMUNITY-DESIGN, K-P2): de tekstmaat van het ontwerp (de chatlaag gaf 15 px/1.55); de p van de kaart erft de regelhoogte inline */
.post.ck.cdnkaart .cdnrolpil{display:inline-flex;align-items:center;height:16px;padding:0 6px;border-radius:4px;font:700 10px/1 "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;align-self:center}
.post.ck.cdnkaart .cdntracker{display:inline-flex;align-items:center;height:16px;padding:0 7px;border-radius:10px;background:var(--accent-wash);color:var(--accent);font:700 10px/1 "IBM Plex Sans",sans-serif;white-space:nowrap;align-self:center}
.post.ck.cdnkaart .cdnspeld{display:inline-flex;vertical-align:-1px;margin-right:6px;color:var(--ink-3)}
.post.ck.cdnkaart .cashtag.cdnticker{display:inline-flex;align-items:center;gap:4px;padding:0 7px;border-radius:6px;background:var(--accent-wash);color:var(--accent);font-weight:700;font-size:12px;line-height:1.6;vertical-align:baseline;text-decoration:none}
.post.ck.cdnkaart .cdntickerpct{font-weight:600;font-variant-numeric:tabular-nums}
/* actierij: reactiechips (eigen = accentvlak + accentrand via de variabelen die de id-regel leest), reageerknop, antwoorden/thread, vastpinnen */
.post.ck.cdnkaart>.pbody>.reactiewrap{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px;min-height:0}
.post.ck.cdnkaart>.pbody>.reactiewrap>.reactierij{margin:0;gap:6px}
.post.ck.cdnkaart .reactiechip.mijn{--stat-bg:var(--accent-wash);--line-2:var(--accent)}
.post.ck.cdnkaart .reactiekies{flex-basis:100%;order:9;margin-top:4px}
.cdnacties{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px}
.cdnactie{appearance:none;cursor:pointer;border:0;background:transparent;color:var(--ink-3);font:400 12px/1.4 "IBM Plex Sans",sans-serif;padding:2px 6px;border-radius:6px;min-height:24px;display:inline-flex;align-items:center;gap:6px;-webkit-tap-highlight-color:transparent}
.cdnactie.cdnreageer{border:1px dashed var(--line-2);padding:2px 7px;opacity:.8}
.cdnactie.cdnthread{color:var(--accent);font-weight:600;padding:2px 4px}
.cdnactie.cdnthread .cdnhoek{width:10px;height:10px;border-left:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);border-radius:0 0 0 4px;display:inline-block;margin-top:-4px;flex:none}
.cdnactie.cdnthread .cdnlaatste{color:var(--ink-3);font-weight:400}
.cdnactie:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
/* bijlage-kaarten (max 480, radius 10, padding 14) */
.cdnbijlage{margin-top:8px;max-width:480px;background:var(--card-2);border:1px solid var(--line);border-radius:10px;padding:14px;box-sizing:border-box;color:var(--ink);font-size:13px;line-height:1.5;overflow:hidden}
.cdnbijlage a{color:inherit;text-decoration:none}
.cdnbkop{display:flex;align-items:center;gap:8px;font:700 14px "IBM Plex Sans",sans-serif;min-width:0}
.cdnbkop .cdnico{color:var(--ink-2)}
.cdnbkop>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnbvoet{margin-top:8px;font-size:11px;color:var(--ink-3)}
.cdnspark{width:100%;height:var(--cdnsparkh,90px);display:block;margin-top:8px}
.cdnkkop,.cdnakop,.cdnpfkop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.cdnklinks{min-width:0}
.cdnknaam{font:800 16px/1.3 "Archivo",sans-serif;letter-spacing:-.01em;overflow-wrap:anywhere}
.cdnksym{font:700 11px "IBM Plex Sans",sans-serif;color:var(--ink-3);letter-spacing:0;margin-left:2px}
.cdnkbeurs{font-size:11px;color:var(--ink-3)}
.cdnkrechts{text-align:right;flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.cdnkkoers{font:800 18px/1.2 "Archivo",sans-serif;font-variant-numeric:tabular-nums}
.cdnkdag,.cdnadag{font:700 12px "IBM Plex Sans",sans-serif;font-variant-numeric:tabular-nums}
.cdnkvoet{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.cdnkvoettekst{font-size:11px;color:var(--ink-3)}
.cdnkknoppen{display:inline-flex;gap:6px;margin-left:auto}
.cdnkknop{appearance:none;cursor:pointer;height:28px;padding:0 10px;border-radius:6px;border:1px solid var(--line);background:transparent;color:var(--ink-2);font:600 11px "IBM Plex Sans",sans-serif;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.cdnkknop.primair{border-color:var(--accent);background:var(--accent);color:var(--accent-tekst);font-weight:700}
.cdnkknop:focus-visible,.cdnaopen:focus-visible,.cdnalink:focus-visible,.cdnkrlink:focus-visible,.cdnxopen:focus-visible,.cdnwnaam:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* artikel (De Belegger) */
.cdnbijlage.cdnartikel{padding:0}
.cdnalink{display:flex}
.cdnafoto{width:130px;flex:none;display:flex;align-items:center;justify-content:center;font:400 10px ui-monospace,Menlo,monospace;color:var(--ink-3);background:repeating-linear-gradient(135deg,var(--seg-bg) 0 8px,var(--card-2) 8px 16px);overflow:hidden}
.cdnafoto img{width:100%;height:100%;object-fit:cover;display:block}
.cdnatekst{padding:12px 14px;min-width:0;display:flex;flex-direction:column;flex:1}
.cdnakicker{display:flex;align-items:center;gap:6px;font:700 10px "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--accent)}
.cdnakicker img{width:14px;height:14px;border-radius:4px;display:block}
.cdnatitel{font:800 14px/1.35 "Archivo",sans-serif;margin-top:4px;overflow-wrap:anywhere}
.cdnaexcerpt{font-size:12px;color:var(--ink-2);margin-top:4px;line-height:1.45;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cdnameta{display:flex;gap:8px;align-items:center;font-size:11px;color:var(--ink-3);margin-top:8px;flex-wrap:wrap}
.cdnaslot{font-weight:700;color:var(--gold)}
.cdnalees{margin-left:auto;color:var(--accent);font-weight:700}
/* X-bericht */
.cdnxkop{display:flex;align-items:center;gap:10px}
.cdnxavatar{width:36px;height:36px;border-radius:18px;background:var(--seg-bg);display:grid;place-items:center;font:800 13px "Archivo",sans-serif;color:var(--ink-2);flex:none}
.cdnxwie{flex:1;min-width:0}
.cdnxnaam{font:700 13px "IBM Plex Sans",sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnxhandle{color:var(--ink-3);font-weight:500}
.cdnxsub{font-size:11px;color:var(--ink-3)}
.cdnveilig{display:inline-flex;align-items:center;gap:3px;font:700 10px/1 "IBM Plex Sans",sans-serif;padding:3px 7px;border-radius:10px;background:var(--accent-wash);color:var(--accent);flex:none;text-transform:none;letter-spacing:0}
.cdnxtekst{margin-top:10px;font-size:13px;line-height:1.55;overflow-wrap:anywhere}
.cdnxvoet{display:flex;margin-top:10px;font-size:11px}
.cdnxopen{margin-left:auto;color:var(--accent);font-weight:700}
/* krantenartikel */
.cdnbijlage.cdnkrant{padding:0}
.cdnkrlink{display:flex}
.cdnkrfoto{width:110px;flex:none;display:flex;align-items:center;justify-content:center;font:400 10px ui-monospace,Menlo,monospace;color:var(--ink-3);background:repeating-linear-gradient(135deg,var(--seg-bg) 0 8px,var(--card-2) 8px 16px);overflow:hidden}
.cdnkrfoto img{width:100%;height:100%;object-fit:cover;display:block}
.cdnkrtekst{padding:12px 14px;min-width:0;display:flex;flex-direction:column;flex:1}
.cdnkrbron{display:flex;align-items:center;gap:6px;font:700 10px "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);min-width:0}
.cdnkrbron>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnkrtitel{font:800 14px/1.35 "Archivo",sans-serif;margin-top:4px;overflow-wrap:anywhere}
.cdnkroms{font-size:12px;color:var(--ink-2);margin-top:4px;line-height:1.45;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cdnkrdomein{font-size:11px;color:var(--accent);font-weight:700;margin-top:8px}
/* geblokkeerde link */
.cdnbijlage.cdnblok{border-style:dashed;padding:12px 14px;display:flex;gap:10px;align-items:center}
.cdnblokico{color:var(--ink-3);flex:none;display:grid;place-items:center}
.cdnbloktekst{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
/* peiling (de bestaande kaart in de vorm van het ontwerp) */
.post.ck.cdnkaart .peiling{margin-top:8px;max-width:min(480px,100%);padding:14px;border-radius:10px;background:var(--card-2);border:1px solid var(--line);box-sizing:border-box} /* v25.55 (COMMUNITY-DESIGN, integrator): de peilingkaart hoogstens 480 en nooit breder dan de kaart (min); de data-v2541-pin 'geen vaste pixelbreedtes op .peiling' scant letterlijk op een pixelbreedte in die regel */
.post.ck.cdnkaart .peiling .pvraag{display:flex;align-items:center;gap:8px;font:700 14px "IBM Plex Sans",sans-serif;margin-bottom:10px}
.post.ck.cdnkaart .peiling .pvraag .cdnico{color:var(--ink-2);flex:none}
.post.ck.cdnkaart .peiling .popt{border-radius:7px;border:1px solid var(--line);background:var(--seg-bg);padding:8px 12px;font-size:13px;min-height:36px;gap:6px}
.post.ck.cdnkaart .peiling .popt .pbalk{background:var(--accent-wash)}
.post.ck.cdnkaart .peiling .popt.mijn{border-color:var(--accent)}
.post.ck.cdnkaart .peiling .popt.mijn .pbalk{background:color-mix(in srgb,var(--accent) 22%,transparent)}
.post.ck.cdnkaart .peiling .popt .ptekst{display:inline-flex;align-items:center;gap:6px;white-space:normal}
.post.ck.cdnkaart .peiling .popt .ptekst .cdnico{flex:none;color:var(--accent)}
.post.ck.cdnkaart .peiling .popt .ppct{font:400 13px "IBM Plex Sans",sans-serif;color:var(--ink-2)}
.post.ck.cdnkaart .peiling .popt.mijn .ppct{color:var(--ink-2)}
.post.ck.cdnkaart .peiling .pvoet{margin-top:10px;font-size:11px;color:var(--ink-3)}
/* portefeuille: verloop, verdeling, top-5 */
.cdnpfkop{align-items:baseline}
.cdnbroker{display:inline-flex;align-items:center;height:16px;padding:0 6px;border-radius:4px;background:var(--seg-bg);color:var(--ink-2);font:700 10px/1 "IBM Plex Sans",sans-serif;white-space:nowrap;flex:none}
.cdnpfrend{font:800 14px "Archivo",sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.cdnpfsub{font-size:11px;color:var(--ink-3);margin-top:2px}
.cdnpflegenda{display:flex;gap:14px;font-size:11px;color:var(--ink-2);margin-top:6px;flex-wrap:wrap}
.cdnpflegenda span{display:inline-flex;align-items:center;gap:5px;min-width:0}
.cdnlegeigen{width:14px;height:2px;display:inline-block;flex:none}
.cdnlegbench{width:14px;height:0;border-top:2px dashed var(--ink-3);display:inline-block;flex:none}
.cdnvbalk{display:flex;height:10px;border-radius:5px;overflow:hidden;margin-top:10px;gap:2px}
.cdnvbalk i{display:block;height:100%;flex:none}
.cdnvgrid{display:grid;grid-template-columns:1fr 1fr;gap:4px 14px;margin-top:10px;font-size:12px}
.cdnvrij{display:flex;align-items:center;gap:6px;min-width:0}
.cdnvrij span{flex:1;color:var(--ink-2);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnvrij b{font-weight:600;font-variant-numeric:tabular-nums}
.cdnvstip{width:8px;height:8px;border-radius:2px;flex:none;display:inline-block}
.cdntoprijen{display:flex;flex-direction:column;gap:4px;margin-top:10px}
.cdntoprij{display:flex;align-items:center;gap:10px;font-size:13px;padding:4px 0;border-bottom:1px solid var(--line);min-width:0}
.cdntoprij:last-child{border-bottom:0}
.cdntopnr{width:20px;height:20px;border-radius:10px;background:var(--seg-bg);font:700 11px/1 "IBM Plex Sans",sans-serif;display:inline-grid;place-items:center;color:var(--ink-2);flex:none}
.cdntopnaam{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* watchlist */
.cdnwrijen{display:flex;flex-direction:column;margin-top:8px}
.cdnwrij{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;padding:6px 0;border-bottom:1px solid var(--line)}
.cdnwrij:last-child{border-bottom:0}
.cdnwnaam{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnwrij b{font-weight:700;font-variant-numeric:tabular-nums;flex:none}
/* analyse uit Ontdek (linkerrand accent; afstandspil in plaats van een oordeel) */
.cdnbijlage.cdnanalyse{border-left:3px solid var(--accent)}
.cdnankicker{font:700 11px "IBM Plex Sans",sans-serif;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.cdnakop{margin-top:6px;align-items:center}
.cdnasub{font-size:12px;color:var(--ink-2)}
.cdnafstand{display:inline-flex;align-items:center;font:700 11px/1 "IBM Plex Sans",sans-serif;padding:4px 8px;border-radius:10px;background:var(--accent-wash);color:var(--accent);white-space:nowrap}
.cdnafstand.onder{background:color-mix(in srgb,var(--good) 16%,transparent);color:var(--good-text)}
.cdnafstand.boven{background:color-mix(in srgb,var(--gold) 18%,transparent);color:var(--gold)}
.cdnakort,.cdnawaarde,.cdnalaadt{margin-top:10px;font-size:13px;line-height:1.55;overflow-wrap:anywhere}
.cdnalaadt{color:var(--ink-3)}
.cdnawaarde span{color:var(--ink-2)}
.cdnageen{margin-top:4px;font-size:11px;color:var(--ink-3)}
.cdnatiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}
.cdnatile{background:var(--seg-bg);border-radius:8px;padding:8px;min-width:0}
.cdnatile span{display:block;font-size:10px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdnatile b{display:block;font:700 13px "IBM Plex Sans",sans-serif;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnaopen{appearance:none;cursor:pointer;margin-top:10px;border:0;background:transparent;color:var(--accent);font:600 12px "IBM Plex Sans",sans-serif;padding:0;border-radius:4px}
/* telefoon: avatar 36, indent 46, compacte kaarten (koers zonder knoppen, artikel met fotovlak boven, X compact, peiling 40, verdeling 1 kolom, top-5 "1. Naam") */
@media (max-width:767px){
  .post.ck.cdnkaart{--cdnkkol:36px minmax(0,1fr);--cdnkgap:10px;--cdnkpad:2px 14px 2px;--cdnpilh:15px;--cdnpilpad:0 6px}
  .post.ck.cdnkaart.ckkop{--cdnkpad:10px 14px 2px}
  .post.ck.cdnkaart.genoemd{--cdnkpad:2px 14px 2px 12px}
  .post.ck.cdnkaart.ckkop.genoemd{--cdnkpad:10px 14px 2px 12px}
  .datumscheiding{--cdnkdagmarge:16px 16px 2px}
  .post.ck.cdnkaart>.pavatar.init{width:36px;height:36px;min-width:36px;font-size:13px}
  .post.ck.cdnkaart .cdnrolpil,.post.ck.cdnkaart .cdntracker{font-size:9px;height:15px}
  .post.ck.cdnkaart .cashtag.cdnticker{padding:0 6px}
  .post.ck.cdnkaart .reactiechip{min-height:30px}
  .post.ck.cdnkaart>.pbody{line-height:1.45} /* v25.55 (COMMUNITY-DESIGN, K-P2): telefoon 1.45 (artboard r. 587) */
  .cdnactie{min-height:30px}
  .cdnactie.cdnreageer,.cdnactie.cdnantwoord{display:none} /* v25.55 (COMMUNITY-DESIGN, K-P1): op de telefoon alleen reactiechips en "N antwoorden" (artboard r. 631); reageren en antwoorden lopen via de werkbalk van het chatblok (lang indrukken) */
  .cdnactie.cdnthread .cdnhoek,.cdnactie.cdnthread .cdnlaatste,.cdnactie.cdnpinknop{display:none}
  .cdnactie.cdnthread::after{content:"\203A";font-weight:700}
  .cdnbijlage{padding:12px;max-width:none}
  .cdnknaam{font-size:15px}
  .cdnkkoers{font-size:14px}
  .cdnkkoppen{display:none}
  .cdnkbeurs{display:none} /* v25.55 (COMMUNITY-DESIGN, K-P3): geen beursregel op de telefoon (artboard r. 587) */
  .cdnkvoet .cdnkknoppen{display:none}
  .cdnkvoettekst{font-size:10px}
  .cdnspark{margin-top:6px}
  .cdnbijlage.cdnkoers .cdnspark{height:70px}
  .cdnbijlage.cdnpf .cdnspark{height:90px}
  .cdnalink,.cdnkrlink{flex-direction:column}
  .cdnafoto{width:100%;height:90px;font-size:0} /* v25.55 (COMMUNITY-DESIGN, K-P3): alleen het artikel houdt het fotovlak boven (90 hoog, artboard r. 588) */
  .cdnkrfoto{display:none} /* v25.55 (COMMUNITY-DESIGN, K-P3): de krantenkaart zonder fotovlak (artboard r. 604: bron, veilig-pil en titel) */
  .cdnatekst,.cdnkrtekst{padding:10px 12px}
  .cdnaexcerpt,.cdnkroms,.cdnalees,.cdnkrdomein{display:none}
  .cdnxavatar,.cdnxsub,.cdnxvoet{display:none}
  .cdnbijlage.cdnblok{background:transparent;padding:10px 12px} /* v25.55 (COMMUNITY-DESIGN, K-P3): de geblokkeerde link als stippellijn zonder kaartvlak (artboard r. 605) */
  .cdnbijlage.cdnanalyse .cdnasub,.cdnbijlage.cdnanalyse .cdnadag{display:none} /* v25.55 (COMMUNITY-DESIGN, K-P3): de analysekaart zonder de regel $SYM + koers en zonder dagverandering (artboard r. 616) */
  .cdnbijlage.cdnpf .cdnbroker,.cdnbijlage.cdnverdeling .cdnbroker,.cdnbijlage.cdntop5 .cdnbroker{display:none} /* v25.55 (COMMUNITY-DESIGN, K-P3): geen brokerpil op verloop, verdeling en top-5 (artboard r. 612, 622, 625) */
  .post.ck.cdnkaart .peiling{padding:12px}
  .post.ck.cdnkaart .peiling .popt{min-height:40px;padding:10px 12px}
  .cdnvgrid{grid-template-columns:1fr;gap:3px}
  .cdntoprijen{gap:0;margin-top:6px}
  .cdntoprij{border-bottom:0;padding:2px 0;line-height:1.7;gap:4px}
  .cdntopnr{width:auto;height:auto;background:transparent;font:inherit;color:inherit;display:inline;border-radius:0}
  .cdntopnr::after{content:"."}
  .cdnatiles{grid-template-columns:1fr 1fr;gap:6px}
  .cdnpflegenda,.cdnbijlage.cdnpf .cdnbvoet,.cdnbijlage.cdnverdeling .cdnbvoet,.cdnbijlage.cdntop5 .cdnbvoet{display:none} /* v25.55 (COMMUNITY-DESIGN, K-P3): ook de voetnoten onder verdeling en top-5 weg op de telefoon (artboard r. 622, 625) */
}
@media (pointer:fine){
  .cdnactie,.cdnkknop,.cdnaopen,.post.ck.cdnkaart .reactiechip{transition:background-color .12s ease,color .12s ease,border-color .12s ease}
}
@media (prefers-reduced-motion:reduce){
  .cdnactie,.cdnkknop,.cdnaopen,.post.ck.cdnkaart .reactiechip{transition:none}
}
/* v25.55 — CDN-DELEN */
/* v25.55 (COMMUNITY-DESIGN, KD10): het deelvenster en het peilingvenster (blok v25.55 cdn-delen) in de modal van de kern — alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji. Kleurmapping ontwerp naar app: invoervlak = --seg-bg, onderwerp- en privacykaart = --ground, gekozen rij, chip of segment = --accent-wash met accentrand. Onder 480 px vult de modal van de kern de breedte met 16 px marge. */
.cdndlmodal .cdnmodalinhoud{padding:14px 20px 18px}
.cdndlvenster{display:flex;flex-direction:column;gap:14px}
.cdndlsectie{min-width:0}
.cdndlkop{margin:0 0 6px;font:700 11px "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.cdndlrijen{display:flex;flex-direction:column;gap:6px}
.cdndlrij{appearance:none;cursor:pointer;width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:var(--ground);color:var(--ink);font:inherit;box-sizing:border-box;min-height:44px}
.cdndlrij.aan{border-color:var(--accent);background:var(--accent-wash)}
.cdndlrij.cdndlartikel{flex-direction:column;align-items:stretch;gap:2px}
.cdndlrijnaam{display:inline-flex;align-items:center;gap:6px;font:600 13px "IBM Plex Sans",sans-serif;min-width:0}
.cdndlrijnaam .cdnico{color:var(--ink-2)}
.cdndlrijrend{font:700 13px "IBM Plex Sans",sans-serif;font-variant-numeric:tabular-nums;flex:none}
.cdndlarttitel{font:700 13px/1.35 "IBM Plex Sans",sans-serif;overflow-wrap:anywhere}
.cdndlrijsub{font-size:11px;color:var(--ink-3)}
.cdndlchips{display:flex;gap:6px;flex-wrap:wrap}
.cdndlchip{appearance:none;cursor:pointer;height:34px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--ground);color:var(--ink);font:700 12px "IBM Plex Sans",sans-serif;display:inline-flex;align-items:center;gap:6px}
.cdndlchip.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdndlchip span{font-weight:600;font-variant-numeric:tabular-nums}
.cdndlinvoer{width:100%;box-sizing:border-box;background:var(--seg-bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);font:inherit;font-size:14px;min-height:40px}
.cdndlinvoer::placeholder{color:var(--ink-3)}
.cdndlinvoer:focus-visible{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}
.cdndlmono{font-family:ui-monospace,Menlo,monospace;font-size:13px}
.cdndlonderwerpslot:empty{display:none}
.cdndlonderwerp{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:var(--ground);border:1px solid var(--line);min-width:0}
.cdndlonderwerpico{color:var(--ink-2);flex:none;display:grid;place-items:center}
.cdndlonderwerptekst{display:flex;flex-direction:column;min-width:0}
.cdndlonderwerptekst b{font:700 13px "IBM Plex Sans",sans-serif;overflow-wrap:anywhere}
.cdndlonderwerptekst span{font-size:11px;color:var(--ink-3)}
.cdndlonderwerp.cdndlleeg{color:var(--ink-3);font-size:12px}
.cdndlmodal .cdnsegment{background:transparent;padding:0;gap:6px}
.cdndlmodal .cdnsegknop{height:36px;border:1px solid var(--line);border-radius:8px;background:var(--ground);color:var(--ink-2);font:600 13px "IBM Plex Sans",sans-serif}
.cdndlmodal .cdnsegknop.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdndlkanalen{display:flex;gap:6px;flex-wrap:wrap}
.cdndlkanaal{appearance:none;cursor:pointer;height:32px;padding:0 12px;border-radius:16px;border:1px solid var(--line);background:var(--ground);color:var(--ink-2);font:600 12px "IBM Plex Sans",sans-serif;white-space:nowrap}
.cdndlkanaal.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdndlprivacy{display:flex;gap:8px;align-items:flex-start;background:var(--ground);border:1px solid var(--line);border-radius:10px;padding:12px;font-size:12px;color:var(--ink-2);line-height:1.5}
.cdndlprivacy .cdnico{flex:none;margin-top:2px;color:var(--ink-3)}
.cdndlleegtekst{margin:0;font-size:12.5px;color:var(--ink-3)}
.cdndltitelico{display:inline-grid;place-items:center;vertical-align:-3px;margin-right:8px;color:var(--ink-2)}
.cdndlmodal .cdnknop.cdndlannuleer{border-color:transparent;background:transparent;color:var(--ink-2);font-weight:600}
.cdndlmodal .cdnknop.cdndlplaats{padding:0 18px}
.cdndlopties{display:flex;flex-direction:column;gap:6px}
.cdndloptie{display:flex;gap:6px;align-items:center}
.cdndlrondje{width:18px;height:18px;border-radius:9px;border:2px solid var(--ink-3);flex:none;box-sizing:border-box}
.cdndloptie .cdndlinvoer{flex:1;padding:8px 12px;font-size:13px;min-height:36px}
.cdndloptieweg{appearance:none;cursor:pointer;border:0;background:transparent;color:var(--ink-3);width:24px;height:24px;border-radius:6px;display:grid;place-items:center;padding:0;flex:none} /* v25.55 (COMMUNITY-DESIGN, K-P4): het kruisje 24 (ontwerp 08), was 28 */
.cdndloptieweg:disabled{opacity:.35;cursor:default} /* v25.55 (COMMUNITY-DESIGN, K-P4): bij twee opties staat het kruisje er wel, maar doet het niets (nooit onder twee) */
.cdndlplus{appearance:none;cursor:pointer;margin-top:2px;width:100%;border:1px dashed var(--line-2);background:transparent;color:var(--accent);font:600 13px "IBM Plex Sans",sans-serif;border-radius:8px;padding:8px 12px;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;box-sizing:border-box}
.cdndlhint{margin:2px 0 0;font-size:11px;color:var(--ink-3)}
.cdndlrij:focus-visible,.cdndlchip:focus-visible,.cdndlkanaal:focus-visible,.cdndloptieweg:focus-visible,.cdndlplus:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:479px){
  .cdndlmodal .cdnmodalinhoud{padding:12px 16px 16px}
  .cdndlmodal .cdnmodalvoet{padding:12px 16px}
  .cdndlchip{height:38px}
  .cdndlkanaal{height:36px}
  .cdndlmodal .cdnsegknop{font-size:12px;padding:0 4px}
}
@media (pointer:fine){
  .cdndlrij,.cdndlchip,.cdndlkanaal,.cdndlplus,.cdndlmodal .cdnsegknop{transition:background-color .12s ease,border-color .12s ease,color .12s ease}
}
@media (prefers-reduced-motion:reduce){
  .cdndlrij,.cdndlchip,.cdndlkanaal,.cdndlplus,.cdndlmodal .cdnsegknop{transition:none}
}
/* v25.55 — CDN-DRAAD */
/* v25.55 (COMMUNITY-DESIGN, draad-1): threads (rechterpaneel en sheet) en het profielpaneel van het blok v25.55 cdn-draad. Regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji; de avatarkleur van het profiel en de rolkleur van de pil komen als inline variabele (--cdnprofielkleur, --cdnrolkleur) uit het blok; buiten body.cdnactief staat er niets van in de DOM. */
.pavatar.init.cdnav28{width:28px;height:28px;min-width:28px}
.pavatar.init.cdnav30{width:30px;height:30px;min-width:30px}
.pavatar.init.cdnav56{width:56px;height:56px;min-width:56px}
.pavatar.init.cdnav64{width:64px;height:64px;min-width:64px}
/* thread */
.cdnrechtsinhoud[data-cdnsoort="thread"]{padding:12px}
.cdndraadorig{display:flex;gap:10px;padding:0 0 12px;border-bottom:1px solid var(--line)}
.cdndraadav{flex:none;display:block}
.cdndraadtekst{min-width:0;flex:1}
.cdndraadkop{display:flex;gap:8px;align-items:baseline;font-size:12px;min-width:0}
.cdndraadnaam{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;font:700 12px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;border-radius:4px;text-align:left}
.cdndraadnaam.mijn{color:var(--accent)}
.cdndraadkop time{color:var(--ink-3);white-space:nowrap;font-size:12px}
.cdndraadbody{font-size:13px;line-height:1.5;margin-top:2px;color:var(--ink);overflow-wrap:anywhere}
.cdndraadbody p{margin:0}
.cdndraadbody .pfbijlage,.cdndraadbody .peilingkaart{max-width:100%}
.cdndraadlabel{font:700 11px "IBM Plex Sans",sans-serif;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;padding:12px 0 4px}
.cdndraadantwoord{display:flex;gap:10px;padding:8px 0;animation:cdnin .2s ease-out}
.cdndraadantwoord.wacht{opacity:.6}
.cdndraadleeg,.cdndraadstatus{padding:14px 0}
.cdndraadinvoer{flex:none;padding:10px 12px;border-top:1px solid var(--line);background:var(--ground)}
.cdndraadveld{display:flex;align-items:center;gap:6px;background:var(--seg-bg);border-radius:8px;padding:4px 6px;border:1px solid var(--line)}
.cdndraadveld:focus-within{border-color:var(--accent)}
.cdndraadtekstveld{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:13px;padding:6px 4px;outline:none}
.cdndraadtekstveld::placeholder{color:var(--ink-3)}
.cdndraadstuur{appearance:none;border:0;cursor:pointer;height:28px;min-width:28px;padding:0 8px;border-radius:6px;background:var(--accent);color:var(--accent-tekst);display:inline-grid;place-items:center;flex:none}
.cdndraadstuur:disabled{opacity:.5;cursor:default}
.cdndraadstuur:focus-visible,.cdndraadnaam:focus-visible,.cdngeschiedkaart:focus-visible,.cdnschakelrij:focus-visible,.cdnprofielbio:focus-visible,.cdnprofielkaartknop:focus-visible,.cdnprofiellink:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdndraadfout{margin:6px 2px 0;font-size:11px;color:var(--bad-text);line-height:1.4}
.cdndraadfout[hidden]{display:none}
.cdndraadinvoer.bezig .cdndraadveld{opacity:.7}
.cdnsheetinhoud .cdnrechtsinhoud[data-cdnsoort="thread"]{padding:0 6px}
.cdnsheetinhoud .cdndraadinvoer{position:sticky;bottom:0;padding:8px 6px 4px;border-top:0;background:var(--ground)}
.cdnsheetinhoud .cdndraadveld{background:transparent;border:0;padding:0;gap:8px}
.cdnsheetinhoud .cdndraadtekstveld{height:44px;box-sizing:border-box;border:1px solid var(--line);border-radius:22px;background:var(--seg-bg);font-size:15px;padding:0 16px}
.cdnsheetinhoud .cdndraadtekstveld:focus-visible{border-color:var(--accent)}
.cdnsheetinhoud .cdndraadstuur{width:44px;height:44px;border-radius:22px;padding:0}
.cdndraad.mobiel .cdndraadorig{padding:4px 0 12px}
.cdndraad.mobiel .cdndraadbody{font-size:14px}
.cdndraad.mobiel .cdndraadantwoord{padding:10px 0}
/* profiel */
.cdnrechtsinhoud[data-cdnsoort="profiel"]{padding:0}
.cdnprofielbanner{height:64px;background:var(--cdnprofielkleur,var(--accent));opacity:.9}
.cdnprofielvlak{padding:0 16px 16px;margin-top:-28px}
.cdnprofielav{position:relative;display:inline-block;border-radius:50%;box-shadow:0 0 0 4px var(--ground);background:var(--ground);line-height:0}
.cdnprofielav .pavatar{display:block}
.cdnprofielnaamrij{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.cdnprofielnaam{font:800 16px/1.3 "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.cdnrolpil{font:700 10px/1 "IBM Plex Sans",sans-serif;padding:3px 7px;border-radius:4px;background:var(--cdnrolkleur,var(--accent));color:var(--merk-op-blauw);text-transform:uppercase;letter-spacing:.02em;white-space:nowrap}
.cdnprofielmeta{font-size:12px;color:var(--ink-3);margin-top:2px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.cdnprofielmeta .cdlstip{position:static;width:8px;height:8px;border:0;flex:none;margin:0}
.cdnprofielbiotekst{font-size:13px;margin:10px 0 0;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}
.cdnprofielkop{font:700 11px "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-top:16px}
.cdnprofielkopgeschiedenis{margin-top:18px}
.cdnbadges{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cdnbadge{display:inline-flex;align-items:center;gap:4px;font:700 11px/1 "IBM Plex Sans",sans-serif;padding:4px 10px;border-radius:12px;background:var(--accent-wash);color:var(--accent)}
.cdnbadge .cdnico{width:12px;height:12px}
.cdnrendement{display:flex;gap:6px;margin-top:6px}
.cdnrendtegel{flex:1 1 0;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px;text-align:center}
.cdnrendtegel small{display:block;font-size:10px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis} /* v25.55 (COMMUNITY-DESIGN, integrator): de regel-in-een staat in de gedeelde regel hieronder — de bedrijfspagina2-pin (redentekst van de analistentabel mag afbreken) scant de hele staart op een small-regel met nowrap */
.cdnrendtegel small,.cdnrendtegel b{white-space:nowrap} /* v25.55 (COMMUNITY-DESIGN, integrator): label en waarde van de rendementtegel op een regel (ellipsis op het label) */
.cdnrendtegel b{display:block;font:800 14px/1.3 "IBM Plex Sans",sans-serif;font-variant-numeric:tabular-nums;color:var(--ink)}
.cdnrendtegel b.goed{color:var(--good-text)}
.cdnrendtegel b.slecht{color:var(--bad-text)}
.cdnrendvoet{font-size:10px;color:var(--ink-3);margin:6px 0 0;line-height:1.4}
.cdnschakelrij{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:var(--card);border:1px solid var(--line);margin-top:6px;cursor:pointer;min-height:44px;box-sizing:border-box}
.cdnschakelrij b{font:600 12px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink)}
.cdnprofielbioveld{display:flex;flex-direction:column;gap:4px;margin-top:6px}
.cdnprofielbiolabel{font:600 12px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink)}
.cdnprofielbio{width:100%;box-sizing:border-box;background:var(--seg-bg);border:1px solid var(--line);border-radius:8px;padding:9px 12px;color:var(--ink);font:inherit;font-size:13px;min-height:38px}
.cdnprofielbio::placeholder{color:var(--ink-3)}
.cdnprofielbio[aria-invalid="true"]{border-color:var(--bad)}
.cdnprofielbiofout{font-size:11px;color:var(--bad-text)}
.cdnprofielbiofout[hidden]{display:none}
.cdnprofielkaartknop{appearance:none;border:1px solid var(--line);background:var(--card-2);color:var(--ink-2);cursor:pointer;margin-top:8px;padding:0 12px;height:32px;border-radius:8px;font:600 12px "IBM Plex Sans",sans-serif;width:100%}
.cdngeschiedenis{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.cdngeschiedkaart{appearance:none;text-align:left;width:100%;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 10px;cursor:pointer;color:var(--ink);font:inherit;box-sizing:border-box;display:block}
.cdngeschiedkop{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--ink-3)}
.cdngeschiedkop b{color:var(--accent);font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdngeschiedkop time{white-space:nowrap}
.cdngeschiedtekst{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.45;margin-top:3px;overflow-wrap:anywhere}
.cdngeschiedleeg{padding:8px 0}
.cdnprofiellink{display:inline-block;margin-top:14px;font:600 12px "IBM Plex Sans",sans-serif;color:var(--accent);text-decoration:none;border-radius:4px}
.cdnprofielstatus{padding:14px 16px}
.cdnprofielwacht .cdnprofielnaamrij{padding:16px 16px 0}
/* profiel in de sheet (telefoon): kop met avatar 56, subregel, geen banner */
.cdnsheetinhoud .cdnrechtsinhoud[data-cdnsoort="profiel"]{padding:0 6px}
.cdnprofielmkop{display:flex;gap:12px;align-items:center;padding:4px 0}
.cdnprofiel.mobiel .cdnprofielav{box-shadow:none;background:transparent}
.cdnprofielmtekst{min-width:0;flex:1}
.cdnprofiel.mobiel .cdnprofielnaam{font-size:17px}
.cdnprofiel.mobiel .cdnbadges{padding:10px 0 0;margin-top:0}
.cdnprofiel.mobiel .cdnbadge{font-size:12px;padding:5px 10px}
.cdnprofiel.mobiel .cdnrendement{padding:10px 0 0;margin-top:0}
.cdnprofiel.mobiel .cdnrendtegel b{font-size:15px}
.cdnprofiel.mobiel .cdnprofielkop{padding:16px 0 6px;margin-top:0}
.cdnprofiel.mobiel .cdngeschiedkaart{padding:10px 12px;min-height:44px}
.cdnprofiel.mobiel .cdngeschiedtekst{font-size:13px}
.cdnprofiel.mobiel .cdnprofielbiotekst,.cdnprofiel.mobiel .cdnrendvoet,.cdnprofiel.mobiel .cdnprofiellink,.cdnprofiel.mobiel .cdnprofielmeta .cdlstip{display:none} /* v25.55 (COMMUNITY-DESIGN, P-9): het mobiele ontwerp (ref/34, r. 683-688) toont geen bio, geen voetnoot onder het rendement, geen link naar het volledige profiel en geen statusstip; het desktoppaneel houdt ze */
@media (pointer:fine){
  .cdndraadnaam,.cdngeschiedkaart,.cdnschakelrij,.cdnprofielkaartknop,.cdndraadstuur{transition:background-color .12s ease,color .12s ease,border-color .12s ease}
}
@media (prefers-reduced-motion:reduce){
  .cdndraadantwoord{animation:none}
  .cdndraadnaam,.cdngeschiedkaart,.cdnschakelrij,.cdnprofielkaartknop,.cdndraadstuur{transition:none}
}
/* v25.55 — CDN-INSTELLINGEN */
/* v25.55 (COMMUNITY-DESIGN, instellingen-1): het venster Kanaal - naam van het blok v25.55 cdn-instellingen (in de kernmodal). Regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji. */
.cdninstvorm{display:flex;flex-direction:column;gap:14px}
.cdninstveld{display:flex;flex-direction:column;gap:6px}
.cdninstlabel{font:700 11px "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.cdninstinvoer{width:100%;box-sizing:border-box;background:var(--seg-bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);font:inherit;font-size:14px;min-height:40px}
.cdninstinvoer:focus-visible{outline:2px solid var(--accent);outline-offset:-1px}
.cdninstinvoer[readonly]{color:var(--ink-2);cursor:default}
.cdninstmeldingen .cdnsegment{gap:6px;padding:0;background:transparent}
.cdninstmeldingen .cdnsegknop{height:36px;border:1px solid var(--line);background:var(--seg-bg);border-radius:8px;font-size:13px}
.cdninstmeldingen .cdnsegknop.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdninstrij{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:var(--ground);border:1px solid var(--line);cursor:pointer;min-height:44px;box-sizing:border-box}
.cdninsttekst{display:flex;flex-direction:column;min-width:0}
.cdninsttekst b{font:600 13px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink)}
.cdninsttekst small{font-size:11px;color:var(--ink-3);line-height:1.3}
.cdninstrij .cdnschakelaar{width:40px;height:24px;border-radius:12px}
.cdninstrij .cdnschakelaar span{top:3px;left:3px}
.cdninstrij .cdnschakelaar[aria-checked="true"] span{left:19px}
.cdninsthint{margin:0;font-size:11px;color:var(--ink-3);line-height:1.5}
.cdninstlink{color:var(--accent);font-weight:700;text-decoration:none;border-radius:3px}
.cdninstlink:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdnknop.cdninstannuleer{border-color:transparent;background:transparent;color:var(--ink-2)}
@media (max-width:1179px){ /* v25.55 (COMMUNITY-DESIGN, integrator): was 767 — op een tablet (768 tot 1179) paste de derde kopknop niet naast naam, onderwerp en volgknop (kop D11: h-scroll); het tandwiel hoort bij de brede weergave met het rechterpaneel (ontwerp par. 1.1), de mobiele kop kent het niet (par. 1.2) */ /* v25.55 (COMMUNITY-DESIGN, D-nazorg): het commentaar ASCII buiten het gedachtestreepje (de regel van deze staart, suite A8) */
  .cdnkopknop[data-cdnkopknop="instellingen"]{display:none}
}
@media (pointer:fine){
  .cdninstrij,.cdninstlink,.cdninstmeldingen .cdnsegknop{transition:background-color .12s ease,color .12s ease,border-color .12s ease}
}
@media (prefers-reduced-motion:reduce){
  .cdninstrij,.cdninstlink,.cdninstmeldingen .cdnsegknop{transition:none}
}
/* v25.55 — CDN-BEHEER */
/* v25.55 (COMMUNITY-DESIGN, B1): het beheerscherm uit het ontwerp op de tab Community van /beheer (blok v25.55 cdn-beheer, paneel bcGrid): navigatie 230 px + inhoud tot 780 px, de negen onderdelen, schakelrijen, tabellen, chips, kleurbollen, stat-tegels en balken. Regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji; alleen desktop (het blok tekent onder 900 px de Toren-kaart). */
.bhview .cdbtabgrid > .cdnbeheer{grid-column:1 / -1;display:grid;grid-template-columns:230px minmax(0,1fr);width:100%;max-width:none;min-height:min(72vh,820px);box-sizing:border-box;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;color:var(--ink);font:400 14px/1.45 "IBM Plex Sans",sans-serif;text-align:left}
.cdnbeheer *{box-sizing:border-box}
.cdnbeheer .cdnico,.cdnbeheer .vaico{display:inline-block;vertical-align:middle;flex:none}
.cdnbeheer button{font-family:inherit;-webkit-tap-highlight-color:transparent}
/* navigatie */
.cdnbhnav{background:var(--card-2);border-right:1px solid var(--line);padding:24px 10px;display:flex;flex-direction:column;min-width:0}
.cdnbhnavkop,.cdnbhnavgroep{font:700 11px/1.3 "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);padding:0 10px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnbhnavgroep{padding:16px 10px 6px;border-top:1px solid var(--line);margin-top:8px}
.cdnbhnavitem{appearance:none;border:0;cursor:pointer;display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;background:transparent;color:var(--ink-2);font:500 14px/1.3 "IBM Plex Sans",sans-serif;margin:1px 0;text-align:left;width:100%;min-height:34px}
.cdnbhnavitem.aan{background:color-mix(in srgb,var(--ink) 10%,transparent);color:var(--ink);font-weight:700}
.cdnbhnavico{width:18px;height:18px;display:inline-grid;place-items:center;color:var(--ink-3)}
.cdnbhnavitem.aan .cdnbhnavico{color:var(--ink)}
/* inhoud */
.cdnbhinhoud{position:relative;min-width:0;overflow:auto;scrollbar-width:thin}
.cdnbeheer .cdnbhvlak{box-sizing:content-box;padding:28px 80px 36px 36px;max-width:780px}
.cdnbhsluit{position:absolute;right:28px;top:24px;width:40px;height:40px;border-radius:20px;border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer;display:grid;place-items:center;padding:0}
.cdnbhtitel{margin:0;font:800 22px/1.2 "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink)}
.cdnbhsub{margin:4px 0 0;color:var(--ink-2);font-size:13px}
.cdnbhkop{font:700 11px/1.3 "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);margin-bottom:6px}
.cdnbhblok{margin-top:22px}
.cdnbhleeg{color:var(--ink-3);font-size:12px;margin:0}
.cdnbhfout{color:var(--bad-text)}
.cdnbhoud{margin:0;padding:14px;border:1px dashed var(--line);border-radius:10px;color:var(--ink-2);font-size:13px}
.cdnbhlink{appearance:none;border:0;background:transparent;color:var(--accent);font:600 13px "IBM Plex Sans",sans-serif;cursor:pointer;padding:0 2px}
.cdnbhhint{margin:6px 0 0;font-size:11px;color:var(--ink-3)}
.cdnbhvoetnoot{margin:10px 0 0;font-size:11px;color:var(--ink-3)}
.cdnbhcelgrijs{color:var(--ink-2);font-size:12px}
/* velden en knoppen */
.cdnbeheer .cdnbhinput{width:100%;background:var(--input-bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);font:400 14px/1.4 "IBM Plex Sans",sans-serif;margin:0;min-height:0}
.cdnbeheer .cdnbhinput:focus-visible,.cdnbhnavitem:focus-visible,.cdnbhsluit:focus-visible,.cdnbhchip:focus-visible,.cdnbhrol:focus-visible,.cdnbhrolnieuw:focus-visible,.cdnbhkleur:focus-visible,.cdnbhfilter:focus-visible,.cdnbhrolpil:focus-visible,.cdnbhknopklein:focus-visible,.cdnbhknop:focus-visible,.cdnbhkanaalweg:focus-visible,.cdnbhsegknop:focus-visible,.cdnbhwoordweg:focus-visible,.cdnbhpil:focus-visible,.cdnbhklembord:focus-visible,.cdnbhlogo:focus-visible,.cdnbhlink:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdnbeheer .cdnbhtextarea{resize:vertical;line-height:1.5}
.cdnbeheer .cdnbhinput:disabled{opacity:.6}
.cdnbhknop{appearance:none;cursor:pointer;height:34px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink);font:700 12px "IBM Plex Sans",sans-serif;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
.cdnbhknop.primair{border-color:var(--accent);background:var(--accent);color:var(--accent-tekst)}
.cdnbhknop:disabled{opacity:.5;cursor:default}
.cdnbhknopklein{appearance:none;cursor:pointer;height:28px;padding:0 10px;border-radius:6px;border:1px solid var(--line);background:transparent;color:var(--ink-2);font:600 11px "IBM Plex Sans",sans-serif;white-space:nowrap}
.cdnbhknopklein.gevaar{color:var(--bad-text)}
/* schakelrijen (40 x 24 in dit scherm; 34 x 20 in de kanaalrijen) */
.cdnbhschakels{display:flex;flex-direction:column;gap:8px;margin-top:22px}
.cdnbhschakelrij{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;background:var(--ground);border:1px solid var(--line)}
.cdnbhschakellabel{font-weight:600;font-size:13px;color:var(--ink)}
.cdnbhschakelsub{font-size:11px;color:var(--ink-3)}
.cdnbeheer .cdnschakelaar{width:40px;height:24px;border-radius:12px;background:color-mix(in srgb,var(--ink-3) 70%,transparent)}
.cdnbeheer .cdnschakelaar span{top:3px;left:3px;width:18px;height:18px}
.cdnbeheer .cdnschakelaar[aria-checked="true"]{background:var(--accent)}
.cdnbeheer .cdnschakelaar[aria-checked="true"] span{left:19px}
.cdnbeheer .cdnbhklein .cdnschakelaar{width:34px;height:20px;border-radius:10px}
.cdnbeheer .cdnbhklein .cdnschakelaar span{top:2px;left:2px;width:16px;height:16px}
.cdnbeheer .cdnbhklein .cdnschakelaar[aria-checked="true"] span{left:16px}
/* Overzicht */
.cdnbhprofiel{display:flex;gap:20px;margin-top:20px;align-items:flex-start}
.cdnbhlogo{appearance:none;border:0;padding:0;cursor:pointer;width:96px;height:96px;border-radius:28px;overflow:hidden;flex:none;position:relative;background:var(--card-2);display:block}
.cdnbhlogo img{width:100%;height:100%;display:block}
.cdnbhlogolaag{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;font:700 10px "IBM Plex Sans",sans-serif;color:var(--merk-op-blauw);background:linear-gradient(transparent,color-mix(in srgb,var(--merk-navy) 60%,transparent))}
.cdnbhprofielvelden{flex:1;min-width:0;display:flex;flex-direction:column;gap:14px}
.cdnbhchips{display:flex;gap:6px;flex-wrap:wrap}
.cdnbhchip{appearance:none;cursor:pointer;height:34px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink-2);font:600 13px "IBM Plex Sans",sans-serif;white-space:nowrap}
.cdnbhchip.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
/* Rollen */
.cdnbhrollen{display:grid;grid-template-columns:230px minmax(0,1fr);gap:16px;margin-top:18px;align-items:start}
.cdnbhrollijst{display:flex;flex-direction:column;gap:2px;min-width:0}
.cdnbhrol{appearance:none;border:0;cursor:pointer;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;background:transparent;text-align:left;width:100%;min-height:36px}
.cdnbhrol.aan{background:color-mix(in srgb,var(--ink) 10%,transparent)}
.cdnbhrolstip{width:12px;height:12px;border-radius:6px;background:var(--cdnbhrol,var(--ink-2));flex:none}
.cdnbhrolnaam{flex:1;min-width:0;font:600 13px "IBM Plex Sans",sans-serif;color:var(--cdnbhrol,var(--ink-2));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnbhroln{font-size:11px;color:var(--ink-3)}
.cdnbhrolnieuw{appearance:none;margin-top:8px;border:1px dashed var(--line);background:transparent;color:var(--accent);font:600 13px "IBM Plex Sans",sans-serif;border-radius:8px;padding:8px;cursor:pointer;min-height:36px}
.cdnbhrolkaart{background:var(--ground);border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;flex-direction:column;gap:16px;min-width:0}
.cdnbhkleuren{display:flex;gap:8px;flex-wrap:wrap}
.cdnbhkleur{appearance:none;width:30px;height:30px;border-radius:15px;border:0;cursor:pointer;padding:0;flex:none;background:var(--ink-2)}
.cdnbhkleur[data-kleur="merk"]{background:var(--merk-blauw)}
.cdnbhkleur[data-kleur="groen"]{background:var(--good)}
.cdnbhkleur[data-kleur="goud"]{background:var(--gold)}
.cdnbhkleur[data-kleur="paars"]{background:var(--nw-paars)}
.cdnbhkleur[data-kleur="oranje"]{background:color-mix(in srgb,var(--gold) 55%,var(--bad))}
.cdnbhkleur[data-kleur="grijs"]{background:var(--ink-2)}
.cdnbhkleur.aan{box-shadow:0 0 0 2px var(--ground),0 0 0 4px var(--ink)}
.cdnbhkleur[data-kleur="huidig"]{background:var(--cdnbhrol,var(--ink-2))} /* v25.55 (COMMUNITY-DESIGN, B-nazorg): de zevende bol Huidig — de bewaarde rolkleur via de eigen variabele uit het blok (geen hex in de staart) */
.cdnbhrolkaart .cdnbhapart{background:var(--input-bg);border:0;padding:10px 12px;border-radius:8px}
.cdnbhrechten{display:flex;flex-direction:column}
.cdnbhrechten .cdnbhschakelrij{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:10px 0}
.cdnbhidentiteit{padding:10px 0;font-size:13px;color:var(--ink-2)}
/* Leden */
.cdnbhzoekrij{display:flex;gap:10px;margin-top:16px;align-items:center;flex-wrap:wrap}
.cdnbeheer .cdnbhzoek{flex:1 1 240px;min-width:0;font-size:13px}
.cdnbhfilter{appearance:none;cursor:pointer;height:38px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink-2);font:600 12px "IBM Plex Sans",sans-serif;white-space:nowrap}
.cdnbhfilter.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdnbhtabel{margin-top:14px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--ground)}
.cdnbhtabelkop{background:var(--card-2);font:700 11px/1.3 "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.cdnbhledenrij{display:grid;grid-template-columns:1.4fr 1.4fr 1.2fr;gap:10px;padding:10px 14px;align-items:center;font-size:13px} /* v25.55 (COMMUNITY-DESIGN, B-nazorg): drie kolommen Lid, Rollen, acties — de kolommen Lid sinds en Actief zijn weg (geen servergegeven) */
.cdnbhledenrij + .cdnbhledenrij,.cdnbhtabelkop + .cdnbhledenrij,.cdnbhtabelkop + .cdnbhuitnrij,.cdnbhuitnrij + .cdnbhuitnrij,.cdnbhbanrij + .cdnbhbanrij{border-top:1px solid var(--line)}
.cdnbhtabelleeg{padding:16px;text-align:center;font-size:12px;color:var(--ink-3)}
.cdnbhlidcel{display:flex;align-items:center;gap:10px;min-width:0}
.pavatar.init.cdnbhav30{width:30px;height:30px;min-width:30px}
.cdnbhlidnaam{min-width:0;display:flex;flex-direction:column}
.cdnbhlidnaam b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdnbhtimeout{font:700 10px "IBM Plex Sans",sans-serif;color:var(--bad-text)}
.cdnbhrolpillen{display:flex;gap:4px;flex-wrap:wrap}
.cdnbhrolpil{appearance:none;cursor:pointer;font:700 11px "IBM Plex Sans",sans-serif;padding:2px 8px;border-radius:10px;border:1px solid var(--cdnbhrol,var(--ink-3));color:var(--cdnbhrol,var(--ink-3));background:transparent;white-space:nowrap}
.cdnbhrolpil.cdnbhrolpilvast{cursor:default;opacity:.8} /* v25.55 (COMMUNITY-DESIGN, B-nazorg): de vaste beheerpil (geen knop, wijzig via Rollen) */
.cdnbhlidacties{display:flex;gap:4px;justify-content:flex-end;flex-wrap:wrap}
/* Kanalen */
.cdnbhkanalen{display:flex;flex-direction:column;gap:18px;margin-top:18px}
.cdnbhkanaalkaart{background:var(--ground);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cdnbhkanaalkop{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;background:var(--card-2);font:700 11px/1.3 "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.cdnbhkanaalkop span{display:inline-flex;align-items:center;gap:6px}
.cdnbhkanaalrij{display:flex;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid var(--line);font-size:13px}
.cdnbhgreep,.cdnbhkanaalico{color:var(--ink-3);display:inline-grid;place-items:center}
.cdnbhkanaalnaam{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnbhkanaalschakel{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--ink-2);cursor:pointer;text-transform:none;letter-spacing:0}
.cdnbhkanaalweg{appearance:none;border:0;background:transparent;color:var(--ink-3);cursor:pointer;width:28px;height:28px;border-radius:6px;display:grid;place-items:center;padding:0}
.cdnbhkanaalweg[aria-disabled="true"]{opacity:.35}
.cdnbhkanaalschakel.cdnbhvast{cursor:default;color:var(--ink-3)} /* v25.55 (COMMUNITY-DESIGN, B-nazorg): Alleen leden op een rollenkanaal zonder de rol Lid staat vast: gedempt label met de tooltip, schakelaar gedempt */
.cdnbeheer .cdnbhvast .cdnschakelaar[aria-disabled="true"]{opacity:.45;cursor:default} /* v25.55 (COMMUNITY-DESIGN, B-nazorg): de vaste schakelaar */
.cdnbhkanaalvoet{display:flex;gap:8px;padding:10px 14px;border-top:1px solid var(--line)}
.cdnbeheer .cdnbhkanaalvoet .cdnbhinput{flex:1;padding:8px 12px;font-size:13px}
/* Moderatie */
.cdnbhseg{display:flex;gap:6px}
.cdnbhsegknop{appearance:none;cursor:pointer;flex:1 1 0;min-width:0;border:1px solid var(--line);background:var(--input-bg);color:var(--ink-2);border-radius:8px;padding:9px 0;font:600 13px "IBM Plex Sans",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdnbhsegknop.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdnbhsegklein .cdnbhsegknop{padding:0 10px;height:36px;font-size:12px;flex:0 0 auto}
.cdnbhwoorden{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.cdnbhwoord{display:inline-flex;align-items:center;gap:6px;font:600 12px "IBM Plex Sans",sans-serif;padding:5px 10px;border-radius:14px;background:color-mix(in srgb,var(--ink) 10%,transparent);color:var(--ink)}
.cdnbhwoordsoort{font-style:normal;font-weight:400;color:var(--ink-3)}
.cdnbhwoordweg{appearance:none;border:0;background:transparent;color:var(--ink-3);cursor:pointer;padding:0;width:18px;height:18px;display:inline-grid;place-items:center;border-radius:9px}
.cdnbeheer .cdnbhwoordinvoer{width:160px;border-radius:14px;padding:5px 12px;font-size:12px}
.cdnbhbans{margin-top:0;border-radius:10px}
.cdnbhbanrij{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;font-size:13px}
/* Auditlog */
.cdnbhauditfilters{display:flex;gap:6px;margin-top:14px;flex-wrap:wrap}
.cdnbhpil{appearance:none;cursor:pointer;height:32px;padding:0 12px;border-radius:16px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink-2);font:600 12px "IBM Plex Sans",sans-serif;white-space:nowrap}
.cdnbhpil.aan{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)}
.cdnbhaudit{margin-top:14px;display:flex;flex-direction:column}
.cdnbhauditrij{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.cdnbhaudittekst{flex:1;min-width:0;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.cdnbhauditwie{color:var(--accent)}
.cdnbhauditmeta{font-size:11px;color:var(--ink-3)}
/* Uitnodigingen */
.cdnbhuitnkop{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.cdnbhuitnkop .cdnbhsub{margin:0}
.cdnbhuitnacties{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cdnbhuitnacties .cdnbhknop{height:36px;padding:0 14px;font-size:13px}
.cdnbhuitnrij{display:grid;grid-template-columns:1.9fr .8fr .6fr .7fr .6fr;gap:10px;padding:10px 14px;align-items:center;font-size:13px}
.cdnbhuitnlink{display:flex;align-items:center;gap:6px;min-width:0}
.cdnbhuitnlink code{font:400 12px/1.4 ui-monospace,Menlo,Consolas,monospace;color:var(--ink);overflow-wrap:anywhere;min-width:0}
.cdnbhklembord{appearance:none;border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer;width:26px;height:26px;border-radius:6px;display:inline-grid;place-items:center;padding:0;flex:none}
/* Integraties */
.cdnbhintegraties{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}
.cdnbhintegratie{background:var(--ground);border:1px solid var(--line);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px;min-width:0}
.cdnbhintegratiekop{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.cdnbhintegratieico{color:var(--ink-2);display:inline-grid;place-items:center;width:28px;height:28px}
.cdnbhintegratienaam{font-weight:700;color:var(--ink)}
.cdnbhintegratiesub{font-size:12px;color:var(--ink-2);line-height:1.5}
.cdnbhintegratiekanaal{font-size:11px;color:var(--ink-3)}
.cdnbhintegratiekanaal span{color:var(--accent)}
.cdnbhvolgt{font-size:11px;color:var(--gold)}
/* Inzichten */
.cdnbhstats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px}
.cdnbhstat{background:var(--ground);border:1px solid var(--line);border-radius:12px;padding:14px;min-width:0}
.cdnbhstatlabel{font-size:11px;color:var(--ink-3)}
.cdnbhstatwaarde{font:800 24px/1.2 "Archivo",sans-serif;margin-top:2px;color:var(--ink)}
.cdnbhdelta{font:700 11px "IBM Plex Sans",sans-serif;color:var(--ink-3)}
.cdnbhdelta.plus{color:var(--good-text)}
.cdnbhdelta.min{color:var(--bad-text)}
.cdnbhkaart{background:var(--ground);border:1px solid var(--line);border-radius:12px;padding:18px;margin-top:14px}
.cdnbhkaarttitel{font:800 15px "Archivo",sans-serif;color:var(--ink)}
.cdnbhbalken{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.cdnbhbalkrij{display:flex;align-items:center;gap:10px;font-size:12px}
.cdnbhbalknaam{width:90px;flex:none;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnbhbalk{flex:1;height:10px;border-radius:5px;background:var(--input-bg);overflow:hidden}
.cdnbhbalkvul{height:100%;background:var(--accent);border-radius:5px}
.cdnbhbalkn{width:40px;flex:none;text-align:right;font-weight:700}
.cdnbhgedeeld{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
.cdnbhgedeeldtegel{background:var(--input-bg);border-radius:10px;padding:12px;min-width:0}
.cdnbhgedeeldico{color:var(--accent);display:inline-grid;place-items:center}
.cdnbhgedeeldnaam{font-weight:700;font-size:13px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdnbhgedeeldn{font-size:11px;color:var(--ink-3)}
/* Stand — v25.55 (COMMUNITY-DESIGN, B-stand): het stuk van de Toren-kaart (standkeuze, Stand opslaan en de derde schakelaar van die kaart) in dit scherm — v25.55 (COMMUNITY-DESIGN, integrator): het label van die schakelaar staat niet in dit commentaar, de koers-snel-staartscan A15 verbiedt het woord; de klassen van dat stuk (cdbform, cdbradio, cdblabel, bhknop, bhstat) krijgen hier de maten van het ontwerp — alleen tokens, geen eigen kleuren */
.cdnbhstand{margin-top:18px;display:flex;flex-direction:column;gap:14px;min-width:0} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbform,.cdnbhstand .cdblidblok{margin:0;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--ground);display:flex;flex-direction:column;gap:10px;min-width:0} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdblabel{font:700 11px/1.3 "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);margin:0} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbchecks{display:flex;flex-direction:column;gap:6px} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbform .cdbradio{display:flex;align-items:center;gap:10px;min-height:40px;margin:0;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink);font:600 13px/1.3 "IBM Plex Sans",sans-serif;text-transform:none;letter-spacing:0;cursor:pointer} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbradio input{margin:0;width:18px;height:18px;accent-color:var(--accent);flex:none} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbslug{font-size:11px;font-weight:400;color:var(--ink-3)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhleeg{margin:0;font-size:12px;color:var(--ink-3)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbstandfout{color:var(--bad-text)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .cdbstandfout[hidden]{display:none} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhacties{margin:0;display:flex;gap:8px;flex-wrap:wrap;align-items:center} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhknop{appearance:none;cursor:pointer;min-height:34px;padding:0 14px;border-radius:8px;border:1px solid var(--line);background:var(--input-bg);color:var(--ink);font:700 12px/1.2 "IBM Plex Sans",sans-serif;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:6px;text-align:center} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhknop.cdbprimair{border-color:var(--accent);background:var(--accent);color:var(--accent-tekst)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhknop.on{border-color:var(--accent);background:var(--accent-wash);color:var(--accent)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhknop:focus-visible,.cdnbhstand .cdbradio input:focus-visible{outline:2px solid var(--accent);outline-offset:2px} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhstats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhstat{background:var(--input-bg);border:1px solid var(--line);border-radius:12px;padding:14px;min-width:0;display:flex;flex-direction:column;gap:2px} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhstat b{font:800 24px/1.2 "Archivo",sans-serif;color:var(--ink)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
.cdnbhstand .bhstat span{font-size:11px;color:var(--ink-3)} /* v25.55 (COMMUNITY-DESIGN, B-stand) */
/* het kleine venster (time-out, verwijderen) */
.cdnbhmodal .cdnbhmodalsub{margin:0 0 10px;color:var(--ink-2);font-size:13px}
.cdnbhmodal .cdnbhmodaltekst{margin:0 0 12px;font-size:13px;color:var(--ink-2)}
.cdnbhmodal .cdnbhkop{margin-top:12px}
.cdnbhmodal .cdnsegment{margin-bottom:4px}
/* smal (het blok tekent hier de Toren-kaart; deze regels houden het scherm ook dan zonder h-scroll) */
@media (max-width:1179px){.cdnbhvlak{padding:24px 64px 32px 28px}}
@media (max-width:899px){.bhview .cdbtabgrid > .cdnbeheer{grid-template-columns:1fr}.cdnbhnav{border-right:0;border-bottom:1px solid var(--line)}.cdnbhvlak{padding:20px 16px 24px}.cdnbhsluit{right:12px;top:12px}.cdnbhrollen,.cdnbhintegraties,.cdnbhstats,.cdnbhgedeeld{grid-template-columns:1fr}.cdnbhledenrij,.cdnbhuitnrij{grid-template-columns:1fr}.cdnbhprofiel{flex-direction:column}}
@media (pointer:fine){.cdnbhinhoud{scrollbar-width:thin}}
@media (prefers-reduced-motion:reduce){.cdnbeheer .cdnschakelaar,.cdnbeheer .cdnschakelaar span,.cdnbhnavitem,.cdnbhchip,.cdnbhbalkvul{transition:none}}
/* v25.55 — CDN-DEELKNOPPEN */
/* v25.55 (COMMUNITY-DESIGN, DK1): de deel-ingangen op de bestaande schermen (Portefeuille, bedrijfspagina, Nieuws, Watchlist) — knoppen in de vorm van het ontwerp; regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji; 320 px zonder h-scroll; prefers-reduced-motion gerespecteerd. Alleen eigen klassen (cdndk-) als selector — de plek op het scherm zit in de klasse van de knop zelf, niet in een anker van de app. De knopen bestaan alleen met de poort van blok cdn-deelknoppen open; zonder die knopen raakt deze staart niets. */
.cdndkknop{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;margin:0;padding:0 14px;height:34px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--accent);font:700 13px/1 "IBM Plex Sans",sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap;vertical-align:middle;text-decoration:none;cursor:pointer;flex:none;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.cdndkknop svg{width:16px;height:16px;flex:none}
.cdndkknop span{min-width:0}
.cdndkknop.cdndkprimair{background:var(--accent);border-color:var(--accent);color:var(--accent-tekst)}
.cdndkknop.cdndkklein{height:30px;padding:0 12px;font-size:12px}
.cdndkknop.cdndkklein svg{width:14px;height:14px}
.cdndkknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdndkknop.cdndkghost:focus-visible{background:var(--accent-wash)}
.cdndkknop.cdndkprimair:focus-visible{background:var(--accent-donker)}
/* Portefeuille (cdndkpil): in de knoppenrij van de totale-waardekaart de pilvorm van de app (.pill: 4px 11px, regelhoogte van de pagina), de kleur van het ontwerp */
.cdndkknop.cdndkpil{height:auto;padding:4px 11px;border-radius:999px;font-size:12.5px;font-weight:600;line-height:1.5;gap:5px}
.cdndkknop.cdndkpil svg{width:14px;height:14px}
/* bedrijfspagina: de koerskop (cdndkkoers; ontwerp 40 px, radius 10 — in de pillenrij compact, zodat de rij op een breed scherm op een regel blijft) en de kaartkoppen van Ratio's & kwaliteit (cdndkkern) en Wat dit model uitrekent (cdndkwaardering): rechts, 30 px */
.cdndkknop.cdndkkoers{height:32px;padding:0 12px;border-radius:10px;font-size:12.5px}
.cdndkknop.cdndkkoers svg{width:14px;height:14px}
.cdndkknop.cdndkkern,.cdndkknop.cdndkwaardering{margin-left:auto}
.cdndkrij{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 8px}
.cdndkrij.cdndkkortrij{padding:0 18px;margin:8px 0 4px} /* In het kort: dezelfde inspringing als de lijst eronder (.wdkort: 0 18px) */
.cdndkrijkop{font:800 15px/1.3 "Archivo",sans-serif;color:var(--ink);letter-spacing:-.01em}
/* Nieuws (cdndkartikel): rechts in de metaregel van de artikelkaart */
.cdndkknop.cdndkartikel{margin-left:auto;height:26px;padding:0 10px;font-size:11.5px;border-radius:7px}
.cdndkknop.cdndkartikel svg{width:13px;height:13px}
/* Watchlist: de kopknop (cdndkwl; ontwerp 40 px, radius 10 — in de kop 34 px) en het pilletje Embed (cdndkembed) achter de ticker, binnen de bestaande kolommen van de rij */
.cdndkknop.cdndkwl{height:34px;padding:0 14px;border-radius:10px}
.cdndkknop.cdndkembed{height:24px;padding:0 7px;margin-left:6px;font-size:10.5px;font-weight:700;border-radius:6px;gap:4px;vertical-align:middle}
.cdndkknop.cdndkembed svg{width:11px;height:11px}
@media (pointer:fine){ .cdndkknop.cdndkembed{height:20px} }
@media (max-width:479px){
  .cdndkknop.cdndkwl{height:32px;padding:0 12px;font-size:12.5px}
  .cdndkrijkop{font-size:14px}
  .cdndkknop.cdndkartikel{height:24px;padding:0 8px;font-size:11px}
  .cdndkknop.cdndkembed{padding:0 5px;gap:0} /* smal: alleen het icoon — de tekst staat in title en aria-label; anders knipt de tickerkolom (nowrap + ellipsis) het pilletje weg */
  .cdndkknop.cdndkembed span{display:none}
}
@media (prefers-reduced-motion:reduce){ .cdndkknop{transition:none} }

/* v25.56 — STROMEN */
/* v25.56 (COMMUNITY-NATIEF, K1): staart van het blok cdn2-stromen (alle kanalen in de chatstijl). Regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji. */
.cdnkopknop[hidden]{display:none} /* tandwiel weg in een aandelenkanaal */
body.cdnactief .cdcbalk.cdn2weg{display:none} /* opgeslagen: geen balk */
body.cdn2vooraf:not(.cdnactief) .screen.feedmode{max-width:none;padding:0} /* R1-03: geen sprong bij de eerste tekening */
body.cdnactief .tickerkaart.cdn2ticker{width:auto;margin:8px 16px 0;padding:8px 12px;border-radius:10px 10px 0 0;background:var(--ground);border:1px solid var(--line);gap:10px;grid-template-columns:30px minmax(0,1fr) auto;position:sticky;top:var(--cdn2top,52px);z-index:20;min-height:62px;box-sizing:border-box} /* sticky onder de kop (z 30); vaste hoogte */
.cdn2nieuwsrij{position:sticky;top:var(--cdn2top,114px);z-index:20;margin:0 16px 8px;padding:5px 12px;background:var(--ground);border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;box-sizing:border-box}
.cdn2nieuwsrij[hidden]{display:none}
.cdn2nieuws{display:flex;align-items:center;gap:6px;min-height:24px;color:var(--accent);text-decoration:none;font:600 12px/1.3 "IBM Plex Sans",sans-serif;border-radius:6px}
.cdn2nieuws:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdn2nieuws b{font-weight:600;white-space:nowrap}
.cdn2nieuwstitel{display:none;flex:1;min-width:0;color:var(--ink-2);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:1px solid var(--line);padding-left:8px}
@media (min-width:768px){
  .cdn2nieuwstitel{display:block}
}
body.cdnactief .tickerkaart.cdn2ticker .tktegel{width:30px;height:30px;border-radius:8px;font-size:9px}
body.cdnactief .tickerkaart.cdn2ticker .ktmid b{font-size:13px}
body.cdnactief .tickerkaart.cdn2ticker .ktmid i{font-size:11px}
body.cdnactief .tickerkaart.cdn2ticker:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cdn2over{margin:0 0 4px}
.cdn2overkaart{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;margin:4px 6px 8px;display:flex;flex-direction:column;gap:8px}
.cdn2overnaam{font:700 14px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink);overflow-wrap:anywhere}
.cdn2overkoers{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-variant-numeric:tabular-nums}
.cdn2overkoers b{font:700 15px "Archivo",sans-serif;color:var(--ink)}
.cdn2overkoers i{font:600 12px "IBM Plex Sans",sans-serif;font-style:normal;color:var(--ink-2)}
.cdn2overkoers i.up{color:var(--good-text)}
.cdn2overkoers i.down{color:var(--bad-text)}
.cdn2overkoers small{font-size:11px;color:var(--ink-3)}
.cdn2overknop{align-self:flex-start}
@media (max-width:767px){
  body.cdnactief .tickerkaart.cdn2ticker{margin:8px 12px 0}
  .cdn2nieuwsrij{margin:0 12px 8px}
  .cdn2overkaart{margin:4px 4px 10px}
}

/* v25.56 — PANEEL */
/* v25.56 (COMMUNITY-NATIEF, K2): lade en Instellingen (cdn2-paneel); alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.cdn2lade{position:fixed;inset:0;z-index:47;display:flex}
.cdn2ladevlak{position:relative;width:min(320px,100%);height:100%;display:flex;flex-direction:column;background:var(--ground);color:var(--ink);box-shadow:var(--shadow);box-sizing:border-box;animation:cdn2in .2s ease-out;outline:none}
@keyframes cdn2in{from{transform:translateX(-100%)}to{transform:none}}
.cdn2kop{display:flex;align-items:center;gap:10px;padding:max(12px,env(safe-area-inset-top)) 8px 6px 16px;flex:none}
.cdn2logo{display:block;width:36px;height:36px;border-radius:12px;overflow:hidden;flex:none}
.cdn2logo img{width:100%;height:100%;display:block}
.cdn2titel{flex:1;min-width:0;display:flex;flex-direction:column}
.cdn2titel b{font:800 17px/1.2 "Archivo",sans-serif}
.cdn2sub{font-size:12px;color:var(--ink-3)}
.cdn2knop{width:40px;height:40px;border-radius:10px;position:relative}
.cdn2knop:focus-visible,.cdn2rij:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.cdn2pbel .cdnteller,.cdn2pteller{position:absolute;top:2px;right:2px}
body.cdn2paneel .kanaalkop .paneelknop{position:relative} /* v25.56 (COMMUNITY-NATIEF, K2, nazorg R1-04): teller op de menuknop */
.cdn2lijst{flex:1;overflow:auto;padding:0 8px 12px;min-height:0}
.cdn2lade .cdnrij{min-height:40px;padding:8px 10px}
.cdn2tag{font-size:11px;color:var(--ink-3);flex:none;white-space:nowrap}
.cdn2scheiding{margin-top:16px;padding-top:12px;border-top:1px solid var(--line);border-radius:0}
body.cdn2paneel .cdnhost>.cdnkanalenlijst{display:none}
.cdn2inst .cdnsheetvlak{max-height:96svh}
.cdn2inst .cdnsheetkop{padding-top:6px}
.cdn2sectie{margin:2px 0 8px}
.cdn2sectie .cdnledenkop{padding:6px 10px 3px}
.cdn2groep{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cdn2rij{appearance:none;border:0;border-top:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;width:100%;text-align:left;display:flex;align-items:center;gap:12px;padding:0 12px;min-height:44px;font:inherit;box-sizing:border-box}
.cdn2rij:first-child{border-top:0}
.cdn2rij.gevaar{color:var(--bad-text)}
.cdn2rijtekst{flex:1;min-width:0;display:flex;flex-direction:column;padding:6px 0}
.cdn2rijtekst b{font:600 14px/1.3 "IBM Plex Sans",sans-serif}
.cdn2rijtekst small{font-size:11px;color:var(--ink-3);line-height:1.3}
.cdn2seg{flex:none;min-width:160px}
.cdn2seg .cdnsegknop{height:28px;font-size:12px;padding:0 6px}
@media (min-width:768px){body.cdnactief.cdn2paneel .kanaalkop .paneelknop{display:inline-block}}
/* v25.56 (COMMUNITY-NATIEF, K2, nazorg kop D11, R1-05): 768-1179, de kanaalnaam past volledig */
@media (min-width:768px) and (max-width:1179px){body.cdn2paneel .cdnchat .kanaalkop{--cdnterugmaat:36px;--cdnkopgap:6px}body.cdn2paneel .cdnchat .cdnonderwerp{display:none}body.cdn2paneel .cdnchat .kanaalnaam b{overflow:hidden}body.cdn2paneel .cdnchat .kanaalnaam b>span:not(.khash){min-width:0;overflow:hidden;text-overflow:ellipsis}}
@media (max-width:767px){.cdn2ladevlak{width:100%;box-shadow:none}.cdn2rij{min-height:42px}.cdn2lade .cdnrij{min-height:44px;font-size:15px;border-radius:10px}.cdn2lade .cdnzoek{min-height:44px;font-size:16px;border-radius:10px}body.cdn2paneel.cdcchat .kanaalkop .paneelknop{-webkit-text-fill-color:currentColor}body.cdn2paneel.cdcchat .kanaalkop .paneelknop::before{content:none}}
@media (prefers-reduced-motion:reduce){.cdn2ladevlak{animation:none}}

/* v25.56 — KAARTEN */
/* v25.56 (COMMUNITY-NATIEF, N): natieve aandeel- en portefeuillekaart in de chat (blok v25.56 cdn2-kaarten) - hergebruik van de klassen van de aandelenpagina (tkkop, tkhead, tkkoersrij, tkbig, pday, tkspark, tkmsgs, volgknop) en van het portefeuillegedeelte (hero, lbl, big, herodelta, herosub, statgrid, stat, deltas, pill, chartbox, serieslegend, donutrow, legend); alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.cdnbijlage.cdn2aandeel{padding:0;cursor:pointer}
.cdn2aandeel .cdn2link{display:flex;align-items:center;gap:10px;padding:12px 16px 0;margin:0;color:inherit;text-decoration:none}
.cdn2aandeel .tkid{flex:1;min-width:0;gap:1px}
.cdn2aandeel .tkkop .tkidnaam > span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdn2aandeel .cdn2pijl{color:var(--ink-3);font-size:22px;line-height:1;flex:none}
.cdn2aandeel .tkc.tkhead{padding:10px 16px 8px;gap:8px}
.cdn2aandeel .tkkoersrij .tkbig b{color:var(--ink);white-space:nowrap}
.cdn2aandeel .tkpillen .volgknop{cursor:default}
.cdn2aandeel .tkmsgs.cdn2wl{cursor:pointer;background:transparent}
.cdn2aandeel .cdnkvoet{padding:0 16px 12px;margin-top:0}
.cdn2aandeel .cdn2link:focus-visible,.cdnbijlage[data-cdn2kaart]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.cdnbijlage.cdn2pf{padding:18px 18px 14px;margin-bottom:0;cursor:pointer;position:relative}
.cdn2pf .herosub{margin-top:4px}
.cdn2pf .chartbox{margin:12px 0 0;padding:0}
.cdn2pf .serieslegend{padding:8px 0 0}
.cdn2pf .donutrow{padding:12px 0 4px;gap:16px}
.cdn2pf .donutbox{width:130px;height:130px;margin:0;flex:none}
.cdn2pf .legend{min-width:0}
.cdn2pf .legend .lg{cursor:default}
.cdn2pf .lgnr{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--accent-wash);color:var(--accent);font:700 10px "IBM Plex Sans",sans-serif}
.cdn2pf .cdn2top .lg{grid-template-columns:18px 1fr}
.cdn2pf .cdn2listkop{margin-top:12px}
.cdn2pf .cdn2pfknop{cursor:pointer;color:var(--accent);border-color:var(--accent);text-decoration:none}
.cdn2pf .chartsub{margin:10px 0 0}
.cdn2deelrij{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--ink)}
.cdn2deelhint{font-size:11.5px;line-height:1.45;color:var(--ink-3);margin:6px 0 8px}
@media (max-width:767px){
  .cdn2aandeel .cdnkvoet .cdnkknoppen{display:inline-flex}
  .cdn2aandeel .tkspark{width:92px;height:36px}
  .cdn2aandeel .tkkoersrij .tkbig b{font-size:26px}
  .cdnbijlage.cdn2pf{padding:14px 14px 12px}
  .cdn2pf .donutrow{flex-direction:column;align-items:flex-start}
}

/* v25.56 — BEHEER2 */
/* v25.56 (COMMUNITY-NATIEF, B): blok v25.56 cdn2-beheer - leent CDN-BEHEER; eigen: ingebed Toren-formulier (cdnbh2vorm), knoppenrijen, rechten, chips, een kolom onder 900 px. Alleen tokens, geen id/voorrangsvlag/aanwijs-effect/emoji, ASCII. */
.cdnbh2rij{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.cdnbh2tekens,.cdnbh2vorm .cdbtelling{font-size:11px;color:var(--ink-3)}
.cdnbh2schakels{margin-top:10px}
.cdnbh2rechten{margin-top:6px;display:flex;flex-direction:column}
.cdnbh2rechten .cdnbhschakelrij{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:10px 0}
.cdnbh2chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;font-size:12px;cursor:default}
.cdnbh2naam{flex:none;margin-left:4px}
.cdnbh2knoppen{display:inline-flex;gap:4px;align-items:center;flex-wrap:wrap;text-transform:none;letter-spacing:0}
.cdnbh2knoppen .cdnbhknopklein{padding:0 8px;display:inline-flex;align-items:center;gap:4px;height:26px}
.cdnbh2knoppen .cdnbhknopklein:disabled{opacity:.35;cursor:default}
.cdnbh2knoppen .cdbico{width:14px;height:14px}
.cdnbeheer .cdnbh2vorm{margin-top:12px}
.cdnbh2vorm .cdbvelden{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}
.cdnbh2vorm .cdbbreed{grid-column:1 / -1}
.cdnbh2vorm .pbveld{display:flex;flex-direction:column;gap:4px;margin:0;font:600 12px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink-2)}
.cdnbh2vorm input:not([type=checkbox]):not([type=radio]),.cdnbh2vorm select,.cdnbh2vorm textarea{width:100%;box-sizing:border-box;background:var(--input-bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;color:var(--ink);font:400 13px/1.4 "IBM Plex Sans",sans-serif;min-height:0;margin:0}
.cdnbh2vorm input[type=color]{height:38px;padding:3px 6px}
.cdnbh2vorm .cdbchecks{display:flex;flex-direction:column;gap:6px}
.cdnbh2vorm .cdbcheck{display:flex;align-items:center;gap:8px;margin:0;font:400 13px/1.3 "IBM Plex Sans",sans-serif;color:var(--ink);text-transform:none;letter-spacing:0}
.cdnbh2vorm .cdbcheck input{width:18px;height:18px;margin:0;accent-color:var(--accent);flex:none}
.cdnbh2vorm .cdbregel,.cdnbh2vorm .cdbrolkeuze,.cdnbh2vorm .cdbvoorwaarden{display:flex;flex-direction:column;gap:8px}
.cdnbh2vorm .cdbrolkeuze .cdbchecks{flex-direction:row;flex-wrap:wrap;gap:6px 14px}
.cdnbh2vorm .cdbvoorwaarde{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.cdnbh2vorm .cdbvoorwaarde select,.cdnbh2vorm .cdbvoorwaarde input{width:auto;flex:1 1 120px}
.cdnbh2vorm .bhknop.uit{color:var(--bad-text)}
@media (max-width:899px){
 .cdnbhnav{flex-direction:row;overflow-x:auto;padding:8px;gap:2px;scrollbar-width:none}
 .cdnbhnavkop,.cdnbhnavgroep{display:none}
 .cdnbhnavitem{width:auto;flex:none;min-height:40px;padding:0 12px}
 .cdnbeheer .cdnbhvlak{max-width:none}
 .cdnbhtitel{padding-right:52px}
 .cdnbhprofiel{align-items:stretch}
 .cdnbhkanaalrij{flex-wrap:wrap;row-gap:6px}
 .cdnbhkanaalnaam{flex:1 1 calc(100% - 64px)}
 .cdnbhkanaalkop{flex-wrap:wrap}
 .cdnbhkanaalkop span{flex-wrap:wrap;white-space:nowrap}
 .cdnbhstats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cdnbh2vorm .cdbvelden{grid-template-columns:1fr}
 .cdnbhlidacties{justify-content:flex-start}
 .cdnbeheer .cdnbhwoordinvoer{width:100%}
}

/* v25.56 — COMINGSOON */
/* Rabi 13-9: de ledenblokken van de bedrijfspagina wazig, met het etiket erop; alleen tokens, geen knop om het te tonen. */
.tkc.csblur{position:relative;overflow:hidden}
.tkc.csblur>*:not(.tkvskop):not(.csetiket){filter:blur(7px);pointer-events:none;user-select:none;-webkit-user-select:none}
.csetiket{position:absolute;left:0;right:0;top:34px;bottom:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.tkc.csblur.tkledenleeg>.csetiket{top:0}
.csetiket>span{font:700 12px "Archivo",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:var(--card);border:1px solid var(--line-2);border-radius:999px;padding:8px 16px;box-shadow:0 6px 18px color-mix(in srgb, var(--ink) 12%, transparent)}

/* v25.56 — ERVARING */
/* v25.56 (COMMUNITY-NATIEF, E): staart cdn2-ervaring; alleen tokens */
.cdn2eonline{appearance:none;border:0;background:var(--card-2);color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px 0 4px;border-radius:14px;flex:none}
.cdn2estapel,.cdn2etypav{display:inline-flex;align-items:center}
.pavatar.init.cdn2eav{width:24px;height:24px;min-width:24px;border:2px solid var(--ground);margin-left:-7px}
.cdn2etypav .pavatar.init.cdn2eav{width:18px;height:18px;min-width:18px;border-width:1.5px;margin-left:-5px}
.pavatar.init.cdn2eav:first-child{margin-left:0}
.cdn2elezen{font-size:12px}
.cdn2epil{display:inline-flex;align-items:center;gap:6px}
.cdn2ereag{flex-basis:100%;font-size:11.5px;color:var(--ink-3)}
.cdn2esnel{display:inline-flex;margin-right:3px;border-right:1px solid var(--line-2)}
.cdn2esnelknop{appearance:none;border:0;background:transparent;width:30px;height:32px;font-size:15px}
body.cdnactief .cdcbalk>.cdctypslot{min-height:26px}
body.cdnactief .feedskeletten{min-height:0}
.cdnchat .kanaalview{min-height:100svh}
.cdnchat .kanaalfeed{display:flex;flex-direction:column;justify-content:flex-end}
.cdn2emenu .plusemo{display:grid;place-items:center}
/* v25.58 (HALLO-OPRUIMEN): de regels .cdn2ehallo, .cdn2ehalloico, .cdn2ehallotekst en .cdn2ehallotekst small van het kaartje E6 zijn weg — dood sinds HALLO-WEG (Rabi 15-9 ja op open punt HW-1) */
.cdn2eonline:focus-visible,.cdn2esnelknop:focus-visible{outline:2px solid var(--accent)}
.cdnkopknop{position:relative}
.cdn2eteller{display:none;position:absolute;top:2px;right:1px;background:var(--good);color:var(--ground)}
@media (max-width:1179px){.cdn2eonline{display:none}.cdn2eteller{display:inline}}
/* v25.57 — MLDLOGO */
/* v25.57 (MELDINGEN-SNEL, L2): staart mld-logo - het venster Logo van de community en een eigen logo op de vijf plekken; alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
img[data-mldl-terugval]{object-fit:cover}
.cdnlogo img[data-mldl-terugval],.cdnmlogo img[data-mldl-terugval],.cdn2logo img[data-mldl-terugval]{border-radius:inherit}
.cdnakicker img[data-mldl-terugval]{border-radius:4px}
.mldluitleg{margin:0 0 12px;color:var(--ink-2);font-size:13px;line-height:1.45}
.mldlvoorvertoning{display:flex;align-items:center;gap:14px;margin:0 0 14px}
.mldlvoorvertoning img{width:96px;height:96px;border-radius:28px;object-fit:cover;background:var(--card-2);flex:none;display:block}
.mldlhint{margin:0;font-size:12px;color:var(--ink-3);line-height:1.4}
.mldlhint.fout{color:var(--ink);font-weight:600}
.mldlmodal .cdnbhkop{display:block}
.mldlmodal .mldlveld{width:100%;box-sizing:border-box}
.mldlmodal .mldlveld:focus-visible{outline:2px solid var(--accent)}
@media (max-width:479px){.mldlvoorvertoning{flex-direction:column;align-items:flex-start}}
/* v25.57 — KANAALMODI */
/* v25.57 (MELDINGEN-SNEL, K3): staart kanaalmodi; alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.cdcbalk.kmdicht > .cdcrij,.cdcbalk.kmdicht > .cdcvoet,.cdcbalk.kmdicht > .cdcemojimenu,.cdcbalk.kmdicht > .cdnplusmenu,.kmbestand{display:none}
.kmknoppen{display:flex;flex-direction:column;gap:8px;padding:10px 12px 12px}
.kmuitleg,.kmmodusuitleg,.kmlaadtekst{margin:0;font-size:12px;line-height:1.4;color:var(--ink-3)}
.kmknoprij{display:flex;gap:8px;flex-wrap:wrap}
.kmknoprij .kmknop{flex:1 1 160px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700}
.kmsuggestie,.kmchip,.kmdagpil{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card-2);color:var(--ink);font-family:inherit;font-weight:700;font-size:12px;line-height:1.2;white-space:nowrap;cursor:pointer;max-width:260px;overflow:hidden;text-overflow:ellipsis;flex:none}
/* v25.57 (MELDINGEN-SNEL, F2, tegenlezing T2-1): font-verkorting met inherit was ongeldig en viel weg; nu losse tokens */
.kmsuggestie{margin:8px 12px 0}
.kmdagpil{cursor:default}
.kmreeks{color:var(--accent)}
.kmsuggestie:focus-visible,.kmchip:focus-visible,.kmscreenshotimg:focus-visible{outline:2px solid var(--accent)}
.kmkaart{position:sticky;top:var(--kmtop,52px);z-index:4;min-height:64px;box-sizing:border-box;margin:0 0 6px;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--ground);contain:layout}
.kmkaartbinnen{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;min-height:48px}
.kmkaarttekst{font-size:13px;line-height:1.35;color:var(--ink-2)}
.kmvragenkop,.kmlaadtekst{flex-basis:100%}
.kmchips{display:flex;gap:6px;overflow-x:auto;max-width:100%;scrollbar-width:none}
.kmchip small{font-weight:500;color:var(--ink-3)}
.kmdagpil.up,.kmdagvoorbeeld .up,.kmdag .herowrap .up{color:var(--good-text)}
.kmdagpil.down,.kmdagvoorbeeld .down,.kmdag .herowrap .down{color:var(--bad-text)}
.kmskeletregel{display:block;height:14px;border-radius:7px;background:var(--card-2);flex:1 1 240px}
.kmdagvoorbeeld{display:flex;align-items:baseline;gap:10px;margin:0 0 8px;font-size:22px;font-weight:800}
.kmbedragrij{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}
.kmscreenshot{padding:0;overflow:hidden;border-radius:14px;background:var(--card-2)}
.kmscreenshotimg,.kmgroot{display:block;max-width:100%;height:auto;max-height:70vh;object-fit:contain;margin:0 auto;cursor:zoom-in}
@media (max-width:479px){.kmkaart{padding:6px 10px}.kmknoprij .kmknop{flex-basis:100%}}
/* v25.57 — MLDKERN */
/* v25.57 (MELDINGEN-SNEL, G): staart mld-kern - de toast, de sectie Meldingen op dit apparaat, de rijen beheer/nieuws in het meldingenscherm en Beheer > Meldingen; alleen tokens, geen aanwijs-effect */
.mldtoast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%) translateY(16px);opacity:0;pointer-events:none;z-index:81;display:flex;align-items:center;gap:8px;max-width:min(92vw,520px);padding:10px 16px;border-radius:999px;background:var(--card);color:var(--ink);border:1px solid var(--line-2);box-shadow:var(--shadow);font-size:13.5px;white-space:nowrap;overflow:hidden;transition:opacity .2s ease,transform .2s ease}
.mldtoast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
.mldtoast.mldklik{cursor:pointer}
.mldtoast b{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.mldtoasttekst{color:var(--ink-3);overflow:hidden;text-overflow:ellipsis}
.mldtoastico{display:inline-flex;color:var(--accent);flex:none}
.mldtoast:focus-visible{outline:2px solid var(--accent)}
body.chatopen .mldtoast{bottom:calc(96px + env(safe-area-inset-bottom))}
.cdn2rij.mldrij{cursor:default}
.cdn2rij.mlduit .cdn2rijtekst small{color:var(--ink-2)}
.mldrij .cdnschakelaar{flex:none}
.cdn2seg[data-cdn2seg=mldvolume]{min-width:210px}
.notifrow.mldrij .mldnotifico{color:var(--accent)}
.notifrow.mldrij .notif-l b{display:block}
.mldbhuitleg{margin:0 0 12px}
.mldbh>div{margin-top:12px}
.mldbh .cdnbhtextarea{min-height:72px;resize:vertical}
.mlddoel{margin-bottom:8px}
.mldselect{width:100%;box-sizing:border-box}
.mldbhknoppen{margin-top:14px;display:flex;justify-content:flex-end}
.mldbhrij{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.mldbhrij:first-of-type{border-top:0}
.mldbhrijtekst{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mldbhrijtekst b{font-size:14px}
.mldbhrijtekst span{font-size:13px;color:var(--ink-2);overflow-wrap:anywhere}
.mldbhrijtekst small{font-size:11px;color:var(--ink-3);overflow-wrap:anywhere}
@media (max-width:479px){.mldbhknoppen .cdnknop{width:100%}.mlddoel{flex-wrap:wrap}.mlddoel .cdnbhsegknop{flex:1 1 45%}.mldbhrij{flex-wrap:wrap}}
/* v25.57 — BUGJACHT57 */
/* v25.57 (MELDINGEN-SNEL, Q): herstellingen uit de bugjacht over alle schermen (lijst Q-01 ... in docs/chatdocs/bouwer-q-v2557.md). Regels: alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect. */
/* Q-01: een <button class="pill"> zonder eigen achtergrond kreeg de knopkleur van de browser (grijs vlak in het donkere thema, 2,4:1 met de tekst) en het systeemlettertype; :where() houdt de voorrang op nul, zodat elke bestaande pil-achtergrond (kaart, wash, op-stand) blijft winnen. */
:where(button.pill){appearance:none;background:transparent;font-family:inherit;cursor:pointer}
/* Q-03: de waarschuwingsregel op het dashboard stond vast in het donkere amber (1,8:1 op de lichte kaart); in het lichte thema de donkere goudtint van de scenariokleuren (de zoekstand .kbzoekend houdt het accent). */
:root[data-theme="light"] .herowarn:not(.kbzoekend){color:var(--scn-boven);background:color-mix(in srgb, var(--scn-boven) 7%, transparent);border-color:color-mix(in srgb, var(--scn-boven) 28%, transparent)}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) .herowarn:not(.kbzoekend){color:var(--scn-boven);background:color-mix(in srgb, var(--scn-boven) 7%, transparent);border-color:color-mix(in srgb, var(--scn-boven) 28%, transparent)}}
/* Q-04: het onderschrift van een statistiek verwees naar een token dat niet bestaat (--mut) en viel terug op een vaste grijstint (3,3:1 op wit); nu de derde inktkleur van het thema. */
.stat .statsub{color:var(--ink-3)}
/* Q-07: grotere tikvlakken zonder het beeld te veranderen: de statusknop in de voet van de lade (14 px hoog) krijgt binnenruimte die de buitenruimte terugneemt; kleine knoppen (insluiten, klembord, archiveren, omhoog/omlaag, schakelaars, legenda-kruisjes) krijgen een onzichtbaar tikvlak boven en onder (nooit opzij: buren blijven van elkaar). */
.cdnvoetstatus{padding-block:5px;margin-block:-5px}
.embknop,.cdnbhklembord,.cdnbhkanaalweg,.cdnbhknopklein,.cdnschakelaar,.serieslegend .sl .slx,.seriestoggles .stgl .slx{position:relative}
.embknop::after,.cdnbhklembord::after,.cdnbhkanaalweg::after,.cdnbhknopklein::after,.cdnschakelaar::after,.serieslegend .sl .slx::after,.seriestoggles .stgl .slx::after{content:"";position:absolute;inset:-7px 0}
/* v25.57 — ROLBADGES */
/* v25.57 (MELDINGEN-SNEL, R, rolbadges): staart rol-badges - meerdere rolpillen naast de gekozen badge op de berichtkaart en in het profielpaneel; de kleuren komen inline uit de databank; alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.cdnrolpillen{display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap;align-self:center;vertical-align:middle;min-width:0}
.post.ck.cdnkaart .cdnrolpillen{gap:4px}
.cdnprofielnaamrij .cdnrolpillen{gap:6px}
.rbvink{display:inline-flex;align-items:center;gap:3px;color:var(--accent);align-self:center;vertical-align:middle;white-space:nowrap;font:700 10px/1 "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.04em}
.rbvink svg{flex:none}
/* v25.57 — HUISREGELSZICHT */
/* v25.57 (MELDINGEN-SNEL, H, huisregels): staart huisregels-zicht - de cdk-banner in de vaste chatbalk (boven de invoerrij), de knop in de foutregel, de uitgeschakelde verstuurknop duidelijk uit en doorlaatbaar voor een tik; alleen tokens */
body.cdnactief .cdcbalk>.cdkbanner{order:-2;margin:10px 0 6px}
.cdcbalk>.cdkbanner{margin:0 0 8px}
.cdcfout .hzfoutknop{display:inline-flex;align-items:center;min-height:32px;margin:4px 0 2px 8px;padding:4px 12px;font-size:13px;vertical-align:middle}
.cdcstuur.hzblok:disabled{pointer-events:none}
body.cdnactief .cdcbalk .cdcstuur.hzblok:disabled{opacity:1;background:var(--card-2);color:var(--ink-3)}
/* v25.57 — NAAMKLEUR */
/* v25.57 (MELDINGEN-SNEL, N3, naamkleur): staart naam-kleur - het etiket Admin achter de naam van een beheerder of moderator (vorm van de redactiebadge, roze --vg-3, letters in de kaartkleur: 5,7:1 donker en 5,9:1 licht) en de eigen threadnaam in de tekstkleur; de naamkleuren staan inline (token of databankkleur); alleen tokens */
.nkadmin{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:5px;background:var(--vg-3);color:var(--card);font:700 10px/1 "Archivo",sans-serif;letter-spacing:.06em;white-space:nowrap;align-self:center;vertical-align:middle;flex:none}
.post.ck.cdnkaart .nkadmin{height:16px;border-radius:4px}
.cdnlidnaam .nkadmin,.cdndraadkop .nkadmin{height:15px;font-size:9px}
.cdnlidnaam .nkadmin,.cdnprofielnaam .nkadmin{margin-left:6px}
.cdndraadnaam.mijn{color:var(--ink)}
/* v25.57 — KANAALVOLGORDE */
/* v25.57 (MELDINGEN-SNEL, V, volgorde): staart kanaal-volgorde - de greep op kanaalrijen en categoriekoppen (sleepbaar, toetsenbordfocus), de rij of kaart die versleept wordt als invoegplek, de stille markering tijdens het opslaan; alleen tokens */
.cdnbeheer .kvgreep{cursor:grab;touch-action:none;border-radius:6px;padding:4px;margin:-4px}
.cdnbeheer .cdnbhkanaalkop .kvgreep{padding:2px 4px;margin:-2px -4px}
.cdnbeheer .kvgreep:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
body.kvsleepbezig{cursor:grabbing;user-select:none;-webkit-user-select:none}
body.kvsleepbezig .cdnbeheer .kvgreep{cursor:grabbing}
.cdnbeheer .cdnbhkanaalrij.kvsleept{opacity:.7;background:var(--card-2);outline:2px dashed var(--accent);outline-offset:-2px;border-radius:8px}
.cdnbeheer .cdnbhkanaalkaart.kvsleept{opacity:.7;outline:2px dashed var(--accent);outline-offset:2px}
.cdnbeheer .kvbezig>.cdnbhkanaalkop>span:first-child::after,.cdnbeheer .cdnbhkanalen.kvbezig>.cdnbhkanaalkaart>.cdnbhkanaalkop>span:first-child::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);opacity:.8;margin-left:6px;animation:kvpuls 1s ease-in-out infinite alternate}
@keyframes kvpuls{from{opacity:.25}to{opacity:.9}}
@media (prefers-reduced-motion:reduce){.cdnbeheer .kvbezig>.cdnbhkanaalkop>span:first-child::after{animation:none}}
/* v25.58 — SAMENKAART */
/* v25.58 (SAMEN-IEDEREEN, D, samenkaart): staart samen-kaart - de hero boven deel-je-dagresultaat (teller, tweestrijd-balk, gloed), .skdag = skelet en hero even hoog; alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.kmkaart.skdag{min-height:132px}
.skhero{--sk-kleur:var(--accent);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"kop pil" "twee oordeel";gap:8px 14px;align-items:center;padding:10px 14px;border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--sk-kleur) 14%,var(--card)),var(--card) 72%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sk-kleur) 32%,var(--line-2))}
.skhero.up{--sk-kleur:var(--good)}
.skhero.down{--sk-kleur:var(--bad)}
.skzin{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.skkop{grid-area:kop;min-width:0}
.skkicker{display:block;font:700 11px/1.2 "Archivo",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.skregel{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.skteller{display:inline-grid;font:800 26px/1.1 "Archivo",sans-serif;font-variant-numeric:tabular-nums;color:var(--ink)}
.skteller>span{grid-area:1/1;white-space:nowrap}
.sktellermaat{visibility:hidden}
.skvermogen{font-size:13px;color:var(--ink-2)}
.skpillen{grid-area:pil;display:flex;flex-wrap:wrap;gap:6px;justify-self:end}
.sktwee{grid-area:twee;display:grid;gap:5px}
.skrij{display:grid;grid-template-columns:72px minmax(0,1fr) 54px;align-items:center;gap:8px;font-size:12px}
.sklabel{font-weight:600;color:var(--ink-3)}
.skbaan{display:block;height:8px;border-radius:999px;background:var(--card-2)}
.skvul{display:block;height:100%;border-radius:inherit;background:var(--line-2);transform-origin:left center;transform:scaleX(var(--sk-w,0));animation:skgroei .7s ease-out both}
.skvul.up{background:var(--good)}
.skvul.down{background:var(--bad)}
@keyframes skgroei{from{transform:scaleX(0)}}
.skwaarde{text-align:right;font-weight:700}
.skoordeel{grid-area:oordeel;justify-self:end;font-size:12px;font-weight:700;color:var(--ink-2)}
.skwaarde.up,.skoordeel.voor{color:var(--good-text)}
.skwaarde.down,.skoordeel.achter{color:var(--bad-text)}
@media (max-width:479px){.kmkaart.skdag{min-height:198px}.skhero{grid-template-columns:minmax(0,1fr);grid-template-areas:"kop" "pil" "twee" "oordeel";gap:8px}.skpillen,.skoordeel{justify-self:start}}
@media (prefers-reduced-motion:reduce){.skvul{animation:none}}
/* v25.58 — TAPEALGEMEEN */
/* v25.58 (SAMEN-IEDEREEN, T, tape-algemeen): staart tape-algemeen - de stille tickerrij bovenaan het kanaal beleggen-algemeen in de chatweergave: vaste hoogte (token --ta-h), plakt onder de kanaalkop (--tatop, gemeten zoals de kanaalkaart), met de vinger horizontaal te schuiven, geen beweging; geen sprong: de rij neemt geen ruimte van de lijst (negatieve ondermarge, de lijst krijgt een even hoge doorzichtige bovenrand) zodat de lijst niet verschuift als de rij komt of gaat; staat de kanaalkaart van K3 er ook, dan schuift die eronder; de items dragen de bestaande tapeitem-regels; alleen tokens */
body.cdnactief .kanaalview{--ta-h:42px}
.tarij{position:sticky;top:var(--tatop,52px);z-index:5;display:flex;align-items:center;gap:4px;height:var(--ta-h,42px);box-sizing:border-box;margin:0 0 calc(-1 * var(--ta-h,42px));padding:0 10px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;border-bottom:1px solid var(--line);background:var(--ground);contain:layout}
.tarij::-webkit-scrollbar{display:none}
.tarij .tapeitem{flex:none;padding:5px 10px}
.tarij .tapeitem:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tarij .tadiv{flex:none;width:1px;height:16px;margin:0 6px;background:var(--line)}
.tarij:not([hidden])~.kanaalfeed{border-top:calc(var(--ta-h,42px) + 6px) solid transparent}
.tarij:not([hidden])~.kmkaart:not([hidden]){margin-top:var(--ta-h,42px);top:calc(var(--kmtop,52px) + var(--ta-h,42px))}
.tarij:not([hidden])~.kmkaart:not([hidden])~.kanaalfeed{border-top:0}
@media (max-width:479px){.tarij{padding:0 6px}}
/* v25.58 — EENBADGE */
/* v25.58 (SAMEN-IEDEREEN, B, eenbadge): staart een-badge - het ene vinkje achter de naam (blauw --eb-blauw = --accent, goud --eb-goud = --gold; de databankkleur van Prominent staat inline), het uitlegkaartje, de stille stijlpil, de keuzerij Beleggersstijl; alleen tokens */
:root{--eb-blauw:var(--accent);--eb-goud:var(--gold)}
.ebvink{display:inline-flex;align-items:center;justify-content:center;flex:none;width:16px;height:16px;padding:0;margin:0 0 0 -2px;border:0;border-radius:50%;background:transparent;color:var(--eb-blauw);cursor:pointer;vertical-align:middle;align-self:center;line-height:0}
.ebvink.ebklein{width:14px;height:14px}
.ebvink.ebgoud{color:var(--eb-goud)}
.ebvink svg{width:100%;height:100%;display:block}
.ebvink svg circle{fill:currentColor}
.ebvink svg path{fill:none;stroke:var(--merk-op-blauw);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ebvink.ebgoud svg path{stroke:var(--merk-navy)}
.ebvink.ebgoud.ebdonker svg path{stroke:var(--merk-op-blauw)}
.ebvink:focus-visible,.ebkeuze:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
span.ebvink{cursor:inherit}
.cdnlidnaam .ebvink{margin-left:4px;vertical-align:-3px}
.lpnaam .ebvink{width:18px;height:18px;margin-left:4px;vertical-align:-2px}
.ebuitleg{position:fixed;z-index:70;display:flex;align-items:center;gap:8px;max-width:min(320px,calc(100vw - 16px));padding:7px 10px; /* v25.58 (SAMEN-IEDEREEN, integrator, nazorg vinkje): zin en badge naast elkaar (was een kop en een zin onder elkaar) */border-radius:10px;background:var(--card);color:var(--ink);border:1px solid var(--line-2);box-shadow:0 8px 28px color-mix(in srgb, var(--merk-navy) 40%, transparent);font:500 12.5px/1.4 "IBM Plex Sans",sans-serif}
.ebuitlegzin{flex:1 1 auto;min-width:0} /* v25.58 (SAMEN-IEDEREEN, integrator, nazorg vinkje): was .ebuitleg b (de kop) */
.ebuitlegbadge{display:inline-flex;align-items:center;flex:none;height:18px;padding:0 8px;border-radius:999px;font:700 10px/1 "Archivo",sans-serif;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.ebuitlegbadge.ebblauw{color:var(--eb-blauw);background:color-mix(in srgb,var(--eb-blauw) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--eb-blauw) 35%,transparent)}
.ebuitlegbadge.ebgoud{color:var(--eb-goud);background:color-mix(in srgb,var(--eb-goud) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--eb-goud) 40%,transparent)}
.ebstijl{display:inline-flex;align-items:center;flex:none;height:16px;padding:0 7px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2);font:600 10px/1 "IBM Plex Sans",sans-serif;letter-spacing:.02em;white-space:nowrap;align-self:center;vertical-align:middle}
.cdnprofielnaamrij .ebstijl{height:18px;font-size:11px}
.cdn2rij.ebrij{cursor:default}
.ebkeuze{flex:none;max-width:48%;min-height:32px;padding:0 8px;border-radius:8px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink);font:500 13px "IBM Plex Sans",sans-serif;cursor:pointer}
@media (prefers-reduced-motion:no-preference){.ebuitleg{animation:ebin .16s ease-out}}
@keyframes ebin{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.ebuitleg{animation:none}}
/* v25.58 — IEDEREEN */
/* v25.58 (SAMEN-IEDEREEN, E, iedereen): staart iedereen - de kanaalrij rood (token --bad) met een teller zodra er een @everyone ongelezen staat (paneel .krij, kanalenkolom en lade .cdnrij, oude lade), de @everyone-vermeldingspil, de meldingsrij; de teller verschijnt met een korte zachte puls (transform, geen verschuiving), zonder beweging bij prefers-reduced-motion; alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.krij.ierood .kopen .knaam,.krij.ierood .kopen .khash,.cdnrij.ierood,.cdnrij.ierood .cdnrijnaam,.cdnrij.ierood .cdnrijico{color:var(--bad);font-weight:700}
.ieteller{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;box-sizing:border-box;padding:0 6px;border-radius:9px;background:var(--bad);color:var(--merk-op-blauw);font:700 10.5px/1 "IBM Plex Sans",sans-serif;letter-spacing:0;flex:none;margin-left:6px;vertical-align:middle;animation:iepuls .45s ease-out 1}
.krij .kopen .ieteller{margin-left:auto}
.cdnrij .ieteller{margin-left:auto}
.cdnrij .cdnteller+.ieteller,.cdnrij .cdnongelezen+.ieteller,.cdnrij .cdnat+.ieteller{margin-left:6px}
.mention[data-ie]{color:var(--bad);background:color-mix(in srgb, var(--bad) 14%, transparent);font-weight:700}
.notifrow.ierij .ienotifico{color:var(--bad);display:inline-flex;align-items:center}
.notifrow.ierij .notif-l b{display:block;color:var(--bad)}
@keyframes iepuls{from{transform:scale(.6);opacity:.3}to{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){.ieteller{animation:none}}
/* v25.58 — BREAKING */
/* v25.58 (SAMEN-IEDEREEN, L, breaking): staart breaking - de live-balk voor een beheermelding, vast bovenaan (onder veilige zone en --nlbar), rood/roze uit --bad en --vg-3; alleen tokens; minder beweging = stil */
.brkbalk{--brk-rood:color-mix(in srgb,var(--bad) 78%,var(--merk-navy));--brk-roze:color-mix(in srgb,var(--vg-3) 72%,var(--merk-navy));position:fixed;top:var(--nlbar,0px);left:0;right:0;z-index:82;display:flex;align-items:center;gap:6px;padding:env(safe-area-inset-top) 6px 0 0;transform:translateY(-100%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s;color:var(--merk-op-blauw);background:linear-gradient(90deg,var(--brk-rood),var(--brk-roze));box-shadow:var(--shadow)}
.brkbalk.brkaan{transform:none;visibility:visible;transition:transform .25s ease,visibility 0s}
.brkopen{appearance:none;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:default;display:flex;align-items:center;gap:10px;flex:1;min-width:0;min-height:44px;padding:6px 0 6px 12px}
.brkbalk.brklink .brkopen{cursor:pointer}
.brkopen:focus-visible,.brkx:focus-visible{outline:2px solid var(--merk-op-blauw);outline-offset:-3px}
.brklive{display:inline-flex;align-items:center;gap:5px;flex:none;padding:4px 7px;border-radius:5px;background:var(--merk-op-blauw);color:var(--brk-rood);font:800 10.5px/1 "Archivo",sans-serif;letter-spacing:.08em}
.brkstip{width:6px;height:6px;border-radius:999px;background:var(--brk-rood);animation:brkpuls 1.1s ease-in-out infinite}
@keyframes brkpuls{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}
.brktekst{display:flex;align-items:baseline;gap:8px;min-width:0;font-size:13.5px;line-height:1.3}
.brktitel{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none;max-width:62%}
.brkinhoud{opacity:.92;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.brkx{appearance:none;border:0;background:transparent;color:inherit;cursor:pointer;flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px}
@media (min-width:1180px){.brkopen{padding-left:max(12px,calc(50% - 578px))}.brkx{margin-right:max(0px,calc(50% - 596px))}}
@media (max-width:479px){.brktekst{flex-direction:column;align-items:flex-start;gap:1px}.brktitel{max-width:100%}.brkinhoud{font-size:12.5px}}
@media (prefers-reduced-motion:reduce){.brkbalk,.brkbalk.brkaan{transition:none}.brkstip{animation:none}}
/* v25.58 — TOEGANKELIJK */
/* v25.58 (SAMEN-IEDEREEN, Q2, CLIENT-TOEGANKELIJK, bugjacht58 toegankelijk 4): staart toegankelijk - de screenshot- en bestandknop van de assistent (label.camerabtn, nu met tabindex 0 en role button) tonen een zichtbare focusring; alleen tokens, geen beweging. De toast-opmaak (toegankelijk 0: meerdere regels i.p.v. afkappen) staat als inline-stijl in btToastEl, omdat de toast een id-selector heeft en een staart die niet mag overschrijven */
.camerabtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* v25.58 — DAGKANAALSTRAK */
/* v25.58 (SAMEN-IEDEREEN, integrator, nazorg dagkanaal): staart dagkanaal-strak - Rabi 14-9 bij een schermafbeelding van deel-je-dagresultaat op de telefoon: "veels te druk ... strakker, compacter en kleiner". De samen-kaart als een compacte regel (kicker, teller, aan vermogen) met een smalle tweestrijd en de reekspil naast het oordeel (de dagpil herhaalde de balk en is weg), de dagresultaat-kaart in de chat kleiner (cijfer, tegels op een rij, kleine voet), de twee knoppen naast elkaar; alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji */
.kmkaart.skdag{min-height:134px}
.skhero{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"kop kop" "twee twee" "pil oordeel";gap:5px 10px;padding:8px 12px;border-radius:12px}
.skkicker{font-size:10px;letter-spacing:.07em}
.skregel{gap:6px}
.skteller{font-size:21px}
.skvermogen{font-size:12px}
.skhero .skpillen{justify-self:start;display:block;min-width:0;max-width:100%}
.skhero .skpillen .kmdagpil{display:block;max-width:100%;box-sizing:border-box;padding:2px 8px;font-size:11px;line-height:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.skhero .skpillen .kmdagpil svg{vertical-align:-3px;margin-right:4px}
.skhero .skpillen .kmdagpil:not(.kmreeks){display:none}
.sktwee{gap:3px}
.skrij{grid-template-columns:62px minmax(0,1fr) 50px;gap:6px;font-size:11px}
.skbaan{height:6px}
.skoordeel{justify-self:end;font-size:11px;white-space:nowrap}
.skhero.vlak .skoordeel{justify-self:start;white-space:normal}
.cdnbijlage.cdn2pf.kmdag{padding:12px 14px 10px}
.kmdag .lbl{font-size:10px}
.kmdag .big{font-size:clamp(24px,6.5vw,30px);margin-top:3px}
.kmdag .herodelta{font-size:12.5px}
.kmdag .herosub{font-size:12px;margin-top:2px}
.kmdag .statgrid{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:8px}
.kmdag .stat{flex:0 1 auto;padding:0;border:0;border-radius:0;background:transparent;gap:1px}
.kmdag .stat .slbl{font-size:9px}
.kmdag .stat b{font-size:14px}
.kmdag .chartsub{margin:8px 0 0;font-size:10.5px}
.kmknoppen{gap:6px;padding:8px 12px 10px}
.kmuitleg{font-size:11.5px;line-height:1.35}
.kmknoprij .kmknop{min-height:40px;font-size:13px}
@media (max-width:479px){.kmkaart.skdag{min-height:130px}.kmknoprij .kmknop{flex:1 1 auto;min-width:0;padding-left:10px;padding-right:10px;font-size:12.5px}.kmknoprij .kmknop span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
/* v25.58 — DAGKANAALPIL */
/* v25.58 (SAMEN-IEDEREEN, integrator, nazorg dagkanaal): vervolg op DAGKANAALSTRAK na de samenvoeging van PR 142 (v25.58 (SAMEN-IEDEREEN, integrator, nazorg dagkanaal): het hekje weg, de hexcontrole van de suites leest commentaar mee) - de reekspil op een regel (20 px, ster inline), het oordeel ook 20 px, de pil weer 12 px zoals de chips (tegenlezing T2-1), skelet en kaart gelijk: 133 px telefoon / 137 px desktop; alleen aangehangen, de eerdere staarten blijven byte-gelijk */
.kmkaart.skdag{min-height:137px}
.skhero .skpillen .kmdagpil{height:20px;font-size:12px}
.skhero .skpillen .kmdagpil svg{display:inline-block}
.skoordeel{display:inline-flex;align-items:center;min-height:20px}
@media (max-width:479px){.kmkaart.skdag{min-height:133px}}
/* v25.58 — WOORDTIMEOUT */
/* v25.58 (WOORD-TIMEOUT): staart woordtimeout - de ene zin in de chatbalk bij een time-out of een gesloten account (wtdicht verbergt de rest van de balk), reacties/likes/stemmen gedempt voor dat lid (body.wtdicht), het keuzesegment in het beheervenster over twee regels (Rabi's vijf voorop), de pil PERMANENT; alleen tokens, geen beweging */
.cdcbalk.wtdicht > :not(.wtzin){display:none}
.wtzin{margin:0;padding:12px 14px;font-size:13px;line-height:1.4;color:var(--ink-3);text-align:center}
.wtzin[data-wt="blokkade"]{color:var(--bad-text)}
body.wtdicht .actlike,body.wtdicht .hovacts [data-hov="reactie"],body.wtdicht .reactieplus,body.wtdicht .reactiechip,body.wtdicht .cdcwerkbalk [data-cdcwb="reageer"],body.wtdicht .peiling .popt{opacity:.45;pointer-events:none}
.cdnbhmodal .wtsegment{flex-wrap:wrap}
.cdnbhmodal .wtsegment .cdnsegknop{flex:1 1 calc(20% - 4px)}
.cdnbhmodal .wtstatus{margin:0 0 10px;font-size:13px;font-weight:600;color:var(--bad-text)}
.cdnbhmodal .wtuitleg{margin:6px 0 10px;font-size:12.5px;line-height:1.4;color:var(--ink-3)}
.cdnbhtimeout.wtpermanent{color:var(--bad-text)}
/* v25.58 — PERSBERICHTENPRO */
/* v25.58 (PERSBERICHTEN-PRO): staart persberichten-pro - budgetspreiding (S), publiceer-overal (P), AI-bewerken (A); alleen tokens, geen hexwaarden, geen voorrangsvlag, geen id-selector, geen aanwijs-woord; elke groep begint met een eigen commentaarregel */
/* v25.58 (PERSBERICHTEN-PRO, S): budgetspreiding en huisstijl in het klapblok Instellingen - tekstvak huisstijl, zes aandeelvelden in een raster (drie per rij op smal), somregel (rood bij som ongelijk aan 100), uitlegregels; alleen tokens */
.pbprohuis textarea{width:100%;min-height:120px;box-sizing:border-box;font:inherit;font-size:13px;line-height:1.45;color:var(--ink);background:var(--input-bg);border:1px solid var(--line-2);border-radius:10px;padding:8px 10px;resize:vertical}
.pbprouitleg{margin:4px 0 8px;font-size:12.5px;line-height:1.4;color:var(--ink-3)}
.pbproreserve input{width:72px;text-align:right}
.pbprospreid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px 8px;margin:6px 0}
.pbprospreid input{width:100%;min-width:0;box-sizing:border-box;text-align:right}
.pbprospreid .bhveld span{font-size:11.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pbprosom{font-size:12px;color:var(--ink-3);margin-right:auto}
.pbprosom.fout{color:var(--bad-text);font-weight:600}
.pbprohuis .bhacties,.pbprospreiding .bhacties{align-items:center}
@media (max-width:560px){.pbprospreid{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* v25.58 (PERSBERICHTEN-PRO, P): publiceer-overal - de knop Publiceer met drie vinkjes (app, site, liveblog) in de rij en in het kaartje, het vak Kanalen; alleen tokens */
.pbpubcluster{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.pbpubdoel{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--ink-2);cursor:pointer}
.pbpubdoel input{margin:0}
.pbpubdoel.uit{color:var(--ink-3);cursor:default}
.pbwvak .pbpubdoel{display:flex;font-size:13px}
.pbprokanalen ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.pbprokanalen li{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px}
.pbprokanaal.ok{color:var(--good-text)}
.pbprokanaal.fout{color:var(--bad-text)}
.pbprokanaal.leeg{color:var(--ink-3)}
/* v25.58 (PERSBERICHTEN-PRO, A): AI-bewerken - de dialoog Pas aan met AI / Schrijf bericht in het bestaande venster (presets als ingedrukte knoppen, tekstvak met teller, grijze regel met de vaste regels), de knop Schrijf bericht naast Schrijf nu, de AI-knop per liveblogkaart op Nieuws; alleen tokens */
.pbprodialoog{display:flex;flex-direction:column;gap:10px;padding:4px 0 2px}
.pbpropresets{display:flex;flex-wrap:wrap;gap:6px}
.pbpropreset{font-size:12.5px;padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink-2)}
.pbpropreset[aria-pressed="true"]{background:var(--accent-wash);border-color:var(--accent);color:var(--ink)}
.pbproveld{display:flex;flex-direction:column;gap:4px}
.pbproveld>span{font-size:12px;font-weight:600;color:var(--ink-2)}
.pbproveld textarea{width:100%;min-height:96px;resize:vertical;font:inherit;font-size:13.5px;line-height:1.45;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}
.pbproveld input[type="text"]{width:100%;font:inherit;font-size:13.5px;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}
.pbproteller{align-self:flex-end;font-size:12px;font-style:normal;color:var(--ink-3)}
.pbpromelding{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2)}
.pbproregels{margin:0;font-size:12.5px;line-height:1.4;color:var(--ink-3)}
.lbrrij .pbprolb{margin-left:6px}
.nwblogkaart .pbproai{margin-left:8px}
.nwschrijf.pbprolb{margin-left:8px}
.pbmenu [role="menu"] .pbproai{font-weight:600}
@media (max-width:479px){.pbpropresets{gap:4px}.pbpropreset{font-size:12px;padding:4px 8px}}
/* v25.58 — KWALITEIT */
/* v25.58 (KWALITEIT): staart kwaliteit - de kaart Kwaliteit van het bedrijf bovenaan de tab Kerncijfers (ring met getal, label, telling, acht meetlatrijen met balkje, de ene zin, de voetregel); alleen tokens, geen hexwaarden, geen voorrangsvlag, geen id-selector, geen aanwijs-woord */
.kqkaart .kqsub{font-size:11.5px;color:var(--ink-3);font-weight:400}
.kqinhoud{display:flex;flex-direction:column;gap:10px}
.kqnvt{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.kqkop{display:flex;align-items:center;gap:14px}
.kqring{position:relative;width:72px;height:72px;flex:0 0 72px}
.kqring svg{width:72px;height:72px;transform:rotate(-90deg)}
.kqring circle{fill:none;stroke-width:3.4}
.kqring .kqspoor{stroke:var(--line-2)}
.kqring .kqvul{stroke:var(--ink-3);stroke-linecap:round;transition:stroke-dasharray .6s ease}
.kqkop.sterk .kqvul{stroke:var(--good)}
.kqkop.gemiddeld .kqvul{stroke:var(--gold)}
.kqkop.zwak .kqvul{stroke:var(--bad)}
.kqring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ink)}
.kqkoptekst{display:flex;flex-direction:column;gap:3px;min-width:0}
.kqlabel{display:inline-block;align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:var(--stat-bg);color:var(--ink-2)}
.kqkop.sterk .kqlabel{color:var(--good-text)}
.kqkop.gemiddeld .kqlabel{color:var(--gold)}
.kqkop.zwak .kqlabel{color:var(--bad-text)}
.kqn{font-size:12px;color:var(--ink-3)}
.kqzin{margin:2px 0 0;font-size:14px;line-height:1.45;color:var(--ink)}
.kqrijen{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.kqrij{display:grid;grid-template-columns:minmax(0,1.7fr) auto minmax(56px,1fr) 2.4em;gap:2px 10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.kqnaam{font-size:13px;line-height:1.35;color:var(--ink);min-width:0}
.kqnaam i{display:block;font-style:normal;font-size:11px;color:var(--ink-3)}
.kqwaarde{font-size:13px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;color:var(--ink)}
.kqwaarde b{font-weight:600}
.kqrij.nvt .kqwaarde{color:var(--ink-3);white-space:normal;text-align:right}
.kqrij.nvt .kqwaarde i{display:block;font-style:normal;font-size:11px;color:var(--ink-3)}
.kqbalk{display:block;height:6px;border-radius:999px;background:var(--stat-bg);overflow:hidden;min-width:56px}
.kqbalk i{display:block;height:100%;border-radius:999px;background:var(--ink-3);width:0}
.kqrij.sterk .kqbalk i{background:var(--good)}
.kqrij.gemiddeld .kqbalk i{background:var(--gold)}
.kqrij.zwak .kqbalk i{background:var(--bad)}
.kqdeel{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;color:var(--ink-2)}
.kqrij.nvt .kqdeel{color:var(--ink-3)}
.kqmeta{grid-column:1 / -1;font-size:11px;color:var(--ink-3)}
.kqvoet{margin-top:2px}
@media (max-width:479px){.kqrij{grid-template-columns:minmax(0,1fr) auto 2.4em}.kqbalk{grid-column:1 / -1;min-width:0}.kqring{width:64px;height:64px;flex-basis:64px}.kqring svg{width:64px;height:64px}.kqring b{font-size:20px}}
/* v25.58 — OMGEKEERD */
/* v25.58 (OMGEKEERD): de rij Wat zit er in de koers in de kaart De Belegger-analyse - groeizin, groeischaal met drie merkjes, waarde-band Bear-Bull met de koers als merkje, marge-schuif als rekenvoorbeeld; alleen tokens, geen id-selectors */
.worij{margin:4px 0 8px;padding-top:6px;border-top:1px solid var(--line)}
.worij[hidden]{display:none}
.worij .womodelkop{padding-top:4px}
.wozin{margin:4px 12px 8px;font-size:13px;line-height:1.45;color:var(--ink)}
.wozin.womut{color:var(--ink-2);font-size:12.5px}
.woschaal{position:relative;height:78px;margin:6px 34px 4px}
.woschaal[hidden]{display:none}
.wolijn{position:absolute;left:0;right:0;top:38px;border-top:2px solid var(--line-2)}
.wonul{position:absolute;top:32px;height:14px;width:0;border-left:1px dashed var(--ink-3);transform:translateX(-50%)}
.wonul b{position:absolute;top:16px;left:0;transform:translateX(-50%);font-size:10.5px;font-weight:400;color:var(--ink-3);white-space:nowrap}
.womerk{position:absolute;top:33px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11.5px;line-height:1.2;color:var(--ink-2);white-space:nowrap}
.womerk i{display:block;width:12px;height:12px;border-radius:50%;background:var(--ink);border:2px solid var(--card);box-sizing:border-box}
.womerk b{font-weight:600;color:var(--ink)}
.womerk small{font-size:11px;font-variant-numeric:tabular-nums}
.womerk.woboven{top:auto;bottom:29px;flex-direction:column-reverse}
.womerk-ingeprijsd i{background:var(--accent)}
.womerk-analisten i{background:var(--gold)}
.wobandbox svg .wobalk{fill:var(--line-2);opacity:.9}
.wobandbox svg .woscn{stroke-width:3}
.wobandbox svg .womargelijn{stroke:var(--accent);stroke-width:2;stroke-dasharray:2 3}
.wobandbox svg .womargelbl{fill:var(--accent);font-weight:600}
.womarge{margin:2px 12px 8px}
.womarge label{display:block;font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:4px}
.womarge output{font-variant-numeric:tabular-nums;color:var(--ink)}
.womarge input[type="range"]{display:block;width:100%;max-width:420px}
@media (max-width:479px){.woschaal{margin:6px 22px 4px}.womerk{font-size:10.5px}.womerk small{font-size:10px}}
/* v25.58 — DIVIDENDSCORE */
/* v25.58 (DIVIDENDSCORE): tegel Dividendscore bovenaan de tab Dividend - totaal met label, de regel betrouwbaarheid/groei/inkomen, drie balkjes, uitklapbare checks (details), feitenzin en vuistregelnoot; alleen tokens, geen nieuwe kleuren */
.dqkaart{margin:0 18px 6px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--stat-bg)}
.dqkaart[hidden]{display:none}
.dqkop{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.dqkop .dqtitel{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.dqtotaal{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1}
.dqtotaal.g{color:var(--good-text)}
.dqtotaal.y{color:var(--gold)}
.dqtotaal.r{color:var(--bad-text)}
.dqlabel{font-size:12.5px;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2)}
.dqregel{margin:6px 0 0;font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.dqdelen{display:grid;gap:6px;margin-top:10px}
.dqdeel summary{display:grid;grid-template-columns:minmax(96px,1fr) 2fr 34px auto;align-items:center;gap:8px;cursor:pointer;list-style:none;font-size:12.5px}
.dqdeel summary::-webkit-details-marker{display:none}
.dqdeel summary b{text-align:right;font-variant-numeric:tabular-nums}
.dqdeel summary small{color:var(--ink-3);font-size:11px}
.dqbalk{display:block;height:6px;border-radius:3px;background:var(--line-2);overflow:hidden}
.dqbalk i{display:block;height:100%;border-radius:3px;background:var(--accent)}
.dqdeel.g .dqbalk i{background:var(--good)}
.dqdeel.y .dqbalk i{background:var(--gold)}
.dqdeel.r .dqbalk i{background:var(--bad)}
.dqchecks{list-style:none;margin:6px 0 2px;padding:0 0 0 4px;display:grid;gap:4px}
.dqchecks li{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--ink-2)}
.dqchecks li b{font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap}
.dqchecks li small{display:block;color:var(--ink-3);font-size:11px}
.dqchecks li.nvt{color:var(--ink-3)}
.dqzin{margin:10px 0 0;font-size:13px;line-height:1.45}
.dqnoot{margin:6px 0 0;font-size:11.5px;color:var(--ink-3)}
@media (max-width:479px){.dqdeel summary{grid-template-columns:minmax(80px,1fr) 1.4fr 30px auto}}
/* v25.58 — MELDINGENDIRECT */
/* v25.58 (MELDINGEN-DIRECT): staart meldingen-direct - de sociale rij in Meldingen (kanaal, fragment op twee regels, nieuw-stip, knoppen Beantwoorden en Gelezen van minstens 40 px), de knop Toon oudere, de markering en de bevestigingspil in de chat, de bel met teller in de kanaalkop en de stip op Ontdek; alleen tokens, geen hexwaarden, geen voorrangsvlag, geen id-selector, geen aanwijs-woord */
.notifrow.mdrij{align-items:flex-start;gap:10px;padding:12px 10px;border-radius:12px}
.notifrow.mdrij .notif-l{gap:4px}
.notifrow.mdrij .notif-l b{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;line-height:1.3}
.notifrow.mdrij .notif-l b span{white-space:normal;overflow:visible;text-overflow:clip;font-size:inherit;color:inherit}
.notifrow.mdrij .mdico{display:inline-flex;color:var(--accent);flex:none}
.notifrow.mdrij .mdico svg{width:16px;height:16px}
.notifrow.mdrij .mdnaam{font-weight:700;color:var(--ink)}
.notifrow.mdrij .mdkanaal{color:var(--ink-3);font-weight:500;font-size:12.5px}
.notifrow.mdrij .notif-l .mdfragment{white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:1.4;overflow-wrap:anywhere}
.notifrow.mdrij .mdacties{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.mdknop{min-height:40px;min-width:40px;padding:0 14px;border-radius:999px;border:1px solid var(--accent);background:var(--accent-wash);color:var(--ink);font:600 13px/1 "IBM Plex Sans",sans-serif;cursor:pointer}
.mdknop.mdknopstil{border-color:var(--line-2);background:var(--card);color:var(--ink-2)}
.mdknop:focus-visible,.notifrow.mdrij:focus-visible,.mdouder:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.notifrow.mdrij .mdrechts{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:40px}
.notifrow.mdrij .mdnieuw{width:9px;height:9px;border-radius:50%;background:var(--bad);flex:none}
.notifrow.mdrij.mdgelezen{background:transparent}
.notifrow.mdrij.mdgelezen .mdnaam{font-weight:600;color:var(--ink-2)}
.notifrow.mdrij.mdgelezen .mdfragment,.notifrow.mdrij.mdgelezen .notiftijd{color:var(--ink-3)}
.notifrow.mdrij:not(.mdgelezen){background:var(--hl-bg)}
.mdouder{display:block;width:100%;min-height:44px;margin-top:6px;border-radius:12px;border:1px dashed var(--line-2);background:transparent;color:var(--ink-2);font:600 13px/1 "IBM Plex Sans",sans-serif;cursor:pointer}
.post.mdmarkeer{background:var(--accent-wash);box-shadow:0 0 0 2px var(--accent);border-radius:12px;transition:background .3s ease,box-shadow .3s ease}
.mdpil{position:fixed;left:50%;top:calc(env(safe-area-inset-top) + 68px);transform:translateX(-50%) translateY(-10px);opacity:0;pointer-events:none;z-index:82;max-width:min(92vw,520px);padding:9px 16px;border-radius:999px;background:var(--accent);color:var(--merk-op-blauw);font:600 13.5px/1.3 "IBM Plex Sans",sans-serif;box-shadow:var(--shadow);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .2s ease,transform .2s ease}
.mdpil.show{opacity:1;transform:translateX(-50%) translateY(0)}
.mdkopbel{min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;position:relative}
.mdkopbel svg{width:18px;height:18px}
.mdkopbel .notifdot{top:-4px;right:-4px;min-width:16px;height:16px;border-radius:8px;padding:0 4px;font:700 10px/16px "IBM Plex Sans",sans-serif}
.feedkopknop .mdontdekdot{top:-2px;right:2px} /* v25.58 (MELDINGEN-DIRECT, nazorg): de Ontdek-stip binnen de kaart (.feedkopknop), zie de smoke-nazorg van de bouwer */
@media (prefers-reduced-motion:reduce){.post.mdmarkeer,.mdpil{transition:none}}
@media (max-width:479px){.notifrow.mdrij{padding:12px 8px}.notifrow.mdrij .mdacties{width:100%}.notifrow.mdrij .mdknop{flex:1 1 45%}}
/* v25.58 — BEHEEROMA */
/* v25.58 (BEHEER-OMA): staart beheer-oma - de laag Eenvoudig op /beheer (blok v25.58 beheer-oma, paneel boGrid): de standkaart met stoplicht als rondje plus tekstlabel (nooit alleen kleur), de genummerde lijst Wat moet ik nu doen, het rooster van kaarten (1 kolom, 2 vanaf 760 px, 3 vanaf 1180 px), grote cijfers met een altijd zichtbare betekenisregel, schakelaars als knoppenrijen van minstens 44 px met de twee uitlegzinnen eronder, de lijst Wat heb ik gedaan en de kaart Hulp; alle tekst in de kaarten minstens 15 px; onderaan ruimte voor de tabbalk en de veilige zone zoals de Toren; alleen tokens en color-mix, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen emoji, ASCII; geen beweging */
.bhview .bogrid{display:flex; flex-direction:column; align-items:stretch; gap:12px; min-width:0; margin-top:4px; padding-bottom:calc(var(--tabbar-h, 64px) + env(safe-area-inset-bottom) + 12px)}
.bhview .bogrid.bhoud{opacity:.6}
.bhview .bogrid[hidden]{display:none}
.bhview .viewhead.bokopbalk{flex-wrap:wrap; row-gap:6px}
.bhview .boschakel{min-height:40px; padding:8px 14px; font-size:13px; white-space:nowrap}
.bhview .boschakel[aria-pressed="true"]{border-color:var(--accent); color:var(--accent)}
.bhview .bokaart{padding:16px; min-width:0; overflow:hidden; font-size:15px; line-height:1.45; color:var(--ink)}
.bhview .bokaart.toon-fout{border-color:var(--bad)}
.bhview .bokaart.toon-let{border-color:var(--gold)}
.bhview .bokaartkop{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin-bottom:6px}
.bhview .bokaart h3{margin:0; font-size:18px; line-height:1.3}
.bhview .bokaart p{margin:6px 0; font-size:15px; overflow-wrap:anywhere}
.bhview .bozin{font-size:15px; color:var(--ink)}
.bhview .bouitleg{font-size:15px; color:var(--ink-2)}
.bhview .bouitleg b{color:var(--ink)}
.bhview .botijd{font-size:15px; color:var(--ink-3); font-variant-numeric:tabular-nums}
/* stoplicht: rondje plus woord */
.bhview .bostoplicht{display:inline-flex; align-items:center; gap:8px; font-size:15px; font-weight:600; color:var(--ink-2)}
.bhview .bostip{width:14px; height:14px; border-radius:50%; background:var(--ink-3); flex:none}
.bhview .bostip.goed{background:var(--good)}
.bhview .bostip.let{background:var(--gold)}
.bhview .bostip.fout{background:var(--bad)}
/* de standkaart */
.bhview .bostand{display:flex; flex-direction:column; gap:4px}
.bhview .bostand.toon-goed{border-color:var(--good)}
.bhview .bokop{margin:2px 0 0; font-size:26px; line-height:1.2; font-weight:700; overflow-wrap:anywhere}
.bhview .bosub{margin:0; font-size:15px; color:var(--ink-2); font-variant-numeric:tabular-nums}
.bhview .boacties{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px}
/* knoppen: minstens 44 px hoog, gewone letters */
.bhview .bogrid .bhknop{min-height:44px; padding:10px 16px; border-radius:12px; font-size:15px; font-weight:600; white-space:normal; text-align:center; line-height:1.25}
.bhview .bogrid .bhknop.primair{background:var(--accent); color:var(--accent-tekst); border-color:var(--accent)}
.bhview .bogrid .bhknop.gevaar{border-color:var(--bad); color:var(--bad-text); background:var(--card)}
.bhview .bogrid .bolink{border:none; background:transparent; color:var(--accent); text-decoration:underline; text-underline-offset:3px; padding:10px 4px; min-height:44px; display:inline-flex; align-items:center; font-size:15px; font-weight:600}
.bhview .bogrid a.bolink{text-align:left}
.bhview .bogrid .bhknop:focus-visible,.bhview .bogrid .bolink:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
/* wat moet ik nu doen */
.bhview .bopunten{list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; gap:10px}
.bhview .bopunt{border:1px solid var(--line); border-radius:14px; padding:12px 14px; background:var(--stat-bg)}
.bhview .bopunt.fout{border-color:var(--bad)}
.bhview .bopunt.let{border-color:var(--gold)}
.bhview .bopuntkop{display:flex; align-items:center; gap:10px; margin-bottom:4px}
.bhview .bonr{display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; background:var(--seg-bg); border:1px solid var(--line); font-size:15px; font-weight:700; font-variant-numeric:tabular-nums}
.bhview .bolabel{display:inline-flex; align-items:center; min-height:30px; padding:2px 12px; border-radius:999px; font-size:15px; font-weight:700}
.bhview .bolabel.nu{background:color-mix(in srgb, var(--bad) 16%, var(--card)); color:var(--bad-text)}
.bhview .bolabel.wacht{background:color-mix(in srgb, var(--gold) 20%, var(--card)); color:var(--ink)}
.bhview .bowat{font-weight:700; margin:4px 0 2px}
.bhview .bodoe{margin:0 0 6px}
.bhview .boknoppen{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.bhview .bopuntknoppen{margin-top:4px}
.bhview .boklap{margin-top:6px}
.bhview .boklap>summary{min-height:44px; display:flex; align-items:center; gap:6px; cursor:pointer; color:var(--accent); font-size:15px; font-weight:600; list-style:none}
.bhview .boklap>summary::-webkit-details-marker{display:none}
.bhview .boklap>summary::before{content:"+"; display:inline-flex; width:22px; height:22px; align-items:center; justify-content:center; border:1px solid var(--line-2); border-radius:50%; font-weight:700}
.bhview .boklap[open]>summary::before{content:"-"}
.bhview .boklapin{padding:2px 0 4px; color:var(--ink-2)}
.bhview .bolijst{margin:4px 0; padding-left:22px; font-size:15px}
.bhview .bolijst li{margin:2px 0}
/* het rooster met de kaarten */
.bhview .borooster{display:grid; grid-template-columns:minmax(0,1fr); gap:12px; min-width:0; align-items:start}
@media (min-width:760px){ .bhview .borooster{grid-template-columns:repeat(2, minmax(0,1fr))} }
@media (min-width:1180px){ .bhview .borooster{grid-template-columns:repeat(3, minmax(0,1fr))} }
/* grote cijfers met betekenisregel */
.bhview .bocijfers{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%,150px),1fr)); gap:8px; margin:8px 0}
.bhview .bocijfer{display:flex; flex-direction:column; gap:3px; min-width:0; padding:10px 12px; border:1px solid var(--line); border-radius:14px; background:var(--stat-bg)}
.bhview .bocijfer.goed{border-color:var(--line)}
.bhview .bocijfer.let{border-color:var(--gold)}
.bhview .bocijfer.fout{border-color:var(--bad)}
.bhview .bocijfer.fout b{color:var(--bad-text)}
.bhview .bocijfer .bolbl{font-size:15px; color:var(--ink-2)}
.bhview .bocijfer b{font-size:22px; line-height:1.15; font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.bhview .bocijfer.bolang b{font-size:19px}
.bhview .bocijfer .bobet{font-size:15px; color:var(--ink-2); line-height:1.35}
/* schakelaars met de twee uitlegzinnen eronder */
.bhview .borij{margin-top:12px; padding-top:10px; border-top:1px solid var(--line)}
.bhview .borijkop{margin:0 0 6px; font-weight:700}
.bhview .borij .bhknop{flex:1 1 120px; background:var(--card); color:var(--ink-2); border-color:var(--line-2)}
.bhview .borij .bhknop[aria-pressed="true"]{border-color:var(--accent); color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, var(--card))}
.bhview .borij .bhknop.uit[aria-pressed="true"]{border-color:var(--bad); color:var(--bad-text); background:color-mix(in srgb, var(--bad) 12%, var(--card))}
.bhview .bonu{color:var(--ink)}
.bhview .bovoet{margin-top:8px; padding-top:6px; border-top:1px solid var(--line)}
.bhview .bolbrstand{flex:1 1 100%; margin:0}
/* wat heb ik gedaan, hulp */
.bhview .bogedaan{list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column}
.bhview .bogedaan li{display:flex; gap:12px; align-items:baseline; padding:8px 0; border-top:1px solid var(--line); min-width:0}
.bhview .bogedaan li:first-child{border-top:none}
.bhview .bogedaan .botijd{flex:none; min-width:52px}
.bhview .bohulp{list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column}
.bhview .bohulp li{border-top:1px solid var(--line); min-width:0}
.bhview .bohulp li:first-child{border-top:none}
@media (max-width:479px){
  .bhview .viewhead.bokopbalk .boschakel{flex:1 1 100%}
  .bhview .bocijfers{grid-template-columns:minmax(0,1fr)}
  .bhview .bokop{font-size:23px}
  .bhview .boacties .bhknop{flex:1 1 100%}
  .bhview .borij .bhknop{flex:1 1 100%}
  .bhview .bogedaan li{flex-direction:column; gap:2px}
}
/* v25.58 — INTRINSIEK */
/* v25.58 (INTRINSIEK): staart intrinsiek - de kaart Belegger-score op de tab Kerncijfers (groot cijfer met label en zin, twee lensbalken Buffett en Lynch, chip met het Lynch-type en i-knop, vier klapsecties: wat zit er in de koers met de rendementsbalk en de 10 %-drempel als merkje, de checks per lens met minibalk, soortgenoten als tabelletje, management; skelet, lokker, eerlijke lege regels, foutregel met knop Opnieuw); alleen tokens, geen hexwaarden, geen voorrangsvlag, geen id-selector, geen aanwijs-woord, geen beweging behalve het bestaande skelet; klassen met voorvoegsel bsc (ib is al van identiteit-badge) */
.bsckaart .bscsub{font-size:11.5px;color:var(--ink-3);font-weight:400}
.bscinhoud{display:flex;flex-direction:column;gap:12px;padding:4px 18px 14px}
.bscinhoud:empty{display:none}
.bscnvt{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.bscfout{color:var(--ink)}
.bscopnieuw{align-self:flex-start;min-height:40px;padding:0 16px}
.bscladen{margin:6px 0 0;font-size:12.5px;color:var(--ink-3)}
.bscskelet{display:flex;flex-direction:column;gap:10px}
.bscskelcijfer{width:88px;height:44px;border-radius:12px}
/* de kop: het grote cijfer, het label en de zin */
.bsckop{display:flex;align-items:center;gap:16px}
.bsccijfer{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none;min-width:92px;padding:10px 12px;border-radius:16px;background:var(--stat-bg);border:1px solid var(--line)}
.bsccijfer b{font-size:44px;line-height:1;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--ink)}
.bsccijfer .bscvan{font-size:11px;color:var(--ink-3);margin-top:4px}
.bsckop.sterk .bsccijfer b{color:var(--good-text)}
.bsckop.redelijk .bsccijfer b{color:var(--gold)}
.bsckop.zwak .bsccijfer b{color:var(--bad-text)}
.bsckoptekst{display:flex;flex-direction:column;gap:5px;min-width:0}
.bsclabel{display:inline-block;align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:var(--stat-bg);color:var(--ink-2)}
.bsckop.sterk .bsclabel{color:var(--good-text)}
.bsckop.redelijk .bsclabel{color:var(--gold)}
.bsckop.zwak .bsclabel{color:var(--bad-text)}
.bsczin{margin:0;font-size:14px;line-height:1.45;color:var(--ink)}
/* de twee lensbalken */
.bsclenzen{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}
.bsclens{display:grid;grid-template-columns:minmax(0,1fr) 2.2em;grid-template-areas:"naam cijfer" "balk balk";align-items:center;gap:4px 8px}
.bsclensnaam{grid-area:naam;font-size:13px;font-weight:600;color:var(--ink);min-width:0}
.bsclensnaam small{display:block;font-weight:400;font-size:11px;color:var(--ink-3)}
.bsclenscijfer{grid-area:cijfer;text-align:right;font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink)}
.bscbalk{display:block;height:6px;border-radius:999px;background:var(--stat-bg);overflow:hidden;min-width:40px}
.bscbalk i{display:block;height:100%;border-radius:999px;background:var(--ink-3)}
.bsclensbalk{grid-area:balk;height:8px;background:var(--line-2)}
.bsclens.sterk .bscbalk i,.bsccheck.sterk .bscbalk i{background:var(--good)}
.bsclens.redelijk .bscbalk i,.bsccheck.redelijk .bscbalk i{background:var(--gold)}
.bsclens.zwak .bscbalk i,.bsccheck.zwak .bscbalk i{background:var(--bad)}
.bsclens.nvt .bsclenscijfer{color:var(--ink-3)}
/* de chip met het Lynch-type en de i-knop */
.bsctype{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.bscchip{display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;border:1px solid var(--accent-lijn);background:var(--accent-wash);color:var(--ink);font-size:12.5px;font-weight:600}
.bscchip.nvt{border-color:var(--line-2);background:transparent;color:var(--ink-3);font-weight:500}
.bscinfo{width:28px;height:28px;border-radius:50%;border:1px solid var(--line-2);background:var(--card);color:var(--ink-2);font:italic 700 13px/1 Georgia,serif;cursor:pointer;padding:0}
.bscinfo[aria-expanded="true"]{border-color:var(--accent);color:var(--accent)}
.bscinfo:focus-visible,.bscopnieuw:focus-visible,.bscsectie summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.bsctypeuitleg{flex:1 1 100%;margin:0;font-size:13px;line-height:1.45;color:var(--ink-2)}
.bsctypeuitleg[hidden]{display:none}
/* de vier klapsecties */
.bscsecties{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.bscsectie{border-bottom:1px solid var(--line)}
.bscsectie summary{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 0;cursor:pointer;list-style:none;font-size:14px;font-weight:600;color:var(--ink)}
.bscsectie summary::-webkit-details-marker{display:none}
.bscsectie summary::before{content:"+";display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center;flex:none;border:1px solid var(--line-2);border-radius:50%;font-size:14px;font-weight:700;color:var(--ink-2)}
.bscsectie[open] summary::before{content:"-"}
.bscsectiekop{flex:1 1 auto;min-width:0}
.bscsectiesom{font-size:12.5px;font-weight:500;color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.bscsectiein{display:flex;flex-direction:column;gap:10px;padding:2px 0 14px}
.bscmethode,.bscuitleg,.bscgroep{margin:0;font-size:12.5px;line-height:1.45;color:var(--ink-2)}
.bsczin2{margin:0;font-size:13.5px;line-height:1.45;color:var(--ink)}
.bscrijen{display:flex;flex-direction:column}
.bscrij{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0;border-bottom:1px dashed var(--line)}
.bscrij:last-child{border-bottom:none}
.bscrijlabel{font-size:13px;color:var(--ink-2);min-width:0}
.bscrijlabel small{display:block;font-size:11px;color:var(--ink-3)}
.bscrijwaarde{font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink);text-align:right}
/* het verwachte rendement met de 10 %-drempel als merkje */
.bscrend{display:flex;flex-direction:column;gap:6px;padding:10px 12px;border-radius:14px;background:var(--stat-bg);border:1px solid var(--line)}
.bscrendkop{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.bscrendcijfer{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink)}
.bscrend.boven .bscrendcijfer{color:var(--good-text)}
.bscrend.rond .bscrendcijfer{color:var(--gold)}
.bscrend.onder .bscrendcijfer{color:var(--bad-text)}
.bscrendschaal{position:relative;padding:4px 0 18px}
.bscrendspoor{position:relative;display:block;height:10px;border-radius:999px;background:var(--line-2)}
.bscrendvul{position:absolute;left:0;top:0;height:100%;border-radius:999px;background:var(--ink-3)}
.bscrend.boven .bscrendvul{background:var(--good)}
.bscrend.rond .bscrendvul{background:var(--gold)}
.bscrend.onder .bscrendvul{background:var(--bad)}
.bscdrempel{position:absolute;top:-4px;width:2px;height:18px;margin-left:-1px;background:var(--ink);border-radius:1px}
.bscdrempellbl{position:absolute;top:20px;transform:translateX(-50%);font-size:10.5px;color:var(--ink-3);white-space:nowrap}
.bscoordeel{margin:0;font-size:12.5px;color:var(--ink-2)}
/* de checks per lens */
.bsclensgroep{display:flex;flex-direction:column}
.bsclensgroepkop{display:flex;align-items:baseline;gap:8px;padding:8px 0 4px;border-bottom:1px solid var(--line-2)}
.bsclensgroepkop b{font-size:13px;color:var(--ink)}
.bsclensgroepkop small{flex:1 1 auto;font-size:11px;color:var(--ink-3)}
.bsclensgroepscore{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.bsclensgroepscore.sterk{color:var(--good-text)}
.bsclensgroepscore.redelijk{color:var(--gold)}
.bsclensgroepscore.zwak{color:var(--bad-text)}
.bsclensgroepscore.nvt{color:var(--ink-3);font-weight:500}
.bsccheck{display:grid;grid-template-columns:minmax(0,1.6fr) auto minmax(48px,1fr) 2.2em;gap:2px 10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.bscchecknaam{font-size:13px;line-height:1.35;color:var(--ink);min-width:0}
.bsccheckwaarde{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap;color:var(--ink)}
.bsccheckdeel{font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;color:var(--ink-2)}
.bsccheckuitleg{grid-column:1 / -1;font-size:11.5px;line-height:1.4;color:var(--ink-3)}
.bsccheckuitleg i{display:block;font-style:normal;font-size:11px;color:var(--ink-3)}
.bsccheck.nvt .bscchecknaam,.bsccheck.nvt .bsccheckwaarde,.bsccheck.nvt .bsccheckdeel{color:var(--ink-3);font-weight:500}
/* soortgenoten */
.bscpeers{width:100%;border-collapse:collapse;font-size:13px}
.bscpeers th,.bscpeers td{padding:6px 4px;text-align:right;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.bscpeers th{font-weight:500;color:var(--ink-3);font-size:11.5px}
.bscpeers th[scope="row"]{text-align:left;color:var(--ink-2);font-size:13px}
.bscpeers td:nth-child(2){font-weight:600;color:var(--ink)}
.bscpeers td:nth-child(3){color:var(--ink-2)}
/* management */
.bscoprichter{margin:0;font-size:13.5px;font-weight:600;color:var(--ink)}
.bscoprichter.onbekend{color:var(--ink-2);font-weight:500}
.bscpersonen ul{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.bscpersonen li{display:flex;flex-wrap:wrap;gap:2px 8px;font-size:13px;align-items:baseline}
.bscpersonen li b{color:var(--ink);font-weight:600}
.bscpersonen li span{color:var(--ink-3);font-size:12px}
/* voet */
.bscvoet{margin:0}
@media (max-width:479px){
  .bsckop{gap:12px}
  .bsccijfer{min-width:80px;padding:8px 10px}
  .bsccijfer b{font-size:38px}
  .bsclenzen{grid-template-columns:1fr;gap:10px}
  .bsccheck{grid-template-columns:minmax(0,1fr) auto 2.2em}
  .bsccheck .bscbalk{grid-column:1 / -1;min-width:0}
  .bscsectiesom{max-width:45%;overflow:hidden;text-overflow:ellipsis}
}
/* v25.58 — TOEGANKELIJKSHEETS */
/* v25.58 (TOEGANKELIJK-SHEETS): staart toegankelijk-sheets (herstelpakket HE4, bugjacht ronde 4). Bevinding 12: het kruisje in de watchlist-bewerkstand (.wlx, gemeten 18 x 22 px) krijgt een tikvlak van minstens 24 x 24 px - min-breedte/-hoogte 24 plus het Q-07-patroon van een onzichtbaar vlak boven en onder (nooit opzij: de pijlen ernaast blijven van het kruisje); het beeld (12 px kruisje, gecentreerd) blijft gelijk en de bestaande verbergregels (.wapf, buiten de bewerkstand) winnen op specificiteit. Bevinding 11: de legendarij van de verdelingsdonut is nu een knop (role button, uit het clientblok toegankelijk-sheets) en toont een zichtbare focusring. Alleen tokens, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen beweging. */
.wlx{position:relative;min-width:24px;min-height:24px;display:inline-grid;place-items:center}
.wlx::after{content:"";position:absolute;inset:-6px 0}
.legend .lg[role="button"]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* v25.58 — CSSKLEIN */
/* v25.58 (CSS-KLEIN): staart css-klein (herstelpakket HG4, bugjacht ronde 6, de drie layout-css-bevindingen). (1) Kerncijfers op smalle telefoons: de twee kolommen van .tkstats krimpen nu wel onder de min-content van de labels (minmax(0,1fr) in plaats van 1fr = minmax(auto,1fr), alleen onder 640 px zodat de bestaande regel met drie kolommen blijft gelden) en een lang label breekt af in plaats van de rechterkolom voorbij de rand te duwen (de kaart .tkflow knipt met overflow clip); onder 360 px een kolom, zoals .tketfkern .tkstats op dezelfde grens al doet (375 px houdt twee kolommen: daar was met de echte lettertypen niets verborgen). (2) Goud als tekstkleur haalde in het lichte thema 3,4-3,7:1; het token --gold-tekst is in het donkere thema gelijk aan --gold en in het lichte thema een donkerdere goudtint uit bestaande tokens (color-mix van --gold met --merk-navy, ongeveer 6:1 op de tegel); alleen tekst (het getal op de gemiddeld-tegel, de onbekend-regel, de chips Opname/Dividend/Rente); vlakken, randen en de stip houden --gold. (3) Het brondocument-linkje in de politicimeldingen (19 x 15 px) krijgt een tikvlak van minstens 24 x 24 px (inline-grid met min-breedte/-hoogte 24 en het teken gecentreerd, de negatieve marge boven en onder houdt de rijhoogte gelijk - het patroon van TOEGANKELIJK-SHEETS voor het watchlist-kruisje); de rij-klik (closest a) verandert niet. Alleen tokens en color-mix, geen id-selector, geen voorrangsvlag, geen aanwijs-effect. */
:root{--gold-tekst:var(--gold)}
:root[data-theme="light"]{--gold-tekst:color-mix(in srgb, var(--gold) 68%, var(--merk-navy))}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--gold-tekst:color-mix(in srgb, var(--gold) 68%, var(--merk-navy))}}
@media (max-width:639px){.tkstats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.tkstats .stat .slbl{overflow-wrap:anywhere}
@media (max-width:359px){.tkstats{grid-template-columns:minmax(0,1fr)}}
.stat.y b,.stat b.unk{color:var(--gold-tekst)}
.txtype.t-opname,.txtype.t-dividend,.txtype.t-rente{color:var(--gold-tekst)}
.pol3m a.polbron,.polm a.polbron{display:inline-grid;place-items:center;min-width:24px;min-height:24px;margin:-4px 0}
/* v25.58 — KALENDERPUUR */
/* v25.58 (KALENDER-PUUR): staart kalenderpuur - R7-14: de tag "Coupon" (kal6tag.t-pay) van de couponrij op het Kalender-scherm in de goudtint van de rente- en dividendregels van het grootboek (txtype.t-rente), tokens-only; ex-dividend en uitbetaling houden hun groen */
.kalrij.kal4 .kal6tag.t-pay{color:var(--gold); background:color-mix(in srgb, var(--gold) 14%, transparent)}
/* v25.58 — ANALISTENSTAAF */
/* v25.58 (ANALISTEN-STAAF): staart analisten-staaf - twee staafdiagrammen (winst per aandeel, omzet) met onder elk een tabel per boekjaar in de kaart Wat is het waard?; alleen tokens (var(--...)), geen id-selector, geen aanwijs-effect; de svg schaalt niet mee maar scrolt in .asgrafiek zodat de tekst leesbaar blijft op 390 px */
.asvak{margin:0 18px 6px}
.asfig{margin:0 0 12px;padding:0}
.askop{display:flex;justify-content:space-between;align-items:baseline;gap:2px 10px;flex-wrap:wrap;margin:0 0 4px}
.askop b{font:700 12.5px "Archivo",sans-serif;color:var(--ink)}
.askop small{font-size:10.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.asgrafiek{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 6px;padding:2px 0}
.assvg{display:block;max-width:none;overflow:visible}
.asas{stroke:var(--line-2,var(--line));stroke-width:1}
.asstaaf{fill:var(--merk-licht)}
.asfig.asomzet .asstaaf{fill:var(--vg-1)}
.asfig .asstaaf.asgereal{fill:color-mix(in srgb,var(--ink-3) 45%,transparent)}
.asband{stroke:var(--ink);stroke-width:1.5;stroke-linecap:round;opacity:.7}
.aswaarde{font:700 11px "Archivo",sans-serif;fill:var(--ink);font-variant-numeric:tabular-nums}
.asjaar{font:500 10.5px system-ui,sans-serif;fill:var(--ink-2)}
.asjaar.asgereal{fill:var(--ink-3)}
.aswrap{margin:0;padding:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.astabel .anvwrij{grid-template-columns:minmax(72px,1fr) repeat(var(--n,6),minmax(min-content,1fr))} /* v25.58 (ANALISTEN-STAAF, nazorg 390 px): kolom minstens zo breed als haar breedste woord (kop, subregel, getal) - geen overlap van kopcellen; de tabel scrolt in .aswrap */
.astabel .anvwrij .lbl{color:var(--ink);font-weight:700;font-family:"Archivo",sans-serif}
.astabel .anvwrij.kop .val b{font:600 10.5px system-ui,sans-serif;color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap} /* v25.58 (ANALISTEN-STAAF, nazorg 390 px): de kop nooit afgebroken */
.astabel .anvwrij.kop .val small{text-transform:none;letter-spacing:0;overflow-wrap:normal;word-break:normal;hyphens:manual} /* v25.58 (ANALISTEN-STAAF, nazorg 390 px): de subregel breekt alleen op spaties, nooit midden in een woord */
.asgeen{margin:0 0 6px}
@media (max-width:479px){.asvak{margin:0 12px 6px}.astabel .anvwrij{grid-template-columns:minmax(64px,1fr) repeat(var(--n,6),minmax(min-content,1fr))}} /* v25.58 (ANALISTEN-STAAF, nazorg 390 px): ook smal minstens het breedste woord */
.ascompact{margin:10px 18px 4px} /* v25.58 (ANVW-ONDERAAN): kopje Compacte tabel boven de oude gedraaide tabel, die als laatste onderdeel van de kaart terugkomt (Rabi 15-9 "MAg gewoon blijven helemaal onderaan"); dezelfde 18 px zijmarge als .anvwwrap, ook smal; verder de opmaak van .askop */
/* v25.58 — CHATTEXTAREA */
/* v25.58 (CHAT-TEXTAREA): staart chat-textarea (herstelronde 9 pakket Q5, bugjacht ronde 5 R5-02). Het chatveld is een textarea: dezelfde opmaak als de andere velden (16 px, tokens), een regel hoog (min-height 44 px) en via het blok groeit het mee tot vijf regels (max-height in lockstep met CTA_MAX_REGELS: 5 x 1.35em + 20 px padding + 2 px rand); geen sleephandvat; de knoppen naast het veld blijven onderaan uitgelijnd met een tikdoel van minstens 44 px. */
.inputrow{align-items:flex-end}
.inputrow textarea{flex:1;min-width:0;width:100%;display:block;font:inherit;font-size:16px;line-height:1.35;color:var(--ink);background:var(--input-bg);border:1px solid var(--line-2);border-radius:12px;padding:10px 15px;min-height:44px;max-height:calc(5 * 1.35em + 22px);resize:none;overflow-y:hidden;box-sizing:border-box}
.inputrow textarea::placeholder{color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inputrow textarea:focus-visible{outline:2px solid var(--accent);border-color:var(--accent)}
.inputrow textarea:disabled{opacity:.5}
.inputrow .camerabtn,.inputrow .send{min-height:44px}
/* v25.58 — SPARKLINEDAG */
/* v25.58 (SPARKLINE-DAG): staart sparklinedag - Rabi 15-9 "Die charts kloppen nog steeds voor geen meter en moeten eigenlijk de richting per tik die dag aangeven zoals op Stocktwits": de dag-grafiek (blok v25.58 sparkline-dag, svg.sdspark) tekent in de bovenste 21 van de 30 eenheden zodat het bestaande label .kssparklbl in de vrije strook eronder staat en nooit meer over de lijn loopt; het vervolgsegment (voor-/nabeurs, polyline.sdext) en de referentielijn (line.sdref) bewegen nooit (geen overgang, geen animatie - ook zonder reduced-motion is er niets dat beweegt) en het randmerkteken van een referentie buiten bereik (line.sdrefrand) blijft binnen het vlak. Alleen tokens via de svg-attributen (var(--good)/var(--bad) uit het blok), geen hex, geen id-selector, geen voorrangsvlag, geen aanwijs-effect. */
.ksspark.sdspark .sdext,.ksspark.sdspark .sdref{transition:none; animation:none}
.ksspark.sdspark{overflow:visible}
/* v25.58 — CONSENSUSDOORREKENING */
/* v25.58 (CONSENSUS-DOORREKENING): staart consensus-doorrekening - het kaartdeel "Doorgerekend op tien jaar" als laatste onderdeel van de analistenkaart in Wat is het waard? (blok v25.58 consensus-doorrekening, herstelronde 10 R11): twee staafdiagrammen (omzet, winst per aandeel) met gerealiseerde jaren gedempt, analistenjaren in de staafkleur en doorgerekende jaren gestippeld (lichte vulling, gestreepte rand) achter een stippellijn, een tabel per boekjaar in de bestaande anvw-gridklassen, de groeiregel, twee waarderingsbanden (laagste-gemiddelde-hoogste met de huidige waarde als punt) en de disclaimer; alleen tokens (var(--...)), geen id-selector, geen hex, geen aanwijs-effect, ASCII in het commentaar; donker en licht via de tokens; 390 px: de tabel scrolt in .tablewrap, de diagrammen in hun eigen container; de twee diagrammen staan altijd onder elkaar (elk 676 px breed: naast elkaar zou de helft buiten beeld vallen), de banden vallen op 390 px op een kolom */
.cdovak{margin:10px 0 4px;padding-top:10px;border-top:1px solid var(--line-2,var(--line))}
.cdokop{padding-bottom:8px}
.cdogrid{display:grid;grid-template-columns:1fr;gap:10px 18px;margin:0 18px 8px}
.cdofig{margin:0;padding:0;min-width:0}
.cdokopje{display:flex;justify-content:space-between;align-items:baseline;gap:2px 10px;flex-wrap:wrap;margin:0 0 4px}
.cdokopje b{font:700 12.5px "Archivo",sans-serif;color:var(--ink)}
.cdokopje small{font-size:10.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.cdografiek{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0;padding:2px 0}
.cdosvg{display:block;max-width:none;overflow:visible}
.cdoas{stroke:var(--line-2,var(--line));stroke-width:1}
.cdoraster{stroke:var(--line-2,var(--line));stroke-width:1;stroke-dasharray:2 3;opacity:.8}
.cdoaslabel{font:500 9px system-ui,sans-serif;fill:var(--ink-3);font-variant-numeric:tabular-nums}
.cdostaaf{fill:var(--merk-licht)}
.cdofig.cdoomzet .cdostaaf{fill:var(--vg-1)}
.cdofig .cdostaaf.cdogerealiseerd{fill:color-mix(in srgb,var(--ink-3) 45%,transparent)}
.cdofig .cdostaaf.cdodoorgerekend{fill:color-mix(in srgb,var(--merk-licht) 22%,transparent);stroke:var(--merk-licht);stroke-width:1;stroke-dasharray:3 2}
.cdofig.cdoomzet .cdostaaf.cdodoorgerekend{fill:color-mix(in srgb,var(--vg-1) 22%,transparent);stroke:var(--vg-1)}
.cdofig .cdostaaf.cdoverlies{fill:color-mix(in srgb,var(--bad-text) 55%,transparent)}
.cdoscheid{stroke:var(--ink-2);stroke-width:1;stroke-dasharray:4 3}
.cdolabel{font:600 9.5px system-ui,sans-serif;fill:var(--ink-2);letter-spacing:.02em}
.cdojaar{font:500 9.5px system-ui,sans-serif;fill:var(--ink-2)}
.cdojaar.cdogerealiseerd{fill:var(--ink-3)}
.cdojaar.cdodoorgerekend{font-style:italic}
.cdowrap{margin:0 18px 6px;padding:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
.cdotabel .anvwrij{grid-template-columns:minmax(64px,1fr) repeat(var(--n,7),minmax(min-content,1fr))}
.cdotabel .anvwrij .lbl{color:var(--ink);font-weight:700;font-family:"Archivo",sans-serif;white-space:nowrap}
.cdotabel .anvwrij .val{white-space:nowrap}
.cdotabel .anvwrij.kop .val b{font:600 10.5px system-ui,sans-serif;color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.cdotabel .anvwrij.cdogerealiseerd .lbl,.cdotabel .anvwrij.cdogerealiseerd .val{color:var(--ink-2)}
.cdotabel .anvwrij.cdodoorgerekend .lbl,.cdotabel .anvwrij.cdodoorgerekend .val{color:var(--ink-2);font-style:italic}
.cdotabel .anvwrij.cdodoorgerekend{background:color-mix(in srgb,var(--ink-3) 6%,transparent)}
.cdotabel .anvwrij .val.cdobron{color:var(--ink-3);font-size:11px;white-space:nowrap;font-style:normal}
.cdotabel .anvwrij .val.cdoverliescel{color:var(--ink-3);font-style:italic}
.cdogroei{margin:0 18px 8px}
.cdobanden{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 18px;margin:0 18px 6px}
.cdoband{min-width:0}
.cdoband b{display:block;font:700 12px "Archivo",sans-serif;color:var(--ink);margin:0 0 2px}
.cdobandsvg{display:block;width:100%;max-width:260px;height:30px;overflow:visible}
.cdobandlijn{stroke:var(--line-2,var(--line));stroke-width:6;stroke-linecap:round}
.cdobandbereik{stroke:var(--vg-1);stroke-width:6;stroke-linecap:round;opacity:.55}
.cdobandgem{stroke:var(--ink);stroke-width:2}
.cdobandnu{fill:var(--merk-licht);stroke:var(--ink);stroke-width:1.5}
.cdobandtekst{margin:2px 0 0;font-variant-numeric:tabular-nums}
.cdoleidend{margin:0 18px 6px}
.cdonoot{margin:0 18px}
.cdoonvoldoende{margin:0 18px 6px}
@media (max-width:479px){.cdogrid,.cdowrap,.cdogroei,.cdobanden,.cdoleidend,.cdonoot,.cdoonvoldoende{margin-left:12px;margin-right:12px}.cdogrid,.cdobanden{grid-template-columns:1fr}.cdotabel .anvwrij{grid-template-columns:minmax(56px,1fr) repeat(var(--n,7),minmax(min-content,1fr))}}
/* v25.58 — PERSBERICHTENMASTER */
/* v25.58 (PERSBERICHTEN-MASTER, M2): staart persberichten-master - de rij (tweede metaregel, knoppen), het werkblad (vijf tabs, bronnen en berekeningen, cover), de app-tekening van een master-item (inhoudsopgave als details, koppen met anker, embed-kaarten met tokens). Alleen tokens, geen hex, geen id-selectors, geen aanwijs-effecten; 320 px zonder horizontaal scrollen. */
.pbm-meta{display:block;font-size:11.5px;color:var(--ink-3);margin-top:2px;overflow-wrap:anywhere}
.pbm-knoppen .pbm-knop{white-space:nowrap}
.pbm-toc{border:1px solid var(--line);border-radius:10px;padding:8px 14px;margin:0 0 16px;background:var(--card-2,var(--stat-bg))}.pbm-toc summary{cursor:pointer;font-weight:700;color:var(--ink)}.pbm-toc ol{margin:8px 0 4px;padding-left:20px}.pbm-toc li{margin:4px 0}.pbm-toc a{color:var(--accent);text-decoration:none}
.pbartbody h2[id],.pbartbody h3[id]{scroll-margin-top:72px}.pbartbody h3{font:700 16px/1.3 "Archivo",sans-serif;margin:18px 0 6px}
.pbm-embed{display:block;background:var(--card-2,var(--stat-bg));border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:0 0 16px;min-width:0;overflow-wrap:anywhere}
.pbm-k{font:700 11px "Archivo",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}.pbm-t{font:800 16px/1.25 "Archivo",sans-serif;margin:2px 0 4px;color:var(--ink)}.pbm-s{font-size:12px;color:var(--ink-3);margin:0 0 10px}
.pbm-tegels{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:0 0 10px}.pbm-tegel{display:flex;flex-direction:column;gap:2px;min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:8px}.pbm-tegel b{font:700 16px "Archivo",sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}.pbm-tegel span{font-size:11.5px;color:var(--ink-2)}
.pbm-tabel{display:flex;flex-direction:column;gap:4px;margin:0 0 10px}.pbm-rij{display:flex;gap:8px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;font-size:12.5px;color:var(--ink)}.pbm-rij span{flex:1;min-width:0}.pbm-rij span:first-child{flex:2}.pbm-rij .num{text-align:right;font-variant-numeric:tabular-nums}.pbm-kop{border:none;padding:0 8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3)}
.pbm-noot{font-size:11.5px;color:var(--ink-3);margin:0 0 8px}.pbm-def{font-size:11px;color:var(--ink-3);line-height:1.45}.pbm-def p{margin:2px 0}.pbm-link{display:inline-block;margin-top:8px;font-size:13px;font-weight:700;color:var(--accent);text-decoration:none}
.pbm-bronnen b.bhgrijs{display:block;margin:12px 0 6px}.pbm-teller{font-size:12px}.pbm-bronlijst,.pbm-berekeningen{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.pbm-bronlijst li,.pbm-berekeningen li{border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13px;display:flex;flex-direction:column;gap:2px;min-width:0}
.pbm-claim{color:var(--ink)}.pbm-bron{font-size:12.5px;color:var(--ink-2);overflow-wrap:anywhere}.pbm-bron a{color:var(--accent)}.pbm-soort{font-style:normal;font-size:11px;padding:1px 6px;border-radius:4px;border:1px solid var(--line);color:var(--ink-3)}
.pbm-formule{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;color:var(--ink-2);overflow-wrap:anywhere}.pbm-invoer{margin:4px 0 0;padding-left:16px;font-size:12px;color:var(--ink-2)}.pbm-uitkomst{font-size:12.5px;color:var(--ink)}.pbm-belangen{font-size:13px;margin:12px 0 0}
.pbm-cover .pbcover img{max-width:100%;height:auto;border-radius:8px;display:block}.pbm-cover .pbveld{margin-top:8px}.pbm-wens,.pbm-coverstand{font-size:13px;margin:10px 0 0}.pbm-coverstand code{font-size:12px}
.pbm-instellingen{margin:0 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}.pbm-instellingen .pbwkeuze{display:flex;gap:8px;align-items:flex-start;margin:6px 0;font-size:13px}.pbm-instellingen .pbveld{margin-top:8px}
@media(max-width:480px){.pbm-rij{flex-wrap:wrap}.pbm-rij span{flex:1 1 40%}.pbm-rij span:first-child{flex:1 1 100%}.pbm-kop{display:none}.pbm-knoppen .pbm-knop{white-space:normal}}
/* v25.58 — PERSBERICHTENBEHEERNET */
/* v25.58 (PERSBERICHTEN-BEHEER-NET): de nette persbericht-kaart op /beheer en het werkblad-kaartje (Rabi 15-9: fix alles); alleen achter pbn-klassen (zonder het blok inert), alleen tokens */
.bhview .pblijst li.pbwrij.pbn-rij{grid-template-columns:20px minmax(0,1fr);align-items:start}
.bhview .pbwrij.pbn-rij .bhsigknoppen.pbn-acties{grid-column:2;grid-row:auto;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;width:100%;max-width:none;min-width:0;overflow-wrap:normal}
@media (min-width:1024px){
  .bhview .pblijst li.pbwrij.pbn-rij{grid-template-columns:20px minmax(0,1fr) minmax(240px,300px);column-gap:14px}
  .bhview .pbwrij.pbn-rij .bhsigknoppen.pbn-acties{grid-column:3;grid-row:1}
}
@media (min-width:480px) and (max-width:1023px){
  .bhview .pbwrij.pbn-rij .bhsigknoppen.pbn-acties{align-items:flex-start}
  .bhview .pbwrij.pbn-rij .pbn-cluster,.bhview .pbwrij.pbn-rij .pbn-hoofd,.bhview .pbwrij.pbn-rij .pbmenu{width:100%;max-width:420px}
}
.bhview .pbwrij.pbn-rij .pbn-kies{display:flex;align-items:flex-start;justify-content:center;box-sizing:content-box;width:20px;min-height:26px;margin:-10px -10px 0 -12px;padding:10px 10px 8px 12px;font-size:inherit;font-weight:inherit;letter-spacing:0;text-transform:none;color:inherit;cursor:pointer}
.bhview .pbwrij.pbn-rij .pbn-kies input{appearance:auto;width:18px;height:18px;margin:1px 0 0;padding:0;border:0;border-radius:0;background:transparent;flex:none;accent-color:var(--accent)}
.bhview .pbwrij.pbn-rij .pbtitel::after{content:"\203A";margin-left:4px;color:var(--ink-3);font-weight:400;flex:none}
.bhview .pbwrij.pbn-rij .pbvlaggen{flex-direction:column;align-items:flex-start;gap:4px}
.bhview .pbn-vlag,.bhview .pbn-groep{align-self:stretch}
.bhview .pbn-vlag{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;min-width:0}
.bhview .pbn-vlag .pbvlag{flex:none;max-width:100%;min-height:44px;display:inline-flex;align-items:center}
.bhview .pbn-detail{flex:1 1 100%;padding-left:8px;min-width:0;font-size:12.5px;line-height:1.35;color:var(--ink-2);overflow-wrap:anywhere}
.bhview .pbn-groep{border:1px solid var(--line-2);border-radius:10px;padding:0 12px;min-width:0;background:var(--card)}
.bhview .pbn-groep.let{border-color:var(--gold)}
.bhview .pbn-groepkop{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;font-weight:600;color:var(--ink-2)}
.bhview .pbn-groep.let .pbn-groepkop{color:var(--gold)}
.bhview .pbn-groepkop::-webkit-details-marker{display:none}
.bhview .pbn-groepkop .vaico{flex:none;transition:transform .15s}
.bhview .pbn-groep[open] .pbn-groepkop .vaico{transform:rotate(180deg)}
.bhview .pbn-groeplijst{display:flex;flex-direction:column;padding:0 0 6px;border-top:1px solid var(--line)}
.bhview .pbn-groeplijst .pbn-vlag{border-top:1px solid var(--line)}
.bhview .pbn-groeplijst .pbn-vlag:first-child{border-top:0}
.bhview .pbn-groeplijst .pbvlag{display:flex;align-items:center;width:100%;max-width:100%;min-height:44px;margin:0;padding:8px 0;border:0;border-radius:0;font-size:12.5px;font-weight:500;line-height:1.35;color:var(--ink);text-align:left;white-space:normal}
.bhview .pbn-acties .bhknop{margin-left:0}
.bhview .pbn-cluster{display:flex;flex-direction:column;align-items:stretch;gap:6px;min-width:0}
.bhview .pbn-kanaalkop{font-size:11.5px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink-2)}
.bhview .pbn-kanaal{display:flex;align-items:flex-start;gap:10px;box-sizing:border-box;min-height:44px;min-width:0;margin:0;padding:8px 10px;border:1px solid var(--line-2);border-radius:10px;background:var(--card);font-size:13px;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer;overflow-wrap:normal}
.bhview .pbn-kanaal input,.bhview .pbn-vak .pbwkeuze input{appearance:auto;width:20px;height:20px;flex:none;margin:1px 0 0;padding:0;border:0;border-radius:0;background:transparent;accent-color:var(--accent)}
.bhview .pbn-kanaal.vast input{opacity:1}
.bhview .pbn-kanaaltekst{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.bhview .pbn-kanaalnaam{white-space:nowrap}
.bhview .pbn-kanaalreden{font-size:12px;font-weight:400;line-height:1.35;color:var(--ink-3);overflow-wrap:anywhere}
.bhview .pbn-kanaal.uit{color:var(--ink-3);border-style:dashed;cursor:default}
.bhview .pbn-kanaal.vast{cursor:default}
.bhview .pbn-uitleg{font-size:12px;line-height:1.35;color:var(--ink-3)}
.bhview .pbn-hoofd{display:flex;min-width:0}
.bhview .pbn-hoofd .bhknop{flex:1 1 auto;width:100%;min-width:0;min-height:44px;font-size:14px;justify-content:center}
.bhview .pbn-acties .pbmenu{display:block;width:100%}
.bhview .pbn-acties .pbmenu>summary{box-sizing:border-box;display:flex;width:100%;min-height:44px;gap:8px;padding:0 12px;border-radius:12px;font-size:13px;font-weight:600}
.bhview .pbn-acties .pbmenu[open]>div{left:0;right:0;min-width:0}
.bhview .pbn-acties .pbmenu[open]>div .bhknop{min-height:44px;flex-wrap:wrap;justify-content:flex-start;text-align:left}
.bhview .pbn-menureden{flex:1 1 100%;font-size:12px;font-weight:400;line-height:1.35;color:var(--ink-3);text-align:left}
/* herstel controleurs: Meer-lijst in de kaart onder 1024 px; pbn-vak = werkblad-kaartje in gewone letters */
@media (max-width:1023px){ .bhview .pbn-acties .pbmenu[open]>div{position:static;box-shadow:none;margin-top:4px;min-width:0} }
.bhview .pbn-vak .pbwkeuze{display:flex;align-items:flex-start;gap:10px;min-height:44px;margin:0;padding:8px 0;font-size:13px;font-weight:500;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--ink);cursor:pointer}
.bhview .pbn-vak .pbwkeuze.uit{color:var(--ink-3);cursor:default}
.bhview .pbn-vak .pbwkeuze i{display:block;margin-top:2px;font-style:normal;font-size:12px;font-weight:400;line-height:1.35;color:var(--ink-3);overflow-wrap:anywhere}
.bhview .pbn-vak .pbpplan{margin-left:30px}
@media (prefers-reduced-motion:reduce){ .bhview .pbn-groepkop .vaico{transition:none} }
/* v25.58 — RABIPORTEFEUILLE */
/* v25.58 (RABI-PORTEFEUILLE): staart rabi-portefeuille - de pagina (hero, verdeling, posities, teaser) en de Instellen-kaart; alleen tokens/color-mix, geen id-selectors, geen aanwijs-effecten; ASCII-commentaar */
main.screen[data-view="rabipf"]>:is(.tape,.newsbar,.apphead,.topnav,.testbar,.hintbar,section.card){display:none}
.rpbody{display:flex;flex-direction:column;gap:12px}
.rphero,.rpverdeling,.rpposities,.rpbeheer,.rpteaser,.rpwat,.rpmelding{padding:14px 16px}
.rphero .rpgroot{font:800 26px/1.1 "Archivo",sans-serif;margin:4px 0 10px;overflow-wrap:anywhere}
.rptegels{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px}
.rptegel{background:color-mix(in srgb,var(--ink) 5%,transparent);border:1px solid var(--line);border-radius:14px;padding:11px 12px 10px;display:flex;flex-direction:column;gap:3px;min-width:0}
.rptegel b{font:800 20px/1.15 "Archivo",sans-serif;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;min-width:0}
.rptegel b i{display:block;font-style:normal;font-weight:600;font-size:13px;line-height:1.25;opacity:.75;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rptegel span{font-size:12px;color:var(--ink-3);line-height:1.3}
.rpbalk{display:flex;height:14px;border-radius:7px;overflow:hidden;background:color-mix(in srgb,var(--ink) 8%,transparent)}
.rpbalk span{display:block;min-width:2px;height:100%}
.rplegenda{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:6px 12px;font-size:13px}
.rplegenda li{display:flex;align-items:center;gap:8px;min-width:0}
.rplegenda i{flex:none;width:10px;height:10px;border-radius:3px}
.rplegenda span{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rplegenda b{font-variant-numeric:tabular-nums;white-space:nowrap}
.rprij{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:10px 0;border-top:1px solid var(--line);align-items:center}
.rprij1{min-width:0;overflow-wrap:anywhere}
.rprij1 .rpnaam{font-weight:700}
.rprend{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.rprij2{grid-column:1/-1;display:flex;align-items:center;gap:8px;min-width:0;font-size:12px;color:var(--ink-2)}
.rprij2 .rpsector{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rpweg{flex:1 1 40px;height:6px;border-radius:3px;background:color-mix(in srgb,var(--ink) 8%,transparent);overflow:hidden}
.rpweg i{display:block;height:100%;border-radius:3px;background:var(--accent)}
.rpwegpct,.rpdag{flex:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.rppil{flex:none;font-size:11px;font-weight:600;padding:1px 7px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-3)}
.rprij3{grid-column:1/-1;font-size:12px;font-variant-numeric:tabular-nums}
.rpgoed{color:var(--good-text)}
.rpslecht{color:var(--bad-text)}
.rpklap{grid-column:1/-1;font-size:13px}
.rpklap summary{display:list-item;padding:12px 0;line-height:20px;cursor:pointer;color:var(--ink-2);font-weight:600}
.rpklap p{margin:0 0 6px;color:var(--ink-2)}
.rpbeheerregel{margin:0;font-size:13px}
.rpvoet{font-size:12px;color:var(--ink-3);margin:0}
.rpwatlijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rpwatlijst li{display:flex;align-items:center;gap:8px;color:var(--ink-2)}
.rpmelding p{margin:0 0 8px}
.rpladen{display:flex;flex-direction:column;gap:12px}
.rpskelet{padding:14px 16px;min-height:72px}
.rpskelet b,.rpskelet span{display:block;height:14px;border-radius:7px;background:color-mix(in srgb,var(--ink) 8%,transparent);margin:6px 0;max-width:60%}
.rpinstelvelden{display:flex;flex-direction:column;gap:12px;margin:4px 0 12px}
.rplabel{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;text-transform:none;letter-spacing:0;color:var(--ink)}
[data-rp-instel] .bhstat b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rpinput,.rpselect{width:100%;box-sizing:border-box;background:var(--input-bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);font:inherit;font-size:14px;min-height:44px}
.rpschakelrij{display:flex;align-items:flex-start;gap:12px}
.rpschakeltekst{display:flex;flex-direction:column;gap:2px;font-size:13px;min-width:0}
.rpschakel{appearance:none;cursor:pointer;flex:none;width:52px;height:32px;margin:6px 0;border-radius:999px;border:1px solid var(--line-2);background:color-mix(in srgb,var(--ink) 12%,transparent);position:relative;padding:0}
.rpschakel .rpknop{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--card);transition:left .15s}
.rpschakel[aria-checked="true"]{background:var(--accent);border-color:var(--accent)}
.rpschakel[aria-checked="true"] .rpknop{left:23px}
.rpschakel[disabled]{opacity:.5;cursor:default}
.rptoel{display:flex;flex-direction:column;gap:10px;font-size:13px}
.rptoelrij{display:flex;flex-direction:column;gap:6px}
.rptoelknop{display:flex;align-items:center;justify-content:space-between;gap:10px}
.rptoelknop .bhknop{min-height:44px}
.rpschakel:focus-visible,.rpselect:focus-visible,.rpinput:focus-visible,.rpklap summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.rpschakel .rpknop{transition:none}}
/* v25.58 (RABI-PORTEFEUILLE, herstel tegenlezer): desktop zoals Dividend (r. main.screen[data-view=dividend]) - zonder deze regel blijft de app-kolom 520 px en breekt de titel midden in het woord */
@media (min-width:760px){main.screen[data-view="rabipf"]{max-width:1080px}.rpbody{max-width:1080px;margin:0 auto}}
@media (min-width:960px){.rpboven{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}.rphero .rptegels{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:479px){.rptegels{grid-template-columns:1fr 1fr}}
/* v25.58 — TRAININGEN */
/* v25.58 (TRAININGEN): staart trainingen - de pagina (kaarten, embed-plaatshouder, linkkaart, slot, categoriekoppen) en de beheerlaag (formulier, strook); alleen tokens/color-mix, geen id-selectors, geen aanwijs-effecten; ASCII-commentaar. Herstel tegenlezer 16-9: de tekstkleur van de link "Open in een nieuw venster" (.tnopen zonder .btn) staat los van de knop "Open de pagina" (.btn.tnopen houdt de knoptekstkleur --accent-tekst op het accent; voorheen won .tnmeta .tnopen met twee klassen van .btn en werd de tekst blauw op blauw) */
main.screen[data-view="trainingen"]>:is(.tape,.newsbar,.apphead,.topnav,.testbar,.hintbar,section.card){display:none}
.tnbody{display:flex;flex-direction:column;gap:12px}
.tnraster{display:grid;grid-template-columns:1fr;gap:12px}
.tncatkop{margin:8px 0 0}
.tnkaart{padding:0 0 14px;overflow:hidden;display:flex;flex-direction:column;gap:6px}
.tnkaart.tnlink,.tnkaart.tnslot{padding:14px 16px 14px}
.tnkaart.tnslot .slotkaart{margin:0}
.tnconcept{opacity:.75;border-style:dashed}
.tnembed{position:relative;width:100%;aspect-ratio:16/9;background:color-mix(in srgb,var(--ink) 5%,transparent)}
.tnembed[data-tn-soort="pagina"]{aspect-ratio:4/3}
.tnembed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.tnladen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:44px;background:transparent;border:0;color:var(--ink);font:600 14px "IBM Plex Sans",sans-serif;cursor:pointer}
.tnladen .vaico{width:48px;height:48px;color:var(--accent)}
.tntitel{font:800 17px/1.25 "Archivo",sans-serif;margin:12px 16px 0;overflow-wrap:anywhere}
.tnkaart.tnlink .tntitel,.tnkaart.tnslot .tntitel{margin:0}
.tntekst{margin:0 16px;color:var(--ink-2);font-size:13.5px;line-height:1.45;overflow-wrap:anywhere}
.tnkaart.tnlink .tntekst{margin:0}
.tnmeta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 16px;font-size:13px}
.tnkaart.tnlink .tnmeta,.tnkaart.tnslot .tnmeta{margin:0}
.tnmeta .tnopen:not(.btn){min-height:44px;display:inline-flex;align-items:center;color:var(--accent);font-weight:600}
.tnmeta .btn.tnopen{min-height:44px;color:var(--accent-tekst)}
.tnhost{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.tnpil{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-3)}
.tnpil .vaico{width:13px;height:13px}
.tnpil.tnpub{color:var(--good-text);border-color:var(--good-text)}
.tnvoet{font-size:12px;color:var(--ink-3);margin:0}
.tnmelding{padding:14px 16px}
.tnmelding p{margin:0 0 8px}
.tnladen-skelet,.tnskelet{padding:14px 16px;min-height:72px}
.tnskelet b,.tnskelet span{display:block;height:14px;border-radius:7px;background:color-mix(in srgb,var(--ink) 8%,transparent);margin:6px 0;max-width:60%}
.tntoevoegen{display:inline-flex;align-items:center;gap:6px;min-height:36px;cursor:pointer;color:var(--ink)}
.tnbeheer{padding:14px 16px}
.tnform{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.tnlabel,.tnveld{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--ink)}
.tnlabeltekst{font-weight:600}
.tninput{width:100%;box-sizing:border-box;background:var(--input-bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);font:inherit;font-size:14px;min-height:44px}
.tninput[aria-invalid="true"]{border-color:var(--bad-text)}
.tnteller,.tnhint{font-size:12px}
.tnfout{color:var(--bad-text);font-size:12.5px}
.tnseg{display:flex;flex-wrap:wrap;gap:6px}
.tnseg button{appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;min-height:44px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-2);background:var(--card);color:var(--ink-2)}
.tnseg button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--merk-navy)}
.tnschakelrij{display:flex;align-items:flex-start;gap:12px}
.tnschakeltekst{display:flex;flex-direction:column;gap:2px;font-size:13px;min-width:0}
.tnschakel{appearance:none;cursor:pointer;flex:none;width:52px;height:32px;margin:6px 0;border-radius:999px;border:1px solid var(--line-2);background:color-mix(in srgb,var(--ink) 12%,transparent);position:relative;padding:0}
.tnschakel .tnknop{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--card);transition:left .15s}
.tnschakel[aria-checked="true"]{background:var(--accent);border-color:var(--accent)}
.tnschakel[aria-checked="true"] .tnknop{left:23px}
.tnschakel[disabled],.tnseg button[disabled]{opacity:.5;cursor:default}
.tnacties{display:flex;flex-wrap:wrap;gap:8px}
.tnacties .btn,.tnacties .bhknop{min-height:44px}
.tnvoorbeeld{display:flex;flex-direction:column;gap:8px;margin-top:12px;font-size:13px}
.tnstrook{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 16px 0}
.tnkaart.tnlink .tnstrook{margin:8px 0 0}
.tnstrook .bhknop{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;gap:5px}
.tnstrook .tnweg{color:var(--bad-text)}
.tnladen:focus-visible,.tnstrook .bhknop:focus-visible,.tnseg button:focus-visible,.tnschakel:focus-visible,.tninput:focus-visible,.tnopen:focus-visible,.tntoevoegen:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.tnschakel .tnknop{transition:none}}
@media (min-width:760px){.tnbody{max-width:1080px;margin:0 auto}.tnembed[data-tn-soort="pagina"]{min-height:420px}}
@media (min-width:960px){.tnraster{grid-template-columns:1fr 1fr}}
@media (max-width:479px){.tnstrook .bhknop{flex:1 1 45%}}
/* v25.58 — KWALITEITRAND */
/* v25.58 (KWALITEIT-RAND): staart kwaliteit-rand - de inhoud van de kaart Kwaliteit van het bedrijf (ring met getal, meetlatrijen, voetregel) staat binnen dezelfde zijrand als de kop (18 px, zoals .tkc .cardhead en .tkstats) in plaats van tegen de kaartrand; Rabi 17-9: "verbeter de look hier zodat het niet zo aan de zijkanten zit"; alleen tokens, geen hexwaarden, geen voorrangsvlag, geen id-selector, geen aanwijs-woord */
.kqkaart .kqinhoud{padding:0 18px 12px}
.kqkaart .kqinhoud .kqvoet{margin-left:0;margin-right:0}
/* v25.58 — CHATANTWOORDWISSEN */
/* v25.58 (CHAT-ANTWOORD-WISSEN): staart chat-antwoord-wissen - de knop Verwijderen achter naam en tijd van een antwoord in de thread (rechterpaneel en mobiele sheet): het lijn-icoon van de werkbalk in --ink-3, rechts uitgelijnd, doel 32 px (44 px in de sheet) zonder de kopregel hoger te maken; bezig = gedempt; alleen tokens, geen hexwaarden, geen id, geen aanwijs-regel */
.cdndraadkop .cawwis{appearance:none;border:0;background:transparent;flex:none;display:inline-flex;align-items:center;justify-content:center;align-self:center;width:32px;height:28px;margin:-6px 0 -6px auto;padding:0;border-radius:8px;color:var(--ink-3);cursor:pointer}
.cdndraadkop .cawwis .cdcico{width:16px;height:16px}
.cdndraadkop .cawwis .cawtekst{font-size:12px;font-weight:600}
.cdndraadkop .cawwis:focus-visible{outline:2px solid var(--accent);outline-offset:2px;color:var(--bad-text)}
.cdndraadkop .cawwis[disabled]{opacity:.5;cursor:default}
.cdndraad.mobiel .cdndraadkop .cawwis{width:44px;height:36px;margin:-8px -6px -8px auto}
.cdndraadantwoord.cawbezig{opacity:.6}
/* v25.58 — POLITICIKWALITEIT */
/* v25.58 (POLITICI-KWALITEIT): staart politici-kwaliteit - de chip kwaliteit/Belegger-score op een meldingsrij (signalen, bijna, hoogst), de ranglijst Hoogst scorende aankopen als geen aankoop de grens haalt (kop met label, zin, rijen met rangnummer, onder de lege-tekst in de lijst) en de regel N nieuwe meldingen in de kaartkop; Rabi 17-9: "Neem hierin de kwaliteit en beleggers scores mee" en "te leeg"; alleen tokens, geen hex, geen id-selector */
.pkchip{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 45%, var(--line))}
.pknieuw{display:block;flex:1 0 100%;font-size:12px;color:var(--ink-3);margin-top:2px}
.pkhoogst{border-top:1px solid var(--line);margin-top:4px}
.pkhoogstkop{display:flex;flex-wrap:wrap;gap:6px;align-items:baseline;margin:10px 14px 0;font-size:13px;color:var(--ink)}
.pkhoogstkop b{font-size:14px}
.pkhoogstlabel{font-size:10.5px;white-space:normal}
.pkhoogstzin{margin:4px 14px 8px;color:var(--ink-2)}
.pkhoogstlijst .psrij:first-child{border-top:1px solid var(--line)}
.pkrang{font-size:12px;font-weight:700;color:var(--ink-3);margin-right:4px}
.pkhoogstchip{color:var(--ink-3)}
.pkterugblik,.pkhoogstuitleg{color:var(--ink-2)}
@media (max-width:479px){.pkhoogstkop{margin:10px 12px 0}.pkhoogstzin{margin:4px 12px 8px}}
/* v25.58 — PROFIELGESCHIEDENIS */
/* v25.58 (PROFIEL-GESCHIEDENIS): staart profiel-geschiedenis - de berichtgeschiedenis op het profiel (rechterpaneel en mobiele sheet) met twee tabs Berichten/Antwoorden (keuzerij zoals .cdnsegment: --seg-bg, --card, --ink-2, --ink), de regel "N berichten in kanalen die je niet kunt zien", de verwijzing "als antwoord op ..." op een antwoordkaartje, de knop Meer laden (volle breedte, --card/--line) en de foutregel; doelen 30 px in het paneel en 44 px in de sheet; alleen tokens, geen hexwaarden, geen id, geen aanwijs-regel */
.pgtabs{display:flex;gap:4px;background:var(--seg-bg);border-radius:8px;padding:3px;margin-top:8px}
.pgtab{appearance:none;border:0;cursor:pointer;flex:1 1 0;min-width:0;height:30px;border-radius:6px;background:transparent;color:var(--ink-2);font:600 13px "IBM Plex Sans",sans-serif;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pgtab.aan{background:var(--card);color:var(--ink)}
.pgtab:focus-visible,.pgmeer:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pgverborgen{margin:8px 0 0;font-size:12px;line-height:1.4;color:var(--ink-3)}
.pgop{display:block;font-size:11px;line-height:1.4;color:var(--ink-3);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pgantwoord.pgweg{cursor:default}
.pgantwoord.pgweg .pgop{font-style:italic}
.pgmeer{appearance:none;display:block;width:100%;box-sizing:border-box;margin-top:8px;height:32px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink-2);font:600 13px "IBM Plex Sans",sans-serif;cursor:pointer}
.pgmeer[disabled]{opacity:.6;cursor:default}
.pgfout{margin:8px 0 0;font-size:12px;color:var(--bad-text)}
.cdnprofiel.mobiel .pgtab{height:44px;font-size:14px}
.cdnprofiel.mobiel .pgmeer{height:44px;font-size:14px}
.cdnprofiel.mobiel .pgop{font-size:12px}
/* v25.58 — MASTERPROMPTVAST */
/* v25.58 (MASTERPROMPT-VAST): staart masterprompt-vast - de zin boven en het ingeklapte klapblok om de kaart Huisstijl en opmaak in het klapblok Instellingen van de kaart Persberichten op /beheer (details.bhklap.mvklap: de samenvatting als tikdoel van 44 px, focusring in --accent, de kaart met wat lucht eronder), plus de ene extra regel in de kaart Artikelen volgens de masterprompt en de regel met de ontbrekende onderdelen onder Schrijven mislukt in de wachtrij; alleen tokens, geen eigen kleur */
.mvzin{margin:8px 0 2px}
details.mvklap{margin-top:2px}
details.mvklap>summary{min-height:44px;display:flex;align-items:center;gap:6px}
details.mvklap>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
details.mvklap>.pbprohuis{margin-top:6px}
.mvmaster{margin-top:-4px}
.pbwrij .mvfoutdetail{margin:2px 0 0;font-size:12.5px;line-height:1.4;color:var(--ink-3);overflow-wrap:anywhere}
/* v25.58 — PBACHTERGROND */
/* v25.58 (PB-ACHTERGROND): staart pb-achtergrond - de rij van een artikel dat de schrijver op de achtergrond maakt (Beheer > Persberichten): de chip "Schrijver bezig - sinds hh:mm" met een rustig knipperende stip, een voortgangsbalk van vaste hoogte (3 px, geen sprong in de lijst; stil bij prefers-reduced-motion), de knop Nu ophalen en het menu Meer in de kolom van de acties zoals de andere rijen (klassen pbn-hoofd/pbn-meertekst van BEHEER-NET), de tegel "in de maak" op de kaart. Alleen pbag-selectors en tokens (--accent, --accent-lijn, --seg-bg, --ink-2, --ink-3, --card); geen hex, geen id, geen :has, geen voorrangsvlag. Terugweg: zonder het clientblok staat er geen pbag-klasse in de DOM en is deze staart inert. */
.pbag-chip{display:inline-flex;align-items:center;gap:5px;font-style:normal}
.pbag-stip{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pbagstip 1.8s ease-in-out infinite}
@keyframes pbagstip{0%,100%{opacity:1}50%{opacity:.35}}
.pbag-sinds,.pbag-poging{font-weight:500;color:var(--ink-2)}
.pbag-balk{display:block;position:relative;height:3px;margin:6px 0 4px;border-radius:3px;background:var(--seg-bg);overflow:hidden}
.pbag-balkvul{position:absolute;top:0;left:0;height:100%;width:38%;border-radius:3px;background:var(--accent);opacity:.75;animation:pbagbalk 2.6s ease-in-out infinite}
@keyframes pbagbalk{0%{transform:translateX(-100%)}100%{transform:translateX(280%)}}
.pbag-rij .pbn-acties.pbag-acties{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.pbag-rij .pbag-hoofd{display:flex}
.pbag-rij .pbag-hoofd .pbag-ophalen{flex:1 1 auto;min-height:44px}
.pbag-rij .pbag-ophalen[disabled]{opacity:.6;cursor:default}
.pbag-rij .pbn-acties.pbag-acties details.pbmenu>summary{min-height:44px}
.pbag-tegel .b3bet{color:var(--ink-3)}
.pbag-tegel .b3cijfer{color:var(--accent)}
@media (prefers-reduced-motion:reduce){.pbag-stip{animation:none}.pbag-balkvul{animation:none;width:100%;opacity:.35;transform:none}}
@media (min-width:1024px){.pbag-rij .pbn-acties.pbag-acties{min-width:220px}}
/* v25.58 — AIMODERATIE */
/* v25.58 (AI-MODERATIE): staart ai-moderatie - alleen de beheerder ziet een verborgen bericht, met een kleine markering "Verborgen - <reden>" en de knoppen Maak zichtbaar en Verwijder op de chatkaart, in de Thread-sheet en op de klassieke kaarten (Rabi 17-9: "Enkel admins moeten kunnen zien dat een bericht niet zichtbaar is met de knoppen verwijder of maak zichtbaar"), plus de beheerlijst Verborgen door de automatische controle met tellers en de knop Nu controleren; het lid ziet niets bijzonders; alleen tokens, geen hexwaarden, geen voorrangsvlag, geen id-selector, geen aanwijs-woord */
.aimverborgen{outline:1px dashed var(--line-2);outline-offset:2px;border-radius:10px}
.aimmarkering{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;box-sizing:border-box;margin:6px 0 0;padding:4px 8px;border-radius:8px;background:var(--card-2);color:var(--ink-3);font-size:12px;line-height:1.35}
.aimmarkering .aimmarktekst{flex:1 1 100%;min-width:0;overflow-wrap:anywhere}
.aimmarkering .aimknop{min-height:32px;padding:4px 10px;font-size:12px}
.cdnsheet .aimmarkering .aimknop{min-height:44px}
.aimlijst .aimtekst,.aimlijst .aimreden{display:block;margin:2px 0;color:var(--ink-3);font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.aimlijst .bhknop{min-height:36px}
.aimblok .bhleeg{margin:4px 0}
.aimtellers{display:flex;flex-wrap:wrap;gap:4px 14px;margin:4px 0 8px;color:var(--ink-3);font-size:13px;line-height:1.4}
.aimtellers .bhknop{min-height:36px}
/* v25.58 — TRIAGERELEASE1 */
/* v25.58 (TRIAGE-RELEASE-1): staart triage-release-1 - de chips 'Je andere portefeuilles: naam - N posities' op de lege kaart (besluit 9.18), onder de gele wisselbalk; tikbaar, 44 px hoog op aanraakschermen; geen aanwijs-effect (oudere suites scannen elke latere staart) */
.trchips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:8px 0 4px;font-size:13px;color:var(--ink-3)}
.trchips-kop{margin-right:2px}
.trchips .trchip{min-height:32px;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink-2);font-size:13px;line-height:1.3;cursor:pointer}
.trchips .trchip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (pointer:coarse){.trchips .trchip{min-height:44px}}
/* ===== v25.58 FINANCIENTAB (begin) ===== */
/* v25.58 — FINANCIENTAB */
/* v25.58 (FINANCIEN-TAB): staart financien-tab - de tab Financien op de bedrijfspagina (blok v25.58 financien-tab): drie stroomdiagrammen (svg, viewBox + width 100 %, horizontaal scrollbaar op een smal scherm met een vervaging rechts als scroll-hint), knopen als balken met naam/bedrag/j-j/marge, stromen in de kleur van de bestemming (groen = winst, rood = kosten, donker of grijs = neutraal; lichter naarmate de band dunner is), het uitlegpaneel (kaart onder het diagram; op een smal scherm een sheet van onderen), de keuzerijen (.seg zoals de tabbalk), de tabel, het skelet en de bronregel. Onder 480 px scrolt de tabbalk van de bedrijfspagina (.tkviewbar .seg - de enige segmentkiezer in die balk, zoals de bestaande regel .tkviewbar .seg{width:100%}; geen id-selector, en niet het klassewoord van de tabbalk zelf omdat de suite bedrijfspagina2-client dat woord na haar 359 px-regel in de hele rest van de stylesheet uitsluit) horizontaal met een vervaging rechts, zodat alle vijf labels volledig blijven (tegenlezing H4). Kleurtokens per thema, uitsluitend uit de huisstijl (geen hex, geen rgb, geen rgba: --ink/--ink-2 voor neutraal, --good/--good-text voor winst, --bad/--bad-text voor kosten, de stromen en de sluier als color-mix van dezelfde tokens) plus --card, --line, --accent, --seg-bg, --shadow. */
:root{--ft-neutraal:var(--ink-2);--ft-neutraal-stroom:color-mix(in srgb, var(--ink-2) 55%, transparent);--ft-winst:var(--good);--ft-winst-stroom:color-mix(in srgb, var(--good) 80%, transparent);--ft-kosten:var(--bad);--ft-kosten-stroom:color-mix(in srgb, var(--bad) 80%, transparent);--ft-neg:var(--bad-text);--ft-diagram-bg:var(--card)}
:root[data-theme="light"]{--ft-neutraal:var(--ink);--ft-neutraal-stroom:color-mix(in srgb, var(--ink) 42%, transparent);--ft-winst:var(--good-text);--ft-winst-stroom:color-mix(in srgb, var(--good) 55%, var(--card));--ft-kosten:var(--bad-text);--ft-kosten-stroom:color-mix(in srgb, var(--bad) 45%, var(--card));--ft-neg:var(--bad-text);--ft-diagram-bg:var(--card)}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--ft-neutraal:var(--ink);--ft-neutraal-stroom:color-mix(in srgb, var(--ink) 42%, transparent);--ft-winst:var(--good-text);--ft-winst-stroom:color-mix(in srgb, var(--good) 55%, var(--card));--ft-kosten:var(--bad-text);--ft-kosten-stroom:color-mix(in srgb, var(--bad) 45%, var(--card));--ft-neg:var(--bad-text);--ft-diagram-bg:var(--card)}}
.ftkaart{padding-bottom:14px;position:relative}
.ftkaart .fthead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;padding:14px 18px 6px}
.ftkaart .fthead h3{margin:0}
.ftkeuze{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ftkeuze .seg{max-width:100%;overflow-x:auto;scrollbar-width:none}
.ftkeuze .seg button{white-space:nowrap}
.ftdeel{padding:10px 18px 4px;border-top:1px solid var(--line)}
.ftkop{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;margin-bottom:6px}
.ftkoptekst{font-size:14px;color:var(--ink);min-width:0}
.ftkoptekst b{font-weight:700}
.ftkoprechts{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-3)}
.ftinfo{appearance:none;width:24px;height:24px;border-radius:50%;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink-2);font:700 12px/1 "IBM Plex Sans",sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.ftinfo[aria-expanded="true"]{color:var(--ink);border-color:var(--accent)}
.ftinfo:focus-visible,.ftsluit:focus-visible,.ftkeuze .seg button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ftnoot,.ftleeg{margin:2px 0 8px;font-size:12.5px;color:var(--ink-3)}
.ftdiagramrand{position:relative;border-radius:12px;background:var(--ft-diagram-bg);border:1px solid var(--line)}
.ftdiagram{overflow-x:auto;overflow-y:hidden;border-radius:12px;padding:6px 4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.ftdiagramrand::before,.ftdiagramrand::after{content:"";position:absolute;top:0;bottom:0;width:36px;pointer-events:none;opacity:0;transition:opacity .15s} /* scroll-hint (herstelronde, LAAG): een vervaging in de kleur van de ondergrond alleen aan de kant waar nog meer staat; de klassen ftscrolt-l/ftscrolt-r zet het blok naar de scrollstand, dus nooit een vervaging als alles past */
.ftdiagramrand::after{right:0;border-radius:0 12px 12px 0;background:linear-gradient(to right, transparent, var(--ft-diagram-bg))}
.ftdiagramrand::before{left:0;border-radius:12px 0 0 12px;background:linear-gradient(to left, transparent, var(--ft-diagram-bg))}
.ftdiagramrand.ftscrolt-r::after,.ftdiagramrand.ftscrolt-l::before{opacity:1}
.ftdiagram:focus-visible{outline:2px solid var(--accent)}
.ftsvg{display:block;width:100%;height:auto;min-width:640px;font:12px "IBM Plex Sans",sans-serif}
.ftsvg.ftsmal{min-width:560px}
.ftsvg .ftbalk{fill:var(--ft-neutraal)}
.ftsvg .ftknoop.winst .ftbalk{fill:var(--ft-winst)}
.ftsvg .ftknoop.kosten .ftbalk{fill:var(--ft-kosten)}
.ftsvg .ftstroom{fill:var(--ft-neutraal-stroom);stroke:none;cursor:pointer;transition:opacity .15s ease}
.ftsvg .ftstroom.winst{fill:var(--ft-winst-stroom)}
.ftsvg .ftstroom.kosten{fill:var(--ft-kosten-stroom)}
.ftsvg .ftknoop{cursor:pointer;transition:opacity .15s ease}
.ftsvg .fthit{fill:transparent;pointer-events:all}
.ftsvg .ftlabel{fill:var(--ink);pointer-events:none}
.ftsvg .ftnaam{font-weight:700}
.ftsvg .ftbedrag{font-weight:600}
.ftsvg .ftjj{fill:var(--ink-3);font-size:11px}
.ftsvg .ftneg .ftbedrag,.ftneg,.fttabel td.ftneg,.ftreekswaarde.ftneg,.ftpaneelbedrag b.ftneg{fill:var(--ft-neg);color:var(--ft-neg)}
.ftsvg.ftdim .ftknoop:not(.aan),.ftsvg.ftdim .ftstroom:not(.aan){opacity:.28}
.ftsvg .ftknoop:focus-visible,.ftsvg .ftstroom:focus-visible{outline:none}
.ftsvg .ftknoop:focus-visible .ftbalk{stroke:var(--accent);stroke-width:3px}
.ftsvg .ftstroom:focus-visible{stroke:var(--accent);stroke-width:2px}
.fttabelwrap{overflow-x:auto;margin:10px 0 4px}
.fttabel{width:100%;border-collapse:collapse;font-size:12.5px}
.fttabel th,.fttabel td{padding:5px 8px;text-align:right;border-top:1px solid var(--line);white-space:nowrap}
.fttabel thead th{color:var(--ink-3);font-weight:600;border-top:none}
.fttabel th[scope="row"]{text-align:left;color:var(--ink-2);font-weight:500}
.fttabel td{color:var(--ink);font-variant-numeric:tabular-nums}
.ftvisueel-weg{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ftbron{margin:10px 18px 0;font-size:12px;line-height:1.5;color:var(--ink-3)}
.ftsegmenten{color:var(--ink-3)}
.ftskelet{margin:0 18px;height:470px;border-radius:12px;border:1px solid var(--line);background:var(--ft-diagram-bg);display:flex;align-items:center;justify-content:space-around;padding:30px 40px;box-sizing:border-box}
.ftskeletbalk{width:14px;height:60%;border-radius:3px;background:var(--seg-bg);animation:ftpuls 1.2s ease-in-out infinite}
.ftskeletbalk:nth-child(2){height:40%;animation-delay:.2s}
.ftskeletbalk:nth-child(3){height:25%;animation-delay:.4s}
@keyframes ftpuls{0%,100%{opacity:.35}50%{opacity:.8}}
@media (prefers-reduced-motion: reduce){.ftskeletbalk{animation:none}.ftsvg .ftknoop,.ftsvg .ftstroom{transition:none}}
.ftfout{margin:0 18px 8px;padding:14px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card-2);color:var(--ink-2);font-size:13.5px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.ftfout p{margin:0}
.ftpaneelslot{position:relative}
.ftpaneel{margin:10px 0 4px;padding:12px 14px 14px;border-radius:12px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink);box-shadow:var(--shadow)}
.ftpaneelkop{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.ftpaneelkop h4{margin:0;font-size:15px;line-height:1.3}
.ftsluit{flex:0 0 auto;width:32px;height:32px;font-size:20px;line-height:1}
.ftpaneelbody{font-size:13px;line-height:1.5}
.ftuitleg{margin:8px 0 6px;color:var(--ink)}
.ftduiding{margin:8px 0 0;color:var(--ink-2)}
.ftpaneelbedrag{margin:6px 0;font-size:16px}
.ftpaneelbedrag .ftjj{font-size:12px;color:var(--ink-3);margin-left:6px}
.ftburen{margin:8px 0 0}
.ftburen b{display:block;font-size:12px;color:var(--ink-3);margin-bottom:2px}
.ftburen ul{list-style:none;margin:0;padding:0}
.ftburen li{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-top:1px solid var(--line)}
.ftburen li span{color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.ftreeks{margin:8px 0 0}
.ftreekskop{display:block;font-size:12px;color:var(--ink-3);margin-bottom:4px}
.ftreeksrij{display:grid;grid-template-columns:minmax(58px,auto) 1fr auto auto;gap:8px;align-items:center;font-size:12px;padding:2px 0}
.ftreekslabel{color:var(--ink-2)}
.ftreeksbalkwrap{height:8px;background:var(--seg-bg);border-radius:4px;overflow:hidden}
.ftreeksbalk{display:block;height:100%;background:var(--ft-winst);border-radius:4px}
.ftreeksbalk.ftneg{background:var(--ft-kosten)}
.ftreekswaarde{font-variant-numeric:tabular-nums;color:var(--ink)}
.ftreeksjj{color:var(--ink-3);min-width:56px;text-align:right}
.ftrug{position:fixed;inset:0;background:color-mix(in srgb, var(--merk-navy) 55%, transparent);z-index:60}
.ftpaneel.ftsheet{position:fixed;left:0;right:0;bottom:0;z-index:61;margin:0;max-height:78vh;overflow-y:auto;border-radius:16px 16px 0 0;padding:14px 16px calc(16px + env(safe-area-inset-bottom));box-shadow:var(--shadow)}
.ftpaneel.ftsheet .ftsluit{width:44px;height:44px}
@media (max-width:639px){.ftdeel,.ftkaart .fthead{padding-left:14px;padding-right:14px}.ftbron,.ftskelet,.ftfout{margin-left:14px;margin-right:14px}.ftkoptekst{font-size:13.5px}.ftkopdash{display:none}.ftkoptekst span:last-child{display:block;color:var(--ink-2)}.ftkeuze .seg button{padding:8px 10px}}
@media (max-width:479px){.ftsvg .ftjj{display:none}.ftskelet{height:380px}.tkviewbar .seg{overflow-x:auto;overflow-y:hidden;justify-content:flex-start;scrollbar-width:none}.tkviewbar .seg::-webkit-scrollbar{display:none}.tkviewbar .seg button{flex:0 0 auto;white-space:nowrap;overflow:visible;text-overflow:clip}.tkviewbar{position:relative}.tkviewbar::before,.tkviewbar::after{content:"";position:absolute;top:11px;bottom:11px;width:30px;pointer-events:none;opacity:0;transition:opacity .15s}.tkviewbar::after{right:15px;border-radius:0 9px 9px 0;background:linear-gradient(to right, transparent, var(--seg-bg))}.tkviewbar::before{left:15px;border-radius:9px 0 0 9px;background:linear-gradient(to left, transparent, var(--seg-bg))}.tkviewbar.ftscrolt-r::after,.tkviewbar.ftscrolt-l::before{opacity:1}} /* H4 (tegenlezing): de tabbalk scrolt op een smal scherm met volle labels (geen ellipsis) en een vervaging als scroll-hint aan de kant waar nog een tab staat (klassen ftscrolt-l/ftscrolt-r op .tkviewbar, gezet door het blok naar de scrollstand); de ::before/::after liggen binnen de rand van de segmentkiezer (padding 10px 14px + 1px rand) */
/* ===== v25.58 FINANCIENTAB (einde) ===== */
/* v25.58 — TRIAGERELEASE2 */
/* v25.58 (TRIAGE-RELEASE-2): staart triage-release-2 - geen eigen stijlregels: het pakket raakt in de client alleen de tik zonder valuta (tikSchaal-omhulling), de kaartjestekst van de beheer-acties koers_doorgeven en type_aanpassen (beschrijfBeheer-omhulling) en de regel onder de prestatiegrafiek over posities buiten de lijn (bestaande klasse chartsub histsinds); de staart bestaat voor de vaste volgorde van de css-pins */
/* v25.58 — DOELPORTEFEUILLE */
/* v25.58 (DOEL-PORTEFEUILLE): staart doel-portefeuille - de portefeuillenaam voor de doelstrook van Jouw reis (klein en gedempt, dezelfde regel als het label; het label houdt zijn nowrap-ellipsis) en de uitlegregel onder het formulier in het reisvenster; alleen tokens, geen aanwijs-effect (oudere suites scannen elke latere staart) */
.reislbl .dpnaam{color:var(--ink-3);font-weight:600;letter-spacing:.01em}
.reismodal .dpuitleg{margin-top:8px;color:var(--ink-3)}
/* v25.58 — VERBERGKNOP */
/* v25.58 (VERBERG-KNOP): staart verberg-knop - de beheerder verbergt een bericht of antwoord voor iedereen behalve de schrijver (Rabi 17-9 avond). Alleen wat de beheerder ziet: de gedempte kaart (opacity, geen omlijning) met de kleine regel Verborgen door beheer, de knop Verberg/Toon achter de tijd van een antwoord in de Thread (32 px, 44 px in de sheet; het oog-icoon als lijn-svg) en de menuregel; alleen tokens, geen aanwijs-effect */
.vbkverborgen{opacity:.55}
.vbkverborgen.aimverborgen{outline:0}
.vbkregel{display:block;width:100%;box-sizing:border-box;margin:6px 0 0;padding:3px 8px;border-radius:8px;background:var(--card-2);color:var(--ink-3);font-size:12px;line-height:1.35;overflow-wrap:anywhere}
.vbkico{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.plusitem .plusemo .vbkico{width:20px;height:20px}
.cdndraadkop .vbkknop{appearance:none;border:0;background:transparent;flex:none;display:inline-flex;align-items:center;justify-content:center;align-self:center;width:32px;height:28px;margin:-6px 0 -6px auto;padding:0;border-radius:8px;color:var(--ink-3);cursor:pointer}
.cdndraadkop .vbkknop+.cawwis{margin-left:0}
.cdndraadkop .vbkknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px;color:var(--ink)}
.cdndraadkop .vbkknop[disabled]{opacity:.5;cursor:default}
.cdndraad.mobiel .cdndraadkop .vbkknop{width:44px;height:36px;margin:-8px 0 -8px auto}
.cdndraad.mobiel .cdndraadkop .vbkknop+.cawwis{margin-left:0}
/* v25.58 — NAZORGPH10 */
/* v25.58 (NAZORG-PH10): staart nazorg-ph10 - het zoekveld van de kanaalkop (COMMUNITY-DESIGN P-2) staat alleen in de kop als het op de eerste regel past: het blok meet de kop na elke bijwerking en zet data-nph10krap="1" als het veld zou wikkelen (de schok van 0,39 CLS bij een kanaalwissel op 1280 px); alleen een display-regel binnen dezelfde 1180-grens als P-2, geen kleur, geen aanwijs-effect */
/* ===== v25.58 NAZORGPH10 (begin) ===== */
@media (min-width:1180px){ body.cdnactief .cdnkopzoek[data-nph10krap="1"]{display:none} }
/* ===== v25.58 NAZORGPH10 (einde) ===== */
/* v25.58 — LIVEBLOGGEVOEL */
/* v25.58 (LIVEBLOG-GEVOEL): staart liveblog-gevoel (klasse lbg uit het clientblok; terugweg = oude opmaak) */
.nwstroom.lbg .lbkop{flex-wrap:wrap;row-gap:4px}
.nwstroom.lbg .lbglaatst{font-size:12px;font-weight:500;color:var(--ink-3);margin-left:2px}
.nwstroom.lbg .lbgklok{font-size:12px;font-weight:600;color:var(--ink-2);margin:0 8px 0 auto;font-variant-numeric:tabular-nums}
@media (max-width:639px){.nwstroom.lbg .lbgklok{display:none}.nwstroom.lbg .lbkop .nwlivetag{flex:none}}
.lbgmelding{display:none;position:sticky;top:8px;z-index:3;margin:0 auto 10px;padding:0 14px;height:32px;border:0;border-radius:999px;background:var(--accent);color:var(--accent-tekst);font:600 12.5px/32px "IBM Plex Sans",sans-serif;cursor:pointer}
.lbgmelding.aan{display:block}
.lbgstrook{display:flex;flex-wrap:wrap;gap:2px 4px;margin:0 0 12px;padding:0 0 8px;border-bottom:1px solid var(--line)}
.lbgidx{flex:none;display:inline-flex;align-items:baseline;gap:5px;padding:4px 6px;text-decoration:none;font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.lbgidx b{font:700 12px "Archivo",sans-serif;color:var(--ink)}
.lbgpct{font-weight:600}.lbgpct.up{color:var(--good-text)}.lbgpct.down{color:var(--bad-text)}.lbgpct.mut{color:var(--ink-3)}
.lbgkort{background:var(--stat-bg);border-radius:14px;padding:12px 14px;margin:0 0 14px}
.lbgkortkop,.lbgpaneelkop{display:block;font:700 11px "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin:0 0 6px}
.lbgkort ol{margin:0;padding-left:20px;font-size:14px;line-height:1.5}
.lbgkort li{margin:0 0 4px}.lbgkort li::marker{color:var(--accent);font-weight:700}
.lbgkort .lbgnaar{display:block;padding:0;text-align:left;color:var(--ink);text-decoration:none;font:inherit}
.nwstroom.lbg .lbdot{background:var(--card);border:2px solid var(--line-2);box-sizing:border-box}
.nwstroom.lbg .lblijst>:first-child .lbdot{background:var(--bad);border-color:var(--bad)}
.nwstroom.lbg time.lbtijd{display:inline-flex;align-items:baseline;gap:6px;color:var(--ink-3);font-weight:500;font-size:10.5px}
.nwstroom.lbg time.lbtijd::before{content:attr(data-klok);font:800 14px/1.1 "Archivo",sans-serif;color:var(--ink);letter-spacing:-.01em}
.nwstroom.lbg :is(.lbtekst,.lbart) .lblead{display:block;font:800 16px/1.3 "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink);margin:4px 0 6px}
.lbgstreep{display:none}
.nwstroom.lbg .lbtekst{font-size:14.5px;line-height:1.6}
.nwstroom.lbg .lbtekst .art47-chip{margin:0 2px}
.lbgchips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 0}.nwstroom.lbg .lbgchips .art47-chip{margin:0}
.nwstroom.lbg .lbembed.lbgkaart{background:transparent;border:0;border-radius:0;padding:0;margin:10px 0 4px}
.lbgkaart .cdnbijlage{border:1px solid var(--line);border-width:1px 0;border-radius:0;padding:12px 0;margin:8px 0 0;background:none}
.lbgkaart .cdn2wl{display:none}
.lbgpaneelkop{margin:10px 0 4px}
.lbgpaneel :is(.kqrijen,.kqvoet,.dqdelen,.dqnoot){display:none}
.lbgmeer{margin:4px 0 0;font-size:12.5px}.lbgmeer .nwlink{font-weight:600;color:var(--accent);text-decoration:none}
.lbgacties{margin-left:auto;display:inline-flex;gap:4px}
.lbgacties>*{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:1px solid var(--line);border-radius:8px;background:none;color:var(--ink-3);text-decoration:none;font:600 12px/1 sans-serif;cursor:pointer}
.lbgvers{animation:lbgvers 1.2s ease-out}
@keyframes lbgvers{0%{background:var(--accent-wash)}100%{background:none}}
@media (prefers-reduced-motion: reduce){.lbgvers{animation:none}}
.nwstroom.lbg .lbknop{border:0;background:none;color:var(--accent);font-weight:600;padding:8px 0}
@media (min-width:640px){.nwstroom.lbg .lblijst{padding-left:0}.nwstroom.lbg .lblijst::before{left:64px}.nwstroom.lbg :is(.lbitem,.lekal){padding-left:76px}.nwstroom.lbg :is(.lbitem,.lekal) .lbdot{left:60px;top:16px}.nwstroom.lbg .lbitem time.lbtijd{position:absolute;left:0;top:13px;width:56px;display:flex;flex-direction:column;gap:2px;line-height:1.3}.nwstroom.lbg .lbitem .lbmeta{min-height:18px}}
/* ===== v25.58 BEHEERSCROLL (begin) ===== */
/* v25.58 — BEHEERSCROLL */
/* v25.58 (BEHEER-SCROLL): staart beheer-scroll - springen naar een sectie of kaart op /beheer (tegel, Bekijk, Alle cijfers van ..., de verwijsregel naar de tabkiezer, Bekijk de cijfers op Eenvoudig, Voorbeeld bij een persbericht in de wachtrij) landde onder de plakkende kop van het beheerscherm (bevinding navigatie-2; blok v25.58 beheer-scroll). De secties (.b3sectie, .brsectie), de kaarten (.bhkaart, .b3kaart), de tabkiezer (.bktabs) en het persberichten-werkblad (.pbwerkblad; de zevende spring-aanroep pbwOpen, gevonden in de controle van het pakket) krijgen een scroll-margin-top van de gemeten kophoogte (--bhkop-h, door het blok met een ResizeObserver op de kop gezet) plus 8 px lucht; zonder meting geldt de vaste terugval per breekpunt: 140 px tot 479 px (de kop met de knop Uitgebreid op een tweede rij), 72 px daarboven. Alleen met de klasse .bhsaan op het beheerscherm (gezet door het blok): zonder het blok of op de terugweg blijft het oude gedrag byte-gelijk. Afwerking (navigatie-5, weerlegd maar onschadelijk): de keuzelijsten in de persberichten-werkbalk en de bulkbalk minstens 40 px hoog, zoals .bhknop. Geen kleur, geen id-selector, geen voorrangsvlag, geen aanwijs-effect, geen beweging, ASCII. */
.bhview{--bhkop-h:72px}
@media (max-width:479px){.bhview{--bhkop-h:140px}}
.bhview.bhsaan .b3sectie,.bhview.bhsaan .brsectie,.bhview.bhsaan .bhkaart,.bhview.bhsaan .b3kaart,.bhview.bhsaan .bktabs,.bhview.bhsaan .pbwerkblad{scroll-margin-top:calc(var(--bhkop-h,72px) + 8px)}
.bhview.bhsaan .pbwerkbalk select,.bhview.bhsaan .pbbulk select{min-height:40px}
/* ===== v25.58 BEHEERSCROLL (einde) ===== */
/* v25.58 — VASTGOED */
/* v25.58 (VASTGOED): staart vastgoed - de vastgoedpagina van een vastgoedslot (kaarten in PORTEFEUILLE-RUST met een chartnote, de knop Uitleg en een actieknop; twee kolommen vanaf 960 px), het tegelraster van de achtergrondkaart met het huisje als marker en de perceelgrens als svg, de leeftijdsstaafjes, de band-svg van de modelwaarde, de donut van de vermogensbalans, het overwaarde-kompas, de dekkingsbalk, de deelkaart (1080 x 1350, alleen percentages), de schuiven, de tegels en knoppen in de hero van een vastgoedslot, de klasse vgd-verborgen die de aandelenkaarten en de lege-staat-, broker-, import- en uploadingangen dicht zet zolang een vastgoedslot open staat, de tegel Vastgoed op beheer en de gedeelde klassen van de invoersheet (stappen, chips, betaalde knop, suggesties, velden, fout). Alleen thematokens en color-mix; aanwijs-effecten alleen in de media-query voor muisapparaten; tikdoelen minstens 40 px; 320 px bruikbaar; donker en licht via de tokens */
.vgd-pagina{margin:0 0 16px;min-width:0}
.vgd-kaarten{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
@media (min-width:960px){.vgd-kaarten{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:22px}}
.vgd-kaart{padding:0 0 10px;min-width:0;overflow:hidden}
.vgd-kaart .cardhead{padding:16px 18px 4px}
.vgd-kaartsub{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.vgd-body{padding:0 18px}
.vgd-kaart > .chartnote{margin:10px 18px 2px;line-height:1.45}
.vgd-kaart > .vgd-uitlegtekst{margin:6px 18px 2px;font-size:12px;line-height:1.5;color:var(--ink-2)}
.vgd-kaart.pfrdicht > .vgd-uitlegtekst{display:none}
.vgd-kaart .pfrknop{width:calc(100% - 36px);margin:8px 18px 0}
.vgd-acties{display:flex;flex-wrap:wrap;gap:8px;padding:10px 18px 4px}
.vgd-acties .btn{margin-top:0;flex:1 1 auto;min-height:44px;font-size:14px;padding:11px 14px;line-height:1.3}
.vgd-acties > .chartnote{flex-basis:100%;margin:0}
.vgd-knop-betaald:disabled{opacity:.55;cursor:default}
.vgd-knopnoot{margin:2px 0 0}
.vgd-gevaar{color:var(--bad-text);border-color:color-mix(in srgb, var(--bad) 45%, transparent)}
.vgd-rijen{display:flex;flex-direction:column;min-width:0}
.vgd-kaartrij{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:8px 0;border-top:1px solid var(--line);font-size:13px;align-items:baseline;min-width:0}
.vgd-rijen > .vgd-kaartrij:first-child{border-top:0}
.vgd-kaartrij > span{color:var(--ink-2);min-width:0;overflow-wrap:anywhere}
.vgd-kaartrij > b{font-variant-numeric:tabular-nums;text-align:right;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.vgd-kaartrij > small{grid-column:1 / -1;font-size:11.5px;color:var(--ink-3);line-height:1.4}
.vgd-groot{display:flex;flex-direction:column;gap:2px;padding:10px 0 6px}
.vgd-groot > b{font-family:"Archivo",sans-serif;font-size:26px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.15;overflow-wrap:anywhere}
.vgd-groot > span{font-size:12px;color:var(--ink-3);line-height:1.4}
.vgd-goed{color:var(--good-text)}
.vgd-slecht{color:var(--bad-text)}
.vgd-let{color:var(--bad-text)}
.vgd-leeg{font-size:13px;color:var(--ink-2);margin:8px 0;line-height:1.5}
.vgd-verhaal{font-size:13.5px;line-height:1.55;margin:10px 0 4px;color:var(--ink)}
.vgd-sectie{margin-top:12px;min-width:0}
.vgd-sectie > h4{margin:0 0 2px;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
.vgd-badge{display:inline-block;padding:2px 9px;border-radius:999px;background:var(--accent-wash);color:var(--accent);font-weight:700;font-size:12px;line-height:1.5}
.vgd-badge-groot{font-size:22px;padding:4px 14px}
.vgd-credits{margin:4px 2px 10px;line-height:1.45}
.vgd-meldingen{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
.vgd-melding{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;padding:10px 14px;border-radius:14px;background:var(--card-2);border:1px solid var(--line);font-size:13px;color:var(--ink);line-height:1.45}
.vgd-melding > span{flex:1 1 220px;min-width:0}
.vgd-melding .btn{margin:0;padding:8px 12px;font-size:12.5px;min-height:40px}
.vgd-kaartbeeld{margin:6px 0 8px}
.vgd-tegelraster{position:relative;display:grid;grid-template-columns:repeat(var(--vgd-kol,3),minmax(0,1fr));grid-template-rows:repeat(var(--vgd-rij,3),minmax(0,1fr));width:100%;overflow:hidden;border-radius:14px;background:var(--card-2);border:1px solid var(--line)}
.vgd-tegel{display:block;width:100%;height:100%;object-fit:cover;min-width:0;min-height:0}
.vgd-tegel-leeg{background:var(--card-2)}
.vgd-perceel{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.vgd-perceel polygon{fill:color-mix(in srgb, var(--accent) 18%, transparent);stroke:var(--accent);stroke-width:2;vector-effect:non-scaling-stroke}
/* v25.58 (VASTGOED, integrator): de marker is de svg zelf (padding 7px + rand 2px = tekenvlak 20px) */
.vgd-marker{position:absolute;width:38px;height:38px;box-sizing:border-box;padding:7px;transform:translate(-50%,-50%);border-radius:50%;background:var(--card);border:2px solid var(--accent);color:var(--accent);stroke-width:2;box-shadow:0 4px 14px color-mix(in srgb, var(--ink) 35%, transparent)}
.vgd-melding-leeg span{color:var(--ink-3)}
.vgd-staven{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;align-items:end;height:96px;margin:8px 0 4px}
.vgd-staaf{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:2px;font-size:10.5px;color:var(--ink-3);min-width:0}
.vgd-staaf > i{display:block;width:100%;max-width:34px;background:var(--accent);border-radius:6px 6px 2px 2px;min-height:3px;flex:none}
.vgd-staaf > b{font-size:11px;color:var(--ink);font-variant-numeric:tabular-nums}
.vgd-band{width:100%;height:auto;display:block;margin:6px 0 2px}
.vgd-band-vlak{fill:var(--accent-wash);stroke:var(--accent);stroke-width:1}
.vgd-band-marker{stroke:var(--ink);stroke-width:3;stroke-linecap:round}
.vgd-band-tekst{fill:var(--ink-3);font-size:11px}
.vgd-modeluitleg{margin:4px 0}
.vgd-chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}
.vgd-chip{appearance:none;font:inherit;font-size:13px;font-weight:600;padding:9px 14px;min-height:40px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);cursor:pointer;line-height:1.2}
.vgd-chip[aria-pressed="true"]{background:var(--accent);color:var(--accent-tekst);border-color:var(--accent)}
.vgd-chip:disabled{opacity:.5;cursor:default}
.vgd-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.vgd-schuif{display:block;margin:10px 0 4px;text-transform:none;letter-spacing:0;font-size:13px;font-weight:500;color:var(--ink-2)}
.vgd-schuiflabel{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.vgd-schuiflabel b{color:var(--ink);font-variant-numeric:tabular-nums}
.vgd-schuif input[type=range]{width:100%;margin:6px 0 0;padding:0;border:none;background:transparent;accent-color:var(--accent);height:28px;min-width:0}
.vgd-schuif input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.vgd-watals{border-top:1px solid var(--line);padding-top:8px}
.vgd-balans{display:flex;gap:16px;align-items:center;margin:8px 0;min-width:0}
.vgd-donut{width:120px;height:120px;flex:none}
.vgd-legenda{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--ink-2);margin:6px 0 0}
.vgd-legenda-kolom{flex-direction:column;gap:6px}
.vgd-legenda-item{display:inline-flex;align-items:center;gap:6px;min-width:0}
.vgd-legenda-item > i{width:10px;height:10px;border-radius:3px;display:inline-block;flex:none}
.vgd-grafiek{margin:8px -6px 0}
.vgd-kompas{margin:14px 0 28px}
.vgd-kompas-baan{position:relative;height:14px;border-radius:7px;background:var(--card-2);border:1px solid var(--line)}
.vgd-kompas-baan > i{position:absolute;left:0;top:0;bottom:0;border-radius:7px;background:var(--accent)}
.vgd-kompas-streep{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--ink-3);transform:translateX(-1px)}
.vgd-kompas-streep > b{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:4px;font-size:10.5px;color:var(--ink-3);white-space:nowrap}
.vgd-dekking{height:10px;border-radius:5px;background:var(--card-2);border:1px solid var(--line);overflow:hidden;margin:10px 0 4px}
.vgd-dekking > i{display:block;height:100%;background:var(--good)}
.vgd-deelwrap{max-width:320px;margin:6px auto 4px}
.vgd-deel{width:100%;height:auto;display:block;border-radius:12px}
.vgd-deel-vlak{fill:var(--card-2);stroke:var(--line-2);stroke-width:2}
.vgd-deel-kop{fill:var(--ink-3);font-size:44px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.vgd-deel-label{fill:var(--ink-2);font-size:46px}
.vgd-deel-groot{fill:var(--ink);font-size:78px;font-weight:700;font-family:"Archivo",sans-serif}
.vgd-deel-voet{fill:var(--ink-3);font-size:32px}
.vgd-dakfoto{display:block;max-width:100%;border-radius:12px;margin:8px 0}
.vgd-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.vgd-stat{background:var(--stat-bg);border:1px solid var(--line);border-radius:14px;padding:12px 15px;display:flex;flex-direction:column;gap:3px;min-width:0}
.vgd-stat > span{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
.vgd-stat > b{font-family:"Archivo",sans-serif;font-size:17.5px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;font-weight:700;overflow-wrap:anywhere}
.vgd-stat > small{font-size:11px;color:var(--ink-3)}
.vgd-hero{margin-top:2px}
.vgd-pillen{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.vgd-pillen .pill{min-height:40px;display:inline-flex;align-items:center;cursor:pointer}
.vgd-verborgen .hero > :is(.statgrid,.deltas,.reis,.inlegrij,.compound,.herona,.herowarn,.mwrrreden,.stortinghint,.jaaruitleg,.pfrknop){display:none}
.vgd-verborgen .hero > .lbl:not(.vgd-hero-lbl){display:none}
.vgd-verborgen :is(.dashleeg,.emptycard,.importbanner,.inrichtcard,.pfcard,.alloccard,.histcard,.kostencard,.kostenimpact,.divcard,.agendacard,.skeletkaart,.compoundcard,.badgecard){display:none}
.vgd-inline{margin:10px 0 4px;display:flex;flex-direction:column;gap:6px}
.vgd-inline label{margin-top:2px}
.vgd-inlinerij{display:flex;gap:8px;align-items:stretch}
.vgd-inlinerij input{flex:1;min-width:0;width:auto;background:var(--input-bg);color:var(--ink);border:1px solid var(--line-2);border-radius:12px;padding:11px 14px;font:inherit;font-size:15px}
.vgd-inlinerij .btn{margin:0;padding:10px 14px;font-size:14px;min-height:44px;flex:none}
.vgd-veld{display:flex;flex-direction:column;gap:6px;min-width:0}
.vgd-veld label{margin-top:4px}
.vgd-fout{color:var(--bad-text);font-size:12.5px;margin:2px 0 0;line-height:1.4}
.vgd-fout[hidden]{display:none}
.vgd-hulp{color:var(--ink-3)}
.vgd-suggesties{list-style:none;margin:4px 0 0;padding:0;border:1px solid var(--line-2);border-radius:12px;background:var(--card);overflow:hidden}
.vgd-suggesties[hidden]{display:none}
.vgd-suggestie{padding:11px 14px;min-height:44px;display:flex;flex-direction:column;justify-content:center;gap:2px;border-top:1px solid var(--line);cursor:pointer;font-size:14px;color:var(--ink)}
.vgd-suggestie:first-child{border-top:0}
.vgd-suggestie[aria-selected="true"]{background:var(--accent-wash)}
.vgd-sheet .sheet{height:min(760px, 92svh);max-height:92svh}
.vgd-stap-kop{padding:12px 18px 0;display:flex;flex-direction:column;gap:6px}
.vgd-stap-kop > b{font-family:"Archivo",sans-serif;font-size:17px}
.vgd-stap{flex:1;min-height:0}
.vgd-sheet .pfform-btns{padding:10px 18px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.vgd-sheet .pfform-btns .btn{margin-top:0;min-height:44px}
.vgd-sheet .vgd-kaart{padding:12px 16px}
.vgd-sheet .vgd-kaart .btn{margin-top:10px}
.vgd-soort{margin-bottom:6px}
.vgd-knop-nieuw{margin-top:8px;width:100%}
.vgd-beheersectie{padding-bottom:0}
.vgd-tegel-beheer .vgd-sleutels li > b{font-weight:600}
.vgd-tegel-beheer .bhstat.let{border-color:var(--bad)}
.vgd-licht{outline:2px solid var(--accent);outline-offset:2px}
.vgd-skelet .vgd-leeg{color:var(--ink-3)}
/* v25.58 (VASTGOED, integrator): geen aanwijs-effecten in deze staart - de staart-scans van leegstaat3 E10, beheer-oma A9 en beheer-revamp A3 lezen elke latere staart tot het einde; chips, suggesties, spookknoppen en pillen tonen hun stand via aria-pressed, aria-selected, :disabled en focus-visible */
@media (max-width:360px){.vgd-stats{grid-template-columns:1fr} .vgd-balans{flex-direction:column;align-items:flex-start} .vgd-acties .btn{flex-basis:100%} .vgd-kaartrij{grid-template-columns:minmax(0,1fr)} .vgd-kaartrij > b{text-align:left}}
@media (prefers-reduced-motion:reduce){.vgd-licht{transition:none}}
/* v25.58 — STRAKSCHERM */
/* v25.58 (STRAK-SCHERM): staart strak-scherm (bugjacht mega-ronde 6, 18-9-2026; Rabi: "Alles moet clean. seo optimized, strak en snel zijn.") - alle regels onder html.ssk, gezet door het clientblok (terugweg = oude opmaak). strak-2 het meldingsbolletje op zijn eigen knop (.aibtn position:relative); strak-3 de zwevende plusknop boven de hintbalk zolang die zichtbaar is (body.sskhint en --ssk-hint-h uit het blok); strak-5 contrast in de lade (het token --ink-3 wijst daar naar --ink-2; de kop Beheer goud gemengd met inkt) en op de stat-tegels (--ink-3 gemengd met 25 procent inkt); strak-11 de liveblog-kop als kolom met de eyebrow als titel en een terugknop die niet krimpt; strak-14 de insluitknop op de titelregel, legenda of kpi eronder op smalle schermen (.sskembkop uit het blok); toegang-11 een pauzeknop op de koersstrook en stilstand bij toetsenbordfocus in de strookinhoud (.tapetrack:focus-within, niet de knop zelf: na een klik op de knop houdt die de focus en moet de strook wel lopen - nazorg na de controle). Alleen tokens, geen hexwaarde, geen id-selector. De eerste regel zet het merk --ssk-staart:1 waaraan het blok deze staart herkent; ontbreekt de staart (verouderde stylesheet), dan doet het blok niets. */
html.ssk{--ssk-staart:1}
html.ssk .aibtn{position:relative}
html.ssk body.sskhint .fab{bottom:calc(84px + var(--ssk-hint-h, 60px) + 12px + env(safe-area-inset-bottom))}
html.ssk .paneel .paneelvlak{--ink-3:var(--ink-2)}
html.ssk .paneel .paneelvlak .pgroep .pghint{opacity:1}
html.ssk .paneel .paneelvlak .pgroep.nlbeheer .pgkop span:first-child{color:color-mix(in srgb, var(--gold) 70%, var(--ink))}
html.ssk .stat .slbl,html.ssk .stat .stsub{color:color-mix(in srgb, var(--ink-3) 75%, var(--ink))}
html.ssk .nwlivekop .viewtitel{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
html.ssk .nwlivekop .terugknop{flex:none}
html.ssk .nwlivekop .viewtitel .eyebrow{font-family:"Archivo",sans-serif;font-size:18px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--ink);line-height:1.2}
html.ssk .nwlivekop .viewsub{font-size:12.5px;color:var(--ink-3)}
@media (max-width:639px){
  html.ssk .cardhead.sskembkop > .bandleg,html.ssk .cardhead.sskembkop > .divkpi{flex-basis:100%;order:3;min-width:0}
  html.ssk .cardhead.sskembkop > .embknop{order:2}
}
html.ssk .tape.sskmet{position:relative}
html.ssk .tape.sskmet > .tapetrack{padding-right:44px}
html.ssk .sskpauze{appearance:none;cursor:pointer;position:absolute;top:0;right:0;bottom:0;width:40px;margin:0;padding:0;border:0;border-left:1px solid var(--line);background:var(--ground);color:var(--ink-3);display:flex;align-items:center;justify-content:center}
html.ssk .sskpauze:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;color:var(--ink)}
html.ssk .sskico{display:block;width:10px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor;box-sizing:border-box}
html.ssk .sskpauze.stil .sskico{width:0;height:0;border-left:11px solid currentColor;border-right:0;border-top:6px solid transparent;border-bottom:6px solid transparent}
html.ssk .tape .tapetrack:focus-within .tapemove,html.ssk .newsbar:focus-within .newsmove{animation-play-state:paused}
html.sskstil .newsviewport{overflow-x:auto}
@media (prefers-reduced-motion: reduce){ html.ssk .sskpauze{display:none} html.ssk .tape.sskmet > .tapetrack{padding-right:14px} }
/* ===== v25.58 ALLESSTROOM (begin) ===== */
/* v25.58 — ALLESSTROOM */
/* v25.58 (ALLES-STROOM): staart alles-stroom - de kaart "Al je portefeuilles" in de stand Alle portefeuilles (blok v25.58 alles-stroom, direct onder de hero): de rand om het diagram (radius 12, kaartkleur, lijnkleur), de svg met de linten (kleur per rang via style op de groep, dikte = waarde), de knoopbalken en de Totaal-balk in de accentkleur, de knopen (naam 12,5 px, waarde Archivo 14 px, jaarchips 12 px, winst en per jaar 12 px), het Totaal-vak (card-2, Archivo 800 18 px), de lege-regel en de noot; breed = grid met de knopen links en het Totaal rechts (beide op rij 1, het Totaal staat voor de knopen in de DOM), smal = het Totaal bovenaan (twee kolommen: bedrag links, winst/rendement rechts), de knopen eronder met de stam rechts naar beneden, het oudste van drie hele jaren verborgen (.apfoud); beweging alleen hier: de streepjes langs de middenlijn (apfloop, paused buiten beeld en bij een verborgen tab) en de openingsanimatie (apfopen/apfopenv/apffade), stil bij prefers-reduced-motion. Alleen thema-tokens en color-mix, geen hex, geen id-selector, geen voorrangsvlag, geen aanwijs-effect; alle tekst 12 px of groter. Familie van SECTORSTROOM (dezelfde getallen: 7 17, -24, 2,6 s, .7 s, .5 s). Nazorg na de tegenlezing (hersteller 18-9): het Totaal boven op smal (rij 1 in het grid, de knopen op rij 2), .apfoud, .apftl/.apftr, compactere knopen; de dode regel .apfknoop[aria-pressed] is weg. */
:root{--apf-totaal:var(--accent);--apf-diagram-bg:var(--card);--apf-lint:.78;--apf-stroom:.30}
:root[data-theme="light"]{--apf-totaal:var(--accent);--apf-diagram-bg:var(--card);--apf-lint:.82;--apf-stroom:.34}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--apf-totaal:var(--accent);--apf-diagram-bg:var(--card);--apf-lint:.82;--apf-stroom:.34}}
.apfkaart[hidden]{display:none}
.apfkaart .cardhead{padding-bottom:4px}
.apfkpi{font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.apfvak{padding:8px 14px 6px}
.apfrand{position:relative;display:grid;gap:12px;border-radius:12px;background:var(--apf-diagram-bg);border:1px solid var(--line);padding:10px;overflow:hidden}
.apfrand.apfbreed{grid-template-columns:minmax(220px,50%) minmax(72px,1fr) 148px;align-items:center;gap:0}
.apfrand.apfbreed .apfknopen{grid-column:1;grid-row:1}
.apfrand.apfbreed .apftotaal{grid-column:3;grid-row:1}
.apfvak.apfsmal .apftotaal{grid-row:1}
.apfvak.apfsmal .apfknopen{grid-row:2}
.apflinten{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.apflinten .apflint{opacity:var(--apf-lint)}
.apflinten .apfbalk{opacity:1}
.apflinten .apftotaalbalk{fill:var(--apf-totaal)}
.apflinten .apfbeweeg{fill:none;stroke:var(--apf-diagram-bg);stroke-opacity:var(--apf-stroom);stroke-dasharray:7 17;animation:apfloop 2.6s linear infinite;animation-play-state:paused}
.apfvak.apfactief .apfbeweeg{animation-play-state:running}
.apfvak.apfverborgen .apfbeweeg{animation-play-state:paused}
@keyframes apfloop{to{stroke-dashoffset:-24}}
.apfknopen{position:relative;display:grid;gap:8px;min-width:0}
.apfvak.apfsmal .apfknopen{margin-right:var(--apf-trunk,84px)}
.apfknoop{appearance:none;font:inherit;color:var(--ink);text-align:left;cursor:pointer;display:grid;gap:4px;min-width:0;padding:8px 10px;border-radius:12px;border:1px solid var(--line);background:var(--stat-bg);border-left:3px solid var(--apf-kleur,var(--accent))}
.apfknoop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.apfrij1{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 8px;min-width:0}
.apfnaam{font-size:12.5px;font-weight:700;min-width:0;overflow-wrap:anywhere}
.apfwaarde{font-family:"Archivo",sans-serif;font-weight:700;font-size:14px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.apfjaren{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12px;font-variant-numeric:tabular-nums}
.apfvak.apfsmal .apfjaar.apfoud{display:none}
.apfjaar{display:inline-flex;gap:4px;align-items:baseline;white-space:nowrap}
.apfjaar small{font-size:12px;color:var(--ink-3)}
.apfjaar b{font-weight:700}
.apfjaar.up b{color:var(--good-text)}
.apfjaar.down b{color:var(--bad-text)}
.apfjaar.unk b{color:var(--ink-3);font-weight:600}
.apfrij3{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 8px;font-size:12px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.apfwinst.up{color:var(--good-text)}
.apfwinst.down{color:var(--bad-text)}
.apfwinst.unk,.apfmwrr.unk{color:var(--ink-3)}
.apfmwrr b{font-weight:700}
.apfmwrr b.up{color:var(--good-text)}
.apfmwrr b.down{color:var(--bad-text)}
.apfsub{font-size:12px;color:var(--ink-3)}
.apftotaal{position:relative;display:grid;gap:4px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-2);background:var(--card-2);min-width:0}
.apftl,.apftr{display:contents}
.apfvak.apfsmal .apftotaal{grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:12px;padding:10px 12px 12px}
.apfvak.apfsmal .apftl,.apfvak.apfsmal .apftr{display:grid;gap:3px;min-width:0}
.apfvak.apfsmal .apftr{padding-top:2px;text-align:right}
.apfkop{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.apfbig{font-family:"Archivo",sans-serif;font-weight:800;font-size:18px;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.2;overflow-wrap:anywhere}
.apftotaal .apfwinst,.apftotaal .apfmwrr{font-size:12px;color:var(--ink-2)}
.apfleeg{margin:8px 0 0;font-size:12px;color:var(--ink-3)}
.apfleeg[hidden]{display:none}
.apfnoot{margin:8px 0 2px;font-size:12px;line-height:1.5;color:var(--ink-3)}
.apfvak.apfopen .apflinten{animation:apfopen .7s ease-out both}
.apfvak.apfopen.apfsmal .apflinten{animation-name:apfopenv}
.apfvak.apfopen .apfknopen,.apfvak.apfopen .apftotaal{animation:apffade .5s .3s ease-out both}
@keyframes apfopen{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes apfopenv{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes apffade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion: reduce){.apflinten .apfbeweeg{animation:none;display:none}.apfvak.apfopen .apflinten,.apfvak.apfopen.apfsmal .apflinten,.apfvak.apfopen .apfknopen,.apfvak.apfopen .apftotaal{animation:none}}
/* ===== v25.58 ALLESSTROOM (einde) ===== */
/* ===== v25.58 VASTGOED-2 (begin) ===== */
/* v25.58 — VASTGOED2 */
/* v25.58 (VASTGOED-2, integrator): staartmarker toegevoegd, zoals BEHEERSCROLL (begin-marker, dan de gewone staartmarker) - de staart VASTGOED-2 staat sinds de merge met main na STRAKSCHERM; met deze marker eindigt de staart STRAKSCHERM (pubStaart: tot de volgende v25.5x-marker) weer bij zijn eigen html.ssk-regels; inhoud ongewijzigd */
/* v25.58 (VASTGOED-2, bouwer client): staart bij het blok v25.58 vastgoed-2 - de voortgangsregel van de automatische ronde (rustige stip, stil bij prefers-reduced-motion), de regel "Gegevens opgehaald op", de chip "uit het Kadaster", de eerlijke foutzin per onderdeel, de schermafdrukknop met plakhint en melding, de accent-wash op een uitgelezen veld (1,2 s, zonder beweging bij reduced-motion), de compleet-regel in de stap Meetellen en de kaart "Nog niet compleet" op de pagina, de knop zonder credits (vgd-knop-ophalen, dezelfde stand-weergave als de betaalde knop) en de extra regels op de tegel Vastgoed van beheer. Alleen thematokens en color-mix; geen aanwijs-effecten (de staart-scans van leegstaat3 E10, beheer-oma A9 en beheer-revamp A3 lezen elke latere staart); tikdoelen minstens 40 px; 320 px bruikbaar; donker en licht via de tokens */
.vg2-voortgang{display:flex;align-items:center;gap:8px;margin:2px 0 0;color:var(--ink-3);font-size:13px;line-height:1.45}
.vg2-voortgang.vg2-klaar{color:var(--ink-2)}
.vg2-stip{flex:none;width:8px;height:8px;border-radius:50%;background:var(--accent);animation:vg2-adem 1.6s ease-in-out infinite}
@keyframes vg2-adem{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1)}}
.vg2-opgehaald{margin-top:6px}
.vg2-vooraf{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:4px 0 0;color:var(--ink-3);font-size:12.5px;line-height:1.45}
.vg2-chip{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;background:var(--accent-wash);color:var(--accent);font-size:12px;font-weight:600;line-height:1.5;white-space:nowrap}
.vg2-fout{color:var(--bad-text);margin:6px 0 0;line-height:1.45}
.vg2-scherm{display:flex;flex-direction:column;gap:6px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.vg2-scherm .vg2-scherm-knop{margin:0;min-height:44px;align-self:flex-start;max-width:100%}
.vg2-scherm .vg2-scherm-knop:disabled{opacity:.55;cursor:default}
.vg2-plakhint{margin:0;font-size:12.5px;line-height:1.45}
.vg2-scherm-melding{margin:0;line-height:1.45}
.vg2-scherm-melding.vg2-scherm-ok{color:var(--good-text)}
.vg2-scherm-melding[hidden]{display:none}
.vg2-uitgelezen{background:color-mix(in srgb, var(--accent) 16%, var(--input-bg));animation:vg2-wash 1.2s ease-out forwards}
@keyframes vg2-wash{from{background:color-mix(in srgb, var(--accent) 28%, var(--input-bg))}to{background:var(--input-bg)}}
.vg2-compleet{display:flex;flex-direction:column;gap:6px;margin:0 0 12px;padding:12px 14px;border:1px solid var(--line-2);border-radius:14px;background:var(--card-2)}
.vg2-compleet > p{margin:0}
.vg2-compleet .btn{margin:4px 0 0;min-height:44px;align-self:flex-start}
.vg2-compleet-ok{margin:0 0 12px;color:var(--good-text)}
.vg2-compleet-kaart .vg2-compleet-stap{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid var(--line);font-size:14px}
.vg2-compleet-kaart .vg2-compleet-stap:first-child{border-top:0}
.vg2-compleet-kaart .vg2-nog{color:var(--ink-3);font-weight:600}
.vgd-knop-ophalen:disabled{opacity:.55;cursor:default}
.vg2-beheer{display:flex;flex-direction:column;gap:6px;margin:8px 0 10px}
.vg2-beheer > p{margin:0}
.vg2-uitklap{border:1px solid var(--line);border-radius:12px;padding:8px 12px;background:var(--card-2)}
.vg2-uitklap > summary{cursor:pointer;font-weight:600;font-size:13px;min-height:24px;line-height:24px;color:var(--ink-2)}
.vg2-uitklap .vg2-beheer-lijst{margin:8px 0 0}
.vg2-uitklap .vg2-beheer-lijst li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px}
.vg2-feit{margin-top:8px}
@media (max-width:360px){.vg2-compleet-kaart .vg2-compleet-stap{flex-direction:column;gap:2px} .vg2-uitklap .vg2-beheer-lijst li{flex-direction:column;gap:2px}}
@media (prefers-reduced-motion:reduce){.vg2-stip{animation:none;opacity:1} .vg2-uitgelezen{animation:none;background:var(--input-bg);box-shadow:inset 0 0 0 2px var(--accent)}}
/* -- vastgoed-2: visualisatie -- */
/* v25.58 (VASTGOED-2, bouwer visualisatie): het deel van deze staart voor het blok v25.58 vastgoed-2-visualisatie - de vijf visualisaties van de vastgoedpagina (waardestroom, maandlastenstroom, waardeverloop, huurstroom, bandbreedte): de svg in de kaartbreedte, linten en knopen alleen in thematokens (accent, bad, good, bench-sp, ink-3, accent-wash, chart-grid), tekst minstens 12 px met tabular-nums, het paneel onder het diagram (card-2, radius 12), de legenda, de stroomstreepjes (2,6 s lineair oneindig) en de openingsbeweging (linten gieten via clip-path 700 ms ease-out, knopen faden 300 ms later); bij prefers-reduced-motion geen enkele animatie - het eindbeeld direct. Geen aanwijs-effecten (stand via aria-pressed en focus-visible); tikdoelen minstens 40 px; 320 px bruikbaar */
.vgdv-rand{margin:6px 0 0;min-width:0;overflow:hidden}
.vgdv-svg{display:block;width:100%;height:auto;max-width:100%;font-variant-numeric:tabular-nums;overflow:visible}
.vgdv-svg text{fill:var(--ink);font-size:12.5px}
.vgdv-svg .vgdv-kop{fill:var(--ink-3);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.vgdv-svg .vgdv-bedrag{fill:var(--ink);font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:18px;font-weight:800;letter-spacing:-.01em}
.vgdv-svg .vgdv-groot{fill:var(--ink);font-size:16px;font-weight:800}
.vgdv-svg .vgdv-lbl{fill:var(--ink);font-size:12.5px;font-weight:700}
.vgdv-svg .vgdv-sub{fill:var(--ink-2);font-size:12px}
.vgdv-svg .vgdv-groot .vgdv-sub{font-size:12.5px;font-weight:500;fill:var(--ink-3)}
.vgdv-svg .vgdv-as{fill:var(--ink-3);font-size:12px}
.vgdv-vlak{stroke:none}
.vgdv-k-accent{fill:var(--accent)} .vgdv-k-bad{fill:var(--bad)} .vgdv-k-good{fill:var(--good)} .vgdv-k-goud{fill:var(--bench-sp)} .vgdv-k-ink3{fill:var(--ink-3)} .vgdv-k-ink{fill:var(--ink)}
.vgdv-lint path.vgdv-vlak{opacity:.82}
.vgdv-lint path.vgdv-deel-0{opacity:.78} .vgdv-lint path.vgdv-deel-1{opacity:.62} .vgdv-lint path.vgdv-deel-2{opacity:.5}
.vgdv-loop{fill:none;stroke:var(--card);opacity:.3;stroke-dasharray:7 17;stroke-linecap:round;animation:vgdvloop 2.6s linear infinite}
@keyframes vgdvloop{to{stroke-dashoffset:-24}}
.vgdv-knoop{cursor:pointer;outline:none}
.vgdv-knoopvlak{fill:var(--card-2);stroke:var(--line);stroke-width:1}
.vgdv-bronvlak{fill:transparent;stroke:transparent;stroke-width:1.5}
.vgdv-knoop[aria-pressed="true"] .vgdv-bronvlak,.vgdv-knoop:focus-visible .vgdv-bronvlak{stroke:var(--accent)}
.vgdv-knoop[aria-pressed="true"] .vgdv-knoopvlak{stroke:var(--accent);stroke-width:1.5}
.vgdv-knoop:focus-visible .vgdv-knoopvlak,.vgdv-kolom:focus-visible{stroke:var(--accent);stroke-width:2}
.vgdv-band{fill:var(--accent-wash);stroke:var(--accent-lijn);stroke-width:1}
.vgdv-bandstreep{stroke:var(--ink);stroke-width:2.5;stroke-linecap:round}
.vgdv-bandgroep{cursor:default}
.vgdv-raster{stroke:var(--chart-grid-2);stroke-width:1}
.vgdv-as-lijn{stroke:var(--chart-grid);stroke-width:1}
.vgdv-vandaag{stroke:var(--chart-grid);stroke-width:1;stroke-dasharray:2 4}
.vgdv-lijn{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.vgdv-l-goud{stroke:var(--bench-sp)} .vgdv-l-accent{stroke:var(--accent)} .vgdv-l-bad{stroke:var(--bad)}
.vgdv-stippel{stroke-dasharray:4 5;stroke-width:2}
.vgdv-punt{stroke:var(--card);stroke-width:1.5}
.vgdv-ruit{stroke:var(--card);stroke-width:1.5}
.vgdv-kolom{fill:transparent;stroke:none;pointer-events:all;cursor:pointer;outline:none}
.vgdv-kolom[aria-pressed="true"]{fill:var(--accent-wash)}
.vgdv-lg{width:10px;height:10px;border-radius:3px;display:inline-block;flex:none}
.vgdv-lg-ink{background:var(--ink)} .vgdv-lg-goud{background:var(--bench-sp)} .vgdv-lg-accent{background:var(--accent)} .vgdv-lg-bad{background:var(--bad)} .vgdv-lg-band{background:var(--accent-wash);border:1px solid var(--accent-lijn)}
.vgdv-legenda{margin-top:4px}
.vgdv-paneel{margin:10px 0 2px;padding:10px 14px 12px;border-radius:12px;background:var(--card-2);border:1px solid var(--line)}
.vgdv-paneel[hidden]{display:none}
.vgdv-paneelkop{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:32px}
.vgdv-paneeltitel{font-size:13px;color:var(--ink)}
.vgdv-sluit{appearance:none;font:inherit;font-size:20px;line-height:1;width:40px;height:40px;margin:-4px -10px -4px 0;border:0;border-radius:10px;background:transparent;color:var(--ink-2);cursor:pointer}
.vgdv-sluit:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.vgdv-info[hidden]{display:none}
.vgdv-netto,.vgdv-tellers .chartsub{margin:8px 0 0;line-height:1.5}
.vgdv-netto b,.vgdv-tellers b{color:var(--ink);font-variant-numeric:tabular-nums}
.vgdv-bandlabel{margin:2px 0 6px}
.vgdv-leeg{margin:10px 0}
.vgdv-svg.vgdv-wacht .vgdv-lint{clip-path:inset(0 100% 0 0)}
.vgdv-svg.vgdv-wacht.vgdv-smal .vgdv-lint{clip-path:inset(0 0 100% 0)}
.vgdv-svg.vgdv-wacht .vgdv-knoop{opacity:0}
.vgdv-svg.vgdv-speelt .vgdv-lint{animation:vgdv-giet .7s cubic-bezier(.2,.8,.2,1) both}
.vgdv-svg.vgdv-speelt.vgdv-smal .vgdv-lint{animation-name:vgdv-giet-omlaag}
.vgdv-svg.vgdv-speelt.vgdv-verloop .vgdv-lint{animation-duration:.9s}
.vgdv-svg.vgdv-speelt .vgdv-knoop{animation:vgdv-fade .3s ease-out .3s both}
@keyframes vgdv-giet{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes vgdv-giet-omlaag{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes vgdv-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.vgdv-loop{animation:none;display:none} .vgdv-svg.vgdv-wacht .vgdv-lint,.vgdv-svg.vgdv-wacht.vgdv-smal .vgdv-lint,.vgdv-svg.vgdv-speelt .vgdv-lint,.vgdv-svg.vgdv-speelt.vgdv-smal .vgdv-lint,.vgdv-svg.vgdv-speelt.vgdv-verloop .vgdv-lint{animation:none;clip-path:none} .vgdv-svg.vgdv-wacht .vgdv-knoop,.vgdv-svg.vgdv-speelt .vgdv-knoop{animation:none;opacity:1}}
/* ===== v25.58 VASTGOED-2 (einde) ===== */
/* v25.58 — FINANCIENMOBIEL */
/* v25.58 (FINANCIEN-MOBIEL): staart financien-mobiel - de tab Financien op een smalle kaart (blok v25.58 financien-mobiel, kaartbreedte tot en met 600 px): de verticale svg (eigen klasse fmosvg naast ftsvg zodat de bestaande kleur-, dim- en focusregels van FINANCIENTAB blijven gelden; min-width 0 zodat niets scrolt), het label in de balk in de kaartkleur (leest op groen, rood en grijs in beide thema's), de genummerde chip op een te smalle balk, de legenda onder de svg (nummer of kleurvlekje, naam, j/j en marge, bedrag; aanklikbaar zoals een knoop) en de tabel met wikkelende postnamen. Alleen bestaande tokens (--ft-*, --card, --card-2, --line, --line-2, --ink, --ink-3, --accent), geen hex, geen rgb, geen aanwijs-effect, geen id-selector; boven 600 px komt geen enkele fmo-klasse in de DOM voor, dus daar verandert niets. Nazorg na de tegenlezing (18-9): de j/j-regel in de legenda mag afbreken (white-space normal: op 360-399 px stond hij over het bedrag heen), en de kaart draagt op een smalle breedte de klasse fmokaart, waarmee de periodekeuze (.ftkeuze uit FINANCIENTAB, daar byte-gelijk gelaten) binnen de kaart blijft (min-width 0, volle breedte) en de knoppen wikkelen in plaats van buiten de kaartrand te steken. */
.ftsvg.fmosvg{min-width:0;width:100%;height:auto;font:12px "IBM Plex Sans",sans-serif}
.fmosvg .fmobinnen{fill:var(--card);font-weight:700;font-size:12px;pointer-events:none}
.fmosvg .fmobinnen .fmobedrag{font-weight:500}
.fmosvg .fmochip{fill:var(--card);pointer-events:none}
.fmosvg .fmochipnr{fill:var(--ink);font-weight:700;font-size:11px;text-anchor:middle;pointer-events:none}
.fmolegenda{list-style:none;margin:6px 4px 2px;padding:0;display:block}
.fmolegenda .fmolegrij{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:8px;align-items:center;font-size:12.5px;line-height:1.3;padding:5px 0;border-top:1px solid var(--line);color:var(--ink);cursor:pointer}
.fmolegenda .fmolegrij:first-child{border-top:0}
.fmolegenda .fmolegrij:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.fmolegenda .fmolegrij[aria-expanded="true"] .fmonaam{color:var(--accent)}
.fmolegenda .fmonr{width:20px;height:20px;border-radius:50%;background:var(--card-2);border:1px solid var(--line-2);display:inline-grid;place-items:center;font-size:11px;font-weight:700;color:var(--ink);justify-self:center}
.fmolegenda .fmovlek{width:10px;height:10px;border-radius:3px;background:var(--ft-neutraal);justify-self:center}
.fmolegenda .fmovlek.winst{background:var(--ft-winst)}
.fmolegenda .fmovlek.kosten{background:var(--ft-kosten)}
.fmolegenda .fmonaam{min-width:0;overflow-wrap:anywhere}
.fmolegenda .fmojj{font-size:11px;color:var(--ink-3);margin-left:6px;white-space:normal}
.fmolegenda .fmowaarde{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}
.fttabel.fmotabel th[scope="row"]{white-space:normal;overflow-wrap:anywhere;line-height:1.3;padding-right:4px}
.fttabel.fmotabel td{padding-left:6px;padding-right:6px}
@media (max-width:359px){.fmolegenda .fmolegrij{font-size:12px}.fmolegenda .fmojj{display:block;margin-left:0}}
.fmokaart .ftkeuze{min-width:0;flex:1 1 100%;max-width:100%}
.fmokaart .ftkeuze .seg{flex-wrap:wrap;overflow-x:visible;max-width:100%}
/* v25.58 — SECTORSTROOM */
/* v25.58 (SECTOR-STROOM): staart sector-stroom - de kaart Verdeling > Sectoren in de stand Stroom (blok v25.58 sector-stroom): de rij Weergave (Stroom | Lijst, de bestaande .seg), het vak met de rand om het diagram (radius 12, kaartkleur, lijnkleur), de svg (12 px, eigen klassen sst*, nooit de oude .ftlabel-klasse), de kluisbalk in de accentkleur, de knopen en labels, de linten (direct vol, via ETF gearceerd met een pattern in de kaartkleur), de bewegende streepjes langs de middenlijn (animation-play-state: paused; running alleen met .sstactief van de IntersectionObserver en zonder .sstverborgen van visibilitychange), de openingsanimatie (linten gieten met clip-path, labels faden) alleen met .sstopen, alles stil bij prefers-reduced-motion; het paneel onder het diagram (card-2, radius 12, line-2), de noot en de kaartklasse .sststroom die de donutrij, de Overig-uitklap en de Cash-voet van de Lijst verbergt (de Lijst zelf blijft byte-gelijk). Tokens per thema uitsluitend uit de huisstijl (geen hex, geen rgb, geen id-selector, geen aanwijs-effect): --accent, --ink/-2/-3, --card/-2, --line/-2. Nazorg na de tegenlezing (bevinding 4): de streepjes lopen een eindig aantal rondes (8 x 2,6 s, ongeveer 21 s) per tekening in plaats van oneindig - stroke-dashoffset wordt niet door de compositor geanimeerd en kostte in beeld continu hoofddraad-tijd; elke hertekening (tik op een sector of op de kluis, portefeuillewissel, tab) start ze opnieuw; het blok tekent ze alleen op linten van 8 px en dikker. */
:root{--sst-kluis:var(--accent);--sst-neutraal:var(--ink-3);--sst-diagram-bg:var(--card);--sst-lint:.78;--sst-lint-etf:.55}
:root[data-theme="light"]{--sst-kluis:var(--accent);--sst-neutraal:var(--ink-3);--sst-diagram-bg:var(--card);--sst-lint:.82;--sst-lint-etf:.6}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--sst-kluis:var(--accent);--sst-neutraal:var(--ink-3);--sst-diagram-bg:var(--card);--sst-lint:.82;--sst-lint-etf:.6}}
.alloccard.sststroom .donutrow,.alloccard.sststroom .lgsub,.alloccard.sststroom .alloccash{display:none}
.sstschakelrij{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:8px 18px 0}
.sstschakelrij[hidden]{display:none}
.sstschakellbl{font-size:12px;color:var(--ink-3)}
.sstschakel button{padding:5px 11px}
.sstvak{padding:10px 18px 4px}
.sstvak[hidden]{display:none}
.sstrand{border-radius:12px;background:var(--sst-diagram-bg);border:1px solid var(--line);padding:6px 4px;overflow:hidden}
.sstsvg{display:block;width:100%;height:auto;font:12px "IBM Plex Sans",sans-serif}
.sstsvg .sstkluis{fill:var(--sst-kluis);cursor:pointer}
.sstsvg .sstkop{fill:var(--ink-3);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.sstsvg .ssttotaal{fill:var(--ink);font:800 18px "Archivo",sans-serif;letter-spacing:-.01em}
.sstsvg .ssttotaalsub{fill:var(--ink-3);font-size:12px}
.sstsvg .sstlabelvlak{fill:var(--sst-diagram-bg);opacity:.82}
.sstsvg .sstnaam{fill:var(--ink);font-weight:700;font-size:12.5px}
.sstsvg .sstbedrag{fill:var(--ink-2);font-size:12px;font-variant-numeric:tabular-nums}
.sstsvg .sstetf{fill:var(--ink-3);font-size:12px}
.sstsvg .sstarcering{stroke:var(--sst-diagram-bg);stroke-width:2.2}
.sstsvg .sstlint{fill:none;stroke-linecap:butt;stroke-linejoin:round;opacity:var(--sst-lint);cursor:pointer}
.sstsvg .sstlint.etf{opacity:var(--sst-lint-etf)}
.sstsvg .sstlintvlak{stroke:none;fill-opacity:var(--sst-lint);cursor:pointer}
.sstsvg .sstlintvlak.etf{fill-opacity:var(--sst-lint-etf)}
.sstsvg .sstknoop{cursor:pointer}
.sstsvg .sstknoop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sstsvg .sstknoop.aan .sstbalk{stroke:var(--accent);stroke-width:2.5}
.sstsvg .ssthit{fill:transparent;pointer-events:all}
.sstsvg .sstlabels{pointer-events:none}
.sstsvg .sstbeweeg{fill:none;stroke:var(--sst-diagram-bg);stroke-opacity:.3;stroke-dasharray:7 17;pointer-events:none;animation:sstloop 2.6s linear 8;animation-play-state:paused}
.sstvak.sstactief .sstbeweeg{animation-play-state:running}
.sstvak.sstverborgen .sstbeweeg{animation-play-state:paused}
@keyframes sstloop{to{stroke-dashoffset:-24}}
.sstvak.sstopen .sstlinten{animation:sstopen .7s ease-out both}
.sstvak.sstopen.sstsmal .sstlinten{animation-name:sstopenv}
.sstvak.sstopen .sstknopen,.sstvak.sstopen .sstlabels{animation:sstfade .5s .3s ease-out both}
@keyframes sstopen{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes sstopenv{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes sstfade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion: reduce){.sstsvg .sstbeweeg{animation:none;display:none}.sstvak.sstopen .sstlinten,.sstvak.sstopen.sstsmal .sstlinten,.sstvak.sstopen .sstknopen,.sstvak.sstopen .sstlabels{animation:none}}
.sstnoot{margin:8px 0 2px;font-size:12px;line-height:1.5;color:var(--ink-3)}
.sstnoot:empty{display:none}
.sstuitleg{margin:6px 0 0}
.sstpaneel{margin:10px 0 6px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-2);background:var(--card-2);color:var(--ink)}
.sstpaneel[hidden]{display:none}
.sstpaneelkop{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.sstpaneelkop h4{margin:0;font-size:14.5px;line-height:1.3}
.sstpaneelkop h4 span{color:var(--ink-2);font-weight:500}
.sstsluit{appearance:none;border:0;background:transparent;color:var(--ink-3);font-size:20px;line-height:1;width:32px;height:32px;cursor:pointer;flex:0 0 auto;margin:-6px -8px 0 0}
.sstsluit:focus-visible{outline:2px solid var(--accent);border-radius:8px}
.sstposities{list-style:none;margin:8px 0 0;padding:0}
.sstposities li{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-top:1px solid var(--line);font-size:13px}
.sstposities li:first-child{border-top:0}
.sstposities .sstpos{min-width:0}
.sstposities .sstpos small{display:block;color:var(--ink-3);font-size:12px}
.sstposities .sstbedragen{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink)}
.sstposities .sstbedragen small{display:block;color:var(--ink-3);font-size:12px}
.sstetfmerk{display:inline-block;padding:0 6px;border-radius:999px;border:1px solid var(--line-2);font-size:10.5px;color:var(--ink-2);margin-left:6px;vertical-align:1px}
/* ===== v25.58 LASTEN-AUTOMATISCH (begin) ===== */
/* v25.58 — LASTENAUTOMATISCH */
/* v25.58 (LASTEN-AUTOMATISCH, bouwer): staart lasten-automatisch - stap 5 als kaarten, velden achter Pas aan; alleen tokens */
.la{display:flex;flex-direction:column;gap:12px;min-width:0}
.la-kaart{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--line);border-radius:20px;background:var(--card-2);min-width:0}
.la-kop{margin:0 0 4px;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
.la-rij{display:flex;align-items:baseline;gap:8px;min-height:30px;font-size:14px;color:var(--ink);min-width:0}
.la-naam{flex:1;min-width:0;color:var(--ink-2);overflow-wrap:anywhere}
.la-bedrag{font-family:"Archivo",sans-serif;font-size:17px;font-variant-numeric:tabular-nums}
.la-bedrag.la-leeg{color:var(--ink-3);font-weight:400}
.la-per,.la-herkomst{font-size:12px;color:var(--ink-3)}
.la-bron{display:block;margin:2px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-2)}
.la-bron .vg2-chip,.la-bron .vg2-stip{display:inline-block;vertical-align:middle;margin-right:6px}
.la-rij+.la-bron{margin-top:6px;padding-top:8px;border-top:1px solid var(--line)}
.la-bronnen summary{cursor:pointer;min-height:40px;display:flex;align-items:center;font-size:13px;font-weight:600;color:var(--ink-3);list-style:none} /* v25.58 (VASTGOED-ZONDER-HANDWERK, integrator): ontwerpsysteem - was color:var(--accent); de stille handeling is grijs, focus blijft accent */
.la-bronnen ul{margin:0;padding:0 0 0 18px}
.la-bronnen li{font-size:12.5px;line-height:1.45;color:var(--ink-2);margin:4px 0}
.la-tekstknop{appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--ink-3);background:transparent;border:0;padding:8px 4px;min-height:40px;align-self:flex-end;border-radius:8px} /* v25.58 (VASTGOED-ZONDER-HANDWERK, integrator): ontwerpsysteem - was color:var(--accent); Klopt niet? Pas aan is een stille handeling in --ink-3 zoals .zh-tekstknop */
.la-tekstknop:focus-visible,.la-bronnen summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.la-velden[hidden]{display:none}
.la-knoprij{display:flex;align-items:center;gap:10px;margin-top:4px}
.la-knoprij .btn{margin:0}
/* ===== v25.58 LASTEN-AUTOMATISCH (einde) ===== */
/* ===== v25.58 DEELOVERAL (begin) ===== */
/* v25.58 — DEELOVERAL */
/* v25.58 (DEEL-OVERAL): staart deel-overal (blok v25.58 deel-overal) - de knop "Delen in kanaal" als laatste in de kaartkop (rechts, klein, ghost; de kop houdt haar hoogte door de verticale minmarge; onder 640 px en in de volle Prestatie-kop alleen het icoon), de bestaande rechterinhoud van de kop blijft rechts (het tweede kind krijgt de automarge), het voorbeeld (onder 640 px lager) en de bedragenrij in het venster "Kaart delen", de voet van het venster blijft in beeld (sticky), de kaart in de chat (afbeelding, voet met titel, "Bekijk in de app"); alleen tokens, elke selector met het prefix deo */
.cardhead .deoknop,.fthead .deoknop,.ontdekkop .deoknop,.kalbalk .deoknop{margin-left:auto;flex:none}
.cardhead > .deoknop{margin-top:-6px;margin-bottom:-6px}
.cardhead.deokop > :nth-child(2){margin-left:auto} /* v25.58 (DEEL-OVERAL, integrator): was een :has-selector op de knop; nu de kopklasse deokop die het blok zet bij het invoegen van de knop en weghaalt met de knop (geen :has-selector in een v25.58-staart) */
.histcard .cardhead .deoknop span{display:none}
.histcard .cardhead .deoknop{padding:0 8px}
.deomodal .cdnmodalvoet{position:sticky;bottom:0;z-index:1}
.deovoorbeeld{border-radius:10px;border:1px solid var(--line);background:var(--ground);padding:8px;display:grid;gap:8px}
.deovoorbeeld img{display:block;width:100%;height:auto;max-height:220px;object-fit:contain;border-radius:6px;background:var(--card)}
.deobezig{margin:0;padding:24px 0;text-align:center;font-size:12.5px;color:var(--ink-3)}
.deovoorbeeldtekst{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--ink-3);min-width:0}
.deovoorbeeldtekst b{color:var(--ink);font-weight:600;min-width:0;overflow-wrap:anywhere}
.deovoorbeeldtekst span{flex:none;white-space:nowrap}
.deobedragrij{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:var(--card);border:1px solid var(--line);min-height:44px;cursor:pointer}
.deobedragrij b{font:600 13px/1.3 "IBM Plex Sans",sans-serif;text-transform:none;letter-spacing:0;color:var(--ink)}
.deohint{margin:6px 0 0;font-size:12px;color:var(--ink-3);line-height:1.5}
.deokaart{padding:0}
.deokaart img.deokaartimg{display:block;width:100%;height:auto;border-radius:10px 10px 0 0;cursor:zoom-in}
.deokaartvoet{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 12px}
.deokaartvoet .deotitel{min-width:0}
.deokaartvoet .deotitel b{display:block;font-weight:700;font-size:13px;overflow-wrap:anywhere}
.deokaartvoet .deotitel span{display:block;font-size:11.5px;color:var(--ink-3)}
.deobekijk{appearance:none;flex:none;height:30px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--accent);font:700 12px "IBM Plex Sans",sans-serif;white-space:nowrap;cursor:pointer}
.deobekijk:focus-visible,.deoknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:639px){.cardhead .deoknop span,.fthead .deoknop span,.ontdekkop .deoknop span,.kalbalk .deoknop span{display:none}.cardhead .deoknop,.fthead .deoknop,.ontdekkop .deoknop,.kalbalk .deoknop{padding:0 8px}.deovoorbeeld img{max-height:140px}}
@media (max-width:480px){.histcard .cardhead.deokop .presttwr{flex:1 1 auto;margin-left:0}.histcard .cardhead > .deoknop{height:28px;margin-top:-7px;margin-bottom:-7px}} /* v25.58 (DEEL-OVERAL, integrator): idem, de kopklasse deokop in plaats van een :has-selector */
/* ===== v25.58 DEELOVERAL (einde) ===== */
/* ===== v25.58 HYPOTHEEKSTROOM (begin) ===== */
/* v25.58 — HYPOTHEEKSTROOM */
/* v25.58 (HYPOTHEEK-STROOM, bouwer): staart hypotheek-stroom - stap 4 Hypotheek van de vastgoed-invoer (blok v25.58 hypotheek-stroom): een feitregel, een kaart met de ene knop Lees uit een schermafdruk, de keuzerij Geen hypotheek, de rij Zelf invullen; per leningdeel een kaart met een dichte stand (bedrag groot, feiten, maandlast, bronregel, Klopt niet? Pas aan) en een open stand (velden met de eenheid in het veld, etiketten aanname, Klaar); een rustige foutzin onder het veld (rand --bad, geen rode blokken); alleen tokens (geen hex, geen rgb), geen aanwijs-effecten, beweging alleen opacity en transform en stil bij prefers-reduced-motion; prefix hs. Hersteller R1 (tegenlezing en browsercontrole 18-9): de knopklasse hs-knop-klein (14 px, 44 px hoog, compact links) op de twee ghost-knoppen in de kaartenstand in plaats van de tekstklasse hs-klein, Klopt niet? Pas aan in --ink-2 (contrast boven 4,5:1), een 2 px accentring bij toetsenbordfocus op Klaar, Lees uit een schermafdruk en Nog een leningdeel, en de regel die bij een verkeerd bestand ook de hulpzin van trede 2 rood kleurde is weg (de melding draagt al .vgd-fout) */
.hs{display:flex;flex-direction:column;gap:12px;min-width:0}
.hs [hidden]{display:none}
.hs-eyebrow{margin:0;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
.hs-zin{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.hs-klein{margin:-4px 4px 0;font-size:12px;color:var(--ink-3)}
.hs-trede{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border:1px solid var(--line);border-radius:20px;background:var(--card-2);min-width:0}
.hs-trede .hs-knop{margin:6px 0 0;min-height:48px;width:100%}
.hs-trede.hs-klaar{padding:10px 14px;gap:4px;background:transparent}
.hs-trede.hs-klaar .hs-knop{width:auto;align-self:flex-start;min-height:44px;margin-top:2px}
.hs-trede.hs-klaar .hs-zin{color:var(--ink)}
.hs-t2.hs-sleep{border-color:var(--accent-lijn);background:var(--accent-wash)}
.hs-knoprij{display:flex;align-items:center;gap:10px;min-width:0}
.hs-knoprij .hs-stip{margin-top:6px}
.hs-melding{margin:0;line-height:1.45}
.hs-melding.vg2-scherm-ok{color:var(--good-text)}
.hs-keuze,.hs-rij{appearance:none;cursor:pointer;font:inherit;text-align:left;display:flex;align-items:center;gap:12px;min-height:48px;padding:10px 14px;border:1px solid var(--line);border-radius:16px;background:transparent;color:var(--ink);font-size:15px;font-weight:600;min-width:0}
.hs-rij{flex-wrap:wrap;gap:2px 12px}
.hs-rij b{font-weight:700}
.hs-rondje{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid var(--line-2)}
.hs-keuze[aria-pressed="true"]{border-color:var(--accent-lijn);background:var(--accent-wash)}
.hs-keuze[aria-pressed="true"] .hs-rondje{border-color:var(--accent);background:var(--accent);box-shadow:inset 0 0 0 4px var(--card)}
.hs-keuze.hs-onder{color:var(--ink-2);font-weight:500;min-height:44px}
.hs-keuze:focus-visible,.hs-rij:focus-visible,.hs-tekstknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hs-deel{margin:0;padding:16px 18px;border:1px solid var(--line);border-radius:20px;background:var(--card-2);display:flex;flex-direction:column;gap:10px;min-width:0}
.hs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hs-deel-kop{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 12px;margin-bottom:2px}
.hs-deel-kop b{font-family:"Archivo",sans-serif;font-size:15px}
.hs-sam{font-size:13px;color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:0;overflow-wrap:anywhere}
.hs-deel:not([data-hs-open]) .hs-sam{display:none}
.hs-deel-sam{display:flex;flex-direction:column;gap:4px;min-width:0}
.hs-deel[data-hs-open] .hs-deel-sam{display:none}
.hs-groot{margin:0;font-family:"Archivo",sans-serif;font-size:22px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.hs-feiten{margin:0;font-size:14px;line-height:1.45;color:var(--ink-2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.hs-maandlast{margin:4px 0 0;font-size:13.5px;color:var(--ink)}
.hs-maandlast b{font-weight:600;font-variant-numeric:tabular-nums}
.hs-bron{margin:0;font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.hs-pasaan{align-self:flex-end;margin-top:2px}
.hs-velden{display:flex;flex-direction:column;gap:10px;min-width:0}
.hs-label{display:block;margin:2px 4px 0;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.hs-optioneel{font-weight:500;color:var(--ink-3)}
.hs-tag{display:inline-block;margin-left:6px;padding:1px 7px;border:1px solid var(--line);border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);vertical-align:middle}
.hs-veld{display:flex;align-items:center;min-height:52px;border:1px solid var(--line-2);border-radius:14px;background:var(--input-bg);min-width:0;overflow:hidden}
.hs-veld input{flex:1;min-width:0;width:100%;border:0;background:transparent;color:var(--ink);font:inherit;font-size:17px;font-variant-numeric:tabular-nums;padding:13px 14px;outline:none}
.hs-veld .hs-eenheid+input{padding-left:4px}
.hs-eenheid{flex:none;padding:0 14px;font-size:14px;font-weight:600;color:var(--ink-3)}
.hs-veld:focus-within{outline:2px solid var(--accent);outline-offset:1px}
.hs-veld.hs-mis{border-color:var(--bad)}
.hs-deel .vgd-fout{margin:-2px 4px 0}
.hs-deel .vgd-chips{margin:0}
.hs-deel .vg2-uitgelezen{border-radius:8px}
.hs-deel .hs-groot.vg2-uitgelezen,.hs-deel .hs-feiten.vg2-uitgelezen{background:transparent;box-shadow:none;animation:hs-wash 1.2s ease-out forwards}
@keyframes hs-wash{from{background:var(--accent-wash)}to{background:transparent}}
.hs-2kol{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.hs-tekstknop{appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--ink-3);background:transparent;border:0;padding:8px 4px;min-height:40px;align-self:flex-end;border-radius:8px}
.hs-tekstknop.hs-pasaan{color:var(--ink-2)}
.hs-tekstknop:focus-visible{color:var(--accent)} /* v25.58 (VASTGOED-ZONDER-HANDWERK, integrator): ontwerpsysteem - erbij: de stille handeling kleurt accent bij toetsenbordfocus (de kleur --ink-3 stond er al sinds hersteller R1) */
.hs-voet{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:2px}
.hs-voet .hs-tekstknop{align-self:center}
.hs-klaarknop{min-height:44px;padding:0 18px;margin:0 0 0 auto}
.hs-bij{margin:0;min-height:48px;width:100%}
.hs-knop-klein{font-size:14px;min-height:44px;width:auto;align-self:flex-start;padding:0 16px;margin:0}
.hs-klaarknop:focus-visible,.hs-knop:focus-visible,.hs-bij:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hs .hs-feit{margin:0 4px}
.hs-in{animation:hs-in .2s ease-out both}
@keyframes hs-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (min-width:820px){.hs-2kol{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.hs-in{animation:none} .hs-deel .hs-groot.vg2-uitgelezen,.hs-deel .hs-feiten.vg2-uitgelezen{animation:none;background:transparent;box-shadow:none}}
/* ===== v25.58 HYPOTHEEKSTROOM (einde) ===== */
/* ===== v25.58 VASTGOED-DOELEN (begin) ===== */
/* v25.58 — VASTGOEDDOELEN */
/* v25.58 (VASTGOED-DOELEN, bouwer): staart vastgoed-doelen - de vastgoedpagina met twee doelen als ruggengraat (Rabi 18-9: "Het moet altijd toe werken qua doen naar hypotheek vrij en energie onafhankelijk huis", "Die hele gedeelte moet een serieuze look en feel overhaul krijgen"): het ontwerpsysteem op elke kaart van de pagina onder .vgd-pagina.zd (kaartkop 15 px Archivo 700, doel-etiket als eyebrow, groot cijfer 28 px 800 tabular, contextregel 13 px, feitregel 13,5 px, bronregel 12,5 px, de stille handeling Pas aan in --ink-3, 8 px-ritme), de vier bovenkaarten in twee kolommen zonder gaten (.zd-boven), de voortgangsbalken van de twee doelen, de drie instrumenten van Rente en aflossen met twee tegels, de twee tegels van Waarde, panelen achter Pas aan, de doelregel in de portefeuillelijst; alleen tokens, geen aanwijs-effecten, beweging alleen opacity, transform en clip-path (200, 180 en 700 ms), stil bij prefers-reduced-motion; prefix zd */
.vgd-pagina.zd .vgd-kaarten{gap:12px}
@media (min-width:960px){.vgd-pagina.zd .vgd-kaarten{column-gap:16px}}
.vgd-pagina.zd .vgd-kaart{padding:0 0 12px}
.vgd-pagina.zd .vgd-kaart .cardhead{align-items:flex-start;gap:4px 12px;padding:16px 18px 4px;min-height:24px}
.vgd-pagina.zd .vgd-kaart .cardhead > b{font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:15px;font-weight:700;line-height:1.3;color:var(--ink);letter-spacing:0}
.vgd-pagina.zd .vgd-kaartsub{flex-basis:100%;font-size:13px;line-height:1.45;color:var(--ink-2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.vgd-pagina.zd .vgd-groot{gap:2px;padding:8px 0 4px}
.vgd-pagina.zd .vgd-groot > b{font-size:28px;font-weight:800;line-height:1.1;letter-spacing:-.01em}
.vgd-pagina.zd .vgd-groot > span{font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.vgd-pagina.zd .vgd-kaartrij{font-size:13.5px;line-height:1.5}
.vgd-pagina.zd .vgd-kaartrij > b{font-weight:700}
.vgd-pagina.zd .vgd-kaartrij > small{font-size:12.5px}
.vgd-pagina.zd .vgd-kaart > .chartnote{margin:12px 18px 0;font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.vgd-pagina.zd .vgd-sectie{margin-top:12px}
.vgd-pagina.zd .vgd-acties{padding:12px 18px 0}
.vgd-pagina.zd .vgd-chip{min-height:44px}
.vgd-pagina.zd .vgd-schuif input[type=range]{height:44px;margin:2px 0 0;accent-color:var(--accent)}
.zd-doel{display:inline-flex;align-items:center;order:-1;flex-basis:100%;margin:0 0 2px;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);line-height:1.2}
.zd-tekstknop{appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--ink-3);background:transparent;border:0;padding:10px 4px;min-height:44px;border-radius:8px;text-align:left;line-height:1.2}
.zd-tekstknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px;color:var(--accent)}
.vgd-pagina.zd .cardhead .zd-tekstknop{flex:none;margin:-10px -4px -10px auto;order:0}
.vgd-pagina.zd .cardhead .zd-doel + b{max-width:calc(100% - 96px)}
.zd-boven{grid-column:1 / -1;display:flex;flex-direction:column;gap:12px;min-width:0}
.zd-boven-kol{display:flex;flex-direction:column;gap:12px;min-width:0}
@media (min-width:960px){.zd-boven{flex-direction:row;align-items:flex-start;gap:16px} .zd-boven-kol{flex:1 1 0;min-width:0}}
.zd-rand{margin:8px 0 0;min-width:0;overflow:hidden}
.zd-svg{display:block;width:100%;height:auto;max-width:100%;font-variant-numeric:tabular-nums;overflow:visible}
.zd-svg text{fill:var(--ink);font-size:12.5px}
.zd-svg .zd-kop{fill:var(--ink-3);font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
.zd-svg .zd-cijfer{fill:var(--ink);font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:18px;font-weight:800;letter-spacing:-.01em}
.zd-svg .zd-sub{fill:var(--ink-2);font-size:12px}
.zd-svg .zd-as{fill:var(--ink-3);font-size:12px}
.zd-baan{fill:var(--chart-grid)}
.zd-vol{fill:var(--accent)}
.zd-vol-2{fill:var(--accent-wash);stroke:var(--accent-lijn);stroke-width:1}
.zd-voorbeeld{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-dasharray:4 4}
.zd-tijdlijn{stroke:var(--line-2);stroke-width:2;stroke-linecap:round}
.zd-tijdvol{stroke:var(--accent);stroke-width:2;stroke-linecap:round}
.zd-stip{fill:var(--accent);stroke:var(--card);stroke-width:2}
.zd-stip-open{fill:var(--card);stroke:var(--accent);stroke-width:2}
.zd-stip-uit{fill:var(--ink-3);stroke:var(--card);stroke-width:2}
.zd-instrument{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);min-width:0}
.zd-instrument:first-child{margin-top:4px;padding-top:0;border-top:0}
.zd-instrument > h4,.zd-eyebrow{margin:0 0 4px;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);line-height:1.2}
.zd-deel{margin-top:8px;min-width:0}
.zd-deel + .zd-deel{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.zd-regel{margin:4px 0 0;font-size:13.5px;line-height:1.5;color:var(--ink-2);overflow-wrap:anywhere}
.zd-regel b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.zd-uitkomst{margin:4px 0 0;font-size:13.5px;line-height:1.5;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.zd-uitkomst b{font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:800}
.zd-aanname{margin:8px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-3);overflow-wrap:anywhere}
.zd-twee{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:8px;min-width:0}
@media (min-width:600px){.zd-twee{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}}
.zd-kol{display:flex;flex-direction:column;gap:4px;min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--stat-bg)}
.zd-kol > h5{margin:0;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);line-height:1.2}
.zd-kolgroot{margin:2px 0 0;font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:22px;font-weight:800;line-height:1.15;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--ink);overflow-wrap:anywhere}
.zd-kolgroot small{display:block;font-family:"IBM Plex Sans",sans-serif;font-size:12.5px;font-weight:400;letter-spacing:0;color:var(--ink-3);margin-top:2px;line-height:1.4}
.zd-kol .vgd-kaartrij{font-size:13px;padding:6px 0}
.zd-kol .vgd-band{margin:4px 0 2px}
.zd-chipsrij{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0}
.zd-chipsrij .vgd-chip{padding:8px 12px}
.zd-gedaan{display:flex;align-items:center;gap:12px;min-height:44px;margin:0;padding:4px 0;border-top:1px solid var(--line);font-size:13.5px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);line-height:1.5;cursor:pointer} /* v25.58 (VASTGOED-DOELEN, bouwer): + margin 0, gewicht 400, geen letterafstand, geen hoofdletters, kleur ink - de globale label-regel (r. 107: hoofdletters, ink-3) gold anders op deze rij */
.zd-gedaan:first-of-type{border-top:0}
.zd-gedaan input{appearance:none;flex:none;width:22px;height:22px;margin:0;border:2px solid var(--line-2);border-radius:7px;background:transparent;cursor:pointer;display:grid;place-items:center}
.zd-gedaan input:checked{background:var(--accent);border-color:var(--accent)}
.zd-gedaan input:checked::after{content:"";width:6px;height:11px;border:solid var(--accent-tekst);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.zd-gedaan input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.zd-gedaan > span{flex:1;min-width:0;color:var(--ink);overflow-wrap:anywhere}
.zd-gedaan > span small{display:block;font-size:12.5px;color:var(--ink-3)}
.zd-gedaan.zd-gedaan-aan > span{color:var(--ink-3);text-decoration:line-through;text-decoration-color:var(--line-2)}
.zd-paneel{display:flex;flex-direction:column;gap:10px;margin-top:4px;padding-top:12px;border-top:1px solid var(--line);min-width:0}
.zd-paneel[hidden]{display:none}
.zd-veld{display:flex;flex-direction:column;gap:4px;min-width:0}
.zd-veld > label{font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;margin-top:0;color:var(--ink-2)} /* v25.58 (VASTGOED-DOELEN, hersteller): + geen hoofdletters, geen letterafstand, geen marge - de globale label-regel (r. 107) zette de paneellabels anders in kapitalen */
.zd-veld > label small{font-weight:400;color:var(--ink-3)}
.zd-veld input,.zd-veld select{width:100%;min-width:0;background:var(--input-bg);color:var(--ink);border:1px solid var(--line-2);border-radius:12px;padding:11px 14px;font:inherit;font-size:17px;font-variant-numeric:tabular-nums;min-height:48px}
.zd-veld input:focus-visible,.zd-veld select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.zd-veld.zd-fout-veld input{border-color:var(--bad)}
.zd-veld .vgd-fout{margin:-4px 4px 0;font-size:12.5px;line-height:1.45;color:var(--bad-text)}
.zd-veldrij{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
@media (max-width:479px){.zd-veldrij{grid-template-columns:minmax(0,1fr)}}
.zd-paneelvoet{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:2px}
.zd-paneelvoet .btn{margin:0;min-height:44px;padding:11px 18px;font-size:14px;box-shadow:none}
.zd-paneelvoet .zd-tekstknop{margin-right:auto}
.zd-paneelfout{margin:0;font-size:12.5px;line-height:1.45;color:var(--bad-text)}
.vgd-pagina.zd .zd-voet{margin:4px 2px 0;font-size:12.5px;line-height:1.45;color:var(--ink-2)} /* v25.58 (VASTGOED-DOELEN, hersteller): ink-2 - de voet staat op de paginakleur, ink-3 haalde daar in licht geen 4,5:1 */
.zd-paneelintro{margin:0}
.pfrow-l .zd-doelen{display:block;margin:2px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:normal;overflow:visible;text-overflow:clip}
.pfrow-l .zd-doelen b{font-family:"IBM Plex Sans",sans-serif;font-size:12.5px;font-weight:600;color:var(--ink);white-space:normal;overflow:visible;text-overflow:clip}
.pfrow-l .zd-doelen i{font-style:normal;color:var(--ink-3)}
.zd-in{animation:zd-in .2s ease-out both}
.zd-vers{animation:zd-vers .18s ease-out both}
.zd-svg.zd-wacht .zd-lint{clip-path:inset(0 100% 0 0)}
.zd-svg.zd-speelt .zd-lint{animation:zd-giet .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes zd-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes zd-vers{from{opacity:.55}to{opacity:1}}
@keyframes zd-giet{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@media (prefers-reduced-motion:reduce){.zd-in,.zd-vers{animation:none} .zd-svg.zd-wacht .zd-lint,.zd-svg.zd-speelt .zd-lint{animation:none;clip-path:none}}
/* ===== v25.58 VASTGOED-DOELEN (einde) ===== */
/* ===== v25.58 VASTGOED-ZONDER-HANDWERK (begin) ===== */
/* v25.58 — ZONDERHANDWERK */
/* v25.58 (VASTGOED-ZONDER-HANDWERK, bouwer): staart vastgoed-zonder-handwerk - het scherm Je pand in de vastgoedsheet (Rabi 18-9: "Is teveel handwerk."): het adreskaartje met de ene knop, kaarten met kaartkop, een groot cijfer, een contextregel en een bronregel, de stille handeling Pas aan, panelen achter Pas aan, de HS- en LA-kaarten ingepast met afstammelingselectoren onder .zh-hs en .zh-la; alleen tokens, geen aanwijs-effecten, beweging alleen opacity en transform (200 en 180 ms), stil bij prefers-reduced-motion; prefix zh. Hersteller ronde 1 (19-9): de kleine tekst op het kaartvlak in --ink-2 (contrast op --card-2: bron, stille handeling, small, voetregel, Of-regel, bezig); onder .zh-hs en .zh-la dezelfde kleur voor HS en LA, de gedrukte keuzerij in toestand geen hypotheek weg, LA zonder streepjes en zonder per jaar per rij, de bronlinks 40 px; in het paneel Meetellen de compleet-zin van vg2 weg. Hersteller ronde 2 (19-9, beeld van de mockup die Rabi zag en de tegenlezing/browsercontrole ronde 2): de kaartkop .zh-h als etiket (10,5 px, hoofdletters, --ink-2, zoals .zh-eyebrow dat nu ook is: AA op het kaartvlak), de titel 17 px, de contextregel 500, het grote cijfer 22 px, LA's hulpzin in --ink-2, het scheidingsteken van de voetregel bij Ander adres, de voetknoppen compact rechts (.zh-voetknop) */
.zh{display:flex;flex-direction:column;gap:12px;min-width:0;padding:4px 0 8px}
.zh-kop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}
.zh-kop-tekst{display:flex;flex-direction:column;gap:2px;min-width:0}
.zh-eyebrow{margin:0;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.zh-titel{margin:0;font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.2;color:var(--ink);overflow-wrap:anywhere}
.zh-context{margin:0;font-size:13px;font-weight:500;line-height:1.45;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* v25.58 (VASTGOED-NAZORG-2): de contextregel onder Je pand (adres, soort, eigendomsdeel) op een regel met ellipsis, zoals de mockup; was: overflow-wrap:anywhere (brak op 390 px in twee regels) */
.zh-kaart{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border:1px solid var(--line);border-radius:20px;background:var(--card-2);min-width:0}
.zh-vraag{border-color:var(--accent-lijn);background:var(--accent-wash)}
.zh-kaartkop{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:24px;min-width:0}
.zh-h{margin:0;font-size:10.5px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;line-height:1.2;color:var(--ink-2)}
.zh-inhoud{display:flex;flex-direction:column;gap:8px;min-width:0}
.zh-groot{margin:0;font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:22px;font-weight:800;letter-spacing:-.01em;line-height:1.15;font-variant-numeric:tabular-nums;color:var(--ink);overflow-wrap:anywhere}
.zh-groot small{display:block;font-family:"IBM Plex Sans",sans-serif;font-size:12.5px;font-weight:400;letter-spacing:0;color:var(--ink-2);margin-top:2px}
.zh-regel{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-2);overflow-wrap:anywhere}
.zh-bron{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0;font-size:12.5px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.zh-bron a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.zh-bezig{display:flex;align-items:center;gap:8px;margin:0;font-size:13.5px;color:var(--ink-2)}
.zh-band{margin:2px 0 0;min-width:0}
.zh-band svg{display:block;width:100%;height:28px}
.zh-tekstknop{appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--ink-2);background:transparent;border:0;padding:8px 4px;min-height:40px;border-radius:8px;text-align:left;align-self:flex-start}
.zh-kaartkop .zh-tekstknop{flex:none;margin:-8px -4px}
.zh-tekstknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px;color:var(--accent)}
.zh-paneel{display:flex;flex-direction:column;gap:10px;margin-top:4px;padding-top:12px;border-top:1px solid var(--line);min-width:0}
.zh-paneel[hidden]{display:none}
.zh-paneel .pfform{padding:0}
.zh-paneel .vgd-veld > label:first-child{margin-top:0}
.zh-paneel .chartsub.vgd-hulp{margin-left:0;margin-right:0}
.zh-paneel .vgd-chips{margin:0}
.zh-paneel .vg2-opgehaald,.zh-paneel .vg2-compleet{display:none}
.zh-paneel .vgd-fout{margin:-4px 4px 0;font-size:12.5px;color:var(--bad-text)}
.zh-tag{display:inline-block;margin-left:6px;padding:1px 7px;border:1px solid var(--line);border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);vertical-align:middle}
.zh-hs .hs-t1,.zh-hs .hs-trede .hs-eyebrow,.zh-hs .hs-rij .hs-eyebrow,.zh-hs [data-vg2="maandlast"],.zh-hs .hs-c .hs-t2,.zh-hs .hs-c .hs-keuze.hs-onder,.zh-hs .hs-g .hs-zin,.zh-hs .hs-g .hs-bron{display:none}
.zh-hs .hs{gap:8px}
.zh-hs .hs-trede,.zh-hs .hs-deel{padding:0;border:0;border-radius:0;background:transparent}
.zh-hs .hs-deel + .hs-deel{border-top:1px solid var(--line);padding-top:12px}
.zh-hs .hs-knoprij .btn{margin:4px 0 0;min-height:48px;width:100%}
.zh-la .la{gap:8px}
.zh-la .la-kaart{padding:0;border:0;border-radius:0;background:transparent}
.zh-la .la-kaart + .la-kaart,.zh-la .la-trede{border-top:1px solid var(--line);padding-top:12px}
.zh-hs .hs-tekstknop,.zh-hs .hs-bron,.zh-la .la-tekstknop,.zh-la .la-bronnen summary,.zh-la .la-herkomst{color:var(--ink-2)}
.zh-hs .hs-tekstknop:focus-visible,.zh-la .la-tekstknop:focus-visible,.zh-la .la-bronnen summary:focus-visible{color:var(--accent)}
.zh-hs .hs-g [data-hs="geenhyp-uit"]{display:none}
.zh-la .la-rij{flex-wrap:wrap}
.zh-la .la-naam{overflow-wrap:normal}
.zh-la .la-per,.zh-la .la-bedrag.la-leeg{display:none}
.zh-la .la-bronnen li a{display:inline-flex;align-items:center;min-height:40px}
.zh-la .vgd-hulp{color:var(--ink-2)}
.zh-adreskaart{display:flex;flex-direction:column;gap:10px;padding:16px 18px;border:1px solid var(--line);border-radius:20px;background:var(--card-2);min-width:0}
.zh-adreskaart b{font-family:"Archivo","IBM Plex Sans",sans-serif;font-size:15px;overflow-wrap:anywhere}
.zh-adreskaart .vgd-chips{margin:0}
.zh-adreskaart .btn{margin:4px 0 0;min-height:48px;width:100%}
.zh-of{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0;font-size:13px;color:var(--ink-2)}
.zh-of .zh-tekstknop{padding:8px 0;min-height:40px}
.zh-voetregel{margin:4px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.zh-voetregel .zh-tekstknop{display:inline;padding:8px 0;min-height:40px;font-size:12.5px}
.zh-voetregel-ander{white-space:nowrap}
.zh-voetknop.btn{flex:none;min-width:108px}
.zh-voetknop.btn:first-child{margin-left:auto}
.zh-kaart .vgd-badge-groot{align-self:flex-start}
.zh-in{animation:zh-in .2s ease-out both}
.zh-vers{animation:zh-vers .18s ease-out both}
@keyframes zh-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes zh-vers{from{opacity:.55}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.zh-in,.zh-vers{animation:none}}
/* ===== v25.58 VASTGOED-ZONDER-HANDWERK (einde) ===== */
/* ===== v25.58 TABBALKMOBIEL (begin) ===== */
/* v25.58 — TABBALKMOBIEL */
/* v25.58 (TABBALK-MOBIEL): staart tabbalk-mobiel - de tabbalk van de bedrijfspagina (Koers, Kerncijfers, Financien, Dividend, Berichten; Rabi 19-9 bij een schermafdruk van zijn telefoon: "Dit ook ff fixen"). Gemeten op main (390 px): de actieve knop draagt .on met var(--card-2) op var(--seg-bg), in het lichte thema zes eenheden verschil per kanaal, dus geen zichtbare pil; onder 480 px zette de staart FINANCIENTAB de knoppen op flex 0 0 auto met flex-start, zodat de labels als losse tekst links stonden met lege ruimte rechts zodra alles past. Herstel, alleen css (geen regel in de client): de actieve knop in de kaartkleur var(--card) zoals de andere segmentkiezers, met een ring van een pixel in var(--line-2) zodat de pil ook in het donkere thema duidelijk is; tikdoel minstens 40 px hoog op elke breedte; onder 480 px flex 1 0 auto (de zijruimte van 3 px blijft): de knoppen groeien mee en vullen de balk als alles past, en alleen als de labels echt niet passen krimpen ze niet en scrolt de balk met de bestaande vervaging van FINANCIENTAB (ftScrolHint; volle labels, geen ellipsis). Alleen tokens: geen hex, geen rgb, geen aanwijs-effect, geen id-selector, geen voorrangsvlag; de selector .tkviewbar .seg zoals FINANCIENTAB (niet het klassewoord van de tabbalk zelf, dat bedrijfspagina2-client na haar 359 px-regel in de rest van de stylesheet uitsluit). */
.tkviewbar .seg button{min-height:40px}
.tkviewbar .seg button.on{background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2)}
@media (max-width:479px){.tkviewbar .seg button{flex:1 0 auto}}
/* ===== v25.58 TABBALKMOBIEL (einde) ===== */
/* ===== v25.58 PORTEFEUILLESKNOP (begin) ===== */
/* v25.58 — PORTEFEUILLESKNOP */
/* v25.58 (PORTEFEUILLES-KNOP): staart portefeuilles-knop - de chip Portefeuilles achteraan in de chiprij op de kaart Totale waarde (Rabi 19-9 bij drie schermafdrukken van zijn telefoon: "Deze knop om portefeuilles te zien is veel beter bovenaan waar ik het rood omcircle."). Dezelfde vorm als .pfchip, met een subtiel onderscheid: de kaartkleur in plaats van de lichte vulling, een rand in --line-2 en het caretje in --ink-3 zoals op de naamknop in de kaartkop. De zichtbare chip blijft 35 px hoog zoals de andere chips; een onzichtbare rand (::before, inset -4px vanaf de binnenrand = 3 px voorbij de zichtbare rand boven en onder) brengt het tikdoel op 41 px, daarom overflow zichtbaar (het label is kort en heeft geen afkapping nodig). Alleen tokens (licht en donker via de tokens), geen id-selector, geen hex. De sorteerknop is niet aangeraakt: gemeten op main (390 px) is de kaartkop 352 px breed, de actieknoppen nemen 222 px en de naam is al afgekapt (81 van 121 px); een label Sorteer zou circa 45 px kosten en de naam tot circa 36 px terugbrengen. */
.pfchip.beheer{position:relative;overflow:visible;background:var(--card);color:var(--ink-2);border-color:var(--line-2)}
.pfchip.beheer::before{content:"";position:absolute;inset:-4px 0}
.pfchip.beheer .pfk-caret{color:var(--ink-3);font-size:11px;margin-left:6px}
.pfchip.beheer:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* ===== v25.58 PORTEFEUILLESKNOP (einde) ===== */
/* ===== v25.58 VASTGOEDBEELD (begin) ===== */
/* v25.58 — VASTGOEDBEELD */
/* v25.58 (VASTGOED-BEELD, bouwer): staart vastgoed-beeld - het eerste scherm van de vastgoedpagina als beeld (Rabi 19-9: "nieuwe design voor vastgoed gedeelte. Past het aan en foutloos en bugloos graag."): de vb-sectie als eerste kind van .vgd-pagina.vb (390 een kolom in DOM-volgorde; vanaf 960 px het raster 500px / rest met links Van jou, rechts drie cijfers, Let op 300px naast Sinds je het kocht, wat als eronder), het huis met de vulling die in 700 ms volloopt (stil onder prefers-reduced-motion), de drie cijfers als echte knoppen van 44 px, Let op met een amber of groene stip, de grafiek met alleen tokens (accent, ink-3, chart-grid-2, card), de wat-als-tegels (op 1280 liggend), de chips Meer (40 px, onder het beeld op 390 en in de kopregel van #heroCard vanaf 960), de kopregel met de stoplichtpil, en het grote Netto woningvermogen met de vier hero-tegels uit beeld (display:none; DOM en tekst blijven). Alleen var(--...) en color-mix, geen hexwaarde, geen rgb-functie, geen aanwijs-woord, geen id-selector, geen voorrangsvlag; elke selector begint met .vb, .vgd-pagina.vb, .hero.vb-kop of .vgd-verborgen .hero.vb-kop. Hersteller ronde 1 (19-9): de teksten in het huis via .vb-huis.vb-speelt (de sibling-selector matchte nooit), de kleine tekst in de tegeltjes in --ink-2 en de groene/rode tegeltekst als mix met --ink (contrast AA op --card-2), alle tekstknoppen 44 px, de deelknop van DEEL-OVERAL op de vb-kaarten als icoon (een kopregel), de voetregel in het beeld over de volle breedte, de kop over de volle breedte op een breed scherm (.vb-kop-kolom op de dashboardkolom) zonder de oude knop Wat is dit, het kleine huis van een pand over beide kolommen met het cijfer op een regel, de wat-als-kop met een kleinere basis (120 px). Hersteller ronde 2 (19-9): de groene en rode kleine tekst op de tegels en de wat-als-tegels (.vb-klein.vb-goed en .vb-klein.vb-slecht na .vb-klein), de kopregel op een telefoon als een klein raster (de titel over de breedte, daaronder de sub met de pil rechts ernaast; de pil iets kleiner) en vanaf 960 px een rij waarin de koptekst krimpt, de eyebrow van een deelbare tegel breekt onder de deelknop (top 0), de kaart Van jou met radius 24 en 28 (zwaarder dan .vb-beeld .card), Let op 300 px zoals het ontwerp, en het eerste scherm op een telefoon: de portefeuillechips in de kop als een schuivende rij en de assistentkaart van de aandelenportefeuille weg zolang het beeld staat (.vb-scherm op het dashboardscherm, alleen met de kop; de terugweg raakt niets). Hersteller ronde 3 (19-9): de schuivende rij van de portefeuillechips is weg (de chips wikkelen weer zoals overal in de app: de knop Portefeuilles, de plusknop en Alles stonden op een telefoon buiten beeld zonder teken; gemeten blijft de nok van het huis op 390 x 844 boven de tabbalk), de stip en de kleine tekst nooit gescheiden (.vb-klein nowrap met de tekst in .vb-klein-tekst, de stip 4 px van boven), op een telefoon de korte datum in de kopsub (.vb-kopsub-kort tot 480 px, .vb-kopsub-lang erboven) en een compactere pil (4px 8px, 24 px) zodat sub en pil op een regel staan. Hersteller ronde 4 (19-9): de kopregel op een telefoon stapelt de pil onder de sub als sub en pil gemeten niet naast elkaar passen (.vb-kop-stapel: de datum valt nooit meer achter een weglatingsteken), de portefeuillechips op de vastgoedpagina op een telefoon als een rij met een vervaging en een pijlpunt rechts zolang er meer is (.vb-chips-meer, integratorbesluit b van ronde 3: het huis met de vulling in het eerste scherm), de twee wat-als-tegels op een breed scherm als hetzelfde raster (het grote cijfer links, kop en kleine regel rechts), het kleine huis en het cijfer van Van jou klein kleiner onder 360 px (het bedrag op een regel), en op een breed scherm eindigen de linker- en rechterkolom van het beeld op dezelfde hoogte (align-items stretch; het huis neemt de ruimte, de middenrij groeit mee). Nazorg 20-9 (v25.58 (VASTGOED-BEELD, nazorg); Rabi, schermafdruk van zijn telefoon met koopsom 620.000, waarde 1.388.517, meer waard 1.300.000: "Fix dit" en "Moet beter passen en ogen allemaal"): een bedrag breekt nooit meer binnen het getal (.vb-groot, .vb-cijfer, .vb-tegel2-cijfer en .vb-wat-groot nowrap; de client (vbCijfersPas) meet per rij de grootste letter waarbij elk cijfer op een regel in zijn tegel past, tot 72 procent van de basis, en kiest daarna een ruimere indeling); de drie cijfertegels staan op een telefoon (tot 639 px) als 2 + 1: twee naast elkaar en de derde over de volle breedte met kop boven en cijfer en kleine regel naast elkaar (de klasse vb-drie-2 doet hetzelfde op elke breedte, vb-drie-1 zet alle drie als zulke rijen), zodat elk kopje en elk bedrag op een regel staat en de kopjes en cijfers in een rij op dezelfde hoogte beginnen; de deelknop op de tegel Per maand is een kaal icoon (geen rand, 44 px tikvlak) in de hoek zodat het kopje niet breekt; de tegeltjes Bij de koop en Nu onder 360 px onder elkaar; het label waard in de grafiek kiest een plek die de waardelijn en de jaarlabels vrijlaat. */
.vgd-pagina.vb{min-width:0}
.vb-beeld{display:flex;flex-direction:column;gap:12px;min-width:0;margin:0 0 12px}
.vb-links,.vb-rechts,.vb-midden{display:contents}
.vb-beeld .card{box-shadow:none;border-radius:20px;min-width:0}
.vb-kaart{display:flex;flex-direction:column;gap:6px;padding:16px 18px;min-width:0}
.vb-vanjou{border-radius:24px;padding:22px 18px 18px;position:relative;overflow:hidden;align-items:center}
.vb-beeld .vb-vanjou{border-radius:24px}
.vb-beeld .vb-vanjou-klein{border-radius:20px}
.vb-vanjou > .vb-kaartkop,.vb-vanjou > .vb-groot,.vb-vanjou > .vb-sub,.vb-vanjou > .vb-regel{align-self:flex-start;width:100%}
.vb-kaartkop{display:flex;align-items:center;justify-content:space-between;gap:6px 8px;padding:0;margin:0;min-height:0;flex-wrap:wrap;width:100%}
.vb-kaartkop .vb-eyebrow,.vb-kaartkop .vb-h2{white-space:nowrap}
.vb-kaartkop .deoknop{margin-left:auto;min-height:44px;padding:0 8px;flex:none}
.vb-kaartkop .deoknop span{display:none}
.vb-tegel.vb-kaart{position:relative}
.vb-tegel .vb-kaartkop{flex-wrap:nowrap;padding-right:24px} /* v25.58 (VASTGOED-BEELD, nazorg): ruimte voor het kale icoon (32 px op right 4px, de tegel heeft 12 px binnenrand: 24 volstaat; was 36, waardoor PER MAAND op 320 px brak) */
.vb-tegel .vb-kaartkop .deoknop{position:absolute;top:0;right:4px;margin:0;border-color:transparent;background:transparent} /* v25.58 (VASTGOED-BEELD, nazorg): de deelknop op een cijfertegel als kaal icoon (44 px tikvlak blijft, focusring van de basis blijft), 4 px uit de hoek in plaats van tegen de rand */
.vb-tegel .vb-kaartkop .vb-eyebrow{white-space:normal}
.vb-eyebrow{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);line-height:1.3}
.vb-groot{display:block;font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:800;font-size:46px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink);white-space:nowrap;min-width:0} /* v25.58 (VASTGOED-BEELD, nazorg): nowrap: een bedrag breekt nooit binnen het getal; de client verkleint de letter gemeten (vbCijfersPas) */
.vb-sub{margin:0;font-size:13.5px;line-height:1.45;color:var(--ink-2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.vb-regel{margin:0;font-size:13.5px;line-height:1.5;color:var(--ink-2);overflow-wrap:anywhere}
.vb-tekstknop{appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--accent);background:transparent;border:0;padding:8px 4px;min-height:44px;border-radius:8px;text-align:left;display:inline-flex;align-items:center}
.vb-tekstknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.vb-huis{display:block;width:250px;max-width:100%;height:auto;margin:6px auto 0;overflow:visible}
.vb-huis-klein{width:120px;height:110px;margin:0;flex:none}
.vb-huis-gloed{fill:var(--glow)}
.vb-huis-romp{fill:var(--card-2)}
.vb-huis-lijn{stroke:var(--ink)}
.vb-huis-scheiding{stroke:var(--card);stroke-opacity:.55}
.vb-huis-deur{fill:var(--ground);fill-opacity:.35}
.vb-huis-raam{stroke:var(--ink);stroke-opacity:.6}
.vb-vul-rect{fill:var(--accent)}
.vb-huis-tekst{fill:var(--accent-tekst);font-family:"IBM Plex Sans",sans-serif}
.vb-huis-bank{fill:var(--ink-2);font-family:"IBM Plex Sans",sans-serif}
.vb-vul{transform:translateY(var(--vb-dy));transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.vb-vul.vb-speelt{transform:none}
.vb-vul-tekst{opacity:0;transition:opacity .3s ease .5s}
.vb-huis.vb-speelt .vb-vul-tekst{opacity:1}
.vb-tegels2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;margin-top:10px}
.vb-tegel2{background:var(--card-2);border-radius:14px;padding:10px 12px;display:flex;flex-direction:column;gap:1px;min-width:0}
.vb-tegel2-kop{font-size:11px;color:var(--ink-2)}
.vb-tegel2-cijfer{font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:700;font-size:18px;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap} /* v25.58 (VASTGOED-BEELD, nazorg): nowrap, zie .vb-groot */
.vb-tegel2-stil{color:var(--ink-2)}
.vb-tegel2-klein{font-size:11px;color:var(--ink-2)}
.vb-tegel2 .vb-tekstknop{padding:8px 0;min-height:44px;margin:-4px 0;font-size:12.5px}
.vb-goed{color:var(--good-text);font-weight:600}
.vb-slecht{color:var(--bad-text);font-weight:600}
.vb-tegel2 .vb-goed{color:color-mix(in srgb, var(--good-text) 78%, var(--ink))}
.vb-tegel2 .vb-slecht{color:color-mix(in srgb, var(--bad-text) 78%, var(--ink))}
.vb-stil{color:var(--ink-2)}
.vb-amber-tekst{color:var(--gold-tekst)}
.vb-drie{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-width:0}
.vb-tegel{display:flex;flex-direction:column;gap:4px;padding:14px 12px;min-height:96px;border-radius:18px;min-width:0;text-align:left}
.vb-tegel .vb-eyebrow{letter-spacing:.06em}
.vb-tegelknop{appearance:none;font:inherit;color:inherit;background:transparent;border:0;padding:0;margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;min-height:44px;min-width:0;flex:1 1 auto;border-radius:8px;width:100%}
.vb-tegelknop[data-vgd-actie]{cursor:pointer}
.vb-tegelknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.vb-cijfer{font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:800;font-size:22px;line-height:1.05;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap;min-width:0} /* v25.58 (VASTGOED-BEELD, nazorg): nowrap, zie .vb-groot */
.vb-drie.vb-drie-2{grid-template-columns:repeat(2,minmax(0,1fr))} /* v25.58 (VASTGOED-BEELD, nazorg): de indeling 2 + 1 op elke breedte, gezet door vbCijfersPas als drie kolommen het breedste bedrag ook op 72 procent niet dragen */
.vb-drie.vb-drie-1{grid-template-columns:minmax(0,1fr)} /* v25.58 (VASTGOED-BEELD, nazorg): drie rijen als ook 2 + 1 het niet draagt */
.vb-drie.vb-drie-2 > .vb-tegel:nth-child(3):last-child{grid-column:1/-1} /* v25.58 (VASTGOED-BEELD, nazorg): de derde tegel over beide kolommen */
.vb-drie.vb-drie-2 > .vb-tegel:nth-child(3):last-child > .vb-tegelknop,.vb-drie.vb-drie-1 > .vb-tegel > .vb-tegelknop{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 12px} /* v25.58 (VASTGOED-BEELD, nazorg): in een tegel over de breedte staan cijfer en kleine regel naast elkaar op de basislijn (de kleine regel wikkelt eronder als zij niet past) */
.vb-drie.vb-drie-2 > .vb-tegel:nth-child(3):last-child > .vb-tegelknop > .vb-tekstknop,.vb-drie.vb-drie-1 > .vb-tegel > .vb-tegelknop > .vb-tekstknop{flex:1 1 100%} /* v25.58 (VASTGOED-BEELD, nazorg): de knop Vul in op een eigen regel */
@media (max-width:639px){.vb-drie{grid-template-columns:repeat(2,minmax(0,1fr))}.vb-drie > .vb-tegel:nth-child(3):last-child{grid-column:1/-1}.vb-drie > .vb-tegel:nth-child(3):last-child > .vb-tegelknop{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 12px}.vb-drie > .vb-tegel:nth-child(3):last-child > .vb-tegelknop > .vb-tekstknop{flex:1 1 100%}} /* v25.58 (VASTGOED-BEELD, nazorg): op een telefoon altijd 2 + 1 (drie kolommen van 113 px op 390 dragen geen zeven cijfers en geen kopje HELEMAAL VAN JOU op een regel) */
.vb-klein{font-size:11.5px;color:var(--ink-2);display:inline-flex;align-items:flex-start;gap:5px;flex-wrap:nowrap;line-height:1.35}
.vb-klein-tekst{min-width:0}
.vb-klein.vb-goed{color:var(--good-text)}
.vb-klein.vb-slecht{color:var(--bad-text)}
.vb-alleen-breed{display:none}
.vb-stip7{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0;margin-top:4px}
.vb-stip{width:10px;height:10px;border-radius:50%;display:inline-block;flex-shrink:0;margin-top:5px}
.vb-stip.vb-amber,.vb-stip7.vb-amber{background:var(--gold)}
.vb-stip.vb-groen,.vb-stip7.vb-groen{background:var(--good)}
.vb-h2{margin:0;font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:700;font-size:15px;line-height:1.3;color:var(--ink)}
.vb-kaartkop-rechts{font-size:12px;color:var(--ink-2)}
.vb-letop{gap:12px}
.vb-lijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.vb-signaal{display:flex;gap:12px;align-items:flex-start;min-width:0}
.vb-signaal-tekst{display:flex;flex-direction:column;gap:1px;min-width:0}
.vb-signaal-kop{font-weight:600;font-size:14px;line-height:1.4;color:var(--ink);overflow-wrap:anywhere}
.vb-signaal-sub{font-size:12.5px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.vb-signaal-sub .vb-tekstknop{padding:8px 4px;min-height:44px;margin:-6px 0;font-size:12.5px;vertical-align:middle}
.vb-sinds{gap:8px}
.vb-sinds-svg{width:100%;min-width:0}
.vb-sinds-svg svg{display:block;width:100%;height:auto;font-family:"IBM Plex Sans",sans-serif}
.vb-g-raster{stroke:var(--chart-grid-2);stroke-width:1}
.vb-g-as{fill:var(--ink-3)}
.vb-g-vlak{fill:var(--accent);fill-opacity:.22}
.vb-g-bank{stroke:var(--ink-3)}
.vb-g-waarde{stroke:var(--accent)}
.vb-g-punt{fill:var(--accent);stroke:var(--card)}
.vb-g-puntbank{fill:var(--ink-3);stroke:var(--card)}
.vb-g-lbl{fill:var(--ink)}
.vb-g-lbl2{fill:var(--ink-2)}
.vb-bron{margin:0;font-size:11.5px;line-height:1.45;color:var(--ink-3);overflow-wrap:anywhere}
.vb-watals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0}
.vb-watals-een{grid-template-columns:minmax(0,1fr)}
.vb-wat{padding:14px;min-height:96px;appearance:none;font:inherit;color:inherit;border:1px solid var(--line);align-items:flex-start}
.vb-wat[data-vgd-actie]{cursor:pointer}
.vb-wat:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.vb-wat-kop{font-size:12px;color:var(--ink-2);line-height:1.4;overflow-wrap:anywhere}
.vb-wat-groot{font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:800;font-size:24px;line-height:1.05;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap} /* v25.58 (VASTGOED-BEELD, nazorg): nowrap, zie .vb-groot */
.vb-wat .vb-klein{font-size:12px}
.vb-chips{display:flex;flex-wrap:wrap;gap:6px;padding-top:2px;min-width:0}
.vb-chip{appearance:none;cursor:pointer;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:0 12px;min-height:44px;display:inline-flex;align-items:center}
.vb-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px;color:var(--ink)}
.vb-inzak .vb-groot{font-size:46px}
.vb-huurbalk{width:100%;min-width:0;margin-top:10px}
.vb-huurbalk svg{display:block;width:100%;height:auto;font-family:"IBM Plex Sans",sans-serif}
.vb-hb-lbl{fill:var(--ink-2)}
.vb-hb-kop{fill:var(--ink)}
.vb-hb-as{fill:var(--ink-3)}
.vb-hb-in{fill:var(--good)}
.vb-hb-reserve{fill:var(--ink-3);fill-opacity:.55}
.vb-hb-lasten{fill:var(--ink-3)}
.vb-hb-rente{fill:var(--gold)}
.vb-hb-afl{fill:var(--gold);fill-opacity:.6}
.vb-hb-beheer{fill:var(--ink-2);fill-opacity:.5}
.vb-hb-over{fill:var(--accent)}
.vb-hb-overtekst{fill:var(--accent-tekst)}
.vb-hb-tekort{fill:var(--bad-text)}
.vb-vanjou-klein{padding:16px 18px}
.vb-vanjou-rij{display:flex;gap:16px;align-items:center;min-width:0;width:100%}
.vb-vanjou-tekst{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 auto}
.vb-vanjou-klein .vb-groot{font-size:28px}
.vb-vanjou-klein .vb-sub{font-size:12.5px}
.vb-voet-waarde{margin-top:2px}
.vgd-pagina.vb .vb-voet,.vgd-pagina.vb .vb-voet-waarde{color:var(--ink-2)}
.vb-beeld > .zd-voet,.vb-beeld > .vb-voet{margin:0}
.vb-beeld > .vb-voet-waarde{margin:-8px 0 0}
.vgd-verborgen .hero.vb-kop .watisdit{display:none}
.hero.vb-kop .vb-kopregel{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"titel titel" "sub pil";align-items:center;gap:2px 10px;min-height:44px;margin:0 0 4px;min-width:0}
.vb-koptekst{display:contents}
.vb-titel{grid-area:titel}
.vb-kopsub{grid-area:sub;min-width:0}
.vb-pil{grid-area:pil;justify-self:end}
.vb-titel{margin:0;font-family:"Archivo","IBM Plex Sans",sans-serif;font-weight:700;font-size:17px;letter-spacing:-.01em;line-height:1.25;color:var(--ink);overflow-wrap:anywhere}
.vb-kopsub{font-size:12px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vb-kopsub-lang{display:none}
.hero.vb-kop .vb-kopregel.vb-kop-stapel{grid-template-columns:minmax(0,1fr);grid-template-areas:"titel" "sub" "pil"}
.hero.vb-kop .vb-kopregel.vb-kop-stapel .vb-pil{justify-self:start}
.vgd-verborgen .hero.vb-kop > .pfchips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.vgd-verborgen .hero.vb-kop > .pfchips > *{flex:0 0 auto}
.vgd-verborgen .hero.vb-kop > .pfchips::-webkit-scrollbar{display:none}
.vgd-verborgen .hero.vb-kop > .pfchips.vb-chips-eerder{mask-image:linear-gradient(to right,transparent,var(--card) 40px)}
.vgd-verborgen .hero.vb-kop > .pfchips.vb-chips-meer{mask-image:linear-gradient(to right,var(--card) calc(100% - 60px),transparent calc(100% - 18px),var(--card) calc(100% - 18px))}
.vgd-verborgen .hero.vb-kop > .pfchips.vb-chips-eerder.vb-chips-meer{mask-image:linear-gradient(to right,transparent,var(--card) 40px,var(--card) calc(100% - 60px),transparent calc(100% - 18px),var(--card) calc(100% - 18px))}
.vgd-verborgen .hero.vb-kop > .pfchips.vb-chips-meer::after{content:"\203A";position:sticky;right:0;flex:none;width:18px;margin-left:-18px;align-self:stretch;display:flex;align-items:center;justify-content:flex-end;background:var(--card);color:var(--ink-3);font-size:18px;line-height:1;pointer-events:none}
@media (min-width:481px){.vb-kopsub-kort{display:none}.vb-kopsub-lang{display:inline}}
.vb-pil{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:4px 8px;border-radius:999px;white-space:nowrap;min-height:24px;flex:none}
.vb-pil-groen{color:var(--good-text);background:color-mix(in srgb, var(--good) 12%, transparent)}
.vb-pil-amber{color:var(--gold-tekst);background:color-mix(in srgb, var(--gold) 14%, transparent)}
.vb-pilstip{width:8px;height:8px;border-radius:50%;display:inline-block;background:currentColor}
.vb-chips-kop{display:none}
.vgd-verborgen .hero.vb-kop > .vgd-hero-lbl,.vgd-verborgen .hero.vb-kop > .big,.vgd-verborgen .hero.vb-kop > .herosub,.vgd-verborgen .hero.vb-kop > .vgd-hero{display:none}
.vb-scherm .aikaart{display:none}
@media (max-width:359px){.vb-tegels2{grid-template-columns:minmax(0,1fr)}.vb-cijfer{font-size:20px}.vb-huis-klein{width:92px;height:84px}.vb-vanjou-klein .vb-groot{font-size:24px}.hero.vb-kop .vb-kopregel{grid-template-columns:minmax(0,1fr);grid-template-areas:"titel" "sub" "pil"}.vb-pil{justify-self:start}} /* v25.58 (VASTGOED-BEELD, nazorg): onder 360 px de tegeltjes Bij de koop en Nu onder elkaar (was: .vb-drie in twee kolommen, dat regelt nu de 639-regel) */
@media (min-width:960px){
.vb-beeld{display:grid;grid-template-columns:minmax(360px,44%) minmax(0,1fr);gap:20px;align-items:stretch}
.vb-links > .vb-vanjou{flex:1 1 auto}
.vb-links > .vb-vanjou .vb-huis{margin-top:auto;margin-bottom:auto}
.vb-rechts > .vb-midden{flex:1 1 auto}
.vb-beeld > .zd-voet,.vb-beeld > .vb-voet,.vb-beeld > .vb-voet-waarde{grid-column:1/-1}
.vb-kop-kolom{grid-column:1/-1}
.vb-kaartkop{flex-wrap:nowrap}
.vb-kaartkop-rechts{white-space:nowrap}
.vb-midden > .vb-vanjou-klein{grid-column:1/-1}
.vb-vanjou-klein .vb-groot{white-space:nowrap}
.vb-links{display:flex;flex-direction:column;min-width:0}
.vb-rechts{display:flex;flex-direction:column;gap:16px;min-width:0}
.vb-midden{display:grid;grid-template-columns:300px minmax(0,1fr);gap:16px;align-items:stretch}
.vb-beeld .vb-vanjou{border-radius:28px}
.vb-vanjou{padding:28px 30px 24px}
.vb-groot{font-size:56px}
.vb-sub{font-size:14px}
.vb-huis{width:440px;margin-top:4px}
.vb-tegels2{gap:10px;margin-top:6px}
.vb-tegel2{padding:10px 14px}
.vb-tegel2-kop,.vb-tegel2-klein{font-size:11.5px}
.vb-tegel2-cijfer{font-size:20px}
.vb-drie{gap:12px}
.vb-tegel{padding:18px 20px;border-radius:20px}
.vb-tegel .vb-kaartkop .deoknop{top:4px;right:10px} /* v25.58 (VASTGOED-BEELD, nazorg): het icoon in de hoek van de bredere tegel (binnenrand 18px 20px) */
.vb-cijfer{font-size:30px}
.vb-klein{font-size:12.5px}
.vb-alleen-breed{display:inline}
.vb-klein.vb-alleen-breed{display:inline-flex}
.vb-alleen-smal{display:none}
.vb-signaal{gap:10px}
.vb-signaal-kop{font-size:13.5px}
.vb-signaal-sub{font-size:12px}
.vb-watals{gap:12px}
.vb-wat{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"groot kop" "groot klein";column-gap:16px;row-gap:2px;align-items:center;padding:14px 20px;min-height:72px}
.vb-wat.vb-wat-zonder{grid-template-columns:minmax(0,1fr);grid-template-areas:"kop" "klein"}
.vb-wat .vb-wat-groot{grid-area:groot;font-size:26px;white-space:nowrap}
.vb-wat .vb-wat-kop{grid-area:kop;font-size:12.5px;min-width:0;align-self:end}
.vb-wat .vb-klein{grid-area:klein;font-size:12.5px;align-self:start}
.vgd-verborgen .hero.vb-kop > .pfchips{flex-wrap:wrap;overflow-x:visible;mask-image:none}
.vb-chips-onder{display:none}
.vb-chips-kop{display:flex;flex-wrap:wrap;gap:6px;padding:0}
.vb-inzak .vb-groot{font-size:56px}
.vb-beeld .vb-vanjou-klein{border-radius:20px}
.vb-vanjou-klein{padding:16px 18px}
.vb-vanjou-klein .vb-groot{font-size:28px}
.vb-vanjou-klein .vb-huis{width:120px;margin:0}
.hero.vb-kop .vb-kopregel{display:flex;flex-wrap:nowrap;gap:16px}
.vb-koptekst{display:flex;flex-direction:column;flex:1 1 0;min-width:0}
.vb-titel{font-size:18px}
.vb-kopsub{font-size:13px}
.vb-pil{padding:8px 12px;font-size:12.5px;gap:6px;min-height:32px}
}
@media (min-width:960px) and (max-width:1099px){.vb-beeld{grid-template-columns:minmax(340px,42%) minmax(0,1fr)}.vb-huis{width:340px}.vb-midden{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.vb-vul{transition:none;animation:none}.vb-vul-tekst{transition:none;opacity:1}}
/* ===== v25.58 VASTGOEDBEELD (einde) ===== */
/* ===== v25.58 BETAALD-EN-GRATIS (begin) ===== */
/* v25.58 — BETAALDGRATIS */
/* v25.58 (BETAALD-EN-GRATIS, client): staart betaald-en-gratis - de tab Betaald en gratis op /beheer (Rabi 19-9: "zodat ik zelf altijd kan schakelen"): het paneel een kolom van secties (elke sectie deelt haar kaarten zelf in via .bhgrid: een, twee of drie kolommen), segmentknoppen Betaald | Gratis van 44 px die op twee rijen wikkelen, de gekozen knop in het accent, de groene regel Bewaard in --good-text, de sectie Alleen kijken gedempt, de budgetvelden op volle breedte; alleen tokens, geen hex, geen id-selector */
.bhview .bggrid{grid-template-columns:1fr;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.bhview .bggrid .bgseg{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}
.bhview .bggrid .bgseg .bhknop{min-height:44px;flex:1 1 140px}
.bhview .bggrid .bgseg .bhknop[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.bhview .bggrid .bgregel{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--ink)}
.bhview .bggrid .bguitleg{margin:6px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.bhview .bggrid .bgveldlabel{display:block;margin-top:10px;font-size:12.5px;color:var(--ink-2)}
.bhview .bggrid .bgacties{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.bhview .bggrid .bgacties .bhknop{min-height:44px}
.bhview .bggrid .bgbewaard{display:block;margin-top:6px;color:var(--good-text);font-size:12.5px}
.bhview .bggrid .bgbewaard:empty{display:none}
.bhview .bggrid .bgfout{margin:6px 0 0}
.bhview .bggrid .bgtonen .bhkaart{opacity:.85}
.bhview .bggrid .bhveld input[type="number"]{width:100%;min-height:44px}
.bhview .bggrid .bgnoot{margin:8px 0 0;padding:10px 12px;border:1px solid var(--gold);border-radius:12px;font-size:13px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere}
.bhview .bggrid .bgnoot b{color:var(--gold-tekst)}
.bhview .bggrid>.bhsectie{min-width:0}
.bhview .bggrid .bhsectiekop{color:var(--ink-2)}
/* v25.58 (BETAALD-EN-GRATIS, hersteller): de sectiekoppen Zelf schakelen / Getallen / Alleen kijken in de tekstkleur van de uitleg - de huisstijl-eyebrow (goud op licht, 10,5 px kapitalen) haalt in het lichte thema 3,41:1 en dat is onder AA 4,5:1; alleen binnen dit paneel, alleen een token */
/* v25.58 (BETAALD-EN-GRATIS, samenvoeger): de vijfde zichtbare tab in de tabkiezer van /beheer (zeven knoppen in de DOM: Eenvoudig en Klassiek verborgen) wikkelt onder 1024 px in 3 + 2 (rij 1: Overzicht, Onderdelen, Pers; rij 2: Community, Betaald), zoals de vijf-knoppenregel van voor BEHEER-REVAMP; met de .brtabs-specificiteit van BEHEER-REVAMP (die zet nowrap voor vier knoppen); elke knop houdt minstens 40 px (gemeten: op 390 px kneep Pers naar 38 px, op 480-1023 px liepen vier volle labels over) */
/* v25.58 (BETAALD-EN-GRATIS, hersteller): nth-last-child(n+7) in plaats van (7) - de wikkelregel blijft gelden als een volgend pakket een achtste knop toevoegt (dan 3 + 3, geen stille terugval op nowrap met knijpende labels); lockstep-punt voor de volgende tab staat in de chatdoc */
@media (max-width:1023px){.bhview .bktabs.brtabs{flex-wrap:wrap}.bhview .bktabs.brtabs button:first-child:nth-last-child(n+7),.bhview .bktabs.brtabs button:first-child:nth-last-child(n+7) ~ button{flex:1 1 30%;min-width:40px}.bhview .bktabs.brtabs button:first-child:nth-last-child(n+7) ~ button:nth-child(n+6){flex:1 1 44%}}
/* ===== v25.58 BETAALD-EN-GRATIS (einde) ===== */
/* ===== v25.58 PROFIEL-BETAALD (begin) ===== */
/* v25.58 — PROFIELBETAALD */
/* v25.58 (PROFIEL-BETAALD, client): naam en badge kiezen alleen voor leden - gedempte velden en de zin met de knop naar het lidmaatschap; zonder de klasse pfbdicht/pfbbadgeslot inert (byte-gelijk) */
.cdlkaartsectie.pfbdicht .cdlnaaminvoer input[disabled]{opacity:.55;cursor:not-allowed}
.cdlkaartsectie.pfbdicht .cdlknop[disabled]{opacity:.5;cursor:not-allowed}
.pfbslot{margin:8px 0 0;color:var(--ink-2)}
.pfbknop{margin-top:6px;min-height:44px}
.pfbbadgeslot{margin-top:8px;font-size:12.5px;line-height:1.45;color:var(--ink-2)}
.pfbbadgeslot .pfbknop{display:inline-block}
.ibkies[disabled]{opacity:.5;cursor:not-allowed}
/* ===== v25.58 PROFIEL-BETAALD (einde) ===== */
/* ===== v25.58 CHATLINKSFOTOS (begin) ===== */
/* v25.58 — CHATLINKSFOTOS */
/* v25.58 (CHAT-LINKS-EN-FOTOS): staart chat-links-en-fotos (blok v25.58 chat-links-en-fotos) - de linkkaart in huisstijl (.clfkaart: foto 96/64, bron, titel, omschrijving, Lees verder; hele kaart tikbaar), de kale kaart en de tekstlink-terugval, het leesvenster (.clfmodal/.clfsheet met .clfframe), de foto-voorvertoning in de chatbalk (.clfvoor), de fotokaart (.clffotokaart) en de lichtbak (.clfgroot); alleen tokens; 19-9, Rabi: "Gebruik onzze huisstijl om ze te embedden, met kleine foto, titel en lees verder" */
/* v25.58 (CHAT-LINKS-EN-FOTOS, hersteller): herstelronde 1 (19-9) - het sheet-frame als flex-kind zodat Open in browser en Sluiten op de telefoon in beeld staan, tikdoelen 44 px (Lees verder, de knoppen van het leesvenster en de lichtbak), Foto weghalen 36 px, bron en domein in --ink-2 (contrast AA), het label Foto voor een nieuw lid leesbaar, het kruisje gedempt zolang het bericht wordt verstuurd */
/* v25.58 (CHAT-LINKS-EN-FOTOS, hersteller): herstelronde 2 (19-9) - het leesvenster (modal) als flex-kolom met het frame als flex-kind (Open in browser en Sluiten ook op een laag desktopscherm in beeld), de lichtbak-foto begrensd op de vensterhoogte min kop en voet (Openen en Sluiten in beeld), een staande foto past in de kaart (.clfstaand), Foto weghalen op de telefoon 44 px */
/* v25.58 (CHAT-LINKS-EN-FOTOS, hersteller): herstelronde 3 (19-9) - het leesvenster onder 480 px hoog (telefoon liggend): frame minstens 120 px, de modal 96svh met een smallere binnenrand, zodat Open in browser, Sluiten en de hint in beeld staan; de laadtitel in --ink-2 (contrast AA, als bron en domein) */
.cdnbijlage.clfkaart{padding:10px;display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:start;cursor:pointer}
.clffoto{width:96px;height:96px;border-radius:8px;overflow:hidden;display:grid;place-items:center;background:var(--seg-bg);text-decoration:none}
.clffoto img{width:100%;height:100%;object-fit:cover;display:block}
.clffoto.clfmono{background:var(--accent-wash)}
.clffoto.clfmono .clffav{width:28px;height:28px;border-radius:6px;object-fit:contain}
.clffoto.clfmono b{font:800 26px/1 "Archivo",sans-serif;color:var(--accent)}
.clftekst{min-width:0;display:flex;flex-direction:column;gap:3px}
.clfbron{display:flex;align-items:center;gap:6px;font:700 10px "IBM Plex Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);min-width:0}
.clfbron>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clfbron .clffav{width:14px;height:14px;border-radius:3px;flex:none;object-fit:contain}
.clfbrondomein{display:none}
.clfkaart .clftitel{font:800 14px/1.35 "Archivo",sans-serif;color:var(--ink);text-decoration:none;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.clfoms{font-size:12px;line-height:1.45;color:var(--ink-2);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.clfvoet{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px;min-width:0}
.clfdomein{font-size:11px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clfkaart .clflees{flex:none;font:700 12px "IBM Plex Sans",sans-serif;color:var(--accent);text-decoration:none;display:inline-flex;align-items:center;gap:2px;min-height:26px;padding:0 6px;border-radius:6px}
.clflees::after{content:"\203A";font-weight:700}
.clflees:focus-visible,.clftitel:focus-visible,.clftekstlink:focus-visible,.clfvoorweg:focus-visible,.clffotoweg:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.clfkaart.clfladen .clftitel{color:var(--ink-2);font-weight:600}
.clfkaart.clfkaal .clftitel{color:var(--ink-2);font-weight:700}
.clftekstlink{display:inline-block;margin-top:6px;font-size:13px;color:var(--accent);text-decoration:underline;overflow-wrap:anywhere}
.clfmodal .cdnmodalvlak{height:min(92svh,980px);max-height:92svh}
.clfmodal .cdnmodalinhoud{padding:10px 20px 14px;flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.clfmodal .clfvensterkop,.clfmodal .clfvensterhint{flex:none}
.clfmodal .clfframe{flex:1 1 auto;min-height:200px;height:auto}
.clfvensterkop{display:flex;flex-wrap:wrap;gap:4px 10px;margin:0 0 8px;min-width:0}
.clfvensteradres{font:600 13px "IBM Plex Sans",sans-serif;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.clfvenstertitel{font-size:12px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.clfframe{display:block;width:100%;height:min(72vh,820px);border:0;border-radius:10px;background:var(--ground)}
.clfvensterhint{margin:8px 0 0;font-size:12px;color:var(--ink-2)}
.clfsheet .cdnsheetvlak{max-height:94svh;height:94svh}
.clfsheet .cdnsheetinhoud{display:flex;flex-direction:column;flex:1 1 auto}
.clfsheet .clfvensterkop,.clfsheet .clfvensterhint,.clfsheet .clfvoet2{flex:none}
.clfsheet .clfframe{flex:1 1 auto;min-height:200px;height:auto}
.clfsheet .clfvoet2 .cdnkknop,.clfsheet .clfvoet2 .cdnknop{min-height:44px;display:inline-flex;align-items:center}
.clfsheet .clfvoet2{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}
.clfopen,.clfgrootopen{text-decoration:none}
.clfvoor{display:flex;align-items:center;gap:10px;padding:8px 12px 0}
.clfvoorimg{width:56px;height:56px;border-radius:8px;object-fit:cover;display:block;background:var(--seg-bg)}
.clfvoorstand{font-size:12px;color:var(--ink-3);flex:1;min-width:0}
.clfvoorweg{appearance:none;border:1px solid var(--line);background:var(--card);color:var(--ink-2);width:28px;height:28px;border-radius:14px;display:grid;place-items:center;cursor:pointer;padding:0}
.clfvoorweg:disabled{cursor:default;opacity:.55}
.cdcbalk.clfsleep{outline:2px dashed var(--accent);outline-offset:-4px}
.cdnbijlage.clffotokaart{padding:0;overflow:hidden;border-radius:14px;background:var(--card-2)}
.clffotoknop{appearance:none;border:0;padding:0;margin:0;background:transparent;display:block;width:100%;cursor:zoom-in}
.clffotoknop:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.clffotoimg{display:block;width:100%;height:auto;aspect-ratio:var(--clfratio,4/3);object-fit:cover;max-height:360px}
.clffotoleeg{margin-top:8px;max-width:480px;padding:12px 14px;font-size:12px;color:var(--ink-3);border:1px dashed var(--line-2);border-radius:14px;box-sizing:border-box}
.clffotoweg{margin:8px 10px 10px}
.clffotokaart.clfstaand .clffotoimg{object-fit:contain;background:var(--card-2)}
.clfgroot .cdnmodalinhoud{padding:0;display:grid;place-items:center;background:var(--ground)}
.clfgroot .cdnmodalvlak{max-height:90svh}
.clfgrootimg{display:block;max-width:100%;max-height:calc(90svh - 150px);object-fit:contain}
.clfgroothint{font-size:12px;color:var(--ink-2);margin-right:auto}
.cdnplusitem.clfnieuw .cdnplustekst{color:var(--ink-3)}
.cdnplusitem.clfnieuw .cdnplustekst b{color:var(--ink-2)}
@media (max-width:767px){
  .cdnbijlage.clfkaart{padding:10px;grid-template-columns:64px minmax(0,1fr);gap:8px}
  .clffoto{width:64px;height:64px}
  .clffoto.clfmono b{font-size:20px}
  .clffoto.clfmono .clffav{width:22px;height:22px}
  .clfbron .clfbronnaam{display:none}
  .clfbron .clfbrondomein{display:inline-block;max-width:100%}
  .clfvoet{justify-content:flex-end}
  .clfdomein{display:none}
  .clfkaart .clflees{min-height:44px;padding:0 12px;border:1px solid var(--line-2);background:var(--card);border-radius:8px}
  .clffotoweg{min-height:44px;padding:0 12px}
  .clfgroot .cdnmodalvoet .cdnknop{min-height:44px}
  .clfvoorweg{width:36px;height:36px}
  .clffotoimg{max-height:320px}
}
@media (max-width:359px){.clfoms{-webkit-line-clamp:1}}
@media (max-height:480px){.clfsheet .clfframe,.clfmodal .clfframe{min-height:120px}.clfmodal .cdnmodalvlak{height:min(96svh,980px);max-height:96svh}.clfmodal .cdnmodalinhoud{padding:6px 20px 8px}}
/* ===== v25.58 CHATLINKSFOTOS (einde) ===== */
/* ===== v25.58 NIEUWSTAB (begin) ===== */
/* v25.58 — NIEUWSTAB */
/* v25.58 (NIEUWS-TAB): staart nieuws-tab (blok v25.58 nieuws-tab) - de krantindeling van de pagina Nieuws onder .nwview.nwt: de paginanavigatie (.nwttabs), de indexstrook (.nwtstrook), Voorpagina (.nwthoofd, .nwtlijst), Meer nieuws (.nwtkaart), de tijdkolom en rubriekchips op Van de redactie (.nwttijd, [data-nwtrubriek]), Jouw aandelen vandaag (.nwtpos), de LIVE-regel (.nwtliveregel), de voettekst (.nwtvoet) en de beheerkaart Nieuws: rubrieken (.nwtbeheer); display:contents + order + kolomspan op de bestaande secties, alleen tokens, tikdoelen 44 px, reduced motion; 19-9, Rabi: "Nieuws tab moet worden herontworpen en beter gecatagoriseerd" */
.nwview.nwt .nwgrid:not(.nzzoek)>.nwhoofd{display:contents}
.nwview.nwt .nwkaart{order:1}
.nwview.nwt .nwtkaartmeer{order:2}
.nwview.nwt .nwtstrook{order:3}
.nwview.nwt .nwstroom{order:4}
.nwview.nwt .nwtvoorpagina{order:5}
.nwview.nwt .nwtmeer{order:6}
.nwview.nwt .pmnieuws{order:7}
.nwview.nwt .nwgrid.nzzoek :is(.nwtsectie,.nwtkaartmeer),.nwview.nwt .nwgrid.nzzoek~.nwtvoet,.nwview.nwt :is(.nwttabs,.nwtkaartmeer,.nwtsectie,.nwtvoet,.nwtliveregel)[hidden],.nwview.nwt :is(.nwtoudetijd,.nwtdatumkort,.nwtsublang),.nwview.nwt .nwlid .lidbadge{display:none}
.nwview.nwt :is(.nwsectie,.nwkaart){scroll-margin-top:8px}
.nwview.nwt .nwttabs{display:flex;align-items:center;gap:10px;min-height:44px;margin:-4px 0 8px;padding:0 12px;background:var(--card);border:1px solid var(--line);border-radius:14px}
.nwview.nwt .nwttabrij{position:relative;min-width:0;flex:1 1 auto}
.nwview.nwt .nwttabscroll{display:flex;gap:20px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.nwview.nwt :is(.nwttabscroll,.nwtstrook)::-webkit-scrollbar{display:none}
.nwview.nwt .nwttab{appearance:none;background:none;border:0;border-bottom:2px solid transparent;padding:2px 0 0;min-height:44px;font:600 13.5px "IBM Plex Sans",sans-serif;color:var(--ink-2);cursor:pointer;flex:none}
.nwview.nwt .nwttab[aria-current="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.nwview.nwt .nwtdatum{flex:none;margin-left:auto;font-size:12.5px;color:var(--ink-2);white-space:nowrap}
.nwview.nwt .nwtkaartmeer{display:block;width:100%;text-align:left;min-height:44px;padding:0 6px;margin:-6px 0 0;color:var(--accent);font-weight:600}
.nwview.nwt .nwtstrook{padding:8px 16px;overflow-x:auto;scrollbar-width:none}
.nwview.nwt .nwtstrookrij{display:flex;align-items:center;min-width:max-content;min-height:28px;white-space:nowrap;font-size:12px;line-height:1;font-variant-numeric:tabular-nums}
.nwview.nwt .nwtidx{position:relative;display:inline-flex;align-items:center;min-height:28px;gap:6px;padding:0 10px;color:var(--ink);text-decoration:none;flex:none;border-left:1px solid var(--line)}
.nwview.nwt .nwtidx:first-child{border-left:0;padding-left:0}
.nwview.nwt .nwtidx::before{content:"";position:absolute;inset:-8px 0}
.nwview.nwt .nwtidx b{font-weight:600;color:var(--ink-2)}
.nwview.nwt :is(.nwtstand,.nwtpct){font:700 12px/1 "Archivo",sans-serif}
.nwview.nwt :is(.nwtpct,.nwtpospct).up{color:var(--good-text)}
.nwview.nwt :is(.nwtpct,.nwtpospct).down{color:var(--bad-text)}
.nwview.nwt :is(.nwtpct,.nwtpospct).mut{color:var(--ink-3)}
.nwview.nwt .nwtstrookstand{position:sticky;right:-16px;margin-left:auto;padding:0 16px 0 10px;font-size:12px;color:var(--ink-3);background:var(--card)}
.nwview.nwt :is(.nwthoofd,.nwtitem,.nwtkaart){display:flex;flex-direction:column;gap:8px;width:100%;min-height:44px;color:var(--ink);text-decoration:none;text-align:left;appearance:none;background:none;border:0;padding:0;font:inherit;cursor:pointer;overflow-wrap:anywhere}
.nwview.nwt :is(.nwtomslag,.nwtkaartbeeld){display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px}
.nwview.nwt .nwtetiket{margin:0;font:600 11.5px "IBM Plex Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.nwview.nwt .nwtetiket .nwtpct{font-size:11.5px;letter-spacing:0}
.nwview.nwt .nwthoofd .nwtkop{margin:0;font:800 24px/1.15 "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink)}
.nwview.nwt .nwtintro{margin:0;font-size:16px;line-height:1.45;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nwview.nwt .nwtmeta{margin:0;font-size:12.5px;color:var(--ink-3)}
.nwview.nwt :is(.nwtlijst,.nwtmeerlijst){display:flex;flex-direction:column}
.nwview.nwt .nwtlijst{margin-top:12px}
.nwview.nwt :is(.nwtitem,.nwtkaart){padding:12px 0;border-top:1px solid var(--line)}
.nwview.nwt .nwtitem{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:start}
.nwview.nwt .nwtitem.nwtmetfoto{grid-template-columns:minmax(0,1fr) 110px}
.nwview.nwt .nwtitemtxt{min-width:0;display:flex;flex-direction:column;gap:4px}
.nwview.nwt :is(.nwtitem,.nwtkaart) .nwtetiket{font-size:11px}
.nwview.nwt :is(.nwtitem,.nwtkaart) .nwtkop{font:600 18px/1.2 "Archivo",sans-serif;color:var(--ink)}
.nwview.nwt :is(.nwtitem,.nwtkaart) .nwtmeta{font-size:12px}
.nwview.nwt .nwtfoto{width:110px;height:76px;object-fit:cover;border-radius:10px}
.nwview.nwt .nwtkaart{gap:6px}
.nwview.nwt .nwtkaart:first-child{border-top:0;padding-top:0}
.nwview.nwt .nwtkaart:first-child .nwtkop{font-size:21px}
.nwview.nwt .nwtkaarttekst{font-size:13.5px;line-height:1.45;color:var(--ink-2)}
.nwview.nwt .nwitemtxt{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:10px;row-gap:3px;align-items:start}
.nwview.nwt .nwttijd{grid-column:1;grid-row:1 / span 3;display:flex;flex-direction:column;line-height:1.2}
.nwview.nwt .nwttijd b{font:700 14px "Archivo",sans-serif;font-variant-numeric:tabular-nums}
.nwview.nwt .nwttijd i{font-style:normal;font-size:10.5px;color:var(--ink-3)}
.nwview.nwt .nwitemtxt>:is(.nwitemmeta,.nwitemkop,.nwpositie){grid-column:2}
.nwview.nwt .nwtscheiding{flex:none;align-self:center;padding:0 4px 0 10px;font-size:12px;color:var(--ink-3)}
.nwview.nwt .nwtchiprij{position:relative}
.nwview.nwt .nwtchiprij .seg button{min-height:44px}
.nwview.nwt .nwtbijsluiter{white-space:normal;overflow:visible;text-overflow:clip;text-align:right}
.nwview.nwt .nwagrij{grid-template-columns:52px minmax(0,1fr) auto;padding:8px 0;border-top:0;border-bottom:1px solid var(--line)}
.nwview.nwt .nwagdag b{font:700 13px "Archivo",sans-serif}
.nwview.nwt .nwtposlijst{display:flex;flex-direction:column;font-variant-numeric:tabular-nums}
.nwview.nwt .nwtpos{display:flex;align-items:center;gap:8px;min-height:44px;padding:4px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:13px}
.nwview.nwt .nwtpos:first-child{border-top:0}
.nwview.nwt .nwtpos b{font:800 14px "Archivo",sans-serif}
.nwview.nwt .nwtposnaam{font-style:normal;font-size:12px;color:var(--ink-3);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nwview.nwt .nwtposbedrag{color:var(--ink-2)}
.nwview.nwt :is(.nwtpos b,.nwtposbedrag,.nwtpospct,.nwtlivetel){flex:none;white-space:nowrap}
.nwview.nwt .nwtpospct{margin-left:auto;font-weight:600}
.nwview.nwt [data-nwt="dash"]{display:inline-flex;align-items:center;min-height:44px}
.nwview.nwt .nwtliveregel{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;min-height:44px;margin:0 0 6px;border-top:1px solid var(--line);font-size:12.5px;min-width:0}
.nwview.nwt :is(.nwtliveopen,.nwtlivealle){appearance:none;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.nwview.nwt :is(.nwtliveopen,.nwtlivesym,.nwtlivealle){min-height:44px}
.nwview.nwt .nwtlivetel{display:inline-flex;align-items:center;min-height:32px}
.nwview.nwt .nwtliveopen{display:flex;align-items:center;gap:8px;min-width:0;flex:1 1 100%;text-align:left;color:var(--ink)}
.nwview.nwt .nwtliveopen b{font:700 12.5px "Archivo",sans-serif;color:var(--bad-text);font-variant-numeric:tabular-nums;flex:none}
.nwview.nwt .nwtlivekop{font:600 14.5px/1.2 "Archivo",sans-serif;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nwview.nwt :is(.nwtlivesym,.nwtlivealle){font-weight:600;font-size:12.5px;color:var(--accent);text-decoration:none;flex:none;white-space:nowrap}
.nwview.nwt .nwtlivesym{display:inline-flex;align-items:center}
.nwview.nwt .nwtlivetel{color:var(--ink-3)}
.nwview.nwt .nwtlivealle{margin-left:auto}
.nwview.nwt .nwlivetag{color:var(--accent-tekst)}
.nwview.nwt .nwtvoet{margin:6px 0 0;padding:12px 2px 0;border-top:1px solid var(--line);font-size:12px;line-height:1.45;color:var(--ink-3)}
.nwview.nwt :is(.nwttab,.nwtidx,.nwthoofd,.nwtitem,.nwtkaart,.nwtpos,.nwtliveopen,.nwtlivesym,.nwtlivealle,.nwtkaartmeer):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (min-width:960px){
.nwview.nwt .nwgrid>.nwhoofd>:is(.nwkaart,.nwtstrook,.nwstroom,.nwtvoorpagina,.nwtmeer,.pmnieuws){grid-column:1 / -1}
.nwview.nwt .nwgrid>.nwhoofd>.nwsectie:last-child{order:8}
.nwview.nwt .nwgrid>.nwzij{order:9}
.nwview.nwt :is(.nwtkaartmeer,.nwtsubkort){display:none}
.nwview.nwt .nwtsublang{display:block}
.nwview.nwt .nwtvoorpagina{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:28px;align-items:start}
.nwview.nwt .nwtlijst{margin-top:0;border-left:1px solid var(--line);padding-left:24px}
.nwview.nwt .nwtlijst>.nwtitem:first-child{border-top:0;padding-top:0}
.nwview.nwt .nwthoofd .nwtkop{font-size:34px;line-height:1.1}
.nwview.nwt .nwtintro{-webkit-line-clamp:3}
.nwview.nwt :is(.nwtitem,.nwtkaart) .nwtkop{font-size:21px}
.nwview.nwt .nwtmeerlijst{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.nwview.nwt .nwtkaart{border-top:0;padding:0}
.nwview.nwt .nwitemtxt{grid-template-columns:76px minmax(0,1fr);column-gap:16px}
.nwview.nwt .nwtliveopen{flex:1 1 auto}
.nwview.nwt .nwtchiprij>.seg{flex-wrap:wrap}
.nwview.nwt .nwtstrookrij{flex-wrap:wrap;row-gap:16px;min-width:0}
.nwview.nwt .nwtstrookstand{position:static;padding-right:0}
}
@media (max-width:959px){
.nwview.nwt .nwgrid:not(.nzzoek){display:flex;flex-direction:column;gap:12px}
.nwview.nwt .nwgrid:not(.nzzoek)>.nwzij{display:contents}
.nwview.nwt .nwgrid:not(.nzzoek) :is(.nwsectie,.nwkaart){margin-bottom:0}
.nwview.nwt .nwgrid>.nwzij>.nwsectie:nth-child(1){order:8}
.nwview.nwt .nwgrid>.nwhoofd>.nwsectie:last-child{order:9}
.nwview.nwt .nwgrid>.nwzij>.nwsectie:nth-child(3){order:10}
.nwview.nwt .nwgrid>.nwzij>.nwsectie:nth-child(2){order:11}
.nwview.nwt:not(.nwtkaartopen) .nwkaart .vdonder>:is(.nwzinnen,.lekaarttabel,.nwdatum,.vdvoet),.nwview.nwt.nwtliveregel-aan .nwkop .nwlivechip,.nwview.nwt :is(.nwtdatumlang,.nwtstand),.nwview.nwt .nwtkaart:not(:first-child) .nwtkaarttekst{display:none}
.nwview.nwt .nwzoek{margin-bottom:8px}
.nwview.nwt .nwzoek input{min-height:40px;padding-top:8px;padding-bottom:8px}
.nwview.nwt .nwttabs{gap:8px;padding:0 10px}
.nwview.nwt .nwttabscroll{gap:14px}
.nwview.nwt .nwttab{font-size:12.5px}
.nwview.nwt .nwttabrij::after{content:"";position:absolute;right:0;top:0;bottom:0;width:28px;background:linear-gradient(90deg,transparent,var(--card));pointer-events:none}
.nwview.nwt .nwtchiprij::after{content:"";position:absolute;right:1px;top:2px;bottom:6px;width:28px;border-radius:0 9px 9px 0;background:linear-gradient(90deg,transparent,var(--seg-bg));pointer-events:none}
.nwview.nwt .nwtlivekop{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.nwview.nwt .nwtstrookstand{right:-12px;padding-right:12px}
.nwview.nwt .nwtstandlang{display:none}
.nwview.nwt .nwtdatumkort{display:flex;flex-direction:column;align-items:flex-end;font-size:11px;line-height:1.25}
.nwview.nwt .nwtstrook{padding:4px 12px}
.nwview.nwt .nwtstrookrij{min-height:36px}
.nwview.nwt .nwtidx{min-height:36px}
.nwview.nwt .nwtidx::before{inset:-4px 0}
.nwview.nwt .nwtkaart:not(:first-child) .nwtkop{font-size:19px}
.nwview.nwt .nwtkaart:not(:first-child).nwtmetfoto{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:4px 12px;align-items:start}
.nwview.nwt .nwtkaart:not(:first-child) .nwtkaartbeeld{width:110px;height:76px;aspect-ratio:auto;border-radius:10px;grid-column:2;grid-row:1 / span 3}
}
@media (prefers-reduced-motion: no-preference){.nwview.nwt :is(.nwttab,[data-nwtrubriek],.nwtpct){transition:color .12s ease,border-color .12s ease,background-color .12s ease}}
/* nwtbeheer (C2): de kaart Nieuws: rubrieken op Eenvoudig en in Onderdelen; tikdoelen 44 px, plakkende knoppenrij, alleen tokens */
.nwtbhkaart.bhkaart,.nwtbokaart.bokaart{overflow:visible}
.nwtbeheer{display:flex;flex-direction:column;gap:10px;min-width:0;overflow-wrap:anywhere;font-size:13.5px;color:var(--ink)}
.nwtbeheer :is(p,fieldset,label){margin:0}
.nwtbeheer label{font:inherit;letter-spacing:0;text-transform:none;color:var(--ink)}
.nwtbeheer fieldset{border:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:12px}
.nwtbeheer :is(.bhknop,select,input){min-height:44px}
.nwtbeheer :is(select,input){border:1px solid var(--line-2);border-radius:10px;background:var(--input-bg);color:var(--ink);font:inherit;padding:0 10px;max-width:100%;min-width:0}
.nwtbeheer .nwtfoutveld{border-color:var(--bad)}
.nwtbeheer .bhknop[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.nwtbeheer :is(.nwtpijl,.nwtwoord-kruisje){min-width:44px}
.nwtbeheer .nwtlaad{align-self:flex-start}
.nwtbeheer :is(.nwthint,.nwttel,.nwtreden,.nwtvbnu,.nwtvbblijft,.nwtbewaard.nwtnogniet){font-size:12.5px;font-weight:400;color:var(--ink-3)}
.nwtbeheer .nwtkop2{font-weight:700}
.nwtbeheer :is(.nwtrij,.nwtcatrij,.nwtvbrij){padding:8px 0;border-top:1px solid var(--line)}
.nwtbeheer :is(.nwtrij,.nwtterugvalrij,.nwtwoordrij,.nwtvbrij,.nwtvbacties,.nwtknoppen,.nwtlabel,.nwtvbchips){display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.nwtbeheer .nwtnaam{flex:1 1 150px}
.nwtbeheer :is(.nwtrijhint,.nwtvbtitel,.nwtfoutregel,.nwtstatus){flex:1 1 100%}
.nwtbeheer .nwtcatrij{display:grid;grid-template-columns:1fr;gap:6px}
.nwtbeheer .nwtklapin{display:flex;flex-direction:column;gap:6px;padding:4px 0}
.nwtbeheer .nwtwoordrij{gap:6px;padding:6px 0}
.nwtbeheer .nwtwoord{display:inline-flex;align-items:center;min-height:44px;padding-left:10px;border:1px solid var(--line);border-radius:22px;font-size:13px}
.nwtbeheer .nwtwoord-kruisje{appearance:none;border:0;background:none;color:var(--ink-2);min-height:44px;font-size:18px;cursor:pointer}
.nwtbeheer .nwtwoordnieuw{flex:1 1 160px}
.nwtbeheer .nwtvbchips{gap:4px;min-height:0;margin:0}
.nwtbeheer :is(.nwtvbchip,.nwtscheiding){padding:6px 11px;font-size:12px;font-weight:600;color:var(--ink-2)}
.nwtbeheer .nwtscheiding{padding-right:0;font-weight:400;color:var(--ink-3)}
.nwtbeheer .nwtvbrij{gap:4px 10px;font-size:13px}
.nwtbeheer .nwtvbwordt{color:var(--good-text);font-weight:600}
.nwtbeheer .nwtknoppen{position:sticky;bottom:0;padding:10px 0;background:var(--card);border-top:1px solid var(--line)}
.nwtbeheer .nwtbewaard{color:var(--good-text);font-weight:600}
.nwtbeheer .nwtfoutregel{color:var(--bad-text)}
.nwtbeheer .nwtstatus{color:var(--ink-2)}
.nwtbeheer .nwtmigratie{padding:8px 10px;border:1px solid var(--gold);border-radius:10px}
.nwtbeheer :is(.bhknop,select,input,.nwtwoord-kruisje):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:759px){.nwtbeheer .nwtrij .nwtpijl{order:2}}
@media (min-width:760px){.nwtbeheer .nwtcatrij{grid-template-columns:minmax(0,1fr) auto;align-items:center}}
/* ===== v25.58 NIEUWSTAB (einde) ===== */
/* ===== v25.58 VASTGOED-DELEN (begin) ===== */
/* v25.58 — VASTGOEDDELEN */
/* v25.58 (VASTGOED-DELEN, client): staart vastgoed-delen - herstelronde 1: + .vgl-telt (de uitlegregel onder de schakelaar Meetellen) en .iconbtn.vglshr (de deelknop op de vastgoedrij); de anonieme vastgoedkaart in de chat naast de andere portefeuillekaarten (het kleine huis dat volloopt tot het deel van jou, dezelfde kop, tegels en pillen als .cdn2pf), de vastgoedpagina dicht zodra de community open staat (vangnet naast het omhulsel om setView), de vastgoedrij in de positielijst van Alles, het label Vastgoed op de stroomknoop en de zin in de deelsheet en op de deelpagina; alleen tokens, geen hex, geen id-selector, geen voorrangsvlag; licht en donker via de tokens, telefoon en desktop */
.feedmode > .vgd-pagina{display:none}
.vglkaart .vgl-huis{display:flex;justify-content:center;margin:10px 0 2px}
.vglkaart .vgl-huis svg{width:118px;max-width:60%;height:auto;display:block}
.vglkaart .vgl-huis .vgl-dak,.vglkaart .vgl-huis .vgl-muur{fill:none;stroke:var(--ink-2);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.vglkaart .vgl-huis .vgl-vul{fill:var(--accent);opacity:.85}
.vglkaart .herosub{margin-top:4px}
.vglkaart .statgrid{margin-top:10px}
.vglkaart .deltas .pill{white-space:nowrap}
.vgl-anoniem{margin:6px 0 10px;color:var(--ink-2);font-size:12.5px;line-height:1.45}
.vgl-shpos{padding:14px 4px;color:var(--ink-2);font-size:13.5px;line-height:1.5}
.pflabel.vgl-label{margin-left:6px;font-size:10.5px;color:var(--ink-2);vertical-align:middle}
.apfknoop.vglknoop .apfnaam .vgl-label{font-weight:500}
.prow.vgl-rij .pleft b{display:flex;align-items:center;gap:2px;flex-wrap:wrap}
.prow.vgl-rij .pleft span{color:var(--ink-2)}
.prow.vgl-rij .vgl-pday{color:var(--ink-2)}
.vgl-telt{margin:6px 0 0;color:var(--ink-2);font-size:12.5px;line-height:1.45}
.iconbtn.vglshr svg{width:16px;height:16px;display:block}
@media (max-width:480px){.vglkaart .vgl-huis svg{width:96px}}
/* ===== v25.58 VASTGOED-DELEN (einde) ===== */
/* ===== v25.58 STATISTIEKEN (begin) ===== */
/* v25.58 — STATISTIEKEN */
/* v25.58 (STATISTIEKEN, client): staart statistieken (blok v25.58 statistieken) - de tab Statistieken op /beheer (Rabi 20-9: "een analytics gedeelte ... hoeveel bezoekers per dag, hoeveel uniek, welke artikelen, via waar ze komen, welke tabs"): het paneel als kolom van kaarten, de periodeknoppen Vandaag | Laatste 7 dagen | Laatste 30 dagen van 44 px, het staafgrafiekje van 30 dagen in het accent (uniek lichter) met aslabels als html van 11 px naast en onder de svg (herstelronde 1, browserbevinding 1: in de svg schaalden ze op 390 px naar 6 px), de balkjes in de tabellen en lijsten, de urenstaafjes, de voetregel, de zin als IP_ZOUT ontbreekt en de rij onbekend; en de wikkelregel voor zes zichtbare tabknoppen (3 + 3 onder 1024 px); alleen tokens, geen hex, geen id-selector */
.bhview .sggrid{grid-template-columns:1fr;padding-bottom:calc(12px + env(safe-area-inset-bottom))}
.bhview .sggrid .stazin{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.bhview .sggrid .staseg{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
.bhview .sggrid .staseg .bhknop{min-height:44px;flex:1 1 110px}
.bhview .sggrid .staseg .bhknop[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);background:var(--accent-wash)}
.bhview .sggrid .staseg .stavers{flex:0 1 auto;color:var(--ink-2)}
.bhview .sggrid .stastatus{margin:6px 0 0;min-height:1.2em;font-size:12.5px;color:var(--good-text)}
.bhview .sggrid .stastatus:empty{display:none}
.bhview .sggrid .staleeg{margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--ink-2)}
.bhview .sggrid .stastaven{color:var(--accent);margin:8px 0 0;max-width:720px;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 18px;column-gap:6px}
.bhview .sggrid .stastaven svg{display:block;width:100%;height:auto;aspect-ratio:640 / 140;grid-column:2;grid-row:1}
.bhview .sggrid .stastaaf{fill:currentColor;opacity:.9}
.bhview .sggrid .stauniek{fill:var(--card);opacity:.55}
.bhview .sggrid .stagrid{stroke:var(--chart-grid);stroke-width:1}
.bhview .sggrid .staasy{grid-column:1;grid-row:1;position:relative;min-width:3ch}
.bhview .sggrid .staasx{grid-column:2;grid-row:2;position:relative}
.bhview .sggrid .stalabel{position:absolute;font-size:11px;line-height:1;color:var(--ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.bhview .sggrid .staasy .stalabel{right:0;transform:translateY(-50%)}
.bhview .sggrid .staasx .stalabel{top:4px;transform:translateX(-50%)}
.bhview .sggrid .stazout{color:var(--bad-text)}
.bhview .sggrid .staonbekend td{color:var(--ink-2);font-style:italic}
.bhview .sggrid .statabel td.num,.bhview .sggrid .statabel th:nth-child(n+2){text-align:right;white-space:nowrap}
.bhview .sggrid .statitel{display:inline-block;max-width:min(60vw,420px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.bhview .sggrid .stabalk{display:inline-block;width:64px;height:8px;border-radius:999px;background:var(--hl-bg);vertical-align:middle;margin-right:6px;overflow:hidden}
.bhview .sggrid .stabalk i{display:block;height:100%;border-radius:999px;background:var(--accent)}
.bhview .sggrid .stalijst{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px}
.bhview .sggrid .stalijst li{display:grid;grid-template-columns:minmax(72px,1fr) auto auto;gap:8px;align-items:center;font-size:13px;color:var(--ink)}
.bhview .sggrid .stalijst .stabalk{width:min(28vw,120px)}
.bhview .sggrid .stalijst .stagetal{color:var(--ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.bhview .sggrid .stauren{display:flex;align-items:flex-end;gap:2px;height:72px;margin:8px 0 0;padding:0 2px;border-bottom:1px solid var(--line)}
.bhview .sggrid .stauren i{flex:1 1 0;min-height:2px;border-radius:2px 2px 0 0;background:var(--accent);opacity:.85}
.bhview .sggrid .staurenas{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-3);margin-top:4px}
.bhview .sggrid .stavoet{margin:4px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-2);overflow-wrap:anywhere}
.bhview .sggrid .stauit,.bhview .sggrid .stamigratie{overflow-wrap:anywhere}
.bhview .sggrid .bhkaart{min-width:0}
/* zes zichtbare tabknoppen (Eenvoudig en Klassiek verborgen; BETAALD-EN-GRATIS zet de eerste drie op 30 % en de knoppen vanaf de zesde op 44 %): met de klasse statabs (gezet door het blok) alle knoppen 30 % zodat ze onder 1024 px in 3 + 3 wikkelen en de laatste knop niet alleen op een derde rij staat; specificiteit boven de 44 %-regel */
@media (max-width:1023px){.bhview .bktabs.brtabs.statabs button:first-child:nth-last-child(n+7) ~ button:nth-child(n+6),.bhview .bktabs.brtabs.statabs button:first-child:nth-last-child(n+7){flex:1 1 30%;min-width:40px}}
/* ===== v25.58 STATISTIEKEN (einde) ===== */
/* ===== v25.58 NIEUWSTABVERVOLG (begin) ===== */
/* v25.58 — NIEUWSTABVERVOLG */
/* v25.58 (NIEUWS-TAB-VERVOLG, client): staart nieuws-tab-vervolg (blok v25.58 nieuws-tab) - compacter op de telefoon, alleen onder .nwview.nwt en alleen onder 960 px (Rabi 20-9 besluit 12: "Hoofdartikel-top 831 px: COMPACTER (vaste kop, zoekveld, liveblogregel compacter)"): de vaste kop kleiner met de subkop verborgen, het zoekveld lager (blijft zichtbaar en vulbaar, letter 16 px), de knoppenrij en de datumregel strakker, de dichte liveblogkaart met kop, subregel (blijft zichtbaar) en LIVE-regel dichter op elkaar, kolomafstand 10 px; alleen tokens, geen nieuwe kleuren, geen nieuwe selectors buiten de pagina Nieuws */
@media (max-width:959px){
.nwview.nwt .nwkop{margin-bottom:6px;gap:8px}
.nwview.nwt .nwkop .viewkop{font-size:18px;line-height:1.2}
.nwview.nwt .nwkop .viewsub{display:none}
.nwview.nwt .nwttabs{margin:-4px 0 6px}
.nwview.nwt .nwtdatumkort{line-height:1.2}
.nwview.nwt .nwzoek{margin:0 0 6px}
.nwview.nwt .nwzoek input{min-height:36px;padding-top:6px;padding-bottom:6px}
.nwview.nwt .nwgrid:not(.nzzoek){gap:10px}
.nwview.nwt .nwstroom.lbdicht{padding-top:10px;padding-bottom:8px}
.nwview.nwt .nwstroom.lbdicht .lbkop{margin-bottom:4px}
.nwview.nwt .nwstroom.lbdicht .lbsub{margin:-2px 0 0;font-size:11.5px;line-height:1.3}
.nwview.nwt .nwtliveregel{margin:0}
}
/* ===== v25.58 NIEUWSTABVERVOLG (einde) ===== */
/* ===== v25.58 NIEUWSSLIM (begin) ===== */
/* v25.58 — NIEUWSSLIM */
/* v25.58 (NIEUWS-SLIM, client): staart nieuws-slim (blok v25.58 nieuws-slim) - de eerlijke sorteerzin met knop op de Voorpagina van Nieuws (.nslzin, .nsltekst, .nslknop; op een breed scherm over beide kolommen van het raster), de sector-treffer in het etiket (.nslwaarom) en de tellerregel op de budgetkaart in Beheer (.nslteller); alleen tokens, geen hex, geen id-selector, tikdoel 44 px, reduced motion; 20-9, Rabi: "Laat AI uitzoeken waar elk artikel over gaat ... en het zo persoonlijk mogelijk aan de lezer te maken" */
.nwview .nslzin{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:0 12px;margin:0 0 8px;font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.nwview .nslzin .nsltekst{flex:1 1 240px;min-width:0}
.nwview .nslknop{min-height:44px;margin:0;padding:10px 0;font:600 13px/1.2 "IBM Plex Sans",sans-serif;color:var(--accent-tekst);background:none;border:0;border-radius:6px;cursor:pointer;white-space:nowrap}
.nwview .nslknop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.nwview .nslwaarom{color:var(--ink-2)}
.bhview .nslteller{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--ink-2);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.bhview .nslteller.nslfout{color:var(--bad-text)}
@media (prefers-reduced-motion: no-preference){.nwview .nslknop{transition:color .12s ease}}
/* ===== v25.58 NIEUWSSLIM (einde) ===== */
/* ===== v25.58 RENTE2 (begin) ===== */
/* v25.58 — RENTE2 */
/* v25.58 (RENTE-2): staart rente-2 (blok v25.58 rente-2) - de rentekaart op Nieuws (.rn2kaart: kop, lijst met vier regels, uitklaptabel, knop, voet) en de marktrentecel bij een obligatiepositie (.rn2pos, dezelfde markup als de bestaande .tkpst-cellen, geen eigen regel nodig); alleen tokens, tikdoel 44 px, focus-visible, geen beweging; de kleur op de dagverandering via de bestaande klassen kpos/kneg met de app-tokens, de stand zelf neutraal; 20-9, Rabi 16-9 "rente: onderzoek klaar, bouwen" */
.rn2kaart .rn2kop{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 8px}
.rn2kaart .rn2kop h2{margin:0;font:800 17px "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink)}
.rn2kaart .rn2kop .rn2sub{margin:0;font-size:12px;color:var(--ink-2);text-align:right;overflow-wrap:anywhere}
.rn2kaart .rn2lijst{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.rn2kaart .rn2rij{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:baseline;min-height:28px;font-size:13.5px;color:var(--ink)}
.rn2kaart .rn2pct{font-variant-numeric:tabular-nums}
.rn2kaart .rn2bp{font-size:12.5px;color:var(--ink-2);font-variant-numeric:tabular-nums;min-width:52px;text-align:right}
.rn2kaart .rn2bp.kpos{color:var(--good-text)}
.rn2kaart .rn2bp.kneg{color:var(--bad-text)}
.rn2kaart .rn2meer{min-height:44px;padding:0 4px;color:var(--accent)}
.rn2kaart .rn2meer:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.rn2kaart .rn2tabel{margin-top:8px}
.rn2kaart .rn2tabel table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.rn2kaart .rn2tabel th,.rn2kaart .rn2tabel td{padding:6px 4px;text-align:right;border-top:1px solid var(--line);color:var(--ink);white-space:nowrap}
.rn2kaart .rn2tabel th{color:var(--ink-2);font-weight:600}
.rn2kaart .rn2tabel th:first-child,.rn2kaart .rn2tabel td:first-child{text-align:left;white-space:normal;overflow-wrap:anywhere}
.rn2kaart .rn2voet{font-size:12.5px;color:var(--ink-2);margin:10px 0 0;line-height:1.45}
.rn2kaart .rn2voet a{color:var(--accent)}
.rn2kaart .rn2voet .rn2verouderd{color:var(--ink);font-weight:600}
/* v25.58 (RENTE-2, hersteller): de verouderd-noot in de voet valt op in de gewone inktkleur, geen oordeelskleur (harde regel 4) */
.nwview.nwt .rn2kaart{order:4}
@media (max-width:759px){.rn2kaart .rn2tabel table{font-size:12px}.rn2kaart .rn2tabel th,.rn2kaart .rn2tabel td{padding:6px 2px}}
/* ===== v25.58 RENTE2 (einde) ===== */
/* ===== v25.58 VASTGOEDNAZORG4 (begin) ===== */
/* v25.58 — VASTGOEDNAZORG4 */
/* v25.58 (VASTGOED-NAZORG-4): staart vastgoed-nazorg-4 - het tekstvak en de tellerregel van de kaart "Kloppen je vastgoedgegevens?"; de kaart zelf hergebruikt .fbpop van de bestaande feedbackvraag; alleen tokens */
.fbpop .vn4-tekst{display:grid; gap:6px; width:100%; margin-top:6px}
.fbpop .vn4-tekst label{font-size:12.5px; color:var(--ink-2); text-transform:none; letter-spacing:0} /* v25.58 (VASTGOED-NAZORG-4, hersteller): tegenlezer punt 2 - het label erft label{text-transform:uppercase}; hier gewone letters */
.fbpop .vn4-tekst textarea{width:100%; min-height:72px; resize:vertical; font:inherit; font-size:13.5px; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--card); color:var(--ink)}
.fbpop .vn4-rij{display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; color:var(--ink-2)}
.fbpop .vn4-later{font-size:12.5px; color:var(--ink-2)}
/* ===== v25.58 VASTGOEDNAZORG4 (einde) ===== */
/* ===== v25.58 HUISSTIJL (begin) ===== */
/* v25.58 — HUISSTIJL */
/* v25.58 (HUISSTIJL, client): staart huisstijl (blok v25.58 huisstijl) - het vierde thema De Belegger-blauw op html[data-theme=dark][data-huisstijl=belegger], alle tokens uit de kop (--merk-*; geen hex), de logokleuren in licht en donker (--glow, --user-bubble en --accent-verloop in donker, --accent-donker in licht) en de themakeuze met vier standen in het menu (.hstgroep); Rabi 20-9: "leden krijgen thema-opties (licht, donker, systeem, De Belegger-blauw); vaste kleuren uit het nieuwe logo mogen door de hele site"; hersteller 20-9 20:40 (Rabi: "echt donkerder achtergrond ... bijna tegen zwart aan ... neon achtig lichter blauw als afscheidingen ... wit als gewoon tekst" en 20:42 "Ook zwart moet een rol spelen zoals zijn haar"): grond bijna zwart blauw, kaarten een stap lichter, neonlijnen als afscheiding en focusring, witte tekst, echt zwart op de tabbalk en de koersstrook (de twee vaste plekken); licht en donker ongewijzigd */
:root{--glow:color-mix(in srgb, var(--merk-ring) 26%, transparent);--user-bubble:color-mix(in srgb, var(--merk-konings) 55%, var(--card));--accent-verloop:linear-gradient(135deg, var(--merk-neon), var(--merk-licht))}
:root[data-theme="light"]{--glow:color-mix(in srgb, var(--merk-ring) 10%, transparent);--accent-donker:var(--merk-konings)}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]){--glow:color-mix(in srgb, var(--merk-ring) 10%, transparent);--accent-donker:var(--merk-konings)}}
:root[data-theme="dark"][data-huisstijl="belegger"]{--ground:var(--merk-grond-nacht);--card:var(--merk-kaart-nacht);--card-2:var(--merk-kaart-nacht-licht);--line:color-mix(in srgb, var(--merk-neon-lijn) 55%, transparent);--line-2:var(--merk-neon-lijn);--ink:var(--merk-op-blauw);--ink-2:var(--merk-wit-blauw);--ink-3:color-mix(in srgb, var(--merk-wit-blauw) 70%, var(--merk-kaart-nacht));--accent:var(--merk-neon-accent);--accent-tekst:var(--merk-grond-nacht);--accent-wash:color-mix(in srgb, var(--merk-neon-accent) 16%, transparent);--accent-donker:color-mix(in srgb, var(--merk-neon-accent) 80%, var(--merk-grond-nacht));--accent-lijn:var(--merk-neon-lijn);--accent-verloop:linear-gradient(135deg, var(--merk-op-blauw), var(--merk-neon-accent));--user-bubble:var(--merk-kaart-nacht-licht);--input-bg:var(--merk-nacht-diep);--seg-bg:var(--merk-nacht-diep);--tt-bg:var(--merk-nacht-diep);--stat-bg:color-mix(in srgb, var(--merk-op-blauw) 4%, transparent);--hl-bg:color-mix(in srgb, var(--merk-neon-lijn) 18%, transparent);--chart-grid:color-mix(in srgb, var(--merk-neon-lijn) 22%, transparent);--chart-grid-2:color-mix(in srgb, var(--merk-neon-lijn) 9%, transparent);--bench-aex:var(--merk-neon-accent);--big-a:var(--merk-op-blauw);--big-b:var(--merk-neon-accent);--glow:color-mix(in srgb, var(--merk-neon-lijn) 34%, transparent);--nw-blauw:var(--merk-neon-accent);--shadow:0 0 0 1px color-mix(in srgb, var(--merk-neon-lijn) 35%, transparent), 0 0 14px color-mix(in srgb, var(--merk-neon-gloed) 55%, transparent), 0 10px 40px color-mix(in srgb, var(--merk-zwart) 70%, transparent)}
:root[data-theme="dark"][data-huisstijl="belegger"] .tabbar{background:var(--merk-zwart)}
:root[data-theme="dark"][data-huisstijl="belegger"] .tape{background:var(--merk-zwart)}
.meermenu .hstgroep{display:flex;flex-direction:column;gap:2px;margin-top:4px;padding-top:4px;border-top:1px solid var(--line)}
.meermenu .hstkop{padding:6px 10px 2px;font:600 11.5px "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.meermenu .hstoptie{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 10px}
.meermenu .hstoptie .hststip{flex:none;width:16px;height:16px;border-radius:50%;border:2px solid var(--line-2)}
.meermenu .hstoptie[aria-checked="true"]{color:var(--accent)}
.meermenu .hstoptie[aria-checked="true"] .hststip{border-color:var(--accent);background:var(--accent);box-shadow:inset 0 0 0 3px var(--card)}
.meermenu .hstoptie .hsttekst{display:flex;flex-direction:column;line-height:1.25}
.meermenu .hstoptie .hstsub{font-size:11.5px;font-weight:400;color:var(--ink-3)}
.meermenu .hstoptie:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
/* ===== v25.58 HUISSTIJL (einde) ===== */
/* ===== v25.58 NIEUWSKOP (begin) ===== */
/* v25.58 — NIEUWSKOP */
/* v25.58 (NIEUWS-KOP, client): staart nieuws-kop (blok v25.58 nieuws-kop) - de pagina Nieuws compacter en nieuwsgedreven onder .nwview.nwt.nwk: de kop met het beeldmerk en woordmerk De Belegger (.nwklogo) naast de menuknop, het zoekicoon rechts (.nwkzoekknop) en de indexstrook (.nwtstrook, door het blok naar de kop verplaatst) als tweede regel onder 960 px en op dezelfde regel erboven; de titel en de subkop alleen voor schermlezers, de kopknop Alle updates en de datumregel verborgen (de vertraging staat in de strook en de voet), het zoekveld weggeklapt tot het opent, de portefeuillekaart afgekapt na de dagstandbalk met de uitklapknop .nwkpfknop eronder (Rabi 20-9 18:00: "afkappen na die groene balk ... de rest uitklapbaar"), de subregel van de dichte liveblogkaart weg onder 960 px; alleen tokens, geen nieuwe kleuren; Rabi 20-9: "Bovenste waar allemaal tekst staat is onnodig. Daar mag je de tickers neer zetten en De Belegger logo." en "moet echt kleiner, compacter en nieuws gedreven" */
.nwview.nwt.nwk .nwkop{position:relative;flex-wrap:wrap;row-gap:6px}
.nwview.nwt.nwk .nwkop .viewtitel{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.nwview.nwt.nwk .nwkop .nwlivechip{display:none}
.nwview.nwt.nwk .nwklogo{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink);flex:none}
.nwview.nwt.nwk .nwkbeeld{display:block;width:32px;height:32px;flex:none}
.nwview.nwt.nwk .nwkbeeld img{display:block;width:32px;height:32px;border-radius:50%}
.nwview.nwt.nwk .nwkwoord{font:800 17px/1 "Archivo",sans-serif;letter-spacing:-.01em;color:var(--ink)}
.nwview.nwt.nwk .nwkzoekknop{appearance:none;background:none;border:0;padding:0;margin-left:auto;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;color:var(--ink-2);cursor:pointer;border-radius:12px;flex:none}
.nwview.nwt.nwk .nwkzoekknop svg{width:22px;height:22px}
.nwview.nwt.nwk .nwkzoekknop[aria-expanded="true"]{color:var(--accent)}
.nwview.nwt.nwk :is(.nwkzoekknop,.nwkpfknop):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.nwview.nwt.nwk .nwkop .nwtstrook{flex:1 1 100%;min-width:0;background:none;border:0;box-shadow:none;border-radius:0;padding:4px 0;margin:0}
.nwview.nwt.nwk .nwkop .nwtstrookstand{right:0;padding-right:0;color:var(--ink-2);background:var(--ground)}
.nwview.nwt.nwk .nwkop .nwkstandvertraagd{font-size:11px;color:var(--ink-2)}
.nwview.nwt.nwk .nwttabs .nwtdatum{display:none}
.nwview.nwt.nwk:not(.nwkzoekopen) .nwzoek{position:absolute;left:0;right:0;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0}
.nwview.nwt.nwk .nwkaart{margin-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}
.nwview.nwt.nwk .nwkpfknop{appearance:none;display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:44px;margin:0 0 14px;padding:0 14px;border:1px solid var(--line);border-top:0;border-radius:0 0 18px 18px;background:var(--card);color:var(--accent);font:600 13px/1.2 "IBM Plex Sans",sans-serif;text-align:center;cursor:pointer}
.nwview.nwt.nwk .nwkpfchev{flex:none;color:var(--ink-3);transform:rotate(90deg)}
.nwview.nwt.nwk .nwkpfknop[aria-expanded="true"] .nwkpfchev{transform:rotate(-90deg)}
.nwview.nwt.nwk.nwkpfdicht .nwkaart .vdboven>:is(.vdbalk,.vddagrij)~:not(.vdbalk),.nwview.nwt.nwk.nwkpfdicht .nwkaart .vdonder,.nwview.nwt.nwk.nwkpfdicht .nwkaart:not(.vdkaart)>.nwdag~*,.nwview.nwt.nwk.nwkpfdicht .nwtkaartmeer,.nwview.nwt.nwk .nwgrid.nzzoek .nwkpfknop{display:none}
.nwview.nwt.nwk .nwgrid>.nwhoofd>.nwkpfknop{grid-column:1 / -1;order:1}
@media (max-width:959px){
.nwview.nwt.nwk .nwkop .nwtstandlang{display:none}
.nwview.nwt.nwk .nwstroom.lbdicht .lbsub{display:none}
}
@media (min-width:960px){
.nwview.nwt.nwk .nwkop{flex-wrap:nowrap}
.nwview.nwt.nwk .nwkop .nwtstrook{flex:1 1 0;margin-left:8px;overflow-x:auto;padding:8px 0}
.nwview.nwt.nwk .nwkop .nwtstrookrij{flex-wrap:nowrap;min-width:max-content;row-gap:0;min-height:28px}
.nwview.nwt.nwk .nwkop .nwtidx{min-height:28px}
.nwview.nwt.nwk .nwkop .nwtstrookstand{position:sticky;right:0}
.nwview.nwt.nwk .nwkop .nwkstandvertraagd{display:none}
.nwview.nwt.nwk .nwkop .nwkzoekknop{order:9;margin-left:8px}
}
/* ===== v25.58 NIEUWSKOP (einde) ===== */
/* ===== v25.58 STARTPAGINATABS (begin) ===== */
/* v25.58 — STARTPAGINATABS */
/* v25.58 (STARTPAGINA-EN-TABS, client): staart startpagina-en-tabs - de slotkaart van een betaalde tab voor een gratis account (klasse sptslot op de schermwortel) en de twee beheersecties Startpagina en Tabs; alleen tokens, geen id-selector, geen voorrangsvlag */
/* de inhoud van de tab gaat weg via de klasse, nooit via hidden; view-ontdek krijgt elders display:flex op id-specificiteit, daarom hier ook visibility, max-height en overflow, zonder id-selector en zonder voorrangsvlag */
.screen.sptslot > .kanaalview, .screen.sptslot > .view, .screen.sptslot > .rail { display: none; visibility: hidden; max-height: 0; min-height: 0; overflow: hidden; margin: 0; padding: 0; border: 0; opacity: 0; pointer-events: none }
.screen.sptslot[data-view="dash"] > section.card:not(.sptslotkaart) { display: none }
.sptslotkaart { margin: 12px auto 0; max-width: 560px; padding: 8px 0 }
.sptsectie .sptweergave { color: var(--ink-3); font-size: 13px; margin: 0 0 10px }
.sptsectie .sptuit { color: var(--ink-2) }
.sptsectie .sptkeuzes { display: grid; gap: 8px }
.sptsectie .sptkeuze { display: flex; align-items: center; gap: 10px; min-height: 44px; color: var(--ink) }
.sptsectie .sptkeuze input { width: 20px; height: 20px; accent-color: var(--accent); flex: 0 0 auto }
.sptsectie .sptkeuze span { font-size: 15px; font-weight: 500; text-transform: none; letter-spacing: normal; color: var(--ink) }
/* ===== v25.58 STARTPAGINATABS (einde) ===== */
/* ===== v25.58 MEDIAGROOT (begin) ===== */
/* v25.58 — MEDIAGROOT */
/* v25.58 (MEDIA-GROOT, client): staart media-groot (blok v25.58 media-groot) - de tweede regel in de chip met voortgangsbalk, percentage en knop, de videotegel en de korte feiten in de chip, de videokaart met poster, afspeelknop, duur en grootte, het video-element na een tik, de terugval en de lege kaart, Video weghalen, de origineel-knop in de lichtbak, het gedempte plus-item voor nieuwe leden en de omrekenregels van de kaarten Getallen; alleen tokens, geen hex, geen id-selector; tikdoelen 44 px op een aanraakscherm en onder 768 px; 19-9, Rabi: "30 mb voor foto's en 200mb voor videos voor gratis gebeuikers en 50 mb en 1gb voor video voor leden." */
.clfvoor.mgvoor{flex-wrap:wrap;row-gap:12px}
.mgvoortegel{width:56px;height:56px;border-radius:8px;display:grid;place-items:center;background:var(--seg-bg);color:var(--ink-2);flex:0 0 auto}
.mgvoorregel{flex:1 1 100%;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink-3);min-width:0}
.mgstand{position:relative;flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mgsr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.mgpct{flex:0 0 auto;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.mgbalk{flex:1 1 60px;height:4px;border-radius:2px;background:var(--line);overflow:hidden}
.mgbalk>i{display:block;height:100%;width:var(--mgp,0%);background:var(--accent);transition:width .2s}
.mgknopklein{appearance:none;flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--ink-2);border-radius:14px;padding:0 12px;font:inherit;font-size:12px;cursor:pointer;min-height:28px}
.mgknopklein:focus-visible,.mgspeel:focus-visible,.mgvideoweg:focus-visible,.mggrootopen:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.mgvoorregel.mgfout{flex-wrap:wrap}
.mgvoorregel.mgfout .mgstand{flex:1 1 100%;white-space:normal;color:var(--ink-2)}
.mgvoor .mgvoorregel.mguitleg{color:var(--ink-2)}
.mgvoor .mguitleg{flex:1 1 100%;font-size:12px;line-height:1.4;color:var(--ink-3)}
.cdnplusitem.mgnieuw .cdnplustekst{color:var(--ink-3)}
.cdnplusitem.mgnieuw .cdnplustekst b{color:var(--ink-2)}
.cdnbijlage.mgvideokaart{padding:0;overflow:hidden;border-radius:14px;background:var(--card-2)}
.mgvideovlak{position:relative;margin:0 auto;aspect-ratio:var(--mgratio,16/9);max-height:360px;background:var(--ground);display:grid;place-items:center;overflow:hidden}
.mgposter{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mgspeel{position:relative;appearance:none;border:1px solid var(--line);width:64px;height:64px;border-radius:32px;background:var(--card);color:var(--ink-2);display:grid;place-items:center;cursor:pointer;padding:0}
.mgmeta{position:absolute;left:10px;bottom:10px;display:flex;gap:6px}
.mgmeta span{font-size:11px;padding:2px 8px;border-radius:10px;background:var(--card);color:var(--ink-2)}
.mgvideo{display:block;width:100%;max-height:360px;background:var(--ground)}
.mgvideoleeg{padding:12px 14px;font-size:12px;color:var(--ink-3);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.mgvideoleeg .cdnkknop{min-height:36px;display:inline-flex;align-items:center;text-decoration:none}
.mgvideoweg{margin:8px 10px 10px}
.mggrootopen{text-decoration:none}
.mggroothint{font-size:12px;color:var(--ink-2);margin-right:auto}
.bhview .bggrid .mgom{margin:2px 0 8px}
.bhview .bggrid .mgverbruik{margin:4px 0 8px;color:var(--ink)}
@media (max-width:600px){.mgvideovlak,.mgvideo{max-height:320px}}
@media (pointer:coarse),(max-width:767px){.mgknopklein{min-height:44px;padding:0 14px}.mgvideoweg,.mgvideoleeg .cdnkknop,.mggrootopen{min-height:44px}}
@media (max-width:767px){.cdnplusitem.mgnieuw .cdnplustekst small{display:block}}
/* ===== v25.58 MEDIAGROOT (einde) ===== */
/* ===== v25.58 REDACTIEVRIJ2 (begin) ===== */
/* v25.58 — REDACTIEVRIJ2 */
/* v25.58 (REDACTIE-VRIJ-2, client): staart redactie-vrij-2 (blok v25.58 redactie-vrij-2) - de leesnaam-chip Macro / Ander nieuws in de nieuwslijst (.rv2chip, tikbaar), de twee knoppen naast het tickerveld van Beheer > Persberichten (.rv2knoppen, .rv2knop, tikdoel 44 px, Aandragen als laatste via order op .pbprimair) en de redactiepagina op het aandelenscherm (.rv2lijst: kop, lijst, terugknop; v25.58 (REDACTIE-VRIJ-2, afmaker): de klasse in plaats van de id van de sectie - de staartscans van BEHEER-REVAMP A2 en LIVEBLOG-EEN lezen elke latere staart en dulden geen id-selector; b.rv2kop: geen dollarteken voor de leesnaam in de kop); alleen tokens, geen hex, geen voorrangsvlag, geen id-selector */
.nwchip.rv2chip{color:var(--accent);border-color:var(--accent-lijn);cursor:pointer}
.tkkop .tkidnaam b.rv2kop::before{content:none}
.nwchip.rv2chip:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.pbaandraag .rv2knoppen{display:flex;flex-wrap:wrap;gap:6px;align-items:center;flex:none}
.pbaandraag .rv2knop{min-height:44px;padding:0 12px;border-radius:999px}
.pbaandraag .rv2knop[aria-pressed="true"]{background:var(--accent);color:var(--accent-tekst);border-color:var(--accent)}
.pbaandraag .rv2knop:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.pbaandraag .pbprimair{order:1} /* v25.58 (REDACTIE-VRIJ-2, afmaker): was met een ouder-selector op de knoppengroep; de staartscan van COMMUNITY-DESIGN (draad) leest elke latere staart en verbiedt die vorm. Zonder knoppen is Aandragen toch al het laatste kind van het formulier, dus het beeld is gelijk */
.rv2lijst{padding:12px 16px 14px}
.rv2lijst .ontdekkop{margin:0 0 8px}
.rv2lijst .nwleeg{margin:6px 0 10px}
.rv2lijst .rv2terug{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;padding:0 14px;text-decoration:none}
/* ===== v25.58 REDACTIEVRIJ2 (einde) ===== */
/* ===== v25.58 RENTESUBTABENBEURSSTAND (begin) ===== */
/* v25.58 — RENTESUBTABENBEURSSTAND */
/* v25.58 (RENTE-SUBTAB-EN-BEURSSTAND, client): staart rente-subtab-en-beursstand - de rentekaart als laatste sectie van Nieuws (order boven de zijkolom), op breed scherm over de volle breedte; alleen tokens, geen id-selector, geen voorrangsvlag */
.nwview.nwt .nwgrid>.nwhoofd>.rn2kaart{order:12}
@media (min-width:960px){.nwview.nwt .nwgrid>.nwhoofd>.rn2kaart{grid-column:1 / -1}}
/* ===== v25.58 RENTESUBTABENBEURSSTAND (einde) ===== */