/* Homepage only: a luminous garden beneath the existing star chart. */
body.garden-page {
  isolation: isolate;
  background: #070b16;
}

.garden-page::before, .garden-page::after { display: none; }

.fractal-garden {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 4% 62%, #123b3959, transparent 47%),
    radial-gradient(ellipse at 96% 60%, #38265c66, transparent 48%),
    radial-gradient(ellipse at 52% 110%, #173b4455, transparent 60%),
    #070b16;
}

.fractal-garden::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/images/fractal-garden.svg') center bottom / cover no-repeat;
  opacity: .8;
}

.fractal-garden[data-ready]::before { opacity: 0; }
.fractal-garden canvas { display: block; width: 100%; height: 100%; }
.fractal-garden canvas[hidden] { display: none; }

/* A quiet center for the name and prose; the edges retain their light. */
.garden-page .hero-map::before {
  background:
    linear-gradient(180deg, #070b1622, transparent 30%, #070b1655),
    radial-gradient(ellipse at 34% 52%, #070b167a, transparent 68%);
}
.garden-page .constellation { opacity: .25; }
.garden-page .thread-wrap {
  background: linear-gradient(90deg, #070b162b, #070b16d9 24%, #070b16d9 76%, #070b162b);
}
.garden-page .hero-label { text-shadow: 0 2px 20px #070b16; }

.garden-motion {
  position: fixed;
  right: max(20px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 90;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid #c4a3fa30;
  border-radius: 24px;
  background: #080e1de8;
  color: #c9c7df;
  font: 400 11px/1.4 var(--ff-mono);
  cursor: pointer;
  transition: border-color .2s, color .2s;
}
.garden-motion[hidden] { display: none; }
.garden-motion:hover { color: #f2eefc; border-color: #c4a3fa80; }
.garden-motion:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.garden-motion svg { fill: none; stroke: currentColor; stroke-width: 1.5; }
.garden-motion-play { display: none; }
.garden-motion[aria-pressed="true"] .garden-motion-play { display: block; }
.garden-motion[aria-pressed="true"] .garden-motion-pause { display: none; }

@media (prefers-reduced-motion: reduce) {
  .garden-motion { display: none; }
}

@media (max-width: 700px) {
  .garden-page .hero-map::before {
    background: linear-gradient(180deg, #070b160d 15%, #070b1680 48%, #070b16b3);
  }
  .garden-page .thread-wrap { background: #070b16b8; }
  /* An icon-only circle so the control stops covering buttons and prose. */
  .garden-motion {
    right: 12px; bottom: max(12px, env(safe-area-inset-bottom));
    width: 44px; padding: 0;
    opacity: .7;
  }
  .garden-motion span {
    position: absolute; width: 1px; height: 1px; overflow: hidden;
    clip-path: inset(50%); white-space: nowrap;
  }
}