/* Frog Crossing uses the supplied transparent sprites as independent layers. */
.frog-layout{display:flex;align-items:center;gap:18px;max-width:1050px;margin:auto}
.frog-layout>.spelling-clue{flex:none;width:125px;height:150px;object-fit:contain}
.frog-play{flex:1;min-width:0}
.frog-pond{position:relative;isolation:isolate;height:255px;overflow:hidden;border:3px solid #a5d8ce;border-radius:25px;background:linear-gradient(180deg,#e3f4dc 0%,#9ad7dc 30%,#64bbcc 100%);box-shadow:inset 0 8px 24px #fff8,inset 0 -12px 22px #1f7f9360}
.frog-pad,.frog-sprite,.frog-splash,.frog-ripple{position:absolute;display:block;pointer-events:none;user-select:none;object-fit:contain}
.frog-pad{z-index:2;width:clamp(46px,9.5%,82px);transform:translate(-50%,-50%) rotate(var(--pad-tilt));animation:frog-pad-drift 3.8s ease-in-out infinite;animation-delay:var(--pad-delay)}
.frog-pad-large{width:clamp(54px,11%,95px)}
.frog-sprite{z-index:3;width:clamp(58px,12%,88px);transform:translate(-50%,-78%);filter:drop-shadow(0 4px 2px #1f68704d)}
.frog-sprite[hidden]{display:none}
.frog-victory{position:fixed;z-index:101;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 5px 3px #1f68704d)}
.frog-sprite.landing{animation:frog-land-bounce .17s ease-out}
.frog-ripple,.frog-splash{left:93%;top:79%;opacity:0;transform:translate(-50%,-65%) scale(.7)}
.frog-ripple{z-index:1;width:clamp(64px,13%,130px)}
.frog-splash{z-index:4;width:clamp(62px,12%,120px)}
.frog-ripple.visible{opacity:1;animation:frog-ripple .8s ease-out forwards}
.frog-splash.visible{opacity:1;animation:frog-splash .42s ease-out forwards}
.frog-attempts{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:7px 5px;color:#365f55;font-size:13px}
.frog-attempts .guess-count{position:static;margin:0;font-size:13px;color:#245c47}
.frog-attempts span{overflow-wrap:anywhere}
@keyframes frog-pad-drift{0%,100%{translate:0 -2px}50%{translate:0 2px}}
@keyframes frog-land-bounce{0%,100%{scale:1}50%{scale:1.08 .93}}
@keyframes frog-splash{0%{opacity:0;transform:translate(-50%,-65%) scale(.7)}22%{opacity:1;transform:translate(-50%,-70%) scale(1)}100%{opacity:0;transform:translate(-50%,-78%) scale(1.05)}}
@keyframes frog-ripple{0%{opacity:0;transform:translate(-50%,-65%) scale(.7)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-65%) scale(1.25)}}
@media(max-width:700px){.frog-layout{flex-direction:column;gap:4px}.frog-layout>.spelling-clue{width:88px;height:75px}.frog-play{width:100%}.frog-pond{height:215px}.frog-attempts{font-size:12px;padding:5px 3px}.frog-attempts .guess-count{font-size:12px}.spelling-word{margin:10px auto}}
@media(max-width:420px){.frog-pond{height:195px}.frog-layout>.spelling-clue{width:72px;height:60px}}
@media(prefers-reduced-motion:reduce){.frog-pad{animation:none}.frog-ripple.visible,.frog-splash.visible{opacity:1;animation:none}}