/* ============================================================
   黑白主题切换（浅色模式）
   原理：对 <html> 整体 invert + hue-rotate(180deg)，把深色 UI 转为浅色，
   色相保持不变（品牌红 #dc3545 仍是红色，只是亮度反转）；
   再对 img/video/canvas（投屏画面、截图、缩略图）做一次同样的反向，
   抵消 html 的反色，恢复设备真实画面。
   ============================================================ */
html.light {
  filter: invert(1) hue-rotate(180deg);
}

/* 媒体画面恢复：双重 invert + 双重 hue-rotate 抵消，画面保持真实颜色 */
html.light img,
html.light video,
html.light canvas {
  filter: invert(1) hue-rotate(180deg);
}

/* 主题切换按钮：右下角悬浮，不随内容反色（保持可辨识） */
#themeToggle {
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 2147483000 !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  border: 1px solid #30363d !important;
  background: #161b22 !important;
  color: #e6edf3 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  line-height: 1 !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .45) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  transition: transform .15s ease !important;
}
#themeToggle:hover {
  transform: scale(1.08) !important;
}
