/* LDS-huisstijl — Fiscale Radar. Geport uit het prototype (reference/radar.html). */
:root {
  --charcoal:#1b1918; --paper:#f4f3f1; --white:#ffffff;
  --ink:#1b1918; --muted:#6b6763; --faint:#8f8a84;
  --line:#e2e0dc; --line-soft:#eceae6;
  --pink:#c8388e; --orange:#f2902b; --green:#2e7d5b;
  --grad:linear-gradient(90deg,#c8388e,#f2902b);
  --sev5:#c8388e; --sev4:#e0662f; --sev3:#f2902b; --sev2:#b8b2ab; --sev1:#cfc9c2;
  --shadow:0 1px 2px rgba(27,25,24,.05),0 10px 26px rgba(27,25,24,.06);
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Poppins",system-ui,-apple-system,sans-serif;line-height:1.5;
  -webkit-font-smoothing:antialiased;}
a{color:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px 64px;}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.num{font-variant-numeric:tabular-nums;}

/* header */
header{background:var(--charcoal);color:var(--paper);}
.head-in{max-width:1180px;margin:0 auto;padding:26px 22px 30px;display:flex;gap:26px;align-items:center;flex-wrap:wrap;}
.radar-emblem{flex:none;}
.head-txt{flex:1;min-width:260px;}
.eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:#a7a29c;font-weight:500;margin:0 0 8px;}
h1{font-weight:300;font-size:clamp(28px,4.5vw,44px);line-height:1.04;letter-spacing:-.01em;margin:0 0 8px;color:#fff;}
.head-sub{font-weight:300;font-size:15px;color:#d0ccc6;max-width:62ch;margin:0;}
.head-meta{margin-top:14px;font-size:12px;color:#8f8a84;letter-spacing:.03em;}
.head-meta b{color:#eae7e2;font-weight:500;}
.head-actions{margin-left:auto;display:flex;align-items:center;gap:12px;}
.head-user{font-size:12px;color:#b8b2ab;}
.logoutbtn{font-family:inherit;font-size:12px;color:#e9e5e0;background:none;border:1px solid #3a3633;border-radius:8px;padding:7px 13px;cursor:pointer;}
.logoutbtn:hover{border-color:var(--orange);color:#fff;}

/* tab-balk */
.tabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;max-width:1180px;margin:0 auto;padding:0 22px 22px;}
.tab{font-size:13px;font-weight:500;color:#d0ccc6;text-decoration:none;padding:9px 16px;border-radius:999px;border:1px solid #3a3633;white-space:nowrap;}
.tab.on{background:var(--grad);color:#fff;border-color:transparent;}
.tab:hover{border-color:var(--orange);color:#fff;}
.tab.on:hover{color:#fff;}
.tab-spacer{flex:1;min-width:12px;}
.tab-2nd{font-size:12px;color:#a7a29c;text-decoration:none;padding:9px 8px;white-space:nowrap;}
.tab-2nd:hover{color:#fff;text-decoration:underline;}

/* ask/briefing content */
.ask-hero{max-width:1180px;margin:0 auto;padding:0 22px;}
.askbox{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 8px;}
.askbox input[type=text],.askbox input[type=search]{flex:1;min-width:220px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:14px;}
.answer{font-size:14px;line-height:1.55;color:#2b2825;}
.answer h3{font-size:14.5px;font-weight:600;letter-spacing:.02em;margin:18px 0 6px;color:var(--ink);}
.answer h4{font-size:13px;font-weight:600;margin:14px 0 4px;color:var(--ink);}
.answer h3:first-child,.answer h4:first-child,.answer p:first-child{margin-top:0;}
.answer p{margin:0 0 10px;}
.answer ul{margin:0 0 12px;padding-left:20px;display:flex;flex-direction:column;gap:4px;}
.answer li{line-height:1.45;}
.answer li::marker{color:var(--orange);}
.answer strong{font-weight:600;color:var(--ink);}
.period{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:14px;}

/* kpi tiles */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:-22px 0 26px;position:relative;z-index:2;}
@media(max-width:720px){.kpis{grid-template-columns:repeat(2,1fr);}}
.kpi{background:var(--white);border:1px solid var(--line-soft);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow);}
.kpi .n{font-size:30px;font-weight:600;line-height:1;letter-spacing:-.02em;}
.kpi .l{margin-top:7px;font-size:11.5px;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;}
.kpi.accent .n{color:var(--pink);}

/* layout */
.grid{display:grid;grid-template-columns:1fr 360px;gap:26px;align-items:start;}
@media(max-width:940px){.grid{grid-template-columns:1fr;}}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px;}
.sec-h h2{font-weight:500;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--pink);margin:0;display:flex;align-items:center;gap:9px;}
.sec-h h2 .sq{width:11px;height:11px;border:1.5px solid var(--orange);border-radius:2px;flex:none;}
.sec-h .count{font-size:12px;color:var(--faint);}

/* filter bar */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;align-items:center;}
.chip{font-size:12px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--white);color:var(--muted);cursor:pointer;transition:.15s;white-space:nowrap;}
.chip:hover{border-color:var(--pink);color:var(--ink);}
.chip.on{background:var(--charcoal);border-color:var(--charcoal);color:#fff;}
.flabel{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);font-weight:600;}
.age{font-size:11px;color:var(--faint);white-space:nowrap;}
select,input[type=search]{font-family:inherit;font-size:12.5px;padding:7px 11px;border-radius:8px;border:1px solid var(--line);background:var(--white);color:var(--ink);}
input[type=search]{flex:1;min-width:150px;}
select:focus,input:focus,.chip:focus-visible,button:focus-visible{outline:2px solid var(--pink);outline-offset:1px;}

/* feed rows */
.feed{display:flex;flex-direction:column;gap:9px;}
.row{display:grid;grid-template-columns:5px 1fr auto;gap:0 15px;background:var(--white);border:1px solid var(--line-soft);border-radius:12px;overflow:hidden;box-shadow:0 1px 2px rgba(27,25,24,.04);}
.row .stripe{background:var(--sev3);}
.row .body{padding:13px 4px 14px 2px;min-width:0;}
.row .rt{font-size:15px;font-weight:500;line-height:1.32;margin:0 0 5px;text-wrap:balance;}
.row .rt a{text-decoration:none;} .row .rt a:hover{text-decoration:underline;text-decoration-color:var(--pink);}
.row .meta{font-size:11.5px;color:var(--faint);display:flex;flex-wrap:wrap;gap:5px 12px;margin-bottom:7px;}
.row .impact{font-size:12.5px;color:#4a453f;margin:0 0 8px;}
.row .tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:2px;}
.kanaal{font-size:10px;letter-spacing:.03em;color:#b5641a;background:#fde7d4;border-radius:999px;padding:1px 8px;font-weight:600;}
.paywall-badge{font-size:10px;letter-spacing:.03em;color:#8a6d3b;background:#f6efe2;border:1px solid #e7d8bd;border-radius:999px;padding:1px 8px;font-weight:600;white-space:nowrap;}
details.gist{margin-top:9px;}
details.gist summary{display:inline-flex;align-items:center;gap:5px;cursor:pointer;list-style:none;font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--pink);width:max-content;}
details.gist summary::-webkit-details-marker{display:none;}
details.gist summary::before{content:"+";font-size:14px;line-height:1;color:var(--orange);}
details.gist[open] summary::before{content:"\2212";}
details.gist summary:hover{color:var(--ink);}
.g-txt{font-size:13px;color:#38342f;margin:9px 0 7px;line-height:1.45;}
.g-src{font-size:11px;color:var(--faint);margin:0 0 7px;font-style:italic;}
.g-imp{font-size:12px;color:#4a453f;margin:0 0 8px;} .g-imp b{color:var(--ink);}
.g-link{font-size:12px;font-weight:500;color:var(--pink);text-decoration:none;}
.g-link:hover{text-decoration:underline;}
.linkbtn{font-family:inherit;font-size:12px;color:var(--pink);background:none;border:none;cursor:pointer;padding:0;font-weight:500;}
.linkbtn:hover{text-decoration:underline;}
.tag{font-size:10.5px;letter-spacing:.02em;color:var(--muted);background:var(--paper);border:1px solid var(--line-soft);border-radius:999px;padding:2px 9px;}
.row .right{padding:13px 15px 13px 0;display:flex;flex-direction:column;align-items:flex-end;gap:7px;text-align:right;}
.badge{font-size:10px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap;}
.b-wijziging{background:#fbe7f1;color:#a5216f;}
.b-nieuws{background:#eceae6;color:#6b6763;}
.b-praktijk{background:#fde7d4;color:#b5641a;}
.dom{font-size:11px;color:var(--ink);font-weight:500;}
.sevmeter{display:flex;gap:2px;}
.sevmeter i{width:6px;height:6px;border-radius:50%;background:var(--line);}
.sevmeter i.on{background:var(--sev3);}
.actbar{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.actbtn{font-family:inherit;font-size:11px;font-weight:600;letter-spacing:.02em;border:1px solid var(--line);background:var(--white);color:var(--muted);border-radius:8px;padding:5px 11px;cursor:pointer;transition:.15s;}
.actbtn:hover{border-color:var(--pink);color:var(--ink);}
.actbtn.primary{background:var(--grad);color:#fff;border:none;}
.actbtn.primary:hover{filter:brightness(1.06);}

/* aside — sticky met een eigen scrollbalk, zodat de review-gate bereikbaar blijft
   zonder eerst de hele monitoring-feed links door te scrollen */
aside{position:sticky;top:16px;display:flex;flex-direction:column;gap:22px;
  max-height:calc(100vh - 32px);overflow-y:auto;overscroll-behavior:contain;
  scrollbar-gutter:stable;padding-right:4px;}
@media(max-width:940px){aside{position:static;max-height:none;overflow:visible;padding-right:0;}}
.panel{background:var(--white);border:1px solid var(--line-soft);border-radius:16px;padding:18px;box-shadow:var(--shadow);}
.panel.dark{background:var(--charcoal);color:var(--paper);border-color:var(--charcoal);}
.panel.dark .p-h{color:#fff;} .panel.dark .p-sub{color:#b8b2ab;}
.p-h{font-weight:500;font-size:15px;margin:0 0 4px;}
.p-sub{font-size:12px;color:var(--muted);margin:0 0 14px;line-height:1.45;}
.cap-form{display:flex;gap:8px;}
.cap-form input{flex:1;border-radius:9px;border:1px solid #3a3633;background:#26221f;color:#fff;padding:9px 11px;font-size:12.5px;}
.cap-form input::placeholder{color:#8f8a84;}
.btn{font-family:inherit;font-weight:500;font-size:12.5px;border:none;border-radius:9px;padding:9px 15px;cursor:pointer;background:var(--grad);color:#fff;white-space:nowrap;}
.btn:hover{filter:brightness(1.06);}
.cap-note{margin-top:10px;font-size:11px;color:#8f8a84;line-height:1.45;}
.cap-or{font-size:10px;color:#8f8a84;text-align:center;margin:12px 0 10px;letter-spacing:.14em;text-transform:uppercase;position:relative;}
.filebtn{display:block;text-align:center;border:1px dashed #4a4540;color:#e9e5e0;border-radius:9px;padding:11px;font-size:12.5px;cursor:pointer;transition:.15s;}
.filebtn:hover{border-color:var(--orange);color:#fff;}
.dropzone.dragover{border-color:var(--orange);background:#2b2622;color:#fff;}

/* captured cards */
.cap-list{display:flex;flex-direction:column;gap:12px;}
.ccard{border:1px solid var(--line-soft);border-radius:13px;padding:14px 15px;background:var(--white);}
.ccard .cc-top{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap;}
.kind{font-size:10px;letter-spacing:.05em;text-transform:uppercase;font-weight:600;padding:3px 8px;border-radius:6px;background:var(--paper);color:var(--muted);display:inline-flex;align-items:center;gap:5px;}
.st{font-size:10px;letter-spacing:.05em;text-transform:uppercase;font-weight:600;padding:3px 8px;border-radius:999px;margin-left:auto;}
.st-ok{background:#e2f1ea;color:var(--green);}
.st-wait{background:#fde7d4;color:#b5641a;}
.ccard .cct{font-size:14px;font-weight:500;line-height:1.3;margin:0 0 6px;text-wrap:balance;}
.ccard .cct a{text-decoration:none;} .ccard .cct a:hover{text-decoration:underline;}
.ccard .ccs{font-size:12px;color:#4a453f;margin:0 0 9px;}
.ccard ul{margin:0 0 9px;padding-left:16px;display:flex;flex-direction:column;gap:4px;}
.ccard li{font-size:12px;color:#4a453f;line-height:1.4;}
.ccard li::marker{color:var(--orange);}
.ccard .ccf{font-size:11px;color:var(--faint);display:flex;gap:10px;flex-wrap:wrap;}

footer{margin-top:40px;padding-top:18px;border-top:1px solid var(--line);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}
footer b{color:var(--ink);font-weight:600;}
.empty{padding:40px;text-align:center;color:var(--faint);font-size:13px;}

/* django messages */
.messages{max-width:1180px;margin:14px auto 0;padding:0 22px;list-style:none;display:flex;flex-direction:column;gap:8px;}
.messages li{font-size:13px;padding:10px 14px;border-radius:10px;border:1px solid var(--line-soft);background:var(--white);}
.messages li.success{border-color:#bfe3d1;background:#e2f1ea;color:#1e5c40;}
.messages li.error{border-color:#f2c4dc;background:#fbe7f1;color:#a5216f;}

/* login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:22px;}
.login-card{background:var(--white);border:1px solid var(--line-soft);border-radius:18px;box-shadow:var(--shadow);padding:34px 32px;width:100%;max-width:380px;}
.login-card .eyebrow{color:#a7a29c;}
.login-card h1{color:var(--ink);font-size:26px;margin:6px 0 4px;}
.login-card p.sub{font-size:13px;color:var(--muted);margin:0 0 22px;}
.login-card label{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--faint);margin:14px 0 6px;}
.login-card input{width:100%;font-family:inherit;font-size:14px;padding:11px 13px;border-radius:10px;border:1px solid var(--line);background:var(--white);color:var(--ink);}
.login-card .btn{width:100%;margin-top:22px;padding:12px;font-size:14px;justify-content:center;}
.login-card .err{font-size:12.5px;color:#a5216f;background:#fbe7f1;border:1px solid #f2c4dc;border-radius:9px;padding:9px 12px;margin-top:14px;}
@media (prefers-reduced-motion:reduce){.sweep{animation:none!important;}}
@keyframes spin{to{transform:rotate(360deg);}}

/* --- Kennisstudio (deep-dive chat) --- */
.btn-sm{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;padding:5px 11px;border:1px solid var(--line);border-radius:999px;background:var(--white);color:var(--ink);text-decoration:none;margin-right:8px;}
.btn-sm:hover{border-color:var(--pink);}
.studio{margin-top:20px;}
.studio-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px;}
.chat-toggles{display:flex;gap:16px;flex-wrap:wrap;}
.chat-toggles .tog{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--muted);cursor:pointer;}
.chat-toggles .tog em{color:var(--faint);font-style:normal;}
.chat-msgs{max-height:52vh;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding:6px 2px 4px;}
.chat-empty{color:var(--faint);font-size:13.5px;padding:14px 2px;}
.chat-bubble{max-width:88%;padding:12px 15px;border-radius:15px;font-size:14px;line-height:1.55;}
.chat-bubble.user{align-self:flex-end;background:var(--grad);color:#fff;border-bottom-right-radius:5px;}
.chat-bubble.user a{color:#fff;text-decoration:underline;}
.chat-bubble.assistant{align-self:flex-start;background:var(--white);border:1px solid var(--line);border-bottom-left-radius:5px;}
.chat-bubble.assistant.error{background:#fbe7f1;border-color:#f2c4dc;color:#a5216f;}
.chat-bubble h3{font-size:14px;margin:9px 0 4px;}
.chat-bubble ul,.chat-bubble ol{margin:6px 0 6px 18px;}
.chat-bubble a{color:var(--pink);}
.chat-srcs{margin-top:9px;border-top:1px dashed var(--line);padding-top:8px;}
.chat-src summary{cursor:pointer;font-size:12px;color:var(--muted);}
.chat-src ol{margin:6px 0 4px 18px;font-size:12px;}
.chat-input{display:flex;gap:10px;align-items:flex-end;margin-top:14px;}
.chat-input textarea{flex:1;resize:none;padding:11px 13px;border:1px solid var(--line);border-radius:12px;font-family:inherit;font-size:14px;line-height:1.4;background:var(--white);color:var(--ink);}
.chat-input textarea:focus{outline:none;border-color:var(--pink);}
.dots{display:inline-flex;gap:3px;}
.dots i{width:6px;height:6px;border-radius:50%;background:var(--pink);display:inline-block;animation:blink 1.2s infinite both;}
.dots i:nth-child(2){animation-delay:.2s;}
.dots i:nth-child(3){animation-delay:.4s;}
@keyframes blink{0%,80%,100%{opacity:.25;}40%{opacity:1;}}
.chat-bubble .muted{color:var(--faint);}
@media (max-width:640px){.chat-bubble{max-width:96%;}}

/* --- Laadstates: skeleton-shimmer + spinner --- */
.skeleton{position:relative;overflow:hidden;background:#eceae6;border-radius:8px;}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  animation:shimmer 1.3s infinite;}
@keyframes shimmer{100%{transform:translateX(100%);}}
.skel-line{height:12px;margin:0 0 10px;}
.skel-line.lg{height:16px;}
.skel-line.w40{width:40%;} .skel-line.w60{width:60%;} .skel-line.w80{width:80%;}
.skel-line.w90{width:90%;} .skel-line.w100{width:100%;}
.skel-panel{padding:4px 0 2px;}
.loading-note{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;color:var(--muted);margin:2px 0 12px;}
.spin{width:15px;height:15px;border:2px solid var(--line);border-top-color:var(--pink);
  border-radius:50%;flex:none;animation:spin 0.7s linear infinite;}
@media (prefers-reduced-motion:reduce){
  .skeleton::after{animation:none;} .spin{animation:none;}
}

/* --- Capture-in-uitvoering (bezig-kaart) --- */
.capjob{border:1px solid var(--line-soft);border-radius:13px;padding:14px 15px;background:var(--white);
  display:flex;align-items:flex-start;gap:12px;}
.capjob.mislukt{border-color:#f2c4dc;background:#fbe7f1;}
.capjob .cj-body{min-width:0;flex:1;}
.capjob .cj-titel{font-size:13.5px;font-weight:500;margin:0 0 3px;word-break:break-word;}
.capjob .cj-fase{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:7px;}
.capjob.mislukt .cj-fase{color:#a5216f;}
.capjob .cj-dismiss{font-family:inherit;font-size:11px;color:#a5216f;background:none;border:none;cursor:pointer;padding:0;font-weight:600;margin-top:6px;}
.capjob .cj-dismiss:hover{text-decoration:underline;}
