/* ==========================================================================
   Astraeus OS - Liquid Crystal Glassmorphism Design System (v0.5.2)
   Nordic Crystal & High-End Minimalist Ergonomics (Clean & Pure)
   ========================================================================== */

/* 1. Global Color Tokens & System Variables */
:root {
  /* Deep Obsidian Canvas */
  --pop-bg: #10131a !important;
  --pop-surface: #10131a !important;
  --pop-surface-container-lowest: #0b0e14 !important;
  --pop-surface-container-low: #191c22 !important;
  --pop-surface-container: #1d2026 !important;
  
  /* Luminous Accents */
  --pop-primary: #dbfcff !important;            /* Pure Crisp Luminous White-Cyan for Headings */
  --pop-primary-fixed: #7df4ff !important;      /* Core Neon Cyan for Pointer, Active, Glow */
  --pop-primary-fixed-dim: #00dbe9 !important;  /* Secondary Cyan for Badges, Indexes */
  --pop-primary-container: #00f0ff !important;
  --pop-on-primary: #00363a !important;
  --pop-on-primary-container: #004f54 !important;

  /* Secondary Nebula Violet */
  --pop-secondary: #dcb8ff !important;
  --pop-secondary-container: #7701d0 !important;

  /* Ultra-High Contrast Typography */
  --pop-on-surface: #f1f5f9 !important;          /* Crisp Bright Body Text */
  --pop-on-background: #f1f5f9 !important;
  --pop-on-surface-variant: #b9cacb !important;  /* High Readability Cyan-Grey */
  --pop-outline: #849495 !important;
  --pop-outline-variant: #3b494b !important;

  /* Fonts */
  --pop-font-headline: 'Sora', 'Orbitron', system-ui, sans-serif !important;
  --pop-font-body: 'Hanken Grotesk', 'Inter', system-ui, sans-serif !important;
  --pop-font-mono: 'JetBrains Mono', monospace !important;
}

/* 2. Body & Absolute Pure Deep Space Canvas (#10131a) */
html.dark, html.dark body, body.popos {
  background-color: #10131a !important;
  background-image: none !important;
  color: var(--pop-on-surface) !important;
  font-family: var(--pop-font-body) !important;
  overflow-x: hidden;
}

#pop-wallpaper {
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  background-color: #10131a !important;
  background: radial-gradient(circle at 50% 50%, rgba(0, 54, 58, 0.25) 0%, #10131a 100%) !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

#pop-wallpaper::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, #7df4ff 1px, transparent 1px) !important;
  background-size: 50px 50px !important;
  opacity: 0.18 !important;
  pointer-events: none !important;
}

/* 3. Typography & Hierarchy */
h1, h2, h3, h4, h5, h6, .window-title, .archive-main-title {
  font-family: var(--pop-font-headline) !important;
  letter-spacing: -0.01em;
  color: var(--pop-primary) !important;
  font-weight: 700 !important;
}

p, span, div, li, a {
  font-family: var(--pop-font-body);
}

.mono, [data-stat], .stat-val, .post-date-badge, time, .font-mono {
  font-family: var(--pop-font-mono) !important;
}

/* 4. Liquid Crystal Glassmorphism */
.glass-panel, .glass, .glass-dark, #pop-cards .glass, #pop-cards .glass-dark {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.055) 0%, rgba(255, 255, 255, 0.01) 50%, rgba(0, 0, 0, 0.15) 100%), rgba(13, 17, 26, 0.65) !important;
  backdrop-filter: blur(24px) saturate(190%) contrast(104%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(190%) contrast(104%) !important;
  border: 1px solid rgba(132, 148, 149, 0.28) !important;
  border-radius: 0.75rem !important;
  box-shadow: 
    inset 0 1px 0 0 rgba(255, 255, 255, 0.16),
    inset 0 -1px 0 0 rgba(0, 0, 0, 0.25),
    0 10px 36px rgba(0, 0, 0, 0.52) !important;
  color: var(--pop-on-surface) !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease !important;
}

.glass-panel:hover, .glass:hover, .glass-dark:hover, #pop-cards .glass:hover, #pop-cards .glass-dark:hover {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 50%, rgba(0, 0, 0, 0.1) 100%), rgba(34, 40, 52, 0.82) !important;
  border-color: rgba(125, 244, 255, 0.42) !important;
  box-shadow: 
    inset 0 1px 0 0 rgba(255, 255, 255, 0.28),
    0 16px 44px rgba(0, 0, 0, 0.65),
    0 0 20px rgba(0, 240, 255, 0.12) !important;
  transform: translateY(-2px);
}

/* Featured Card */
.glass-panel-glow, #featured-card {
  border: 1px solid rgba(0, 240, 255, 0.55) !important;
  box-shadow: 
    inset 0 1px 0 0 rgba(255, 255, 255, 0.25),
    0 10px 36px rgba(0, 0, 0, 0.55),
    0 0 20px rgba(0, 240, 255, 0.15) !important;
}

/* 5. Desktop Bento Card Modules */
#pop-cards h3, #pop-cards h4 {
  color: var(--pop-primary) !important;
  font-family: var(--pop-font-headline) !important;
}

#pop-cards .text-slate-400, #pop-cards .text-slate-500, #pop-cards .text-slate-600, #pop-cards .text-slate-700 {
  color: var(--pop-on-surface-variant) !important;
}

#pop-cards a, #pop-cards .article-link, #pop-cards .featured-link {
  color: var(--pop-on-surface) !important;
  text-decoration: none;
  transition: all 0.2s ease;
  font-size: 14px !important;
  font-weight: 500 !important;
}

#pop-cards a:hover, #pop-cards .article-link:hover, #pop-cards .featured-link:hover {
  color: var(--pop-primary-fixed) !important;
}

/* Articles List */
#pop-cards #articles-list {
  padding-left: 6px !important;
  padding-right: 6px !important;
  gap: 10px !important;
}

#pop-cards .interactive-list-item, 
#pop-cards .article-item,
html.dark #pop-cards .interactive-list-item,
html.dark #pop-cards .article-item {
  position: relative !important;
  padding: 5px 6px !important;
  border-radius: 0 !important;
  min-height: 32px !important;
  line-height: 1.5 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#pop-cards .interactive-list-item:hover, 
#pop-cards .article-item:hover,
html.dark #pop-cards .interactive-list-item:hover,
html.dark #pop-cards .article-item:hover {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: translateX(3px) !important;
}

.article-num {
  min-width: 24px !important;
  font-family: var(--pop-font-mono) !important;
  color: #00dbe9 !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  text-shadow: 0 0 6px rgba(0, 219, 233, 0.35) !important;
}

/* ==========================================================================
   无框赛博指令操作按钮 (Borderless Cyber Action Link - 彻底破除框中框)
   ========================================================================== */
.sci-btn, .read-more, #pop-cards .read-more {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  padding: 4px 2px !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  color: #a8dbe6 !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
}

/* 按钮主体文本 */
.sci-btn .btn-text, .read-more .btn-text {
  color: #bce9f2 !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  transition: color 0.2s ease, text-shadow 0.2s ease !important;
}

/* 单线科技指向箭头 */
.sci-btn i, .read-more i, #pop-cards .read-more i {
  color: #00f0ff !important;
  font-size: 14px !important;
  font-weight: bold !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease, text-shadow 0.2s ease !important;
}

/* 底部极光微流线 (悬停时平滑展开) */
.sci-btn::before, .read-more::before {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 1.5px !important;
  background: linear-gradient(90deg, #00f0ff 0%, rgba(0, 240, 255, 0.6) 60%, transparent 100%) !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.8) !important;
  transform: scaleX(0) !important;
  transform-origin: left center !important;
  transition: transform 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
  pointer-events: none !important;
}

/* 悬停微交互：文字纯白提亮、箭头右移与激光流光底线展开 */
.sci-btn:hover, .read-more:hover, #pop-cards .read-more:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.sci-btn:hover::before, .read-more:hover::before {
  transform: scaleX(1) !important;
}

.sci-btn:hover .btn-text, .read-more:hover .btn-text {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.7) !important;
}

.sci-btn:hover i, .read-more:hover i, #pop-cards .read-more:hover i {
  transform: translateX(4px) !important;
  color: #ffffff !important;
  text-shadow: 0 0 10px #00f0ff !important;
}

/* Clock Widget (Aero-Grade Floating Astrolabe - 彻底消除“盘子/深盆”感) */
#clock-widget .clock-face {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  position: relative !important;
}

/* 精致轻盈的星轨同心微光微刻线（取代笨重深凹盆底） */
#clock-widget .clock-face::before {
  content: '' !important;
  position: absolute !important;
  inset: 12px !important;
  border-radius: 50% !important;
  border: 1px dashed rgba(0, 240, 255, 0.16) !important;
  pointer-events: none !important;
}

#clock-widget .clock-face::after {
  content: '' !important;
  position: absolute !important;
  inset: 38px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(125, 244, 255, 0.08) !important;
  background: radial-gradient(circle at 50% 50%, rgba(0, 240, 255, 0.04) 0%, transparent 75%) !important;
  pointer-events: none !important;
}

/* 刻度极致纤细精工化（取消笨拙粗荧光棒） */
#clock-widget .clock-tick {
  width: 1px !important;
  height: 4px !important;
  background: rgba(185, 202, 203, 0.28) !important;
  border-radius: 1px !important;
  margin-top: 4px !important;
  box-shadow: none !important;
}

#clock-widget .clock-tick-major {
  width: 1.5px !important;
  height: 8px !important;
  background: #7df4ff !important;
  box-shadow: 0 0 4px rgba(0, 240, 255, 0.45) !important;
  border-radius: 1px !important;
  margin-top: 2px !important;
}

/* 精密轴心：高科技双重微环，取消大黑圈 */
#clock-widget .clock-center {
  width: 8px !important;
  height: 8px !important;
  background: #dbfcff !important;
  border: 2px solid #00f0ff !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.8), 0 0 2px #ffffff !important;
  z-index: 40 !important;
}

/* 修长优雅的航空级指针 */
#clock-widget .clock-hour {
  width: 3.5px !important;
  height: 44px !important;
  margin-left: -1.75px !important;
  background: linear-gradient(to top, rgba(0, 219, 233, 0.8), #dbfcff) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5) !important;
  border-radius: 2px !important;
  z-index: 10 !important;
}

#clock-widget .clock-minute {
  width: 2px !important;
  height: 60px !important;
  margin-left: -1px !important;
  background: linear-gradient(to top, #00f0ff, #ffffff) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
  border-radius: 1px !important;
  z-index: 20 !important;
}

#clock-widget .clock-second {
  width: 1px !important;
  height: 72px !important;
  margin-left: -0.5px !important;
  background: #00f0ff !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.9) !important;
  z-index: 30 !important;
}

#clock-widget .sec-tail {
  width: 1px !important;
  height: 16px !important;
  background: #00f0ff !important;
  bottom: -16px !important;
  left: 0 !important;
  box-shadow: 0 0 6px rgba(0, 240, 255, 0.6) !important;
}

#clock-widget .clock-time {
  color: #dbfcff !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  text-shadow: 0 0 16px rgba(125, 244, 255, 0.3) !important;
  margin-top: 4px !important;
  margin-bottom: 2px !important;
}

#clock-widget .clock-date {
  color: #7df4ff !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.16em !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.35) !important;
}

/* 6. Window & Panel System (.pop-window) */
.pop-window {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 50%, rgba(0, 0, 0, 0.15) 100%), rgba(22, 26, 35, 0.96) !important;
  backdrop-filter: blur(28px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
  border: 1px solid rgba(132, 148, 149, 0.35) !important;
  box-shadow: 
    inset 0 1px 0 0 rgba(255, 255, 255, 0.2),
    0 24px 70px rgba(0, 0, 0, 0.8),
    0 0 20px rgba(0, 219, 233, 0.08) !important;
  border-radius: 0.75rem !important;
  color: var(--pop-on-surface) !important;
}

.pop-window .window-content {
  background: transparent !important;
  color: var(--pop-on-surface) !important;
  flex: 1 1 0% !important;
  height: auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}

.window-titlebar {
  background: rgba(18, 22, 32, 0.68) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(59, 73, 75, 0.4) !important;
  color: var(--pop-primary) !important;
}

/* Browser Window Toolbars & Tabs (Complete Dark Mode Eradication of White) */
.pop-window[data-type=browser] .browser-tabs,
.pop-window.browser-window .browser-tabs {
  background: rgba(14, 17, 24, 0.68) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(59, 73, 75, 0.4) !important;
}

.pop-window[data-type=browser] .browser-tab,
.pop-window.browser-window .browser-tab {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #b9cacb !important;
  border: 1px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  transition: all 0.2s ease !important;
}

.pop-window[data-type=browser] .browser-tab:hover,
.pop-window.browser-window .browser-tab:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #fff !important;
}

/* 消除突兀白色 1：激活的 Tab 标签 */
.pop-window[data-type=browser] .browser-tab.active,
.pop-window.browser-window .browser-tab.active {
  background: rgba(22, 28, 40, 0.75) !important;
  background-color: rgba(22, 28, 40, 0.75) !important;
  color: #dbfcff !important;
  border: 1px solid rgba(0, 240, 255, 0.35) !important;
  border-bottom: 1px solid rgba(22, 28, 40, 0.75) !important;
  box-shadow: 0 -2px 10px rgba(0, 240, 255, 0.12) !important;
}

.pop-window[data-type=browser] .browser-tab .tab-title,
.pop-window.browser-window .browser-tab .tab-title {
  color: inherit !important;
}

.pop-window[data-type=browser] .browser-tab.active .tab-title,
.pop-window.browser-window .browser-tab.active .tab-title {
  color: #dbfcff !important;
  font-weight: 600 !important;
}

.pop-window[data-type=browser] .new-tab,
.pop-window.browser-window .new-tab {
  background: rgba(39, 42, 49, 0.6) !important;
  border: 1px solid rgba(132, 148, 149, 0.3) !important;
  color: #b9cacb !important;
  border-radius: 6px !important;
}

.pop-window[data-type=browser] .new-tab:hover,
.pop-window.browser-window .new-tab:hover {
  background: rgba(0, 240, 255, 0.15) !important;
  border-color: rgba(0, 240, 255, 0.4) !important;
  color: #fff !important;
}

/* 消除突兀白色 2：地址栏与工具栏 */
.pop-window[data-type=browser] .browser-toolbar,
.pop-window.browser-window .browser-toolbar {
  background: rgba(16, 20, 28, 0.65) !important;
  background-color: rgba(16, 20, 28, 0.65) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(59, 73, 75, 0.4) !important;
}

.pop-window[data-type=browser] .browser-btn,
.pop-window.browser-window .browser-btn {
  background: rgba(39, 42, 49, 0.8) !important;
  border: 1px solid rgba(132, 148, 149, 0.25) !important;
  color: #b9cacb !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
}

.pop-window[data-type=browser] .browser-btn:hover:not(:disabled),
.pop-window.browser-window .browser-btn:hover:not(:disabled) {
  background: rgba(0, 240, 255, 0.15) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  color: #dbfcff !important;
}

.pop-window[data-type=browser] .address-wrap,
.pop-window.browser-window .address-wrap {
  background: rgba(10, 13, 18, 0.92) !important;
  background-color: rgba(10, 13, 18, 0.92) !important;
  border: 1px solid rgba(132, 148, 149, 0.35) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.5) !important;
}

.pop-window[data-type=browser] .address,
.pop-window.browser-window .address {
  background: transparent !important;
  background-color: transparent !important;
  color: #dbfcff !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 13px !important;
}

.pop-window[data-type=browser] .address-prefix,
.pop-window.browser-window .address-prefix {
  color: #00dbe9 !important;
  opacity: 0.85 !important;
}

/* ==========================================================================
   7. Bottom Navigation Dock & Tooltip (Astraeus Holographic Floating Dock)
   - 彻底告别“框套框”！内层移除所有死板小方块边框与厚重背景，图标轻盈悬浮呼吸
   - 外层纯圆弧深空流光毛玻璃胶囊（Pill Capsule），浑然一体
   - 悬停全息圆形微光晕（Orb Spotlight）+ 弹性轻浮放大动效
   ========================================================================== */
.dock-bar, #pop-dock .dock-bar {
  background: rgba(10, 16, 26, 0.72) !important;
  backdrop-filter: blur(28px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(200%) !important;
  border: 1px solid rgba(0, 240, 255, 0.2) !important;
  border-radius: 9999px !important;
  padding: 6px 14px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.7), 0 0 24px rgba(0, 240, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Dock Items - 彻底去框化，轻盈全息悬浮 */
.dock-item, #pop-dock .dock-item {
  width: 44px !important;
  height: 44px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 50% !important;
  backdrop-filter: none !important;
  color: #bfe8f1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  cursor: pointer !important;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease, background 0.25s ease !important;
}

/* 悬停微动效：圆形聚光粒子光晕 + 向上轻浮 */
.dock-item:hover, #pop-dock .dock-item:hover {
  background: radial-gradient(circle, rgba(0, 240, 255, 0.18) 0%, rgba(0, 240, 255, 0) 72%) !important;
  border: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
  transform: translateY(-8px) scale(1.22) !important;
}

.dock-item:active, #pop-dock .dock-item:active {
  transform: translateY(-2px) scale(0.95) !important;
}

/* 图标本体微光 */
.dock-item i, #pop-dock .dock-item i {
  color: inherit !important;
  font-size: 22px !important;
  filter: drop-shadow(0 0 6px rgba(0, 240, 255, 0.3)) !important;
  transition: transform 0.24s cubic-bezier(0.16, 1, 0.3, 1), filter 0.24s ease, color 0.2s ease !important;
}

.dock-item:hover i, #pop-dock .dock-item:hover i {
  filter: drop-shadow(0 0 14px rgba(0, 240, 255, 0.95)) drop-shadow(0 0 4px #00f0ff) !important;
  transform: scale(1.06) !important;
}

/* 运行指示点 */
.dock-item .dot, #pop-dock .dock-item .dot {
  position: absolute !important;
  bottom: 2px !important;
  width: 4px !important;
  height: 4px !important;
  border-radius: 50% !important;
  background-color: #00f0ff !important;
  box-shadow: 0 0 8px #00f0ff, 0 0 14px rgba(0, 240, 255, 0.8) !important;
}

.dock-tooltip, #pop-dock .dock-tooltip {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%), rgba(14, 18, 28, 0.96) !important;
  border: 1px solid rgba(125, 244, 255, 0.35) !important;
  border-radius: 8px !important;
  padding: 7px 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6), 0 0 12px rgba(0, 240, 255, 0.15) !important;
}

.dock-tooltip b, #pop-dock .dock-tooltip b {
  color: #dbfcff !important;
  font-family: var(--pop-font-headline) !important;
}

.dock-tooltip em, #pop-dock .dock-tooltip em {
  color: #8da4b5 !important;
}

/* 8. 2D Timeline System & Archive Components */
.archive-page-wrapper {
  padding: 4px 6px 60px 6px !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  min-height: 100% !important;
}

/* Year Milestone Divider */
.archive-year-block {
  margin-top: 36px !important;
  margin-bottom: 24px !important;
}

.archive-year-divider {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
  width: 100% !important;
}

/* 无边框科幻时间节点 (彻底去除臃肿圆框，大号高光发光数字 + 极光脉冲星) */
.timeline-year-header {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  flex-shrink: 0 !important;
  user-select: none !important;
}

