/* Free roam HUD in the modern GTA spirit: almost nothing on screen while you just play. Top right: game clock, wanted
   stars only while the police want you, money right under them, the weapon only while it matters. Bottom left: a
   rounded minimap with a slim health bar. Desktop only; touch layouts keep their own placement (polish.css). */
@media (pointer:fine){
  body.vice-city.free-roam .tr{top:max(14px,env(safe-area-inset-top));right:max(22px,env(safe-area-inset-right));width:auto;min-width:200px;display:flex;flex-direction:column;align-items:flex-end}
  body.vice-city.free-roam .tr .heat-label{display:none}
  body.vice-city.free-roam .tr .stars{display:none;margin:4px 0 0;height:28px}
  body.vice-city.free-roam.wanted .tr .stars{display:flex}
  body.vice-city.free-roam #weather-hud{order:-1;margin-top:0;font-size:12px;line-height:16px;letter-spacing:.12em;color:#fff3dc}
  body.vice-city.free-roam #vh-wallet{top:calc(var(--hud-tr-bottom,34px) + 2px);bottom:auto;right:max(22px,env(safe-area-inset-right));transition:top .25s}
  body.vice-city.free-roam #vh-wallet span{display:none}
  /* The full map covers the screen: the cash would sit on its Close button. */
  body:has(#phone-map:not([hidden])) #vh-wallet{visibility:hidden}
  body.vice-city.free-roam #vh-wallet b{font:800 30px/1 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:.01em;color:#7ee8a2;
    text-shadow:0 0 1px #0b1f12,1px 1px 0 #0b1f12,-1px 1px 0 #0b1f12,1px -1px 0 #0b1f12,-1px -1px 0 #0b1f12,0 3px 6px rgba(0,0,0,.45)}
  body.vice-city.free-roam #vh-wallet.gain b{animation:hud-gain .9s ease-out}
  body.vice-city.free-roam #arsenal-hud{top:calc(var(--hud-tr-bottom,34px) + 40px);right:max(22px,env(safe-area-inset-right));min-width:0;padding:6px 6px 6px 10px;background:rgba(14,15,24,.62);transition:opacity .4s,top .25s}
  body.vice-city.free-roam #arsenal-hud.hud-quiet{opacity:0;pointer-events:none}
  body.vice-city #district-map{border-radius:18px;box-shadow:0 0 0 2px rgba(255,243,220,.16),0 8px 22px rgba(0,0,0,.35)}
  body.vice-city #hpbar{height:6px;border-radius:3px;overflow:hidden;background:rgba(10,12,20,.55)}
  body.vice-city #hpbar i{border-radius:3px}
  /* Hit flash: a red edge that fades out (index.html vhHitFlash). */
  #hit-flash{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,rgba(255,0,0,0) 52%,rgba(190,0,10,.62) 100%)}
  #hit-flash.on{opacity:var(--hit,.6)}#hit-flash.fade{transition:opacity .5s ease-out}
  /* Body armor under the health bar (shown while you wear some). */
  #armorbar{position:absolute;left:max(14px,env(safe-area-inset-left));top:calc(max(12px,env(safe-area-inset-top)) + 48px);width:190px;height:5px;border-radius:3px;overflow:hidden;background:rgba(10,12,20,.55);pointer-events:none}
  #armorbar i{display:block;height:100%;width:0;background:#4aa8ff;border-radius:3px;transition:width .2s}
  .vice-city #armorbar{top:auto;bottom:15px;left:24px;width:208px;z-index:2}
}
@keyframes hud-gain{0%{transform:scale(1.18);color:#c6ffd8}100%{transform:none}}
/* Touch: the same calm top right block (money under the clock, stars only while wanted), above the touch buttons. */
@media (pointer:coarse){
  body.vice-city.free-roam .tr .heat-label{display:none}
  body.vice-city.free-roam .tr .stars{display:none}
  body.vice-city.free-roam.wanted .tr .stars{display:flex}
  body.vice-city.free-roam #vh-wallet{display:block;top:calc(var(--hud-tr-bottom,96px) + 2px);bottom:auto;right:max(14px,env(safe-area-inset-right))}
  body.vice-city.free-roam #vh-wallet span{display:none}
  body.vice-city.free-roam #vh-wallet b{font:800 24px/1 'Barlow Condensed','Arial Narrow',sans-serif;color:#7ee8a2;text-shadow:0 0 1px #0b1f12,1px 1px 0 #0b1f12,-1px 1px 0 #0b1f12,0 3px 6px rgba(0,0,0,.45)}
  body.vice-city.free-roam #arsenal-hud{top:calc(var(--hud-tr-bottom,96px) + 34px)}
  body.vice-city.free-roam #arsenal-hud.hud-quiet{opacity:0;pointer-events:none}
}
#carhp{display:block;width:100%;min-width:64px;height:5px;margin-top:6px;background:rgba(255,255,255,.16);border-radius:3px;overflow:hidden}#carhp i{display:block;height:100%;background:#7ee8a2;transition:width .25s}#carhp.low i{background:#ff697a}
