:root {
  --bg: var(--site-bg);
  --surface: color-mix(in srgb, var(--site-surface) 92%, white);
  --lift: color-mix(in srgb, var(--site-surface-strong) 94%, white);
  --border: var(--site-border);
  --border-strong: var(--site-border-strong);
  --gold: var(--site-gold);
  --gold-dim: var(--site-gold-soft);
  --gold-pale: color-mix(in srgb, var(--site-gold) 44%, white);
  --ash: var(--site-text-soft);
  --ember: var(--site-red);
  --text: var(--site-text);
  --text-dim: var(--site-text-soft);
  --text-ghost: var(--site-text-muted);

  --void: var(--site-bg);
  --deep: color-mix(in srgb, var(--site-surface) 90%, black);
  --mist: var(--site-text-muted);
  --ash-gray: var(--site-text-soft);
  --silver: var(--site-text);
  --light: var(--site-heading);
  --white: var(--site-heading);

  --signal: #5b7fbb;
  --signal2: #7090c4;
  --signal-dim: color-mix(in srgb, var(--signal) 44%, transparent);
  --rust: #9c472c;
  --sage: #4d7950;
  --violet: #70579e;
  --amber: #af7128;
  --amber-dim: #7e5220;
  --amber-glow: color-mix(in srgb, var(--amber) 10%, transparent);
  --amber-pale: #d6a356;
  --glow-signal: color-mix(in srgb, var(--signal) 10%, transparent);
  --glow-gold: color-mix(in srgb, var(--gold) 11%, transparent);

  --panel: color-mix(in srgb, var(--site-surface) 94%, white);
  --terminal: color-mix(in srgb, var(--site-surface-strong) 96%, black);
  --border2: var(--site-border-strong);
  --dim: color-mix(in srgb, var(--site-text-muted) 72%, transparent);
  --green-mid: #4e7b4d;
  --green-bright: #3f8c59;
  --green-pale: #264d30;
  --amber-ann: #9d7120;
  --red-warn: #8f3f2d;
  --text-main: var(--site-text);
  --text-bright: var(--site-heading);
  --text-ai: #4b6fa6;
  --scan-line: color-mix(in srgb, var(--green-mid) 8%, transparent);

  --tide-primary: #2c7b77;
  --tide-accent: #2c8f96;
  --tide-glow: color-mix(in srgb, var(--tide-accent) 14%, transparent);
  --veil-primary: #905235;
  --veil-accent: #be7041;
  --veil-glow: color-mix(in srgb, var(--veil-accent) 14%, transparent);
  --lattice-primary: #4b6e97;
  --lattice-accent: #5d8fc1;
  --lattice-glow: color-mix(in srgb, var(--lattice-accent) 14%, transparent);
  --root-primary: #5e7b42;
  --root-accent: #769e51;
  --root-glow: color-mix(in srgb, var(--root-accent) 14%, transparent);
  --ember-primary: #8a3e64;
  --ember-accent: #bd5f8b;
  --ember-glow: color-mix(in srgb, var(--ember-accent) 14%, transparent);

  --theme-quote-surface: color-mix(in srgb, var(--site-surface-muted) 82%, white);
  --theme-elevated-surface: color-mix(in srgb, var(--site-surface) 92%, white);
}

html[data-theme="dark"] {
  --gold-pale: #eedaa5;
  --signal: #9eb7db;
  --signal2: #b7cae5;
  --rust: #c7613e;
  --sage: #7da374;
  --violet: #9b86c2;
  --amber: #cb8938;
  --amber-dim: #996425;
  --amber-pale: #e7bb6b;

  --panel: color-mix(in srgb, var(--site-surface) 94%, black);
  --terminal: color-mix(in srgb, var(--site-surface-strong) 98%, black);
  --dim: color-mix(in srgb, var(--site-text-muted) 44%, transparent);
  --green-mid: #5f8d5d;
  --green-bright: #7ac57a;
  --green-pale: #d6ecd6;
  --amber-ann: #c89a33;
  --red-warn: #8d3a2b;
  --text-ai: #98bedf;

  --tide-primary: #347f81;
  --tide-accent: #69d3d0;
  --veil-primary: #8f5636;
  --veil-accent: #ec955e;
  --lattice-primary: #4d7298;
  --lattice-accent: #8abff0;
  --root-primary: #5d7d45;
  --root-accent: #a0cf71;
  --ember-primary: #8f3965;
  --ember-accent: #e873ad;
}

