:root{--achtergrond: #0e0f11;--vlak: #17191c;--vlak-op: #1f2226;--rand: #2b2f35;--tekst: #f2f3f5;--tekst-zacht: #a3a9b3;--geel: #f5b62b;--geel-tekst: #1a1400;--groen: #37b979;--rood: #ff5a5f;--radius: 14px;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--achtergrond);color:var(--tekst);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}h1{font-size:1.35rem;margin:0;letter-spacing:-.01em}h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.09em;color:var(--tekst-zacht);margin:28px 0 10px;display:flex;align-items:center;gap:8px}.telling{background:var(--vlak-op);color:var(--tekst-zacht);border-radius:999px;padding:1px 8px;font-size:.75rem;letter-spacing:0}.laden{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:60vh;color:var(--tekst-zacht)}.spinner{width:22px;height:22px;border-radius:50%;border:2px solid var(--rand);border-top-color:var(--geel);animation:draai .8s linear infinite}@keyframes draai{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.spinner{animation-duration:3s}}.inlog{display:flex;align-items:center;justify-content:center;min-height:100%;padding:24px}.inlog-kaart{width:100%;max-width:360px;background:var(--vlak);border:1px solid var(--rand);border-radius:var(--radius);padding:28px 24px 24px}.onder-titel{margin:4px 0 22px;color:var(--tekst-zacht)}.inlog-kaart label{display:block;font-size:.82rem;color:var(--tekst-zacht);margin:14px 0 6px}.inlog-kaart input{width:100%;padding:13px 12px;font-size:16px;background:var(--achtergrond);color:var(--tekst);border:1px solid var(--rand);border-radius:10px}.inlog-kaart input:focus-visible{outline:2px solid var(--geel);outline-offset:1px}.knop-primair{margin-top:22px;width:100%;min-height:48px;padding:13px 16px;background:var(--geel);color:var(--geel-tekst);border:none;border-radius:10px;font-size:1rem;font-weight:650;cursor:pointer}.knop-primair:disabled{opacity:.55;cursor:default}.knop-primair.breed{margin-top:14px}.knop-stil{background:none;border:1px solid var(--rand);color:var(--tekst-zacht);border-radius:999px;padding:8px 14px;font-size:.85rem;cursor:pointer;min-height:40px}.scherm{max-width:720px;margin:0 auto;padding:18px 16px 48px}.kop{padding-bottom:16px;border-bottom:1px solid var(--rand)}.kop-rij{display:flex;align-items:center;justify-content:space-between;gap:16px}.kop-knoppen{display:flex;gap:8px;flex:none}.knop-stil.breed-stil{width:100%;margin-top:10px}.status-live,.status-weg{margin:6px 0 0;font-size:.83rem;display:flex;align-items:center;gap:7px}.status-live{color:var(--tekst-zacht)}.status-weg{color:var(--rood)}.stip{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}.status-live .stip{background:var(--groen);animation:pols 2s ease-in-out infinite}@keyframes pols{50%{opacity:.35}}@media (prefers-reduced-motion: reduce){.status-live .stip{animation:none}}.leeg{color:var(--tekst-zacht);background:var(--vlak);border:1px dashed var(--rand);border-radius:var(--radius);padding:22px;text-align:center;margin:0}.eerder{opacity:.72}.lijst{list-style:none;margin:0;padding:0;display:grid;gap:12px}.kaart{background:var(--vlak);border:1px solid var(--rand);border-left:3px solid var(--rand);border-radius:var(--radius);padding:16px}.kaart.status-onderweg{border-left-color:var(--geel)}.kaart.status-afgerond{border-left-color:var(--groen)}.kaart.vers{animation:oplichten 4s ease-out}@keyframes oplichten{0%{border-color:var(--geel);background:#241f10}to{border-color:var(--rand);background:var(--vlak)}}@media (prefers-reduced-motion: reduce){.kaart.vers{animation:none;border-color:var(--geel)}}.kaart-kop{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.route{font-weight:600;line-height:1.35}.pijl{color:var(--tekst-zacht);margin:0 6px}.naar{color:var(--geel)}.binnen{color:var(--tekst-zacht);font-size:.82rem;font-variant-numeric:tabular-nums;flex:none}.feiten{display:grid;grid-template-columns:auto 1fr;gap:3px 14px;margin:12px 0 0;font-size:.9rem}.feiten dt{color:var(--tekst-zacht)}.feiten dd{margin:0}.feiten a{color:var(--tekst)}.statusknop{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:14px;background:var(--achtergrond);border:1px solid var(--rand);border-radius:10px;padding:4px}.statusknop button{min-height:42px;border:none;border-radius:7px;background:none;color:var(--tekst-zacht);font-size:.88rem;cursor:pointer}.statusknop button.aan{background:var(--vlak-op);color:var(--tekst);font-weight:600}.statusknop button:disabled{opacity:.6;cursor:default}.klaar{margin:14px 0 0;color:var(--groen);font-size:.88rem}.fout{color:var(--rood);font-size:.88rem;margin:12px 0 0}.fout.groot{background:#2a1214;border:1px solid #522;border-radius:10px;padding:12px 14px;margin:16px 0 0}