/* The canvas never owns input, layout or navigation. */
#petal-atmosphere{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:0;contain:strict}
#petal-atmosphere canvas{display:block;width:100%;height:100%;pointer-events:none}
#petal-atmosphere:before{content:"";position:absolute;inset:-10%;background:radial-gradient(ellipse at 87% 4%,rgba(208,153,91,.17),transparent 39%),radial-gradient(ellipse at 0% 78%,rgba(117,61,30,.10),transparent 38%);pointer-events:none}
body:has(#heartZone) #petal-atmosphere{z-index:12}
body:not(:has(#heartZone))>#app{position:relative;z-index:1}
html[data-atmosphere="off"] #petal-atmosphere{visibility:hidden}
.petals-ready .sparkle-field,.petals-ready #ambient{display:none}
body:has(#heartZone) #lyrics{z-index:15}
.petals-ready #bridge,.petals-ready #postContinue{background:transparent}
.petals-ready #bridgeText{position:relative;z-index:2;text-shadow:0 3px 18px #000,0 0 45px #000}
.petals-ready #cover{background:radial-gradient(ellipse at 50% 45%,#110b06 0%,#060301 58%)}
.petals-ready .heart-svg{filter:drop-shadow(0 0 15px rgba(192,122,62,.22)) drop-shadow(0 0 55px rgba(115,63,25,.13))}
.petals-ready .heart-zone{isolation:isolate}
.petals-ready #postContinueBtn{background:rgba(8,5,3,.65);backdrop-filter:blur(8px)}
.petals-ready .screen{isolation:isolate}
.petals-ready .riddle,.petals-ready .guide-copy,.petals-ready .guide-title,.petals-ready .eyebrow{ text-shadow:0 2px 14px #080706,0 0 26px #080706 }
.petals-ready .guide-copy{color:#c7b7a0}
.petals-ready .guide-step.is-past .guide-copy{opacity:.9}
.petals-ready .guide-node{box-shadow:0 0 22px rgba(234,169,94,.2);border-color:rgba(229,167,95,.8)}
.petals-ready .guide-step.is-visible:not(.is-past) .guide-node{animation:nodeGlow 2.4s ease-in-out infinite}
.petals-ready .guide-steps:before{background:linear-gradient(180deg,transparent,rgba(222,161,89,.34) 12%,rgba(222,161,89,.34) 88%,transparent)}
.petals-ready .narration-player{background:linear-gradient(120deg,rgba(38,24,14,.8),rgba(8,7,6,.68));backdrop-filter:blur(8px)}
.petals-ready .photo{background:rgba(8,7,6,.8)}
.petals-ready .photo.reveal{animation:photoArrive 1.1s cubic-bezier(.22,1,.36,1) both}
.petals-ready .page-transition{transition:opacity .8s ease,transform 1s cubic-bezier(.22,1,.36,1),filter .8s ease}
.petals-ready .hint{font-size:14px}
.petals-ready .hand-wrap{width:32px;height:38px}
@keyframes nodeGlow{50%{box-shadow:0 0 28px rgba(234,169,94,.38);border-color:#ebc48e}}
@keyframes photoArrive{from{opacity:0;filter:blur(5px);transform:translateY(12px) scale(.985)}to{opacity:1;filter:none;transform:none}}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
 .petals-ready .page-transition,.petals-ready #bridgeText{transition:opacity .15s!important}
}
/* Final loading gate and shared cinematic layer. */
#loadingScreen{position:fixed;inset:0;z-index:200000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(ellipse at 90% 0%,#21150b 0%,#080604 55%);color:#dec09b;text-align:center;transition:opacity .65s ease;touch-action:none}
#loadingScreen.leaving{opacity:0;pointer-events:none}
.loading-heart{font:400 76px/1 Georgia,serif;color:#cf9b61;text-shadow:0 0 22px rgba(185,119,55,.24);animation:loadingPulse 1.7s ease-in-out infinite}
#loadingMessage{display:none}
#loadingProgress{font:400 13px Georgia,serif;color:#ad8a60;letter-spacing:.15em}
#loadingRetry{position:absolute;inset:0;border:0;background:transparent;cursor:pointer}
.is-loading #app,.is-loading #prologueHost,.is-loading #petal-atmosphere{visibility:hidden;pointer-events:none}
.is-loading #app *{animation-play-state:paused!important}
#petal-atmosphere,body:has(#heartZone) #petal-atmosphere{z-index:100002}
#petal-atmosphere canvas{position:relative;z-index:1}
#petal-atmosphere:before{z-index:2;background:linear-gradient(135deg,transparent 30%,rgba(197,146,81,.035) 58%,transparent 73%),radial-gradient(ellipse at 100% 0%,rgba(225,177,107,.18),transparent 52%)}
.swirl-veil{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 95% 5%,#b08b56 0%,#4b321b 36%,#211309 75%)}
#transitionFallback{display:none;position:fixed;inset:0;z-index:100005;pointer-events:none;opacity:0;background:#24170c;transition:opacity .45s ease}
.heart-zone{appearance:none;-webkit-appearance:none;border:0;background:transparent;padding:0;color:inherit;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.heart-zone *,.hint,.hint *,#hint,#hint *,#ambient,#ambient *,#petal-atmosphere,#petal-atmosphere *{pointer-events:none!important}
.heart-zone{pointer-events:auto!important}
.post-actions{display:flex;flex-direction:column;align-items:center;gap:16px}
#replayBtn{min-width:180px;padding:12px 30px;background:rgba(8,5,3,.65);border:1px solid rgba(216,120,36,.38);color:#d8be9b;font:400 15px Georgia,serif;letter-spacing:.1em;cursor:pointer}
#replayBtn:hover{border-color:#d8a568;color:#f3e7d3}
#postContinue:not(.show){visibility:hidden;pointer-events:none}
.heart-finished #cover .stage *{animation-play-state:paused!important}
.petals-ready #grain{animation:none;inset:0;width:100%;height:100%;opacity:.10}
.petals-ready #flicker{animation:none;opacity:.04}
.petals-ready .narration-player{backdrop-filter:none}
#standaloneGame{background:#080706}
@keyframes loadingPulse{0%,100%{transform:scale(.97);opacity:.65}45%{transform:scale(1.035);opacity:1}60%{transform:scale(1);opacity:.85}}
@media(prefers-reduced-motion:reduce){.loading-heart{animation:none}#loadingScreen{transition:opacity .2s}}
.heart-finished #memory{transition:opacity 5s ease}
/* Continuous motion owns light and pose through landing, idle and release. */
[data-petal-motion="continuous"]{overflow:hidden}
[data-petal-motion="continuous"] .petal-aura,
[data-petal-motion="continuous"] .petal-contact,
[data-petal-motion="continuous"] #restingPetal canvas{animation:none!important;transition:none!important}
/* Post-prologue resting moment. Reuses the existing petal texture and field. */
.post-rest #postContinue,.post-rest #bridge{background:#000}
.post-rest #postContinue{transition:opacity 1.6s ease}
.post-rest #bridge{z-index:32}
.post-rest #postContinueBtn{display:none}
.post-rest #replayBtn{position:absolute;right:max(18px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));width:44px;height:44px;padding:0;border:0;background:none;color:#977959;font:26px Georgia;opacity:.65;z-index:5;touch-action:manipulation}
#restingPetal{position:absolute;width:80px;height:80px;transform:translate(-50%,-50%);padding:0;border:0;background:none;touch-action:manipulation;cursor:pointer;z-index:3;-webkit-tap-highlight-color:transparent}
#restingPetal canvas{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:sepia(.6) saturate(1.1) brightness(.85);transform-origin:35% 65%}
.petal-aura{position:absolute;width:180px;height:180px;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#d995494d, #aa622719 32%,transparent 68%);pointer-events:none;z-index:2}
.petal-contact{position:absolute;width:95px;height:1px;transform:translate(-50%,-50%);background:linear-gradient(90deg,transparent,#dda767,transparent);opacity:0;pointer-events:none;z-index:2}
.petal-landed .petal-aura{animation:restGlow 3.6s ease-in-out infinite}
.petal-landed .petal-contact{animation:restLine 3.6s ease-in-out infinite}
.petal-landed #restingPetal canvas{animation:none}
.petal-chosen .petal-aura{animation:chosenGlow .38s cubic-bezier(.12,.65,.25,1) forwards}
.petal-chosen .petal-contact{animation:chosenLine .38s cubic-bezier(.12,.65,.25,1) forwards}
.petal-chosen #restingPetal canvas{filter:sepia(.6) saturate(1.1) brightness(.85)}
.petal-unlit .petal-aura,.petal-unlit .petal-contact{display:none}
.petal-unlit #restingPetal canvas{filter:sepia(.8) saturate(.8) brightness(.65)}
@keyframes restGlow{50%{transform:translate(-50%,-50%) scale(1.65);opacity:1}0%,100%{opacity:.62}}
@keyframes restLine{0%,100%{opacity:.4;transform:translate(-50%,-50%) scaleX(.7)}50%{opacity:.85;transform:translate(-50%,-50%) scaleX(1.25)}}
@keyframes restBrightness{50%{filter:sepia(1) saturate(2) brightness(.95)}}
@keyframes chosenGlow{to{transform:translate(-50%,-50%) scale(5);opacity:1}}
@keyframes chosenLine{from{opacity:.8}to{opacity:1;transform:translate(-50%,-50%) scaleX(3.5)}}
@media(prefers-reduced-motion:reduce){.petal-landed *{animation-duration:4s!important}}

.post-rest #bridgeText{font-size:clamp(24px,5.5vw,44px);max-width:760px;line-height:1.3;color:#f3e7d3;filter:none;opacity:0;transform:translateY(7px);transition:opacity 1.2s ease,transform 1.8s ease}
.post-rest #bridgeText.visible{opacity:1;transform:translateY(0)}

/* Replay control: keep it in the top-right whenever the post-prologue controls are visible. */
#postContinue #replayBtn{
  position:absolute;
  right:max(18px,env(safe-area-inset-right));
  top:max(18px,env(safe-area-inset-top));
  width:44px;
  height:44px;
  min-width:0;
  padding:0;
  border:0;
  background:none;
  color:#977959;
  font:26px Georgia,serif;
  letter-spacing:0;
  opacity:.65;
  z-index:5;
  touch-action:manipulation;
}
#postContinue #replayBtn:hover{color:#d8a568;opacity:.9}

/* Heart completion only: a warm bloom underneath the physical petal wipe. */
.heart-flight-glow{position:absolute;inset:-10%;pointer-events:none;opacity:0;transform-origin:50% 48%;background:radial-gradient(ellipse at 50% 48%,rgba(226,157,81,.38),rgba(164,85,36,.16) 22%,transparent 58%);will-change:transform,opacity}
.heart-zone.complete .heart-halo{animation:heartHandoffBloom 1.55s ease-out forwards}
@keyframes heartHandoffBloom{0%{opacity:1;transform:scale(1)}45%{opacity:3;transform:scale(1.65)}100%{opacity:0;transform:scale(2.5)}}
