.dog-home-video{display:none;position:absolute;width:150%;max-width:none;height:auto;aspect-ratio:16/9;left:-25%;top:50%;transform:translateY(-50%);pointer-events:none;filter:brightness(1.02)}
.companion.is-home-video{mix-blend-mode:darken}
.companion.is-home-video .dog-button{overflow:hidden}
.companion.is-home-video .dog-home-video{display:block}
.companion.is-home-video #dog-canvas,.companion.is-home-video .dog-fallback{visibility:hidden;opacity:0}
#home .home-speech{top:auto;right:auto;bottom:105px;left:50%;max-width:min(320px,calc(100vw - 40px));text-align:center;transform:translate(-50%,10px);z-index:20}
#home .home-speech.is-visible{transform:translate(-50%,0)}
@media(min-width:761px){#home.hero{height:980px}}
@media(max-width:760px){#home.hero{height:max(830px,calc(436px + min(100vw,550px)));max-height:none}}
.dog-music-video{display:none;position:absolute;width:150%;max-width:none;height:auto;aspect-ratio:16/9;left:-25%;top:50%;transform:translateY(-50%);pointer-events:none;filter:brightness(1.02)}
.companion.is-music-video{mix-blend-mode:darken}
.companion.is-music-video .dog-button{overflow:hidden}
.companion.is-music-video .dog-music-video{display:block}
.companion.is-music-video #dog-canvas,.companion.is-music-video .dog-fallback{visibility:hidden;opacity:0}
/* The workbench clip keeps the whole desk and dog inside the companion stage. */
.dog-making-video,.dog-making-poster{display:none;position:absolute;width:100%;max-width:none;height:auto;aspect-ratio:16/9;object-fit:contain;left:0;top:50%;transform:translateY(-50%);pointer-events:none}
.companion[data-state="making"]{mix-blend-mode:darken}
.companion[data-state="making"] .dog-button{overflow:hidden}
.companion[data-state="making"] .companion-play{top:82%}
.companion[data-state="making"] :is(#dog-canvas,.dog-fallback){visibility:hidden;opacity:0}
/* Keep the matching still available before playback, after an error, and for reduced motion. */
.companion[data-state="making"] .dog-making-poster{display:block}
.companion.is-making-video .dog-making-video{display:block}
.companion.is-making-video .dog-making-poster{display:none}
/* Travel footage keeps its original framing; the portrait-shaped dog fits inside this landscape layer. */
.dog-travel-video,.dog-travel-poster{display:none;position:absolute;width:150%;max-width:none;height:auto;aspect-ratio:16/9;left:-25%;top:50%;transform:translateY(-50%);pointer-events:none;filter:brightness(1.02)}
/* Wider vehicles need extra side clearance inside the square companion stage. */
#dog-travel-drive-video,#dog-travel-drive-poster,#dog-travel-fly-video,#dog-travel-fly-poster{width:135%;left:-17.5%}
.companion:is(.is-travel-walk-video,.is-travel-walk-poster,.is-travel-drive-video,.is-travel-drive-poster,.is-travel-fly-video,.is-travel-fly-poster){mix-blend-mode:darken}
.companion:is(.is-travel-walk-video,.is-travel-walk-poster,.is-travel-drive-video,.is-travel-drive-poster,.is-travel-fly-video,.is-travel-fly-poster) .dog-button{overflow:hidden}
.companion.is-travel-walk-video #dog-travel-video,.companion.is-travel-walk-poster #dog-travel-walk-poster,.companion.is-travel-drive-video #dog-travel-drive-video,.companion.is-travel-drive-poster #dog-travel-drive-poster,.companion.is-travel-fly-video #dog-travel-fly-video,.companion.is-travel-fly-poster #dog-travel-fly-poster{display:block}
.companion:is(.is-travel-walk-video,.is-travel-walk-poster,.is-travel-drive-video,.is-travel-drive-poster,.is-travel-fly-video,.is-travel-fly-poster) :is(#dog-canvas,.dog-fallback){visibility:hidden;opacity:0}
/* Travel always uses its selected video or poster, including loading and mode changes. */
.companion[data-state="travel"] :is(#dog-canvas,.dog-fallback){visibility:hidden;opacity:0}
.travel-modes{display:none;align-items:center;gap:4px;width:max-content;padding:4px;border:1px solid #68746e20;border-radius:28px;background:#ffffff70;pointer-events:auto}
.travel-modes button{padding:9px 18px;border-radius:22px;background:transparent;color:#728278;font-size:12px;line-height:1.2;transition:background .18s,color .18s,box-shadow .18s}
.travel-modes button:hover{background:#ffffff70}
.travel-modes button[aria-pressed="true"]{background:#fff;color:#3e5b4b;box-shadow:0 2px 7px #263e300d}
.travel-modes button:focus-visible{outline:2px solid #769180;outline-offset:2px}
.companion[data-state="travel"] .companion-play{display:none}
@media(min-width:761px){
  .companion[data-state="travel"] .travel-modes{display:flex;position:absolute;top:94%;left:50%;transform:translateX(-50%)}
  .companion[data-state="travel"] .dog-speech{top:auto;bottom:calc(100% - 24px);right:0}
}
@media(max-width:760px){
  .is-in-chapter .companion[data-state="travel"] .dog-button{clip-path:none}
  .travel-modes--mobile{display:flex;margin:0 0 22px}
}
@media(prefers-reduced-motion:reduce){.travel-modes button{transition:none}}

/* Match the other chapter companions while keeping the desk and laptop inside the frame. */
@media(min-width:761px){.companion[data-state="making"] :is(.dog-making-video,.dog-making-poster){width:145%;left:-22.5%}}
