:root {
  color-scheme: light;
  --tn-base: #f8f5f0;
  --tn-paper: #fffdf9;
  --card: rgba(255,253,250,.88);
  --tn-text: #181a2c;
  --tn-muted: #596176;
  --tn-accent: #69468b;
  --tn-soft: #efe7f6;
  --accent-border: #d8c5e9;
  --tn-border: #e3dcd5;
  --shadow-card: 0 5px 22px rgba(43,30,28,.035);
  --shadow-card-hover: 0 10px 26px rgba(43,30,28,.09);
  --closing-floor: #302535;
  --button-primary-bg: #69468b;
  --button-primary-hover: #583772;
  --button-primary-text: #fff;
  --button-secondary-bg: color-mix(in srgb,var(--tn-paper) 87%,transparent);
  --footer-text: #d7cbdc;
  --footer-border: #a088a345;
  --footer-focus: #e4c9f7;
}
:root[data-theme=dark] {
  color-scheme: dark;
  --tn-base: #19181f;
  --tn-paper: #232129;
  --card: rgba(37,34,43,.93);
  --tn-text: #f3eee6;
  --tn-muted: #b6afbd;
  --tn-accent: #c5a5e1;
  --tn-soft: #392e45;
  --accent-border: #645073;
  --tn-border: #443b49;
  --shadow-card: 0 8px 28px rgba(8,6,10,.12);
  --shadow-card-hover: 0 12px 30px rgba(8,6,10,.24);
  --closing-floor: #211b27;
}

:root { --tn-gutter: 32px; }
@media (max-width:600px) { :root { --tn-gutter:20px; } }

/* Visitor preference takes precedence over an editor style variation. */
:root[data-theme=light] {
  color-scheme: light;
  --tn-base: #f8f5f0;
  --tn-paper: #fffdf9;
  --card: rgba(255,253,250,.88);
  --tn-text: #181a2c;
  --tn-muted: #596176;
  --tn-accent: #69468b;
  --tn-soft: #efe7f6;
  --accent-border: #d8c5e9;
  --tn-border: #e3dcd5;
  --shadow-card: 0 5px 22px rgba(43,30,28,.035);
  --shadow-card-hover: 0 10px 26px rgba(43,30,28,.09);
  --closing-floor: #302535;
  --button-primary-bg: #69468b;
  --button-primary-hover: #583772;
  --button-primary-text: #fff;
  --button-secondary-bg: color-mix(in srgb,var(--tn-paper) 87%,transparent);
  --footer-text: #d7cbdc;
  --footer-border: #a088a345;
  --footer-focus: #e4c9f7;
}