/* Rocco's transparent stage. The reserved mobile perch is real layout space. */
.rocco-perch{display:none}
body.rocco-compact .page-heading,body.rocco-compact[data-screen=plan] .page-heading,body.rocco-compact[data-screen=rocco] .page-heading{margin-bottom:0;max-width:100%}
body.rocco-compact .rocco-perch{display:block;position:relative;height:var(--rocco-rail-height,174px);width:100%;margin:0 0 12px}
body.rocco-compact[data-screen=rocco] .rocco-perch{height:var(--rocco-rail-height,320px)}
#rocco-flight.companion{width:220px;height:240px;transition:transform var(--flight-duration,1250ms) cubic-bezier(.22,.75,.2,1),opacity .2s;will-change:transform}
#rocco-flight .scene{width:220px;height:240px;animation:rocco-breathe 7.2s ease-in-out infinite}
#rocco-flight #spirit3d{width:240px;height:240px;left:-10px;top:0;bottom:auto;filter:drop-shadow(0 10px 10px #424a4412)}
#rocco-flight #pet-zone{inset:22px 34px 23px;outline-offset:3px}
#rocco-flight #pet-zone:focus-visible{outline:3px solid #476250;background:#fff2}
#rocco-flight .scene-sound{width:44px;height:44px;right:0;bottom:0;opacity:0}
#rocco-flight:hover .scene-sound,#rocco-flight:focus-within .scene-sound{opacity:1}
#rocco-flight .room-controls{top:244px;left:-32px;right:-32px;gap:6px}
#rocco-flight .room-controls .soft-button{font-size:14px;min-height:48px;padding:8px 14px;background:#fffefa;border:1px solid #cfdad2;box-shadow:0 4px 12px #33433808}
#rocco-flight.docked{opacity:0;transition:none}
.rocco-docked #call-rocco{background:#fffefa url('assets/rocco-fallback.svg') center/38px 42px no-repeat}
.rocco-docked #call-rocco svg{opacity:0}
#rocco-flight.docked .scene{animation:none}
#rocco-flight.docked .scene-sound,#rocco-flight.docked .room-controls{display:none!important}
#rocco-flight.rocco-in-dialog{opacity:0}
#rocco-flight.flying .scene{animation:rocco-arrive 1.25s cubic-bezier(.22,.75,.2,1)}
#rocco-flight.flying #pet-zone{pointer-events:none}
#rocco-note{max-width:250px;transition:opacity .2s}
#rocco-note p{font-size:.875rem;line-height:1.5;border-color:#cbd8cf;box-shadow:0 8px 30px #4254480a}
body.rocco-compact #rocco-note p{padding:10px 12px}
body.rocco-compact #rocco-note{max-width:none}
.in-reset #rocco-flight .scene{animation:none}
.page-hidden #rocco-flight .scene{animation-play-state:paused}
@keyframes rocco-breathe{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-5px) rotate(.6deg)}}
@keyframes rocco-arrive{0%{transform:rotate(0)}35%{transform:translateY(-12px) rotate(var(--bank,6deg))}78%{transform:translateY(2px) rotate(-1deg)}100%{transform:none}}
body.reduce-motion #rocco-flight,body.reduce-motion #rocco-flight .scene{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){#rocco-flight,#rocco-flight .scene{animation:none!important;transition:none!important}}
body.rocco-compact #rocco-flight .room-controls .soft-button{font-size:19px;min-height:60px}
@media(max-width:650px){.studio-header #call-rocco{display:inline-grid}#rocco-flight .scene-sound{display:none}body.rocco-compact .workspace .view{padding-top:0}}
@media print{.rocco-perch,#rocco-note{display:none!important}}
