.tarot-erasure{position:absolute;inset:0;background:url('oracle-clean.webp') center/100% 100% no-repeat;opacity:0;transition:opacity 850ms ease;mask-image:radial-gradient(ellipse 20% 12% at 50% 50%,#000 86%,transparent 100%),radial-gradient(ellipse 20% 7% at 50% 60.5%,#000 86%,transparent 100%),radial-gradient(ellipse 40% 7% at 50% 80%,#000 87%,transparent 100%);pointer-events:none}
.phone.tarot-mode .tarot-erasure{opacity:1}.phone.tarot-mode #orbFx,.phone.tarot-mode .orb-dim{opacity:0!important;transition:opacity .65s}.phone.tarot-mode .scene{transform:none}.phone.tarot-mode>.hotspot,.phone.tarot-mode>.back,.phone.tarot-mode>.ask-again{pointer-events:none;opacity:0}
.scene-stage{position:absolute;inset:0;z-index:30}.scene-stage[hidden]{display:none}.scene-stage iframe{width:100%;height:100%;border:0;display:block;background:transparent;opacity:0;transform:translateY(8px);transition:opacity .5s .2s,transform .7s .15s}.tarot-ready .scene-stage iframe{opacity:1;transform:none}.phone.tarot-mode~.fallback{visibility:hidden}
@media(prefers-reduced-motion:reduce){.tarot-erasure,.scene-stage iframe{transition:none}}

.reading-clean,.menu-clean{position:absolute;inset:0;background:url('oracle-reading-clean.webp') center/100% 100% no-repeat;pointer-events:none}
.reading-clean{mask-image:linear-gradient(#000 0 24%,transparent 27%);opacity:0;transition:opacity .65s}
.phone.tarot-mode .reading-clean{opacity:1}
.menu-clean{mask-image:linear-gradient(transparent 16%,#000 17% 22.8%,transparent 23.3%)}
/* Main menu: two balanced, borderless destinations. */
#tarotHotspot,#natalHotspot{top:16.6%;width:40%;height:8%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:5px 3px;border:0;border-radius:12px;color:#f0ddc2;background:linear-gradient(#08101955,#08101999);font:16px/1.15 Georgia,serif;letter-spacing:.01em;text-shadow:0 2px 6px #000;transition:background .2s,color .2s}
#tarotHotspot{left:9%}#natalHotspot{left:51%}
#tarotHotspot svg,#natalHotspot svg{width:25px;height:25px;flex-shrink:0;fill:none;stroke:#d8b888;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
#tarotHotspot span,#natalHotspot span{white-space:nowrap}
#tarotHotspot:hover,#natalHotspot:hover{background:#101a27b0;color:#fff0d6}
@media(max-width:360px){#tarotHotspot,#natalHotspot{font-size:15px;gap:5px}}
@media(prefers-reduced-motion:reduce){.reading-clean{transition:none}}

/* Remove the baked decorative slogan so it cannot sit under live controls. */
.footer-clean{position:absolute;inset:0;background:url('oracle-reading-clean.webp') center/100% 100% no-repeat;mask-image:linear-gradient(transparent 85.8%,#000 87%,#000 100%);pointer-events:none}

/* One silent video behind the existing sphere and every reading mode. */
.scene-video{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;background:url('oracle-background-poster.webp') center/100% 100% no-repeat}
.live-background #sceneImg{position:absolute;inset:0;mask-image:radial-gradient(ellipse 16.8% 9.5% at 50% 49.8%,#000 96%,transparent 100%),radial-gradient(ellipse 13.4% 5.3% at 50% 60.1%,#000 93%,transparent 100%);transition:opacity .65s}
.live-background .tarot-erasure,.live-background .reading-clean,.live-background .menu-clean,.live-background .footer-clean,.live-background .ask-button-clean{display:none}
.live-background.tarot-mode #sceneImg{opacity:0}
.scene-brand{position:absolute;top:4%;left:15%;right:15%;text-align:center;color:#e7c79e;text-shadow:0 2px 12px #000;pointer-events:none}
.scene-brand>span{display:block;font:normal clamp(26px,9vw,38px)/1 Georgia,serif;letter-spacing:.19em;padding-left:.19em}
.scene-brand>i{display:block;font:16px/1.1 Georgia,serif;font-style:normal}
.scene-brand>small{display:block;font:7px/1.5 Georgia,serif;letter-spacing:.3em}
.live-background.tarot-mode .scene-brand{display:none}
@media(prefers-reduced-motion:reduce){.live-background #sceneImg{transition:none}}

/* Move toward the whole scene, preserving the original camera approach. */
.live-background .scene{will-change:transform}
.live-background.focused .scene{transform:scale(1.82)}
.live-background .sphere-layer{position:absolute;inset:0;transform-origin:50% 49.8%;transition:transform 980ms cubic-bezier(.2,.74,.2,1),opacity .65s;pointer-events:none;will-change:transform}
.live-background.focused .sphere-layer{transform:none}
.live-background.tarot-mode .sphere-layer{opacity:0;transform:none}
.live-background .scene-video{filter:brightness(.69) saturate(.86)}
.live-background #sceneImg{filter:brightness(.86) saturate(.9);transition:opacity .65s}
.live-background .scene::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 48%,transparent 25%,#04091422 68%,#02050b66 100%);z-index:0}
.live-background .sphere-layer,.live-background .scene-brand{z-index:1}
.live-background.focused .scene-brand{opacity:0;transition:opacity .35s}
@media(prefers-reduced-motion:reduce){.live-background .sphere-layer{transition:none}}

/* Follow the silhouette rather than carrying a patch of the old tabletop. */
.live-background #sceneImg{mask-image:url('sphere-composite-mask.svg');mask-size:100% 100%;mask-repeat:no-repeat;filter:brightness(.78) saturate(.78) sepia(.06)}
.live-background .sphere-layer::before{content:'';position:absolute;left:35%;top:64.2%;width:30%;height:2.2%;background:radial-gradient(ellipse,#050403aa 0%,#0b080552 44%,transparent 72%);filter:blur(2px);pointer-events:none}

/* Readable mobile masthead, with space between identity and destinations. */
.scene-brand>span{font-size:clamp(30px,10vw,40px)}
.scene-brand>small{margin-top:12px;font:13px/1.45 Georgia,serif;letter-spacing:.08em;color:#f0dfc4;text-shadow:0 2px 8px #000,0 0 16px #000}
#tarotHotspot,#natalHotspot{top:21%;height:8.5%;font-size:17px;gap:5px;background:linear-gradient(#08101980,#081019b8)}
@media(max-width:360px){#tarotHotspot,#natalHotspot{font-size:16px}.scene-brand>small{font-size:12px;letter-spacing:.06em}}
