:root{--ink: #131a21;--ink-zacht: #5b6773;--lijn: #e3e7ec;--achtergrond: #f4f6f8;--wit: #ffffff;--navy: #12324f;--blauw: #1d6be0;--blauw-zacht: #e8f0fd;--groen: #2c9857;--groen-zacht: #e6f4ec;--oranje: #d9761c;--oranje-zacht: #fcefe1;--rood: #c93a3a;--rood-zacht: #fbeaea;--rond: 14px;--rond-klein: 10px;--raak: 48px;--schaduw: 0 1px 2px rgba(19, 26, 33, .06)}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--achtergrond);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.app{min-height:100dvh;display:flex;flex-direction:column}.balk{position:sticky;top:0;z-index:20;background:var(--navy);color:#fff;padding:calc(env(safe-area-inset-top) + 12px) 16px 12px;display:flex;align-items:center;gap:12px}.balk h1{margin:0;font-size:17px;font-weight:650;letter-spacing:-.01em;flex:1}.balk .onder{display:block;font-size:12px;font-weight:400;opacity:.7;letter-spacing:0}.balk-knop{background:#ffffff24;color:#fff;border:0;border-radius:999px;min-height:36px;padding:0 14px;font-size:14px;font-weight:600}.inhoud{flex:1;padding:16px 16px 96px;max-width:760px;width:100%;margin:0 auto}.tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:var(--wit);border-top:1px solid var(--lijn);padding-bottom:env(safe-area-inset-bottom)}.tab{flex:1;border:0;background:none;padding:10px 4px;min-height:var(--raak);display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:600;color:var(--ink-zacht)}.tab .glyph{font-size:19px;line-height:1}.tab[aria-current=page]{color:var(--blauw)}.tab:disabled{opacity:.35}.kaart{background:var(--wit);border:1px solid var(--lijn);border-radius:var(--rond);box-shadow:var(--schaduw)}.kaart+.kaart{margin-top:12px}.titelrij{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:4px 2px 10px}.titelrij h2{margin:0;font-size:20px;font-weight:680;letter-spacing:-.015em}.telling{font-size:13px;color:var(--ink-zacht)}.lijst{list-style:none;margin:0;padding:0}.lijst li+li{border-top:1px solid var(--lijn)}.rij{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;text-align:left;padding:10px 14px;min-height:62px}.rij:active{background:#f7f9fb}.bol{width:40px;height:40px;flex:0 0 40px;border-radius:999px;display:grid;place-items:center;font-size:14px;font-weight:700;color:#fff;letter-spacing:.01em}.rij-tekst{flex:1;min-width:0}.rij-naam{font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rij-onder{font-size:13px;color:var(--ink-zacht);display:flex;align-items:center;gap:8px;flex-wrap:wrap}.merk{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:650;padding:2px 8px;border-radius:999px;white-space:nowrap}.merk-bal{background:var(--groen-zacht);color:#1f6f3f}.merk-geenbal{background:var(--oranje-zacht);color:#92500f}.merk-jarig{background:var(--blauw-zacht);color:#14508f}.filters{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px;scrollbar-width:none}.filters::-webkit-scrollbar{display:none}.chip{border:1px solid var(--lijn);background:var(--wit);color:var(--ink);border-radius:999px;padding:8px 14px;min-height:40px;font-size:14px;font-weight:600;white-space:nowrap}.chip[aria-pressed=true]{background:var(--navy);border-color:var(--navy);color:#fff}.zoek{width:100%;border:1px solid var(--lijn);background:var(--wit);border-radius:var(--rond-klein);padding:12px 14px;min-height:var(--raak);margin-bottom:12px}.zoek:focus{outline:2px solid var(--blauw);outline-offset:1px}.knop{border:1px solid var(--lijn);background:var(--wit);color:var(--ink);border-radius:var(--rond-klein);min-height:var(--raak);padding:0 16px;font-size:15px;font-weight:650;display:inline-flex;align-items:center;justify-content:center;gap:8px}.knop-vol{background:var(--blauw);border-color:var(--blauw);color:#fff}.knop-groen{background:var(--groen);border-color:var(--groen);color:#fff}.knop-rood{background:var(--wit);border-color:var(--rood);color:var(--rood)}.knop-breed{width:100%}.knop:disabled{opacity:.5}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#0c141c6b;display:flex;align-items:flex-end;justify-content:center}.blad{background:var(--wit);width:100%;max-width:560px;border-radius:18px 18px 0 0;padding:8px 16px calc(env(safe-area-inset-bottom) + 20px);max-height:88dvh;overflow-y:auto;animation:omhoog .18s ease-out}@keyframes omhoog{0%{transform:translateY(16px)}to{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.blad{animation:none}}.greep{width:38px;height:4px;border-radius:999px;background:var(--lijn);margin:6px auto 12px}.blad h3{margin:0 0 2px;font-size:20px;font-weight:680;letter-spacing:-.015em}.blad .sub{margin:0 0 16px;color:var(--ink-zacht);font-size:14px}.veldlabel{display:block;font-size:13px;font-weight:650;color:var(--ink-zacht);margin:16px 0 6px}.keuzerij{display:flex;gap:8px;flex-wrap:wrap}.keuze{flex:1 1 auto;min-width:92px;border:1.5px solid var(--lijn);background:var(--wit);border-radius:var(--rond-klein);min-height:var(--raak);font-weight:650}.keuze[aria-pressed=true]{border-color:var(--blauw);background:var(--blauw-zacht);color:#14508f}.invoer{width:100%;border:1px solid var(--lijn);border-radius:var(--rond-klein);padding:12px 14px;min-height:var(--raak);background:var(--wit)}.invoer:focus{outline:2px solid var(--blauw);outline-offset:1px}.knoprij{display:flex;gap:10px;margin-top:20px}.knoprij .knop{flex:1}.melding{border-radius:var(--rond-klein);padding:12px 14px;font-size:14px;font-weight:600;margin-bottom:12px}.melding-fout{background:var(--rood-zacht);color:#8e2727}.melding-goed{background:var(--groen-zacht);color:#1f6f3f}.melding-info{background:var(--blauw-zacht);color:#14508f}.leeg{text-align:center;color:var(--ink-zacht);padding:40px 20px;font-size:15px}.aanmelden{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--navy)}.aanmelden-kaart{background:var(--wit);border-radius:18px;padding:28px 22px;width:100%;max-width:380px}.aanmelden-kaart h1{margin:0 0 4px;font-size:22px;letter-spacing:-.02em}.aanmelden-kaart p{margin:0 0 22px;color:var(--ink-zacht);font-size:14px}@media(min-width:800px){.inhoud{padding:28px 24px 40px}.tabs{position:static;order:-1;max-width:760px;margin:0 auto;width:100%;border-top:0;border-bottom:1px solid var(--lijn);background:transparent}.tab{flex-direction:row;gap:8px;font-size:14px}.tab .glyph{font-size:16px}.overlay{align-items:center}.blad{border-radius:18px;padding-bottom:20px}}.terug{border:0;background:none;color:var(--blauw);font-weight:650;font-size:15px;padding:8px 2px;min-height:40px;margin-bottom:4px}.onderkop{margin:-6px 2px 14px;color:var(--ink-zacht);font-size:14px}.datumblok{width:46px;flex:0 0 46px;border-radius:var(--rond-klein);background:var(--blauw-zacht);color:#14508f;text-align:center;padding:5px 0 4px;line-height:1.15}.datumblok-dag{display:block;font-size:11px;font-weight:700;text-transform:uppercase}.datumblok-cijfer{display:block;font-size:19px;font-weight:700}.datumblok-maand{display:block;font-size:10px;opacity:.75}.subtabs{display:flex;gap:6px;background:#eceff3;border-radius:var(--rond-klein);padding:4px;margin:18px 0 14px}.subtab{flex:1;border:0;background:none;border-radius:8px;min-height:40px;font-size:14px;font-weight:650;color:var(--ink-zacht)}.subtab[aria-pressed=true]{background:var(--wit);color:var(--ink);box-shadow:var(--schaduw)}.tellers{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.teller{font-size:13px;font-weight:650;color:var(--ink-zacht);background:var(--wit);border:1px solid var(--lijn);border-radius:999px;padding:5px 12px}.teller-goed{background:var(--groen-zacht);color:#1f6f3f;border-color:transparent}.teller-uit{background:var(--rood-zacht);color:#8e2727;border-color:transparent}.rij-tik{transition:background .12s ease}.rij-aanwezig{background:var(--groen-zacht)}.rij-afwezig{background:#f6f7f9}.rij-afwezig .rij-naam{color:var(--ink-zacht);text-decoration:line-through}.rij-gedempt{opacity:.6}.vink{font-size:12px;font-weight:700;border-radius:999px;padding:6px 12px;background:#eef1f4;color:var(--ink-zacht);white-space:nowrap}.vink-aan{background:var(--groen);color:#fff}.vink-uit{background:#dfe3e8;color:#5b6773}.pijl{color:var(--ink-zacht);font-size:22px;padding-right:4px}.plan{margin-top:14px}.blok{background:var(--wit);border:1px solid var(--lijn);border-radius:var(--rond);padding:12px 14px;margin-bottom:10px}.blok-compact{margin-bottom:0;border:0;border-radius:0;padding:10px 14px}.blok-compact+.blok-compact{border-top:1px solid var(--lijn)}.blok-kop{display:flex;justify-content:space-between;font-size:12px;font-weight:700;color:var(--ink-zacht);text-transform:uppercase;letter-spacing:.03em;margin-bottom:3px}.blok-naam{font-weight:650;letter-spacing:-.01em}.blok-uitleg{font-size:13.5px;color:var(--ink-zacht);margin-top:4px}.ronde{border:1px solid var(--lijn);border-radius:var(--rond);background:var(--wit);margin-bottom:10px;overflow:hidden}.ronde-kop{display:flex;justify-content:space-between;background:#f1f4f7;padding:8px 14px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--ink-zacht)}.materiaallijst{margin:0;padding-left:18px}.materiaallijst li{padding:3px 0}.materiaallijst .merk{margin-left:6px}.uitklap{display:block;margin-top:8px;font-size:14px;color:var(--ink);white-space:normal}.uitklap-materiaal,.uitklap-bron{display:block;margin-top:6px;font-size:13px;color:var(--ink-zacht)}.invoer-kort{width:82px;text-align:center;padding:8px;min-height:42px}select.invoer{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:none}.keuzerij-vier .keuze{min-width:0;flex:1 1 0}.filters{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 18px),transparent)}@media(min-width:800px){.filters{-webkit-mask-image:none;mask-image:none}}