.timeline-year-header .year-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  font-family: var(--pop-font-headline, 'Sora', sans-serif) !important;
  background: linear-gradient(135deg, #ffffff 0%, #dbfcff 35%, #00f0ff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 0 14px rgba(0, 240, 255, 0.45)) !important;
  text-shadow: none !important;
}

.timeline-year-header .year-badge i {
  display: inline-block !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #00f0ff !important;
  box-shadow: 0 0 10px #00f0ff, 0 0 18px rgba(0, 240, 255, 0.6) !important;
  font-size: 0 !important;
  position: relative !important;
  margin-right: 2px !important;
  -webkit-text-fill-color: initial !important;
}

.year-divider-line {
  flex: 1 1 auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, rgba(0, 240, 255, 0.55) 0%, rgba(56, 189, 248, 0.25) 50%, transparent 100%) !important;
}

/* 页面标题英文字符酷炫徽章 (彻底去掉生硬小圆框，极客渐变发光文字) */
.page-title-badge,
.archive-top-bar .page-title-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  background: linear-gradient(135deg, #7df4ff 0%, #00f0ff 45%, #38bdf8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.55)) !important;
  user-select: none !important;
  line-height: 1.2 !important;
}

.page-title-badge::before,
.archive-top-bar .page-title-badge::before {
  content: '//' !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  opacity: 0.55 !important;
  margin-right: -1px !important;
  letter-spacing: 0 !important;
  color: #00f0ff !important;
  -webkit-text-fill-color: #00f0ff !important;
}

/* 全站顶栏 HUD 状态统计与搜索关键词 (彻底去除突兀灰黑药丸框，纯粹通透高光文字) */
.archive-mini-stats,
.archive-top-bar .archive-mini-stats {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  white-space: nowrap !important;
  margin: 0 !important;
  user-select: none !important;
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  font-size: 13px !important;
  color: #94a3b8 !important;
  line-height: 1.2 !important;
}

.archive-mini-stats i,
.archive-top-bar .archive-mini-stats i {
  color: #00f0ff !important;
  font-size: 14px !important;
  filter: drop-shadow(0 0 6px rgba(0, 240, 255, 0.55)) !important;
}

.archive-mini-stats span,
.archive-top-bar .archive-mini-stats span {
  color: #94a3b8 !important;
}

.archive-mini-stats span[th\\:text],
.archive-mini-stats strong,
.archive-mini-stats .font-mono,
.archive-mini-stats [style*="font-weight: 700"],
.archive-top-bar .archive-mini-stats [style*="font-weight: 700"],
.archive-mini-stats .stats-val,
.archive-mini-stats .keyword-val {
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: #dbfcff !important;
  letter-spacing: 0.02em !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.5) !important;
}


.timeline-posts-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.timeline-post-card {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 16px 20px !important;
  box-sizing: border-box !important;
  border-radius: 0.75rem !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.008) 100%), rgba(24, 28, 36, 0.75) !important;
  border: 1px solid rgba(132, 148, 149, 0.3) !important;
  backdrop-filter: blur(24px) saturate(160%) !important;
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.12), 0 8px 24px rgba(0, 0, 0, 0.45) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  margin-bottom: 4px !important;
  overflow: hidden !important;
}

.timeline-post-card:hover {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.015) 100%), rgba(34, 40, 52, 0.88) !important;
  border-color: rgba(0, 240, 255, 0.5) !important;
  transform: translateX(4px);
}

.timeline-post-card .post-date-badge {
  flex-shrink: 0 !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 13px !important;
  color: var(--pop-primary-fixed-dim) !important;
  font-weight: 700 !important;
  min-width: 50px !important;
}

.timeline-post-card .post-main-content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin-right: 12px !important;
}

.timeline-post-card .post-arrow-btn {
  margin-left: auto !important;
  margin-right: 0 !important;
  flex-shrink: 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 24px !important;
  min-height: 24px !important;
  padding: 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  color: #64748b !important;
  font-size: 20px !important;
  opacity: 0.7 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.22s ease, filter 0.28s ease, opacity 0.22s ease !important;
}

.timeline-post-card:hover .post-arrow-btn,
.timeline-post-card .post-arrow-btn:hover {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: #00f0ff !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.95)) drop-shadow(0 0 16px rgba(0, 240, 255, 0.5)) !important;
  transform: translate(5px, -5px) scale(1.22) !important;
}

.timeline-post-card:active .post-arrow-btn,
.timeline-post-card .post-arrow-btn:active {
  transform: translate(2px, -2px) scale(1.08) !important;
  color: #dbfcff !important;
}

/* 9. Pagination System - 浑然天成纯净无界微交互体系 (彻底消除外层黑框，完美融入星轨背景) */
.pop-pagination,
.stellar-pagination {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin: 44px auto 24px !important;
  padding: 12px 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  max-width: 100% !important;
}

.pagination-controls {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}

/* 导航按钮 (上一页 / 下一页 - 彻底去除实体边框与背景，纯净 Action 链接) */
.pop-pagination .page-btn,
.stellar-pagination .page-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  padding: 6px 10px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 6px !important;
  color: #94a9b8 !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: color 0.2s ease, text-shadow 0.2s ease, transform 0.2s ease !important;
}

.pop-pagination .page-btn i,
.stellar-pagination .page-btn i {
  font-size: 14px !important;
  transition: transform 0.2s ease, color 0.2s ease !important;
}

.pop-pagination .page-btn:hover,
.stellar-pagination .page-btn:hover {
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.8) !important;
  box-shadow: none !important;
}

.stellar-pagination .page-btn-prev:hover i {
  transform: translateX(-3px) !important;
  color: #00f0ff !important;
}

.stellar-pagination .page-btn-next:hover i {
  transform: translateX(3px) !important;
  color: #00f0ff !important;
}

.stellar-pagination .page-btn-disabled {
  opacity: 0.25 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #64748b !important;
}

/* 页码指示器 (彻底去除胶囊线框，自然纯净排布) */
.stellar-pagination .page-indicator,
.pop-pagination .page-info,
.page-info {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 13px !important;
  padding: 0 6px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.stellar-pagination .page-num-current {
  color: #00f0ff !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.7) !important;
}

.stellar-pagination .page-divider {
  color: rgba(255, 255, 255, 0.25) !important;
  font-weight: 300 !important;
  margin: 0 2px !important;
}

.stellar-pagination .page-num-total {
  color: #cbd5e1 !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}

.stellar-pagination .page-unit {
  font-size: 12px !important;
  color: #64748b !important;
  font-weight: 400 !important;
  margin-left: 2px !important;
}

/* 页码快速跃迁输入区 (极简通透底线，告别实体黑方框) */
.stellar-pagination .page-jumper {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding-left: 16px !important;
  border-left: 1px solid rgba(125, 244, 255, 0.18) !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 12px !important;
  color: #8da4b5 !important;
}

.stellar-pagination .jumper-input-wrapper {
  display: inline-flex !important;
}

.stellar-pagination .jumper-input {
  width: 32px !important;
  height: 22px !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1.5px solid rgba(125, 244, 255, 0.3) !important;
  border-radius: 0 !important;
  color: #00f0ff !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-align: center !important;
  outline: none !important;
  padding: 0 2px !important;
  transition: all 0.2s ease !important;
  -moz-appearance: textfield !important;
}

.stellar-pagination .jumper-input::-webkit-outer-spin-button,
.stellar-pagination .jumper-input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

.stellar-pagination .jumper-input:focus {
  border-bottom-color: #00f0ff !important;
  background: transparent !important;
  box-shadow: 0 2px 8px rgba(0, 240, 255, 0.35) !important;
  color: #ffffff !important;
}

.stellar-pagination .jumper-input::placeholder {
  color: rgba(125, 244, 255, 0.45) !important;
  opacity: 1 !important;
  transition: opacity 0.15s ease, color 0.15s ease !important;
}

/* 当输入框处于聚焦(有光标)状态时，占位数字彻底隐去，杜绝与光标重叠 */
.stellar-pagination .jumper-input:focus::placeholder {
  color: transparent !important;
  opacity: 0 !important;
}

/* 跳转确认动作按钮 (去方框化，极简单线箭头) */
.stellar-pagination .jumper-btn {
  width: 24px !important;
  height: 24px !important;
  border-radius: 4px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #00f0ff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  font-size: 15px !important;
  padding: 0 !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.stellar-pagination .jumper-btn:hover {
  background: transparent !important;
  border: none !important;
  color: #ffffff !important;
  text-shadow: 0 0 10px #00f0ff !important;
  transform: translateX(2px) scale(1.15) !important;
}

.stellar-pagination .jumper-btn:active {
  transform: scale(0.92) !important;
}

/* 10. Custom Scrollbars */
::-webkit-scrollbar {
  width: 5px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(125, 244, 255, 0.3);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(125, 244, 255, 0.6);
}

/* ==========================================================================
   11. Categories & Tags Nebula Aesthetics
   ========================================================================== */
.categories-page-wrapper, .tags-page-wrapper {
  padding: 4px 6px 60px 6px !important;
  box-sizing: border-box !important;
  min-height: 100% !important;
}

/* 消除分类与标签大白板，转为液态水晶暗黑曜石质感 */
.overview-module, .overview-body {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.008) 100%), rgba(22, 26, 36, 0.85) !important;
  backdrop-filter: blur(28px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
  border: 1px solid rgba(132, 148, 149, 0.3) !important;
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.15), 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

.cat-card:hover {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 50%, rgba(0, 0, 0, 0.1) 100%), rgba(34, 40, 52, 0.92) !important;
  border-color: rgba(0, 240, 255, 0.5) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 240, 255, 0.15) !important;
  transform: translateY(-3px) !important;
}

.tag-capsule-btn:hover {
  background: rgba(0, 240, 255, 0.18) !important;
  border-color: rgba(0, 240, 255, 0.55) !important;
  box-shadow: 0 0 14px rgba(0, 240, 255, 0.25) !important;
  transform: translateY(-2px) scale(1.02) !important;
}

/* ==========================================================================
   12. Post Detail Golden Measure & High Contrast Typography (WCAG AAA)
   ========================================================================== */
.post-detail-wrapper {
  width: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  position: relative !important;
}

/* 正文与全息侧边目录的双列自适应弹性外壳 */
.post-layout-container {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: 1440px !important;
  margin: 0 auto !important;
  position: relative !important;
  gap: 36px !important;
  box-sizing: border-box !important;
  padding: 0 24px !important;
}

.post-layout-container .pop-post,
.pop-post {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 1060px !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  padding: 16px 32px 80px 32px !important;
}

/* ==========================================================================
   文章全息目录 (Astraeus Holographic TOC - 随正文滚动固定在侧边空白处)
   - 宽屏大屏自然利用侧边空白（≥ 1380px 常驻 Sticky）
   - 中窄屏 / 窗口折叠为极简 FAB 抽屉，支持随时呼出
   - 纵向星轨引导线 + 多级子标题缩进 + Scrollspy 实时高亮脉冲
   ========================================================================== */
.post-toc-wrapper {
  width: 260px !important;
  flex-shrink: 0 !important;
  position: sticky !important;
  top: 84px !important;
  max-height: calc(100vh - 120px) !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
  z-index: 90 !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* 目录卡片本体：深空星轨毛玻璃全息质感 */
.post-toc-card {
  background: rgba(10, 16, 28, 0.65) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(0, 240, 255, 0.16) !important;
  border-radius: 14px !important;
  padding: 16px 14px 18px 14px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45), inset 0 0 16px rgba(0, 240, 255, 0.03) !important;
  display: flex !important;
  flex-direction: column !important;
  max-height: calc(100vh - 128px) !important;
  box-sizing: border-box !important;
}

/* 目录头部标头 */
.post-toc-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-bottom: 12px !important;
  margin-bottom: 10px !important;
  border-bottom: 1px solid rgba(0, 240, 255, 0.12) !important;
}

.post-toc-header .toc-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #7df4ff !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

.post-toc-header .toc-title i {
  color: #00f0ff !important;
  font-size: 15px !important;
}

.post-toc-header .toc-badge {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #00f0ff !important;
  background: rgba(0, 240, 255, 0.1) !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  padding: 2px 7px !important;
  border-radius: 10px !important;
}

/* 目录滚动区 */
.post-toc-body {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 4px !important;
  margin-right: -4px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 240, 255, 0.25) transparent !important;
}

.post-toc-body::-webkit-scrollbar {
  width: 4px !important;
}

.post-toc-body::-webkit-scrollbar-thumb {
  background: rgba(0, 240, 255, 0.25) !important;
  border-radius: 4px !important;
}

.post-toc-body::-webkit-scrollbar-thumb:hover {
  background: #00f0ff !important;
}

/* 目录列表与各级子标题树 */
.post-toc-body .toc-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  position: relative !important;
}

/* 左侧纵向引导星轨线 */
.post-toc-body .toc-list::before {
  content: "" !important;
  position: absolute !important;
  left: 6px !important;
  top: 6px !important;
  bottom: 6px !important;
  width: 1px !important;
  background: linear-gradient(180deg, rgba(0, 240, 255, 0.2) 0%, rgba(112, 0, 255, 0.15) 100%) !important;
}

.post-toc-body .toc-item {
  position: relative !important;
  display: block !important;
}

/* 层级缩进 */
.post-toc-body .toc-item.toc-level-1,
.post-toc-body .toc-item.toc-level-2 {
  padding-left: 0 !important;
}

.post-toc-body .toc-item.toc-level-3 {
  padding-left: 14px !important;
}

.post-toc-body .toc-item.toc-level-4 {
  padding-left: 24px !important;
}

.post-toc-body .toc-item.toc-level-5,
.post-toc-body .toc-item.toc-level-6 {
  padding-left: 34px !important;
}

/* 目录链接项 */
.post-toc-body .toc-link {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 5px 8px !important;
  border-radius: 6px !important;
  color: #92a4a7 !important;
  text-decoration: none !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
}

.post-toc-body .toc-marker {
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: rgba(146, 164, 167, 0.4) !important;
  flex-shrink: 0 !important;
  transition: all 0.22s ease !important;
}

.post-toc-body .toc-text {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  flex: 1 1 auto !important;
}

/* 目录链接项 Hover */
.post-toc-body .toc-link:hover {
  color: #dbfcff !important;
  background: rgba(0, 240, 255, 0.06) !important;
  transform: translateX(2px) !important;
}

.post-toc-body .toc-link:hover .toc-marker {
  background: #00f0ff !important;
  box-shadow: 0 0 6px #00f0ff !important;
}

/* 活跃项高亮 (Scrollspy 激活) */
.post-toc-body .toc-item.active > .toc-link {
  color: #00f0ff !important;
  font-weight: 600 !important;
  background: linear-gradient(90deg, rgba(0, 240, 255, 0.14) 0%, rgba(0, 240, 255, 0.02) 100%) !important;
  border-left: 2px solid #00f0ff !important;
}

.post-toc-body .toc-item.active > .toc-link .toc-marker {
  background: #00f0ff !important;
  box-shadow: 0 0 8px #00f0ff !important;
  transform: scale(1.3) !important;
}

.post-toc-body .toc-empty {
  padding: 24px 12px !important;
  text-align: center !important;
  color: #6a8084 !important;
  font-size: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
}

.post-toc-body .toc-empty i {
  font-size: 22px !important;
  opacity: 0.5 !important;
}

/* 中小屏 / 窗口宽度不足 1380px 时的响应式策略 */
@media (max-width: 1380px) {
  .post-layout-container {
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
  }

  .post-layout-container .pop-post {
    max-width: 1060px !important;
    margin: 0 auto !important;
  }

  /* 默认隐藏侧边常驻栏，转为全息浮动抽屉卡 */
  .post-toc-wrapper {
    position: fixed !important;
    right: 24px !important;
    bottom: 84px !important;
    width: 290px !important;
    max-height: 60vh !important;
    z-index: 998 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(16px) scale(0.95) !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8), 0 0 24px rgba(0, 240, 255, 0.25) !important;
  }

  .post-toc-wrapper.is-open {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateY(0) scale(1) !important;
  }

  /* 浮动呼出按钮显示 */
  .post-toc-trigger {
    display: inline-flex !important;
  }
}

/* 窄屏目录呼出按钮 (FAB) */
.post-toc-trigger {
  display: none;
  position: fixed !important;
  right: 28px !important;
  bottom: 84px !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(14, 22, 36, 0.8) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(0, 240, 255, 0.28) !important;
  color: #00f0ff !important;
  font-size: 18px !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 997 !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5), 0 0 12px rgba(0, 240, 255, 0.2) !important;
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.post-toc-trigger:hover,
.post-toc-trigger.active {
  background: rgba(0, 240, 255, 0.2) !important;
  border-color: #00f0ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 20px rgba(0, 240, 255, 0.5) !important;
  transform: scale(1.08) !important;
}

