/* Zoomies only: foreground is deliberately horizontal, separate from garden scenery. */
body:has(#zoomiesView:not([hidden])) main{padding:12px 18px;max-width:1100px}
#zoomiesView .menu-button{margin:0;min-height:40px;padding:6px 12px}
#zoomiesView header h1{font-size:38px;letter-spacing:-1.5px}
#zoomiesView header .eyebrow{display:none}
#zoomiesView header p{font-size:13px;margin:2px 0 10px}
#zoomPlay{max-width:980px;margin:auto}.zoom-toolbar{padding:8px 14px;min-height:40px;font-size:13px}
#zoomStreak{color:#9a415b;font-size:11px}.zoom-park{--ground:46px;height:clamp(240px,calc(100dvh - 265px),490px);margin-top:8px;border-radius:23px;background-image:linear-gradient(#dcecc344,#dcecc344),url('assets/garden.svg');background-size:cover;background-position:center}
.running-path{left:0;bottom:0;width:100%;height:104px;border-radius:0;transform:none;background:linear-gradient(#ecd5af,#f5e2bf);border:0;border-top:7px solid #a4bb7b;box-shadow:0 -3px 0 #f0f3cd}
.running-path:after{content:'';position:absolute;inset:50px 0 0;background:repeating-linear-gradient(90deg,transparent 0 44px,#c9aa7844 44px 49px,transparent 49px 90px);height:3px}
#zoomRunner{left:23%;bottom:var(--ground);width:112px;max-width:none;height:90px;object-fit:contain;object-position:center bottom;transform-origin:center bottom;filter:none;animation:none!important;translate:none!important;pointer-events:none}
#zoomShadow{position:absolute;left:23%;bottom:calc(var(--ground) - 5px);width:64px;height:12px;background:#665a3e55;border-radius:50%;transform:translateX(-50%);z-index:1}
.track-star{bottom:calc(var(--ground) + var(--star-height) - 18px);font-size:34px;line-height:36px;color:#ffe16c;-webkit-text-stroke:1.5px #915b17;filter:drop-shadow(0 2px 0 #fffdf4) drop-shadow(0 0 4px #fff8cb);z-index:3}
.track-puddle{bottom:calc(var(--ground) - 9px);width:var(--puddle-width,9%);min-width:0;height:20px;border-radius:48% 35% 58% 32% / 45% 55% 36% 60%;border:2px solid #c7eceb;background:#72b7c8;box-shadow:0 2px #b49c76,inset 6px 3px #98d1da;z-index:1}.track-puddle:after{content:'';position:absolute;inset:5px 25% 6px 18%;border-top:2px solid #e8fffb;border-radius:50%}
#zoomSplash{position:absolute;left:23%;bottom:var(--ground);z-index:4}#zoomSplash i{position:absolute;width:6px;height:11px;background:#65b4c9;border:1px solid #e4faf6;border-radius:60%;transform:translate(-35px,-22px) rotate(-35deg)}#zoomSplash i:nth-child(2){transform:translate(-18px,-40px) rotate(-15deg)}#zoomSplash i:nth-child(3){transform:translate(12px,-44px) rotate(12deg)}#zoomSplash i:nth-child(4){transform:translate(32px,-25px) rotate(40deg)}#zoomSplash i:nth-child(5){transform:translate(44px,-8px) rotate(60deg)}
#splashBubble{bottom:150px;left:4%;font-size:12px;padding:6px 10px}
.zoom-controls{margin:10px 0 4px;gap:12px;display:flex;justify-content:center}.zoom-controls .primary{padding:10px 20px;min-height:46px;width:190px}.zoom-controls .small{min-width:78px}
#zoomMessage{font-size:12px;line-height:1.3;min-height:32px;margin:6px auto 0;text-align:center;max-width:540px}#zoomPlay>.hint{font-size:10px;margin:3px 0 0}
#zoomEnd{inset:8px 14%;padding:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}#zoomEnd[hidden]{display:none}#zoomEnd h2{font-size:25px;margin:0}#zoomEnd p{font-size:12px;margin:0;max-width:340px}#zoomEnd .primary{font-size:14px;padding:8px 20px;min-height:40px;margin:0}#zoomEnd .small{min-height:38px;padding:6px 12px}#zoomEnd .eyebrow{font-size:8px}#zoomCelebrate{width:76px;height:62px;object-fit:contain}#zoomEnd .mini{font-size:10px}
#zoomSetup{padding:20px 12px}#zoomPets{margin:50px auto 20px}
@media(max-width:600px){body:has(#zoomiesView:not([hidden])) main{padding:8px 10px}#zoomiesView header h1{font-size:30px}#zoomiesView header p{font-size:11px;margin-bottom:8px}.zoom-toolbar{gap:6px;font-size:11px;padding:7px 9px}.zoom-park{height:clamp(240px,calc(100dvh - 300px),490px)}#zoomRunner{width:88px;height:76px}#zoomEnd{inset:6px 4%;gap:3px;padding:8px}#zoomEnd h2{font-size:22px}#zoomCelebrate{height:44px;width:62px}#zoomEnd p{font-size:11px}#zoomEnd .eyebrow{display:none}#zoomSetup h2{font-size:22px}.zoom-pet img{height:65px}#zoomPets{margin:24px auto 18px}.zoom-pet{width:30%}#zoomSetup>p{font-size:11px}#zoomPlay>.hint{font-size:9px}}
#zoomRunner.side-view{width:132px;height:132px;bottom:calc(var(--ground) - 20.625px);transform-origin:center 84.375%}@media(max-width:600px){#zoomRunner.side-view{width:112px;height:112px;bottom:calc(var(--ground) - 17.5px)}}
.zoom-modes{border:0;margin:8px auto 12px;padding:8px;max-width:500px;background:#fffdf3ee;border-radius:18px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.zoom-modes legend{font-weight:800;font-size:13px;background:#fffdf3;border-radius:8px;padding:3px 10px}.zoom-modes label{min-height:44px;flex:1;padding:8px;border:2px solid #dbeac9;border-radius:12px;font-weight:800;cursor:pointer}.zoom-modes label:has(:checked){border-color:#b94867;background:#fff0ee}.zoom-modes small{display:block;font-size:10px;font-weight:400}.zoom-modes p{font-size:10px;margin:0;flex-basis:100%}.zoom-modes input{accent-color:#b94867}
@media(prefers-reduced-motion:reduce){#zoomRunner{transition:none}}