:root{--kleur-perkament:#f5f2e6;--kleur-perkament-licht:#f6f4ee;--kleur-inktgroen:#0e211d;--kleur-inktgroen-licht:#12211f;--kleur-verdigris:#1f7a63;--kleur-verdigris-licht:#2e8b74;--kleur-koper:#b5723c;--kleur-koper-licht:#b56a3c;--kleur-wit:#fff;--kleur-rand:#d8d2bd;--kleur-fout:#a13f2b;--kleur-fout-achtergrond:#f7e6e1;--font-koppen:"Space Grotesk", sans-serif;--font-body:"IBM Plex Sans", sans-serif;--font-cijfers:"IBM Plex Mono", monospace;--radius:8px;--schaduw:0 1px 3px #0e211d1f}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--kleur-perkament);color:var(--kleur-inktgroen);font-family:var(--font-body);margin:0;font-size:15px;line-height:1.5}h1,h2,h3,h4{font-family:var(--font-koppen);color:var(--kleur-inktgroen);margin:0 0 .5em;font-weight:600}a{color:var(--kleur-verdigris)}.cijfer{font-family:var(--font-cijfers);font-variant-numeric:tabular-nums}.pagina{max-width:1080px;margin:0 auto;padding:24px 20px 64px}.app-header{background:var(--kleur-inktgroen);border-bottom:3px solid var(--kleur-koper)}.app-header-inner{align-items:center;gap:28px;max-width:1080px;margin:0 auto;padding:10px 20px;display:flex}.app-logo{height:28px}.app-nav{flex:1;gap:20px;display:flex}.app-nav a{color:var(--kleur-perkament);font-family:var(--font-koppen);opacity:.8;border-bottom:2px solid #0000;padding:6px 2px;font-size:14px;font-weight:500;text-decoration:none}.app-nav a:hover{opacity:1}.app-nav a.actief{opacity:1;border-bottom-color:var(--kleur-verdigris-licht)}.app-header-user{color:var(--kleur-perkament);align-items:center;gap:10px;margin-left:auto;font-size:13px;display:flex}.app-header-user .btn-secundair{color:var(--kleur-perkament);border-color:#f5f2e666}.auth-pagina{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.auth-kaart{width:100%;max-width:380px}.auth-logo{height:32px;margin-bottom:18px}.kaart{background:var(--kleur-perkament-licht);border:1px solid var(--kleur-rand);border-radius:var(--radius);box-shadow:var(--schaduw);padding:20px}.kaart+.kaart{margin-top:16px}.veld{flex-direction:column;gap:4px;margin-bottom:14px;display:flex}.veld label{color:var(--kleur-inktgroen);font-size:13px;font-weight:500}.veld input,.veld select,.veld textarea{font-family:var(--font-body);border:1px solid var(--kleur-rand);background:var(--kleur-wit);color:var(--kleur-inktgroen);border-radius:6px;padding:8px 10px;font-size:14px}.veld input:focus,.veld select:focus,.veld textarea:focus{outline:2px solid var(--kleur-verdigris);outline-offset:1px}.formulier-rij{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;display:grid}.btn{font-family:var(--font-body);cursor:pointer;border:1px solid #0000;border-radius:6px;padding:9px 16px;font-size:14px;font-weight:500;transition:filter .1s}.btn:hover{filter:brightness(.95)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primair{background:var(--kleur-verdigris);color:var(--kleur-wit)}.btn-koper{background:var(--kleur-koper);color:var(--kleur-wit)}.btn-secundair{border-color:var(--kleur-rand);color:var(--kleur-inktgroen);background:0 0}.btn-gevaar{border-color:var(--kleur-fout);color:var(--kleur-fout);background:0 0}.btn-klein{padding:5px 10px;font-size:13px}table.tabel{border-collapse:collapse;width:100%;font-size:14px}table.tabel th{text-align:left;font-family:var(--font-koppen);text-transform:uppercase;letter-spacing:.04em;color:var(--kleur-verdigris);border-bottom:2px solid var(--kleur-rand);padding:8px 10px;font-size:12px;font-weight:600}table.tabel td{border-bottom:1px solid var(--kleur-rand);padding:8px 10px}table.tabel tr.totaalregel td{border-top:2px solid var(--kleur-inktgroen);border-bottom:none;font-weight:600}table.tabel tbody tr:hover{background:#1f7a630f}.melding-fout{background:var(--kleur-fout-achtergrond);color:var(--kleur-fout);border:1px solid var(--kleur-fout);border-radius:6px;margin-bottom:14px;padding:10px 14px;font-size:14px}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:20px;display:grid}.kpi-tegel{background:var(--kleur-perkament-licht);border:1px solid var(--kleur-rand);border-radius:var(--radius);text-align:left;cursor:pointer;box-shadow:var(--schaduw);padding:16px 18px;transition:border-color .1s}.kpi-tegel:hover,.kpi-tegel.actief{border-color:var(--kleur-verdigris)}.kpi-tegel .label{text-transform:uppercase;letter-spacing:.04em;color:var(--kleur-koper);font-size:12px;font-weight:600}.kpi-tegel .waarde{font-family:var(--font-cijfers);margin-top:6px;font-size:26px;font-weight:600}.badge{text-transform:uppercase;letter-spacing:.03em;border-radius:100px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.badge-geraamd{color:var(--kleur-koper);background:#b5723c26}.badge-werkelijk{color:var(--kleur-verdigris);background:#1f7a6326}.looptijd-vergelijking{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:8px;display:grid}.looptijd-kaart{background:var(--kleur-wit);border:1px solid var(--kleur-rand);border-radius:var(--radius);padding:18px}.looptijd-kaart-header{font-family:var(--font-koppen);align-items:center;gap:8px;margin-bottom:10px;font-weight:600;display:flex}.looptijd-kaart-header input{width:56px;font-family:var(--font-cijfers);border:1px solid var(--kleur-rand);background:var(--kleur-perkament-licht);color:var(--kleur-inktgroen);border-radius:4px;padding:4px 6px;font-size:14px}.looptijd-kaart-header .eenheid{opacity:.7;font-size:12px;font-weight:400}.looptijd-kaart-hoofdbedrag{font-family:var(--font-cijfers);margin-bottom:12px;font-size:26px;font-weight:600}.looptijd-kaart-hoofdbedrag .per{font-family:var(--font-body);opacity:.7;font-size:12px;font-weight:400}.looptijd-kaart-regel{border-bottom:1px solid var(--kleur-rand);justify-content:space-between;gap:10px;padding:5px 0;font-size:13px;display:flex}.looptijd-kaart-totaal{border-bottom:none;border-top:1px solid var(--kleur-inktgroen);margin-top:4px;padding-top:8px;font-weight:600}.schema-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:8px;display:grid}.schema-scroll{border:1px solid var(--kleur-rand);border-radius:6px;max-height:320px;overflow-y:auto}.schema-scroll table.tabel{margin:0}.schema-scroll thead th{background:var(--kleur-perkament-licht);position:sticky;top:0}
