/* Shared paper/ink tokens for the A app and its static entry pages. */
:root, :root[data-theme="light"] {
  --ui-serif: "Songti SC", "STSong", "Noto Serif CJK SC", "Noto Serif SC", "Source Han Serif SC", SimSun, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --reader-size: 21px;
  --bg: #f4f4f1;
  --paper: #fbfbf8;
  --paper-soft: #f7f7f3;
  --surface-strong: #e8e8e3;
  --text: #292a28;
  --text-soft: #484a45;
  --muted: #62645f;
  --gold: #948b76;
  --gold-dark: #665f50;
  --gold-soft: rgba(128, 120, 100, .1);
  --action: #665f50;
  --on-action: #fbfbf8;
  --success: #506b43;
  --danger: #a04430;
  --line: rgba(83, 88, 83, .14);
  --gray: #e8e8e3;
  --shadow: 0 8px 24px rgba(45, 50, 45, .045);
  --reading-text: var(--text-soft);
  --reading-title: var(--text);
  --reading-section: var(--gold-dark);
  --reading-pinyin: var(--muted);
  --radius-panel: 16px;
  --radius-control: 12px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --ui-body: 15px;
  --ui-caption: 12px;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --bg: #1d1c1a;
  --paper: #25231f;
  --paper-soft: #2c2924;
  --surface-strong: #34312b;
  --text: #f1eee7;
  --text-soft: #d6d0c5;
  --muted: #b6b0a5;
  --gold: #b8a778;
  --gold-dark: #c5b483;
  --gold-soft: rgba(184, 167, 120, .14);
  --action: #c5b483;
  --on-action: #25231f;
  --success: #b1c89a;
  --danger: #f0a08b;
  --line: rgba(241, 238, 231, .12);
  --gray: #37342e;
  --shadow: none;
  color-scheme: dark;
}
:root[data-large-text="true"] { --ui-body: 18px; --ui-caption: 15px; --reader-size: 24px; }
html { background: var(--bg); scroll-padding-bottom: 100px; }
body { background: var(--bg); color: var(--text); }
:root :is(.page, #static-seo-content) { font-family: var(--sans); }
:root :is(.page, #static-seo-content) :is(h1, h2, h3) { font-family: var(--ui-serif); font-weight: 600; }
button, a, input, select, textarea, summary { touch-action: manipulation; }
:is(button, a, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--gold-dark); outline-offset: 4px;
}
:is(button, a, input, select, textarea, summary) { scroll-margin-block: 16px 100px; }
input, select, textarea { color: var(--text); background: var(--paper); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.skip-link { position: fixed; top: -80px; left: 16px; z-index: 100; padding: 12px; color: var(--on-action); background: var(--action); }
.skip-link:focus { top: 12px; }
:root body > .page, #static-seo-content { color: var(--text); font-size: var(--ui-body); }
:root .page .panel, :root #static-seo-content { background: var(--paper); border-color: var(--line); border-radius: var(--radius-panel); box-shadow: var(--shadow); }
:root .page p, :root .page .brand, :root #static-seo-content .translator { color: var(--muted); }
:root .page a, :root #static-seo-content a { color: var(--gold-dark); }
.page .footer-nav a, #static-seo-content a { display: inline-flex; align-items: center; min-height: 44px; }
#static-seo-content { padding: 24px; overflow-wrap: anywhere; }
#static-seo-content h1 { font-size: 28px; }
@media (max-width: 390px) { :root #static-seo-content { padding: 20px 16px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}