.world .intro{left:max(36px,calc(50% - 620px));top:26%;max-width:340px}.world .intro p{font-size:16px;margin-bottom:20px;line-height:1.6}.world .intro h1{font-size:54px;letter-spacing:-.055em;line-height:1.22}.world .intro h1 span{font-size:36px;margin-top:12px;line-height:1.4}.world .character{width:420px;max-width:36vw;top:20%;left:50%;transform:translateX(-50%)}.world .bottom{width:min(820px,90%);bottom:62px}.world .controller{min-height:68px}.world .controller button{font-size:16px;min-height:56px}.world .menu-label{font-size:14px}.world .caption{margin-top:18px}.world .caption strong{font-size:17px}.world .caption p{font-size:14px}.world footer{bottom:10px}.world footer button{font-size:12px}.greeting{position:absolute;left:calc(50% + 135px);top:15%;width:330px;z-index:4;color:#39264d}.greeting p{position:absolute;inset:0 auto auto 0;margin:0;padding:22px 26px;background:rgba(255,255,255,.9);border:1px solid #fff;border-radius:26px 26px 26px 5px;box-shadow:0 12px 35px #66527716;font-size:19px;line-height:1.65;font-weight:600;white-space:nowrap;opacity:0;transform:translateY(12px) scale(.96);transform-origin:bottom left}.greeting-one{animation:greet-first 4.2s .6s both}.greeting-two{animation:greet-second .65s 5s both}.world.paused .greeting p{animation-play-state:paused}.world:not([data-scene=home]) .greeting{visibility:hidden}.world:not([data-scene=home]) .character{left:34%;top:18%;width:400px}.world .scene-card{top:16%}
@keyframes greet-first{0%,4%{opacity:0;transform:translateY(12px) scale(.96)}10%,40%{opacity:1;transform:translateY(0) scale(1)}46%,100%{opacity:0;transform:translateY(-8px) scale(.98)}}
@keyframes greet-second{0%,50%{opacity:0;transform:translateY(12px) scale(.96)}56%,88%{opacity:1;transform:translateY(0) scale(1)}94%,100%{opacity:0;transform:translateY(-8px) scale(.98)}}
@media(min-width:1600px){.world .intro{left:calc(50% - 620px)}.world .intro h1{font-size:60px}.world .intro h1 span{font-size:40px}.world .character{width:440px}}
@media(min-width:801px) and (max-width:1100px){.world .intro{max-width:255px;left:28px;top:28%}.world .intro h1{font-size:42px}.world .intro h1 span{font-size:28px}.world .intro p{font-size:13px}.greeting{left:calc(50% + 90px);width:280px;top:12%}.greeting p{font-size:16px;padding:18px}.world .character{top:23%}}
@media(max-width:800px){.world .intro{top:34px;left:20px;right:20px;max-width:none;text-align:center}.world .intro p{font-size:13px;margin:0 0 10px}.world .intro h1{font-size:34px;line-height:1.25}.world .intro h1 br{display:none}.world .intro h1 span{font-size:30px;margin-top:3px}.world .character{top:285px;left:50%;width:265px;max-width:75%;transform:translateX(-50%)}.greeting{top:177px;left:50%;width:310px;max-width:calc(100% - 40px);transform:translateX(-50%)}.greeting p{width:100%;text-align:center;padding:17px 12px;font-size:16px;line-height:1.6;border-radius:22px 22px 5px 22px;white-space:normal}.world .bottom{bottom:68px;width:92%}.world .controller{min-height:88px}.world .controller button{font-size:13px;min-height:44px}.world .menu-label{font-size:11px}.world .caption strong{font-size:13px}.world .caption p{font-size:12px}.world .caption{margin-top:14px;padding:0 6px}.world:not([data-scene=home]) .character{top:40px;left:28%;width:190px;max-width:50%}.world .scene-card{top:240px}.world footer{bottom:12px}}
@media(prefers-reduced-motion:reduce){.greeting p{position:relative;opacity:1;transform:none;animation:none;margin-bottom:10px;font-size:15px;padding:12px 18px}.greeting{top:9%}@media(max-width:800px){.greeting{top:160px}.world .character{top:325px;width:225px}}}
/* Blue character on a soft sky-blue stage. Keep the background continuous. */
body,.world{background:#eaf3ff}.world .sky,.world[data-scene=family] .sky{background:radial-gradient(ellipse at 50% 36%,#ffffff 0%,#eff6ff 42%,#deecfc 100%)}
.world .wall,.world .floor{display:none}.world .halo{background:#ffffff55}.world .character img{mix-blend-mode:normal}.world .shadow{background:#7097c52e}
.world .intro,.world .caption strong{color:#233650}.world .intro p,.world .caption p,.world footer{color:#586d87}
.world .controller{background:#ffffff66;border-color:#ffffff;box-shadow:0 12px 32px #527aa516}.world .controller button{color:#3e5876}.world .controller button[aria-pressed=true]{background:#fff;color:#24559a}.world .menu-label{color:#5e7691}.greeting p{color:#294467;border-color:#fff;box-shadow:0 12px 32px #507bac16}
.greeting .greeting-one{animation:greet-first 10s linear infinite both}.greeting .greeting-two{animation:greet-second 10s linear infinite both}
@media(prefers-reduced-motion:reduce){.greeting .greeting-one,.greeting .greeting-two{animation:none;opacity:1;transform:none}}
.world footer button{font-size:14px;min-height:44px;padding:10px 18px;border-radius:999px;color:#3f5c7d}.world footer button:hover{background:#ffffff80}.world .intro h1 span{letter-spacing:-.035em}@media(min-width:801px){.world .caption p{font-size:15px}.world .menu-label{font-size:15px}}
/* Keep the character and every menu panel in one centered, bounded group. */
@media(min-width:801px){
  .world:not([data-scene=home]) .character{left:calc(50% - 190px);width:380px;max-width:none;top:16%;transform:translateX(-50%)}
  .world .scene-card{left:calc(50% + 40px);right:auto;width:340px;top:16%}
}
@media(min-width:801px) and (max-width:1100px){
  .world:not([data-scene=home]) .character{left:calc(50% - 180px);width:320px}
  .world .scene-card{left:calc(50% + 20px);width:320px}
}
@media(max-width:800px){
  .world:not([data-scene=home]) .character{left:50%;top:24px;width:190px;max-width:50%}
  .world .scene-card{left:6%;right:auto;top:220px;width:88%}
}

/* Tablet home: reserve independent rows for copy, speech and character. */
@media(min-width:801px) and (max-width:1100px){.world[data-scene=home] .intro{top:26px;left:20px;right:20px;max-width:none;text-align:center}.world[data-scene=home] .intro p{margin:0 0 8px}.world[data-scene=home] .intro h1{font-size:34px;line-height:1.2}.world[data-scene=home] .intro h1 br{display:none}.world[data-scene=home] .intro h1 span{display:inline;font-size:34px;margin:0 0 0 10px}.world[data-scene=home] .greeting{top:130px;left:50%;width:330px;transform:translateX(-50%)}.world[data-scene=home] .greeting p{width:100%;text-align:center;padding:12px 18px;font-size:16px;line-height:1.5}.world[data-scene=home] .character{top:235px;width:280px;max-width:none;left:50%}}
@media(min-width:801px) and (max-width:1100px) and (prefers-reduced-motion:reduce){.world[data-scene=home] .greeting{top:115px}.world[data-scene=home] .greeting p{font-size:14px;padding:8px 16px;margin-bottom:6px}.world[data-scene=home] .character{top:270px;width:240px}}