html[data-theme] body,
html[data-theme] .container,
html[data-theme] .page,
html[data-theme] .page-wrap,
html[data-theme] .sv-content,
html[data-theme] .archive-frame,
html[data-theme] .conflict-matrix {
  background: transparent;
  color: var(--text);
}

html[data-theme] .page,
html[data-theme] .page-wrap,
html[data-theme] .sv-content,
html[data-theme] .archive-frame,
html[data-theme] .content-grid,
html[data-theme] .conflict-matrix {
  color: var(--text);
}

html[data-theme] .page p,
html[data-theme] .page-wrap p,
html[data-theme] .sv-content p,
html[data-theme] .archive-frame p,
html[data-theme] li,
html[data-theme] dd,
html[data-theme] dt {
  color: var(--text);
}

html[data-theme] .preface,
html[data-theme] .annotations,
html[data-theme] .seal,
html[data-theme] .doc-header,
html[data-theme] .integrity,
html[data-theme] .terminal-window,
html[data-theme] .terminal-chrome,
html[data-theme] .belief-item,
html[data-theme] .tension-card,
html[data-theme] .conflict-block,
html[data-theme] .conflict-header,
html[data-theme] .object-rule,
html[data-theme] .glyph-card,
html[data-theme] .motif-card,
html[data-theme] .myth-card,
html[data-theme] .concept-card,
html[data-theme] .pull,
html[data-theme] .pull-quote,
html[data-theme] .color-swatch,
html[data-theme] .log-preamble,
html[data-theme] .combatant-tag {
  background: var(--theme-elevated-surface) !important;
  border-color: var(--border) !important;
  color: var(--text);
}

html[data-theme] .preface,
html[data-theme] .annotations {
  background: var(--theme-quote-surface) !important;
}

html[data-theme] .classification-bar {
  color: color-mix(in srgb, white 88%, var(--red-warn));
}

html[data-theme] .preface p,
html[data-theme] .ann-t,
html[data-theme] .ann-t em,
html[data-theme] .seal .quote,
html[data-theme] .doc-subtitle,
html[data-theme] .conflict-intro,
html[data-theme] .faction-epithet,
html[data-theme] .masthead-subtitle,
html[data-theme] .object-subtitle,
html[data-theme] .glyph-meaning,
html[data-theme] .subtitle,
html[data-theme] .intro,
html[data-theme] .preamble {
  color: var(--text-soft, var(--text-dim)) !important;
}

html[data-theme] .ann-t em {
  color: var(--gold-pale) !important;
}

html[data-theme] .doc-main-title,
html[data-theme] .masthead-title,
html[data-theme] .faction-name,
html[data-theme] .object-name,
html[data-theme] .arrangement-text h3,
html[data-theme] .chapter-title,
html[data-theme] h1,
html[data-theme] h2,
html[data-theme] h3 {
  color: var(--text-bright, var(--site-heading));
}

html[data-theme] .meta-row,
html[data-theme] .archive-id,
html[data-theme] .msg-time,
html[data-theme] .pause,
html[data-theme] .log-footer,
html[data-theme] .masthead-eyebrow,
html[data-theme] .masthead-note,
html[data-theme] .t-title,
html[data-theme] .swatch-hex,
html[data-theme] .object-number,
html[data-theme] .glyph-name,
html[data-theme] .arrangement-key,
html[data-theme] .section-label,
html[data-theme] .eyebrow,
html[data-theme] .overline,
html[data-theme] .sv-kicker {
  color: var(--text-dim) !important;
}

