/*  apple-header-overrides.css — Phase3 首屏导航壳（已抽离 Command Palette）
 * 源归档：archive/header-css-phase3-sources/apple-header-overrides.css
 * 生成：scripts/split-header-cmd-css.mjs（2026-07-24）
 * 重生成：node scripts/split-header-cmd-css.mjs
 * 暗黑双分支 / 833·834 断点保持源语义；禁止手改 .min.*
  *//* ============================================================
   Apple Style 视觉升级覆盖层 (apple-header-overrides.css)
   ----------------------------------------------------------
   设计哲学：Apple 官网极简高级感
   - 纯黑深邃暗黑模式 (#000000 / #1C1C1E)
   - 丝滑白亮色模式 (#FFFFFF / #F5F5F7)
   - 珊瑚色品牌点缀（通过 --husir-coral-* 公共模块统一调用）
   - 全局色彩平滑过渡
   - 系统级字体栈 + 负字距排版
   - 极致呼吸感与微特效

   本文件通过层级覆盖 modern-header.css，
   不修改原文件，确保未来系统升级无缝兼容。
   ============================================================ */

/* ----- 一、全局排版与字体栈覆盖 ----- */
.modern-header {
  /* Apple 系统字体栈 */
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
    "Helvetica Neue", "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei",
    Roboto, Arial, sans-serif;
  font-feature-settings: "kern" 1, "liga" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;

  /* 色彩过渡：亮暗切换时全属性平滑过渡 */
  transition:
    background-color 0.5s ease,
    color 0.5s ease,
    border-color 0.5s ease,
    box-shadow 0.5s ease,
    width 0.6s var(--mh-ease-spring),
    max-width 0.6s var(--mh-ease-spring),
    border-radius 0.6s var(--mh-ease-spring),
    margin-top 0.6s var(--mh-ease-spring);
}

