/* 平行智测 · 全站主题层 v2（大厂视觉体系，注入所有 HTML 页面）
   设计原则：中性色阶带品牌色温 / 暗色三层背景层级 / 双层柔影 / 毛玻璃导航 / 微交互过渡
   规则均带 !important 覆盖各页面内联/页内样式；彩色图标与渐变按钮保留为主题色锚点。 */

/* ================= 设计令牌 ================= */
:root {
  /* 亮色：柔和冷灰阶（带品牌紫色温） */
  --pz-bg: #F5F6F8;
  --pz-bg-2: #EDEFF3;
  --pz-surface: #FFFFFF;
  --pz-surface-2: #F2F4F8;
  --pz-text: #1F2430;
  --pz-text-2: #5C6470;
  --pz-text-3: #8A92A0;
  --pz-border: rgba(31, 36, 48, .08);
  --pz-border-strong: rgba(31, 36, 48, .14);
  --pz-shadow-1: 0 1px 2px rgba(23, 28, 45, .04), 0 4px 16px rgba(23, 28, 45, .05);
  --pz-shadow-2: 0 2px 4px rgba(23, 28, 45, .05), 0 12px 32px rgba(23, 28, 45, .09);
  --pz-ring: 0 0 0 3px rgba(109, 90, 230, .22);
  --pz-radius: 14px;
  color-scheme: light;
}

html.dark {
  /* 暗色：深蓝黑三层级（bg → surface → elevated） */
  --pz-bg: #0D1220;
  --pz-bg-2: #0A0E1A;
  --pz-surface: #161D31;
  --pz-surface-2: #1E2740;
  --pz-text: #E8ECF5;
  --pz-text-2: #9AA4BC;
  --pz-text-3: #6B7690;
  --pz-border: rgba(255, 255, 255, .08);
  --pz-border-strong: rgba(255, 255, 255, .14);
  --pz-shadow-1: 0 1px 2px rgba(0, 0, 0, .3), 0 6px 20px rgba(0, 0, 0, .35);
  --pz-shadow-2: 0 2px 6px rgba(0, 0, 0, .4), 0 16px 40px rgba(0, 0, 0, .5);
  --pz-ring: 0 0 0 3px rgba(139, 124, 246, .3);
  color-scheme: dark;
}

/* ================= 全局基础 ================= */
body {
  background: var(--pz-bg) !important;
  color: var(--pz-text) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background-color .35s cubic-bezier(.4, 0, .2, 1), color .35s cubic-bezier(.4, 0, .2, 1);
}
::selection { background: rgba(109, 90, 230, .22); }

/* 规范焦点态（键盘可达性，大厂细节） */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: none !important;
  box-shadow: var(--pz-ring) !important;
}

/* 精细滚动条 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(120, 128, 148, .32);
  border-radius: 8px;
  border: 3px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background-color: rgba(120, 128, 148, .5); }
html.dark ::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, .16); }
html.dark ::-webkit-scrollbar-thumb:hover { background-color: rgba(255, 255, 255, .28); }

/* ================= 面板系统 ================= */
.test-card, .feature-card, .topic-card, .faq-item, .result-card, .report-card,
.dimension-card, .advice-card, .scene-card, .combo-card, .level-card,
.stat-card, .info-card, .cp-card, .record-card {
  border-radius: var(--pz-radius) !important;
  border: 1px solid var(--pz-border) !important;
  box-shadow: var(--pz-shadow-1) !important;
  transition: transform .25s cubic-bezier(.4, 0, .2, 1), box-shadow .25s cubic-bezier(.4, 0, .2, 1),
              border-color .25s ease, background-color .35s ease;
}
.test-card:hover, .feature-card:hover, .topic-card:hover, .record-card:hover {
  box-shadow: var(--pz-shadow-2) !important;
  border-color: var(--pz-border-strong) !important;
}

/* ================= 导航：毛玻璃 ================= */
.nav, .navbar, header.nav, .site-header, .top-nav, .detail-nav {
  background: rgba(255, 255, 255, .78) !important;
  -webkit-backdrop-filter: saturate(1.6) blur(16px);
  backdrop-filter: saturate(1.6) blur(16px);
  border-bottom: 1px solid var(--pz-border) !important;
}
html.dark .nav, html.dark .navbar, html.dark header.nav,
html.dark .site-header, html.dark .top-nav, html.dark .detail-nav {
  background: rgba(13, 18, 32, .72) !important;
}

