body.home, body.themed {
  --canvas: #0d0912;
  --surface: #171020;
  --elevated: #24152d;
  --cool-surface: #101b26;
  --text-primary: #f7f1fa;
  --text-muted: #b9a9c5;
  --border: #392842;
  --accent-pink: #f8217e;
  --accent-cyan: #22d0f2;
  --accent-light: #ff8ecb;
  color-scheme: dark;
  background: var(--surface);
  color: var(--text-muted);
}
body.home footer, body.themed footer {
  background: var(--canvas);
  border-top: 1px solid var(--border);
  color: var(--text-muted);
}
body.home footer a, body.home footer a:visited, body.themed footer a, body.themed footer a:visited {
  color: var(--accent-light);
}
body.home footer a:hover, body.themed footer a:hover {
  color: var(--accent-cyan);
}
body.home footer a:focus-visible, body.themed footer a:focus-visible {
  outline: 2px solid var(--accent-cyan);
  outline-offset: 4px;
}
body.home footer .avatar, body.themed footer .avatar {
  background: var(--elevated);
}

body.themed main h1, body.themed main h2, body.themed main h3, body.themed main h4, body.themed main h5, body.themed main h6 {
  color: var(--text-primary);
  letter-spacing: -0.035em;
}
body.themed main h1 {
  border-color: var(--border);
}
body.themed main a, body.themed main a:visited {
  color: var(--accent-light);
  text-underline-offset: 4px;
}
body.themed main a:hover {
  color: var(--accent-cyan);
}
body.themed main a:focus-visible {
  outline: 2px solid var(--accent-cyan);
  outline-offset: 4px;
}
body.themed main code {
  color: #ffb9dd;
  font-family: "Fira Mono", monospace;
  font-size: 0.85em;
}
body.themed main pre {
  background: var(--canvas);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: auto;
  line-height: 1.75;
}
body.themed main pre code {
  color: var(--text-primary);
}
body.themed main .side-note {
  background: var(--elevated);
  border-color: var(--border);
}
body.themed main .page-intro {
  color: var(--text-muted);
}
body.themed main .page-intro .emphasis {
  color: var(--accent-light);
}
body.themed main hr {
  border: 0;
  border-top: 1px solid var(--border);
}

body.nest-page .nest-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
  width: 100%;
  min-height: clamp(260px, 33.333svh, 480px);
  padding: 32px 24px;
  background: var(--canvas);
}
body.nest-page .nest-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 82%, rgba(255, 174, 41, 0.1098039216), transparent 38%), radial-gradient(ellipse at 38% 48%, rgba(34, 208, 242, 0.0666666667), transparent 48%), radial-gradient(ellipse at 60% 42%, rgba(177, 44, 208, 0.168627451), transparent 50%), radial-gradient(ellipse at 48% 58%, rgba(248, 33, 126, 0.0862745098), transparent 60%);
}
body.nest-page .nest-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(var(--canvas), transparent 12%, transparent 90%, var(--canvas));
}
body.nest-page .nest-atmosphere {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
body.nest-page .nest-stage {
  position: absolute;
  inset: 16px 24px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.nest-page .nest-centerpiece {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 0 7px rgba(177, 44, 208, 0.3019607843)) drop-shadow(0 12px 14px rgba(0, 0, 0, 0.5333333333));
}
body.nest-page main {
  box-sizing: border-box;
  width: 100%;
  max-width: 1200px;
  padding: 24px 40px 88px;
}
body.nest-page .nest-overview-tagline {
  margin: 24px 0 40px;
  color: var(--accent-light);
  font-size: clamp(24px, 2.2vw, 28px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.025em;
  text-align: center;
  text-wrap: balance;
}
@media (max-width: 799px) {
  body.nest-page .section-nav-links a {
    padding-inline: 12px;
  }
  body.nest-page .section-nav-links a[aria-current]::after {
    left: 12px;
    right: 12px;
  }
}
body.nest-page #what-is-it {
  font-size: 21px;
  line-height: 1.8;
}
body.nest-page .emphasis {
  color: var(--accent-light);
  font-weight: 600;
}
body.nest-page #get-started {
  margin-top: 56px;
}
body.nest-page #get-started h2 {
  margin-top: 0;
  font-size: 34px;
}
@media (max-width: 760px) and (orientation: portrait) {
  body.nest-page .nest-hero {
    min-height: clamp(300px, 60svh, 640px);
  }
  body.nest-page .nest-stage {
    inset: 24px 12px;
    transform: translateY(clamp(0px, (100% - (100vw - 24px) * 896 / 1755) / 2, 25%));
  }
}
@media (max-height: 500px) and (orientation: landscape) {
  body.nest-page .nest-hero {
    min-height: 50svh;
    padding: 24px;
  }
}
@media (max-width: 600px) {
  body.nest-page main {
    padding: 16px 24px 64px;
  }
  body.nest-page #what-is-it {
    font-size: 18px;
  }
  body.nest-page #get-started {
    margin-top: 40px;
  }
}