/* ========================================== */
/* Dark Mode - Glimmer OS                     */
/* Clean rebuild v2 - Variable-driven         */
/* ========================================== */

/* === 1. Global containers === */
body.dark-mode {
    background: var(--dm-bg-deep) !important;
    --bg-body: #0A0A0A;
    --bg-screen: #0A0A0A;
    --bg-color: #0A0A0A;
    --app-bg: #0A0A0A;
    --surface-card: #1a1a1a;
    --card-bg: #1a1a1a;
    --drawer-bg: rgba(20, 20, 24, 0.98);
    --drawer-border: rgba(255, 255, 255, 0.08);
    --drawer-item-bg: rgba(255, 255, 255, 0.06);
    --drawer-item-active-bg: rgba(255, 255, 255, 0.1);
    --dock-bg: rgba(20, 20, 24, 0.95);
}
body.dark-mode .phone-container {
    background: var(--dm-bg-deep) !important;
}
body.dark-mode .phone-frame {
    background: var(--dm-bg-deep) !important;
}



/* 主页使用自己的颜色系统 */
body.dark-mode .taro-home,
body.dark-mode #home {
    background: #0A0A0A !important;
    color: #EFEFEF !important;
    --card-white: #1A1A1C;
    --card-black: #2A2A2D;
    --text-black: #EFEFEF;
    --text-grey: #7A7A7A;
    --border-line: #333333;
}

/* === 3. Unified cards === */
body.dark-mode .card,
body.dark-mode .taro-setting-card,
body.dark-mode .taro-bento-item,
body.dark-mode .settings-group,
body.dark-mode .persona-card,
body.dark-mode .being-card,
body.dark-mode .swiper-slide,
body.dark-mode .swipe-card,
body.dark-mode .list-item,
body.dark-mode .grid-card,
body.dark-mode .macaron-card,
body.dark-mode .macaron-item,
body.dark-mode .feed-card,
body.dark-mode .moment-card {
    background: var(--surface-card) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: var(--card-shadow) !important;
    color: var(--text-main) !important;
}

/* 主页卡片使用自己的样式 */
body.dark-mode .taro-home .card,
body.dark-mode .taro-home .taro-card {
    background: #1A1A1C !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
    color: #EFEFEF !important;
}

body.dark-mode .taro-home .profile-card,
body.dark-mode .taro-home .cal-card,
body.dark-mode .taro-home .music-card,
body.dark-mode .taro-home .photo-card,
body.dark-mode .taro-home .wallet-card,
body.dark-mode .taro-home .quote-card,
body.dark-mode .taro-home .app-sq,
body.dark-mode .taro-home .bw-companion,
body.dark-mode .taro-home .bw-whisper,
body.dark-mode .taro-home .bento-tall,
body.dark-mode .taro-home .bento-sm-black,
body.dark-mode .taro-home .bento-sm-white {
    background: #1A1A1C !important;
}
body.dark-mode .card:hover,
body.dark-mode .list-item:hover,
body.dark-mode .grid-card:hover,
body.dark-mode .macaron-card:hover,
body.dark-mode .macaron-item:hover {
    background: var(--dm-bg-hover) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

/* === 4. Chat list === */
body.dark-mode .chat-list-container,
body.dark-mode #view-chats {
    background: var(--bg-body) !important;
}
body.dark-mode .chat-list-header {
    background: var(--bg-body) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}
body.dark-mode .echo-collage {
    background: var(--bg-body) !important;
    border-bottom: 1px solid var(--border-color) !important;
}
body.dark-mode .chat-list-items {
    background: var(--bg-body) !important;
}
body.dark-mode .chat-item {
    background: var(--chatitem-bg) !important;
    color: var(--chatitem-name-color) !important;
    --echo-text-main: var(--chatitem-name-color);
    --echo-text-sub: var(--chatitem-time-color);
}
body.dark-mode .chat-item.pinned {
    background: var(--chatitem-pin-bg) !important;
}
body.dark-mode .chat-item .chat-name { color: var(--chatitem-name-color) !important; }
body.dark-mode .chat-item .chat-time { color: var(--chatitem-time-color) !important; }
body.dark-mode .chat-item .chat-msg { color: var(--chatitem-preview-color) !important; }
body.dark-mode .chat-item.unread .chat-msg { color: var(--chatitem-preview-unread) !important; }

body.night .chat-item.unread::before {
    box-shadow: 0 0 12px var(--chatitem-unread-bg), 0 0 0 6px var(--chatlist-bg) !important;
}

/* === 5. Headers & Navbars === */
body.dark-mode .header,
body.dark-mode .app-header,
body.dark-mode .taro-nav-bar,
body.dark-mode #echo .header,
body.dark-mode .chat-list-header {
    background: var(--glass-bg) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
    box-shadow: none !important;
}

