:root {
  --mycelium-cream: var(--light-brown, #f3eac3);
  --mycelium-moss: var(--green, #558300);
  --mycelium-glow: var(--lighter-green, #cef591);
  --mycelium-gold: var(--highlight-accent, #fbc730);
  --mycelium-cap: var(--goofy, #8a46af);
  --mycelium-ink: rgba(40, 39, 35, 0.78);
  --mycelium-whisper: var(--mycelium-cream);
}

.mycelium {
  position: fixed;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.42;
  transition: opacity 1.4s ease, filter 1.4s ease;
  filter: saturate(0.85);
}
.mycelium canvas {
  display: block;
  width: 100%;
  height: 100%;
  mix-blend-mode: overlay;
}
.mycelium.is-blooming {
  opacity: 0.72;
  z-index: 28;
  filter: saturate(1);
}
.mycelium.is-blooming canvas {
  mix-blend-mode: screen;
  mix-blend-mode: plus-lighter;
}
.mycelium.is-surfaced {
  opacity: 1;
  z-index: 36;
  filter: saturate(1.05);
}
.mycelium.is-surfaced canvas {
  mix-blend-mode: screen;
  mix-blend-mode: plus-lighter;
}

.home .mycelium,
.now-playing-page .mycelium,
.fungus-decisions-page .mycelium,
.map-page .mycelium {
  opacity: 0.5;
}
.home .mycelium canvas,
.now-playing-page .mycelium canvas,
.fungus-decisions-page .mycelium canvas,
.map-page .mycelium canvas {
  mix-blend-mode: screen;
}
.home .mycelium.is-blooming,
.home .mycelium.is-surfaced,
.now-playing-page .mycelium.is-blooming,
.now-playing-page .mycelium.is-surfaced,
.fungus-decisions-page .mycelium.is-blooming,
.fungus-decisions-page .mycelium.is-surfaced,
.map-page .mycelium.is-blooming,
.map-page .mycelium.is-surfaced {
  opacity: 1;
}
.home .mycelium.is-blooming canvas,
.home .mycelium.is-surfaced canvas,
.now-playing-page .mycelium.is-blooming canvas,
.now-playing-page .mycelium.is-surfaced canvas,
.fungus-decisions-page .mycelium.is-blooming canvas,
.fungus-decisions-page .mycelium.is-surfaced canvas,
.map-page .mycelium.is-blooming canvas,
.map-page .mycelium.is-surfaced canvas {
  mix-blend-mode: screen;
}

.journal .mycelium,
.shop .mycelium,
.newsletter-issue-page .mycelium,
#journal-flipbook .mycelium {
  opacity: 0.58;
}
.journal .mycelium canvas,
.shop .mycelium canvas,
.newsletter-issue-page .mycelium canvas,
#journal-flipbook .mycelium canvas {
  mix-blend-mode: multiply;
}
.journal .mycelium.is-blooming,
.journal .mycelium.is-surfaced,
.shop .mycelium.is-blooming,
.shop .mycelium.is-surfaced,
.newsletter-issue-page .mycelium.is-blooming,
.newsletter-issue-page .mycelium.is-surfaced,
#journal-flipbook .mycelium.is-blooming,
#journal-flipbook .mycelium.is-surfaced {
  opacity: 1;
  filter: saturate(1.15);
}
.journal .mycelium.is-blooming canvas,
.journal .mycelium.is-surfaced canvas,
.shop .mycelium.is-blooming canvas,
.shop .mycelium.is-surfaced canvas,
.newsletter-issue-page .mycelium.is-blooming canvas,
.newsletter-issue-page .mycelium.is-surfaced canvas,
#journal-flipbook .mycelium.is-blooming canvas,
#journal-flipbook .mycelium.is-surfaced canvas {
  mix-blend-mode: normal;
}

.journal .mycelium-whisper,
.shop .mycelium-whisper,
#journal-flipbook .mycelium-whisper {
  color: var(--dark-brown, #282723);
  text-shadow: 0 0 12px var(--mycelium-glow), 0 0 22px rgba(251, 199, 48, 0.45);
}

.journal .hypha-word.is-blooming,
.shop .hypha-word.is-blooming {
  text-shadow: 0 0 8px var(--mycelium-glow), 0 0 16px rgba(85, 131, 0, 0.45);
}

.mycelium-whisper {
  position: absolute;
  left: 50%;
  top: 46%;
  max-width: min(22rem, 78vw);
  padding: 0 0.4rem;
  transform: translate(-50%, -50%);
  font-family: "Lora", "Georgia", serif;
  font-style: italic;
  font-size: clamp(0.92rem, 2.1vw, 1.18rem);
  line-height: 1.45;
  letter-spacing: 0.08em;
  color: var(--mycelium-whisper);
  text-align: center;
  text-shadow: 0 0 10px var(--mycelium-glow), 0 0 28px rgba(138, 70, 175, 0.35), 0 1px 0 var(--mycelium-ink);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.9s ease, visibility 0.9s ease, letter-spacing 2.4s ease;
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.mycelium-whisper.is-visible {
  opacity: 0.92;
  visibility: visible;
  letter-spacing: 0.16em;
  white-space: normal;
}

.hypha-word {
  background: none;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  border-radius: 0.15em;
  box-shadow: none;
  text-decoration: none;
  color: inherit;
  cursor: default;
  transition: text-shadow 0.9s ease, color 0.9s ease;
}
.hypha-word.is-blooming {
  color: inherit;
  text-shadow: 0 0 8px var(--mycelium-glow), 0 0 18px rgba(243, 234, 195, 0.45);
}

@media (prefers-reduced-motion: reduce) {
  .mycelium {
    opacity: 0.18;
    transition: none;
  }
  .mycelium.is-blooming,
  .mycelium.is-surfaced {
    opacity: 0.22;
    z-index: 6;
  }
  .mycelium-whisper,
  .hypha-word {
    transition: none;
  }
  .mycelium-whisper.is-visible {
    letter-spacing: 0.08em;
  }
}
