/* Klimba: Taalland (spelling). Tegels, het woord met het gat, de hulpplaatjes en het lettertoetsenbord. */

/* tegels op het Taalland-scherm (wit haalt 3:1, zoals de Rekenland-tegels) */
.pt-kn{background:#d9480f;box-shadow:0 7px 0 #a63a0c}
.pt-kn .bb-ico{color:#d9480f}
.pt-kn:active{box-shadow:0 2px 0 #a63a0c}
.pt-ei{background:#1c7ed6;box-shadow:0 7px 0 #1864ab}
.pt-ei .bb-ico{color:#1c7ed6}
.pt-ei:active{box-shadow:0 2px 0 #1864ab}
.pt-lk{background:#7048e8;box-shadow:0 7px 0 #5235ab}
.pt-lk .bb-ico{color:#7048e8}
.pt-lk:active{box-shadow:0 2px 0 #5235ab}
.pt-dt{background:#2b8a3e;box-shadow:0 7px 0 #1f6b2f}
.pt-dt .bb-ico{color:#2b8a3e}
.pt-dt:active{box-shadow:0 2px 0 #1f6b2f}
.pt-kn .bb-ico,.pt-ei .bb-ico,.pt-lk .bb-ico,.pt-dt .bb-ico{font-family:"Baloo 2",sans-serif;font-weight:800}

/* het woord met het gat: lichtblauw vakje, zelfde bij makkelijk en moeilijk */
.tlwoord{display:inline-flex;align-items:baseline;gap:.25em;font-family:"Baloo 2",sans-serif;font-weight:800;letter-spacing:.02em}
.tlart{font-size:.55em;color:#6b7386;font-weight:700}
.tlgat{display:inline-block;min-width:1.1em;padding:0 .12em;margin:0 .04em;border-radius:.18em;background:#eef6ff;color:#1a7cad;text-align:center;line-height:1.1}
.tlwoord.klaar .tlgat{background:#e3f6ea;color:#1f8355}
.tlgat .box{font-size:1em;min-width:0;padding:0;border:0;border-radius:0;background:none;color:inherit;line-height:inherit;display:inline}
.tlgat .box.filled{color:#233052}
.tlgat:has(.box.right){background:#e3f6ea}
.tlgat .box.right{background:none;color:#1f8355}
.sum .tlwoord{font-size:.92em}
.bigsum .tlwoord,.flash .tlwoord{font-size:.9em}
.hq .tlwoord{font-size:1em}

/* plaatje boven de vraag (Klanken) */
.picsum svg.tlpic{width:auto;height:min(15vh,120px)}
body.hard .picsum svg.tlpic{height:min(10vh,90px)}
.flash svg.tlpic{display:block;margin:0 auto 4px;width:auto;height:min(13vh,110px)}
.trickpic svg.tlpic{height:min(12vh,100px);width:auto}

/* hulp 2 en de les: hokjes, klankgroepen, langer maken, familie */
.tlpicbig svg{width:auto;height:min(16vh,130px);display:block;margin:0 auto 6px}
.tlhokjes,.tlgroepen,.tllanger,.tlfam{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;font-family:"Baloo 2",sans-serif;font-weight:800;font-size:clamp(24px,5vh,40px)}
.tlhok{min-width:1.4em;padding:.05em .3em;border-radius:12px;background:#fff;border:2.5px solid #2a2f55;text-align:center;line-height:1.2;color:#233052}
.tlhok.leeg{background:#eef6ff;color:#1a7cad;border-style:dashed}
.tlhok.goed{background:#e3f6ea;border-color:#1f8355}
.tlgroep{padding:.05em .45em .3em;border-bottom:4px solid #7048e8;border-radius:0 0 50% 50% / 0 0 18px 18px}
.tlstreep{color:#9aa1b5}
.tlpijl{color:#2b8a3e;font-size:.9em}
.tlfam{flex-direction:column;gap:4px}
.tlfam small{font-family:"Nunito",sans-serif;font-size:14px;font-weight:700;color:#6b7386}

/* lettertoetsenbord: a t/m z, wissen en klaar (7 per rij) */
.letterpad{grid-template-columns:repeat(7,1fr);gap:clamp(4px,.8vh,8px)}
.letterpad .key{min-height:clamp(34px,5.4vh,70px);font-size:clamp(18px,min(5vw,3.4vh),34px);border-radius:clamp(10px,1.4vh,16px);padding:0}

/* diplomascherm: alle Taalland-onderdelen onder één tabblad */
.taalgroup h3{font-size:clamp(14px,2vh,18px);margin:4px 0 6px;color:#6b7386}
.taalgroup .medals{grid-template-columns:repeat(4,minmax(0,1fr))}
.taalgroup .tlrij{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1.6vh,18px) clamp(6px,1.4vw,14px)}
.taalgroup .tlrij .medals{display:contents}
.scene-letters{overflow:visible}
