:root{--baan: #176b55;--baan-donker: #104b3d;--lijnen: #f8fafc;--glas: #38bdf8;--gaas: #94a3b8;--accentgeel: #facc15;--team-a: #d97706;--team-b: #1d4ed8;--oppervlak: #fff;--radius: .7rem;--schaduw: 0 8px 24px rgba(15, 23, 42, .12);font-family:system-ui,sans-serif;color:#111827;background:#edf4f5;line-height:1.5}*{box-sizing:border-box}body{margin:0}.app{max-width:1100px;margin:0 auto;padding:0 1rem 2rem}.kop{padding:.75rem 0}.logo{font-weight:700;color:#1d4ed8;text-decoration:none}a{color:#1d4ed8}h1{font-size:1.5rem;margin:.5rem 0}h2{font-size:1.1rem;margin:1rem 0 .25rem}.lijst{list-style:none;padding:0;display:grid;gap:.75rem}.kaart{display:flex;flex-direction:column;gap:.2rem;padding:1rem;min-height:44px;background:#fff;border-radius:.5rem;border:1px solid #cbd5e1;text-decoration:none;color:inherit}.kaart span{display:block}.kaart:hover,.kaart:focus-visible{border-color:#1d4ed8;box-shadow:0 2px 8px #1d4ed826}.kaart{gap:.4rem;padding:1.1rem 1.25rem}.kaart-thema{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:#1d4ed8}.niveau{width:fit-content;padding:.1rem .45rem;border-radius:1rem;background:#ede9fe;color:#5b21b6;font-size:.8rem;font-weight:700}.kaart-titel{font-size:1.1rem;line-height:1.3}.kaart-omschrijving{color:#334155}.kaart-voet{display:flex!important;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:.4rem;padding-top:.6rem;border-top:1px solid #e2e8f0;font-size:.9rem}.kaart-speler{color:#475569}.kaart-open{color:#1d4ed8;font-weight:600}@media (min-width: 900px){.lijst{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.lijst>li{display:flex}.lijst .kaart{flex:1}}.terug{display:inline-block;padding:.5rem 0}.indeling{display:grid;gap:1.5rem;grid-template-columns:1fr}@media (min-width: 800px){.indeling{grid-template-columns:minmax(280px,420px) 1fr;align-items:start}.veldkolom{position:sticky;top:.5rem}}.veld{width:100%;height:auto;max-height:90vh;display:block;border-radius:var(--radius);box-shadow:var(--schaduw);overflow:hidden}.veld-omgeving{fill:#d9e9ed}.veld-oppervlak{fill:var(--baan)}.veld-lijnen{stroke:var(--lijnen)}.veld-glas{stroke:var(--glas)}.veld-gaas{stroke:var(--gaas)}.veld-net{stroke:#0f172a}.veld-net-label{fill:#fff;stroke:#0f172a}.speler-team-A{fill:var(--team-a)}.speler-team-B{fill:var(--team-b)}.speler-rol{fill:#102a26;stroke:#fff;stroke-width:.1;paint-order:stroke}.bal{fill:var(--accentgeel);stroke:#854d0e;stroke-width:.07}.gebied-geschikt{fill:#22c55e4d;stroke:#15803d}.gebied-minder-geschikt{fill:#ef444433;stroke:#b91c1c}.gebied-label{fill:#15803d;stroke:#fff}.verplaatsing-lijn{stroke:var(--accentgeel);stroke-width:.18;stroke-dasharray:.45 .22;animation:verplaatsing-stroom 1s linear infinite}.verplaatsing-punt{fill:var(--accentgeel)}.legenda-pijl{color:#a16207;font-weight:800}@keyframes verplaatsing-stroom{to{stroke-dashoffset:-.67}}@media (prefers-reduced-motion: reduce){.verplaatsing-lijn{animation:none}}@media (max-width: 799px){.veldkolom{max-width:min(100%,62vh * .5 + 6rem);margin-inline:auto}}.legenda{list-style:none;padding:0;margin:.5rem 0;font-size:.9rem}.legenda li{display:flex;align-items:center;gap:.5rem}.stip{width:.9rem;height:.9rem;border-radius:50%;display:inline-block;flex:none}.kruis{color:#dc2626;font-weight:700;width:.9rem;text-align:center}.opdracht{background:var(--oppervlak);border:2px solid var(--baan);border-radius:var(--radius);padding:.5rem 1rem 1rem;box-shadow:var(--schaduw)}.opdracht h2{margin-top:.5rem}button{font:inherit;padding:.75rem 1.25rem;min-height:48px;border-radius:.4rem;border:1px solid #1d4ed8;background:#1d4ed8;color:#fff;cursor:pointer}button:hover{background:#1e40af}dt{font-weight:700}dd{margin:0 0 .5rem}.bron{font-size:.9rem}.feedback{background:var(--oppervlak);border:2px solid #15803d;border-radius:var(--radius);padding:.5rem 1rem 1rem;box-shadow:var(--schaduw)}.feedback-minder-geschikt{border-color:#b45309}.feedback h3{margin-bottom:.2rem}.feedback p{margin-top:.2rem}button:disabled{opacity:.5;cursor:not-allowed}.indeling>*{min-width:0}.veldkolom{max-width:100%}.tekstkolom{overflow-wrap:anywhere}.knop-primair{background:var(--baan-donker);color:#fff;border:2px solid var(--baan-donker);font-weight:700;box-shadow:0 3px #08362c}.knop-primair:hover{background:var(--baan)}.knop-secundair{background:var(--oppervlak);color:var(--baan-donker);border:2px solid var(--baan);font-weight:700}.knop-secundair:hover:not(:disabled){background:#eff6ff}.acties{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0}@media (max-width: 799px){.acties button,.acties a{flex:1 1 100%}}.veldkolom .opdracht{margin-bottom:.75rem;padding-bottom:.75rem}.opdracht-kern{margin:.5rem 0;padding:.5rem .75rem;background:#eff6ff;border-radius:.4rem}.opdracht-kern div{display:flex;flex-wrap:wrap;column-gap:.4rem}.opdracht-kern dd{margin:0}.sleepinstructie{margin:.5rem 0;padding:.5rem .75rem;background:#fef9c3;border-left:4px solid #facc15;border-radius:.3rem}.stappen{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:.5rem 0 0;font-size:.9rem;color:#475569}.stappen li{display:flex;align-items:center;gap:.3rem}.stappen li[aria-current=step]{color:#1d4ed8;font-weight:700}.stap-nr{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.4rem;border-radius:50%;background:#cbd5e1;color:#111827;font-size:.8rem}.stappen li[aria-current=step] .stap-nr{background:#1d4ed8;color:#fff}.stip.halo{background:#facc15;border:2px dashed #111827}.feedback{margin-bottom:1rem}.feedback h2:focus{outline:none}.vergelijking{margin:.85rem 0;padding:.8rem;background:#f0fdf4;border:1px solid #86efac;border-radius:.5rem}.vergelijking h3{margin-top:0}.vergelijking p:last-child{margin-bottom:0}.keuze-symbool,.gebied-symbool{display:inline-block;width:.9rem;height:.9rem;margin-right:.35rem;vertical-align:-.1rem}.keuze-symbool{border:3px solid var(--accentgeel);border-radius:50%;background:#fff}.gebied-symbool{background:#22c55e73;border:1px solid #15803d}.advies{font-weight:600}.ronde-start{margin:.5rem 0 2rem;padding:1.25rem;background:#fff;border:2px solid #1d4ed8;border-radius:12px}.ronde-start h1{margin:0 0 .25rem;font-size:1.4rem}.ronde-start p{margin:0 0 1rem}.ronde-start button{min-height:48px}.ronde-start+h2{margin:0 0 .25rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:#475569}.ronde-start button:disabled{opacity:.5;cursor:not-allowed}.ronde-voortgang{margin:0 0 .25rem;font-weight:600;color:#1d4ed8}.vergelijking-velden{display:grid;gap:1rem;margin:1rem 0}.vergelijking-optie{margin:0;background:#fff;padding:.75rem;border:1px solid #cbd5e1;border-radius:var(--radius);box-shadow:var(--schaduw)}.vergelijking-optie figcaption{padding-top:.5rem;font-weight:700;text-align:center}.keuzeveld{display:grid;gap:.5rem;border:0;padding:0;margin:1rem 0}.keuzeveld legend{font-weight:700;margin-bottom:.5rem}.keuzeveld label{min-height:44px;display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;background:#fff;border:1px solid #cbd5e1;border-radius:.5rem;cursor:pointer}.keuzeveld input{width:1.2rem;height:1.2rem}@media (min-width: 800px){.vergelijking-velden{grid-template-columns:1fr 1fr}}a.knop-primair,a.knop-secundair{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:44px;padding:.5rem 1rem;border-radius:.5rem}.terugblik{list-style:none;margin:0 0 1rem;padding:0;display:grid;gap:.75rem}.terugblik li{padding:.75rem 1rem;background:#fff;border:1px solid #cbd5e1;border-radius:10px}.terugblik h2{margin:0 0 .25rem;font-size:1.05rem}.terugblik p{margin:0 0 .5rem}.terugblik a{display:inline-block;padding:.5rem 0}