/* ==========================================================================
   溪璐 Shiro · 应援站设计令牌 (Design Tokens)
   全站唯一色彩/间距/字体来源。所有页面只引用变量，不写死颜色。
   主题: 夜空 · 月光 · 银白 + 淡紫/冰蓝点缀
   ========================================================================== */

:root {
  /* ---- 基础色板 ---- */
  --bg-0: #05060d;
  --bg-1: #080a14;
  --bg-2: #0e1222;
  --bg-3: #151a2e;

  --surface: rgba(255, 255, 255, 0.045);
  --surface-strong: rgba(255, 255, 255, 0.075);
  --surface-hover: rgba(255, 255, 255, 0.085);

  --line: rgba(255, 255, 255, 0.10);
  --line-strong: rgba(255, 255, 255, 0.18);

  --text: #eef1fb;
  --text-strong: #ffffff;
  --muted: #9aa3c0;
  --muted-2: #6d7694;

  /* ---- 品牌强调色 ---- */
  --accent: #b9c7ff;        /* 月光银蓝: 主强调 */
  --accent-2: #c9a7ff;      /* 淡紫 */
  --accent-3: #7fe3ff;      /* 冰蓝 */
  --gold: #ffd8a8;          /* 暖金: 精选/高光 */
  --pink: #ffb4d2;          /* 樱粉: 少量点缀 */

  --accent-rgb: 185, 199, 255;
  --accent-2-rgb: 201, 167, 255;
  --accent-3-rgb: 127, 227, 255;

  /* ---- 渐变 ---- */
  --grad-text: linear-gradient(100deg, #ffffff 0%, var(--accent) 45%, var(--accent-2) 100%);
  --grad-glow: radial-gradient(circle at 50% 0%, rgba(185, 199, 255, 0.22), transparent 62%);
  --grad-card: linear-gradient(160deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02) 55%, rgba(255, 255, 255, 0.04));

  /* ---- 字体 ---- */
  --font-sans: "PingFang SC", "HarmonyOS Sans SC", "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-serif: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", Georgia, serif;
  --font-mono: "JetBrains Mono", "SF Mono", ui-monospace, Menlo, Consolas, monospace;
  --font-en: "Optima", "Avenir Next", "Helvetica Neue", var(--font-sans);

  /* ---- 字号 ---- */
  --fs-display: clamp(2.6rem, 6.2vw, 5.2rem);
  --fs-h1: clamp(2.1rem, 4vw, 3.2rem);
  --fs-h2: clamp(1.6rem, 2.6vw, 2.25rem);
  --fs-h3: clamp(1.15rem, 1.6vw, 1.4rem);
  --fs-body: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.78rem;

  /* ---- 间距 ---- */
  --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;

  /* ---- 尺寸 ---- */
  --container: 1180px;
  --container-wide: 1400px;
  --nav-h: 68px;
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius: 18px;
  --radius-lg: 26px;
  --radius-pill: 999px;

  /* ---- 阴影与描边 ---- */
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.28);
  --shadow: 0 12px 34px rgba(0, 0, 0, 0.42);
  --shadow-lg: 0 28px 70px rgba(0, 0, 0, 0.55);
  --ring: 0 0 0 1px var(--line);
  --glow-accent: 0 0 28px rgba(var(--accent-rgb), 0.28);

  /* ---- 动效 ---- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 160ms;
  --dur: 320ms;
  --dur-slow: 620ms;

  /* ---- 层级 ---- */
  --z-bg: 0;
  --z-content: 10;
  --z-nav: 100;
  --z-overlay: 500;
  --z-modal: 900;
  --z-toast: 1000;

  color-scheme: dark;
}

/* 大陆分组配色（地图/图例共用） */
:root {
  --c-asia: #7fe3ff;
  --c-europe: #b9c7ff;
  --c-africa: #ffd8a8;
  --c-north-america: #c9a7ff;
  --c-south-america: #8affc1;
  --c-oceania: #ffb4d2;
  --c-online: #4ade80;
}