/* === 6. Dock & Bottom nav === */
body.dark-mode .taro-dock-container,
body.dark-mode .dock,
body.dark-mode .dock-glass,
body.dark-mode #echo .nav-island,
body.dark-mode .echo-dock {
    background: var(--dock-bg, #1A1A1C);
    border-top: 1px solid var(--dock-border, #333333);
}
body.dark-mode .dock-icon,
body.dark-mode .taro-dock-icon {
    color: var(--text-secondary) !important;
}
body.dark-mode .dock-icon.active,
body.dark-mode .taro-dock-icon.active {
    color: var(--text-main) !important;
}

/* === 7. Text hierarchy === */
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, body.dark-mode h4,
body.dark-mode .header-title,
body.dark-mode .taro-page-title,
body.dark-mode .app-title,
body.dark-mode .nav-title,
body.dark-mode .chat-header-name,
body.dark-mode .feed-text,
body.dark-mode .moment-text,
body.dark-mode .comment-text,
body.dark-mode .stat-value,
body.dark-mode .macaron-label,
body.dark-mode .grid-label,
body.dark-mode .feed-meta h4,
body.dark-mode .moment-author-name,
body.dark-mode .director-role-name {
    color: var(--text-main) !important;
}
body.dark-mode .chat-list-meta span,
body.dark-mode .stat-label,
body.dark-mode .hero-sub {
    color: var(--text-secondary) !important;
}
body.dark-mode .nav-icon,
body.dark-mode .back-btn,
body.dark-mode .add-btn,
body.dark-mode .menu-btn {
    color: var(--text-main) !important;
}
body.dark-mode .back-btn:hover,
body.dark-mode .add-btn:hover,
body.dark-mode .menu-btn:hover {
    background: var(--dm-bg-hover) !important;
}
body.dark-mode .badge,
body.dark-mode .tag,
body.dark-mode .chat-list-badge,
body.dark-mode .nav-dot {
    color: #fff !important;
}

/* === 8. Input & Forms === */
/* 🛡️ 同按钮：照影(#curtain-overlay)表单控件有自己的明/暗样式（curtain.css），
   不能被全局通杀刷成半透明白底，归照影自己的夜间体系接管。 */
body.dark-mode input:not([type="range"]):not(.rp-amt-input):not(.rp-count-input):not(#curtain-overlay *),
body.dark-mode textarea:not(#curtain-overlay *),
body.dark-mode select:not(#curtain-overlay *),
body.dark-mode .search-input,
body.dark-mode .input-box,
body.dark-mode .taro-code-area {
    background: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}
body.dark-mode input:not(#curtain-overlay *):focus,
body.dark-mode textarea:not(#curtain-overlay *):focus,
body.dark-mode select:not(#curtain-overlay *):focus {
    border-color: rgba(255, 255, 255, 0.12) !important;
    background: rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode input:not(#curtain-overlay *)::placeholder,
body.dark-mode textarea:not(#curtain-overlay *)::placeholder {
    color: var(--text-tertiary) !important;
}

/* === 9. Buttons === */
/* 🛡️ 排除照影(#curtain-overlay)：照影有自己的夜间体系（#curtain-phone[data-theme]），
   不能被全局 button 通杀刷成 var(--surface-card)（旧深蓝残留）。照影按钮全由 curtain.css 接管。 */
body.dark-mode button:not(.btn-primary):not([class*="primary"]):not(.taro-save-btn):not(.open-btn):not(.cc-btn):not(.rp-count-btn):not(.send-rp-btn):not(.transfer-btn-champagne):not(.pay-confirm-btn):not(#curtain-overlay *) {
    background: var(--surface-card) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}
body.dark-mode button:not(.btn-primary):not([class*="primary"]):not(#curtain-overlay *):hover {
    background: var(--dm-bg-hover) !important;
}
body.dark-mode .circle-btn,
body.dark-mode .btn-round {
    background: var(--surface-card) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}
body.dark-mode .circle-btn:hover,
body.dark-mode .btn-round:hover {
    background: var(--dm-bg-hover) !important;
}

/* === 10. Echo Chat === */
body.dark-mode #app-echo,
body.dark-mode #echo {
    background: var(--bg-screen) !important;
}
body.dark-mode #msg-container,
body.dark-mode #echo-chat-area {
    background: transparent !important;
}
/* AI bubble */
body.dark-mode .msg-row.other body.dark-mode .msg-bubble,
body.dark-mode .speech-bubble,
body.dark-mode .msg-row.other .speech-bubble {
    background: var(--bubble-other-bg);
    border: 1px solid var(--navbar-border);
    box-shadow: var(--bubble-other-shadow);
    color: var(--bubble-other-text);
}
body.dark-mode #echo .bubble,
body.dark-mode #echo .bubble * {
    color: inherit !important;
}
/* User bubble */
body.dark-mode .msg-row.me .msg-bubble {
    background: var(--bubble-me-bg);
    border: 1px solid var(--navbar-border);
    box-shadow: var(--bubble-me-shadow);
    color: var(--bubble-me-text);
}
/* Name tags: handled by CSS variables (--name-tag-color, --name-tag-bg) */
body.dark-mode .action-text {
    color: var(--aside-color, #78909c) !important;
    opacity: 0.8;
}
body.dark-mode .msg-row.archived { opacity: 0.5; }
body.dark-mode .archived-bubble,
body.dark-mode .archived-content { color: var(--text-secondary) !important; }
body.dark-mode .affection-feedback {
    background: rgba(20, 30, 45, 0.95) !important;
    box-shadow: var(--card-shadow) !important;
}
body.dark-mode .affection-slider {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.08), rgba(255, 107, 129, 0.25)) !important;
}

/* === 11. Echo input & send  ——  改用主题变量跟随用户选的主题，删 !important 让 echo-nav-tags 主题块能接管 === */
body.dark-mode .input-pill {
    background: var(--dock-input-bg);
    border: 1px solid var(--dock-border);
    box-shadow: none;
}
body.dark-mode #chat-input { color: var(--dock-input-text-color, var(--text-main)); }
body.dark-mode #chat-input::placeholder { color: var(--dock-input-placeholder, var(--text-tertiary)); }
body.dark-mode #echo-send-icon {
    background: var(--dock-send-bg, #E5E5E5);
    border: none;
}
body.dark-mode #echo-send-icon i { color: var(--dock-send-icon-color, #000000); }

/* 拓展键（+按钮）夜间：黑底白字，跟背景区分开 */
body.dark-mode #echo-plus-btn {
    background: rgba(255,255,255,0.08);
    border: none;
}
body.dark-mode #echo-plus-btn i { color: #E5E5E5; }
body.dark-mode .btn-at { color: var(--text-secondary) !important; }
body.dark-mode .btn-ai { color: var(--dock-btn-icon-color); }

/* @ popup */
body.dark-mode .at-popup {
    background: var(--glass-bg) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: var(--dm-shadow-lg) !important;
}
body.dark-mode .at-member { color: var(--text-main) !important; }
body.dark-mode .at-member:hover { background: var(--dm-bg-hover) !important; }

/* === 12. Echo navbar (single chat) === */
body.dark-mode .single-chat-page .echo-navbar .cover {
    background: linear-gradient(180deg, var(--bg-color) 0%, var(--bg-screen) 100%);
}
body.dark-mode .single-chat-page .echo-navbar .cover::after { background: var(--bg-screen); }
body.dark-mode .single-chat-page .echo-navbar .particle { background: var(--topbar-btn-bg); }
body.dark-mode .single-chat-page .echo-navbar .fbtn {
    background: var(--topbar-btn-bg);
    border-color: var(--navbar-border);
}
body.dark-mode .single-chat-page .echo-navbar .fbtn .nav-icon { color: var(--topbar-btn-icon-color); }
body.dark-mode .single-chat-page .echo-navbar .hero-img { border-color: var(--navbar-border); }
body.dark-mode .single-chat-page .echo-navbar .hero-info {
    background: var(--bg-screen) !important;
    border-bottom-color: var(--border-color) !important;
}
body.dark-mode .single-chat-page .echo-navbar .hero-name-row .nav-title { color: var(--topbar-name-color); }
body.dark-mode .single-chat-page .echo-navbar .hero-sub { color: var(--topbar-meta-color); }

/* Story rail — handled by CSS variables (--rail-bg, --rail-border, --rail-avatar-ring-seen) */

/* === 13. Director panel === */
body.dark-mode .director-panel {
    background: var(--glass-bg) !important;
    border-top: 1px solid var(--border-color) !important;
}
body.dark-mode .director-role-item {
    background: var(--surface-card) !important;
    border: 1px solid var(--border-color) !important;
}
body.dark-mode .director-role-item.active {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* === 14. Sidebar  ——  改用主题变量跟随用户选的主题，删 !important 让 echo-nav-tags 的去毛玻璃接管 === */
body.dark-mode .sidebar,
body.dark-mode #echo-sidebar {
    background: var(--glass-bg);
    border-left: 1px solid var(--border-color);
    box-shadow: -5px 0 30px rgba(0, 0, 0, 0.5);
}
body.dark-mode .sidebar-mask { background: rgba(0, 0, 0, 0.7); }

/* === 15. Moments / Feed === */
body.dark-mode .moments-page .header { background: transparent !important; }
body.dark-mode .moments-cover-img { opacity: 0.7; filter: brightness(0.8) contrast(1.1); }
body.dark-mode .feed-delete-btn { color: var(--text-tertiary) !important; }
body.dark-mode .feed-delete-btn:hover { color: #ff6b6b !important; }
body.dark-mode .moments-empty-state { color: var(--text-secondary) !important; }
body.dark-mode .moments-user-float-name { text-shadow: 0 2px 12px rgba(0, 0, 0, 0.9) !important; }

/* === 16. Floating music === */
body.dark-mode .music-float,
body.dark-mode .float-music-card {
    background: var(--glass-bg) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}

/* === 17. Worldbook ===
   暗色规则主体在 worldbook-styles.css 里走变量切换，
   这里补强：覆盖 night / data-theme / html[data-theme] 全选择器，强制全黑底，
   并把会形成"上下分色带"的下半墙/书架/光晕在夜间一律压到统一底色。 */
body.dark-mode #worldbook,
body.night #worldbook,
[data-theme="dark"] #worldbook,
html[data-theme="dark"] #worldbook {
    background: #161616 !important;
}
body.dark-mode #worldbook .wb-lower-wall,
body.night #worldbook .wb-lower-wall,
[data-theme="dark"] #worldbook .wb-lower-wall,
html[data-theme="dark"] #worldbook .wb-lower-wall {
    background: #161616 !important;
}
body.dark-mode #worldbook .wb-book-ledge,
body.night #worldbook .wb-book-ledge,
[data-theme="dark"] #worldbook .wb-book-ledge,
html[data-theme="dark"] #worldbook .wb-book-ledge {
    background: #161616 !important;
    border-bottom-color: rgba(255, 255, 255, 0.04) !important;
    box-shadow: none !important;
}
body.dark-mode #worldbook .wb-ambient-glow,
body.night #worldbook .wb-ambient-glow,
[data-theme="dark"] #worldbook .wb-ambient-glow,
html[data-theme="dark"] #worldbook .wb-ambient-glow {
    background: transparent !important;
}

/* === 18. iOS Confirm === */
body.dark-mode .custom-confirm-overlay { background: rgba(0, 0, 0, 0.6) !important; }
body.dark-mode .custom-confirm-box {
    background: #1A1A1A !important;
    box-shadow: var(--dm-shadow-lg) !important;
}
body.dark-mode .cc-content { color: var(--text-main) !important; border-bottom-color: var(--border-color) !important; }
body.dark-mode .cc-btn { color: var(--text-secondary) !important; }
body.dark-mode .cc-btn.cancel { border-right-color: var(--border-color) !important; }
body.dark-mode .cc-btn.confirm { color: #0a84ff !important; }
body.dark-mode .cc-btn:hover { background: var(--dm-bg-hover) !important; }

/* === 19. Red packet === */
body.dark-mode .packet-modal-mask { background: rgba(0, 0, 0, 0.85) !important; }
body.dark-mode .red-envelope-card {
    background: linear-gradient(135deg, rgba(211, 84, 0, 0.9), rgba(192, 57, 43, 0.9)) !important;
}
body.dark-mode .open-btn { background: rgba(255, 255, 255, 0.95) !important; color: #c0392b !important; }
body.dark-mode .details-page { background: var(--bg-screen) !important; }
body.dark-mode .details-header { background: rgba(20, 30, 45, 0.9) !important; border-bottom: 1px solid var(--border-color) !important; }
body.dark-mode .back-link { color: #0a84ff !important; }
body.dark-mode .big-amount { color: #ff6b6b !important; }
body.dark-mode .hb-bubble {
    background: linear-gradient(135deg, rgba(255, 182, 193, 0.2), rgba(255, 160, 180, 0.2)) !important;
    border: 2px solid rgba(255, 100, 150, 0.3) !important;
}
body.dark-mode .hb-bubble .text-main { color: #ffb6c1 !important; }
body.dark-mode .hb-bubble .text-sub { color: rgba(255, 182, 193, 0.7) !important; }
body.dark-mode .hb-bubble.opened { background: rgba(30, 30, 35, 0.6) !important; border-color: rgba(100, 100, 100, 0.2) !important; }

/* === 20. Transfer card === */
body.dark-mode .gold-card {
    background: linear-gradient(135deg, rgba(20, 30, 45, 0.95), rgba(10, 10, 15, 0.95)) !important;
    border: 1px solid rgba(255, 215, 0, 0.2) !important;
}
body.dark-mode .gold-card .gc-header { color: #ffd700 !important; }
body.dark-mode .gold-card .gc-amount { color: var(--text-main) !important; }
body.dark-mode .gold-card .gc-note { color: var(--text-secondary) !important; }
body.dark-mode .gold-card.received { background: linear-gradient(135deg, rgba(20, 40, 20, 0.95), rgba(10, 30, 10, 0.95)) !important; border-color: rgba(0, 255, 0, 0.2) !important; }
body.dark-mode .gold-card.refunded { background: linear-gradient(135deg, rgba(30, 30, 40, 0.95), rgba(20, 30, 45, 0.95)) !important; border-color: rgba(150, 150, 200, 0.2) !important; }
body.dark-mode .gold-card.expired { background: linear-gradient(135deg, rgba(30, 20, 20, 0.95), rgba(20, 10, 10, 0.95)) !important; border-color: rgba(255, 100, 100, 0.2) !important; }

/* === 21. Video / Reader / Location === */
body.dark-mode .player-modal { background: rgba(10, 18, 28, 0.98) !important; }
body.dark-mode .pm-header, body.dark-mode .pm-footer {
    background: #1A1A1A !important;
    border-color: var(--border-color) !important;
    color: var(--text-main) !important;
}
body.dark-mode .pm-input { background: rgba(255, 255, 255, 0.05) !important; color: var(--text-main) !important; border: 1px solid var(--border-color) !important; }
body.dark-mode .dm-msg { background: rgba(255, 255, 255, 0.1) !important; color: var(--text-main) !important; }
body.dark-mode .reader-overlay { background: rgba(10, 18, 28, 0.98) !important; }
body.dark-mode .reader-header { background: #1A1A1A !important; border-bottom: 1px solid var(--border-color) !important; color: var(--text-main) !important; }
body.dark-mode .reader-content { background: #1A1A1A !important; color: var(--text-main) !important; }
body.dark-mode .comment-bubble { background: rgba(30, 45, 60, 0.9) !important; color: var(--text-main) !important; }
body.dark-mode .loc-panel { background: var(--bg-screen) !important; }
body.dark-mode .loc-header { background: #1A1A1A !important; border-bottom: 1px solid var(--border-color) !important; }
body.dark-mode .loc-back { color: #0a84ff !important; }
body.dark-mode .btn-send-loc { background: #0a84ff !important; color: #fff !important; }
body.dark-mode .loc-map { background: rgba(255, 255, 255, 0.04) !important; border: 1px solid var(--border-color) !important; }
body.dark-mode .loc-card-bubble { background: rgba(255, 255, 255, 0.06) !important; border: 1px solid var(--border-color) !important; }
body.dark-mode .loc-info .loc-title { color: var(--text-main) !important; }
body.dark-mode .loc-info .loc-desc { color: var(--text-secondary) !important; }
body.dark-mode .loc-info .loc-dist { color: #7db8e0 !important; }
body.dark-mode .cyber-dice {
    background: rgba(20, 30, 45, 0.9) !important;
    border: 2px solid rgba(100, 100, 255, 0.4) !important;
}

/* === 22. Quote / Clean drawer / Expansion / Action sheet === */
body.dark-mode #quote-preview-bar { background: #1A1A1A !important; border-top: 1px solid var(--border-color) !important; }
body.dark-mode #quote-preview-bar .quote-preview-sender { color: var(--text-main) !important; }
body.dark-mode #quote-preview-bar .quote-preview-text { color: var(--text-secondary) !important; }
body.dark-mode .msg-quote-ref { background: rgba(255, 255, 255, 0.04) !important; border-left: 2px solid rgba(255, 255, 255, 0.1) !important; }
body.dark-mode .msg-quote-ref .quote-sender { color: var(--text-secondary) !important; }
body.dark-mode .msg-quote-ref .quote-text { color: var(--text-secondary) !important; }
/* clean-drawer/item/ex-item handled by CSS variables (--drawer-bg, --drawer-item-bg, --drawer-icon-color) */
body.dark-mode .action-sheet {
    background: var(--glass-bg) !important;
    border: 1px solid var(--border-color) !important;
}

/* === 23. Swipe cards === */
body.dark-mode .pagination-dot { background: rgba(255, 255, 255, 0.15) !important; }
body.dark-mode .pagination-dot.active { background: var(--text-main) !important; }
body.dark-mode .sc-avatar { border-color: rgba(255, 255, 255, 0.1) !important; }
body.dark-mode .sc-name, body.dark-mode .sc-badge { color: var(--text-main) !important; }
body.dark-mode .user-avatar-box.active,
body.dark-mode .npc-avatar-box.active { border-color: rgba(var(--dm-accent-rgb), 0.5) !important; }

/* === 24. Toast === */
body.dark-mode .glimmer-toast-aurora,
body[data-theme="dark"] .glimmer-toast-aurora {
    background: #1A1A1A !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: var(--card-shadow) !important;
}
body.dark-mode .glimmer-toast-aurora span,
body[data-theme="dark"] .glimmer-toast-aurora span {
    color: var(--text-main) !important;
    -webkit-text-fill-color: var(--text-main) !important;
    background: none !important;
}
body.dark-mode .settings-toast,
body[data-theme="dark"] .settings-toast {
    background: #1A1A1A !important;
    border: 1px solid var(--border-color) !important;
}
body.dark-mode #call-view .toast,
body[data-theme="dark"] #call-view .toast {
    background: #1A1A1A !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-main) !important;
}

/* === 25. Inline style overrides === */
body.dark-mode .msg-bubble div[style*="color:#333"],
body.dark-mode .msg-bubble div[style*="color: #333"],
body.dark-mode .msg-bubble div[style*="color:#555"],
body.dark-mode .msg-bubble div[style*="color: #555"] {
    color: var(--text-main) !important;
}
body.dark-mode .msg-bubble div[style*="color:#666"],
body.dark-mode .msg-bubble div[style*="color: #666"] {
    color: var(--text-secondary) !important;
}

/* === 26. Starfield (main page only, pure CSS) === */
body.dark-mode .phone-frame { position: relative; }
body.dark-mode .phone-frame::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 0;
    box-shadow:
        120px 80px 0 0.5px rgba(255,255,255,0.6),
        280px 150px 0 1.2px rgba(255,255,255,0.7),
        50px 300px 0 1.5px rgba(255,255,255,0.6),
        320px 400px 0 0.4px rgba(255,255,255,0.6),
        180px 500px 0 1.5px rgba(255,255,255,0.7),
        200px 50px 0 1px rgba(255,255,255,0.55),
        30px 180px 0 0.3px rgba(255,255,255,0.4),
        350px 260px 0 1px rgba(255,255,255,0.55),
        100px 420px 0 0.3px rgba(255,255,255,0.4),
        260px 550px 0 1px rgba(255,255,255,0.55),
        70px 120px 0 0.2px rgba(255,255,255,0.25),
        150px 220px 0 0.2px rgba(255,255,255,0.2),
        300px 100px 0 0.2px rgba(255,255,255,0.25),
        240px 350px 0 0.2px rgba(255,255,255,0.2),
        90px 480px 0 0.2px rgba(255,255,255,0.25);
    animation: dm-twinkle 4s ease-in-out infinite alternate;
    will-change: opacity;
}
@keyframes dm-twinkle {
    0% { opacity: 0.5; }
    100% { opacity: 1; }
}

/* === 27. Echo app specific overrides === */
body.dark-mode #app-echo,
body.dark-mode #app-echo #echo {
    --bg-color: #000000;
    --glass-bg: #1A1A1A;
    --glass-border: rgba(255, 255, 255, 0.06);
    --nav-text: var(--text-secondary);
    --me-text: var(--dm-accent);
    background: var(--bg-color) !important;
}
/* chat-list-items and #echo .chat-item background handled by CSS variables */
body.dark-mode #echo .c-input {
    background: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-main) !important;
}
body.dark-mode #echo .menu-option:active {
    background: var(--dm-bg-active) !important;
}
body.dark-mode #echo .fab-center.rotate {
    background: rgba(255, 255, 255, 0.1) !important;
}

/* Echo chat page background  ——  跟主题色，不再硬锁深蓝 */
body.dark-mode .single-chat-page,
body.dark-mode .group-chat-page {
    background: var(--bg-color);
}

/* Nav island in Echo */
body.dark-mode #echo .nav-island {
    background: var(--glass-bg) !important;
}

/* === 28. Persons/Contact/Beings pages === */
body.dark-mode .persons-page,
body.dark-mode .beings-page {
    background: #000000 !important;
}

/* Header overrides for app pages */
body.dark-mode .persons-page .header,
body.dark-mode .beings-page .header {
    background: #1A1A1A !important;
}
/* 🔧 千面编辑页顶栏：被全局 body.dark-mode .header 的 var(--glass-bg) !important
   漏成浅色（--glass-bg 在千面作用域无夜间覆盖会回退浅色），且 L611 的深色覆盖只写了
   .persons-page 列表页、漏了编辑页 #persons-edit。这里用模块自己的 --ps-bg-base
   （夜间 #0A0A0C，与编辑页正文同底）抢回，不写死色值。 */
body.dark-mode #persons-edit .header,
body.dark-mode .personas-edit-page .header,
body.night #persons-edit .header,
body.night .personas-edit-page .header {
    background: var(--ps-bg-base) !important;
}

/* Generic white bg overrides */
body.dark-mode .setting-section,
body.dark-mode .setting-item,
body.dark-mode .edit-modal,
body.dark-mode .panel-content,
body.dark-mode .content-area {
    background: transparent !important;
    color: var(--text-main) !important;
}

/* === 29. Fix main page to pure black === */
body.dark-mode .taro-home {
    background: #0A0A0A !important;
}
body.dark-mode #home {
    background: #0A0A0A !important;
}

/* === 30. Greeting & status bar === */
body.dark-mode #taro-greeting,
body.dark-mode div#taro-greeting {
    color: var(--text-secondary) !important;
}
body.dark-mode .taro-status-header {
    color: var(--text-main) !important;
}
body.dark-mode .taro-date-big {
    color: var(--text-main) !important;
}
body.dark-mode .taro-save-btn {
    background: var(--color-cocoa-dark, #8d6e63) !important;
    color: #fff !important;
}
body.dark-mode .taro-mode-option.active {
    background: rgba(100, 100, 140, 0.8) !important;
}
body.dark-mode .full-screen-edit-page {
    background: var(--bg-screen) !important;
}
body.dark-mode .save-bar,
body.dark-mode .taro-save-bar {
    background: var(--glass-bg) !important;
}
/* 🔧 千面编辑页 save-bar：上面全局规则用 var(--glass-bg)，但 #persons-edit 在 app-echo 作用域外，
   --glass-bg 回退成 :root 白色 → 底部白条。恢复模块自己的 --ps-bg-base 渐变（夜间 #0A0A0C）。
   与已修的 #persons-edit .header 白底同源（都是 --glass-bg !important 泄漏）。 */
body.dark-mode #persons-edit .save-bar,
body.night #persons-edit .save-bar,
body.dark-mode .personas-edit-page .save-bar,
body.night .personas-edit-page .save-bar {
    background: linear-gradient(to top, var(--ps-bg-base) 80%, transparent) !important;
}
body.dark-mode .filter-bar {
    background: var(--glass-bg) !important;
}

/* === 31. Echo overrides (high specificity)
       —— 删掉 !important，让 echo-nav-tags.css 的主题夜间块可以接管。
       未选主题时这里仍提供 fallback；选了主题则被
       body.dark-mode #app-echo[data-echo-theme="..."] 覆盖。 */
body.dark-mode #app-echo {
    --bg-color: #000000;
    --echo-nav-glass: #1A1A1A;
    background: #000000;
}
body.dark-mode #app-echo,
body.dark-mode #app-echo[data-echo-skin] {
    --echo-nav-text: var(--text-main);
    --echo-nav-btn-bg: rgba(255, 255, 255, 0.12);
    --echo-nav-btn-bg-active: rgba(255, 255, 255, 0.2);
}
body.dark-mode .chat-list-header h2,
body.dark-mode .chat-list-header .subtitle,
body.dark-mode .chat-list-header .back-btn,
body.dark-mode .chat-list-header .menu-btn {
    color: var(--text-main) !important;
}
body.dark-mode .chat-list-header .back-btn,
body.dark-mode .chat-list-header .menu-btn {
    background: rgba(255, 255, 255, 0.12) !important;
}
/* chat-list-items and story-rail background handled by CSS variables */

/* Echo bottom nav */
body.dark-mode #app-echo .nav-island,
body.dark-mode #echo .nav-island {
    background: #1A1A1A !important;
    border: 1px solid var(--border-color) !important;
}
body.dark-mode #echo .nav-tab {
    color: var(--text-secondary) !important;
}
body.dark-mode #echo .nav-tab.active,
body.dark-mode #echo .nav-tab i {
    color: var(--text-main) !important;
}

