:root {
  --tgh-color-text: #2c2924;
  --tgh-color-charcoal: #171512;
  --tgh-color-brand: #5f4a28;
  --tgh-color-muted: #756b5a;
  --tgh-color-canvas: #f6f3ed;
  --tgh-color-surface-muted: #f1ece3;
  --tgh-color-surface-subtle: #fbf9f4;
  --tgh-color-primary: #8a672c;
  --tgh-color-primary-hover: #62491f;
  --tgh-color-accent: #c8a96b;
  --tgh-color-surface: #fffdf9;
  --tgh-color-danger: #9b3528;
  --tgh-color-border: rgba(46, 42, 35, .14);
  --tgh-color-border-on-dark: rgba(255, 255, 255, .18);
  --tgh-focus-ring: 0 0 0 3px rgba(200, 169, 107, .28);
  --tgh-shadow-soft: 0 8px 24px rgba(43, 34, 21, .07);
  --tgh-shadow-card: 0 22px 60px rgba(43, 34, 21, .11);
  --tgh-shadow-strong: 0 22px 60px rgba(43, 34, 21, .14);
  --tgh-display: "Fraunces", Georgia, serif;
  --tgh-body: "Manrope", sans-serif;

  /* Aliases keep parent-theme components on the same visual system. */
  --ink: var(--tgh-color-text);
  --ink-deep: var(--tgh-color-charcoal);
  --forest: var(--tgh-color-brand);
  --forest-light: var(--tgh-color-muted);
  --paper: var(--tgh-color-surface-muted);
  --paper-bright: var(--tgh-color-surface-subtle);
  --canvas: var(--tgh-color-canvas);
  --sand: #ddd3c3;
  --saffron: var(--tgh-color-accent);
  --coral: var(--tgh-color-primary);
  --coral-deep: var(--tgh-color-primary-hover);
  --sage: #d8d1c4;
  --white: var(--tgh-color-surface);
  --line: var(--tgh-color-border);
  --line-light: var(--tgh-color-border-on-dark);
  --shadow-sm: var(--tgh-shadow-soft);
  --shadow-lg: var(--tgh-shadow-strong);

  --tgh-ink: var(--tgh-color-text);
  --tgh-ink-deep: var(--tgh-color-charcoal);
  --tgh-forest: var(--tgh-color-brand);
  --tgh-paper: var(--tgh-color-surface-muted);
  --tgh-paper-bright: var(--tgh-color-surface-subtle);
  --tgh-saffron: var(--tgh-color-accent);
  --tgh-coral: var(--tgh-color-primary);
  --tgh-white: var(--tgh-color-surface);
  --tgh-line: var(--tgh-color-border);
  --tgh-shadow: var(--tgh-shadow-card);
}