/* Greeting + status follow Bluey on every screen: one column centered just under the orb,
   moved by follow-copy.js as he drifts left/right and forward/back (the orb's size changes).
   Selectors start with "body .app .stage" so they outrank the phone stack in index.html
   (!important top/left/right) and alpha47-mobile-polish.css, which alpha46.js injects
   after this file. Font sizes stay with the existing phone rules; computers get their own. */
body .app .stage .stage-copy{
 position:absolute!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:5px!important;
 left:0!important;right:auto!important;top:0!important;bottom:auto!important;
 width:max-content!important;max-width:min(560px,calc(100% - 24px))!important;
 z-index:20!important;text-align:center!important;pointer-events:none;
 transform:translate(var(--bluey-copy-x,0px),var(--bluey-copy-y,0px))!important;transition:transform .12s linear;
}
body .app .stage .stage-copy:not(.bluey-copy-placed){visibility:hidden}
body .app .stage .stage-copy>.greeting,body .app .stage .stage-copy>.status,body .app .stage .stage-copy>.nudge{
 position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;
 width:auto!important;max-width:100%!important;margin:0!important;transform:none!important;text-align:center!important;
 white-space:normal!important;pointer-events:auto;
}
body .app .stage .stage-copy>.status:empty,body .app .stage .stage-copy>.nudge:not(.show){display:none!important}
@media(min-width:701px){
 body .app .stage .stage-copy>.greeting{font-size:clamp(20px,2.1vw,27px)!important;line-height:1.2!important;text-wrap:balance}
 body .app.working .stage .stage-copy>.greeting{font-size:clamp(15px,1.4vw,18px)!important}
}