:root{
  --green:#0ea35a; --green-d:#0b8a4c; --green-l:#e8f7ef; --green-ll:#f3fbf6;
  --ink:#0f172a; --ink2:#334155; --grey:#64748b; --grey2:#94a3b8;
  --line:#e5e7eb; --line2:#eef0f3; --bg:#fff; --soft:#f3f4f6; --red:#dc2626;
  --r:14px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#f1f5f9}
body{font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;cursor:pointer}
input,textarea{font:inherit;color:inherit}
.app{max-width:760px;margin:0 auto;min-height:100%;height:100dvh;background:var(--bg);display:flex;flex-direction:column;position:relative;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
/* header */
.top{flex:none;height:64px;display:flex;align-items:center;gap:10px;padding:0 14px;border-bottom:1px solid var(--line);background:#fff;z-index:5}
.back{border:0;background:none;font-size:22px;color:var(--grey2);width:28px;padding:0;display:none}
.back.show{display:block}
.logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:19px;letter-spacing:-.01em}
.logo .mark{width:32px;height:32px;border-radius:8px;background:var(--green);display:grid;place-items:center}
.logo b{color:var(--green)}
.who{margin-left:auto;display:flex;align-items:center;gap:8px;background:#f8fafc;border-radius:12px;padding:6px 10px 6px 6px;font-weight:600;font-size:15px}
.who .av{width:28px;height:28px;border-radius:50%;background:#dbeafe;color:#1e3a8a;display:grid;place-items:center;font-size:13px;font-weight:700}
/* main */
main{flex:1;min-height:0;position:relative;display:flex;flex-direction:column}
.scroll{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}
.page{padding:22px 20px 28px}
.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
h1{font-size:22px;margin:4px 0 4px;letter-spacing:-.01em}
.sub{color:var(--grey);margin:0 0 18px;font-size:15px}
/* bottom nav */
.nav{flex:none;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px 10px calc(6px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff;z-index:5}
.nav button{border:0;background:none;padding:12px 0;border-radius:10px;color:var(--grey);font-size:15px}
.nav button.on{background:#f5f6f8;color:var(--ink);font-weight:700}
/* hub */
.tile{display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:var(--r);padding:15px 16px;margin-bottom:9px;font-weight:600;font-size:16px}
.tile small{display:block;font-weight:400;color:var(--grey);font-size:13px;margin-top:2px}
.tile .chev{color:var(--green);font-size:20px}
.tile.off{color:var(--grey2)}
.tile.off .chev{display:none}
.tile.off small{color:var(--grey2)}
.tile.start{border-color:#bfe9d2;background:var(--green-ll)}
/* chat */
.tabs{flex:none;display:flex;gap:6px;padding:10px 16px;border-bottom:1px solid var(--line2);background:#fff}
.tabs button{flex:1;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 0;font-size:15px;font-weight:600;color:var(--grey)}
.tabs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.tabs .cnt{font-weight:400;opacity:.8}
.intro{padding:16px 18px 4px}
.intro h1{font-size:20px}
.intro p{margin:0;color:var(--grey);font-size:14.5px}
.chat{padding:10px 14px 18px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:86%;padding:10px 13px;border-radius:16px;font-size:15.5px;white-space:pre-wrap;word-wrap:break-word}
.msg.bot{background:var(--soft);align-self:flex-start;border-bottom-left-radius:5px}
.msg.me{background:var(--green);color:#fff;align-self:flex-end;border-bottom-right-radius:5px}
.msg.diff{background:#fff;border:1px dashed #bfe9d2;color:var(--green-d);font-size:14px;align-self:flex-start;padding:7px 11px}
.msg.diff::before{content:"✓ "}
.who-bot{font-size:12px;color:var(--grey2);margin:4px 0 -6px 4px}
.filechip{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.18);border-radius:10px;padding:6px 10px;font-size:14px}
.typing{display:inline-flex;gap:4px;align-items:center}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--grey2);animation:bl 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes bl{0%,80%,100%{opacity:.3}40%{opacity:1}}
.choices{display:flex;flex-direction:column;gap:8px;align-self:stretch;margin:2px 0 4px}
.choice{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:14px;text-align:left;font-weight:600;font-size:16px}
.choice .ic{width:38px;height:38px;border-radius:10px;background:var(--green-l);display:grid;place-items:center;flex:none;color:var(--green-d)}
.choice small{display:block;font-weight:400;color:var(--grey);font-size:13px}
.choice:active{border-color:var(--green)}
.linkbtn{border:0;background:none;color:var(--green-d);font-weight:600;padding:4px 2px;font-size:14.5px;text-align:left}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;align-self:flex-start}
.btn{border:0;border-radius:12px;padding:12px 16px;font-weight:700;font-size:15.5px;background:var(--green);color:#fff}
.btn:disabled{opacity:.45}
.btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.sm{padding:8px 12px;font-size:14px;border-radius:10px}
.btn.danger{background:#fff;color:var(--red);border:1px solid #fecaca}
.chips{display:flex;flex-wrap:wrap;gap:6px;align-self:stretch}
.chipsel{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 12px;font-size:14.5px}
.chipsel.on{background:var(--green-l);border-color:var(--green);color:var(--green-d);font-weight:600}
.chipsel.on::before{content:"✓ "}
.hint{font-size:13px;color:var(--grey);align-self:flex-start;margin-top:-2px}
.propcard{align-self:stretch;border:1px solid #bfe9d2;background:var(--green-ll);border-radius:14px;padding:12px 14px}
.propcard .t{font-weight:700}
.propcard .s{font-size:14px;color:var(--grey);margin:2px 0 10px}
.propcard ol{margin:0 0 10px;padding-left:22px;font-size:14.5px;color:var(--ink2)}
.propcard ol li{margin:1px 0}
/* composer */
.composer{flex:none;padding:8px 12px calc(10px);border-top:1px solid var(--line2);background:#fff}
.cbox{display:flex;align-items:flex-end;gap:6px;border:1.5px solid #cfe9dc;border-radius:22px;padding:5px 5px 5px 8px;background:#fff}
.cbox:focus-within{border-color:var(--green)}
.cbox textarea{flex:1;border:0;outline:0;resize:none;padding:8px 2px;max-height:120px;min-height:38px;font-size:16px;background:transparent}
.icbtn{flex:none;width:38px;height:38px;border-radius:50%;border:0;display:grid;place-items:center;background:transparent;color:var(--grey)}
.icbtn.mic{background:var(--green);color:#fff}
.icbtn.mic.rec{background:var(--red);animation:pulse 1.2s infinite}
.icbtn.send{background:var(--ink);color:#fff}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.5)}70%{box-shadow:0 0 0 10px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}
.rechint{font-size:13px;color:var(--red);padding:0 8px 4px;display:none}
.rechint.show{display:block}
.cnote{font-size:12px;color:var(--grey2);text-align:center;margin-top:5px}
/* proposal */
.prophead{padding:14px 18px 6px}
.prophead h2{margin:0;font-size:19px}
.prophead p{margin:2px 0 0;color:var(--grey);font-size:14px}
.route{padding:4px 12px 20px}
.step{border-top:1px solid var(--line2);padding:12px 4px 10px;background:#fff;position:relative}
.step:first-child{border-top:0}
.shead{display:flex;align-items:flex-start;gap:8px}
.snum{flex:none;width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font-size:13px;font-weight:700;display:grid;place-items:center;margin-top:1px}
.stitle{flex:1;min-width:0}
.stitle .name{font-weight:700;font-size:16.5px;border:0;background:none;padding:0;text-align:left}
.meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px;align-items:center}
.zone{display:inline-block;font-size:12.5px;font-weight:600;color:var(--green-d);background:var(--green-l);border-radius:999px;padding:2px 9px}
.again{display:inline-block;font-size:12px;color:#92400e;background:#fef3c7;border-radius:999px;padding:2px 8px}
.tcount{font-size:12.5px;color:var(--grey)}
.handle{flex:none;width:34px;height:34px;display:grid;place-items:center;border:0;background:none;color:var(--grey2);touch-action:none;cursor:grab;border-radius:8px;margin:-4px -4px 0 -6px}
.handle:active{cursor:grabbing;background:var(--soft)}
.smenu{flex:none;border:0;background:none;color:var(--grey);width:34px;height:34px;border-radius:8px;font-size:20px;line-height:1;margin-top:-4px}
.rule{display:flex;gap:8px;align-items:center;margin:8px 0 2px 34px;font-size:13.5px;color:var(--ink2);background:#f8fafc;border-radius:10px;padding:7px 10px;border:0;text-align:left;width:calc(100% - 34px)}
.tasks{list-style:none;margin:6px 0 0;padding:0}
.grp{font-size:12px;color:var(--grey2);text-transform:uppercase;letter-spacing:.06em;margin:10px 0 2px 34px}
.task{display:flex;align-items:flex-start;gap:4px;padding:3px 0;background:#fff;border-radius:8px}
.task .handle{width:30px;height:30px;margin:0 0 0 -4px}
.sel{flex:none;width:22px;height:22px;border-radius:6px;border:1.5px solid #cbd5e1;background:#fff;margin:4px 6px 0 0;display:grid;place-items:center;padding:0;color:#fff;font-size:13px}
.sel.on{background:var(--green);border-color:var(--green)}
.ttext{flex:1;border:0;background:none;text-align:left;padding:4px 0;font-size:15.5px;color:var(--ink2);min-width:0}
.ttext::before{content:"•";color:var(--green);font-weight:700;margin-right:7px}
.info{flex:none;width:30px;height:30px;border-radius:50%;border:0;background:none;display:grid;place-items:center;color:var(--ink2);padding:0}
.info svg{width:19px;height:19px}
.task.editing{display:block;background:var(--green-ll);padding:8px;margin:4px 0}
.task.editing textarea{width:100%;border:1.5px solid var(--green);border-radius:10px;padding:8px;min-height:64px;resize:vertical;font-size:15.5px;background:#fff}
.edrow{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.addt{border:0;background:none;color:var(--green-d);font-weight:600;font-size:14.5px;padding:8px 0 2px 34px}
.empty{color:var(--grey2);font-size:14px;margin:6px 0 0 34px;font-style:italic}
.addstep{margin:10px 4px 0;width:calc(100% - 8px);border:1.5px dashed #bfe9d2;background:var(--green-ll);color:var(--green-d);border-radius:14px;padding:13px;font-weight:700}
.dragging{opacity:.95;box-shadow:0 8px 24px rgba(15,23,42,.18);position:relative;z-index:20;border-radius:12px}
.route.collapse .tasks,.route.collapse .addt,.route.collapse .rule,.route.collapse .empty{display:none}
.route.collapse .step{padding:8px 4px}
.inline-in{width:100%;border:1.5px solid var(--green);border-radius:10px;padding:6px 8px;font-size:16px;font-weight:700}
.selbar{position:absolute;left:12px;right:12px;bottom:88px;background:var(--ink);color:#fff;border-radius:14px;padding:10px 12px;display:flex;gap:8px;align-items:center;z-index:12;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.selbar span{flex:1;font-size:14px}
.selbar button{border:0;border-radius:10px;padding:8px 11px;font-weight:700;font-size:14px;background:#fff;color:var(--ink)}
.selbar button.x{background:transparent;color:#cbd5e1;padding:8px 4px}
.selbar button:disabled{opacity:.4}
.confirmbar{flex:none;display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:#fff}
.confirmbar .btn{flex:1}
.confirmbar .btn.sec{flex:0 0 auto}
.savedline{font-size:13px;color:var(--grey);padding:0 18px 8px}
/* sheet */
.overlay{position:absolute;inset:0;background:rgba(15,23,42,.35);z-index:30;display:flex;align-items:flex-end}
.sheet{background:#fff;width:100%;border-radius:18px 18px 0 0;padding:8px 18px 22px;max-height:85%;overflow:auto}
.sheet .grab{width:40px;height:4px;border-radius:4px;background:#d1d5db;margin:4px auto 12px}
.sheet h3{margin:0 0 8px;font-size:18px}
.sheet p{margin:0 0 10px;color:var(--ink2)}
.sheet ol{padding-left:22px;margin:0 0 12px;color:var(--ink2)}
.sheet ol li{margin:4px 0}
.sheet label{display:block;font-size:13px;color:var(--grey);margin:12px 0 6px}
.sheet input[type=text]{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:10px;font-size:16px}
.sheet input[type=text]:focus{outline:0;border-color:var(--green)}
.sheet .btnrow{margin-top:14px;width:100%}
.sheet .btnrow .btn{flex:1}
.menuitem{display:block;width:100%;text-align:left;border:0;border-top:1px solid var(--line2);background:none;padding:14px 2px;font-size:16px}
.menuitem:first-of-type{border-top:0}
.menuitem.red{color:var(--red)}
.toast{position:absolute;left:50%;bottom:92px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 14px;border-radius:12px;font-size:14px;z-index:40;max-width:90%;text-align:center}
/* vloer */
.seg{display:flex;gap:8px;margin:12px 0 14px}
.seg button{border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 16px;font-weight:700}
.seg button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.prog{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.bar{flex:1;height:10px;border-radius:10px;background:#e5e7eb;overflow:hidden}
.bar i{display:block;height:100%;background:var(--green);border-radius:10px;transition:width .25s}
.pct{font-size:13px;font-weight:700;color:var(--ink2);min-width:64px;text-align:right}
.vstep{border:1px solid var(--line);border-radius:16px;margin-bottom:12px;overflow:hidden}
.vstep.done{border-color:#bfe9d2;background:var(--green-ll)}
.vstep.none{opacity:.55}
.vhead{display:flex;gap:10px;align-items:flex-start;padding:14px 14px 8px}
.vhead .t{font-weight:700;font-size:17px}
.vhead .c{margin-left:auto;font-size:13px;color:var(--grey);white-space:nowrap}
.vstep.done .vhead .c{color:var(--green-d);font-weight:700}
.vtask{display:flex;align-items:center;gap:12px;padding:12px 14px;border-top:1px solid var(--line2);min-height:56px;width:100%;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left;font-size:15.5px}
.vtask .ck{flex:none;width:30px;height:30px;border-radius:50%;border:2px solid #cbd5e1;display:grid;place-items:center;color:#fff}
.vtask.on .ck{background:var(--green);border-color:var(--green)}
.vtask.on .tx{color:var(--grey);text-decoration:line-through}
.vtask .tx{flex:1}
.vgrp{font-size:11.5px;color:var(--grey2);text-transform:uppercase;letter-spacing:.06em;padding:10px 14px 2px;border-top:1px solid var(--line2)}
.donebanner{background:var(--green);color:#fff;border-radius:16px;padding:16px;margin-bottom:14px;font-weight:700}
.emptybox{border:1.5px dashed var(--line);border-radius:16px;padding:22px;text-align:center;color:var(--grey)}
.foot{text-align:center;padding:14px 0 6px;font-size:13px}
.foot button{border:0;background:none;color:var(--grey2);text-decoration:underline;font-size:13px}
@media (min-width:700px){ .msg{max-width:70%} .page{padding:28px 32px} }
.vgrp + .vrow .vtask{border-top:0}
.vrow{border-top:0}
.dotc{display:inline-grid;place-items:center;min-width:20px;height:20px;border-radius:10px;background:var(--green);color:#fff;font-size:12px;padding:0 5px;margin-left:4px;vertical-align:1px}
.tabs button{white-space:nowrap}
.ttext.nob::before{content:none}
.handle{color:#cbd5e1}
.vhead .snum{margin-top:0}
/* ===== v2 (25 sep) ===== */
.logo img.mark{width:32px;height:32px;border-radius:8px;display:block;background:none}
.who{border:0}
main .scroll{padding-bottom:84px}
/* zwevende assistent-knop */
.fab{position:absolute;right:14px;bottom:72px;width:58px;height:58px;border-radius:18px;border:0;padding:0;background:transparent;z-index:25;cursor:pointer;animation:kosBreathe 3.4s ease-in-out infinite;transition:bottom .2s}
.fab img{width:100%;height:100%;border-radius:17px;display:block;position:relative;z-index:1}
.fab::before{content:"";position:absolute;inset:-5px;border-radius:22px;background:radial-gradient(closest-side,rgba(14,163,90,.45),rgba(14,163,90,0));animation:kosGlow 3.4s ease-in-out infinite;z-index:0}
.fab::after{content:"";position:absolute;inset:-3px;border-radius:20px;border:2px solid rgba(14,163,90,.5);animation:kosHalo 3.4s ease-out infinite;z-index:0}
.fab:focus-visible{outline:3px solid #0f172a;outline-offset:3px}
@keyframes kosBreathe{0%,100%{transform:scale(1);filter:drop-shadow(0 5px 10px rgba(14,163,90,.28))}50%{transform:scale(1.045);filter:drop-shadow(0 8px 18px rgba(14,163,90,.5))}}
@keyframes kosGlow{0%,100%{opacity:.35}50%{opacity:.9}}
@keyframes kosHalo{0%{opacity:.6;transform:scale(.97)}60%,100%{opacity:0;transform:scale(1.2)}}
@media (prefers-reduced-motion:reduce){.fab,.fab::before,.fab::after{animation:none}.fab::after{display:none}.fab::before{opacity:.5}.asheet.enter{animation:none}}
.app.asst-open .fab{display:none}
/* assistent-sheet */
.aover{position:absolute;inset:0;background:rgba(15,23,42,.35);z-index:60;display:flex;align-items:flex-end}
.asheet{background:#fff;width:100%;height:90%;border-radius:20px 20px 0 0;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -8px 30px rgba(15,23,42,.18)}
.asheet.enter{animation:kosUp .22s ease-out}
@keyframes kosUp{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
.ahead{flex:none;display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line2)}
.amark{width:36px;height:36px;border-radius:10px}
.at b{font-size:16px}
.actx{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--green-d);font-weight:600;background:var(--green-l);border-radius:999px;padding:2px 9px 2px 7px;margin-top:2px}
.ax{margin-left:auto;border:0;background:var(--soft);width:34px;height:34px;border-radius:50%;font-size:15px;color:var(--grey)}
.achat{flex:1;min-height:0;overflow-y:auto}
.sugg{display:flex;flex-wrap:wrap;gap:6px;align-self:stretch}
.sugg button{border:1.5px solid #bfe9d2;background:var(--green-ll);color:var(--green-d);border-radius:999px;padding:6px 11px;font-size:14px;text-align:left}
.wave{display:inline-flex;gap:2px;align-items:center;margin-right:4px;vertical-align:-1px}
.wave i{width:3px;height:10px;background:var(--red);border-radius:2px;animation:kosWave .8s ease-in-out infinite}
.wave i:nth-child(2){animation-delay:.1s}.wave i:nth-child(3){animation-delay:.2s}.wave i:nth-child(4){animation-delay:.3s}
@keyframes kosWave{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1.2)}}
.normcard{white-space:normal;max-width:92%}
.normcard .nh{font-weight:700;font-size:14px;margin-bottom:4px}
.normcard .nheard{font-size:13px;color:var(--grey);font-style:italic;margin-bottom:6px}
.normcard .nline{font-size:16px;margin-bottom:4px}
.normcard .nwhy{display:flex;gap:6px;align-items:center;font-size:14px;color:var(--ink2);background:#fff;border-radius:8px;padding:5px 8px;margin-bottom:6px}
.normcard .nmeta{font-size:13px;color:var(--grey);margin-bottom:8px}
/* lijstkeuze + kop */
.lseg{display:flex;align-items:center;gap:6px;margin:0 0 10px}
.lseg span{font-size:12px;color:var(--grey);text-transform:uppercase;letter-spacing:.08em;margin-right:2px}
.lseg button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 13px;font-weight:600;font-size:14px;color:var(--grey)}
.lseg button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.phrow{display:flex;align-items:center;gap:10px;justify-content:space-between}
.phrow h2,.phrow h1{min-width:0}
/* weergave-toggle */
.vtoggle{flex:none;display:inline-flex;align-items:center;gap:2px;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:3px;color:var(--grey)}
.vtoggle .vi{width:30px;height:28px;border-radius:9px;display:grid;place-items:center}
.vtoggle .vi.on{background:var(--green);color:#fff}
.vtoggle .vl{font-size:12.5px;font-weight:700;color:var(--ink2);padding:0 6px 0 4px;white-space:nowrap}
/* kritiek-schakelaar */
.kswitch{display:flex;align-items:center;gap:10px;background:#fff7f7;border:1px solid #fde2e2;border-radius:12px;padding:9px 10px;margin:10px 0 2px}
.kswitch>span{color:var(--red);display:grid}
.kswitch .kt{flex:1;min-width:0}
.kswitch b{font-size:14.5px;display:block}
.kswitch small{display:block;font-size:12.5px;color:var(--grey);line-height:1.35}
.sw{flex:none;width:46px;height:28px;border-radius:14px;border:0;background:#cbd5e1;position:relative;padding:0;transition:background .15s}
.sw i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .15s}
.sw.on{background:var(--green)}
.sw.on i{left:21px}
.krit{display:inline-block;font-size:11px;font-weight:700;color:var(--red);background:#fee2e2;border-radius:6px;padding:0 6px;margin-left:6px;vertical-align:1px;text-transform:uppercase;letter-spacing:.04em}
/* taken: onderwerp · actie */
.ond{font-weight:700;color:var(--ink)}
.sep{color:var(--grey2)}
.olab{list-style:none;font-size:13px;font-weight:700;color:var(--ink);margin:8px 0 0 30px;padding:2px 0 0;display:flex;align-items:center;gap:6px}
.olab::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--green)}
.task.inrun .ttext{padding-left:12px}
.tn{flex:none;min-width:22px;font-size:12.5px;font-weight:700;color:var(--grey2);padding-top:7px;text-align:right;margin-right:4px}
.ttext.nob::before{content:none}
.srow{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.foto{display:inline-flex;align-items:center;gap:6px;border:1.5px dashed #d6dbe1;background:#fafafa;color:#a0a8b4;border-radius:10px;padding:6px 10px;font-size:13px;cursor:not-allowed;margin-top:6px}
/* volgorde-lijst */
.flat{padding:4px 12px 10px}
.flat .task{align-items:flex-start}
.flat .zstart{border-top:1px dashed #d8dee5;margin-top:4px;padding-top:6px}
.flat .olab{margin-left:30px}
.zchip{flex:none;align-self:center;font-size:11px;font-weight:600;color:var(--green-d);background:var(--green-l);border-radius:999px;padding:1px 7px;max-width:92px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zchip i{font-style:normal;color:#92400e;margin-left:3px}
.rulerow{list-style:none}
.rulerow .rule{margin-left:30px;width:calc(100% - 30px)}
/* vloer */
.volab{font-size:13px;font-weight:700;color:var(--ink);padding:10px 14px 0;border-top:1px solid var(--line2);display:flex;align-items:center;gap:6px}
.volab::before{content:"";width:6px;height:6px;border-radius:2px;background:var(--green)}
.vrow.inrun .vtask{border-top:0;padding-left:28px;min-height:48px}
.volab + .vrow .vtask{border-top:0}
.vflat .zchip{margin-left:6px}
.rule.vr{margin:8px 14px;width:calc(100% - 28px)}
.kblock{border:1.5px solid #fecaca;background:#fff7f7;border-radius:16px;padding:12px 12px 6px;margin:6px 0 12px}
.kh{display:flex;align-items:center;gap:8px;color:var(--red);font-size:16px}
.kh b{color:var(--ink)}
.kblock p{margin:4px 0 8px;font-size:13.5px;color:var(--ink2)}
.kitem{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1px solid #fde2e2;background:#fff;border-radius:12px;padding:10px;margin-bottom:6px;min-height:56px}
.kitem .ck{flex:none;width:28px;height:28px;border-radius:8px;border:2px solid #fca5a5;display:grid;place-items:center;color:#fff}
.kitem.on .ck{background:var(--green);border-color:var(--green)}
.kitem .kx{flex:1}
.kitem .kx small{display:block;color:var(--grey);font-size:12.5px}
.kitem .ks{font-size:13px;font-weight:700;color:var(--red)}
.kitem.on .ks{color:var(--green-d)}
.finrow{margin:4px 0 8px}
.btn.full{width:100%;padding:14px}
.finrow .hint{margin-top:6px;text-align:center;width:100%}
/* taak-sheet */
.sheet textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:10px;font-size:16px;resize:vertical}
.sheet textarea:focus{outline:0;border-color:var(--green)}
.sheet label em{font-style:normal;color:var(--grey2)}
.krow{display:flex;align-items:center;gap:10px;margin-top:14px;padding:10px;border-radius:12px;background:#fff7f7}
.krow>div{flex:1}
.krow small{display:block;color:var(--grey);font-size:12.5px}
.bron{margin-top:10px;font-size:12.5px;color:var(--grey);background:#f8fafc;border-radius:8px;padding:6px 8px}
.vrow{display:flex;align-items:center}
.vrow .vtask{flex:1;min-width:0}
.toast{bottom:150px}
/* ===== v3 (25 sep) ===== */
/* assistent-gezicht */
.fab svg{width:100%;height:100%;display:block;border-radius:17px;position:relative;z-index:1}
.fab{animation:kosBreathe 4.2s ease-in-out infinite}
.kface{overflow:visible}
.kface .kbody{transform-origin:32px 44px;animation:kosBob 4.6s ease-in-out infinite}
.kface .eye{transform-box:fill-box;transform-origin:50% 50%;transition:transform .07s ease-in}
.kface.blink .eye{transform:scaleY(.1)}
.kface .pu{transition:transform .38s cubic-bezier(.3,.7,.3,1)}
.fab:hover .kface .eye,.fab:focus-visible .kface .eye{transform:scale(1.08)}
@keyframes kosBob{0%,100%{transform:translateY(0) rotate(0)}28%{transform:translateY(-1.3px) rotate(-3deg)}62%{transform:translateY(.5px) rotate(2.6deg)}}
.amark{width:38px;height:38px;border-radius:11px;flex:none;display:block}
.amark .kface{width:100%;height:100%;display:block;border-radius:11px}
@media (prefers-reduced-motion:reduce){.kface .kbody{animation:none}.kface .pu,.kface .eye{transition:none}.kface.blink .eye{transform:none}}
/* één-tik samenvoegen / splitsen */
.task{position:relative}
.tbody{flex:1;min-width:0}
.tbody .ttext{width:100%}
.mjoin{position:absolute;left:30px;bottom:-11px;width:22px;height:22px;border-radius:50%;border:1.5px solid #bfe9d2;background:#fff;color:var(--green-d);display:grid;place-items:center;padding:0;z-index:3;box-shadow:0 1px 3px rgba(15,23,42,.08)}
.mjoin::after{content:"";position:absolute;inset:-7px}
.mjoin:active{background:var(--green);color:#fff;border-color:var(--green)}
.task.merged .tbody{background:var(--green-ll);border:1px solid #d3efdf;border-radius:10px;padding:0 8px 6px;margin:2px 0}
.task.merged .ttext{padding:6px 0 2px}
.mparts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.mchip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:4px 10px;font-size:12.5px;font-weight:700;color:var(--ink2);text-align:left}
.mchip svg{flex:none}
.mchip.kout{border-color:#fecaca;color:var(--red);background:#fff7f7}
.mchip.kout svg{width:13px;height:13px}
.aisug{list-style:none;display:flex;align-items:center;gap:6px;margin:8px 0 6px 26px;padding:6px 6px 6px 9px;border:1px dashed #9ed9b9;background:var(--green-ll);border-radius:12px;font-size:13.5px;line-height:1.3}
.aisug .spk{color:var(--green);display:grid;flex:none}
.aisug .sq{flex:1;min-width:0;color:var(--ink2)}
.aisug button{flex:none;border:0;border-radius:9px;padding:7px 11px;font-weight:700;font-size:13px}
.aisug .yes{background:var(--green);color:#fff}
.aisug .no{background:#fff;color:var(--grey);border:1px solid var(--line)}
.msg.ai .aispark{color:var(--green);display:inline-block;vertical-align:-2px;margin-right:5px}
/* bron vs voorstel */
.bronline{display:inline-block;margin-top:6px;font-size:13px;font-weight:700;color:var(--green-d);background:var(--green-l);border-radius:8px;padding:3px 9px}
.orig{margin-top:10px;background:#f8fafc;border-radius:10px;padding:8px 10px}
.orig .oh{font-size:11.5px;font-weight:700;color:var(--grey);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.orig ul{margin:0;padding-left:18px;font-size:13.5px;color:var(--ink2)}
.orig li{margin:2px 0}
.sheet h4{margin:14px 0 4px;font-size:15px}
@media (prefers-reduced-motion:reduce){.fab{animation:none}}
.aisug{align-items:flex-start}
.aisug .spk{margin-top:1px}
.aisug .sqw{flex:1;min-width:0}
.aisug .sq{display:block}
.aisug .sb{display:flex;align-items:center;gap:6px;margin-top:6px}
.aisug .sb small{font-size:11.5px;color:var(--grey2)}
.mjoin-i{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1.5px solid #bfe9d2;color:var(--green-d);vertical-align:-4px;background:#fff}
.mjoin-i svg{width:10px;height:10px}
.mjoin svg{width:12px;height:12px}