/* Shared visual decisions. Component geometry and responsive rules live in style.css. */
:root {
  color-scheme: light;

  /* Warm paper, terracotta accents, and brown ink. */
  --color-canvas: #fbf4e9;
  --color-surface: #fffaf2;
  --color-surface-hover: #f3e4d3;
  --color-text: #402d24;
  --color-text-muted: #796456;
  --color-text-subtle: #806b5b;
  --color-accent: #a6472a;
  --color-accent-hover: #873720;
  --color-accent-subtle: #8d5d32;
  --color-on-accent: #fffaf2;
  --color-border: #e2cdbb;
  --color-cover-placeholder: #eedcc4;
  --color-illustration: #f2e5d1;
  --color-sentence-highlight: #f2d7bd;
  --color-word-highlight: #eec58b;
  --color-focus: #a6472a;
  --color-notice: #914626;
  --color-backdrop: rgb(64 45 36 / 42%);

  --font-ui: ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-display: Georgia, "Songti SC", serif;
  --font-reading: Georgia, serif;
  --text-tiny: 0.5625rem;
  --text-overline: 0.625rem;
  --text-xs: 0.6875rem;
  --text-sm: 0.8125rem;
  --text-md: 0.875rem;
  --text-lg: 1.1875rem;
  --text-xl: 1.3125rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-hero: clamp(2rem, 5.5vw, 3.875rem);
  --weight-medium: 500;
  --weight-bold: 700;
  --leading-ui: 1.4;
  --leading-body: 1.8;
  --leading-heading: 1.35;
  --leading-reading: 1.95;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-12: 48px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-control: 12px;
  --radius-card: 20px;
  --radius-pill: 999px;
  --radius-cover: var(--radius-md) 18px 18px var(--radius-md);
  --shadow-cover: 7px 12px 23px rgb(64 45 36 / 14%);
  --shadow-reader: 0 9px 35px rgb(64 45 36 / 6%);

  --width-shell: 1200px;
  --width-main: 1100px;
  --width-shelf: 1000px;
  --width-reader: 760px;
  --width-dialog: 550px;
  --control-min-height: 44px;
  --control-padding-block: 10px;
  --control-padding-inline: 16px;
  --focus-ring-width: 3px;
  --focus-ring-offset: 3px;
  --opacity-disabled: 0.45;
}
