/**
 * Design tokens — editorial baseline for scroll storytelling
 */
:root {
  /* Color — restrained, modern data journalism */
  --color-bg: #ececec;
  --hero-bg: #ececec;
  --color-bg-muted: #ececec;
  --color-text: #141414;
  --color-text-muted: #6b6b6b;
  --color-text-faint: #a3a3a3;
  --color-border: #ddd8d0;
  --color-accent: #141414;

  /* Typography */
  --font-sans: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --font-serif: "Source Han Serif SC", "Noto Serif SC", "Songti SC", "SimSun", serif;

  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.75rem;
  --font-size-2xl: 2.5rem;
  --font-size-hero: clamp(2.5rem, 6vw, 4.5rem);
  --font-size-metric: clamp(2rem, 4.5vw, 3.25rem);

  --line-height-tight: 1.2;
  --line-height-base: 1.6;
  --line-height-loose: 1.85;

  --letter-spacing-wide: 0.12em;
  --letter-spacing-tight: -0.02em;

  /* Spacing */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 4rem;
  --space-2xl: 8rem;
  --space-3xl: 12rem;

  /* Layout */
  --content-max-width: 68rem;
  --hero-max-width: 42rem;
  --section-min-height: 100vh;

  /* Loading */
  --loading-z-index: 1000;

  /* Emotion palette — IDs only, colors TBD per chapter */
  --emotion-count: 8;

  /* Reading prose fade-in (entrance + later chapters) */
  --reading-fade-duration: 1.9s;
  --reading-fade-duration-body: 2.05s;
  --reading-fade-shift: 12px;
  --reading-fade-stagger: 0.28s;

  /* 白色雾面诗笺 — 悬停 / 点击小卡片 */
  --slip-bg: rgba(255, 255, 255, 0.74);
  --slip-blur: 14px;
  --slip-shadow: 0 8px 28px rgba(28, 32, 36, 0.09);
  --slip-radius: 2px;
  --slip-title: rgba(10, 10, 10, 0.96);
  --slip-body: rgba(72, 72, 72, 0.62);
}

/* Hero caption glass — shared frosted panel (backdrop samples content behind) */
.hero-glass {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(20px) saturate(118%);
  -webkit-backdrop-filter: blur(20px) saturate(118%);
  border: none;
  box-shadow: none;
}

/* 白色雾面诗笺小卡片（仅外观，不改定位 / 交互） */
.pr-scatter__tooltip,
.pr-scatter__detail,
.pr-explore__tooltip,
.pr-explore__card,
.poet-language-map__tooltip,
.poet-language-map__panel {
  background: var(--slip-bg);
  backdrop-filter: blur(var(--slip-blur)) saturate(118%);
  -webkit-backdrop-filter: blur(var(--slip-blur)) saturate(118%);
  border: none;
  border-radius: var(--slip-radius);
  box-shadow: var(--slip-shadow);
}

.pr-scatter__tooltip,
.pr-scatter__detail,
.pr-explore__tooltip,
.poet-language-map__tooltip {
  text-align: center;
  color: var(--slip-body);
}

.pr-scatter__tooltip strong,
.pr-scatter__detail strong,
.pr-explore__tooltip strong,
.poet-language-map__tooltip-name,
.poet-language-map__panel-name {
  font-family: "Noto Serif SC", var(--font-serif);
  font-weight: 700;
  color: var(--slip-title);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .hero-glass {
    background: rgba(255, 255, 255, 0.12);
  }

  .pr-scatter__tooltip,
  .pr-scatter__detail,
  .pr-explore__tooltip,
  .pr-explore__card,
  .poet-language-map__tooltip,
  .poet-language-map__panel,
  .poem-sky__mist-core {
    background: rgba(255, 255, 255, 0.92);
  }
}