.runner{padding:var(--space-3)}@media (width>=640px){.runner{padding:var(--space-4)}}.runner-top{justify-content:space-between;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-1);display:flex}.runner-count{text-transform:uppercase;letter-spacing:.14em;color:var(--accent-dark);font-size:.75rem;font-weight:500}.small{font-size:.85rem}.progress-bar{background:var(--accent-soft);height:4px;margin-bottom:var(--space-3);border-radius:999px;overflow:hidden}.progress-fill{background:var(--accent-dark);height:100%;transition:width .3s}.runner-item{min-height:8rem}.runner-nav{margin-top:var(--space-3);justify-content:flex-end;align-items:center;min-height:2.9rem;display:flex}.item{gap:var(--space-2);flex-direction:column;display:flex}.prompt{margin:0;font-size:1.35rem;font-weight:400;line-height:1.5}.prompt-sentence{line-height:2.2}.hint{color:var(--muted);margin:0;font-size:.9rem}.notice{background:var(--warn-soft);color:var(--text);border-radius:var(--radius);padding:var(--space-2) var(--space-3)}.notice p{margin-bottom:var(--space-2)}.options{grid-template-columns:1fr;gap:.6rem;display:grid}@media (width>=560px){.options{grid-template-columns:repeat(2,1fr)}}.option{text-align:left;width:100%;font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;border-radius:12px;align-items:center;gap:.8rem;padding:.8rem 1rem;font-size:1.05rem;transition:border-color .15s,background .15s,transform .1s;display:flex}.option:hover:not(:disabled){border-color:var(--accent-dark);background:var(--bg)}.option:disabled{cursor:default}.option-key{background:var(--accent-soft);width:1.7rem;height:1.7rem;color:var(--accent-dark);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.75rem;font-weight:500;display:inline-flex}.option.is-correct{border-color:var(--ok);background:var(--ok-soft)}.option.is-correct .option-key{background:var(--ok);color:#fff}.option.is-wrong{border-color:var(--bad);background:var(--bad-soft)}.option.is-wrong .option-key{background:var(--bad);color:#fff}.option.is-dim{opacity:.55}.answer-field,.gap{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:.6rem .8rem;transition:border-color .15s}.answer-field{resize:vertical;width:100%;margin-bottom:var(--space-2);font-size:1.1rem}.answer-field:focus,.gap:focus{border-color:var(--accent-dark);outline:none}.answer-field:disabled,.gap:disabled{color:var(--text);opacity:1}.gap{border-bottom-width:2px;border-bottom-color:var(--accent);text-align:center;border-radius:8px 8px 0 0;width:auto;margin:0 .25rem;padding:.25rem .6rem;font-size:1.15rem;display:inline-block}.gap-hint{color:var(--muted);white-space:nowrap;margin-right:.3rem;font-size:.85rem;display:inline-block}.gap-correct,.field-correct{background:var(--ok-soft);border-color:var(--ok)!important}.gap-almost,.field-almost{background:var(--warn-soft);border-color:var(--warn)!important}.gap-wrong,.field-wrong{background:var(--bad-soft);border-color:var(--bad)!important}.match-grid{gap:.6rem var(--space-2);grid-template-columns:1fr 1fr;display:grid}.match-col{flex-direction:column;gap:.6rem;display:flex}.match-btn{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;text-align:center;border-radius:12px;padding:.7rem .9rem;font-size:1rem;transition:border-color .15s,background .15s,opacity .3s}.match-btn:hover:not(:disabled){border-color:var(--accent-dark)}.match-btn.is-selected{border-color:var(--accent-dark);background:var(--accent-soft)}.match-btn.is-locked{border-color:var(--ok);background:var(--ok-soft);color:var(--ok);cursor:default}.match-btn.is-flash{border-color:var(--bad);background:var(--bad-soft);animation:.3s shake}@keyframes shake{25%{transform:translate(-3px)}75%{transform:translate(3px)}}.listen-controls{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.btn.is-speaking{background:var(--accent);border-color:var(--accent)}.prompt-tts{font-size:1.2rem}.feedback{border-radius:var(--radius);padding:var(--space-2) var(--space-3);border-left:4px solid var(--accent);background:var(--bg)}.feedback-title{margin-bottom:.25rem;font-weight:500;display:block}.feedback p,.feedback ul{margin:.2rem 0 0}.feedback-list{padding-left:1.1rem}.feedback-text{color:var(--muted)}.feedback-correct{border-left-color:var(--ok);background:var(--ok-soft)}.feedback-correct .feedback-title{color:var(--ok)}.feedback-almost,.feedback-partial{border-left-color:var(--warn);background:var(--warn-soft)}.feedback-almost .feedback-title,.feedback-partial .feedback-title{color:var(--warn)}.feedback-wrong{border-left-color:var(--bad);background:var(--bad-soft)}.feedback-wrong .feedback-title{color:var(--bad)}.result{text-align:center;padding-block:var(--space-2)}.result-score{flex-direction:column;align-items:center;gap:.25rem;display:flex}.result-big{color:var(--accent-dark);font-size:clamp(3rem,10vw,5rem);font-weight:300;line-height:1}.result-message{margin:var(--space-2) auto;max-width:40ch;font-size:1.2rem}.result-items{margin:var(--space-2) 0;flex-wrap:wrap;justify-content:center;gap:.4rem;padding:0;list-style:none;display:flex}.dot{color:#fff;background:var(--bad);border-radius:50%;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:.8rem;font-weight:500;display:inline-flex}.dot-correct{background:var(--ok)}.dot-almost,.dot-partial{background:var(--warn)}.result-actions{margin-top:var(--space-3);justify-content:center}