@layer tokens {
  /* Shared TGK canvas. Pillar sheets may override accent tokens only. */
  html[data-theme="light"] {
    --bg-opacity: 0.20;
    --bg-primary: #f3efe7;
    --bg-secondary: #e8e1d7;
    --bg-wash: rgba(243, 239, 231, 0.94);
    --bg: var(--bg-primary);
    --overlay-bg-gradient: linear-gradient(to right, rgba(243, 239, 231, 0.46), rgba(233, 226, 216, 0.34));
    --bg-gradient: var(--overlay-bg-gradient);
    --bg-alt: #eee8de;
    --bg-surface: #e9e2d8;
    --section-bg-top: #ebe5dc;
    --section-bg-bottom: #e2dad0;

    --text-primary: #211f1b;
    --text-secondary: #5f5a52;
    --text-muted: #777067;
    --text-base: var(--text-primary);

    --text-accent: #775e40;
    --accent: var(--text-accent);
    --accent-page: #9a693d;
    --highlight: #d4a46b;
    --glyph-color: #d0a267;
    --strong-text: #615039;
    --cite-color: #a48358;

    --section-border: rgba(119, 94, 64, 0.34);
    --border-accent: rgba(119, 94, 64, 0.36);
    --border-soft: rgba(119, 94, 64, 0.24);
    --card-gradient: color-mix(in srgb, var(--bg-secondary) 94%, var(--highlight) 6%);
    --link-color: var(--text-accent);
    --link-hover: var(--accent-page);

    --shadow-glow: rgba(201, 145, 84, 0.30);
    --page-box-shadow: 0 0 20px rgba(35, 31, 26, 0.10);
    --page-shadow-soft: 0 12px 28px rgba(33, 31, 27, 0.10);
    --glow-soft: 0 10px 22px rgba(200, 154, 95, 0.20);
    --glow-strong: 0 18px 32px rgba(200, 154, 95, 0.28);

    --input-bg: var(--bg-secondary);
    --input-bg-focus: var(--bg-primary);
    --input-border: rgba(220, 176, 122, 0.30);
    --input-text: var(--text-primary);
    --input-placeholder: rgba(31, 28, 22, 0.52);
    --badge-bg: rgba(215, 151, 86, 0.4);
    --badge-text: #201c15;
    --badge-border: rgba(208, 162, 103, 0.44);
    --badge-shadow: 0 2px 8px rgba(200, 154, 95, 0.26);
    --footer-opacity: 0.86;
  }

  html[data-theme="dark"] {
    --bg-opacity: 0.18;
    --bg-primary: #0d0d0c;
    --bg-secondary: #171716;
    --bg-wash: rgba(13, 13, 12, 0.95);
    --bg: var(--bg-primary);
    --overlay-bg-gradient: linear-gradient(to right, rgba(13, 13, 12, 0.46), rgba(31, 30, 28, 0.34));
    --bg-gradient: var(--overlay-bg-gradient);
    --bg-alt: rgba(24, 24, 23, 0.96);
    --bg-surface: rgba(18, 18, 17, 0.92);
    --section-bg-top: #1b1b1a;
    --section-bg-bottom: #242321;

    --text-primary: #eee8de;
    --text-secondary: #c8c0b5;
    --text-muted: #9c958b;
    --text-base: var(--text-primary);

    --text-accent: #c79b61;
    --accent: var(--text-accent);
    --accent-page: #d0a66e;
    --highlight: #dcb884;
    --glyph-color: #d0a66e;
    --strong-text: #dcb884;
    --cite-color: #c79b61;

    --section-border: rgba(199, 155, 97, 0.30);
    --border-accent: rgba(199, 155, 97, 0.30);
    --border-soft: rgba(199, 155, 97, 0.18);
    --card-gradient: color-mix(in srgb, var(--bg-secondary) 94%, var(--highlight) 6%);
    --link-color: var(--text-accent);
    --link-hover: var(--accent-page);

    --shadow-glow: rgba(199, 155, 97, 0.24);
    --page-box-shadow: 0 0 24px rgba(199, 155, 97, 0.16);
    --page-shadow-soft: 0 12px 30px rgba(0, 0, 0, 0.34);
    --glow-soft: 0 12px 26px rgba(199, 155, 97, 0.18);
    --glow-strong: 0 20px 36px rgba(199, 155, 97, 0.24);

    --input-bg: var(--bg-secondary);
    --input-bg-focus: var(--section-bg-bottom);
    --input-border: rgba(255, 255, 255, 0.18);
    --input-text: #f6e2be;
    --input-placeholder: rgba(246, 226, 190, 0.58);
    --badge-bg: rgba(217, 171, 108, 0.46);
    --badge-text: #f6dfbb;
    --badge-border: rgba(223, 177, 119, 0.52);
    --badge-shadow: 0 2px 8px rgba(220, 184, 132, 0.22);
    --footer-opacity: 0.84;
  }
}