:root{--ink:#1A1A1A;--wall:#E2E2E2;--purple:#8865AC;--purple-deep:#5E4380;--yellow:#FCC720;--red:#D6453D;--green:#2E8A5F}
*{box-sizing:border-box}
body{margin:0;font-family:Nunito,Roboto,sans-serif;font-size:15px;line-height:1.5;color:var(--ink);background:var(--wall)}
a{color:var(--purple-deep)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
h1,h2,h3{font-family:Boogaloo,sans-serif;font-weight:400;text-transform:uppercase;line-height:1;margin:0 0 10px}
h1{font-size:44px}h2{font-size:30px}h3{font-size:22px}
.top{background:var(--ink);color:#fff;display:flex;align-items:center;gap:26px;padding:10px 24px;flex-wrap:wrap}
.top .logo img{height:44px;display:block}
.top nav{display:flex;gap:18px}
.top nav a{color:#fff;text-decoration:none;font-weight:800;opacity:.75;padding:4px 0}
.top nav a.on,.top nav a:hover{opacity:1;border-bottom:3px solid var(--yellow)}
.top .who{margin-left:auto;font-size:14px;color:#bbb}.top .who a{color:#fff}
.wrap{max-width:1180px;margin:0 auto;padding:28px 24px 60px}
.card{background:#fff;padding:22px 24px;margin-bottom:22px}
.head{display:flex;align-items:end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.head .sub{color:#555;margin:0}
.head .acts{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.flash{padding:12px 16px;margin-bottom:18px;font-weight:700;background:#CFE8DA}
.flash.err{background:#F6C9C4}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:13px;color:#555;padding:8px;border-bottom:2px solid var(--ink)}
td{padding:9px 8px;border-bottom:1px solid #e6e6e6;vertical-align:top}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}
tr:hover td{background:#faf8fd}
.grid{display:grid;gap:14px 18px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.grid .full{grid-column:1/-1}
label{display:block;font-weight:800;font-size:13.5px;margin-bottom:4px}
label small{font-weight:400;color:#666}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],select,textarea{width:100%;font:inherit;padding:9px 10px;border:2px solid #cfcfcf;background:#fff;border-radius:6px}
input:focus,select:focus,textarea:focus{border-color:var(--purple);outline:none}
textarea{min-height:90px;resize:vertical}
.btn{display:inline-block;font:inherit;font-weight:800;border:2px solid var(--ink);background:var(--ink);color:#fff;padding:9px 16px;border-radius:999px;cursor:pointer;text-decoration:none}
.btn.y{background:var(--yellow);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.sm{padding:5px 11px;font-size:13.5px}
.btn.del{background:transparent;color:var(--red);border-color:var(--red)}
.inline{display:flex;gap:10px;align-items:end;flex-wrap:wrap}
.inline>div{flex:1 1 150px}
.inline>div.s{flex:0 1 120px}
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0 0;border-bottom:3px solid var(--ink)}
.tabs a{padding:10px 16px;text-decoration:none;color:var(--ink);font-weight:800;background:#d4d4d4}
.tabs a.on{background:var(--ink);color:#fff}
.pill{display:inline-block;font-size:12.5px;font-weight:800;padding:2px 9px;border-radius:999px;background:#eee}
.pill.lopend{background:#E5DAF2}.pill.afgerond{background:#CFE8DA}.pill.aanvraag{background:#FFF0C2}.pill.geannuleerd{background:#F6C9C4}
.ok{color:var(--green);font-weight:800}.no{color:var(--red);font-weight:800}
.muted{color:#666}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:22px}
.stats div{background:#fff;padding:14px 16px;border-top:4px solid var(--purple)}
.stats b{display:block;font-family:Boogaloo;font-size:32px;font-weight:400;line-height:1}
.stats span{font-size:13px;color:#555}
.stap{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.checks{display:flex;flex-wrap:wrap;gap:8px 18px}
.checks label{font-weight:400;display:flex;gap:6px;align-items:center}
.login{max-width:380px;margin:60px auto}
.empty{padding:26px;text-align:center;color:#555}
@media (max-width:700px){h1{font-size:34px}.top .who{margin-left:0}table{font-size:14px}.hide-m{display:none}}
