/* 设计令牌与基础重置 */
:root {
  color-scheme: light;

  --bg: #f4f6f2;
  --surface: #ffffff;
  --surface-2: #f7f9f6;
  --surface-3: #eaf0ea;
  --track: #edf1ed;

  --ink: #101915;
  --ink-2: #3f4e45;
  --muted: #6b7a70;

  --line: #e1e7e1;
  --line-soft: #eef2ee;
  --line-strong: #ccd6cd;

  --accent: #17694e;
  --accent-strong: #0f523c;
  --accent-soft: #e6f2ec;
  --accent-ink: #0f523c;
  --on-accent: #ffffff;

  --warn: #9a5b10;
  --warn-soft: #fcf3e4;
  --warn-line: #efd9b7;

  --danger: #b4453c;
  --danger-soft: #fdecea;

  /* 图表分类色：已用 dataviz 校验器验证（浅色表面 #ffffff） */
  --series-social: #2a78d6;
  --series-tax: #eb6834;
  --series-net: #1baf7a;

  --shadow: 0 1px 2px rgba(16, 25, 21, 0.04),
    0 18px 40px -28px rgba(16, 25, 21, 0.32);
  --shadow-lift: 0 2px 6px rgba(16, 25, 21, 0.06),
    0 24px 50px -28px rgba(16, 25, 21, 0.38);

  --radius: 18px;
  --radius-sm: 11px;
  --maxw: 1120px;

  --font-ui: -apple-system, BlinkMacSystemFont, "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
  --font-mono: "SFMono-Regular", "Cascadia Mono", "Roboto Mono", ui-monospace,
    monospace;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;

    --bg: #0e1411;
    --surface: #161d19;
    --surface-2: #1b241f;
    --surface-3: #212c26;
    --track: #222b25;

    --ink: #f1f5f1;
    --ink-2: #c2cdc5;
    --muted: #8b9a90;

    --line: #28332c;
    --line-soft: #202923;
    --line-strong: #3a483f;

    --accent: #4fc295;
    --accent-strong: #6fd6ad;
    --accent-soft: #173328;
    --accent-ink: #9fe8c9;
    --on-accent: #07130d;

    --warn: #e0a44a;
    --warn-soft: #2c2416;
    --warn-line: #4a3a1e;

    --danger: #e77a70;
    --danger-soft: #341b19;

    /* 图表分类色：深色表面 #171d19 下已验证 */
    --series-social: #3987e5;
    --series-tax: #d95926;
    --series-net: #199e70;

    --shadow: 0 1px 2px rgba(0, 0, 0, 0.3),
      0 20px 44px -28px rgba(0, 0, 0, 0.85);
    --shadow-lift: 0 2px 8px rgba(0, 0, 0, 0.35),
      0 28px 60px -30px rgba(0, 0, 0, 0.9);
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink);
  background-color: var(--bg);
  background-image:
    radial-gradient(900px 520px at 8% -10%, rgba(23, 105, 78, 0.09), transparent 62%),
    radial-gradient(760px 460px at 100% 0%, rgba(235, 104, 52, 0.055), transparent 58%);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

@media (prefers-color-scheme: dark) {
  body {
    background-image:
      radial-gradient(900px 520px at 8% -10%, rgba(79, 194, 149, 0.1), transparent 62%),
      radial-gradient(760px 460px at 100% 0%, rgba(217, 89, 38, 0.08), transparent 58%);
  }
}

h1,
h2,
h3,
p,
dl,
dd,
dt,
ul,
ol,
figure {
  margin: 0;
}

ul,
ol {
  padding: 0;
  list-style: none;
}

input,
button,
select,
textarea {
  font: inherit;
  color: inherit;
}

button {
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

table {
  border-collapse: collapse;
}

img,
svg {
  display: block;
  max-width: 100%;
}

::selection {
  background: var(--accent-soft);
  color: var(--accent-ink);
}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  padding: 8px 12px;
  border-radius: 8px;
  background: var(--ink);
  color: var(--surface);
  transform: translateY(-160%);
  transition: transform 0.15s ease;
}

.skip-link:focus-visible {
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}