.audio-learning{margin-top:32px;padding:28px;border:1px solid var(--line);border-radius:12px;background:var(--surface);scroll-margin-top:25px}.audio-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:25px}.audio-heading h3{font-size:32px;font-weight:500;line-height:1.5;margin:8px 0}.audio-heading p{font-size:12px;line-height:1.9;color:var(--muted);max-width:680px}.audio-tabs{display:flex;padding:4px;border:1px solid var(--line);border-radius:6px;gap:5px;flex-shrink:0}.audio-tabs button{border:0;background:transparent;color:var(--muted);font-size:12px;padding:9px 15px;border-radius:4px;line-height:1.8}.audio-tabs button[aria-selected=true]{background:var(--green);color:var(--surface)}.audio-language-note{font-size:11px;color:var(--muted);line-height:1.9;margin-top:20px;padding:12px 15px;background:var(--bg);border-radius:5px}.audio-workspace{display:grid;grid-template-columns:255px minmax(0,1fr);gap:25px;margin-top:24px}.audio-item-list{max-height:680px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding-inline-end:12px;border-inline-end:1px solid var(--line)}.audio-item-list button{display:flex;align-items:flex-start;gap:11px;border:1px solid transparent;background:transparent;border-radius:6px;color:var(--ink);padding:12px;text-align:start;line-height:1.8}.audio-item-list button:hover{background:var(--bg)}.audio-item-list button.selected{background:var(--soft);border-color:var(--line)}.audio-list-number{height:25px;min-width:25px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;font-size:10px;color:var(--muted);margin-top:3px}.audio-item-list strong{font-size:11px;font-weight:500;display:block;color:var(--muted);margin-bottom:4px}.audio-list-arabic{font-family:'Noto Naskh Arabic',serif;font-size:18px;line-height:1.9;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:right}.audio-unit-heading>span{font-size:10px;color:var(--gold)}.audio-unit-heading h4{font-family:'Noto Naskh Arabic',serif;font-size:27px;line-height:1.5;font-weight:500;margin:6px 0 15px}.audio-arabic{font-family:'Noto Naskh Arabic',serif;font-size:32px;line-height:2.1;text-align:center;padding:20px 22px;border:1px solid var(--line);border-radius:8px;background:var(--bg);white-space:pre-line}.audio-transliteration{padding-block:13px;border-bottom:1px solid var(--line);color:var(--muted)}.audio-transliteration>summary{text-align:start;font-size:11px;color:var(--muted)}.audio-transliteration p{font-size:12px;line-height:1.9;margin-top:10px;text-align:left}.audio-playback{margin-top:20px}.audio-playback audio{width:100%;height:40px}.audio-main-buttons{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}.audio-main-buttons>.button{font-size:12px;padding:9px 18px;border-color:var(--line)}.audio-main-buttons>.plain-button{font-size:11px;margin-inline-start:auto}.audio-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px}.audio-settings label{font-size:10px;color:var(--muted);display:flex;flex-direction:column;gap:7px}.audio-settings select{width:100%;min-width:0;font-size:11px}.audio-status{display:flex;justify-content:space-between;gap:15px;align-items:center;color:var(--green);font-size:11px;padding:14px 0;border-bottom:1px solid var(--line)}.audio-error{font-size:12px;padding:12px;background:var(--soft);border-radius:5px;margin-top:10px;color:var(--ink)}.audio-credit{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;font-size:10px;color:var(--muted);line-height:1.9}.audio-credit a{text-decoration:underline;text-underline-offset:3px}.audio-panel>.local-note{font-size:9px;line-height:1.9;margin-top:10px}.audio-meaning{border:1px solid var(--line);border-radius:8px;padding:18px;margin-top:22px}.audio-meaning-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.audio-meaning-heading h5{font-size:12px;font-weight:500;margin:0}.audio-meaning-heading select{font-size:11px;max-width:170px;min-width:0;min-height:35px;padding-block:5px}#audio-meaning-text{font-size:14px;line-height:1.95;margin-top:16px;white-space:pre-line;overflow-wrap:anywhere}.audio-meaning .local-note{font-size:10px;line-height:1.8}#audio-meaning-notes-box{margin-top:16px}#audio-meaning-notes-box>summary{font-size:10px;text-align:start;color:var(--muted)}#audio-meaning-notes{font-size:11px;line-height:1.9;margin-top:12px;white-space:pre-line;overflow-wrap:anywhere}.audio-meaning-credit{font-size:9px;color:var(--muted);line-height:1.8;margin-top:18px;border-top:1px solid var(--line);padding-top:12px}.audio-meaning-credit a{text-decoration:underline;text-underline-offset:3px}.audio-meaning-credit p{margin-top:5px;overflow-wrap:anywhere}.audio-pagination{display:flex;justify-content:space-between;gap:12px;margin-top:18px}.audio-pagination .button{font-size:11px;padding:8px 16px;border-color:var(--line)}.audio-pagination .button:disabled{opacity:.4;cursor:default;transform:none}.guide-audio-practice{display:inline-flex;margin-top:15px;background:var(--soft);color:var(--green);border:1px solid var(--line);border-radius:5px;padding:8px 12px;font:inherit;font-size:11px;cursor:pointer}.guide-video-credits{font-size:10px;color:var(--muted);line-height:1.9;margin-top:5px}.guide-subtitle-choice{display:flex;flex-direction:column;gap:8px;font-size:11px;width:100%}.dark .audio-tabs button[aria-selected=true]{color:#15251f}html[dir=ltr] .audio-heading h3{font-family:Georgia,serif;font-size:28px;line-height:1.4}html[dir=ltr] .audio-unit-heading h4{font-family:Georgia,serif;font-size:24px;line-height:1.4}html[lang=zh] .audio-unit-heading h4,html[lang=bn] .audio-unit-heading h4,html[lang=hi] .audio-unit-heading h4{font-family:system-ui,sans-serif}
@media(max-width:1050px){.audio-workspace{grid-template-columns:205px minmax(0,1fr);gap:20px}.audio-learning{padding:23px}.audio-heading{flex-wrap:wrap}.audio-tabs{width:100%;justify-content:center}.audio-tabs button{flex:1}}
@media(max-width:760px){.audio-workspace{grid-template-columns:1fr;gap:20px}.audio-item-list{max-height:210px;display:grid;grid-template-columns:1fr 1fr;border-inline-end:0;border-bottom:1px solid var(--line);padding-inline-end:0;padding-bottom:15px;gap:8px}.audio-item-list button{padding:10px}.audio-item-list strong{font-size:10px}.audio-list-arabic{font-size:18px}.audio-arabic{font-size:29px}.audio-settings select{font-size:10px}.audio-heading h3{font-size:29px}.audio-main-buttons>.plain-button{font-size:10px}.guide-subtitle-choice{grid-column:1/-1}}
@media(max-width:480px){.audio-learning{padding:18px 14px;margin-top:25px}.audio-heading h3{font-size:28px}.audio-heading p{font-size:12px}.audio-tabs{gap:4px}.audio-tabs button{padding:9px 10px;font-size:12px}.audio-language-note{font-size:10px;padding:11px 12px}.audio-item-list{grid-template-columns:1fr;max-height:190px}.audio-list-arabic{-webkit-line-clamp:1;font-size:19px}.audio-item-list button{gap:10px}.audio-item-list strong{font-size:10px}.audio-unit-heading h4{font-size:27px}.audio-arabic{font-size:28px;padding:17px 14px;line-height:2.1}.audio-main-buttons>.button{font-size:12px;padding:9px 15px}.audio-main-buttons>.plain-button{margin-inline-start:0;flex-basis:100%;justify-content:flex-start;padding-top:5px}.audio-settings{gap:8px}.audio-settings label{font-size:9px}.audio-settings select{font-size:10px;padding-inline-start:9px;padding-inline-end:22px;background-position:left 6px center;background-size:16px}.audio-status{font-size:10px}.audio-credit{font-size:9px}.audio-meaning{padding:15px}.audio-meaning-heading{gap:10px}.audio-meaning-heading select{max-width:140px;font-size:10px}#audio-meaning-text{font-size:14px;line-height:1.95}.audio-meaning-credit{font-size:9px}.audio-pagination .button{font-size:11px}.guide-audio-practice{font-size:11px}html[dir=ltr] .audio-heading h3{font-size:25px}html[dir=ltr] .audio-unit-heading h4{font-size:23px}}
.audio-time{display:flex;gap:15px;align-items:center;direction:ltr}.audio-time progress{flex:1;min-width:0;height:6px;border:0;border-radius:4px;accent-color:var(--green)}.audio-time progress::-webkit-progress-bar{background:var(--line);border-radius:4px}.audio-time progress::-webkit-progress-value{background:var(--green);border-radius:4px}.audio-time>span{font-size:10px;color:var(--muted);white-space:nowrap;min-width:85px;text-align:end}
