.water-game{--ink:#123d56;--blue:#0870c7;color:var(--ink);font-family:inherit;box-sizing:border-box;width:min(900px,100%);height:100vh;max-height:100vh;height:min(900px,100dvh);max-height:100dvh;max-width:100%;padding:24px;border:0;border-radius:28px;background:radial-gradient(ellipse at 80% 30%,#d6efff,transparent 65%),#f0f8fc;overflow:hidden}.water-game::backdrop{background:#072b45ad;backdrop-filter:blur(8px)}.wg-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.wg-brand{font-weight:800;color:#143e57;font-size:16px;text-decoration:none}.wg-header button,.wg-stats button{border:1px solid #c3dfe9;background:#fff9;padding:10px 14px;border-radius:12px;color:#163e55;font:600 13px inherit;min-height:44px;cursor:pointer}.wg-intro{text-align:center;max-width:460px;margin:5vh auto 0}.wg-check{display:inline-grid;place-items:center;width:52px;height:52px;background:#e3f49e;border-radius:50%;font-size:26px}.wg-kicker{font-size:11px;letter-spacing:.08em;margin:18px 0 12px;color:#64808e}.wg-intro h2{font-size:clamp(30px,6vw,48px);letter-spacing:-.05em;margin:10px 0}.wg-intro>p:not(.wg-kicker){line-height:1.5;font-size:20px}.wg-intro strong{color:#0874c5}.wg-play{border:0;border-radius:16px;min-height:52px;padding:14px 24px;background:#def297;color:#123e55;font:700 16px inherit;cursor:pointer}.wg-mini-water{display:flex;justify-content:center;align-items:end;gap:4px;height:90px;margin:22px}.wg-mini-water i{width:35px;height:35px;background:linear-gradient(#66c2f0,#0870c7);border:2px solid #b4eaff;border-radius:8px;animation:wgfloat 2.5s ease-in-out infinite}.wg-mini-water i:nth-child(2){height:70px;animation-delay:.3s}.wg-mini-water i:nth-child(3){height:70px;animation-delay:.6s}.wg-mini-water i:nth-child(4){animation-delay:.9s}.wg-intro .wg-small,.wg-intro .wg-payment{font-size:13px!important;color:#5d7785;max-width:350px;margin:18px auto}.wg-link{border:0;background:none;color:#0966a5;font:600 14px inherit;cursor:pointer;min-height:44px}.wg-arena{display:flex;flex-direction:column;align-items:center;height:calc(100% - 60px);padding-top:14px}.wg-stats{display:flex;gap:25px;align-items:center;width:min(560px,100%);justify-content:space-between;margin-bottom:12px}.wg-stats>span{font-size:11px;color:#607b8c}.wg-stats b{display:block;color:#123d56;font-size:22px}.wg-next{display:flex;flex-direction:column}.wg-next canvas{width:64px;height:36px}.wg-machine{display:flex;gap:22px;align-items:center;justify-content:center;min-height:0;flex:1;width:100%}.wg-board{position:relative;height:100%;aspect-ratio:1/2;max-width:calc(100% - 190px);min-width:0;border-radius:18px;overflow:hidden;border:4px solid #83bad5;box-shadow:0 12px 35px #1a73a327;background:#082f50;box-sizing:border-box}.wg-board>canvas{display:block;width:100%;height:100%}.wg-controls{display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,64px);gap:5px;align-content:center;flex-shrink:0}.wg-controls button{border:1px solid #c1e5f4;border-radius:15px;background:linear-gradient(145deg,#fff,#d5eefc);box-shadow:0 4px 0 #9fcce2;color:#0872b5;display:grid;place-content:center;justify-items:center;gap:3px;padding:4px;touch-action:manipulation;user-select:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.wg-controls button:active{transform:translateY(3px);box-shadow:0 1px 0 #9fcce2}.wg-controls svg{width:24px;height:24px}.wg-controls small{font-size:8px;white-space:nowrap}.wg-rotate{grid-column:2}.wg-left{grid-row:2;grid-column:1}.wg-down{grid-row:2;grid-column:2}.wg-right{grid-row:2;grid-column:3}.wg-drop{grid-row:3;grid-column:2}.wg-hint{text-align:center;font-size:11px;color:#65808f;max-width:340px;margin:12px 0 0}.wg-overlay{position:absolute;inset:0;background:#082f50ca;display:flex;flex-direction:column;align-items:center;justify-content:center;color:white;padding:12px;text-align:center;gap:10px;backdrop-filter:blur(3px)}.wg-overlay .wg-link{color:#b8e5ff}.wg-overlay h3{font-size:24px;margin:0 0 10px}.wg-intro[hidden],.wg-arena[hidden],.wg-overlay[hidden]{display:none!important}@keyframes wgfloat{50%{transform:translateY(-8px)}}@media(max-width:700px){.water-game{inset:0;margin:0;width:100%;height:100vh;height:100dvh;border-radius:0;padding:calc(14px + env(safe-area-inset-top)) 12px calc(14px + env(safe-area-inset-bottom))}.wg-header button{padding:8px 10px}.wg-machine{gap:10px}.wg-controls{grid-template-columns:repeat(3,32px);grid-template-rows:repeat(3,58px);gap:4px}.wg-board{max-width:calc(100% - 116px);height:auto;max-height:100%;width:calc((100dvh - 200px)/2);aspect-ratio:1/2;border-width:3px;border-radius:13px}.wg-stats{gap:15px}.wg-intro{margin-top:5vh}.wg-intro .wg-play{width:100%;max-width:350px}.wg-controls small{font-size:6.5px}.wg-controls svg{width:21px;height:21px}.wg-arena{height:calc(100% - 50px)}.wg-hint{max-width:280px}}@media(max-width:359px){.wg-machine{flex-direction:column;gap:8px}.wg-board{height:calc(100dvh - 400px);width:auto;max-width:100%;flex:1}.wg-controls{grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,38px);gap:3px}.wg-controls svg{height:17px}.wg-controls small{display:none}.wg-hint{display:none}}@media(prefers-reduced-motion:reduce){.wg-mini-water i{animation:none}}
@media(min-width:360px) and (max-width:700px){.wg-controls{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,62px);gap:3px}.wg-controls svg{width:25px;height:25px}.wg-controls small{font-size:8px}.wg-board{max-width:calc(100% - 148px);width:calc((100dvh - 200px)/2)}}