/* WordTacos idiom course: inherit the main app's palette and typography. */
#screen-idioms { overflow-y:auto; padding-bottom:24px; gap:14px; }
#screen-idioms .topbar { flex-shrink:0; }
.idiom-entry { width:100%; text-align:left; font:inherit; border:2px solid var(--green); }
.idiom-entry .name { color:var(--green); }
.idiom-panel { background:var(--paper); border:1px solid var(--border); border-radius:16px; padding:18px; margin-bottom:14px; box-shadow:var(--shadow); }
.idiom-panel h2 { font-size:1.3rem; line-height:1.4; margin-bottom:8px; }
.idiom-panel h3 { font-size:1rem; margin:14px 0 6px; }
.idiom-note { font-size:.83rem; color:var(--sub); line-height:1.7; }
.idiom-tag { color:var(--green); font-size:.75rem; font-weight:800; letter-spacing:.06em; }
.idiom-actions { display:flex; gap:8px; flex-wrap:wrap; margin:12px 0; }
.idiom-actions button { flex:1 1 130px; padding:11px; }
#screen-idioms button, #screen-idioms input, #screen-idioms select { font:inherit; }
#screen-idioms button { cursor:pointer; }
#screen-idioms button:focus-visible, #screen-idioms input:focus-visible, #screen-idioms select:focus-visible { outline:3px solid var(--green); outline-offset:3px; }
#screen-idioms button:disabled { cursor:default; opacity:.65; }
.idiom-fields { display:grid; gap:10px; margin-top:16px; }
.idiom-fields label { display:grid; gap:5px; font-size:.85rem; font-weight:700; }
.idiom-fields input, .idiom-fields select { width:100%; min-width:0; padding:12px; border:1px solid var(--border); border-radius:10px; background:white; color:var(--ink); font-size:16px!important; }
.idiom-facet { border-top:1px solid var(--border); margin-top:14px; }
.idiom-phrase { padding:12px 0; border-top:1px dashed var(--border); }
.idiom-phrase summary { cursor:pointer; padding:4px 0; }
.idiom-phrase summary strong { color:var(--accent); }
.idiom-phrase summary span { display:block; font-size:.88rem; margin-left:17px; }
.idiom-phrase p { margin:8px 0; font-size:.9rem; }
.idiom-sentence { font-size:1.15rem; line-height:2; padding:18px 0; }
.idiom-choices { display:grid; gap:9px; }
.idiom-choice { display:block; width:100%; text-align:left; padding:13px; border:1px solid var(--border); border-radius:12px; background:white; color:var(--ink); }
.idiom-choice.correct { background:var(--green-soft); border:2px solid var(--green); }
.idiom-choice.wrong { background:var(--red-soft); border:2px solid var(--red); }
.idiom-feedback { margin-top:18px; border-top:3px solid var(--green); padding-top:14px; }
.idiom-feedback p { margin:8px 0; }
.idiom-english { background:var(--bg); border-radius:10px; padding:12px; overflow-wrap:anywhere; }
.idiom-meter { width:100%; height:8px; accent-color:var(--green); }
#idiom-audio-status { font-size:.8rem; color:var(--sub); }
#idiom-content:focus { outline:none; }
#idiom-reference-link[hidden] { display:none; }
#idiom-legacy-link[hidden] { display:none; }
.ao-card .back { background:var(--paper); border:1px solid var(--border); color:var(--ink); border-radius:9px; padding:8px 12px; min-height:36px; cursor:pointer; font:inherit; font-size:.8rem; margin-top:6px; }
.ao-explanation p { margin:4px 0 8px; }
.idiom-empty { padding:25px 12px; text-align:center; }