:root{font-family:Inter,system-ui,Microsoft YaHei,sans-serif;color:#fff;background:#190d0b;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#app,#game{width:100%;height:100%;margin:0;overflow:hidden}body{background:#26100e}#game canvas{display:block;width:100%;height:100%}#hud{position:fixed;inset:0;pointer-events:none}.hud-panel{position:absolute;background:#160d0fc7;border:1px solid rgba(255,173,93,.5);box-shadow:0 8px 30px #00000040;backdrop-filter:blur(5px);padding:10px 12px;border-radius:10px;font-size:13px}.panel-title{font-size:11px;letter-spacing:.12em;color:#ffb36d;text-transform:uppercase;margin-bottom:5px}.health-panel{left:18px;top:18px;width:185px}.health-row{display:flex;align-items:center;gap:8px}.health-row strong{white-space:nowrap;font-size:12px}.health-row #health-bar{height:9px;border-radius:8px;background:#3a1b1e;overflow:hidden;flex:1}.health-row #health-bar span{display:block;height:100%;width:100%;background:linear-gradient(90deg,#f26b4f,#ffb55e);transition:width .2s}.resources-panel{right:18px;top:18px;display:flex;gap:15px}.resources-panel b{color:#ffcf69}.compass{position:absolute;top:17px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:3px;text-shadow:0 2px 5px #000}.compass b{font-size:15px;color:#ffd39c}.compass span{font-size:12px;color:#e6d2c4}.ammo-panel{right:18px;bottom:23px;width:190px}.ammo-panel #shell-name{font-size:17px;font-weight:700;color:#ffd5a8}.ammo-panel small{display:block;color:#c6b5ac;margin:2px 0 8px}.ammo-buttons{display:flex;gap:4px;margin-top:8px}.ammo-buttons button,.tabs button,.modal button{pointer-events:auto;border:1px solid #b85d35;border-radius:5px;color:#ffe9d4;background:#3c1d1a;padding:5px 7px;cursor:pointer;font:inherit}.ammo-buttons button:hover,.tabs button:hover,.modal button:hover{background:#713021}.ammo-buttons button.selected{outline:2px solid #ffbc66;background:#6d2d20}.firing-panel{left:50%;bottom:23px;transform:translate(-50%);display:flex;gap:18px;padding:8px 15px}.firing-panel b{color:#ffd191}.firing-panel div{white-space:nowrap}.crosshair{pointer-events:none}#crosshair{position:absolute;top:50%;left:50%;transform:translate(-50%,-55%);font-size:26px;color:#fff4d8;text-shadow:0 0 7px #000}.controls{pointer-events:none}#controls{position:absolute;left:18px;bottom:22px;color:#f2cfb2;font-size:12px;text-shadow:0 1px 3px #000}.notifications{pointer-events:none}#notifications{position:absolute;top:70px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;gap:5px;align-items:center}.notice{background:#1f0f0de0;border:1px solid rgba(255,180,89,.65);border-radius:5px;padding:7px 15px;color:#ffe0ae;animation:notice-in .18s ease-out,notice-out .5s ease-in 2.3s forwards}@keyframes notice-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}@keyframes notice-out{to{opacity:0;transform:translateY(-8px)}}#radar{display:block;width:150px;height:150px;margin:9px auto 0;border-radius:50%;border:1px solid rgba(255,179,108,.55);background:#1c1113}.modal{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:#080507a6;pointer-events:auto}.modal.active{display:flex}.modal-card{position:relative;min-width:320px;max-width:90vw;padding:30px 34px;border:1px solid rgba(255,165,92,.7);border-radius:12px;background:linear-gradient(145deg,#3b1a16f7,#160f13fa);box-shadow:0 20px 80px #0008;text-align:center}.modal-card h1{margin:0 0 8px;color:#ffc080;font-size:38px}.modal-card h2{margin:0 0 18px;color:#ffc080}.modal-card p{color:#ead0bd}.modal-card small{display:block;margin-top:12px;color:#a99791}.modal-card button{padding:10px 18px;font-size:15px}.modal-card.wide{width:min(720px,92vw);text-align:left}.close-button{position:absolute;right:13px;top:10px;border:0!important;background:transparent!important;font-size:24px!important;padding:0 6px!important;color:#edbaa4!important}.tabs{display:flex;gap:7px;border-bottom:1px solid #75422e;margin-bottom:14px}.tabs .tab.active{background:#9b4828;color:#fff4dd}.upgrade-item{display:grid;grid-template-columns:1fr auto;gap:6px 15px;padding:11px 0;border-bottom:1px solid #4c2925}.upgrade-item h3{margin:0;font-size:15px;color:#ffd6a4}.upgrade-item p{margin:0;color:#bba49b;font-size:12px}.upgrade-item button{grid-column:2;grid-row:1/3;align-self:center}.upgrade-item button:disabled{opacity:.4;cursor:not-allowed}.map-card{text-align:center}.map-card canvas{display:block;max-width:100%;height:auto;margin:auto;border:1px solid #80452e;background:#211416}.map-card p{font-size:12px;color:#bba49b}@media (max-width:700px){.health-panel{transform:scale(.85);transform-origin:top left}.ammo-panel{transform:scale(.85);transform-origin:bottom right}.firing-panel{font-size:11px;gap:7px}.controls{display:none}}