/* Approved subdued gradient, based on the Figma background at node 1750:30. */
:root {
  --bg: #292765;
  --page-gradient: radial-gradient(ellipse 37% 31% at 76% 25%,#7661b6 0%,#6655aaa6 38%,#6655aa00 100%),
  radial-gradient(ellipse 47% 39% at 97% 89%,#354c92 0%,#39459480 47%,#39459400 100%),
  radial-gradient(ellipse 58% 32% at 48% 103%,#662286 0%,#5c207dc9 39%,#5c207d00 100%),
  radial-gradient(ellipse 38% 48% at -8% 95%,#4e187f 0%,#461b7f99 54%,#461b7f00 100%),
  radial-gradient(ellipse 49% 39% at 36% 58%,#242758 0%,#252759d9 39%,#25275900 100%),
  radial-gradient(ellipse 52% 49% at 101% -4%,#2d5598 0%,#32469aad 53%,#32469a00 100%),
  radial-gradient(ellipse 54% 57% at -9% 15%,#3e1f76 0%,#3b207680 49%,#3b207600 100%),
  linear-gradient(145deg,#2f2f83 4%,#323184 39%,#382873 70%,#403890 100%);
}

body {
  background: var(--bg);
  isolation: isolate;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: var(--page-gradient);
}

/* Let the same background continue through the sticky header. */
header {
  background: #171837b8;
}

/* Secondary labels sit directly on the brighter page background. */
.page-heading .eyebrow,
.demo,
.section-heading p,
.section-heading > button,
.feed-tabs button,
.sort,
.sort select,
.rail-labels,
.rank,
.topic-name small,
.trend-name small,
.live,
.disclaimer,
footer,
footer > a:last-child {
  color: #d4d2eb;
}