/* Expansion panel white bg fix */
body.dark-mode .expansion-panel,
body.dark-mode .ex-panel,
body.dark-mode .ex-container,
body.dark-mode .ex-grid {
    background: #1A1A1A !important;
    border: 1px solid var(--border-color) !important;
}
body.dark-mode .ex-item {
    background: transparent !important; /* 新版式：底色移入圆形徽章 */
    border: none !important;
    color: var(--text-main) !important;
}
/* 默认徽章：黑灰底 + 中性灰图标（功能色项 icon-red/green/gold 不在此列，避免深蓝/被通杀）*/
body.dark-mode .ex-item:not(.icon-red):not(.icon-green):not(.icon-gold) i {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #d6d6d6 !important;
}
body.dark-mode .ex-item span {
    color: var(--text-main) !important;
}

/* Echo dock bottom bar  ——  跟主题色，不再写死深蓝 */
body.dark-mode .echo-dock {
    background: var(--dock-bg);
    border-top: 1px solid var(--dock-border);
}

/* Chat input area */
body.dark-mode #echo .c-input,
body.dark-mode .c-input {
    background: rgba(255, 255, 255, 0.05) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}

/* Profile page / header in chat */
body.dark-mode .echo-navbar .hero-info,
body.dark-mode .p-bio {
    background: transparent !important;
    color: var(--text-main) !important;
}

/* === 32. Echo bottom bars (high specificity fix) === */
body.dark-mode #echo .nav-island,
body.dark-mode #app-echo .nav-island {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5) !important;
}
body.dark-mode .echo-dock,
body.dark-mode #app-echo .echo-dock {
    background: var(--dock-bg);
    border-top: 1px solid var(--dock-border);
}
body.dark-mode .btn-round {
    background: rgba(255, 255, 255, 0.08) !important;
    box-shadow: none !important;
    color: var(--text-main) !important;
}
body.dark-mode .btn-round i {
    color: var(--text-main) !important;
}

/* === 33. clean-drawer bg handled by CSS variable --drawer-bg === */

/* === 34. ex-item dark handled by CSS variables (--drawer-item-bg, --drawer-icon-color) === */

/* === 35. Voice bubble === */
body.dark-mode body.dark-mode .voice-bubble.other {
    background: var(--bubble-voice-other-bg);
    color: var(--bubble-voice-other-text);
}
body.dark-mode .voice-bubble.other i,
body.dark-mode .voice-bubble.other .voice-static,
body.dark-mode .voice-bubble.other .voice-waves,
body.dark-mode .voice-bubble.other .voice-dur {
    color: var(--bubble-voice-other-text);
}

/* === 36. Global white bg killers === */
body.dark-mode .content-area,
body.dark-mode .panel-content,
body.dark-mode .setting-section,
body.dark-mode .setting-item,
body.dark-mode .edit-modal,
body.dark-mode .app-content {
    background: transparent !important;
    color: var(--text-main) !important;
}

/* === 37. Starfield enhancement === */
body.dark-mode .phone-frame::after {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 0;
    box-shadow:
        15px 40px 0 1px rgba(255,255,255,0.5),
        45px 250px 0 1px rgba(255,255,255,0.45),
        160px 60px 0 1px rgba(255,255,255,0.5),
        340px 180px 0 1px rgba(255,255,255,0.45),
        80px 350px 0 1px rgba(255,255,255,0.4),
        290px 450px 0 1px rgba(255,255,255,0.45),
        200px 280px 0 1px rgba(255,255,255,0.4),
        370px 80px 0 1px rgba(255,255,255,0.5),
        130px 520px 0 1px rgba(255,255,255,0.4),
        310px 330px 0 1px rgba(255,255,255,0.45);
    animation: dm-twinkle2 5s ease-in-out infinite alternate;
    will-change: opacity;
}
@keyframes dm-twinkle2 {
    0% { opacity: 0.3; }
    100% { opacity: 0.8; }
}

/* === 38. Remaining text color fixes === */
body.dark-mode .story-name,
body.dark-mode #echo .feed-text,
body.dark-mode #echo .comment-item,
body.dark-mode .persona-name,
body.dark-mode .being-name,
body.dark-mode .persona-role,
body.dark-mode .being-role,
body.dark-mode .taro-card-title,
body.dark-mode .taro-section-header,
body.dark-mode .taro-app-name,
body.dark-mode .taro-bi-text,
body.dark-mode .taro-pc-name,
body.dark-mode .taro-pc-role,
body.dark-mode .taro-wp-label,
body.dark-mode .taro-font-item {
    color: var(--text-main) !important;
}

/* Secondary text */
body.dark-mode .chat-list-meta span,
body.dark-mode .persona-desc,
body.dark-mode .being-desc,
body.dark-mode p.desc,
body.dark-mode .sub-text,
body.dark-mode .meta-text {
    color: var(--text-secondary) !important;
}

/* All generic icons */
body.dark-mode i:not([class*="ri-"]):not([style]) {
    color: var(--text-main) !important;
}

/* === 39. Bottom nav text === */
body.dark-mode #echo .nav-tab span {
    color: inherit !important;
}
body.dark-mode .taro-dock-label {
    color: var(--text-secondary) !important;
}
body.dark-mode .taro-dock-label.active {
    color: var(--text-main) !important;
}

/* === 40. Starfield fix - override ::before/::after kill === */
body.dark-mode .phone-frame::before {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    pointer-events: none !important;
    z-index: 0 !important;
    box-shadow:
        120px 80px 0 0.5px rgba(255,255,255,0.6),
        280px 150px 0 1.2px rgba(255,255,255,0.7),
        50px 300px 0 1.5px rgba(255,255,255,0.6),
        320px 400px 0 0.4px rgba(255,255,255,0.6),
        180px 500px 0 1.5px rgba(255,255,255,0.7),
        200px 50px 0 1px rgba(255,255,255,0.55),
        30px 180px 0 0.3px rgba(255,255,255,0.4),
        350px 260px 0 1px rgba(255,255,255,0.55),
        100px 420px 0 0.3px rgba(255,255,255,0.4),
        260px 550px 0 1px rgba(255,255,255,0.55),
        70px 120px 0 0.2px rgba(255,255,255,0.25),
        150px 220px 0 0.2px rgba(255,255,255,0.2),
        300px 100px 0 0.2px rgba(255,255,255,0.25),
        240px 350px 0 0.2px rgba(255,255,255,0.2),
        90px 480px 0 0.2px rgba(255,255,255,0.25) !important;
    animation: dm-twinkle 4s ease-in-out infinite alternate !important;
    will-change: opacity !important;
}
body.dark-mode .phone-frame::after {
    display: block !important;
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    pointer-events: none !important;
    z-index: 0 !important;
    box-shadow:
        15px 40px 0 1px rgba(255,255,255,0.5),
        45px 250px 0 1px rgba(255,255,255,0.45),
        160px 60px 0 1px rgba(255,255,255,0.5),
        340px 180px 0 1px rgba(255,255,255,0.45),
        80px 350px 0 1px rgba(255,255,255,0.4),
        290px 450px 0 1px rgba(255,255,255,0.45),
        200px 280px 0 1px rgba(255,255,255,0.4),
        370px 80px 0 1px rgba(255,255,255,0.5),
        130px 520px 0 1px rgba(255,255,255,0.4),
        310px 330px 0 1px rgba(255,255,255,0.45) !important;
    animation: dm-twinkle2 5s ease-in-out infinite alternate !important;
    will-change: opacity !important;
}

/* === 41. Echo nav-island variable override === */
body.dark-mode #echo,
body.dark-mode #app-echo {
    --echo-nav-glass: #1A1A1A !important;
}

/* === 42. Echo bottom Chats/Moments bar === */
body.dark-mode #echo .s-1,
body.dark-mode #echo .nav-tab {
    color: var(--text-secondary) !important;
}
body.dark-mode #echo .nav-tab.active {
    color: var(--dm-accent) !important;
}

/* === 43. Echo-tabs handled by CSS variables (--tabs-bg, --tabs-border, --tab-icon-color, --tab-active-color) === */

/* === 44+45. Chat list bg + story rail handled by CSS variables === */

/* === 46. Fix stars visibility - higher z-index === */
body.dark-mode .phone-frame::before,
body.dark-mode .phone-frame::after {
    z-index: 1 !important;
}
body.dark-mode .phone-frame > .screen-content {
    z-index: 2 !important;
    position: relative !important;
}

/* === 47. Kill bubble backdrop-filter blur === */
body.dark-mode .speech-bubble,
body.dark-mode .msg-bubble,
body.dark-mode .msg-row .speech-bubble,
body.dark-mode .msg-row .msg-bubble,
body.dark-mode .msg-row.other .speech-bubble,
body.dark-mode .msg-row.me .speech-bubble,
body.dark-mode .msg-row.other .msg-bubble,
body.dark-mode .msg-row.me .msg-bubble {
}

/* === 48. Stars fix - screen-content transparent so stars show through === */
body.dark-mode .screen-content {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    --text-main: var(--text-primary, #f1f5f9);
    --text-sub: var(--text-secondary, #94a3b8);
}

/* Let pages keep their own bg but slightly transparent for star peek */
body.dark-mode #home,
body.dark-mode .taro-home {
    background: #0A0A0A !important;
}

/* === 49. Narration text fix for dark mode === */
body.dark-mode .narration {
    text-shadow: none;
    color: var(--narr-ai);
}
body.dark-mode .narration::before,
body.dark-mode .narration::after {
    background: currentColor !important;
    opacity: 0.2 !important;
}
body.dark-mode .action-text {
    color: var(--aside-color, #78909c) !important;
}
body.dark-mode .novel-narration {
    color: var(--aside-color, #78909c) !important;
}
body.dark-mode .narration.thought {
    color: var(--aside-color, #78909c) !important;
    opacity: 0.75;
}

/* === 50. Echo navbar + topbar dark mode === */
body.dark-mode .single-chat-page .echo-navbar {
    background: var(--navbar-bg);
}
body.dark-mode .single-chat-page .topbar .tb-back i {
    color: var(--topbar-btn-icon-color);
}
body.dark-mode .single-chat-page .topbar .tb-weather {
    background: var(--topbar-btn-bg);
}
body.dark-mode .single-chat-page .topbar .tb-menu i {
    color: var(--topbar-btn-icon-color);
}
body.dark-mode .single-chat-page .ava-wrap img {
    border-color: var(--navbar-border);
}
body.dark-mode .single-chat-page .person-row .p-name {
    color: var(--topbar-name-color);
}
body.dark-mode .single-chat-page .person-row .p-status {
    color: var(--topbar-meta-color);
}

/* === 51. Echo sidebar dark mode（统一跟主题变量走，不再深蓝硬编码）=== */
body.dark-mode #echo-sidebar {
    background: var(--glass-bg, #1A1A1A) !important;
    border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.5) !important;
}
body.dark-mode #sidebar-mask {
    background: rgba(0, 0, 0, 0.55) !important;
}
body.dark-mode #echo-sidebar .sb-header {
    background: var(--glass-bg, #1A1A1A) !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode #echo-sidebar .sb-header-title {
    color: var(--text-main) !important;
    text-shadow: none !important;
}
body.dark-mode #echo-sidebar .sb-close {
    background: rgba(255, 255, 255, 0.08) !important;
    color: var(--text-main) !important;
}
body.dark-mode #echo-sidebar .sb-close i {
    color: var(--text-main) !important;
}
body.dark-mode .sidebar-content,
body.dark-mode .glass-content,
body.dark-mode #echo-sidebar .sidebar-content {
    color: var(--text-main) !important;
}
body.dark-mode .sidebar-header,
body.dark-mode .glass-header {
    background: #1A1A1A !important;
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--text-main) !important;
}
body.dark-mode .sidebar-header h3 {
    color: var(--text-main) !important;
}
body.dark-mode .sidebar-section-title {
    color: var(--text-secondary) !important;
}
body.dark-mode .sidebar-setting-row {
    color: var(--text-main) !important;
    border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}
body.dark-mode .glass-card {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: var(--text-main) !important;
}
body.dark-mode #echo-sidebar select,
body.dark-mode #echo-sidebar input,
body.dark-mode #echo-sidebar textarea {
    background: rgba(255, 255, 255, 0.06) !important;
    color: var(--text-main) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
body.dark-mode #echo-sidebar label,
body.dark-mode #echo-sidebar span,
body.dark-mode #echo-sidebar p,
body.dark-mode #echo-sidebar div {
    color: var(--text-main) !important;
}

/* === 53. Stars - on #home directly (not behind opaque pages) === */
body.dark-mode #home::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    pointer-events: none !important;
    z-index: 50 !important;
    box-shadow:
        120px 80px 0 1.5px rgba(255,255,255,0.7),
        280px 150px 0 1.2px rgba(255,255,255,0.6),
        50px 300px 0 1.5px rgba(255,255,255,0.55),
        320px 400px 0 1.2px rgba(255,255,255,0.7),
        180px 500px 0 1.5px rgba(255,255,255,0.6),
        200px 50px 0 1px rgba(255,255,255,0.5),
        30px 180px 0 1px rgba(255,255,255,0.55),
        350px 260px 0 1px rgba(255,255,255,0.5),
        100px 420px 0 1px rgba(255,255,255,0.55),
        260px 550px 0 1px rgba(255,255,255,0.5) !important;
    animation: dm-twinkle 4s ease-in-out infinite alternate !important;
}
body.dark-mode #home::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    pointer-events: none !important;
    z-index: 50 !important;
    box-shadow:
        15px 40px 0 1px rgba(255,255,255,0.45),
        45px 250px 0 1px rgba(255,255,255,0.4),
        160px 60px 0 1px rgba(255,255,255,0.45),
        340px 180px 0 1px rgba(255,255,255,0.4),
        80px 350px 0 1px rgba(255,255,255,0.35),
        290px 450px 0 1px rgba(255,255,255,0.4),
        200px 280px 0 1px rgba(255,255,255,0.35),
        370px 80px 0 1px rgba(255,255,255,0.45),
        130px 520px 0 1px rgba(255,255,255,0.35),
        310px 330px 0 1px rgba(255,255,255,0.4) !important;
    animation: dm-twinkle2 5s ease-in-out infinite alternate !important;
}

/* === 54. Real DOM stars animation === */
body.dark-mode .star-dot {
    position: absolute;
    border-radius: 50%;
    background: white;
    pointer-events: none;
    animation: star-blink var(--dur) ease-in-out infinite alternate;
}
@keyframes star-blink {
    0% { opacity: 0.15; transform: scale(0.8); }
    50% { opacity: 1; transform: scale(1.1); box-shadow: 0 0 4px 1px rgba(255,255,255,0.4); }
    100% { opacity: 0.3; transform: scale(0.9); }
}

/* === Moments 朋友圈暗色 === */
body.dark-mode .moments-area,
body.night .moments-area {
    background: #1A1A1A !important;
}
body.dark-mode .moment-card,
body.dark-mode #echo .feed-card,
body.night .moment-card,
body.night #echo .feed-card {
    background: rgba(30, 40, 55, 0.85) !important;
    border-color: rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #echo .feed-text,
