@font-face{font-family:Baloo;src:url('baloo.ttf');font-display:swap}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;color:#142942;font-family:Baloo,system-ui,sans-serif}body{background:#153b52}a{color:inherit}header{height:48px;padding:0 12px;display:flex;justify-content:space-between;align-items:center;color:#fff;background:#153b52;font-size:15px}header a{display:flex;align-items:center;min-height:48px;z-index:2}.skip{position:absolute;left:-999px}.skip:focus{left:6px;top:40px;z-index:10;background:#fff;padding:12px}main{height:calc(100svh - 48px);position:relative;background:url('world.webp') center/cover;overflow:hidden}.heading{position:relative;z-index:1;background:#ffdf71;padding:3px 8px 6px;text-align:center}.book{font-size:12px;line-height:1.2;margin:0}h1{font-size:26px;line-height:1.05;margin:3px 0}#instruction{font-size:18px;line-height:1.1;margin:0}.world{position:relative;height:calc(100% - 88px);min-height:0;background:linear-gradient(0deg,#14294244,transparent)}#progress{position:absolute;top:8px;left:10px;background:#153b52;color:white;padding:0 10px;border-radius:12px;font-size:16px}.guide{position:absolute;left:-4%;bottom:115px;height:260px;width:47%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 4px 3px #14294255)}.guide.happy{transform:rotate(-5deg)}#stations{position:absolute;right:8px;top:12px;bottom:124px;width:52%;display:grid;grid-template-rows:repeat(3,1fr);gap:5px}.station{background:transparent;border:0;padding:0;color:#142942;font:inherit;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:48px;min-width:48px;position:relative}.station img{width:100%;height:70px;object-fit:contain;filter:drop-shadow(0 3px 3px #14294266)}.station span{background:#fff4cc;border:2px solid #142942;border-radius:9px;padding:2px 6px;font-size:19px;line-height:1.05;max-width:100%}.station.done img{filter:drop-shadow(0 0 8px #ffe22b)}.station.done span{background:#c6f9ad}.station.done span:before{content:'✓ '}.station[aria-pressed=true] span{background:#ffe128;box-shadow:0 0 0 3px #142942}button:focus-visible,a:focus-visible{outline:4px solid #fff;box-shadow:0 0 0 7px #142942;outline-offset:1px}#need{position:absolute;bottom:118px;left:6px;width:45%;display:flex;flex-direction:column;align-items:center;pointer-events:none}#need img{height:60px;width:90px;object-fit:contain}#need span{background:#ffdf71;border:2px solid #142942;padding:4px;border-radius:10px;text-align:center;font-size:20px;line-height:1.08}#dock{position:absolute;bottom:0;left:0;right:0;min-height:112px;background:#153b52;color:#fff;padding:7px 10px;display:flex;align-items:center;justify-content:center;gap:8px}#feedback{font-size:20px;line-height:1.12;margin:0;flex:1}button.action,a.action{font:inherit;font-size:20px;line-height:1.1;border:2px solid #142942;border-radius:12px;background:#ffdf71;color:#142942;padding:10px 12px;min-height:48px;min-width:48px;cursor:pointer;text-decoration:none;text-align:center}#advance{max-width:106px}#ending{position:absolute;inset:10% 5% 12%;background:#fff4cc;border:3px solid #142942;border-radius:24px;padding:18px;text-align:center;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}#ending h2{font-size:32px;line-height:1.05;margin:0}#ending p{font-size:22px;line-height:1.15;margin:0}.end-art{height:140px;width:100%;object-fit:contain}.actions{display:flex;gap:8px}.sparkle{position:absolute;top:10%;left:20%;width:60px;pointer-events:none}#confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5}#confetti img{position:absolute;top:-50px;width:30px;animation:fall 1.8s ease-in forwards}@keyframes fall{to{transform:translateY(650px) rotate(240deg);opacity:0}}[hidden]{display:none!important}.four #stations{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;width:65%;top:38px;bottom:154px;gap:8px}.four .station img{height:90px}.four .station span{font-size:18px}.four .guide{left:-9%;width:47%;bottom:110px;height:245px}.four #need{width:94%;bottom:116px;left:3%;flex-direction:row;gap:5px;justify-content:center}.four #need img{height:42px;width:50px}.four #need span{font-size:20px}.reveal .guide{bottom:114px}.reveal #stations{bottom:124px}.reveal .station img{height:76px}.station:active img{transform:scale(.94)}@media(min-width:700px){.heading{height:96px}.book{font-size:16px}h1{font-size:34px}#instruction{font-size:22px}.world{height:calc(100% - 96px);max-width:1000px;margin:auto}#stations,.four #stations{right:5%;width:52%;top:30px;bottom:160px;gap:16px}.station img,.reveal .station img{height:110px}.station span,.four .station span{font-size:24px}.guide,.four .guide{height:75%;width:43%;left:0;bottom:120px}#dock{border-radius:18px 18px 0 0;min-height:120px}#feedback{font-size:25px}#need{left:5%;width:32%;bottom:130px}#need span{font-size:25px}#ending{inset:8% 20% 10%}.end-art{height:190px}.four #need{width:85%;left:7%;bottom:128px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.guide.happy{transform:none}}
/* Keep the native frame; crop into one illustrated panel rather than show the sheet. */
main{display:flex;flex-direction:column;background-size:auto 410%;background-position:2% 14%}.heading{flex:none}.world{flex:1;height:auto;width:100%;max-width:1000px}.skip{min-width:48px;min-height:48px;padding:10px}.station{justify-content:flex-end}.station img,.reveal .station img{height:96px}@media(min-width:700px){.guide,.four .guide{max-height:400px}.station img,.reveal .station img{height:140px}}.guide{bottom:125px}.world:before{content:'';position:absolute;inset:0;background:#ffdf7108;pointer-events:none}