/* 右下角一键回到顶部按钮 (Back to Top) */
.post-back-to-top {
  position: fixed !important;
  right: 28px !important;
  bottom: 28px !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(14, 22, 36, 0.85) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(0, 240, 255, 0.28) !important;
  color: #00f0ff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 999 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(14px) scale(0.9) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5), 0 0 12px rgba(0, 240, 255, 0.2) !important;
  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.post-back-to-top.is-visible {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}

.post-back-to-top:hover {
  background: radial-gradient(circle, rgba(0, 240, 255, 0.25) 0%, rgba(14, 22, 36, 0.9) 100%) !important;
  border-color: #00f0ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 24px rgba(0, 240, 255, 0.6) !important;
  transform: translateY(-3px) scale(1.08) !important;
}

.post-back-to-top:active {
  transform: translateY(0) scale(0.95) !important;
}

/* 文章头部 */
.pop-post .post-header {
  margin-bottom: 2em !important;
  padding-bottom: 1.4em !important;
  border-bottom: 1px solid rgba(59, 73, 75, 0.5) !important;
}

.pop-post .post-eyebrow {
  color: #7df4ff !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  background: rgba(0, 240, 255, 0.12) !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  padding: 3px 10px !important;
  border-radius: 4px !important;
  text-decoration: none !important;
  display: inline-block !important;
  margin-bottom: 12px !important;
}

.pop-post .post-title {
  font-family: var(--pop-font-headline) !important;
  font-size: 2.2em !important;
  font-weight: 800 !important;
  color: #dbfcff !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
  margin: 0 0 14px 0 !important;
  text-shadow: 0 0 16px rgba(125, 244, 255, 0.15) !important;
}

.pop-post .post-meta {
  color: #b9cacb !important;
  font-size: 13px !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.pop-post .post-meta time, .pop-post .post-meta span {
  color: #b9cacb !important;
}

.pop-post .post-meta .meta-sep {
  color: rgba(132, 148, 149, 0.5) !important;
}

/* 摘要卡片 */
.pop-post .post-excerpt {
  margin-top: 1.4em !important;
  padding: 16px 20px !important;
  background: rgba(22, 26, 36, 0.8) !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  border-left: 4px solid #00f0ff !important;
  border-radius: 8px !important;
  color: #f1f5f9 !important;
  font-size: 14.5px !important;
  line-height: 1.75 !important;
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1) !important;
}

.pop-post .post-excerpt:before {
  color: #7df4ff !important;
  font-family: var(--pop-font-mono) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: 0.15em !important;
  margin-bottom: 6px !important;
}

/* 正文：彻底解除 68ch 限制，全宽铺展，超高对比度 */
.pop-prose {
  width: 100% !important;
  max-width: 100% !important;
  color: #f1f5f9 !important;
  font-family: var(--pop-font-body) !important;
  font-size: 16px !important;
  line-height: 1.85 !important;
}

.pop-prose p {
  max-width: 100% !important;
  width: 100% !important;
  color: #f1f5f9 !important;
  margin: 1.25em 0 !important;
  font-size: 16px !important;
  line-height: 1.85 !important;
}

.pop-prose h1, .pop-prose h2, .pop-prose h3, .pop-prose h4 {
  color: #dbfcff !important;
  font-family: var(--pop-font-headline) !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

.pop-prose h2 {
  font-size: 1.65em !important;
  margin: 2em 0 0.8em 0 !important;
  padding-bottom: 0.4em !important;
  border-bottom: 1px solid rgba(59, 73, 75, 0.6) !important;
}

.pop-prose h3 {
  font-size: 1.35em !important;
  margin: 1.6em 0 0.6em 0 !important;
}

.post-body.pop-prose a,
.pop-prose :where(p, li, blockquote) a {
  color: #7df4ff !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(125, 244, 255, 0.4) !important;
  text-underline-offset: 4px !important;
  transition: all 0.2s ease !important;
}

.post-body.pop-prose a:hover,
.pop-prose :where(p, li, blockquote) a:hover {
  color: #dbfcff !important;
  text-decoration-color: #00f0ff !important;
}

.pop-prose ul, .pop-prose ol {
  color: #f1f5f9 !important;
  padding-left: 24px !important;
  margin: 1em 0 !important;
}

.pop-prose li {
  margin: 0.5em 0 !important;
  line-height: 1.75 !important;
}

.pop-prose blockquote {
  max-width: 100% !important;
  margin: 1.6em 0 !important;
  padding: 14px 20px !important;
  background: rgba(0, 240, 255, 0.06) !important;
  border: 1px solid rgba(0, 240, 255, 0.2) !important;
  border-left: 4px solid #00f0ff !important;
  border-radius: 6px !important;
  color: #dbfcff !important;
}

.pop-prose blockquote p {
  color: #dbfcff !important;
  margin: 0 !important;
}

.pop-prose pre, .pop-prose code {
  font-family: var(--pop-font-mono) !important;
}

.pop-prose :not(pre) > code {
  background: rgba(0, 240, 255, 0.12) !important;
  color: #7df4ff !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  font-size: 0.88em !important;
}

/* 底部标签与前后篇导航卡片 */
/* 底部标签与前后篇导航卡片 */
.pop-post .post-footer {
  margin-top: 48px !important;
  padding-top: 28px !important;
  border-top: 1px solid rgba(0, 240, 255, 0.15) !important;
}

/* ==========================================================================
   文章底部导航：星轨全息跃迁通道 (Orbit Warp Stream - 彻底去卡片化)
   - 彻底废除封闭死板的大方框卡片，告别卡片内大面积死黑空白
   - 0 封闭矩形方框约束，视觉完全呼吸自由，与星空背景全息交融
   - 悬浮量子光环徽章 (Warp Ring) + 光子微弹跃迁 + 底部激射式极光流光束 (Warp Beam)
   - 单篇时对侧以极简内敛的 HUD 时间线尽头刻度守护秩序平衡
   ========================================================================== */
.pop-post .post-nav,
.post-nav {
  text-decoration: none !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 24px !important;
  margin-top: 32px !important;
  margin-bottom: 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid rgba(0, 240, 255, 0.12) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
}

@media (max-width: 680px) {
  .pop-post .post-nav,
  .post-nav {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 16px !important;
  }
}

/* 跃迁穿梭单元：彻底去除封闭大黑盒与死板卡片边框，转为无界全息微光翼 */
.nav-warp-link,
.pop-post .post-nav a,
.post-nav a {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 8px 12px !important;
  min-height: 54px !important;
  width: fit-content !important;
  max-width: 48% !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  /* 彻底去卡片化：无背景、无实线边框、无沉重阴影 */
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

@media (max-width: 680px) {
  .nav-warp-link,
  .pop-post .post-nav a,
  .post-nav a {
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* 左翼上一篇与右翼下一篇排布 */
.post-nav .nav-prev {
  margin-right: auto !important;
  text-align: left !important;
}

.post-nav .nav-next {
  margin-left: auto !important;
  text-align: right !important;
  flex-direction: row !important;
}

/* 量子光环徽章 (Warp Ring) */
.nav-warp-icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: radial-gradient(circle, rgba(0, 240, 255, 0.12) 0%, rgba(0, 240, 255, 0.02) 70%) !important;
  border: 1px solid rgba(0, 240, 255, 0.28) !important;
  color: #00f0ff !important;
  flex-shrink: 0 !important;
  position: relative !important;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 0 14px rgba(0, 240, 255, 0.15) !important;
}

.nav-warp-icon svg {
  transition: transform 0.25s ease !important;
}

/* 跃迁内容容器 */
.nav-warp-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

/* 标签指示（PREV / NEXT） */
.nav-warp-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  color: #6deaff !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
}

.post-nav .nav-next .nav-warp-label {
  justify-content: flex-end !important;
}

/* 脉冲微光点 */
.warp-pulse-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #00f0ff !important;
  box-shadow: 0 0 8px #00f0ff !important;
  display: inline-block !important;
  animation: radar-pulse 2s infinite ease-in-out !important;
}

/* 标题文字：明亮优雅，杜绝下划线与方框束缚 */
.nav-warp-title {
  font-family: 'Sora', var(--pop-font-sans), sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #e2f9fc !important;
  line-height: 1.4 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  transition: color 0.2s ease, text-shadow 0.2s ease !important;
}

/* 底部极光流光束 (Warp Beam：平常隐匿，Hover 时激射而出) */
.nav-warp-link .warp-beam {
  position: absolute !important;
  bottom: 0 !important;
  height: 2px !important;
  width: 0% !important;
  transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.35s ease !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.nav-warp-link.nav-prev .warp-beam {
  left: 60px !important;
  background: linear-gradient(90deg, #00f0ff 0%, rgba(0, 240, 255, 0) 100%) !important;
}

.nav-warp-link.nav-next .warp-beam {
  right: 60px !important;
  background: linear-gradient(270deg, #00f0ff 0%, rgba(0, 240, 255, 0) 100%) !important;
}

/* 悬停动效：跃迁光子推进与极光呼吸 */
.nav-warp-link:hover {
  background: rgba(0, 240, 255, 0.04) !important;
  transform: translateY(-2px) !important;
}

.nav-warp-link:hover .warp-beam {
  width: calc(100% - 60px) !important;
  opacity: 1 !important;
}

.nav-warp-link:hover .nav-warp-icon {
  transform: scale(1.1) !important;
  border-color: #00f0ff !important;
  background: radial-gradient(circle, rgba(0, 240, 255, 0.28) 0%, rgba(0, 240, 255, 0.06) 80%) !important;
  box-shadow: 0 0 24px rgba(0, 240, 255, 0.55), inset 0 0 10px rgba(0, 240, 255, 0.3) !important;
  color: #ffffff !important;
}

.nav-warp-link.nav-prev:hover .nav-warp-icon svg {
  transform: translateX(-3px) !important;
}

.nav-warp-link.nav-next:hover .nav-warp-icon svg {
  transform: translateX(3px) !important;
}

.nav-warp-link:hover .nav-warp-title {
  color: #ffffff !important;
  text-shadow: 0 0 12px rgba(0, 240, 255, 0.7) !important;
}

/* 时间线终点/原点刻度样式（零方框、静止沉稳的星际时间线前沿刻度） */
.nav-warp-link.nav-terminus {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  opacity: 0.55 !important;
  cursor: default !important;
}

.nav-warp-link.nav-terminus:hover {
  transform: none !important;
  background: transparent !important;
}

.nav-warp-link.nav-terminus .terminus-icon {
  width: 38px !important;
  height: 38px !important;
  border: 1px dashed rgba(142, 168, 175, 0.35) !important;
  color: #79979d !important;
  background: rgba(255, 255, 255, 0.02) !important;
  box-shadow: none !important;
}

.nav-warp-link.nav-terminus .nav-warp-label {
  font-size: 10px !important;
  letter-spacing: 0.12em !important;
  color: #6a8b92 !important;
}

.nav-warp-link.nav-terminus .nav-warp-title {
  font-size: 13px !important;
  color: #8da4a8 !important;
  font-weight: 500 !important;
}

/* ==========================================================================
   13. System-Wide Dynamic Motion & Micro-Interactions (GPU-Accelerated 60FPS)
   ========================================================================== */

/* 13.1 深空极光微漂移（Nebula Aurora Drift） */
@keyframes nebulaDrift {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.22;
  }
  50% {
    transform: translate3d(-2%, 3%, 0) scale(1.08);
    opacity: 0.32;
  }
  100% {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.22;
  }
}

.nebula-aurora-glow {
  animation: nebulaDrift 28s ease-in-out infinite alternate !important;
  will-change: transform, opacity;
}

/* 13.2 归档卡片微动效与全息扫光 */
.timeline-post-card {
  position: relative !important;
  overflow: hidden !important;
}

.timeline-post-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: -100% !important;
  width: 60% !important;
  height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(125, 244, 255, 0.08), transparent) !important;
  transform: skewX(-20deg) !important;
  transition: none !important;
  pointer-events: none !important;
}

.timeline-post-card:hover::before {
  left: 140% !important;
  transition: all 0.75s ease-in-out !important;
}

.timeline-post-card:hover .post-date-badge {
  color: #7df4ff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.8) !important;
  transform: scale(1.05) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}


/* 13.3 分类 Bento 磁贴图标呼吸与箭头推进 */
.cat-card {
  position: relative !important;
  overflow: hidden !important;
}

.cat-card .ri-arrow-right-line {
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cat-card:hover .ri-arrow-right-line {
  transform: translateX(4px) !important;
  color: #00f0ff !important;
}

.cat-card:hover .ri-folder-3-line {
  transform: scale(1.12) !important;
  color: #dbfcff !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* 13.4 热门标签霓虹微呼吸与井号旋转 */
@keyframes neonTagPulse {
  0% { border-color: rgba(0, 240, 255, 0.3); box-shadow: 0 0 0 rgba(0, 240, 255, 0); }
  50% { border-color: rgba(0, 240, 255, 0.65); box-shadow: 0 0 10px rgba(0, 240, 255, 0.2); }
  100% { border-color: rgba(0, 240, 255, 0.3); box-shadow: 0 0 0 rgba(0, 240, 255, 0); }
}

.tag-capsule-hot {
  animation: neonTagPulse 3.5s ease-in-out infinite !important;
}

.tag-capsule-btn {
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.tag-capsule-btn .ri-hashtag {
  display: inline-block !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.tag-capsule-btn:hover .ri-hashtag {
  transform: rotate(20deg) scale(1.15) !important;
  color: #00f0ff !important;
}

/* 13.5 浏览器工具栏与独立阅读进度极光条（Reading Scroll Progress Laser） */
.browser-toolbar {
  position: relative !important;
}

.browser-reading-progress {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3.5px !important;
  background: rgba(0, 240, 255, 0.12) !important;
  z-index: 100 !important;
  display: none;
  overflow: visible !important;
}

.browser-reading-progress.active {
  display: block !important;
}

.browser-reading-progress .reading-progress-bar {
  height: 100% !important;
  width: 0%;
  background: linear-gradient(90deg, #00dbe9 0%, #7df4ff 75%, #ffffff 100%) !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.9), 0 0 20px rgba(125, 244, 255, 0.6) !important;
  border-radius: 0 2px 2px 0 !important;
  position: relative !important;
  will-change: width;
}

.browser-reading-progress .reading-progress-bar::after {
  content: '' !important;
  position: absolute !important;
  right: -3px !important;
  top: -2.5px !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  box-shadow: 0 0 10px #7df4ff, 0 0 18px #00f0ff !important;
}

/* 独立访问文章兜底进度条 */
.standalone-reading-track {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3.5px !important;
  background: rgba(0, 240, 255, 0.12) !important;
  z-index: 9999 !important;
  overflow: visible !important;
}

.standalone-reading-track .reading-progress-bar {
  height: 100% !important;
  width: 0%;
  background: linear-gradient(90deg, #00dbe9 0%, #7df4ff 75%, #ffffff 100%) !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.9) !important;
  position: relative !important;
}

/* 13.6 代码块一键复制按钮与悬停动效 */
.code-block-wrapper {
  position: relative !important;
}

.code-copy-btn {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 8px !important;
  font-size: 11px !important;
  font-family: var(--pop-font-mono) !important;
  color: #b9cacb !important;
  background: rgba(22, 26, 36, 0.85) !important;
  border: 1px solid rgba(132, 148, 149, 0.3) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  opacity: 0 !important;
  transform: translateY(-2px) !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  backdrop-filter: blur(8px) !important;
}

.code-block-wrapper:hover .code-copy-btn,
pre:hover .code-copy-btn {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

.code-copy-btn:hover {
  background: rgba(0, 240, 255, 0.18) !important;
  border-color: rgba(0, 240, 255, 0.5) !important;
  color: #dbfcff !important;
}

.code-copy-btn.copied {
  background: rgba(34, 197, 94, 0.2) !important;
  border-color: rgba(34, 197, 94, 0.6) !important;
  color: #86efac !important;
}

/* 13.7 前后篇导航卡片弹性推拉 */
.pop-post .post-nav .nav-prev:hover .nav-label {
  transform: translateX(-4px) !important;
  display: inline-block !important;
  transition: transform 0.2s ease !important;
}

.pop-post .post-nav .nav-next:hover .nav-label {
  transform: translateX(4px) !important;
  display: inline-block !important;
  transition: transform 0.2s ease !important;
}

/* 13.8 页面内容轻快渐入瀑布流（Entrance Animations） */
@keyframes popFadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.timeline-post-card, .cat-card, .tag-capsule-btn {
  animation: popFadeInUp 0.32s cubic-bezier(0.16, 1, 0.3, 1) backwards !important;
}

/* ==========================================================================
   14. Bento Station Console Aesthetic Overhaul (Specular Glass & Radar HUD)
   ========================================================================== */

#pop-cards .glass, #pop-cards .glass-dark {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.008) 40%, rgba(0, 0, 0, 0.25) 100%), rgba(13, 17, 26, 0.65) !important;
  backdrop-filter: blur(24px) saturate(190%) contrast(104%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(190%) contrast(104%) !important;
  border: 1px solid rgba(132, 148, 149, 0.25) !important;
  border-top: 1px solid rgba(125, 244, 255, 0.28) !important;
  box-shadow: 
    0 10px 30px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 0 rgba(255, 255, 255, 0.12) !important;
  border-radius: 14px !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}

#pop-cards .glass, #pop-cards .glass-dark {
  border-top: 1px solid rgba(132, 148, 149, 0.28) !important;
  box-shadow: 
    0 10px 30px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 0 rgba(255, 255, 255, 0.08) !important;
}

#pop-cards .glass:hover, #pop-cards .glass-dark:hover {
  border-color: rgba(0, 240, 255, 0.45) !important;
  border-top-color: rgba(125, 244, 255, 0.65) !important;
  transform: translateY(-2.5px) !important;
  box-shadow: 
    0 16px 40px rgba(0, 0, 0, 0.65),
    0 0 24px rgba(0, 240, 255, 0.1),
    inset 0 1px 0 0 rgba(255, 255, 255, 0.2) !important;
}

/* ==========================================================================
   14.1 极致精密 360° 悬停边框矢量流光 (Interactive 360° Border Beam Runner)
   常态彻底静止无干扰，仅在卡片悬停/选中时，一道极光青高能粒子流顺时针优雅环绕四边与圆角 360° 一周后自然消隐
   ========================================================================== */
.pop-card-border-beam,
.card-border-beam {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 50 !important;
  overflow: visible !important;
  border-radius: inherit !important;
}

.pop-card-border-beam .pop-beam-rect,
.card-border-beam .beam-rect {
  fill: none !important;
  stroke: #00f0ff !important;
  stroke-width: 1.2px !important;
  stroke-linecap: round !important;
  filter: drop-shadow(0 0 1px #ffffff) drop-shadow(0 0 1.5px #00f0ff) !important;
}



/* 文章列表项极简无框微交互 (彻底消除多余选中框与竖条) */
.interactive-list-item {
  position: relative !important;
  padding: 4px 6px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.interactive-list-item::before {
  display: none !important;
  content: none !important;
}

.interactive-list-item:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transform: translateX(3px) !important;
}

.interactive-list-item:hover::before {
  display: none !important;
  content: none !important;
}

.interactive-list-item:hover .article-link {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.6) !important;
}

.interactive-list-item:hover .article-num {
  color: #00f0ff !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.9) !important;
}

/* ==========================================================================
   15. Spotlight Launcher & Oceanic Weather & Warp Activity Polish
   ========================================================================== */

/* 15.1 全局搜索框极客聚焦、高对比输入与按键微标 */
#search-bar-widget {
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#search-bar-widget:focus-within {
  border-color: rgba(0, 240, 255, 0.55) !important;
  border-top-color: rgba(125, 244, 255, 0.8) !important;
  box-shadow: 
    0 12px 32px rgba(0, 0, 0, 0.6),
    0 0 20px rgba(0, 240, 255, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-2px) !important;
}

/* 搜索框输入文本、光标与占位符对比度全面升级 */
#desktop-search,
.desktop-search input {
  color: #dbfcff !important;
  caret-color: #00f0ff !important;
  font-family: var(--pop-font-sans) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
}

#desktop-search::placeholder,
.desktop-search input::placeholder {
  color: rgba(125, 244, 255, 0.45) !important;
  font-weight: 400 !important;
}

#desktop-search::selection,
.desktop-search input::selection {
  background: rgba(0, 240, 255, 0.3) !important;
  color: #ffffff !important;
}

/* 15.1 极致纯净 Enter 指令微标 (彻底消除任何边框、阴影与背景色块，纯微光字符一体化设计) */
.desktop-search-kbd,
.search-page-bar kbd {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  line-height: 1.2 !important;
  color: rgba(0, 240, 255, 0.7) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 2px 4px !important;
  box-shadow: none !important;
  outline: none !important;
  user-select: none !important;
  flex-shrink: 0 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  opacity: 0.8 !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.desktop-search-kbd:hover,
.search-page-bar kbd:hover,
.desktop-search:focus-within .desktop-search-kbd,
.search-page-bar:focus-within kbd {
  background: transparent !important;
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.9), 0 0 20px rgba(0, 240, 255, 0.5) !important;
  transform: translateY(-1px) !important;
}

.desktop-search-kbd:active,
.search-page-bar kbd:active {
  background: transparent !important;
  color: #7df4ff !important;
  transform: translateY(1px) scale(0.96) !important;
}

/* 15.1.1 搜索建议下拉弹窗 - 黑曜石深色暗晶流光弹窗 (彻底根除浅灰白底与死板蓝高亮) */
.desktop-search-dropdown,
.desktop-search-dropdown.dropdown-fixed {
  background: rgba(13, 17, 27, 0.94) !important;
  backdrop-filter: blur(28px) saturate(190%) !important;
  border: 1px solid rgba(125, 244, 255, 0.2) !important;
  border-top: 1px solid rgba(125, 244, 255, 0.5) !important;
  border-radius: 14px !important;
  box-shadow: 
    0 20px 48px rgba(0, 0, 0, 0.8),
    0 0 24px rgba(0, 240, 255, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  overflow: hidden !important;
  padding: 6px !important;
  z-index: 9999 !important;
}

.desktop-search-dropdown .search-suggest-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 10px 14px !important;
  border-radius: 9px !important;
  border-bottom: none !important;
  margin-bottom: 2px !important;
  background: transparent !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.desktop-search-dropdown .search-suggest-item:last-child {
  margin-bottom: 0 !important;
}

.desktop-search-dropdown .search-suggest-item:hover,
.desktop-search-dropdown .search-suggest-item.active {
  background: rgba(0, 240, 255, 0.1) !important;
  border: 1px solid rgba(125, 244, 255, 0.28) !important;
  box-shadow: inset 0 0 12px rgba(0, 240, 255, 0.08) !important;
  transform: translateX(4px) !important;
}

.desktop-search-dropdown .search-suggest-item .suggest-title {
  color: #dbfcff !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  font-family: var(--pop-font-headline) !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
}

.desktop-search-dropdown .search-suggest-item:hover .suggest-title,
.desktop-search-dropdown .search-suggest-item.active .suggest-title {
  color: #ffffff !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.5) !important;
}

.desktop-search-dropdown .search-suggest-item .suggest-excerpt {
  color: #8da4b5 !important;
  font-size: 11.5px !important;
  line-height: 1.5 !important;
}

/* 关键词高亮 (赛博荧光青晶体，取代老式蓝色块) */
.desktop-search-dropdown .search-suggest-item mark,
.search-hit mark,
.search-suggest-item mark {
  background: rgba(0, 240, 255, 0.22) !important;
  color: #00f0ff !important;
  font-weight: 700 !important;
  padding: 1px 4px !important;
  border-radius: 4px !important;
  border: 1px solid rgba(0, 240, 255, 0.4) !important;
  box-shadow: 0 0 6px rgba(0, 240, 255, 0.25) !important;
}

/* 15.1.2 独立搜索页 (浏览器窗口内 /search) 深度黑曜石晶体与全元素高对比度适配 */
.search-page-bar {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  background: rgba(14, 20, 32, 0.85) !important;
  border: 1px solid rgba(0, 240, 255, 0.38) !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45), inset 0 0 12px rgba(0, 240, 255, 0.08) !important;
  transition: all 0.25s ease !important;
}

.search-page-bar:focus-within {
  border-color: #00f0ff !important;
  box-shadow: 0 0 18px rgba(0, 240, 255, 0.35), inset 0 0 16px rgba(0, 240, 255, 0.12) !important;
}

/* 放大镜图标：高亮清透青光，彻底消除暗黑色，对比度 > 10:1 */
.search-page-bar i {
  color: #7df4ff !important;
  font-size: 18px !important;
  flex-shrink: 0 !important;
  filter: drop-shadow(0 0 6px rgba(0, 240, 255, 0.45)) !important;
}

.search-page-bar input {
  flex: 1 1 auto !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  color: #dbfcff !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  caret-color: #00f0ff !important;
}

.search-page-bar input::placeholder {
  color: #8fa5a6 !important;
  font-weight: 400 !important;
}


.search-hit {
  background: linear-gradient(145deg, rgba(20, 28, 45, 0.38) 0%, rgba(10, 15, 26, 0.25) 100%) !important;
  border: 1px solid rgba(0, 240, 255, 0.12) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 6px 20px rgba(0, 0, 0, 0.3) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  padding: 18px 22px !important;
}

.search-hit:hover {
  background: linear-gradient(145deg, rgba(24, 36, 58, 0.5) 0%, rgba(14, 20, 34, 0.35) 100%) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  box-shadow: inset 0 1px 0 rgba(0, 240, 255, 0.2), 0 12px 32px rgba(0, 0, 0, 0.4), 0 0 20px rgba(0, 240, 255, 0.15) !important;
  transform: translateY(-2px) !important;
}

.search-hit-title,
.pop-prose .search-hit a.search-hit-title,
.pop-prose .search-hit-text a {
  color: #dbfcff !important;
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  font-family: 'Sora', sans-serif !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  line-height: 1.4 !important;
  display: inline-block !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.search-hit-title:hover,
.pop-prose .search-hit a.search-hit-title:hover,
.pop-prose .search-hit-text a:hover {
  color: #00f0ff !important;
  text-decoration: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  text-shadow: 0 0 12px rgba(0, 240, 255, 0.5) !important;
  transform: translateX(2px) !important;
}

.search-hit-excerpt {
  color: #c5d3d4 !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
}

.search-hit-meta {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 8px !important;
}

.search-hit-meta time,
.search-meta {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #7df4ff !important;
  letter-spacing: 0.02em !important;
}

.search-meta {
  color: #dbfcff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-top: 14px !important;
  margin-bottom: 18px !important;
  padding-left: 4px !important;
  letter-spacing: 0.02em !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.2) !important;
}

.search-hit-type {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #00f0ff !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  letter-spacing: 0.05em !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.4) !important;
}

.search-empty {
  color: #b9cacb !important;
}

.search-empty p {
  color: #dbfcff !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.search-empty span {
  color: #a8c0c2 !important;
}

.search-empty i {
  color: #7df4ff !important;
}

/* 15.2 天气组件：彻底消除原本的大灰块背景，回归通透一体的黑曜石深空质感 */
#weather-card .weather-hourly,
html.dark #weather-card .weather-hourly {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 4px 0 !important;
  border: none !important;
}

#weather-card .weather-hour-item {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 2px 0 !important;
}

#weather-card .weather-hour-item i {
  color: #7df4ff !important;
}

#weather-card .weather-hour-item span:first-child {
  color: #849495 !important;
}

#weather-card .weather-hour-item span:last-child {
  color: #dbfcff !important;
  font-weight: 700 !important;
}

/* 彻底消灭未来预测项的细线框与背景小盒子，重构为极光深空无界列表 */
#weather-card .weather-forecast-item,
html.dark #weather-card .weather-forecast-item {
  background: transparent !important;
  border-radius: 6px !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 5px 6px !important;
  margin: 0 !important;
  transition: background 0.2s ease, transform 0.2s ease !important;
}

