/* Float or Sink: the water tank, the two guesses and the object tray. Colours follow the Kids palette. No inline styles. */
.gw-stage [hidden]{display:none!important}

.gw-levels,.gw-guess{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 14px}
.gw-levels button,.gw-guess button{min-height:44px;padding:8px 16px;border-radius:999px;border:2px solid #2a3577;background:#121a45;color:#f4f6ff;font:inherit;font-weight:700;cursor:pointer}
.gw-levels button[aria-pressed="true"],.gw-guess button[aria-pressed="true"]{background:#3dd5f3;border-color:#3dd5f3;color:#0d1333}
.gw-guess button{min-width:132px;font-size:1.1rem}
.gw-levels button:focus-visible,.gw-guess button:focus-visible,.gw-item:focus-visible{outline:3px solid #f4c76b;outline-offset:3px}

.gw-water{position:relative;height:clamp(250px,46vw,340px);margin:0 auto 16px;border-radius:18px;overflow:hidden;background:linear-gradient(#1b2a5e,#0d1333 45%);border:2px solid #2a3577;transition:border-color .15s,box-shadow .15s}
.gw-water.gw-over{border-color:#6fb6ff;box-shadow:0 0 0 4px rgba(111,182,255,.35)}
.gw-body{position:absolute;left:0;right:0;bottom:0;top:32%;background:linear-gradient(rgba(79,195,247,.55),rgba(1,87,155,.92))}
.gw-wave{position:absolute;left:0;top:calc(32% - 8px);width:100%;height:16px;fill:#4fc3f7}
.gw-row{position:absolute;left:0;right:0;display:flex;justify-content:space-evenly;align-items:flex-end;gap:6px;padding:0 8px;pointer-events:none}
.gw-surface{top:calc(32% - 78px);height:74px}
.gw-bottom{bottom:6px;height:84px}

.gw-obj{display:block;width:clamp(44px,13vw,70px);flex:0 0 auto}
.gw-obj-art{display:block;width:100%;height:auto}
.gw-float{animation:gw-bob 2.6s ease-in-out infinite}
.gw-sink{animation:gw-fall .7s ease-in both}
@keyframes gw-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes gw-fall{from{transform:translateY(-150px);opacity:.25}to{transform:translateY(0);opacity:1}}

.gw-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;min-height:84px;margin-bottom:16px}
.gw-item{width:clamp(64px,18vw,84px);aspect-ratio:1;padding:6px;border-radius:16px;border:2px solid #2a3577;background:#121a45;cursor:grab;touch-action:none;user-select:none}
.gw-item[hidden]{display:none!important}
.gw-item svg{display:block;width:100%;height:100%}
.gw-item.gw-selected{border-color:#3dd5f3;box-shadow:0 0 0 3px rgba(61,213,243,.4)}
.gw-item.gw-drag{position:relative;z-index:2;opacity:.92;cursor:grabbing}
.gw-shake{animation:gw-shake .4s}
@keyframes gw-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}

.gw-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:14px}
.gw-actions svg{width:20px;height:20px;max-width:20px}
.gw-win-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.gw-howto{margin-top:28px}
.gw-steps{padding-left:1.2em;line-height:1.7}

@media (max-width:520px){
 .gw-levels button,.gw-guess button{flex:1 1 auto}
 .gw-guess button{min-width:0}
}
@media (prefers-reduced-motion: reduce){
 .gw-float,.gw-sink,.gw-shake{animation:none}
 .gw-water{transition:none}
}
