:root{--scale: 1;--bg: #0b1220;--panel: #121c30;--panel2: #18243d;--text: #eef2f8;--muted: #9aa8c0;--gold: #e8c76a;--green: #4cd7a0;--red: #ff6b6b;--border: #26334f;color-scheme:dark}@media (prefers-color-scheme: light){:root:not([data-theme=dark]){--bg: #f6f7fb;--panel: #ffffff;--panel2: #eef1f7;--text: #121a2c;--muted: #5b6780;--gold: #9a7a1f;--border: #d9dfec;color-scheme:light}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:calc(18px * var(--scale));line-height:1.45;-webkit-text-size-adjust:100%}button,input,select{font:inherit}button{background:var(--panel2);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:10px 14px;cursor:pointer}button.primary{background:var(--gold);color:#0b1220;border-color:transparent;font-weight:700;width:100%;padding:14px;margin-top:8px}button.stop{background:var(--red);color:#fff;border-color:transparent}input,select{width:100%;background:var(--panel2);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px;margin-top:6px}label{display:block;margin:12px 0;color:var(--muted);font-size:.9em}label.check{display:flex;gap:10px;align-items:flex-start}label.check input{width:auto;margin-top:4px}label.check span{color:var(--text);font-size:.95em}.small{font-size:.8em;color:var(--muted)}.notice{background:var(--panel2);border-left:4px solid var(--gold);padding:10px 12px;border-radius:8px;margin:12px 16px}.start{max-width:560px;margin:0 auto;padding:24px 16px 40px}.start h1{font-size:2em;margin:8px 0 4px}.start h1 span{color:var(--gold)}.start .lead{color:var(--muted);margin-top:0}.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px;margin:16px 0}.card h2{font-size:1.05em;margin:0 0 8px}.start footer{margin-top:24px}.live{display:flex;flex-direction:column;height:100%}.live header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));background:var(--panel);border-bottom:1px solid var(--border);font-size:.85em}.live .status{display:flex;align-items:center;gap:10px}.live .tools{display:flex;gap:6px}.live .tools button{padding:6px 10px}.dot{width:10px;height:10px;border-radius:50%;background:var(--muted);display:inline-block}.dot.live,.dot.listening{background:var(--green);box-shadow:0 0 0 4px #4cd7a033}.dot.reconnecting,.dot.connecting{background:var(--gold)}button.room{padding:4px 10px;font-weight:600;letter-spacing:.05em}.feed{flex:1;overflow-y:auto;padding:16px 16px 120px;scroll-behavior:smooth}.empty{color:var(--muted);text-align:center;margin-top:30vh}.seg{padding:12px 0;border-bottom:1px solid var(--border)}.seg .nl{font-size:1.15em;margin:6px 0}.seg.streaming .nl{color:var(--muted)}.seg.final .nl{color:var(--text)}.pending{color:var(--muted);font-style:italic}.ar{font-family:Noto Naskh Arabic,Amiri,Scheherazade New,serif}.seg .ar.small{color:var(--muted);font-size:.85em;margin:4px 0 0}.partial{color:var(--muted);font-style:italic;opacity:.6;padding:4px 0;font-size:.85em}.livebar{position:sticky;bottom:0;background:var(--panel);border-top:2px solid var(--gold);padding:10px 16px;padding-bottom:max(10px,env(safe-area-inset-bottom));box-shadow:0 -8px 24px #00000040}.livebar .label{color:var(--gold);font-size:.7em;text-transform:uppercase;letter-spacing:.12em;font-weight:700}.livebar .preview{color:var(--text);font-size:1.15em;margin:4px 0 0;min-height:1.4em}.livebar .partial{margin:2px 0 0}.feed{padding-bottom:24px}.live{overflow:hidden}.jump{bottom:auto;top:70px}.preview .cursor{display:inline-block;width:2px;height:1em;background:var(--gold);margin-left:4px;vertical-align:text-bottom;animation:blink 1s steps(2) infinite}@keyframes blink{to{opacity:0}}.verse{background:var(--panel);border:1px solid var(--gold);border-radius:14px;padding:12px 14px;margin:8px 0}.verse .ref{color:var(--gold);font-weight:700;font-size:.85em;margin-bottom:6px}.verse .ar{font-size:1.35em;line-height:1.9}.verse .nl{margin-top:8px;font-size:1.05em}.verse .src{color:var(--muted);font-size:.75em;margin-top:6px}.jump{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);background:var(--gold);color:#0b1220;font-weight:700;border:none;box-shadow:0 6px 20px #00000059}.qr{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:10;padding:16px;text-align:center}.qr canvas{background:#fff;padding:12px;border-radius:12px}.qr p{word-break:break-all;color:#fff;margin:0}