html[data-theme] .mb-ai {
  color: var(--text-ai) !important;
}

html[data-theme] .mb-ashes,
html[data-theme] .mv,
html[data-theme] .content-block p,
html[data-theme] .tension-card p,
html[data-theme] .conflict-body,
html[data-theme] .conflict-title,
html[data-theme] .page .closing-text,
html[data-theme] .page-wrap .closing-text,
html[data-theme] .sv-content .closing-text {
  color: var(--text) !important;
}

html[data-theme] .mk,
html[data-theme] .lv,
html[data-theme] .seal .bright,
html[data-theme] .cursor {
  color: var(--green-mid) !important;
  background-color: var(--green-mid);
}

html[data-theme] .cursor {
  background-color: var(--green-bright);
}

html[data-theme] .faction-nav,
html[data-theme] .conflict-header,
html[data-theme] .terminal-chrome {
  background: var(--theme-elevated-surface) !important;
}

html[data-theme] .faction-nav,
html[data-theme] .masthead,
html[data-theme] .faction-hero,
html[data-theme] .log-preamble,
html[data-theme] .msg-meta,
html[data-theme] .title-block,
html[data-theme] .conflict-header,
html[data-theme] .ann-head {
  border-color: var(--border) !important;
}

html[data-theme] .nav-tab {
  background: transparent;
  color: var(--text-dim);
}

html[data-theme] .nav-tab:hover {
  color: var(--text-bright);
}

html[data-theme] .nav-tab.active-conflict {
  color: var(--text-soft);
  border-bottom-color: var(--text-soft);
}

html[data-theme] .t-dot {
  background: var(--dim);
}

html[data-theme] .t-dot.on {
  background: var(--green-mid);
}

html[data-theme] .faction-quote,
html[data-theme] blockquote {
  background: var(--theme-quote-surface);
  color: var(--text);
}

html[data-theme] .color-swatch {
  box-shadow: 0 10px 24px color-mix(in srgb, var(--site-shadow) 28%, transparent);
}

html[data-theme] .motif-card svg,
html[data-theme] .symbol-diagram svg,
html[data-theme] .arrangement-diagram svg,
html[data-theme] .object-icon svg,
html[data-theme] .sigil,
html[data-theme] [class*="emblem"] svg {
  color: var(--text);
}

html[data-theme] .swatch-name,
html[data-theme] .motif-name,
html[data-theme] .faction-title,
html[data-theme] .tension-title,
html[data-theme] .card-title {
  color: var(--text-bright) !important;
}

html[data-theme] .faction-hero,
html[data-theme] .panel,
html[data-theme] .content-block,
html[data-theme] .objects-list,
html[data-theme] .glyph-grid,
html[data-theme] .arrangement-wrap {
  color: var(--text);
}

html[data-theme] .preface-label,
html[data-theme] .ann-head,
html[data-theme] .ann-n {
  color: var(--amber-ann) !important;
}

html[data-theme] .preface-sig {
  color: var(--amber-dim) !important;
}

html[data-theme] .sv-page-header,
html[data-theme] .doctrine-header,
html[data-theme] .hero,
html[data-theme] #gate,
html[data-theme] .masthead {
  border-color: var(--border) !important;
}

body[data-page="sha-vira-first-conversation"]::after {
  background: radial-gradient(
    ellipse at center,
    transparent 60%,
    color-mix(in srgb, var(--site-bg) 18%, transparent) 100%
  ) !important;
}

html[data-theme="dark"] body[data-page="sha-vira-first-conversation"]::after {
  background: radial-gradient(
    ellipse at center,
    transparent 55%,
    rgba(0, 0, 0, 0.45) 100%
  ) !important;
}