/* ---------- E-commerce OS ---------- */
.top { position:sticky; top:0; z-index:25; background:var(--bg); padding:12px 0 10px; margin-top:-12px; }
#app > [data-view] { scroll-margin-top:80px; }
[data-view="home"].os-mode > :not(#osHome):not(#tijdHome) { display:none !important; }
.osp { display:inline-block; font-size:10px; font-weight:700; letter-spacing:.3px; padding:2px 8px; border-radius:10px; white-space:nowrap; flex:0 0 auto; }
.osp.g, .oskpi.g .vl::before { background:#DCF2E2; color:#1F7A38; }
.osp.o { background:#FCEFD0; color:#A06A00; }
.osp.r { background:#FADCDC; color:#C22222; }
.osp.n { background:var(--soft); color:var(--mut); }
.osp.t { background:var(--tealS); color:var(--teal); }
.osp.b { background:#E1ECFA; color:#2F5E9E; }
:root[data-theme="dark"] .osp.g { background:#1C3A28; color:#7FD49A; }
:root[data-theme="dark"] .osp.o { background:#44361A; color:#F2C46B; }
:root[data-theme="dark"] .osp.r { background:#4A1F24; color:#FF9C9C; }
:root[data-theme="dark"] .osp.b { background:#1E2C44; color:#9CC0F2; }
.dotc { width:9px; height:9px; border-radius:50%; flex:0 0 auto; display:inline-block; margin-top:4px; background:var(--line); }
.dotc.g { background:#3FA45C; } .dotc.o { background:#E8A13A; } .dotc.r { background:#C22222; } .dotc.t { background:var(--teal); } .dotc.b { background:#4A8DD6; }
.osi { display:inline-flex; align-items:center; justify-content:center; width:14px; height:14px; border-radius:50%; border:1px solid var(--line); color:var(--mut);
  font-size:9px; font-weight:700; font-style:italic; cursor:pointer; vertical-align:1px; font-family:Georgia, serif; }
.osi:hover, .osi:focus-visible { border-color:currentColor; outline:none; filter:brightness(1.4); }
.osipop { position:fixed; z-index:9999; max-width:280px; padding:8px 11px; border-radius:8px; background:#2E3653; color:#E8ECF5;
  border:1px solid rgba(255,255,255,.12); box-shadow:0 8px 24px rgba(0,0,0,.35); font-size:12px; line-height:1.45; font-weight:400; font-style:normal; white-space:normal; }
.oslab { font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--mut); margin-bottom:6px; font-weight:600; }
.oslab.sec { margin:18px 2px 8px; }
.osempty { color:var(--mut); font-size:12px; padding:10px 0; }
.mut { color:var(--mut); }
.neg { color:#C22222 !important; font-weight:600; }
.warn { color:#A06A00; font-weight:600; }
.oshdr { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.osmode { display:inline-flex; background:var(--card); border:1px solid var(--line); border-radius:9px; padding:3px; }
.osmode button { border:none; background:none; padding:6px 14px; border-radius:7px; font-size:12px; font-weight:600; color:var(--mut); cursor:pointer; font-family:inherit; }
.osmode button.on { background:var(--teal); color:#fff; }
.osqa, .osbtn { background:var(--card); border:1px solid var(--line); color:var(--ink); border-radius:8px; padding:6px 11px; font-size:12px; cursor:pointer; font-family:inherit; white-space:nowrap; }
.osqa:hover, .osbtn:hover { border-color:var(--teal); color:var(--teal); }
.osqa kbd { font-size:10px; background:var(--soft); border-radius:4px; padding:1px 5px; margin-left:4px; color:var(--mut); }
.oslinkbtn { background:none; border:none; color:var(--teal); cursor:pointer; font-size:11px; text-decoration:underline; font-family:inherit; }
button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible, tr[tabindex]:focus-visible { outline:2px solid var(--teal); outline-offset:2px; }
/* vandaag */
.ostoday { margin-bottom:4px; }
.ostodaygrid { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:18px; }
.ostask .chk { background:none; }
.oscounters { display:flex; flex-direction:column; gap:8px; }
.oscnt { display:flex; align-items:center; gap:10px; text-align:left; border:1px solid var(--line); border-radius:10px; padding:9px 12px; background:var(--inp); cursor:pointer; font-family:inherit; color:var(--ink); }
.oscnt b { font-size:22px; min-width:28px; }
.oscnt span { font-size:12px; color:var(--mut); }
.oscnt.r { border-color:#E8B4B4; } .oscnt.r b { color:#C22222; }
.oscnt.o { border-color:#EED6A0; } .oscnt.o b { color:#A06A00; }
.oscnt.g b { color:var(--teal); }
.osdaarna { margin-top:6px; } .osdaarna summary { font-size:12px; color:var(--mut); cursor:pointer; padding:4px 0; }
.osanswers { display:flex; flex-wrap:wrap; gap:6px 22px; margin-top:12px; padding-top:10px; border-top:1px solid var(--soft); font-size:12px; color:var(--mut); }
.osanswers b { color:var(--ink); font-weight:600; }
/* KPI's */
.oskpis { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.oskpi { text-align:left; background:var(--card); border:1px solid var(--line); border-left:4px solid var(--line); border-radius:12px; padding:12px 14px; cursor:pointer;
  display:flex; flex-direction:column; gap:3px; font-family:inherit; color:var(--ink); min-width:0; }
.oskpi:hover { border-color:var(--teal); }
.oskpi.g { border-left-color:#3FA45C; } .oskpi.o { border-left-color:#E8A13A; } .oskpi.r { border-left-color:#C22222; } .oskpi.n { border-left-color:var(--line); }
.oskpi .lb { font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--mut); }
.oskpi .vl { font-size:24px; font-weight:700; letter-spacing:-.5px; line-height:1.15; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.oskpi .vl.sm { font-size:16px; padding:4px 0 3px; }
.oskpi .sb { font-size:11px; color:var(--mut); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.osdelta.up { color:#1F7A38; } .osdelta.down { color:#C22222; }
/* drie kolommen */
.os3 { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; }
.os2 { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; margin-top:10px; }
.os3 .card { padding:13px 15px; }
.osmini { list-style:none; }
.osmini li { display:flex; gap:9px; align-items:flex-start; padding:7px 2px; border-bottom:1px solid var(--soft); font-size:13px; cursor:pointer; }
.osmini li:last-child { border-bottom:none; }
.osmini li:hover > span:not(.dotc) { color:var(--teal); }
.osmini li small { display:block; color:var(--mut); font-size:11px; margin-top:1px; }
.osmini li.mut { cursor:default; font-size:12px; }
.osdag { font-size:11px; font-weight:700; color:var(--teal); min-width:52px; flex:0 0 auto; padding-top:1px; }
.osfases li { flex-wrap:wrap; align-items:center; }
.osfase { flex:1; font-weight:600; font-size:12px; } .osfase.nu { color:var(--teal); }
.osfases li small { flex-basis:100%; }
/* productiviteit */
.osprod { margin-top:16px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:10px 15px; }
.osprod summary { cursor:pointer; font-size:12px; color:var(--mut); font-weight:600; }
.osprodin { display:flex; gap:28px; align-items:flex-end; padding-top:12px; flex-wrap:wrap; }
.osprodin > div:not(.osbars) b { font-size:22px; display:block; } .osprodin span { font-size:11px; color:var(--mut); }
.osbars { display:flex; gap:8px; align-items:flex-end; height:60px; flex:1; min-width:180px; max-width:340px; }
.osbars span { flex:1; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; height:100%; gap:3px; }
.osbars i { display:block; width:100%; background:var(--teal); border-radius:3px 3px 0 0; min-height:2px; }
.osbars em { font-style:normal; font-size:9px; color:var(--mut); text-transform:uppercase; }
/* launch */
.osreadiness { display:grid; grid-template-columns:260px minmax(0,1fr); gap:20px; align-items:center; margin-bottom:12px; }
.osbig { font-size:38px; font-weight:700; letter-spacing:-1px; color:var(--teal); line-height:1.1; }
.osbarbig { height:10px; background:var(--soft); border-radius:6px; overflow:hidden; margin:8px 0; }
.osbarbig i { display:block; height:100%; background:var(--teal); border-radius:6px; }
.osreadiness small { font-size:11px; color:var(--mut); }
.ospipe { display:grid; grid-template-columns:repeat(6, minmax(0,1fr)); gap:6px; }
.ospipe.cre { grid-template-columns:repeat(9, minmax(0,1fr)); margin-bottom:12px; }
.ospstep { border:1px solid var(--line); background:var(--inp); border-radius:9px; padding:8px 6px; display:flex; flex-direction:column; align-items:center; gap:2px;
  cursor:pointer; font-family:inherit; color:var(--ink); min-width:0; border-top:3px solid var(--line); }
.ospstep b { font-size:15px; } .ospstep span { font-size:10px; text-align:center; line-height:1.2; color:var(--mut); overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.ospstep em { font-style:normal; font-size:11px; font-weight:700; }
.ospstep.g { border-top-color:#3FA45C; } .ospstep.t { border-top-color:var(--teal); } .ospstep.r { border-top-color:#C22222; } .ospstep.o { border-top-color:#E8A13A; }
.ospstep.nu { box-shadow:0 0 0 2px var(--teal) inset; }
.osgate { padding:0; margin-bottom:10px; overflow:hidden; }
.osgatehd { display:flex; align-items:center; gap:10px; width:100%; background:none; border:none; padding:12px 16px; cursor:pointer; text-align:left; font-family:inherit; color:var(--ink); flex-wrap:wrap; }
.osgnr { width:26px; height:26px; border-radius:50%; background:var(--soft); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:12px; flex:0 0 auto; }
.osgate.open .osgnr { background:var(--teal); color:#fff; }
.osgnm { flex:1; font-weight:700; font-size:13px; min-width:150px; } .osgnm small { display:block; font-weight:400; color:var(--mut); font-size:11px; }
.osgmeta { font-size:11px; color:var(--mut); min-width:70px; text-align:right; }
.osgbody { padding:0 16px 16px; border-top:1px solid var(--soft); }
.osgbody .osgrid { margin:12px 0; }
.oscrit li { gap:8px; flex-wrap:wrap; }
.oscrit .chk { background:none; } .oscrit .chk.on, .osgbody .chk.on { background:var(--teal); border-color:var(--teal); color:#fff; }
.osreq { color:#C22222; }
.osbewijs { flex:0 1 200px !important; font-size:11px !important; padding:4px 8px !important; }
.oslink { color:var(--teal); text-decoration:none; font-weight:700; }
.oschk { display:inline-flex; align-items:center; gap:5px; font-size:12px; color:var(--mut); white-space:nowrap; font-weight:400; }
.oschk input { width:auto; flex:none; }
/* toolbar, tabellen */
.ostool { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:12px; }
.ostool select { flex:0 0 auto; }
.ostoolr { margin-left:auto; font-size:11px; color:var(--mut); }
.oschips { display:flex; flex-wrap:wrap; gap:5px; }
.oschips button { background:none; border:1px solid var(--line); color:var(--mut); border-radius:20px; padding:3px 11px; font-size:11px; cursor:pointer; font-family:inherit; }
.oschips button.on { background:var(--teal); color:#fff; border-color:var(--teal); font-weight:700; }
.oscols { position:relative; }
.oscols summary { list-style:none; background:var(--card); border:1px solid var(--line); border-radius:8px; padding:6px 11px; font-size:12px; cursor:pointer; }
.oscols summary::-webkit-details-marker { display:none; }
.oscols > div { position:absolute; z-index:30; top:110%; left:0; background:var(--card); border:1px solid var(--line); border-radius:10px; padding:8px 10px;
  box-shadow:0 8px 24px rgba(0,0,0,.12); display:grid; gap:4px; min-width:180px; }
.oscols label { display:flex; gap:6px; align-items:center; font-size:12px; white-space:nowrap; }
.oscols input { width:auto; flex:none; }
.osscroll { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ostable { width:100%; border-collapse:collapse; font-size:12px; }
.ostable th { text-align:left; font-size:10px; letter-spacing:.8px; text-transform:uppercase; color:var(--mut); font-weight:600; padding:7px 8px; border-bottom:2px solid var(--line); white-space:nowrap; }
.ostable td { padding:8px; border-bottom:1px solid var(--soft); vertical-align:top; }
.ostable td small { display:block; color:var(--mut); font-size:10px; }
.ostable tbody tr[tabindex] { cursor:pointer; }
.ostable tbody tr[tabindex]:hover td { background:var(--inp); }
.ostable .cb { width:28px; } .ostable .cb input { width:auto; }
.ostable.cmp th:first-child, .ostable.ue th:first-child { text-transform:none; letter-spacing:0; font-size:12px; color:var(--ink); font-weight:500; white-space:normal; min-width:150px; border-bottom:1px solid var(--soft); }
.ostable.cmp thead th { color:var(--ink); font-size:12px; text-transform:none; letter-spacing:0; }
.ostable.ue td { padding:4px 6px; min-width:110px; }
.uemix h2 { display:flex; align-items:center; gap:6px; }
.uemix .ostable.ue td { text-align:right; font-variant-numeric:tabular-nums; }
.uemix .osverdict { margin-top:12px; }
.ostable.ue input { width:100%; text-align:right; padding:5px 8px; }
.ostable.ue .ueout tr:first-child th, .ostable.ue .ueout tr:first-child td { border-top:2px solid var(--line); }
.ostable.ue .ueout td { text-align:right; font-variant-numeric:tabular-nums; padding:7px 10px; }
.ostable.ue .ueout tr.key th, .ostable.ue .ueout tr.key td { font-weight:700; background:var(--tealS); }
.ostable.opt input, .ostable.opt textarea { width:100%; font-size:12px; }
.ostable input:not([type=checkbox]) { min-width:70px; }
.osverdict { margin-top:12px; font-size:13px; border-left:4px solid var(--line); }
.osverdict.g { border-left-color:#3FA45C; } .osverdict.o { border-left-color:#E8A13A; } .osverdict.r { border-left-color:#C22222; }
.osweights { margin-top:12px; } .osweights summary { cursor:pointer; font-size:12px; font-weight:600; }
.osweights .osgrid { margin:10px 0 6px; }
/* beslissingen */
.osdecs { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
.osdec { text-align:left; cursor:pointer; gap:6px; font-family:inherit; color:var(--ink); font-size:13px; }
.osdec:hover { border-color:var(--teal); }
.osdechd { display:flex; gap:8px; justify-content:space-between; align-items:flex-start; }
.osdec small { font-size:11px; color:var(--mut); }
.osopts { display:flex; flex-wrap:wrap; gap:5px; } .osopts i { font-style:normal; font-size:11px; background:var(--soft); padding:2px 8px; border-radius:10px; }
.osopts i.gek { background:var(--teal); color:#fff; }
.osdecft { display:flex; justify-content:space-between; font-size:11px; color:var(--mut); margin-top:2px; }
/* follow-ups */
.osfollow li { gap:9px; flex-wrap:wrap; }
.ostxtbtn { background:none; border:none; text-align:left; flex:1; min-width:160px; cursor:pointer; font-family:inherit; color:var(--ink); font-size:13px; padding:0; }
.ostxtbtn b { font-weight:500; } .ostxtbtn small { display:block; color:var(--mut); font-size:11px; }
.osfdate { font-size:11px; color:var(--mut); min-width:48px; }
.osfsent { display:flex; gap:5px; align-items:center; }
.osfsent input { width:136px; flex:none; }
.osinact { background:var(--soft); color:var(--mut); border-radius:9px; padding:8px 12px; font-size:12px; margin-bottom:12px; }
.osinactief { font-size:8px; letter-spacing:.6px; text-transform:uppercase; background:#2E3653; color:#8892AC; border-radius:8px; padding:1px 5px; flex:0 0 auto; }
/* taken */
.ostaskf { display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:8px; margin:8px 0 4px; }
.ostaskf label { display:flex; flex-direction:column; gap:3px; font-size:10px; color:var(--mut); text-transform:uppercase; letter-spacing:.6px; min-width:0; }
.ostaskf label.w { grid-column:1 / -1; }
.ostaskf select, .ostaskf input { font-size:12px; text-transform:none; letter-spacing:0; width:100%; }
.osdeps { display:flex; flex-wrap:wrap; gap:5px; align-items:center; text-transform:none; letter-spacing:0; }
.osdeps i { font-style:normal; font-size:11px; background:var(--soft); color:var(--ink); padding:3px 4px 3px 9px; border-radius:10px; display:inline-flex; align-items:center; gap:3px; }
.osdeps i button { background:none; border:none; cursor:pointer; color:var(--mut); font-size:13px; }
.osdeps select { width:auto !important; flex:0 0 auto; }
/* modal en formulieren */
#osModal { position:fixed; inset:0; background:rgba(10,12,20,.45); display:none; align-items:flex-start; justify-content:center; padding:5vh 12px; z-index:80; overflow-y:auto; }
#osModal.on { display:flex; }
.osbox { background:var(--card); border:1px solid var(--line); border-radius:14px; width:min(820px, 100%); box-shadow:0 18px 50px rgba(0,0,0,.3); }
.oshead { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; border-bottom:1px solid var(--soft); position:sticky; top:0; background:var(--card); border-radius:14px 14px 0 0; z-index:2; }
.oshead h3 { font-size:16px; }
.osx { background:none; border:none; font-size:22px; color:var(--mut); cursor:pointer; line-height:1; padding:2px 6px; }
.osbody { padding:6px 18px 16px; }
.osbody h4 { font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--mut); margin:16px 0 8px; }
.osgrid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px 12px; }
.osgrid.ful { grid-template-columns:repeat(4, minmax(0,1fr)); }
.osf { display:flex; flex-direction:column; gap:4px; min-width:0; }
.osf.w { grid-column:1 / -1; }
.osf input, .osf select, .osf textarea { width:100%; }
.osflab { font-size:11px; color:var(--mut); }
.ostop { margin-top:12px; }
.ossum { display:grid; grid-template-columns:repeat(auto-fit, minmax(110px, 1fr)); gap:8px; background:var(--tealS); border-radius:10px; padding:10px 12px; }
.ossum div { display:flex; flex-direction:column; gap:2px; } .ossum span { font-size:10px; color:var(--mut); text-transform:uppercase; letter-spacing:.6px; }
.ossum b { font-size:15px; } .ossum small { font-size:10px; color:var(--mut); }
.osextra { margin-top:6px; }
.osfoot { display:flex; justify-content:space-between; margin-top:18px; padding-top:12px; border-top:1px solid var(--soft); }
.osdel { background:none; border:none; color:#C22222; cursor:pointer; font-size:12px; font-family:inherit; text-decoration:underline; }
.osint li { gap:10px; }
.linkdanger { background:none; border:none; color:var(--mut); font-size:11px; cursor:pointer; text-decoration:underline; font-family:inherit; padding:0; }
.linkdanger:hover { color:#C22222; }
@media (max-width:1150px){
  .oskpis { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .os3 { grid-template-columns:1fr; }
  .ospipe.cre { grid-template-columns:repeat(5, minmax(0,1fr)); }
  .ostaskf { grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:820px){
  .top { position:static; margin-top:0; padding:0; }
  .ostodaygrid, .osreadiness, .os2, .osdecs { grid-template-columns:1fr; }
  .oscounters { flex-direction:row; flex-wrap:wrap; } .oscnt { flex:1 1 140px; }
  .ospipe { grid-template-columns:repeat(3, minmax(0,1fr)); }
  .ospipe.cre { grid-template-columns:repeat(3, minmax(0,1fr)); }
  .osgrid, .osgrid.ful { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .oskpi .vl { font-size:20px; }
  .ostoolr { margin-left:0; flex-basis:100%; }
  .osgmeta { text-align:left; }
}
@media (max-width:480px){
  .osgrid, .osgrid.ful, .ostaskf { grid-template-columns:1fr; }
}
ul.lst li.stepsli { display:block; }
.osverdict { display:block; }
.ostaskf { padding-top:8px; border-top:1px dashed var(--line); }

/* LLC oprichten */
.llc { display:flex; flex-direction:column; gap:20px; --llc-acc:#D4A35C; --llc-acc-soft:rgba(212,163,92,.14); }
.llc svg { width:20px; height:20px; display:block; }
.llc h3 { font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--c-text-3, var(--mut)); margin:0 0 12px; font-weight:600; }

/* kop met tegels en tijdlijn */
.llcheld { background:var(--c-surface, #1A2030); border:1px solid var(--c-border, var(--line)); border-radius:16px; padding:28px; display:flex; flex-direction:column; gap:24px; }
.llcheldtop { display:flex; gap:16px; align-items:center; }
.llcheldico { width:52px; height:52px; border-radius:14px; background:var(--llc-acc-soft); color:var(--llc-acc); display:grid; place-items:center; flex:0 0 auto; }
.llcheldico svg { width:26px; height:26px; }
.llcheld h2 { margin:0 0 4px; font-size:20px; }
.llcheld p { margin:0; color:var(--c-text-2, var(--mut)); line-height:1.5; }
.llctegels { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:12px; }
.llctegel { background:var(--c-surface-2, var(--soft)); border:1px solid var(--c-border, var(--line)); border-radius:12px; padding:14px 16px; display:flex; flex-direction:column; gap:4px; }
.llctegel span { font-size:12px; color:var(--c-text-3, var(--mut)); }
.llctegel b { font-size:20px; font-variant-numeric:tabular-nums; }
.llctegel small { font-size:12px; color:var(--c-text-3, var(--mut)); }
.llcbalk { display:block; height:6px; border-radius:99px; background:var(--c-surface-3, rgba(255,255,255,.08)); overflow:hidden; margin-top:6px; }
.llcbalk i { display:block; height:100%; border-radius:99px; background:var(--c-teal, #3AA99D); transition:width .3s; }

.llcstepper { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); position:relative; }
.llcstepper::before { content:''; position:absolute; left:8.33%; right:8.33%; top:22px; height:2px; background:var(--c-border, var(--line)); }
.llcstepper li { position:relative; display:flex; justify-content:center; }
.llcstepper button { all:unset; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; padding:0 4px; }
.llcbol { width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--c-surface-2, var(--soft)); border:2px solid var(--c-border, var(--line)); color:var(--c-text-3, var(--mut)); position:relative; z-index:1; transition:transform .15s; }
.llcstepper button:hover .llcbol, .llcstepper button:focus-visible .llcbol { transform:scale(1.06); }
.llcstlab { font-size:12px; color:var(--c-text-3, var(--mut)); line-height:1.3; }
.llcstepper li.nu .llcbol { border-color:var(--llc-acc); color:var(--llc-acc); background:var(--llc-acc-soft); box-shadow:0 0 0 5px var(--llc-acc-soft); }
.llcstepper li.nu .llcstlab { color:var(--c-text, inherit); font-weight:600; }
.llcstepper li.klaar .llcbol { border-color:var(--c-teal, #3AA99D); background:var(--c-teal, #3AA99D); color:#fff; }

/* fasen */
.llcfase { background:var(--c-surface, #1A2030); border:1px solid var(--c-border, var(--line)); border-radius:16px; overflow:hidden; scroll-margin-top:90px; }
.llcfase.nu { border-color:var(--llc-acc); box-shadow:0 0 0 1px var(--llc-acc-soft); }
.llcfase > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:18px; padding:22px 24px; }
.llcfase > summary::-webkit-details-marker { display:none; }
.llcfico { width:44px; height:44px; border-radius:12px; display:grid; place-items:center; flex:0 0 auto; background:var(--c-surface-3, var(--soft)); color:var(--c-text-2, var(--mut)); }
.llcfase.nu .llcfico { background:var(--llc-acc-soft); color:var(--llc-acc); }
.llcfase.klaar .llcfico { background:var(--c-teal-soft, rgba(58,169,157,.15)); color:var(--c-teal, #3AA99D); }
.llcftekst { display:flex; flex-direction:column; gap:4px; flex:1; min-width:0; }
.llcftekst small { font-size:12px; color:var(--c-text-3, var(--mut)); letter-spacing:.02em; }
.llcftekst small em { font-style:normal; color:var(--llc-acc); font-weight:600; }
.llcftekst b { font-size:16px; }
.llcdoel { font-size:13px; color:var(--c-text-3, var(--mut)); }
.llcfstat { width:120px; flex:0 0 auto; text-align:right; font-size:13px; font-variant-numeric:tabular-nums; color:var(--c-text-2, var(--mut)); }
.llcfbody { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.2fr); gap:28px; padding:8px 24px 28px 86px; border-top:1px solid var(--c-border, var(--line)); padding-top:24px; }
.llcstappen { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.llcstappen label { display:flex; gap:12px; align-items:flex-start; cursor:pointer; line-height:1.5; }
.llcstappen input { margin-top:3px; width:17px; height:17px; flex:0 0 auto; accent-color:var(--c-teal, #3AA99D); }
.llcstappen input:checked + span { text-decoration:line-through; color:var(--c-text-3, var(--mut)); }
.llctekst { white-space:pre-wrap; font-size:13px; line-height:1.65; background:var(--c-surface-2, var(--soft)); border:1px solid var(--c-border, var(--line)); border-radius:12px; padding:16px 18px; max-height:420px; overflow:auto; }
.llcnoot { font-size:12px; color:var(--c-text-3, var(--mut)); margin:4px 0 0; }

@media (max-width: 900px){
  .llctegels { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .llcfbody { grid-template-columns:1fr; padding-left:24px; }
  .llcstlab { font-size:11px; }
}
@media (max-width: 560px){
  .llcheld { padding:20px; }
  .llcstepper { grid-template-columns:repeat(3, minmax(0, 1fr)); row-gap:16px; }
  .llcstepper::before { display:none; }
  .llcfase > summary { padding:18px; gap:12px; }
  .llcfstat { width:64px; }
}