:root{font-family:Inter,system-ui,sans-serif;color:#f4f7fb;background:#0a0d12;color-scheme:dark}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}button,canvas,dialog{touch-action:manipulation}.shell{position:relative;width:100%;height:100%;height:100dvh;min-width:320px;min-height:568px;background:#111923}button,canvas,.mobile-hud{touch-action:manipulation}#render-canvas{display:block;width:100%;height:100%;touch-action:manipulation!important}.mobile-hud{--card-bg: rgb(16 28 44 / 82%);--card-border: rgb(150 170 195 / 55%);--big-button: 17cqw;--small-button: 13cqw;position:absolute;top:0;right:0;bottom:0;left:0;container-type:inline-size;pointer-events:none;font-size:11px;line-height:1.2}.mobile-hud svg.icon{flex:0 0 auto;width:14px;height:14px}.hud-card{position:absolute;pointer-events:auto;padding:5px 6px;color:#f4f7fb;background:var(--card-bg);border:1px solid var(--card-border);border-radius:10px;box-shadow:0 4px 12px #00000073}.stat{display:flex;align-items:center;gap:4px;min-width:0}.bar{position:relative;flex:1;min-width:0;height:15px;overflow:hidden;background:#0b121b;border-radius:8px;max-height:calc(100dvh - 32px);overflow:auto}.bar>i{display:block;width:0;height:100%;border-radius:8px}.bar>span{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:11px;font-weight:600;white-space:nowrap;text-shadow:0 1px 2px #000}.bar-hp>i{background:#db3340}.bar-xp>i{background:#1c8fe8}.bar-stamina>i{background:#18c3bc}.bar-durability>i{background:#34c759}.bar-medicine>i{background:#1c8fe8}.stat>.icon{color:#dbe6f2}.stat>b{flex:1;font-size:12px;text-align:right}.profile{top:max(8px,env(safe-area-inset-top));left:1.6cqw;display:flex;align-items:center;gap:5px;width:33.1cqw}.portrait{display:grid;flex:0 0 auto;place-items:center;width:26px;height:52px;font-size:18px;font-weight:700;color:#f6d2b3;background:linear-gradient(145deg,#684f44,#1c2734);border-radius:6px}.stats{display:grid;flex:1;gap:4px;min-width:0}.stage{top:max(8px,env(safe-area-inset-top));left:35.8cqw;display:grid;gap:3px;width:34.5cqw}.stage-head{display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:12px}.stage-name,.stage-wave{display:flex;align-items:center;gap:3px;white-space:nowrap}.stage-name b{overflow:hidden;text-overflow:ellipsis}.route{display:flex;align-items:center;gap:4px}.route-track{flex:1;height:5px;overflow:hidden;background:#0b121b;border-radius:5px}.route-track>i{display:block;width:0;height:100%;background:#6acbff}.route>.icon{color:#e8eef5}.route-text{font-size:11px;text-align:center;color:#d8e8f5}.stage-level{display:flex;align-items:center;gap:4px}.stage-level>b{font-size:11px}.top-right{position:absolute;top:max(8px,env(safe-area-inset-top));left:71.8cqw;width:26.5cqw;display:grid;gap:5px}.top-right .hud-card{position:static}.coin-row{display:flex;align-items:center;gap:5px;font-size:12px}.coin{width:14px;height:14px;background:radial-gradient(circle at 35% 30%,#ffe27a,#d89a12);border:1px solid #fff2b0;border-radius:50%}.coin-row>b{flex:1;text-align:right}.coin-plus{display:grid;place-items:center;width:16px;height:16px;font-weight:700;color:#cfe6ff;border:1px solid #6f8bab;border-radius:50%}.gear{display:grid;gap:4px}.hud-status{position:absolute;top:118px;left:50%;transform:translate(-50%);font-size:12px;white-space:nowrap;text-shadow:0 2px 5px #000}.action,.weapon,.attack-button,.details-button{display:grid;place-items:center;padding:0;color:#fff;cursor:pointer;background:#0e1621cc;border:1.5px solid #9daabd;border-radius:50%;box-shadow:0 5px 12px #0000008c;pointer-events:auto;touch-action:manipulation}.action svg.icon,.weapon svg.icon,.attack-button svg.icon,.details-button svg.icon{width:56%;height:56%}.left-actions{position:absolute;left:0;bottom:calc(8.5% - var(--big-button) / 2);display:flex;flex-direction:column-reverse;gap:2.5cqw;margin-bottom:env(safe-area-inset-bottom)}.guard{width:var(--big-button);height:var(--big-button);margin-left:3cqw;color:#d9edff;background:#124696b3;border:2px solid #3a9dff;box-shadow:0 0 14px #3a9dffa6}.heal{width:var(--small-button);height:var(--small-button);margin-left:3cqw;color:#d8ffe1;background:#125a32bf;border-color:#39e87a}.details-button{width:var(--small-button);height:var(--small-button);margin-left:3cqw}.right-actions{position:absolute;right:4cqw;bottom:calc(8.5% - var(--big-button) / 2);display:flex;flex-direction:column;align-items:center;gap:2cqw;width:var(--big-button);margin-bottom:env(safe-area-inset-bottom)}.weapon-stack{display:flex;flex-direction:column;align-items:center;gap:1.5cqw}.weapon{width:var(--small-button);height:var(--small-button)}.weapon.selected{border:2.5px solid #f5c34e;box-shadow:0 0 14px #f5c34eb3}.attack-button{width:var(--big-button);height:var(--big-button);margin-right:0;background:#6e1518d9;border:3px solid #ff3d36;box-shadow:0 0 14px #ff3d3699}.damage-layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.damage-pop{position:absolute;font-size:18px;font-weight:800;color:#fff;white-space:nowrap;text-shadow:0 0 4px #000,0 2px 4px #000;transform:translate(-50%,-50%);animation:damage-rise .8s ease-out forwards}.damage-pop-kill{font-size:22px;color:#ffd75e}@keyframes damage-rise{0%{opacity:1;transform:translate(-50%,-50%) scale(1.3)}to{opacity:0;transform:translate(-50%,-190%) scale(1)}}dialog{width:min(340px,calc(100vw - 32px));padding:28px;color:#f4f7fb;background:#101821;border:1px solid #75d5ff;border-radius:8px}dialog button{min-height:44px;padding:0 16px;font-size:14px;color:#f4f7fb;cursor:pointer;background:#1c3550;border:1px solid #75d5ff;border-radius:8px}dialog button:disabled{cursor:not-allowed;opacity:.42}.shop-weapons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:12px 0}.shop-weapons button{min-width:0;padding:0 4px;font-size:12px}.shop-weapons button.selected{border-color:#ffd75e;box-shadow:0 0 8px #ffd75e8c}.safezone-actions>div{min-width:0}.safezone-actions small{display:block;min-height:14px;margin-top:2px;color:#b7c4d4;font-size:11px}dialog::backdrop{background:#0000008c}.orientation-notice{display:none}@media(orientation:landscape)and (max-height:500px){.orientation-notice{position:fixed;z-index:20;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:24px;color:#f4f7fb;font-size:18px;font-weight:700;text-align:center;background:#0a0d12f0}}.safezone-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}@media(min-width:700px){.shell{width:min(100vw,540px);margin:0 auto}}