.vocab-match{margin-top:2rem;padding:clamp(1.1rem,3vw,2rem);border:1px solid #cfe2e4;border-radius:24px;background:linear-gradient(135deg,#f2faf8,#f8f6ff);color:#23404b}
.vocab-match-intro{display:flex;justify-content:space-between;align-items:start;gap:1rem}.vocab-match-intro h3{margin:.35rem 0;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.04em}.vocab-match-intro p{margin:.2rem 0;color:#58717a;line-height:1.5}.vocab-match-score{flex:none;padding:.7rem 1rem;border-radius:999px;background:#dcedea;color:#176d64;font-weight:800;font-size:.8rem}
.vocab-match-controls{display:flex;align-items:end;gap:.7rem;flex-wrap:wrap;margin:1.4rem 0 .8rem}.vocab-match-controls label{display:grid;gap:.3rem;color:#46616c;font-size:.73rem;font-weight:800}.vocab-match-controls select,.vocab-match-controls button{min-height:46px;padding:.55rem .75rem;border:1px solid #bcd5d8;border-radius:12px;background:#fff;color:#23404b;font:700 .82rem/1.2 Helvetica,Arial,sans-serif}.vocab-match-controls select{max-width:min(100%,360px)}.vocab-match-controls button{background:#277b70;color:#fff;cursor:pointer}.vocab-match-status{min-height:1.7em;margin:.7rem 0;font-weight:700;color:#315f78}
.vocab-match-board{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(.5rem,2vw,1.2rem)}.vocab-match-column{display:grid;gap:.6rem}.vocab-match-choice{min-height:74px;width:100%;padding:.8rem 1rem;border:2px solid #c9dce0;border-radius:15px;background:#fff;color:#23404b;text-align:left;font:700 .86rem/1.35 Helvetica,Arial,sans-serif;cursor:pointer;transition:transform .16s,border-color .16s,background .16s}.vocab-match-choice:hover:not(:disabled){transform:translateY(-2px);border-color:#277b70}.vocab-match-choice:focus-visible{outline:3px solid #745fbb;outline-offset:2px}.vocab-match-choice.selected{border-color:#277b70;background:#dff3ee}.vocab-match-choice.matched{border-color:#68ae87;background:#e8f7eb;color:#43705a;cursor:default}.vocab-match-choice.matched::before{content:'✓ ';font-weight:900}.vocab-match-choice.incorrect{border-color:#cf6c68;background:#fff1ee}.vocab-match-choice.definition{font-weight:600}
@media(max-width:700px){.vocab-match-intro{flex-direction:column}.vocab-match-controls label{width:100%}.vocab-match-controls select,.vocab-match-controls button{width:100%;max-width:none}.vocab-match-board{grid-template-columns:1fr 1.3fr}.vocab-match-choice{min-height:95px;padding:.6rem;font-size:.7rem}}