#app-shell #combat-objective {
  position: absolute; z-index: 9; top: max(80px, calc(var(--safe-top) + 64px));
  left: max(16px, var(--safe-left)); width: 280px; padding: 14px;
  color: var(--text); background: var(--hfs-glass); border: 1px solid var(--line);
  display: grid; gap: 10px; pointer-events: none;
}
#combat-status { font: 500 15px var(--font-ui); }
#combat-detail { font-size: 12px; line-height: 1.4; margin: 0; }
#combat-detail:empty { display: none; }
.combat-integrity { display: grid; grid-template-columns: 48px 1fr; gap: 10px; align-items: center; font-size: 12px; }
.combat-meter { --value: 1; height: 7px; background: #40576a; overflow: hidden; }
.combat-meter i { display: block; height: 100%; background: var(--primary, #70b6ff); transform: scaleX(var(--value)); transform-origin: left; }
.combat-integrity.enemy i { background: #f4c36b; }
.combat-meter.critical i { background: #ff7276; }
#app-shell #combat-objective .combat-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 0; }
#app-shell #combat-objective button { position: relative; display: flex; align-items: center; gap: 6px; padding: 8px; min-height: 44px; pointer-events: auto; touch-action: manipulation; }
#combat-objective button svg { width: 22px; height: 22px; flex: 0 0 22px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; }
#combat-objective button span { font-size: 12px; }
#combat-objective button b { margin-left: auto; font: 500 17px var(--font-ui); font-variant-numeric: tabular-nums; }
#combat-objective button:disabled { opacity: .45; }
#combat-objective button:active:not(:disabled) { background: #70b6ff; color: #101214; }
.combat-reload { --value: 1; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: #70b6ff; transform: scaleX(var(--value)); transform-origin: left; }
.combat-threat { color: #ffd8d9; font: 600 12px var(--font-ui); margin: 0; }
#app-shell #combat-objective.combat-danger { border-color: #ff7276; }
#combat-target { width: 74px; height: 74px; color: #f4c36b; font: 500 12px var(--font-ui); text-align: center; }
#combat-target svg { display: block; width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.6; }
#combat-target .target-track { opacity: .25; }
#combat-target .target-lock { stroke-dasharray: 283; stroke-dashoffset: 283; transform: rotate(-90deg); transform-origin: center; stroke-width: 2.5; }
#combat-target .target-center { opacity: 0; }
#combat-target.locked { color: #ff8b82; }
#combat-target.locked .target-center { opacity: 1; }
#combat-target span { display: block; margin-top: 4px; }
.combat-edge { position: absolute; z-index: 6; transform: translate(-50%, -50%); color: #f4c36b; font: 500 12px var(--font-ui); pointer-events: none; text-align: center; }
.combat-edge svg { display: block; width: 28px; height: 28px; margin: auto; transform: rotate(var(--bearing)); fill: none; stroke: currentColor; stroke-width: 2; }
#game-screen.hud-mode-hidden #combat-objective { visibility: hidden; }
@media (max-width: 1100px), (max-height: 600px) {
  #app-shell #combat-objective { top: max(66px, calc(var(--safe-top) + 58px)); left: max(12px, var(--safe-left)); right: auto; width: 218px; padding: 8px 10px; gap: 6px; grid-template-columns: 1fr 1fr; }
  #combat-status { font-size: 12px; grid-column: 1 / -1; }
  #combat-detail, .combat-actions, #combat-retry { grid-column: 1 / -1; }
  .combat-threat { display: none; }
  .combat-danger #combat-status { color: #ffd8d9; }
  .combat-integrity { grid-template-columns: 40px 1fr; font-size: 12px; gap: 6px; }
  #app-shell #combat-objective .combat-actions { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 4px; }
  #app-shell #combat-objective button { padding: 5px; justify-content: center; gap: 2px; }
  #combat-objective .combat-actions button span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  #combat-objective button b { margin-left: 0; font-size: 13px; }
  #combat-objective button svg { width: 20px; height: 20px; flex-basis: 20px; }
}
@media (prefers-reduced-motion: reduce) { #combat-target *, .combat-meter * { transition: none; } }

.combat-heading { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0; grid-column: 1 / -1; }
.combat-waves { display: flex; gap: 3px; flex: 0 0 auto; }
.combat-waves i { display: block; width: 6px; height: 6px; background: #40576a; }
.combat-waves i.current { background: #f4c36b; }
.combat-waves i.cleared { background: #a6d8ff; }
.combat-heat { --value: 0; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: #f4c36b; transform: scaleX(var(--value)); transform-origin: left; }
.combat-overheated .combat-heat { background: #ff8b82; }
#app-shell #combat-objective.combat-finished .combat-actions, #app-shell #combat-objective.combat-finished .combat-integrity { display: none; }