:root{--ink: #1b2733;--paper: #ffffff;--ground: #eef4f8;--muted: #5b6b78;--line: rgba(27, 39, 51, .14);--shadow: 0 3px 10px rgba(27, 39, 51, .08);--radius: 16px;--korte-klinker: #e4572e;--lange-klinker: #c8213e;--open-lettergreep: #d68f00;--andere-klinker: #7b4fd1;--medeklinker: #1b6fb0;--cluster: #12876b;--juist: #1a9e5c;--fout: #d1332c;--op-kleur: #ffffff;--accent-tekst: var(--medeklinker);--accent-tekst-alt: var(--korte-klinker);--zacht: rgba(27, 39, 51, .04);--knop-stil: var(--ground);color-scheme:light;font-family:"Baloo 2",system-ui,sans-serif;color:var(--ink)}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--ink: #e6e9ec;--paper: #1a2027;--ground: #0f1418;--muted: #9aa7b2;--line: rgba(230, 233, 236, .16);--shadow: 0 3px 10px rgba(0, 0, 0, .35);--accent-tekst: #6cb2ef;--accent-tekst-alt: #ff8a63;--zacht: rgba(230, 233, 236, .06);--knop-stil: #252e38;color-scheme:dark}}:root[data-theme=dark]{--ink: #e6e9ec;--paper: #1a2027;--ground: #0f1418;--muted: #9aa7b2;--line: rgba(230, 233, 236, .16);--shadow: 0 3px 10px rgba(0, 0, 0, .35);--accent-tekst: #6cb2ef;--accent-tekst-alt: #ff8a63;--zacht: rgba(230, 233, 236, .06);--knop-stil: #252e38;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:var(--ground);-webkit-text-size-adjust:100%}.shell{max-width:42rem;margin:0 auto;padding:1.2rem 1rem 3rem}@media (min-width: 48rem){.shell{max-width:64rem;padding-left:2rem;padding-right:2rem}}.top{text-align:center;margin-bottom:1.4rem}.top h1{margin:0;font-size:2.1rem;font-weight:800;color:var(--accent-tekst)}.subtitle{margin:.3rem 0 0;color:var(--muted);font-size:1.05rem}.klanken-picker{background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.1rem;margin-bottom:1.4rem}.niveau-toggle{display:flex;align-items:center;gap:.55rem;margin:.8rem 0 1.1rem;padding:.6rem .8rem;background:var(--ground);border-radius:var(--radius);font-size:.92rem;font-weight:600;color:var(--ink);cursor:pointer}.niveau-toggle input{width:1.2rem;height:1.2rem;accent-color:var(--medeklinker);cursor:pointer}.niveau-toggle em{font-style:normal;color:var(--muted);font-weight:500}.btn{min-height:2.75rem;padding:.6rem 1rem;background:var(--ink);color:var(--paper);border:0;border-radius:999px;font:inherit;font-weight:700;font-size:1rem;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;box-shadow:0 8px 18px #1b273314}.btn:hover,.btn:focus-visible{transform:translateY(-1px);filter:brightness(1.02)}.btn:active{transform:translateY(0)}.btn-small{min-height:2.2rem;padding:.45rem .8rem;font-size:.86rem}.btn-quiet{background:var(--knop-stil);color:var(--ink)}.btn-primary{background:var(--medeklinker);color:var(--op-kleur)}.klanken-group{margin-top:1rem}.klanken-group.is-eerste{margin-top:0}.klanken-paar{display:contents}@media (min-width: 48rem){.klanken-paar{display:grid;grid-template-columns:1fr 1fr;gap:0 1.4rem}}.klanken-group h2{margin:0 0 .5rem;font-size:.9rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}.klanken-row{display:flex;flex-wrap:wrap;gap:.5rem}.klank{min-width:2.9rem;min-height:2.9rem;padding:.4rem .7rem;border-radius:999px;border:2px solid var(--line);background:var(--paper);font:inherit;font-size:1.2rem;font-weight:700;color:var(--ink);cursor:pointer}.klank:disabled{opacity:.4;cursor:not-allowed}.klank-alles{background:var(--ground);border-style:dashed;border-color:var(--line);color:var(--muted);font-size:.9rem}.klank.is-on.is-korte-klinker{background:var(--korte-klinker);border-color:var(--korte-klinker);color:var(--op-kleur)}.klank.is-on.is-lange-klinker{background:var(--lange-klinker);border-color:var(--lange-klinker);color:var(--op-kleur)}.klank.is-on.is-open-lettergreep{background:var(--open-lettergreep);border-color:var(--open-lettergreep);color:var(--op-kleur)}.klank.is-on.is-andere-klinker{background:var(--andere-klinker);border-color:var(--andere-klinker);color:var(--op-kleur)}.klank.is-on.is-medeklinker{background:var(--medeklinker);border-color:var(--medeklinker);color:var(--op-kleur)}.klank.is-on.is-cluster{background:var(--cluster);border-color:var(--cluster);color:var(--op-kleur)}.results-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:.8rem}.results-title{margin:0;font-size:1.15rem;font-weight:800;color:var(--muted)}.empty{color:var(--muted);font-size:1.05rem}.oefenen-start{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem;margin-bottom:1.1rem;padding:.9rem;background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow)}.oefenen-start-label{font-weight:700;color:var(--muted)}.oefenen-start-knoppen{display:flex;flex-wrap:wrap;gap:.5rem}.oefenvorm-keuze{display:flex;padding:.2rem;background:var(--ground);border-radius:999px}.oefenvorm{min-height:2.4rem;padding:.35rem .9rem;border:0;border-radius:999px;background:transparent;font:inherit;font-weight:700;font-size:.95rem;color:var(--muted);cursor:pointer}.oefenvorm.is-on{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}.lees-lijst{display:flex;flex-direction:column;align-items:center;gap:.8rem}.lees-lijst-voortgang{margin:0;font-size:1.05rem;font-weight:700;color:var(--muted)}.lees-lijst-venster{--rij: 6.2rem;position:relative;width:100%;max-width:28rem;height:max(20rem,calc(100dvh - 19rem));overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent)}.lees-lijst-woorden{position:absolute;top:50%;left:0;right:0;margin:0;padding:0;list-style:none;transform:translateY(calc(var(--actief) * var(--rij) * -1 - var(--rij) / 2));transition:transform .38s cubic-bezier(.22,.8,.3,1)}.lees-woord-rij{display:flex;justify-content:center;height:var(--rij)}.lees-woord{display:flex;justify-content:center;align-items:center;width:100%;padding:0 .6rem;background:none;border:0;font:inherit;font-size:5rem;font-weight:800;white-space:nowrap;cursor:pointer;transform:scale(calc(.32 + .68 * var(--nabij) * var(--nabij) * var(--nabij)));opacity:calc(.15 + .85 * var(--nabij) * var(--nabij));transition:transform .38s cubic-bezier(.22,.8,.3,1),opacity .38s ease}.lees-woord:focus{outline:none}@media (prefers-reduced-motion: reduce){.lees-lijst-woorden,.lees-woord{transition:none}}.lees-lijst-knoppen{display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem}.lees-lijst-knoppen .btn:disabled{opacity:.4;cursor:default}.oefenen{display:flex;flex-direction:column;align-items:center;gap:1.4rem;padding:2.4rem 1rem 1rem}.oefenen-header{display:flex;flex-direction:column;align-items:center;gap:.5rem;width:100%;max-width:24rem}.oefenen-progress{width:100%;height:.5rem;background:var(--line);border-radius:999px;overflow:hidden}.oefenen-progress-bar{height:100%;background:linear-gradient(90deg,var(--cluster),var(--medeklinker));border-radius:inherit;transition:width .32s ease}.oefenen-voortgang{margin:0;font-size:1.1rem;font-weight:700;color:var(--muted)}.oefenen-kaart-wrap{width:100%;max-width:24rem}.oefenen-kaart{position:relative;display:flex;justify-content:center;align-items:baseline;flex-wrap:wrap;width:100%;padding:2.4rem 1.2rem;background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);font-size:3.4rem;font-weight:800;text-align:center;touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:grab;transition:transform .2s ease,background-color .2s ease}.oefenen-kaart.is-slepen{transition:none;cursor:grabbing}.oefenen-woord{display:flex;justify-content:center;flex-wrap:wrap}.oefenen-icoon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:7rem;line-height:1;color:#fff;pointer-events:none}.klank-part.is-wit{color:#fff}.klank-part.is-enkel{color:var(--ink)}.oefenen-feedback{display:flex;justify-content:center;width:100%}.oefenen-hint{margin:0;font-size:.9rem;color:var(--muted);padding:.4rem .8rem;border-radius:999px;background:var(--zacht)}.oefenen-knoppen{display:flex;justify-content:center;flex-wrap:wrap;gap:.7rem;width:100%}.oefenen-knoppen .btn{min-width:6.2rem;padding-left:.9rem;padding-right:.9rem}.btn-juist{color:var(--op-kleur);background:linear-gradient(180deg,#1bb76a 0%,var(--juist) 100%)}.btn-fout{color:var(--op-kleur);background:linear-gradient(180deg,#e6453f 0%,var(--fout) 100%)}.btn-stop-oefenen{margin-top:1rem}.oefenen-resultaat{text-align:center}.oefenen-resultaat h2{margin:0;font-size:1.8rem;color:var(--accent-tekst)}.resultaat-emoji{font-size:3.4rem;line-height:1}.resultaat-score{margin:0;font-size:2.6rem;font-weight:800;color:var(--ink)}.oefenen-telling{display:flex;align-items:center;gap:.6rem;font-size:1.3rem;font-weight:700}.oefenen-telling .is-juist{color:var(--juist)}.oefenen-telling .is-fout{color:var(--fout)}.telling-scheiding{color:var(--line)}.word-list-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent)}.word-list{display:flex;gap:.7rem;width:max-content;list-style:none;margin:0;padding:.2rem .2rem .7rem;animation-name:word-list-scroll;animation-timing-function:linear;animation-iteration-count:infinite}.word-list-marquee:hover .word-list,.word-list-marquee:focus-within .word-list{animation-play-state:paused}@keyframes word-list-scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}@media (prefers-reduced-motion: reduce){.word-list{animation:none;overflow-x:auto}}.word-card{display:flex;justify-content:center;align-items:baseline;flex:0 0 auto;min-width:6.5rem;padding:.9rem 1rem;background:var(--paper);border-radius:var(--radius);box-shadow:var(--shadow);font-size:1.7rem;font-weight:700;white-space:nowrap}.klank-part{color:var(--accent-tekst)}.klank-part.is-alt{color:var(--accent-tekst-alt)}.foot{text-align:center;margin-top:2rem;font-size:.8rem;color:var(--muted)}.foot p{margin:0}.thema-keuze{display:inline-flex;gap:.15rem;margin-bottom:.6rem;padding:.2rem;background:var(--zacht);border:1px solid var(--line);border-radius:999px}.thema-optie{display:flex;align-items:center;justify-content:center;width:2.2rem;height:2.2rem;border:0;border-radius:999px;background:transparent;color:var(--muted);cursor:pointer}.thema-optie.is-on{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}.update-toast{position:fixed;z-index:9;left:50%;bottom:1.2rem;transform:translate(-50%);display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem .8rem;max-width:calc(100vw - 2rem);padding:.8rem 1rem;background:var(--ink);color:var(--paper);border-radius:999px;box-shadow:0 8px 24px #1b27334d;font-weight:600}.update-toast span{white-space:nowrap}@media (max-width: 26rem){.lees-woord{font-size:3.5rem}.word-card{font-size:1.4rem}.oefenen-kaart{padding:1.8rem 1rem}.oefenen-kaart{font-size:2.4rem}.oefenen-icoon{font-size:4.6rem}.oefenen-knoppen .btn{min-width:4.6rem;font-size:.9rem}}