/* SeqMatrix Warm Theme v1.0 — 温馨吸睛美化层
 * 覆盖原有冷色调，增加暖色渐变 + 微交互 + 入场动画
 * 引入方式：在 ui-unify.css 后引入 static/warm-theme.css
 * 设计原则：不破坏原有功能，只做视觉增强
 */

/* ========== 暖色变量覆盖 ========== */
:root {
  /* 主色：深蓝→靛蓝（更柔和温暖） */
  --primary: #4F46E5;
  --primary-dim: #6366F1;
  --primary-light: #EEF2FF;

  /* 辅色：深紫→柔紫 */
  --accent: #7C3AED;
  --accent-light: #F5F3FF;

  /* 暖色点缀 */
  --warm-1: #F97316;      /* 暖橙 */
  --warm-2: #EC4899;      /* 柔粉 */
  --warm-3: #F59E0B;      /* 金黄 */
  --warm-glow: rgba(236, 72, 153, 0.08);

  /* 背景：纯白→暖白 */
  --bg-0: #FEFCFB;
  --bg-1: #FDF8F6;
  --bg-2: #FAF3F0;
  --bg-3: #F3EAE5;

  /* 阴影：冷灰→暖紫 */
  --shadow-sm: 0 1px 3px rgba(79,70,229,0.06), 0 1px 2px rgba(236,72,153,0.04);
  --shadow-md: 0 4px 16px rgba(79,70,229,0.08), 0 2px 6px rgba(236,72,153,0.05);
  --shadow-lg: 0 16px 40px rgba(79,70,229,0.10), 0 4px 12px rgba(236,72,153,0.06);
  --shadow-glow: 0 8px 30px rgba(124,58,237,0.15), 0 4px 12px rgba(236,72,153,0.10);

  /* 渐变（暖色系） */
  --grad-primary: linear-gradient(135deg, #4F46E5 0%, #7C3AED 50%, #EC4899 100%);
  --grad-accent: linear-gradient(135deg, #7C3AED 0%, #EC4899 100%);
  --grad-warm: linear-gradient(135deg, #F97316 0%, #EC4899 100%);
  --grad-bg: linear-gradient(180deg, #FDF8F6 0%, #FEFCFB 60%);
  --grad-hero: linear-gradient(135deg, #4F46E5 0%, #7C3AED 30%, #EC4899 70%, #F97316 100%);

  /* 圆角增大（更友好） */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 36px;
}

/* ========== 背景装饰增强 ========== */
.bg-orb {
  filter: blur(80px);
  opacity: 0.12;
  animation: float 22s ease-in-out infinite;
}
.bg-orb.o1 { background: #7C3AED; }
.bg-orb.o2 { background: #4F46E5; }
.bg-orb.o3 { background: #EC4899; opacity: 0.08; }

/* ========== 卡片暖色增强 ========== */
.uni-item, .card, .search-card, .hero-badge,
[data-style*="card"], .panel {
  border: 1px solid rgba(79,70,229,0.08) !important;
  box-shadow: var(--shadow-sm) !important;
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1), box-shadow 0.3s ease !important;
}
.uni-item:hover, .card:hover, .search-card:hover,
[data-style*="card"]:hover, .panel:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: rgba(124,58,237,0.15) !important;
}

/* ========== 按钮暖色增强 ========== */
.btn-primary, button[style*="grad-primary"], a[style*="grad-primary"],
.btn, .cta-btn {
  background: var(--grad-primary) !important;
  box-shadow: 0 4px 14px rgba(79,70,229,0.25) !important;
  transition: transform 0.2s cubic-bezier(0.4,0,0.2,1), box-shadow 0.2s ease !important;
}
.btn-primary:hover, .btn:hover, .cta-btn:hover,
button[style*="grad-primary"]:hover, a[style*="grad-primary"]:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 8px 24px rgba(124,58,237,0.30) !important;
}

/* ========== Hero 区域增强 ========== */
.hero h1 {
  background: var(--grad-hero) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
.hero-badge {
  background: linear-gradient(135deg, rgba(236,72,153,0.06), rgba(79,70,229,0.06)) !important;
  border-color: rgba(236,72,153,0.15) !important;
}
.hero-badge .dot {
  background: var(--warm-2) !important;
  box-shadow: 0 0 0 4px rgba(236,72,153,0.15) !important;
}
.hero-stat .v {
  background: var(--grad-primary) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ========== 导航栏暖色毛玻璃 ========== */
header, nav, .nav-bar, .header {
  background: rgba(254,252,251,0.85) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-bottom: 1px solid rgba(79,70,229,0.06) !important;
}

/* ========== 链接 hover 暖色 ========== */
a:hover {
  color: var(--accent) !important;
  transition: color 0.2s ease !important;
}

/* ========== 表格行 hover ========== */
tr:hover, tbody tr:hover {
  background: rgba(124,58,237,0.03) !important;
  transition: background 0.2s ease !important;
}

/* ========== 入场动画 ========== */
@keyframes warmFadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes warmSlideIn {
  from { opacity: 0; transform: translateX(-20px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes warmScaleIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

/* 应用入场动画到关键元素 */
.hero > * { animation: warmFadeInUp 0.6s cubic-bezier(0.4,0,0.2,1) both; }
.hero > *:nth-child(1) { animation-delay: 0s; }
.hero > *:nth-child(2) { animation-delay: 0.1s; }
.hero > *:nth-child(3) { animation-delay: 0.2s; }
.hero > *:nth-child(4) { animation-delay: 0.3s; }
.hero > *:nth-child(5) { animation-delay: 0.4s; }

section { animation: warmFadeInUp 0.5s cubic-bezier(0.4,0,0.2,1) both; }
section:nth-child(2) { animation-delay: 0.1s; }
section:nth-child(3) { animation-delay: 0.2s; }
section:nth-child(4) { animation-delay: 0.3s; }

/* ========== 标签/徽章暖色 ========== */
.tag, .badge, .lvl-211, .lvl-pub, .lvl-uni {
  border-radius: 999px !important;
  font-weight: 600 !important;
}

/* ========== 搜索框暖色 ========== */
input[type="text"], input[type="search"], input[type="email"],
input[type="password"], select, textarea {
  border: 1px solid rgba(79,70,229,0.12) !important;
  border-radius: var(--radius-sm) !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--primary-dim) !important;
  box-shadow: 0 0 0 4px rgba(99,102,241,0.10) !important;
  outline: none !important;
}

/* ========== 统计数字暖色渐变 ========== */
.stat-num, .hero-stat .v, .summary-cell .v, .data-item .n {
  background: var(--grad-primary) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-weight: 900 !important;
}

/* ========== 滚动条美化 ========== */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg-1); }
::-webkit-scrollbar-thumb {
  background: var(--grad-primary);
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

/* ========== 选中文本暖色 ========== */
::selection {
  background: rgba(236,72,153,0.15) !important;
  color: var(--accent) !important;
}

/* ========== 移动端增强 ========== */
@media (max-width: 768px) {
  :root {
    --radius-md: 12px;
    --radius-lg: 18px;
  }
  .hero h1 {
    font-size: clamp(36px, 10vw, 56px) !important;
    letter-spacing: -1px !important;
  }
}


/* ============================================================
 * SeqMatrix V2 视觉升级补丁（2026-08-17）
 * 修复全站"看不清"问题：统计数字 / 标题对比度 / 激活态弱 / 字号偏小
 * 设计原则：仅在 warm-theme.css 后追加，覆盖 !important 规则
 * 影响范围：所有引用 warm-theme.css 的 50 个 HTML 页面
 * ============================================================ */

/* ========== 1. 统计数字看不清（核心修复） ==========
 * 原因：warm-theme.css 把 .v 强制 -webkit-text-fill-color: transparent
 *       渐变文字在彩色背景上反差极低
 * 修复：去掉渐变 clip，恢复纯白字 + 锐利单层阴影
 */
.summary-cell .v,
.summary-strip .v,
.summary-strip .v *,
.stat-num,
.hero-stat .v,
.data-item .n {
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  color: #FFFFFF !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.28), 0 1px 2px rgba(0,0,0,.18) !important;
  font-weight: 900 !important;
  letter-spacing: -0.5px !important;
}

/* 当统计数字在白底卡片上（非渐变背景）时，恢复彩色字 */
.card .stat-num,
.card .data-item .n,
.uni-item .stat-num,
[data-style*="card"] .stat-num {
  background: var(--grad-primary) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  text-shadow: none !important;
}

/* ========== 2. 统计卡标签可读性 ========== */
.summary-cell .l,
.summary-strip .l {
  color: rgba(255,255,255,.95) !important;
  font-weight: 600 !important;
  letter-spacing: .5px !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.2) !important;
}

/* ========== 3. 主标题渐变对比度（更深更饱和） ========== */
.hero h1,
.page-head h1 .gradient,
h1 .gradient,
.hero-title {
  background: linear-gradient(135deg, #1E3A8A 0%, #6D28D9 60%, #BE185D 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  letter-spacing: -1.5px !important;
}

/* ========== 4. 导航激活态（实色渐变 + 阴影） ========== */
.nav-menu a.active,
header nav a.active,
.nav a.active {
  background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%) !important;
  color: #FFFFFF !important;
  box-shadow: 0 4px 14px rgba(79,70,229,.32) !important;
  font-weight: 700 !important;
}

/* ========== 5. 导航菜单字号字重 ========== */
.nav-menu a,
header nav a:not(.brand):not(.btn):not(.nav-cta *),
.nav-bar a {
  font-size: 15px !important;
  font-weight: 600 !important;
  transition: all .2s ease !important;
}
.nav-menu a:hover:not(.active),
header nav a:hover:not(.active) {
  color: var(--text-0) !important;
  background: var(--bg-2) !important;
}

/* ========== 6. 分类/筛选 tab 激活态 ========== */
.filter-tab.active,
.tab.active,
.tab-bar a.active,
.prov.active {
  background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%) !important;
  color: #FFFFFF !important;
  border-color: transparent !important;
  box-shadow: 0 4px 14px rgba(79,70,229,.28) !important;
  font-weight: 700 !important;
}

/* ========== 7. 卡片标题加粗 ========== */
.tool-info h3,
.uni-item h3,
.uni-item h4,
.card h3,
.card h4,
.feature-card h3,
.feature-card h4,
.section-title {
  font-weight: 800 !important;
  letter-spacing: -0.3px !important;
  color: var(--text-0) !important;
}

/* ========== 8. 章节小标题 ========== */
h2, .section-title {
  font-weight: 800 !important;
  letter-spacing: -0.5px !important;
  color: var(--text-0) !important;
}

/* ========== 9. 背景球降低透明度（不抢前景） ========== */
.bg-orb { opacity: 0.08 !important; }
.bg-orb.o1 { opacity: 0.08 !important; }
.bg-orb.o2 { opacity: 0.10 !important; }
.bg-orb.o3 { opacity: 0.06 !important; }

/* ========== 10. 按钮增强（保留暖色，加阴影） ========== */
.btn-primary,
.btn.btn-primary,
.cta-btn,
button[style*="grad-primary"],
a[style*="grad-primary"] {
  background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%) !important;
  box-shadow: 0 4px 14px rgba(79,70,229,.32) !important;
  font-weight: 700 !important;
}
.btn-primary:hover,
.btn.btn-primary:hover,
.cta-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(124,58,237,.40) !important;
}

/* ========== 11. eyebrow / 徽章 ========== */
.eyebrow,
.hero-badge {
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
}

/* ========== 12. 表格行 hover 改为渐变描边 ========== */
tbody tr:hover,
.uni-item:hover,
.card:hover {
  border-color: rgba(124,58,237,.18) !important;
  background: rgba(124,58,237,.02) !important;
}

/* ========== 13. 暗色模式兼容 ========== */
[data-theme="dark"] .summary-cell .v,
[data-theme="dark"] .summary-strip .v,
[data-theme="dark"] .stat-num,
[data-theme="dark"] .hero-stat .v {
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.5) !important;
}

[data-theme="dark"] .card .stat-num,
[data-theme="dark"] [data-style*="card"] .stat-num {
  background: linear-gradient(135deg, #60A5FA 0%, #A78BFA 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

[data-theme="dark"] .nav-menu a.active,
[data-theme="dark"] header nav a.active {
  background: linear-gradient(135deg, #60A5FA 0%, #A78BFA 100%) !important;
  color: #0F172A !important;
}

[data-theme="dark"] .filter-tab.active,
[data-theme="dark"] .tab.active {
  background: linear-gradient(135deg, #60A5FA 0%, #A78BFA 100%) !important;
  color: #0F172A !important;
}

[data-theme="dark"] .tool-info h3,
[data-theme="dark"] .uni-item h3,
[data-theme="dark"] .card h3,
[data-theme="dark"] h2,
[data-theme="dark"] .section-title {
  color: var(--text-0) !important;
}

/* ========== 14. 移动端微调 ========== */
@media (max-width: 768px) {
  .summary-cell .v,
  .summary-strip .v {
    font-size: 32px !important;
    font-weight: 900 !important;
  }
  .nav-menu a,
  header nav a:not(.brand):not(.btn) {
    font-size: 14px !important;
  }
}

/* ========== V2 升级补丁 END ========== */
