:root{--bg:#f6f7f5;--kaart:#fff;--tekst:#1f2421;--zacht:#6b736e;--lijn:#e2e5e1;--accent:#2f6f4f;--let:#b7791f;--fout:#b83232;--on:#2f9e5a}
*{box-sizing:border-box}body{margin:0;font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--tekst)}
header{display:flex;align-items:center;gap:24px;padding:10px 24px;background:#1f2b25;color:#e8efe9}
header a{color:#e8efe9;text-decoration:none}.logo{font-weight:700;letter-spacing:.5px}nav a{margin-right:16px;opacity:.85}nav a:hover{opacity:1}
.wie{margin-left:auto;font-size:12px;opacity:.75}main{padding:20px 24px;max-width:1500px;margin:auto}
h1{font-size:20px;margin:4px 0 14px}h1 small,h2 small{font-weight:400;color:var(--zacht);font-size:13px}h2{font-size:16px;margin:22px 0 8px}
a{color:var(--accent)}table{width:100%;border-collapse:collapse;background:var(--kaart);border:1px solid var(--lijn)}
th,td{padding:6px 9px;border-bottom:1px solid var(--lijn);text-align:left;vertical-align:top}th{background:#eef1ed;font-weight:600;cursor:pointer;white-space:nowrap;position:sticky;top:0}
tr.off td{color:var(--zacht)}tr.off td a{color:#4f7a64}.num{text-align:right;font-variant-numeric:tabular-nums}.klein{font-size:12px}
.let{color:var(--let);font-weight:600}.fout{color:var(--fout);font-weight:600}
.tegels{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}.tegels div{background:var(--kaart);border:1px solid var(--lijn);border-radius:8px;padding:10px 16px;min-width:130px}
.tegels b{font-size:22px;display:block}.tegels span{color:var(--zacht);font-size:12px}.tegels .let b{color:var(--let)}.tegels .fout b{color:var(--fout)}
.filter{width:100%;max-width:420px;padding:7px 10px;border:1px solid var(--lijn);border-radius:6px;margin:0 0 10px;font:inherit}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#bbb;margin-right:6px}.dot.on{background:var(--on)}
.badge{font-size:11px;padding:1px 6px;border-radius:9px;background:#e5e8e4;color:var(--zacht)}.badge.fout{background:#f6dcdc;color:var(--fout)}.badge.on{background:#dcefe3;color:var(--on)}
.st{font-size:11px;padding:1px 7px;border-radius:9px;background:#e5e8e4}.st-OK{background:#dcefe3;color:#1d6b3d}.st-NVT{background:#eceeea;color:var(--zacht)}
.st-BEZIG{background:#e2ecf8;color:#2b5d99}.st-FOUT{background:#f6dcdc;color:var(--fout)}
.kaart-rij{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}.kaart{background:var(--kaart);border:1px solid var(--lijn);border-radius:8px;padding:12px 16px}
.kaart.breed{margin-bottom:12px}.kaart h3{margin:0 0 8px;font-size:14px}.kaart table{border:0}.kaart td{border:0;padding:3px 6px}.kaart td.sub{color:var(--zacht);font-size:11px;padding-top:0}
dl{display:grid;grid-template-columns:120px 1fr;gap:3px 10px;margin:0}dt{color:var(--zacht)}dd{margin:0}
.knop{display:inline-block;padding:6px 12px;border-radius:6px;background:var(--accent);color:#fff;text-decoration:none}.acties{margin:0 0 14px}
.login{max-width:340px;margin:12vh auto;background:var(--kaart);border:1px solid var(--lijn);border-radius:10px;padding:26px}
.login label{display:block;margin:10px 0;font-size:13px;color:var(--zacht)}.login input{display:block;width:100%;padding:8px;margin-top:4px;border:1px solid var(--lijn);border-radius:6px;font:inherit}
.login button{width:100%;padding:9px;margin-top:10px;border:0;border-radius:6px;background:var(--accent);color:#fff;font:inherit;cursor:pointer}
pre.log{background:#1f2b25;color:#cfe0d5;padding:12px;border-radius:8px;font-size:12px;max-height:420px;overflow:auto}
details summary{cursor:pointer;color:var(--accent)}
.tegels b small{font-size:13px;font-weight:400;color:var(--zacht)}