/*
 * Shared "printed rulebook" theme for every page on the site: warm paper,
 * ink, and a single gold accent by default, with an explicit dark variant.
 *
 * The site does NOT follow `prefers-color-scheme`. Draw Steel Companion in
 * particular is read at a table under room light, often next to the actual
 * books, so a rulebook look is the right default in every environment. Dark
 * mode is opt-in only, toggled by the reader via theme.js and remembered in
 * localStorage — never auto-switched based on the OS or time of day.
 */
:root {
  --paper:          #f2ece1;  /* page background */
  --paper-raised:   #fbf8f2;  /* panels, popups */
  --paper-sunken:   #e9e1d1;  /* wells, inputs, chips */
  --paper-highlight:#fffdf8;  /* near-white cards on top of paper */
  --line:           #d5c9b1;
  --line-soft:      #e2d8c5;
  --ink:            #2c2620;
  --ink-dim:        #635a4b;
  --ink-faint:      #8b8170;
  --steel:          #415568;
  --gold:           #8a6321;
  --gold-soft:      #b8933f;
  --gold-hover:     #6d4d17;
  --gold-wash:      #8a63211a;
  --blood:          #96342c;
  --wash-1:         #2c26200a; /* subtle hover/stripe tint over paper */
  --scrim:          #00000059; /* fixed popup backdrop dimmer, not themed */
  --radius: 4px;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --shadow-page: 0 1px 2px #2c26201a, 0 8px 24px #2c262026;

  color-scheme: light;
}

:root[data-theme="dark"] {
  --paper:          #16130f;
  --paper-raised:   #211c15;
  --paper-sunken:   #100d0a;
  --paper-highlight:#2a2419;
  --line:           #3a3226;
  --line-soft:      #2e2820;
  --ink:            #eee6d8;
  --ink-dim:        #c2b8a2;
  --ink-faint:      #8f8571;
  --steel:          #7fa0c2;
  --gold:           #d9a441;
  --gold-soft:      #c9a355;
  --gold-hover:     #f0c169;
  --gold-wash:      #d9a4411a;
  --blood:          #e08279;
  --wash-1:         #ffffff0d;
  --scrim:          #00000073;
  --shadow-page: 0 1px 2px #00000040, 0 8px 24px #00000059;

  color-scheme: dark;
}

/* Reusable toggle button, dropped into any topbar/header. */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; flex: none;
  font-size: 16px; line-height: 1;
  background: none; border: 1px solid var(--line); border-radius: var(--radius);
  color: var(--ink-dim); cursor: pointer;
}
.theme-toggle:hover { color: var(--ink); background: var(--wash-1); }
.theme-toggle .icon-dark { display: none; }
:root[data-theme="dark"] .theme-toggle .icon-light { display: none; }
:root[data-theme="dark"] .theme-toggle .icon-dark { display: inline; }