.egg-choice{padding:14px;margin:0 0 15px}.egg-choice h2{font-size:19px;margin:0 0 10px}.creature-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.creature-options button{min-height:95px;background:#ffcf24;border:2px solid #123d61;font-size:12px;padding:4px}.creature-options [aria-pressed=true]{background:#00bd9c;box-shadow:inset 0 0 0 3px #fff}.creature-options img{display:block;width:56px;height:56px;margin:auto;object-fit:cover;object-position:left;image-rendering:pixelated}.creature-options .creature-icon{width:56px;height:56px;display:block;margin:auto;background-size:400% 100%;image-rendering:pixelated}
.world-layer{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}.weather-effects{position:absolute;inset:0;pointer-events:none}.world-weather-icon{position:absolute;right:4%;top:1%;width:19%;image-rendering:pixelated}.weather-sunny .world-weather-icon{width:15%}.weather-cloudy .weather-effects{background:#45628c22}.weather-rain .weather-effects,.weather-thunder .weather-effects{background:repeating-linear-gradient(112deg,transparent 0 24px,#cdf6ff99 25px 27px,transparent 28px 45px);animation:rain-fall .6s linear infinite}.weather-thunder{background:#17294d44}.weather-thunder .world-weather-icon{filter:brightness(.6)}.weather-thunder:after{content:'';position:absolute;inset:0;background:#fff3;opacity:0;animation:soft-lightning 12s linear infinite;pointer-events:none}.weather-windy .world-weather-icon{animation:cloud-drift 3s ease-in-out infinite}.weather-snow .weather-effects{background-image:radial-gradient(circle,#fff 0 2px,transparent 3px),radial-gradient(circle,#fff 0 3px,transparent 4px);background-size:35px 43px,67px 59px;animation:snow-fall 5s linear infinite;background-position:0 0,20px 10px}
.world-sky{position:absolute;left:-25%;top:5%;width:20%;height:25%;object-fit:contain;image-rendering:pixelated;animation:sky-pass 13s linear forwards;pointer-events:none}.event-balloon{animation-duration:22s}.event-helicopter{animation-duration:10s}.world-local{position:absolute;left:42%;top:34%;width:22%;height:30%;min-height:44px;padding:0;border:0;background:transparent!important;pointer-events:auto;image-rendering:pixelated;z-index:1;touch-action:manipulation}.world-local img{width:100%;height:100%;object-fit:contain;pointer-events:none;image-rendering:pixelated}.world-local:active{transform:scale(.94)}.event-cow,.event-sheep,.event-pig{left:48%;top:20%;animation:farm-bob 3s ease-in-out infinite}.event-sailboat,.event-steamer{top:21%;animation:boat-pass 18s linear forwards}.event-firetruck,.event-police,.event-ambulance,.event-digger,.event-bus{top:33%;animation:road-pass 11s linear forwards}.event-digger{animation-duration:20s}.event-squirrel{animation:squirrel-tree 10s ease-in-out forwards}.event-woodpecker,.event-owl{left:78%;top:10%;width:16%;height:22%;animation:farm-bob 2s ease-in-out infinite}.event-seagull{top:5%;animation:sky-pass 12s linear forwards}.event-crab{top:71%;animation:crab-walk 13s ease-in-out infinite alternate}.event-dolphin{top:28%;animation:dolphin-leap 5s ease-in-out 2 forwards}.event-beetle,.event-bird{left:68%;top:56%;width:15%;height:22%;animation:farm-bob 3s ease-in-out infinite}
.world-special{position:absolute;border:0;padding:0;background:transparent!important;pointer-events:auto;z-index:3;touch-action:manipulation}.world-special img{width:100%;height:100%;object-fit:contain;pointer-events:none;image-rendering:pixelated}#world-rainbow{left:21%;top:0;width:48%;height:35%;min-height:64px}#world-snowman{left:5%;top:34%;width:23%;height:40%;min-height:64px}.world-sparkle:after{content:'✦ ✧ ✦';position:absolute;inset:10%;font-size:28px;color:#ffdf32;text-shadow:1px 2px #123d61;animation:weather-sparkle 1s ease-out forwards;pointer-events:none}#world-kite{position:absolute;left:62%;top:12%;width:22%;height:30%;object-fit:contain;image-rendering:pixelated;animation:kite-dance 2s ease-in-out infinite}#world-kite-rope{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#world-kite-line{stroke:#fff4bb;stroke-width:2;fill:none;filter:drop-shadow(1px 1px #123d61)}#world-kite-handle{width:64px;height:52px;min-height:52px;transform:translate(-50%,-50%);font-size:24px;background:transparent!important;border:0;color:#123d61;pointer-events:auto;touch-action:none;z-index:4;text-shadow:1px 1px white}#world-kite-handle:active{transform:translate(-50%,-50%) scale(.95)}
.world-toolbar{padding:10px 14px;border-top:2px solid #123d61;background:#fff9dd}.world-toolbar-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;font-weight:bold}.world-toolbar button{min-height:44px;font-size:12px;padding:6px 10px}.world-toolbar p{font-size:12px;line-height:1.4;margin:5px 0}#world-special-hint{font-weight:bold;color:#006d65}
@keyframes sky-pass{0%{left:-25%}100%{left:110%}}@keyframes boat-pass{0%{left:-25%;translate:0 0}50%{translate:0 3px}100%{left:110%;translate:0 0}}@keyframes road-pass{0%{left:-25%}100%{left:110%}}@keyframes squirrel-tree{0%{left:0;top:55%}45%{left:78%;top:44%}75%{left:78%;top:10%;opacity:1}100%{left:78%;top:10%;opacity:.25}}@keyframes crab-walk{from{left:4%}to{left:78%}}@keyframes dolphin-leap{0%,100%{left:18%;translate:0 60px;opacity:0;rotate:-20deg}15%,75%{opacity:1}45%{left:52%;translate:0 -35px;rotate:15deg}90%{left:80%;translate:0 60px;opacity:0}}@keyframes farm-bob{50%{translate:0 -3px}}@keyframes rain-fall{to{background-position:-45px 90px}}@keyframes snow-fall{to{background-position:35px 86px,87px 128px}}@keyframes cloud-drift{50%{translate:12px 2px}}@keyframes soft-lightning{0%,88%,94%,100%{opacity:0}90%{opacity:1}}@keyframes weather-sparkle{0%{opacity:0;scale:.7}25%{opacity:1}100%{opacity:0;scale:1.35}}@keyframes kite-dance{50%{translate:7px -5px;rotate:8deg}}
@media(prefers-reduced-motion:reduce){.world-layer *,.world-layer:after{animation:none!important}.world-sky{left:25%}.world-local{opacity:1}.weather-thunder:after{display:none}}.reduced .world-layer *,.reduced .world-layer:after{animation:none!important}.reduced .world-sky{left:25%}.reduced .weather-thunder:after{display:none}@media(max-width:600px){.creature-options{gap:5px}.creature-options button{font-size:11px}.world-toolbar{padding:7px 10px}.world-toolbar p{font-size:11px}.world-toolbar-top{font-size:12px}}

.creature-icon{overflow:hidden}.creature-options .creature-icon img{width:224px;height:56px;max-width:none;object-fit:fill;margin:0}

#world-kite-rope svg{width:100%;height:100%;display:block}

#world-kite{transform:translate(-50%,-50%)}
#world-kite-handle{position:absolute}.kite-held #world-kite{animation:none}

@media(min-width:601px){.creature-options{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:420px){.creature-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Reactions live on child decorations: the route animation keeps its time. */
.world-local:active{transform:none}.boat-flag{display:none;position:absolute;left:45%;top:12%;font-size:clamp(16px,3vw,29px);color:#f43d72;text-shadow:1px 1px #123d61;pointer-events:none}.flag-raised .boat-flag{display:block;animation:hoist-flag .7s ease-out forwards}.local-reaction-mark{position:absolute;left:38%;top:4%;pointer-events:none}.boat-honk .local-reaction-mark:after{content:'♪';color:#ffcf24;font-size:26px;text-shadow:1px 1px #123d61}.sirens-on .local-reaction-mark{width:28%;height:9%;background:linear-gradient(90deg,#1885ff 50%,#ff3549 50%);box-shadow:-7px -4px 10px #1885ff77,7px -4px 10px #ff354977;animation:siren-glow .6s ease-in-out infinite alternate}
@keyframes hoist-flag{from{translate:0 16px;opacity:0}to{translate:0 0;opacity:1}}@keyframes siren-glow{to{filter:brightness(1.6)}}
.world-weather-icon{width:12%}.weather-sunny .world-weather-icon{width:10%}.world-sky{width:15%;height:20%}.world-local{width:17%;height:25%}
@media(prefers-reduced-motion:reduce){.sirens-on .local-reaction-mark,.flag-raised .boat-flag{animation:none}}.reduced .sirens-on .local-reaction-mark,.reduced .flag-raised .boat-flag{animation:none}

/* Match the blue/red bar to the 80×64 vehicle artwork's roof. */
.event-firetruck,.event-police,.event-ambulance{height:auto;aspect-ratio:80/64}
.sirens-on.event-firetruck .local-reaction-mark,.sirens-on.event-police .local-reaction-mark,.sirens-on.event-ambulance .local-reaction-mark{left:33.75%;top:29.6875%;width:22.5%;height:7.8125%}

/* Quiet pixel surf stays within the sea strip, behind animals and the path. */
.coast-surf{display:none;position:absolute;inset:0;overflow:hidden;pointer-events:none;clip-path:polygon(0 44%,100% 44%,100% 62%,0 62%)}.biome-coast .coast-surf{display:block}.biome-coast.variant-1 .coast-surf{clip-path:polygon(16% 44%,85% 44%,85% 62%,16% 62%)}.biome-coast.variant-2 .coast-surf{clip-path:polygon(0 44%,100% 44%,100% 59%,51% 62%,34% 58%,20% 58%,10% 55%,0 62%)}
.coast-wash{position:absolute;left:0;right:0;top:53%;height:9%;background:linear-gradient(transparent,#5ee4e72b 65%,#d6ffff55);animation:shore-wash 5.4s ease-in-out infinite}
.surf-line{position:absolute;left:-5%;width:110%;height:1.1%;background:repeating-linear-gradient(90deg,#eaffff 0 7%,transparent 7% 9%,#b9ffff 9% 16%,transparent 16% 20%);clip-path:polygon(0 30%,12% 30%,12% 0,28% 0,28% 30%,45% 30%,45% 65%,62% 65%,62% 20%,81% 20%,81% 45%,100% 45%,100% 100%,0 100%);animation:shore-foam 5.4s ease-in-out infinite;opacity:0}
.surf-back{top:50%;animation-delay:-3.6s}.surf-middle{top:54%;animation-delay:-1.8s}.surf-front{top:58%}
@keyframes shore-foam{0%{translate:-1% -2px;opacity:0}25%{opacity:.6}65%{translate:1% 6px;opacity:.85}100%{translate:0 10px;opacity:0}}
@keyframes shore-wash{0%,100%{translate:0 -3px;opacity:.15}60%{translate:0 5px;opacity:.65}}
@media(prefers-reduced-motion:reduce){.coast-surf *{animation:none!important}.surf-line{opacity:.35}.coast-wash{opacity:.25}}.reduced .coast-surf *{animation:none!important}.reduced .surf-line{opacity:.35}.reduced .coast-wash{opacity:.25}

.surf-mask-defs{position:absolute;pointer-events:none}.coast-surf{mask:url(#coast-surf-mask);-webkit-mask:url(#coast-surf-mask)}
#world-thunder-touch{position:absolute;right:3%;top:0;width:21%;height:25%;min-height:48px;pointer-events:auto;background:transparent;border:0;box-shadow:none;z-index:5}#world-lightning{position:absolute;right:10%;top:15%;width:10%;height:27%;background:#ffe836;clip-path:polygon(43% 0,100% 0,61% 40%,91% 40%,0 100%,29% 53%,0 53%);filter:drop-shadow(2px 2px #123d61);pointer-events:none;z-index:4}.event-duckfamily{top:24%;width:33%;height:22%;animation:boat-pass 19s linear forwards}#world-windmill{position:absolute;left:36.5%;top:11%;width:17%;height:25%;min-height:0;padding:0;background:transparent;border:0;pointer-events:auto;z-index:3;box-shadow:none}#world-windmill span{display:block;position:absolute;inset:0;background:linear-gradient(36deg,transparent 45%,#8c4526 46% 53%,transparent 54%),linear-gradient(-36deg,transparent 45%,#8c4526 46% 53%,transparent 54%);transform-origin:50% 50%}.mill-turning span{animation:windmill-turn 3.6s ease-in-out}#world-windmill span:after{content:'';position:absolute;left:43%;top:42%;width:15%;height:17%;border-radius:50%;background:#ffce27;border:1px solid #123d61}@keyframes windmill-turn{to{rotate:720deg}}
@media(prefers-reduced-motion:reduce){.mill-turning span{animation:none;rotate:45deg}}.reduced .mill-turning span{animation:none;rotate:45deg}
/* The moving host keeps its path while its balloon rises independently. */
button.world-sky{padding:0;border:0;background:transparent!important;min-height:44px;z-index:3;box-shadow:none;overflow:visible}button.world-sky img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated;pointer-events:none}button.world-sky:disabled{opacity:1}button.world-sky.event-balloon{pointer-events:auto;cursor:pointer}button.world-sky.event-balloon:focus-visible{outline:3px solid #ffcf24;outline-offset:4px}.balloon-flame{display:none;position:absolute;left:38%;top:52%;font-size:clamp(14px,3vw,24px);pointer-events:none}.burner-on .balloon-flame{display:block;animation:balloon-burner-rise 3.6s ease-in-out}.burner-on img{animation:balloon-burner-rise 3.6s ease-in-out}@keyframes balloon-burner-rise{0%,100%{translate:0 0}25%,45%{translate:0 -30px}}@media(prefers-reduced-motion:reduce){.burner-on img,.burner-on .balloon-flame{animation:none}}.reduced .burner-on img,.reduced .burner-on .balloon-flame{animation:none}
