/* Explore Mode is opt-in; these rules are inert until body.is-explore-mode or #exploreMode.is-open. */
.explore-entry { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; margin: 10px 0 0; padding: 10px 12px; border: 0; color: var(--muted); background: transparent; font: 500 8px/1 var(--mono); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; transition: color .22s ease, transform .22s ease; }
.explore-entry span:last-child { color: var(--garden-gold); font-size: 11px; }
.explore-entry:hover, .explore-entry:focus-visible { color: var(--text); transform: translateX(3px); outline: none; }
.explore-entry:focus-visible { text-decoration: underline; text-underline-offset: 5px; }
.explore-mode { position: fixed; inset: 0; z-index: 10000; display: block; contain: strict; overflow: hidden; visibility: hidden; opacity: 0; pointer-events: none; background: radial-gradient(circle at 50% 44%, color-mix(in srgb, var(--garden-gold) 17%, transparent), transparent 33%), radial-gradient(circle at 18% 78%, color-mix(in srgb, var(--garden-leaf) 15%, transparent), transparent 35%), linear-gradient(145deg, color-mix(in srgb, var(--bg-deep) 95%, var(--garden-leaf)), var(--bg-deep)); }
.explore-mode.is-open { visibility: visible; pointer-events: auto; content-visibility: visible; }
.explore-mode:not(.is-open) { content-visibility: hidden; }
.explore-mode .explore-stage { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; opacity: 0; transform: scale(.975); overflow: hidden; }
.explore-mode .explore-stage::before, .explore-mode .explore-stage::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .42; }
.explore-mode .explore-stage::before { background-image: radial-gradient(circle at 22% 28%, color-mix(in srgb, var(--garden-gold) 72%, transparent) 0 1px, transparent 1.7px), radial-gradient(circle at 72% 20%, color-mix(in srgb, var(--garden-light) 55%, transparent) 0 1px, transparent 1.8px), radial-gradient(circle at 80% 72%, color-mix(in srgb, var(--garden-gold) 52%, transparent) 0 1px, transparent 1.6px); background-size: 260px 220px, 310px 270px, 370px 320px; }
.explore-mode .explore-stage::after { background: radial-gradient(ellipse at 50% 46%, transparent 0 31%, color-mix(in srgb, var(--garden-leaf) 9%, transparent) 58%, transparent 79%); filter: blur(15px); }
.explore-mode .explore-stage > .garden-stage { width: min(100%, 1240px); height: min(100%, 760px); margin: auto; z-index: 2; }
.explore-mode .explore-stage > .garden-stage .hero-bloom { filter: drop-shadow(0 25px 35px color-mix(in srgb, var(--garden-gold) 22%, transparent)); }
.explore-mode .botanical-world { position: absolute; inset: 0; z-index: 0; overflow: hidden; opacity: .98; }
.explore-mode .botanical-world::after { opacity: .78; transform: translate(-50%, -50%) scale(1.22); }
.explore-mode .garden-glow { opacity: .9; transform: scale(1.16); }
.explore-mode .garden-haze { opacity: .68; filter: blur(34px); }
.explore-mode .cursor-glow { position: absolute; z-index: 4; opacity: 0; }
.explore-mode .procedural-flora { opacity: calc(var(--flora-opacity) * 1.45); }
.explore-mode .procedural-flora.flora-far { translate: var(--living-far-x) var(--living-far-y); }
.explore-mode .procedural-flora.flora-mid { translate: var(--living-mid-x) var(--living-mid-y); }
.explore-mode .procedural-flora.flora-near { translate: var(--living-near-x) var(--living-near-y); }
.explore-mode .procedural-flora.flora-explore-reactive { pointer-events: auto; cursor: pointer; }
.explore-mode .procedural-flora.flora-explore-reactive:hover, .explore-mode .procedural-flora.flora-explore-reactive:focus-visible, .explore-mode .procedural-flora.flora-explore-reactive.is-bloomed { opacity: calc(var(--flora-opacity) * 1.9); filter: blur(0) drop-shadow(0 0 14px color-mix(in srgb, var(--garden-gold) 36%, transparent)); outline: none; }
.explore-controls { position: absolute; inset: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) auto max(18px, env(safe-area-inset-left)); z-index: 8; display: flex; align-items: center; justify-content: space-between; pointer-events: none; color: color-mix(in srgb, var(--text) 70%, transparent); font: 500 8px/1 var(--mono); letter-spacing: .18em; text-transform: uppercase; }
.explore-name { opacity: .58; }
.explore-exit { pointer-events: auto; min-width: 54px; min-height: 36px; padding: 0 12px; border: 1px solid color-mix(in srgb, var(--line-strong) 75%, transparent); border-radius: 999px; color: var(--text); background: color-mix(in srgb, var(--panel-solid) 48%, transparent); font: inherit; letter-spacing: .16em; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.explore-exit:hover, .explore-exit:focus-visible { border-color: var(--garden-gold); background: color-mix(in srgb, var(--garden-gold) 14%, var(--panel-solid)); transform: translateY(-2px); outline: none; }
.explore-release-petal { position: absolute; z-index: 7; width: 8px; height: 13px; border: 1px solid color-mix(in srgb, var(--garden-petal) 52%, transparent); border-radius: 100% 0 100% 0; background: color-mix(in srgb, var(--garden-petal) 44%, transparent); pointer-events: none; transform: translate(-50%, -50%); }
.explore-release-petal.is-released { opacity: 0; transform: translate(-50%, -50%) translateY(-30px) rotate(22deg); transition: opacity .62s ease, transform .62s ease; }
body.is-explore-mode > :not(#exploreMode) { opacity: 0; pointer-events: none; }
body.is-explore-mode { overflow: hidden; background: var(--bg-deep); }
@media (max-width:1199px) {
  .explore-mode .explore-stage > .garden-stage { height: min(100%, 650px); }
  .explore-mode .procedural-flora { opacity: calc(var(--flora-opacity) * 1.28); }
  .explore-mode .procedural-flora.flora-explore-reactive:hover, .explore-mode .procedural-flora.flora-explore-reactive:focus-visible, .explore-mode .procedural-flora.flora-explore-reactive.is-bloomed { opacity: calc(var(--flora-opacity) * 1.7); }
}
@media (max-width:600px) {
  .explore-entry { margin-top: 8px; min-height: 40px; padding: 11px 12px; font-size: 7px; }
  .explore-mode .explore-controls { inset: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) auto max(12px, env(safe-area-inset-left)); }
  .explore-name { display: none; }
  .explore-mode .explore-stage > .garden-stage { width: 100%; height: min(100%, 620px); }
  .explore-mode .garden-haze { filter: blur(26px); opacity: .54; }
  .explore-mode .procedural-flora { opacity: calc(var(--flora-opacity) * 1.18); }
  .explore-mode .procedural-flora:nth-child(n+5) { display: none; }
  .explore-mode .explore-stage::before { opacity: .24; background-size: 220px 190px, 280px 240px, 330px 290px; }
}
@media (prefers-reduced-motion:reduce) {
  .explore-entry, .explore-exit { transition: none; }
  .explore-mode, .explore-mode .explore-stage { transition: none; }
  .explore-mode .explore-stage::after { filter: none; }
  .explore-mode .procedural-flora.flora-explore-reactive:hover, .explore-mode .procedural-flora.flora-explore-reactive:focus-visible, .explore-mode .procedural-flora.flora-explore-reactive.is-bloomed { filter: none; }
}