#weather-card .weather-forecast-item:hover,
html.dark #weather-card .weather-forecast-item:hover {
  background: rgba(0, 240, 255, 0.06) !important;
}

#weather-card .weather-forecast-item i {
  color: #00f0ff !important;
  text-shadow: 0 0 6px rgba(0, 240, 255, 0.35) !important;
  font-size: 14px !important;
  width: 18px !important;
  text-align: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#weather-card .weather-forecast-item span.text-slate-400 {
  color: #94a3b8 !important;
  font-family: var(--pop-font-mono, monospace) !important;
  font-size: 11.5px !important;
  letter-spacing: 0.02em !important;
}

#weather-card .weather-forecast-item span.text-slate-600 {
  color: #e1e2eb !important;
  font-weight: 500 !important;
  font-size: 12px !important;
}

#weather-card .weather-forecast-item span.font-semibold {
  color: #dbfcff !important;
  font-family: var(--pop-font-mono, monospace) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.25) !important;
}

/* 15.3 曲率引擎活跃度图表质感微调 */
#activity-container svg path {
  filter: drop-shadow(0 2px 8px rgba(0, 240, 255, 0.35)) !important;
}

#activity-container .bg-green-100 {
  background: rgba(34, 197, 94, 0.12) !important;
  color: #4ade80 !important;
  border: 1px solid rgba(34, 197, 94, 0.3) !important;
  font-family: var(--pop-font-mono) !important;
  font-weight: 700 !important;
}

/* ==========================================================================
   16. 直达内页桌面弹窗架构隔离 (直出内容静默隐藏，由桌面弹窗接管，桌面卡片完整展示)
   ========================================================================== */
#pop-desktop > #content {
  display: none !important;
}

/* ==========================================================================
   17. 超高清动态长曝光星轨夜空 (Celestial Star Trails)
   ========================================================================== */
.star-trails-sky {
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(circle at 50% 38%, #0f2744 0%, #091729 35%, #050d18 65%, #03060c 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.star-trails-rotator {
  position: absolute !important;
  top: 38% !important;
  left: 50% !important;
  width: 3200px !important;
  height: 3200px !important;
  margin-top: -1600px !important;
  margin-left: -1600px !important;
  transform-origin: center center !important;
  will-change: transform !important;
  animation: rotateStarTrails 180s linear infinite !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

#star-trails-svg,
#star-trails-canvas {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: visible !important;
  shape-rendering: geometricPrecision !important;
}

@keyframes rotateStarTrails {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* 天极北极星 (Polaris Core) */
.polaris-star {
  position: absolute !important;
  top: 38% !important;
  left: 50% !important;
  width: 4px !important;
  height: 4px !important;
  margin-top: -2px !important;
  margin-left: -2px !important;
  background: #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 0 10px #7df4ff, 0 0 20px rgba(0, 240, 255, 0.8), 0 0 35px #ffffff !important;
  z-index: 3 !important;
  pointer-events: none !important;
  animation: polarisPulse 4s ease-in-out infinite alternate !important;
}

@keyframes polarisPulse {
  0% {
    transform: scale(0.9);
    opacity: 0.85;
    box-shadow: 0 0 8px #7df4ff, 0 0 16px rgba(0, 240, 255, 0.6);
  }
  100% {
    transform: scale(1.25);
    opacity: 1;
    box-shadow: 0 0 14px #7df4ff, 0 0 26px rgba(0, 240, 255, 0.95), 0 0 40px #ffffff;
  }
}

/* 环境大气暗角与深空渐隐 */
.star-trails-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(circle at 50% 38%, transparent 40%, rgba(3, 6, 12, 0.45) 80%, rgba(3, 6, 12, 0.85) 100%) !important;
  z-index: 4 !important;
  pointer-events: none !important;
}

/* ==========================================================================
   Celestial Theme Hardware SVG Cursor Styles (with Cyber Hand Pointer)
   ========================================================================== */
html, body {
  cursor: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M4%203L17%2010L10.5%2012.5L8%2019L4%203Z%22%20fill%3D%22%2303060c%22%20stroke%3D%22%2303060c%22%20stroke-width%3D%222.5%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M4%203L17%2010L10.5%2012.5L8%2019L4%203Z%22%20fill%3D%22%2307131b%22%2F%3E%20%3Cpath%20d%3D%22M4%203L17%2010L10.5%2012.5L8%2019L4%203Z%22%20stroke%3D%22%2300f0ff%22%20stroke-width%3D%221.2%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M4%203L10.5%2012.5%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3C%2Fsvg%3E") 4 3, auto !important;
}

/* 核心：凡是鼠标变成手（Pointer）的地方，全面接管为星际科技手型！ */
a, 
a *,
button, 
button *,
[role="button"], 
[role="button"] *,
input[type="button"], 
input[type="submit"], 
input[type="reset"],
select,
summary,
.sci-btn, 
.sci-btn *,
.dock-item, 
.dock-item *,
.interactive-list-item, 
.article-item,
.article-link,
.profile-link,
.featured-link,
.action-btn,
.nav-tab,
.tab-btn,
.jumper-btn,
.pagination-btn,
.settings-menu-item,
[data-action],
[onclick],
.cursor-pointer,
[style*="cursor: pointer"],
[style*="cursor:pointer"] {
  cursor: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M6%202C5.4%202%205%202.4%205%203V12L3.8%2011.2C3.1%2010.7%202.1%2010.9%201.7%2011.7C1.3%2012.4%201.5%2013.3%202.2%2013.8L6.5%2017.5C7.5%2018.4%208.7%2019%2010%2019H14C16.2%2019%2018%2017.2%2018%2015V9.5C18%208.7%2017.3%208%2016.5%208C16.3%208%2016.1%208.1%2015.9%208.1C15.6%207.5%2015%207%2014.2%207C14%207%2013.8%207%2013.6%207.1C13.3%206.4%2012.6%206%2011.8%206C11.5%206%2011.2%206.1%2011%206.2V3C11%202.4%2010.6%202%2010%202H6Z%22%20%20fill%3D%22%2303060c%22%20stroke%3D%22%2303060c%22%20stroke-width%3D%222.5%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M6%202C5.4%202%205%202.4%205%203V12L3.8%2011.2C3.1%2010.7%202.1%2010.9%201.7%2011.7C1.3%2012.4%201.5%2013.3%202.2%2013.8L6.5%2017.5C7.5%2018.4%208.7%2019%2010%2019H14C16.2%2019%2018%2017.2%2018%2015V9.5C18%208.7%2017.3%208%2016.5%208C16.3%208%2016.1%208.1%2015.9%208.1C15.6%207.5%2015%207%2014.2%207C14%207%2013.8%207%2013.6%207.1C13.3%206.4%2012.6%206%2011.8%206C11.5%206%2011.2%206.1%2011%206.2V3C11%202.4%2010.6%202%2010%202H6Z%22%20%20fill%3D%22%2306121a%22%2F%3E%20%3Cpath%20d%3D%22M6%202C5.4%202%205%202.4%205%203V12L3.8%2011.2C3.1%2010.7%202.1%2010.9%201.7%2011.7C1.3%2012.4%201.5%2013.3%202.2%2013.8L6.5%2017.5C7.5%2018.4%208.7%2019%2010%2019H14C16.2%2019%2018%2017.2%2018%2015V9.5C18%208.7%2017.3%208%2016.5%208C16.3%208%2016.1%208.1%2015.9%208.1C15.6%207.5%2015%207%2014.2%207C14%207%2013.8%207%2013.6%207.1C13.3%206.4%2012.6%206%2011.8%206C11.5%206%2011.2%206.1%2011%206.2V3C11%202.4%2010.6%202%2010%202H6Z%22%20%20stroke%3D%22%2300f0ff%22%20stroke-width%3D%221.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Cline%20x1%3D%228%22%20y1%3D%226%22%20x2%3D%228%22%20y2%3D%2212%22%20stroke%3D%22%2300f0ff%22%20stroke-width%3D%220.9%22%20opacity%3D%220.6%22%2F%3E%20%3Cline%20x1%3D%2211%22%20y1%3D%229%22%20x2%3D%2211%22%20y2%3D%2214%22%20stroke%3D%22%2300f0ff%22%20stroke-width%3D%220.9%22%20opacity%3D%220.6%22%2F%3E%20%3Cline%20x1%3D%2214%22%20y1%3D%2210%22%20x2%3D%2214%22%20y2%3D%2215%22%20stroke%3D%22%2300f0ff%22%20stroke-width%3D%220.9%22%20opacity%3D%220.6%22%2F%3E%20%3Ccircle%20cx%3D%226%22%20cy%3D%223.5%22%20r%3D%221.5%22%20fill%3D%22%23ffffff%22%2F%3E%20%3C%2Fsvg%3E") 6 2, pointer !important;
}

/* 文本编辑与输入框 */
input[type="text"], 
input[type="search"], 
input[type="email"], 
input[type="password"], 
input[type="number"], 
textarea,
[contenteditable="true"] {
  cursor: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M9%204H15M12%204V20M9%2020H15%22%20stroke%3D%22%2303060c%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M9.5%204H14.5M12%204V20M9.5%2020H14.5%22%20stroke%3D%22%2300f0ff%22%20stroke-width%3D%221.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%226%22%20x2%3D%2212%22%20y2%3D%2218%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22round%22%2F%3E%20%3C%2Fsvg%3E") 12 12, text !important;
}

button:disabled, 
input:disabled, 
.disabled {
  cursor: not-allowed !important;
}

/* 主理人名片专属样式与微光按键 */
#profile-card .profile-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #b9cacb !important;
  font-size: 15px !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#profile-card .profile-link:hover {
  color: #00f0ff !important;
  background: rgba(0, 240, 255, 0.12) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.35) !important;
  transform: translateY(-2px) scale(1.08) !important;
}

/* ==========================================================================
   Stardust Micro Click Pulse Styles (Lightweight, Non-blocking)
   ========================================================================== */
.stardust-click-pulse {
  position: fixed !important;
  width: 20px !important;
  height: 20px !important;
  margin-left: -10px !important;
  margin-top: -10px !important;
  border-radius: 50% !important;
  border: 1.2px solid #00f0ff !important;
  box-shadow: 0 0 3px #00f0ff !important;
  pointer-events: none !important;
  z-index: 999999 !important;
  transform: scale(0.2);
  opacity: 1;
  animation: stardustPulseAnim 0.25s cubic-bezier(0.1, 0.9, 0.2, 1) forwards !important;
}

.stardust-click-pulse::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 4px !important;
  height: 4px !important;
  margin-left: -2px !important;
  margin-top: -2px !important;
  background: #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 0 3px #00f0ff !important;
  animation: stardustSparkleFade 0.22s ease-out forwards !important;
}

@keyframes stardustPulseAnim {
  0% {
    transform: scale(0.2);
    opacity: 1;
  }
  60% {
    opacity: 0.8;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

@keyframes stardustSparkleFade {
  0% { transform: scale(1.2); opacity: 1; }
  100% { transform: scale(0.2); opacity: 0; }
}


/* ==========================================================================
   Full Real Data Render Fixes (Remove display:none and guarantee visibility)
   ========================================================================== */
#pop-cards #articles-list,
#articles-list {
  display: flex !important;
  flex-direction: column !important;
  flex-basis: auto !important;
  gap: 10px !important;
  opacity: 1 !important;
  visibility: visible !important;
}

#pop-cards #articles-list .article-item,
#articles-list .article-item {
  display: flex;
  opacity: 1;
  visibility: visible;
}

#pop-cards #articles-list .article-item[style*="display: none"],
#articles-list .article-item[style*="display: none"] {
  display: none !important;
}

/* 实时天气与创作活跃度黄金比例平衡：天气紧凑不留白，活跃度吸收全部剩余垂直空间 */
#weather-card {
  flex: 0 0 auto !important;
  flex-grow: 0 !important;
}

#activity-container {
  flex: 1 1 0% !important;
  flex-grow: 1 !important;
  min-height: 220px !important;
  display: flex !important;
  flex-direction: column !important;
}

#activity-chart-wrapper {
  flex: 1 1 0% !important;
  min-height: 150px !important;
  width: 100% !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
}

#activity-chart {
  width: 100% !important;
  height: 100% !important;
  flex: 1 1 0% !important;
  position: relative !important;
}

/* 精选图库自适应平衡瀑布流 (Balanced Masonry Photo Stream) */
.gallery-waterfall-wrap {
  width: 100% !important;
  overflow: hidden !important;
}

.gallery-waterfall {
  display: flex !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: flex-start !important;
}

.gallery-col {
  flex: 1 1 0% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.gallery-item {
  display: block !important;
  position: relative !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, 0.25) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.25s ease !important;
  text-decoration: none !important;
}

.gallery-item:hover {
  transform: translateY(-2px) scale(1.02) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  box-shadow: 0 6px 16px rgba(0, 240, 255, 0.15) !important;
  z-index: 2 !important;
}

.gallery-thumb {
  width: 100% !important;
  height: auto !important;
  min-height: 70px !important;
  max-height: 190px !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 9px !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.gallery-item:hover .gallery-thumb {
  transform: scale(1.05) !important;
}

.gallery-grid {
  display: flex !important;
  gap: 8px !important;
  width: 100% !important;
}

/* 即刻动态瞬间卡片细腻排版 */
.moments-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100% !important;
}

.moments-list .moment-item {
  display: flex !important;
  flex-direction: column !important;
  background: rgba(18, 25, 42, 0.45) !important;
  border: 1px solid rgba(0, 240, 255, 0.12) !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  transition: all 0.25s ease !important;
}

.moments-list .moment-item:hover {
  border-color: rgba(0, 240, 255, 0.35) !important;
  background: rgba(22, 32, 54, 0.6) !important;
  box-shadow: 0 0 14px rgba(0, 240, 255, 0.1) !important;
}

