/* PIANO ARMY · the Bases map's energy beside the gold (army-stage.js paintHud; army-bases-economy.js addEnergy): each
   note adds to it, a unit is made from it and the gold. Lionel, 10-22: "next to the gold amount we have a
   "spending/recruitment budget""; 10-23: "we have a new concept called energy which we will use in lieu of the
   recruitment budget", then "energy should be a lightning bolt icon right next to gold": the bolt (`.bolt`, an inline
   SVG in the coin's yellows, army-energy-icon.js) and its number as the coin and the gold's */
.bolt { display: inline-block; width: .8em; height: 1em; vertical-align: -.16em; margin-left: .12em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 26'%3E%3Cpath d='M12.6 1.2 2.2 14.6h6.6L6.6 24.8 17.8 10.4h-6.7z' fill='%23fdcf1d' stroke='%235b3a06' stroke-width='1.7' stroke-linejoin='round'/%3E%3Cpath d='M8.8 14.6 7.6 20.6 15.2 11.2' fill='none' stroke='%23eca008' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M11.6 3.4 4.6 12.6' stroke='%23fff56e' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; }
#hud.econ.bases .gold > .dim { width: 7ch; }
#hud .gold .recruit { display: inline-flex; align-items: center; gap: 3px; margin-left: 10px; white-space: nowrap; }
#hud .gold .recruit[hidden] { display: none; }
#hud .gold .recruit .bolt { width: 20px; height: 26px; margin: 0; }
#hud .gold .recruit b, #hud .gold.owe .recruit b { color: #fff09a; text-shadow: none; }
/* (portrait: the gold's other words hidden, army-stage.css; the energy shown, smaller) */
#stage[data-orient="portrait"] #hud .gold .recruit:not([hidden]) { display: inline-flex; margin-left: 6px; gap: 1px; }
#stage[data-orient="portrait"] #hud .gold .recruit .bolt { width: 14px; height: 18px; }
