@kangsicj/dcinsideenhancer 1.1.0 → 1.2.0

package/dist/DCInsideEnhancer.user.js

@@ -2,7 +2,7 @@
 // @name         DCInside Enhancer
 // @name:ko      디시 인핸서
 // @namespace    https://github.com/kangsicj/DCInsideEnhancer
-// @version      1.1.0
+// @version      1.2.0
 // @description  DCInside filter & enhancer — mobile & PC. Block users/words/heads/notices/images & GIFs across posts, infinite list, zoom viewer, theme sync, encrypted multi-device sync.
 // @description:ko 디시인사이드 차단·편의 기능 (모바일·PC) - 유저·단어(제목/본문)·말머리·공지 차단, 같은/비슷한 이미지·움짤 모든 글 차단, 디시콘 제거, 차단 미디어 데이터 절약, 목록 자동 보충·무한 스크롤·뒤로 가기 위치 복원, 스크랩, 이미지 확대뷰 개선, 야간모드 자동 연동, 암호화 기기 간 동기화
 // @author       kangsicj
@@ -75,7 +75,7 @@
     // 0. 설정·상수
     // =========================================================
 
-    const SCRIPT_VERSION = '1.1.0';
+    const SCRIPT_VERSION = '1.2.0';
     const PROJECT_URL = 'https://github.com/kangsicj/DCInsideEnhancer';
     const DONATE_URL = 'https://fairy.hada.io/@jinny#support';
 
@@ -107,6 +107,8 @@
         syncRt: 'dc_sync_rt',
         recent: 'dc_recent_galls',
         recentNative: 'dc_recent_native',
+        searchHistory: 'dc_search_history',
+        blockHits: 'dc_block_hits',
         alarmSeen: 'dc_alarm_marks',
         seenVersion: 'dc_seen_version'
     };
@@ -222,6 +224,9 @@
         hideSilbeAlarm: true,
         alarmBubble: true,
         alarmKeepPolling: true,
+        keyboardShortcuts: true,
+        hoverPreview: true,
+        alarmSystemNotify: false,
         pcFitWidth: true,
         autoHideScrollbar: true,
         scrapIntercept: true,
@@ -275,6 +280,8 @@
         --dc-type-id: #6d538d;
         --dc-shadow: 0 8px 24px rgba(0,0,0,.16);
         --dc-shadow-sm: 0 2px 8px rgba(0,0,0,.12);
+        --dc-raised: #ffffff;
+        --dc-raised-shadow: 0 1px 2px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.08);
         --dc-overlay: rgba(0,0,0,.45);
         --dc-ghost-bg: rgba(128,128,128,.12);
         --dc-ghost-border: rgba(128,128,128,.38);
@@ -300,6 +307,8 @@
         --dc-type-id: #9c86b1;
         --dc-shadow: 0 8px 28px rgba(0,0,0,.55);
         --dc-shadow-sm: 0 2px 10px rgba(0,0,0,.45);
+        --dc-raised: #383b44;
+        --dc-raised-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 1px 2px rgba(0,0,0,.3);
         --dc-overlay: rgba(0,0,0,.6);
         --dc-ghost-bg: rgba(150,150,150,.11);
         --dc-ghost-border: rgba(150,150,150,.30);
@@ -949,6 +958,10 @@
 
         #dc-custom-modal .dc-head-btn {
             flex: 0 0 auto;
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
             height: 30px;
             padding: 0 12px;
             border: 1px solid var(--dc-border);
@@ -957,7 +970,7 @@
             color: var(--dc-text-dim);
             font-size: 12px;
             font-weight: 700;
-            line-height: 28px;
+            line-height: 1;
             cursor: pointer;
         }
 
@@ -978,7 +991,15 @@
 
         #dc-custom-modal .dc-modal-tab {
             flex: 1 1 0;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 3px;
+            min-width: 0;
+            box-sizing: border-box;
             height: 36px;
+            margin: 0;
+            line-height: 1;
             padding: 0 2px;
             border: none;
             border-radius: 9px;
@@ -992,11 +1013,14 @@
         }
 
         #dc-custom-modal .dc-modal-tab.active {
-            background: var(--dc-surface);
+            background: var(--dc-raised);
             color: var(--dc-accent-ink);
-            box-shadow: var(--dc-shadow-sm);
+            box-shadow: var(--dc-raised-shadow);
         }
 
+        #dc-custom-modal .dc-modal-tab .dc-tab-ico { flex: 0 0 auto; font-size: 13px; line-height: 1; }
+        #dc-custom-modal .dc-modal-tab .dc-tab-txt { min-width: 0; overflow: hidden; text-overflow: ellipsis; line-height: 1.2; }
+
         #dc-custom-modal .dc-section-title {
             display: flex;
             align-items: center;
@@ -1830,6 +1854,161 @@
 
         #dc-custom-modal .dc-row.dc-row-new .dc-row-title { font-weight: 800; }
 
