/* ==========================================================================
   Option Bridge UI — gedeelde designlaag voor ALLE pagina's (ronde "premium", 2026-09-25)
   Wordt door app.py (_inject_site_nav) in elke /trigger- en /report-pagina gezet, NA de eigen
   stijlen van die pagina. Drie families, herkenbaar aan <html data-qw="...">:
     tool     = server-pagina's (paneel, Option Finder, Roll Planner, Trade Check, Paper, rapporten)
     journal  = de Options Journal (ots_app.html)   ·   quick = snelle invoer (zelfde variabelen)
     scanner  = de Stock Screener
   Kleuren staan hieronder 1x als --qw-* tokens; per familie worden de eigen variabelen daarop gezet.
   Licht/donker volgt html[data-theme] (localStorage 'oj_theme', gedeeld door alle pagina's).
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
/* Option Bridge look (2026-10-09): lettertypes van de eigen server onder de oude namen (zo volgt elke pagina,
   ook inline-stijlen), papier (licht) en grafiet (donker), vlakke lijnen i.p.v. kaarten met schaduw. */
@font-face{font-family:"IBM Plex Sans";src:url(ob-sans.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url(ob-serif.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url(ob-serif-i.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(ob-mono.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(ob-mono-gr.woff2) format("woff2");font-weight:100 900;font-style:normal;unicode-range:U+0370-03FF;font-display:swap}

html[data-theme="dark"]{
  --qw-bg:#0D0E10;
  --qw-glow:none;
  --qw-sur:#141518; --qw-sur2:#1A1B1F; --qw-sur3:#212227; --qw-sur4:#2A2B31;
  --qw-line:rgba(236,233,225,.08); --qw-line2:rgba(236,233,225,.15); --qw-line3:rgba(236,233,225,.27);
  --qw-ink:#ECE9E1; --qw-ink2:#A9A69D; --qw-ink3:#6F6E69;
  --qw-acc:#FFB224; --qw-acc2:#FFC95C; --qw-acc-rgb:255,178,36; --qw-on-acc:#1A1200;
  --qw-acc-soft:rgba(255,178,36,.11); --qw-acc-line:rgba(255,178,36,.38);
  --qw-good:#58D68D; --qw-good-soft:rgba(88,214,141,.11);
  --qw-bad:#FF6B5B;  --qw-bad-soft:rgba(255,107,91,.12);
  --qw-warn:#F2CB5C; --qw-orange:#FF9A4D;
  --qw-hi:none;
  --qw-shadow:none;
  --qw-shadow-sm:none;
  --qw-row-hover:rgba(255,178,36,.05);
  color-scheme:dark;
}
html[data-theme="light"]{
  --qw-bg:#F3EEE3;
  --qw-glow:none;
  --qw-sur:#F7F3EA; --qw-sur2:#EDE6D6; --qw-sur3:#E5DDCA; --qw-sur4:#DAD1BB;
  --qw-line:rgba(27,26,23,.10); --qw-line2:rgba(27,26,23,.18); --qw-line3:rgba(27,26,23,.32);
  --qw-ink:#1B1A17; --qw-ink2:#4A473F; --qw-ink3:#857F70;
  --qw-acc:#D9481C; --qw-acc2:#E8663A; --qw-acc-rgb:217,72,28; --qw-on-acc:#FFFFFF;
  --qw-acc-soft:rgba(217,72,28,.09); --qw-acc-line:rgba(217,72,28,.38);
  --qw-good:#1E7A4B; --qw-good-soft:rgba(30,122,75,.09);
  --qw-bad:#BE2F1E;  --qw-bad-soft:rgba(190,47,30,.08);
  --qw-warn:#B8860B; --qw-orange:#C96A1F;
  --qw-hi:none;
  --qw-shadow:none;
  --qw-shadow-sm:none;
  --qw-row-hover:rgba(217,72,28,.04);
  color-scheme:light;
}
html{--qw-radius:6px;--qw-radius-sm:4px;--qw-ease:cubic-bezier(.2,.7,.2,1)}

/* ---------- 2. Per familie: eigen variabelen -> tokens ---------- */
html[data-qw="tool"][data-theme]{
  --bg:var(--qw-bg); --surface:var(--qw-sur); --surface-2:var(--qw-sur2);
  --ink:var(--qw-ink); --ink-2:var(--qw-ink2); --ink-3:var(--qw-ink3); --line:var(--qw-line2);
  --accent:var(--qw-acc); --accent-soft:var(--qw-acc-soft);
  --good:var(--qw-good); --good-soft:var(--qw-good-soft); --bad:var(--qw-bad); --bad-soft:var(--qw-bad-soft);
  --orange:var(--qw-orange); --yellow:var(--qw-warn); --shadow:var(--qw-shadow);
}
html[data-qw="journal"][data-theme],html[data-qw="quick"][data-theme]{
  --bg:var(--qw-bg); --sur:var(--qw-sur); --sur2:var(--qw-sur2); --sur3:var(--qw-sur3); --sur4:var(--qw-sur4);
  --bdr:var(--qw-line); --bdr2:var(--qw-line2); --bdr3:var(--qw-line3);
  --txt:var(--qw-ink); --sub:var(--qw-ink2); --dim:var(--qw-ink3);
  --acc:var(--qw-acc); --acc2:var(--qw-acc2); --acc-rgb:var(--qw-acc-rgb); --acc-dim:var(--qw-acc-soft); --acc-bdr:var(--qw-acc-line);
  --grn:var(--qw-good); --red:var(--qw-bad); --yel:var(--qw-warn); --ora:var(--qw-orange); --on-acc:var(--qw-on-acc);
  --shadow:var(--qw-shadow); --shadow-sm:var(--qw-shadow-sm);
}
html[data-qw="scanner"][data-theme]{
  --bg:var(--qw-bg); --bg2:var(--qw-sur); --bg3:var(--qw-sur2);
  --bdr:var(--qw-line); --bdr2:var(--qw-line2);
  --txt:var(--qw-ink); --txt2:var(--qw-ink2); --txt3:var(--qw-ink3);
  --grn:var(--qw-good); --gbg:var(--qw-good-soft); --red:var(--qw-bad); --rbg:var(--qw-bad-soft); --yel:var(--qw-warn);
  --blu:var(--qw-acc); --bbg:var(--qw-acc-soft); --bbdr:var(--qw-acc-line); --pur:var(--qw-acc);
  --r:10px; --rl:16px;
}

/* ---------- 3. Basis: achtergrond met zachte gloed, letter, selectie, scrollbalken ---------- */
html[data-qw] body{
  background-color:var(--qw-bg)!important;
  background-image:var(--qw-glow)!important; background-attachment:fixed!important; background-repeat:no-repeat!important;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;
  font-variant-numeric:tabular-nums;
}
html[data-qw] ::selection{background:rgba(var(--qw-acc-rgb),.22)}
html[data-qw] *{scrollbar-width:thin;scrollbar-color:var(--qw-line3) transparent}
html[data-qw] ::-webkit-scrollbar{width:8px;height:8px}
html[data-qw] ::-webkit-scrollbar-thumb{background:var(--qw-line2);border-radius:8px;border:2px solid transparent;background-clip:padding-box}
html[data-qw] ::-webkit-scrollbar-thumb:hover{background:var(--qw-line3);background-clip:padding-box}
html[data-qw] :focus-visible{outline:2px solid var(--qw-acc-line);outline-offset:2px}

/* ---------- 4. Navigatiebalk bovenaan (alle pagina's) ---------- */
html[data-qw] .qwnav{
  --n-bg:color-mix(in srgb,var(--qw-sur) 78%,transparent); --n-line:var(--qw-line2); --n-ink:var(--qw-ink2);
  --n-hi:var(--qw-ink); --n-acc:var(--qw-acc); --n-accbg:var(--qw-acc-soft);
  backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px);
  box-shadow:0 1px 0 var(--qw-line), 0 10px 30px -22px rgba(0,0,0,.6);
}
html[data-qw] .qwnav a{transition:color .15s,background .15s}
html[data-qw] .qwnav .qw-brand{letter-spacing:-.01em;display:inline-flex;align-items:center;gap:7px}
html[data-qw] .qwnav .qw-brand::before{content:"";width:9px;height:9px;border-radius:3px;
  background:linear-gradient(135deg,var(--qw-acc),color-mix(in srgb,var(--qw-acc) 45%,#7C8CFF));box-shadow:0 0 12px rgba(var(--qw-acc-rgb),.55)}
.qwnav .qw-sp{flex:1}
.qwnav .qw-tt{flex:none;border:1px solid var(--n-line);background:transparent;color:var(--n-ink);border-radius:8px;
  width:30px;height:28px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;padding:0}
.qwnav .qw-tt:hover{color:var(--n-hi);background:var(--n-accbg)}

/* ---------- 5. Familie "tool": server-pagina's ---------- */
html[data-qw="tool"] .card{border-radius:20px;border-color:var(--qw-line2);box-shadow:var(--qw-shadow);
  background:linear-gradient(180deg,color-mix(in srgb,var(--qw-sur) 100%,transparent),var(--qw-sur))}
html[data-qw="tool"] .eyebrow{letter-spacing:.18em}
html[data-qw="tool"] h1{letter-spacing:-.015em}
html[data-qw="tool"] .wrap h1{font-size:30px;margin-bottom:4px}
/* brede tabellen (Paper Portfolio, Roll Planner) passen zonder schuiven: pagina mag breder op grote schermen */
html[data-qw="tool"] .wrap{max-width:min(1400px,100%)!important}
/* pagina's met een zijmenu (Portfolio, Screener): volle breedte en links uitgelijnd, net als de Journal */
html[data-qw="tool"] .wrap:has(.pf-layout){max-width:none!important;margin:0!important}
/* ...en het menu loopt van boven naar beneden naast titel, ondertitel en cijfers (zoals de Journal), i.p.v. pas onder de kopregel te beginnen */
html[data-qw="tool"] .wrap:has(.pf-layout){display:grid;grid-template-columns:224px minmax(0,1fr);column-gap:22px;row-gap:0;align-items:start}
html[data-qw="tool"] .wrap:has(.pf-layout)>*{grid-column:2;min-width:0}
html[data-qw="tool"] .wrap:has(.pf-layout)>div:has(>.pf-layout),html[data-qw="tool"] .wrap:has(.pf-layout) .pf-layout{display:contents}
html[data-qw="tool"] .wrap:has(.pf-layout) .pf-side{grid-column:1;grid-row:1 / span 12;margin-top:6px}
html[data-qw="tool"] .wrap:has(.pf-layout) .pf-main{grid-column:2}
@media (max-width:900px){
  html[data-qw="tool"] .wrap:has(.pf-layout){display:block}
  html[data-qw="tool"] .wrap:has(.pf-layout)>div:has(>.pf-layout){display:block}
  html[data-qw="tool"] .wrap:has(.pf-layout) .pf-layout{display:grid}
  html[data-qw="tool"] .wrap:has(.pf-layout) .pf-side{margin-top:0;grid-column:auto;grid-row:auto}
  html[data-qw="tool"] .wrap:has(.pf-layout) .pf-main{grid-column:auto}
}
/* invulbalk bovenaan een pagina (Trade Check, Roll Planner, Finder, Dealer Report, ...): velden naast elkaar, knoppen rechts */
html[data-qw="tool"] .fn-bar{width:auto;max-width:none;padding:16px 18px;margin:0 0 18px}
html[data-qw="tool"] .fn-bar form{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:flex-end;margin:0}
html[data-qw="tool"] .fn-bar .fn-f{flex:1 1 170px;min-width:140px;max-width:300px}
html[data-qw="tool"] .fn-bar .fn-f label{margin-bottom:6px}
html[data-qw="tool"] .fn-bar .fn-f input{margin-bottom:0}
html[data-qw="tool"] .fn-bar form>label,html[data-qw="tool"] .fn-bar form>.crit{flex:1 1 100%;margin:0}   /* Option Finder: de criteria staan onder de velden */
html[data-qw="tool"] .fn-bar .crit{max-width:560px}
html[data-qw="tool"] .fn-bar .fn-btns{display:flex;gap:10px;flex:0 0 auto;margin:0}
html[data-qw="tool"] .fn-bar .fn-btns button{flex:none;padding:12px 20px}
html[data-qw="tool"] .scroll{overflow-x:auto!important}
html[data-qw="tool"] h2{font-size:18px;letter-spacing:-.01em;margin-top:30px}
html[data-qw="tool"] label{color:var(--qw-ink3)}
html[data-qw="tool"] input[type=text],html[data-qw="tool"] input[type=password],html[data-qw="tool"] input[type=date],html[data-qw="tool"] select{
  font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:14.5px;border-radius:11px;border-color:var(--qw-line2);
  background:var(--qw-sur2);box-shadow:var(--qw-hi);transition:border-color .15s,box-shadow .15s}
html[data-qw="tool"] input:focus,html[data-qw="tool"] select:focus{border-color:var(--qw-acc-line);box-shadow:0 0 0 4px var(--qw-acc-soft)}
html[data-qw="tool"] button{border-radius:11px;letter-spacing:.06em;transition:transform .15s var(--qw-ease),box-shadow .15s,filter .15s}
html[data-qw="tool"] button:hover{filter:none;transform:translateY(-1px);box-shadow:0 8px 20px -12px rgba(0,0,0,.55)}
html[data-qw="tool"] .put{background:var(--qw-good-soft);border-color:color-mix(in srgb,var(--qw-good) 55%,transparent)}
html[data-qw="tool"] .call{background:var(--qw-bad-soft);border-color:color-mix(in srgb,var(--qw-bad) 55%,transparent)}
html[data-qw="tool"] .primary-btn,html[data-qw="tool"] .login-btn{background:var(--qw-acc);color:var(--qw-on-acc)}
html[data-qw="tool"] a.tile{border-radius:14px;background:var(--qw-sur2);border-color:var(--qw-line);box-shadow:var(--qw-hi);
  transition:transform .18s var(--qw-ease),border-color .18s,box-shadow .18s,background .18s}
html[data-qw="tool"] a.tile:hover{background:var(--qw-sur3);border-color:var(--qw-acc-line);box-shadow:var(--qw-shadow)}
html[data-qw="tool"] .tile .ic{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;flex:none;
  font-size:20px;border-radius:11px;background:var(--qw-acc-soft);border:1px solid var(--qw-line)}
/* kerngetallen ("chips") en tabellen */
html[data-qw="tool"] .chip{border-radius:14px;padding:12px 16px;border-color:var(--qw-line2);box-shadow:var(--qw-shadow-sm);
  background:linear-gradient(180deg,var(--qw-sur2),var(--qw-sur))}
html[data-qw="tool"] .chip b{font-size:22px;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
html[data-qw="tool"] .chip span{font-size:10px;letter-spacing:.1em;color:var(--qw-ink3)}
html[data-qw="tool"] .scroll{border-radius:14px}
html[data-qw="tool"] .tbl{border-radius:14px;border-color:var(--qw-line2);box-shadow:var(--qw-shadow-sm);border-collapse:separate;border-spacing:0}
html[data-qw="tool"] .tbl th{background:var(--qw-sur2);color:var(--qw-ink3);padding:11px 12px;font-weight:600;border-bottom:1px solid var(--qw-line2)}
html[data-qw="tool"] .tbl td{font-family:"IBM Plex Sans",system-ui,sans-serif;font-variant-numeric:tabular-nums;padding:10px 12px;border-top:1px solid var(--qw-line)}
html[data-qw="tool"] .tbl tr:first-child td{border-top:0}
html[data-qw="tool"] .tbl tr:not(:first-child):hover td{background:var(--qw-row-hover)}
html[data-qw="tool"] .tbl tr.hl td{background:var(--qw-acc-soft)!important}
html[data-qw="tool"] .bar{background:var(--qw-sur3)}
html[data-qw="tool"] a.back{color:var(--qw-acc)}
html[data-qw="tool"] .foot{color:var(--qw-ink3)}

/* startpagina: tegels in groepen met live badges */
html[data-qw="tool"] .tgroup{margin-top:18px}
html[data-qw="tool"] .tgroup:first-of-type{margin-top:4px}
html[data-qw="tool"] .tgroup h3{margin:0 0 10px 2px;font:600 10.5px/1 "IBM Plex Sans",sans-serif;letter-spacing:.16em;
  text-transform:uppercase;color:var(--qw-ink3);display:flex;align-items:center;gap:10px}
html[data-qw="tool"] .tgroup h3::after{content:"";flex:1;height:1px;background:var(--qw-line)}
html[data-qw="tool"] .tile em.tbadge{display:inline-block;margin-top:7px;font-style:normal;font-size:10.5px;font-weight:600;
  color:var(--qw-acc);background:var(--qw-acc-soft);border:1px solid var(--qw-acc-line);border-radius:99px;padding:2px 8px}
/* laadscherm tijdens het ophalen van live data (formulieren op de tools) */
.qw-loading{position:fixed;inset:0;z-index:150;display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb,var(--qw-bg) 72%,transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:qwFade .2s}
.qw-loading .box{width:min(420px,90vw);padding:26px 28px;border-radius:20px;background:var(--qw-sur);border:1px solid var(--qw-line2);
  box-shadow:var(--qw-shadow);font-family:"IBM Plex Sans",system-ui,sans-serif;color:var(--qw-ink)}
.qw-spin{width:34px;height:34px;margin:0 auto 14px;border-radius:50%;border:4px solid var(--qw-line2);border-top-color:var(--qw-acc);animation:qwspin .9s linear infinite}@keyframes qwspin{to{transform:rotate(360deg)}}
.qw-loading .ttl{font:600 18px "Fraunces",Georgia,serif;margin-bottom:4px}
.qw-loading .sub{font-size:12.5px;color:var(--qw-ink3);margin-bottom:18px}
.qw-sk{height:12px;border-radius:7px;margin:9px 0;background:linear-gradient(90deg,var(--qw-sur2) 0%,var(--qw-sur3) 45%,var(--qw-sur2) 90%);
  background-size:220% 100%;animation:qwShimmer 1.3s linear infinite}
.qw-sk.w70{width:70%}.qw-sk.w45{width:45%}.qw-sk.w85{width:85%}
@keyframes qwShimmer{from{background-position:120% 0}to{background-position:-100% 0}}
@keyframes qwFade{from{opacity:0}to{opacity:1}}
@keyframes qwRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
html[data-qw="tool"] .card,html[data-qw="tool"] .wrap{animation:qwRise .35s var(--qw-ease) both}
/* telefoon: tools netjes op een smal scherm */
@media (max-width:640px){
  html[data-qw="tool"] body{padding:18px 12px!important}
  html[data-qw="tool"] .card{width:100%!important;padding:22px 18px!important}
  html[data-qw="tool"] .wrap h1{font-size:24px}
  html[data-qw="tool"] .chips{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
  html[data-qw="tool"] .chip{min-width:0!important;padding:10px 12px}
  html[data-qw="tool"] .chip b{font-size:18px}
  html[data-qw="tool"] .scroll{margin:0 -12px;border-radius:0;-webkit-overflow-scrolling:touch}
  html[data-qw="tool"] .functions-card .tiles{grid-template-columns:1fr!important}
  html[data-qw="tool"] .buttons{flex-wrap:wrap}
}

/* ---------- Dividend Calendar ---------- */
.dv-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:4px 0 14px}
.dv-tog{flex:none!important;padding:7px 12px!important;border-radius:99px!important;border:1px solid var(--qw-line2)!important;background:var(--qw-sur)!important;
  color:var(--qw-ink2)!important;text-transform:none!important;letter-spacing:0!important;font-size:12.5px!important;font-weight:600!important}
.dv-tog.on{background:var(--qw-acc-soft)!important;border-color:var(--qw-acc-line)!important;color:var(--qw-acc)!important}
#dv-add{flex:1 1 360px;text-transform:none!important;margin:0!important;padding:8px 12px!important;font-size:13px!important}
.dv-addbtn{flex:none!important;padding:9px 14px!important}
.dv-cal{background:var(--qw-sur);border:1px solid var(--qw-line2);border-radius:16px;padding:14px;box-shadow:var(--qw-shadow-sm)}
.dv-cal-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.dv-cal-head b{font:600 17px "Fraunces",Georgia,serif;min-width:150px;text-align:center}
.dv-cal-head button{flex:none!important;width:32px;height:30px;padding:0!important;border-radius:9px!important;border:1px solid var(--qw-line2)!important;
  background:var(--qw-sur2)!important;color:var(--qw-ink)!important;font-size:16px!important}
.dv-legend{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap}
.dv-legend .dv-ev{cursor:default}
.dv-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.dv-dow{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--qw-ink3);text-align:center;padding:2px 0 4px}
.dv-day{min-height:78px;border:1px solid var(--qw-line);border-radius:10px;padding:5px;background:var(--qw-sur2);display:flex;flex-direction:column;gap:3px;min-width:0}
.dv-empty{background:transparent;border-color:transparent}
.dv-today{border-color:var(--qw-acc-line);box-shadow:inset 0 0 0 1px var(--qw-acc-line)}
.dv-n{font-size:11px;color:var(--qw-ink3);font-weight:600}
.dv-ev{all:unset;box-sizing:border-box;cursor:pointer;display:block;font:600 10.5px/1.3 "IBM Plex Sans",sans-serif;padding:2px 6px;border-radius:6px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.dv-ev.ex{background:var(--qw-acc-soft);color:var(--qw-acc);border:1px solid var(--qw-acc-line)}
.dv-ev.ex.est{background:transparent;border-style:dashed}
.dv-ev.pay{background:var(--qw-good-soft);color:var(--qw-good);border:1px solid color-mix(in srgb,var(--qw-good) 35%,transparent)}
.dv-ev.pay.est{border-style:dashed;background:transparent}
.dv-src{display:inline-block;font-size:10.5px;font-weight:600;border-radius:99px;padding:1px 7px;margin:1px 2px 1px 0;border:1px solid var(--qw-line2);color:var(--qw-ink2)}
.dv-src.hold{color:var(--qw-good);border-color:color-mix(in srgb,var(--qw-good) 40%,transparent)}
.dv-src.fav{color:var(--qw-warn);border-color:color-mix(in srgb,var(--qw-warn) 40%,transparent)}
.dv-st{font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px}
.dv-st.declared{background:var(--qw-good-soft);color:var(--qw-good)}
.dv-st.estimated{border:1px dashed var(--qw-line3);color:var(--qw-ink3)}
.dv-warn{display:inline-block;margin-left:6px;font-size:10.5px;color:var(--qw-orange);font-weight:600}
.dv-x{all:unset;cursor:pointer;color:var(--qw-ink3);padding:2px 6px;border-radius:6px}
.dv-x:hover{color:var(--qw-bad);background:var(--qw-bad-soft)}
tr.dv-hit td{background:var(--qw-acc-soft)!important;transition:background .3s}
html[data-qw="tool"] .chip.dv-padi{border-color:color-mix(in srgb,var(--qw-good) 45%,transparent);
  background:linear-gradient(180deg,var(--qw-good-soft),var(--qw-sur))}
html[data-qw="tool"] .chip.dv-padi b{color:var(--qw-good)}
.dv-wht{display:inline-flex!important;align-items:center;gap:6px;margin:0!important;font-size:12px!important;letter-spacing:0!important;
  text-transform:none!important;color:var(--qw-ink2)!important;font-weight:500!important}
.dv-bars{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;height:190px;align-items:end;padding-top:6px}
.dv-bcol{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.dv-b{width:70%;max-width:44px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,var(--qw-good),color-mix(in srgb,var(--qw-good) 55%,transparent));
  box-shadow:0 6px 16px -10px var(--qw-good);transition:height .4s var(--qw-ease)}
.dv-bv{font-size:10.5px;font-weight:600;color:var(--qw-ink2);margin-bottom:4px;white-space:nowrap}
.dv-bl{font-size:10.5px;color:var(--qw-ink3);margin-top:5px;text-transform:uppercase;letter-spacing:.06em}
@media (max-width:640px){.dv-bv{display:none}}
.dv-bars24{grid-template-columns:repeat(24,minmax(0,1fr));gap:3px}
.dv-bars24 .dv-bv{font-size:9px;writing-mode:vertical-rl;transform:rotate(180deg);margin-bottom:3px}
.dv-bars24 .dv-bl{font-size:9px;letter-spacing:0;white-space:nowrap}
.dv-b2{background:linear-gradient(180deg,var(--qw-acc),color-mix(in srgb,var(--qw-acc) 50%,transparent));box-shadow:0 6px 16px -10px var(--qw-acc)}
.dv-btn2{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:10px;
  border:1px solid var(--qw-line2);background:var(--qw-sur);color:var(--qw-ink2);font:600 12.5px "IBM Plex Sans",sans-serif;white-space:nowrap}
.dv-btn2:hover{color:var(--qw-ink);border-color:var(--qw-acc-line)}
.dv-btn{flex:none!important;padding:10px 18px!important}
.dv-sel{width:auto!important;margin:0!important;padding:7px 10px!important;font-size:12.5px!important;border-radius:10px!important}
.dv-k{font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px;text-transform:uppercase;letter-spacing:.04em}
.dv-k.dividend{background:var(--qw-good-soft);color:var(--qw-good)}
.dv-k.buy{background:var(--qw-acc-soft);color:var(--qw-acc)}
.dv-k.sell{background:var(--qw-bad-soft);color:var(--qw-bad)}
.dv-k.split{border:1px solid var(--qw-line3);color:var(--qw-ink3)}
.dv-flag{font-size:11px;color:var(--qw-orange);font-weight:600}
.dv-pv{position:fixed;inset:0;z-index:220;display:none;align-items:center;justify-content:center;padding:20px;
  background:rgba(3,7,6,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.dv-pvbox{width:min(860px,96vw);max-height:92vh;overflow:auto;background:var(--qw-sur);border:1px solid var(--qw-line2);border-radius:20px;
  padding:22px 24px;box-shadow:var(--qw-shadow),0 40px 80px -30px rgba(0,0,0,.7);font-family:"IBM Plex Sans",sans-serif;color:var(--qw-ink);text-align:left}
.dv-pvbox h3{margin:4px 0 4px;font:600 20px "Fraunces",Georgia,serif}
.dv-pvbox h4{margin:18px 0 6px;font:600 14px "IBM Plex Sans",sans-serif}
.dv-pvscroll{max-height:320px;overflow:auto}
.dv-pvbox input[type=checkbox],.dv-opt input{width:16px;height:16px;accent-color:var(--qw-acc);margin:0}
.dv-opt{display:flex!important;align-items:center;gap:8px;margin:6px 0!important;font-size:13px!important;text-transform:none!important;letter-spacing:0!important;color:var(--qw-ink2)!important;font-weight:500!important}
.dv-sh{width:84px!important;margin:0!important;padding:5px 8px!important;font-size:13px!important;border-radius:8px!important;
  background:var(--qw-sur2);border:1px solid var(--qw-line2);color:var(--qw-ink);font-family:"IBM Plex Sans",sans-serif}
.dv-sh:focus{outline:none;border-color:var(--qw-acc-line);box-shadow:0 0 0 3px var(--qw-acc-soft)}
@media (max-width:640px){.dv-day{min-height:54px;padding:3px}.dv-ev{font-size:9px;padding:1px 3px}.dv-legend{display:none}}

/* ---------- Portfolio tracker ---------- */
/* zijbalk-opbouw zoals de Options Journal: links navigatie + accountkeuze, rechts de inhoud */
.pf-layout{display:grid;grid-template-columns:224px minmax(0,1fr);gap:22px;align-items:start}
.pf-side{position:sticky;top:58px;max-height:calc(100vh - 72px);overflow:auto;display:flex;flex-direction:column;gap:2px;padding:16px 12px;
  background:var(--qw-sur);border:1px solid var(--qw-line2);border-radius:18px;box-shadow:var(--qw-shadow-sm)}
.pf-lbl{font:600 9.5px "IBM Plex Sans",sans-serif;color:var(--qw-ink3);letter-spacing:.18em;text-transform:uppercase;padding:0 10px;margin:4px 0 6px}
.pf-nis{display:flex;flex-direction:column;gap:3px}
.pf-ni{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;
  font:600 11px "IBM Plex Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--qw-ink2);transition:background .15s,color .15s}
.pf-ni svg{width:15px;height:15px;flex:none;opacity:.85}
.pf-ni:hover{background:var(--qw-sur2);color:var(--qw-ink)}
.pf-ni.on{background:linear-gradient(120deg,color-mix(in srgb,var(--qw-acc) 26%,transparent),color-mix(in srgb,var(--qw-acc) 10%,transparent));
  color:var(--qw-ink);box-shadow:inset 0 0 0 1px var(--qw-acc-line),0 0 18px -6px var(--qw-acc)}
.pf-ni.on svg{color:var(--qw-acc);opacity:1}
.pf-side-bot{margin-top:14px;padding-top:14px;border-top:1px solid var(--qw-line2)}
.pf-accs{display:flex;flex-direction:column;gap:3px;margin-bottom:12px;padding:4px;border:1px solid var(--qw-line2);border-radius:12px;background:var(--qw-sur2)}
.pf-acc{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;padding:7px 10px;border-radius:9px;font:600 12.5px "IBM Plex Sans",sans-serif;color:var(--qw-ink2)}
.pf-acc .dim{font-size:10.5px;font-weight:500}
.pf-acc:hover{color:var(--qw-ink);background:var(--qw-sur)}
.pf-acc.on{background:var(--qw-acc-soft);color:var(--qw-acc);box-shadow:inset 0 0 0 1px var(--qw-acc-line)}
.pf-main{min-width:0}
.pf-h{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 14px}
.pf-h h2{margin:0!important}
.pf-h .dim{font-size:12.5px}
.pf-cur{display:flex;border:1px solid var(--qw-line2);border-radius:99px;padding:2px;background:var(--qw-sur2)}
.pf-cur button{all:unset;flex:1;text-align:center;cursor:pointer;padding:6px 10px;border-radius:99px;font:600 12px "IBM Plex Sans",sans-serif;color:var(--qw-ink3)}
.pf-cur button.on{background:var(--qw-acc-soft);color:var(--qw-acc)}
@media (max-width:900px){
  .pf-layout{grid-template-columns:1fr;gap:14px}
  .pf-side{position:static;max-height:none;padding:10px}
  .pf-nis{flex-direction:row;overflow-x:auto;scrollbar-width:none}
  .pf-nis::-webkit-scrollbar{display:none}
  .pf-ni{flex:none;padding:9px 11px}
  .pf-side>.pf-lbl:first-child{display:none}
  .pf-side-bot{margin-top:8px;padding-top:10px}
  .pf-accs{flex-direction:row;overflow-x:auto;scrollbar-width:none}
  .pf-acc{flex:none}
}
.pf-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(360px,100%),1fr));gap:14px;align-items:start}
.pf-kv{width:100%}
.pf-kv td{padding:7px 4px!important;white-space:normal!important}
html[data-qw="tool"] .chip b.pos{color:var(--qw-good)}
html[data-qw="tool"] .chip b.neg{color:var(--qw-bad)}
.pf-hb{display:grid;grid-template-columns:minmax(52px,90px) 1fr auto;gap:10px;align-items:center;margin:5px 0;font-size:12.5px}
.pf-hb-l{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-hb-t{height:10px;border-radius:99px;background:var(--qw-sur2);overflow:hidden}
.pf-hb-f{height:100%;border-radius:99px;background:linear-gradient(90deg,color-mix(in srgb,var(--qw-acc) 55%,transparent),var(--qw-acc))}
.pf-hb-f.neg{background:var(--qw-bad)}
.pf-hb-v{white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}
.pf-nm{font-size:11px;font-weight:500;margin-top:1px}
#pf-app td a{color:var(--qw-ink);text-decoration:none;font-weight:600}
#pf-app td a:hover{color:var(--qw-acc)}
.pf-tags{margin-top:2px}
.pf-hold td,.pf-hold th{white-space:nowrap}
.pf-hold td.t{white-space:normal;min-width:110px}
.pf-sort{cursor:pointer;user-select:none}
.pf-sort.on{color:var(--qw-acc)!important}
tr.pf-closed td{opacity:.62}
.pf-scroll{max-height:72vh;overflow:auto}
/* kolomkoppen blijven staan tijdens het scrollen door de tabel */
html .pf-sticky{overflow:visible!important}   /* overflow:hidden (afgeronde hoeken) blokkeert 'sticky' */
.pf-sticky tr:first-child th{position:sticky;top:0;z-index:3;background:var(--qw-sur2);box-shadow:0 1px 0 var(--qw-line2)}
.pf-chips{margin:0 0 14px!important}
.pf-welcome{text-align:center;padding:30px 20px}
.pf-new{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center}
.pf-new input{flex:1 1 180px;margin:0!important;padding:8px 12px!important;font-size:13px!important;text-transform:none!important}
.pf-new select{width:auto!important;margin:0!important;padding:8px 10px!important;font-size:13px!important}
.pf-set input.dv-sel{min-width:140px}
.pf-srcb{display:inline-flex;align-items:center;gap:2px;font-size:11.5px;font-weight:600;border:1px solid var(--qw-line2);border-radius:99px;padding:1px 4px 1px 9px;margin:1px 3px 1px 0;white-space:nowrap}
.pf-search{text-transform:uppercase;width:130px!important}
.pf-act{text-align:right;width:30px}
.pf-box{width:min(620px,96vw)}
.pf-mh{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:6px}
.pf-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;margin-top:10px}
.pf-f{display:flex!important;flex-direction:column;gap:4px;margin:0!important;font-size:11px!important}
.pf-f input,.pf-f select{margin:0!important;padding:8px 10px!important;font-size:13px!important;text-transform:none;width:100%!important;box-sizing:border-box}
.pf-hint{grid-column:1/-1;font-size:12px;min-height:16px}
.pf-actions{grid-column:1/-1;display:flex;gap:10px;align-items:center;margin-top:8px}
.pf-del{color:var(--qw-bad)!important}
.dv-k.transfer-in,.dv-k.transfer-out{border:1px solid var(--qw-acc-line);color:var(--qw-acc)}
.dv-k.deposit,.dv-k.interest{background:var(--qw-good-soft);color:var(--qw-good)}
.dv-k.option-income{background:color-mix(in srgb,var(--qw-acc) 16%,transparent);color:var(--qw-acc);border:1px solid var(--qw-acc-line)}
.dv-k.withdrawal,.dv-k.fee{border:1px solid var(--qw-line3);color:var(--qw-ink3)}
.dv-ev .dv-amt{font-weight:500;opacity:.85}
.dv-ev.got{background:var(--qw-good);color:var(--qw-bg,#0b0f0e);border:1px solid var(--qw-good)}
.dv-ev.pend{background:transparent;color:var(--qw-orange);border:1px dashed var(--qw-orange)}
.pf-pend{margin-bottom:14px;border-color:color-mix(in srgb,var(--qw-orange) 45%,transparent)}
.pf-pend .dv-sh{width:90px!important}
.pf-spark{width:120px;height:24px;display:block}
.pf-spark rect{fill:color-mix(in srgb,var(--qw-acc) 70%,transparent)}
.pf-gst{font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px;text-transform:uppercase;letter-spacing:.04em}
.pf-gst.cut{background:var(--qw-bad-soft);color:var(--qw-bad)}
.pf-gst.lower,.pf-gst.higher{border:1px dashed var(--qw-line3);color:var(--qw-ink2)}
.pf-gst.raised{background:var(--qw-good-soft);color:var(--qw-good)}
.pf-gst.stable{border:1px solid var(--qw-line3);color:var(--qw-ink2)}
.pf-gst.variable{border:1px dashed var(--qw-line3);color:var(--qw-ink3)}
.pf-warn{margin:0 0 14px;padding:10px 14px;border-radius:12px;border:1px solid color-mix(in srgb,var(--qw-bad) 45%,transparent);background:var(--qw-bad-soft);font-size:13px}
.pf-warn a{color:inherit}
.pf-goal-h{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.pf-goal-h b{font:600 16px "Fraunces",Georgia,serif}
.pf-goal-n{margin:10px 0 8px}
.pf-goal-cur{font:600 24px "Fraunces",Georgia,serif;color:var(--qw-ink)}
.pf-goal-bar{height:10px;border-radius:99px;background:var(--qw-sur2);overflow:hidden}
.pf-goal-bar div{height:100%;border-radius:99px;background:linear-gradient(90deg,color-mix(in srgb,var(--qw-good) 55%,transparent),var(--qw-good));box-shadow:0 0 14px -4px var(--qw-good)}
.pf-goal-f{margin-top:8px;font-size:13px}
/* overzicht: vaste rijen, blokken per rij even breed en even hoog */
.pf-row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px}
.pf-row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px;align-items:stretch}
.pf-row2-w{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
@media (max-width:1000px){.pf-row3,.pf-row2,.pf-row2-w{grid-template-columns:1fr}}
.pf-eq{height:100%;box-sizing:border-box;margin:0!important}
.pf-stack{display:flex;flex-direction:column;gap:14px}
.pf-stack>.dv-cal{flex:1}
.pf-kpi{display:flex;flex-direction:column;gap:6px;margin:0!important}
.pf-kpi-t{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--qw-ink3);display:flex;align-items:center;gap:8px}
.pf-kpi-t span{display:inline-flex;width:22px;height:22px;border-radius:7px;align-items:center;justify-content:center;background:var(--qw-acc-soft);color:var(--qw-acc);font-size:12px}
.pf-kpi-v{font:600 28px "Fraunces",Georgia,serif;color:var(--qw-ink)}
.pf-kpi-v.pos{color:var(--qw-good)}.pf-kpi-v.neg{color:var(--qw-bad)}
.pf-kpi-s{font-size:12.5px;color:var(--qw-ink2);line-height:1.5}
.pf-ins{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-bottom:14px}
.pf-in{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:14px;background:var(--qw-sur);border:1px solid color-mix(in srgb,var(--qw-orange) 55%,transparent)}
.pf-in.bad{border-color:color-mix(in srgb,var(--qw-bad) 55%,transparent)}
.pf-in.info{border-color:var(--qw-acc-line)}
.pf-in-b{align-self:flex-start;font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 8px;background:var(--qw-orange);color:#1a1206}
.pf-in.bad .pf-in-b{background:var(--qw-bad);color:#fff}.pf-in.info .pf-in-b{background:var(--qw-acc);color:var(--qw-bg,#0b0f0e)}
.pf-in b{font-size:14px}.pf-in p{margin:0;font-size:12.5px;color:var(--qw-ink2);flex:1}
.pf-in .dv-btn2{align-self:flex-start}
.pf-dn-w{display:flex;align-items:center;justify-content:center;height:calc(100% - 40px);min-height:240px}
.pf-dn-w .pf-donut{max-width:300px}
.pf-otab td,.pf-otab th{padding:7px 8px!important}
.pf-sw{display:inline-block;width:4px;height:26px;border-radius:3px;flex:none}
.pf-mv{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--qw-line)}
.pf-mv:first-of-type{border-top:0}
.pf-mv-n{flex:1;min-width:0;display:flex;flex-direction:column;font-size:12.5px}
.pf-mv-n .dim{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-mv-v{display:flex;flex-direction:column;align-items:flex-end;font-size:12.5px;font-weight:600;white-space:nowrap}
.pf-mv-v span{font-size:11px;font-weight:500}
/* diversificatie */
.pf-dvb{display:grid;grid-template-columns:minmax(200px,300px) 1fr;gap:24px;align-items:center}
@media (max-width:760px){.pf-dvb{grid-template-columns:1fr}.pf-donut{max-width:240px;margin:0 auto}}
.pf-donut{width:100%;height:auto;display:block}
.pf-dc1{font:600 17px "Fraunces",Georgia,serif;fill:var(--qw-ink)}
.pf-dc2{font:500 9px "IBM Plex Sans",sans-serif;fill:var(--qw-ink3);text-transform:uppercase;letter-spacing:.1em}
.pf-lgs{display:flex;flex-direction:column;gap:5px;max-height:420px;overflow:auto;padding-right:4px}
.pf-lgr{display:flex;align-items:center;gap:8px;font-size:12.5px;min-width:0}
.pf-lgr>i{width:10px;height:10px;border-radius:50%;flex:none}
.pf-lgr b{flex:none;min-width:44px}
.pf-lgn{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--qw-ink2)}
.pf-lgp{flex:none;font-variant-numeric:tabular-nums;font-weight:600;min-width:56px;text-align:right}
.pf-lgbar{flex:1 1 140px;height:7px;border-radius:99px;background:var(--qw-sur2);overflow:hidden}
.pf-lgbar span{display:block;height:100%;border-radius:99px}
.pf-lgv{flex:none;min-width:70px;text-align:right;font-size:11.5px}
.pf-pills2{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 10px}
/* dividendkalender (Snowball-indeling) */
.pf-dtop{display:grid;grid-template-columns:minmax(240px,1fr) 2.2fr;gap:14px}
@media (max-width:900px){.pf-dtop{grid-template-columns:1fr}}
.pf-inc{display:flex;flex-direction:column;justify-content:center;background:linear-gradient(160deg,color-mix(in srgb,#8b5cf6 18%,var(--qw-sur)),var(--qw-sur))!important}
.pf-inc-v{font:600 34px "Fraunces",Georgia,serif;margin:6px 0 12px;color:var(--qw-ink)}
.pf-inc-l{display:flex;flex-direction:column;gap:7px;padding:10px 12px;border-radius:12px;background:var(--qw-sur2);border:1px solid var(--qw-line2)}
.pf-inc-l div{display:flex;justify-content:space-between;font-size:13px}
.pf-inc-l span{color:var(--qw-ink3)}
.pf-sbars{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;height:210px;align-items:end}
.pf-sb{all:unset;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0;border-radius:10px;padding:4px 0}
.pf-sb:hover,.pf-sb.on{background:var(--qw-sur2)}
.pf-sb.on .pf-sbl{color:var(--qw-acc);font-weight:700}
.pf-sbv{font-size:10.5px;font-weight:600;color:var(--qw-ink2);margin-bottom:4px;white-space:nowrap}
.pf-sbc{display:flex;flex-direction:column-reverse;justify-content:flex-start;width:60%;max-width:34px;height:78%;border-radius:8px;overflow:hidden;background:color-mix(in srgb,var(--qw-line2) 40%,transparent)}
.pf-sbc i{display:block;width:100%}
.pf-sbc i.paid,.pf-lg.paid{background:#8b5cf6}
.pf-sbc i.decl,.pf-lg.decl{background:#22b8f0}
.pf-sbc i.est,.pf-lg.est{background:#1f6f99}
.pf-sbl{font-size:10.5px;color:var(--qw-ink3);margin-top:5px;text-transform:uppercase;letter-spacing:.05em}
.pf-lg{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
@media (max-width:640px){.pf-sbv{display:none}.pf-sbars{gap:3px}}
.pf-dhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.pf-dhead>b{font:600 19px "Fraunces",Georgia,serif}
.pf-nav-b{all:unset;cursor:pointer;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;border:1px solid var(--qw-line2);background:var(--qw-sur2);font-size:16px;color:var(--qw-ink)}
.pf-mtot{font-size:12px;font-weight:700;color:var(--qw-good);background:var(--qw-good-soft);border-radius:7px;padding:3px 8px}
.pf-dgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid var(--qw-line2);border-left:1px solid var(--qw-line2)}
.pf-dow{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--qw-ink3);padding:8px 8px;border-right:1px solid var(--qw-line2);border-bottom:1px solid var(--qw-line2)}
.pf-dd{min-height:96px;padding:6px;border-right:1px dashed var(--qw-line2);border-bottom:1px dashed var(--qw-line2);display:flex;flex-direction:column;gap:4px;min-width:0}
.pf-dd.out{background:color-mix(in srgb,var(--qw-line2) 30%,transparent)}
.pf-dd.past .pf-dd-n{color:var(--qw-ink3)}
.pf-dd.today{background:color-mix(in srgb,var(--qw-acc) 10%,transparent)}
.pf-dd.today .pf-dd-n{background:var(--qw-acc);color:var(--qw-bg,#0b0f0e);border-radius:99px;padding:1px 7px}
.pf-dd-h{display:flex;justify-content:space-between;align-items:center;gap:4px}
.pf-dd-n{font-size:12px;font-weight:600;color:var(--qw-ink2)}
.pf-dd-t{font-size:11px;font-weight:700;color:var(--qw-good)}
.pf-dd-ex{font-size:10px;color:var(--qw-ink3)}
.pf-pay{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:20px minmax(0,1fr);grid-template-rows:auto auto;column-gap:6px;align-items:center;
  padding:5px 6px;border-radius:7px;background:var(--qw-sur2);border:1px solid var(--qw-line2);border-left:3px solid #1f6f99;min-width:0}
.pf-pay:hover{border-color:var(--qw-acc-line)}
.pf-pay.paid{border-left-color:#8b5cf6}.pf-pay.decl{border-left-color:#22b8f0}.pf-pay.est{border-left-color:#1f6f99;border-left-style:dashed}.pf-pay.pend{border-left-color:var(--qw-orange)}
.pf-pay .pf-logo{grid-row:1/3}
.pf-pay-t{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--qw-ink2)}
.pf-pay-t b{color:var(--qw-ink)}
.pf-pay-a{font-size:11px;font-weight:600;color:var(--qw-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-pay-a i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#8b5cf6;vertical-align:1px;margin:0 2px}
.pf-logo{display:inline-flex;width:20px;height:20px;border-radius:5px;overflow:hidden;background:#fff;align-items:center;justify-content:center;flex:none}
.pf-logo img{width:100%;height:100%;object-fit:contain}
.pf-logo.txt{background:var(--qw-acc-soft);color:var(--qw-acc);font:700 7.5px "IBM Plex Sans",sans-serif;letter-spacing:-.02em}
.pf-lrow{display:inline-flex;align-items:center;gap:7px}
.pf-stb{font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px;color:#fff}
.pf-stb.paid{background:#8b5cf6}.pf-stb.decl{background:#22b8f0}.pf-stb.est{background:#1f6f99}.pf-stb.pend{background:var(--qw-orange)}
@media (max-width:640px){.pf-dd{min-height:60px;padding:3px}.pf-pay{grid-template-columns:1fr;padding:3px}.pf-pay .pf-logo,.pf-pay-t{display:none}}
.pf-box-wide{width:min(980px,96vw)}
.pf-mk{stroke:var(--qw-sur);stroke-width:2;vector-effect:non-scaling-stroke}
.pf-mk.buy{fill:#2fbf71}.pf-mk.sell{fill:#e5484d}.pf-mk.div{fill:#3b82f6}
.pf-mkd{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.pf-mkd.buy{background:#2fbf71}.pf-mkd.sell{background:#e5484d}.pf-mkd.div{background:#3b82f6}
.pf-stk{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.pf-stk>div{flex:1 1 110px;padding:9px 11px;border:1px solid var(--qw-line2);border-radius:11px;background:var(--qw-sur2);display:flex;flex-direction:column;gap:2px}
.pf-stk b{font:600 15px "IBM Plex Sans",sans-serif;color:var(--qw-ink)}
.pf-stk em{font-style:normal;font-size:10.5px;color:var(--qw-ink3);text-transform:uppercase;letter-spacing:.06em}
.pf-seg{display:inline-flex;border:1px solid var(--qw-line2);border-radius:10px;padding:2px;background:var(--qw-sur2);flex-wrap:wrap}
.pf-seg button{all:unset;cursor:pointer;padding:6px 11px;border-radius:8px;font:600 12px "IBM Plex Sans",sans-serif;color:var(--qw-ink3)}
.pf-seg button.on{background:var(--qw-acc-soft);color:var(--qw-acc)}
.pf-chart{position:relative}
.pf-chart svg{display:block;width:100%;height:auto;overflow:visible}
.pf-gl{stroke:var(--qw-line);stroke-width:1}
.pf-g0{stroke:var(--qw-line3);stroke-width:1;stroke-dasharray:4 4}
.pf-gt{fill:var(--qw-ink3);font:500 11px "IBM Plex Sans",sans-serif}
.pf-ln{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.pf-ln.a{stroke:var(--qw-acc)}
.pf-ln.b{stroke:var(--qw-orange,#e8a23a);stroke-dasharray:5 4;stroke-width:1.6}
.pf-area{fill:color-mix(in srgb,var(--qw-acc) 12%,transparent)}
.pf-hl{stroke:var(--qw-line3);stroke-width:1}
.pf-tip{position:absolute;display:none;pointer-events:none;min-width:170px;padding:9px 11px;border-radius:11px;background:var(--qw-sur);border:1px solid var(--qw-line2);
  box-shadow:var(--qw-shadow);font:500 12px "IBM Plex Sans",sans-serif;color:var(--qw-ink2);z-index:5}
.pf-tip b{color:var(--qw-ink)}
.pf-tip i,.pf-leg i{display:inline-block;width:12px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
.pf-tip i.a,.pf-leg i.a{background:var(--qw-acc)}
.pf-tip i.b,.pf-leg i.b{background:var(--qw-orange,#e8a23a)}
.pf-leg{display:flex;gap:16px;font-size:12px;color:var(--qw-ink2);margin-top:6px;flex-wrap:wrap}
.pf-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);opacity:0;z-index:260;padding:11px 18px;border-radius:12px;
  background:var(--qw-sur);border:1px solid var(--qw-acc-line);box-shadow:var(--qw-shadow);font:600 13px "IBM Plex Sans",sans-serif;color:var(--qw-ink);transition:all .3s var(--qw-ease)}
.pf-toast.on{opacity:1;transform:translate(-50%,0)}
@media (max-width:640px){.pf-grid{grid-template-columns:1fr}}

/* ---------- Tickermenu (journal / screener -> tools) ---------- */
.qw-tmenu{position:fixed;z-index:260;min-width:230px;padding:6px;border-radius:14px;background:var(--qw-sur);border:1px solid var(--qw-line2);
  box-shadow:var(--qw-shadow),0 24px 50px -24px rgba(0,0,0,.6);font-family:"IBM Plex Sans",system-ui,sans-serif;display:none}
.qw-tmenu.show{display:block;animation:qwRise .14s var(--qw-ease)}
.qw-tmenu .hd{padding:6px 10px 8px;font:600 15px "Fraunces",Georgia,serif;color:var(--qw-ink);border-bottom:1px solid var(--qw-line);margin-bottom:4px}
.qw-tmenu a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;color:var(--qw-ink2);text-decoration:none;font-size:13px}
.qw-tmenu a:hover{background:var(--qw-acc-soft);color:var(--qw-ink)}
.qw-tmenu .ic{width:20px;text-align:center}
html[data-qw="journal"] td.td-ticker{cursor:pointer}
html[data-qw="journal"] td.td-ticker:hover{color:var(--qw-acc)!important;text-decoration:underline dashed;text-underline-offset:4px}
.qw-tick{cursor:pointer;border-bottom:1px dashed var(--qw-line3)}
.qw-tick:hover{color:var(--qw-acc)!important;border-bottom-color:var(--qw-acc)}

/* ---------- Ctrl+K: snel naar elke tool, elk tabblad of elk stuk handleiding ---------- */
.qw-k-bd{position:fixed;inset:0;z-index:300;background:rgba(3,7,6,.45);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center;padding-top:12vh}
.qw-k-bd.show{display:flex;animation:qwFade .15s}
.qw-k{width:min(600px,92vw);border-radius:18px;background:var(--qw-sur);border:1px solid var(--qw-line2);box-shadow:var(--qw-shadow),0 40px 80px -30px rgba(0,0,0,.7);
  overflow:hidden;font-family:"IBM Plex Sans",system-ui,sans-serif;color:var(--qw-ink);animation:qwRise .18s var(--qw-ease)}
.qw-k input{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid var(--qw-line);background:transparent;color:var(--qw-ink);
  font:inherit;font-size:16px;padding:18px 20px;outline:none;text-transform:none}
.qw-k ul{list-style:none;margin:0;padding:6px;max-height:52vh;overflow:auto}
.qw-k li{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:11px;cursor:pointer;font-size:14px}
.qw-k li .k{margin-left:auto;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--qw-ink3)}
.qw-k li .ic{width:26px;text-align:center;opacity:.85}
.qw-k li.sel{background:var(--qw-acc-soft);color:var(--qw-ink)}
.qw-k .foot{display:flex;gap:14px;padding:9px 16px;border-top:1px solid var(--qw-line);font-size:11px;color:var(--qw-ink3)}
.qw-k kbd,.qwnav kbd{font:600 10px "IBM Plex Sans",sans-serif;border:1px solid var(--qw-line2);border-bottom-width:2px;border-radius:5px;padding:1px 5px;color:var(--qw-ink2)}
.qwnav .qw-kbtn{flex:none;border:1px solid var(--n-line);background:transparent;color:var(--n-ink);border-radius:8px;height:28px;padding:0 9px;
  display:inline-flex;align-items:center;gap:6px;cursor:pointer;font:500 12px "IBM Plex Sans",sans-serif;margin-right:6px}
.qwnav .qw-kbtn:hover{color:var(--n-hi);background:var(--n-accbg)}
@media (max-width:640px){.qwnav .qw-kbtn span{display:none}}

/* ---------- 6. Familie "journal" ---------- */
html[data-qw="journal"] .sidebar{background:color-mix(in srgb,var(--qw-sur) 88%,transparent);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-right-color:var(--qw-line2)}
html[data-qw="journal"] .nav-item{border-radius:10px;border-left-color:transparent!important;transition:background .15s,color .15s}
html[data-qw="journal"] .nav-item:hover{transform:none;background:var(--qw-sur2)}
html[data-qw="journal"] .nav-item.active{background:var(--qw-acc-soft);color:var(--qw-acc)!important;
  box-shadow:inset 2px 0 0 var(--qw-acc)}
html[data-qw="journal"] .panel,html[data-qw="journal"] .goal-card,html[data-qw="journal"] #fi-meter-card,
html[data-qw="journal"] .kpi{border-radius:18px!important;border:1px solid var(--qw-line2)!important;box-shadow:var(--qw-shadow)!important;
  background:linear-gradient(180deg,var(--qw-sur),color-mix(in srgb,var(--qw-sur) 92%,var(--qw-bg)))!important}
html[data-qw="journal"] .panel:hover{border-color:var(--qw-line3)!important}
html[data-qw="journal"] .panel-title{color:var(--qw-ink2);letter-spacing:.08em}
html[data-qw="journal"] .stat{border-radius:18px;border-color:var(--qw-line2)!important;box-shadow:var(--qw-shadow)!important;
  background:linear-gradient(180deg,var(--qw-sur2),var(--qw-sur))!important}
html[data-qw="journal"] .stat:hover{transform:translateY(-1px)}
html[data-qw="journal"] .stat-lbl{color:var(--qw-ink3)}
html[data-qw="journal"] .stat-val{letter-spacing:-.02em}
html[data-qw="journal"] .hero{border-radius:22px!important;border-color:var(--qw-line2)!important;box-shadow:var(--qw-shadow)!important;
  background:radial-gradient(700px 240px at 0% 0%,rgba(var(--qw-acc-rgb),.10),transparent 70%),linear-gradient(180deg,var(--qw-sur2),var(--qw-sur))!important}
html[data-qw="journal"] .hero::before{background:linear-gradient(90deg,transparent,var(--qw-acc),transparent)!important;opacity:.55!important;height:1px!important}
html[data-qw="journal"] .hero-amt{letter-spacing:-.03em}
html[data-qw="journal"] .btn{border-radius:10px;border-color:var(--qw-line2);background:var(--qw-sur);box-shadow:var(--qw-shadow-sm);
  transition:background .15s,border-color .15s,color .15s,transform .15s var(--qw-ease)}
html[data-qw="journal"] .btn:hover{border-color:var(--qw-line3);background:var(--qw-sur2)}
html[data-qw="journal"] .btn.grn{background:var(--qw-acc)!important;border-color:var(--qw-acc)!important;color:var(--qw-on-acc)!important;
  font-family:"IBM Plex Sans",system-ui,sans-serif;box-shadow:0 8px 22px -12px rgba(var(--qw-acc-rgb),.7)!important}
html[data-qw="journal"] .btn.grn:hover{transform:translateY(-1px);filter:brightness(1.06)}
html[data-qw="journal"] .btn.grn{border-radius:10px!important}   /* de groene hoofdknop was als enige helemaal rond; nu net zo afgerond als de andere knoppen */
html[data-qw="tool"] .sc-btn,html[data-qw="tool"] .iv-btn{border-radius:10px}   /* 10 px op alle gereedschapspagina's (was 11 door de algemene knopregel) */
html[data-qw="journal"] .tbl-wrap{border-radius:14px;border-color:var(--qw-line2);background:var(--qw-sur)}
html[data-qw="journal"] th{background:var(--qw-sur2)!important;color:var(--qw-ink3);border-bottom:1px solid var(--qw-line2)!important}
html[data-qw="journal"] td{border-bottom-color:var(--qw-line)!important}
html[data-qw="journal"] tbody tr:hover,html[data-qw="journal"] tr:hover td{background:var(--qw-row-hover)!important}
html[data-qw="journal"] input,html[data-qw="journal"] select,html[data-qw="journal"] textarea{border-radius:10px;border-color:var(--qw-line2);
  background:var(--qw-sur2);box-shadow:var(--qw-hi);font-family:"IBM Plex Sans",system-ui,sans-serif}
html[data-qw="journal"] input:focus,html[data-qw="journal"] select:focus,html[data-qw="journal"] textarea:focus{border-color:var(--qw-acc-line);box-shadow:0 0 0 4px var(--qw-acc-soft)}
html[data-qw="journal"] .overlay{background:rgba(4,8,7,.62)!important;backdrop-filter:blur(10px) saturate(1.2)}
html[data-qw="journal"] .modal{border-radius:22px;border-color:var(--qw-line2);box-shadow:var(--qw-shadow),0 40px 80px -30px rgba(0,0,0,.7)}
html[data-qw="journal"] .pos-card{border-radius:14px;border-color:var(--qw-line2);background:var(--qw-sur2);box-shadow:var(--qw-hi)}
html[data-qw="journal"] .hm-tab-btn{border-radius:9px}
html[data-qw="journal"] .hm-tab-btn.active{background:var(--qw-acc-soft);border-color:var(--qw-acc-line);color:var(--qw-acc)}
html[data-qw="journal"] .avatar{background:linear-gradient(135deg,var(--qw-acc),color-mix(in srgb,var(--qw-acc) 40%,#7C8CFF))!important;color:var(--qw-on-acc)}
html[data-qw="journal"] .mnav-bar{background:color-mix(in srgb,var(--qw-sur) 86%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}

/* ---------- 7. Familie "scanner" ---------- */
html[data-qw="scanner"] .stat,html[data-qw="scanner"] .panel,html[data-qw="scanner"] .apibar,html[data-qw="scanner"] .dcard{
  border-radius:16px;border-color:var(--qw-line2);box-shadow:var(--qw-shadow-sm);background:linear-gradient(180deg,var(--qw-sur2),var(--qw-sur))}
html[data-qw="scanner"] .tw{border-radius:16px;border-color:var(--qw-line2);box-shadow:var(--qw-shadow)}
html[data-qw="scanner"] thead th{background:var(--qw-sur2);position:sticky;top:0;z-index:2}
html[data-qw="scanner"] tr.dr:hover td{background:var(--qw-row-hover)}
html[data-qw="scanner"] td{border-bottom-color:var(--qw-line)}
html[data-qw="scanner"] button{border-radius:10px;border-color:var(--qw-line2)}
html[data-qw="scanner"] button.prim{background:var(--qw-acc);border-color:var(--qw-acc);color:var(--qw-on-acc);font-weight:600}
html[data-qw="scanner"] button.prim:hover{filter:brightness(1.06);background:var(--qw-acc);color:var(--qw-on-acc)}
html[data-qw="scanner"] .seg,html[data-qw="scanner"] .idxtgl,html[data-qw="scanner"] .viewtgl{border-radius:12px;box-shadow:var(--qw-hi)}
html[data-qw="scanner"] .ddm{border-radius:14px;box-shadow:var(--qw-shadow),0 30px 60px -30px rgba(0,0,0,.6)}
html[data-qw="scanner"] .sv{letter-spacing:-.02em}

/* ---------- 8. Handleiding: (i)-knopje, uitschuifpaneel, Manual-pagina ---------- */
.qw-i{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:17px;height:17px;margin-left:8px;border-radius:50%;border:1px solid var(--qw-line3);color:var(--qw-ink3);
  font:italic 600 10.5px/1 Georgia,"Fraunces",serif;cursor:pointer;vertical-align:middle;letter-spacing:0;text-transform:none;
  transition:color .15s,border-color .15s,background .15s,transform .15s}
.qw-i:hover{color:var(--qw-acc);border-color:var(--qw-acc-line);background:var(--qw-acc-soft);transform:scale(1.08)}
.qw-i.qw-i-lg{width:20px;height:20px;font-size:12px}
h1 > .qw-i{position:relative;top:-2px}
.qw-help-bd{position:fixed;inset:0;z-index:200;background:rgba(3,7,6,.38);opacity:0;pointer-events:none;transition:opacity .2s}
.qw-help{position:fixed;top:0;right:0;bottom:0;z-index:201;width:min(430px,100vw);display:flex;flex-direction:column;
  background:var(--qw-sur);border-left:1px solid var(--qw-line2);box-shadow:-30px 0 60px -30px rgba(0,0,0,.6);
  transform:translateX(104%);transition:transform .26s var(--qw-ease);color:var(--qw-ink);
  font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:14px;line-height:1.6;text-align:left}
body.qw-help-open .qw-help{transform:none}
body.qw-help-open .qw-help-bd{opacity:1;pointer-events:auto}
.qw-h-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:22px 24px 16px;
  border-bottom:1px solid var(--qw-line);background:radial-gradient(420px 160px at 0 0,rgba(var(--qw-acc-rgb),.10),transparent 70%)}
.qw-h-grp{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--qw-acc);font-weight:600}
.qw-h-head h3{margin:4px 0 0;font:600 22px/1.2 "Fraunces",Georgia,serif;letter-spacing:-.01em;color:var(--qw-ink)}
.qw-h-x{all:unset;cursor:pointer;width:32px;height:32px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;
  font-size:22px;color:var(--qw-ink3);border:1px solid var(--qw-line2)}
.qw-h-x:hover{color:var(--qw-ink);background:var(--qw-sur2)}
.qw-h-body{padding:18px 24px 28px;overflow-y:auto}
.qw-h-body p,.qw-m-e p{margin:0 0 12px;color:var(--qw-ink2)}
.qw-h-what{font-size:15px;color:var(--qw-ink)!important}
.qw-h-sec{margin:18px 0 8px;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--qw-ink3);font-weight:600}
.qw-h-dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 14px}
.qw-h-dl dt{font-weight:600;color:var(--qw-ink);white-space:nowrap}
.qw-h-dl dd{margin:0;color:var(--qw-ink2)}
@media (max-width:520px){.qw-h-dl{grid-template-columns:1fr}.qw-h-dl dd{margin-bottom:6px}}
.qw-h-watch{margin:16px 0 4px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--qw-warn) 10%,transparent);
  border:1px solid color-mix(in srgb,var(--qw-warn) 30%,transparent);color:var(--qw-ink2)}
.qw-h-watch b{color:var(--qw-warn);margin-right:6px}
.qw-h-more{display:inline-block;margin-top:20px;color:var(--qw-acc);font-weight:600;text-decoration:none}
.qw-h-more:hover{text-decoration:underline}
/* Manual-pagina */
#qw-manual{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:14.5px;line-height:1.65;text-align:left}
.qw-m-search{position:sticky;top:50px;z-index:5;padding:6px 0 14px;background:linear-gradient(var(--qw-bg) 70%,transparent)}
.qw-m-search input{width:100%;box-sizing:border-box;padding:13px 16px;border-radius:14px;border:1px solid var(--qw-line2);
  background:var(--qw-sur);color:var(--qw-ink);font:inherit;font-size:15px;box-shadow:var(--qw-shadow-sm);text-transform:none}
.qw-m-search input:focus{outline:none;border-color:var(--qw-acc-line);box-shadow:0 0 0 4px var(--qw-acc-soft)}
.qw-m-grid{display:grid;grid-template-columns:220px 1fr;gap:28px;align-items:start}
.qw-m-nav{position:sticky;top:120px;display:flex;flex-direction:column;gap:2px;max-height:calc(100vh - 140px);overflow:auto}
.qw-m-nav a{color:var(--qw-ink2);text-decoration:none;padding:5px 10px;border-radius:8px;font-size:13px}
.qw-m-nav a:hover{background:var(--qw-sur2);color:var(--qw-ink)}
.qw-m-navg{margin:14px 10px 4px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--qw-ink3);font-weight:600}
.qw-m-g{font:600 20px "Fraunces",Georgia,serif;margin:26px 0 12px!important}
.qw-m-e{background:var(--qw-sur);border:1px solid var(--qw-line2);border-radius:16px;padding:18px 22px;margin-bottom:12px;
  box-shadow:var(--qw-shadow-sm);scroll-margin-top:130px}
.qw-m-e h3{margin:0 0 8px;font:600 17px "Fraunces",Georgia,serif;color:var(--qw-ink)}
.qw-m-e.qw-m-hit{border-color:var(--qw-acc-line);box-shadow:0 0 0 4px var(--qw-acc-soft)}
.qw-m-none{color:var(--qw-ink3)}
@media (max-width:760px){.qw-m-grid{grid-template-columns:1fr}.qw-m-nav{display:none}}

/* ---------- 9. Rustige beweging (uit bij 'reduce motion') ---------- */
@media (prefers-reduced-motion:reduce){ html[data-qw] *{transition:none!important;animation:none!important} }

/* ---------- 10. Option Bridge look: vlak, lijnen, serif-koppen, KPI-balk (2026-10-09) ---------- */
html[data-qw] body{background-image:none!important;font-family:"IBM Plex Sans",system-ui,sans-serif}
html[data-qw] h1,html[data-qw] h2,html[data-qw] h3{font-family:"Fraunces",Georgia,serif;font-weight:400}
html[data-qw="tool"] h2{font-size:22px;margin-top:34px}

/* menubalk bovenaan: plat, hoofdletter-groepen met onderstreping, vierkante uitklapmenu's */
html[data-qw] .qwnav.qwt{background:var(--qw-bg);border-bottom:1px solid var(--qw-line2);height:52px}
html body{margin-top:52px!important;min-height:calc(100vh - 52px)!important}
html[data-qw="journal"] .sidebar{top:52px!important}
html[data-qw] .qwt .qwt-brand{font-family:"Fraunces",Georgia,serif;font-weight:400;font-size:25px;letter-spacing:-.01em;margin-right:26px}
html[data-qw] .qwt .qwt-dot{display:none}
html[data-qw] .qwt .qwt-brand .qwt-i{font-style:italic;color:var(--qw-acc)}
html[data-qw] .qwt .qwt-b,html[data-qw] .qwt a.qwt-b{border-radius:0;height:52px;padding:0 13px;font:600 11.5px "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--qw-ink2);
  border-bottom:2px solid transparent;margin-bottom:-1px}
html[data-qw] .qwt .qwt-b:hover,html[data-qw] .qwt .qwt-g:focus-within>.qwt-b,html[data-qw] .qwt .qwt-g.open>.qwt-b{background:transparent;color:var(--qw-ink)}
html[data-qw] .qwt .qwt-b.on{background:transparent;color:var(--qw-ink);border-bottom-color:var(--qw-acc)}
html[data-qw] .qwt .qwt-b>svg:first-child{display:none}
html[data-qw] .qwt .qwt-b.qwt-acct>svg:first-child,html[data-qw] .qwt .qwt-b.qwt-burger>svg:first-child,html[data-qw] .qwt #qw-tt{display:inline}
html[data-qw] .qwt .qwt-m{top:calc(100% - 1px);border-radius:0;border:1px solid var(--qw-ink);box-shadow:6px 6px 0 var(--qw-line2);padding:6px 0;min-width:300px;background:var(--qw-bg)}
html[data-qw] .qwt .qwt-m a{border-radius:0;padding:8px 16px}
html[data-qw] .qwt .qwt-m a:hover,html[data-qw] .qwt .qwt-m a.on{background:var(--qw-sur3)}
html[data-qw] .qwt .qwt-m a .mi{display:none}
html[data-qw] .qwt .qwt-m a b{font:600 13.5px "IBM Plex Sans",sans-serif}
html[data-qw] .qwt .qwt-m a.on b:after{content:" •";color:var(--qw-acc)}
html[data-qw] .qwt .qwt-k{border-radius:0;border-color:var(--qw-line3);min-width:220px;height:34px;background:transparent;color:var(--qw-ink3);font:12.5px "IBM Plex Mono",monospace}
html[data-qw] .qwt .qwt-k:hover{border-color:var(--qw-ink);color:var(--qw-ink)}

/* tweede rij: alle zusterpagina's van het huidige onderdeel, altijd zichtbaar */
.qwsub{position:fixed;top:52px;left:0;right:0;z-index:69;height:38px;display:flex;align-items:center;gap:2px;padding:0 14px;background:var(--qw-bg);border-bottom:1px solid var(--qw-line)}
.qwsub .qs-g{font:600 10px "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--qw-ink3);margin-right:12px}
.qwsub a{padding:0 12px;height:38px;display:flex;align-items:center;font:500 13px "IBM Plex Sans",sans-serif;color:var(--qw-ink2);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.qwsub a:hover{color:var(--qw-ink)}
.qwsub a.on{color:var(--qw-ink);border-bottom-color:var(--qw-acc);font-weight:600}
.qwsub .qs-tape{margin-left:auto;display:flex;gap:18px;font:11.5px "IBM Plex Mono",monospace;color:var(--qw-ink3)}
.qwsub .qs-tape b{color:var(--qw-ink);font-weight:600;margin-left:5px}
html.qw-hassub body{margin-top:90px!important;min-height:calc(100vh - 90px)!important}
html.qw-hassub[data-qw="journal"] .sidebar{top:90px!important}
@media (max-width:900px){.qwsub{display:none}html.qw-hassub body{margin-top:52px!important}}

/* kaarten, vakjes en chips: vierkanter, geen schaduw */
html[data-qw] .card,html[data-qw] .tc,html[data-qw] .chip,html[data-qw] [class$="-card"],html[data-qw] .panel{border-radius:4px!important;box-shadow:none!important;background-image:none!important}
html[data-qw="tool"] .card{background:var(--qw-sur);border-color:var(--qw-line2)}
html[data-qw] .tabs button,html[data-qw] .tabs select,html[data-qw] .btabs button,html[data-qw] button,html[data-qw] input,html[data-qw] select,html[data-qw] textarea{border-radius:3px}
html[data-qw="tool"] button:hover{transform:none;box-shadow:none}
html[data-qw] .tabs button,html[data-qw] .btabs button{border-radius:3px!important;font-family:"IBM Plex Mono",monospace}

/* paginakop (server-pagina's): serif-titel, regel eronder, kopje met merknaam weg (die staat al in de balk) */
html[data-qw="tool"] .wrap>.eyebrow{font:600 10.5px "IBM Plex Mono",monospace;letter-spacing:.14em;color:var(--qw-ink3);margin:2px 0 0}
html[data-qw="tool"] .wrap h1{font-size:44px;line-height:1.05;margin:6px 0 6px;letter-spacing:-.01em}
html[data-qw="tool"] .wrap>.sub{color:var(--qw-ink2);font-size:13.5px;padding-bottom:16px;margin-bottom:0;border-bottom:1px solid var(--qw-ink)}
html[data-qw="tool"] .wrap>.chips{gap:0;margin:0 0 22px;border-bottom:1px solid var(--qw-line2)}
html[data-qw="tool"] .wrap>.chips .chip{background:transparent;border:0;border-left:1px solid var(--qw-line2);border-radius:0!important;padding:16px 22px 14px;min-width:150px}
html[data-qw="tool"] .wrap>.chips .chip:first-child{border-left:0;padding-left:0}
html[data-qw="tool"] .wrap>.chips .chip b{font:500 28px/1.1 "IBM Plex Mono",monospace;letter-spacing:-.02em}
html[data-qw="tool"] .wrap>.chips .chip span{font:600 10px "IBM Plex Mono",monospace;letter-spacing:.12em}
html[data-qw="tool"] .wrap>.chips:empty{border:0;margin:0}

/* tabellen en lijstjes: dunne lijnen, kleine hoofdletter-koppen */
html[data-qw="tool"] .tbl th,html[data-qw="tool"] table th{font:600 10.5px "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase}

/* de eigen grafiekpagina's (Options map, Regime, Risk, Results, Arena, Ticker view): zelfde vlakke kaarten */
.mpx .card,.rkx .card,.rgx .card,.tkx .card,.rsx .card,.arx .card{border-radius:4px;background:var(--qw-sur)}
.mpx .tc,.rkx .tc{border-radius:4px}

html[data-qw] .qwt .qwt-b.qwt-right-hide>svg:first-child{display:inline}

/* grote ronde vlakken van de losse pagina's (Today, Journal, Portfolio) naar dezelfde vierkante vorm */
html[data-qw] .brief,html[data-qw] a.tool,html[data-qw] .hnode,html[data-qw] .po-tile,html[data-qw] .hero,html[data-qw] .goal-card,html[data-qw] .stat,
html[data-qw] .tbl-wrap,html[data-qw] .acc-toggle-wrap,html[data-qw] .user-chip,html[data-qw] .pf-side,html[data-qw] .pf-accs,html[data-qw] .dv-cal,
html[data-qw] table.tbl,html[data-qw] .scroll,html[data-qw] .nav-item,html[data-qw] .btn,html[data-qw] .fi-pill,html[data-qw] .pf-cur,html[data-qw] .pf-ni,html[data-qw] .pf-acc{border-radius:4px!important}
html[data-qw] .heatmap-cell{border-radius:3px!important}
html[data-qw] .brief,html[data-qw] .hero,html[data-qw] .goal-card,html[data-qw] .stat,html[data-qw] .dv-cal{box-shadow:none!important;background-image:none!important}

.qwsub .qs-g,.qwsub .qs-tape span{white-space:nowrap}
.qwsub{overflow:hidden}
@media (max-width:1240px){.qwsub .qs-tape span:nth-child(3){display:none}}
@media (max-width:1050px){.qwsub .qs-tape span:nth-child(2){display:none}}

/* 11. PDF-knop + afdrukstijl (rapportpagina's): menu weg, lichte kleuren, geen kop-/voetregel met link (paginamarge 0, witruimte in de pagina) */
.qw-pdf{position:fixed;right:16px;bottom:16px;z-index:60;padding:7px 14px;border:1px solid var(--qw-line2);border-radius:4px;background:var(--qw-bg);color:var(--qw-ink);font:600 12px "IBM Plex Mono",monospace;letter-spacing:.06em;cursor:pointer}
.qw-pdf:hover{border-color:var(--qw-ink)}
@media print{
  @page{size:A4;margin:0}
  html body{margin:0!important;padding:12mm!important;background:#fff!important;box-decoration-break:clone;-webkit-box-decoration-break:clone;-webkit-print-color-adjust:exact;print-color-adjust:exact;min-height:0!important}
  .qwnav,.qwsub,.qw-pdf,.qw-k,.qw-help,.qw-toast,#qw-k,button.qw-kbtn{display:none!important}
  .fn-bar,.buttons,select,textarea,input[type=text],input[type=number],button.primary-btn{display:none!important}
  .scroll,.tscroll{overflow:visible!important}
  .tbl{width:100%!important;font-size:11px!important}.tbl th,.tbl td{padding:5px 6px!important}.tbl th{white-space:normal!important}
  .back{display:none!important}
  .wrap{max-width:none!important}
  tr,.card,.chip,.chips>*{break-inside:avoid}
  a{color:inherit!important;text-decoration:none!important}
}

/* ── Journal v2 (2026-10-16): glazen panelen en positiekaarten, alleen visueel ── */
html[data-qw="journal"] .panel,html[data-qw="journal"] .goal-card,html[data-qw="journal"] .tbl-wrap{border-radius:18px!important;background:linear-gradient(180deg,color-mix(in srgb,var(--txt) 5%,transparent),transparent 45%),var(--sur)!important;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--txt) 7%,transparent),0 22px 40px -32px rgba(0,0,0,.7)!important}
html[data-qw="journal"] .pos-card{border-radius:14px!important;background:linear-gradient(180deg,color-mix(in srgb,var(--txt) 4.5%,transparent),transparent),var(--sur2)!important;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--txt) 6%,transparent)!important;transition:transform .22s,border-color .22s,box-shadow .22s}
html[data-qw="journal"] .pos-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--acc) 55%,transparent)!important;box-shadow:0 18px 30px -20px rgba(0,0,0,.75)!important}
html[data-qw="journal"] .pos-pnl{text-shadow:0 0 16px color-mix(in srgb,currentColor 38%,transparent)}
html[data-qw="journal"] .pos-spark i{box-shadow:0 0 9px -1px var(--acc)}
html[data-qw="journal"] .hero{border-radius:18px!important}
@media(prefers-reduced-motion:reduce){html[data-qw="journal"] .pos-card{transition:none}}

@keyframes jflu{0%{text-shadow:0 0 0 transparent}30%{text-shadow:0 0 18px var(--grn)}100%{text-shadow:0 0 16px color-mix(in srgb,currentColor 38%,transparent)}}@keyframes jfld{0%{text-shadow:0 0 0 transparent}30%{text-shadow:0 0 18px var(--red)}100%{text-shadow:0 0 16px color-mix(in srgb,currentColor 38%,transparent)}}
html[data-qw="journal"] .pos-pnl.jfl-up{animation:jflu 1.4s}html[data-qw="journal"] .pos-pnl.jfl-dn{animation:jfld 1.4s}

/* huidige ticker in de menubalk */
.qwnav .qw-ct{position:relative;flex:none;margin-right:8px}
.qwnav .qw-ct .ctb{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border:1px solid var(--n-line);background:transparent;color:var(--n-ink);border-radius:99px;cursor:pointer;font:12px "IBM Plex Sans",sans-serif;white-space:nowrap}
.qwnav .qw-ct .ctb b{font:600 12.5px "IBM Plex Mono",monospace;color:var(--n-hi)}.qwnav .qw-ct .ctb i{font-style:normal;font-size:9px;opacity:.7}
.qwnav .qw-ct .ctb:hover,.qwnav .qw-ct.open .ctb{border-color:var(--qw-acc);background:var(--n-accbg)}
.qwnav .qw-ct .ctm{display:none;position:fixed;min-width:200px;background:var(--qw-sur);border:1px solid var(--qw-line3);border-radius:12px;padding:6px;box-shadow:0 14px 40px rgba(0,0,0,.45);z-index:200}
.qwnav .qw-ct.open .ctm{display:block}
.qwnav .qw-ct .ctm a{display:block;padding:7px 10px;border-radius:8px;color:var(--qw-ink);text-decoration:none;font:500 13px "IBM Plex Sans",sans-serif;height:auto;background:none}
.qwnav .qw-ct .ctm a:hover{background:var(--qw-sur2);color:var(--qw-ink)}
.qwnav .qw-ct .ctm hr{border:0;border-top:1px solid var(--qw-line);margin:4px 0}
.qwnav .qw-ct .ctm .clr{display:block;width:100%;text-align:left;padding:7px 10px;border:0;background:none;color:var(--qw-ink3);font:12.5px "IBM Plex Sans",sans-serif;cursor:pointer;border-radius:8px}.qwnav .qw-ct .ctm .clr:hover{background:var(--qw-sur2)}
@media (max-width:640px){.qwnav .qw-ct .ctl{display:none}}
/* telefoon-reparaties (audit 2026-10-17): vier pagina's liepen horizontaal uit op 390px */
@media (max-width:700px){
  .sf .amb{left:0!important;right:0!important}
  html .cax .grid{grid-template-columns:repeat(7,minmax(0,1fr))!important}
  html .cax .day,html .cax .dow{min-width:0;overflow:hidden;padding:3px 2px!important}
  html .cax .day{min-height:64px!important}
  html .cax .ev{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:9px!important;padding:1px 3px!important}
  html .cax .dow{font-size:8.5px!important;letter-spacing:0!important}
  .pf-eq,.dv-cal{min-width:0;max-width:100%;overflow-x:auto}
  .pf-mv{min-width:0}.pf-mv .pf-mv-n{min-width:0;overflow:hidden}.pf-mv-n .dim{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #rs-root .cmp{grid-template-columns:1fr!important;gap:4px!important}#rs-root .cmp>span:last-child{text-align:left!important}
}
/* Journal: tabbalk bovenaan in plaats van de zijbalk */
@media (min-width:901px){
html.qw-jtabs aside.sidebar{display:none!important}
html.qw-jtabs .layout{display:block!important}
html.qw-jtabs main.main{margin-left:0!important;width:100%!important;max-width:100%!important}
}
.qw-jt{position:sticky;top:90px;z-index:40;display:flex;align-items:center;gap:14px;overflow-x:auto;scrollbar-width:none;padding:8px 0;margin:2px 0 12px;background:var(--bg)}
.qw-jt::-webkit-scrollbar{display:none}
.qw-jt .jg{display:flex;align-items:center;gap:4px;flex:none;padding-right:14px;border-right:1px solid var(--qw-line2,rgba(255,255,255,.12))}
.qw-jt .jgl{font:600 9.5px "IBM Plex Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-right:4px}
.qw-jt .jtab{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:99px;font:500 13px "IBM Plex Sans",sans-serif;color:var(--dim);white-space:nowrap;border:1px solid transparent;transition:background .15s,color .15s}
.qw-jt .jtab svg{width:15px;height:15px;flex:none}
.qw-jt .jtab:hover{color:var(--txt);background:var(--sur2)}
.qw-jt .jtab.on{color:var(--txt);background:rgba(255,178,36,.13);border-color:rgba(255,178,36,.45)}
.qw-jt .jacc{margin-left:auto;flex:none}
.qw-jt .jacc>div{margin:0!important}.qw-jt .jacc>div>div:first-child{display:none}
.qw-jt .jacc .acc-toggle-wrap{flex-direction:row!important;gap:4px!important;padding:3px!important}
@media (max-width:900px){.qw-jt{display:none!important}}.qw-jt{scrollbar-width:none!important;-ms-overflow-style:none;-webkit-mask-image:linear-gradient(90deg,#000 94%,transparent);mask-image:linear-gradient(90deg,#000 94%,transparent)}
.qw-jt::-webkit-scrollbar{height:0!important;width:0!important;display:none!important}
.qw-jt .jgl{display:none}
.qw-jt .jg{gap:2px;padding-right:10px}.qw-jt{gap:10px}
.qw-jt .jtab{padding:6px 10px;gap:6px;font-size:12.5px}
.qw-jt .jtab svg{width:14px;height:14px}
@media (max-width:1250px){.qw-jt .jtab:not(.on) svg{display:none}}.topbar .jacc{margin:0 16px 0 auto!important;align-self:center;flex:none}
.topbar .jacc>div{margin:0!important}.topbar .jacc>div>div:first-child{display:none}
.topbar .jacc .acc-toggle-wrap{flex-direction:row!important;gap:4px!important;padding:3px!important}
/* Portfolio: tabbalk bovenaan op desktop (op de telefoon blijft de zijbalk) */
.pf-top{display:none}
@media (min-width:901px){
  .pf-top{display:flex;align-items:center;gap:18px;position:sticky;top:90px;z-index:40;background:var(--qw-bg);padding:8px 0;margin:0 0 12px}
  .pf-top .pf-tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;-webkit-mask-image:linear-gradient(90deg,#000 94%,transparent);mask-image:linear-gradient(90deg,#000 94%,transparent)}
  .pf-top .pf-tabs::-webkit-scrollbar{display:none}
  .pf-top .pf-tb{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:99px;font:500 12.5px "IBM Plex Sans",sans-serif;color:var(--qw-ink3);white-space:nowrap;border:1px solid transparent;transition:background .15s,color .15s}
  .pf-top .pf-tb svg{width:14px;height:14px;flex:none}
  .pf-top .pf-tb:hover{color:var(--qw-ink);background:var(--qw-sur2)}
  .pf-top .pf-tb.on{color:var(--qw-ink);background:rgba(124,196,255,.14);border-color:rgba(124,196,255,.45)}
  .pf-top .pf-acc2{display:flex;align-items:center;gap:8px;flex:none}
  .pf-top .pf-sel{background:var(--qw-sur2);border:1px solid var(--qw-line3);border-radius:10px;color:var(--qw-ink);font:13px "IBM Plex Sans",sans-serif;padding:7px 10px;max-width:250px;width:auto!important}
  .pf-layout{display:block!important}
  .pf-side{display:none!important}
}
@media (min-width:901px) and (max-width:1250px){.pf-top .pf-tb:not(.on) svg{display:none}}@media (min-width:901px){
  html[data-qw="tool"] .wrap:has(.pf-layout){display:block!important}
  html[data-qw="tool"] .wrap:has(.pf-layout)>div:has(>.pf-layout),html[data-qw="tool"] .wrap:has(.pf-layout) .pf-layout{display:block!important}
  html[data-qw="tool"] .wrap:has(.pf-layout)>*{grid-column:auto}
  html[data-qw="tool"] .wrap:has(.pf-layout) .pf-main{grid-column:auto}
}
/* tabbalk direct onder de menubalken (boven de paginatitel) */
@media (min-width:901px){
  html[data-qw="tool"] .wrap:has(.pf-layout){display:flex!important;flex-direction:column}
  html[data-qw="tool"] .wrap:has(.pf-layout)>div:has(>.pf-layout){display:contents!important}
  html[data-qw="tool"] .wrap:has(.pf-layout) .pf-layout{display:block!important}
  .pf-top{order:-1;margin-top:-6px!important}
}@media (min-width:901px){html.qw-jtabs main.main{overflow:visible!important}}

/* gedeelde foutkaart (qwFail) */
.qw-fail{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:18px 20px;border:1px solid var(--qw-line3);border-left:3px solid #E8736C;border-radius:14px;background:var(--qw-sur);margin:14px 0}
.qw-fail .qf-t{flex:1;min-width:220px}.qw-fail b{display:block;font:600 15px "IBM Plex Sans",sans-serif;color:var(--qw-ink);margin-bottom:3px}.qw-fail span{font-size:13px;color:var(--qw-ink3);line-height:1.5}
.qw-fail .qf-b{border:1px solid var(--qw-line3);background:var(--qw-sur2);color:var(--qw-ink);border-radius:10px;padding:8px 14px;font:500 13px "IBM Plex Sans",sans-serif;cursor:pointer}.qw-fail .qf-b:hover{border-color:var(--qw-acc)}
.qw-fail a{font-size:12.5px;color:var(--qw-ink3);text-decoration:underline}

/* Journal: een thema-knop (de site-knop); Portfolio-kaarten in dezelfde glazen stijl als de Journal */
html[data-qw="journal"] #theme-toggle{display:none!important}
html[data-qw] .dv-cal{border-radius:18px!important;background:linear-gradient(180deg,color-mix(in srgb,var(--qw-ink) 5%,transparent),transparent 45%),var(--qw-sur)!important;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--qw-ink) 7%,transparent),0 22px 40px -34px rgba(0,0,0,.7)!important;transition:border-color .22s}
html[data-qw] .dv-cal:hover{border-color:var(--qw-line3)!important}
/* server-pagina's: glazen secties, kentallen-tegels, balkjes in kolommen (qw_ui.js 'qw-fx') */
html.qw-fx .fxg{position:relative;margin:0 0 18px;padding:18px 20px;border:1px solid var(--qw-line2);border-radius:18px;background:linear-gradient(180deg,color-mix(in srgb,var(--qw-ink) 5%,transparent),transparent 45%),var(--qw-sur);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--qw-ink) 7%,transparent),0 22px 40px -34px rgba(0,0,0,.7);min-width:0}
html.qw-fx .fxg>h2{margin:0 0 12px!important;font:500 20px/1.2 Fraunces,Georgia,serif!important;border:0!important;padding:0!important}
html.qw-fx .fxg>.scroll,html.qw-fx .fxg>div>.scroll{border:0!important;background:none!important;box-shadow:none!important;border-radius:0!important}
html.qw-fx .fxg>.card{border:0!important;background:none!important;box-shadow:none!important;padding:0!important}
html.qw-fx .fxg>p.sub:last-child,html.qw-fx .fxg>.sub{margin-bottom:0}
html.qw-fx .wrap table.tbl{width:100%;border-collapse:separate;border-spacing:0}
html.qw-fx .wrap table.tbl th{position:static;font:500 10.5px "IBM Plex Sans",sans-serif!important;letter-spacing:.09em;text-transform:uppercase;color:var(--qw-ink3)!important;padding:9px 12px!important;border-bottom:1px solid var(--qw-line2)!important;background:none!important;white-space:nowrap}
html.qw-fx .wrap table.tbl td{padding:10px 12px!important;border-bottom:1px solid var(--qw-line)!important;font-variant-numeric:tabular-nums;position:relative}
html.qw-fx .wrap table.tbl tr:last-child td{border-bottom:0!important}
html.qw-fx .wrap table.tbl tr:hover td{background:color-mix(in srgb,var(--qw-ink) 4%,transparent)}
html.qw-fx td.fxc{z-index:0}html.qw-fx td.fxc>*{position:relative;z-index:1}
html.qw-fx .fxbar{position:absolute;left:8px;top:50%;height:60%;max-height:22px;transform:translateY(-50%);border-radius:5px;z-index:0;opacity:.2;pointer-events:none;transition:width .9s cubic-bezier(.2,.7,.2,1)}
html.qw-fx .fxbar.acc{background:var(--qw-acc)}html.qw-fx .fxbar.pos{background:var(--qw-good)}html.qw-fx .fxbar.neg{background:var(--qw-bad)}
html.qw-fx .fx-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin:14px 0 20px}
html.qw-fx .fxg .fx-tiles{margin:6px 0 4px}
html.qw-fx .fxt{background:var(--qw-sur);border:1px solid var(--qw-line2);border-radius:16px;padding:13px 15px;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--qw-ink) 6%,transparent);min-width:0;transition:transform .2s,border-color .2s}
html.qw-fx .fxt:hover{transform:translateY(-2px);border-color:var(--qw-line3)}
html.qw-fx .fxt b{display:block;font:500 26px/1.15 Fraunces,Georgia,serif;letter-spacing:-.01em}
html.qw-fx .fxt span{display:block;margin-top:3px;font:11px/1.35 "IBM Plex Sans",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--qw-ink3)}
html.qw-fx .fxt b.pos,html.qw-fx .fxt b.up,html.qw-fx .fxt b.good{color:var(--qw-good)}html.qw-fx .fxt b.neg,html.qw-fx .fxt b.down,html.qw-fx .fxt b.bad{color:var(--qw-bad)}
html.qw-fx .fxrv{opacity:0;transform:translateY(18px)}html.qw-fx .fxrv.show{opacity:1;transform:none;transition:opacity .6s,transform .6s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rd,0ms)}
@media (prefers-reduced-motion:reduce){html.qw-fx .fxrv{opacity:1;transform:none}}
@media (max-width:640px){html.qw-fx .fxg{padding:14px}html.qw-fx .fx-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}html.qw-fx .fxt b{font-size:22px}}
html.qw-fx .wrap .scroll{overflow-x:auto}

/* lege toestanden en zachte intrede (server-pagina's) */
html[data-qw] .wrap p.empty{padding:26px 18px;text-align:center;color:var(--qw-ink3);border:1px dashed var(--qw-line3);border-radius:14px;background:color-mix(in srgb,var(--qw-sur) 70%,transparent);font-size:13.5px;line-height:1.55}
@keyframes qwIn{from{opacity:0}to{opacity:1}}
html[data-qw] .wrap{animation:qwIn .35s ease-out}
@media (prefers-reduced-motion:reduce){html[data-qw] .wrap{animation:none}}
/* fix: Screener (klassiek) en Portfolio mochten door de flex-kolom smaller worden dan de pagina (align-items:start van de oude 2-koloms-layout), waardoor de breedte en het aantal tegels per rij met de inhoud meebewogen */
@media (min-width:901px){
  html[data-qw="tool"] .wrap:has(.pf-layout){align-items:stretch!important}
  html[data-qw="tool"] .wrap:has(.pf-layout) .pf-layout,html[data-qw="tool"] .wrap:has(.pf-layout) .pf-main{width:100%;min-width:0}
}
/* vaste ruimte voor de scrollbalk: de paginabreedte (en dus het aantal tegels per rij) verandert niet meer als de pagina net wel of niet scrollt */
html{scrollbar-gutter:stable}
/* ingebed in een venster: geen menu, geen voettekst */
html.qw-embed .qwnav,html.qw-embed .qwsub,html.qw-embed .foot,html.qw-embed .qw-pdf,html.qw-embed .back{display:none!important}html.qw-embed body{padding-top:0!important;margin-top:0!important}html.qw-embed .wrap{padding-top:10px}