.syntax-mastery{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 18px}.syntax-mastery div{background:#f4f0e5;color:var(--ink);border:1px solid var(--line);padding:10px}.syntax-mastery span{display:block;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.syntax-mastery b{font:600 19px 'Fraunces'}.syntax-kind{display:inline-block;background:var(--coral);padding:5px 8px;font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin:10px 0}.syntax-form{display:flex;gap:8px}.syntax-form input{flex:1;min-width:0;padding:13px;border:1px solid var(--line);font:inherit}.syntax-form button,.syntax-check{border:0;background:var(--ink);color:white;padding:12px 16px;font-weight:700;cursor:pointer}.syntax-drop,.syntax-bank{display:flex;flex-wrap:wrap;gap:8px;padding:12px;border:1px dashed var(--line);min-height:54px}.syntax-drop{margin-bottom:10px;background:#f7f5ee}.syntax-token{border:1px solid var(--ink);background:white;padding:9px 11px;cursor:pointer}.syntax-listen{display:flex;align-items:center;background:#edf5f7;border:1px solid var(--blue);padding:14px;margin-bottom:15px}.syntax-listen .german{font-size:0!important;margin:0!important;padding:0 48px 0 0!important;min-height:40px;flex:1}.syntax-listen .german:before{content:'Listen before choosing';font:600 18px 'Fraunces'}.syntax-result{display:none;background:var(--ink);color:white;padding:24px;margin-top:16px}.syntax-result.show{display:block}.syntax-result h3{font:600 30px 'Fraunces';margin:5px 0}.syntax-result a{color:var(--lime)}@media(max-width:700px){.syntax-mastery{grid-template-columns:1fr}.syntax-form{flex-direction:column}}