+        #dc-preview {
+            position: fixed;
+            z-index: 99997;
+            display: flex;
+            flex-direction: column;
+            box-sizing: border-box;
+            border: 1px solid var(--dc-border);
+            border-radius: 14px;
+            background: var(--dc-surface);
+            color: var(--dc-text);
+            box-shadow: var(--dc-shadow);
+            font-size: 14px;
+            line-height: 1.65;
+            opacity: 0;
+            visibility: hidden;
+            pointer-events: none;
+            transform: translateY(4px);
+            transition: opacity .15s ease, transform .15s ease, visibility 0s linear .15s;
+        }
+
+        #dc-preview.show {
+            opacity: 1;
+            visibility: visible;
+            pointer-events: auto;
+            transform: none;
+            transition: opacity .15s ease, transform .15s ease, visibility 0s;
+        }
+
+        #dc-preview .dc-pv-head {
+            flex: 0 0 auto;
+            padding: 14px 16px 10px;
+            border-bottom: 1px solid var(--dc-border);
+        }
+
+        #dc-preview .dc-pv-title {
+            font-size: 15px;
+            font-weight: 800;
+            line-height: 1.4;
+            word-break: break-all;
+        }
+
+        #dc-preview .dc-pv-meta {
+            margin-top: 3px;
+            color: var(--dc-text-dim);
+            font-size: 12px;
+        }
+
+        #dc-preview .dc-pv-actions {
+            display: flex;
+            flex-wrap: wrap;
+            align-items: center;
+            gap: 6px;
+            margin-top: 8px;
+        }
+
+        #dc-preview .dc-btn {
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            box-sizing: border-box;
+            height: 28px;
+            padding: 0 11px;
+            border: 1px solid var(--dc-border);
+            border-radius: 999px;
+            background: var(--dc-surface-2);
+            color: var(--dc-text);
+            font-size: 12px;
+            font-weight: 700;
+            line-height: 1;
+            text-decoration: none;
+            cursor: pointer;
+        }
+
+        #dc-preview .dc-btn:hover { border-color: var(--dc-accent-ink); color: var(--dc-accent-ink); }
+        #dc-preview .dc-btn.danger-ghost { color: var(--dc-danger-ink); }
+        #dc-preview .dc-btn.dc-pv-close { margin-left: auto; width: 28px; padding: 0; }
+
+        #dc-preview .dc-pv-body {
+            flex: 1 1 auto;
+            min-height: 60px;
+            padding: 12px 16px 18px;
+            overflow-y: auto;
+            overscroll-behavior: contain;
+            word-break: break-word;
+        }
+
+        #dc-preview .dc-pv-body img,
+        #dc-preview .dc-pv-body video { max-width: 100% !important; height: auto !important; border-radius: 6px; }
+        #dc-preview .dc-pv-body p { margin: 0 0 4px; }
+        #dc-preview .dc-pv-body { overflow-x: hidden; overflow-wrap: anywhere; }
+        #dc-preview .dc-pv-body .write_div,
+        #dc-preview .dc-pv-body [style*="width"] { width: auto !important; max-width: 100% !important; }
+        #dc-preview .dc-pv-body * { white-space: normal !important; }
+        #dc-preview .dc-pv-body pre, #dc-preview .dc-pv-body pre * { white-space: pre-wrap !important; }
+        #dc-preview .dc-pv-body a { color: var(--dc-accent-ink); }
+        #dc-preview .dc-pv-body table { max-width: 100%; }
+
+        html.dc-dark #dc-preview .dc-pv-body [style*="background"] { background: transparent !important; }
+        html.dc-dark #dc-preview .dc-pv-body [style*="color: rgb(0, 0, 0)"],
+        html.dc-dark #dc-preview .dc-pv-body [style*="color:#000"],
+        html.dc-dark #dc-preview .dc-pv-body [style*="color: #000"],
+        html.dc-dark #dc-preview .dc-pv-body [style*="color:black"],
+        html.dc-dark #dc-preview .dc-pv-body font[color="#000000"] { color: inherit !important; }
+
+        #dc-preview .dc-pv-loading,
+        #dc-preview .dc-pv-note {
+            padding: 10px 0;
+            color: var(--dc-text-dim);
+            font-size: 13px;
+        }
+
+        #dc-preview .dc-pv-loading::before {
+            content: '';
+            display: inline-block;
+            width: 12px;
+            height: 12px;
+            margin-right: 8px;
+            border: 2px solid var(--dc-border);
+            border-top-color: var(--dc-accent-ink);
+            border-radius: 50%;
+            vertical-align: -1px;
+            animation: dc-spin .7s linear infinite;
+        }
+
+        @keyframes dc-spin { to { transform: rotate(360deg); } }
+
+        #dc-preview .dc-pv-warn {
+            display: flex;
+            flex-wrap: wrap;
+            align-items: center;
+            gap: 8px;
+            padding: 10px 12px;
+            border-radius: 10px;
+            background: var(--dc-danger-soft);
+            color: var(--dc-danger-ink);
+            font-size: 13px;
+            font-weight: 700;
+        }
+
+        #dc-preview .dc-pv-blocked {
+            margin: 6px 0;
+            padding: 14px;
+            border: 1px dashed var(--dc-border);
+            border-radius: 8px;
+            color: var(--dc-text-dim);
+            font-size: 12px;
+            text-align: center;
+        }
+
+        #dc-preview .dc-pv-embed { display: inline-block; margin: 6px 0; font-weight: 700; }
+
+        .dc-pv-anchor { text-decoration: underline !important; text-decoration-color: var(--dc-accent-ink) !important; }
+
+        .dc-key-cursor { outline: 2px solid var(--dc-accent-ink) !important; outline-offset: -2px; background: var(--dc-accent-soft) !important; }
+
         #dc-custom-modal .dc-about {
             margin-top: 14px;
             padding: 12px 13px;
@@ -3234,7 +3413,7 @@
 
     window.addEventListener('beforeunload', noteNetLeaving);
 