body.night #echo .feed-text {
    color: #c8d6e5 !important;
}
body.dark-mode #echo .comment-section,
body.night #echo .comment-section {
    background: rgba(20, 28, 42, 0.9) !important;
    color: #c8d6e5 !important;
}
body.dark-mode #echo .c-input,
body.night #echo .c-input {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #echo .c-text,
body.night #echo .c-text {
    color: #94a3b8 !important;
}
body.dark-mode #echo .action-btn,
body.night #echo .action-btn {
    color: #94a3b8 !important;
}
body.dark-mode #echo .feed-actions,
body.night #echo .feed-actions {
    border-top-color: rgba(255, 255, 255, 0.06) !important;
}
/* .echo-tabs background handled by CSS variables (--tabs-bg, --tabs-border) */
body.dark-mode .echo-tab-item,
body.night .echo-tab-item {
    color: #94a3b8 !important;
}
body.dark-mode .echo-tab-item.active,
body.night .echo-tab-item.active {
    color: #d6d6d6 !important;
}
body.dark-mode .moments-user-float-name,
body.night .moments-user-float-name {
    color: #e2e8f0 !important;
}

/* ========================================================================== */
/* 🌙 全局夜间模式 - 杀掉所有字体阴影 */
/* ========================================================================== */
body.dark-mode *,
body.night * {
    text-shadow: none !important;
}
/* 保护需要发光的元素（冰蓝光晕等） */
body.dark-mode .glow-text,
body.dark-mode .neon-text,
body.night .glow-text,
body.night .neon-text {
    text-shadow: 0 0 8px rgba(var(--dm-accent-rgb), 0.4) !important;
}

/* ========================================================================== */
/* 🌙 智能玻璃：固定面板blur，滚动元素半透明实色 */
/* ========================================================================== */

/* 固定面板 → 毛玻璃 */
body.dark-mode #echo-sidebar,
body.dark-mode .modal-box,
body.dark-mode .action-sheet,
body.dark-mode .together-lock-modal,
body.dark-mode .feed-panel,
body.dark-mode .group-chat-selector-overlay > div,
body.dark-mode .manage-chats-overlay > div,
body.dark-mode .list-menu-overlay > div,
body.dark-mode .all-characters-modal-overlay > div,
body.dark-mode #modal-settings-starhub > div,
body.dark-mode #modal-notif-starhub > div,
body.night #echo-sidebar,
body.night .modal-box,
body.night .action-sheet,
body.night .feed-panel,
body.night .group-chat-selector-overlay > div,
body.night .manage-chats-overlay > div,
body.night .list-menu-overlay > div,
body.night .all-characters-modal-overlay > div {
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

/* 滚动卡片 → 不用blur防卡 */
/* ========== Starhub 夜间模式 ========== */

/* 主容器背景 - 夜间底色由 starhub-new.css 的 --sh-bg 派生（跟随用户主题色），网格也跟主题色 */
body.dark-mode #starhub,
body.night #starhub {
    background-color: var(--sh-bg) !important;
    background-image:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--user-theme-color) 8%, transparent) 0%, transparent 60%),
        linear-gradient(color-mix(in srgb, var(--user-theme-color) 4%, transparent) 1px, transparent 1px),
        linear-gradient(90deg, color-mix(in srgb, var(--user-theme-color) 4%, transparent) 1px, transparent 1px) !important;
    background-size: 100% 100%, 24px 24px, 24px 24px !important;
}

/* 毛玻璃卡片 - 使用CSS变量 */
body.dark-mode #starhub .glass,
body.night #starhub .glass {
    background: var(--sh-glass-bg) !important;
    border-color: var(--sh-glass-border) !important;
    box-shadow: var(--sh-glass-shadow) !important;
}

/* 输入框 */
body.dark-mode #starhub .input-glass,
body.night #starhub .input-glass {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #f0f0f0 !important;
}

/* 标签 */
body.dark-mode #starhub .chip,
body.night #starhub .chip {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #e2e8f0 !important;
}

body.dark-mode #starhub .chip.active,
body.night #starhub .chip.active {
    background: rgba(184, 148, 125, 0.3) !important;
    border-color: #B8947D !important;
    color: #fff !important;
}

/* 按钮 */
body.dark-mode #starhub .btn-login-refined,
body.night #starhub .btn-login-refined {
    background: rgba(184, 148, 125, 0.8) !important;
    color: #fff !important;
}

body.dark-mode #starhub .btn-icon,
body.night #starhub .btn-icon {
    color: #e2e8f0 !important;
}

body.dark-mode #starhub .btn-icon:active,
body.night #starhub .btn-icon:active {
    background: rgba(255, 255, 255, 0.1) !important;
}

/* 导航栏 - 使用CSS变量 */
body.dark-mode #starhub .nav-header,
body.night #starhub .nav-header {
    background: var(--sh-glass-bg) !important;
    border-bottom-color: rgba(255, 255, 255, 0.05) !important;
}

/* 模态弹窗 */
body.dark-mode #starhub .modal-mask,
body.night #starhub .modal-mask {
    background: rgba(0, 0, 0, 0.7) !important;
}

body.dark-mode #starhub .modal-body,
body.night #starhub .modal-body {
    background: rgba(26, 26, 26, 0.95) !important;
    color: #e2e8f0 !important;
}

/* 帖子卡片 */
body.dark-mode .post-card,
body.night .post-card {
    background: rgba(30, 30, 35, 0.6) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* === 星汇下拉菜单/选项 强制暗色+字体
   ⚠️ 排除 #starhub-tab-bar：它是底部固定 tab，应该走 --sh-glass-bg 主题变量（暖棕/暖黑），
      不是这条规则的目标（这条原意是抓 inline 的下拉/弹窗 div） */
body.dark-mode #starhub div[style*="position: absolute"][style*="background"]:not(#starhub-tab-bar),
body.dark-mode #starhub div[style*="position:absolute"][style*="background"]:not(#starhub-tab-bar),
body.night #starhub div[style*="position: absolute"][style*="background"]:not(#starhub-tab-bar),
body.night #starhub div[style*="position:absolute"][style*="background"]:not(#starhub-tab-bar) {
    background: rgba(26, 26, 26, 0.95) !important;
    background-color: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
    color: #e2e8f0 !important;
}

/* 下拉选项行 */
body.dark-mode .select-option,
body.dark-mode .sb-select-option,
body.night .select-option,
body.night .sb-select-option {
    background: transparent !important;
    background-color: transparent !important;
    color: #e2e8f0 !important;
}
body.dark-mode .select-option:hover,
body.dark-mode .sb-select-option:hover,
body.night .select-option:hover,
body.night .sb-select-option:hover {
    background: rgba(184, 148, 125, 0.15) !important;
}

/* 下拉容器 */
body.dark-mode .select-dropdown,
body.dark-mode .sb-select-dropdown,
body.dark-mode [class*="select-dropdown"],
body.night .select-dropdown,
body.night .sb-select-dropdown,
body.night [class*="select-dropdown"] {
    background: rgba(26, 26, 26, 0.95) !important;
    background-color: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

/* 星汇内所有深色文字 → 提亮 */
body.dark-mode #starhub div[style*="#4A3F38"],
body.dark-mode #starhub div[style*="#4a3f38"],
body.dark-mode #starhub div[style*="color: #4"],
body.dark-mode #starhub div[style*="color: #3"],
body.dark-mode #starhub div[style*="color:#4"],
body.dark-mode #starhub div[style*="color:#3"],
body.night #starhub div[style*="#4A3F38"],
body.night #starhub div[style*="#4a3f38"],
body.night #starhub div[style*="#444"],
body.night #starhub div[style*="#333"] {
    color: #e2e8f0 !important;
}

/* === 星汇侧边菜单 === */
body.dark-mode #side-menu-starhub,
body.night #side-menu-starhub {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}
body.dark-mode #side-menu-starhub .select-option,
body.night #side-menu-starhub .select-option {
    color: #e2e8f0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode #side-menu-starhub .select-option:hover,
body.night #side-menu-starhub .select-option:hover {
    background: rgba(184, 148, 125, 0.15) !important;
}

/* === 帖子菜单面板 === */
body.dark-mode .starhub-post-menu-mask > div,
body.night .starhub-post-menu-mask > div {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .starhub-post-menu-mask div[style*="cursor"],
body.night .starhub-post-menu-mask div[style*="cursor"] {
    color: #e2e8f0 !important;
    border-bottom-color: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode .starhub-post-menu-mask div[style*="cursor"]:hover,
body.night .starhub-post-menu-mask div[style*="cursor"]:hover {
    background: rgba(184, 148, 125, 0.15) !important;
}

/* 通用颜色覆盖 */
body.dark-mode div[style*="color: #4a3b3e"],
body.dark-mode div[style*="color:#4a3b3e"],
body.dark-mode h3[style*="color: #4a3b3e"],
body.dark-mode h3[style*="color:#4a3b3e"],
body.night div[style*="color: #4a3b3e"],
body.night h3[style*="color: #4a3b3e"] {
    color: #e2e8f0 !important;
}

/* === 转发面板 === */
body.dark-mode .starhub-forward-mask > div,
body.night .starhub-forward-mask > div {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
}
body.dark-mode .starhub-forward-mask div[style*="border-bottom"],
body.night .starhub-forward-mask div[style*="border-bottom"] {
    border-bottom-color: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode .starhub-forward-mask h3,
body.night .starhub-forward-mask h3 {
    color: #e2e8f0 !important;
}
body.dark-mode .starhub-forward-mask div[style*="font-weight: 700"],
body.night .starhub-forward-mask div[style*="font-weight: 700"] {
    color: #e2e8f0 !important;
}
body.dark-mode .starhub-forward-mask div[style*="color: #887478"],
body.dark-mode .starhub-forward-mask div[style*="color: #8C7D73"],
body.night .starhub-forward-mask div[style*="color: #887478"],
body.night .starhub-forward-mask div[style*="color: #8C7D73"] {
    color: #94a3b8 !important;
}
body.dark-mode .starhub-forward-mask div[style*="cursor: pointer"]:hover,
body.night .starhub-forward-mask div[style*="cursor: pointer"]:hover {
    background: rgba(184, 148, 125, 0.15) !important;
}

/* 收藏面板 */
body.dark-mode .starhub-fav-mask > div,
body.dark-mode #starhub-favorites-modal > div,
body.night .starhub-fav-mask > div,
body.night #starhub-favorites-modal > div {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
    color: #e2e8f0 !important;
}

/* 提醒面板 */
body.dark-mode .starhub-remind-mask > div,
body.dark-mode #modal-notif-starhub > div,
body.night .starhub-remind-mask > div,
body.night #modal-notif-starhub > div {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
    color: #e2e8f0 !important;
}

/* 设置面板 */
body.dark-mode #modal-settings-starhub > div,
body.dark-mode #starhub-hot-search > div,
body.night #modal-settings-starhub > div,
body.night #starhub-hot-search > div {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5) !important;
    color: #e2e8f0 !important;
}

/* 全局灰色字体颜色覆盖 */
body.dark-mode div[style*="color: #887478"],
body.dark-mode div[style*="color:#887478"],
body.dark-mode div[style*="color: #8C7D73"],
body.dark-mode div[style*="color:#8C7D73"],
body.night div[style*="color: #887478"],
body.night div[style*="color: #8C7D73"] {
    color: #94a3b8 !important;
}

/* 全局主色文字覆盖 */
body.dark-mode div[style*="color: #B8947D"],
body.dark-mode div[style*="color:#B8947D"],
body.dark-mode div[style*="color: #b8947d"],
body.night div[style*="color: #B8947D"],
body.night div[style*="color: #b8947d"] {
    color: #d6b99a !important;
}
body.dark-mode span[style*="color: #887478"],
body.night div[style*="color: #887478"],
body.night span[style*="color: #887478"] {
    color: #94a3b8 !important;
}

