/* Procedural Fantasy Garden — additive flora language, intentionally scoped away from Gallery. */
.procedural-garden { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; contain: layout paint; }
.procedural-flora { position: absolute; left: var(--flora-x); top: var(--flora-y); width: var(--flora-size); height: var(--flora-size); opacity: var(--flora-opacity); filter: blur(var(--flora-blur)); transform: translate(-50%, -50%) rotate(var(--flora-rotation)); transform-origin: 50% 50%; will-change: translate; transition: opacity .6s ease; }
.procedural-flora.flora-inactive { display: none; }
.procedural-flora.flora-far { translate: var(--living-far-x) var(--living-far-y); z-index: 1; }
.procedural-flora.flora-mid { translate: var(--living-mid-x) var(--living-mid-y); z-index: 2; }
.procedural-flora.flora-near { translate: var(--living-near-x) var(--living-near-y); z-index: 3; }
.flora-form { position: absolute; inset: 0; display: block; transform: translateY(var(--flora-float-y, 0px)) rotate(var(--flora-sway, 0deg)); transform-origin: 50% 65%; }
.flora-petal { position: absolute; left: 50%; top: 50%; display: block; width: 27%; height: 58%; border: 1px solid color-mix(in srgb, var(--garden-petal) 34%, transparent); border-radius: 88% 25% 82% 18%; background: linear-gradient(145deg, color-mix(in srgb, var(--garden-petal) 48%, transparent), color-mix(in srgb, var(--garden-petal-deep) 24%, transparent) 72%, transparent); box-shadow: inset 4px 2px 8px color-mix(in srgb, var(--garden-light) 18%, transparent), inset -5px -7px 10px color-mix(in srgb, var(--garden-petal-deep) 24%, transparent); transform-origin: 50% 89%; transform: translate(-50%, -88%) rotate(var(--flora-petal-angle)) scale(var(--flora-petal-scale)); }
.flora-core { position: absolute; left: 50%; top: 50%; width: 18%; height: 18%; border: 1px solid color-mix(in srgb, var(--garden-gold) 64%, transparent); border-radius: 50%; background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--garden-light) 78%, transparent), color-mix(in srgb, var(--garden-gold) 78%, transparent) 45%, color-mix(in srgb, var(--garden-petal-deep) 58%, transparent)); box-shadow: 0 0 16px color-mix(in srgb, var(--garden-gold) 36%, transparent); transform: translate(-50%, -50%); }
.flora-moon .flora-petal { width: 32%; height: 68%; border-radius: 92% 17% 86% 22%; background: linear-gradient(155deg, color-mix(in srgb, var(--garden-light) 35%, transparent), color-mix(in srgb, var(--garden-petal) 52%, transparent) 54%, color-mix(in srgb, var(--garden-petal-deep) 30%, transparent)); }
.flora-moon .flora-core { width: 20%; height: 20%; }
.flora-orchid .flora-petal { width: 20%; height: 68%; border-radius: 75% 25% 100% 0; background: linear-gradient(120deg, transparent 8%, color-mix(in srgb, var(--garden-petal) 46%, transparent) 62%, color-mix(in srgb, var(--garden-leaf) 22%, transparent)); box-shadow: inset 2px 0 7px color-mix(in srgb, var(--garden-light) 24%, transparent); }
.flora-lily .flora-petal { width: 38%; height: 54%; border-radius: 100% 10% 100% 16%; background: linear-gradient(145deg, color-mix(in srgb, var(--garden-light) 32%, transparent), color-mix(in srgb, var(--garden-petal) 42%, transparent) 68%, transparent); }
.flora-nebula .flora-petal { width: 31%; height: 56%; border-radius: 64% 36% 88% 12%; background: linear-gradient(165deg, color-mix(in srgb, var(--garden-petal-deep) 42%, transparent), color-mix(in srgb, var(--garden-petal) 36%, transparent) 50%, color-mix(in srgb, var(--garden-leaf) 20%, transparent)); }
.flora-floating .flora-petal { width: 25%; height: 54%; border-radius: 100% 0 100% 0; }
.flora-crystal .flora-petal { width: 22%; height: 62%; border-radius: 65% 35% 55% 45%; background: linear-gradient(145deg, color-mix(in srgb, var(--garden-light) 28%, transparent), color-mix(in srgb, var(--garden-leaf) 24%, transparent) 58%, transparent); clip-path: polygon(50% 0, 100% 72%, 50% 100%, 0 72%); }
.flora-wild .flora-petal { width: 19%; height: 46%; border-radius: 100% 0 100% 0; background: linear-gradient(145deg, color-mix(in srgb, var(--garden-light) 26%, transparent), color-mix(in srgb, var(--garden-leaf) 30%, transparent)); }
.flora-wild .flora-core, .flora-crystal .flora-core { width: 14%; height: 14%; }
:root[data-world-section='home'] .flora-near, :root:not([data-world-section]) .flora-near { opacity: calc(var(--flora-opacity) * 1.16); }
:root[data-world-section='archive'] .flora-near { opacity: calc(var(--flora-opacity) * .72); }
:root[data-world-section='works'] .flora-near { opacity: calc(var(--flora-opacity) * 1.05); }
:root[data-world-section='gallery'] .flora-near, :root[data-world-section='gallery'] .flora-mid { opacity: calc(var(--flora-opacity) * 1.14); }
:root[data-world-section='notes'] .procedural-flora, :root[data-world-section='tools'] .procedural-flora { opacity: calc(var(--flora-opacity) * .62); }
:root[data-world-section='vault'] .flora-far, :root[data-world-section='space'] .flora-far { opacity: calc(var(--flora-opacity) * .78); }
@media (max-width:1199px) {
  .procedural-flora { will-change: auto; }
  .procedural-flora.flora-near { translate: var(--living-near-x) var(--living-near-y); }
}
@media (max-width:600px) {
  .procedural-flora { filter: blur(max(0px, calc(var(--flora-blur) * .5))); will-change: auto; }
  .procedural-flora.flora-near { translate: var(--living-near-x) var(--living-near-y); }
  .procedural-flora:nth-child(n+7) { display: none; }
  .flora-form { transform: none; }
  .flora-petal { box-shadow: none; }
}
@media (prefers-reduced-motion:reduce) {
  .procedural-flora, .flora-form { translate: none; transform: translate(-50%, -50%) rotate(var(--flora-rotation)); transition: none; will-change: auto; }
  .flora-form { transform: none; }
}