/* 即刻动态文本：绝不省略、完全展开、自然换行 */
.moments-list .moment-text {
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  color: #dbfcff !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  overflow: visible !important;
  text-overflow: clip !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  white-space: pre-wrap !important;
}

/* 即刻动态卡片：完全自然高度展开，绝不固定死高度或强行省略 */
#recent-talk-card {
  height: auto !important;
  flex-grow: 0 !important;
  flex-shrink: 0 !important;
  overflow: visible !important;
}

.moments-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100% !important;
  height: auto !important;
  overflow: visible !important;
}

.moments-list .moment-item {
  display: flex !important;
  flex-direction: column !important;
  background: rgba(18, 25, 42, 0.45) !important;
  border: 1px solid rgba(0, 240, 255, 0.12) !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
  transition: all 0.25s ease !important;
  height: auto !important;
  overflow: visible !important;
}

.moments-list .moment-time {
  font-size: 11px !important;
  font-family: 'JetBrains Mono', monospace !important;
  color: #7df4ff !important;
  font-weight: 600 !important;
  margin-top: 4px !important;
}

/* 独立瞬间动态页 (/moments) 黑曜石玻璃流光卡片与高对比度文字 */
.pop-moments {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-bottom: 24px !important;
}

.moment-entry {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  padding: 18px 20px !important;
  background: rgba(20, 26, 40, 0.65) !important;
  border: 1px solid rgba(125, 244, 255, 0.18) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(16px) saturate(160%) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
  transition: all 0.25s ease !important;
}

.moment-entry:hover {
  background: rgba(28, 38, 58, 0.8) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 240, 255, 0.15) !important;
}

.moment-entry .moment-avatar {
  flex-shrink: 0 !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  background: rgba(0, 219, 233, 0.15) !important;
  border: 1px solid rgba(0, 219, 233, 0.35) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.moment-entry .moment-avatar i {
  color: #00f0ff !important;
  font-size: 18px !important;
}

.moment-entry .moment-main {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.moment-entry .moment-bubble {
  color: #dbfcff !important;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
}

.moment-entry time {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #7df4ff !important;
  letter-spacing: 0.03em !important;
}

/* 天气卡片未来预测项：彻底消除细线框与背景盒子，通透空灵 */
.weather-forecast-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  width: 100% !important;
}

.weather-forecast-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 12px !important;
  color: #e1e2eb !important;
  padding: 5px 6px !important;
  border-radius: 6px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* 实时天气卡片紧凑自然排版：多日预报项保持自然微距，避免拉伸过大 */
#weather-card .weather-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  justify-content: flex-start !important;
}

#weather-card .weather-daily {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

#weather-card .weather-daily-list {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 4px !important;
}

/* 保证 Bento 4 列各列依据自身高度收缩对齐，避免 Grid 默认 stretch 造成相互拉扯 */
#pop-cards {
  align-items: flex-start !important;
}

.pop-column {
  align-self: flex-start !important;
  height: auto !important;
}

/* 彻底消除图库黑框与强制比例拉扯 (Zero Black Borders) */
#pop-cards .gallery-waterfall-wrap,
.gallery-waterfall-wrap {
  width: 100% !important;
  overflow: hidden !important;
}

#pop-cards .gallery-waterfall,
.gallery-waterfall {
  display: flex !important;
  gap: 8px !important;
  width: 100% !important;
  align-items: flex-start !important;
}

#pop-cards .gallery-col,
.gallery-col {
  flex: 1 1 0% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  min-width: 0 !important;
}

#pop-cards .gallery-waterfall .gallery-item,
.gallery-waterfall .gallery-item,
.gallery-item {
  display: block !important;
  position: relative !important;
  aspect-ratio: auto !important;
  height: auto !important;
  min-height: 0 !important;
  background: transparent !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35) !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, box-shadow 0.25s ease !important;
  text-decoration: none !important;
}

#pop-cards .gallery-waterfall .gallery-item:hover,
.gallery-item:hover {
  transform: translateY(-2px) scale(1.02) !important;
  border-color: rgba(0, 240, 255, 0.5) !important;
  box-shadow: 0 6px 18px rgba(0, 240, 255, 0.2) !important;
  z-index: 2 !important;
}

#pop-cards .gallery-waterfall .gallery-thumb,
.gallery-waterfall .gallery-thumb,
.gallery-thumb {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.gallery-item:hover .gallery-thumb {
  transform: scale(1.05) !important;
}

/* 精选图库标题与瀑布流自然呼吸间距 (Refined Spacing) */
#photos-card .gallery-waterfall-wrap {
  margin-top: 14px !important;
  margin-bottom: 8px !important;
}

#photos-card h3 {
  margin-bottom: 0 !important;
}

/* ==========================================================================
   18. 文章生态暗黑模式深度适配 (AI摘要 / 代码高亮 / 评论组件)
   ========================================================================== */

/* --- A. 智阅 GPT AI 摘要卡片 (summaraidGPT) 一体化极光单层玻璃态 (彻底消除嵌套套娃) --- */
.likcc-summaraidGPT-summary-container {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.055) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
  border: 1px solid rgba(125, 244, 255, 0.22) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
  color: #e1e2eb !important;
  margin: 24px 0 !important;
  padding: 20px 24px !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

/* 彻底重置内部子元素，杜绝任何嵌套小方框 */
.likcc-summaraidGPT-summary-header,
.likcc-summaraidGPT-header-left,
.likcc-summaraidGPT-summary-content,
.likcc-summaraidGPT-summary-text,
.likcc-summaraidGPT-content,
.likcc-summaraidGPT-title-box,
.likcc-summaraidGPT-summary-title,
.likcc-summaraidGPT-title,
.likcc-summaraidGPT-tag {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.likcc-summaraidGPT-summary-header {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.likcc-summaraidGPT-header-left {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  gap: 10px !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 极客无框量子微光 AI (彻底去除生硬圆框，发光脉冲量子点 + 渐变等宽 AI) */
.likcc-summaraidGPT-icon {
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  min-width: unset !important;
  min-height: unset !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  align-self: center !important;
  gap: 6px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #7df4ff !important;
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  background: linear-gradient(135deg, #7df4ff 0%, #00f0ff 50%, #38bdf8 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.6)) !important;
  text-shadow: none !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* 内嵌微光呼吸量子核心 */
.likcc-summaraidGPT-icon::before {
  content: '' !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #00f0ff !important;
  box-shadow: 0 0 8px #00f0ff, 0 0 14px rgba(0, 240, 255, 0.8) !important;
  animation: staros-ai-core-pulse 2.4s ease-in-out infinite alternate !important;
  flex-shrink: 0 !important;
  vertical-align: middle !important;
  -webkit-text-fill-color: initial !important;
}

@keyframes staros-ai-core-pulse {
  0% {
    transform: scale(0.85);
    opacity: 0.7;
    box-shadow: 0 0 4px #00f0ff;
  }
  100% {
    transform: scale(1.15);
    opacity: 1;
    box-shadow: 0 0 8px #00f0ff, 0 0 12px rgba(0, 240, 255, 0.9);
  }
}

.likcc-summaraidGPT-icon:hover {
  background: rgba(0, 219, 233, 0.22) !important;
  border-color: rgba(0, 219, 233, 0.65) !important;
  box-shadow: 0 0 14px rgba(0, 219, 233, 0.35) !important;
  transform: translateY(-1px) !important;
}

/* 高特异性彻底覆写 .pop-prose h3 的 1.6em 顶部外边距，恢复中线严密对齐 */
.pop-prose .likcc-summaraidGPT-summary-container h3,
.pop-prose .likcc-summaraidGPT-summary-header h3,
.pop-prose .likcc-summaraidGPT-summary-title,
.likcc-summaraidGPT-summary-title,
.likcc-summaraidGPT-title {
  margin: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  line-height: 1.2 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  color: #dbfcff !important;
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
}

.likcc-summaraidGPT-summary-content,
.likcc-summaraidGPT-summary-text,
.likcc-summaraidGPT-content {
  color: #c5d3d4 !important;
  font-size: 14.5px !important;
  line-height: 1.8 !important;
  font-weight: 400 !important;
  word-break: break-word !important;
  border-right: none !important;
}

.likcc-summaraidGPT-summary-content *,
.likcc-summaraidGPT-content * {
  color: #c5d3d4 !important;
}

/* 完美智能打字机与光标体系 (跟随文字流折行，修复卡顿与右边缘错位 Bug) */
.likcc-summaraidGPT-typewriter,
.likcc-summaraidGPT-typewriter.typing {
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  height: auto !important;
  border-right: none !important;
  padding-right: 0 !important;
  margin-right: 0 !important;
}

/* 极光微光打字机光标：作为内联 ::after 伪元素，精准紧随最后一个字符跳动，绝不脱离跑到卡片最右侧 */
.likcc-summaraidGPT-typewriter.typing::after {
  content: '' !important;
  display: inline-block !important;
  width: 2px !important;
  height: 1.15em !important;
  background: #00f0ff !important;
  box-shadow: 0 0 8px #00f0ff, 0 0 12px rgba(0, 240, 255, 0.7) !important;
  vertical-align: -0.15em !important;
  margin-left: 3px !important;
  border-radius: 1px !important;
  animation: staros-cursor-blink 0.7s step-end infinite !important;
}

@keyframes staros-cursor-blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

/* 杜绝卡片容器与内容块自身的右侧边框残留 */
.likcc-summaraidGPT-summary-container,
.likcc-summaraidGPT-summary-content {
  border-right: none !important;
}

/* --- A2. Markdown 全宽无束缚自适应 (解除 68ch 枷锁，撑满文章阅读窗口) --- */
:root, html, body {
  --prose-measure: 100% !important;
}

.post-body,
.pop-prose,
.pop-prose p,
.pop-prose ul,
.pop-prose ol,
.pop-prose li,
.pop-prose blockquote,
.pop-prose table,
.pop-prose h1,
.pop-prose h2,
.pop-prose h3,
.pop-prose h4,
.pop-prose h5,
.pop-prose h6 {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.pop-prose p {
  width: 100% !important;
  max-width: 100% !important;
  line-height: 1.85 !important;
  word-break: break-word !important;
  color: #e1e2eb !important;
}

.pop-prose ul li,
.pop-prose ol li {
  width: 100% !important;
  max-width: 100% !important;
  line-height: 1.8 !important;
  word-break: break-word !important;
  color: #e1e2eb !important;
}


/* --- B. 代码块与语法高亮暗黑极客风 (Highlight.js / Pre & Code) --- */
.pop-post pre,
.pop-prose pre,
pre:has(code),
pre {
  background: #0d1117 !important;
  border: 1px solid rgba(125, 244, 255, 0.18) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
  padding: 16px 20px !important;
  margin: 20px 0 !important;
  position: relative !important;
  overflow-x: auto !important;
}

.pop-post pre code,
.pop-prose pre code,
pre code,
pre code.hljs,
code.hljs {
  background: transparent !important;
  color: #e6edf3 !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  text-shadow: none !important;
  display: block !important;
}

/* 语法高亮关键字覆盖 (One Dark / GitHub Dark 霓虹高对比配色) */
.hljs-comment,
.hljs-quote {
  color: #8b949e !important;
  font-style: italic !important;
}

.hljs-keyword,
.hljs-selector-tag,
.hljs-subst {
  color: #ff7b72 !important;
  font-weight: 600 !important;
}

.hljs-string,
.hljs-doctag,
.hljs-regexp {
  color: #a5d6ff !important;
}

.hljs-title,
.hljs-section,
.hljs-title.class_,
.hljs-title.function_ {
  color: #7df4ff !important;
  font-weight: 600 !important;
}

.hljs-variable,
.hljs-template-variable,
.hljs-attr,
.hljs-attribute {
  color: #ffa657 !important;
}

.hljs-number,
.hljs-literal {
  color: #79c0ff !important;
}

.hljs-built_in,
.hljs-type {
  color: #d2a8ff !important;
}

.hljs-operator,
.hljs-punctuation {
  color: #7ee787 !important;
}

/* 代码块右上角复制按钮 */
pre .copy-button,
pre button,
.hljs-copy-button {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #b9cacb !important;
  border-radius: 6px !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
  backdrop-filter: blur(8px) !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}

pre .copy-button:hover,
pre button:hover,
.hljs-copy-button:hover {
  background: rgba(0, 240, 255, 0.2) !important;
  color: #ffffff !important;
  border-color: rgba(0, 240, 255, 0.5) !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.3) !important;
}


/* --- C. 评论组件 (Halo Comment Widget) 深色模式穿透与清晰度适配 --- */
/* --- C. 评论组件 (Halo Comment Widget) Astraeus OS 霓虹极客深度适配 --- */
:root,
html,
body,
.popos,
.dark,
.color-scheme-dark,
.color-scheme-auto,
[data-color-scheme="dark"],
[data-color-scheme="auto"],
comment-widget,
.comment-widget,
halo-comment,
.halo-comment-widget,
.post-comments,
.post-comments *,
#post-comments,
[id^="comment-content"] {
  /* 提交按钮主色 & 输入框选中激活边框：霓虹青 (彻底替换墨绿色) */
  --halo-cw-primary-1-color: #00f0ff !important;
  /* 悬浮/激活深阶色 */
  --halo-cw-primary-2-color: #00c8d6 !important;
  /* 输入框聚焦外发光晕环：高透青色霓虹 Halo */
  --halo-cw-primary-3-color: rgba(0, 240, 255, 0.28) !important;

  /* 文字清晰度与暗色背景 */
  --halo-cw-text-1-color: #f1f5f9 !important;
  --halo-cw-text-2-color: #dbfcff !important;
  --halo-cw-text-3-color: #94a3b8 !important;
  --halo-cw-muted-1-color: #849495 !important;
  --halo-cw-muted-2-color: #475569 !important;
  --halo-cw-muted-3-color: #1e2430 !important;
  color-scheme: dark !important;
}

.post-comments {
  margin-top: 40px !important;
  padding-top: 24px !important;
  border-top: 1px solid rgba(132, 148, 149, 0.2) !important;
  color-scheme: dark !important;
}

.post-comments .comments-title {
  color: #dbfcff !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  margin-bottom: 20px !important;
}

halo-comment,
.halo-comment-widget,
.comment-widget {
  color-scheme: dark !important;
}

/* 确保评论正文绝对清晰明亮 */
.post-comments .comment-content,
.post-comments .content,
.post-comments [class*="content"],
.post-comments p {
  color: #dbfcff !important;
  line-height: 1.65 !important;
}

.post-comments .author,
.post-comments [class*="author"],
.post-comments [class*="name"] {
  color: #7df4ff !important;
  font-weight: 600 !important;
}

.post-comments .time,
.post-comments [class*="time"],
.post-comments [class*="date"] {
  color: #849495 !important;
}

.post-comments button,
.post-comments [class*="action"],
.post-comments .reply-btn {
  color: #849495 !important;
}

.post-comments button:hover,
.post-comments [class*="action"]:hover {
  color: #00dbe9 !important;
}

.post-comments input,
.post-comments textarea {
  color: #f1f5f9 !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(132, 148, 149, 0.3) !important;
  border-radius: 8px !important;
}

.post-comments input::placeholder,
.post-comments textarea::placeholder {
  color: #849495 !important;
}

/* --- 20. 近期文章防遮挡安全护城河 (杜绝半截裁切与底部按钮重叠) --- */
#recent-articles-container {
  overflow: hidden !important;
}

#articles-list {
  padding-bottom: 12px !important;
}

#recent-articles-container #articles-list .article-item {
  flex-shrink: 0 !important;
}

#recent-articles-container .read-more {
  position: relative !important;
  z-index: 2 !important;
}

/* --- 21. 归档与分类时间线卡片整卡可点击与微交互升华 --- */
.timeline-post-card {
  cursor: pointer !important;
  user-select: none !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.22s ease, box-shadow 0.22s ease, background 0.22s ease !important;
}

.timeline-post-card:hover {
  background: linear-gradient(135deg, rgba(0, 240, 255, 0.05) 0%, rgba(34, 40, 52, 0.92) 100%) !important;
  border-color: rgba(0, 240, 255, 0.5) !important;
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.45), 0 0 16px rgba(0, 240, 255, 0.16) !important;
  transform: translateY(-2px) !important;
}

.timeline-post-card:hover .post-title-text,
.timeline-post-card:hover .post-title a,
.timeline-post-card:hover .post-link {
  color: #7df4ff !important;
  text-shadow: 0 0 8px rgba(125, 244, 255, 0.45) !important;
}


.timeline-post-card:active {
  transform: translateY(0) scale(0.995) !important;
}

/* --- 22. 全站文章页辅助导航与标签纯净去下划线 --- */
.pop-post .post-tags a,
.pop-post .post-tag,
.post-tag,
.post-tags a,
.post-meta a,
.pop-post .post-meta a,
.post-toc a,
.pop-post-toc a,
.breadcrumb a {
  text-decoration: none !important;
}

/* ==========================================================================
   23. 分类与标签空间极致纯化（彻底消除框套框，一体化极光通透美学）
   ========================================================================== */

/* --- A. 分类卡片去套娃 --- */
.cat-card {
  text-decoration: none !important;
  cursor: pointer !important;
}

.cat-card * {
  text-decoration: none !important;
}

/* 图标容器：纯柔光微底，绝无生硬小边框 */
.cat-card .cat-icon-wrap,
.cat-card div:has(> .ri-folder-3-line) {
  border: none !important;
  box-shadow: none !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cat-card:hover .cat-icon-wrap,
.cat-card:hover div:has(> .ri-folder-3-line) {
  transform: scale(1.08) !important;
  color: #00f0ff !important;
}

/* 篇数计数：纯文字辅助信息，彻底移除胶囊边框和底色 */
.cat-card .cat-count-badge {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: #849495 !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  transition: color 0.2s ease !important;
}

.cat-card:hover .cat-count-badge {
  color: #7df4ff !important;
}

.cat-card:hover .cat-title {
  color: #7df4ff !important;
  text-shadow: 0 0 10px rgba(125, 244, 255, 0.45) !important;
}

/* --- B. 标签胶囊星云去套娃 --- */
.tag-capsule-btn {
  text-decoration: none !important;
  cursor: pointer !important;
  gap: 6px !important;
}

.tag-capsule-btn * {
  text-decoration: none !important;
}

/* 彻底消除胶囊内部数字的小圆框/背景，浑然一体 */
.tag-capsule-btn .tag-count-num {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: #849495 !important;
  font-family: var(--pop-font-mono) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  transition: color 0.2s ease !important;
}

.tag-capsule-btn .tag-count-num::before {
  content: '/' !important;
  color: rgba(132, 148, 149, 0.35) !important;
  margin-right: 4px !important;
  font-weight: 400 !important;
  font-size: 11px !important;
}

.tag-capsule-btn:hover .tag-count-num {
  color: #dbfcff !important;
}

.tag-capsule-btn:hover .tag-name-text {
  color: #ffffff !important;
  text-shadow: 0 0 8px rgba(125, 244, 255, 0.5) !important;
}

/* 提交评论按钮全局高对比度保底 */
comment-widget .form-submit,
halo-comment .form-submit,
.form-submit,
button[type="submit"].form-submit {
  color: #021a1f !important;
  font-weight: 800 !important;
}

comment-widget .form-submit *,
halo-comment .form-submit * {
  color: #021a1f !important;
}


/* ==========================================================================
   分类与标签微光星际胶囊体系 (Stellar Quantum Badges)
   彻底解决纯白惨淡文本与前缀缺失问题，提供清晰的文件夹与 # 话题语义
   ========================================================================== */
.post-meta-badges {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
  line-height: 1 !important;
}

.meta-tags-wrap, .meta-tags {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

/* 分类纯光微标 (极光青/文件夹，彻底去除矩形方框与背景) */
.pop-prose a.meta-cat-badge,
.pop-prose .meta-cat-badge,
.pop-prose a.meta-cat,
.pop-prose .meta-cat,
.meta-cat-badge,
.meta-cat {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  color: #7df4ff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
  cursor: pointer !important;
}

.pop-prose a.meta-cat-badge *,
.pop-prose .meta-cat-badge *,
.pop-prose a.meta-cat *,
.pop-prose .meta-cat *,
.meta-cat-badge *,
.meta-cat * {
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-bottom: none !important;
}

.meta-cat-badge i, .meta-cat i {
  font-size: 13.5px !important;
  color: #00f0ff !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  filter: drop-shadow(0 0 6px rgba(0, 240, 255, 0.55)) !important;
  transition: transform 0.2s ease, filter 0.2s ease !important;
}

.meta-cat-badge span, .meta-cat span {
  color: #7df4ff !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  transition: color 0.2s ease, text-shadow 0.2s ease !important;
}

.pop-prose a.meta-cat-badge:hover,
.pop-prose .meta-cat-badge:hover,
.pop-prose a.meta-cat:hover,
.pop-prose .meta-cat:hover,
.meta-cat-badge:hover,
.meta-cat:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
}

.meta-cat-badge:hover i, .meta-cat:hover i {
  transform: scale(1.15) !important;
  filter: drop-shadow(0 0 10px rgba(0, 240, 255, 0.95)) !important;
}

.meta-cat-badge:hover span, .meta-cat:hover span {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.8), 0 0 18px rgba(0, 240, 255, 0.4) !important;
}