/* ----- 二、珊瑚色文字选中态（::selection）----- */
::selection {
  background: var(--husir-coral-strong, rgba(255, 107, 107, 0.2));
  color: var(--husir-coral, #ff6b6b);
}

::-moz-selection {
  background: var(--husir-coral-strong, rgba(255, 107, 107, 0.2));
  color: var(--husir-coral, #ff6b6b);
}

/* Header 内部选中态也保持珊瑚色 */
.modern-header ::selection {
  background: var(--husir-coral-strong, rgba(255, 107, 107, 0.2));
  color: var(--husir-coral, #ff6b6b);
}

/* ----- 三、Apple 色彩变量（引用 dark-mode-core.css 全局 --dm-* 变量）-----
   所有语义色变量引用 --dm-* 全局变量，
   暗黑模式切换时由 dark-mode-core.css 统一控制，本文件无需额外 @media 规则。 */
.modern-header {
  /* 一级底色：引用全局毛玻璃变量 */
  --mh-bg: var(--dm-glass);
  --mh-bg-scrolled: var(--dm-glass-scrolled);
  --mh-pill-bg: var(--dm-glass-pill);

  /* 主要文字 */
  --mh-text: var(--dm-text);
  /* 次要文字 */
  --mh-text-muted: var(--dm-text-secondary);
  --mh-text-soft: var(--dm-text-secondary);

  /* 珊瑚色品牌点缀 */
  --mh-accent: var(--husir-coral, var(--dm-accent, #ff6b6b));
  --mh-accent-glow: var(--husir-coral-glow, var(--dm-accent-glow, rgba(255, 107, 107, 0.15)));
  --mh-accent-strong: var(--husir-coral-strong, var(--dm-accent-strong, rgba(255, 107, 107, 0.18)));

  /* 边框与阴影 */
  --mh-border: var(--dm-border);
  --mh-pill-border: var(--dm-border);
  --mh-pill-border-active: var(--husir-coral-soft, var(--dm-accent-soft, rgba(255, 107, 107, 0.12)));
  --mh-hover: var(--dm-border);
  --mh-shadow: var(--dm-shadow-sm);
  --mh-shadow-pill: 0 0.5px 0 var(--dm-border),
    0 2px 6px rgba(0, 0, 0, 0.03),
    0 12px 32px rgba(0, 0, 0, 0.04);
  --mh-shadow-heavy: var(--dm-shadow-lg);
  /* 底部分割线与芯片背景 */
  --mh-divider: var(--dm-border);
  --mh-chip-bg: var(--dm-glass-pill);

  /* Mega Menu */
  --mh-mega-bg: var(--dm-overlay);
  --mh-mega-border: var(--dm-border);
  --mh-mega-shadow: var(--dm-shadow-md);

  /* Command Palette */
  --mh-command-bg: var(--dm-overlay);
  --mh-command-backdrop: var(--dm-backdrop);
  --mh-command-border: var(--dm-border);
  --mh-command-shadow: var(--dm-shadow-lg);
}

/*
  暗黑模式已迁移至 dark-mode-core.css 统一控制。
  --mh-* 变量通过引用 --dm-* 全局变量，自动跟随亮暗切换。
*/

/* ----- 四、导航链接 Apple 排版强化 ----- */
.mh-nav-link {
  font-family: inherit;
  font-weight: 550;
  letter-spacing: -0.01em;
  line-height: 1.3;
  transition:
    color 0.3s ease,
    background 0.3s ease,
    transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
}

/* 悬停时珊瑚色过渡（非激活态） */
@media (hover: hover) {
  .mh-nav-link:hover:not(.on):not(.active) {
    color: var(--mh-accent);
  }
}

/* 导航菜单激活态：珊瑚色高亮 */
.mh-nav-link.on,
.mh-nav-link.active,
.mh-nav-item.on > .mh-nav-link,
.mh-nav-item.active > .mh-nav-link {
  color: var(--mh-accent);
  font-weight: 600;
}

/* 进度条珊瑚色渐变 */
.mh-scroll-progress {
  background: linear-gradient(90deg,
    var(--mh-accent) 0%,
    color-mix(in srgb, var(--mh-accent) 72%, #ffffff 28%) 35%,
    color-mix(in srgb, var(--mh-accent) 52%, #ffffff 48%) 65%,
    var(--mh-accent) 100%);
  background-size: 200% 100%;
  box-shadow: 0 0 10px color-mix(in srgb, var(--mh-accent) 30%, transparent),
    0 0 3px color-mix(in srgb, var(--mh-accent) 20%, transparent);
}

/* ----- 五、Mega Menu 卡片 Apple 圆角与阴影 ----- */
.mh-mega-inner {
  border-radius: 24px;
  border: 0.5px solid var(--mh-mega-border);
  box-shadow: var(--mh-mega-shadow);
}

.mh-mega-card {
  border-radius: 18px;
  border-left: 2px solid transparent;
  transition:
    background 0.3s ease,
    transform 0.35s cubic-bezier(0.25, 1, 0.5, 1),
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    opacity 0.35s ease;
}

.mh-mega-card:hover {
  border-left-color: var(--mh-accent);
  background: color-mix(in srgb, var(--mh-accent) 4%, transparent);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.mh-mega-card-icon {
  background: color-mix(in srgb, var(--mh-accent) 8%, transparent);
  color: var(--mh-accent);
  border-radius: 14px;
}

.mh-mega-card:hover .mh-mega-card-icon {
  background: color-mix(in srgb, var(--mh-accent) 14%, transparent);
}

/* Mega 背景装饰光晕 */
.mh-mega-inner::after {
  background: radial-gradient(circle,
    color-mix(in srgb, var(--mh-accent) 5%, transparent) 0%,
    transparent 70%);
}

/* Mega Footer 链接 */
.mh-mega-footer-link {
  color: var(--mh-accent);
  font-weight: 550;
}

/* ----- 六、Action 按钮 Apple 风格 ----- */
.mh-action-btn {
  font-family: inherit;
  border-radius: 980px;
  transition:
    color 0.25s ease,
    background 0.25s ease,
    transform 0.3s cubic-bezier(0.25, 1, 0.5, 1),
    box-shadow 0.25s ease;
}

@media (hover: hover) {
  .mh-action-btn:hover {
    color: var(--mh-accent);
    background: color-mix(in srgb, var(--mh-accent) 6%, transparent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mh-accent) 10%, transparent);
  }
}

/* KBD 提示 Apple 风格 */
.mh-kbd-hint {
  border-color: var(--mh-command-border);
  background: var(--mh-chip-bg);
  border-radius: 6px;
  font-family: -apple-system, BlinkMacSystemFont, "SF Mono", ui-monospace, monospace;
}

.mh-search-btn:hover .mh-kbd-hint {
  color: var(--mh-accent);
  border-color: color-mix(in srgb, var(--mh-accent) 15%, transparent);
  background: color-mix(in srgb, var(--mh-accent) 6%, transparent);
}

/* ----- 八、Apple 暗黑模式（Dark Mode）-----
   暗黑模式已迁移至 dark-mode-core.css 统一控制。
   ---------------------------------------------------------- */

/* ----- 九、旧版 md-head 彻底隐藏（保留 DOM 兼容）----- */
.md-head {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Mega 卡片标题 */
.mh-mega-card-title {
  font-family: inherit;
  font-weight: 580;
  letter-spacing: -0.008em;
}

/* Mega 卡片描述：紧凑呼吸感 */
.mh-mega-card-desc {
  font-family: inherit;
  line-height: 1.45;
  letter-spacing: 0;
}

/* 导航菜单内层：Apple pill 背景 */
.mh-nav-menu {
  background: var(--mh-chip-bg);
  box-shadow: inset 0 0.5px 1px rgba(0, 0, 0, 0.025);
}

/* ----- 十一、富文本暗黑模式降维初始化 ----- */
/* 暗黑模式已迁移至 dark-mode-core.css 统一控制 */

/* ----- 十二、减弱动画偏好 ----- */
@media (prefers-reduced-motion: reduce) {
  .modern-header,
  .modern-header *,
  .modern-header *::before,
  .modern-header *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}