:root{ 
  --bg:#0B1020;
  --surface:#12172A;
  --surface-2:#171C30;
  --text:#E8EBFF;
  --text-muted:#B9BFE7;
  --brand:#6A5AF9;
  --brand-600:#5A49F6;
  --border:rgba(255,255,255,.08);
  --shadow:0 10px 30px rgba(0,0,0,.45);
  --header-h:64px;
}

html,body{background:var(--bg);color:var(--text);color-scheme:dark;}
* {box-sizing:border-box;}
a{color:var(--brand);} a:hover{color:var(--brand-600);}

.btn-primary{background:var(--brand);border:1px solid var(--brand-600);color:#fff;}
.btn-primary:hover{background:var(--brand-600);}
.btn-secondary{background:var(--surface-2);border:1px solid var(--border);color:var(--text);}
.btn-secondary:hover{background:#1C2240;}

.card,.panel,.box,.feature-card,.pricing-card,.faq-item,.form-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:var(--shadow);
  color:var(--text);
}
.card-ghost{background:var(--surface-2);border:1px solid var(--border);color:var(--text);}

.pricing-card.is-popular{
  outline:2px solid var(--brand);
  box-shadow:0 0 0 6px rgba(106,90,249,.15), var(--shadow);
}

/* Header 深色半透明 + 毛玻璃 */
.site-header, header.site-header{
  position:sticky; top:0; z-index:1000;
  height:var(--header-h);
  background:rgba(11,16,32,.85);
  backdrop-filter:saturate(150%) blur(10px);
  -webkit-backdrop-filter:saturate(150%) blur(10px);
  border-bottom:1px solid var(--border);
}
.site-header .container{
  max-width:1200px; margin:0 auto; padding:0 20px;
  height:100%;
  display:flex; align-items:center; gap:24px;
}
.site-header .brand{display:flex; align-items:center; gap:10px; color:var(--text); text-decoration:none; white-space:nowrap;}
.site-header .brand img{height:28px; width:auto;}

.site-header .nav-toggle{
  display:none; margin-left:auto;
  background:transparent; color:var(--text);
  border:1px solid var(--border); border-radius:8px; padding:6px 10px;
}

/* 关键：主导航 + 右侧操作分区 */
.site-header nav.nav{
  display:flex; align-items:center; gap:24px; margin-left:auto;
}
.site-header .nav-main{
  display:flex; gap:16px; list-style:none; margin:0; padding:0;
}
.site-header .nav-main .nav-link{
  color:var(--text-muted); text-decoration:none; padding:8px 6px; border-bottom:2px solid transparent;
}
.site-header .nav-main .nav-link:hover,
.site-header .nav-main .nav-link.active{ color:#fff; border-bottom-color:var(--brand); }

.site-header .auth-actions{ display:flex; gap:12px; margin-left:8px; }
.site-header .auth-actions .btn{ padding:8px 14px; font-weight:600; }

/* 移动端：折叠菜单 */
@media (max-width: 960px){
  .site-header .nav-toggle{display:flex; align-items:center; justify-content:center;}
  .site-header nav.nav{
    position:absolute; left:0; right:0; top:var(--header-h);
    background:rgba(11,16,32,.98);
    border-bottom:1px solid var(--border);
    padding:16px; gap:16px;
    display:none; flex-direction:column;
  }
  .site-header nav.nav.open{display:flex;}
  .site-header .nav-main{flex-direction:column; gap:8px;}
  .site-header .auth-actions{width:100%; justify-content:flex-start;}
}

/* 容器与栅格 */
.container--lg{max-width:1200px;margin:0 auto;padding:0 24px;}
.container--md{max-width:980px;margin:0 auto;padding:0 20px;}
.section{padding:72px 0;}
.section--tight{padding:48px 0;}
.section--hero{padding:96px 0 72px;}
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width: 1024px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width: 640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;} }

/* 排版与标题尺度 */
.h1{font-size:44px;line-height:1.15;margin:0 0 16px;}
.h2{font-size:28px;line-height:1.25;margin:0 0 12px;}
.h3{font-size:20px;line-height:1.35;margin:0 0 10px;}
.lead{font-size:18px;color:var(--text-muted);line-height:1.7;}
.kicker{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);}

/* 卡片与分割 */
.stack-16>*+*{margin-top:16px;}
.stack-24>*+*{margin-top:24px;}
.card + .card{margin-top:16px;}
.hr{height:1px;background:var(--border);margin:24px 0;border:0;}

/* 轻动效（滚动浮现） */
.reveal{opacity:0;transform:translateY(14px);transition:.6s ease;}
.reveal.is-in{opacity:1;transform:none;}

/* --- 统一卡片/面板背景，杜绝纯白或过浅的半透明 --- */
.card, .panel, .box, .feature-card, .pricing-card, .faq-item, .form-card {
  background: rgba(17,24,38,0.92) !important;  /* 更稳的深色半透明 */
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: var(--shadow);
  color: var(--text);
}

/* Hero 区域上方的卡片更容易“发白”，再加一道加强色 */
.hero .card, .hero .panel, .hero .box {
  background: rgba(17,24,38,0.88) !important;
}