-    document.addEventListener('click', event => {
+    window.addEventListener('click', event => {
         const link = event.target instanceof Element ? event.target.closest('a[href]') : null;
 
         if (!link || event.defaultPrevented || event.button > 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) {
@@ -3253,7 +3432,7 @@
             }
         } catch {
         }
-    }, true);
+    });
 
     try {
         if (window.navigation && typeof window.navigation.addEventListener === 'function') {
@@ -5823,6 +6002,38 @@
     // =========================================================
 
     let toastTimer = null;
+    const toastListeners = [];
+
+    const notifyToastListeners = () => toastListeners.forEach(fn => {
+        try {
+            fn();
+        } catch {
+        }
+    });
+
+    const placeToast = toast => {
+        toast.style.bottom = '';
+
+        const fab = document.getElementById('dc-custom-fab');
+
+        if (!fab || getComputedStyle(fab).display === 'none') {
+            return;
+        }
+
+        const f = fab.getBoundingClientRect();
+        const t = toast.getBoundingClientRect();
+
+        if (!f.width || !t.width) {
+            return;
+        }
+
+        const overlapX = t.left < f.right + 6 && t.right > f.left - 6;
+        const overlapY = t.top < f.bottom + 6 && t.bottom > f.top - 6;
+
+        if (overlapX && overlapY) {
+            toast.style.bottom = `${Math.round(window.innerHeight - f.top + 10)}px`;
+        }
+    };
 
     const showToast = (text, { actionLabel = '', onAction = null, duration = 3500 } = {}) => {
         let toast = document.getElementById('dc-toast');
@@ -5851,8 +6062,13 @@
         };
 
         toast.classList.add('show');
+        placeToast(toast);
+        notifyToastListeners();
         clearTimeout(toastTimer);
-        toastTimer = setTimeout(() => toast.classList.remove('show'), duration);
+        toastTimer = setTimeout(() => {
+            toast.classList.remove('show');
+            setTimeout(notifyToastListeners, 220);
+        }, duration);
     };
 
     const offerUndo = (text, undo) => {
@@ -6402,7 +6618,97 @@
 
     const currentPostKey = () => extractPostPath(location.href) || location.pathname;
 
-    const computeBlockReason = el => {
+    const HIT_DAY_MS = 86400000;
+    const hitToday = () => Math.floor(Date.now() / HIT_DAY_MS);
+
+    const readBlockHits = () => {
+        const stored = readObject(STORAGE.blockHits);
+
+        return {
+            since: Number(stored.since) || hitToday(),
+            k: stored.k && typeof stored.k === 'object' && !Array.isArray(stored.k) ? { ...stored.k } : {}
+        };
+    };
+
+    let blockHits = readBlockHits();
+    let blockHitsDirty = !readObject(STORAGE.blockHits).since;
+    let blockHitsTimer = null;
+
+    const blockHitKeys = () => [
+        ...blockedUsers,
+        ...blockedTitles.map(word => `t:${word}`),
+        ...blockedKeywords.map(word => `w:${word}`)
+    ];
+
+    const flushBlockHits = () => {
+        clearTimeout(blockHitsTimer);
+        blockHitsTimer = null;
+
+        if (!blockHitsDirty) {
+            return;
+        }
+
+        blockHitsDirty = false;
+
+        const today = hitToday();
+        const next = {};
+
+        blockHitKeys().forEach(key => {
+            next[key] = Number(blockHits.k[key]) || today;
+        });
+
+        blockHits = { since: blockHits.since, k: next };
+        writeJson(STORAGE.blockHits, blockHits);
+    };
+
+    const scheduleBlockHitsFlush = () => {
+        blockHitsDirty = true;
+
+        if (!blockHitsTimer) {
+            blockHitsTimer = setTimeout(flushBlockHits, 20000);
+        }
+    };
+
+    const noteBlockHit = reason => {
+        if (!reason) {
+            return reason;
+        }
+
+        const keys = reason.type === 'user'
+            ? reason.userKeys || []
+            : reason.type === 'title'
+                ? [`t:${reason.word}`]
+                : reason.type === 'keyword'
+                    ? [blockedTitles.includes(reason.word) && !blockedKeywords.includes(reason.word) ? `t:${reason.word}` : `w:${reason.word}`]
+                    : [];
+        const today = hitToday();
+
+        keys.forEach(key => {
+            if (blockHits.k[key] !== today) {
+                blockHits.k[key] = today;
+                scheduleBlockHitsFlush();
+            }
+        });
+
+        return reason;
+    };
+
+    window.addEventListener('pagehide', flushBlockHits);
+    document.addEventListener('visibilitychange', () => {
+        if (document.visibilityState === 'hidden') {
+            flushBlockHits();
+        }
+    });
+
+    storageWriteListeners.push(key => {
+        if (key === STORAGE.users || key === STORAGE.keywords || key === STORAGE.titles) {
+            scheduleBlockHitsFlush();
+        }
+    });
+
+    const computeBlockReason = el => noteBlockHit(computeBlockReasonRaw(el));
+
+    const computeBlockReasonRaw = el => {
         const hits = buildBlockKeys({
             nickname: el.dataset.dcNick || '',
             ip: el.dataset.dcIp || '',
@@ -9927,6 +10233,7 @@
         });
 
         area.appendChild(seg);
+        renderCleanupHelper(area);
         (renderBlockSections[blockSection] || renderBlockSections.keywords)(area);
     };
 
@@ -10113,6 +10420,15 @@
             off: '사이트 기본 한 줄 알림을 그대로 씁니다.',
             refresh: 'root'
         },
+        {
+            group: 'alarm',
+            key: 'alarmSystemNotify',
+            parent: 'alarmBubble',
+            name: '다른 탭을 볼 때 기기 알림으로도 (PC)',
+            on: '이 탭을 보고 있지 않을 때 디시 알림이 오면 윈도우·맥 알림으로 띄웁니다. 누르면 이 탭으로 돌아와 해당 글로 갑니다. 처음 켤 때 브라우저가 권한을 묻습니다.',
+            off: '이 탭을 볼 때 말풍선으로만 알립니다.',
+            refresh: 'root'
+        },
         {
             group: 'alarm',
             key: 'alarmKeepPolling',
@@ -10138,6 +10454,22 @@
             off: '모든 댓글을 보여 줍니다.',
             refresh: 'all'
         },
+        {
+            group: 'list',
+            key: 'keyboardShortcuts',
+            name: '키보드 단축키 (PC)',
+            on: '목록에서 J/K 로 글을 고르고 Enter 로 엽니다. 글에서는 J/K 로 다음·이전 글, S 스크랩, / 검색창, B 차단 관리, ? 안내.',
+            off: '단축키를 쓰지 않습니다.',
+            refresh: 'none'
+        },
+        {
+            group: 'list',
+            key: 'hoverPreview',
+            name: '제목에 마우스를 올리면 글 미리보기 (PC)',
+            on: '목록 제목 위에 잠깐 머무르면 글 전체를 옆 창에 보여 줍니다. 창 안에서 스크롤해 읽고, 스크랩·작성자 차단도 바로 할 수 있습니다. 차단한 이미지·단어는 미리보기에서도 가립니다. 키보드로 고른 글은 P 로 엽니다.',
+            off: '제목을 눌러야 글을 봅니다.',
+            refresh: 'root'
+        },
         {
             group: 'list',
             key: 'autoFillList',
@@ -10335,6 +10667,20 @@
                     paintAlarmBadge();
                 }
 
+                if (item.key === 'hoverPreview' && settings.hoverPreview === false) {
+                    closePreview();
+                }
+
+                if (item.key === 'alarmSystemNotify' && settings.alarmSystemNotify === true) {
+                    requestSystemNotify().then(granted => {
+                        if (!granted) {
+                            settings.alarmSystemNotify = false;
+                            saveSettings();
+                            rerenderModal();
+                        }
+                    });
+                }
+
                 break;
 
             case 'log':
@@ -11295,7 +11641,11 @@
             '<button id="dc-modal-close-btn" class="dc-head-btn" type="button">닫기</button>' +
             '</div>' +
             `<div class="dc-modal-tabs">${Object.keys(MODAL_VIEWS)
-                .map(key => `<button class="dc-modal-tab" type="button" data-dc-view="${key}">${MODAL_VIEWS[key].tab}</button>`)
+                .map(key => {
+                    const [ico, ...rest] = MODAL_VIEWS[key].tab.split(' ');
+
+                    return `<button class="dc-modal-tab" type="button" data-dc-view="${key}"><span class="dc-tab-ico" aria-hidden="true">${ico}</span><span class="dc-tab-txt">${rest.join(' ')}</span></button>`;
+                })
                 .join('')}</div>` +
             '</div>' +
             '<div id="dc-modal-content"></div>';
@@ -11385,6 +11735,7 @@
         { key: 'heads', label: '말머리', fields: ['heads'] },
         { key: 'scraps', label: '스크랩', fields: ['scraps'] },
         { key: 'recent', label: '최근 갤러리', fields: ['recent'] },
+        { key: 'search', label: '검색 기록', fields: ['search'] },
         { key: 'settings', label: '설정', fields: ['settings'] }
     ];
 
@@ -11552,7 +11903,9 @@
         heads: JSON.parse(JSON.stringify(hiddenHeadMap || {})),
         scraps: scraps.map(item => ({ ...item })),
         settings: syncedSettings(),
-        recent: collectRecentForSync()
+        recent: collectRecentForSync(),
+        search: collectSearchForSync(),
+        hits: collectHitsForSync()
     });
 
     const skippedFields = skip => SYNC_PARTS.filter(part => skip.includes(part.key)).flatMap(part => part.fields);
@@ -11659,7 +12012,9 @@
             heads: mergeHeads(local.heads, base && base.heads, remote && remote.heads),
             scraps: mergeScraps(local.scraps, base && base.scraps, remote && remote.scraps),
             settings: mergeSettings(local.settings, base && base.settings, remote && remote.settings),