/* === 原生select + 自定义下拉 全局暗色 === */
body.dark-mode select:not(#curtain-overlay *),
body.night select:not(#curtain-overlay *) {
    background: #1a1a1a !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode select option:not(#curtain-overlay *),
body.night select option:not(#curtain-overlay *) {
    background: #1a1a1a !important;
    color: #e2e8f0 !important;
}

/* 自定义下拉白色容器 */
body.dark-mode div[style*="background: rgb(255, 255, 255)"][style*="border-radius"],
body.dark-mode div[style*="background: rgba(255, 255, 255"][style*="border-radius"],
body.dark-mode div[style*="background:rgb(255"][style*="border-radius"],
body.dark-mode div[style*="background:rgba(255,255,255"][style*="border-radius"],
body.night div[style*="background: rgb(255, 255, 255)"][style*="border-radius"],
body.night div[style*="background: rgba(255, 255, 255"][style*="border-radius"] {
    background: rgba(26, 26, 26, 0.9) !important;
    background-color: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}

/* === 全局 prompt/confirm 弹窗白色 === */
body.dark-mode .modal-prompt > div,
body.dark-mode .prompt-overlay > div,
body.dark-mode div[style*="border-radius: 24px"][style*="background: rgba(255"],
body.dark-mode div[style*="border-radius:24px"][style*="background:rgba(255"],
body.night .modal-prompt > div,
body.night .prompt-overlay > div {
    background: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .modal-prompt input,
body.dark-mode .prompt-overlay input,
body.night .modal-prompt input,
body.night .prompt-overlay input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}

/* === 全局 custom-dialog 暗色 === */
body.dark-mode .custom-dialog,
body.night .custom-dialog {
    background: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .custom-dialog h3,
body.dark-mode .custom-dialog h4,
body.night .custom-dialog h3 {
    color: #e2e8f0 !important;
}
body.dark-mode .custom-dialog p,
body.dark-mode .custom-dialog span,
body.dark-mode .custom-dialog label,
body.night .custom-dialog p,
body.night .custom-dialog span {
    color: #94a3b8 !important;
}
body.dark-mode .custom-dialog input,
body.dark-mode .custom-dialog textarea,
body.dark-mode .custom-dialog select,
body.night .custom-dialog input,
body.night .custom-dialog textarea {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .custom-dialog button,
body.night .custom-dialog button {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}

/* === 配置方案管理弹窗 === */
body.dark-mode .profiles-modal-content,
body.night .profiles-modal-content {
    background: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .profiles-modal-header,
body.night .profiles-modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .profiles-modal-header h3,
body.night .profiles-modal-header h3 {
    color: #e2e8f0 !important;
}
body.dark-mode .profiles-modal-body,
body.night .profiles-modal-body {
    color: #e2e8f0 !important;
}
body.dark-mode .profiles-modal-footer,
body.night .profiles-modal-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #94a3b8 !important;
}
body.dark-mode .profiles-empty p,
body.night .profiles-empty p {
    color: #94a3b8 !important;
}

/* === 全局所有原生select强制暗色 === */
body.dark-mode select:not(#curtain-overlay *),
body.dark-mode select option:not(#curtain-overlay *),
body.night select:not(#curtain-overlay *),
body.night select option:not(#curtain-overlay *) {
    background: #1a1a1a !important;
    background-color: #1a1a1a !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* 自定义select下拉容器 */
body.dark-mode .custom-select-dropdown,
body.dark-mode [class*="select-dropdown"],
body.dark-mode [class*="select-options"],
body.night .custom-select-dropdown,
body.night [class*="select-dropdown"],
body.night [class*="select-options"] {
    background: rgba(26, 26, 26, 0.95) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
}

/* === 全局 btn-gradient 暗色 === */
body.dark-mode .btn-gradient-primary,
body.dark-mode .btn-gradient-secondary,
body.dark-mode button.btn-gradient-primary,
body.night .btn-gradient-primary,
body.night .btn-gradient-secondary {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
    box-shadow: none !important;
}

/* settings-btn 系列 */
body.dark-mode .settings-btn,
body.dark-mode .settings-btn-primary,
body.dark-mode .settings-btn-secondary,
body.night .settings-btn,
body.night .settings-btn-primary {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
    box-shadow: none !important;
}

/* === 全局表情选择器暗色 === */
body.dark-mode .emoji-picker,
body.dark-mode .emoji-panel,
body.dark-mode .emoji-grid,
body.dark-mode [class*="emoji-picker"],
body.dark-mode [class*="emoji-panel"],
body.night .emoji-picker,
body.night .emoji-panel,
body.night .emoji-grid {
    background: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
}

/* === 千面 弹窗 ps-mdl === */
body.dark-mode .ps-mdl,
body.night .ps-mdl {
    background: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .ps-mdl input,
body.dark-mode .ps-mdl textarea,
body.night .ps-mdl input,
body.night .ps-mdl textarea {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .ps-mdl button,
body.night .ps-mdl button {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}


/* === 星遇 card-avatar === */
body.dark-mode .card-avatar,
body.night .card-avatar {
    background: transparent !important;
}



/* 心语新设计 - dark mode overrides */
body.dark-mode #view-home, body.night #view-home,
body.dark-mode #view-home, body.night #view-home {
    background: #1a1520 !important;
}
body.dark-mode #view-reading, body.night #view-reading {
    background: #1e1b27 !important;
}
body.dark-mode .w-home-title, body.night .w-home-title {
    color: #c28d7e !important;
}
body.dark-mode .w-char-selector, body.night .w-char-selector {
    background: rgba(255,255,255,0.04) !important;
    border-color: rgba(255,255,255,0.06) !important;
}
body.dark-mode .w-char-name, body.night .w-char-name {
    color: #e2d8d2 !important;
}
body.dark-mode .w-journal-cover, body.night .w-journal-cover {
    background: #3a2535 !important;
    box-shadow: inset 4px 0 10px rgba(255,255,255,0.05), 14px 18px 36px rgba(0,0,0,0.5) !important;
}
body.dark-mode .w-journal-label, body.night .w-journal-label {
    background: rgba(30,22,40,0.9) !important;
}
body.dark-mode .w-label-title, body.night .w-label-title {
    color: #e2d8d2 !important;
}
/* === Whisper 心语 - 夜间模式 === */
body.dark-mode #app-whisper,
body.night #app-whisper {
    background: #121014 !important;
}

body.dark-mode .whisper-root,
body.night .whisper-root {
    background: #121014 !important;
}

/* 首页标题 */
body.dark-mode .whisper-title,
body.night .whisper-title {
    color: #c8b4d0 !important;
    text-shadow: 0 4px 16px rgba(0,0,0,0.5) !important;
}

body.dark-mode .whisper-sub,
body.night .whisper-sub {
    color: #7a757d !important;
}

/* 选人条 */
body.dark-mode .char-selector,
body.night .char-selector {
    background: #1e1c20 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}

body.dark-mode .char-name,
body.night .char-name {
    color: #e0dce3 !important;
}

body.dark-mode .btn-switch,
body.night .btn-switch {
    color: #e0dce3 !important;
    background: rgba(255,255,255,0.05) !important;
}

/* 日记本封面 */
body.dark-mode .journal-cover,
body.night .journal-cover {
    background: #c8b4d0 !important;
    box-shadow: inset 4px 0 10px rgba(255,255,255,0.1), 15px 20px 40px rgba(0,0,0,0.6) !important;
}

body.dark-mode .journal-label,
body.night .journal-label {
    background: rgba(30,28,32,0.95) !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}

body.dark-mode .label-title,
body.night .label-title {
    color: #e0dce3 !important;
}

body.dark-mode .label-sub,
body.night .label-sub {
    color: #c8b4d0 !important;
}

/* 阅读页背景 */
body.dark-mode #view-reading,
body.night #view-reading {
    background-color: #1a181c !important;
    background-image:
        repeating-linear-gradient(45deg, rgba(255,255,255,0.01) 0, rgba(255,255,255,0.01) 2px, transparent 2px, transparent 8px),
        repeating-linear-gradient(-45deg, rgba(0,0,0,0.2) 0, rgba(0,0,0,0.2) 2px, transparent 2px, transparent 8px) !important;
    box-shadow: inset 0 0 80px rgba(0,0,0,0.8) !important;
}

body.dark-mode .whisper-back-btn,
body.dark-mode .whisper-overview-btn,
body.night .whisper-back-btn,
body.night .whisper-overview-btn {
    color: #e0dce3 !important;
}

/* 金属环 */
body.dark-mode .w-ring,
body.night .w-ring {
    background: linear-gradient(to bottom, #444, #6b6e75, #222) !important;
    box-shadow: 2px 4px 6px rgba(0,0,0,0.5) !important;
}

body.dark-mode .w-ring::after,
body.night .w-ring::after {
    background: #121014 !important;
    box-shadow: inset 1px 2px 4px rgba(0,0,0,0.8) !important;
}

/* 牛皮纸底板 */
body.dark-mode .whisper-locket-wrapper,
body.night .whisper-locket-wrapper {
    background-color: #262220 !important;
    box-shadow: 10px 20px 40px rgba(0,0,0,0.6), inset 2px 0 8px rgba(255,255,255,0.02) !important;
    background-image: radial-gradient(rgba(255,255,255,0.02) 1px, transparent 1px) !important;
    background-size: 6px 6px !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}

body.dark-mode .whisper-locket-wrapper::before,
body.night .whisper-locket-wrapper::before {
    background: linear-gradient(to right, rgba(0,0,0,0.3), transparent) !important;
}

/* 黑卡纸内页 */
body.dark-mode .diary-note-paper,
body.night .diary-note-paper {
    background: #1e1c20 !important;
    box-shadow: 2px 8px 24px rgba(0,0,0,0.4) !important;
}

body.dark-mode .top-tape,
body.night .top-tape {
    background: #c8b4d0 !important;
    opacity: 0.3 !important;
}

body.dark-mode .page-top,
body.night .page-top {
    border-bottom: 1px dashed rgba(255,255,255,0.1) !important;
}

body.dark-mode .whisper-box-title,
body.night .whisper-box-title {
    color: #e0dce3 !important;
}

body.dark-mode .page-date,
body.night .page-date {
    color: #c8b4d0 !important;
}

body.dark-mode .whisper-paper,
body.night .whisper-paper {
    color: #e0dce3 !important;
    background-image: repeating-linear-gradient(transparent, transparent 31px, rgba(255,255,255,0.03) 31px, rgba(255,255,255,0.03) 32px) !important;
}

body.dark-mode .signature,
body.night .signature {
    color: #e0dce3 !important;
}

/* 模糊墨迹 */
body.dark-mode .smudged-ink,
body.night .smudged-ink {
    text-shadow: 0 0 8px rgba(255,255,255,0.4) !important;
    border-bottom: 1px dashed rgba(255,255,255,0.2) !important;
}

body.dark-mode .smudged-ink.revealed,
body.night .smudged-ink.revealed {
    color: #c8b4d0 !important;
}

/* 心形书签 */
body.dark-mode .heart-bookmark svg,
body.night .heart-bookmark svg {
    stroke: #6b6e75 !important;
}

body.dark-mode .heart-bookmark.favorited svg,
body.night .heart-bookmark.favorited svg {
    fill: #c8b4d0 !important;
    stroke: #c8b4d0 !important;
    filter: drop-shadow(0 2px 8px #c8b4d0) !important;
}

/* 翻转纪念物 */
body.dark-mode .flip-paperclip,
body.night .flip-paperclip {
    border: 2px solid #6b6e75 !important;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.5) !important;
}

body.dark-mode .flip-face,
body.night .flip-face {
    background: #242125 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
}

body.dark-mode .item-candy,
body.night .item-candy {
    background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.02)) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3), inset 0 0 12px rgba(255,255,255,0.1) !important;
}

body.dark-mode .candy-text,
body.night .candy-text {
    color: #c8b4d0 !important;
}

body.dark-mode .flip-back,
body.night .flip-back {
    color: #e0dce3 !important;
    background-image: radial-gradient(rgba(255,255,255,0.03) 1px, transparent 1px) !important;
}

body.dark-mode .whisper-delete-btn,
body.night .whisper-delete-btn {
    color: #7a757d !important;
}

/* 锁链层 */
body.dark-mode .whisper-jewelry-layer,
body.night .whisper-jewelry-layer {
    background: rgba(18, 16, 20, 0.8) !important;
}

body.dark-mode .whisper-fine-chain,
body.night .whisper-fine-chain {
    background-image: radial-gradient(circle, #6b6e75 40%, transparent 50%) !important;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5)) !important;
}

body.dark-mode .whisper-lock-shackle,
body.night .whisper-lock-shackle {
    border: 4px solid #6b6e75 !important;
}

body.dark-mode .whisper-lock-body,
body.night .whisper-lock-body {
    background: #6b6e75 !important;
    background-image: linear-gradient(135deg, #4a4d54, #6b6e75) !important;
}

body.dark-mode .whisper-lock-keyhole,
body.night .whisper-lock-keyhole {
    background: #121014 !important;
}

body.dark-mode .whisper-lock-container.locked .lock-status-text,
body.night .whisper-lock-container.locked .lock-status-text {
    background: rgba(0,0,0,0.8) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
}

body.dark-mode .whisper-lock-container.ready .lock-status-text,
body.night .whisper-lock-container.ready .lock-status-text {
    background: #c8b4d0 !important;
    color: #fff !important;
}

/* 抽屉与弹窗 */
body.dark-mode .sheet-mask,
body.dark-mode #whisper-ov-mask,
body.night .sheet-mask,
body.night #whisper-ov-mask {
    background: rgba(18, 16, 20, 0.8) !important;
}

body.dark-mode .sheet-panel,
body.dark-mode .whisper-overview-panel,
body.night .sheet-panel,
body.night .whisper-overview-panel {
    background: #1e1c20 !important;
    box-shadow: 0 -10px 40px rgba(0,0,0,0.5) !important;
}

body.dark-mode .sheet-header,
body.dark-mode .whisper-overview-head,
body.night .sheet-header,
body.night .whisper-overview-head {
    border-bottom: 1px solid rgba(255,255,255,0.05) !important;
    color: #e0dce3 !important;
}

body.dark-mode .gem-avatar,
body.dark-mode .whisper-ov-item,
body.night .gem-avatar,
body.night .whisper-ov-item {
    background: #242125 !important;
    border: 1px solid rgba(255,255,255,0.03) !important;
}

body.dark-mode .gem-avatar:hover,
body.dark-mode .gem-avatar.active,
body.dark-mode .whisper-ov-item:active,
body.night .gem-avatar:hover,
body.night .gem-avatar.active,
body.night .whisper-ov-item:active {
    border-color: #c8b4d0 !important;
    background: #2a272d !important;
}

body.dark-mode .sheet-name,
body.dark-mode .whisper-ov-title,
body.night .sheet-name,
body.night .whisper-ov-title {
    color: #e0dce3 !important;
}

body.dark-mode .sheet-aff,
body.dark-mode .whisper-ov-sub,
body.night .sheet-aff,
body.night .whisper-ov-sub {
    color: #7a757d !important;
}

body.dark-mode .whisper-affinity-track,
body.night .whisper-affinity-track {
    background: rgba(255,255,255,0.05) !important;
}

body.dark-mode .whisper-affinity-fill,
body.night .whisper-affinity-fill {
    background: #c8b4d0 !important;
}

body.dark-mode .toc-tab,
body.night .toc-tab {
    color: #7a757d !important;
}

body.dark-mode .toc-tab.active,
body.night .toc-tab.active {
    color: #e0dce3 !important;
}

body.dark-mode .toc-tab.active::after,
body.night .toc-tab.active::after {
    background: #c8b4d0 !important;
}

body.dark-mode .btn-write-ai,
body.night .btn-write-ai {
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: #e0dce3 !important;
}

body.dark-mode .btn-write-ai:active,
body.night .btn-write-ai:active {
    background: #c8b4d0 !important;
    color: #fff !important;
}

body.dark-mode .btn-close-toc,
body.night .btn-close-toc {
    color: #7a757d !important;
}

body.dark-mode .whisper-ov-num,
body.night .whisper-ov-num {
    background: #c8b4d0 !important;
    color: #121014 !important;
}

body.dark-mode .whisper-ov-item.locked .whisper-ov-num,
body.night .whisper-ov-item.locked .whisper-ov-num {
    background: #3a373d !important;
    color: #7a757d !important;
}

/* 收藏夹 */
body.dark-mode .folder-card,
body.night .folder-card {
    background: #242125 !important;
    border: 1px solid rgba(255,255,255,0.03) !important;
}

body.dark-mode .folder-card:active,
body.night .folder-card:active {
    border-color: #c8b4d0 !important;
}

body.dark-mode .folder-name,
body.night .folder-name {
    color: #e0dce3 !important;
}

body.dark-mode .folder-count,
body.night .folder-count {
    color: #7a757d !important;
}

body.dark-mode .btn-back-folder,
body.night .btn-back-folder {
    color: #7a757d !important;
}

body.dark-mode .detail-title,
body.night .detail-title {
    color: #e0dce3 !important;
}

body.dark-mode .collection-item-row,
body.night .collection-item-row {
    background: #242125 !important;
    border: 1px solid rgba(255,255,255,0.03) !important;
}

body.dark-mode .collection-item-row:active,
body.night .collection-item-row:active {
    border-color: #c8b4d0 !important;
}

body.dark-mode .collection-item-icon,
body.night .collection-item-icon {
    background: #1e1c20 !important;
}

body.dark-mode .global-toast,
body.night .global-toast {
    background: rgba(30, 28, 32, 0.95) !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}
body.dark-mode .w-ov-tab.active, body.night .w-ov-tab.active {
    color: #e2d8d2 !important;
}
body.dark-mode .flip-back, body.night .flip-back {
    background: #2a2135 !important;
    background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px) !important;
    color: #c28d7e !important;
}
body.dark-mode .item-polaroid, body.night .item-polaroid {
    background: #2a2135 !important;
}
body.dark-mode .item-ticket, body.night .item-ticket {
    background: #2a2135 !important;
    border-color: rgba(255,255,255,0.08) !important;
}
body.dark-mode .item-ticket::before, body.night .item-ticket::before {
    background: radial-gradient(circle at 0 10px,transparent 5px,#2a2135 6px) 0 0/10px 20px !important;
}
body.dark-mode .item-ticket::after, body.night .item-ticket::after {
    background: radial-gradient(circle at 10px 10px,transparent 5px,#2a2135 6px) 0 0/10px 20px !important;
}
body.dark-mode .item-receipt, body.night .item-receipt {
    background: #2a2135 !important;
    color: #c8bfba !important;
}
body.dark-mode .item-receipt::after, body.night .item-receipt::after {
    background: linear-gradient(-45deg,transparent 33.33%,#2a2135 33.33%,#2a2135 66.66%,transparent 66.66%), linear-gradient(45deg,transparent 33.33%,#2a2135 33.33%,#2a2135 66.66%,transparent 66.66%) !important;
}
body.dark-mode .item-cassette, body.night .item-cassette {
    background: linear-gradient(135deg,#2a2135,#1e1828) !important;
    border-color: rgba(255,255,255,0.08) !important;
}
body.dark-mode .cassette-label, body.night .cassette-label {
    background: #c8bcc0 !important;
    color: #2a2135 !important;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,0.2) !important;
}
body.dark-mode .cassette-window, body.night .cassette-window {
    background: #3a373d !important;
}
body.dark-mode .item-letter, body.night .item-letter {
    background: #2a2135 !important;
    border-color: rgba(255,255,255,0.08) !important;
}
body.dark-mode .letter-lines, body.night .letter-lines {
    background: repeating-linear-gradient(to bottom,transparent 0,transparent 8px,rgba(255,255,255,0.12) 8px,rgba(255,255,255,0.12) 9px) !important;
}
body.dark-mode .w-collect-card, body.night .w-collect-card {
    background: rgba(255,255,255,0.03) !important;
}
body.dark-mode .w-collect-name, body.night .w-collect-name {
    color: #e2d8d2 !important;
}



/* ========================================================================== */
/* 🌙 无妄海 (Memory) 夜间暗色 === 由 memory.js 的 --mo-* CSS 变量系统接管 ===
   旧"冰蓝化"块（navy rgba(30,40,58) + 冰蓝 var(--dm-accent)）已删除：
   memory.js 自带完整夜间变量（body.dark-mode #memory-root 覆盖 --mo-paper 等为中性深灰），
   卡片/面板/按钮全部 var(--mo-*) 驱动，无需此处 !important 硬写，避免再次跑出深蓝。 */
body.dark-mode .memory-root, body.night .memory-root {
    background: transparent !important;
    background-image: none !important;
}

/* === 星遇 mdl 弹窗暗色 === */
body.dark-mode #starhub .mdl,
body.dark-mode .starhub-mdl,
body.dark-mode #starhub .mdl,
body.night #starhub .mdl {
    background: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #starhub .mdl h3,
body.dark-mode #starhub .mdl h4,
body.night #starhub .mdl h3 {
    color: #e2e8f0 !important;
}
body.dark-mode #starhub .mdl p,
body.dark-mode #starhub .mdl span,
body.night #starhub .mdl p,
body.night #starhub .mdl span {
    color: #94a3b8 !important;
}
body.dark-mode #starhub .mdl button,
body.night #starhub .mdl button {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #starhub .mdl input,
body.dark-mode #starhub .mdl textarea,
body.night #starhub .mdl input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}

/* === 全局 .mdl 弹窗暗色 === */
body.dark-mode .mdl,
body.dark-mode div.mdl,
body.night .mdl {
    background: rgba(26, 26, 26, 0.9) !important;
    background-color: rgba(26, 26, 26, 0.9) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .mdl h3, body.dark-mode .mdl h4,
body.night .mdl h3 {
    color: #e2e8f0 !important;
}
body.dark-mode .mdl p, body.dark-mode .mdl span,
body.night .mdl p {
    color: #94a3b8 !important;
}
body.dark-mode .mdl input, body.dark-mode .mdl textarea,
body.night .mdl input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .mdl button,
body.night .mdl button {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}

/* === 星遇 Contact 暗色 - 由 contact.css 的 CSS 变量系统接管，此处仅清除旧样式干扰 === */
body.dark-mode #contact-edit,
body.night #contact-edit {
    background: none !important;
    color: inherit !important;
}
body.dark-mode .panel-body input,
body.dark-mode .panel-body textarea,
body.dark-mode .panel-body select,
body.night .panel-body input,
body.night .panel-body textarea {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .panel-body .img-preview,
body.dark-mode .panel-body .img-upload-area,
body.night .panel-body .img-preview {
    background: rgba(26, 26, 26, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
}
body.dark-mode .panel-body button,
body.night .panel-body button {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .panel-body label,
body.dark-mode .panel-body span,
body.dark-mode .panel-body p,
body.night .panel-body label,
body.night .panel-body span {
    color: #94a3b8 !important;
}
body.dark-mode .panel-body h3,
body.dark-mode .panel-body h4,
body.night .panel-body h3 {
    color: #e2e8f0 !important;
}




/* ========================================================================== */
/* 🌙 全局面板/弹窗/抽屉 通杀暗色 */
/* ========================================================================== */




/* 背包送礼面板 */
body.dark-mode .gift-panel,
body.dark-mode .backpack-panel,
body.dark-mode [class*="gift-panel"],
body.dark-mode [class*="backpack"],
body.night .gift-panel {
    background: #1A1A1A !important;
    color: #e2e8f0 !important;
}

/* 音乐分享面板 */
body.dark-mode .music-share-panel,
body.dark-mode [class*="music-share"],
body.dark-mode [class*="share-panel"],
body.night .music-share-panel {
    background: #1A1A1A !important;
    color: #e2e8f0 !important;
}

/* 共听面板 */
body.dark-mode #music,
body.dark-mode .music-listen,
body.dark-mode [class*="co-listen"],
body.dark-mode [class*="listen-together"],
body.night #music {
    background: #000000 !important;
    color: #e2e8f0 !important;
}

/* 私属书阁 */
body.dark-mode .book-panel,
body.dark-mode [class*="book-reader"],
body.dark-mode [class*="bookshelf"],
body.night .book-panel {
    background: #000000 !important;
    color: #e2e8f0 !important;
}

/* 地图/坐标面板 */
body.dark-mode .map-panel,
body.dark-mode [class*="location"],
body.dark-mode [class*="map-panel"],
body.night .map-panel {
    background: #000000 !important;
    color: #e2e8f0 !important;
}

/* === 终极兜底：所有fixed/absolute面板白色通杀 === */
body.dark-mode .bottom-sheet,
body.dark-mode [class*="bottom-sheet"],
body.dark-mode [class*="-sheet"],
body.dark-mode [class*="-drawer"],
body.night .bottom-sheet {
    background: #1A1A1A !important;
    color: #e2e8f0 !important;
}

/* ========================================================================== */
/* 🌙 全局面板/弹窗/抽屉 终极通杀 */
/* ========================================================================== */

body.dark-mode .action-sheet,
body.dark-mode .action-sheet-wrap,
body.dark-mode .echo-modal,
body.dark-mode .expansion-panel,
body.dark-mode .feed-panel,
body.dark-mode .loc-panel,
body.dark-mode .modal-box,
body.dark-mode .modal-panel,
body.dark-mode .music-panel,
body.dark-mode .panel-player,
body.dark-mode .player-modal,
body.dark-mode .at-popup,
body.dark-mode .m-modal-content,
body.dark-mode .music-select-modal-box,
body.night .action-sheet,
body.night .action-sheet-wrap,
body.night .echo-modal,
body.night .expansion-panel,
body.night .feed-panel,
body.night .loc-panel,
body.night .modal-box,
body.night .modal-panel,
body.night .music-panel,
body.night .panel-player,
body.night .player-modal,
body.night .at-popup,
body.night .m-modal-content,
body.night .music-select-modal-box {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
    background-image: none !important;
    color: #e2e8f0 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* iOS PWA 夜间模式修复：inline style 优先级极高，用 @supports 仅在 iOS 生效 */
@supports (-webkit-touch-callout: none) {
    body.dark-mode .action-sheet,
    body.dark-mode .expansion-panel,
    body.night .action-sheet,
    body.night .expansion-panel {
        background: #1A1A1A !important;
        background-color: #1A1A1A !important;
        background-image: none !important;
    }

    body.dark-mode .action-item,
    body.night .action-item {
        background: rgba(255, 255, 255, 0.06) !important;
        background-color: rgba(255, 255, 255, 0.06) !important;
        color: #e2e8f0 !important;
    }

    body.dark-mode .action-item i,
    body.night .action-item i {
        color: #d6d6d6 !important;
    }

    body.dark-mode .action-item span,
    body.night .action-item span {
        color: #e2e8f0 !important;
    }

    body.dark-mode .action-cancel,
    body.night .action-cancel {
        background: rgba(255, 82, 82, 0.15) !important;
        color: #ef5350 !important;
    }

    /* 拓展栏按钮 */
    body.dark-mode .ex-item,
    body.night .ex-item {
        background: transparent !important; /* 新版式：底色移入圆形徽章 */
        border: none !important;
        color: #e2e8f0 !important;
    }
    /* 默认徽章：黑灰底 + 中性灰图标（功能色项不在此列，保留红/绿/金）*/
    body.dark-mode .ex-item:not(.icon-red):not(.icon-green):not(.icon-gold) i,
    body.night .ex-item:not(.icon-red):not(.icon-green):not(.icon-gold) i {
        background: rgba(255, 255, 255, 0.06) !important;
        border: 1px solid rgba(255, 255, 255, 0.1) !important;
        color: #d6d6d6 !important;
    }
    body.dark-mode .ex-item span,
    body.night .ex-item span {
        color: #94a3b8 !important;
    }
    body.dark-mode .ex-item:not(.empty):active i,
    body.night .ex-item:not(.empty):active i {
        background: rgba(255, 255, 255, 0.12) !important;
    }

    /* 导演面板 NPC 网格项 */
    body.dark-mode .clean-item,
    body.night .clean-item {
        background: rgba(255, 255, 255, 0.06) !important;
        border-color: rgba(255, 255, 255, 0.1) !important;
        color: #e2e8f0 !important;
    }
    body.dark-mode .clean-item span,
    body.night .clean-item span {
        color: #e2e8f0 !important;
    }
    body.dark-mode .clean-item.active,
    body.night .clean-item.active {
        background: rgba(255, 255, 255, 0.1) !important;
        border-color: rgba(255, 255, 255, 0.2) !important;
    }
}

/* 弹窗内文字 */
body.dark-mode .modal-title,
body.dark-mode .modal-message,
body.dark-mode .m-modal-title,
body.dark-mode .panel-title,
body.dark-mode .action-sheet h3,
body.dark-mode .action-sheet h4,
body.night .modal-title,
body.night .modal-message,
body.night .m-modal-title,
body.night .panel-title {
    color: #e2e8f0 !important;
}

/* 弹窗内按钮 */
body.dark-mode .modal-box .modal-btn,
body.dark-mode .echo-modal .modal-btn,
body.night .modal-box .modal-btn {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .modal-btn-primary,
body.night .modal-btn-primary {
    background: rgba(var(--dm-accent-rgb), 0.15) !important;
    border-color: rgba(var(--dm-accent-rgb), 0.3) !important;
    color: var(--dm-accent) !important;
}
body.dark-mode .modal-btn-danger,
body.night .modal-btn-danger {
    background: rgba(239, 83, 80, 0.15) !important;
    border-color: rgba(239, 83, 80, 0.3) !important;
    color: #ef5350 !important;
}

/* 弹窗内输入框 */
body.dark-mode .modal-input,
body.dark-mode .modal-box input,
body.dark-mode .modal-box textarea,
body.dark-mode .feed-panel input,
body.dark-mode .feed-panel textarea,
body.dark-mode .loc-panel input,
body.night .modal-input,
body.night .modal-box input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}

/* 遮罩层 */
body.dark-mode .modal-overlay,
body.dark-mode .modal-mask,
body.dark-mode .m-modal-overlay,
body.dark-mode .feed-modal-overlay,
body.dark-mode .music-panel-overlay,

body.night .modal-overlay,
body.night .modal-mask,
body.night .m-modal-overlay {
    background: rgba(0, 0, 0, 0.6) !important;
}

/* 共听页面 */
body.dark-mode .co-listening-header,
body.night .co-listening-header {
    color: #e2e8f0 !important;
}

/* feed面板子元素 */
body.dark-mode .feed-panel,
body.night .feed-panel {
    background: #1e1e1e !important;
    color: #e2e8f0 !important;
}
body.dark-mode .feed-panel .feed-member-item,
body.night .feed-panel .feed-member-item {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: transparent !important;
}
body.dark-mode .feed-panel .feed-member-item:active,
body.night .feed-panel .feed-member-item:active {
    border-color: #8E7A7D !important;
    background: rgba(142, 122, 125, 0.1) !important;
}
body.dark-mode .feed-panel .feed-member-name,
body.night .feed-panel .feed-member-name {
    color: #D6CFD0 !important;
}
body.dark-mode .feed-panel .feed-member-avatar,
body.night .feed-panel .feed-member-avatar {
    background: rgba(255, 255, 255, 0.06) !important;
}
body.dark-mode .feed-panel .feed-cancel-btn,
body.night .feed-panel .feed-cancel-btn {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #8C7B7E !important;
}
body.dark-mode .feed-panel .feed-back-btn,
body.night .feed-panel .feed-back-btn {
    color: #8C7B7E !important;
}
body.dark-mode .feed-panel .feed-target-name,
body.night .feed-panel .feed-target-name {
    color: #D6CFD0 !important;
}
body.dark-mode .feed-panel .feed-tag,
body.night .feed-panel .feed-tag {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #94a3b8 !important;
}
body.dark-mode .feed-panel .feed-tag.active,
body.night .feed-panel .feed-tag.active {
    background: rgba(var(--dm-accent-rgb), 0.15) !important;
    border-color: rgba(var(--dm-accent-rgb), 0.3) !important;
    color: var(--dm-accent) !important;
}
body.dark-mode .feed-panel .feed-input-box,
body.night .feed-panel .feed-input-box {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}

/* 坐标面板 */
body.dark-mode .loc-panel .glass-input-box,
body.night .loc-panel .glass-input-box {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}

/* 私属书阁 - overlay-page */
body.dark-mode .overlay-page,
body.night .overlay-page {
    background: #000000 !important;
    color: #e2e8f0 !important;
}

/* ========================================================================== */
/* 🌙 心动投喂 - 冰蓝暗夜高定版 */
/* ========================================================================== */

/* 拓展面板（弹窗化：居中卡片，中性黑灰，无导航蓝残留）*/
body.dark-mode .expansion-panel,
body.night .expansion-panel {
    background: #1A1A1A !important;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.5) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
}
body.dark-mode .panel-handle,
body.night .panel-handle {
    background: rgba(255, 255, 255, 0.2) !important;
}
body.dark-mode .app-text,
body.night .app-text {
    color: rgba(255, 255, 255, 0.7) !important;
}
body.dark-mode .droplet,
body.night .droplet {
    background: linear-gradient(145deg, #1e293b, #0f172a) !important;
    box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.6), -6px -6px 12px rgba(26, 26, 26, 0.5) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode .app-item:active .droplet,
body.night .app-item:active .droplet {
    box-shadow: inset 4px 4px 8px rgba(0, 0, 0, 0.6), inset -4px -4px 8px rgba(26, 26, 26, 0.3) !important;
}
body.dark-mode .icon-ice,
body.night .icon-ice {
    color: #7DD3FC !important;
    text-shadow: 0 0 10px rgba(125, 211, 252, 0.4) !important;
}

/* 选品面板 */
body.dark-mode .feed-panel,
body.night .feed-panel {
    background: #1E293B !important;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.6), inset 0 1px 1px rgba(255,255,255,0.1) !important;
    border: 1px solid rgba(125, 211, 252, 0.15) !important;
    color: #E2E8F0 !important;
}
body.dark-mode .feed-toggle-wrapper,
body.night .feed-toggle-wrapper {
    background: #0F172A !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}
body.dark-mode .feed-slider,
body.night .feed-slider {
    background: #334155 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.5) !important;
}
body.dark-mode .feed-panel[data-mode="butler"] .feed-slider,
body.night .feed-panel[data-mode="butler"] .feed-slider {
    background: #1C1B1A !important;
}
body.dark-mode .feed-toggle-btn,
body.night .feed-toggle-btn {
    color: #64748B !important;
}
body.dark-mode .feed-panel[data-mode="fuguang"] .feed-toggle-btn.fuguang,
body.night .feed-panel[data-mode="fuguang"] .feed-toggle-btn.fuguang {
    color: #7DD3FC !important;
    text-shadow: 0 0 8px rgba(125,211,252,0.3) !important;
}
body.dark-mode .feed-panel[data-mode="butler"] .feed-toggle-btn.butler,
body.night .feed-panel[data-mode="butler"] .feed-toggle-btn.butler {
    color: #E2E8F0 !important;
}

/* 标签 */
body.dark-mode .feed-panel .feed-tag,
body.night .feed-panel .feed-tag {
    background: #0F172A !important;
    color: #94A3B8 !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}
body.dark-mode .feed-panel[data-mode="fuguang"] .feed-tag.active,
body.night .feed-panel[data-mode="fuguang"] .feed-tag.active {
    background: rgba(56, 189, 248, 0.15) !important;
    color: #7DD3FC !important;
    border-color: #38BDF8 !important;
    box-shadow: 0 0 12px rgba(56,189,248,0.2) !important;
}
body.dark-mode .feed-panel[data-mode="butler"] .feed-tag.active,
body.night .feed-panel[data-mode="butler"] .feed-tag.active {
    background: rgba(226, 232, 240, 0.1) !important;
    color: #F8FAFC !important;
    border-color: #94A3B8 !important;
}

/* 输入框 */
body.dark-mode .feed-panel .feed-input-box,
body.dark-mode .feed-panel .input-box,
body.night .feed-panel .feed-input-box,
body.night .feed-panel .input-box {
    background: #0F172A !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: #E2E8F0 !important;
}
body.dark-mode .feed-panel .feed-input-box::placeholder,
body.dark-mode .feed-panel .input-box::placeholder,
body.night .feed-panel .feed-input-box::placeholder {
    color: #475569 !important;
}
body.dark-mode .feed-panel[data-mode="fuguang"] .feed-input-box:focus,
body.dark-mode .feed-panel[data-mode="fuguang"] .input-box:focus,
body.night .feed-panel[data-mode="fuguang"] .feed-input-box:focus {
    border-color: #38BDF8 !important;
    background: #1E293B !important;
    box-shadow: 0 0 12px rgba(56,189,248,0.15) !important;
}
body.dark-mode .feed-panel[data-mode="butler"] .feed-input-box:focus,
body.dark-mode .feed-panel[data-mode="butler"] .input-box:focus,
body.night .feed-panel[data-mode="butler"] .feed-input-box:focus {
    border-color: #94A3B8 !important;
    background: #1E293B !important;
}

/* 提交按钮 */
body.dark-mode .feed-panel[data-mode="fuguang"] .feed-submit-btn,
body.dark-mode .feed-panel[data-mode="fuguang"] .submit-btn,
body.night .feed-panel[data-mode="fuguang"] .feed-submit-btn {
    background: linear-gradient(135deg, #7DD3FC 0%, #38BDF8 100%) !important;
    color: #0F172A !important;
    box-shadow: 0 8px 24px rgba(56, 189, 248, 0.3) !important;
}
body.dark-mode .feed-panel[data-mode="butler"] .feed-submit-btn,
body.dark-mode .feed-panel[data-mode="butler"] .submit-btn,
body.night .feed-panel[data-mode="butler"] .feed-submit-btn {
    background: linear-gradient(135deg, #E2E8F0 0%, #94A3B8 100%) !important;
    color: #0F172A !important;
    box-shadow: 0 8px 24px rgba(148, 163, 184, 0.2) !important;
}

/* 遮罩 */
body.dark-mode .feed-modal-overlay,
body.night .feed-modal-overlay {
    background: rgba(11, 17, 32, 0.8) !important;
}

/* 浮光配送卡 */
body.dark-mode .card-fuguang,
body.night .card-fuguang {
    background: #1E293B !important;
    border: 1px solid rgba(56, 189, 248, 0.2) !important;
}
body.dark-mode .fg-brand,
body.night .fg-brand {
    color: #7DD3FC !important;
    text-shadow: 0 0 8px rgba(125,211,252,0.4) !important;
}
body.dark-mode .fg-order-no,
body.night .fg-order-no {
    color: #64748B !important;
}
body.dark-mode .fg-recipient,
body.night .fg-recipient {
    color: #94A3B8 !important;
    background: rgba(56, 189, 248, 0.08) !important;
    border-left: 2px solid #38BDF8 !important;
}
body.dark-mode .fg-item,
body.night .fg-item {
    color: #F8FAFC !important;
}
body.dark-mode .note-fuguang,
body.night .note-fuguang {
    background: rgba(56, 189, 248, 0.1) !important;
    color: #BAE6FD !important;
    border-left: 2px solid #38BDF8 !important;
}
body.dark-mode .fg-info-row,
body.night .fg-info-row {
    color: #94A3B8 !important;
}
body.dark-mode .fg-track,
body.night .fg-track {
    background: #0F172A !important;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.5) !important;
}
body.dark-mode .fg-fill,
body.night .fg-fill {
    background: linear-gradient(90deg, #38BDF8, #7DD3FC) !important;
    box-shadow: 0 0 10px rgba(56,189,248,0.6) !important;
}

/* 管家配送卡 */
body.dark-mode .card-butler,
body.night .card-butler {
    background: linear-gradient(145deg, #18181B 0%, #09090B 100%) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode .bt-brand,
body.night .bt-brand {
    color: #E2E8F0 !important;
}
body.dark-mode .bt-status-tag,
body.night .bt-status-tag {
    background: rgba(255,255,255,0.05) !important;
    color: #CBD5E1 !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
}
body.dark-mode .bt-item,
body.night .bt-item {
    color: #F8FAFC !important;
}
body.dark-mode .bt-details,
body.night .bt-details {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255,255,255,0.02) !important;
}
body.dark-mode .bt-label,
body.night .bt-label {
    color: #64748B !important;
}
body.dark-mode .bt-value,
body.night .bt-value {
    color: #E2E8F0 !important;
}
body.dark-mode .note-butler,
body.night .note-butler {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #CBD5E1 !important;
    border-left: 2px solid #94A3B8 !important;
}

/* 浮光回执卡 */
body.dark-mode .receipt-fuguang,
body.night .receipt-fuguang {
    background: #1E293B !important;
    border: 1px solid rgba(56, 189, 248, 0.3) !important;
    border-left: 4px solid #38BDF8 !important;
}
body.dark-mode .receipt-fuguang .r-title,
body.night .receipt-fuguang .r-title {
    color: #7DD3FC !important;
}
body.dark-mode .receipt-fuguang .r-time,
body.night .receipt-fuguang .r-time {
    color: #64748B !important;
}
body.dark-mode .receipt-fuguang .r-status,
body.night .receipt-fuguang .r-status {
    color: #34D399 !important;
    text-shadow: 0 0 8px rgba(52, 211, 153, 0.3) !important;
}
body.dark-mode .receipt-fuguang .r-recipient,
body.night .receipt-fuguang .r-recipient {
    color: #94A3B8 !important;
}
body.dark-mode .sensory-bar-fuguang,
body.night .sensory-bar-fuguang {
    background: rgba(56, 189, 248, 0.05) !important;
    border: 1px solid rgba(56,189,248,0.1) !important;
}
body.dark-mode .sensory-label,
body.night .sensory-label {
    color: #7DD3FC !important;
}
body.dark-mode .sensory-value,
body.night .sensory-value {
    color: #7DD3FC !important;
    text-shadow: 0 0 6px rgba(125,211,252,0.5) !important;
}

/* 管家回执卡 */
body.dark-mode .receipt-butler,
body.night .receipt-butler {
    background: linear-gradient(145deg, #18181B 0%, #09090B 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-left: 4px solid #94A3B8 !important;
    color: #F8FAFC !important;
}
body.dark-mode .receipt-butler .r-title,
body.night .receipt-butler .r-title {
    color: #94A3B8 !important;
}
body.dark-mode .receipt-butler .r-time,
body.night .receipt-butler .r-time {
    color: #64748B !important;
}
body.dark-mode .receipt-butler .r-status,
body.night .receipt-butler .r-status {
    color: #E2E8F0 !important;
}
body.dark-mode .sensory-bar-butler,
body.night .sensory-bar-butler {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255,255,255,0.05) !important;
}
body.dark-mode .sensory-bar-butler .sensory-label,
body.night .sensory-bar-butler .sensory-label {
    color: #94A3B8 !important;
}
body.dark-mode .sensory-bar-butler .sensory-value,
body.night .sensory-bar-butler .sensory-value {
    color: #CBD5E1 !important;
}

/* 系统通知 */
body.dark-mode .system-notification,
body.night .system-notification {
    background: rgba(26, 26, 26, 0.6) !important;
    color: #94A3B8 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important;
}

/* ========================================================================== */
/* 🌙 心声 Voice Modal 暗色已迁移到 apps-styles.css 的 --ms-* 变量切换 */
/* ========================================================================== */


/* 🌙 Love Log 卡片暗色已迁移到 apps-styles.css 的 --ll-* 变量切换（干枯玫瑰高定版） */



/* === 红包/转账 按钮恢复原色 === */



/* === 转账页面暗色 === */
body.dark-mode .transfer-nav-bar,
body.night .transfer-nav-bar {
    background: #000000 !important;
    color: #e2e8f0 !important;
}
body.dark-mode .transfer-nav-title,
body.night .transfer-nav-title {
    color: #e2e8f0 !important;
}
body.dark-mode .transfer-nav-btn,
body.night .transfer-nav-btn {
    color: #94a3b8 !important;
}
body.dark-mode .view-transfer-input,
body.dark-mode .view-transfer-receipt,
body.night .view-transfer-input {
    background: #000000 !important;
}
body.dark-mode .transfer-heavy-panel,
body.night .transfer-heavy-panel {
    background: var(--bg-screen) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
}
body.dark-mode .transfer-input-wrapper,
body.night .transfer-input-wrapper {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode .transfer-amt-input,
body.night .transfer-amt-input {
    color: #e2e8f0 !important;
    background: transparent !important;
}
body.dark-mode .transfer-currency,
body.night .transfer-currency {
    color: #d4af37 !important;
}
body.dark-mode .transfer-target-name,
body.night .transfer-target-name {
    color: #e2e8f0 !important;
}
body.dark-mode .transfer-info-label,
body.night .transfer-info-label {
    color: #64748b !important;
}
body.dark-mode .transfer-info-val,
body.night .transfer-info-val {
    color: #e2e8f0 !important;
}
body.dark-mode .transfer-receipt-heavy,
body.night .transfer-receipt-heavy {
    background: var(--bg-screen) !important;
    border: 1px solid rgba(212, 175, 55, 0.15) !important;
    color: #e2e8f0 !important;
}

/* 转账面板变量覆盖 */
body.dark-mode,
body.night {
    --tf-bg-white: #1a1a1a;
    --tf-bg-light: #111111;
    --tf-bw-main: #e2e8f0;
    --tf-bw-sub: #94a3b8;
    --tf-bw-muted: #64748b;
    --tf-border-line: rgba(255,255,255,0.08);
    --tf-border-dark: rgba(255,255,255,0.12);
    --tf-watermark: rgba(255,255,255,0.04);
    --tf-shadow-soft: 0 16px 32px rgba(0,0,0,0.4);
}

/* 虚拟坐标按钮 */
body.dark-mode .btn-save-tag,
body.night .btn-save-tag {
    background: rgba(255,255,255,0.06) !important;
    color: var(--text-main) !important;
    border-color: rgba(255,255,255,0.1) !important;
}
body.dark-mode .btn-save-tag:active,
body.night .btn-save-tag:active {
    background: rgba(255,255,255,0.1) !important;
}


/* === 红包面板保持原样但按钮恢复 === */
body.dark-mode .redpacket-modal .modal-btn,
body.dark-mode .redpacket button,
body.night .redpacket-modal .modal-btn {
    background: revert !important;
    border: revert !important;
    color: revert !important;
}

/* === 代付面板暗色 === */
body.dark-mode .pay-panel,
body.night .pay-panel {
    background: #1A1A1A !important;
    color: #e2e8f0 !important;
}
body.dark-mode .pay-panel input,
body.dark-mode .pay-panel textarea,
body.night .pay-panel input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .pay-panel label,
body.dark-mode .pay-panel span,
body.dark-mode .pay-panel h3,
body.dark-mode .pay-panel h4,
body.night .pay-panel label,
body.night .pay-panel span {
    color: #e2e8f0 !important;
}
body.dark-mode .pay-confirm-btn,
body.night .pay-confirm-btn {
    background: linear-gradient(135deg, #38bdf8, #7dd3fc) !important;
    color: #0f172a !important;
    border: none !important;
}




body.dark-mode .pay-panel .pay-title,
body.night .pay-panel .pay-title {
    color: #e2e8f0 !important;
}
body.dark-mode .pay-panel .pay-close,
body.night .pay-panel .pay-close {
    color: #94a3b8 !important;
}
body.dark-mode .pay-panel .pay-tabs,
body.night .pay-panel .pay-tabs {
    background: transparent !important;
}
body.dark-mode .pay-panel .pay-tab,
body.night .pay-panel .pay-tab {
    color: #94a3b8 !important;
    background: transparent !important;
}
body.dark-mode .pay-panel .pay-tab.active,
body.night .pay-panel .pay-tab.active {
    color: var(--dm-accent) !important;
    border-color: var(--dm-accent) !important;
}
body.dark-mode .pay-panel .pay-content,
body.dark-mode .pay-panel .pay-tab-content,
body.night .pay-panel .pay-content {
    background: transparent !important;
    color: #e2e8f0 !important;
}
body.dark-mode .pay-panel .cart-empty,
body.night .pay-panel .cart-empty {
    color: #64748b !important;
}
body.dark-mode .pay-panel input,
body.dark-mode .pay-panel textarea,
body.night .pay-panel input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}
body.dark-mode .pay-panel input::placeholder,
body.night .pay-panel input::placeholder {
    color: #475569 !important;
}
body.dark-mode .pay-panel label,
body.dark-mode .pay-panel p,
body.dark-mode .pay-panel span:not(.pay-title),
body.dark-mode .pay-panel h4,
body.night .pay-panel label,
body.night .pay-panel p {
    color: #cbd5e1 !important;
}
body.dark-mode .pay-confirm-btn,
body.night .pay-confirm-btn {
    background: linear-gradient(135deg, rgba(var(--dm-accent-rgb), 0.3), rgba(var(--dm-accent-rgb), 0.2)) !important;
    color: var(--dm-accent) !important;
}


body.dark-mode #pay-custom-footer,
body.night #pay-custom-footer {
    background: transparent !important;
}
body.dark-mode .pay-panel .pay-header,
body.night .pay-panel .pay-header {
    background: transparent !important;
}
body.dark-mode .pay-panel .glass-effect,
body.night .pay-panel .glass-effect {
    background: #1A1A1A !important;
}
body.dark-mode .pay-panel .pay-custom-input,
body.dark-mode .pay-panel [class*="pay-input"],
body.dark-mode .pay-panel [class*="pay-custom"] input,
body.night .pay-panel .pay-custom-input {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}

/* === 代付面板 全面暗色 === */
body.dark-mode .pay-panel,
body.dark-mode .pay-panel.glass-effect,
body.night .pay-panel {
    background: #1A1A1A !important;
}
body.dark-mode .pay-panel *,
body.night .pay-panel * {
    color: #e2e8f0 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode .pay-panel .pay-header,
body.night .pay-panel .pay-header {
    background: #1A1A1A !important;
}
body.dark-mode .pay-panel .pay-tabs,
body.dark-mode .pay-panel .pay-tab,
body.night .pay-panel .pay-tabs {
    background: transparent !important;
    color: #94a3b8 !important;
}
body.dark-mode .pay-panel .pay-tab.active,
body.night .pay-panel .pay-tab.active {
    color: var(--dm-accent) !important;
    border-bottom-color: var(--dm-accent) !important;
}
body.dark-mode #pay-custom-form,
body.dark-mode #pay-cart-content,
body.dark-mode .pay-tab-content,
body.dark-mode #pay-custom-footer,
body.dark-mode .pay-content,
body.night #pay-custom-form,
body.night #pay-cart-content {
    background: #1A1A1A !important;
}
body.dark-mode .pay-panel input,
body.dark-mode .pay-panel textarea,
body.night .pay-panel input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body.dark-mode .pay-panel input::placeholder,
body.dark-mode .pay-panel textarea::placeholder,
body.night .pay-panel input::placeholder {
    color: #475569 !important;
}
body.dark-mode .pay-confirm-btn,
body.night .pay-confirm-btn {
    background: linear-gradient(135deg, rgba(var(--dm-accent-rgb), 0.3), rgba(var(--dm-accent-rgb), 0.2)) !important;
    color: var(--dm-accent) !important;
    border: none !important;
}
body.dark-mode .pay-panel .pay-close,
body.night .pay-panel .pay-close {
    color: #94a3b8 !important;
}

/* === 代付 残余亮色清理 === */
body.dark-mode .pay-panel .pay-header {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
}
body.dark-mode .pay-panel .pay-tabs {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
}
body.dark-mode .pay-panel .pay-tab {
    background: transparent !important;
    background-color: transparent !important;
}
body.dark-mode .pay-panel .pay-tab.active {
    background: rgba(var(--dm-accent-rgb), 0.08) !important;
    background-color: rgba(var(--dm-accent-rgb), 0.08) !important;
}
body.dark-mode #pay-cart-footer,
body.dark-mode #pay-custom-footer {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
}
body.dark-mode .pay-panel .cart-item,
body.dark-mode .pay-panel .pay-cart-item {
    background: rgba(255, 255, 255, 0.03) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* === glass-effect 暗色覆盖 === */
body.dark-mode .pay-panel.glass-effect,
body.dark-mode .glass-effect,
body.night .glass-effect {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* === 代付面板 inline style 覆盖 === */
body.dark-mode .pay-modal-overlay > div,
body.dark-mode .pay-modal-overlay > div > div,
body.night .pay-modal-overlay > div,
body.night .pay-modal-overlay > div > div {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
    background-image: none !important;
}
body.dark-mode .pay-modal-overlay div[style*="background"],
body.night .pay-modal-overlay div[style*="background"] {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
    background-image: none !important;
}
body.dark-mode .pay-modal-overlay div[style*="#fffaf5"],
body.dark-mode .pay-modal-overlay div[style*="#fff5eb"],
body.dark-mode .pay-modal-overlay div[style*="rgb(255, 255, 255)"],
body.dark-mode .pay-modal-overlay div[style*="rgb(255, 252, 248)"],
body.night .pay-modal-overlay div[style*="rgb(255, 255, 255)"] {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
    background-image: none !important;
}
body.dark-mode #pay-cart-content,
body.dark-mode #pay-custom-form,
body.night #pay-cart-content,
body.night #pay-custom-form {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
}
body.dark-mode #pay-cart-footer,
body.dark-mode #pay-custom-footer,
body.night #pay-cart-footer,
body.night #pay-custom-footer {
    background: #1A1A1A !important;
    background-color: #1A1A1A !important;
    background-image: none !important;
}

/* === Token Dashboard 暗色 === */
body.dark-mode .token-dashboard,
body.night .token-dashboard {
    background: radial-gradient(circle at top right, rgba(100, 50, 80, 0.15), transparent 70%),
                radial-gradient(circle at bottom left, rgba(50, 80, 120, 0.15), transparent 70%) !important;
    box-shadow: inset 0 0 25px rgba(0, 0, 0, 0.3), 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}
body.dark-mode .td-header,
body.night .td-header {
    color: #e2e8f0 !important;
}
body.dark-mode .token-dashboard input,
body.night .token-dashboard input {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0 !important;
}

/* === JS动态生成的inline弹窗暗色 === */
body.dark-mode #phone-screen > div[style*="z-index: 9999"] > div[style*="background:white"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] > div[style*="background: white"],
body.dark-mode #phone-screen > div[style*="z-index:9999"] > div[style*="background:white"],
body.night #phone-screen > div[style*="z-index: 9999"] > div[style*="background:white"] {
    background: #1A1A1A !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #phone-screen > div[style*="z-index: 9999"] > div[style*="background:white"] *,
body.dark-mode #phone-screen > div[style*="z-index: 9999"] > div[style*="background: white"] *,
body.dark-mode #phone-screen > div[style*="z-index:9999"] > div[style*="background:white"] *,
body.night #phone-screen > div[style*="z-index: 9999"] > div[style*="background:white"] * {
    color: #e2e8f0 !important;
}
body.dark-mode #phone-screen > div[style*="z-index: 9999"] > div[style*="background:white"] input,
body.dark-mode #phone-screen > div[style*="z-index: 9999"] > div[style*="background: white"] input,
body.night #phone-screen > div[style*="z-index: 9999"] > div[style*="background:white"] input {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #e2e8f0 !important;
}

/* === inline弹窗内部子元素暗色 === */
body.dark-mode #phone-screen > div[style*="z-index: 9999"] label,
body.dark-mode #phone-screen > div[style*="z-index:9999"] label,
body.night #phone-screen > div[style*="z-index: 9999"] label {
    background: rgba(255, 255, 255, 0.05) !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #e2e8f0 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="background:#fafafa"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="background: #fafafa"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="#FAFAFA"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="background:#f5f5f5"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="#eee"],
body.night #phone-screen > div[style*="z-index: 9999"] div[style*="background:#fafafa"] {
    background: rgba(255, 255, 255, 0.05) !important;
    background-color: rgba(255, 255, 255, 0.05) !important;
}
body.dark-mode #phone-screen > div[style*="z-index: 9999"] input[type="number"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] input[type="text"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] input:not([type]),
body.night #phone-screen > div[style*="z-index: 9999"] input {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="color:#333"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="color:#999"],
body.dark-mode #phone-screen > div[style*="z-index: 9999"] div[style*="color:#666"],
body.night #phone-screen > div[style*="z-index: 9999"] div[style*="color:#333"] {
    color: #e2e8f0 !important;
}

/* === 侧边栏子面板不透明（用全局夜间令牌 --card-bg，与 echo 主体中性深灰对齐，去掉旧 navy 蓝） === */
body.dark-mode .sub-video,
body.dark-mode [class*="sub-"] .sb-scroll,
body.dark-mode [class^="sub-"],
body.night [class^="sub-"] {
    background: var(--card-bg) !important;
    background-color: var(--card-bg) !important;
}
body.dark-mode .sb-scroll,
body.night .sb-scroll {
    background: transparent !important;
}

/* === 侧边栏 sub-panel 暗色 === */
body.dark-mode #echo-sidebar .sub-panel,
body.night #echo-sidebar .sub-panel {
    background: var(--card-bg) !important;
    --bg-color: var(--card-bg);
}
body.dark-mode #echo-sidebar #sub-bubble .sp-body,
body.night #echo-sidebar #sub-bubble .sp-body {
    background: rgba(255, 255, 255, 0.04) !important;
}

/* === Time Popup Dark Mode（贴底抽屉·纯黑高定版）===
   面板 CSS 已全量改成 --tp-* 令牌驱动（见 time-popup.css）。夜间令牌 1:1 对齐用户
   美化文件（时间感知.html 第 25-34 行）的暗黑高定：#0a0a0a 底 / 纯白字 / #2a2a2a 边框。
   仅 .select-dropdown 保留 !important，用来稳压全局 [class*="select-dropdown"] navy 块。 */
body.dark-mode #time-popup-mask,
body.night #time-popup-mask,
body.dark-mode #time-popup,
body.night #time-popup {
    --tp-mask-bg: rgba(0, 0, 0, 0.85);
    --tp-bg: #0a0a0a;
    --tp-text-title: #ffffff;
    --tp-text-main: #eeeeee;
    --tp-text-sub: #666666;
    --tp-border: #2a2a2a;
    --tp-accent: #ffffff;
    --tp-accent-text: #000000;
    --tp-hover: rgba(255, 255, 255, 0.06);
}
body.dark-mode #time-popup,
body.night #time-popup {
    box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.55);
}
/* 稳压全局 navy .select-dropdown !important 块，让夜间下拉跟面板同底 */
body.dark-mode #time-popup .select-dropdown,
body.night #time-popup .select-dropdown {
    background: #0a0a0a !important;
    border: 1px solid #2a2a2a !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5) !important;
}

/* ============================================
   弹窗暗色补丁 — 签名编辑 / 钱包 / 代付
   ============================================ */

/* 签名编辑弹窗 */
body.dark-mode .quote-modal-overlay,
body.night .quote-modal-overlay {
    background: rgba(0, 0, 0, 0.7) !important;
}
body.dark-mode .quote-modal,
body.night .quote-modal {
    background: #1c1c1e !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode .quote-modal-title,
body.night .quote-modal-title {
    color: #f5f5f7 !important;
}
body.dark-mode .quote-modal-input,
body.night .quote-modal-input {
    background: #2c2c2e !important;
    color: #f5f5f7 !important;
    border-color: rgba(255,255,255,0.1) !important;
}
body.dark-mode .quote-modal-input::placeholder,
body.night .quote-modal-input::placeholder {
    color: #636366 !important;
}
body.dark-mode .quote-modal-btn.cancel,
body.night .quote-modal-btn.cancel {
    background: #2c2c2e !important;
    color: #aeaeb2 !important;
    border-color: rgba(255,255,255,0.1) !important;
}

/* 钱包弹窗 */
body.dark-mode #modal-wallet .sheet,
body.night #modal-wallet .sheet {
    background: #1c1c1e !important;
}
body.dark-mode #modal-wallet .sheet-header h3,
body.night #modal-wallet .sheet-header h3 {
    color: #f5f5f7 !important;
}
body.dark-mode #modal-wallet .sheet-header .close-icon,
body.night #modal-wallet .sheet-header .close-icon {
    color: #aeaeb2 !important;
}
body.dark-mode #modal-wallet .bank-card,
body.night #modal-wallet .bank-card {
    background: linear-gradient(135deg, #2c2c2e 0%, #1c1c1e 100%) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode #modal-wallet .bank-card .label,
body.dark-mode #modal-wallet .bank-card .brand,
body.dark-mode #modal-wallet .bank-card .card-btm,
body.night #modal-wallet .bank-card .label,
body.night #modal-wallet .bank-card .brand,
body.night #modal-wallet .bank-card .card-btm {
    color: rgba(255,255,255,0.5) !important;
}
body.dark-mode #modal-wallet .bank-card .balance,
body.night #modal-wallet .bank-card .balance {
    color: #f5f5f7 !important;
}
body.dark-mode #modal-wallet .action-grid .action-item,
body.night #modal-wallet .action-grid .action-item {
    background: #2c2c2e !important;
    color: #f5f5f7 !important;
}
body.dark-mode #modal-wallet .wallet-flow-section,
body.night #modal-wallet .wallet-flow-section {
    border-color: rgba(255,255,255,0.08) !important;
}
body.dark-mode #modal-wallet .flow-item,
body.night #modal-wallet .flow-item {
    border-color: rgba(255,255,255,0.06) !important;
}
body.dark-mode #modal-wallet .flow-desc,
body.dark-mode #modal-wallet .flow-header,
body.night #modal-wallet .flow-desc,
body.night #modal-wallet .flow-header {
    color: #aeaeb2 !important;
}

