.pp{--bg:#f3f6f7;--panel:#fff;--ink:#0e2a38;--mute:#5b7280;--line:#d8e2e6;--water:#13708a;--water-soft:#dceef3;--signal:#e8523a;--ok:#1e7f52;--ok-soft:#ddf1e6;--warn:#8a5f00;--warn-soft:#fbf0d2;--bad:#b3341f;--bad-soft:#fbe4df;--f-disp:"Barlow Condensed", "Arial Narrow", sans-serif;--f-body:"Barlow", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){.pp{--bg:#0a1a22;--panel:#10262f;--ink:#e6f0f3;--mute:#8fa7b2;--line:#223c47;--water:#4db6cf;--water-soft:#143844;--signal:#ff7a62;--ok:#5ed197;--ok-soft:#14352a;--warn:#e8b84a;--warn-soft:#3a2f10;--bad:#ff8d78;--bad-soft:#3a1e1a;--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}.pp{background:var(--bg);min-height:100vh;color:var(--ink);font:15px/1.5 var(--f-body)}.pp-wrap{max-width:1080px;margin:0 auto;padding:24px 16px 64px}.pp h1,.pp h2,.pp h3{font-family:var(--f-disp);letter-spacing:.01em;text-wrap:balance;margin:0;font-weight:700}.pp h1{font-size:clamp(32px,6vw,48px);line-height:1}.pp h2{margin-bottom:8px;font-size:26px}.pp h3{font-size:20px}.pp p{margin:0}.pp .tag{font:600 13px var(--f-disp);letter-spacing:.12em;text-transform:uppercase;color:var(--water)}.pp .sub{color:var(--mute);max-width:64ch;margin-top:8px}.pp .sec{margin-top:36px}.pp .grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px;display:grid}.pp .card{background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:0;padding:14px}.pp .card.groen{border-color:var(--ok)}.pp .card.oranje{border-color:var(--warn)}.pp .card.rood{border-color:var(--bad)}.pp .rij{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.pp .mut{color:var(--mute);font-size:13px}.pp input[type=text],.pp select{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:6px;min-width:0;padding:7px 9px}.pp input[type=text]:focus-visible,.pp select:focus-visible,.pp button:focus-visible,.pp label:focus-within{outline:2px solid var(--water);outline-offset:2px}.pp button,.pp .knop{font:600 14px var(--f-body);color:var(--ink);background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:6px;padding:8px 12px;display:inline-block}.pp button:hover,.pp .knop:hover{border-color:var(--water)}.pp button.hoofd{background:var(--ink);color:var(--bg);border-color:var(--ink)}.pp button.klein{padding:3px 8px;font-size:12px}.pp .pill{white-space:nowrap;border-radius:99px;padding:2px 9px;font-size:12px;font-weight:600;display:inline-block}.pp .pill.groen{background:var(--ok-soft);color:var(--ok)}.pp .pill.oranje{background:var(--warn-soft);color:var(--warn)}.pp .pill.rood{background:var(--bad-soft);color:var(--bad)}.pp .pill.leeg{background:var(--line);color:var(--mute)}.pp .tabel{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;margin-top:10px}.pp .tabel th{text-align:left;color:var(--mute);padding:4px 8px 4px 0;font-size:12px;font-weight:600}.pp .tabel td{border-top:1px solid var(--line);vertical-align:middle;padding:6px 8px 6px 0}.pp .scroll{overflow-x:auto}.pp .tabel input[type=text]{width:84px}.pp .dropzone{border:2px dashed var(--line);text-align:center;color:var(--mute);border-radius:10px;padding:18px}.pp .res th:first-child,.pp .res td:first-child{padding-left:0}.pp pre.rapport{background:var(--panel);border:1px solid var(--line);white-space:pre-wrap;border-radius:8px;padding:12px;font:13px/1.5 ui-monospace,monospace}@media (width<=560px){.pp .tabel td,.pp .tabel th{padding-right:5px}}
