:root {
  color-scheme: light;
  --surface: #fbfaf7;
  --surface-2: #f5f2ec;
  --raised: #fff;
  --raised-2: #edf1ff;
  --code-bg: #151825;
  --ink: #151724;
  --ink-soft: #464c5f;
  --subdued: #6b7284;
  --signal: #5b72de;
  --consent: #27a98a;
  --ember: #e06f5a;
  --hairline: rgba(21, 23, 36, 0.1);
  --hairline-2: rgba(21, 23, 36, 0.16);
  --code-str: #f2c879;
  --code-key: #aebcff;
  --code-dim: rgba(220, 225, 242, 0.48);
}

body.docs-light,
body.how-light,
body.legal-light {
  min-height: 100vh;
  background-color: var(--surface);
  background-image:
    radial-gradient(900px 520px at 88% -6%, rgba(91, 114, 222, 0.09), transparent 62%),
    linear-gradient(180deg, #fffdfa 0, var(--surface) 380px);
  background-attachment: fixed;
  color: var(--ink);
}

body.docs-light ::selection,
body.how-light ::selection,
body.legal-light ::selection {
  background: rgba(91, 114, 222, 0.22);
  color: var(--ink);
}

.docs-light h1,
.docs-light h2,
.docs-light h3,
.how-light h1,
.how-light h2,
.how-light h3,
.legal-light h1,
.legal-light h2,
.legal-light h3,
.legal-light strong {
  color: var(--ink);
}

.docs-light .peers-nav a:hover,
.how-light .peers-nav a:hover,
.legal-light .peers-nav a:hover {
  text-decoration: none;
}

/* Documentation */
.docs-light .toc a {
  color: var(--subdued);
}

.docs-light .toc a:hover {
  color: var(--ink);
  border-left-color: rgba(91, 114, 222, 0.42);
}

.docs-light .page-lede,
.docs-light .content p,
.docs-light .ref-desc,
.docs-light .ep-desc,
.docs-light .doc-figure figcaption {
  color: var(--subdued);
}

.docs-light .page-lede strong,
.docs-light .content strong,
.docs-light .content em {
  color: var(--ink-soft);
}

.docs-light .doc-figure img {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.docs-light .way,
.docs-light .ref {
  border-color: var(--hairline);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 22px 55px -44px rgba(31, 39, 68, 0.32);
}

.docs-light .way.rec {
  border-color: rgba(91, 114, 222, 0.3);
  background: linear-gradient(180deg, rgba(91, 114, 222, 0.07), #fff 58%);
}

.docs-light .mini li {
  color: var(--ink-soft);
}

.docs-light .mini li .n {
  background: #f0f3ff;
  border-color: rgba(91, 114, 222, 0.2);
}

.docs-light .content p code,
.docs-light li code,
.docs-light td code,
.docs-light .mini code,
.docs-light .stage .meta code {
  border-color: rgba(91, 114, 222, 0.14);
  background: #f0f3ff;
  color: var(--signal);
}

.docs-light .step::before {
  background: var(--surface);
}

.docs-light .callout {
  border-color: rgba(91, 114, 222, 0.2);
  background: #f4f6ff;
}

.docs-light pre {
  border-color: rgba(255, 255, 255, 0.1);
  background: var(--code-bg);
  box-shadow: 0 20px 42px -34px rgba(21, 24, 37, 0.65);
  color: #dfe4f4;
}

.docs-light pre .str {
  color: var(--code-str);
}

.docs-light pre .key {
  color: var(--code-key);
}

.docs-light pre .method {
  color: #8fa2ff;
}

.docs-light .ref-row:nth-child(even),
.docs-light .ep-row:nth-child(even) {
  background: rgba(91, 114, 222, 0.035);
}

.docs-light .ep-path,
.docs-light .ref-desc code {
  color: var(--ink-soft);
}

.docs-light footer,
.how-light footer,
.legal-light footer {
  border-color: var(--hairline);
}

/* How it works */
.how-light .lede,
.how-light .section-sub,
.how-light .stage p,
.how-light .stage .meta,
.how-light .checks li,
.how-light .quote,
.how-light .lvl p,
.how-light .row p,
.how-light .privacy p,
.how-light .flow-cap {
  color: var(--subdued);
}

.how-light .lede strong,
.how-light .checks strong {
  color: var(--ink);
}

.how-light .flow-wrap {
  border-color: var(--hairline);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 28px 70px -52px rgba(31, 39, 68, 0.38);
}

.how-light .flow-svg marker path {
  fill: rgba(21, 23, 36, 0.3);
}

.how-light .flow-svg g[stroke^="rgba(255"] {
  stroke: rgba(21, 23, 36, 0.2);
}

.how-light .flow-svg circle[fill="#14161F"] {
  fill: #fff;
}

.how-light .flow-svg circle[stroke^="rgba(255"] {
  stroke: rgba(21, 23, 36, 0.16);
}

.how-light .flow-svg text[fill="#A6ABC2"] {
  fill: var(--subdued);
}

.how-light .flow-svg text[fill="#ECEDF3"] {
  fill: var(--ink);
}

.how-light .stage-n,
.how-light .lvl,
.how-light .row,
.how-light .privacy {
  border-color: var(--hairline);
  background: rgba(255, 255, 255, 0.88);
}

.how-light .panel {
  border-color: rgba(91, 114, 222, 0.18);
  background:
    radial-gradient(120% 140% at 12% 0%, rgba(91, 114, 222, 0.1), transparent 56%),
    #fff;
  box-shadow: 0 26px 64px -48px rgba(31, 39, 68, 0.34);
}

.how-light .quote {
  background: #f5f6fb;
}

.how-light .stage .meta code {
  background: #f0f3ff;
  color: var(--ink-soft);
}

.how-light .btn-primary {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: linear-gradient(145deg, #282d40 0%, #151825 52%, #0b0d14 100%);
  box-shadow: 0 14px 32px rgba(21, 23, 36, 0.2);
  color: #fff;
}

.how-light .btn-primary:hover {
  background: linear-gradient(145deg, #303650 0%, #191d2c 52%, #0d1019 100%);
}

.how-light .btn-ghost {
  border-color: var(--hairline-2);
  background: rgba(255, 255, 255, 0.76);
  color: var(--ink);
}

/* Privacy and terms */
.legal-light main {
  position: relative;
}

.legal-light .updated,
.legal-light footer {
  color: var(--subdued);
}

.legal-light .lede,
.legal-light p,
.legal-light li {
  color: var(--ink-soft);
}

.legal-light .lede {
  border-color: var(--hairline);
}

.legal-light .highlight,
.legal-light .note {
  border-color: var(--hairline);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 22px 55px -46px rgba(31, 39, 68, 0.32);
  color: var(--ink-soft);
}

.legal-light .highlight {
  border-left-color: var(--consent);
}

.legal-light a {
  color: var(--signal);
}

.legal-light .peers-brand,
.legal-light .peers-nav-link {
  color: var(--peers-ink);
}

@media (max-width: 760px) {
  body.docs-light,
  body.how-light,
  body.legal-light {
    background-image:
      radial-gradient(640px 360px at 86% -4%, rgba(91, 114, 222, 0.08), transparent 62%),
      linear-gradient(180deg, #fffdfa 0, var(--surface) 300px);
  }
}