:root {
  --navy-950: oklch(22% 0.055 255);
  --navy-900: oklch(26% 0.062 255);
  --navy-800: oklch(32% 0.07 255);
  --ink-900: oklch(25% 0.035 250);
  --ink-600: oklch(48% 0.03 250);
  --paper-50: oklch(98.5% 0.006 220);
  --paper-100: oklch(95.5% 0.012 220);
  --line-200: oklch(88% 0.018 230);
  --orange-500: oklch(76% 0.17 58);
  --orange-600: oklch(69% 0.17 52);
  --background: var(--paper-50);
  --foreground: var(--ink-900);
  --surface: var(--paper-50);
  --surface-muted: var(--paper-100);
  --surface-dark: var(--navy-950);
  --text: var(--ink-900);
  --text-muted: var(--ink-600);
  --text-on-dark: var(--paper-50);
  --accent: var(--orange-500);
  --accent-hover: var(--orange-600);
  --border: var(--line-200);
  --radius: 0.25rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
  margin: 0;
  min-width: 320px;
  background: var(--background);
  color: var(--text);
  font-family: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
button, a, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}