:root{--bruin:#554218;--tekst:#1D1D1B;--grijs:#6B6E68;--lijn:#E2DED5;--bg:#F6F3EE;--wit:#fff;--accent:#7C8478;--fout:#B3261E;--ok:#2E6B3F}
*{box-sizing:border-box}html,body{margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--tekst);background:var(--bg);font-size:15px;line-height:1.45}
a{color:var(--bruin)}
.auth{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px}
.auth-kaart{background:var(--wit);width:100%;max-width:400px;padding:32px 28px 22px;border:1px solid var(--lijn);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.auth-logo{height:34px;display:block;margin-bottom:22px}
.auth h1{font-size:20px;margin:0 0 16px}
label{display:block;font-size:13px;color:var(--grijs);margin:12px 0 0}
input,select{display:block;width:100%;margin-top:5px;padding:10px 11px;border:1px solid var(--lijn);border-radius:6px;font:inherit;background:#fff}
input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-1px}
button,.knop{display:inline-block;margin-top:18px;padding:10px 16px;border:0;border-radius:6px;background:var(--bruin);color:#fff;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.auth button{width:100%}
button.licht,.knop.licht{background:#fff;color:var(--bruin);border:1px solid var(--bruin)}
button.klein{margin:0;padding:5px 9px;font-size:12.5px;font-weight:500}
.melding{padding:9px 11px;border-radius:6px;font-size:13.5px;margin:0 0 6px}
.melding.fout{background:#FBEAEA;color:var(--fout)}.melding.ok{background:#E8F2EA;color:var(--ok)}
.klein{font-size:13px;color:var(--grijs)}
.auth-voet{font-size:11.5px;color:var(--grijs);margin:22px 0 0;text-align:center}
/* portaal */
.kop{background:#fff;border-bottom:4px solid var(--accent);display:flex;align-items:center;gap:18px;padding:14px 24px;flex-wrap:wrap}
.kop img{height:42px;display:block}.kop .scheid{width:1px;height:34px;background:var(--lijn)}
.kop .titel{font-weight:700;font-size:18px}.kop .sub{font-size:13px;color:var(--grijs)}
.kop .rechts{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:13px;color:var(--grijs)}
.kop .merk{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.kop .merk span{font-size:10px;letter-spacing:.6px;text-transform:uppercase}.kop .merk img{height:26px}
main.portaal{max-width:1080px;margin:0 auto;padding:28px 24px 60px}
.kaarten{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:14px}
.kaart{display:block;background:#fff;border:1px solid var(--lijn);border-radius:10px;padding:20px;text-decoration:none;color:inherit;transition:box-shadow .15s,border-color .15s}
.kaart:hover{border-color:var(--accent);box-shadow:0 8px 24px rgba(0,0,0,.07)}
.kaart h3{margin:0 0 6px;font-size:17px}.kaart p{margin:0;color:var(--grijs);font-size:14px}
.kaart .open{display:inline-block;margin-top:14px;font-weight:600;color:var(--bruin)}
h2{font-size:15px;text-transform:uppercase;letter-spacing:.6px;color:var(--grijs);margin:30px 0 4px}
table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--lijn);border-radius:8px;overflow:hidden;font-size:13.5px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--lijn);vertical-align:middle}
th{background:#FAF8F4;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--grijs)}
td .acties{display:flex;gap:6px;flex-wrap:wrap}
.tag{display:inline-block;padding:2px 7px;border-radius:10px;font-size:11.5px;background:#EFECE5}
.tag.uit{background:#FBEAEA;color:var(--fout)}.tag.adm{background:#E9EEE7}
.rij{display:grid;grid-template-columns:2fr 2fr 1.2fr 1.2fr auto auto;gap:10px;align-items:end;background:#fff;border:1px solid var(--lijn);border-radius:8px;padding:14px}
.rij label{margin:0}.rij button{margin:0}
.link-vak{background:#FFF8E6;border:1px solid #EAD9A8;border-radius:8px;padding:12px;margin-top:12px;font-size:13.5px;word-break:break-all}
.voet{font-size:12px;color:var(--grijs);margin-top:40px}
.ptitel{font-size:26px;margin:14px 0 4px}
.dgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:14px;margin-top:22px}
.dgroep{background:#fff;border:1px solid var(--lijn);border-radius:10px;padding:16px 18px}.dgroep h3{margin:0 0 8px;font-size:15px}
.dgroep ul{list-style:none;margin:0;padding:0}.dgroep li a{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--lijn);text-decoration:none;color:inherit}
.dgroep li:first-child a{border-top:0}.dgroep li a:hover .dnaam{text-decoration:underline;color:var(--bruin)}
.dtype{font:600 10.5px ui-monospace,Consolas,monospace;text-align:center;padding:4px 0;border-radius:4px;background:#F2EFE8;color:var(--grijs)}
.dnaam{font-size:14px;overflow-wrap:anywhere}.dmeta{font-size:12px;color:var(--grijs);white-space:nowrap;text-align:right}
@media (max-width:760px){.rij{grid-template-columns:1fr}.kop .scheid,.kop .sub{display:none}}