  #mobileControls { position:fixed; inset:0; z-index:30; pointer-events:none; touch-action:none; user-select:none; }
  body.touch-device #mobileControls { display:block !important; }
  #touchJoystick {
    position:absolute; left:24px; bottom:80px;
    width:120px; height:120px; border-radius:50%;
    background:rgba(0,0,0,0.28); border:2px solid rgba(255,255,255,0.22);
    pointer-events:auto; touch-action:none;
  }
  #touchJoystickKnob {
    position:absolute; left:50%; top:50%;
    width:48px; height:48px; margin:-24px 0 0 -24px;
    border-radius:50%; background:rgba(127,223,255,0.55);
    border:2px solid rgba(255,255,255,0.6);
    box-shadow:0 0 12px rgba(127,223,255,0.3);
  }
  #touchButtons { position:absolute; right:14px; bottom:66px; display:grid; grid-template-columns:repeat(2, min-content); gap:10px; pointer-events:auto; }
  .touchBtn {
    width:72px; height:56px; border-radius:16px;
    border:2px solid rgba(255,255,255,0.25);
    background:rgba(0,0,0,0.35); color:#fff;
    font-weight:800; font-size:13px;
    text-shadow:1px 1px 0 #000;
    backdrop-filter:blur(5px); touch-action:none;
  }
  .touchBtn:active, .touchBtn.active {
    background:rgba(127,223,255,0.4);
    border-color:rgba(255,255,255,0.7);
    transform:scale(0.96);
  }
  body.touch-device #ui .controls { display:none; }
  @media (max-width:720px) {
    #hud-top { font-size:12px; padding:5px 12px; gap:10px; }
    #hud-ammo { right:12px; bottom:96px; padding:6px 10px; }
    #hud-ammo .bullets { font-size:22px; }
    #hud-ammo .gun { font-size:11px; }
    #hud-weapons { display:none; }
    #hud-score { font-size:11px; padding:5px 9px; }
    #killFeed { font-size:11px; top:50px; right:6px; }
    #killFeed .row { padding:3px 7px; }
    #hud-coords { font-size:9px; }
    #hud-nades { left:8px; bottom:8px; gap:5px; }
    #hud-nades .nade { width:46px; height:46px; }
    #hud-nades .nade .ic { font-size:18px; }
  }
  @media (max-width:480px) {
    #hud-top { font-size:11px; }
    #hud-ammo .bullets { font-size:18px; }
    #startMenuPanel { padding:18px 22px; }
    #startMenuPanel h1 { font-size:24px; }
  }
  body.touch-device #touchJoystick { width:140px; height:140px; left:18px; bottom:60px; }
  body.touch-device #touchJoystickKnob { width:56px; height:56px; margin:-28px 0 0 -28px; }
  body.touch-device #touchButtons { right:14px; bottom:60px; gap:12px; grid-template-columns:repeat(2, min-content); }
  body.touch-device .touchBtn { width:86px; height:70px; font-size:14px; }
  body.touch-device #touchFire { width:96px; height:96px; border-radius:50%; background:rgba(220,80,80,0.45); border-color:rgba(255,200,200,0.6); }
  body.touch-device #touchWeaponBar { bottom:12px; }
  body.touch-device #touchWeaponBar .touchBtn { width:62px; height:50px; }
  body.touch-device #touchNadeBar { bottom:78px; }
  body.touch-device #touchNadeBar .touchBtn { width:54px; height:46px; }

  /* ─── v4: LOW-HP HEARTBEAT OVERLAY ─────────────────────────── */
  #lowHpOverlay {
    position:fixed; inset:0; z-index:24; pointer-events:none; opacity:0;
    background:radial-gradient(ellipse at center, transparent 32%, rgba(170,15,15,0.55) 100%);
    transition:opacity 0.18s ease-out;
  }
  body.lowhp #lowHpOverlay { animation: heartbeat 1.1s ease-in-out infinite; }
  @keyframes heartbeat {
    0%   { opacity:0.20; }
    18%  { opacity:0.70; }
    32%  { opacity:0.32; }
    50%  { opacity:0.78; }
    68%  { opacity:0.38; }
    100% { opacity:0.20; }
  }

  /* ─── v4: HIT MARKER variants ──────────────────────────────── */
  #hitMarker.armor div { background:#7ec8ff !important; box-shadow:0 0 6px #58aaff; }

  /* ─── v4: MONEY HUD ───────────────────────────────────────── */
  #hud-money {
    position:absolute; top:14px; left:14px;
    background:linear-gradient(180deg, rgba(20,28,16,0.85), rgba(12,18,10,0.65));
    border:1px solid rgba(120,210,90,0.30);
    padding:6px 12px; border-radius:8px;
    font-family:'Courier New',monospace; font-size:14px;
    color:#9fe28c; letter-spacing:0.5px;
    text-shadow:1px 1px 0 #000;
    box-shadow:0 2px 10px rgba(0,0,0,0.5);
    z-index:36;
  }
  #hud-money.gain { animation: moneyGain 0.45s ease-out; }
  #hud-money.lose { animation: moneyLose 0.45s ease-out; }
  @keyframes moneyGain { 0%{transform:scale(1);} 30%{transform:scale(1.12);color:#d6ffb6;} 100%{transform:scale(1);} }
  @keyframes moneyLose { 0%{transform:scale(1);} 30%{transform:scale(0.92);color:#ff9a8a;} 100%{transform:scale(1);} }

  /* ─── v4: ROUND BANNER ────────────────────────────────────── */
  #roundBanner {
    position:fixed; top:50%; left:50%; transform:translate(-50%,-50%) scale(0.9);
    z-index:46; pointer-events:none;
    color:#ffd54f; font-family:'Courier New',monospace; font-size:36px; font-weight:bold;
    text-shadow:2px 2px 0 #000, 0 0 14px rgba(255,180,40,0.6);
    background:linear-gradient(180deg, rgba(20,16,8,0.85), rgba(8,6,4,0.85));
    padding:16px 38px; border-radius:10px;
    border:1px solid rgba(255,213,79,0.35);
    opacity:0; transition:opacity 0.35s, transform 0.35s;
    text-align:center;
  }
  #roundBanner.show { opacity:1; transform:translate(-50%,-50%) scale(1.0); }
  #roundBanner .sub { display:block; font-size:14px; color:#bbb; margin-top:6px; }

  /* ─── v4: BUY MENU ────────────────────────────────────────── */
  #buyMenu {
    position:fixed; inset:0; z-index:55; display:none;
    background:rgba(0,0,0,0.55); backdrop-filter:blur(4px);
    align-items:center; justify-content:center;
    font-family:'Inter','Segoe UI',sans-serif;
  }
  #buyMenu.show { display:flex; }
  #buyPanel {
    background:linear-gradient(180deg, rgba(25,22,18,0.97), rgba(12,10,8,0.97));
    border:1px solid rgba(255,213,79,0.35);
    border-radius:14px; padding:22px 28px;
    width:min(720px, 92vw); max-height:88vh; overflow-y:auto;
    box-shadow:0 18px 60px rgba(0,0,0,0.7), 0 0 0 1px rgba(0,0,0,0.4);
    color:#eee;
  }
  #buyPanel h2 {
    font-family:'Courier New',monospace;
    color:#ffd54f; font-size:22px; letter-spacing:2px;
    margin-bottom:6px; display:flex; align-items:center; justify-content:space-between;
  }
  #buyPanel .sub { font-size:12px; color:#aaa; margin-bottom:14px; font-family:'Courier New',monospace; }
  #buyPanel .group { margin-bottom:14px; }
  #buyPanel .gtitle { font-family:'Courier New',monospace; color:#9fc; font-size:13px; letter-spacing:1px; margin-bottom:6px; }
  #buyPanel .grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; }
  #buyPanel .item {
    background:rgba(30,28,22,0.85); border:1px solid rgba(255,255,255,0.08); border-radius:8px;
    padding:10px 12px; cursor:pointer; user-select:none;
    transition:transform 0.07s, border-color 0.12s, background 0.12s;
    font-family:'Courier New',monospace;
  }
  #buyPanel .item:hover { background:rgba(50,45,30,0.95); border-color:rgba(255,213,79,0.5); transform:translateY(-1px); }
  #buyPanel .item.disabled { opacity:0.42; cursor:not-allowed; }
  #buyPanel .item.owned { border-color:rgba(120,200,90,0.5); background:rgba(20,40,18,0.9); }
  #buyPanel .item .name { color:#fff; font-size:13px; font-weight:bold; margin-bottom:3px; }
  #buyPanel .item .cost { color:#9fe28c; font-size:12px; }
  #buyPanel .item .key  { color:#888; font-size:10px; float:right; }
  #buyPanel .close { float:right; cursor:pointer; color:#aaa; font-size:14px; font-family:'Courier New',monospace; }
  #buyPanel .close:hover { color:#ffd54f; }
  #buyZoneIndicator {
    position:fixed; bottom:14px; left:50%; transform:translateX(-50%);
    background:rgba(0,0,0,0.65); color:#ffd54f; padding:6px 14px; border-radius:6px;
    font-family:'Courier New',monospace; font-size:13px;
    border:1px solid rgba(255,213,79,0.4);
    z-index:34; pointer-events:none; opacity:0; transition:opacity 0.25s;
  }
  #buyZoneIndicator.show { opacity:1; }

  /* ─── v4: DEV PANEL ───────────────────────────────────────── */
  #devPanel {
    position:fixed; top:42px; right:14px; z-index:38;
    background:rgba(0,0,0,0.75); color:#9fe; padding:8px 12px; border-radius:6px;
    font-family:'Courier New',monospace; font-size:11px;
    border:1px solid rgba(127,223,255,0.3); display:none; min-width:170px;
    pointer-events:none;
  }
  #devPanel.show { display:block; }
  #devPanel .row { display:flex; justify-content:space-between; gap:8px; }
  #devPanel .row b { color:#fff; }

  /* ─── v4: AUDIO CALIBRATE NOTICE ──────────────────────────── */
  #audioInit {
    position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);
    background:rgba(0,0,0,0.78); color:#9fc; padding:14px 22px; border-radius:8px;
    font-family:'Courier New',monospace; font-size:13px;
    border:1px solid rgba(127,223,255,0.3); z-index:75; display:none;
    pointer-events:none;
  }

  @media (orientation:portrait) and (max-width:720px) {
    body.touch-device::after {
      content: "↻ Поверни телефон горизонтально для лучшего опыта";
      position:fixed; left:50%; bottom:14px; transform:translateX(-50%);
      background:rgba(0,0,0,0.7); color:#fda; padding:6px 12px; border-radius:6px;
      font-family:'Courier New', monospace; font-size:11px; z-index:60;
      pointer-events:none;
    }
  }

/* Update 14: tactile crouch feedback and compact two-column action cluster. */
#touchCrouch { border-color:rgba(125,210,255,.38); }
#touchCrouch.active, #touchCrouch[aria-pressed="true"] { background:rgba(70,150,205,.52); box-shadow:0 0 16px rgba(85,185,255,.22); }
#touchCrouch.blocked { animation:v14CrouchBlocked .28s ease-out; border-color:rgba(255,188,92,.78); }
@keyframes v14CrouchBlocked { 0%,100%{transform:translateX(0)} 33%{transform:translateX(-3px)} 66%{transform:translateX(3px)} }
body.touch-device #touchLeanBar { right:18px !important; bottom:226px !important; }
@media (max-height:520px) and (orientation:landscape) {
  body.touch-device #touchButtons { transform:scale(.86); transform-origin:right bottom; }
  body.touch-device #touchLeanBar { bottom:196px !important; transform:scale(.86); transform-origin:right bottom; }
}