/* 代付弹窗 */
body.dark-mode #pay-modal .pay-panel,
body.night #pay-modal .pay-panel {
    background: #1c1c1e !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode #pay-modal .pay-title,
body.dark-mode #pay-modal .pay-close,
body.night #pay-modal .pay-title,
body.night #pay-modal .pay-close {
    color: #f5f5f7 !important;
}
body.dark-mode #pay-modal .pay-tab,
body.night #pay-modal .pay-tab {
    color: #aeaeb2 !important;
}
body.dark-mode #pay-modal .pay-tab.active,
body.night #pay-modal .pay-tab.active {
    color: #f5f5f7 !important;
    border-color: #f5f5f7 !important;
}
body.dark-mode #pay-modal label,
body.night #pay-modal label {
    color: #aeaeb2 !important;
}
body.dark-mode #pay-modal input,
body.night #pay-modal input {
    background: #2c2c2e !important;
    color: #f5f5f7 !important;
    border-color: rgba(255,255,255,0.1) !important;
}

body.dark-mode .classic-emoji-panel,
body.night .classic-emoji-panel {
    background: #141418 !important;
}
body.dark-mode .sticker-panel,
body.night .sticker-panel {
    background: var(--drawer-bg) !important;
    border-top-color: var(--drawer-border) !important;
}
body.dark-mode .sticker-tab,
body.night .sticker-tab {
    color: var(--drawer-label-color) !important;
}
body.dark-mode .sticker-tab.active,
body.night .sticker-tab.active {
    background: var(--drawer-item-active-bg) !important;
    color: var(--text-main) !important;
}

