@kangsicj/nexussync 1.0.1 → 1.1.0

package/README.md

@@ -4,7 +4,7 @@
 
 <br>
 
-[![Version](https://img.shields.io/badge/version-1.0.1-7C4DFF?style=for-the-badge)](./CHANGELOG.md)
+[![Version](https://img.shields.io/badge/version-1.1.0-7C4DFF?style=for-the-badge)](./CHANGELOG.md)
 [![Tampermonkey](https://img.shields.io/badge/Tampermonkey-PC%20%C2%B7%20Android-00485B?style=for-the-badge&logo=tampermonkey&logoColor=white)](https://www.tampermonkey.net/)
 [![iOS Safari](https://img.shields.io/badge/Userscripts-iPhone%20%C2%B7%20iPad-0A84FF?style=for-the-badge&logo=safari&logoColor=white)](https://apps.apple.com/app/userscripts/id1463298887)
 [![Sponsor](https://img.shields.io/badge/Fairy-Sponsor-FF6FB5?style=for-the-badge&logo=githubsponsors&logoColor=white)](https://fairy.hada.io/@jinny)
@@ -69,7 +69,8 @@ No subtitles on that video? Turn on live speech recognition with translation int
 
 ## ✨ Little things that matter
 
-- **Next episode, together** — move on to the next episode and you stay in the room; friends follow with one tap.
+- **Next episode, together** — move on to the next episode and you stay in the room; friends follow with one tap. Near the end, an *Up next* card counts down and opens it for you.
+- **Cinema by itself** — open a page with one movie or episode and it switches to cinema as soon as the video is ready, keeping the site's player so you can still pick subtitles or a server. Turn it off per site.
 - **Make it yours** — pick your name and colour; your bubbles and doodles wear it on every screen.
 - **Calm, never jumpy** — phones going to sleep, slow Wi-Fi or a player restarting on its own never pause the whole room.
 - **No accidental pauses** — tapping the chat, a doodle or a reaction never nudges the video for anyone.

package/dist/NexusSync.meta.js

@@ -9,7 +9,7 @@
 // @icon         https://cdn.jsdelivr.net/npm/@kangsicj/nexussync@latest/assets/icon.svg
 // @updateURL    https://cdn.jsdelivr.net/npm/@kangsicj/nexussync@latest/dist/NexusSync.meta.js
 // @downloadURL  https://cdn.jsdelivr.net/npm/@kangsicj/nexussync@latest/dist/NexusSync.user.js
-// @version      1.0.1
+// @version      1.1.0
 // @description  Watch any web video together in perfect sync: cinema mode, live AI subtitles & translation, chat bubbles with auto-translation, quick ink, cover, go-together to the next episode.
 // @description:ko  어떤 웹 영상이든 완벽한 싱크로 함께 보기: 시네마 모드, 실시간 AI 자막·번역, 자동 번역 말풍선 채팅, 잠깐 그리기, 가리기, 다음 화도 함께.
 // @match        *://*/*

package/dist/NexusSync.user.js

@@ -9,7 +9,7 @@
 // @icon         https://cdn.jsdelivr.net/npm/@kangsicj/nexussync@latest/assets/icon.svg
 // @updateURL    https://cdn.jsdelivr.net/npm/@kangsicj/nexussync@latest/dist/NexusSync.meta.js
 // @downloadURL  https://cdn.jsdelivr.net/npm/@kangsicj/nexussync@latest/dist/NexusSync.user.js
-// @version      1.0.1
+// @version      1.1.0
 // @description  Watch any web video together in perfect sync: cinema mode, live AI subtitles & translation, chat bubbles with auto-translation, quick ink, cover, go-together to the next episode.
 // @description:ko  어떤 웹 영상이든 완벽한 싱크로 함께 보기: 시네마 모드, 실시간 AI 자막·번역, 자동 번역 말풍선 채팅, 잠깐 그리기, 가리기, 다음 화도 함께.
 // @match        *://*/*
@@ -40,12 +40,12 @@
 
     // The version of the code that is actually running (the manager's metadata can lag
     // behind when an old copy is still installed).
-    const NXU_VERSION = '1.0.1';
+    const NXU_VERSION = '1.1.0';
     // Rank used by the one-instance guard below and to tell newer builds apart in a room.
     // It is independent of the public version (1.0.0 is the first public release, after
     // private builds that reached ranks up to 10.2.0), so every older copy still installed
     // steps aside instead of this release.
-    const NXU_RANK = '11.0.1';
+    const NXU_RANK = '11.1.0';
     const NXU_SESSION = Math.random().toString(36).slice(2, 10);   // this page load   // raise with every release
     // App icon (same artwork as assets/icon.svg / @icon), inlined so it shows offline too.
     const NXU_ICON = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTYgMjU2IiByb2xlPSJpbWciIGFyaWEtbGFiZWw9Ik5leHVzU3luYyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJueGJnIiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNWIyZWZmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmY0ZmEzIi8+PC9saW5lYXJHcmFkaWVudD48cmFkaWFsR3JhZGllbnQgaWQ9Im54Z2xvdyIgY3g9IjAuODIiIGN5PSIwLjE0IiByPSIwLjciPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzdjZjlmZiIgc3RvcC1vcGFjaXR5PSIwLjU1Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjN2NmOWZmIiBzdG9wLW9wYWNpdHk9IjAiLz48L3JhZGlhbEdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0ibnhwbGF5IiB4MT0iMCIgeTE9IjAiIHgyPSIxIiB5Mj0iMSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZlM2YxIi8+PC9saW5lYXJHcmFkaWVudD48Y2xpcFBhdGggaWQ9Im54ciI+PHJlY3Qgd2lkdGg9IjI1NiIgaGVpZ2h0PSIyNTYiIHJ4PSI1OCIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNueHIpIj48cmVjdCB3aWR0aD0iMjU2IiBoZWlnaHQ9IjI1NiIgZmlsbD0idXJsKCNueGJnKSIvPjxyZWN0IHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiBmaWxsPSJ1cmwoI254Z2xvdykiLz48ZyBmaWxsPSJub25lIiBzdHJva2U9IiNmZmZmZmYiIHN0cm9rZS13aWR0aD0iMTUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCI+PHBhdGggZD0iTTYwIDExNiBBNzAgNzAgMCAwIDEgMTc4IDcyIi8+PHBhdGggZD0iTTE5NiAxNDAgQTcwIDcwIDAgMCAxIDc4IDE4NCIvPjwvZz48cGF0aCBkPSJNMTg2IDUwIEwyMDAgOTIgTDE1NyA4NiBaIiBmaWxsPSIjZmZmZmZmIi8+PHBhdGggZD0iTTcwIDIwNiBMNTYgMTY0IEw5OSAxNzAgWiIgZmlsbD0iI2ZmZmZmZiIvPjxwYXRoIGQ9Ik0xMTAgOTIgUTEwNCA4OCAxMDQgOTYgTDEwNCAxNjAgUTEwNCAxNjggMTEwIDE2NCBMMTYyIDEzMiBRMTY4IDEyOCAxNjIgMTI0IFoiIGZpbGw9InVybCgjbnhwbGF5KSIvPjwvZz48L3N2Zz4=';
@@ -171,7 +171,7 @@
         'nxu_idle_timeout', 'nxu_sub_size', 'nxu_sub_opacity', 'nxu_sub_position', 'nxu_speaker_language',
         'nxu_subtitle_language', 'nxu_audio_mode', 'nxu_translation_provider', 'nxu_stt_local_first',
         'nxu_smart_speech_locale', 'nxu_fab_pos', 'nxu_asr_provider', 'nxu_key_openai', 'nxu_key_anthropic', 'nxu_key_groq', 'nxu_key_deepl',
-        'nxu_model_openai', 'nxu_model_anthropic', 'nxu_cinema_ambient', 'nxu_cinema_fit', 'nxu_cc_remaining', 'nxu_cinema_controls', 'nxu_nickname', 'nxu_color', 'nxu_quick_replies', 'nxu_chat_translate', 'nxu_sync_offset', 'nxu_cover_band', 'nxu_cover_marks', 'nxu_travel', 'nxu_glossary', 'nxu_panel_size_chat-panel', 'nxu_panel_size_sub-log-panel', 'nxu_panel_size_debug-panel', 'nxu_panel_size_trans-modal', 'nxu_cinema_rotate', 'nxu_rotate_denied_' + HOST
+        'nxu_model_openai', 'nxu_model_anthropic', 'nxu_cinema_ambient', 'nxu_cinema_fit', 'nxu_cc_remaining', 'nxu_cinema_controls', 'nxu_nickname', 'nxu_color', 'nxu_quick_replies', 'nxu_chat_translate', 'nxu_sync_offset', 'nxu_cover_band', 'nxu_cover_marks', 'nxu_travel', 'nxu_auto_next', 'nxu_auto_cinema_sites', 'nxu_glossary', 'nxu_panel_size_chat-panel', 'nxu_panel_size_sub-log-panel', 'nxu_panel_size_debug-panel', 'nxu_panel_size_trans-modal', 'nxu_cinema_rotate', 'nxu_rotate_denied_' + HOST
     ]);
 
     // ───────────────────────── Cross-origin HTTP (GM xhr first, fetch fallback)
@@ -240,7 +240,7 @@
         hardSyncTolerance: 2.5,
         softSyncTolerance: 0.25,
         syncHeartbeatMs: 3000,
-        emojis: ['❤️', '😂', '😭', '😡', '🫣', '🌰', '🚽'],
+        emojis: ['😂', '😭', '😡', '💦', '🍪', '☕', '😘', '🖕'],
         chunkSize: 2000,
         relayBatchInterval: 250,
         relayBatchIntervalTight: 80,
@@ -382,7 +382,8 @@
         videoHookController: null,
         hostHeartbeatTimer: null,
         _presenceTimer: null,
-        _videoSequence: 0,
+        // Rises across page loads too (a reloaded page keeps its identity when it rejoins).
+        _videoSequence: Date.now() - 1700000000000,
         _lastVideoSeqBySource: new Map(),
         _processedVideoEvents: new Map(),
         _acceptedVideoState: null,
@@ -621,8 +622,8 @@
             travelBack: 'Back in the room', travelMoved: 'Moved to “{title}” · tap to go together', travelGoing: 'Going together…',
             chatTrOn: 'Auto-translate: on', chatTrOff: 'Auto-translate: off', chatTrShowOrig: 'Tap to see the original', chatTrShowTr: 'Tap to see the translation', chatTrFrom: 'Translated from {lang}',
             inkClosing: 'Closing soon — move or tap to keep drawing',
-            talkMenu: 'Chat', inkMenu: 'Quick sketch', quickEdit: 'Edit quick replies', quickEditHint: 'Separate with |', quickReset: 'Back to the default replies', save: 'Save',
-            talkTitle: 'Chat bubble', talkPlaceholder: 'Say something…', talkReplyTo: '↩ Reply to {name}', talkClose: 'Close', talkSend: 'Send', talkFull: 'Open the full chat',
+            modeSitePlayer: 'Site player in use', modeNexusPlayer: 'NexusSync player in use', modeSiteHint: 'Change subtitles or the server in the site’s player, then switch.', modeSiteHintAuto: 'Cinema started by itself. Pick subtitles or a server in the site’s player first if needed, then switch.', modeNexusHint: 'Everything is controlled by NexusSync. The site’s own settings are one tap away.', modeUseNexus: 'Use NexusSync player', modeUseSite: 'Use site player', autoCinemaStopSite: 'No auto-cinema on this site', autoCinemaOnSite: 'Auto-cinema on for {site}', autoCinemaOffSite: 'Auto-cinema off for {site}', autoCinemaBtnOn: 'Auto-cinema: on (this site)', autoCinemaBtnOff: 'Auto-cinema: off (this site)', ccPip: 'Picture-in-Picture (keep watching in a small window)', nextEpTitle: 'Up next', nextEpGo: 'Next episode', nextEpCancel: 'Stay on this episode', nextEpGoing: 'Next episode…', talkMenu: 'Chat', inkMenu: 'Quick sketch', quickEdit: 'Edit quick replies', quickEditHint: 'Separate with |', quickReset: 'Back to the default replies', save: 'Save',
+            talkTitle: 'Chat bubble', talkPlaceholder: 'Say something…', talkReplyTo: '↩ Reply to {name}', talkClose: 'Close', talkSend: 'Send', talkFull: 'Open the chat history (every message so far)', talkHistory: 'History',
             inkTitle: 'Quick sketch (fades away)', inkHint: 'Draw on the screen — it fades in a few seconds', inkDone: 'Done', inkBubble: 'is sketching on the screen — tap to draw back',
             you: 'You', roomBuffering: '⏳ {name} is loading… everyone waits', roomResume: '▶️ Everyone is ready — playing together', roomRate: '⏩ Speed {rate}x synced',
             youBuffering: '⏳ Your video is loading — the room waits for you', shieldResumeTitle: 'Tap to rejoin playback', shieldResumeText: 'The browser paused this video. Tap once to continue in sync with the room.',
@@ -704,8 +705,8 @@
             travelBack: '방에 다시 연결했어요', travelMoved: '「{title}」(으)로 이동했어요 · 눌러서 같이 가기', travelGoing: '같이 이동하는 중…',
             chatTrOn: '자동 번역 켜짐', chatTrOff: '자동 번역 꺼짐', chatTrShowOrig: '눌러서 원문 보기', chatTrShowTr: '눌러서 번역 보기', chatTrFrom: '{lang}에서 번역됨',
             inkClosing: '곧 닫혀요 — 계속 그리려면 움직이거나 눌러 주세요',
-            talkMenu: '말풍선 채팅', inkMenu: '잠깐 그리기', quickEdit: '빠른 답장 편집', quickEditHint: '| 로 구분', quickReset: '기본 답장으로', save: '저장',
-            talkTitle: '말풍선 채팅', talkPlaceholder: '메시지 보내기…', talkReplyTo: '↩ {name} 님에게 답장', talkClose: '닫기', talkSend: '보내기', talkFull: '전체 채팅창 열기',
+            modeSitePlayer: '사이트 플레이어 사용 중', modeNexusPlayer: 'NexusSync 플레이어 사용 중', modeSiteHint: '자막이나 서버는 사이트 플레이어에서 바꾼 뒤 전환하세요.', modeSiteHintAuto: '시네마 모드가 자동으로 켜졌어요. 필요하면 사이트 플레이어에서 자막·서버를 먼저 고른 뒤 전환하세요.', modeNexusHint: 'NexusSync가 모든 조작을 맡아요. 사이트 설정은 한 번 탭으로 돌아갈 수 있어요.', modeUseNexus: 'NexusSync 플레이어로', modeUseSite: '사이트 플레이어로', autoCinemaStopSite: '이 사이트는 자동 시네마 끄기', autoCinemaOnSite: '{site}에서 자동 시네마 켜짐', autoCinemaOffSite: '{site}에서 자동 시네마 꺼짐', autoCinemaBtnOn: '자동 시네마: 켬 (이 사이트)', autoCinemaBtnOff: '자동 시네마: 끔 (이 사이트)', ccPip: 'PiP (작은 창으로 계속 보기)', nextEpTitle: '다음 화', nextEpGo: '다음 화 보기', nextEpCancel: '이번 화에 머물기', nextEpGoing: '다음 화로 이동하는 중…', talkMenu: '말풍선 채팅', inkMenu: '잠깐 그리기', quickEdit: '빠른 답장 편집', quickEditHint: '| 로 구분', quickReset: '기본 답장으로', save: '저장',
+            talkTitle: '말풍선 채팅', talkPlaceholder: '메시지 보내기…', talkReplyTo: '↩ {name} 님에게 답장', talkClose: '닫기', talkSend: '보내기', talkFull: '지금까지의 대화 기록 전체 보기', talkHistory: '대화 기록',
             inkTitle: '잠깐 그리기 (몇 초 뒤 사라짐)', inkHint: '화면에 그려 보세요 — 몇 초 뒤 사라져요', inkDone: '완료', inkBubble: '님이 화면에 그리고 있어요 — 탭해서 같이 그리기',
             you: '나', roomBuffering: '⏳ {name} 기기 로딩 중… 모두 잠시 대기', roomResume: '▶️ 모두 준비됨 — 함께 재생합니다', roomRate: '⏩ {rate}배속 동기화',
             youBuffering: '⏳ 이 기기 영상 로딩 중 — 방이 기다려 줍니다', shieldResumeTitle: '탭해서 다시 재생', shieldResumeText: '브라우저가 이 영상을 멈췄습니다. 한 번 탭하면 방과 맞춰 이어서 재생합니다.',
@@ -1198,7 +1199,7 @@
             return v === 'cover' || v === 'fill' ? v : 'contain';
         },
         // Cinema controls mode: the site's own player UI is hidden so only one set shows.
-        nexusControls() { return IS_TOP ? STORE.get('nxu_cinema_controls', 'nexus') !== 'site' : this._frameNexus === true; },
+        nexusControls() { return IS_TOP ? cinemaControlsMode() !== 'site' : this._frameNexus === true; },
         _startAmbient(video, root) {
             this._stopAmbient();
             if (!video || !root || !this.ambientEnabled()) return;
@@ -1379,8 +1380,12 @@
             else this._frameFit = fit;
             this._restyle();
         },
-        setControls(mode) {
-            if (IS_TOP) STORE.set('nxu_cinema_controls', mode === 'site' ? 'site' : 'nexus');
+        setControls(mode, { save = true } = {}) {
+            // save:false (automatic cinema) uses the site's player for this visit only.
+            if (IS_TOP) {
+                if (save) { STATE.controlsOverride = null; STORE.set('nxu_cinema_controls', mode === 'site' ? 'site' : 'nexus'); }
+                else STATE.controlsOverride = mode === 'site' ? 'site' : 'nexus';
+            }
             this._restyle();
         },
 
@@ -1489,6 +1494,8 @@
                     try { (document.exitFullscreen || document.webkitExitFullscreen)?.call(document)?.catch?.(() => { }); } catch (_) { }
                 }
                 if (!on) this._ownFullscreen = false;
+                if (!on) { STATE.controlsOverride = null; AUTO_CINEMA.onExit(); }
+                if (on) AUTO_CINEMA.onEnter();
                 if (!on && ROTATE.deg) ROTATE._tick();   // leaving cinema also leaves landscape view at once
                 CINEMA_UI.sync();
                 updateMediaButtons();
@@ -1836,7 +1843,9 @@
         },
         _decide(side) {
             if (side) this._lastSide = side;
-            if (this.manual) return;
+            // Turned on with ↻: stays in landscape, but follows the phone to the other side
+            // (left or right edge down) instead of staying stuck on the first one.
+            if (this.manual) { if (side && this.deg && side !== this.deg) this._apply(side); return; }
             if (!side) {
                 this.suppress = false;
                 if (this.deg) this._leave();
@@ -3638,7 +3647,9 @@
                     } else if (msg.t === 'pong') {
                         const t3 = Date.now();
                         const rtt = t3 - msg.t1;
-                        STATE.clockOffset = msg.t2 - (msg.t1 + rtt / 2);
+                        // Everyone shares the server clock; the direct link only stands in until
+                        // this device has its own server measurement.
+                        if (!STATE._serverClockAt) STATE.clockOffset = msg.t2 - (msg.t1 + rtt / 2);
                         STATE.rttMs = rtt;
                         updateRttHUD(rtt);
                         logDebug(`P2P Clock Offset: ${STATE.clockOffset.toFixed(2)}ms`, "success");
@@ -4896,6 +4907,11 @@
         yVideo.observe((event, transaction) => {
             if (transaction.origin === 'local' || transaction.origin === 'local-repair') return;
             const observedState = _readObservedVideoState(event);
+            // Whoever sends room updates is clearly here: two devices that each missed the
+            // other's presence note both thought they led and kept correcting each other.
+            if (observedState?.sourceDeviceId && observedState.sourceDeviceId !== STATE.userId && yPresence?.has(observedState.sourceDeviceId)) {
+                PRESENCE.seen.set(observedState.sourceDeviceId, Date.now());
+            }
             if (observedState && observedState.sourceDeviceId !== STATE.userId && Date.now() < STATE.localIntentUntil) {
                 // Someone else acted while our own action is still on its way. This used to be
                 // dropped for good — so two people pressing within a second kept different
@@ -5056,7 +5072,11 @@
             const elapsed = Math.max(-wait / 1000, 0) * base;
             const expected = Math.min(time + elapsed, video.duration || Infinity);
             const drift = expected - video.currentTime;
-            if (Math.abs(drift) > CONFIG.hardSyncTolerance || (action !== 'heartbeat' && Math.abs(drift) > 0.6)) {
+            // Heartbeat-driven jumps are spaced out: a device that stalls right after each jump
+            // (slow network, heavy stream) would otherwise be yanked back again and again.
+            const hbJumpOk = action !== 'heartbeat' || Date.now() - (STATE._hbSeekAt || 0) > 8000 || Math.abs(drift) > 15;
+            if ((Math.abs(drift) > CONFIG.hardSyncTolerance && hbJumpOk) || (action !== 'heartbeat' && Math.abs(drift) > 0.6)) {
+                if (action === 'heartbeat') STATE._hbSeekAt = Date.now();
                 remoteSeek(video, expected);
                 RATE.apply(video, base);
                 STATE.syncMode = 'TIGHT';
@@ -5126,6 +5146,7 @@
             if (idle || isSyncLeader()) {
                 this.drift = idle ? null : 0;
                 this._ema = 0;
+                if (this._steps) { this._steps = 0; if (!idle) RATE.apply(v, room ? room.rate : RATE.base(v)); }
                 return;
             }
             const expected = Math.min(room.time + (getSyncedTime() - room.timestamp) / 1000 * room.rate + this.offset(), (v.duration || Infinity) - 0.1);
@@ -5139,15 +5160,29 @@
                     STATE._lastRemoteApplyAt = Date.now();
                     remoteSeek(v, expected + 0.05);
                     RATE.apply(v, base);
+                    this._steps = 0;
                 }
                 return;
             }
-            if (Math.abs(this._ema) > this.TOLERANCE) {
-                const factor = 1 + Math.max(-0.05, Math.min(0.05, this._ema * 0.5));
-                RATE.apply(v, base, Math.round(factor * 1000) / 1000, 700);
-            } else if (Math.abs(v.playbackRate - RATE.base(v)) > 0.001 && Math.abs(this._ema) < this.TOLERANCE / 2) {
-                RATE.apply(v, base);
+            // Speed nudges come in a few fixed steps and are held for a while: changing the
+            // speed every few hundred milliseconds made some players (Safari above all) hitch
+            // and stutter, which looked like a play/pause loop.
+            const step = IS_IOS ? 0.03 : 0.02;
+            const maxSteps = IS_IOS ? 1 : 2;
+            const holdMs = IS_IOS ? 3000 : 1500;
+            const now = Date.now();
+            let want = 0;
+            if (Math.abs(this._ema) > this.TOLERANCE) want = Math.sign(this._ema) * Math.min(maxSteps, Math.max(1, Math.round(Math.abs(this._ema) / 0.12)));
+            else if (this._steps && Math.abs(this._ema) > this.TOLERANCE / 2 && Math.sign(this._ema) === Math.sign(this._steps)) want = this._steps;   // hysteresis
+            if (want === this._steps) {
+                if (want) RATE.apply(v, base, 1 + want * step, holdMs + 1000);   // keep it going
+                return;
             }
+            if (now - (this._stepAt || 0) < holdMs && want !== 0) return;
+            this._steps = want;
+            this._stepAt = now;
+            if (want) RATE.apply(v, base, 1 + want * step, holdMs + 1000);
+            else RATE.apply(v, base);
         }
     };
 
@@ -5397,7 +5432,8 @@
             } catch (_) { }
         }
         fbRequest('DELETE', path).catch(() => { });
-        if (best && !(RTC.dataChannel && RTC.dataChannel.readyState === 'open' && STATE.role === 'GUEST')) {
+        if (best) {
+            STATE._serverClockAt = Date.now();
             STATE.clockOffset = best.offset;
             STATE.rttMs = best.rtt;
             logDebug(`Clock synced to server (offset ${Math.round(best.offset)}ms, rtt ${best.rtt}ms).`, 'success');
@@ -5427,15 +5463,19 @@
         if (!STATE.handshakeVerified || STATE.isViewer || STATE.isReadOnly) return false;
         const ids = PRESENCE.ids().filter(id => id === STATE.userId || !STATE.presenceMap[id]?.viewer);
         if (!ids.includes(STATE.userId)) ids.push(STATE.userId);
-        ids.sort();
-        return ids[0] === STATE.userId;
+        // A device in the background (hidden tab, screen off) has throttled timers and often a
+        // paused video: it does not lead while someone is actually watching.
+        const awake = ids.filter(id => id === STATE.userId ? !document.hidden : !STATE.presenceMap[id]?.hid);
+        const pool = awake.length ? awake : ids;
+        pool.sort();
+        return pool[0] === STATE.userId;
     }
 
     function startPresence() {
         if (STATE._presenceTimer) return;
         const beat = () => {
             if (ydoc && yPresence && STATE.role !== 'IDLE' && !STATE.isReadOnly) {
-                ydoc.transact(() => yPresence.set(STATE.userId, { ts: Date.now(), color: STATE.color, viewer: !!STATE.isViewer, nick: STATE.nickname || '', v: NXU_VERSION, r: NXU_RANK, sess: NXU_SESSION }), 'local');
+                ydoc.transact(() => yPresence.set(STATE.userId, { ts: Date.now(), color: STATE.color, viewer: !!STATE.isViewer, nick: STATE.nickname || '', v: NXU_VERSION, r: NXU_RANK, sess: NXU_SESSION, hid: !!document.hidden }), 'local');
             }
             PRESENCE.refresh();
         };
@@ -5473,6 +5513,7 @@
         processedMsgIds.clear();
         RTC.destroy();
         STATE.clockOffset = 0;
+        STATE._serverClockAt = 0;
         STATE.rttMs = null;
         releaseVideoHooks(STATE.video);
         MEDIA_SESSION.release();
@@ -5600,6 +5641,11 @@
     }
 
     // ───────────────────────── Media helpers shared by chat, bookmarks and PiP
+    function cinemaControlsMode() {
+        if (STATE.controlsOverride) return STATE.controlsOverride;
+        return STORE.get('nxu_cinema_controls', 'nexus') === 'site' ? 'site' : 'nexus';
+    }
+
     function currentMediaInfo() {
         if (STATE.video) {
             return { kind: 'video', el: STATE.video, time: STATE.video.currentTime, duration: STATE.video.duration, paused: STATE.video.paused };
@@ -6084,7 +6130,9 @@
 
     function updateSmartPosition(wrapper, fab, dock, reactPill) {
         if (!wrapper || !fab || !dock || !reactPill) return;
-        const rect = wrapper.getBoundingClientRect(), w = getW(), h = getH();
+        // In the container's own frame: screen rectangles are turned 90° in landscape view on
+        // iPhone, which put the menu off screen.
+        const rect = localBox(wrapper), w = getW(), h = getH();
         const isLeft = rect.left + 24 < w / 2, isTop = rect.top + 24 < h / 2;
         [dock, reactPill].forEach(el => { el.style.left = el.style.right = el.style.top = el.style.bottom = 'auto'; });
         fab.style.top = '0px'; fab.style.left = '0px';
@@ -6125,7 +6173,13 @@
         let probe = container.querySelector('.safe-probe');
         if (!probe) { probe = createEl('div', 'safe-probe'); container.appendChild(probe); }
         const cs = getComputedStyle(probe);
-        return { top: parseFloat(cs.paddingTop) || 0, right: parseFloat(cs.paddingRight) || 0, bottom: parseFloat(cs.paddingBottom) || 0, left: parseFloat(cs.paddingLeft) || 0 };
+        const env = { top: parseFloat(cs.paddingTop) || 0, right: parseFloat(cs.paddingRight) || 0, bottom: parseFloat(cs.paddingBottom) || 0, left: parseFloat(cs.paddingLeft) || 0 };
+        // Landscape view on iPhone turns the UI, but the notch and home bar stay where they
+        // are on the screen: map them into the UI's own frame.
+        const deg = typeof ROTATE !== 'undefined' ? ROTATE.deg : 0;
+        if (deg === 90) return { top: env.right, right: env.bottom, bottom: env.left, left: env.top };
+        if (deg === -90) return { top: env.left, right: env.top, bottom: env.right, left: env.bottom };
+        return env;
     }
 
     // Position of an element inside the NexusSync container, in the container's own frame.
@@ -6381,7 +6435,7 @@
     // ───────────────────────── UI stylesheet
     const UI_CSS = `
         :host { all: initial; }
-        .nexus-container { --txt:#fff; --glass:rgba(20,25,30,0.55); --glass-strong:rgba(18,22,28,0.82); --accent:#00e676; --glass-active:rgba(0,230,118,0.28);
+        .nexus-container { --txt:#fff; --glass:rgba(20,25,30,0.34); --glass-strong:rgba(18,22,28,0.5); --accent:#00e676; --glass-active:rgba(0,230,118,0.28);
             --sub-size:20px; --sub-original-size:13px; --sub-interim-size:17px; --sub-opacity:0.9; --sub-bg:rgba(8,10,14,0.82);
             font-family: system-ui, -apple-system, "Segoe UI", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; font-size:13px; color:var(--txt);
             container-type:size; container-name:nexus; width:100%; height:100%; position:absolute; inset:0; pointer-events:none; }
@@ -6408,7 +6462,7 @@
            pushes past the menu edge (that briefly made a scrollbar appear). */
         .dock .notify-pulse, .nexus-panel .notify-pulse { animation-name:pulseGlow; }
         @keyframes pulseGlow { 0%,100% { box-shadow:0 0 6px rgba(0,230,118,0.35); filter:brightness(1); } 50% { box-shadow:0 0 16px rgba(0,230,118,0.85), inset 0 0 10px rgba(0,230,118,0.25); filter:brightness(1.18); } }
-        #reaction-pill { position:absolute; background:var(--glass); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,0.2); border-radius:24px; padding:0 4px; display:flex; align-items:center;
+        #reaction-pill { position:absolute; background:var(--glass); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); border:1px solid rgba(255,255,255,0.2); border-radius:24px; padding:0 4px; display:flex; align-items:center;
             opacity:0; pointer-events:none; transition:opacity 0.3s, transform 0.3s; white-space:nowrap; z-index:95; height:48px; }
         #reaction-pill.visible { opacity:1; pointer-events:auto; }
         #reaction-pill { max-width:calc(100vw - 72px); max-width:calc(100cqw - 72px); overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
@@ -6427,7 +6481,7 @@
         @media (prefers-reduced-motion: reduce) { .react-btn.pop, .react-btn.pop::after, .nx-spark { animation:none !important; } }
         .presence-pill { position:absolute; font-size:11px; padding:3px 8px; border-radius:99px; background:rgba(0,0,0,0.6); color:#e0e0e0; white-space:nowrap; pointer-events:auto; }
         .dock { position:absolute; background:var(--glass-strong); border-radius:16px; padding:10px; display:flex; flex-direction:column; gap:6px; pointer-events:none; opacity:0; border:1px solid rgba(255,255,255,0.1);
-            transition:opacity 0.25s ease, transform 0.25s ease; box-shadow:0 10px 30px rgba(0,0,0,0.5); backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); z-index:90; overflow-y:auto; overflow-x:hidden; width:clamp(150px, 40vw, 190px); width:clamp(150px, 40cqw, 190px); }
+            transition:opacity 0.25s ease, transform 0.25s ease; box-shadow:0 10px 30px rgba(0,0,0,0.35); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); z-index:90; overflow-y:auto; text-shadow:0 1px 2px rgba(0,0,0,0.8); overflow-x:hidden; width:clamp(150px, 40vw, 190px); width:clamp(150px, 40cqw, 190px); }
         .dock.open { opacity:1; pointer-events:auto; border-color:rgba(0,230,118,0.3); }
         .btn { background:rgba(255,255,255,0.06); color:var(--txt); border:1px solid transparent; padding:9px 12px; border-radius:9px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px;
             font-weight:600; font-size:13px; transition:background-color 0.2s, border-color 0.2s; touch-action:manipulation; width:100%; text-align:center; }
@@ -6526,7 +6580,7 @@
         .sync-bubble.visible { opacity:1; transform:translate(-50%,0); }
         /* bubbles */
         .nx-bubbles { position:absolute; top:calc(64px + env(safe-area-inset-top, 0px)); left:calc(12px + env(safe-area-inset-left, 0px)); z-index:1950; display:flex; flex-direction:column; gap:8px; width:min(300px, calc(100% - 24px)); pointer-events:none; }
-        .nx-bubble { pointer-events:auto; display:block; width:100%; text-align:left; border:none; cursor:pointer; color:#fff; font:inherit; background:rgba(18,20,26,0.92); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
+        .nx-bubble { pointer-events:auto; display:block; width:100%; text-align:left; border:none; cursor:pointer; color:#fff; font:inherit; background:rgba(18,20,26,0.52); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); text-shadow:0 1px 2px rgba(0,0,0,0.8);
             border-radius:16px 16px 16px 6px; padding:9px 12px 10px; box-shadow:0 8px 24px rgba(0,0,0,0.45); border-left:4px solid var(--c, #69f0ae); opacity:0; transform:translateX(-24px) scale(0.96); transition:opacity 0.25s ease, transform 0.25s ease; }
         .nx-bubble.in { opacity:1; transform:none; }
         .nx-bubble.out { opacity:0; transform:translateX(-24px); }
@@ -6535,7 +6589,7 @@
         .nx-bubble-text { margin-top:3px; font-size:13.5px; line-height:1.4; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow-wrap:anywhere; }
         /* talk: speech bubbles */
         .nx-bubble.nx-talk { display:flex; align-items:flex-start; gap:9px; width:auto; max-width:100%; align-self:flex-start; border-left:none; border-radius:18px 18px 18px 6px; padding:8px 12px 9px 8px;
-            background:linear-gradient(135deg, color-mix(in srgb, var(--c, #69f0ae) 22%, rgba(18,20,26,0.94)), rgba(18,20,26,0.92)); box-shadow:0 8px 24px rgba(0,0,0,0.45), 0 0 0 1px color-mix(in srgb, var(--c, #69f0ae) 45%, transparent) inset; transform:translateX(-18px) scale(0.9); transform-origin:left bottom; transition:opacity 0.28s ease, transform 0.35s cubic-bezier(.2,1.4,.4,1); }
+            background:linear-gradient(135deg, color-mix(in srgb, var(--c, #69f0ae) 22%, rgba(18,20,26,0.58)), rgba(18,20,26,0.5)); box-shadow:0 8px 24px rgba(0,0,0,0.45), 0 0 0 1px color-mix(in srgb, var(--c, #69f0ae) 45%, transparent) inset; transform:translateX(-18px) scale(0.9); transform-origin:left bottom; transition:opacity 0.28s ease, transform 0.35s cubic-bezier(.2,1.4,.4,1); }
         .nx-bubble.nx-talk.in { transform:none; }
         .nx-bubble.nx-talk.out { opacity:0; transform:translateY(-8px) scale(0.92); transition:opacity 0.3s ease, transform 0.3s ease; }
         .nx-bubble.nx-talk.mine { align-self:flex-start; border-radius:18px 18px 6px 18px; opacity:0; background:rgba(18,20,26,0.8); }
@@ -6551,8 +6605,30 @@
         .nx-dots i:nth-child(2) { animation-delay:0.15s; } .nx-dots i:nth-child(3) { animation-delay:0.3s; }
         @keyframes nxDot { 0%,60%,100% { transform:translateY(0); opacity:0.45; } 30% { transform:translateY(-4px); opacity:1; } }
         @keyframes nxFadeIn { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
+        .nx-mode-card { position:absolute; left:50%; top:calc(64px + env(safe-area-inset-top, 0px)); transform:translate(-50%, -10px); z-index:2066; width:min(380px, calc(100% - 28px)); padding:11px 12px 11px; border-radius:16px;
+            background:rgba(16,18,24,0.62); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); box-shadow:0 12px 30px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.14) inset; color:#fff; text-shadow:0 1px 2px rgba(0,0,0,0.8);
+            opacity:0; transition:opacity 0.25s ease, transform 0.25s ease; pointer-events:auto; }
+        .nx-mode-card.in { opacity:1; transform:translate(-50%, 0); }
+        .nx-mode-head { display:flex; align-items:center; gap:7px; font-weight:800; font-size:14px; padding-right:26px; }
+        .nx-mode-sub { margin-top:4px; font-size:12.5px; line-height:1.4; opacity:0.85; }
+        .nx-mode-row { display:flex; gap:7px; margin-top:9px; flex-wrap:wrap; }
+        .nx-mode-btn { flex:1 1 auto; border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.1); color:#fff; border-radius:10px; padding:8px 10px; font-size:12.5px; font-weight:800; cursor:pointer; font-family:inherit; text-shadow:none; }
+        .nx-mode-btn.primary { background:#69f0ae; border-color:#69f0ae; color:#061009; }
+        .nx-mode-x { position:absolute; top:8px; right:8px; width:24px; height:24px; border:none; border-radius:50%; background:rgba(255,255,255,0.12); color:#fff; font-size:11px; cursor:pointer; }
+        .nx-next { position:absolute; right:calc(18px + env(safe-area-inset-right, 0px)); bottom:calc(120px + env(safe-area-inset-bottom, 0px)); z-index:2065; display:flex; align-items:center; gap:10px; padding:8px 8px 8px 8px; border-radius:16px;
+            background:rgba(16,18,24,0.6); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); box-shadow:0 10px 28px rgba(0,0,0,0.45), 0 0 0 1px rgba(255,255,255,0.14) inset; color:#fff; max-width:min(360px, calc(100% - 36px));
+            opacity:0; transform:translateY(12px) scale(0.97); transition:opacity 0.25s ease, transform 0.25s ease; pointer-events:auto; text-shadow:0 1px 2px rgba(0,0,0,0.8); }
+        .nx-next.in { opacity:1; transform:none; }
+        .nx-next-go { position:relative; flex:0 0 auto; width:46px; height:46px; border:none; border-radius:50%; background:#fff; color:#111; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:18px; text-shadow:none; }
+        .nx-next-ring { position:absolute; inset:-4px; border-radius:50%; background:conic-gradient(#69f0ae calc(var(--p, 0) * 360deg), rgba(255,255,255,0.18) 0); -webkit-mask:radial-gradient(circle, transparent 25px, #000 26px); mask:radial-gradient(circle, transparent 25px, #000 26px); opacity:0; transition:opacity 0.2s; }
+        .nx-next.counting .nx-next-ring { opacity:1; }
+        .nx-next-ic { position:relative; }
+        .nx-next-text { min-width:0; cursor:pointer; }
+        .nx-next-k { font-size:11px; font-weight:800; opacity:0.75; text-transform:uppercase; letter-spacing:0.04em; }
+        .nx-next-l { font-size:14px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
+        .nx-next-x { flex:0 0 auto; width:28px; height:28px; border:none; border-radius:50%; background:rgba(255,255,255,0.12); color:#fff; cursor:pointer; font-size:12px; }
         .nx-compose { position:absolute; left:50%; bottom:calc(112px + env(safe-area-inset-bottom, 0px)); z-index:2060; width:min(520px, calc(100% - 24px)); transform:translate(-50%, 16px) scale(0.96); opacity:0; pointer-events:none;
-            background:rgba(16,18,24,0.94); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); border-radius:18px; padding:8px 8px 9px; box-shadow:0 14px 36px rgba(0,0,0,0.55), 0 0 0 1px color-mix(in srgb, var(--c, #69f0ae) 50%, transparent);
+            background:rgba(16,18,24,0.58); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); border-radius:18px; padding:8px 8px 9px; text-shadow:0 1px 2px rgba(0,0,0,0.75); box-shadow:0 14px 36px rgba(0,0,0,0.55), 0 0 0 1px color-mix(in srgb, var(--c, #69f0ae) 50%, transparent);
             transition:opacity 0.22s ease, transform 0.25s cubic-bezier(.2,1.3,.4,1); display:flex; flex-direction:column; gap:6px; }
         .nx-compose.open { opacity:1; transform:translate(-50%, 0) scale(1); pointer-events:auto; }
         .nx-compose-head { display:flex; align-items:center; gap:6px; padding:0 2px 0 6px; }
@@ -6562,6 +6638,10 @@
         .nx-compose-row { display:flex; gap:6px; }
         .nx-compose-input { flex:1; min-width:0; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.14); color:#fff; border-radius:999px; padding:9px 14px; font-size:16px; font-family:inherit; outline:none; }
         .nx-compose-input:focus { border-color:var(--c, #69f0ae); }
+        .nx-compose-x.nx-compose-full { width:auto; padding:0 10px 0 8px; border-radius:999px; display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:800; background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.18); }
+        .nx-compose-x.nx-compose-full:hover { background:rgba(255,255,255,0.2); }
+        .nx-hist-count:empty { display:none; }
+        .nx-hist-count { min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:var(--c, #69f0ae); color:#061009; font-size:10.5px; line-height:16px; text-align:center; }
         .nx-compose-send { flex:0 0 auto; width:40px; height:40px; border:none; border-radius:50%; background:var(--c, #69f0ae); color:#061009; font-size:16px; font-weight:900; cursor:pointer; }
         .nx-compose-send:active, .nx-compose-x:active { transform:scale(0.92); }
         .cc-vhud { position:absolute; top:50%; right:calc(28px + env(safe-area-inset-right, 0px)); transform:translateY(-50%) scale(0.92); z-index:2070; display:flex; flex-direction:column; align-items:center; gap:8px;
@@ -6604,6 +6684,8 @@
         .nx-latency-label { font-weight:700; }
         .nx-latency-range { flex:1 1 140px; accent-color:var(--c, #69f0ae); }
         .nx-latency-live { flex-basis:100%; font-size:11px; opacity:0.65; }
+        .nx-talk-pending { opacity:0.45; animation:nxPend 1s ease-in-out infinite alternate; }
+        @keyframes nxPend { from { opacity:0.25; } to { opacity:0.6; } }
         .nx-talk-orig { margin-top:3px; font-size:11.5px; opacity:0.6; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:240px; }
         .nx-quick-field { flex:1 1 auto; min-width:120px; padding:6px 12px; font-size:14px; }
         .quick-edit { opacity:0.75; }
@@ -6677,6 +6759,8 @@
         .rx { position:absolute; z-index:50; pointer-events:none !important; will-change:transform, opacity; line-height:1; user-select:none; -webkit-user-select:none; }
         .rx-emoji { filter:drop-shadow(0 3px 6px rgba(0,0,0,0.45)) drop-shadow(0 0 10px rgba(255,255,255,0.18)); opacity:0; }
         .rx-mini { opacity:0; filter:drop-shadow(0 1px 2px rgba(0,0,0,0.5)); }
+        .rx-crumb { width:5px; height:5px; border-radius:2px; background:#c68a4e; box-shadow:0 0 0 1px rgba(90,50,20,0.35); opacity:0; }
+        .rx-steam { width:6px; height:14px; border-radius:50%; background:radial-gradient(ellipse at center, rgba(255,255,255,0.85), rgba(255,255,255,0)); filter:blur(1.5px); opacity:0; }
         .rx-spark { width:7px; height:7px; border-radius:50%; background:#fff; box-shadow:0 0 6px 2px var(--c, #69f0ae), 0 0 14px 4px var(--c, #69f0ae); opacity:0; }
         .rx-ring { width:60px; height:60px; border-radius:50%; border:3px solid var(--c, #69f0ae); box-shadow:0 0 18px var(--c, #69f0ae), inset 0 0 12px var(--c, #69f0ae); }
         .rx-glow { top:0 !important; bottom:0; width:min(90px, 14%); opacity:0; }
@@ -6705,8 +6789,9 @@
         .cc-btn.cc-mode { gap:6px; padding:0 12px 0 10px; background:rgba(255,255,255,0.12); font-size:12px; }
         .cc-btn.cc-mode:hover { background:rgba(255,255,255,0.22); }
         .cc-mode-label { white-space:nowrap; }
-        .cc-scrim { position:absolute; inset:0; z-index:59; pointer-events:none; background:linear-gradient(to bottom, rgba(0,0,0,0.55) 0, rgba(0,0,0,0) 120px, rgba(0,0,0,0) calc(100% - 170px), rgba(0,0,0,0.78) 100%); transition:opacity 0.35s ease; }
-        .cinema-chrome.touch .cc-scrim { background:rgba(0,0,0,0.38); }
+        .cc-scrim { position:absolute; inset:0; z-index:59; pointer-events:none; background:transparent; transition:opacity 0.35s ease; }
+        /* The picture stays fully clear while the controls show; the controls carry their own shadow. */
+        .cinema-chrome .cc-top, .cinema-chrome .cc-bottom, .cinema-chrome .cc-center { filter:drop-shadow(0 1px 2px rgba(0,0,0,0.85)) drop-shadow(0 0 8px rgba(0,0,0,0.45)); }
         .cc-top, .cc-bottom, .cc-center { position:absolute; left:0; right:0; z-index:75; pointer-events:auto; transition:opacity 0.3s ease, transform 0.3s ease; }
         .cc-top { pointer-events:none; }
         .cc-top .cc-btn { pointer-events:auto; }
@@ -6800,7 +6885,7 @@
         .nexus-container.cinema-on .sub-overlay-container { transition:bottom 0.35s ease, opacity 0.3s ease; }
         .cinema-chrome.touch .cc-back, .cinema-chrome.touch .cc-fwd, .cinema-chrome.touch .cc-play { display:none; }
         .cinema-chrome.touch .cc-seek { height:28px; }
-        @container nexus (max-width: 560px) { .cc-pip, .cc-fit, .cinema-chrome:not(.site-mode) .cc-mode-label { display:none; } .cc-btn.cc-mode { padding:0 8px; } .cc-btn { min-width:36px; padding:0 6px; } .cc-time { font-size:12px; margin-left:2px; } }
+        @container nexus (max-width: 560px) { .cc-fit, .cinema-chrome:not(.site-mode) .cc-mode-label { display:none; } .cc-btn.cc-mode { padding:0 8px; } .cc-btn { min-width:36px; padding:0 6px; } .cc-time { font-size:12px; margin-left:2px; } }
         @container nexus (max-width: 380px) { .cc-ambient { display:none; } }
         @container nexus (max-width: 600px) {
             .dock { padding:8px; gap:5px; }
@@ -6886,6 +6971,8 @@
         const btnSyncStatus = mk('nxu-sync-status', '📡 ' + t('sync'));
         const btnInvite = mk('nxu-invite', '👥 ' + t('invite'), t('inviteTitle'));
         const btnCinema = mk('nxu-cinema', '🍿 ' + t('cinema'), t('cinemaTitle'));
+        const btnAutoCinema = mk('nxu-auto-cinema', '');
+        btnAutoCinema.classList.add('subtle');
         const btnPiP = mk('nxu-pip', '📺 PiP');
         const btnRate = mk('nxu-rate', '⏩ 1x', t('rateTitle'));
         // Talking happens in speech bubbles and quick ink now: the menu opens those directly
@@ -6998,7 +7085,8 @@
         const toast = createEl('div', 'toast');
         toast.setAttribute('role', 'status');
 
-        dock.append(btnFindMedia, btnLink, btnInvite, btnSyncStatus, btnCinema, btnPiP, btnRate, btnDraw, btnBookmark, btnChat, btnTranslate, btnSubLog, btnDebug, btnHideSite);
+        // Sketching and chat live in the reaction bar (🖍️ 💬); the menu does not repeat them.
+        dock.append(btnFindMedia, btnLink, btnInvite, btnSyncStatus, btnCinema, btnAutoCinema, btnPiP, btnRate, btnBookmark, btnTranslate, btnSubLog, btnDebug, btnHideSite);
         uiWrapper.append(dock, reactPill, fab);
         nexusContainer.append(drawCanvas, uiWrapper, chatPanel, subLogPanel, manualModal, transModal, toast, debugPanel);
         shadow.appendChild(nexusContainer);
@@ -7009,7 +7097,7 @@
         ['keyup', 'keypress'].forEach(evt => nexusContainer.addEventListener(evt, e => { if (isEditableTarget(e.composedPath()[0])) e.stopPropagation(); }));
 
         uiElements = {
-            uiWrapper, fab, reactPill, dock, btnFindMedia, btnLink, btnSyncStatus, btnTranslate, btnCinema, btnPiP, btnRate, btnDraw, btnBookmark, btnChat, btnSubLog,
+            uiWrapper, fab, reactPill, dock, btnFindMedia, btnLink, btnSyncStatus, btnTranslate, btnCinema, btnAutoCinema, btnPiP, btnRate, btnDraw, btnBookmark, btnChat, btnSubLog,
             btnDebug, btnHideSite, chatPanel, chatMessages, chatInput, chatJumpBtn, subLogPanel, subLogMessages,
             subLogJumpBtn, drawCanvas, manualModal, transModal, toast, debugJumpBtn, syncBubble: null,
             pinError, guestInput, pinHint, pinDisplay, pinCopyBtn, hostBtn, connectBtn, btnInvite, typingRow, nickInput
@@ -7244,6 +7332,7 @@
         };
 
         btnCinema.onclick = () => { triggerHaptic(); CINEMA.toggle(); };
+        btnAutoCinema.onclick = () => { triggerHaptic(); AUTO_CINEMA.setSite(!AUTO_CINEMA.enabled()); };
         btnPiP.onclick = async () => {
             let video = STATE.video;
             if (!video || video.readyState === 0) {
@@ -7471,7 +7560,7 @@
         },
         publish() {
             try {
-                if (ydoc && yPresence && STATE.handshakeVerified) ydoc.transact(() => yPresence.set(STATE.userId, { ts: Date.now(), color: STATE.color, viewer: !!STATE.isViewer, nick: STATE.nickname || '', v: NXU_VERSION, r: NXU_RANK, sess: NXU_SESSION }), 'local');
+                if (ydoc && yPresence && STATE.handshakeVerified) ydoc.transact(() => yPresence.set(STATE.userId, { ts: Date.now(), color: STATE.color, viewer: !!STATE.isViewer, nick: STATE.nickname || '', v: NXU_VERSION, r: NXU_RANK, sess: NXU_SESSION, hid: !!document.hidden }), 'local');
             } catch (_) { }
         },
         // Small editor: name + colour swatches + any colour.
@@ -7587,25 +7676,43 @@
             });
         },
         // → { text, from } or null when no translation is needed / possible.
+        _pending: new Map(),
         async translate(text) {
             const tl = myLanguage();
             const key = tl + '\n' + text;
             if (this._cache.has(key)) return this._cache.get(key);
             if (!/[\p{L}]{2,}/u.test(text)) return null;          // emoji, numbers, "ㅋ"
-            let result = null;
-            try {
-                const g = code => (code === 'zh' ? 'zh-CN' : code);
-                const res = await httpRequest({ url: `https://translate.googleapis.com/translate_a/single?client=gtx&sl=auto&tl=${g(tl)}&dt=t&q=${encodeURIComponent(text.slice(0, 500))}`, timeout: 6000 });
-                if (res.status === 200) {
+            // The bubble and the room chat ask for the same message at the same moment.
+            if (this._pending.has(key)) return this._pending.get(key);
+            const job = this._fetch(text, tl).then((result) => {
+                // Only real answers are remembered: a network hiccup (slow iPad link, a
+                // blocked request) must not leave that message untranslated for good.
+                if (result !== undefined) {
+                    this._cache.set(key, result);
+                    if (this._cache.size > 200) this._cache.delete(this._cache.keys().next().value);
+                }
+                return result || null;
+            }).finally(() => this._pending.delete(key));
+            this._pending.set(key, job);
+            return job;
+        },
+        // → { text, from } | null (no translation needed) | undefined (failed: try again later)
+        async _fetch(text, tl) {
+            const g = code => (code === 'zh' ? 'zh-CN' : code);
+            const url = `https://translate.googleapis.com/translate_a/single?client=gtx&sl=auto&tl=${g(tl)}&dt=t&q=${encodeURIComponent(text.slice(0, 500))}`;
+            // Through the userscript manager first, then directly (some iPad setups only allow one).
+            for (const viaFetch of [false, true]) {
+                try {
+                    const res = await _httpRequest({ url, timeout: 9000, viaFetch });
+                    if (res.status !== 200) continue;
                     const data = JSON.parse(res.text);
                     const out = Array.isArray(data?.[0]) ? data[0].map(x => (x && x[0]) || '').join('').trim() : '';
                     const from = baseLang(String(data?.[2] || ''));
-                    if (out && from && from !== baseLang(tl) && out.toLowerCase() !== text.trim().toLowerCase()) result = { text: out, from };
-                }
-            } catch (_) { }
-            this._cache.set(key, result);
-            if (this._cache.size > 200) this._cache.delete(this._cache.keys().next().value);
-            return result;
+                    if (out && from && from !== baseLang(tl) && out.toLowerCase() !== text.trim().toLowerCase()) return { text: out, from };
+                    return null;
+                } catch (_) { }
+            }
+            return undefined;
         }
     };
 
@@ -7635,17 +7742,21 @@
                 const reply = createEl('span', 'nx-talk-reply', '↩');
                 card.append(reply);
             }
-            if (!mine && CHAT_TR.enabled()) {
+            let timer = null, left = Math.max(4200, Math.min(11000, 3500 + text.length * 70)), startedAt = 0;
+            if (!mine && CHAT_TR.enabled() && /[\p{L}]{2,}/u.test(text)) {
+                const pend = createEl('span', 'nx-talk-orig nx-talk-pending', '🌐 …');
+                body.querySelector('.nx-bubble-text').after(pend);
                 CHAT_TR.translate(text).then((tr) => {
-                    if (!tr || !card.isConnected) return;
+                    pend.remove();
+                    if (!tr || !card.isConnected || card.classList.contains('out')) return;
                     const main = body.querySelector('.nx-bubble-text');
                     main.textContent = tr.text;
-                    const orig = createEl('span', 'nx-talk-orig', '🌐 ' + text);
-                    main.after(orig);
-                    left += 2500;
+                    main.after(createEl('span', 'nx-talk-orig', '🌐 ' + text));
+                    // Time to read the translation too (the bubble was already counting down).
+                    if (startedAt) { clearTimeout(timer); left = Math.max(left - (Date.now() - startedAt), 0) + 2500 + tr.text.length * 40; run(); }
+                    else left += 2500;
                 });
             }
-            let timer = null, left = Math.max(4200, Math.min(11000, 3500 + text.length * 70)), startedAt = 0;
             const close = () => { clearTimeout(timer); card.classList.add('out'); setTimeout(() => card.remove(), 300); };
             const run = () => { startedAt = Date.now(); timer = setTimeout(close, left); };
             const hold = () => { clearTimeout(timer); left = Math.max(1500, left - (Date.now() - startedAt)); };
@@ -7687,7 +7798,8 @@
                 const to = createEl('span', 'nx-compose-to');
                 const x = createEl('button', 'nx-compose-x', '✕', { type: 'button', title: t('talkClose'), 'aria-label': t('talkClose') });
                 x.onclick = (e) => { e.stopPropagation(); this.close(); };
-                const full = createEl('button', 'nx-compose-x nx-compose-full', '⤢', { type: 'button', title: t('talkFull'), 'aria-label': t('talkFull') });
+                const full = createEl('button', 'nx-compose-x nx-compose-full', '', { type: 'button', title: t('talkFull'), 'aria-label': t('talkFull') });
+                full.append(createEl('span', 'nx-hist-ic', '🗂'), createEl('span', 'nx-hist-label', t('talkHistory')), createEl('span', 'nx-hist-count'));
                 full.onclick = (e) => { e.stopPropagation(); this.close(); openChatPanel(); };
                 const me = createEl('button', 'nx-compose-x nx-me-dot', '', { type: 'button', title: t('profileTitle'), 'aria-label': t('profileTitle') });
                 me.style.setProperty('--c', STATE.color);
@@ -7721,6 +7833,10 @@
             const to = this._composer.querySelector('.nx-compose-to');
             to.textContent = replyTo ? t('talkReplyTo', { name: replyTo }) : '💬 ' + t('talkTitle');
             this._composer.style.setProperty('--c', color || STATE.color || '#69f0ae');
+            // How much history the room chat holds (shown on the "History" pill).
+            const n = (() => { try { return yChat ? yChat.length : 0; } catch (_) { return 0; } })();
+            const cnt = this._composer.querySelector('.nx-hist-count');
+            if (cnt) cnt.textContent = n ? (n > 99 ? '99+' : String(n)) : '';
             this._composer.classList.add('open');
             this._fitKeyboard();
             if (!this._vvBound && window.visualViewport) {
@@ -8035,6 +8151,253 @@
         }
     };
 
+    // ───────────────────────── Automatic cinema
+    // Opening a page that is all about one video (an episode, a movie — not a feed with many
+    // posts) switches to cinema mode as soon as the video is ready. It keeps the site's own
+    // player, because subtitles and servers are often picked there; a small card says which
+    // player is in use and switches to NexusSync's player in one tap. Per site on/off.
+    const AUTO_CINEMA = {
+        _doneFor: '',
+        _auto: false,
+        _card: null,
+        FEED_HOSTS: /(^|\.)(reddit\.com|x\.com|twitter\.com|facebook\.com|instagram\.com|tiktok\.com|threads\.net|9gag\.com|imgur\.com|tumblr\.com|pinterest\.[a-z.]+|linkedin\.com|discord\.com|dcinside\.com|fmkorea\.com|theqoo\.net|ruliweb\.com|clien\.net|naver\.com|daum\.net)$/i,
+        _sites() { const v = STORE.get('nxu_auto_cinema_sites', {}); return v && typeof v === 'object' ? v : {}; },
+        enabled() {
+            const v = this._sites()[HOST];
+            if (v === true || v === false) return v;
+            return !this.FEED_HOSTS.test(HOST);
+        },
+        setSite(on) {
+            const all = { ...this._sites(), [HOST]: !!on };
+            const keys = Object.keys(all);
+            if (keys.length > 300) delete all[keys[0]];
+            STORE.set('nxu_auto_cinema_sites', all);
+            this.paintButton();
+            showToast(t(on ? 'autoCinemaOnSite' : 'autoCinemaOffSite', { site: HOST }));
+        },
+        paintButton() {
+            const b = uiElements.btnAutoCinema;
+            if (!b) return;
+            const on = this.enabled();
+            b.textContent = '✨ ' + t(on ? 'autoCinemaBtnOn' : 'autoCinemaBtnOff');
+            b.classList.toggle('active', on);
+        },
+        // One real video on the page, big enough, long enough — not a feed.
+        _singleMedia() {
+            if (/\/shorts\//.test(location.pathname) || /\/reel(s)?\//.test(location.pathname)) return false;
+            if (document.querySelectorAll('article').length >= 4) return false;
+            const doc = document.scrollingElement || document.documentElement;
+            if (doc && doc.scrollHeight > window.innerHeight * 10) return false;
+            let big = 0;
+            for (const v of document.querySelectorAll('video')) {
+                const r = v.getBoundingClientRect();
+                if (r.width >= 200 && r.height >= 110) big++;
+            }
+            for (const [ifr] of VIDEO_DETECTOR.frameReports) {
+                const r = ifr.getBoundingClientRect();
+                if (r.width >= 200 && r.height >= 110) big++;
+            }
+            if (big > 1) return false;
+            const info = currentMediaInfo();
+            if (!info) return false;
+            const r = info.el.getBoundingClientRect();
+            if (r.width < Math.min(420, window.innerWidth * 0.6)) return false;
+            return Number.isFinite(info.duration) && info.duration >= 90;
+        },
+        tick() {
+            if (!IS_TOP || STATE.retired || STATE.isCinema || STATE.pendingCinema || document.hidden) return;
+            const key = location.href.split('#')[0];
+            if (this._doneFor === key || !this.enabled() || STORE.get('nxu_hide_fab_' + HOST, false)) return;
+            if (!(STATE.video || STATE.cinemaIframe)) return;
+            if (STATE.video && STATE.video.readyState < 1) return;
+            if (!this._singleMedia()) return;
+            this._doneFor = key;
+            this._auto = true;
+            CINEMA.setControls('site', { save: false });
+            CINEMA.set(true, { silent: true });
+            if (!STATE.isCinema) { this._auto = false; STATE.controlsOverride = null; }
+        },
+        onEnter() {
+            const auto = this._auto;
+            this._auto = false;
+            setTimeout(() => this._showCard(auto), 400);
+        },
+        onExit() {
+            this._doneFor = location.href.split('#')[0];   // left on purpose: not again on this page
+            this._hideCard();
+        },
+        _hideCard() {
+            const c = this._card;
+            this._card = null;
+            clearTimeout(this._cardTimer);
+            if (c) { c.classList.remove('in'); setTimeout(() => c.remove(), 260); }
+        },
+        // Which player is in use, with a one-tap switch (and the per-site switch after an automatic start).
+        _showCard(auto) {
+            if (!STATE.isCinema || !IS_TOP) return;
+            const container = getContainer();
+            if (!container) return;
+            this._hideCard();
+            const site = CINEMA_UI.controlsMode() === 'site';
+            const card = createEl('div', 'nx-mode-card');
+            const head = createEl('div', 'nx-mode-head');
+            head.append(createEl('span', 'nx-mode-ic', site ? '🎛️' : '🍿'), createEl('span', 'nx-mode-title', t(site ? 'modeSitePlayer' : 'modeNexusPlayer')));
+            const sub = createEl('div', 'nx-mode-sub', t(site ? (auto ? 'modeSiteHintAuto' : 'modeSiteHint') : 'modeNexusHint'));
+            const row = createEl('div', 'nx-mode-row');
+            const sw = createEl('button', 'nx-mode-btn primary', t(site ? 'modeUseNexus' : 'modeUseSite'), { type: 'button' });
+            sw.onclick = (e) => {
+                e.stopPropagation();
+                const next = CINEMA_UI.controlsMode() === 'site' ? 'nexus' : 'site';
+                CINEMA_UI._resetGestures?.();
+                CINEMA.setControls(next, { save: false });
+                CINEMA_UI.sync();
+                this._hideCard();
+                setTimeout(() => this._showCard(false), 350);
+            };
+            row.appendChild(sw);
+            if (auto) {
+                const off = createEl('button', 'nx-mode-btn', t('autoCinemaStopSite'), { type: 'button' });
+                off.onclick = (e) => { e.stopPropagation(); this.setSite(false); this._hideCard(); CINEMA.set(false, { silent: true }); };
+                row.appendChild(off);
+            }
+            const x = createEl('button', 'nx-mode-x', '✕', { type: 'button', 'aria-label': t('talkClose') });
+            x.onclick = (e) => { e.stopPropagation(); this._hideCard(); };
+            card.append(x, head, sub, row);
+            ['pointerdown', 'click', 'touchstart'].forEach(ev => card.addEventListener(ev, (e) => e.stopPropagation()));
+            container.appendChild(card);
+            this._card = card;
+            requestAnimationFrame(() => card.classList.add('in'));
+            this._cardTimer = setTimeout(() => this._hideCard(), auto ? 9000 : 4500);
+            resetIdleTimer(true);
+        }
+    };
+    setInterval(() => { try { AUTO_CINEMA.tick(); } catch (_) { } }, 1200);
+
+    // ───────────────────────── Next episode
+    // On series pages (drama/anime sites) the page usually has a "next episode" link or
+    // button. Near the end of an episode in cinema mode a small card offers it, and when the
+    // episode ends it counts down and moves on (in a room: everyone is invited along, and
+    // this device comes back into the same room on the next page).
+    const NEXT_EP = {
+        _card: null,
+        _target: null,
+        _scanAt: 0,
+        _cancelledFor: '',
+        _count: null,
+        enabled() { return STORE.get('nxu_auto_next', true) !== false; },
+        RX_TEXT: /(다음\s*(화|회|편|회차|에피소드|episode|ep\.?)|다음\s*$|^\s*다음|next\s*(episode|ep\b|ep\.|part|chapter|video)|^\s*next\s*$|次の(話|エピソード)|次へ|下一[集话話]|siguiente\s*episodio|épisode\s*suivant|nächste\s*folge|próximo\s*episódio|⏭|»\s*$)/i,
+        RX_ATTR: /(next[-_ ]?(ep|episode|video|btn|button|link)|btn[-_]?next|episode[-_]?next|nav[-_]?next|\bnext\b)/i,
+        RX_BAD: /(prev|이전|previous|前|上一|comment|댓글|page|페이지|article|post|기사|뉴스)/i,
+        _visible(el) {
+            if (!el.isConnected || el.closest('#nxu-host')) return false;
+            const r = el.getBoundingClientRect();
+            if (r.width < 6 || r.height < 6) return false;
+            const cs = getComputedStyle(el);
+            return cs.visibility !== 'hidden' && cs.display !== 'none' && +cs.opacity > 0.05;
+        },
+        _label(el) {
+            return [el.textContent, el.getAttribute('aria-label'), el.getAttribute('title'), el.getAttribute('alt')].filter(Boolean).join(' ').replace(/\s+/g, ' ').trim().slice(0, 80);
+        },
+        // → { el, href, label } or null
+        find() {
+            const here = location.origin + location.pathname + location.search;
+            const out = [];
+            const rel = document.querySelector('a[rel~="next"][href], link[rel~="next"][href]');
+            if (rel) out.push({ el: rel.tagName === 'A' ? rel : null, href: rel.href, label: rel.tagName === 'A' ? this._label(rel) : '', score: 40 });
+            const nodes = document.querySelectorAll('a[href], button, [role="button"], [onclick]');
+            let n = 0;
+            for (const el of nodes) {
+                if (++n > 4000) break;
+                const label = this._label(el);
+                const attrs = `${el.id} ${typeof el.className === 'string' ? el.className : ''} ${el.getAttribute('data-action') || ''}`;
+                let score = 0;
+                if (this.RX_TEXT.test(label)) score += 60;
+                if (this.RX_ATTR.test(attrs)) score += 25;
+                if (!score) continue;
+                if (this.RX_BAD.test(label) || /prev/i.test(attrs)) score -= 70;
+                if (score <= 0 || !this._visible(el)) continue;
+                const href = el.tagName === 'A' ? el.href : '';
+                if (href) {
+                    if (/^javascript:/i.test(el.getAttribute('href') || '') || href.split('#')[0] === here) { if (!el.onclick && !el.hasAttribute('onclick')) continue; }
+                    else if (new URL(href).origin === location.origin) score += 10;
+                }
+                if (label.length > 60) score -= 15;
+                out.push({ el, href, label, score });
+            }
+            out.sort((a, b) => b.score - a.score);
+            const best = out[0];
+            return best && best.score >= 40 ? best : null;
+        },
+        go(target = this._target) {
+            if (!target) return;
+            this.hide();
+            showToast('⏭ ' + t('nextEpGoing'));
+            const href = target.href && !/^javascript:/i.test(target.href) ? target.href : '';
+            if (href && href.split('#')[0] !== location.href.split('#')[0]) {
+                if (SOCIAL.live()) { TRAVEL.go(href); return; }
+                location.href = href;
+                return;
+            }
+            // A button that changes the episode with script: remember the room, then press it.
+            try { TRAVEL.onLeavePage(); } catch (_) { }
+            try { target.el?.click(); } catch (_) { }
+        },
+        hide() {
+            clearInterval(this._count);
+            this._count = null;
+            const c = this._card;
+            this._card = null;
+            if (c) { c.classList.remove('in'); setTimeout(() => c.remove(), 260); }
+        },
+        _show(target, ended) {
+            const container = getContainer();
+            if (!container) return;
+            if (!this._card || !this._card.isConnected) {
+                const card = createEl('div', 'nx-next');
+                const play = createEl('button', 'nx-next-go', '', { type: 'button' });
+                play.append(createEl('span', 'nx-next-ring'), createEl('span', 'nx-next-ic', '⏭'));
+                const text = createEl('div', 'nx-next-text');
+                text.append(createEl('div', 'nx-next-k', t('nextEpTitle')), createEl('div', 'nx-next-l'));
+                const cancel = createEl('button', 'nx-next-x', '✕', { type: 'button', title: t('nextEpCancel'), 'aria-label': t('nextEpCancel') });
+                card.append(play, text, cancel);
+                ['pointerdown', 'click', 'touchstart'].forEach(ev => card.addEventListener(ev, (e) => e.stopPropagation()));
+                play.onclick = () => this.go();
+                text.onclick = () => this.go();
+                cancel.onclick = () => { this._cancelledFor = location.href; this.hide(); UI_GUARD.shield(); };
+                container.appendChild(card);
+                this._card = card;
+                requestAnimationFrame(() => card.classList.add('in'));
+            }
+            this._card.querySelector('.nx-next-l').textContent = target.label && target.label.length > 2 ? target.label : t('nextEpGo');
+            if (ended && !this._count && this.enabled()) {
+                let left = 8;
+                const ring = this._card.querySelector('.nx-next-ring');
+                this._card.classList.add('counting');
+                ring.style.setProperty('--p', '0');
+                ring.dataset.n = String(left);
+                this._count = setInterval(() => {
+                    left--;
+                    ring.dataset.n = String(Math.max(0, left));
+                    ring.style.setProperty('--p', String((8 - left) / 8));
+                    if (left <= 0) { clearInterval(this._count); this._count = null; this.go(); }
+                }, 1000);
+            }
+        },
+        tick() {
+            if (!IS_TOP || !STATE.isCinema) { if (this._card) this.hide(); return; }
+            const info = currentMediaInfo();
+            if (!info || !Number.isFinite(info.duration) || info.duration < 240) { if (this._card) this.hide(); return; }
+            const left = info.duration - info.time;
+            const ended = left <= 0.8 || (info.kind === 'video' && info.el.ended);
+            if (left > 25 && !ended) { if (this._card) this.hide(); this._target = null; return; }
+            if (this._cancelledFor === location.href) return;
+            if (!this._target || Date.now() - this._scanAt > 5000) { this._scanAt = Date.now(); this._target = this.find(); }
+            if (!this._target) return;
+            this._show(this._target, ended);
+        }
+    };
+    setInterval(() => { try { NEXT_EP.tick(); } catch (_) { } }, 1000);
+
     // ───────────────────────── Cover: hide the picture for a moment (for everyone)
     // 🙈 (or H in cinema, Alt+Shift+H anywhere) lays a soft, nearly opaque curtain over the
     // picture on every device in the room — for a violent or scary scene when children are
@@ -8679,7 +9042,7 @@
     // Animations run on the compositor (Web Animations), with a hard cap on live nodes.
     // Button feedback in the reaction bar: a springy pop, a ring and a few tiny copies of the
     // emoji bursting out around the button (kept inside the bar's neighbourhood).
-    const PRESS_COLORS = { '❤️': '#ff5c8a', '😂': '#ffd54f', '😭': '#82b1ff', '😡': '#ff5252', '🫣': '#ffab91', '🌰': '#bcaaa4', '🚽': '#80d8ff' };
+    const PRESS_COLORS = { '😂': '#ffd54f', '😭': '#82b1ff', '😡': '#ff5252', '💦': '#4fc3f7', '🍪': '#d7a86e', '☕': '#bcaaa4', '😘': '#ff6fae', '🖕': '#ffb74d' };
     function pressFx(btn, emoji) {
         if (!btn) return;
         btn.style.setProperty('--pop', PRESS_COLORS[emoji] || '#69f0ae');
@@ -8715,9 +9078,10 @@
         _combo: new Map(),     // lane → { n, timer, badge }
         _tags: new Map(),      // uid → last name-tag time
         reduced() { try { return matchMedia('(prefers-reduced-motion: reduce)').matches; } catch (_) { return false; } },
-        _node(cls, text, x, y, size) {
+        _node(cls, text, x, y, size, force = false) {
             const container = getContainer();
-            if (!container || this.live >= this.MAX) return null;
+            // The burst's ring and glow always get a place, even when many small bits are flying.
+            if (!container || (this.live >= this.MAX && !force)) return null;
             const el = createEl('div', 'rx ' + cls, text);
             el.style.left = x + 'px';
             el.style.top = y + 'px';
@@ -8772,7 +9136,7 @@
             const sway = (Math.random() < 0.5 ? -1 : 1) * (10 + Math.random() * 14);
             const d = 1700 + Math.random() * 500;
             const base = { duration: d, delay };
-            const kind = { '❤️': 'heart', '💗': 'heart', '😂': 'laugh', '😭': 'cry', '😡': 'angry', '🫣': 'peek', '🌰': 'toss', '🚽': 'flush' }[e] || 'float';
+            const kind = { '❤️': 'heart', '💗': 'heart', '😂': 'laugh', '😭': 'cry', '😡': 'angry', '💦': 'splash', '🍪': 'munch', '☕': 'steam', '😘': 'kiss', '🖕': 'flip', '🫣': 'peek', '🌰': 'toss', '🚽': 'flush' }[e] || 'float';
             if (this.reduced()) { this._run(el, [{ opacity: 0 }, { opacity: 1, offset: 0.2 }, { opacity: 0, transform: `translateY(${-R * 0.4}px)` }], base); return; }
             switch (kind) {
                 case 'heart':
@@ -8822,6 +9186,101 @@
                     { const puff = this._node('rx-mini', '💢', x + size * 0.7, lane.y - R * 0.3, 16);
                         this._run(puff, [{ transform: 'scale(0.3)', opacity: 0 }, { transform: 'scale(1.3)', opacity: 1, offset: 0.4 }, { transform: 'translateY(-30px) scale(0.6)', opacity: 0 }], { duration: 800, delay: delay + 300 }); }
                     break;
+                case 'splash': {
+                    // Shoots up with a little shiver, then bursts into droplets.
+                    this._run(el, [
+                        { transform: 'translate(0,0) scale(0.3) rotate(0)', opacity: 0 },
+                        { transform: `translate(0, ${-R * 0.42}px) scale(1.25) rotate(-6deg)`, opacity: 1, offset: 0.3 },
+                        { transform: `translate(3px, ${-R * 0.46}px) scale(1.15) rotate(6deg)`, offset: 0.38 },
+                        { transform: `translate(-3px, ${-R * 0.5}px) scale(1.2) rotate(-4deg)`, offset: 0.46 },
+                        { transform: `translate(0, ${-R * 0.55}px) scale(1.5)`, opacity: 0, offset: 0.6 },
+                        { transform: `translate(0, ${-R * 0.55}px) scale(1.5)`, opacity: 0 }
+                    ], { ...base, duration: 1500 });
+                    for (let i = 0; i < 6; i++) {
+                        const ang = -Math.PI / 2 + (i - 2.5) * 0.42;
+                        const dist = 40 + Math.random() * 34;
+                        const drop = this._node('rx-mini', '💧', x + size * 0.35, lane.y - R * 0.55, 13 + Math.random() * 5);
+                        this._run(drop, [
+                            { transform: 'translate(0,0) scale(0.4)', opacity: 0 },
+                            { transform: `translate(${Math.cos(ang) * dist}px, ${Math.sin(ang) * dist}px) scale(1)`, opacity: 1, offset: 0.4 },
+                            { transform: `translate(${Math.cos(ang) * dist * 1.3}px, ${Math.sin(ang) * dist + 70}px) scale(0.7)`, opacity: 0 }
+                        ], { duration: 900, delay: delay + 850, easing: 'cubic-bezier(.2,.6,.6,1)' });
+                    }
+                    break;
+                }
+                case 'munch': {
+                    // Rises, gets two quick bites (squash), crumbs fall.
+                    this._run(el, [
+                        { transform: 'translate(0,0) scale(0.4) rotate(-20deg)', opacity: 0 },
+                        { transform: `translate(${sway * 0.4}px, ${-R * 0.4}px) scale(1.15) rotate(8deg)`, opacity: 1, offset: 0.28 },
+                        { transform: `translate(${sway * 0.4}px, ${-R * 0.44}px) scale(1.25, 0.85) rotate(0)`, offset: 0.36 },
+                        { transform: `translate(${sway * 0.4}px, ${-R * 0.47}px) scale(1.1) rotate(-4deg)`, offset: 0.44 },
+                        { transform: `translate(${sway * 0.4}px, ${-R * 0.5}px) scale(1.25, 0.85)`, offset: 0.52 },
+                        { transform: `translate(${-sway * 0.3}px, ${-R * 0.85}px) scale(0.9) rotate(10deg)`, opacity: 0 }
+                    ], base);
+                    for (let i = 0; i < 5; i++) {
+                        const crumb = this._node('rx-crumb', '', x + size * (0.25 + Math.random() * 0.5), lane.y - R * 0.45, 0);
+                        this._run(crumb, [
+                            { transform: 'translate(0,0) scale(0.6)', opacity: 0 },
+                            { transform: `translate(${(Math.random() - 0.5) * 30}px, 8px) scale(1)`, opacity: 1, offset: 0.2 },
+                            { transform: `translate(${(Math.random() - 0.5) * 50}px, ${50 + Math.random() * 40}px) rotate(${Math.random() * 180}deg)`, opacity: 0 }
+                        ], { duration: 800, delay: delay + d * 0.34 + i * 60, easing: 'ease-in' });
+                    }
+                    break;
+                }
+                case 'steam': {
+                    // A calm cup: slow rise, gentle sway, steam curling up.
+                    this._run(el, [
+                        { transform: 'translate(0,0) scale(0.6)', opacity: 0 },
+                        { transform: `translate(${sway * 0.3}px, ${-R * 0.25}px) scale(1.05)`, opacity: 1, offset: 0.25 },
+                        { transform: `translate(${-sway * 0.3}px, ${-R * 0.45}px) scale(1.05)`, offset: 0.55 },
+                        { transform: `translate(${sway * 0.2}px, ${-R * 0.6}px) scale(0.95)`, opacity: 0 }
+                    ], { ...base, duration: 2400, easing: 'ease-in-out' });
+                    for (let i = 0; i < 3; i++) {
+                        const wisp = this._node('rx-steam', '', x + size * (0.3 + i * 0.18), lane.y - R * 0.3 - size * 0.6, 0);
+                        this._run(wisp, [
+                            { transform: 'translate(0,0) scale(0.6, 0.8)', opacity: 0 },
+                            { transform: `translate(${i % 2 ? 6 : -6}px, -22px) scale(1, 1.2)`, opacity: 0.8, offset: 0.4 },
+                            { transform: `translate(${i % 2 ? -4 : 4}px, -52px) scale(1.4, 1.6)`, opacity: 0 }
+                        ], { duration: 1500, delay: delay + 500 + i * 220, easing: 'ease-out' });
+                    }
+                    break;
+                }
+                case 'kiss': {
+                    // Leans in, then blows a kiss that floats toward the middle of the screen.
+                    const toward = lane.x > lane.W / 2 ? -1 : 1;
+                    this._run(el, [
+                        { transform: 'translate(0,0) scale(0.4) rotate(0)', opacity: 0 },
+                        { transform: `translate(0, ${-R * 0.35}px) scale(1.2) rotate(${toward * 12}deg)`, opacity: 1, offset: 0.3 },
+                        { transform: `translate(${toward * 6}px, ${-R * 0.38}px) scale(1.05, 1.15) rotate(${toward * 18}deg)`, offset: 0.45 },
+                        { transform: `translate(0, ${-R * 0.55}px) scale(0.9) rotate(0)`, opacity: 0 }
+                    ], base);
+                    for (let i = 0; i < 2; i++) {
+                        const heart = this._node('rx-mini', i ? '💗' : '💋', x + size * 0.5, lane.y - R * 0.38, i ? 15 : 18);
+                        this._run(heart, [
+                            { transform: 'translate(0,0) scale(0.3)', opacity: 0 },
+                            { transform: `translate(${toward * 40}px, -16px) scale(1.15)`, opacity: 1, offset: 0.3 },
+                            { transform: `translate(${toward * 110}px, -40px) scale(1)`, offset: 0.7 },
+                            { transform: `translate(${toward * 150}px, -60px) scale(0.6)`, opacity: 0 }
+                        ], { duration: 1300, delay: delay + d * 0.42 + i * 180, easing: 'ease-out' });
+                    }
+                    break;
+                }
+                case 'flip':
+                    // Cheeky: pops up, two jabs toward the screen, a shake, gone.
+                    this._run(el, [
+                        { transform: 'translate(0,0) scale(0.3)', opacity: 0 },
+                        { transform: `translate(0, ${-R * 0.3}px) scale(1.1)`, opacity: 1, offset: 0.18 },
+                        { transform: `translate(0, ${-R * 0.33}px) scale(1.45)`, offset: 0.26 },
+                        { transform: `translate(0, ${-R * 0.34}px) scale(1.1)`, offset: 0.33 },
+                        { transform: `translate(0, ${-R * 0.36}px) scale(1.45)`, offset: 0.41 },
+                        { transform: `translate(-4px, ${-R * 0.38}px) scale(1.15) rotate(-8deg)`, offset: 0.5 },
+                        { transform: `translate(4px, ${-R * 0.4}px) scale(1.15) rotate(8deg)`, offset: 0.57 },
+                        { transform: `translate(0, ${-R * 0.7}px) scale(0.9)`, opacity: 0 }
+                    ], { ...base, easing: 'ease-out' });
+                    { const pop = this._node('rx-mini', '💥', x + size * 0.6, lane.y - R * 0.36, 16);
+                        this._run(pop, [{ transform: 'scale(0.2)', opacity: 0 }, { transform: 'scale(1.3)', opacity: 1, offset: 0.35 }, { transform: 'scale(0.6) translateY(-16px)', opacity: 0 }], { duration: 600, delay: delay + d * 0.25 }); }
+                    break;
                 case 'peek':
                     this._run(el, [
                         { transform: `translate(${lane.x > lane.W / 2 ? 60 : -60}px, ${-R * 0.3}px) scale(1)`, opacity: 0 },
@@ -8883,12 +9342,12 @@
         _burst(e, side, color) {
             const lane = this._lane(side);
             const ox = side === 'right' ? lane.W - 30 : 30, oy = lane.y + 20;
-            const ring = this._node('rx-ring', '', ox, oy);
+            const ring = this._node('rx-ring', '', ox, oy, 0, true);
             if (ring) {
                 ring.style.setProperty('--c', color);
                 this._run(ring, [{ transform: 'translate(-50%,-50%) scale(0.2)', opacity: 0.9 }, { transform: 'translate(-50%,-50%) scale(4.2)', opacity: 0 }], { duration: 900, easing: 'ease-out' });
             }
-            const glow = this._node('rx-glow ' + side, '', 0, 0);
+            const glow = this._node('rx-glow ' + side, '', 0, 0, 0, true);
             if (glow) {
                 glow.style.setProperty('--c', color);
                 this._run(glow, [{ opacity: 0 }, { opacity: 1, offset: 0.25 }, { opacity: 0 }], { duration: 1100 });
@@ -9148,7 +9607,7 @@
         _scrubbing: false,
         _wasPaused: null,
 
-        controlsMode() { return STORE.get('nxu_cinema_controls', 'nexus') === 'site' ? 'site' : 'nexus'; },
+        controlsMode() { return cinemaControlsMode(); },
 
         _setIcon(el, name, size = 22, label = '') {
             const key = `${name}|${size}|${label}`;
@@ -9225,7 +9684,7 @@
             const subBtn = btn('cc-sub', 'cc', t('aiSubTitle'));
             const fitBtn = btn('cc-fit', 'fit', t('ccFit'));
             const ambientBtn = btn('cc-ambient', 'ambient', t('ccAmbient'));
-            const pipBtn = btn('cc-pip', 'pip', 'Picture-in-Picture');
+            const pipBtn = btn('cc-pip', 'pip', t('ccPip'));
             const fsBtn = btn('cc-fs', 'fullscreen', t('ccFullscreen'));
             row.append(playBtn, backBtn, fwdBtn, vol, time, live, spacer, rateBtn, subBtn, fitBtn, ambientBtn, pipBtn, fsBtn);
             bottom.append(seek, row);
@@ -10537,6 +10996,7 @@
         if (uiElements.btnRate) uiElements.btnRate.style.display = hasMedia ? '' : 'none';
         updateRateButton();
         if (uiElements.btnCinema) uiElements.btnCinema.style.display = hasMedia || STATE.isCinema ? '' : 'none';
+        if (uiElements.btnAutoCinema) { uiElements.btnAutoCinema.style.display = hasMedia || STATE.isCinema ? '' : 'none'; AUTO_CINEMA.paintButton(); }
         if (uiElements.btnBookmark) uiElements.btnBookmark.style.display = hasMedia ? '' : 'none';
         if (uiElements.btnFindMedia) uiElements.btnFindMedia.style.display = hasMedia ? 'none' : '';
         if (uiElements.btnLink) uiElements.btnLink.style.display = hasMedia || connected ? '' : 'none';
@@ -10587,7 +11047,7 @@
         initFirebaseStreaming(STATE.handshakeVerified ? 'nexus_rooms' : (NETWORK.streamNode || 'nexus_rooms'),
             STATE.handshakeVerified ? STATE.topicId : (NETWORK.streamNode === 'nexus_lobbies' ? STATE.lobbyId : STATE.topicId));
         if (STATE.handshakeVerified) {
-            try { if (ydoc && yPresence) ydoc.transact(() => yPresence.set(STATE.userId, { ts: Date.now(), color: STATE.color, viewer: !!STATE.isViewer, nick: STATE.nickname || '', v: NXU_VERSION, r: NXU_RANK, sess: NXU_SESSION }), 'local'); } catch (_) { }
+            try { if (ydoc && yPresence) ydoc.transact(() => yPresence.set(STATE.userId, { ts: Date.now(), color: STATE.color, viewer: !!STATE.isViewer, nick: STATE.nickname || '', v: NXU_VERSION, r: NXU_RANK, sess: NXU_SESSION, hid: !!document.hidden }), 'local'); } catch (_) { }
             sendFirebaseCmd('heartbeat', { ts: Date.now() }, 'nexus_rooms');
             syncServerClock();
             if (RTC.isHost && STATE.connectionMode === 'HTTP_RELAY') RTC.init();
@@ -10596,6 +11056,8 @@
     window.addEventListener('pageshow', (e) => { if (e.persisted) { DEVICE_GUARD.onVisible(60000); reviveConnection('page restore'); } });
     window.addEventListener('pagehide', () => DEVICE_GUARD.onHidden());
     document.addEventListener('visibilitychange', () => {
+        // Tell the room at once whether this device is in the foreground (leadership).
+        if (IS_TOP) try { PROFILE.publish(); } catch (_) { }
         if (document.hidden) { _hiddenSince = Date.now(); DEVICE_GUARD.onHidden(); return; }
         const away = _hiddenSince ? Date.now() - _hiddenSince : 0;
         _hiddenSince = 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kangsicj/nexussync",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "Watch-together userscript: media sync, cinema mode, live AI subtitles, chat bubbles and quick ink for Tampermonkey and iOS Userscripts.",
   "keywords": [
     "userscript",