:root{color-scheme:light dark;--tekst:#1a1a1a;--achter:#fff;--accent:#0b5cad;--rand:#767676}
@media (prefers-color-scheme:dark){:root{--tekst:#f2f2f2;--achter:#121212;--accent:#8cc4ff;--rand:#9a9a9a}}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:1.125rem;line-height:1.6;max-width:46rem;margin:0 auto;padding:1rem;color:var(--tekst);background:var(--achter)}
a{color:var(--accent)}
button{font:inherit;padding:.5rem .9rem;border:2px solid var(--accent);border-radius:.4rem;background:var(--achter);color:var(--tekst);cursor:pointer}
button:disabled{opacity:.55;cursor:default}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.knoppen{display:flex;flex-wrap:wrap;gap:.5rem;margin:.5rem 0}
#speler{position:sticky;top:0;background:var(--achter);border-bottom:2px solid var(--rand);padding-bottom:.5rem;z-index:1}
input[type=range]{width:100%}
.lijst{list-style:none;padding:0}
.afl{border-top:1px solid var(--rand);padding:.5rem 0}
.afl h3{margin:.3rem 0;font-size:1.2rem}
.meta{margin:0;color:var(--tekst)}
.acties{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.speelt h3::after{content:" (speelt nu)";font-weight:normal}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--achter);padding:.5rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tip{font-size:1rem}