:root {
  --night: #f4f2ed;
  --night-soft: #ffffff;
  --ice: #20201f;
  --ice-bright: #090909;
  --glacier: #3d3d3a;
  --muted: #5b5a56;
  --line: rgba(20, 20, 19, 0.2);
  --ambient-one: transparent;
  --ambient-two: transparent;
  --grid-line: rgba(20, 20, 19, 0.022);
  --record-bg: rgba(20, 20, 19, 0.045);
  --faint-line: rgba(20, 20, 19, 0.14);
}

:root[data-theme="dark"] {
  --night: #101010;
  --night-soft: #171717;
  --ice: #e8e6e1;
  --ice-bright: #ffffff;
  --glacier: #c7c5bf;
  --muted: #aaa8a2;
  --line: rgba(255, 255, 255, 0.2);
  --ambient-one: transparent;
  --ambient-two: transparent;
  --grid-line: rgba(255, 255, 255, 0.018);
  --record-bg: rgba(255, 255, 255, 0.045);
  --faint-line: rgba(255, 255, 255, 0.13);
}

body { background: var(--night); }

.storyCover { background: #d5d0c6; }

.storyCover img {
  width: 100%;
  height: auto;
}

.storyEyebrow,
.storyEnd,
.prose .record,
.prose p:first-child::first-letter {
  color: var(--glacier);
}

.storyEyebrow::before { background: var(--glacier); }

.prose .record { border-left-color: var(--glacier); }

.storyFooter a:hover,
.storyFooter a:focus-visible { color: var(--ice-bright); }