/* Fit the complete illustration and controls inside the visual viewport.
   The stage keeps the artwork's ratio; its percentage coordinates never crop. */
html,body{width:100%;height:100%;overflow:hidden}
/* Travel first, then keep the whole scene still for an uninterrupted voice. */
.voice-rest *,.voice-rest *::before,.voice-rest *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.voice-rest .rig-mouth,.voice-rest .rig-blink{opacity:0!important;transform:none!important}
.voice-rest .confetti-layer{display:none}
body{height:100dvh;display:flex;flex-direction:column;background:#dce6c9}
.preview-note{flex:none;min-height:22px;padding:3px 12px;font-size:9px;line-height:16px}
.preview-note span{font-size:10px}
.header.wrap{position:relative;inset:auto;flex:none;width:calc(100% - 20px);margin:8px 10px 0;padding:10px 15px;min-height:62px;border-radius:18px;backdrop-filter:none;box-shadow:0 4px 18px #173f3512;gap:12px}
.header .brand{font-size:26px}.header .brand-icon{font-size:36px}.header .brand-small{font-size:7px}
.header nav{gap:18px}.header-end{gap:9px}
main.wrap{flex:1;min-height:0;width:100%;padding:0}
.world,.preview-note:not([hidden])~main .world{height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) clamp(285px,25vw,360px);grid-template-rows:minmax(0,1fr);gap:10px;padding:10px;background:radial-gradient(ellipse at 30% 35%,#f0f0d2,#bed0ad)}
.world::before{display:none}
.world-viewport{position:relative;inset:auto;width:100%;height:100%;min-width:0;min-height:0;display:grid;place-items:center;overflow:hidden;padding:0;touch-action:manipulation;overscroll-behavior:none;border-radius:23px;background:#9cb49326}
.world-stage{min-width:0;min-height:0;width:100%;height:auto;aspect-ratio:1672 / 941;max-width:100%;max-height:100%;flex:none;container-type:inline-size}
.world-image{object-fit:contain;border-radius:18px}
.world-vignette{border-radius:18px;box-shadow:inset 0 0 55px #173f3518}
.world-spot{font-size:clamp(8px,1.42cqw,17px);min-height:0;padding:.85cqw 1.15cqw;gap:.65cqw;border-width:1px;border-radius:1.25cqw;box-shadow:0 3px 0 #173f3520,0 5px 16px #112e2320}
.world-spot .spot-icon{width:2.1cqw;height:2.1cqw;font-size:2.1cqw}
.world-spot .spot-chevron{font-size:1.3cqw;margin-left:.2cqw}
.world-spot::after{width:.8cqw;height:.8cqw;left:calc(50% - .4cqw);bottom:-.5cqw}
.world-spot .spot-pulse{inset:-.55cqw;border-radius:1.8cqw}
.world-spot.active{visibility:visible}
.guide-character,.guide-character.articulated{width:10.9%;height:23.17%;filter:drop-shadow(0 4px 4px #19372b30)}
.guide-character.articulated{filter:none}
.guide-character.articulated::before{content:'';position:absolute;left:28%;bottom:3%;width:44%;height:6%;background:radial-gradient(ellipse,#19372b38,transparent 70%);border-radius:50%;pointer-events:none}
.guide-character.articulated.swinging::before{visibility:hidden}
.monkey-character,.monkey-character.articulated{width:9.4%;height:20.4%}
.guide-character .koala-name,.articulated .koala-name{bottom:-.8cqw;font-size:clamp(5px,.83cqw,11px);padding:.22cqw .6cqw;letter-spacing:.03em}
.character-bubble{bottom:calc(100% - 1.3cqw);font-size:clamp(7px,1cqw,13px);padding:.5cqw .7cqw;max-width:18cqw;border-width:1px;border-radius:1cqw}
.character-bubble::after{width:.6cqw;height:.6cqw;bottom:-.35cqw;left:calc(50% - .3cqw);border-width:1px}
.guide-character.guide-found::after{content:'';position:absolute;inset:-9%;border:3px solid #fff2b0;border-radius:50%;box-shadow:0 0 0 4px #ddae5b55;pointer-events:none;animation:friend-found 1.25s ease-out 2}
.scene-motes span{font-size:1.3cqw}
.clubhouse-controls{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:13px;padding:19px 17px;border:1px solid #fffce9;border-radius:23px;background:#f6f7e8f2;box-shadow:0 6px 28px #173f3514}
.world-heading{position:static;inset:auto;max-width:none;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;text-shadow:none}
.world-heading h1{font-size:clamp(21px,2vw,28px);line-height:1.15;letter-spacing:-.8px}
.world-heading .eyebrow{font-size:8px;margin-bottom:7px}
.world-heading p:last-child{max-width:none;font-size:12px;line-height:1.5;margin-top:10px}
.world-mobile-nav{position:static;inset:auto;display:grid;grid-template-columns:1fr 1fr;gap:7px;overflow:visible;width:100%;flex:none}
.world-mobile-nav button{min-height:44px;border:1px solid #cad7b8;border-radius:13px;background:#fffced;padding:9px 8px;font-size:12px;font-weight:bold;white-space:nowrap;color:#173f35;box-shadow:0 3px 0 #173f3510}
.world-mobile-nav button:hover,.world-mobile-nav button:focus-visible{background:#f6e4af}
.world-mobile-nav button.active{background:#f3d98d;border-color:#d7b868;box-shadow:0 3px 0 #ad8d3d24}
.friend-controls{display:flex;gap:8px;flex:none}
.friend-controls button{flex:1;min-width:0;min-height:47px;display:flex;align-items:center;justify-content:center;gap:3px;padding:2px 6px;border:1px solid #d7dfc5;border-radius:13px;background:#e8eed8;color:#36583b;font-size:10px;font-weight:700}
.friend-controls img{width:38px;height:40px;object-fit:contain}
.friend-controls button:hover{background:#f4e4b5}
.clubhouse-tools{display:flex;justify-content:space-between;gap:6px;flex:none}
.world-tools,.world-nav{position:static;inset:auto;display:block}
.world-tool,.world-nav .world-tool{min-height:36px;padding:7px 9px;font-size:10px;box-shadow:none;border-color:#d5dfc4;background:#eef2df;backdrop-filter:none}
.world-nav .world-tool small{font-size:10px}
.guide-dialogue{position:static;inset:auto;transform:none;width:100%;min-width:0;border-radius:17px;padding:13px;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:start;gap:8px;background:#fffdf1;border-color:#eee9ce;box-shadow:0 5px 15px #173f3509;backdrop-filter:none}
.guide-avatar{width:42px;height:47px;margin:0;align-self:start}
.guide-dialogue .eyebrow{font-size:8px;line-height:1.45;letter-spacing:.7px;margin:0 0 4px}
.guide-dialogue p{font-size:12px;line-height:1.5}
.guide-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-start;justify-items:start}
.guide-dialogue .button{font-size:11px;min-height:38px;padding:8px 12px;white-space:normal;line-height:1.2;gap:6px}
.voice-button{font-size:11px;min-height:32px;padding:5px}
.speaker-label{font-size:10px;min-height:0}.voice-status{font-size:10px}.tour-progress{font-size:9px}
.world-locked .clubhouse-controls{visibility:hidden}
.world-login{top:105px;max-height:calc(100dvh - 125px);overflow:auto}
.world-panel{inset:88px 18px 18px;max-height:none}
@keyframes friend-found{0%{opacity:0;transform:scale(.85)}25%{opacity:1}100%{opacity:0;transform:scale(1.2)}}
@media(max-width:1000px){.header nav{display:flex;gap:12px}.header .nav-link{font-size:10px}.header-end .privacy-label{display:none}.clubhouse-controls{padding:15px 13px;gap:10px}.world{grid-template-columns:minmax(0,1fr) 285px}.world-heading h1{font-size:23px}.world-heading p:last-child{font-size:11px}.header .motion-toggle{font-size:10px}}
@media(max-width:700px) and (orientation:portrait){
  .header.wrap{min-height:58px;padding:8px 10px;width:calc(100% - 14px);margin:6px 7px 0;border-radius:15px;gap:5px;flex-wrap:wrap}
  .header .brand{font-size:22px;gap:4px}.header .brand-icon{font-size:29px}.header .brand-small{font-size:6px}
  .header-end{gap:4px;flex-wrap:wrap;justify-content:flex-end;max-width:60%}.header .motion-toggle{font-size:9px;padding:6px 7px;min-height:30px}.header .text-button{font-size:9px;padding:2px 5px}
  .header nav{order:3;flex:0 0 100%;justify-content:center;gap:24px}.header .nav-link{font-size:10px;padding:3px 0}
  .world,.preview-note:not([hidden])~main .world{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;padding:7px;gap:7px}
  .world-viewport{border-radius:17px}.world-image,.world-vignette{border-radius:12px}
  .clubhouse-controls{gap:8px;padding:11px;border-radius:18px}
  .world-heading{display:none}
  .world-mobile-nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.world-mobile-nav button{font-size:10px;padding:7px 3px;min-height:42px;border-radius:11px}
  .friend-controls{gap:7px}.friend-controls button{min-height:40px;font-size:11px}.friend-controls img{width:31px;height:34px}
  .clubhouse-tools{justify-content:center;gap:14px}.world-tool,.world-nav .world-tool{min-height:31px;padding:5px 8px;font-size:10px}
  .guide-dialogue{padding:11px;gap:6px 9px;grid-template-columns:42px minmax(0,1fr);border-radius:14px}.guide-avatar{height:47px;width:42px}.guide-dialogue p{font-size:12px;line-height:1.45}.guide-actions{grid-column:1/-1;gap:7px}.guide-dialogue .button{min-height:36px;font-size:11px;padding:7px 11px}
  .guide-character .koala-name,.articulated .koala-name{font-size:5px;padding:1px 3px;bottom:-4px}.world-spot{font-size:7px;padding:4px 5px;gap:3px;border-radius:6px}.world-spot .spot-icon{font-size:9px;width:9px;height:9px}.world-spot .spot-chevron{display:none}.character-bubble{font-size:7px;padding:4px 5px;border-radius:7px}
  .world-panel{inset:82px 8px 8px;padding:17px}.world-login{top:91px;max-height:calc(100dvh - 104px)}
}
@media(max-width:359px) and (orientation:portrait){.header .brand{font-size:19px}.header .brand-icon{font-size:25px}.header .motion-toggle{font-size:8px;padding:5px;gap:3px}.clubhouse-controls{padding:8px;gap:6px}.world-mobile-nav{gap:4px}.world-mobile-nav button{font-size:9px}.guide-dialogue{padding:9px;grid-template-columns:34px minmax(0,1fr);gap:6px}.guide-avatar{width:34px;height:40px}.guide-dialogue p{font-size:11px}.friend-controls button{font-size:10px}.friend-controls img{width:29px;height:32px}}
@media(max-height:650px) and (min-width:701px){.world-heading p:last-child{display:none}.world-heading h1{font-size:21px}.clubhouse-controls{gap:9px;padding:12px}.guide-dialogue{padding:10px}.guide-dialogue p{font-size:11px}.world-mobile-nav button{min-height:39px;font-size:11px}.friend-controls button{min-height:40px}.friend-controls img{width:30px;height:34px}}
@media(max-height:500px) and (orientation:landscape){
  .preview-note{min-height:18px;font-size:8px;line-height:12px;padding:3px 10px}.preview-note span{display:none}
  .header.wrap{min-height:43px;padding:5px 12px;margin-top:4px;border-radius:13px}.header .brand{font-size:20px}.header .brand-icon{font-size:28px}.header .brand-small{font-size:5px;margin-top:2px}.header .motion-toggle{font-size:9px;padding:5px 8px}.header nav{display:flex;order:0;flex-basis:auto;gap:12px}.header .nav-link{font-size:9px;padding:3px 0}.header-end{flex-wrap:nowrap}.header .text-button{font-size:9px}
  .world{padding:5px 8px;gap:7px;grid-template-columns:minmax(0,1fr) 292px}.world-viewport{border-radius:13px}.world-image,.world-vignette{border-radius:12px}
  .clubhouse-controls{padding:7px;gap:5px;justify-content:center;border-radius:14px}.world-heading{display:none}
  .world-mobile-nav{gap:4px}.world-mobile-nav button{min-height:30px;padding:5px;font-size:10px;border-radius:9px}
  .friend-controls{gap:5px}.friend-controls button{min-height:30px;font-size:9px;padding:0 4px}.friend-controls img{width:27px;height:29px}
  .clubhouse-tools{justify-content:center;gap:10px}.world-tool,.world-nav .world-tool{min-height:27px;padding:3px 6px;font-size:9px}.world-nav .world-tool small{font-size:9px}
  .guide-dialogue{padding:7px;gap:5px 7px;grid-template-columns:29px minmax(0,1fr);border-radius:10px}.guide-avatar{width:29px;height:34px}.guide-dialogue .eyebrow{font-size:7px;margin-bottom:2px}.guide-dialogue p{font-size:10px;line-height:1.35}.guide-actions{gap:5px}.guide-dialogue .button{min-height:29px;padding:5px 8px;font-size:10px}.voice-button{font-size:10px;min-height:28px;padding:3px}.speaker-label,.voice-status{font-size:9px;margin-top:2px}
  .world-panel{inset:62px 9px 9px}.world-login{top:67px;max-height:calc(100dvh - 77px)}
}
@media(max-height:580px) and (orientation:portrait){.clubhouse-controls{padding:7px;gap:5px}.friend-controls button{min-height:33px}.friend-controls img{width:27px;height:29px}.world-mobile-nav button{min-height:36px}.world-tool,.world-nav .world-tool{min-height:27px;padding:3px 7px}.guide-dialogue{padding:8px;gap:5px 7px}.guide-dialogue p{font-size:11px}.guide-dialogue .button{min-height:31px;padding:6px 10px}.voice-button{min-height:29px}.guide-avatar{width:33px;height:40px}}
@media(prefers-reduced-motion:reduce){.guide-character.guide-found::after{animation:none}}
/* Taller tablets and desktop windows have room for a full-width panorama. */
@media(min-width:701px) and (max-aspect-ratio:3/2){
  .world,.preview-note:not([hidden])~main .world{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}
  .clubhouse-controls{display:grid;grid-template-columns:minmax(180px,.9fr) minmax(200px,1fr) minmax(280px,1.5fr);grid-template-areas:'intro destinations dialogue' 'tools friends dialogue';align-items:center;gap:10px 18px;padding:15px 20px}
  .world-heading{grid-area:intro}.world-heading h1{font-size:23px}.world-heading p:last-child{display:none}.world-heading .eyebrow{font-size:8px;margin-bottom:5px}
  .world-mobile-nav{grid-area:destinations;gap:6px}.world-mobile-nav button{min-height:38px;font-size:11px;padding:7px}
  .friend-controls{grid-area:friends}.friend-controls button{min-height:38px;font-size:10px}.friend-controls img{width:31px;height:33px}
  .clubhouse-tools{grid-area:tools;gap:5px;justify-content:flex-start}.world-tool,.world-nav .world-tool{font-size:9px;min-height:32px;padding:6px 7px}.world-nav .world-tool small{font-size:9px}
  .guide-dialogue{grid-area:dialogue;align-self:stretch;padding:12px;grid-template-columns:44px minmax(0,1fr);align-content:center;gap:7px 10px}.guide-dialogue p{font-size:12px;line-height:1.45}.guide-dialogue .button{min-height:35px;font-size:11px}.guide-avatar{width:44px;height:49px}.guide-actions{gap:7px}
}
@media(min-width:701px) and (max-width:900px) and (max-aspect-ratio:3/2){
  .clubhouse-controls{grid-template-columns:minmax(160px,.8fr) minmax(170px,.85fr) minmax(230px,1.3fr);gap:8px 10px;padding:12px}
  .world-heading h1{font-size:20px}.world-heading .eyebrow{font-size:7px}.world-mobile-nav button{font-size:10px}.friend-controls button{font-size:9px;padding-inline:2px}.friend-controls img{width:27px;height:30px}.clubhouse-tools{gap:3px;flex-wrap:wrap}.world-tool,.world-nav .world-tool{padding:5px 6px;min-height:29px}.guide-dialogue{padding:9px;grid-template-columns:32px minmax(0,1fr);gap:6px}.guide-dialogue p{font-size:11px}.guide-avatar{width:32px;height:39px}.guide-dialogue .button{font-size:10px;min-height:32px;padding:6px 9px}.voice-button{font-size:10px;min-height:28px}
}