:root{--navy-diep: #0b2338;--navy: #1b365d;--navy-licht: #2c4a75;--rood: #e2231a;--geel: #f5c400;--groen: #2e9e5b;--oranje: #e0a526;--wit: #f7f9fc;--grijs: #9fb0c4;--lijn: rgba(255, 255, 255, .14);color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--navy-diep);color:var(--wit);font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.45;touch-action:manipulation;-webkit-tap-highlight-color:transparent}#root{max-width:560px;margin:0 auto;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit}a{color:inherit}.start-scherm{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:32px 24px;text-align:center}.start-logo{width:88px;height:88px;object-fit:contain}.start-scherm h1{font-size:1.7rem;margin:0}.start-scherm .ondertitel{color:var(--grijs);margin:-8px 0 0}.taal-knop-zwevend{position:absolute;top:16px;right:16px;background:#ffffff14;border:1px solid rgba(255,255,255,.25);color:var(--wit);font-size:.8rem;font-weight:700;padding:6px 12px;border-radius:999px;cursor:pointer}.inlogformulier{width:100%;display:flex;flex-direction:column;gap:12px}.inlogformulier input{width:100%;padding:16px;border-radius:12px;border:1px solid rgba(255,255,255,.25);background:#ffffff14;color:var(--wit);font-size:1rem}.knop-start{width:100%;padding:18px;font-size:1.2rem;font-weight:700;border:none;border-radius:14px;background:var(--geel);color:var(--navy-diep);cursor:pointer}.inlogfout{background:#e2231a2e;border:1px solid rgba(226,35,26,.5);border-radius:10px;padding:12px;font-size:.9rem}.hint{color:var(--grijs);font-size:.9rem}.kop{position:sticky;top:0;z-index:10}.kopbalk{display:flex;align-items:center;gap:12px;padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top));background:var(--navy)}.kopbalk img{width:30px;height:30px;object-fit:contain}.titel-blok{flex:1;line-height:1.15}.titel-blok .naam{font-weight:700;font-size:.95rem}.titel-blok .sub{font-size:.72rem;color:var(--grijs)}.icoonknop{background:#ffffff14;border:1px solid rgba(255,255,255,.25);color:var(--wit);font-size:.8rem;font-weight:700;padding:6px 12px;border-radius:999px;cursor:pointer}.bel-112{display:block;text-align:center;background:var(--rood);color:var(--wit);text-decoration:none;font-weight:800;font-size:1.05rem;letter-spacing:.03em;padding:12px}.inhoud{flex:1;padding:16px 16px calc(32px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px}.intro h1{margin:4px 0 2px;font-size:1.6rem}.intro p{margin:0;color:var(--grijs);font-size:.92rem}.zoekveld{width:100%;padding:14px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.25);background:#ffffff14;color:var(--wit);font-size:1rem}.zoekveld::placeholder{color:var(--grijs)}.tegels{display:flex;flex-direction:column;gap:10px}.tegel{display:flex;align-items:center;gap:14px;padding:14px;border-radius:14px;background:var(--navy);text-decoration:none;border:1px solid transparent}.tegel:active{transform:scale(.99)}.tegel.rood{background:var(--rood)}.tegel-icoon,.onderwerp-icoon{font-size:1.8rem;width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;border-radius:12px;background:#ffffff1a}.tegel-tekst{flex:1;display:flex;flex-direction:column;min-width:0}.categorie{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--geel)}.rood .categorie{color:var(--wit);opacity:.85}.tegel-titel{font-weight:700;font-size:1.05rem}.tegel-samenvatting{font-size:.85rem;color:#ffffffc7}.tegel-pijl{font-size:1.2rem;color:var(--grijs)}.rood .tegel-pijl{color:var(--wit)}.leeg{color:var(--grijs);text-align:center}.disclaimer{margin-top:8px;background:#ffffff0f;border:1px solid var(--lijn);border-radius:12px;padding:14px;font-size:.82rem;color:var(--grijs)}.disclaimer strong{color:var(--wit)}.uitloggen-link{color:var(--grijs);font-size:.8rem;text-align:center}.terug-link{color:var(--grijs);text-decoration:none;font-size:.9rem;font-weight:600}.terug-knop{margin-top:8px;display:block;text-align:center;padding:14px;border-radius:12px;background:#ffffff1a;text-decoration:none;font-weight:700}.onderwerp-kop{display:flex;align-items:center;gap:14px;padding:16px;border-radius:14px;background:var(--navy)}.onderwerp-kop.rood{background:var(--rood)}.onderwerp-kop h1{margin:0;font-size:1.4rem;line-height:1.2}.blok-tekst{margin:0;font-size:.98rem}.blok-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:800;margin-bottom:4px}.blok-regel{background:var(--geel);color:var(--navy-diep);border-radius:12px;padding:14px;font-weight:700}.blok-waarschuwing{background:#e2231a2e;border:1px solid rgba(226,35,26,.6);border-left:5px solid var(--rood);border-radius:12px;padding:14px;font-weight:600}.blok-regel.klein,.blok-waarschuwing.klein{font-size:.9rem;padding:10px 12px}.blok-kaart{background:var(--navy);border-radius:14px;padding:16px}.blok-kaart h2,.bluskeuze h2{margin:0 0 10px;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--geel)}.stappen{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.stappen li{display:flex;gap:12px;align-items:flex-start}.stapnummer{flex-shrink:0;width:28px;height:28px;border-radius:50%;background:var(--geel);color:var(--navy-diep);font-weight:800;display:grid;place-items:center;font-size:.9rem}.stappen.klein{gap:8px;font-size:.92rem}.stappen.klein .stapnummer{width:24px;height:24px;font-size:.8rem}.doen-niet{display:grid;grid-template-columns:1fr;gap:10px}@media (min-width: 480px){.doen-niet{grid-template-columns:1fr 1fr}}.doen,.niet-doen{border-radius:14px;padding:14px}.doen{background:#2e9e5b29;border:1px solid rgba(46,158,91,.55)}.niet-doen{background:#e2231a24;border:1px solid rgba(226,35,26,.55)}.doen h2,.niet-doen h2{margin:0 0 8px;font-size:.95rem}.doen h2{color:#6fd49a}.niet-doen h2{color:#ff8a84}.doen ul,.niet-doen ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:.93rem}.kleurlijst{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.kleurlijst li{display:flex;gap:10px;align-items:flex-start}.kleurstip{flex-shrink:0;width:16px;height:16px;border-radius:4px;margin-top:3px}.blok-afbeelding{margin:0}.blok-afbeelding img{width:100%;border-radius:12px;display:block;background:#fff}.blok-afbeelding figcaption{font-size:.8rem;color:var(--grijs);margin-top:6px}.borden-uitleg{margin:-4px 0 12px;font-size:.9rem;color:#fffc}.borden{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:12px 10px}.borden li{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:.8rem;line-height:1.25}.borden img{width:64px;height:64px;object-fit:contain;background:#fff;border-radius:8px;padding:4px}.klassen{display:flex;flex-direction:column;gap:8px}.klasse-kaart{background:var(--navy);border-radius:14px;overflow:hidden}.klasse-kaart.open{outline:2px solid var(--geel)}.klasse-kop{width:100%;display:flex;align-items:center;gap:14px;padding:12px 14px;background:none;border:none;color:var(--wit);text-align:left;cursor:pointer}.klasse-letter{flex-shrink:0;width:44px;height:44px;border-radius:10px;background:var(--geel);color:var(--navy-diep);font-weight:900;font-size:1.6rem;display:grid;place-items:center}.klasse-pictogram{flex-shrink:0;width:52px;height:52px;object-fit:contain;background:#fff;border-radius:6px;padding:2px}.klasse-knop .klasse-pictogram{width:48px;height:48px}.icoon-afbeelding{width:36px;height:36px;object-fit:contain;background:#fff;border-radius:4px;padding:1px}.middel-icoon{flex-shrink:0;width:44px;height:44px;border-radius:10px;background:#ffffff1a;font-size:1.5rem;display:grid;place-items:center}.klasse-tekst{flex:1;display:flex;flex-direction:column;font-size:.85rem;color:#ffffffc7}.klasse-tekst strong{color:var(--wit);font-size:1.02rem}.klasse-pijl{font-size:1.4rem;color:var(--grijs);width:20px;text-align:center}.klasse-detail{padding:0 14px 14px;display:flex;flex-direction:column;gap:10px}.klasse-detail h3{margin:6px 0 0;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--geel)}.klasse-detail ul.plus,.klasse-detail ul.min{margin:0;padding-left:18px;font-size:.92rem}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{font-size:.8rem;font-weight:600;padding:5px 10px;border-radius:999px;border:1px solid}.chip-ja{background:#2e9e5b33;border-color:#2e9e5bb3}.chip-beperkt{background:#e0a52633;border-color:#e0a526b3}.chip-nee{background:#e2231a2e;border-color:#e2231a99;color:#ffffffbf}.link-klein{font-size:.88rem;font-weight:600;color:var(--geel);text-decoration:none}.bluskeuze{display:flex;flex-direction:column;gap:10px}.bluskeuze h2{margin-top:6px;margin-bottom:0}.klasse-knoppen{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}.klasse-knop{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border-radius:12px;border:2px solid transparent;background:var(--navy);color:var(--wit);font-size:.82rem;font-weight:600;cursor:pointer}.klasse-knop .klasse-letter{width:36px;height:36px;font-size:1.3rem}.klasse-knop.gekozen{border-color:var(--geel);background:var(--navy-licht)}.janee{display:flex;gap:8px}.janee-knop{flex:1;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:transparent;color:var(--wit);font-weight:700;font-size:1rem;cursor:pointer}.janee-knop.gekozen{background:var(--geel);border-color:var(--geel);color:var(--navy-diep)}.uitslag{display:flex;flex-direction:column;gap:10px;margin-top:6px}.uitslag-groep{border-radius:14px;padding:12px 14px}.uitslag-groep h3{margin:0 0 8px;font-size:.95rem}.uitslag-groep ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.uitslag-groep li{display:flex;flex-direction:column;gap:2px}.middel-naam{font-weight:700}.reden{font-size:.86rem;color:#fffc}.groep-ja{background:#2e9e5b29;border:1px solid rgba(46,158,91,.6)}.groep-ja h3{color:#6fd49a}.groep-beperkt{background:#e0a52624;border:1px solid rgba(224,165,38,.6)}.groep-beperkt h3{color:#f3c766}.groep-nee{background:#e2231a1f;border:1px solid rgba(226,35,26,.5)}.groep-nee h3{color:#ff8a84}.update-balk{position:fixed;left:50%;bottom:16px;transform:translate(-50%);max-width:440px;width:calc(100% - 32px);background:var(--geel);color:var(--navy-diep);border-radius:12px;padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.9rem;font-weight:600;z-index:50;box-shadow:0 4px 20px #0006}.update-balk button{border:none;background:var(--navy-diep);color:var(--wit);padding:8px 14px;border-radius:8px;font-weight:700;cursor:pointer}