/* OpenCC 设计令牌。只读：页面级样式写进各自的 css，不要改这里。规范见 docs/design/DESIGN_SYSTEM.md */

@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/fraunces-500.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2013-2014, U+2018-201D, U+2022, U+2026;
}
@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/fraunces-600.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2013-2014, U+2018-201D, U+2022, U+2026;
}

:root {
  color-scheme: light dark;

  --bg: #faf9f5;
  --bg-sunken: #f0eee6;
  --surface: #ffffff;
  --ink: #141413;
  --ink-2: #3d3d3a;
  --ink-3: #73726c;
  --line: #e8e6dc;
  --line-strong: #d1cfc5;
  --accent: #c6613f;
  --accent-ink: #a34a2b;
  --ok: #3f7a55;
  --ok-bg: #e9f1ec;
  --warn: #9a6a12;
  --warn-bg: #f6eed9;
  --danger: #b3402a;
  --danger-bg: #f7e6e1;
  --info-bg: #eeece3;
  --ink-on-solid: #faf9f5;
  --solid: #141413;
  --solid-hover: #3d3d3a;
  --backdrop: rgba(20, 20, 19, 0.45);
  --shadow-pop: 0 12px 40px rgba(20, 20, 19, 0.16);

  --font-serif: "Fraunces", "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", "SimSun", Georgia, serif;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --fs-1: 12px;
  --fs-2: 13px;
  --fs-3: 15px;
  --fs-4: 17px;
  --fs-5: 22px;
  --fs-6: 30px;
  --fs-7: 44px;
  --fs-8: 60px;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 72px;
  --sp-9: 112px;

  --r-ctl: 8px;
  --r-card: 12px;
  --r-pill: 999px;

  --w-page: 1080px;
  --w-prose: 680px;
  --w-side: 232px;
  --w-console: 960px;

  --t-fast: 120ms;
  --t-base: 160ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1f1e1d;
    --bg-sunken: #191918;
    --surface: #262624;
    --ink: #faf9f5;
    --ink-2: #c2c0b6;
    --ink-3: #9c9a92;
    --line: #3a3936;
    --line-strong: #4a4945;
    --accent: #e08a66;
    --accent-ink: #e9a483;
    --ok: #6fb58b;
    --ok-bg: #223229;
    --warn: #d9a441;
    --warn-bg: #36301f;
    --danger: #e0806b;
    --danger-bg: #3a2420;
    --info-bg: #2c2b28;
    --ink-on-solid: #1f1e1d;
    --solid: #faf9f5;
    --solid-hover: #c2c0b6;
    --backdrop: rgba(0, 0, 0, 0.6);
    --shadow-pop: 0 12px 40px rgba(0, 0, 0, 0.5);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --t-fast: 0ms;
    --t-base: 0ms;
  }
  *, *::before, *::after {
    animation-duration: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0ms !important;
    scroll-behavior: auto !important;
  }
}

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

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

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--fs-3);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: var(--ink);
}
h1 { font-size: var(--fs-7); }
h2 { font-size: var(--fs-6); }
h3 { font-size: var(--fs-5); }
h4 { font-size: var(--fs-4); }

p { margin: 0; }

a {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-color: var(--line-strong);
  text-underline-offset: 3px;
  transition: color var(--t-fast), text-decoration-color var(--t-fast);
}
a:hover { color: var(--accent-ink); text-decoration-color: var(--accent); }

code, kbd, samp, pre { font-family: var(--font-mono); font-size: 0.92em; }

.num, .tabular { font-variant-numeric: tabular-nums; }

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

@media (max-width: 640px) {
  :root { --fs-7: 32px; --fs-6: 26px; --fs-8: 40px; }
}