/* Plinth design tokens — generated from tokens.json. Themes: light, dark (default: light).
   Switch theme with <html data-theme="dark">. */
:root, [data-theme="light"] {
  --wall: #f3f1ec;
  --wall-shade: #e8e4dc;
  --plinth: #fdfcf9;
  --plinth-edge: #d6cfc1;
  --ink: #1d1c1a;
  --ink-soft: #5c5850;
  --rule: #dcd7cd;
  --rule-strong: #7f796e;
  --accent: #7a2c25;
  --accent-fill: #7a2c25;
  --on-accent: #fbf7f1;
  --sage: #46634f;
  --spot: #ffeec6;
  --floor: #3a2d1c59;
  --gilt: #b0915c;
  --oak: #94704a;
  --ebony: #1e1c1a;
  --focus: #7a2c25;
  --shadow-lip: 0 1px 0 rgba(40,30,18,0.07);
  --shadow-rest: 0 1px 2px rgba(40,30,18,0.07), 0 6px 14px -8px rgba(40,30,18,0.18);
  --shadow-hang: 0 1px 1px rgba(40,30,18,0.12), 0 18px 26px -16px rgba(40,30,18,0.38);
  --shadow-lit: 0 1px 1px rgba(40,30,18,0.12), 0 30px 34px -18px rgba(40,30,18,0.46);
  --shadow-pop: 0 2px 4px rgba(40,30,18,0.06), 0 18px 36px -14px rgba(40,30,18,0.30);
  --shadow-modal: 0 2px 6px rgba(40,30,18,0.08), 0 44px 80px -28px rgba(30,22,12,0.5);
  --shadow-well: inset 0 1px 2px rgba(40,30,18,0.14);
  color-scheme: light;
}
[data-theme="dark"] {
  --wall: #1a1918;
  --wall-shade: #121110;
  --plinth: #252321;
  --plinth-edge: #36322e;
  --ink: #f0ece5;
  --ink-soft: #aaa398;
  --rule: #35322e;
  --rule-strong: #7d776e;
  --accent: #dc9a8e;
  --accent-fill: #8c362e;
  --on-accent: #fbf7f1;
  --sage: #9dbba5;
  --spot: #f4dcb4;
  --floor: #000000b8;
  --gilt: #b8995f;
  --oak: #9a7650;
  --ebony: #0d0c0b;
  --focus: #e3a497;
  --shadow-lip: 0 1px 0 rgba(0,0,0,0.5);
  --shadow-rest: 0 1px 2px rgba(0,0,0,0.5), 0 8px 16px -8px rgba(0,0,0,0.7);
  --shadow-hang: 0 1px 1px rgba(0,0,0,0.6), 0 22px 30px -14px rgba(0,0,0,0.85);
  --shadow-lit: 0 1px 1px rgba(0,0,0,0.6), 0 34px 40px -16px rgba(0,0,0,0.95);
  --shadow-pop: 0 2px 4px rgba(0,0,0,0.5), 0 20px 40px -14px rgba(0,0,0,0.85);
  --shadow-modal: 0 2px 6px rgba(0,0,0,0.6), 0 44px 80px -24px rgba(0,0,0,0.95);
  --shadow-well: inset 0 1px 2px rgba(0,0,0,0.6);
  color-scheme: dark;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 40px;
  --space-7: 64px;
  --space-8: 112px;
  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-pill: 999px;
  --font-display: "Instrument Serif", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --font-body: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --type-display-family: var(--font-display);
  --type-display-size: 96px;
  --type-display-line: 0.92;
  --type-display-weight: 400;
  --type-display-tracking: -0.015em;
  --type-title-family: var(--font-display);
  --type-title-size: 48px;
  --type-title-line: 52px;
  --type-title-weight: 400;
  --type-title-tracking: -0.01em;
  --type-heading-family: var(--font-display);
  --type-heading-size: 28px;
  --type-heading-line: 34px;
  --type-heading-weight: 400;
  --type-lede-family: var(--font-display);
  --type-lede-size: 21px;
  --type-lede-line: 30px;
  --type-lede-weight: 400;
  --type-body-family: var(--font-body);
  --type-body-size: 15px;
  --type-body-line: 24px;
  --type-body-weight: 400;
  --type-ui-family: var(--font-body);
  --type-ui-size: 14px;
  --type-ui-line: 20px;
  --type-ui-weight: 500;
  --type-ui-tracking: 0.01em;
  --type-small-family: var(--font-body);
  --type-small-size: 13px;
  --type-small-line: 19px;
  --type-small-weight: 400;
  --type-catalogue-family: var(--font-body);
  --type-catalogue-size: 11px;
  --type-catalogue-line: 14px;
  --type-catalogue-weight: 600;
  --type-catalogue-tracking: 0.14em;
}
/* Type styles as utility classes (optional) */
.type-display { font-family: var(--type-display-family); font-size: var(--type-display-size); line-height: var(--type-display-line); font-weight: var(--type-display-weight); letter-spacing: var(--type-display-tracking); }
.type-title { font-family: var(--type-title-family); font-size: var(--type-title-size); line-height: var(--type-title-line); font-weight: var(--type-title-weight); letter-spacing: var(--type-title-tracking); }
.type-heading { font-family: var(--type-heading-family); font-size: var(--type-heading-size); line-height: var(--type-heading-line); font-weight: var(--type-heading-weight); }
.type-lede { font-family: var(--type-lede-family); font-size: var(--type-lede-size); line-height: var(--type-lede-line); font-weight: var(--type-lede-weight); }
.type-body { font-family: var(--type-body-family); font-size: var(--type-body-size); line-height: var(--type-body-line); font-weight: var(--type-body-weight); }
.type-ui { font-family: var(--type-ui-family); font-size: var(--type-ui-size); line-height: var(--type-ui-line); font-weight: var(--type-ui-weight); letter-spacing: var(--type-ui-tracking); }
.type-small { font-family: var(--type-small-family); font-size: var(--type-small-size); line-height: var(--type-small-line); font-weight: var(--type-small-weight); }
.type-catalogue { font-family: var(--type-catalogue-family); font-size: var(--type-catalogue-size); line-height: var(--type-catalogue-line); font-weight: var(--type-catalogue-weight); letter-spacing: var(--type-catalogue-tracking); }