.tc{--tc-pink:color-mix(in srgb, var(--mist) 45%, var(--oppervlak));--tc-ring:color-mix(in srgb, var(--hemel) 30%, var(--oppervlak));--tc-midden:color-mix(in srgb, var(--gras) 35%, var(--oppervlak));--tc-wijs:color-mix(in srgb, var(--zon) 50%, var(--oppervlak));--tc-duim:color-mix(in srgb, var(--inkt-zacht) 25%, var(--oppervlak))}.tc-keuzes{gap:var(--ruimte-2);grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));display:grid}.tc-keuze{align-items:flex-start;gap:var(--ruimte-1);padding:var(--ruimte-3);border-radius:var(--radius-wolk);background:var(--oppervlak);color:var(--inkt);font:inherit;text-align:left;cursor:pointer;border:2px solid #0000;flex-direction:column;display:flex}.tc-keuze:hover,.tc-keuze:focus-visible{border-color:var(--hemel)}.tc-keuze__rij{gap:4px;display:flex}.tc-keuze__rij span{border:2px solid var(--inkt);width:36px;height:36px;font-family:var(--font-display);border-radius:8px;place-items:center;font-weight:700;display:grid}.tc-toetsenbord{--toets:clamp(24px, 7.4vw, 52px);padding:var(--ruimte-2);border-radius:var(--radius-wolk);background:var(--oppervlak);flex-direction:column;align-items:center;gap:6px;display:flex}.tc-rij{gap:5px;display:flex}.tc-rij--0{margin-right:calc(var(--toets) * .5)}.tc-rij--2{margin-left:calc(var(--toets) * .5)}.tc-toets{width:var(--toets);height:var(--toets);border:2px solid color-mix(in srgb, var(--inkt) 25%, transparent);color:var(--inkt-zacht);font-family:var(--font-display);font-size:calc(var(--toets) * .42);opacity:.45;border-radius:8px;place-items:center;font-weight:700;display:grid;position:relative}.tc-toets.is-geleerd{opacity:1;color:var(--inkt)}.tc-vinger--lp.is-geleerd,.tc-vinger--rp.is-geleerd{background:var(--tc-pink)}.tc-vinger--lr.is-geleerd,.tc-vinger--rr.is-geleerd{background:var(--tc-ring)}.tc-vinger--lm.is-geleerd,.tc-vinger--rm.is-geleerd{background:var(--tc-midden)}.tc-vinger--li.is-geleerd,.tc-vinger--ri.is-geleerd{background:var(--tc-wijs)}.tc-vinger--duim.is-geleerd{background:var(--tc-duim)}.tc-toets--bobbel:after{content:"";background:currentColor;border-radius:2px;width:30%;height:3px;position:absolute;bottom:12%}.tc-toets.is-nieuw{border-color:var(--inkt);box-shadow:0 0 0 3px var(--zon)}.tc-toets.is-volgende{opacity:1;border-color:var(--hemel);box-shadow:0 0 0 4px var(--hemel);color:var(--inkt);transform:translateY(-2px)}.tc-toets--spatie{width:calc(var(--toets) * 6);font-size:calc(var(--toets) * .3)}.tc-toets--shift{width:calc(var(--toets) * 1.8);font-size:calc(var(--toets) * .3)}.tc-let-op{padding:var(--ruimte-1) var(--ruimte-2);border-radius:var(--radius-klein);background:var(--zon);color:#1f2a44}.tc-terug{gap:var(--ruimte-1);text-align:center;flex-direction:column;display:flex}.tc-lessen{gap:var(--ruimte-2);grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));margin:0;padding:0;list-style:none;display:grid}.tc-les{align-items:center;gap:var(--ruimte-2);width:100%;min-height:76px;padding:var(--ruimte-2);border-radius:var(--radius-wolk);background:var(--oppervlak);color:var(--inkt);font:inherit;text-align:left;cursor:pointer;border:2px solid #0000;grid-template-columns:auto 1fr auto;display:grid}.tc-les:hover:not(:disabled){border-color:var(--hemel)}.tc-les.is-dicht{opacity:.55;cursor:default}.tc-les__nummer{background:var(--hemel);width:44px;height:44px;color:var(--op-hemel);font-family:var(--font-display);border-radius:50%;place-items:center;font-size:22px;font-weight:700;display:grid}.tc-les.is-dicht .tc-les__nummer{background:var(--lucht)}.tc-les__tekst{flex-direction:column;min-width:0;display:flex}.tc-les__spel{color:var(--inkt-zacht)}.tc-les__toetsen{font-family:var(--font-display);font-size:22px;font-weight:700}.tc-ander{text-align:center;color:var(--inkt-zacht)}.tc-link{color:var(--hemel);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.tc-verhaal{align-items:center;gap:var(--ruimte-3);display:flex}.tc-verhaal img{flex:none;width:min(140px,28vw);height:auto}.tc-ballon{gap:var(--ruimte-1);padding:var(--ruimte-3);border-radius:var(--radius-wolk);background:var(--oppervlak);flex-direction:column;flex:1;display:flex}.tc-hints{margin:0;padding-left:1.2em;font-weight:600}.tc-midden{justify-content:center}.tc-verhaal-na{padding:var(--ruimte-2);border-radius:var(--radius-klein);background:var(--oppervlak)}.tc-typen{align-items:center;gap:var(--ruimte-1);padding:var(--ruimte-3) var(--ruimte-2);border-radius:var(--radius-wolk);background:var(--oppervlak);flex-direction:column;display:flex}.tc-regel{max-width:100%;font-family:var(--font-lezen);letter-spacing:.04em;overflow-wrap:anywhere;text-align:center;font-size:clamp(22px,5vw,40px);line-height:1.4}.tc-regel--lang{font-size:clamp(20px,4vw,32px)}.tc-teken{color:var(--inkt-zacht);border-bottom:4px solid #0000}.tc-teken.is-klaar{color:var(--gras)}.tc-teken.is-nu{border-bottom-color:var(--hemel);color:var(--inkt)}.tc-teken--spatie.is-nu{background:color-mix(in srgb, var(--hemel) 20%, transparent)}.tc-teken.is-fout{border-bottom-color:var(--dakpan);background:color-mix(in srgb, var(--dakpan) 22%, transparent);animation:.25s tc-schud}@keyframes tc-schud{25%{transform:translate(-3px)}75%{transform:translate(3px)}}.tc-hint{min-height:1.4em;color:var(--inkt-zacht);text-align:center}.tc-juist{text-align:center;min-height:1.4em;color:var(--inkt-zacht)}.tc-lucht{border-radius:var(--radius-wolk);background:linear-gradient(var(--lucht), var(--oppervlak));height:min(420px,60vh);position:relative;overflow:hidden}.tc-daken{justify-content:space-around;align-items:flex-end;height:18%;display:flex;position:absolute;inset:auto 0 0}.tc-daken span{background:var(--dakpan);clip-path:polygon(50% 0,100% 45%,100% 100%,0 100%,0 45%);width:11%;height:70%}.tc-wolk{border-radius:var(--radius-rond);background:var(--wolk);box-shadow:0 2px 0 color-mix(in srgb, var(--inkt) 25%, transparent);font-family:var(--font-lezen);white-space:nowrap;padding:10px 18px;font-size:clamp(20px,4vw,30px);transition:opacity .4s,transform .4s;position:absolute;top:0}.tc-wolk .tc-teken.is-nu{border-bottom-color:#0000}.tc-wolk.is-actief{box-shadow:0 0 0 4px var(--hemel)}.tc-wolk.is-actief .tc-teken.is-nu{border-bottom-color:var(--hemel)}.tc-wolk.is-fout{box-shadow:0 0 0 4px var(--dakpan)}.tc-wolk.is-gevangen{opacity:0;transform:scale(1.4)translateY(-20px)}.tc-wolk.is-plof{opacity:0;transform:scale(.6)}.tc-baan{gap:var(--ruimte-1);padding:var(--ruimte-2) 56px var(--ruimte-2) var(--ruimte-2);border-radius:var(--radius-wolk);background:var(--oppervlak);flex-direction:column;display:flex;position:relative}.tc-spoor{border-bottom:3px dashed color-mix(in srgb, var(--inkt) 20%, transparent);height:64px;position:relative}.tc-loper{object-fit:contain;background:#fff;border-radius:50%;width:56px;height:56px;transition:left .12s linear;position:absolute;top:0;left:0}.tc-finish{right:var(--ruimte-1);font-size:40px;position:absolute;top:50%;transform:translateY(-50%)}@media (prefers-reduced-motion:reduce){.tc-teken.is-fout{animation:none}.tc-loper,.tc-wolk{transition:none}}