*{box-sizing:border-box}html,body,#root{min-height:100%}body{background:#dcebf5;margin:0;font-family:Microsoft YaHei,PingFang SC,Noto Sans SC,system-ui,sans-serif}button,input{font:inherit}:root{--ink:#26313d;--ink-soft:#43505d;--cream:#fff3d2;--cream-dark:#ead69c;--blue:#5eb5f4;--blue-dark:#334159;--green:#60bf37;--green-dark:#2e7a28;--orange:#ffbf2d;--orange-dark:#d87912;--gray:#6f7782;--shadow:#1a283647}.app-shell{background:radial-gradient(circle at 20% 10%,#ffffffe6 0 120px,#0000 121px),linear-gradient(135deg,#eaf7ff,#c7e5f4 55%,#e7f3e8);place-items:center;min-height:100vh;padding:16px;display:grid}.phone-stage{aspect-ratio:750/1334;background:linear-gradient(#8ed8ff 0%,#bdeeff 38%,#e9f7db 38% 100%);border-radius:28px;width:min(750px,100vw - 32px,56.22vh - 17.9904px);position:relative;overflow:hidden;box-shadow:0 26px 60px #27394c57,inset 0 0 0 6px #ffffff73;container-type:inline-size}.stage-overlay{pointer-events:none;background:linear-gradient(#ffffff2e,#0000 34%),radial-gradient(circle at 50% 78%,#ffffff73,#0000 42%);position:absolute;inset:0}.sun{background:linear-gradient(#ffe88c,#ffc54d);border:6px solid #ffffffb3;border-radius:999px;width:110px;height:110px;position:absolute;top:64px;left:70px;box-shadow:0 8px 22px #ea9d2040}.cloud,.cloud:before,.cloud:after{background:#ffffffd9;border:5px solid #ffffff59;border-radius:999px;position:absolute}.cloud{width:140px;height:42px}.cloud:before,.cloud:after{content:""}.cloud:before{width:58px;height:58px;top:-30px;left:24px}.cloud:after{width:70px;height:70px;top:-42px;right:18px}.cloud-one{top:118px;right:84px}.cloud-two{opacity:.72;top:230px;left:92px;transform:scale(.78)}.mountains{height:330px;position:absolute;bottom:320px;left:-64px;right:-64px}.mountains span{background:linear-gradient(#bfd0c7,#88ad9c);border:6px solid #40637180;border-radius:48% 48% 0 0;width:360px;height:260px;position:absolute;bottom:0;transform:rotate(45deg)}.mountains span:first-child{left:0}.mountains span:nth-child(2){background:linear-gradient(#d7d9c4,#9ab18d);height:300px;left:220px}.mountains span:nth-child(3){background:linear-gradient(#c6d6d2,#7aa793);right:0}.bushes{height:240px;position:absolute;bottom:168px;left:-40px;right:-40px}.bushes span{background:linear-gradient(#9be257,#47aa34);border:6px solid #4f8e32;border-radius:52% 52% 36% 36%;width:210px;height:190px;position:absolute;bottom:0;box-shadow:inset 0 12px #fff3}.bushes span:first-child{height:150px;left:-8px}.bushes span:nth-child(2){left:115px}.bushes span:nth-child(3){height:215px;left:275px}.bushes span:nth-child(4){right:112px}.bushes span:nth-child(5){height:155px;right:-12px}.stones{position:absolute;bottom:120px;left:0;right:0}.stones span{background:linear-gradient(#c9ced2,#87909a);border:5px solid #58606d;border-radius:999px 999px 20px 20px;width:86px;height:42px;position:absolute}.stones span:first-child{left:88px}.stones span:nth-child(2){width:118px;right:116px}.stones span:nth-child(3){bottom:-34px;left:322px}.settings-panel{z-index:2;width:86.67cqw;animation:.48s cubic-bezier(.2,1.25,.34,1) both panel-pop;position:absolute;top:15.47cqw;left:50%;transform:translate(-50%)}.panel-title{border:6px solid var(--ink);background:linear-gradient(#ffffff3d,#0000 34%),linear-gradient(#55637d,#2f3a52 70%,#263046);border-radius:42px 42px 30px 30px;height:16.53cqw;position:relative;box-shadow:0 14px #1e263533,inset 0 -10px #090e1a24}.panel-title h1{color:#fff;text-align:center;letter-spacing:0;-webkit-text-stroke:.22cqw #1c2434;paint-order:stroke fill;text-shadow:0 .55cqw #1c2434c7;margin:0;font-size:7.2cqw;line-height:14.93cqw}.close-button{cursor:pointer;background:0 0;border:0;border-radius:50%;width:12.8cqw;height:12.8cqw;transition:transform .14s;position:absolute;top:-3.4cqw;right:-3.2cqw}.close-button img{object-fit:contain;filter:drop-shadow(0 .75cqw #191e2738);width:100%;height:100%;display:block}.close-button:active,.game-button:active,.toggle-switch:active{transform:scale(.94)}.panel-body{border:6px solid var(--ink);background:linear-gradient(#ffffff85,#0000 26%),linear-gradient(135deg,#fff4cf,#dff1ff 62%,#f8e7b2);border-radius:34px;margin-top:-2.4cqw;padding:7.2cqw 5.07cqw 5.07cqw;position:relative;box-shadow:0 18px #29303a33,inset 0 0 0 5px #ffffff61}.setting-row{border:6px solid var(--ink);background:linear-gradient(#fff9,#0000 42%),linear-gradient(#fdf5d8,#f2dca8);border-radius:28px;grid-template-columns:12.8cqw minmax(0,1fr) 25.8cqw;align-items:center;gap:1.6cqw;height:16.35cqw;margin-bottom:2.67cqw;padding:1.4cqw 1.9cqw;display:grid;box-shadow:0 8px #242c3529,inset 0 -6px #be8f4429}.setting-label{color:#fff;letter-spacing:0;white-space:nowrap;-webkit-text-stroke:.18cqw var(--ink);paint-order:stroke fill;text-shadow:0 .34cqw #26313d7a;min-width:0;font-size:3.95cqw;font-weight:900}.setting-label.is-long{font-size:3.38cqw}.setting-control{justify-content:flex-end;align-items:center;display:flex}.icon-badge{filter:drop-shadow(0 .65cqw #26313d33);background:0 0;border:0;place-items:center;width:12.3cqw;height:12.3cqw;display:grid}.icon-badge img{object-fit:contain;width:100%;height:100%;display:block}.icon-soldier,.icon-level{width:13.2cqw;height:13.2cqw}.toggle-switch{cursor:pointer;filter:drop-shadow(0 .7cqw #1f273038);background:0 0;border:0;border-radius:999px;width:22.8cqw;height:10.3cqw;transition:transform .14s,filter .16s;position:relative;overflow:hidden}.toggle-art{object-fit:fill;width:100%;height:100%;transition:transform .22s cubic-bezier(.2,.85,.28,1.2);display:block}.toggle-switch:active .toggle-art{transform:scale(.96)}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.volume-control{grid-template-columns:1fr 5.8cqw;align-items:center;gap:1.6cqw;width:29cqw;display:grid;transform:translate(.27cqw)}.volume-slider{appearance:none;cursor:pointer;border:6px solid var(--ink);background:linear-gradient(90deg, #89df45 0 var(--volume), #566371 var(--volume) 100%);border-radius:999px;width:100%;height:4.3cqw;box-shadow:0 7px #1f27302e,inset 0 5px #ffffff29}.volume-slider::-webkit-slider-thumb{appearance:none;width:7.73cqw;height:7.73cqw;box-shadow:0 6px 0 #1f273038, 0 0 0 5px var(--ink);background:radial-gradient(circle at 30% 25%,#fff 0 18%,#0000 19%),linear-gradient(#fffdf4,#e6ddcf);border:6px solid #d9d0bf;border-radius:50%}.volume-slider::-moz-range-thumb{border:6px solid var(--ink);background:#fff8ec;border-radius:50%;width:48px;height:48px}.volume-value{color:#fff;text-align:right;-webkit-text-stroke:.15cqw var(--ink);paint-order:stroke fill;text-shadow:0 .3cqw #26313d6b;font-size:2.85cqw;font-weight:900}.panel-actions{grid-template-columns:1fr 1fr;gap:3.73cqw;padding-top:1.07cqw;display:grid}.game-button{border:6px solid var(--ink);color:#fff;letter-spacing:0;cursor:pointer;-webkit-text-stroke:.18cqw #4a2b17;paint-order:stroke fill;text-shadow:0 .48cqw #4a2b178c;border-radius:28px;min-height:11.73cqw;font-size:4.05cqw;font-weight:1000;transition:transform .14s,filter .16s;box-shadow:0 10px #26313d40,inset 0 -10px #1a3a1a29}.game-button:hover{filter:brightness(1.04)}.game-button.green{background:radial-gradient(circle at 16% 18%,#ffffffe6 0 8%,#0000 9%),linear-gradient(#89e653,#4caf35 66%,#2f8a2c)}.game-button.orange{background:radial-gradient(circle at 16% 18%,#ffffffe6 0 8%,#0000 9%),linear-gradient(#ffe46e,#ffbd2e 62%,#ea861d)}.open-settings{z-index:3;min-width:37.33cqw;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.open-settings:active{transform:translate(-50%,-50%)scale(.94)}.save-toast{border:6px solid var(--ink);color:#fff;text-align:center;-webkit-text-stroke:.16cqw #4b3219;paint-order:stroke fill;text-shadow:0 .36cqw #4b321975;background:radial-gradient(circle at 18% 20%,#ffffffd9 0 8%,#0000 9%),linear-gradient(#fff,#ffe99f);border-radius:999px;min-width:31.73cqw;padding:2.4cqw 4cqw;font-size:3.35cqw;font-weight:1000;animation:.18s ease-out both toast-in;position:absolute;bottom:-13.87cqw;left:50%;transform:translate(-50%);box-shadow:0 10px #26313d38}@keyframes panel-pop{0%{opacity:0;transform:translate(-50%)scale(.78)}70%{opacity:1;transform:translate(-50%)scale(1.04)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(12px)scale(.92)}to{opacity:1;transform:translate(-50%)translateY(0)scale(1)}}