/* === 剧情卡片暗色覆盖（apps-styles.css 里是蓝色调，此处改黑） === */
body.dark-mode .scenario-card:not(.card-event),
body.night .scenario-card:not(.card-event) {
    background: #1a1a1a !important;
    background-image: none !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

/* === 外卖卡片总价栏 === */
body.dark-mode .dlv-total,
body.night .dlv-total {
    background: rgba(255, 255, 255, 0.04) !important;
    border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}
body.dark-mode .dlv-total-label,
body.night .dlv-total-label {
    color: #94a3b8 !important;
}
body.dark-mode .dlv-total-price,
body.night .dlv-total-price {
    color: #e2e8f0 !important;
}

/* === 万象界面去蓝色 === */
body.dark-mode #genesis,
body.dark-mode #genesis-content,
body.night #genesis,
body.night #genesis-content {
    background: #0a0a0a !important;
    background-image: none !important;
    --bg-base: #0a0a0a;
    --bg-gradient: none;
}
body.dark-mode #genesis-content > .top-tabs,
body.night #genesis-content > .top-tabs {
    background: #1a1a1a !important;
    background-color: #1a1a1a !important;
    background-image: none !important;
}

/* === 万象 card-group / list-item / top-tabs 去蓝 === */
body.dark-mode #genesis .card-group,
body.dark-mode #genesis-content .card-group,
body.night #genesis .card-group,
body.night #genesis-content .card-group {
    background: #1a1a1a !important;
    background-image: none !important;
}
body.dark-mode #genesis .list-item,
body.dark-mode #genesis-content .list-item,
body.night #genesis .list-item,
body.night #genesis-content .list-item {
    background: #1a1a1a !important;
    background-image: none !important;
}
body.dark-mode #genesis-content > .top-tabs,
body.night #genesis-content > .top-tabs {
    background: #1a1a1a !important;
    background-color: #1a1a1a !important;
    background-image: none !important;
}
/* === overlay nav-bar / gn-lj-info-item / gn-lj-preview-card === */
body.dark-mode .overlay-page .nav-bar,
body.dark-mode .overlay-nav-bar,
body.night .overlay-page .nav-bar,
body.night .overlay-nav-bar {
    background: #1a1a1a !important;
    border-bottom-color: rgba(255,255,255,0.06) !important;
}
body.dark-mode .gn-lj-info-item,
body.night .gn-lj-info-item {
    background: #1a1a1a !important;
}
body.dark-mode .gn-lj-preview-card,
body.night .gn-lj-preview-card {
    background-color: #1a1a1a !important;
    background-image: radial-gradient(rgba(255,255,255,0.03) 1px, transparent 1px) !important;
}

/* === action-sheet 去蓝
   ⚠️ 已移除 .persona-sheet-panel：交还给 apps-styles.css 的 --mm-* 变量驱动 */
body.dark-mode .action-sheet,
body.night .action-sheet {
    background: #1a1a1a !important;
}