.sand-app{color-scheme:light;--ink:#3f453e;--muted:#606454;--sea:#244f50;--paper:#fff8e8;--safe-top:max(22px,env(safe-area-inset-top));--safe-bottom:max(24px,env(safe-area-inset-bottom));font-family:Yu Gothic UI,Hiragino Kaku Gothic ProN,Meiryo,sans-serif}.sand-app *{box-sizing:border-box}.sand-app{overscroll-behavior:none;background:#c3aa7e;width:100%;height:100%;margin:0;overflow:hidden}.sand-app button{font:inherit}.sand-app #beach{isolation:isolate;-webkit-user-select:none;user-select:none;width:100%;height:100dvh;position:relative}.sand-app #sand{touch-action:none;cursor:crosshair;outline:none;width:100%;height:100%;display:block}.sand-app .vignette{pointer-events:none;background:radial-gradient(at 45% 44%,#0000 42%,#59432118 100%);position:absolute;inset:0}.sand-app .title-block{top:calc(var(--safe-top) + 10px);left:max(40px,env(safe-area-inset-left));pointer-events:none;color:var(--ink);text-shadow:0 1px 18px #fff9d588;position:absolute}.sand-app .brand{align-items:center;display:flex}.sand-app .brand img{filter:brightness(0);opacity:.5;width:112px;height:auto;display:block}.sand-app .sand-title{letter-spacing:.14em;margin:19px 0 9px;font-family:Yu Mincho,Hiragino Mincho ProN,serif;font-size:clamp(24px,2.7vw,38px);font-weight:500}.sand-app .title-block p{letter-spacing:.19em;color:#575d50;margin:0;font-size:12px}.sand-app .prototype{top:calc(var(--safe-top) + 10px);right:max(36px,env(safe-area-inset-right));letter-spacing:.13em;color:#526058;pointer-events:none;border:1px solid #52605838;border-radius:30px;padding:7px 13px;font-size:10px;position:absolute}.sand-app .controls{bottom:var(--safe-bottom);white-space:nowrap;flex-direction:column;align-items:center;gap:12px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.sand-app #hint{letter-spacing:.1em;color:#4d5349;text-shadow:0 1px 9px #fff8e5;margin:0;font-size:11px}.sand-app #wave{background:var(--sea);color:#faf7e9;letter-spacing:.13em;cursor:pointer;border:1px solid #fcfff829;border-radius:50px;justify-content:center;align-items:center;gap:12px;min-width:180px;min-height:55px;padding:13px 26px;font-size:14px;font-weight:500;transition:background .2s,transform .2s,opacity .2s;display:flex;box-shadow:0 6px 19px #273b3824,inset 0 1px #fff3}.sand-app #wave svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:26px;height:24px}.sand-app #wave:hover:not(:disabled){background:#1a4143;transform:translateY(-2px)}.sand-app #wave:focus-visible{outline-offset:4px;outline:3px solid #fff9ed}.sand-app #wave:disabled{cursor:default;opacity:.72}.sand-app #cursor{pointer-events:none;border:1px solid #fff9e9aa;border-radius:50%;width:24px;height:16px;margin-top:-8px;margin-left:-12px;display:none;position:fixed;box-shadow:0 0 0 1px #625b4533}.sand-app #fallback{text-align:center;color:#293f3e;background:#fff8e8ee;border-radius:14px;padding:25px;line-height:1.8;position:absolute;inset:40% 12% auto}.sand-app #fallback[hidden]{display:none}@media (width<=600px){.sand-app{--safe-top:max(20px,env(safe-area-inset-top));--safe-bottom:max(25px,env(safe-area-inset-bottom))}.sand-app .title-block{left:max(23px,env(safe-area-inset-left));top:var(--safe-top)}.sand-app .brand img{width:96px}.sand-app .sand-title{letter-spacing:.1em;margin-top:17px;font-size:27px}.sand-app .title-block p{font-size:10px}.sand-app .prototype{top:var(--safe-top);right:max(18px,env(safe-area-inset-right));padding:6px 9px;font-size:9px}.sand-app .controls{gap:13px}.sand-app #hint{font-size:10px}.sand-app #wave{min-width:178px;min-height:56px}}@media (height<=500px){.sand-app .title-block{top:16px}.sand-app .sand-title{margin:9px 0 4px;font-size:23px}.sand-app .title-block p{display:none}.sand-app .controls{bottom:max(15px,env(safe-area-inset-bottom));right:max(22px,env(safe-area-inset-right));left:auto;transform:none}.sand-app #hint{display:none}.sand-app #wave{min-width:150px;min-height:48px}.sand-app .prototype{top:18px}}.sand-app #drawing-safety{top:max(20px,env(safe-area-inset-top));right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));left:max(20px,env(safe-area-inset-left));pointer-events:none;visibility:hidden;position:absolute}@media (prefers-reduced-motion:reduce){.sand-app #wave{transition:none}}.sand-app #beach:not([data-state=ready]) #sand{cursor:auto;pointer-events:none}.sand-app #beach:not([data-state=ready]) #cursor{display:none!important}.sand-app #fallback{z-index:5;user-select:text;max-width:600px;margin:auto;inset:35% 22px auto}.sand-app #fallback p{margin:12px 0;font-size:14px}.sand-app #retry{color:#fff8e8;cursor:pointer;background:#244f50;border:1px solid #244f50;border-radius:24px;padding:10px 20px}.sand-app #retry[hidden]{display:none}@media (height<=500px){.sand-app #fallback{padding:18px;inset:18% 22px auto}}.sand-app .wave-actions{justify-content:center;align-items:center;gap:10px;max-width:calc(100vw - 40px);display:flex}.sand-app #sound{min-width:82px;min-height:48px;color:var(--ink);cursor:pointer;background:#fff8e8bb;border:1px solid #3f453e55;border-radius:24px;padding:8px 12px;font-size:12px}.sand-app #sound[aria-pressed=true]{color:#faf7e9;background:#244f50}.sand-app #sound:focus-visible{outline-offset:4px;outline:3px solid #fff9ed}.sand-app #sound:disabled{opacity:.5;cursor:default}.sand-app .audio-status:empty{display:none}.sand-app .audio-status{white-space:normal;max-width:calc(100vw - 40px);color:var(--ink);font-size:10px}.sand-app .wave-actions{flex-wrap:wrap}.sand-app .photo-enter{top:max(12px,env(safe-area-inset-top));right:max(68px,calc(env(safe-area-inset-right) + 56px));min-width:48px;min-height:44px;color:var(--ink);cursor:pointer;background:#fff8e8dc;border:1px solid #3f453e66;border-radius:24px;align-items:center;gap:6px;padding:8px 12px;display:flex;position:absolute}.sand-app .photo-enter svg{fill:none;stroke:currentColor;stroke-width:1.5px;width:22px;height:22px}.sand-app .photo-enter span{font-size:12px}.sand-app .photo-dialog{color:#fff8e8;z-index:30;background:#34362f;border:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;position:fixed;inset:0;overflow:auto}.sand-app .photo-dialog::backdrop{background:#34362f}.sand-app .photo-result{height:100%;min-height:0;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));grid-template-rows:minmax(0,1fr) auto;align-items:stretch;gap:12px;display:grid}.sand-app .photo-result>img{object-fit:contain;-webkit-user-select:auto;user-select:auto;-webkit-touch-callout:default;width:100%;min-width:0;max-width:100%;height:100%;min-height:0;max-height:none;display:block}.sand-app .photo-tools{text-align:center;flex-shrink:0;justify-self:center;width:min(720px,100%)}.sand-app .photo-tools p{min-height:20px;margin:0 0 12px;font-size:13px;line-height:1.5}.sand-app .photo-tools>div{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.sand-app .photo-tools button{color:#244f50;cursor:pointer;background:#fff8e8;border:1px solid #fff8e866;border-radius:24px;min-width:90px;min-height:48px;padding:8px 16px}.sand-app .photo-tools button:disabled{opacity:.5;cursor:wait}.sand-app :is(.photo-enter,.photo-tools button):focus-visible{outline-offset:3px;outline:3px solid #eabf5f}.sand-shell[data-photo=on] :is(.title-block,.controls,.vignette,.sand-close,.photo-enter,#cursor){visibility:hidden}@media (width<=560px){.sand-app .photo-enter span{display:none}.sand-app .photo-enter{padding:10px}.sand-app .photo-tools>div{gap:8px}.sand-app .photo-tools button{padding:8px 12px}}.sand-app .sand-share-now{background:var(--paper);min-width:84px;min-height:48px;color:var(--sea);border-color:#3f453e55;gap:6px;margin:0;font-size:12px}.sand-app .sand-share-now svg{width:20px;height:20px}.sand-app .sand-share-status{bottom:calc(var(--safe-bottom) + 118px);text-align:center;max-width:550px;color:var(--ink);pointer-events:none;background:#fff8e8dd;border-radius:10px;margin:0 auto;padding:6px 10px;font-size:12px;line-height:1.5;position:absolute;left:16px;right:16px}.sand-app .sand-share-status:empty{display:none}.sand-shell[data-photo=on] .sand-share-status{visibility:hidden}.sand-app .sand-share-now{background:var(--paper);min-height:48px;color:var(--sea);font:inherit;cursor:pointer;border:1px solid #3f453e55;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:8px 12px;font-size:12px;display:inline-flex}.sand-app .controls{width:min(620px,100vw - 32px)}.sand-app #beach{flex:none;padding:0}.sand-shell{min-height:250px;position:relative}.sand-preview{border-radius:16px;position:relative;overflow:hidden}.sand-preview img{width:100%;height:auto;display:block}.sand-enter{color:#fff8e8;min-height:48px;font:inherit;cursor:pointer;background:#244f50;border:0;border-radius:28px;padding:10px 32px;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}.sand-app,.sand-app #beach{height:100%}.sand-close{z-index:10;top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));color:#3f453e;cursor:pointer;background:#fff8e899;border:1px solid #3f453e66;border-radius:50%;width:44px;height:44px;font:28px sans-serif;position:absolute}.sand-shell [hidden]{display:none!important}.sand-shell :is(.sand-close,.sand-enter):focus-visible{outline-offset:3px;outline:3px solid #244f50}.sand-introduction{border:1px solid #c6c3ba;border-radius:12px;margin:32px 0;padding:20px}.sand-introduction h2{margin:0 0 12px;font-size:18px}.sand-introduction .game-share-destinations{flex-wrap:wrap;gap:8px;display:flex}.sand-introduction .game-share-destination{color:#292821;min-height:44px;font:inherit;cursor:pointer;background:#fff;border:1px solid #c8c4ba;border-radius:6px;justify-content:center;align-items:center;gap:7px;padding:8px 12px;font-size:13px;text-decoration:none;display:inline-flex}.sand-introduction .game-share-destination svg{flex:none;width:18px;height:18px}.sand-introduction .game-share-destination:hover{background:#f3efe4;border-color:#a98126}.sand-introduction button:disabled{opacity:.6;cursor:wait}.sand-introduction :focus-visible{outline-offset:4px;outline:3px solid #bd870d}.sand-introduction p{margin:12px 0 0;font-size:13px;line-height:1.6}.sand-introduction summary{cursor:pointer;min-height:44px;padding-top:12px}