.landing-page.is-crew {overflow:hidden}
.landing-page.is-crew .site-header {display:none}
.landing-page.is-destination main > #crew.is-parade-ready {padding:0;margin:0;max-width:none;height:100dvh;overflow:hidden}
.crew-stage {position:relative;width:100%;height:100%;isolation:isolate;overflow:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.crew-stage picture,.crew-scene {display:block;width:100%;height:100%}
.crew-scene {object-fit:fill}
.crew-stage::after {content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 33%,#fff8dfcc 0%,#fff8df88 24%,#fff8df00 65%);opacity:var(--description-fade,0)}
.crew-back {position:absolute;z-index:4;top:max(14px,env(safe-area-inset-top));left:18px;max-width:calc(100% - 30px);min-height:44px;display:flex;align-items:center;padding:8px 15px;color:#fff7d9;background:#344d2be6;border:1px solid #c7bd82;border-radius:3px 14px 3px 14px;font:500 clamp(14px,1.5vw,20px) Fredoka,sans-serif;text-decoration:none;box-shadow:0 3px 8px #14271050}
.crew-introduction {position:absolute;z-index:4;top:max(12%,var(--crew-heading-top,0px));left:17%;width:66%;text-align:center;color:#263e21;pointer-events:none;text-shadow:0 1px 2px #fff5db}
.crew-introduction h2 {font:500 clamp(15px,1.7vw,24px) Fredoka,sans-serif;margin:0 0 12px}
.crew-description {opacity:var(--description-fade,0)}
.crew-name {font:500 clamp(36px,5.5vw,80px) Fredoka,sans-serif;line-height:1.1;margin:0 0 10px}
.crew-story {font:500 clamp(16px,2vw,24px) Fredoka,sans-serif;line-height:1.4;margin:0 auto;max-width:650px}
.crew-walker {position:absolute;z-index:3;left:0;bottom:22%;width:clamp(130px,24vw,320px);max-width:var(--crew-fit-size,100vw);height:auto;aspect-ratio:1;pointer-events:none;filter:drop-shadow(0 8px 5px #48341040);will-change:transform}
.crew-walker.is-flying {bottom:26%;filter:none}
.crew-walker[data-friend="buzz"] {width:clamp(55px,10vw,105px)}
.crew-controls {position:relative;z-index:4;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;pointer-events:auto;text-shadow:none}
.crew-controls button {min-width:44px;min-height:44px;padding:8px 12px;border:1px solid #b7bd85;border-radius:50% 5px 50% 5px;background:#344d2bea;color:#fff7d9;font:500 15px Fredoka,sans-serif;box-shadow:0 3px 8px #14271050;cursor:pointer}
.crew-controls .crew-pause {min-width:82px}
.crew-controls button:hover,.crew-back:hover {background:#49663a}
.crew-stage :is(button,a):focus-visible {outline:3px solid #fff09b;outline-offset:4px}
.crew-music {position:absolute;z-index:4;right:24px;bottom:max(18px,env(safe-area-inset-bottom));width:clamp(160px,22vw,300px);min-height:44px;border:0;padding:0;background:transparent;box-shadow:none;cursor:pointer;transform:rotate(-2deg)}
.crew-music img {display:block;width:100%;height:auto;filter:drop-shadow(0 4px 4px #3b291666)}
.crew-music:hover {background:transparent;filter:brightness(1.08);transform:rotate(-2deg)}
.crew-stage .song-controls {position:fixed;z-index:8;left:auto;right:calc(48px + clamp(160px,22vw,300px));bottom:18px;top:auto;transform:none;max-width:calc(100vw - clamp(160px,22vw,300px) - 72px);background:#fffdf7f2}
.crew-load-note {position:absolute;z-index:4;top:50%;left:10%;width:80%;text-align:center;color:#263e21;background:#fff8dfdd;padding:12px;border-radius:8px}
@media (orientation:portrait) {
  .crew-introduction {top:max(12%,var(--crew-heading-top,0px));left:8%;width:84%}
  .crew-introduction h2 {font-size:16px;margin-bottom:8px}
  .crew-name {font-size:clamp(32px,8vw,48px);margin-bottom:8px}
  .crew-story {font-size:clamp(16px,4vw,22px)}
  .crew-walker {width:clamp(125px,48vw,330px);bottom:23%}
  .crew-walker.is-flying {bottom:26%}
  .crew-walker[data-friend="buzz"] {width:clamp(55px,20vw,100px)}
  .crew-back {left:12px;font-size:14px}
  .crew-controls {gap:6px;margin-top:10px}
  .crew-controls button {font-size:14px;padding:6px 8px}
  .crew-music {width:43%;right:12px;bottom:max(18px,env(safe-area-inset-bottom))}
  .crew-stage .song-controls {left:50%;right:auto;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:calc(100vw - 20px)}
  .crew-stage:has(.song-controls:not([hidden])) .crew-music {left:50%;right:auto;bottom:75px;transform:translateX(-50%) rotate(-2deg)}
}
@media (orientation:landscape) and (max-height:500px) {
  .crew-introduction {top:max(14%,var(--crew-heading-top,0px))}
  .crew-introduction h2 {margin-bottom:4px;font-size:14px}
  .crew-name {font-size:32px;margin-bottom:4px}
  .crew-story {font-size:16px;max-width:90%}
  .crew-walker {width:min(23vw,36dvh);bottom:21%}
  .crew-walker.is-flying {bottom:26%}
  .crew-back {top:8px;font-size:14px}
  .crew-music {width:175px;bottom:8px}
  .crew-controls {position:fixed;right:12px;top:70px;margin:0;flex-direction:column;gap:5px}
  .crew-controls .crew-pause {min-width:64px}
  .crew-stage .song-controls {right:211px;bottom:8px;max-width:calc(100vw - 223px)}
}
@media (max-width:340px) {
  .crew-back {font-size:12px}
  .crew-controls {gap:6px}
  .crew-controls button {padding:6px;min-width:44px;font-size:12px}
  .crew-music {right:8px;width:42%}
}
@media (orientation:landscape) and (max-height:380px) {
  .crew-introduction {top:max(18%,var(--crew-heading-top,0px))}
  .crew-introduction h2 {display:none}
  .crew-name {font-size:28px}
  .crew-story {font-size:14px;max-width:100%}
  .crew-walker.is-flying {width:min(23vw,30dvh)}
}
/* Very narrow CSS viewports also occur with browser zoom on a phone. */
@media (orientation:portrait) and (max-width:279px) {
  .crew-back {top:6px;left:6px;max-width:calc(100% - 12px);padding:6px 9px;font-size:11px}
  .crew-introduction {top:max(58px,var(--crew-heading-top,0px));left:6%;width:88%}
  .crew-introduction h2 {font-size:12px;margin-bottom:4px}
  .crew-name {font-size:24px;margin-bottom:4px}
  .crew-story {font-size:12px;line-height:1.3}
  .crew-controls {gap:4px;margin-top:6px}
  .crew-controls button {padding:5px;font-size:11px}
  .crew-controls .crew-pause {min-width:62px}
  .crew-walker {width:clamp(65px,40vw,110px)}
  .crew-walker[data-friend="buzz"] {width:42px}
  .crew-stage .song-controls {display:grid;grid-template-columns:32px minmax(30px,1fr) 25px 58px;gap:3px;width:calc(100vw - 12px);max-width:230px;bottom:8px;padding:4px}
  .crew-stage .song-controls input {min-width:0;width:100%}
  .crew-stage .song-controls .music-toggle {font-size:10px;padding:3px;min-height:32px}
  .crew-stage:has(.song-controls:not([hidden])) .crew-music {bottom:55px;width:50%}
}
.crew-stage.is-tight .crew-introduction h2 {display:none}
.crew-stage.is-tight .crew-name {font-size:24px;margin-bottom:4px}
.crew-stage.is-tight .crew-story {font-size:13px;line-height:1.25}
.crew-stage.is-tight .crew-controls {margin-top:6px}
