:root{font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;color:#fff;background:#151b20}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;overflow:hidden;background:#20272b}
button{font:inherit;cursor:pointer;border:0;color:inherit}
#game-shell{position:relative;width:min(100vw,calc(100dvh * 464 / 960),464px);aspect-ratio:464/960;height:auto;margin:0 auto;overflow:hidden;background:#cef3f5;box-shadow:0 12px 38px #0009;touch-action:none;user-select:none}
#game{display:block;width:100%;height:100%;background:#bdeef2}
.panel{position:absolute;left:3%;right:3%;bottom:86px;z-index:5;padding:18px 14px 14px;border:4px solid #211914;border-radius:8px;background:#50382c;box-shadow:0 8px 0 #2b1d17,0 12px 24px #0007}
.shop-panel{bottom:48px;z-index:8}
.panel::before{content:"";position:absolute;inset:5px;border:2px solid #705345;border-radius:4px;pointer-events:none}
.panel header{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;margin:-39px auto 14px;width:62%;min-height:48px;border:4px solid #24201d;border-radius:8px;background:#64727e;box-shadow:0 5px 0 #30251f;font-size:23px;font-weight:900;letter-spacing:2px;text-shadow:0 2px #222}
.panel header button{position:absolute;right:-64px;width:48px;height:48px;border:3px solid #241b17;border-radius:5px;background:#4b342a;box-shadow:inset 0 1px #79594a;color:transparent;font-size:0}.panel header button::before{content:"";position:absolute;left:12px;top:16px;width:18px;height:21px;border:3px solid #c7b8ad;border-top:0;border-radius:0 0 3px 3px}.panel header button::after{content:"";position:absolute;left:9px;top:11px;width:25px;height:3px;border-radius:2px;background:#c7b8ad;box-shadow:7px -5px 0 -1px #c7b8ad}
.shop-row{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.shop-card{min-height:158px;padding:10px 6px;border:3px solid #241b17;border-radius:7px;background:#33241e;box-shadow:inset 0 1px #7b5b49;display:flex;flex-direction:column;align-items:center;gap:5px;transition:transform .16s,filter .16s}
.shop-card:hover{filter:brightness(1.08);transform:translateY(-2px)}.shop-card:active{transform:translateY(1px) scale(.98)}
.shop-card strong{order:0;font-size:16px}.shop-card .shop-gear{order:1}.shop-card small{order:2;min-height:8px;color:#cdbbae;font-size:10px;line-height:1.35}.shop-card b{order:3;margin-top:auto;color:#f1c36a;font-size:15px}
.shop-gear{position:relative;display:grid;place-items:center;width:70px;height:70px;flex:0 0 70px}.shop-gear svg{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 2px 0 #171310)}.gear-body{fill:#f5c51e;stroke:#302923;stroke-width:3;stroke-linejoin:round}.gear-hub{fill:#a97b13;stroke:#302923;stroke-width:2}.shop-gear.generator .gear-body{fill:#62666a}.shop-gear.generator .gear-hub{fill:#292b2d}.shop-gear.rage .gear-body{fill:#e92754}.shop-gear.rage .gear-hub{fill:#991935}.gear-label{position:relative;z-index:2;font-size:21px;font-weight:900;text-shadow:-2px 0 #2c241f,0 2px #2c241f,2px 0 #2c241f,0 -2px #2c241f}.gear-unit{display:none;position:relative;z-index:2;width:25px;height:46px;object-fit:contain;filter:grayscale(.35) sepia(.15) drop-shadow(0 1px 0 #201b18)}.shop-gear.generator .gear-unit{display:block}.shop-gear.generator .gear-label{display:none}
.shop-empty{position:relative;z-index:1;margin:18px 4px 8px;padding:22px 12px;border:1px dashed #8eb2c4;border-radius:15px;color:#c7d9e1;text-align:center;background:#0f1b2288}
.panel-actions{position:relative;z-index:1;display:flex;gap:14px;margin-top:13px}.panel-actions button,.primary,.secondary{flex:1;padding:12px;border:3px solid #211b17;border-radius:7px;font-weight:900;box-shadow:0 4px 0 #291c16;transition:transform .15s,filter .15s}.panel-actions button:active,.primary:active,.secondary:active{transform:translateY(2px)}.primary{background:#f1dd48;color:#2d291d}.secondary{background:#20bade;color:#fff}
.bottom-nav{position:absolute;z-index:6;left:0;right:0;bottom:0;height:72px;display:grid;grid-template-columns:repeat(3,1fr);border-top:4px solid #211914;border-radius:0;background:#251c18;box-shadow:0 -4px 10px #0006;overflow:hidden}
.bottom-nav button{background:transparent;color:#8d817a;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;font-weight:800}.bottom-nav button span{display:grid;place-items:center;width:29px;height:29px;border:1.5px solid currentColor;border-radius:7px;font-size:16px;line-height:24px}.bottom-nav button.active{color:#fff;background:#574034;box-shadow:inset 0 4px #8b6a55}
.hidden{display:none!important}
.upgrade-panel{top:110px;bottom:80px;background:#d5c9a8;color:#29251f}.upgrade-panel header{color:white}.evolution{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-around;margin:20px 0}.era{width:112px;padding-top:85px;text-align:center;font-weight:900;background-position:center top;background-repeat:no-repeat}.cave{background-image:radial-gradient(ellipse at 50% 70%,#141414 0 25%,#6f716a 27% 44%,transparent 45%)}.hut{background-image:linear-gradient(145deg,transparent 0 35%,#6b411f 36% 64%,transparent 65%)}.arrow{font-size:42px;color:#363330;text-align:center}.arrow small{display:block;font-size:11px;color:#9d2e2e}.base-upgrade,.unit-card{position:relative;z-index:1;display:flex;align-items:center;gap:10px;margin:15px 0;padding:14px;border:3px solid #4a4336;border-radius:9px;background:#b8ab87}.base-upgrade span:first-child{flex:1}.base-upgrade button,.unit-card button{padding:10px;border:3px solid #222;border-radius:7px;background:#16bde1;font-weight:900}.unit-card{align-items:center}.unit-card .portrait{width:82px;height:92px;background:url('./assets/unit.png') center/contain no-repeat}.unit-card div:nth-child(2){flex:1}.unit-card h3{margin:0}.unit-card p{font-size:13px}
.modal{position:absolute;z-index:20;left:8%;right:8%;top:28%;padding:24px 18px;border:5px solid #271d18;border-radius:12px;background:#5b3d30;text-align:center;box-shadow:0 0 0 999px #111b,0 8px 0 #251915}.modal h2{margin:8px 0;font-size:30px}.modal p{font-size:21px}.modal button{width:100%}.reward-emblem{display:grid;place-items:center;width:86px;height:86px;margin:auto;border:7px double #fff4c5;border-radius:50%;background:#d89f25;font-size:48px;font-weight:900;text-shadow:0 4px #6d4814}
#toast{position:absolute;z-index:30;left:50%;top:44%;transform:translate(-50%,-50%);padding:9px 17px;border-radius:22px;background:#1c1c1ddd;color:white;font-weight:800;opacity:0;transition:opacity .2s;pointer-events:none;white-space:nowrap}#toast.show{opacity:1}
@media (max-height:760px){.panel{bottom:73px;transform:scale(.88);transform-origin:bottom center;left:-2%;right:-2%}.bottom-nav{height:58px}.upgrade-panel{top:90px;bottom:68px}}