/* ============================================================
   10-base.css
   全局基底：body / 暗色锁 / 顶栏 / 太极 hides / 首屏 banner / 背景层
   依赖: 00-tokens.css
   ============================================================ */

/* 首页全屏 Banner */
.page-home #header {
  height: 100vh !important;
  min-height: 100vh !important;
}

/* banner 区域图片隐藏，用全局固定背景代替 */
#header > img,
#header > picture {
  display: none !important;
}

/* 标题绝对居中 */
.page-home #header-title {
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: auto !important;
  max-width: 90%;
}

/* 首屏标题：大字 + 高光描边 + 轻微浮动（合并 base + 精修） */
.page-home #header-title h1 {
  font-size: 4rem !important;
  letter-spacing: 6px !important;
  font-weight: 800 !important;
  background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,0.85) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: drop-shadow(0 4px 24px rgba(0, 0, 0, 0.55))
          drop-shadow(0 0 40px rgba(130, 220, 180, 0.25));
  animation: titleFloat 6s ease-in-out infinite alternate;
}

.page-home #header-title #subtitle-wrap {
  margin-top: 0.5rem;
}

/* 副标题打字机：柔光 + 更轻盈（合并 base + 精修） */
.page-home #header-title #subtitle,
.page-home #header-title #subtitle span {
  font-size: 1.25rem !important;
  letter-spacing: 2px !important;
  color: rgba(255, 255, 255, 0.92) !important;
  text-shadow:
    0 2px 14px rgba(0, 0, 0, 0.55),
    0 0 24px rgba(130, 220, 180, 0.3) !important;
}

/* 首屏渐出遮罩：底部过渡到正文区，不生硬 */
.page-home #header::before {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 180px;
  background: linear-gradient(180deg, transparent, rgba(13, 17, 23, 0.75));
  pointer-events: none;
  z-index: 2;
}

/* 向下箭头 + 发光（合并 base + 精修） */
.page-home #header::after {
  content: '';
  position: absolute;
  bottom: 32px;
  left: 50%;
  width: 18px;
  height: 18px;
  border-right: 2.5px solid rgba(255, 255, 255, 0.75);
  border-bottom: 2.5px solid rgba(255, 255, 255, 0.75);
  transform: translateX(-50%) rotate(45deg);
  animation: scrollArrow 1.5s ease-in-out infinite;
  z-index: 3;
  pointer-events: none;
  box-shadow: 0 0 18px var(--accent-glow);
}

/* ========================================
   隐藏/替换所有太极图标
   ======================================== */

/* 导航菜单太极图标 → 隐藏 */
.main-nav-icon {
  display: none !important;
}

/* 侧边栏菜单太极图标 → 隐藏 */
.sidebar-menu-icon {
  display: none !important;
}

/* 页脚太极分隔符 → 用竖线代替 */
.footer-info-sep {
  background: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  width: auto !important;
  height: auto !important;
  animation: none !important;
}
.footer-info-sep::before {
  content: '|';
  margin: 0 6px;
}

/* 回到顶部按钮太极 → 箭头 */
.sidebar-top-taichi {
  display: none !important;
}
.sidebar-top .arrow-up {
  display: block !important;
}

/* 预加载太极图标 → 简洁 spinner */
.loading-taichi svg {
  display: none !important;
}
.loading-taichi::after {
  content: '';
  display: block;
  width: 40px;
  height: 40px;
  border: 3px solid rgba(255, 255, 255, 0.2);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

/* ========================================
   顶栏：去背景，菜单靠右
   ======================================== */

/* 导航条去掉背景和阴影 */
#header-nav {
  background: transparent !important;
  box-shadow: none !important;
}

/* 导航菜单靠右 */
#main-nav {
  justify-content: flex-end !important;
  width: 100%;
  padding-right: 20px;
}

/* 链接白色（在 banner 图上） */
.page-home #main-nav .main-nav-link {
  color: rgba(255, 255, 255, 0.9) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.page-home #main-nav .main-nav-link-wrap:hover .main-nav-link {
  color: #fff !important;
}

/* RSS 按钮也靠右，白色 */
.page-home #sub-nav .nav-icon {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* 导航栏：首页时加底部渐变分隔 */
.page-home #header-nav::after {
  content: '';
  position: absolute;
  left: 10%; right: 10%; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  pointer-events: none;
}

/* ========================================
   全站强制暗色：不给 light mode 留位置
   ======================================== */

/* 锁死 data-theme=dark，禁止切回 light */
:root:not([data-theme="dark"]) { color-scheme: dark; }

/* 隐藏主题切换按钮（太阳/月亮/半圆） */
.dark-mode-btn,
#nav-sun-btn,
#nav-moon-btn,
#nav-circle-half-stroke-btn {
  display: none !important;
}

/* 即便主题临时把 data-theme 清掉，也强制暗色基调 */
body {
  background-color: #0d1117 !important;
  color: var(--text-1) !important;
}

/* 导航栏链接色 */
.main-nav-link {
  color: rgba(230, 237, 243, 0.9) !important;
}

.main-nav-link-wrap:hover .main-nav-link {
  color: var(--accent) !important;
}

/* ========================================
   背景分层：底图 + 渐晕 + 粒子画布
   ======================================== */

/* 第 1 层：底图 — 全屏 cover，按视口宽度走分级 */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: url('/images/banner-v3-1920.webp') center 30% / cover no-repeat;
  z-index: -3;
  transform: translateZ(0);
  filter: saturate(112%) contrast(102%);
}
@media (min-width: 1600px) {
  body::before { background-image: url('/images/banner-v3-2560.webp'); }
}
@media (min-width: 2400px) {
  body::before { background-image: url('/images/banner-v3-3840.webp'); }
}
/* Retina 屏（DPR ≥ 2）按等效像素再上调一档 */
@media (min-width: 800px) and (-webkit-min-device-pixel-ratio: 2),
       (min-width: 800px) and (min-resolution: 2dppx) {
  body::before { background-image: url('/images/banner-v3-2560.webp'); }
}
@media (min-width: 1280px) and (-webkit-min-device-pixel-ratio: 2),
       (min-width: 1280px) and (min-resolution: 2dppx) {
  body::before { background-image: url('/images/banner-v3-3840.webp'); }
}
/* 移动端用低档 */
@media (max-width: 799px) {
  body::before { background-image: url('/images/banner-v3-1280.webp'); }
}

/* 第 2 层：暗角 + 粉色晕染 */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -2;
  background:
    radial-gradient(ellipse 80% 100% at 30% 20%,
      rgba(255, 200, 220, 0.14),
      transparent 65%),
    radial-gradient(ellipse 120% 110% at 50% 45%,
      transparent 40%,
      rgba(0, 10, 18, 0.42) 85%,
      rgba(0, 6, 12, 0.70) 100%);
  opacity: 0.92;
}

/* 第 3 层：canvas 粒子（落叶 / 光点），JS 注入 */
#bg-particles {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}

/* 主体容器透明 */
body,
#container,
#wrap,
#content {
  background: transparent !important;
}

/* ========================================
   全站字体：霞鹜文楷
   ======================================== */
body,
.post-title,
.post-article,
.post-meta,
.sidebar-menu-link,
.sidebar-author-name,
.sidebar-description,
.widget-title,
#header-title h1,
#subtitle,
#subtitle span,
#footer-info,
.main-nav-link {
  font-family: 'LXGW WenKai Lite', 'LXGW WenKai Light', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}