/* 标签星芒微标 (Celestial Laser Tag - 彻底去除胶囊线框，采用无框赛博极光星芒与激光流线) */
.pop-prose a.meta-tag-pill,
.pop-prose .meta-tag-pill,
.pop-prose a.tag-pill,
.pop-prose .tag-pill,
.pop-prose a.post-tag,
.pop-prose .post-tag,
.pop-post .post-tags .post-tag,
.post-tags .post-tag,
.meta-tag-pill,
.tag-pill {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
  cursor: pointer !important;
}

/* 底部极光流线 (悬停时自中央向两侧平滑展开的 1.5px 极光流光激光线) */
.pop-prose a.meta-tag-pill::after,
.pop-prose .meta-tag-pill::after,
.pop-prose a.tag-pill::after,
.pop-prose .tag-pill::after,
.pop-prose a.post-tag::after,
.pop-prose .post-tag::after,
.pop-post .post-tags .post-tag::after,
.post-tags .post-tag::after,
.meta-tag-pill::after,
.tag-pill::after {
  content: '' !important;
  position: absolute !important;
  bottom: -2px !important;
  left: 50% !important;
  width: 0% !important;
  height: 1.5px !important;
  background: linear-gradient(90deg, transparent 0%, #00f0ff 30%, #7df4ff 70%, transparent 100%) !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.85) !important;
  border-radius: 999px !important;
  transition: width 0.24s cubic-bezier(0.16, 1, 0.3, 1), left 0.24s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.24s ease !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

.pop-prose a.meta-tag-pill *,
.pop-prose .meta-tag-pill *,
.pop-prose a.tag-pill *,
.pop-prose .tag-pill *,
.pop-prose a.post-tag *,
.pop-prose .post-tag *,
.meta-tag-pill *,
.tag-pill *,
.post-tags .post-tag * {
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-bottom: none !important;
}

/* 极光星轨前缀 # (纯发光霓虹天青激光符号) */
.meta-tag-pill .tag-prefix,
.tag-pill .tag-prefix,
.post-tags .post-tag .tag-prefix,
.pop-prose a.meta-tag-pill .tag-prefix,
.pop-prose .meta-tag-pill .tag-prefix,
.pop-prose a.tag-pill .tag-prefix,
.pop-prose .tag-pill .tag-prefix,
.pop-prose a.post-tag .tag-prefix,
.pop-prose .post-tag .tag-prefix,
.pop-post .post-tags .post-tag .tag-prefix {
  display: inline-block !important;
  color: #00f0ff !important;
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  margin-right: 1px !important;
  opacity: 0.9 !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.65), 0 0 16px rgba(0, 240, 255, 0.35) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  transform: translateY(-0.5px) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* 标签文字本体 (高级星系钛灰 -> 悬停纯净冰蓝白) */
.meta-tag-pill span:not(.tag-prefix),
.tag-pill span:not(.tag-prefix),
.post-tags .post-tag span:not(.tag-prefix),
.pop-prose a.meta-tag-pill span:not(.tag-prefix),
.pop-prose .meta-tag-pill span:not(.tag-prefix),
.pop-prose a.tag-pill span:not(.tag-prefix),
.pop-prose .tag-pill span:not(.tag-prefix),
.pop-prose a.post-tag span:not(.tag-prefix),
.pop-prose .post-tag span:not(.tag-prefix),
.pop-post .post-tags .post-tag span:not(.tag-prefix) {
  color: #94a3b8 !important;
  font-family: var(--pop-font-body), 'Hanken Grotesk', system-ui, sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.015em !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* 悬停微动特效 (整体微浮，文字流光被唤醒，激光流线激活展开) */
.pop-prose a.meta-tag-pill:hover,
.pop-prose .meta-tag-pill:hover,
.pop-prose a.tag-pill:hover,
.pop-prose .tag-pill:hover,
.pop-prose a.post-tag:hover,
.pop-prose .post-tag:hover,
.pop-post .post-tags .post-tag:hover,
.post-tags .post-tag:hover,
.meta-tag-pill:hover,
.tag-pill:hover {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transform: translateY(-1.5px) !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
}

.pop-prose a.meta-tag-pill:hover::after,
.pop-prose .meta-tag-pill:hover::after,
.pop-prose a.tag-pill:hover::after,
.pop-prose .tag-pill:hover::after,
.pop-prose a.post-tag:hover::after,
.pop-prose .post-tag:hover::after,
.pop-post .post-tags .post-tag:hover::after,
.post-tags .post-tag:hover::after,
.meta-tag-pill:hover::after,
.tag-pill:hover::after {
  width: 100% !important;
  left: 0% !important;
  opacity: 1 !important;
}

.pop-prose a.meta-tag-pill:hover .tag-prefix,
.pop-prose .meta-tag-pill:hover .tag-prefix,
.pop-prose a.tag-pill:hover .tag-prefix,
.pop-prose .tag-pill:hover .tag-prefix,
.meta-tag-pill:hover .tag-prefix,
.tag-pill:hover .tag-prefix,
.post-tags .post-tag:hover .tag-prefix {
  color: #dbfcff !important;
  opacity: 1 !important;
  transform: scale(1.15) translateY(-0.5px) !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 1), 0 0 20px rgba(0, 240, 255, 0.7) !important;
}

.pop-prose a.meta-tag-pill:hover span:not(.tag-prefix),
.pop-prose .meta-tag-pill:hover span:not(.tag-prefix),
.pop-prose a.tag-pill:hover span:not(.tag-prefix),
.pop-prose .tag-pill:hover span:not(.tag-prefix),
.meta-tag-pill:hover span:not(.tag-prefix),
.tag-pill:hover span:not(.tag-prefix),
.post-tags .post-tag:hover span:not(.tag-prefix) {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.8), 0 0 18px rgba(125, 244, 255, 0.4) !important;
}

/* 文章详情页顶部 Eyebrow 分类 (彻底去除突兀胶囊框，通透极光微字) */
.post-eyebrow,
.pop-post .post-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: none !important;
  color: #7df4ff !important;
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-decoration: none !important;
  margin-bottom: 14px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  width: fit-content !important;
}

.post-eyebrow i {
  color: #00f0ff !important;
  font-size: 14px !important;
  filter: drop-shadow(0 0 6px rgba(0, 240, 255, 0.6)) !important;
}

.post-eyebrow:hover {
  background: transparent !important;
  border-color: transparent !important;
  color: #dbfcff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.6) !important;
  transform: translateY(-1px) !important;
}

.post-tags {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 24px 0 !important;
}


/* ==========================================================================
   Astraeus OS 全景增强模块：
   1. 文章标题与正文对比度穿透（彻底根治富文本内联暗色）
   2. 图库纯净连续瀑布流（Continuous Masonry，无图片底部名称）
   3. 全站原生沉浸式大图灯箱（Quantum LightBox）
   4. 弹窗星空粒子与连线引擎（Starfield & Constellation Canvas）
   ========================================================================== */

/* --- 1. 文章标题与正文对比度强力穿透与覆写 --- */
.pop-prose h1 *, .pop-prose h2 *, .pop-prose h3 *,
.pop-prose h4 *, .pop-prose h5 *, .pop-prose h6 * {
  color: inherit !important;
}

.pop-prose [style*="rgb(38, 38, 38)"],
.pop-prose [style*="rgb(38,38,38)"],
.pop-prose [style*="rgb(64, 64, 64)"],
.pop-prose [style*="rgb(64,64,64)"],
.pop-prose [style*="rgb(51, 51, 51)"],
.pop-prose [style*="rgb(51,51,51)"],
.pop-prose [style*="rgb(26, 46, 56)"],
.pop-prose [style*="rgb(55, 58, 64)"],
.pop-prose [style*="rgb(68, 71, 70)"],
.pop-prose [style*="#333"],
.pop-prose [style*="#262626"],
.pop-prose [style*="#222"],
.pop-prose [style*="#000"] {
  color: #e1e2eb !important;
}

.post-meta, .post-meta time, .post-meta span {
  color: #b9cacb !important;
}
.post-meta .meta-sep {
  color: #7df4ff !important;
  font-weight: 700 !important;
}
.pop-prose blockquote {
  color: #d1d9e6 !important;
  border-left: 3px solid #7df4ff !important;
  background: rgba(0, 219, 233, 0.06) !important;
}

/* --- 2. 图库纯净连续瀑布流 (Continuous Masonry) --- */
.pop-gallery {
  column-count: 4 !important;
  column-gap: 16px !important;
  width: 100% !important;
  margin-top: 24px !important;
  margin-bottom: 40px !important;
}
@media (max-width: 1440px) { .pop-gallery { column-count: 3 !important; } }
@media (max-width: 960px) { .pop-gallery { column-count: 2 !important; } }
@media (max-width: 600px) { .pop-gallery { column-count: 1 !important; } }

.gallery-photo {
  break-inside: avoid !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: rgba(24, 28, 36, 0.75) !important;
  border: 1px solid rgba(132, 148, 149, 0.28) !important;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
}
.gallery-photo:hover {
  transform: translateY(-4px) scale(1.01) !important;
  border-color: rgba(0, 240, 255, 0.55) !important;
  box-shadow: 0 14px 36px rgba(0, 240, 255, 0.22), 0 0 12px rgba(0, 240, 255, 0.15) !important;
}
.gallery-photo a, .gallery-photo img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  border-radius: 0 !important;
}
.gallery-photo img {
  cursor: zoom-in !important;
  transition: transform 0.4s ease !important;
}
.gallery-photo:hover img {
  transform: scale(1.02) !important;
}
.gallery-photo figcaption {
  display: none !important; /* 彻底清除图片底部文本 */
}

/* --- 3. 全站原生沉浸式大图灯箱 Pro (Quantum LightBox Pro 赛博量子旗舰版) --- */
.pop-prose img, .gallery-photo img, .gallery-waterfall-wrap img, #photos-card img, .gallery-thumb {
  cursor: zoom-in !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.pop-prose img:hover, .gallery-photo img:hover, .gallery-waterfall-wrap img:hover, .gallery-thumb:hover {
  transform: scale(1.01) !important;
  box-shadow: 0 8px 24px rgba(0, 240, 255, 0.15) !important;
}

#popos-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999999 !important;
  background: rgba(6, 9, 15, 0.93) !important;
  backdrop-filter: blur(32px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(180%) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.28s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
  user-select: none !important;
}
#popos-lightbox.active {
  opacity: 1 !important;
  visibility: visible !important;
}

/* 顶部荧光自动播放倒计时进度条 */
#popos-lightbox .lightbox-progress-bar {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  height: 3px !important;
  width: 0%;
  background: linear-gradient(90deg, #00dbe9 0%, #7df4ff 50%, #00f0ff 100%) !important;
  box-shadow: 0 0 12px rgba(0, 240, 255, 0.9) !important;
  z-index: 100 !important;
  pointer-events: none !important;
  transition: width 0.1s linear !important;
}

/* 顶部赛博微光悬浮工具栏 (Toolbar) */
#popos-lightbox .lightbox-toolbar {
  position: absolute !important;
  top: 20px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 16px !important;
  border-radius: 30px !important;
  background: rgba(14, 20, 32, 0.88) !important;
  border: 1px solid rgba(0, 240, 255, 0.35) !important;
  backdrop-filter: blur(24px) saturate(190%) !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.75), 0 0 20px rgba(0, 240, 255, 0.15) !important;
  z-index: 50 !important;
}

#popos-lightbox .lightbox-counter {
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  color: #7df4ff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  padding-right: 8px !important;
  border-right: 1px solid rgba(125, 244, 255, 0.25) !important;
  white-space: nowrap !important;
}

#popos-lightbox .lightbox-actions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

#popos-lightbox .lightbox-btn {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #dbfcff !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  font-size: 17px !important;
  padding: 0 !important;
  line-height: 1 !important;
}
#popos-lightbox .lightbox-btn:hover {
  background: rgba(0, 240, 255, 0.18) !important;
  border-color: rgba(0, 240, 255, 0.4) !important;
  color: #ffffff !important;
  box-shadow: 0 0 14px rgba(0, 240, 255, 0.45) !important;
  transform: scale(1.08) !important;
}
#popos-lightbox .lightbox-btn.active {
  background: rgba(0, 240, 255, 0.25) !important;
  border-color: #00f0ff !important;
  color: #00f0ff !important;
  box-shadow: 0 0 16px rgba(0, 240, 255, 0.6) !important;
}
#popos-lightbox .lightbox-btn.lightbox-close-btn {
  color: #ff7b92 !important;
}
#popos-lightbox .lightbox-btn.lightbox-close-btn:hover {
  background: rgba(255, 75, 105, 0.2) !important;
  border-color: rgba(255, 75, 105, 0.6) !important;
  color: #ffffff !important;
  box-shadow: 0 0 16px rgba(255, 75, 105, 0.5) !important;
}

/* 主舞台区与量子加载占位环 */
#popos-lightbox .lightbox-stage {
  position: relative !important;
  flex: 1 1 auto !important;
  width: 100vw !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

#popos-lightbox .lightbox-spinner {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
  z-index: 10 !important;
  transition: opacity 0.24s ease !important;
}
#popos-lightbox .lightbox-spinner.hidden {
  opacity: 0 !important;
  visibility: hidden !important;
}

#popos-lightbox .quantum-ring {
  position: absolute !important;
  border-radius: 50% !important;
  border: 2px solid transparent !important;
}
#popos-lightbox .quantum-ring.ring-1 {
  width: 64px !important;
  height: 64px !important;
  border-top-color: #00f0ff !important;
  border-right-color: #7df4ff !important;
  animation: quantumSpin 1s linear infinite !important;
  box-shadow: 0 0 18px rgba(0, 240, 255, 0.45) !important;
}
#popos-lightbox .quantum-ring.ring-2 {
  width: 46px !important;
  height: 46px !important;
  border-bottom-color: #00dbe9 !important;
  border-left-color: #38bdf8 !important;
  animation: quantumSpinReverse 0.8s linear infinite !important;
}
#popos-lightbox .spinner-text {
  margin-top: 86px !important;
  font-family: var(--pop-font-mono), monospace !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.25em !important;
  color: #7df4ff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.7) !important;
}

@keyframes quantumSpin {
  to { transform: rotate(360deg); }
}
@keyframes quantumSpinReverse {
  to { transform: rotate(-360deg); }
}

/* 图片包裹与缩放拖拽 */
#popos-lightbox .lightbox-img-wrap {
  position: relative !important;
  max-width: 92vw !important;
  max-height: 80vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: grab !important;
  transition: transform 0.15s ease-out !important;
}
#popos-lightbox .lightbox-img-wrap.panning {
  cursor: grabbing !important;
}

#popos-lightbox .lightbox-img {
  max-width: 90vw !important;
  max-height: 74vh !important;
  object-fit: contain !important;
  border-radius: 12px !important;
  border: 1px solid rgba(125, 244, 255, 0.35) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.9), 0 0 35px rgba(0, 240, 255, 0.22) !important;
  transform: scale(0.96);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease !important;
  display: block !important;
  pointer-events: auto !important;
}
#popos-lightbox .lightbox-img.loaded {
  transform: scale(1) !important;
  opacity: 1 !important;
}

/* 左右导航切换按钮 */
#popos-lightbox .lightbox-nav-btn {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 52px !important;
  height: 52px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: radial-gradient(circle at 35% 35%, rgba(28, 38, 58, 0.88) 0%, rgba(12, 16, 26, 0.95) 100%) !important;
  border: 1px solid rgba(0, 240, 255, 0.38) !important;
  color: #dbfcff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  box-shadow: 0 0 0 1px rgba(0, 240, 255, 0.15), 0 12px 32px rgba(0, 0, 0, 0.65), inset 0 0 16px rgba(0, 240, 255, 0.14) !important;
  z-index: 25 !important;
  font-size: 24px !important;
}
#popos-lightbox .lightbox-prev {
  left: 28px !important;
}
#popos-lightbox .lightbox-next {
  right: 28px !important;
}
#popos-lightbox .lightbox-nav-btn:hover {
  background: radial-gradient(circle at 40% 40%, rgba(38, 56, 88, 0.96) 0%, rgba(14, 22, 38, 0.98) 100%) !important;
  border-color: #00f0ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(0, 240, 255, 0.55), 0 0 26px rgba(0, 240, 255, 0.6), inset 0 0 20px rgba(0, 240, 255, 0.3) !important;
  transform: translateY(-50%) scale(1.08) !important;
}
#popos-lightbox .lightbox-nav-btn.hidden {
  display: none !important;
}

/* 底部区域：标题说明 + 缩略图胶卷底栏 */
#popos-lightbox .lightbox-bottom-wrap {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  padding-bottom: 14px !important;
  z-index: 40 !important;
}

#popos-lightbox .lightbox-caption {
  color: #dbfcff !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  max-width: 70vw !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background: rgba(14, 20, 32, 0.8) !important;
  padding: 4px 14px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(125, 244, 255, 0.22) !important;
  backdrop-filter: blur(14px) !important;
}

#popos-lightbox .lightbox-thumbs-tray {
  max-width: 86vw !important;
  padding: 6px 10px !important;
  border-radius: 14px !important;
  background: rgba(12, 16, 26, 0.9) !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  backdrop-filter: blur(20px) !important;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.75), 0 0 18px rgba(0, 240, 255, 0.12) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
#popos-lightbox .lightbox-thumbs-tray.collapsed {
  display: none !important;
}
#popos-lightbox .lightbox-thumbs-track {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  max-width: 100% !important;
  padding: 2px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 240, 255, 0.35) transparent !important;
}
#popos-lightbox .lightbox-thumb-item {
  width: 54px !important;
  height: 38px !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  cursor: pointer !important;
  border: 2px solid transparent !important;
  opacity: 0.55 !important;
  transition: all 0.2s ease !important;
  background: rgba(20, 28, 44, 0.8) !important;
}
#popos-lightbox .lightbox-thumb-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  pointer-events: none !important;
}
#popos-lightbox .lightbox-thumb-item:hover {
  opacity: 0.9 !important;
  transform: translateY(-2px) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
}
#popos-lightbox .lightbox-thumb-item.active {
  opacity: 1 !important;
  border-color: #00f0ff !important;
  box-shadow: 0 0 12px rgba(0, 240, 255, 0.6) !important;
  transform: scale(1.05) translateY(-2px) !important;
}

