/* One local Dreamview background definition for the shell and native preview. */
/* Keep the navigation/control area calm, then fade into the open sunset. */
:root{--dv-cloud-poster:url('/dreamview-pink-sunset-poster-4k-20261007.webp');--dv-cloud-shade:linear-gradient(180deg,#132b4ef5 0px,#132b4eeb 110px,#132b4ec2 160px,#071d4899 260px,#07192fa6 100%)}
body{isolation:isolate}
/* One shell background persists through routes, loading and mobile. */
 .dv-cloud-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#07192f}
 .dv-cloud-background[hidden]{display:none}
 .dv-cloud-background :is(.dv-cloud-poster,.dv-cloud-video){position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
 /* Reveal the movie only after it plays; loading/failure retains its matching frame. */
 .dv-cloud-video{opacity:0;transition:opacity .4s ease}
 .dv-cloud-background[data-video-ready=true] .dv-cloud-video{opacity:1}
 .dv-cloud-background:is([data-motion=still],[data-motion=unavailable]) .dv-cloud-video{display:none}
 @media(prefers-reduced-motion:reduce){.dv-cloud-video{display:none!important;transition:none}}
 /* Small distant meteors remain visible for a brief pass, then leave quiet sky.
    They live inside the clipped background and share its motion control. */
 .dv-distant-stars{position:absolute;inset:0;z-index:5;overflow:hidden}
 .dv-shooting-star{position:absolute;left:8%;top:clamp(140px,13vh,190px);width:48px;height:1.5px;background:linear-gradient(90deg,transparent,#fff1cc);opacity:0;animation-play-state:paused}
 .dv-shooting-star::after{content:"";position:absolute;right:0;top:-.5px;width:2.5px;height:2.5px;border-radius:50%;background:#fff8e5}
 .dv-shooting-star:nth-child(2){left:84%;top:clamp(140px,13vh,190px);width:48px;background:linear-gradient(90deg,#fff1cc,transparent)}
 .dv-shooting-star:nth-child(2)::after{left:0;right:auto}
 .dv-cloud-background[data-sky-ready=true] .dv-shooting-star{animation:dv-distant-pass 36s linear 6s infinite;animation-play-state:paused}
 .dv-cloud-background[data-sky-ready=true] .dv-shooting-star:nth-child(2){animation-name:dv-distant-return;animation-duration:36s;animation-delay:24s}
 .dv-cloud-background[data-sky-ready=true][data-motion=running] .dv-shooting-star{animation-play-state:running}
 .dv-cloud-background:not([data-motion=running]) .dv-distant-stars{visibility:hidden}
 @keyframes dv-distant-pass{0%{opacity:0;transform:translate3d(0,0,0) rotate(24deg)}1%{opacity:.85}5%{opacity:0;transform:translate3d(140px,63px,0) rotate(24deg)}100%{opacity:0;transform:translate3d(140px,63px,0) rotate(24deg)}}
 @keyframes dv-distant-return{0%{opacity:0;transform:translate3d(0,0,0) rotate(-24deg)}1%{opacity:.85}5%{opacity:0;transform:translate3d(-140px,63px,0) rotate(-24deg)}100%{opacity:0;transform:translate3d(-140px,63px,0) rotate(-24deg)}}
 /* The approved refresh silhouette also crosses the menu after readiness,
    then rests for five minutes. It never affects layout or pointer input. */
 .dv-seasonal-flight{position:fixed;left:0;top:10px;width:40px;height:22px;z-index:1000;color:#000;opacity:0;filter:blur(.25px);transform:translate3d(-90px,0,0);pointer-events:none}
 .dv-seasonal-flight[hidden]{display:none!important}
 .dv-seasonal-flight svg{display:block;width:100%;height:100%;color:#000;filter:none}
 .dv-cloud-background[data-sky-ready=true]~.shell .dv-seasonal-flight{animation:dv-october-flight 600s linear 1s infinite;animation-play-state:paused}
 .dv-cloud-background[data-sky-ready=true][data-motion=running]~.shell .dv-seasonal-flight{animation-play-state:running}
 .dv-cloud-background:not([data-motion=running])~.shell .dv-seasonal-flight{visibility:hidden}
 /* The refresh greeting draws the swoosh, then reveals the original star; the logo
    has no added artwork. Later five-minute flybys leave the logo untouched. */
 @media(prefers-reduced-motion:no-preference){
  html:is([data-brand-intro=pending],[data-brand-intro=drawing]) [data-brand-swoosh]{stroke-dasharray:1;stroke-dashoffset:1}
  html:is([data-brand-intro=pending],[data-brand-intro=drawing]) :is(.brand,.dv-app-logo) use[href$="dreamview-shared-star"]{opacity:0}
 }
 html:is([data-brand-intro=pending],[data-brand-intro=drawing]) .dv-seasonal-flight{animation:none!important;left:0;top:0}
 html[data-brand-intro=drawing] .dv-seasonal-flight{visibility:visible!important}
 html[data-brand-intro=complete] .dv-seasonal-flight{animation-delay:300s!important}
 /* Two five-minute returns per cycle: alternate direction and a gentle arc.
    The separate refresh drawing in brand-intro.js is unchanged. */
 @keyframes dv-october-flight{
  0%{opacity:0;transform:translate3d(-90px,0,0) rotate(-3deg)}
  .04%{opacity:.85}
  .45%{opacity:.85;transform:translate3d(calc(50vw - 20px),10px,0) rotate(-1deg)}
  .9%{opacity:.85;transform:translate3d(calc(100vw + 90px),-4px,0) rotate(1deg)}
  .95%,49.99%{opacity:0;transform:translate3d(calc(100vw + 90px),-4px,0) rotate(1deg)}
  50%{opacity:0;transform:translate3d(calc(100vw + 90px),14px,0) scaleX(-1) rotate(-3deg)}
  50.04%{opacity:.85}
  50.45%{opacity:.85;transform:translate3d(calc(50vw - 20px),-3px,0) scaleX(-1) rotate(1deg)}
  50.9%{opacity:.85;transform:translate3d(-90px,6px,0) scaleX(-1) rotate(2deg)}
  50.95%,100%{opacity:0;transform:translate3d(-90px,6px,0) scaleX(-1) rotate(2deg)}
 }
 @media(max-width:679px){.dv-seasonal-flight{width:32px;height:18px}}
 @media(prefers-reduced-motion:reduce){.dv-distant-stars,.dv-seasonal-flight{display:none!important}}
 .dv-cloud-background::after{content:"";position:absolute;inset:0;z-index:4;background:var(--dv-cloud-shade)}
 html.dv-embedded,html.dv-embedded body,html.dv-embedded #root,
 html.dv-embedded #root>div,
 html.dv-embedded #root :is(.cloud-mobile-canvas,.cloud-loading-screen,.app-boot-loader){background:transparent!important}
 html.dv-embedded #root .dom-bg-effects,
 html.dv-embedded #root :is(.cloud-mobile-canvas,.dashboard-canvas)::before{display:none!important}
/* The separately opened native mobile/status preview uses the same poster.
   Embedded surfaces are transparent and reveal the existing shell layer. */
html:not(.dv-embedded):has(#root :is(.cloud-mobile-canvas,.cloud-loading-screen,.app-boot-loader)) body{background:var(--dv-cloud-shade),var(--dv-cloud-poster) center / cover no-repeat fixed!important}
html:not(.dv-embedded):has(#root :is(.cloud-mobile-canvas,.cloud-loading-screen,.app-boot-loader)) :is(#root,#root>div),
html:not(.dv-embedded) #root :is(.cloud-mobile-canvas,.cloud-loading-screen,.app-boot-loader){background:transparent!important}
html:not(.dv-embedded) #root>.cloud-loading-screen>.dom-bg-effects{display:none!important}

/* The loading-only swoosh/star asset is decorative; keep the status and
   progress visible. Header Dreamview artwork and distant stars are unchanged. */
#root :is(.cloud-loading-screen,.app-boot-loader) img[src$="/dream-on-me-loading-star.png"]{display:none!important}