/* ================= 暗色面板 ================= */
html.dark .test-card, html.dark .feature-card, html.dark .topic-card,
html.dark .faq-item, html.dark .result-card, html.dark .report-card,
html.dark .dimension-card, html.dark .advice-card, html.dark .scene-card,
html.dark .combo-card, html.dark .level-card, html.dark .stat-card,
html.dark .info-card, html.dark .cp-card, html.dark .record-card {
  background:
    linear-gradient(160deg, rgba(255, 255, 255, .045) 0%, rgba(255, 255, 255, .012) 100%) ,
    var(--pz-surface) !important;
  border-color: var(--pz-border) !important;
  box-shadow: var(--pz-shadow-1) !important;
}

/* 文字层级 */
html.dark h1, html.dark h2, html.dark h3, html.dark h4,
html.dark .test-title, html.dark .section-title, html.dark .stat-value,
html.dark .result-title, html.dark .report-title, html.dark .hero h1, html.dark .hero p {
  color: var(--pz-text) !important;
}
html.dark p, html.dark li, html.dark .test-desc, html.dark .feature-desc,
html.dark .stat-label, html.dark .test-meta, html.dark .faq-q, html.dark .faq-a,
html.dark td, html.dark th, html.dark label, html.dark small, html.dark span {
  color: var(--pz-text-2);
}

/* 按钮：彩色渐变保留（微降饱和）；浅底按钮换深面板 */
html.dark .btn-test, html.dark .btn, html.dark .btn-primary {
  filter: brightness(.94) saturate(.94);
}
html.dark .btn-secondary, html.dark .btn-ghost, html.dark .btn-outline {
  background: var(--pz-surface-2) !important;
  color: var(--pz-text) !important;
  border-color: var(--pz-border-strong) !important;
}

/* 表单控件 */
html.dark input, html.dark textarea, html.dark select {
  background: var(--pz-surface-2) !important;
  color: var(--pz-text) !important;
  border-color: var(--pz-border-strong) !important;
  border-radius: 10px;
}
html.dark input::placeholder, html.dark textarea::placeholder { color: var(--pz-text-3) !important; }

/* 表格 */
html.dark table { background: transparent !important; }
html.dark tr { border-color: var(--pz-border) !important; }
html.dark thead th { background: var(--pz-surface-2) !important; color: var(--pz-text) !important; }

/* 图片柔和降亮 */
html.dark img { filter: brightness(.9) saturate(.96); }

html.dark hr { border-color: var(--pz-border) !important; }

/* ================= 明暗开关 FAB（大厂精修） ================= */
#pz-theme-fab {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 99990;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--pz-border-strong);
  background: rgba(255, 255, 255, .82);
  -webkit-backdrop-filter: saturate(1.6) blur(14px);
  backdrop-filter: saturate(1.6) blur(14px);
  box-shadow: var(--pz-shadow-1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
  color: #4A5370;
  transition: transform .2s cubic-bezier(.4, 0, .2, 1), box-shadow .2s ease,
              background-color .35s ease, color .35s ease;
  -webkit-tap-highlight-color: transparent;
}
#pz-theme-fab:hover { transform: scale(1.06); box-shadow: var(--pz-shadow-2); }
#pz-theme-fab:active { transform: scale(.94); }
#pz-theme-fab .ri-sun-line { display: none; }
#pz-theme-fab.is-dark {
  background: rgba(30, 39, 64, .85);
  color: #F0C64A;
  border-color: rgba(255, 255, 255, .16);
}
#pz-theme-fab.is-dark .ri-moon-line { display: none; }
#pz-theme-fab.is-dark .ri-sun-line { display: inline-block; }
@media (max-width: 640px) {
  #pz-theme-fab { right: 14px; bottom: 14px; width: 42px; height: 42px; font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  #pz-theme-fab, .test-card, .feature-card, .topic-card { transition: none; }
  #pz-theme-fab:hover { transform: none; }
}
