/* English Secrets · OET Listening practice (/oet-listening/). Loaded after oetw.css and oetr.css. */
.lplay{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:12px 0 16px;padding:14px;border-radius:14px;background:var(--bg);border:1.5px solid var(--line)}
.lplay .btn{margin-top:0}
.lbar{flex:1 1 200px;height:8px;border-radius:8px;background:var(--line);overflow:hidden}
.lbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#14b8a6,#2563eb);transition:width .25s linear}
.lst{flex-basis:100%;font-size:14.5px;color:var(--mute);font-weight:600}
.lnotes{border:1.5px solid var(--line);border-radius:14px;padding:14px 18px;background:var(--bg);font-size:15.5px;line-height:1.7}
.lnotes .nt-h{font-weight:700;margin:0 0 6px}
.lnotes h4{margin:12px 0 2px;font-size:14.5px;color:#0f766e}
.lnotes ul{margin:0;padding-left:20px}
.gp{display:inline-flex;align-items:center;gap:6px;margin:2px 4px;vertical-align:middle}
.gp b{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:7px;background:rgba(15,157,138,.14);color:#0f766e;font-size:12.5px}
.gp input.ans{width:170px;padding:5px 9px;font-size:15px}
.bitem{border-top:2px solid var(--line);padding:10px 0;transition:opacity .2s}
.bitem.later{opacity:.45}
.bitem.now{border-left:4px solid #2563eb;padding-left:10px}
.tscript{max-height:340px;overflow:auto;margin:10px 0 16px;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg);font-size:14.5px;line-height:1.6}
.tscript p{margin:0 0 6px}
.card audio{width:100%;margin-top:6px}
@media(max-width:560px){.gp input.ans{width:130px}.lnotes{padding:12px}}
.lmode{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0 0}
.lmode label{cursor:pointer}
.lmode input{position:absolute;opacity:0}
.lmode span{display:flex;flex-direction:column;gap:2px;padding:10px 14px;border:1.5px solid var(--line);border-radius:12px}
.lmode small{color:var(--mute);font-size:13px}
.lmode input:checked+span{border-color:#14b8a6;background:rgba(15,157,138,.1)}
.lmode input:focus-visible+span{outline:2px solid var(--blue)}
.lmode input:disabled+span{opacity:.7;cursor:default}
.lctl{display:inline-flex;gap:8px;flex-wrap:wrap}
.lctl[hidden]{display:none}
.lc{all:unset;box-sizing:border-box;cursor:pointer;padding:10px 14px;border-radius:12px;border:1.5px solid var(--line);font-weight:800;font-size:15px;color:var(--ink);background:var(--card)}
.lc.main{background:linear-gradient(135deg,#14b8a6,#0f9d8a);color:#fff;border-color:transparent;min-width:110px;text-align:center}
.lc:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media(max-width:560px){.lmode{grid-template-columns:1fr}.lc{padding:12px 14px}}
.lplay .btn[hidden]{display:none}