.toy-gol .toy-scene{display:flex;flex-direction:column;background:var(--sky)}
.goal-field-picker,.goal-ball-picker{display:flex;justify-content:center;align-items:center;gap:8px;padding:8px;flex:none}
.goal-choice.toy-button{width:56px;min-width:48px;height:56px;min-height:48px;padding:4px;border:3px solid transparent;border-radius:16px;background:#fffdf8;box-shadow:none}
.goal-choice[aria-pressed=true]{border-color:var(--leaf);background:#fff0bf}
.goal-choice>svg{width:100%;height:100%;pointer-events:none}
.toy-gol .toy-footer{padding:0;background:#eef0d8}
.goal-arena{position:relative;flex:1;min-height:0;overflow:hidden;container-type:size;isolation:isolate}
.goal-sky{position:absolute;inset:0;background:#cbe8f2;z-index:-3}
.goal-sun{position:absolute;top:7%;right:9%;width:56px;aspect-ratio:1;border-radius:50%;background:#ffd36d}
.goal-cloud{position:absolute;top:10%;left:8%;width:85px;height:22px;border-radius:40px;background:#fffdf8}
.goal-cloud::before,.goal-cloud::after{content:"";position:absolute;bottom:0;border-radius:50%;background:#fffdf8;width:40px;height:40px;left:12px}.goal-cloud::after{left:38px;width:31px;height:31px}
.goal-ground{position:absolute;inset:34% 0 0;background:#80bd6f;z-index:-2;border-radius:45% 45% 0 0/12% 12% 0 0}
.goal-ground::after{content:"";position:absolute;inset:12% 11% 0;border:3px solid #eef9d9;border-bottom:0;border-radius:32% 32% 0 0/12% 12% 0 0;opacity:.8}
.goal-net{position:absolute;top:14%;left:22%;width:56%;height:39%;transform-origin:50% 70%}
.goal-net-svg{width:100%;height:100%;overflow:visible}
.goal-net.scored .goal-net-svg{animation:goal-net-response 650ms var(--ease) 1}
.goal-ball{position:absolute;bottom:8%;left:50%;translate:-50% 0;width:clamp(64px,21cqw,112px);aspect-ratio:1;border:0;background:none;padding:0;border-radius:50%;touch-action:none;z-index:4;overflow:visible}
.goal-ball:disabled{opacity:1}.goal-ball-picture,.goal-ball-svg{display:block;width:100%;height:100%;pointer-events:none}
.goal-ball-picture{transform-origin:center;filter:drop-shadow(0 5px 4px #43374d22)}
.goal-ball:active:not(:disabled) .goal-ball-picture{scale:.97}
.goal-ball-shadow{position:absolute;bottom:6%;left:50%;translate:-50% 0;width:clamp(66px,22cqw,116px);height:12px;background:#365b3d33;border-radius:50%}
.goal-guide{position:absolute;left:50%;bottom:31%;width:38px;height:60px;translate:-50% 0;opacity:.65;pointer-events:none}.goal-guide svg{width:100%;height:100%}
.goal-guide.hidden,.goal-ball-shadow.hidden{opacity:0}
.goal-progress{position:absolute;top:2%;left:4%;display:flex;gap:5px;z-index:4;pointer-events:none}.goal-progress>span{width:24px;height:24px;opacity:.35}.goal-progress>span.done{opacity:1}.goal-progress svg{width:100%;height:100%}
.goal-friend{right:1%;bottom:3%;width:clamp(60px,24cqw,140px);height:clamp(70px,29cqh,170px);z-index:2}
.goal-stars{display:none;position:absolute;inset:0;z-index:-1;pointer-events:none}.goal-stars i{position:absolute;width:7px;height:7px;border-radius:50%;background:#fff8cf;left:12%;top:18%}.goal-stars i:nth-child(2){left:32%;top:7%}.goal-stars i:nth-child(3){left:75%;top:10%}.goal-stars i:nth-child(4){left:90%;top:27%}.goal-stars i:nth-child(5){left:60%;top:4%}
.goal-arena[data-field=beach] .goal-ground{background:#e9cf9b}.goal-arena[data-field=beach] .goal-sky{background:#a4dfec}.goal-arena[data-field=beach] .goal-ground::before{content:"";position:absolute;top:-22px;left:0;right:0;height:22px;background:#60bbce;border-radius:50% 50% 0 0}
.goal-arena[data-field=snow] .goal-ground{background:#f4f8fb}.goal-arena[data-field=snow] .goal-sky{background:#c8dce9}.goal-arena[data-field=snow] .goal-ground::after{border-color:#b6cfdd}.goal-arena[data-field=snow] .goal-ball-shadow{background:#637d9833}
.goal-arena[data-field=space] .goal-sky{background:#3d3459}.goal-arena[data-field=space] .goal-ground{background:#8b82ad}.goal-arena[data-field=space] .goal-sun{background:#ffe5a2;box-shadow:inset -12px -8px 0 #e4c98b}.goal-arena[data-field=space] .goal-cloud{display:none}.goal-arena[data-field=space] .goal-stars{display:block}
@keyframes goal-net-response{40%{scale:1.09 .94}75%{scale:.98 1.03}}
@container (max-height:330px){.goal-net{top:6%;height:46%;left:31%;width:38%}.goal-friend{right:13%;height:80%;width:90px}.goal-guide{bottom:30%;height:40px}.goal-ball{width:64px;bottom:5%}.goal-sun{width:38px;top:4%}}
@media(prefers-reduced-motion:reduce){.goal-net.scored .goal-net-svg{animation:none}.goal-ball:active:not(:disabled) .goal-ball-picture{scale:1}}