/* Mia OS · Teamkanaal — overzichtsschermen (views.js). Backend-stijl: dicht, rustig,
   tabellen boven kaarten, één accent (oranje = wacht op jou). Tokens uit base.css. */
.kv{container:kv / inline-size;min-height:100%;overflow-x:hidden;background:var(--vlak);color:var(--inkt);font-size:14px;-webkit-overflow-scrolling:touch;padding-bottom:40px}
.kv svg.i{width:14px;height:14px}
.kv a{color:inherit;text-decoration:none}
.kv button{font-family:inherit}
.kv-zacht{color:var(--inkt3)}
.kv-klein{font-size:12px;line-height:1.5;color:var(--inkt3);margin-top:10px}
.kv-klein b{color:var(--inkt2);font-weight:600}
.kv-pad{padding:14px 28px}
.kv-mono,.kv-num{font-family:'JetBrains Mono',monospace;font-size:12px;font-variant-numeric:tabular-nums}
.kv-num{color:var(--inkt);white-space:nowrap}
.kv-rij{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* kop */
.kv-hk{padding:22px 28px 14px;display:flex;align-items:flex-end;gap:16px;border-bottom:1px solid var(--lijn)}
.kv-hk-mid{flex:1;min-width:0}
.kv-hk h2{font-size:24px;font-weight:600;letter-spacing:-.015em;line-height:1.15}
.kv-sub{font-size:13px;color:var(--inkt2);margin-top:4px;line-height:1.45}
.kv-hk-r{display:flex;gap:8px;flex:none}

/* knoppen */
.kv-b{height:34px;border-radius:9px;border:1px solid var(--lijn2);background:#FFFFFE;font-size:13px;font-weight:500;color:var(--inkt);display:inline-flex;align-items:center;gap:6px;padding:0 12px;white-space:nowrap;cursor:pointer}
.kv-b:hover{border-color:var(--inkt3)}
.kv-b.pri{background:var(--inkt);border-color:var(--inkt);color:#fff}
.kv-b.zacht{border-color:transparent;background:transparent;color:var(--inkt2)}
.kv-b.zacht:hover{color:var(--inkt);background:var(--vlak2)}
.kv-b.rood{color:#fff;background:var(--mis);border-color:var(--mis)}
.kv-b:disabled{opacity:.55;cursor:default}
.kv-b:focus-visible,.kv-chip:focus-visible,.kv-sw:focus-visible,.kv-cel-b:focus-visible,.kv-seg button:focus-visible{outline:2px solid var(--bezig);outline-offset:2px}
.kv-chips{display:flex;gap:6px;flex-wrap:wrap;padding:12px 28px}
.kv-sec .kv-chips{padding:0 0 10px}
.kv-chip{height:28px;border-radius:7px;border:1px solid var(--lijn2);font-size:12.5px;display:inline-flex;align-items:center;gap:5px;padding:0 10px;color:var(--inkt2);background:#FFFFFE;cursor:pointer}
.kv-chip b{font-weight:600;color:var(--inkt)}
.kv-chip.jou{color:var(--jou);border-color:#E9C3AE}.kv-chip.jou b{color:var(--jou)}
.kv-chip.on{background:var(--inkt);border-color:var(--inkt);color:#fff}.kv-chip.on b{color:#fff}
.kv-tag{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:500;color:var(--inkt2);border:1px solid var(--lijn2);border-radius:6px;padding:1px 6px;background:#FFFFFE;white-space:nowrap;vertical-align:middle}
.kv-tag svg.i{width:11px;height:11px}
.kv-tag.mis{color:var(--mis);border-color:#E6C9C5}
.kv-link{font-size:12.5px;font-weight:500;color:var(--inkt);text-decoration:underline;text-underline-offset:2px;margin-left:auto}
.kv-terug{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--inkt2);margin-bottom:12px}

/* status: puntje + woord */
.kv-s{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--inkt2);white-space:nowrap}
.kv-s::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--stil);flex:none}
.kv-s.jou{color:var(--jou);font-weight:500}.kv-s.jou::before{background:var(--jou)}
.kv-s.bezig::before{background:var(--bezig)}
.kv-s.klaar::before{background:var(--klaar)}
.kv-s.mis{color:var(--mis);font-weight:500}.kv-s.mis::before{background:var(--mis)}
.kv-s.stil::before{background:transparent;border:1.3px dashed var(--stil);width:6px;height:6px}

/* secties + twee kolommen */
.kv-twee{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:start}
.kv-twee>.kv-hoofd{min-width:0;border-right:1px solid var(--lijn)}
.kv-twee:not(:has(.kv-zij)){grid-template-columns:minmax(0,1fr)}
.kv-twee:not(:has(.kv-zij))>.kv-hoofd{border-right:0}
.kv-zij{background:var(--vlak2);min-height:100%;align-self:stretch}
.kv-sec{padding:16px 28px;border-bottom:1px solid var(--lijn)}
.kv-zij .kv-sec{padding:14px 18px}
.kv-sec h5,.kv-h5{font-size:12px;font-weight:500;color:var(--inkt3);margin-bottom:10px;display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.kv-h5{margin:18px 0 8px}
.kv-sec-r{font-weight:400;color:var(--inkt3);text-align:right}
.kv-zij .kv-sec-r{color:var(--inkt);font-family:'JetBrains Mono',monospace;font-size:12px}
.kv-sec-tabel{padding:16px 0 0}
.kv-sec-tabel>h5,.kv-sec-tabel>.kv-chips{padding-left:28px;padding-right:28px}
.kv-sec-tabel:last-child{border-bottom:0}
.kv-sec-kaal{padding-top:0}

/* lege staat + meldingen */
.kv-leeg{margin:28px;padding:28px;border:1px dashed var(--lijn2);border-radius:14px;max-width:620px;background:#FFFFFE}
.kv-leeg b{display:block;font-size:17px;font-weight:600;margin-bottom:6px}
.kv-leeg p{font-size:14px;line-height:1.55;color:var(--inkt2)}
.kv-leeg .kv-rij{margin-top:16px}
.kv-melding{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:1.45;padding:10px 12px;border-radius:10px;border:1px solid var(--lijn2);background:#FFFFFE;color:var(--inkt2);margin:10px 0}
.kv-melding svg.i{margin-top:2px}
.kv-melding.mis{border-color:#E6C9C5;color:var(--mis);background:#FBF1EF}
.kv-melding.ok{border-color:#CBDCCB;color:var(--klaar);background:#F2F7F1}
.kv-melding.ok span,.kv-melding.mis span{color:var(--inkt)}
.kv-melding{flex-wrap:wrap}.kv-melding>span{flex:1 1 180px}.kv-melding .kv-link{margin-left:22px;flex-basis:100%}
.kv>.kv-melding{margin:12px 28px 0}
.kv-eerlijk{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:var(--inkt2);padding:12px 28px;max-width:900px}
.kv-eerlijk svg.i{margin-top:2px;color:var(--inkt3)}

/* tabel */
table.kv-t{width:100%;border-collapse:collapse;font-size:13px}
.kv-t th{text-align:left;font-weight:500;color:var(--inkt3);font-size:11.5px;padding:8px 12px;border-bottom:1px solid var(--lijn2);background:var(--vlak2);white-space:nowrap}
.kv-t th.num{text-align:right}
.kv-t td{padding:9px 12px;border-bottom:1px solid var(--lijn);vertical-align:middle;color:var(--inkt2)}
.kv-t th:first-child,.kv-t td:first-child{padding-left:28px}
.kv-t th:last-child,.kv-t td:last-child{padding-right:28px}
.kv-t td.kv-num{text-align:right}
.kv-t tr.jou td:first-child{box-shadow:inset 3px 0 0 var(--jou)}
.kv-t tr.mis td:first-child{box-shadow:inset 3px 0 0 var(--mis)}
.kv-t tr.uit td{opacity:.55}
.kv-t tr.uit td.kv-swcel{opacity:1}
.kv-t tr.on td{background:#FFFFFE}
.kv-t tbody tr[onclick],.kv-t-routines tbody tr,.kv-t-teams tbody tr{cursor:pointer}
.kv-t-routines tbody tr:hover td,.kv-t-teams tbody tr:hover td{background:#FFFFFE}
.kv-wat b,.kv .kv-titel{color:var(--inkt);font-weight:600;font-size:13.5px}
.kv-wat small{display:block;font-size:12px;color:var(--inkt3);margin-top:1px}
.kv-wat small:empty{display:none}
.kv-tijd{color:var(--bezig);width:64px;white-space:nowrap}
.kv-wie-a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.kv-wie-nm{font-size:13px;color:var(--inkt)}
.kv-t:not(.kv-t-routines):not(.kv-t-uitz) .kv-wie .kv-wie-nm{display:none}
.kv-vgcel{white-space:nowrap;color:var(--inkt2)}
.kv-res{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--inkt);border:1px solid var(--lijn2);border-radius:7px;padding:3px 8px;background:#FFFFFE;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kv-res svg.i{width:12px;height:12px;color:var(--inkt2)}
.kv-res-zacht{color:var(--inkt2);border-style:dashed}
a.kv-res:hover{border-color:var(--inkt3)}
.kv-vg{height:3px;background:var(--lijn);border-radius:2px;overflow:hidden;margin:7px 0 6px;max-width:200px}
.kv-vg i{display:block;height:100%;background:var(--bezig)}
.kv-stapjes{list-style:none;display:flex;flex-wrap:wrap;gap:4px}
.kv-stap{font-size:11.5px;border:1px solid var(--lijn2);border-radius:6px;padding:1px 6px;color:var(--inkt3)}
.kv-stap.klaar{color:var(--klaar);border-color:#CBDCCB}
.kv-stap.nu{color:var(--bezig);border-color:#BFCDE5;background:#F1F4FA}
.kv-stap.mislukt{color:var(--mis);border-color:#E6C9C5}
.kv-voet{display:flex;justify-content:space-between;gap:12px;padding:12px 28px;font-size:12.5px;color:var(--inkt2)}

/* vandaag */
.kv-boven{border-bottom:1px solid var(--lijn)}
.kv-boven .kv-hoofd .kv-sec:last-child,.kv-boven .kv-zij .kv-sec:last-child{border-bottom:0}
.kv-onder .kv-sec-tabel{border-bottom:0}
/* vandaag: vijf getallen */
.kv-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid var(--lijn)}
.kv-kpi{padding:14px 20px 14px 28px;border-right:1px solid var(--lijn);display:flex;flex-direction:column;gap:2px;min-width:0}
.kv-kpi:last-child{border-right:0}
.kv-kpi-l{font-size:12px;color:var(--inkt3);display:inline-flex;align-items:center;gap:6px}
.kv-kpi-l::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--stil)}
.kv-kpi-l.klaar::before{background:var(--klaar)}.kv-kpi-l.bezig::before{background:var(--bezig)}
.kv-kpi-l.jou{color:var(--jou)}.kv-kpi-l.jou::before{background:var(--jou)}
.kv-kpi-l.mis{color:var(--mis)}.kv-kpi-l.mis::before{background:var(--mis)}
.kv-kpi-l.eur::before{display:none}
.kv-kpi-n{font-size:28px;font-weight:600;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.kv-kpi-n.jou{color:var(--jou)}
.kv-kpi small{font-size:12px;color:var(--inkt2);line-height:1.35;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
a.kv-kpi:hover{background:#FFFFFE}

/* vandaag: tijdlijn */
.kv-tl-wrap{overflow-x:auto}
.kv-tl{min-width:560px}
.kv-tl-rij{display:flex;align-items:center;min-height:36px;border-bottom:1px solid var(--lijn)}
.kv-tl-rij:last-child{border-bottom:0}
.kv-tl-kop{min-height:22px;border-bottom:0}
.kv-tl-wie{width:150px;flex:none;display:flex;align-items:center;gap:9px;padding:4px 10px 4px 0;min-width:0}
.kv-tl-wie span{min-width:0}
.kv-tl-wie b{display:block;font-size:13px;font-weight:600;color:var(--inkt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kv-tl-wie small{display:block;font-size:11px;color:var(--inkt3)}
.kv-tl-baan{position:relative;flex:1;height:36px}
.kv-tl-kop .kv-tl-baan{height:22px}
.kv-tl-schaal span{position:absolute;top:4px;transform:translateX(-50%);font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--inkt3);white-space:nowrap}
.kv-tl-schaal span:first-child{transform:none}
.kv-tl-schaal span:last-child{transform:translateX(-100%)}
.kv-tl-lijn{position:absolute;top:0;bottom:0;width:1px;background:var(--lijn)}
.kv-tl-nu{position:absolute;top:-2px;bottom:-2px;width:1.5px;background:var(--bezig);z-index:2}
.kv-tl-blok{position:absolute;top:7px;height:22px;border-radius:6px;border:1px solid var(--lijn2);background:var(--vlak2);font-size:11.5px;line-height:20px;padding:0 6px;color:var(--inkt2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:1;min-width:6px}
.kv-tl-blok:hover{z-index:3;border-color:var(--inkt3)}
.kv-tl-blok.klaar{background:#ECEEEB}
.kv-tl-blok.bezig{border:1.5px solid var(--bezig);background:#FFFFFE;color:var(--inkt)}
.kv-tl-blok.jou{border:1.5px solid var(--jou);background:#FFFFFE;color:var(--jou)}
.kv-tl-blok.mis{border:1.5px solid var(--mis);background:#FFFFFE;color:var(--mis)}
.kv-tl-blok.stil{border-style:dashed;background:transparent}

/* staafjes */
.kv-staven{display:flex;flex-direction:column;gap:2px}
.kv-staaf{display:grid;grid-template-columns:28px 92px minmax(0,1fr) 56px;gap:8px;align-items:center;font-size:13px;padding:3px 0}
.kv-staaf-team{grid-template-columns:110px minmax(0,1fr) 56px}
.kv-staaf-nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--inkt)}
.kv-staaf-b{height:8px;border-radius:4px;background:var(--lijn);overflow:hidden}
.kv-staaf-b i{display:block;height:100%;background:var(--inkt);border-radius:4px;min-width:2px}
.kv-staaf .kv-num{text-align:right}
a.kv-staaf:hover .kv-staaf-nm{text-decoration:underline}
.kv-run{display:flex;gap:10px;align-items:center;padding:7px 0;font-size:13px;border-bottom:1px solid var(--lijn)}
.kv-run:last-child{border-bottom:0}
.kv-run-mid{flex:1;min-width:0;color:var(--inkt)}
.kv-run-mid small{display:block;font-size:11.5px;color:var(--inkt3)}
.kv-run-tm{width:52px;flex:none;color:var(--inkt3)}
.kv-run-ic{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;color:#fff}
.kv-run-ic svg.i{width:10px;height:10px;stroke-width:2.4}
.kv-run-ic.ok{background:var(--klaar)}.kv-run-ic.mis{background:var(--mis)}
.kv-run-ok{display:inline-flex;align-items:center;gap:4px;color:var(--klaar);white-space:nowrap}
.kv-run-mis{color:var(--mis)}

/* gepland: weekrooster */
.kv-mg{width:18px;height:18px;border-radius:50%;background:#FFFFFE;border:1px solid var(--lijn2);font-size:8.5px;font-weight:600;color:var(--inkt);display:inline-flex;align-items:center;justify-content:center;flex:none;position:relative}
.kv-mg::after{content:"";position:absolute;right:-2px;bottom:-2px;width:6px;height:6px;border-radius:50%;background:var(--c,var(--inkt3));border:1px solid #FFFFFE}
.kv-mg.mi{background:var(--inkt);color:#fff;border-color:var(--inkt)}.kv-mg.mi::after{display:none}
.kv-week-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.kv-week{min-width:720px}
.kv-week-kop{display:grid;grid-template-columns:48px repeat(7,minmax(0,1fr));font-size:12.5px;color:var(--inkt2);padding-bottom:6px}
.kv-week-kop span{text-align:center}
.kv-week-kop b{font-weight:600;color:var(--inkt)}
.kv-week-kop span.nu b{background:var(--inkt);color:#fff;border-radius:5px;padding:0 5px}
.kv-week-lijf{position:relative;display:grid;grid-template-columns:48px repeat(7,minmax(0,1fr));border-top:1px solid var(--lijn);
  background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 25px,var(--lijn) 25px,var(--lijn) 26px)}
.kv-week-uren{position:relative}
.kv-week-uren span{position:absolute;left:0;font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--inkt3);transform:translateY(3px)}
.kv-week-dag{position:relative;border-left:1px solid var(--lijn)}
.kv-week-dag.nu{background:rgba(63,99,163,.035)}
.kv-wb{position:absolute;left:3px;right:3px;height:22px;display:flex;align-items:center;gap:5px;padding:0 5px 0 3px;border:1px solid var(--lijn2);border-radius:6px;background:#FFFFFE;font-size:11px;color:var(--inkt);white-space:nowrap;overflow:hidden;z-index:1}
.kv-wb span:last-child{overflow:hidden;text-overflow:ellipsis}
.kv-wb:hover{z-index:3;border-color:var(--inkt3)}
.kv-wb.vraag{border:1.5px solid var(--jou)}
.kv-wb.uit{opacity:.45;border-style:dashed}
.kv-wb.on{box-shadow:0 0 0 2px var(--inkt)}
.kv-week-nu{position:absolute;left:0;right:0;height:1.5px;background:var(--bezig);z-index:2}
.kv-ev{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap;padding:0 28px 12px}
.kv-ev-l{font-size:11.5px;color:var(--inkt3);align-self:center;width:100%}
.kv-ev-item{display:flex;gap:8px;align-items:center;border:1px solid var(--lijn2);border-radius:10px;padding:7px 10px;background:#FFFFFE;min-width:0;max-width:320px}
.kv-ev-item b{display:block;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kv-ev-item small{display:block;font-size:11.5px;color:var(--inkt3)}
.kv-ev-item span{min-width:0}
.kv-ev-item.vraag{border:1.5px solid var(--jou)}
.kv-ev-item.uit{opacity:.5}
.kv-ev-item.on{box-shadow:0 0 0 2px var(--inkt)}

/* schakelaar */
.kv-sw{width:36px;height:20px;border-radius:10px;background:var(--lijn2);border:0;position:relative;cursor:pointer;flex:none;padding:0;transition:background .15s}
.kv-sw i{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.kv-sw.on{background:var(--inkt)}
.kv-sw.on i{transform:translateX(16px)}
.kv-sw:disabled{opacity:.5}
.kv-swcel{width:1%;white-space:nowrap;text-align:right}

/* detailpaneel (routine) + formulieren */
.kv-detail{padding:16px 18px 28px}
.kv-rd-kop{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px}
.kv-rd-mid{flex:1;min-width:0}
.kv-rd-mid>b{display:block;font-size:16px;font-weight:600;line-height:1.3;margin-bottom:5px}
.kv-blok{background:#FFFFFE;border:1px solid var(--lijn2);border-radius:12px;padding:6px 12px;margin:8px 0}
.kv-kv{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:5px 0;color:var(--inkt2)}
.kv-kv b{color:var(--inkt);font-weight:500;text-align:right}
.kv-blok .kv-kv+.kv-kv{border-top:1px solid var(--lijn)}
.kv-acties{margin-top:14px}
.kv-zeker{font-size:13px;color:var(--mis);font-weight:500}
.kv-form h3,.kv-wizard h2{font-size:17px;font-weight:600;margin-bottom:12px}
.kv-wizard h2{font-size:24px;letter-spacing:-.015em;margin:6px 0 2px}
.kv-veld{display:flex;flex-direction:column;gap:5px;margin:0 0 12px;font-size:12.5px;color:var(--inkt2);min-width:0}
.kv-veldrij{display:flex;gap:10px;flex-wrap:wrap}
.kv-veldrij .kv-veld{flex:1 1 150px}
.kv-in{height:36px;border:1px solid var(--lijn2);border-radius:9px;background:#FFFFFE;padding:0 10px;font:inherit;font-size:14px;color:var(--inkt);width:100%;min-width:0}
.kv-in:focus{outline:2px solid var(--bezig);outline-offset:0;border-color:transparent}
select.kv-in{padding-right:6px}
.kv-check{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.4;color:var(--inkt);margin:4px 0 8px;cursor:pointer}
.kv-check input{margin-top:2px;accent-color:var(--inkt);width:15px;height:15px}

/* collega-profiel */
.kv-prof{display:flex;gap:26px;align-items:flex-start;padding:26px 28px 18px}
.kv-prof .av.xl{margin:8px}
.kv-prof-mid{flex:1;min-width:0}
.kv-prof h2{font-size:24px;font-weight:600;letter-spacing:-.015em;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kv-prof-r{display:flex;align-items:center;gap:6px;font-size:13.5px;margin-top:7px;min-width:0}
.kv-prof-r>svg.i{color:var(--inkt3)}
.kv-prof-r b{font-weight:500;color:var(--inkt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.kv-prof-r.kv-rij{gap:6px;font-size:12.5px}
.kv-prof-acties{display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex:none}
.kv-prof-cijfers{font-size:12.5px;color:var(--inkt2)}
.kv-prof-cijfers b{color:var(--inkt);font-family:'JetBrains Mono',monospace;font-size:12px}
.kv-tabs{display:flex;gap:4px;padding:0 28px;border-bottom:1px solid var(--lijn);overflow-x:auto}
.kv-tabs a{font-size:13.5px;font-weight:500;color:var(--inkt3);padding:9px 10px 11px;border-bottom:2px solid transparent;white-space:nowrap}
.kv-tabs a small{font-size:11px;margin-left:5px;color:var(--inkt3)}
.kv-tabs a.on{color:var(--inkt);border-color:var(--inkt)}
.kv-tabbody{min-width:0}
.kv-rlijst{padding:4px 28px}
.kv-ritem{display:flex;gap:16px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--lijn)}
.kv-ritem.uit .kv-ritem-mid{opacity:.55}
.kv-ritem-mid{flex:1;min-width:0;max-width:640px}
.kv-ritem-mid .kv-titel{display:block;margin-bottom:4px}
.kv-ritem .kv-kv{justify-content:flex-start;padding:2px 0}
.kv-ritem .kv-kv span{width:120px;flex:none;color:var(--inkt3)}
.kv-ritem .kv-kv b{text-align:left;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.kv-runblok i{width:11px;height:11px;border-radius:3px;background:var(--klaar);display:inline-block}
.kv-runblok i.mis{background:var(--mis)}
.kv-rc{padding:4px 28px 20px;max-width:900px}
.kv-rc-rij{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--lijn);flex-wrap:wrap}
.kv-rc-nm b{display:block;font-size:13.5px;font-weight:600}
.kv-rc-nm small{font-size:11.5px;color:var(--inkt3)}
.kv-slot{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;color:var(--inkt2)}
.kv-slot svg.i{width:12px;height:12px}
.kv-seg{display:inline-flex;border:1px solid var(--lijn2);border-radius:9px;overflow:hidden;background:#FFFFFE}
.kv-seg button{height:32px;padding:0 12px;border:0;border-right:1px solid var(--lijn2);background:transparent;font-size:12.5px;color:var(--inkt2);cursor:pointer;white-space:nowrap}
.kv-seg button:last-child{border-right:0}
.kv-seg button:hover:not(:disabled):not(.on){background:var(--vlak2);color:var(--inkt)}
.kv-seg button.on{background:var(--inkt);color:#fff;font-weight:500}
.kv-seg button:disabled{color:var(--lijn2);cursor:not-allowed;background:var(--vlak2)}
.kv-uitz-nieuw{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px;font-size:13px}
.kv-uitz-nieuw .kv-in{width:auto;height:32px;font-size:13px}
.kv-rc .kv-t td:first-child{padding-left:0}.kv-rc .kv-t td:last-child{padding-right:0}
.kv-stand{display:inline-flex;align-items:center;gap:6px;color:var(--inkt)}
.kv-kost{padding:18px 28px;max-width:620px}
.kv-kost-kop{display:flex;align-items:baseline;gap:10px}
.kv-groot{font-size:28px;font-weight:600;letter-spacing:-.02em}
.kv-dagen{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end;height:170px}
.kv-dag{display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;font-size:12px;color:var(--inkt2)}
.kv-dag .kv-num{font-size:10.5px;color:var(--inkt2)}
.kv-dag-b{flex:1;width:100%;max-width:44px;display:flex;align-items:flex-end;border-bottom:1px solid var(--lijn2)}
.kv-dag-b i{display:block;width:100%;background:var(--inkt);border-radius:4px 4px 0 0;min-height:1px}
.kv-dag.nu>span:last-child{font-weight:600;color:var(--inkt)}
.kv-dag.straks .kv-dag-b{border-bottom-style:dashed}

/* standpuntjes (rechten) */
.kv-dot{width:9px;height:9px;border-radius:50%;flex:none;display:inline-block;box-sizing:border-box}
.kv-dot.st-zelf{background:var(--inkt)}
.kv-dot.st-als_gezegd{border:1.5px solid var(--inkt);background:radial-gradient(circle,var(--inkt) 0 1.6px,transparent 2px)}
.kv-dot.st-vraag{border:1.8px solid var(--jou)}
.kv-dot.st-aan_jou{border:1.5px dashed var(--inkt3)}
.kv-legenda{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:16px 28px;border:1px solid var(--lijn2);border-radius:12px;background:#FFFFFE;overflow:hidden}
.kv-legenda>div{padding:12px 14px;border-right:1px solid var(--lijn)}
.kv-legenda>div:last-child{border-right:0;background:var(--vlak2)}
.kv-legenda b{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;margin-bottom:4px}
.kv-legenda p{font-size:12px;line-height:1.45;color:var(--inkt2)}
.kv-matrix-wrap{margin:0 28px;border:1px solid var(--lijn2);border-radius:12px;background:#FFFFFE}
.kv-matrix{table-layout:fixed}
.kv-matrix th,.kv-matrix td{padding:8px 8px;border-bottom:1px solid var(--lijn)}
.kv-matrix thead th{background:var(--vlak2)}
.kv-matrix thead th:first-child{border-top-left-radius:12px}.kv-matrix thead th:last-child{border-top-right-radius:12px}
.kv-matrix tr:last-child td,.kv-matrix tr:last-child th{border-bottom:0}
.kv-matrix th:first-child,.kv-matrix td:first-child{padding-left:14px;width:200px}
.kv-matrix th:last-child,.kv-matrix td:last-child{padding-right:10px}
.kv-matrix tbody th{text-align:left;font-weight:400;background:transparent}
.kv-matrix tbody th b{display:flex;align-items:center;gap:5px;font-size:13.5px;font-weight:600;color:var(--inkt);white-space:normal}
.kv-matrix tbody th b svg.i{width:12px;height:12px;color:var(--inkt2)}
.kv-matrix tbody th small{display:block;font-size:11.5px;color:var(--inkt3);white-space:normal;line-height:1.35;margin-top:2px}
.kv-matrix tr.kv-slotrij th{box-shadow:inset 3px 0 0 var(--inkt2)}
.kv-matrix thead th{overflow:hidden}
.kv-matrix thead .kv-wie-a{gap:6px;max-width:100%}
.kv-matrix thead .kv-wie-nm{font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;min-width:0}
.kv-cel{position:relative}
.kv-cel-b{display:flex;align-items:center;gap:6px;width:100%;min-height:34px;padding:4px 6px;border:1px solid transparent;border-radius:8px;background:transparent;text-align:left;font-size:12.5px;line-height:1.25;color:var(--inkt);cursor:pointer}
.kv-cel-b:hover{border-color:var(--lijn2);background:var(--vlak2)}
.kv-cel.open .kv-cel-b{border-color:var(--inkt);background:#FFFFFE}
.kv-cel-b.st-vraag{color:var(--jou)}
.kv-cel-b.st-aan_jou{color:var(--inkt2)}
.kv-cel-b.std span{opacity:.85}
.kv-menu{position:absolute;z-index:20;top:calc(100% - 4px);left:4px;width:250px;background:#FFFFFE;border:1px solid var(--lijn2);border-radius:12px;box-shadow:0 12px 32px -14px rgba(29,33,36,.35);padding:6px}
.kv-cel:nth-last-child(-n+2) .kv-menu{left:auto;right:4px}
.kv-menu-kop{font-size:11.5px;color:var(--inkt3);padding:6px 8px 4px}
.kv-menu button{display:flex;gap:9px;align-items:flex-start;width:100%;border:0;background:transparent;text-align:left;padding:7px 8px;border-radius:8px;cursor:pointer;color:var(--inkt)}
.kv-menu button .kv-dot{margin-top:4px}
.kv-menu button b{display:block;font-size:13px;font-weight:600}
.kv-menu button small{display:block;font-size:11.5px;color:var(--inkt3);line-height:1.35}
.kv-menu button:hover:not(:disabled){background:var(--vlak2)}
.kv-menu button.on{background:var(--vlak2)}
.kv-menu button:disabled{opacity:.45;cursor:not-allowed}
.kv-uitleg{list-style:none;display:flex;flex-direction:column;gap:6px;max-width:820px}
.kv-uitleg li{font-size:13px;line-height:1.5;color:var(--inkt2);padding-left:14px;position:relative}
.kv-uitleg li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:50%;background:var(--inkt3)}

/* teams */
.kv-org{padding:20px 28px 18px;border-bottom:1px solid var(--lijn);display:flex;flex-direction:column;align-items:center}
.kv-org-top{display:flex;align-items:center;gap:10px;border:1px solid var(--lijn2);border-radius:12px;padding:8px 14px 8px 10px;background:#FFFFFE;position:relative}
.kv-org-top b{display:block;font-size:14px;font-weight:600}
.kv-org-top small{display:block;font-size:12px;color:var(--inkt2)}
.kv-org-onder{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--lijn2);position:relative;max-width:100%}
.kv-org-onder::before{content:"";position:absolute;top:-22px;left:50%;width:1px;height:22px;background:var(--lijn2)}
.kv-org-c{display:flex;flex-direction:column;align-items:center;gap:4px;width:104px;padding:4px;border-radius:10px;text-align:center;position:relative}
.kv-org-c::before{content:"";position:absolute;top:-18px;left:50%;width:1px;height:14px;background:var(--lijn2)}
.kv-org-c .av{margin-bottom:4px}
.kv-org-c b{font-size:13px;font-weight:600}
.kv-org-c small{font-size:11.5px;color:var(--inkt3)}
.kv-org-c:hover{background:var(--vlak2)}
.kv-leden .avs{gap:5px;flex-wrap:wrap}
.kv-lid{display:inline-flex;padding:3px}
.kv-jou{color:var(--jou)!important;font-weight:600}
.kv-t-teams td small{display:block;font-size:11.5px;color:var(--inkt3)}
.kv-wizard{max-width:560px;padding:24px 28px}
.kv-wizard .kv-sub{margin-bottom:18px}
.kv-stappen{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--inkt3);margin-bottom:10px}
.kv-stappen div{display:flex;gap:6px}
.kv-stappen i{flex:1;height:3px;border-radius:2px;background:var(--lijn2)}
.kv-stappen i.on{background:var(--inkt)}
.kv-keuzes{display:flex;flex-direction:column;border:1px solid var(--lijn2);border-radius:12px;background:#FFFFFE;overflow:hidden}
.kv-keuze{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--lijn);cursor:pointer}
.kv-keuze:last-child{border-bottom:0}
.kv-keuze input{margin-top:3px;accent-color:var(--inkt);width:16px;height:16px}
.kv-keuze b{display:block;font-size:14px;font-weight:600}
.kv-keuze small{display:block;font-size:12.5px;color:var(--inkt2);margin-top:1px}
.kv-keuze.on{background:var(--vlak2)}

/* smaller desktop: zijpaneel onder de inhoud */
@container kv (max-width:1000px){
  .kv-twee{grid-template-columns:minmax(0,1fr)}
  .kv-twee>.kv-hoofd{border-right:0}
  .kv-zij{border-top:1px solid var(--lijn)}
  .kv-twee.kv-open{display:flex;flex-direction:column-reverse}
  .kv-twee.kv-open .kv-zij{border-top:0;border-bottom:1px solid var(--lijn)}
  .kv-legenda{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kv-legenda>div:nth-child(3){border-right:0}
  .kv-legenda>div:nth-child(-n+3){border-bottom:1px solid var(--lijn)}
}

/* mobiel: tabellen worden lijsten, geen horizontaal scrollen (behalve het weekrooster) */
@container kv (max-width:860px){
  .kv{font-size:14px}
  .kv-hk{padding:14px 18px 12px;flex-wrap:wrap;align-items:flex-start}
  .kv-hk h2{font-size:22px}
  .kv-hk-r{width:100%}
  .kv-chips,.kv-sec,.kv-sec-tabel>h5,.kv-sec-tabel>.kv-chips,.kv-eerlijk,.kv-pad,.kv-voet,.kv-tabs,.kv-rlijst,.kv-rc,.kv-kost,.kv-wizard,.kv-ev{padding-left:18px;padding-right:18px}
  .kv-sec .kv-chips{padding-left:0;padding-right:0}
  .kv-leeg{margin:18px;padding:20px}
  .kv-twee.kv-open>.kv-hoofd{display:none}
  .kv-terug{display:none}
  .kv-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .kv-kpi{padding:12px 14px;border-bottom:1px solid var(--lijn)}
  .kv-kpi:nth-child(3){border-right:0}
  .kv-kpi:nth-child(n+4){border-bottom:0}
  .kv-kpi-n{font-size:22px}
  .kv-kpi small{display:none}
  .kv-tl{min-width:0}
  .kv-tl-wie{width:44px;padding-right:6px}
  .kv-tl-wie>span:not(.av){display:none}
  .kv-tl-blok{font-size:0;padding:0}
  .kv-tl-schaal span{font-size:9.5px}
  table.kv-t,.kv-t tbody,.kv-t tr,.kv-t td,.kv-t th{display:block}
  .kv-t thead{display:none}
  .kv-t tr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:11px 18px;border-bottom:1px solid var(--lijn)}
  .kv-t td,.kv-t th:first-child,.kv-t td:first-child,.kv-t td:last-child{padding:0;border:0}
  .kv-t td.kv-wat{flex:1 1 100%;order:-2}
  .kv-t td.kv-wie{order:-3}
  .kv-t td.kv-wie+td.kv-wat,.kv-t td.kv-wat:has(+td.kv-wie){flex:1 1 calc(100% - 52px)}
  .kv-t tr:has(td.kv-wie) td.kv-wat{flex:1 1 calc(100% - 52px)}
  .kv-t td.kv-tijd{order:-4;width:auto}
  .kv-t td[data-l]::before{content:attr(data-l) " ";color:var(--inkt3);font-family:'Onest',sans-serif;font-size:11.5px}
  .kv-t td.kv-num{text-align:left}
  .kv-t td.kv-rescel{flex-basis:100%}
  .kv-t td.kv-swcel{margin-left:auto;width:auto}
  .kv-t tr.jou{box-shadow:inset 3px 0 0 var(--jou)}
  .kv-t tr.mis{box-shadow:inset 3px 0 0 var(--mis)}
  .kv-t tr.jou td:first-child,.kv-t tr.mis td:first-child{box-shadow:none}
  .kv-t-routines td.kv-wat{flex:1 1 60%}
  .kv-t-routines td.kv-swcel{order:-1}
  .kv-t-routines td.kv-wie{order:0}
  .kv-res{max-width:100%}
  .kv-prof{flex-wrap:wrap;gap:16px;padding:18px}
  .kv-prof .av.xl{width:64px;height:64px;font-size:22px;box-shadow:0 0 0 3px var(--vlak),0 0 0 6px var(--r);margin:6px}
  .kv-prof-mid{flex:1 1 calc(100% - 100px)}
  .kv-prof-acties{width:100%;align-items:flex-start}
  .kv-seg{width:100%}
  .kv-seg button{flex:1;padding:0 4px;font-size:11.5px;white-space:normal;line-height:1.15;height:38px}
  .kv-rc .kv-t tr{padding-left:0;padding-right:0}
  .kv-dagen{gap:4px}
  .kv-legenda{grid-template-columns:1fr 1fr;margin:12px 18px}
  .kv-legenda>div{border-bottom:1px solid var(--lijn)}
  .kv-legenda>div:nth-child(3){border-right:1px solid var(--lijn)}
  .kv-legenda>div:nth-child(2n){border-right:0}
  .kv-legenda>div:last-child{grid-column:1/-1;border-bottom:0}
  .kv-sec h5{flex-wrap:wrap}
  .kv-sec-r{text-align:left}
  .kv-matrix-wrap{margin:0 18px}
  .kv-matrix,.kv-matrix tbody,.kv-matrix tr,.kv-matrix td,.kv-matrix th{display:block;width:auto!important}
  .kv-matrix thead{display:none}
  .kv-matrix tr{padding:12px 14px;border-bottom:1px solid var(--lijn);display:grid;grid-template-columns:1fr 1fr;gap:2px 8px}
  .kv-matrix tr:last-child{border-bottom:0}
  .kv-matrix tbody th{grid-column:1/-1;padding:0 0 6px!important;border:0;box-shadow:none!important}
  .kv-matrix td{padding:0!important;border:0}
  .kv-matrix td[data-l]::before{content:attr(data-l);display:block;font-size:11px;color:var(--inkt3);padding:4px 6px 0}
  .kv-cel-b{min-height:28px;padding:2px 6px}
  .kv-menu{left:0;right:auto;width:min(260px,calc(100vw - 60px))}
  .kv-cel:nth-child(odd) .kv-menu{left:auto;right:0}
  .kv-cel:nth-last-child(-n+2) .kv-menu{right:auto}
  .kv-cel:nth-child(odd):nth-last-child(-n+2) .kv-menu{right:0}
  .kv-org{padding:16px 12px}
  .kv-org-c{width:84px}
  .kv-org-onder{border-top:0;padding-top:0;margin-top:14px}
  .kv-org-onder::before{top:-14px;height:14px}
  .kv-org-c::before{display:none}
  .kv-staaf{grid-template-columns:28px 88px minmax(0,1fr) 56px}
  .kv-staaf.kv-staaf-team{grid-template-columns:104px minmax(0,1fr) 56px}
  .kv-uitz-nieuw .kv-in{flex:1 1 40%}
  .kv-ritem{flex-wrap:wrap}
  .kv-ritem-mid{flex-basis:100%}
  .kv-ritem .kv-kv span{width:96px}
}