-            recent: mergeRecent(local.recent, base && base.recent, remote && remote.recent)
+            recent: mergeRecent(local.recent, base && base.recent, remote && remote.recent),
+            search: mergeSearchHistory(local.search, base && base.search, remote && remote.search),
+            hits: mergeBlockHits(local.hits, remote && remote.hits)
         };
 
         skippedFields(skip).forEach(field => {
@@ -11713,12 +12068,16 @@
         const data = collectSyncData();
 
         delete data.recent;
+        delete data.search;
+        delete data.hits;
 
         return JSON.stringify(data);
     };
 
     const applySyncData = data => {
         const recentChanged = data && 'recent' in data ? applyRecentFromSync(data.recent) : false;
+        const searchChanged = data && 'search' in data ? applySearchFromSync(data.search) : false;
+        const hitsChanged = data && 'hits' in data ? applyHitsFromSync(data.hits) : false;
         const clean = sanitizeBackup({ app: BACKUP_APP, ...data });
         const before = blockSyncData();
 
@@ -11773,7 +12132,7 @@
             refreshAfterBlockChange();
         }
 
-        return changed || recentChanged;
+        return changed || recentChanged || searchChanged || hitsChanged;
     };
 
     const saveSyncUndo = (before, incoming, summary, from) => {
@@ -13134,8 +13493,12 @@
         const nativeKeys = new Set(native.map(recentKeyOf));
         const snapshot = readArray(STORAGE.recentNative).filter(key => typeof key === 'string');
 
-        if (snapshot.length && native.length < RECENT_NATIVE_CAP - 1) {
-            const removed = new Set(snapshot.filter(key => !nativeKeys.has(key)));
+        if (snapshot.length) {
+            const snapSet = new Set(snapshot);
+            const added = native.filter(item => !snapSet.has(recentKeyOf(item))).length;
+            const overflow = Math.max(0, snapshot.length + added - RECENT_NATIVE_CAP);
+            const kept = snapshot.slice(0, snapshot.length - overflow);
+            const removed = new Set(kept.filter(key => !nativeKeys.has(key)));
 
             if (removed.size) {
                 recentGalls = recentGalls.filter(item => !removed.has(recentKeyOf(item)));
@@ -13489,24 +13852,40 @@
         }
 
         const fab = document.getElementById('dc-custom-fab');
-        const rect = fab && fab.offsetParent !== null ? fab.getBoundingClientRect() : null;
+        const rect = fab && getComputedStyle(fab).display !== 'none' ? fab.getBoundingClientRect() : null;
         const vw = window.innerWidth;
         const vh = window.innerHeight;
+        let bottom = 144;
 
         if (rect && rect.width) {
             const onRight = rect.left + rect.width / 2 > vw / 2;
 
             bubbleBox.style.left = onRight ? '' : `${Math.max(8, rect.left)}px`;
             bubbleBox.style.right = onRight ? `${Math.max(8, vw - rect.right)}px` : '';
-            bubbleBox.style.bottom = `${Math.max(8, vh - rect.top + 10)}px`;
+            bottom = Math.max(8, vh - rect.top + 10);
             bubbleBox.classList.toggle('dc-left', !onRight);
         } else {
             bubbleBox.style.left = '';
             bubbleBox.style.right = '15px';
-            bubbleBox.style.bottom = 'calc(144px + env(safe-area-inset-bottom))';
+            bubbleBox.classList.remove('dc-left');
+        }
+
+        const toast = document.getElementById('dc-toast');
+
+        if (toast && toast.classList.contains('show')) {
+            const t = toast.getBoundingClientRect();
+            const box = bubbleBox.getBoundingClientRect();
+
+            if (t.width && t.left < box.right && t.right > box.left) {
+                bottom = Math.max(bottom, vh - t.top + 8);
+            }
         }
+
+        bubbleBox.style.bottom = `${Math.round(bottom)}px`;
     };
 
+    toastListeners.push(() => placeBubbleBox());
+
     const ensureBubbleBox = () => {
         if (bubbleBox && bubbleBox.isConnected) {
             return bubbleBox;
@@ -13654,7 +14033,9 @@
     let alarmWatchTimer = null;
 
     const checkSiteAlarms = () => {
-        if (settings.alarmBubble === false || document.visibilityState === 'hidden') {
+        const away = document.visibilityState === 'hidden' || (typeof document.hasFocus === 'function' && !document.hasFocus());
+
+        if (settings.alarmBubble === false || (document.visibilityState === 'hidden' && !canSystemNotify())) {
             return;
         }
 
@@ -13682,7 +14063,11 @@
             writeAlarmMarks({ shown: latest });
         }
 
-        if (fresh.length) {
+        if (fresh.length && away && canSystemNotify()) {
+            showSystemAlarm(fresh[0], fresh.length - 1);
+        }
+
+        if (fresh.length && document.visibilityState !== 'hidden') {
             showAlarmBubble(fresh[0], fresh.length > ALARM_BUBBLE_MAX ? fresh.length - 1 : 0);
 
             if (fresh.length > 1 && fresh.length <= ALARM_BUBBLE_MAX) {
@@ -13730,9 +14115,24 @@
         }
     };
 
-    const initSiteAlarms = () => {
-        if (alarmWatchTimer || !alarmStorageKeys().length && !siteUserId()) {
+    function initSiteAlarms() {
+        if (alarmWatchTimer || !(IS_MOBILE_SITE || /^gall\.dcinside\.com$/i.test(location.hostname))) {
+            paintAlarmBadge();
+            return;
+        }
+
+        if (!siteUserId() && !alarmStorageKeys().length) {
             paintAlarmBadge();
+
+            if (!initSiteAlarms.retried) {
+                initSiteAlarms.retried = true;
+                [3000, 10000].forEach(delay => setTimeout(() => {
+                    if (!alarmWatchTimer && (siteUserId() || alarmStorageKeys().length)) {
+                        initSiteAlarms();
+                    }
+                }, delay));
+            }
+
             return;
         }
 
@@ -13873,6 +14273,889 @@
     })();
 
     initRecentEarly();
+
+    // =========================================================
+
+    // =========================================================
+
+    const KEY_HELP = 'J/K 다음·이전 글 · Enter 열기 · P 미리보기 · S 스크랩 · / 검색 · B 차단 관리';
+
+    const typingTarget = el =>
+        !!el && (el.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(el.tagName) || !!el.closest?.('[contenteditable="true"]'));
+
+    const visibleListRows = () => {
+        const listEl = pickListElement(document);
+
+        if (!listEl) {
+            return [];
+        }
+
+        return realListItems(listEl).filter(row => row.getClientRects().length && listItemKey(row) && !row.closest('.dc-ui'));
+    };
+
+    let keyCursor = null;
+
+    const moveKeyCursor = step => {
+        const rows = visibleListRows();
+
+        if (!rows.length) {
+            return false;
+        }
+
+        const here = currentPostKey();
+        let index = keyCursor ? rows.indexOf(keyCursor) : -1;
+
+        if (currentPostInfo()) {
+            const at = rows.findIndex(row => listItemKey(row) === here);
+            const target = at >= 0 ? rows[at + step] : step > 0 ? rows[0] : null;
+            const link = target && target.querySelector(POST_LINK_SELECTOR);
+
+            if (link) {
+                location.href = link.href;
+                return true;
+            }
+
+            showToast(step > 0 ? '아래에 더 볼 글이 없습니다' : '첫 글입니다');
+            return true;
+        }
+
+        if (index < 0) {
+            index = rows.findIndex(row => row.getBoundingClientRect().bottom > 60);
+            index = Math.max(0, step > 0 ? index : index);
+        } else {
+            index = Math.min(rows.length - 1, Math.max(0, index + step));
+        }
+
+        keyCursor?.classList.remove('dc-key-cursor');
+        keyCursor = rows[index];
+        keyCursor.classList.add('dc-key-cursor');
+        keyCursor.scrollIntoView({ block: 'nearest' });
+
+        return true;
+    };
+
+    const initKeyboardShortcuts = () => {
+        document.addEventListener('keydown', event => {
+            if (settings.keyboardShortcuts === false || event.defaultPrevented || event.ctrlKey || event.metaKey || event.altKey) {
+                return;
+            }
+
+            if (typingTarget(event.target) || typingTarget(document.activeElement)) {
+                return;
+            }
+
+            if (document.getElementById('dc-custom-modal')?.classList.contains('show')) {
+                return;
+            }
+
+            const key = event.key;
+            let handled = false;
+
+            if (key === 'j' || key === 'J') {
+                handled = moveKeyCursor(1);
+            } else if (key === 'k' || key === 'K') {
+                handled = moveKeyCursor(-1);
+            } else if ((key === 'Enter' || key === 'o' || key === 'O') && keyCursor && keyCursor.isConnected) {
+                const link = keyCursor.querySelector(POST_LINK_SELECTOR);
+
+                if (link) {
+                    location.href = link.href;
+                    handled = true;
+                }
+            } else if (key === 's' || key === 'S') {
+                const info = currentPostInfo();
+
+                if (info) {
+                    toggleScrap(info);
+                    handled = true;
+                }
+            } else if (key === '/') {
+                const box = document.querySelector('.in_keyword, #preSWord, input.js-keyword, input[name="search_keyword"], .top_search input[type="text"]');
+
+                if (box) {
+                    box.focus();
+                    handled = true;
+                }
+            } else if (key === 'b' || key === 'B') {
+                openBlockModal(document.getElementById('dc-custom-fab')?.dataset.dcAlarm ? 'recent' : 'overview');
+                handled = true;
+            } else if ((key === 'p' || key === 'P') && togglePreviewForCursor()) {
+                handled = true;
+            } else if (key === '?') {
+                showToast(`⌨️ ${KEY_HELP}`, { duration: 6000 });
+                handled = true;
+            }
+
+            if (handled) {
+                event.preventDefault();
+            }
+        });
+    };
+
+    // =========================================================
+
+    // =========================================================
+
+    const SEARCH_HISTORY_MAX = 30;
+
+    const readSiteSearchHistory = () => {
+        if (!IS_MOBILE_SITE) {
+            return null;
+        }
+
+        try {
+            const list = JSON.parse(localStorage.getItem('searchHistory') || '[]');
+
+            return Array.isArray(list) ? list.filter(item => typeof item === 'string' && item.trim()).map(item => item.slice(0, 60)) : [];
+        } catch {
+            return [];
+        }
+    };
+
+    const collectSearchForSync = () => {
+        const site = readSiteSearchHistory();
+        const list = site || readArray(STORAGE.searchHistory).filter(item => typeof item === 'string');
+
+        return [...new Set(list)].slice(-SEARCH_HISTORY_MAX);
+    };
+
+    const mergeSearchHistory = (local = [], base, remote) => {
+        if (!Array.isArray(remote)) {
+            return [...new Set(local || [])].slice(-SEARCH_HISTORY_MAX);
+        }
+
+        return mergeList(local || [], Array.isArray(base) ? base : null, remote).slice(-SEARCH_HISTORY_MAX);
+    };
+
+    const applySearchFromSync = list => {
+        if (!Array.isArray(list)) {
+            return false;
+        }
+
+        const next = [...new Set(list.filter(item => typeof item === 'string'))].slice(-SEARCH_HISTORY_MAX);
+
+        if (JSON.stringify(next) === JSON.stringify(collectSearchForSync())) {
+            return false;
+        }
+
+        writeJson(STORAGE.searchHistory, next);
+
+        if (IS_MOBILE_SITE) {
+            try {
+                localStorage.setItem('searchHistory', JSON.stringify(next));
+            } catch {
+            }
+        }
+
+        return true;
+    };
+
+    // =========================================================
+    // 13-4. 차단 목록 정리 도우미 · 기기 알림 · PC 글 미리보기
+    // =========================================================
+
+    const collectHitsForSync = () => {
+        flushBlockHits();
+
+        return { since: blockHits.since, k: { ...blockHits.k } };
+    };
+
+    const mergeBlockHits = (local, remote) => {
+        if (!remote || typeof remote !== 'object' || !remote.k) {
+            return local;
+        }
+
+        const k = { ...(remote.k || {}) };
+
+        Object.entries((local && local.k) || {}).forEach(([key, day]) => {
+            k[key] = Math.max(Number(k[key]) || 0, Number(day) || 0);
+        });
+
+        return { since: Math.min(Number(local && local.since) || hitToday(), Number(remote.since) || hitToday()), k };
+    };
+
+    const applyHitsFromSync = data => {
+        if (!data || typeof data !== 'object' || !data.k) {
+            return false;
+        }
+
+        const merged = mergeBlockHits(blockHits, data);
+
+        if (JSON.stringify(merged) === JSON.stringify(blockHits)) {
+            return false;
+        }
+
+        blockHits = merged;
+        blockHitsDirty = true;
+        flushBlockHits();
+
+        return true;
+    };
+
+    // =========================================================
+
+    // =========================================================
+
+    const CLEANUP_IDLE_DAYS = 60;
+
+    const cleanupSuggestions = () => {
+        flushBlockHits();
+
+        const today = hitToday();
+        const tracked = today - blockHits.since;
+        const idle = [];
+
+        if (tracked >= CLEANUP_IDLE_DAYS) {
+            blockHitKeys().forEach(key => {
+                const day = Number(blockHits.k[key]) || today;
+
+                if (today - day >= CLEANUP_IDLE_DAYS) {
+                    idle.push({ key, days: today - day });
+                }
+            });
+        }
+
+        const redundant = [];
+
+        blockedKeywords.forEach(word => {
+            const cover = blockedKeywords.find(other => other !== word && other.length < word.length && word.includes(other));
+
+            if (cover) {
+                redundant.push({ key: `w:${word}`, cover });
+            }
+        });
+
+        blockedTitles.forEach(word => {
+            const cover = [...blockedKeywords, ...blockedTitles].find(other => other !== word && other.length < word.length && word.includes(other));
+
+            if (cover) {
+                redundant.push({ key: `t:${word}`, cover });
+            }
+        });
+
+        return { idle: idle.sort((a, b) => b.days - a.days), redundant, tracked };
+    };
+
+    const describeHitKey = key => {
+        if (key.startsWith('w:')) {
+            return { label: key.slice(2), kind: '단어' };
+        }
+
+        if (key.startsWith('t:')) {
+            return { label: key.slice(2), kind: '제목 단어' };
+        }
+
+        const parsed = parseBlockKey(key);
+
+        return { label: parsed.value, kind: BLOCK_TYPE_LABELS[parsed.type] || '유저' };
+    };
+
+    const removeBlockKeys = keys => {
+        const before = { users: [...blockedUsers], keywords: [...blockedKeywords], titles: [...blockedTitles] };
+        const drop = new Set(keys);
+
+        blockedUsers = blockedUsers.filter(key => !drop.has(key));
+        blockedKeywords = blockedKeywords.filter(word => !drop.has(`w:${word}`));
+        blockedTitles = blockedTitles.filter(word => !drop.has(`t:${word}`));
+        saveUsers();
+        saveKeywords();
+        saveTitles();
+        refreshAfterBlockChange();
+
+        showToast(`🧹 ${keys.length}개 정리함`, {
+            actionLabel: '되돌리기',
+            duration: 6000,
+            onAction: () => {
+                blockedUsers = before.users;
+                blockedKeywords = before.keywords;
+                blockedTitles = before.titles;
+                saveUsers();
+                saveKeywords();
+                saveTitles();
+                refreshAfterBlockChange();
+                rerenderModal();
+            }
+        });
+    };
+
+    const renderCleanupHelper = area => {
+        const { idle, redundant, tracked } = cleanupSuggestions();
+        const count = idle.length + redundant.length;
+        const waitDays = Math.max(0, CLEANUP_IDLE_DAYS - tracked);
+
+        if (!count && !waitDays) {
+            return;
+        }
+
+        area.appendChild(makeFoldSection({
+            id: 'cleanup',
+            title: `🧹 정리 도우미${count ? '' : ' · 준비 중'}`,
+            count,
+            defaultOpen: false,
+            render: body => {
+                if (waitDays) {
+                    body.appendChild(makeNote(`어떤 차단이 실제로 쓰이는지 기록을 모으는 중입니다. ${waitDays}일 뒤부터 오래 안 걸린 항목을 추천합니다.`));
+                }
+
+                const group = (title, items, meta) => {
+                    if (!items.length) {
+                        return;
+                    }
+
+                    body.appendChild(makeSectionTitle(`${title} · ${items.length}개`));
+                    renderPaged(body, items, item => {
+                        const info = describeHitKey(item.key);
+
+                        return makeRow({
+                            title: info.label,
+                            chip: info.kind,
+                            chipClass: 'scope',
+                            meta: meta(item),
+                            actions: [{ label: '해제', className: 'on', onClick: () => {
+                                removeBlockKeys([item.key]);
+                                rerenderModal();
+                            } }]
+                        });
+                    });
+                    body.appendChild(makeButton(`${title} 모두 해제`, 'wide', () => {
+                        if (confirm(`${title} ${items.length}개를 차단 목록에서 뺄까요? (바로 되돌릴 수 있습니다)`)) {
+                            removeBlockKeys(items.map(item => item.key));
+                            rerenderModal();
+                        }
+                    }));
+                };
+
+                group('필요 없는 단어', redundant, item => `"${item.cover}" 가 이미 걸러 줌`);
+                group(`${CLEANUP_IDLE_DAYS}일 넘게 안 걸린 항목`, idle, item => `${item.days}일 동안 걸린 글·댓글 없음 (모든 기기)`);
+            }
+        }));
+    };
+
+    // =========================================================
+
+    // =========================================================
+
+    const systemNotifySupported = () => typeof window.Notification === 'function';
+
+    const canSystemNotify = () =>
+        settings.alarmSystemNotify === true && systemNotifySupported() && window.Notification.permission === 'granted';
+
+    const showSystemAlarm = (item, extra = 0) => {
+        try {
+            const note = new window.Notification(`디시 알림 · ${item.tag}`, {
+                body: extra ? `${item.text}\n외 ${extra}개` : item.text,
+                tag: `dcx-${item.key}`,
+                silent: false
+            });
+
+            note.onclick = () => {
+                try {
+                    window.focus();
+                } catch {
+                }
+
+                note.close();
+
+                if (extra) {
+                    openBlockModal('recent');
+                } else {
+                    openAlarm(item);
+                }
+            };
+        } catch {
+        }
+    };
+
+    const requestSystemNotify = async () => {
+        if (!systemNotifySupported()) {
+            showToast('이 브라우저는 기기 알림을 지원하지 않습니다');
+            return false;
+        }
+
+        let permission = window.Notification.permission;
+
+        if (permission === 'default') {
+            try {
+                permission = await window.Notification.requestPermission();
+            } catch {
+                permission = 'denied';
+            }
+        }
+
+        if (permission !== 'granted') {
+            showToast('🔕 브라우저에서 이 사이트의 알림을 허용해야 기기 알림을 띄울 수 있습니다', { duration: 6000 });
+            return false;
+        }
+
+        showToast('🔔 다른 탭을 보고 있어도 디시 알림을 기기 알림으로 띄웁니다');
+        return true;
+    };
+
+    // =========================================================
+
+    // =========================================================
+
+    const PREVIEW_DELAY = 450;
+    const PREVIEW_CACHE_MS = 5 * 60 * 1000;
+    const PREVIEW_CACHE_MAX = 30;
+    const PREVIEW_TITLE_SELECTOR = 'table.gall_list td.gall_tit > a:not(.reply_numbox)';
+
+    const previewCache = new Map();
+    let previewEl = null;
+    let previewKey = '';
+    let previewAnchor = null;
+    let previewHoverTimer = null;
+    let previewCloseTimer = null;
+
+    const previewEnabled = () => IS_PC_SITE && settings.hoverPreview !== false;
+
+    const ensurePreviewEl = () => {
+        if (previewEl && previewEl.isConnected) {
+            return previewEl;
+        }
+
+        previewEl = h('div', 'dc-ui');
+        previewEl.id = 'dc-preview';
+        previewEl.setAttribute('role', 'dialog');
+        previewEl.setAttribute('aria-label', '글 미리보기');
+        previewEl.innerHTML =
+            '<div class="dc-pv-head">' +
+            '<div class="dc-pv-title"></div>' +
+            '<div class="dc-pv-meta"></div>' +
+            '<div class="dc-pv-actions"></div>' +
+            '</div>' +
+            '<div class="dc-pv-body"></div>';
+        previewEl.addEventListener('mouseenter', () => clearTimeout(previewCloseTimer));
+        previewEl.addEventListener('mouseleave', () => schedulePreviewClose());
+        document.body.appendChild(previewEl);
+
+        return previewEl;
+    };
+
+    const placePreview = anchor => {
+        const el = ensurePreviewEl();
+        const rect = anchor.getBoundingClientRect();
+        const vw = window.innerWidth;
+        const vh = window.innerHeight;
+        const width = Math.min(640, Math.max(360, Math.round(vw * 0.42)));
+        const height = Math.min(Math.round(vh * 0.78), 860);
+
+        el.style.width = `${width}px`;
+        el.style.maxHeight = `${height}px`;
+
+        let left = rect.right + 16;
+
+        if (left + width > vw - 12) {
+            left = Math.max(12, rect.left - width - 16);
+        }
+
+        if (left + width > vw - 12) {
+            left = Math.max(12, vw - width - 12);
+        }
+
+        const top = Math.min(Math.max(12, rect.top - 60), Math.max(12, vh - height - 12));
+
+        el.style.left = `${Math.round(left)}px`;
+        el.style.top = `${Math.round(top)}px`;
+    };
+
+    const closePreview = () => {
+        clearTimeout(previewHoverTimer);
+        clearTimeout(previewCloseTimer);
+
+        if (previewEl) {
+            previewEl.classList.remove('show');
+            previewEl.querySelector('.dc-pv-body').textContent = '';
+        }
+
+        previewAnchor?.classList.remove('dc-pv-anchor');
+        previewAnchor = null;
+        previewKey = '';
+    };
+
+    const schedulePreviewClose = () => {
+        clearTimeout(previewCloseTimer);
+        previewCloseTimer = setTimeout(closePreview, 260);
+    };
+
+    let previewHref = '';
+
+    const withPostReferrer = (href, fn) => {
+        const back = location.href;
+        let swapped = false;
+
+        try {
+            const target = new URL(href, location.href);
+
+            if (target.origin === location.origin && target.href !== back) {
+                history.replaceState(history.state, '', target.pathname + target.search);
+                swapped = true;
+            }
+        } catch {
+        }
+
+        try {
+            return fn();
+        } finally {
+            if (swapped) {
+                setTimeout(() => {
+                    try {
+                        history.replaceState(history.state, '', back);
+                    } catch {
+                    }
+                }, 60);
+            }
+        }
+    };
+
+    const cleanPreviewBody = source => withPostReferrer(previewHref, () => cleanPreviewBodyRaw(source));
+
+    const cleanPreviewBodyRaw = source => {
+        const body = document.importNode(source, true);
+        let hiddenMedia = 0;
+
+        body.querySelectorAll('script, style, link, iframe, object, embed, form, noscript, .dc-ui').forEach(node => {
+            if (node.tagName === 'IFRAME') {
+                const src = node.getAttribute('src') || '';
+                const link = document.createElement('a');
+
+                link.href = src;
+                link.textContent = '🎬 삽입된 동영상 열기';
+                link.className = 'dc-pv-embed';
+                node.replaceWith(link);
+            } else {
+                node.remove();
+            }
+        });
+
+        body.querySelectorAll('*').forEach(node => {
+            [...node.attributes].forEach(attr => {
+                if (/^on/i.test(attr.name) || (/^(href|src)$/i.test(attr.name) && /^\s*javascript:/i.test(attr.value))) {
+                    node.removeAttribute(attr.name);
+                }
+            });
+        });
+
+        body.querySelectorAll('img, video').forEach(media => {
+            const lazy = media.getAttribute('data-original') || media.getAttribute('data-src');
+
+            if (lazy && !media.getAttribute('src')) {
+                media.setAttribute('src', lazy);
+            }
+
+            const candidates = collectMediaCandidates(media);
+
+            if (isDcconElement(media, candidates)) {
+                if (settings.blockDccon !== false) {
+                    media.remove();
+                }
+
+                return;
+            }
+
+            const blocked = findBlockedMediaKey(resolveMediaIds(media, candidates));
+
+            if (blocked) {
+                const stub = document.createElement('div');
+
+                stub.className = 'dc-pv-blocked';
+                stub.textContent = '🚫 차단한 이미지';
+                (media.closest('a') || media).replaceWith(stub);
+                hiddenMedia += 1;
+                return;
+            }
+
+            media.removeAttribute('loading');
+            media.removeAttribute('width');
+            media.removeAttribute('height');
+
+            if (media.tagName === 'VIDEO') {
+                media.setAttribute('controls', '');
+                media.setAttribute('preload', 'metadata');
+                media.removeAttribute('autoplay');
+            }
+        });
+
+        body.querySelectorAll('a[href]').forEach(link => {
+            link.target = '_blank';
+            link.rel = 'noopener noreferrer';
+        });
+
+        return { body, hiddenMedia };
+    };
+
+    const readPreviewDoc = (html, key) => {
+        const doc = new DOMParser().parseFromString(html, 'text/html');
+        const source = doc.querySelector('.write_div') || doc.querySelector(POST_BODY_SELECTOR);
+        const head = doc.querySelector('.gallview_head');
+
+        if (!source) {
+            return { missing: true };
+        }
+
+        const writer = head?.querySelector('.gall_writer');
+        const text = normalizeWord(`${head?.querySelector('.title_subject')?.textContent || ''} ${source.textContent}`).slice(0, BODY_TEXT_LIMIT);
+        const word = findWord(blockedKeywords, text);
+
+        if (key) {
+            bodyScanCache[key] = { s: bodyScanSignature(), w: word, m: '', t: Date.now() };
+            saveBodyScanSoon();
+        }
+
+        return {
+            title: cleanText(head?.querySelector('.title_subject')?.textContent || ''),
+            head: cleanText(head?.querySelector('.title_headtext')?.textContent || '').replace(/^\[|\]$/g, ''),
+            nick: writer?.getAttribute('data-nick') || cleanText(writer?.querySelector('.nickname')?.textContent || ''),
+            ip: writer?.getAttribute('data-ip') || '',
+            code: writer?.getAttribute('data-uid') || '',
+            date: head?.querySelector('.gall_date')?.getAttribute('title') || cleanText(head?.querySelector('.gall_date')?.textContent || ''),
+            stats: (cleanText(head?.querySelector('.fr')?.textContent || '').match(/(조회|추천|댓글)\s*[\d,]+/g) || []).join(' · '),
+            source,
+            word
+        };
+    };
+
+    const renderPreview = (data, href, key) => {
+        const el = ensurePreviewEl();
+
+        previewHref = href;
+        const titleEl = el.querySelector('.dc-pv-title');
+        const metaEl = el.querySelector('.dc-pv-meta');
+        const actions = el.querySelector('.dc-pv-actions');
+        const bodyEl = el.querySelector('.dc-pv-body');
+
+        actions.textContent = '';
+        bodyEl.textContent = '';
+        bodyEl.scrollTop = 0;
+        el.scrollTop = 0;
+
+        if (data.missing) {
+            titleEl.textContent = '본문을 불러올 수 없습니다';
+            metaEl.textContent = '삭제됐거나 성인 인증이 필요한 글입니다.';
+        } else {
+            titleEl.textContent = `${data.head ? `[${data.head}] ` : ''}${data.title || '(제목 없음)'}`;
+            metaEl.textContent = [data.nick && `${data.nick}${data.ip ? `(${data.ip})` : ''}`, data.date, data.stats].filter(Boolean).join(' · ');
+
+            if (data.word) {
+                const note = h('div', 'dc-pv-warn', `🚫 본문에 차단 단어 "${data.word}" 가 있어 가렸습니다${settings.prefetchBodies !== false ? ' · 목록에서도 가려집니다' : ''}`);
+                const reveal = makeButton('그래도 보기', 'mini', () => {
+                    note.remove();
+                    bodyEl.appendChild(cleanPreviewBody(data.source).body);
+                });
+
+                note.appendChild(reveal);
+                bodyEl.appendChild(note);
+            } else {
+                const { body, hiddenMedia } = cleanPreviewBody(data.source);
+
+                if (hiddenMedia) {
+                    bodyEl.appendChild(h('div', 'dc-pv-note', `차단한 이미지 ${hiddenMedia}개를 뺐습니다`));
+                }
+
+                bodyEl.appendChild(body);
+            }
+        }
+
+        const open = h('a', 'dc-btn mini', '글 열기');
+
+        open.href = href;
+        actions.appendChild(open);
+
+        if (!data.missing && key) {
+            const match = /[?&]id=([^&]+)&no=(\d+)/.exec(href) || [];
+            const kind = /\/mgallery\//.test(href) ? 'M' : /\/mini\//.test(href) ? 'N' : /\/person\//.test(href) ? 'P' : 'G';
+            const info = match[1] ? normalizeScrap({ k: kind, id: decodeURIComponent(match[1]), no: match[2], t: data.title, g: '', d: Date.now() }) : null;
+
+            if (info && isValidScrap(info)) {
+                const scrapBtn = makeButton(isScrapped(info) ? '📌 스크랩됨' : '📌 스크랩', 'mini', () => {
+                    toggleScrap(info);
+                    scrapBtn.textContent = isScrapped(info) ? '📌 스크랩됨' : '📌 스크랩';
+                });
+
+                actions.appendChild(scrapBtn);
+            }
+
+            const userKey = data.code ? `id::${data.code}` : data.ip ? `ip::${data.ip}` : data.nick ? `nick::${data.nick}` : '';
+
+            if (userKey && !blockedUsers.includes(userKey)) {
+                actions.appendChild(makeButton('🚫 작성자 차단', 'mini danger-ghost', () => {
+                    blockedUsers = sortUserKeys([...blockedUsers, userKey]);
+                    saveUsers();
+                    refreshAfterBlockChange();
+                    closePreview();
+                    offerUndo(`✓ ${describeHitKey(userKey).kind} ${describeHitKey(userKey).label} 차단`, () => {
+                        blockedUsers = blockedUsers.filter(item => item !== userKey);
+                        saveUsers();
+                        refreshAfterBlockChange();
+                    });
+                }));
+            }
+        }
+
+        const close = makeButton('✕', 'mini dc-pv-close', closePreview);
+
+        close.setAttribute('aria-label', '미리보기 닫기');
+        actions.appendChild(close);
+    };
+
+    const showPreviewFor = async anchor => {
+        if (!previewEnabled() || !anchor || !anchor.isConnected) {
+            return;
+        }
+
+        const row = anchor.closest('tr');
+
+        if (row && (row.classList.contains('dc-user-blocked') && !row.classList.contains('dc-user-revealed') || row.classList.contains('dc-head-hidden'))) {
+            return;
+        }
+
+        const href = anchor.href;
+        const key = extractPostPath(href);
+
+        if (!key) {
+            return;
+        }
+
+        previewAnchor?.classList.remove('dc-pv-anchor');
+        previewAnchor = anchor;
+        previewKey = key;
+        anchor.classList.add('dc-pv-anchor');
+
+        const el = ensurePreviewEl();
+
+        placePreview(anchor);
+        el.classList.add('show');
+
+        const cached = previewCache.get(key);
+
+        if (cached && Date.now() - cached.at < PREVIEW_CACHE_MS) {
+            renderPreview(cached.data, href, key);
+            return;
+        }
+
+        const paused = netPausedUntil();
+
+        el.querySelector('.dc-pv-title').textContent = cleanText(anchor.textContent);
+        el.querySelector('.dc-pv-meta').textContent = '';
+        el.querySelector('.dc-pv-actions').textContent = '';
+        el.querySelector('.dc-pv-body').textContent = '';
+
+        if (paused) {
+            el.querySelector('.dc-pv-body').appendChild(h('div', 'dc-pv-note', `⏸ 디시 요청 제한 중이라 ${Math.max(1, Math.ceil((paused - Date.now()) / 60000))}분 뒤에 미리볼 수 있습니다`));
+            return;
+        }
+
+        el.querySelector('.dc-pv-body').appendChild(h('div', 'dc-pv-loading', '불러오는 중…'));
+
+        try {
+            const html = await siteFetchText(href, { credentials: 'same-origin', cache: 'no-cache' });
+            const data = readPreviewDoc(html, key);
+
+            previewCache.set(key, { at: Date.now(), data });
+
+            while (previewCache.size > PREVIEW_CACHE_MAX) {
+                previewCache.delete(previewCache.keys().next().value);
+            }
+
+            if (previewKey === key) {
+                renderPreview(data, href, key);
+
+                if (data.word && settings.prefetchBodies !== false) {
+                    refreshAfterBlockChange();
+                }
+            }
+        } catch (error) {
+            if (previewKey !== key) {
+                return;
+            }
+
+            const body = el.querySelector('.dc-pv-body');
+
+            body.textContent = '';
+            body.appendChild(h('div', 'dc-pv-note', error instanceof NetPausedError
+                ? '⏸ 디시 요청 제한 중이라 잠시 뒤에 미리볼 수 있습니다'
+                : '불러오지 못했습니다. 잠시 뒤 다시 올려 보세요.'));
+        }
+    };
+
+    const initHoverPreview = () => {
+        if (!IS_PC_SITE) {
+            return;
+        }
+
+        document.addEventListener('mouseover', event => {
+            if (!previewEnabled() || (event.pointerType && event.pointerType !== 'mouse')) {
+                return;
+            }
+
+            const anchor = event.target instanceof Element ? event.target.closest(PREVIEW_TITLE_SELECTOR) : null;
+
+            if (!anchor || anchor.closest('.dc-ui')) {
+                return;
+            }
+
+            clearTimeout(previewCloseTimer);
+
+            if (anchor === previewAnchor) {
+                return;
+            }
+
+            clearTimeout(previewHoverTimer);
+            previewHoverTimer = setTimeout(() => showPreviewFor(anchor), PREVIEW_DELAY);
+        });
+
+        document.addEventListener('mouseout', event => {
+            const anchor = event.target instanceof Element ? event.target.closest(PREVIEW_TITLE_SELECTOR) : null;
+
+            if (!anchor || (event.relatedTarget instanceof Node && anchor.contains(event.relatedTarget))) {
+                return;
+            }
+
+            clearTimeout(previewHoverTimer);
+
+            if (previewEl && previewEl.classList.contains('show')) {
+                schedulePreviewClose();
+            }
+        });
+
+        document.addEventListener('mousedown', event => {
+            if (previewEl && previewEl.classList.contains('show') && !(event.target instanceof Node && previewEl.contains(event.target))) {
+                closePreview();
+            }
+        }, true);
+
+        window.addEventListener('scroll', () => {
+            if (previewEl && previewEl.classList.contains('show') && previewAnchor && !previewEl.matches(':hover')) {
+                closePreview();
+            }
+        }, { passive: true });
+
+        document.addEventListener('keydown', event => {
+            if (event.key === 'Escape' && previewEl && previewEl.classList.contains('show')) {
+                closePreview();
+            }
+        });
+    };
+
+    const togglePreviewForCursor = () => {
+        if (!previewEnabled()) {
+            return false;
+        }
+
+        if (previewEl && previewEl.classList.contains('show')) {
+            closePreview();
+            return true;
+        }
+
+        const anchor = keyCursor && keyCursor.isConnected ? keyCursor.querySelector(PREVIEW_TITLE_SELECTOR.replace('table.gall_list ', '')) : null;
+
+        if (!anchor) {
+            return false;
+        }
+
+        showPreviewFor(anchor);
+        return true;
+    };
     // =========================================================
     // 14. 플로팅 버튼
     // =========================================================
@@ -14860,6 +16143,8 @@
         initSync();
         initRecent();
         initSiteAlarms();
+        initKeyboardShortcuts();
+        initHoverPreview();
         restoreListSnapshot();
         processElements();