@import"https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap";:root{font-family:Noto Sans SC,system-ui,-apple-system,Segoe UI,sans-serif;color:#244d49;background:#326c67;font-synthesis:none}*{box-sizing:border-box}html,body,#water-game{width:100%;height:100%;height:100dvh;margin:0;overflow:hidden}button{font:inherit;cursor:pointer}.pond-shell{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden;background:#326c67;transition:background .8s}.pond-shell.night{background:#0b2635;color:#e2f0e9}.pond-shell.pond-view{background:radial-gradient(ellipse at 48% 38%,#b9b6a9,#a4a496 48%,#818b81)}.pond-shell.pond-view.night{background:radial-gradient(ellipse at 48% 38%,#45585c,#2d424b 66%,#233941)}.pond-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.flow-mode .pond-canvas{cursor:default}.pond-shell.pond-view .pond-canvas{cursor:grab}.pond-shell.pond-view .pond-canvas:active{cursor:grabbing}.ambient-embed .topbar,.ambient-embed .settings,.ambient-embed .intro,.ambient-embed .toolbar,.ambient-embed .pause,.ambient-embed .edge{display:none!important}.pond-shell:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(ellipse at 50% 37%,transparent 48%,rgba(24,60,48,.23) 100%),linear-gradient(180deg,rgba(232,236,188,.17),transparent 24%,transparent 78%,rgba(24,53,45,.16));transition:background .8s}.pond-shell.pond-view:after{background:radial-gradient(ellipse at 50% 40%,transparent 62%,rgba(31,55,45,.1) 100%)}.pond-shell.night:after{background:radial-gradient(ellipse at 50% 40%,transparent 42%,rgba(1,13,30,.58) 100%),linear-gradient(180deg,rgba(4,24,36,.28),transparent 26%,rgba(2,17,31,.2))}.pond-shell.has-photo .edge,.pond-shell.pond-view .edge{display:none}.edge{position:absolute;z-index:2;pointer-events:none;width:34vw;height:36vh;opacity:.76;filter:blur(.3px)}.edge:before,.edge:after{content:"";position:absolute;border-radius:100% 0;background:linear-gradient(135deg,#638e68,#2b624c);box-shadow:0 10px 14px #173d3c26}.edge-left{left:-7vw;bottom:-13vh;transform:rotate(-22deg)}.edge-left:before{width:45%;height:80%;left:5%;bottom:0;transform:rotate(-40deg)}.edge-left:after{width:36%;height:70%;left:35%;bottom:-9%;transform:rotate(10deg)}.edge-right{right:-12vw;top:-21vh;transform:rotate(195deg);opacity:.46}.edge-right:before{width:50%;height:90%;left:0;bottom:0;transform:rotate(-35deg)}.edge-right:after{width:38%;height:68%;left:42%;bottom:-2%;transform:rotate(15deg)}.night .edge{filter:brightness(.5) saturate(.85)}.topbar{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;align-items:start;justify-content:space-between;gap:20px;padding:calc(clamp(18px,3vw,34px) + env(safe-area-inset-top)) clamp(18px,3vw,34px) 0}.top-actions{display:flex;gap:9px}.brand{display:flex;align-items:center;gap:13px;padding:8px 14px 8px 8px;border:1px solid #e6f0dc6b;border-radius:19px;background:#edf4dfc9;box-shadow:0 10px 28px #1d4c3d21;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand-mark{width:39px;height:39px;display:grid;place-items:center;border-radius:13px;background:#c5ded1;color:#327f74;font-size:28px;font-weight:700;line-height:1}.brand small{display:block;color:#61938a;font-size:9px;font-weight:800;letter-spacing:.22em}.brand strong{display:block;margin-top:1px;color:#285e58;font-size:16px;letter-spacing:.12em}.button{border:1px solid #e6f0dc91;border-radius:15px;background:#edf4dfd9;color:#2c665e;box-shadow:0 9px 24px #18483824;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:13px;font-weight:800;transition:transform .18s,background .18s}.button:hover{transform:translateY(-2px);background:#f7ffec}.button:focus-visible,.resume:focus-visible,.leave:focus-visible{outline:3px solid #aef7d2;outline-offset:3px}.exit{min-width:73px;padding:13px 18px}.settings-toggle,.upload{min-width:88px;padding:13px 16px}.settings{position:absolute;z-index:7;top:calc(clamp(77px,7vw,98px) + env(safe-area-inset-top));right:clamp(18px,3vw,34px);width:min(365px,calc(100vw - 28px));max-height:calc(100dvh - 125px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;padding:17px;border:1px solid #e6f0dcb5;border-radius:20px;background:#eef5e8ed;box-shadow:0 22px 55px #133f3747;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.settings[hidden]{display:none}.settings-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.settings-head h2{margin:0;color:#2d6c61;font-size:15px;letter-spacing:.1em}.settings-close{width:28px;height:28px;border:0;border-radius:8px;background:#d5e9db;color:#367667;font-size:21px;line-height:1}.mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:0 0 12px;padding:0;border:0}.mode-switch legend{margin-bottom:7px;color:#3b6f62;font-size:12px;font-weight:800}.mode-switch label{position:relative;display:grid;place-items:center;min-height:36px;border:1px solid #bed9ca;border-radius:10px;background:#e6f0e6;color:#47796c;font-size:12px;font-weight:800;cursor:pointer}.mode-switch label:has(input:checked){background:#3d9181;border-color:#3d9181;color:#fff}.mode-switch input{position:absolute;opacity:0;top:0;right:0;bottom:0;left:0;cursor:pointer}.mode-switch label:has(input:focus-visible){outline:3px solid #aef7d2;outline-offset:2px}.ripple-settings[hidden],.flow-settings[hidden],.pond-settings[hidden]{display:none}.pond-settings{display:flex;flex-direction:column;gap:5px;margin:12px 0 11px;padding-top:12px;border-top:1px solid #cbded1;color:#47796c;font-size:11px;line-height:1.5}.pond-settings strong{font-size:12px;color:#2d6c61}.reset-view{align-self:flex-start;margin-top:5px;padding:7px 10px;border:1px solid #b9d8c3;border-radius:9px;background:#e0eedf;color:#367768;font-size:11px;font-weight:800}.range-row{display:grid;grid-template-columns:76px 1fr 48px;align-items:center;gap:10px;min-height:43px;color:#3b6f62;font-size:12px;font-weight:700}.range-row input{width:100%;accent-color:#438c7c;cursor:pointer}.range-row output{text-align:right;font-variant-numeric:tabular-nums;color:#2a695c;font-size:11px}.settings-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #cbded1;padding-top:12px;color:#719388;font-size:11px}.reset-settings{border:0;background:none;color:#377b6d;font-size:11px;font-weight:800;text-decoration:underline;text-underline-offset:3px}.restore-pond{width:100%;margin:5px 0 12px;padding:10px;border:1px solid #b9d8c3;border-radius:10px;background:#e0eedf;color:#367768;font-size:12px;font-weight:800;cursor:pointer}.restore-pond[hidden]{display:none}.intro{position:absolute;z-index:4;bottom:calc(clamp(22px,3vw,38px) + env(safe-area-inset-bottom));left:clamp(18px,3vw,34px);display:flex;flex-direction:column;gap:4px;max-width:min(425px,calc(100vw - 36px));padding:15px 18px;border:1px solid #e6f0dc83;border-radius:19px;background:#edf4dfc9;box-shadow:0 12px 32px #1b493d22;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);pointer-events:none}.intro strong{font-size:15px;letter-spacing:.04em;color:#2b665b}.intro span{font-size:12px;line-height:1.55;color:#537b70}.toolbar{position:absolute;z-index:5;bottom:calc(clamp(22px,3vw,38px) + env(safe-area-inset-bottom));right:clamp(18px,3vw,34px);display:flex;gap:9px}.toolbar .button{min-width:85px;padding:12px 14px}.toolbar .button[hidden]{display:none}.toolbar .button[aria-pressed=true]{background:#ddf1d7;color:#1e6b60}.night .brand,.night .button,.night .intro{background:#143c49d8;border-color:#719f9a8c;box-shadow:0 12px 28px #020e1b3d}.night .settings{background:#153c49f0;border-color:#719f9a8c}.night .settings-head h2,.night .range-row,.night .range-row output,.night .reset-settings{color:#d5eee3}.night .settings-close{background:#285769;color:#d5eee3}.night .settings-foot,.night .pond-settings{border-color:#588b8a}.night .mode-switch legend{color:#d5eee3}.night .mode-switch label{background:#214d56;border-color:#588b8a;color:#d5eee3}.night .mode-switch label:has(input:checked){background:#3d9181;color:#fff}.night .restore-pond{background:#285769;border-color:#588b8a;color:#d5eee3}.night .pond-settings,.night .pond-settings strong{color:#d5eee3}.night .reset-view{background:#285769;border-color:#588b8a;color:#d5eee3}.has-photo .brand,.has-photo .button,.has-photo .intro{background:#0d302fba;border-color:#d8ecdc87;box-shadow:0 12px 28px #082a234d}.has-photo .brand small,.has-photo .intro span{color:#c2dfd1}.has-photo .brand strong,.has-photo .intro strong,.has-photo .button{color:#f0f9ec}.night .brand-mark{background:#2c6f75;color:#b8e7d9}.night .brand small,.night .intro span{color:#a1c9bd}.night .brand strong,.night .intro strong,.night .button{color:#e2f3e9}.night .toolbar .button[aria-pressed=true]{background:#28586a;color:#e2f3e9}.pause{position:absolute;z-index:10;top:0;right:0;bottom:0;left:0;display:flex;justify-content:flex-end;background:#041e2491;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.pause[hidden],.notice[hidden]{display:none}.pause-card{display:flex;flex-direction:column;width:min(440px,100%);height:100%;padding:calc(30px + env(safe-area-inset-top)) 32px calc(28px + env(safe-area-inset-bottom));border-left:1px solid #9bdbd074;background:linear-gradient(155deg,#113c43f5,#09242dea);color:#e7f5ee;box-shadow:-25px 0 70px #061b2191}.pause-head{display:flex;align-items:center;justify-content:space-between;gap:18px;color:#9ad2c9;font-size:12px;font-weight:800;letter-spacing:.14em}.pause-head i{font-style:normal;opacity:.55}.pause-close{width:35px;height:35px;border:1px solid #a3cfc363;border-radius:50%;background:#ffffff0b;color:#e7f5ee;font-size:23px;line-height:1;cursor:pointer}.pause-content{margin:auto 0}.pause-icon{display:block;color:#a3e4d5;font-size:90px;line-height:.75;font-weight:300;letter-spacing:-.13em}.pause h1{max-width:8em;margin:33px 0 0;font-size:clamp(31px,3vw,42px);line-height:1.18;letter-spacing:.04em}.pause p{max-width:17em;margin:17px 0 0;color:#bad9d1;font-size:15px;line-height:1.7}.pause-actions{display:grid;gap:10px}.resume,.leave{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:55px;padding:13px 16px;border-radius:12px;font-size:15px;font-weight:800;text-align:left;cursor:pointer}.resume span,.leave span{font-size:20px;font-weight:400}.resume{border:1px solid #a9e9d6;background:#b9ecdc;color:#174b46}.leave{border:1px solid #9ac4b876;background:#ffffff0b;color:#e5f5ee}.notice{position:absolute;z-index:12;left:50%;bottom:20%;transform:translate(-50%);width:min(430px,90vw);padding:16px;border-radius:15px;background:#143e46;color:#fff;text-align:center;font-size:13px}@media(max-width:700px){.topbar{gap:6px;padding:calc(12px + env(safe-area-inset-top)) 12px 0}.brand{gap:6px;padding:5px 8px 5px 5px;border-radius:13px}.brand-mark{width:30px;height:30px;font-size:22px}.brand strong{font-size:12px}.brand small{font-size:7px;letter-spacing:.12em}.top-actions{gap:5px}.top-actions .button{min-width:36px;padding:8px 7px;font-size:13px}.top-actions .button span{display:none}.top-actions .exit{min-width:43px;font-size:11px}.settings{top:calc(60px + env(safe-area-inset-top));right:12px;max-height:calc(100dvh - 130px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.intro{bottom:calc(72px + env(safe-area-inset-bottom));left:12px;right:12px;max-width:none;padding:10px 13px}.intro strong{font-size:12px}.intro span{font-size:10px}.toolbar{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));justify-content:space-between;gap:6px}.toolbar .button{flex:1;min-width:0;padding:10px 5px;font-size:11px}.edge{width:45vw;height:20vh}.edge-left{left:-12vw;bottom:-10vh}.edge-right{right:-17vw;top:-10vh}.pause{align-items:flex-end}.pause-card{width:100%;height:auto;min-height:min(440px,69dvh);padding:22px 22px calc(20px + env(safe-area-inset-bottom));border:1px solid #9bdbd074;border-bottom:0;border-radius:28px 28px 0 0;box-shadow:0 -22px 65px #061b2191}.pause-content{margin:34px 0 37px}.pause-icon{font-size:62px}.pause h1{max-width:none;margin-top:23px;font-size:30px}.pause p{margin-top:10px;font-size:14px}.resume,.leave{min-height:51px}}