/* ============================================================
   太阳系探索 · 设计令牌 (Design Tokens)
   所有颜色一律 HSL，组件只引用令牌，不写死颜色值。
   ============================================================ */

:root {
  /* ---------- 深空中性色阶 ---------- */
  --space-980: 236 48% 3%;
  --space-950: 236 42% 5%;
  --space-900: 235 36% 8%;
  --space-850: 235 32% 11%;
  --space-800: 234 28% 15%;
  --space-750: 234 24% 20%;
  --space-700: 233 21% 27%;
  --space-600: 232 18% 38%;
  --space-500: 231 15% 52%;
  --space-400: 228 14% 66%;
  --space-300: 226 16% 80%;

  /* ---------- 文字层级 ---------- */
  --ink-hi: 220 44% 97%;
  --ink: 222 24% 84%;
  --ink-mid: 224 16% 63%;
  --ink-low: 226 13% 46%;

  /* ---------- 主色：恒星光 (太阳 / 能量) ---------- */
  --sun: 38 96% 58%;
  --sun-bright: 46 100% 74%;
  --sun-deep: 28 92% 48%;

  /* ---------- 辅色：行星系蓝 (地球 / 科学) ---------- */
  --aqua: 190 82% 54%;
  --aqua-bright: 186 90% 72%;
  --aqua-deep: 202 74% 40%;

  /* ---------- 强调色：食甚铜 (月食 / 警示读数) ---------- */
  --copper: 16 78% 57%;
  --copper-bright: 24 92% 70%;

  /* ---------- 点缀色：轨道紫 (行星轨道 / 选中态) ---------- */
  --violet: 266 58% 68%;
  --violet-deep: 274 46% 48%;

  /* ---------- 语义色 ---------- */
  --ok: 152 62% 48%;
  --warn: 42 94% 60%;
  --danger: 4 74% 58%;

  /* ---------- 表面 ---------- */
  --surface: var(--space-900);
  --surface-raised: var(--space-850);
  --surface-sunken: var(--space-950);
  --line: 233 22% 22%;
  --line-strong: 232 20% 32%;

  /* ---------- 渐变 ---------- */
  --gradient-sun: linear-gradient(135deg,
      hsl(var(--sun-bright)) 0%,
      hsl(var(--sun)) 48%,
      hsl(var(--sun-deep)) 100%);
  --gradient-aqua: linear-gradient(135deg,
      hsl(var(--aqua-bright)) 0%,
      hsl(var(--aqua)) 52%,
      hsl(var(--aqua-deep)) 100%);
  --gradient-copper: linear-gradient(135deg,
      hsl(var(--copper-bright)) 0%,
      hsl(var(--copper)) 60%,
      hsl(10 70% 42%) 100%);
  --gradient-title: linear-gradient(100deg,
      hsl(var(--ink-hi)) 0%,
      hsl(var(--sun-bright)) 42%,
      hsl(var(--aqua-bright)) 78%,
      hsl(var(--violet)) 100%);
  --gradient-veil: linear-gradient(180deg,
      hsl(var(--space-980) / 0) 0%,
      hsl(var(--space-980) / 0.72) 58%,
      hsl(var(--space-980) / 0.96) 100%);
  --gradient-hairline: linear-gradient(90deg,
      hsl(var(--sun) / 0) 0%,
      hsl(var(--sun) / 0.55) 22%,
      hsl(var(--aqua) / 0.55) 62%,
      hsl(var(--violet) / 0) 100%);

  /* ---------- 阴影与光晕 ---------- */
  --shadow-sm: 0 1px 2px hsl(var(--space-980) / 0.6);
  --shadow-card: 0 18px 40px -22px hsl(var(--space-980) / 0.95),
      0 1px 0 hsl(var(--ink-hi) / 0.04) inset;
  --shadow-lift: 0 28px 60px -28px hsl(var(--space-980) / 1),
      0 0 0 1px hsl(var(--line-strong) / 0.9);
  --glow-sun: 0 0 34px -6px hsl(var(--sun) / 0.5);
  --glow-aqua: 0 0 30px -8px hsl(var(--aqua) / 0.55);
  --glow-copper: 0 0 30px -8px hsl(var(--copper) / 0.6);

  /* ---------- 字号阶 (1.25 节奏) ---------- */
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.1875rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --fs-3xl: clamp(2.6rem, 6.2vw, 4.25rem);

  /* ---------- 间距阶 (8 的倍数) ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 128px;

  /* ---------- 圆角 ---------- */
  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* ---------- 动效 ---------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 140ms var(--ease-out);
  --t-base: 260ms var(--ease-out);
  --t-slow: 520ms var(--ease-out);

  /* ---------- 排版族 ---------- */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI",
      "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei UI",
      "Microsoft YaHei", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "Cascadia Mono", "JetBrains Mono", ui-monospace, SFMono-Regular,
      Menlo, Consolas, "Liberation Mono", monospace;

  /* ---------- 版心 ---------- */
  --shell: 1220px;
  --shell-narrow: 760px;
  --nav-h: 60px;
}

/* 行星本体色 —— 供 JS 读取，保持与真实外观一致 */
:root {
  --planet-mercury: 30 8% 62%;
  --planet-venus: 38 62% 70%;
  --planet-earth: 202 72% 52%;
  --planet-mars: 14 72% 56%;
  --planet-jupiter: 28 46% 66%;
  --planet-saturn: 42 44% 72%;
  --planet-uranus: 187 46% 66%;
  --planet-neptune: 228 62% 66%;
  --planet-moon: 40 6% 76%;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t-fast: 0ms;
    --t-base: 0ms;
    --t-slow: 0ms;
  }
}