@font-face{font-family:Baloo;src:url('baloo2.ttf') format('truetype');font-display:swap}*{box-sizing:border-box}html,body{margin:0;color:#102b47;font-family:Baloo,system-ui,sans-serif}body{background:#102b47}.world{height:100svh;min-height:640px;position:relative;overflow:hidden;isolation:isolate;background:url('road-world.webp') center/cover}.world:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#102b4733,transparent 70%)}header{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#102b47;color:white;font-weight:700}header a{display:grid;align-items:center;min-height:48px;min-width:84px;color:white;font-size:18px}header span{font-size:16px}#progress{background:#ffcf4d;color:#102b47;border-radius:20px;padding:0 12px}.title{margin:8px 12px 0;background:#fff8e9f5;border-radius:16px;padding:8px 12px}.title h1{font-size:27px;line-height:1.05;margin:0}.title p{font-size:17px;line-height:1.12;margin:5px 0 0}.speech{position:absolute;top:188px;left:12px;right:12px;background:#fff8e9;border:3px solid #102b47;border-radius:18px;padding:9px 12px;box-shadow:0 4px 0 #102b47}.speech h2{font-size:23px;line-height:1.08;margin:2px 0 4px}.speech p{font-size:16px;line-height:1.12;margin:0}.speech .eyebrow{font-size:13px;font-weight:700}#activity{position:absolute;inset:315px 8px 5px}#road{height:calc(100% - 48px);position:relative;touch-action:none}.destinations{position:absolute;inset:0 0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.destination{border:0;background:transparent;padding:0;min-height:104px;min-width:48px;color:#102b47;font-family:inherit;cursor:pointer}.destination img{width:100%;height:88px;object-fit:contain;display:block;filter:drop-shadow(0 3px 2px #102b4760)}.destination span{display:block;background:#fff8e9;border:2px solid #102b47;border-radius:9px;padding:3px 0;font-size:16px;font-weight:700;line-height:1.15}.destination.done span{background:#c8f5c0}.destination.done span:after{content:' ✓'}#car{position:absolute;width:104px;height:136px;top:78%;left:12.5%;transform:translate(-50%,-50%);cursor:grab;touch-action:none;filter:drop-shadow(0 5px 3px #102b4780)}#car img{height:100%;width:100%;object-fit:contain;pointer-events:none}#car:active{cursor:grabbing;filter:drop-shadow(0 10px 4px #102b4780)}.help{margin:1px auto 0;width:fit-content;text-align:center;background:#102b47;color:white;border-radius:10px;padding:3px 12px;font-size:15px;line-height:1.15}:focus-visible{outline:4px solid #136dc3;outline-offset:2px}#car:focus-visible{background:#fff8e9aa;border-radius:12px;outline-color:#fff}#ending{position:absolute;left:12px;right:12px;bottom:30px;background:#fff8e9;border:4px solid #102b47;border-radius:22px;padding:18px 12px;text-align:center;box-shadow:0 6px 0 #102b47}#ending h2{font-size:29px;line-height:1.08;margin:0}#ending p{font-size:19px;line-height:1.2;margin:12px 0}.actions{display:flex;justify-content:center;gap:12px}.actions>*{display:grid;place-items:center;min-height:52px;min-width:120px;background:#102b47;color:white;border:0;border-radius:12px;padding:8px 12px;font:600 18px Baloo;text-decoration:none;cursor:pointer}[hidden]{display:none!important}@media(min-width:800px){header{padding:0 32px}.title{margin:20px 32px;width:60%;max-width:850px;padding:16px 20px}.title h1{font-size:45px}.title p{font-size:24px}.speech{top:240px;left:32px;right:auto;width:32%;padding:20px}.speech h2{font-size:32px}.speech p{font-size:21px}.speech .eyebrow{font-size:17px}#activity{inset:235px 3% 28px 38%}.destination img{height:170px}.destination span{font-size:23px;padding:8px 0}#car{width:150px;height:200px}.help{font-size:20px}#ending{left:42%;right:6%;bottom:100px;padding:30px}#ending h2{font-size:40px}#ending p{font-size:25px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.title .book-title{font-size:13px;line-height:1.1;margin:0 0 3px;font-weight:600}.title h1{font-size:25px}.title p:not(.book-title){font-size:16px}@media(min-width:800px){.title .book-title{font-size:16px}.title h1{font-size:38px}.title p:not(.book-title){font-size:22px}.title{padding:12px 20px}}

@media(min-width:800px){.title{margin-left:38%;width:59%;max-width:none}.speech{top:auto;bottom:125px}}

#companion{position:absolute;right:0;bottom:49px;width:142px;height:150px;object-fit:contain;object-position:bottom;pointer-events:none;filter:drop-shadow(0 3px 3px #102b4740);transform-origin:bottom center;transition:transform .2s ease}#companion[data-mood="happy"]{transform:translateY(-6px) rotate(-5deg)}#companion[data-mood="thinking"]{transform:rotate(5deg)}.title{position:relative;z-index:2}.speech,#ending{z-index:2}#activity{z-index:1}@media(min-width:800px){#companion{right:3%;bottom:84px;width:190px;height:235px}}