/* 图库独立页：分类药丸与骨架屏微光 */
.gallery-filter-pill {
  padding: 6px 16px !important;
  border-radius: 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #b9cacb !important;
  background: rgba(16, 22, 34, 0.65) !important;
  border: 1px solid rgba(125, 244, 255, 0.18) !important;
  backdrop-filter: blur(12px) !important;
  cursor: pointer !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.gallery-filter-pill:hover {
  color: #ffffff !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  box-shadow: 0 0 12px rgba(0, 240, 255, 0.2) !important;
  transform: translateY(-1px) !important;
}
.gallery-filter-pill.active {
  color: #03060c !important;
  background: linear-gradient(135deg, #7df4ff 0%, #00dbe9 100%) !important;
  border-color: #00f0ff !important;
  box-shadow: 0 0 16px rgba(0, 240, 255, 0.45) !important;
}
.gallery-filter-pill .filter-count {
  font-family: var(--pop-font-mono), monospace !important;
  font-size: 11px !important;
  opacity: 0.85 !important;
}

/* 骨架屏脉冲动画 */
.gallery-img-skeleton {
  position: relative !important;
  width: 100% !important;
  min-height: 180px !important;
  background: linear-gradient(90deg, rgba(20, 28, 44, 0.6) 25%, rgba(30, 44, 70, 0.8) 50%, rgba(20, 28, 44, 0.6) 75%) !important;
  background-size: 200% 100% !important;
  animation: skeletonShimmer 1.8s infinite !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
@keyframes skeletonShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.gallery-img-skeleton img {
  opacity: 0;
  transition: opacity 0.35s ease, transform 0.35s ease !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.gallery-img-skeleton.img-ready {
  animation: none !important;
  background: transparent !important;
}
.gallery-img-skeleton.img-ready img {
  opacity: 1 !important;
}

/* 相册照片描述遮罩 */
.gallery-photo-link {
  position: relative !important;
  display: block !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.gallery-photo-link .gallery-caption {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  padding: 10px 14px !important;
  background: linear-gradient(to top, rgba(6, 9, 15, 0.88) 0%, rgba(6, 9, 15, 0.4) 60%, transparent 100%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  color: #dbfcff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  opacity: 0;
  transform: translateY(6px);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  pointer-events: none !important;
}
.gallery-photo-link:hover .gallery-caption {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
.gallery-caption .caption-group-badge {
  font-size: 10px !important;
  font-family: var(--pop-font-mono), monospace !important;
  color: var(--pop-teal, #7df4ff) !important;
  background: rgba(0, 240, 255, 0.12) !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  padding: 1px 6px !important;
  border-radius: 10px !important;
}


.pop-window {
  overflow: hidden !important;
  position: absolute !important;
  background-color: rgba(11, 15, 23, 0.72) !important;
  backdrop-filter: blur(32px) saturate(190%) contrast(105%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(190%) contrast(105%) !important;
  background-image: radial-gradient(circle at 50% 28%, rgba(34, 211, 238, 0.08) 0%, rgba(14, 165, 233, 0.03) 45%, transparent 75%) !important;
  border: 1px solid rgba(56, 189, 248, 0.25) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.8), 0 0 30px rgba(34, 211, 238, 0.08) !important;
}

.starfield-canvas {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  opacity: 1 !important;
}

.pop-window .window-titlebar,
.pop-window .browser-tabs,
.pop-window .browser-toolbar {
  position: relative !important;
  z-index: 3 !important;
}

.pop-window .window-content {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

/* 确保弹窗内部卡片透光性，使底层星空粒子与引力连线宛如穿梭于黑曜石晶体之间 */
.pop-window .timeline-post-card,
.pop-window .moment-entry,
.pop-window .cat-card {
  backdrop-filter: blur(14px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
}

/* ==========================================================================
   全新无框星际引力标签群（Gravity Tag Constellation）
   ========================================================================== */
.tags-nebula-container {
  position: relative !important;
  width: 100% !important;
}

.tags-nebula-cloud {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px 20px !important;
  align-items: center !important;
}

.tag-nebula-chip {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 6px 10px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  position: relative !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.tag-nebula-chip .tag-hash {
  font-family: var(--pop-font-mono, monospace) !important;
  font-weight: 700 !important;
  color: #00f0ff !important;
  opacity: 0.85 !important;
  transition: all 0.25s ease !important;
}

.tag-nebula-chip .tag-text {
  font-family: 'Sora', var(--pop-font-sans), sans-serif !important;
  font-weight: 600 !important;
  transition: all 0.25s ease !important;
  letter-spacing: 0.01em !important;
}

.tag-nebula-chip .tag-meta {
  font-family: var(--pop-font-mono, monospace) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #849495 !important;
  opacity: 0.8 !important;
  transition: all 0.25s ease !important;
}

/* 等级 1：超级热门（>= 5篇）- 极光炫彩霓虹流光渐变 */
.tag-nebula-chip.tag-level-super .tag-text {
  font-size: 16px !important;
  font-weight: 700 !important;
  background: linear-gradient(135deg, #00f0ff 0%, #38bdf8 50%, #a855f7 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 0 10px rgba(0, 240, 255, 0.45)) !important;
}

.tag-nebula-chip.tag-level-super .tag-meta {
  color: #7df4ff !important;
  font-size: 12px !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.4) !important;
}

/* 等级 2：活跃标签（2~4篇）- 极光高光白青 */
.tag-nebula-chip.tag-level-hot .tag-text {
  font-size: 14.5px !important;
  color: #dbfcff !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.2) !important;
}

.tag-nebula-chip.tag-level-hot .tag-meta {
  color: #94a3b8 !important;
}

/* 等级 3：探索基础标签（1篇）- 清爽深空灰蓝 */
.tag-nebula-chip.tag-level-base .tag-text {
  font-size: 13.5px !important;
  color: #cbd5e1 !important;
}

.tag-nebula-chip.tag-level-base .tag-hash {
  opacity: 0.6 !important;
}

/* 交互动效：无界高斯悬停光晕 */
.tag-nebula-chip:hover {
  background: rgba(0, 240, 255, 0.08) !important;
  transform: translateY(-2px) scale(1.04) !important;
}

.tag-nebula-chip:hover .tag-hash {
  opacity: 1 !important;
  text-shadow: 0 0 10px #00f0ff !important;
}

.tag-nebula-chip:hover .tag-text {
  color: #ffffff !important;
  -webkit-text-fill-color: initial !important;
  text-shadow: 0 0 14px rgba(0, 240, 255, 0.8) !important;
}

.tag-nebula-chip:hover .tag-meta {
  color: #dbfcff !important;
  opacity: 1 !important;
  text-shadow: 0 0 6px rgba(0, 240, 255, 0.5) !important;
}

/* ==========================================================================
   全站通用保底：所有页面与组件的 time 与元数据高对比度深度保障
   ========================================================================== */
time,
.post-date-badge time,
.timeline-post-card time,
.post-meta time,
.home-post-meta time,
.moment-main time,
.search-hit-meta time {
  color: #7df4ff !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
}

.post-meta,
.post-meta span,
.timeline-post-card .post-excerpt,
.home-post-excerpt,
.archive-empty-state p {
  color: #b9cacb !important;
}

.archive-empty-state h3 {
  color: #dbfcff !important;
}

.archive-empty-state .empty-icon i {
  color: #7df4ff !important;
}

/* ==========================================================================
   标签页与分类页：黄金视界容器规范（居中 1080px 统一规范，根治大屏拉伸）
   ========================================================================== */
.tags-page-wrapper,
.tag-page-wrapper,
.categories-page-wrapper,
.category-page-wrapper {
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 32px 20px 80px !important;
}

/* ==========================================================================
   标签页下半区：即时引力文章探索矩阵 (Tag Instant Explorer)
   ========================================================================== */
.tag-explorer-head {
  position: relative !important;
  user-select: none !important;
}

.tag-explorer-radar-dot {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #00f0ff !important;
  box-shadow: 0 0 10px #00f0ff, 0 0 18px rgba(0, 240, 255, 0.6) !important;
  display: inline-block !important;
  animation: radar-pulse 2.2s infinite ease-in-out !important;
}

@keyframes radar-pulse {
  0%, 100% { opacity: 0.6; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1.2); }
}

.tag-chip-active {
  background: rgba(0, 240, 255, 0.08) !important;
  border: 1px solid rgba(0, 240, 255, 0.2) !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.15) !important;
}

.tag-chip-active .tag-text {
  color: #ffffff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.8) !important;
}

/* ==========================================================================
   即时探索矩阵：资源管理器文件清单条目视图 (File Explorer Detail Rows)
   彻底消除小方盒卡片，采用规整、扁平、高密度的操作系统文件清单排版
   ========================================================================== */
.tag-explorer-posts-list {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 10px !important;
  background: rgba(13, 17, 26, 0.4) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  padding: 6px 10px !important;
}

/* 资源管理器式列表表头 */
.tag-explorer-list-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 12px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #708688 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  user-select: none !important;
}

.tag-explorer-list-header .list-col-name {
  flex: 1 1 auto !important;
  padding-left: 24px !important;
}

.tag-explorer-list-header .list-col-details {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  flex-shrink: 0 !important;
}

.tag-explorer-list-header .list-col-date {
  width: 95px !important;
}

.tag-explorer-list-header .list-col-cat {
  width: 80px !important;
}

.tag-explorer-list-header .list-col-views {
  width: 48px !important;
  text-align: right !important;
}

.tag-explorer-list-header .list-col-action {
  width: 18px !important;
}

/* 资源管理器单行条目：纯净扁平无盒子，整行微光悬停 */
.tag-explorer-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 9px 12px !important;
  min-height: 40px !important;
  box-sizing: border-box !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.035) !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  color: inherit !important;
  background: transparent !important;
  transition: background 0.18s ease, transform 0.18s ease !important;
}

.tag-explorer-row:last-child {
  border-bottom: none !important;
}

.tag-explorer-row:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

/* 主列：图标 + 标题 */
.explorer-row-main {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding-right: 16px !important;
}

.explorer-row-icon {
  color: #7df4ff !important;
  font-size: 15px !important;
  opacity: 0.75 !important;
  flex-shrink: 0 !important;
  transition: opacity 0.2s ease, color 0.2s ease, text-shadow 0.2s ease !important;
}

.tag-explorer-row:hover .explorer-row-icon {
  opacity: 1 !important;
  color: #00f0ff !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.7) !important;
}

.explorer-row-title {
  font-family: 'Sora', var(--pop-font-sans), sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #dbfcff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  line-height: 1.4 !important;
  transition: color 0.2s ease !important;
}

.tag-explorer-row:hover .explorer-row-title {
  color: #ffffff !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.5) !important;
}

/* 右侧分栏元数据：时间、分类、访问、箭头 */
.explorer-row-details {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  flex-shrink: 0 !important;
}

.explorer-row-date {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 12px !important;
  color: #849495 !important;
  width: 95px !important;
  white-space: nowrap !important;
  letter-spacing: 0.02em !important;
}

.explorer-row-cat {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  color: #94a3b8 !important;
  width: 80px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.explorer-row-cat i {
  color: #7df4ff !important;
  font-size: 12px !important;
  opacity: 0.8 !important;
}

.explorer-row-views {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11.5px !important;
  color: #708688 !important;
  width: 48px !important;
  justify-content: flex-end !important;
  white-space: nowrap !important;
}

.explorer-row-views i {
  font-size: 11.5px !important;
}

.explorer-row-arrow {
  color: #556c6e !important;
  font-size: 14px !important;
  width: 18px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
  transition: all 0.2s ease !important;
}

.tag-explorer-row:hover .explorer-row-arrow {
  color: #00f0ff !important;
  transform: translate(2px, -2px) !important;
}

/* 移动端响应式压缩 */
@media (max-width: 640px) {
  .tag-explorer-list-header .list-col-cat,
  .tag-explorer-list-header .list-col-views,
  .explorer-row-cat,
  .explorer-row-views {
    display: none !important;
  }
}

/* ==========================================================================
   分类页面：通透全息星云晶体卡片与无界微标 (Categories Nebula Crystal Card)
   ========================================================================== */
.cat-nebula-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  padding: 22px 24px !important;
  border-radius: 14px !important;
  text-decoration: none !important;
  background: linear-gradient(145deg, rgba(20, 28, 45, 0.35) 0%, rgba(10, 15, 26, 0.22) 100%) !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
  border: 1px solid rgba(0, 240, 255, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 8px 26px rgba(0, 0, 0, 0.28) !important;
  overflow: hidden !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cat-nebula-card:hover {
  background: linear-gradient(145deg, rgba(24, 38, 62, 0.48) 0%, rgba(12, 18, 32, 0.32) 100%) !important;
  border-color: rgba(0, 240, 255, 0.55) !important;
  transform: translateY(-4px) !important;
  box-shadow: inset 0 1px 0 rgba(0, 240, 255, 0.25), 0 16px 36px rgba(0, 0, 0, 0.4), 0 0 25px rgba(0, 240, 255, 0.16) !important;
}

/* 头部排版 */
.cat-card-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 18px !important;
}

/* 全息独立文件夹图标（坚决无方块底盒） */
.cat-icon-wrap {
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #00f0ff !important;
  font-size: 26px !important;
  line-height: 1 !important;
  filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.45)) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cat-nebula-card:hover .cat-icon-wrap {
  transform: scale(1.12) !important;
  filter: drop-shadow(0 0 14px rgba(0, 240, 255, 0.75)) !important;
}

/* 右侧计数与跃迁组合 */
.cat-header-right {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* 篇数极客数码微标（坚决无胶囊底框） */
.cat-count-badge {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #7df4ff !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  letter-spacing: 0.04em !important;
  text-shadow: 0 0 6px rgba(0, 240, 255, 0.3) !important;
  transition: all 0.25s ease !important;
}

.cat-nebula-card:hover .cat-count-badge {
  color: #a5f3fc !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.6) !important;
}

/* 跃迁动向标 ↗ */
.cat-jump-arrow {
  font-size: 16px !important;
  color: rgba(125, 244, 255, 0.5) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cat-nebula-card:hover .cat-jump-arrow {
  color: #00f0ff !important;
  transform: translate(3px, -3px) scale(1.18) !important;
  filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.6)) !important;
}

/* 卡片主体：分类名 + 英文微标 */
.cat-card-body {
  margin-top: 4px !important;
}

.cat-title {
  font-family: 'Sora', sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #f0fdff !important;
  margin: 0 0 4px 0 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
  transition: all 0.25s ease !important;
}

.cat-nebula-card:hover .cat-title {
  color: #ffffff !important;
  text-shadow: 0 0 12px rgba(0, 240, 255, 0.5) !important;
}

.cat-slug-info {
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: rgba(132, 148, 149, 0.7) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  transition: all 0.25s ease !important;
}

.cat-nebula-card:hover .cat-slug-info {
  color: #7df4ff !important;
}

/* 底部全息流光微光轨 */
.cat-glow-bar {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  height: 2px !important;
  width: 28px !important;
  background: linear-gradient(90deg, #00f0ff 0%, transparent 100%) !important;
  opacity: 0.35 !important;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.cat-nebula-card:hover .cat-glow-bar {
  width: 100% !important;
  opacity: 0.9 !important;
  box-shadow: 0 0 12px rgba(0, 240, 255, 0.8) !important;
}

/* ==========================================================================
   归档时间线卡片：通透无重边框极客质感
   ========================================================================== */
.timeline-post-card {
  background: rgba(13, 17, 26, 0.52) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4) !important;
}

.timeline-post-card:hover {
  background: linear-gradient(135deg, rgba(0, 240, 255, 0.06) 0%, rgba(20, 26, 38, 0.82) 100%) !important;
  border-color: rgba(0, 240, 255, 0.45) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.5), 0 0 16px rgba(0, 240, 255, 0.14) !important;
}

/* ==========================================================================
   文章页：Hero 左右双翼画卷排版与封面 100% 完整呈现 (Split Hero Post Layout)
   ========================================================================== */
.post-header {
  margin-bottom: 24px !important;
  padding-bottom: 22px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* 当存在封面图时：宽屏桌面下自动切换为左右双翼 Hero 紧凑画卷（消除大屏空洞） */
@media (min-width: 860px) {
  .post-header.has-cover {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 40px !important;
    min-height: 200px !important;
  }

  .post-header.has-cover .post-header-main {
    flex: 1 1 58% !important;
    max-width: 60% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }

  .post-header.has-cover .post-cover {
    flex: 0 0 38% !important;
    max-width: 38% !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }
}

.post-title {
  font-family: 'Sora', sans-serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #f0fdff !important;
  margin: 10px 0 12px 0 !important;
  line-height: 1.32 !important;
  letter-spacing: -0.015em !important;
  text-shadow: 0 0 12px rgba(0, 240, 255, 0.2) !important;
}

.post-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 10px !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 12.5px !important;
  color: #849495 !important;
  margin-bottom: 12px !important;
}

.post-meta time,
.post-meta span {
  color: #b9cacb !important;
}

.post-meta .meta-sep {
  color: rgba(132, 148, 149, 0.35) !important;
  user-select: none !important;
}

/* 分类眉标 */
.post-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #00f0ff !important;
  text-decoration: none !important;
  border-bottom: none !important;
  margin-bottom: 4px !important;
  transition: all 0.2s ease !important;
}

.post-eyebrow:hover {
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.6) !important;
}

/* 纯净无界封面容器：坚决消除任何多余外框、黑盒子底衬与内阴影 */
.post-cover {
  position: relative !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: none !important;
  margin: 16px 0 20px 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow: visible !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 封面图本身：自然尺寸比例，完整呈现零裁剪，仅自带微圆角与极简柔和光晕 */
.post-cover img {
  width: 100% !important;
  max-width: 380px !important;
  height: auto !important;
  max-height: 240px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0, 240, 255, 0.18) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 18px rgba(0, 240, 255, 0.12) !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease !important;
}

.post-cover:hover img {
  transform: translateY(-3px) scale(1.015) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 240, 255, 0.18) !important;
}

/* 首屏摘要导语卡片 */
.post-excerpt {
  margin-top: 10px !important;
  padding: 10px 14px !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: #c5d3d4 !important;
  background: rgba(0, 240, 255, 0.04) !important;
  border-left: 2px solid #00f0ff !important;
  border-radius: 0 8px 8px 0 !important;
}

/* 窄屏/移动端自适应折叠为上下流式 */
@media (max-width: 859px) {
  .post-header.has-cover {
    display: flex !important;
    flex-direction: column !important;
  }
  .post-cover {
    width: 100% !important;
    margin: 14px 0 !important;
  }
  .post-cover img {
    max-height: 220px !important;
  }
}

/* ============================================================
   全站统一文章展示卡片与标签页关闭高亮体系 (v0.8.54)
   ============================================================ */

/* 1. 浏览器标签页关闭按钮 (×) 交互高亮与动效 */
.pop-window[data-type=browser] .browser-tab .tab-close,
.pop-window.browser-window .browser-tab .tab-close {
  width: 18px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 6px !important;
  font-size: 14px !important;
  color: #8da2a3 !important;
  background: transparent !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  border: none !important;
  outline: none !important;
}

.pop-window[data-type=browser] .browser-tab .tab-close:hover,
.pop-window.browser-window .browser-tab .tab-close:hover {
  background: rgba(255, 95, 95, 0.22) !important;
  color: #ff7d7d !important;
  transform: scale(1.15) !important;
  box-shadow: 0 0 8px rgba(255, 95, 95, 0.3) !important;
}

.pop-window[data-type=browser] .browser-tab .tab-close:active,
.pop-window.browser-window .browser-tab .tab-close:active {
  transform: scale(0.92) !important;
}

/* 2. 搜索结果与全站卡片容器标准间距 */
.search-results-wrap .pop-article-list,
.timeline-posts-list .pop-article-list,
.pop-article-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-top: 10px !important;
}

/* 3. 卡片内摘要排版保护（两行省略，无生硬外框） */
.timeline-post-card .post-excerpt {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  color: #9ab0b2 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* 4. 卡片中标题纯净去下划线与发光 */
.timeline-post-card .post-title {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
}

.timeline-post-card .post-title a {
  color: #dbfcff !important;
  text-decoration: none !important;
  transition: color 0.2s ease, text-shadow 0.2s ease !important;
}

.timeline-post-card .post-title a:hover {
  color: #7df4ff !important;
  text-shadow: 0 0 8px rgba(125, 244, 255, 0.5) !important;
}



/* ============================================================
   桌面精选图库 10s 自动轮播自然呼吸过渡动效 (v0.8.56)
   ============================================================ */
.gallery-waterfall-wrap {
  position: relative !important;
  transition: opacity 0.38s cubic-bezier(0.16, 1, 0.3, 1), transform 0.38s cubic-bezier(0.16, 1, 0.3, 1), filter 0.38s ease !important;
  will-change: opacity, transform, filter !important;
}

/* 渐隐过渡态：轻微景深模糊与缩放沉降 */
.gallery-waterfall-wrap.gallery-fading-out {
  opacity: 0 !important;
  transform: scale(0.97) translateY(4px) !important;
  filter: blur(3px) !important;
}

/* 渐显就绪态：自天幕极光展开微缩入场 */
.gallery-waterfall-wrap.gallery-fading-in {
  opacity: 0 !important;
  transform: scale(1.02) translateY(-4px) !important;
  filter: blur(4px) !important;
}

/* 卡片交互平滑度 */
#photos-card .gallery-item {
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, filter 0.28s ease !important;
}

#photos-card .gallery-item:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 6px 16px rgba(0, 240, 255, 0.22) !important;
  filter: brightness(1.06) !important;
}

/* ==========================================================================
   18. APlayer 星际黑曜石全息暗黑皮肤 (StarOS Celestial Dark Glass Theme)
   - 彻底消灭刺眼原生纯白底(#ffffff)，融入 StarOS 深空星轨毛玻璃体系
   - 智能高对比度：青白标题(#fff)、极光青发光高亮歌词(#7df4ff)、发光渐变进度条
   - 完美兼容 Halo aplayer-gen 插件、MetingJS 及文章自嵌 APlayer
   ========================================================================== */

:root {
  --ap-theme: #7df4ff !important;
  --ap-bg: rgba(13, 20, 32, 0.85) !important;
  --ap-title: #ffffff !important;
  --ap-artist: #8fa7b2 !important;
  --ap-lyrics: rgba(219, 252, 255, 0.45) !important;
  --ap-lyrics-current: #7df4ff !important;
  --ap-progress-bar: rgba(255, 255, 255, 0.08) !important;
  --ap-progress-loaded: rgba(125, 244, 255, 0.22) !important;
  --ap-progress-played: #7df4ff !important;
  --ap-time: #8fa7b2 !important;
  --ap-icon: #8fa7b2 !important;
}

/* 播放器主容器 */
.aplayer,
div[aplayer],
.responsive-div#aplayer,
#aplayer {
  background: rgba(13, 20, 32, 0.82) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  border: 1px solid rgba(125, 244, 255, 0.2) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 15px rgba(0, 240, 255, 0.08) !important;
  color: #dbfcff !important;
  font-family: var(--pop-font-sans, 'Sora', sans-serif) !important;
  margin: 20px 0 !important;
  overflow: hidden !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
}

