:root{--bg: #fbfaf6;--fg: #1c1b18;--muted: #6b675e;--card: #ffffff;--line: #e4e0d4;--accent: #166534;--accent-fg: #ffffff;--current-bg: #ffffff;--arabic: #8a5a00;--warn: #b45309;--bad: #b91c1c;color-scheme:light}:root[data-theme=dark]{--bg: #111312;--fg: #ecebe6;--muted: #a19d93;--card: #1a1d1b;--line: #2c302d;--accent: #4ade80;--accent-fg: #0b1a10;--current-bg: #1a1d1b;--arabic: #f2c46d;--warn: #fbbf24;--bad: #f87171;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--fg)}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%}button{font:inherit;cursor:pointer}.app{max-width:720px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}.top{position:sticky;top:0;z-index:2;display:flex;gap:8px;align-items:flex-start;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:var(--bg);border-bottom:1px solid var(--line)}.titles{flex:1;min-width:0}.eyebrow{font-size:12px;color:var(--muted);letter-spacing:.02em}h1{font-size:15px;line-height:1.3;margin:2px 0 0;font-weight:650;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.icon{flex:none;width:40px;height:40px;border-radius:20px;border:1px solid var(--line);background:var(--card);color:var(--fg);font-size:18px}.weeks{margin:8px 16px 0;padding:8px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--fg)}.paras{flex:1;padding:8px 12px 0}.notice{color:var(--muted);padding:24px 8px;text-align:center}.para{padding:10px 12px;margin:4px 0;border-radius:12px;border:1px solid transparent;scroll-margin-top:22vh;transition:opacity .3s;-webkit-tap-highlight-color:transparent}.para p{margin:0}.para .en{font-size:17px;line-height:1.5}.para .ms{font-size:14px;line-height:1.45;color:var(--muted);margin-top:6px}.para.near{opacity:.5}.para.far{opacity:.28}.para.near .en,.para.far .en{font-size:16px}.para.far .ms{display:none}.para.current{background:var(--current-bg);border-color:var(--line);box-shadow:0 2px 14px #00000012;padding:16px}.para.current .en{font-size:21px;line-height:1.45;font-weight:500}.para.current .ms{font-size:15px;margin-top:10px}.para.arabic .en{color:var(--arabic);font-style:italic}.para .refs{font-size:13px;color:var(--arabic);margin-top:4px;font-weight:600}.para .meaning{font-size:15px;line-height:1.5;margin-top:8px}.para.current .meaning{font-size:19px}.para .meaning span{color:var(--muted);font-size:13px}.part{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 8px;padding-top:8px;border-top:1px dashed var(--line)}.tail{height:55vh}.bar{position:sticky;bottom:0;z-index:2;background:var(--bg);border-top:1px solid var(--line);padding:10px 16px calc(12px + env(safe-area-inset-bottom))}.status{display:flex;gap:8px;align-items:center;font-size:14px;min-height:20px}.dot{flex:none;width:10px;height:10px;border-radius:5px;background:var(--muted)}.s-locked .dot{background:var(--accent)}.s-searching .dot,.s-listening .dot,.s-loading .dot{background:var(--warn);animation:pulse 1.2s infinite}.s-lost{color:var(--bad);font-weight:600}.s-lost .dot,.s-error .dot{background:var(--bad)}.s-error{color:var(--bad)}@keyframes pulse{50%{opacity:.3}}.heard{font-size:12px;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;direction:rtl;text-align:left}.buttons{display:flex;gap:8px;margin-top:8px}.main{flex:1;height:48px;border-radius:24px;border:none;background:var(--accent);color:var(--accent-fg);font-size:17px;font-weight:650}.main:disabled{opacity:.5}.main.stop{background:var(--card);color:var(--fg);border:1px solid var(--line)}.demo{height:48px;padding:0 16px;border-radius:24px;border:1px solid var(--line);background:var(--card);color:var(--fg)}@media(min-width:600px){.para.current .en{font-size:26px}h1{font-size:18px}}