blacktrigram 0.7.2

package/lib/components/screens/combat/components/hud/CombatLeftHUD.js

@@ -0,0 +1,103 @@
+import { BreathingIndicator } from "../../../../shared/three/ui/BreathingIndicator2.js";
+import { useHUDLayout } from "../../../../../hooks/useHUDLayout.js";
+import BaseHUDContainer from "../../../../shared/ui/BaseHUDContainer.js";
+import { GuardIndicator } from "../../../../shared/three/indicators/GuardIndicator.js";
+import PlayerHUD from "../../../../shared/three/ui/PlayerHUD.js";
+import { SpeedIndicatorHUD } from "../../../../shared/three/ui/SpeedIndicatorHUD.js";
+import BodyPartHealthDisplay from "../../../../shared/three/ui/BodyPartHealthDisplay.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/screens/combat/components/hud/CombatLeftHUD.tsx
+/**
+* CombatLeftHUD Component
+*
+* Left side of the combat screen containing Player 1's stats.
+* Occupies approximately 14–18% of screen width based on resolution breakpoints/interpolation,
+* positioned between the top and bottom HUDs.
+* REUSES existing PlayerHUD, SpeedIndicatorHUD, BodyPartHealthDisplay components.
+* Uses shared HUD utilities for consistent, resolution-based layout and styling.
+*/
+var CombatLeftHUD = ({ width, height, isMobile, positionScale, player, laterality, isInGuard, speedModifiers }) => {
+	const layout = useHUDLayout(width, height, positionScale, "left", "combat");
+	return /* @__PURE__ */ jsxs(BaseHUDContainer, {
+		position: "left",
+		width: layout.hudWidth,
+		height: layout.availableHeight,
+		topOffset: layout.topOffset,
+		padding: layout.padding,
+		gap: layout.gap,
+		style: { overflow: "hidden" },
+		dataTestId: "combat-left-hud",
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-left-hud-player-section",
+				children: /* @__PURE__ */ jsx(PlayerHUD, {
+					player,
+					position: "left",
+					isMobile,
+					laterality
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-left-hud-speed-section",
+				children: /* @__PURE__ */ jsx(SpeedIndicatorHUD, {
+					finalSpeed: speedModifiers.finalSpeed,
+					baseSpeed: speedModifiers.baseSpeed,
+					position: "left",
+					isMobile,
+					visible: true
+				})
+			}),
+			player.bodyPartHealth && /* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-left-hud-bodypart-section",
+				children: /* @__PURE__ */ jsx(BodyPartHealthDisplay, {
+					bodyPartHealth: player.bodyPartHealth,
+					playerId: player.id,
+					position: "left",
+					isMobile
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-left-hud-breathing-section",
+				children: /* @__PURE__ */ jsx(BreathingIndicator, {
+					player,
+					isMobile
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					marginTop: "auto",
+					position: "relative"
+				},
+				"data-testid": "combat-left-hud-guard-section",
+				children: /* @__PURE__ */ jsx(GuardIndicator, {
+					currentStance: player.currentStance,
+					isInGuard,
+					position: "left",
+					isMobile
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { CombatLeftHUD as default };
+
+//# sourceMappingURL=CombatLeftHUD.js.map

package/lib/components/screens/combat/components/hud/CombatLeftHUD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CombatLeftHUD.js","names":[],"sources":["../../../../../../src/components/screens/combat/components/hud/CombatLeftHUD.tsx"],"sourcesContent":["/**\n * CombatLeftHUD - Left side HUD for combat screen (Player 1)\n *\n * REUSES existing components:\n * - PlayerHUD: Archetype image, name, health/stamina bars\n * - SpeedIndicatorHUD: Movement speed percentage\n * - BodyPartHealthDisplay: Individual body part health bars\n * - GuardIndicator: Current stance guard status\n *\n * Gaming Layout Best Practice:\n * - Width: Resolution-based 14-18% of screen\n * - Height: 100% minus top/bottom HUD heights\n * - Leaves approximately 64–72% center for arena depending on resolution (≈72% on desktop)\n *\n * Now uses shared HUD utilities with resolution-based sizing.\n *\n * @korean 전투화면 왼쪽 HUD - 플레이어 1 상태\n */\n\nimport React from \"react\";\nimport { useHUDLayout } from \"../../../../../hooks/useHUDLayout\";\nimport { PlayerState } from \"../../../../../systems\";\nimport type { StanceLaterality } from \"../../../../../systems/trigram/types\";\nimport { BaseHUDContainer } from \"../../../../shared/ui/BaseHUDContainer\";\nimport { GuardIndicator } from \"../../../../shared/three/indicators/GuardIndicator\";\nimport { PlayerHUD } from \"../../../../shared/three/ui/PlayerHUD\";\nimport { SpeedIndicatorHUD } from \"../../../../shared/three/ui/SpeedIndicatorHUD\";\nimport { BodyPartHealthDisplay } from \"../../../../shared/three/ui/BodyPartHealthDisplay\";\nimport { BreathingIndicator } from \"../../../../shared/three/ui/BreathingIndicator\";\n\nexport interface CombatLeftHUDProps {\n  /** Screen width for layout calculations */\n  readonly width: number;\n  /** Screen height for layout calculations */\n  readonly height: number;\n  /** Whether mobile layout is active */\n  readonly isMobile: boolean;\n  /** Position scale multiplier for large displays */\n  readonly positionScale: number;\n  /** Player 1 state */\n  readonly player: PlayerState;\n  /** Player laterality (left/right foot forward) */\n  readonly laterality: StanceLaterality;\n  /** Whether player is in guard stance */\n  readonly isInGuard: boolean;\n  /** Player speed modifiers */\n  readonly speedModifiers: {\n    finalSpeed: number;\n    baseSpeed: number;\n  };\n}\n\n/**\n * CombatLeftHUD Component\n *\n * Left side of the combat screen containing Player 1's stats.\n * Occupies approximately 14–18% of screen width based on resolution breakpoints/interpolation,\n * positioned between the top and bottom HUDs.\n * REUSES existing PlayerHUD, SpeedIndicatorHUD, BodyPartHealthDisplay components.\n * Uses shared HUD utilities for consistent, resolution-based layout and styling.\n */\nexport const CombatLeftHUD: React.FC<CombatLeftHUDProps> = ({\n  width,\n  height,\n  isMobile,\n  positionScale,\n  player,\n  laterality,\n  isInGuard,\n  speedModifiers,\n}) => {\n  // Use shared HUD layout hook\n  const layout = useHUDLayout(\n    width,\n    height,\n    positionScale,\n    'left',\n    'combat'\n  );\n\n  return (\n    <BaseHUDContainer\n      position=\"left\"\n      width={layout.hudWidth}\n      height={layout.availableHeight}\n      topOffset={layout.topOffset}\n      padding={layout.padding}\n      gap={layout.gap}\n      style={{ overflow: \"hidden\" }}\n      dataTestId=\"combat-left-hud\"\n    >\n      {/* Player 1 Stats - REUSING PlayerHUD component with embedded positioning */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-left-hud-player-section\"\n      >\n        <PlayerHUD\n          player={player}\n          position=\"left\"\n          isMobile={isMobile}\n          laterality={laterality}\n        />\n      </div>\n\n      {/* Speed Indicator - REUSING SpeedIndicatorHUD component */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-left-hud-speed-section\"\n      >\n        <SpeedIndicatorHUD\n          finalSpeed={speedModifiers.finalSpeed}\n          baseSpeed={speedModifiers.baseSpeed}\n          position=\"left\"\n          isMobile={isMobile}\n          visible={true}\n        />\n      </div>\n\n      {/* Body Part Health - REUSING BodyPartHealthDisplay component */}\n      {player.bodyPartHealth && (\n        <div\n          style={{\n            pointerEvents: \"none\",\n            position: \"relative\",\n          }}\n          data-testid=\"combat-left-hud-bodypart-section\"\n        >\n          <BodyPartHealthDisplay\n            bodyPartHealth={player.bodyPartHealth}\n            playerId={player.id}\n            position=\"left\"\n            isMobile={isMobile}\n          />\n        </div>\n      )}\n\n      {/* Breathing Disruption Indicator - Shows breathing difficulty status */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-left-hud-breathing-section\"\n      >\n        <BreathingIndicator\n          player={player}\n          isMobile={isMobile}\n        />\n      </div>\n\n      {/* Guard Indicator - at bottom of HUD */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          marginTop: \"auto\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-left-hud-guard-section\"\n      >\n        <GuardIndicator\n          currentStance={player.currentStance}\n          isInGuard={isInGuard}\n          position=\"left\"\n          isMobile={isMobile}\n        />\n      </div>\n    </BaseHUDContainer>\n  );\n};\n\nexport default CombatLeftHUD;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA6DA,IAAa,iBAA+C,EAC1D,OACA,QACA,UACA,eACA,QACA,YACA,WACA,qBACI;CAEJ,MAAM,SAAS,aACb,OACA,QACA,eACA,QACA,SACD;AAED,QACE,qBAAC,kBAAD;EACE,UAAS;EACT,OAAO,OAAO;EACd,QAAQ,OAAO;EACf,WAAW,OAAO;EAClB,SAAS,OAAO;EAChB,KAAK,OAAO;EACZ,OAAO,EAAE,UAAU,UAAU;EAC7B,YAAW;YARb;GAWE,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,WAAD;KACU;KACR,UAAS;KACC;KACE;KACZ,CAAA;IACE,CAAA;GAGN,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,mBAAD;KACE,YAAY,eAAe;KAC3B,WAAW,eAAe;KAC1B,UAAS;KACC;KACV,SAAS;KACT,CAAA;IACE,CAAA;GAGL,OAAO,kBACN,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,uBAAD;KACE,gBAAgB,OAAO;KACvB,UAAU,OAAO;KACjB,UAAS;KACC;KACV,CAAA;IACE,CAAA;GAIR,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,oBAAD;KACU;KACE;KACV,CAAA;IACE,CAAA;GAGN,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,WAAW;KACX,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,gBAAD;KACE,eAAe,OAAO;KACX;KACX,UAAS;KACC;KACV,CAAA;IACE,CAAA;GACW"}

package/lib/components/screens/combat/components/hud/CombatRightHUD.d.ts

@@ -0,0 +1,54 @@
+/**
+ * CombatRightHUD - Right side HUD for combat screen (Player 2 / AI)
+ *
+ * REUSES existing components:
+ * - PlayerHUD: Archetype image, name, health/stamina bars
+ * - SpeedIndicatorHUD: Movement speed percentage
+ * - BodyPartHealthDisplay: Individual body part health bars
+ * - DifficultyIndicator: AI difficulty tier display
+ *
+ * Gaming Layout Best Practice:
+ * - Width: Resolution-based 14-18% of screen
+ * - Height: 100% minus top/bottom HUD heights
+ * - Leaves remaining center region for arena (width varies by resolution)
+ *
+ * Now uses shared HUD utilities with resolution-based sizing.
+ *
+ * @korean 전투화면 오른쪽 HUD - 플레이어 2/AI 상태
+ */
+import React from "react";
+import { PlayerState } from "../../../../../systems";
+import type { StanceLaterality } from "../../../../../systems/trigram/types";
+export interface CombatRightHUDProps {
+    /** Screen width for layout calculations */
+    readonly width: number;
+    /** Screen height for layout calculations */
+    readonly height: number;
+    /** Whether mobile layout is active */
+    readonly isMobile: boolean;
+    /** Position scale multiplier for large displays */
+    readonly positionScale: number;
+    /** Player 2/AI state */
+    readonly player: PlayerState;
+    /** Player laterality (left/right foot forward) */
+    readonly laterality: StanceLaterality;
+    /** Current AI difficulty tier (1-5) */
+    readonly difficultyTier: number;
+    /** Player speed modifiers */
+    readonly speedModifiers: {
+        finalSpeed: number;
+        baseSpeed: number;
+    };
+}
+/**
+ * CombatRightHUD Component
+ *
+ * Right side of the combat screen containing Player 2/AI stats.
+ * Occupies approximately 14–18% of screen width based on resolution breakpoints/interpolation,
+ * positioned between top and bottom HUDs.
+ * REUSES existing PlayerHUD, SpeedIndicatorHUD, BodyPartHealthDisplay, DifficultyIndicator.
+ * Uses shared HUD utilities for consistent, resolution-based layout and styling.
+ */
+export declare const CombatRightHUD: React.FC<CombatRightHUDProps>;
+export default CombatRightHUD;
+//# sourceMappingURL=CombatRightHUD.d.ts.map

package/lib/components/screens/combat/components/hud/CombatRightHUD.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CombatRightHUD.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/hud/CombatRightHUD.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACrD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAQ7E,MAAM,WAAW,mBAAmB;IAClC,2CAA2C;IAC3C,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,sCAAsC;IACtC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,mDAAmD;IACnD,QAAQ,CAAC,aAAa,EAAE,MAAM,CAAC;IAC/B,wBAAwB;IACxB,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAC;IAC7B,kDAAkD;IAClD,QAAQ,CAAC,UAAU,EAAE,gBAAgB,CAAC;IACtC,uCAAuC;IACvC,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,6BAA6B;IAC7B,QAAQ,CAAC,cAAc,EAAE;QACvB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,CAAC;KACnB,CAAC;CACH;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4GxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/screens/combat/components/hud/CombatRightHUD.js

@@ -0,0 +1,101 @@
+import { BreathingIndicator } from "../../../../shared/three/ui/BreathingIndicator2.js";
+import { useHUDLayout } from "../../../../../hooks/useHUDLayout.js";
+import BaseHUDContainer from "../../../../shared/ui/BaseHUDContainer.js";
+import PlayerHUD from "../../../../shared/three/ui/PlayerHUD.js";
+import { SpeedIndicatorHUD } from "../../../../shared/three/ui/SpeedIndicatorHUD.js";
+import BodyPartHealthDisplay from "../../../../shared/three/ui/BodyPartHealthDisplay.js";
+import { DifficultyIndicator } from "./DifficultyIndicator.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/screens/combat/components/hud/CombatRightHUD.tsx
+/**
+* CombatRightHUD Component
+*
+* Right side of the combat screen containing Player 2/AI stats.
+* Occupies approximately 14–18% of screen width based on resolution breakpoints/interpolation,
+* positioned between top and bottom HUDs.
+* REUSES existing PlayerHUD, SpeedIndicatorHUD, BodyPartHealthDisplay, DifficultyIndicator.
+* Uses shared HUD utilities for consistent, resolution-based layout and styling.
+*/
+var CombatRightHUD = ({ width, height, isMobile, positionScale, player, laterality, difficultyTier, speedModifiers }) => {
+	const layout = useHUDLayout(width, height, positionScale, "right", "combat");
+	return /* @__PURE__ */ jsxs(BaseHUDContainer, {
+		position: "right",
+		width: layout.hudWidth,
+		height: layout.availableHeight,
+		topOffset: layout.topOffset,
+		padding: layout.padding,
+		gap: layout.gap,
+		style: { overflow: "hidden" },
+		dataTestId: "combat-right-hud",
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-right-hud-player-section",
+				children: /* @__PURE__ */ jsx(PlayerHUD, {
+					player,
+					position: "right",
+					isMobile,
+					laterality
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-right-hud-difficulty-section",
+				children: /* @__PURE__ */ jsx(DifficultyIndicator, {
+					tier: difficultyTier,
+					isMobile
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-right-hud-speed-section",
+				children: /* @__PURE__ */ jsx(SpeedIndicatorHUD, {
+					finalSpeed: speedModifiers.finalSpeed,
+					baseSpeed: speedModifiers.baseSpeed,
+					position: "right",
+					isMobile,
+					visible: true
+				})
+			}),
+			player.bodyPartHealth && /* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative",
+					marginTop: "auto"
+				},
+				"data-testid": "combat-right-hud-bodypart-section",
+				children: /* @__PURE__ */ jsx(BodyPartHealthDisplay, {
+					bodyPartHealth: player.bodyPartHealth,
+					playerId: player.id,
+					position: "right",
+					isMobile
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					pointerEvents: "none",
+					position: "relative"
+				},
+				"data-testid": "combat-right-hud-breathing-section",
+				children: /* @__PURE__ */ jsx(BreathingIndicator, {
+					player,
+					isMobile
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { CombatRightHUD as default };
+
+//# sourceMappingURL=CombatRightHUD.js.map

package/lib/components/screens/combat/components/hud/CombatRightHUD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CombatRightHUD.js","names":[],"sources":["../../../../../../src/components/screens/combat/components/hud/CombatRightHUD.tsx"],"sourcesContent":["/**\n * CombatRightHUD - Right side HUD for combat screen (Player 2 / AI)\n *\n * REUSES existing components:\n * - PlayerHUD: Archetype image, name, health/stamina bars\n * - SpeedIndicatorHUD: Movement speed percentage\n * - BodyPartHealthDisplay: Individual body part health bars\n * - DifficultyIndicator: AI difficulty tier display\n *\n * Gaming Layout Best Practice:\n * - Width: Resolution-based 14-18% of screen\n * - Height: 100% minus top/bottom HUD heights\n * - Leaves remaining center region for arena (width varies by resolution)\n *\n * Now uses shared HUD utilities with resolution-based sizing.\n *\n * @korean 전투화면 오른쪽 HUD - 플레이어 2/AI 상태\n */\n\nimport React from \"react\";\nimport { useHUDLayout } from \"../../../../../hooks/useHUDLayout\";\nimport { PlayerState } from \"../../../../../systems\";\nimport type { StanceLaterality } from \"../../../../../systems/trigram/types\";\nimport { BaseHUDContainer } from \"../../../../shared/ui/BaseHUDContainer\";\nimport { BodyPartHealthDisplay } from \"../../../../shared/three/ui/BodyPartHealthDisplay\";\nimport { PlayerHUD } from \"../../../../shared/three/ui/PlayerHUD\";\nimport { SpeedIndicatorHUD } from \"../../../../shared/three/ui/SpeedIndicatorHUD\";\nimport { BreathingIndicator } from \"../../../../shared/three/ui/BreathingIndicator\";\nimport { DifficultyIndicator } from \"./DifficultyIndicator\";\n\nexport interface CombatRightHUDProps {\n  /** Screen width for layout calculations */\n  readonly width: number;\n  /** Screen height for layout calculations */\n  readonly height: number;\n  /** Whether mobile layout is active */\n  readonly isMobile: boolean;\n  /** Position scale multiplier for large displays */\n  readonly positionScale: number;\n  /** Player 2/AI state */\n  readonly player: PlayerState;\n  /** Player laterality (left/right foot forward) */\n  readonly laterality: StanceLaterality;\n  /** Current AI difficulty tier (1-5) */\n  readonly difficultyTier: number;\n  /** Player speed modifiers */\n  readonly speedModifiers: {\n    finalSpeed: number;\n    baseSpeed: number;\n  };\n}\n\n/**\n * CombatRightHUD Component\n *\n * Right side of the combat screen containing Player 2/AI stats.\n * Occupies approximately 14–18% of screen width based on resolution breakpoints/interpolation,\n * positioned between top and bottom HUDs.\n * REUSES existing PlayerHUD, SpeedIndicatorHUD, BodyPartHealthDisplay, DifficultyIndicator.\n * Uses shared HUD utilities for consistent, resolution-based layout and styling.\n */\nexport const CombatRightHUD: React.FC<CombatRightHUDProps> = ({\n  width,\n  height,\n  isMobile,\n  positionScale,\n  player,\n  laterality,\n  difficultyTier,\n  speedModifiers,\n}) => {\n  // Use shared HUD layout hook\n  const layout = useHUDLayout(\n    width,\n    height,\n    positionScale,\n    'right',\n    'combat'\n  );\n\n  return (\n    <BaseHUDContainer\n      position=\"right\"\n      width={layout.hudWidth}\n      height={layout.availableHeight}\n      topOffset={layout.topOffset}\n      padding={layout.padding}\n      gap={layout.gap}\n      style={{ overflow: \"hidden\" }}\n      dataTestId=\"combat-right-hud\"\n    >\n      {/* Player 2/AI Stats - REUSING PlayerHUD component */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-right-hud-player-section\"\n      >\n        <PlayerHUD\n          player={player}\n          position=\"right\"\n          isMobile={isMobile}\n          laterality={laterality}\n        />\n      </div>\n\n      {/* Difficulty Tier - REUSING DifficultyIndicator component */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-right-hud-difficulty-section\"\n      >\n        <DifficultyIndicator tier={difficultyTier} isMobile={isMobile} />\n      </div>\n\n      {/* Speed Indicator - REUSING SpeedIndicatorHUD component */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-right-hud-speed-section\"\n      >\n        <SpeedIndicatorHUD\n          finalSpeed={speedModifiers.finalSpeed}\n          baseSpeed={speedModifiers.baseSpeed}\n          position=\"right\"\n          isMobile={isMobile}\n          visible={true}\n        />\n      </div>\n\n      {/* Body Part Health - REUSING BodyPartHealthDisplay component */}\n      {player.bodyPartHealth && (\n        <div\n          style={{\n            pointerEvents: \"none\",\n            position: \"relative\",\n            marginTop: \"auto\",\n          }}\n          data-testid=\"combat-right-hud-bodypart-section\"\n        >\n          <BodyPartHealthDisplay\n            bodyPartHealth={player.bodyPartHealth}\n            playerId={player.id}\n            position=\"right\"\n            isMobile={isMobile}\n          />\n        </div>\n      )}\n\n      {/* Breathing Disruption Indicator - Shows breathing difficulty status */}\n      <div\n        style={{\n          pointerEvents: \"none\",\n          position: \"relative\",\n        }}\n        data-testid=\"combat-right-hud-breathing-section\"\n      >\n        <BreathingIndicator\n          player={player}\n          isMobile={isMobile}\n        />\n      </div>\n    </BaseHUDContainer>\n  );\n};\n\nexport default CombatRightHUD;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA6DA,IAAa,kBAAiD,EAC5D,OACA,QACA,UACA,eACA,QACA,YACA,gBACA,qBACI;CAEJ,MAAM,SAAS,aACb,OACA,QACA,eACA,SACA,SACD;AAED,QACE,qBAAC,kBAAD;EACE,UAAS;EACT,OAAO,OAAO;EACd,QAAQ,OAAO;EACf,WAAW,OAAO;EAClB,SAAS,OAAO;EAChB,KAAK,OAAO;EACZ,OAAO,EAAE,UAAU,UAAU;EAC7B,YAAW;YARb;GAWE,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,WAAD;KACU;KACR,UAAS;KACC;KACE;KACZ,CAAA;IACE,CAAA;GAGN,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,qBAAD;KAAqB,MAAM;KAA0B;KAAY,CAAA;IAC7D,CAAA;GAGN,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,mBAAD;KACE,YAAY,eAAe;KAC3B,WAAW,eAAe;KAC1B,UAAS;KACC;KACV,SAAS;KACT,CAAA;IACE,CAAA;GAGL,OAAO,kBACN,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACV,WAAW;KACZ;IACD,eAAY;cAEZ,oBAAC,uBAAD;KACE,gBAAgB,OAAO;KACvB,UAAU,OAAO;KACjB,UAAS;KACC;KACV,CAAA;IACE,CAAA;GAIR,oBAAC,OAAD;IACE,OAAO;KACL,eAAe;KACf,UAAU;KACX;IACD,eAAY;cAEZ,oBAAC,oBAAD;KACU;KACE;KACV,CAAA;IACE,CAAA;GACW"}

package/lib/components/screens/combat/components/hud/CombatTopHUD.d.ts

@@ -0,0 +1,47 @@
+/**
+ * CombatTopHUD - Slim top bar for combat screen
+ *
+ * Gaming Best Practice - Minimal Top Bar:
+ * - Round indicator (left)
+ * - Timer (center)
+ * - Return to Menu button (right)
+ *
+ * Layout:
+ * - Width: 100% of screen
+ * - Height: Resolution-based ~6% of screen height (40-80px)
+ *
+ * @korean 전투화면 상단 바 - 라운드, 타이머, 메뉴 복귀
+ */
+import React from "react";
+import { UseCombatTimerReturn } from "../../../../../hooks/useCombatTimer";
+export interface CombatTopHUDProps {
+    /** Screen width for layout calculations */
+    readonly width: number;
+    /** Screen height for layout calculations */
+    readonly height: number;
+    /** Whether mobile controls should be shown (NOT for sizing) */
+    readonly isMobile?: boolean;
+    /** Position scale multiplier for large displays */
+    readonly positionScale: number;
+    /** Current round number */
+    readonly currentRound: number;
+    /** Max rounds in match */
+    readonly totalRounds: number;
+    /** Timer state from useCombatTimer hook */
+    readonly timerState: UseCombatTimerReturn;
+    /** Whether to show timer */
+    readonly showTimer: boolean;
+    /** Handler for returning to menu */
+    readonly onReturnToMenu: () => void;
+    /** Whether the game is paused */
+    readonly isPaused: boolean;
+}
+/**
+ * CombatTopHUD Component
+ *
+ * Slim top bar containing round info, timer, and return to menu button.
+ * Uses resolution-based sizing for all dimensions.
+ */
+export declare const CombatTopHUD: React.FC<CombatTopHUDProps>;
+export default CombatTopHUD;
+//# sourceMappingURL=CombatTopHUD.d.ts.map

package/lib/components/screens/combat/components/hud/CombatTopHUD.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CombatTopHUD.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/hud/CombatTopHUD.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAW3E,MAAM,WAAW,iBAAiB;IAChC,2CAA2C;IAC3C,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,+DAA+D;IAC/D,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,mDAAmD;IACnD,QAAQ,CAAC,aAAa,EAAE,MAAM,CAAC;IAC/B,2BAA2B;IAC3B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,0BAA0B;IAC1B,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,2CAA2C;IAC3C,QAAQ,CAAC,UAAU,EAAE,oBAAoB,CAAC;IAC1C,4BAA4B;IAC5B,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,oCAAoC;IACpC,QAAQ,CAAC,cAAc,EAAE,MAAM,IAAI,CAAC;IACpC,iCAAiC;IACjC,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;CAC5B;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA8IpD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/screens/combat/components/hud/CombatTopHUD.js

@@ -0,0 +1,141 @@
+import { BORDERS, FONT_SIZE_MULTIPLIERS, GRADIENTS, HIERARCHY, HUD_STYLE, LAYOUT_MULTIPLIERS, SPACING_NUMERIC, TYPOGRAPHY, TYPOGRAPHY_NUMERIC } from "../../../../../types/constants/designSystem.js";
+import { getHUDHeight, getResponsiveFontSize, getResponsivePadding, shouldShowMobileControls } from "../../../../../utils/responsiveLayout.js";
+import CombatTimer from "../../../../shared/ui/CombatTimer.js";
+import CombatReturnToMenuButton from "../controls/CombatButtons.js";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/screens/combat/components/hud/CombatTopHUD.tsx
+/**
+* CombatTopHUD - Slim top bar for combat screen
+*
+* Gaming Best Practice - Minimal Top Bar:
+* - Round indicator (left)
+* - Timer (center)
+* - Return to Menu button (right)
+*
+* Layout:
+* - Width: 100% of screen
+* - Height: Resolution-based ~6% of screen height (40-80px)
+*
+* @korean 전투화면 상단 바 - 라운드, 타이머, 메뉴 복귀
+*/
+/**
+* CombatTopHUD Component
+*
+* Slim top bar containing round info, timer, and return to menu button.
+* Uses resolution-based sizing for all dimensions.
+*/
+var CombatTopHUD = ({ width, height, isMobile = false, positionScale, currentRound, totalRounds, timerState, showTimer, onReturnToMenu, isPaused: _isPaused }) => {
+	const showMobileControls = shouldShowMobileControls(width, isMobile);
+	const layout = React.useMemo(() => {
+		const hudHeight = getHUDHeight(height, .06) * positionScale;
+		const padding = getResponsivePadding(width) * positionScale;
+		const gap = padding * LAYOUT_MULTIPLIERS.gapToPadding;
+		const baseFontSize = getResponsiveFontSize(width) * positionScale;
+		return {
+			hudHeight,
+			padding,
+			gap,
+			fontSize: Math.max(TYPOGRAPHY_NUMERIC.bodySmall, baseFontSize * FONT_SIZE_MULTIPLIERS.bodySmall),
+			titleSize: Math.max(TYPOGRAPHY_NUMERIC.body, baseFontSize * FONT_SIZE_MULTIPLIERS.titleLarge),
+			hudWidth: width
+		};
+	}, [
+		width,
+		height,
+		positionScale
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		style: {
+			position: "absolute",
+			top: 0,
+			left: 0,
+			width: "100%",
+			height: `${layout.hudHeight}px`,
+			display: "flex",
+			flexDirection: "row",
+			justifyContent: "space-between",
+			alignItems: "center",
+			padding: `${layout.padding}px ${SPACING_NUMERIC.horizontalEmphasis}px`,
+			pointerEvents: "none",
+			boxSizing: "border-box",
+			borderBottom: BORDERS.default,
+			background: GRADIENTS.vertical(.9),
+			backdropFilter: HUD_STYLE.backdropFilter
+		},
+		"data-testid": "combat-top-hud",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				style: {
+					display: "flex",
+					flexDirection: "column",
+					gap: "2px",
+					pointerEvents: "none",
+					alignItems: "flex-start"
+				},
+				"data-testid": "combat-top-hud-left-section",
+				children: [/* @__PURE__ */ jsx("div", {
+					style: {
+						fontSize: `${layout.titleSize}px`,
+						fontWeight: 600,
+						fontFamily: TYPOGRAPHY.heading2.fontFamily,
+						color: HIERARCHY.gold.color,
+						textShadow: HUD_STYLE.accentGlow
+					},
+					children: "전투 | Combat"
+				}), /* @__PURE__ */ jsx("div", {
+					style: {
+						display: "flex",
+						gap: `${layout.gap}px`,
+						alignItems: "center",
+						fontSize: `${layout.fontSize}px`,
+						fontFamily: TYPOGRAPHY.body.fontFamily,
+						color: HIERARCHY.accent.color
+					},
+					children: /* @__PURE__ */ jsxs("span", { children: [
+						"라운드 ",
+						currentRound,
+						"/",
+						totalRounds
+					] })
+				})]
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					display: "flex",
+					flexDirection: "column",
+					alignItems: "center",
+					gap: "2px"
+				},
+				"data-testid": "combat-top-hud-center-section",
+				children: showTimer && /* @__PURE__ */ jsx(CombatTimer, {
+					formattedTime: timerState.formattedTime,
+					warningLevel: timerState.warningLevel,
+					isTimeUp: timerState.isTimeUp,
+					isMobile: showMobileControls,
+					style: {
+						position: "relative",
+						top: 0
+					}
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				style: {
+					display: "flex",
+					flexDirection: "row",
+					alignItems: "center",
+					pointerEvents: "all"
+				},
+				"data-testid": "combat-top-hud-right-section",
+				children: /* @__PURE__ */ jsx(CombatReturnToMenuButton, {
+					onClick: onReturnToMenu,
+					isMobile: showMobileControls
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { CombatTopHUD as default };
+
+//# sourceMappingURL=CombatTopHUD.js.map

package/lib/components/screens/combat/components/hud/CombatTopHUD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CombatTopHUD.js","names":[],"sources":["../../../../../../src/components/screens/combat/components/hud/CombatTopHUD.tsx"],"sourcesContent":["/**\n * CombatTopHUD - Slim top bar for combat screen\n *\n * Gaming Best Practice - Minimal Top Bar:\n * - Round indicator (left)\n * - Timer (center)\n * - Return to Menu button (right)\n *\n * Layout:\n * - Width: 100% of screen\n * - Height: Resolution-based ~6% of screen height (40-80px)\n *\n * @korean 전투화면 상단 바 - 라운드, 타이머, 메뉴 복귀\n */\n\nimport React from \"react\";\nimport { UseCombatTimerReturn } from \"../../../../../hooks/useCombatTimer\";\nimport { SPACING_NUMERIC, TYPOGRAPHY, TYPOGRAPHY_NUMERIC, HIERARCHY, BORDERS, GRADIENTS, HUD_STYLE, FONT_SIZE_MULTIPLIERS, LAYOUT_MULTIPLIERS } from \"../../../../../types/constants/designSystem\";\nimport {\n  getHUDHeight,\n  getResponsiveFontSize,\n  getResponsivePadding,\n  shouldShowMobileControls,\n} from \"../../../../../utils/responsiveLayout\";\nimport { CombatTimer } from \"../../../../shared/ui/CombatTimer\";\nimport { CombatReturnToMenuButton } from \"../controls/CombatButtons\";\n\nexport interface CombatTopHUDProps {\n  /** Screen width for layout calculations */\n  readonly width: number;\n  /** Screen height for layout calculations */\n  readonly height: number;\n  /** Whether mobile controls should be shown (NOT for sizing) */\n  readonly isMobile?: boolean;\n  /** Position scale multiplier for large displays */\n  readonly positionScale: number;\n  /** Current round number */\n  readonly currentRound: number;\n  /** Max rounds in match */\n  readonly totalRounds: number;\n  /** Timer state from useCombatTimer hook */\n  readonly timerState: UseCombatTimerReturn;\n  /** Whether to show timer */\n  readonly showTimer: boolean;\n  /** Handler for returning to menu */\n  readonly onReturnToMenu: () => void;\n  /** Whether the game is paused */\n  readonly isPaused: boolean;\n}\n\n/**\n * CombatTopHUD Component\n *\n * Slim top bar containing round info, timer, and return to menu button.\n * Uses resolution-based sizing for all dimensions.\n */\nexport const CombatTopHUD: React.FC<CombatTopHUDProps> = ({\n  width,\n  height,\n  isMobile = false,\n  positionScale,\n  currentRound,\n  totalRounds,\n  timerState,\n  showTimer,\n  onReturnToMenu,\n  isPaused: _isPaused, // Reserved for future pause indicator\n}) => {\n  // isMobile only used for mobile controls visibility\n  const showMobileControls = shouldShowMobileControls(width, isMobile);\n\n  // Layout calculations for slim top bar with resolution-based sizing\n  const layout = React.useMemo(() => {\n    // Resolution-based HUD height (6% of screen height, 40-80px range)\n    const hudHeight = getHUDHeight(height, 0.06) * positionScale;\n\n    // Resolution-based padding (using design system spacing)\n    const padding = getResponsivePadding(width) * positionScale;\n    \n    // Resolution-based gap (slightly larger than padding)\n    const gap = padding * LAYOUT_MULTIPLIERS.gapToPadding;\n    \n    // Resolution-based font sizes (using design system as baseline)\n    const baseFontSize = getResponsiveFontSize(width) * positionScale;\n    const fontSize = Math.max(TYPOGRAPHY_NUMERIC.bodySmall, baseFontSize * FONT_SIZE_MULTIPLIERS.bodySmall);\n    const titleSize = Math.max(TYPOGRAPHY_NUMERIC.body, baseFontSize * FONT_SIZE_MULTIPLIERS.titleLarge);\n\n\n    return {\n      hudHeight,\n      padding,\n      gap,\n      fontSize,\n      titleSize,\n      hudWidth: width,\n    };\n  }, [width, height, positionScale]);\n\n  return (\n    <div\n      style={{\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"100%\",\n        height: `${layout.hudHeight}px`,\n        display: \"flex\",\n        flexDirection: \"row\",\n        justifyContent: \"space-between\",\n        alignItems: \"center\",\n        padding: `${layout.padding}px ${SPACING_NUMERIC.horizontalEmphasis}px`,\n        pointerEvents: \"none\",\n        boxSizing: \"border-box\",\n        borderBottom: BORDERS.default,\n        background: GRADIENTS.vertical(0.9),\n        backdropFilter: HUD_STYLE.backdropFilter,\n      }}\n      data-testid=\"combat-top-hud\"\n    >\n      {/* Left Section - Round Info */}\n      <div\n        style={{\n          display: \"flex\",\n          flexDirection: \"column\",\n          gap: \"2px\",\n          pointerEvents: \"none\",\n          alignItems: \"flex-start\",\n        }}\n        data-testid=\"combat-top-hud-left-section\"\n      >\n        {/* Title */}\n        <div\n          style={{\n            fontSize: `${layout.titleSize}px`,\n            fontWeight: 600,\n            fontFamily: TYPOGRAPHY.heading2.fontFamily,\n            color: HIERARCHY.gold.color,\n            textShadow: HUD_STYLE.accentGlow,\n          }}\n        >\n          전투 | Combat\n        </div>\n\n        {/* Round indicator */}\n        <div\n          style={{\n            display: \"flex\",\n            gap: `${layout.gap}px`,\n            alignItems: \"center\",\n            fontSize: `${layout.fontSize}px`,\n            fontFamily: TYPOGRAPHY.body.fontFamily,\n            color: HIERARCHY.accent.color,\n          }}\n        >\n          <span>\n            라운드 {currentRound}/{totalRounds}\n          </span>\n        </div>\n      </div>\n\n      {/* Center Section - Timer */}\n      <div\n        style={{\n          display: \"flex\",\n          flexDirection: \"column\",\n          alignItems: \"center\",\n          gap: \"2px\",\n        }}\n        data-testid=\"combat-top-hud-center-section\"\n      >\n        {showTimer && (\n          <CombatTimer\n            formattedTime={timerState.formattedTime}\n            warningLevel={timerState.warningLevel}\n            isTimeUp={timerState.isTimeUp}\n            isMobile={showMobileControls}\n            style={{ position: \"relative\", top: 0 }}\n          />\n        )}\n      </div>\n\n      {/* Right Section - Return to Menu */}\n      <div\n        style={{\n          display: \"flex\",\n          flexDirection: \"row\",\n          alignItems: \"center\",\n          pointerEvents: \"all\",\n        }}\n        data-testid=\"combat-top-hud-right-section\"\n      >\n        <CombatReturnToMenuButton\n          onClick={onReturnToMenu}\n          isMobile={showMobileControls}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport default CombatTopHUD;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAwDA,IAAa,gBAA6C,EACxD,OACA,QACA,WAAW,OACX,eACA,cACA,aACA,YACA,WACA,gBACA,UAAU,gBACN;CAEJ,MAAM,qBAAqB,yBAAyB,OAAO,SAAS;CAGpE,MAAM,SAAS,MAAM,cAAc;EAEjC,MAAM,YAAY,aAAa,QAAQ,IAAK,GAAG;EAG/C,MAAM,UAAU,qBAAqB,MAAM,GAAG;EAG9C,MAAM,MAAM,UAAU,mBAAmB;EAGzC,MAAM,eAAe,sBAAsB,MAAM,GAAG;AAKpD,SAAO;GACL;GACA;GACA;GACA,UARe,KAAK,IAAI,mBAAmB,WAAW,eAAe,sBAAsB,UAAU;GASrG,WARgB,KAAK,IAAI,mBAAmB,MAAM,eAAe,sBAAsB,WAAW;GASlG,UAAU;GACX;IACA;EAAC;EAAO;EAAQ;EAAc,CAAC;AAElC,QACE,qBAAC,OAAD;EACE,OAAO;GACL,UAAU;GACV,KAAK;GACL,MAAM;GACN,OAAO;GACP,QAAQ,GAAG,OAAO,UAAU;GAC5B,SAAS;GACT,eAAe;GACf,gBAAgB;GAChB,YAAY;GACZ,SAAS,GAAG,OAAO,QAAQ,KAAK,gBAAgB,mBAAmB;GACnE,eAAe;GACf,WAAW;GACX,cAAc,QAAQ;GACtB,YAAY,UAAU,SAAS,GAAI;GACnC,gBAAgB,UAAU;GAC3B;EACD,eAAY;YAlBd;GAqBE,qBAAC,OAAD;IACE,OAAO;KACL,SAAS;KACT,eAAe;KACf,KAAK;KACL,eAAe;KACf,YAAY;KACb;IACD,eAAY;cARd,CAWE,oBAAC,OAAD;KACE,OAAO;MACL,UAAU,GAAG,OAAO,UAAU;MAC9B,YAAY;MACZ,YAAY,WAAW,SAAS;MAChC,OAAO,UAAU,KAAK;MACtB,YAAY,UAAU;MACvB;eACF;KAEK,CAAA,EAGN,oBAAC,OAAD;KACE,OAAO;MACL,SAAS;MACT,KAAK,GAAG,OAAO,IAAI;MACnB,YAAY;MACZ,UAAU,GAAG,OAAO,SAAS;MAC7B,YAAY,WAAW,KAAK;MAC5B,OAAO,UAAU,OAAO;MACzB;eAED,qBAAC,QAAD,EAAA,UAAA;MAAM;MACC;MAAa;MAAE;MACf,EAAA,CAAA;KACH,CAAA,CACF;;GAGN,oBAAC,OAAD;IACE,OAAO;KACL,SAAS;KACT,eAAe;KACf,YAAY;KACZ,KAAK;KACN;IACD,eAAY;cAEX,aACC,oBAAC,aAAD;KACE,eAAe,WAAW;KAC1B,cAAc,WAAW;KACzB,UAAU,WAAW;KACrB,UAAU;KACV,OAAO;MAAE,UAAU;MAAY,KAAK;MAAG;KACvC,CAAA;IAEA,CAAA;GAGN,oBAAC,OAAD;IACE,OAAO;KACL,SAAS;KACT,eAAe;KACf,YAAY;KACZ,eAAe;KAChB;IACD,eAAY;cAEZ,oBAAC,0BAAD;KACE,SAAS;KACT,UAAU;KACV,CAAA;IACE,CAAA;GACF"}

package/lib/components/screens/combat/components/hud/DifficultyIndicator.d.ts

@@ -0,0 +1,25 @@
+/**
+ * DifficultyIndicator Component - AI Difficulty Tier Display
+ *
+ * Shows the current AI difficulty tier with Korean-English bilingual text
+ * and color-coded visual feedback based on tier level.
+ *
+ * **Korean Philosophy (난이도 표시)**:
+ * Provides transparent feedback to player about AI challenge level,
+ * helping them understand their skill progression.
+ */
+import React from "react";
+import { DifficultyTier } from "../../../../../systems/ai";
+export interface DifficultyIndicatorProps {
+    /** Current difficulty tier (1-5) */
+    readonly tier: DifficultyTier;
+    /** Whether to use mobile-optimized sizing */
+    readonly isMobile: boolean;
+}
+/**
+ * DifficultyIndicator - Visual feedback for current AI difficulty tier
+ *
+ * Uses relative positioning for embedding in container HUDs
+ */
+export declare const DifficultyIndicator: React.FC<DifficultyIndicatorProps>;
+//# sourceMappingURL=DifficultyIndicator.d.ts.map

package/lib/components/screens/combat/components/hud/DifficultyIndicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DifficultyIndicator.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/hud/DifficultyIndicator.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAO3D,MAAM,WAAW,wBAAwB;IACvC,oCAAoC;IACpC,QAAQ,CAAC,IAAI,EAAE,cAAc,CAAC;IAC9B,6CAA6C;IAC7C,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;CAC5B;AAiDD;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAwElE,CAAC"}