.aplayer:hover,
div[aplayer]:hover,
#aplayer:hover {
  border-color: rgba(125, 244, 255, 0.38) !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.6), 0 0 24px rgba(0, 240, 255, 0.15) !important;
}

/* 专辑封面 */
.aplayer .aplayer-pic {
  border-radius: 10px 0 0 10px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45) !important;
  overflow: hidden !important;
}

/* 播放/暂停悬浮按钮 */
.aplayer .aplayer-pic .aplayer-button {
  background: rgba(13, 20, 32, 0.78) !important;
  border: 1.5px solid #7df4ff !important;
  box-shadow: 0 0 14px rgba(125, 244, 255, 0.6) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.aplayer .aplayer-pic .aplayer-button:hover {
  background: rgba(0, 240, 255, 0.25) !important;
  transform: scale(1.12) !important;
  box-shadow: 0 0 20px rgba(125, 244, 255, 0.9) !important;
}

.aplayer .aplayer-pic .aplayer-button path {
  fill: #7df4ff !important;
}

/* 信息栏主体 */
.aplayer .aplayer-info {
  background: transparent !important;
  border-bottom: none !important;
  padding: 14px 16px 14px 12px !important;
}

/* 歌曲名称与作者 */
.aplayer .aplayer-info .aplayer-music {
  margin-bottom: 6px !important;
}

.aplayer .aplayer-info .aplayer-music .aplayer-title {
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.25) !important;
}

.aplayer .aplayer-info .aplayer-music .aplayer-author {
  color: #8fa7b2 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-left: 6px !important;
}

/* 控制栏与进度条 */
.aplayer .aplayer-info .aplayer-controller {
  align-items: center !important;
}

.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap {
  margin: 0 10px 0 0 !important;
  padding: 4px 0 !important;
}

.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar {
  background: rgba(255, 255, 255, 0.09) !important;
  height: 5px !important;
  border-radius: 4px !important;
  overflow: hidden !important;
}

.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-loaded {
  background: rgba(125, 244, 255, 0.22) !important;
  height: 5px !important;
  border-radius: 4px !important;
}

.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played {
  background: linear-gradient(90deg, #10b981, #7df4ff) !important;
  height: 5px !important;
  border-radius: 4px !important;
  box-shadow: 0 0 10px rgba(125, 244, 255, 0.5) !important;
}

.aplayer .aplayer-info .aplayer-controller .aplayer-bar-wrap .aplayer-bar .aplayer-played .aplayer-thumb {
  background: #7df4ff !important;
  border: 2px solid #08111d !important;
  box-shadow: 0 0 10px rgba(125, 244, 255, 0.95) !important;
  transform: scale(1.15) !important;
  top: -3.5px !important;
}

/* 时间文字 */
.aplayer .aplayer-info .aplayer-controller .aplayer-time {
  color: #8fa7b2 !important;
  font-family: var(--pop-font-mono, 'JetBrains Mono', monospace) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

/* 控制栏图标 SVG */
.aplayer .aplayer-icon path {
  fill: #8fa7b2 !important;
  transition: fill 0.2s ease, filter 0.2s ease !important;
}

.aplayer .aplayer-icon:hover path {
  fill: #7df4ff !important;
  filter: drop-shadow(0 0 6px rgba(125, 244, 255, 0.75)) !important;
}

/* 音量控制 */
.aplayer .aplayer-volume-bar-wrap .aplayer-volume-bar {
  background: rgba(255, 255, 255, 0.1) !important;
  border-radius: 4px !important;
}

.aplayer .aplayer-volume-bar-wrap .aplayer-volume-bar .aplayer-volume {
  background: #7df4ff !important;
  box-shadow: 0 0 8px rgba(125, 244, 255, 0.6) !important;
}

/* 歌词区域（上下黑曜石渐变遮罩，发光当前歌词） */
.aplayer .aplayer-lrc {
  margin: 0 !important;
  padding: 0 !important;
  text-shadow: none !important;
}

.aplayer .aplayer-lrc:before {
  background: linear-gradient(180deg, rgba(13, 20, 32, 0.95) 0%, rgba(13, 20, 32, 0) 100%) !important;
}

.aplayer .aplayer-lrc:after {
  background: linear-gradient(180deg, rgba(13, 20, 32, 0) 0%, rgba(13, 20, 32, 0.95) 100%) !important;
}

.aplayer .aplayer-lrc p {
  color: rgba(219, 252, 255, 0.42) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  height: 18px !important;
  opacity: 0.85 !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.aplayer .aplayer-lrc p.aplayer-lrc-current {
  color: #7df4ff !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  text-shadow: 0 0 12px rgba(125, 244, 255, 0.7), 0 0 24px rgba(125, 244, 255, 0.35) !important;
  transform: scale(1.05) !important;
}

/* 播放列表 */
.aplayer .aplayer-list {
  background: rgba(9, 14, 24, 0.9) !important;
  border-top: 1px solid rgba(125, 244, 255, 0.12) !important;
}

.aplayer .aplayer-list ol li {
  border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
  color: #dbfcff !important;
  font-size: 13px !important;
  padding: 8px 15px !important;
  transition: all 0.2s ease !important;
}

.aplayer .aplayer-list ol li:hover {
  background: rgba(125, 244, 255, 0.08) !important;
}

.aplayer .aplayer-list ol li.aplayer-list-light {
  background: rgba(125, 244, 255, 0.15) !important;
  border-left: 3px solid #7df4ff !important;
}

.aplayer .aplayer-list ol li .aplayer-list-index {
  color: #7df4ff !important;
  font-weight: 600 !important;
}

.aplayer .aplayer-list ol li .aplayer-list-title {
  color: #ffffff !important;
  font-weight: 600 !important;
}

.aplayer .aplayer-list ol li .aplayer-list-author {
  color: #8fa7b2 !important;
}

/* ==========================================================================
   Star OS Moments - Cosmic Chrono Stream (瞬间微语星流时间轴系统)
   彻底消除宽屏空白与难看粗糙图标，呈现居中流光星轨时间轴
   ========================================================================== */

/* 1. 页面外层容器 (黄金居中收敛，消除右侧巨大空白) */
.moments-page-wrapper,
#pop-desktop .moments-page-wrapper,
.pop-prose .moments-page-wrapper {
  max-width: 780px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 10px 16px 60px !important;
  box-sizing: border-box !important;
}

/* 2. 星流时间轴纵轨 (Cosmic Chrono Rail) */
.pop-moments-timeline,
.pop-moments {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  padding-left: 36px !important;
  margin-top: 12px !important;
  box-sizing: border-box !important;
}

/* 纵向极光星轨母线 */
.pop-moments-timeline::before,
.pop-moments::before {
  content: '' !important;
  position: absolute !important;
  left: 12px !important;
  top: 16px !important;
  bottom: 16px !important;
  width: 2px !important;
  background: linear-gradient(180deg, rgba(0, 240, 255, 0.45) 0%, rgba(0, 240, 255, 0.15) 85%, transparent 100%) !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.25) !important;
  border-radius: 999px !important;
  pointer-events: none !important;
}

/* 3. 瞬间卡片主体 (Cosmic Obsidian Crystal Card) */
.moment-card,
.moment-entry {
  position: relative !important;
  background: rgba(20, 24, 33, 0.65) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
  border: 1px solid rgba(59, 73, 75, 0.45) !important;
  border-radius: 12px !important;
  padding: 18px 22px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
}

.moment-card:hover,
.moment-entry:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(0, 240, 255, 0.35) !important;
  background: rgba(24, 29, 40, 0.75) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45), 0 0 20px rgba(0, 240, 255, 0.08) !important;
}

/* 4. 左侧时间线星核信标 (彻底替代老旧实心闪电圆圈) */
.moment-node {
  position: absolute !important;
  left: -36px !important;
  top: 18px !important;
  width: 26px !important;
  height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
}

.moment-node-halo {
  position: absolute !important;
  inset: -4px !important;
  border-radius: 50% !important;
  background: radial-gradient(circle, rgba(0, 240, 255, 0.3) 0%, transparent 70%) !important;
  opacity: 0.6 !important;
  transition: transform 0.24s ease, opacity 0.24s ease !important;
}

.moment-node-core {
  position: relative !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: #0b0f19 !important;
  border: 1.5px solid #00f0ff !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.5) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #dbfcff !important;
  font-size: 10px !important;
  transition: all 0.24s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.moment-card:hover .moment-node-core,
.moment-entry:hover .moment-node-core {
  transform: scale(1.18) !important;
  background: #00363a !important;
  border-color: #7df4ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 14px rgba(0, 240, 255, 0.95) !important;
}

.moment-card:hover .moment-node-halo,
.moment-entry:hover .moment-node-halo {
  transform: scale(1.5) !important;
  opacity: 1 !important;
}

/* 兼容旧 moment-avatar 降级回退 (替换老旧实心闪电) */
.moment-avatar {
  position: absolute !important;
  left: -36px !important;
  top: 18px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: #0b0f19 !important;
  border: 1.5px solid #00f0ff !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.5) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #dbfcff !important;
  font-size: 10px !important;
  transition: all 0.24s ease !important;
}
.moment-avatar i {
  font-size: 10px !important;
}
.moment-entry:hover .moment-avatar {
  transform: scale(1.18) !important;
  background: #00363a !important;
  box-shadow: 0 0 14px rgba(0, 240, 255, 0.9) !important;
}

/* 5. 卡片顶栏排版 (微标 + 时间) */
.moment-meta-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(59, 73, 75, 0.3) !important;
}

.moment-tag-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #7df4ff !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.moment-tag-badge i {
  font-size: 12px !important;
  color: #00f0ff !important;
  filter: drop-shadow(0 0 5px rgba(0, 240, 255, 0.7)) !important;
}

.moment-time,
.moment-main time {
  font-family: var(--pop-font-mono), 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  color: #849495 !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  transition: color 0.2s ease !important;
}

.moment-card:hover .moment-time,
.moment-entry:hover .moment-main time {
  color: #dbfcff !important;
}

/* 6. 正文气泡内容与富文本洗净 (彻底铲除外站粘贴导致的白底黑字) */
.moment-bubble,
.moment-bubble.pop-prose {
  font-size: 14.5px !important;
  line-height: 1.8 !important;
  color: #e1e2eb !important;
  word-break: break-word !important;
}

.moment-bubble *,
.moment-bubble p,
.moment-bubble span,
.moment-bubble div {
  background: transparent !important;
  background-color: transparent !important;
  color: #e1e2eb !important;
  font-family: var(--pop-font-body), 'Hanken Grotesk', system-ui, sans-serif !important;
  font-size: 14.5px !important;
  line-height: 1.8 !important;
}

.moment-bubble p {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

.moment-bubble p:last-child {
  margin-bottom: 0 !important;
}

/* 7. 媒体附件与图片展示系统 (自适应完整呈现，杜绝任何裁剪截断) */
.moment-media-grid {
  margin-top: 14px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  max-width: 540px !important;
  width: 100% !important;
}

.moment-media-item {
  position: relative !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  background: rgba(10, 14, 22, 0.45) !important;
  border: 1px solid rgba(59, 73, 75, 0.4) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3) !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.22s ease, box-shadow 0.22s ease !important;
}

.moment-media-item:hover {
  border-color: #00f0ff !important;
  box-shadow: 0 6px 20px rgba(0, 240, 255, 0.22) !important;
  transform: translateY(-2px) !important;
}

.moment-media-link {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  text-decoration: none !important;
  border-bottom: none !important;
  cursor: zoom-in !important;
}

/* 多图通用正方形缩略图（双图、三图、四图田字格、九宫格，保持均匀美观） */
.moment-media-grid .moment-media-item {
  aspect-ratio: 1 / 1 !important;
}

.moment-media-grid .moment-media-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: inherit !important;
  cursor: zoom-in !important;
}

/* 7.1 单图自适应完整呈现（核心优化：针对手办、壁纸、截屏等单图，100% 完整展现原长宽比，绝不裁剪） */
.moment-media-grid.is-single,
.moment-media-grid:has(> .moment-media-item:only-child) {
  display: block !important;
  max-width: 100% !important;
  width: fit-content !important;
}

.moment-media-grid.is-single .moment-media-item,
.moment-media-grid:has(> .moment-media-item:only-child) .moment-media-item,
.moment-media-item:only-child {
  display: inline-block !important;
  width: auto !important;
  max-width: 100% !important;
  aspect-ratio: auto !important;
  border-radius: 12px !important;
  background: rgba(10, 14, 22, 0.5) !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.45) !important;
}

.moment-media-grid.is-single .moment-media-item img,
.moment-media-grid:has(> .moment-media-item:only-child) .moment-media-item img,
.moment-media-item:only-child img {
  width: auto !important;
  height: auto !important;
  max-width: min(560px, 100%) !important;
  max-height: 520px !important;
  object-fit: contain !important;
  border-radius: inherit !important;
  display: block !important;
  cursor: zoom-in !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.moment-media-grid.is-single .moment-media-item:hover img,
.moment-media-grid:has(> .moment-media-item:only-child) .moment-media-item:hover img {
  transform: scale(1.012) !important;
}

/* 7.2 双图对等排列 (宽幅画廊比例) */
.moment-media-grid.is-double,
.moment-media-grid:has(> .moment-media-item:nth-child(2):last-child) {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-width: 520px !important;
}

.moment-media-grid.is-double .moment-media-item,
.moment-media-grid:has(> .moment-media-item:nth-child(2):last-child) .moment-media-item {
  aspect-ratio: 4 / 3 !important;
}

/* 7.3 四图田字格 (优雅 2x2 紧凑排列) */
.moment-media-grid.is-four,
.moment-media-grid:has(> .moment-media-item:nth-child(4):last-child) {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-width: 380px !important;
}

.moment-media-grid.is-four .moment-media-item,
.moment-media-grid:has(> .moment-media-item:nth-child(4):last-child) .moment-media-item {
  aspect-ratio: 1 / 1 !important;
}

/* 7.4 视频附件优雅适配 */
.moment-media-item video {
  width: 100% !important;
  max-height: 480px !important;
  border-radius: inherit !important;
  display: block !important;
  background: #000 !important;
}

/* 7.5 正文富文本中插入的图片亦自适应完整呈现（绝不截断） */
.moment-bubble img {
  width: auto !important;
  height: auto !important;
  max-width: min(560px, 100%) !important;
  max-height: 520px !important;
  object-fit: contain !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0, 240, 255, 0.22) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
  margin: 12px 0 !important;
  display: block !important;
  cursor: zoom-in !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.moment-bubble img:hover {
  border-color: #00f0ff !important;
  box-shadow: 0 10px 28px rgba(0, 240, 255, 0.25) !important;
  transform: translateY(-2px) scale(1.01) !important;
}

/* 8. 空状态质感 */
.pop-moments-timeline .archive-empty-state,
.pop-moments .archive-empty-state {
  margin-top: 24px !important;
  padding: 40px 20px !important;
  text-align: center !important;
}

/* 9. 弹窗内部绝对隔离防御 (窗口内部绝不允许包含或渲染桌面卡片与桌面小组件) */
.pop-window #pop-cards,
.browser-window #pop-cards,
.window-content #pop-cards,
.pop-window #pop-wallpaper,
.browser-window #pop-wallpaper,
.window-content #pop-wallpaper,
.pop-window #pop-dock,
.browser-window #pop-dock,
.window-content #pop-dock {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}