/* 输入类控件统一深色底，提升可读性 */
input, textarea, select {
  background: var(--input-bg, #0F1629) !important;
  color: var(--text, #E6EAF2) !important;
  border: 1px solid var(--border, #23304A) !important;
}

/* 避免任何纯白背景渗透（如果仍有组件写了白色背景，被这一条兜底覆盖） */
*[style*="background: #fff"],
*[style*="background:#fff"],
.bg-white {
  background: rgba(17,24,38,0.92) !important;
  color: var(--text) !important;
}

/* ===== Design Tokens (polish v2) ===== */
:root{
  /* 色板（沿用你的深色方向，微调层级） */
  --bg: #0B1020;
  --surface: #111826;          /* 普通卡片/面板 */
  --surface-2: #0F1629;        /* 输入/控件 */
  --elevated: rgba(17,24,38,.92);
  --primary: #6C72FF;
  --primary-600:#5A60EE;
  --accent: #79E2F2;
  --text: #E6EAF2;
  --muted: #A9B2C2;
  --border:#23304A;
  --danger:#FF5D6C;
  --success:#3AD29F;
  --warning:#FFB657;

  /* 字体与排版 */
  --font-sans: ui-sans-serif, Inter, system-ui, -apple-system, "Segoe UI", Arial;

  --fs-xxl: clamp(28px, 5vw, 44px);
  --fs-xl : clamp(22px, 3.5vw, 32px);
  --fs-lg : 20px;
  --fs-md : 16px;
  --fs-sm : 14px;

  /* 留白与圆角/阴影 */
  --space-1: 8px; --space-2: 12px; --space-3: 16px; --space-4: 24px; --space-5: 32px; --space-6: 48px;
  --radius-sm: 10px; --radius: 16px; --radius-lg: 22px;

  --shadow-sm: 0 2px 8px rgba(0,0,0,.25);
  --shadow   : 0 8px 24px rgba(0,0,0,.35);
  --shadow-lg: 0 18px 48px rgba(0,0,0,.45);
}

html,body{
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  font-size: var(--fs-md);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 统一主标题/副标题 */
.h-hero   { font-size: var(--fs-xxl); font-weight: 800; letter-spacing:.3px; }
.h-section{ font-size: var(--fs-xl);  font-weight: 700; margin-bottom: var(--space-4); }

/* 容器与分区 */
.section { padding: var(--space-6) 0; }
.container{ width:min(1120px, 92%); margin-inline:auto; }

/* 卡片与面板（覆盖） */
.card, .panel, .box, .feature-card, .pricing-card, .faq-item, .form-card{
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

/* 按钮（主/次/幽灵） */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding: 10px 16px; border-radius: 12px; border:1px solid transparent;
  font-weight: 600; line-height: 1; transition: transform .15s ease, box-shadow .15s ease, background .15s;
}
.btn--primary{ background: var(--primary); color:#fff; box-shadow: var(--shadow-sm); }
.btn--primary:hover{ background: var(--primary-600); transform: translateY(-1px); }
.btn--ghost{ background: transparent; color: var(--text); border-color: var(--border); }
.btn--ghost:hover{ background: rgba(255,255,255,.04); }

/* 输入控件（深色、可读） */
input, textarea, select{
  background: var(--surface-2); color: var(--text);
  border:1px solid var(--border); border-radius: 12px;
  padding: 10px 12px; outline: none;
}
input::placeholder, textarea::placeholder{ color: var(--muted); }

/* 焦点可见（AA） */
:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 12px;
}

/* 悬浮微动效尊重系统“减少动画”设置 */
@media (prefers-reduced-motion: reduce){
  * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition: none !important;}
}

/* ===== Sections polish ===== */
.hero{
  padding: calc(var(--space-6) + 12px) 0 var(--space-5);
}
.hero .card{
  background: linear-gradient(180deg, rgba(17,24,38,.86), rgba(17,24,38,.92));
  border-radius: var(--radius-lg);
  padding: var(--space-5);
}

.features{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
}
@media (max-width: 980px){
  .features{ grid-template-columns: 1fr; }
}

.feature-card{ padding: var(--space-4); }
.feature-card h3{ font-size: var(--fs-lg); margin-bottom: 8px; }
.feature-card p { color: var(--muted); }

/* 功能页模块卡片 */
.feature-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4);
}
@media(max-width: 980px){
  .feature-grid{ grid-template-columns:1fr; }
}

.feature-icon{
  width:40px;
  height:40px;
  border-radius:10px;
  background: rgba(108,114,255,.12);
  display:grid;
  place-items:center;
  color: var(--primary);
  margin-bottom: 16px;
}

.feature-card .meta{
  color: var(--muted);
  font-size: var(--fs-sm);
}

/* 上传组件 */
.uploader{ padding: var(--space-5); text-align:center; }
.dropzone{
  border:1.5px dashed var(--border); border-radius: var(--radius-lg);
  padding: var(--space-5);
  background: var(--surface);
  transition: border-color .15s;
}
.dropzone.dragover{ border-color: var(--primary); }
.uploader .hint{ color: var(--muted); margin-top: 8px; }
.result-card{ margin-top: var(--space-4); padding: var(--space-4); }

/* FAQ 样式 */
.faq .faq-item{ padding: var(--space-3); margin-bottom: var(--space-2); }
.faq summary{ cursor: pointer; font-weight:600; }
.faq .content{ color: var(--muted); margin-top: 8px; }

/* 跳转到主内容链接样式 */
.skip-link{
  position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
}
.skip-link:focus{
  left:16px; top:16px; width:auto; height:auto; padding:8px 12px;
  background: var(--primary); color:#fff; border-radius: 10px;
}

/* 结果页与内容块改深色表面 */
.summary-section, .risks-section, .original-text,
.highlight-card, .detail-section, .table-of-contents,
.section-box, .info-card, .outline-card {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}
.summary-section h3, .risks-section h3, .detail-section h3 { color: var(--text) !important; }
.summary-section p, .risks-section li, .table-of-contents a { color: var(--muted) !important; }

/* Cookie 次按钮深色化 */
.cookie-popup-buttons .btn-secondary{
  background: var(--surface-2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.cookie-popup-buttons .btn-secondary:hover{ background: rgba(255,255,255,.06) !important; }