/* ===================================================================
   大事年表 — 主题变量
   深色避免纯黑，浅色避免纯白；全部颜色集中在此，Canvas 也从这里取色。
   字体只使用系统字体回退，不下载任何在线字体。
   =================================================================== */

:root {
  /* 字体栈：思源黑体 → 国产手机厂商系统字体 → 苹果/微软系统字体 → 浏览器默认 */
  --font-sans:
    "Noto Sans SC", "Source Han Sans SC", "HarmonyOS Sans SC", "MiSans",
    "OPPO Sans", "vivo Sans", "Flyme Sans", "ColorOS Sans",
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑",
    system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono:
    "SF Mono", "Cascadia Mono", "JetBrains Mono", Consolas, "Liberation Mono", monospace;

  --radius-xs: 0.375rem;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;

  --tap: 44px;                  /* 触屏最小点击目标 */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);

  --dur-fast: 120ms;
  --dur: 200ms;
  --dur-slow: 320ms;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ------------------------- 深色（默认） ------------------------- */
:root,
[data-theme="dark"] {
  color-scheme: dark;

  --bg:            #0f1115;
  --bg-elev:       #151920;
  --panel:         #1a1f27;
  --panel-2:       #222833;

  --glass:         rgba(24, 29, 37, 0.66);
  --glass-strong:  rgba(20, 24, 31, 0.86);
  --glass-border:  rgba(255, 255, 255, 0.10);
  --glass-hi:      rgba(255, 255, 255, 0.055);
  --shadow:        0 6px 22px rgba(0, 0, 0, 0.42), 0 1px 2px rgba(0, 0, 0, 0.35);

  --text:          #e9edf4;
  --text-dim:      #99a3b2;
  --text-faint:    #6b7686;
  --line:          rgba(255, 255, 255, 0.10);
  --line-soft:     rgba(255, 255, 255, 0.06);

  --accent:        #6aa6ff;
  --accent-soft:   rgba(106, 166, 255, 0.16);
  --accent-text:   #0c1220;

  --ok:            #4ec98f;
  --warn:          #e5b054;
  --danger:        #ef6b6b;
  --danger-soft:   rgba(239, 107, 107, 0.14);

  --input-bg:      rgba(255, 255, 255, 0.05);
  --input-border:  rgba(255, 255, 255, 0.13);

  --mask:          rgba(6, 8, 12, 0.62);

  /* —— Canvas 专用 —— */
  --c-grid:        rgba(255, 255, 255, 0.035);
  --c-grid-strong: rgba(255, 255, 255, 0.085);
  --c-axis:        rgba(255, 255, 255, 0.16);
  --c-tick:        rgba(255, 255, 255, 0.22);
  --c-ticklabel:   #8b95a4;
  --c-lane-title:  #e9edf4;
  --c-lane-sub:    #7d8796;
  --c-lane-foot:   rgba(255, 255, 255, 0.045);
  --c-cursor:      rgba(110, 200, 255, 0.55);
  --c-select:      #ffffff;
  --c-label-bg:    #171c24;
  --c-label-text:  #e3e8f0;
  --c-cluster-bg:  #232a35;
}

/* ------------------------- 浅色 ------------------------- */
[data-theme="light"] {
  color-scheme: light;

  --bg:            #f4f6f9;
  --bg-elev:       #ffffff;
  --panel:         #ffffff;
  --panel-2:       #f0f2f6;

  --glass:         rgba(255, 255, 255, 0.70);
  --glass-strong:  rgba(255, 255, 255, 0.92);
  --glass-border:  rgba(15, 23, 42, 0.10);
  --glass-hi:      rgba(255, 255, 255, 0.55);
  --shadow:        0 6px 20px rgba(15, 23, 42, 0.10), 0 1px 2px rgba(15, 23, 42, 0.06);

  --text:          #171d27;
  --text-dim:      #5b6675;
  --text-faint:    #8a94a3;
  --line:          rgba(15, 23, 42, 0.12);
  --line-soft:     rgba(15, 23, 42, 0.06);

  --accent:        #2563d6;
  --accent-soft:   rgba(37, 99, 214, 0.12);
  --accent-text:   #ffffff;

  --ok:            #12945f;
  --warn:          #b07407;
  --danger:        #d1453f;
  --danger-soft:   rgba(209, 69, 63, 0.10);

  --input-bg:      rgba(15, 23, 42, 0.035);
  --input-border:  rgba(15, 23, 42, 0.15);

  --mask:          rgba(23, 29, 39, 0.34);

  /* —— Canvas 专用 —— */
  --c-grid:        rgba(15, 23, 42, 0.045);
  --c-grid-strong: rgba(15, 23, 42, 0.10);
  --c-axis:        rgba(15, 23, 42, 0.20);
  --c-tick:        rgba(15, 23, 42, 0.26);
  --c-ticklabel:   #6b7686;
  --c-lane-title:  #171d27;
  --c-lane-sub:    #7c8798;
  --c-lane-foot:   rgba(15, 23, 42, 0.035);
  --c-cursor:      rgba(37, 99, 214, 0.50);
  --c-select:      #101724;
  --c-label-bg:    #ffffff;
  --c-label-text:  #1c2431;
  --c-cluster-bg:  #e6eaf1;
}

/* 减少动效 */
[data-motion="off"] *,
[data-motion="off"] *::before,
[data-motion="off"] *::after {
  animation-duration: 0.001ms !important;
  transition-duration: 0.001ms !important;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
}

/* 让 canvas 绘制字体与 CSS 保持一致的基线 */
@media (prefers-color-scheme: light) {
  :root:not([data-theme-forced]) { /* 由 JS 决定最终 theme，这里不做切换 */ }
}