:root {
  --color-background: #24232c;
  --color-panel: #33313e;
  --color-text: #f2ede5;
  --color-secondary: var(--color-muted);
  --color-secondary-text: var(--color-muted);
  --color-muted: #b4aebf;
  --color-accent: #d4b78f;
  --color-border: color-mix(in srgb, var(--color-text) 28%, transparent);
  --ink: var(--color-background);
  --deep: var(--color-panel);
  --sea: var(--color-secondary);
  --mist: var(--color-secondary-text);
  --paper: var(--color-text);
  --brass: var(--color-accent);
  --salt: var(--color-muted);

  --border-button-border: 1px solid
    color-mix(in srgb, var(--color-border) 25%, transparent);
  --surface-button-background: color-mix(
    in srgb,
    var(--color-panel) 70%,
    transparent
  );
  --surface-button-hover-background: var(--color-panel);
  --border-button-hover-border-color: color-mix(
    in srgb,
    var(--color-border) 56%,
    transparent
  );
  --surface-button-primary-hover-background: color-mix(
    in srgb,
    var(--color-text) 95%,
    var(--color-accent)
  );
  --surface-scene-shade-background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--color-panel) 88%, transparent) 0%,
      color-mix(in srgb, var(--color-panel) 58%, transparent) 38%,
      color-mix(in srgb, var(--color-panel) 19%, transparent) 70%,
      color-mix(in srgb, var(--color-panel) 25%, transparent)
    ),
    linear-gradient(
      0deg,
      color-mix(in srgb, var(--color-panel) 85%, transparent),
      transparent 40%
    );
  --shadow-title-main-h1-text-shadow: 0 4px 35px var(--color-background);
  --border-title-nav-button-border-color: color-mix(
    in srgb,
    var(--color-border) 16%,
    transparent
  );
  --surface-title-nav-button-background: color-mix(
    in srgb,
    var(--color-panel) 47%,
    transparent
  );
  --text-title-decoration-color: color-mix(
    in srgb,
    var(--color-muted) 80%,
    transparent
  );
  --border-title-footer-border-top: 1px solid
    color-mix(in srgb, var(--color-border) 17%, transparent);
  --border-story-header-border-bottom: 1px solid
    color-mix(in srgb, var(--color-border) 19%, transparent);
  --surface-story-header-background: color-mix(
    in srgb,
    var(--color-panel) 40%,
    transparent
  );
  --text-scene-caption-color: color-mix(
    in srgb,
    var(--color-muted) 61%,
    transparent
  );
  --text-scene-caption-eyebrow-color: var(--color-muted);
  --filter-portrait-filter: drop-shadow(
    0 15px 15px color-mix(in srgb, var(--color-background) 31%, transparent)
  );
  --surface-dialogue-panel-background: linear-gradient(
    110deg,
    color-mix(in srgb, var(--color-panel) 94%, transparent),
    color-mix(in srgb, var(--color-panel) 95%, transparent)
  );
  --border-dialogue-panel-border: 1px solid
    color-mix(in srgb, var(--color-border) 36%, transparent);
  --shadow-dialogue-panel-box-shadow: 0 18px 80px
    color-mix(in srgb, var(--color-background) 31%, transparent);
  --text-dialogue-counter-color: var(--color-muted);
  --text-dialogue-bottom-color: var(--color-muted);
  --surface-story-tools-background: color-mix(
    in srgb,
    var(--color-panel) 40%,
    transparent
  );
  --border-story-tools-button-aria-pressed-true-border-color: color-mix(
    in srgb,
    var(--color-border) 33%,
    transparent
  );
  --text-key-hint-color: color-mix(
    in srgb,
    var(--color-muted) 48%,
    transparent
  );
  --surface-choice-panel-background: color-mix(
    in srgb,
    var(--color-panel) 92%,
    transparent
  );
  --border-choice-panel-border: 1px solid
    color-mix(in srgb, var(--color-border) 36%, transparent);
  --shadow-choice-panel-box-shadow: 0 20px 60px
    color-mix(in srgb, var(--color-background) 30%, transparent);
  --surface-story-choice-background: color-mix(
    in srgb,
    var(--color-panel) 33%,
    transparent
  );
  --border-story-choice-border-color: color-mix(
    in srgb,
    var(--color-border) 27%,
    transparent
  );
  --surface-game-shell-background: color-mix(
    in srgb,
    var(--color-panel) 96%,
    transparent
  );
  --border-game-shell-border: 1px solid
    color-mix(in srgb, var(--color-border) 44%, transparent);
  --shadow-game-shell-box-shadow: 0 20px 80px
    color-mix(in srgb, var(--color-background) 38%, transparent);
  --color-game-shell-scrollbar-color: var(--color-panel) var(--color-panel);
  --border-game-heading-border-bottom: 1px solid
    color-mix(in srgb, var(--color-border) 17%, transparent);
  --border-tag-border: 1px solid
    color-mix(in srgb, var(--color-border) 33%, transparent);
  --border-game-footer-border-top: 1px solid
    color-mix(in srgb, var(--color-border) 17%, transparent);
  --surface-log-card-background: color-mix(
    in srgb,
    var(--color-panel) 50%,
    transparent
  );
  --border-log-card-border: 1px solid
    color-mix(in srgb, var(--color-border) 27%, transparent);
  --text-log-card-h3-color: var(--color-muted);
  --surface-meter-track-background: var(--color-panel);
  --border-allocation-row-border-bottom: 1px solid
    color-mix(in srgb, var(--color-border) 16%, transparent);
  --surface-modal-backdrop-background: color-mix(
    in srgb,
    var(--color-panel) 81%,
    transparent
  );
  --surface-modal-panel-background: var(--color-panel);
  --border-modal-panel-border: 1px solid
    color-mix(in srgb, var(--color-border) 42%, transparent);
  --shadow-modal-panel-box-shadow: 0 30px 80px
    color-mix(in srgb, var(--color-background) 50%, transparent);
  --color-modal-panel-scrollbar-color: var(--color-panel) var(--color-panel);
  --surface-modal-close-background: var(--color-panel);
  --surface-menu-grid-button-background: var(--color-panel);
  --surface-save-slot-background: var(--color-panel);
  --border-save-slot-border: 1px solid
    color-mix(in srgb, var(--color-border) 25%, transparent);
  --surface-save-slot-first-child-background: var(--color-panel);
  --border-export-row-button-border: 1px solid
    color-mix(in srgb, var(--color-border) 25%, transparent);
  --surface-export-row-button-background: var(--color-panel);
  --border-history-list-article-border-bottom: 1px solid
    color-mix(in srgb, var(--color-border) 17%, transparent);
  --surface-state-row-span-background: var(--color-panel);
  --surface-relation-grid-div-background: var(--color-panel);
  --surface-clue-background: color-mix(
    in srgb,
    var(--color-panel) 48%,
    transparent
  );
  --border-ending-grid-article-border: 1px solid
    color-mix(in srgb, var(--color-border) 23%, transparent);
  --surface-ending-grid-article-background: var(--color-panel);
  --border-ending-grid-article-unlocked-border-color: color-mix(
    in srgb,
    var(--color-border) 50%,
    transparent
  );
  --border-ending-card-border: 1px solid
    color-mix(in srgb, var(--color-border) 40%, transparent);
  --surface-ending-card-background: color-mix(
    in srgb,
    var(--color-panel) 91%,
    transparent
  );
  --shadow-ending-card-box-shadow: 0 30px 80px
    color-mix(in srgb, var(--color-background) 44%, transparent);
  --shadow-toast-box-shadow: 0 5px 40px
    color-mix(in srgb, var(--color-background) 40%, transparent);
}