/* =========================
   HUNTER NODES (SCALE MATCH)
   Adds: APPLIED breathing glow + swirling dots (anchored to picture)
   Normal HU nodes: Blood Moon Orange scheme (HUNTER / HU / PATH)
   Health/Act/React: match agent.css EXACTLY
   ========================= */

.hunter-1-tier-1,
.hu-2-tier-2,
.hu-3-tier-2,
.hu-4-tier-3,
.hu-5-tier-3,
.hu-6-tier-3,
.hu-health-tier-4,
.hu-reaction-tier-5,
.hu-action-tier-5,
.hu-7-tier-6,
.hu-8-tier-6,
.hu-9-tier-6,
.hu-sub-tier-7,
.hu-2-minor-node-1,
.hu-2-minor-node-2,
.hu-2-minor-node-3,
.hu-3-minor-node-1,
.hu-3-minor-node-2,
.hu-3-minor-node-3,
.hu-3-minor-node-4,
.hu-3-minor-node-5{
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

/* =========================
   SIZES (match your current Hunter sizing)
   ========================= */

/* Big nodes (Tier 1 + Tier 7) */
.hunter-1-tier-1 img,
.hu-sub-tier-7 img{
  width: 38px;
  height: auto;
}

/* Regular HU nodes */
.hu-2-tier-2 img,
.hu-3-tier-2 img,
.hu-4-tier-3 img,
.hu-5-tier-3 img,
.hu-6-tier-3 img,
.hu-7-tier-6 img,
.hu-8-tier-6 img,
.hu-9-tier-6 img{
  width: 17px;
  height: auto;
}

/* Minor nodes */
.hu-2-minor-node-1 img,
.hu-2-minor-node-2 img,
.hu-2-minor-node-3 img,
.hu-3-minor-node-1 img,
.hu-3-minor-node-2 img,
.hu-3-minor-node-3 img,
.hu-3-minor-node-4 img,
.hu-3-minor-node-5 img{
  width: 4px;
  height: auto;
}

/* Health / Action / Reaction */
.hu-health-tier-4 img{
  width: 17px;
  height: auto;
}

.hu-reaction-tier-5 img,
.hu-action-tier-5 img{
  width: 22px;
  height: auto;
}

/* =========================
   LABELS (Blood Moon Orange)
   ========================= */

.hunter-label{
  margin-top: -4px;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;

  /* Blood Moon label */
  color: rgba(255, 150, 80, 1);
  text-shadow: 0 0 6px rgba(255, 90, 40, 0.35);

  white-space: nowrap;
  line-height: 1.5;
  font-size: 5px;
}

.hunter-1-tier-1 .hunter-label,
.hu-sub-tier-7 .hunter-label{
  font-size: 6px;
}

/* Health/Act/React labels MUST match agent.css (your orange label system) */
.hu-health-tier-4 .hunter-label{
  font-size: 3px;
  margin-top: -3px;
  color: rgba(255, 170, 70, 0.95);
  text-shadow: 0 0 6px rgba(255, 120, 40, 0.55);
}

.hu-reaction-tier-5 .hunter-label,
.hu-action-tier-5 .hunter-label{
  font-size: 3px;
  margin-top: -5.5px;
  color: rgba(255, 170, 70, 0.95);
  text-shadow: 0 0 6px rgba(255, 120, 40, 0.55);
}

/* =========================
   Anchor dots to ICON (picture), not wrapper
   + stacking context so dots can sit behind icon without vanishing
   ========================= */

.hunter-1-tier-1 picture,
.hu-2-tier-2 picture,
.hu-3-tier-2 picture,
.hu-4-tier-3 picture,
.hu-5-tier-3 picture,
.hu-6-tier-3 picture,
.hu-health-tier-4 picture,
.hu-reaction-tier-5 picture,
.hu-action-tier-5 picture,
.hu-7-tier-6 picture,
.hu-8-tier-6 picture,
.hu-9-tier-6 picture,
.hu-sub-tier-7 picture,
.hu-2-minor-node-1 picture,
.hu-2-minor-node-2 picture,
.hu-2-minor-node-3 picture,
.hu-3-minor-node-1 picture,
.hu-3-minor-node-2 picture,
.hu-3-minor-node-3 picture,
.hu-3-minor-node-4 picture,
.hu-3-minor-node-5 picture{
  position: relative;
  display: inline-block;
  z-index: 0; /* stacking context for ::before */
}

/* Put icon ABOVE the dots */
.hunter-1-tier-1 img,
.hu-2-tier-2 img,
.hu-3-tier-2 img,
.hu-4-tier-3 img,
.hu-5-tier-3 img,
.hu-6-tier-3 img,
.hu-7-tier-6 img,
.hu-8-tier-6 img,
.hu-9-tier-6 img,
.hu-sub-tier-7 img,
.hu-2-minor-node-1 img,
.hu-2-minor-node-2 img,
.hu-2-minor-node-3 img,
.hu-3-minor-node-1 img,
.hu-3-minor-node-2 img,
.hu-3-minor-node-3 img,
.hu-3-minor-node-4 img,
.hu-3-minor-node-5 img,
.hu-health-tier-4 img,
.hu-reaction-tier-5 img,
.hu-action-tier-5 img{
  position: relative;
  z-index: 1;
}

/* =========================
   NORMAL HUNTER NODES: Blood Moon Orange
   ========================= */

/* Base */
.hu-2-tier-2 img,
.hu-3-tier-2 img,
.hu-4-tier-3 img,
.hu-5-tier-3 img,
.hu-6-tier-3 img,
.hu-7-tier-6 img,
.hu-8-tier-6 img,
.hu-9-tier-6 img,
.hunter-1-tier-1 img,
.hu-sub-tier-7 img{
  filter: brightness(1.20);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

/* Hover (blood moon glow) */
.hu-2-tier-2:hover img,
.hu-3-tier-2:hover img,
.hu-4-tier-3:hover img,
.hu-5-tier-3:hover img,
.hu-6-tier-3:hover img,
.hu-7-tier-6:hover img,
.hu-8-tier-6:hover img,
.hu-9-tier-6:hover img,
.hunter-1-tier-1:hover img,
.hu-sub-tier-7:hover img{
  filter:
    brightness(1.4)
    drop-shadow(0 0 2px rgba(255, 110, 50, 0.85))
    drop-shadow(0 0 4px rgba(180, 45, 20, 0.45));
}

/* Selected (stronger, deeper blood moon) */
.hu-2-tier-2.selected img,
.hu-3-tier-2.selected img,
.hu-4-tier-3.selected img,
.hu-5-tier-3.selected img,
.hu-6-tier-3.selected img,
.hu-7-tier-6.selected img,
.hu-8-tier-6.selected img,
.hu-9-tier-6.selected img,
.hunter-1-tier-1.selected img,
.hu-sub-tier-7.selected img{
  filter:
    brightness(1.50)
    drop-shadow(0 0 2px rgba(255, 150, 80, 0.95))
    drop-shadow(0 0 4px rgba(255, 110, 50, 0.70))
    drop-shadow(0 0 8px rgba(120, 20, 10, 0.55));
}

/* Minor nodes (small blood sparks) */
.hu-2-minor-node-1 img,
.hu-2-minor-node-2 img,
.hu-2-minor-node-3 img,
.hu-3-minor-node-1 img,
.hu-3-minor-node-2 img,
.hu-3-minor-node-3 img,
.hu-3-minor-node-4 img,
.hu-3-minor-node-5 img{
  filter: brightness(1.30);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-2-minor-node-1:hover img,
.hu-2-minor-node-2:hover img,
.hu-2-minor-node-3:hover img,
.hu-3-minor-node-1:hover img,
.hu-3-minor-node-2:hover img,
.hu-3-minor-node-3:hover img,
.hu-3-minor-node-4:hover img,
.hu-3-minor-node-5:hover img{
  filter:
    brightness(1.7)
    drop-shadow(0 0 2px rgba(255, 110, 50, 0.85))
    drop-shadow(0 0 4px rgba(180, 45, 20, 0.45));
}

.hu-2-minor-node-1.selected img,
.hu-2-minor-node-2.selected img,
.hu-2-minor-node-3.selected img,
.hu-3-minor-node-1.selected img,
.hu-3-minor-node-2.selected img,
.hu-3-minor-node-3.selected img,
.hu-3-minor-node-4.selected img,
.hu-3-minor-node-5.selected img{
  filter:
    brightness(2.1)
    drop-shadow(0 0 2px rgba(255, 150, 80, 0.95))
    drop-shadow(0 0 4px rgba(255, 110, 50, 0.70))
    drop-shadow(0 0 8px rgba(120, 20, 10, 0.55));
}

/* =========================
   Health / Reaction / Action
   MUST match agent.css EXACTLY (hover + selected)
   ========================= */

/* Health base + hover + selected */
.hu-health-tier-4 img{
  filter: brightness(1.0) contrast(.9);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-health-tier-4:hover img{
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(255, 80, 80, 0.6))
    drop-shadow(0 0 4px rgba(255, 80, 80, 0.4));
}

.hu-health-tier-4.selected img{
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(205, 57, 57, 1.0))
    drop-shadow(0 0 4px rgba(143, 8, 8, 0.7))
    drop-shadow(0 0 8px rgba(255, 80, 80, 0.5));
}

/* Reaction + Action base */
.hu-reaction-tier-5 img,
.hu-action-tier-5 img{
  filter: brightness(1.7);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

/* Reaction hover + selected */
.hu-reaction-tier-5:hover img{
  filter:
    brightness(1.7)
    drop-shadow(0 0 2px rgba(77, 81, 193, 0.8))
    drop-shadow(0 0 4px rgba(74, 69, 230, 0.5));
}

.hu-reaction-tier-5.selected img{
  filter:
    brightness(2.0)
    drop-shadow(0 0 2px rgba(77, 81, 193, 0.9))
    drop-shadow(0 0 4px rgba(74, 69, 230, 0.7))
    drop-shadow(0 0 10px rgba(70, 24, 169, 0.6));
}

/* Action hover + selected */
.hu-action-tier-5:hover img{
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(255, 170, 70, 0.8))
    drop-shadow(0 0 4px rgba(255, 170, 70, 0.5));
}

.hu-action-tier-5.selected img{
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(255, 170, 70, 0.7))
    drop-shadow(0 0 4px rgba(255, 170, 70, 0.5))
    drop-shadow(0 0 8px rgba(255, 170, 70, 0.3));
}

/* =========================
   APPLIED STATE (PERMANENT BREATHING GLOW + SWIRLING DOTS)
   ========================= */

/* Normal Hunter nodes applied (unique keyframes) */
.hunter-1-tier-1.applied img,
.hu-2-tier-2.applied img,
.hu-3-tier-2.applied img,
.hu-4-tier-3.applied img,
.hu-5-tier-3.applied img,
.hu-6-tier-3.applied img,
.hu-7-tier-6.applied img,
.hu-8-tier-6.applied img,
.hu-9-tier-6.applied img,
.hu-sub-tier-7.applied img,
.hu-2-minor-node-1.applied img,
.hu-2-minor-node-2.applied img,
.hu-2-minor-node-3.applied img,
.hu-3-minor-node-1.applied img,
.hu-3-minor-node-2.applied img,
.hu-3-minor-node-3.applied img,
.hu-3-minor-node-4.applied img,
.hu-3-minor-node-5.applied img{
  animation: node-breathe-hunter 3s ease-in-out infinite;
}

/* Health / React / Act applied (Agent exact animations) */
.hu-health-tier-4.applied img{
  animation: node-breathe-health 3s ease-in-out infinite;
}
.hu-reaction-tier-5.applied img{
  animation: node-breathe-react 3s ease-in-out infinite;
}
.hu-action-tier-5.applied img{
  animation: node-breathe-act 3s ease-in-out infinite;
}

/* Swirling two-dot overlay (same exact colors as Agent), anchored to picture::before */
.hunter-1-tier-1.applied picture::before,
.hu-2-tier-2.applied picture::before,
.hu-3-tier-2.applied picture::before,
.hu-4-tier-3.applied picture::before,
.hu-5-tier-3.applied picture::before,
.hu-6-tier-3.applied picture::before,
.hu-7-tier-6.applied picture::before,
.hu-8-tier-6.applied picture::before,
.hu-9-tier-6.applied picture::before,
.hu-sub-tier-7.applied picture::before,
.hu-2-minor-node-1.applied picture::before,
.hu-2-minor-node-2.applied picture::before,
.hu-2-minor-node-3.applied picture::before,
.hu-3-minor-node-1.applied picture::before,
.hu-3-minor-node-2.applied picture::before,
.hu-3-minor-node-3.applied picture::before,
.hu-3-minor-node-4.applied picture::before,
.hu-3-minor-node-5.applied picture::before,
.hu-health-tier-4.applied picture::before,
.hu-reaction-tier-5.applied picture::before,
.hu-action-tier-5.applied picture::before{
  content: '';
  position: absolute;
  inset: -48%;
  background:
    radial-gradient(circle at 80% 50%, rgba(58, 24, 194, 0.9) 1px, transparent 1px),
    radial-gradient(circle at 20% 50%, rgba(68, 43, 213, 0.9) 1px, transparent 1px);
  background-size: 100% 100%;
  animation: two-dot-rotate 3s linear infinite;
  pointer-events: none;
  z-index: 0;
  border-radius: 50%;
}

/* Health+ needs larger radius due to smaller node size */
.hu-health-tier-4.applied picture::before{
  inset: -50%;
}

/* Optional: Tier-1 “moon” icon gets a wider orbit so dots are clearly visible */
.hunter-1-tier-1.applied picture::before{
  inset: -48%;
}

/* =========================
   KEYFRAMES (Hunter-only)
   Blood Moon breathe
   ========================= */

@keyframes node-breathe-hunter{
  0%, 100%{
    filter:
      brightness(1.20)
      drop-shadow(0 0 3px rgba(255, 150, 80, 0.90))
      drop-shadow(0 0 6px rgba(255, 110, 50, 0.70))
      drop-shadow(0 0 8px rgba(120, 20, 10, 0.55));
  }
  50%{
    filter:
      brightness(2.0)
      drop-shadow(0 0 4px rgba(255, 150, 80, 0.65))
      drop-shadow(0 0 8px rgba(255, 110, 50, 0.50))
      drop-shadow(0 0 16px rgba(120, 20, 10, 0.35));
  }
}

/* If two-dot-rotate isn't defined elsewhere, this keeps it working.
   If it *is* defined elsewhere (agent.css), this identical block is harmless. */
@keyframes two-dot-rotate{
  0%{ transform: rotate(0deg); }
  100%{ transform: rotate(360deg); }
}

/* =========================
   PLACEMENT (unchanged from your current file)
   ========================= */

/* Tier 1 */
.hunter-1-tier-1 { left: 915px; top: 1006px; }

/* Tier 2 */
.hu-2-tier-2 { left: 911px; top: 1071px; }
.hu-3-tier-2 { left: 962px; top: 1056px; }

/* HU:2 minor nodes */
.hu-2-minor-node-1 { left: 907px; top: 1059px; }
.hu-2-minor-node-2 { left: 907px; top: 1053px; }
.hu-2-minor-node-3 { left: 912px; top: 1049px; }

/* HU:3 minor nodes */
.hu-3-minor-node-1 { left: 976px; top: 1039px; }
.hu-3-minor-node-2 { left: 970px; top: 1038px; }
.hu-3-minor-node-3 { left: 979px; top: 1044px; }
.hu-3-minor-node-4 { left: 981px; top: 1049px; }
.hu-3-minor-node-5 { left: 980px; top: 1055px; }

/* Tier 3 */
.hu-4-tier-3 { left: 911px; top: 1102px; }
.hu-5-tier-3 { left: 946px; top: 1096px; }
.hu-6-tier-3 { left: 979px; top: 1085px; }

/* Tier 4 */
.hu-health-tier-4 { left: 955px; top: 1131px; }

/* Tier 5 */
.hu-reaction-tier-5 { left: 911px;  top: 1173px; }
.hu-action-tier-5   { left: 1011px; top: 1146px; }

/* Tier 6 */
.hu-7-tier-6 { left: 914px;  top: 1209px; }
.hu-8-tier-6 { left: 976px;  top: 1199px; }
.hu-9-tier-6 { left: 1032px; top: 1179px; }

/* Tier 7 */
.hu-sub-tier-7 { left: 977px; top: 1232px; }

/* ============================================================
   PREMIUM HUNTER NODES
   ============================================================ */

.hu-10-tier-8,
.hu-11-tier-8,
.hu-12-tier-12,
.hu-reaction-tier-10,
.hu-action-tier-12,
.hu-health-tier-10
{
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.hu-10-tier-8 img,
.hu-11-tier-8 img,
.hu-12-tier-12 img {
  width: 17px;
  height: auto;
}

/* HU 10 minor nodes */
.hu-10-minor-node-1,
.hu-10-minor-node-2,
.hu-10-minor-node-3,
.hu-10-minor-node-4 {
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.hu-10-minor-node-1 img,
.hu-10-minor-node-2 img,
.hu-10-minor-node-3 img,
.hu-10-minor-node-4 img {
  width: 4px;
  height: auto;
}

/* Premium utility node sizes */
.hu-action-tier-12 img,
.hu-reaction-tier-10 img {
  width: 22px;
  height: auto;
}

.hu-health-tier-10 img {
  width: 17px;
  aspect-ratio: 1 / 1;
}

/* Premium utility labels */
.hu-action-tier-12 .hunter-label,
.hu-reaction-tier-10 .hunter-label {
  font-size: 3px;
  margin-top: -5.5px;
  color: rgba(255, 170, 70, 0.95);
  text-shadow: 0 0 6px rgba(255, 120, 40, 0.55);
}

.hu-health-tier-10 .hunter-label {
  font-size: 3px;
  margin-top: -3px;
  color: rgba(255, 170, 70, 0.95);
  text-shadow: 0 0 6px rgba(255, 120, 40, 0.55);
}

/* =========================
   PLACEMENT: HU 10-12 & premium utility
   ========================= */

.hu-10-tier-8        { left: 985px; top: 1292px; }
.hu-10-minor-node-1  { left: 978px; top: 1287px; }
.hu-10-minor-node-2  { left: 976px; top: 1280px; }
.hu-10-minor-node-3  { left: 1007px; top: 1288px; }
.hu-10-minor-node-4  { left: 1007px; top: 1282px; }

.hu-11-tier-8        { left: 1015px; top: 1284px; }

.hu-reaction-tier-10 { left: 999px; top: 1355px; }
.hu-health-tier-10   { left: 1032px; top: 1353px; }
.hu-action-tier-12   { left: 1014px; top: 1425px; }
.hu-12-tier-12       { left: 1050px; top: 1422px; }

/* =========================
   HU 10-12 VISUAL EMPHASIS
   ========================= */

.hu-10-tier-8 img,
.hu-11-tier-8 img,
.hu-12-tier-12 img {
  filter: brightness(1.2);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-10-tier-8:hover img,
.hu-11-tier-8:hover img,
.hu-12-tier-12:hover img {
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.85))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.45));
}

.hu-10-tier-8.selected img,
.hu-11-tier-8.selected img,
.hu-12-tier-12.selected img {
  filter:
    brightness(1.4)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.95))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.70))
    drop-shadow(0 0 8px rgba(140, 230, 255, 0.50));
}

/* HU 10 minor emphasis */
.hu-10-minor-node-1 img,
.hu-10-minor-node-2 img,
.hu-10-minor-node-3 img,
.hu-10-minor-node-4 img {
  filter: brightness(1.3);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-10-minor-node-1:hover img,
.hu-10-minor-node-2:hover img,
.hu-10-minor-node-3:hover img,
.hu-10-minor-node-4:hover img {
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.85))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.45));
}

.hu-10-minor-node-1.selected img,
.hu-10-minor-node-2.selected img,
.hu-10-minor-node-3.selected img,
.hu-10-minor-node-4.selected img {
  filter:
    brightness(1.7)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.95))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.70))
    drop-shadow(0 0 8px rgba(140, 230, 255, 0.50));
}

/* Premium HEALTH+ emphasis */
.hu-health-tier-10 img {
  filter: brightness(1.0) contrast(.9);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-health-tier-10:hover img {
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(255, 80, 80, 0.6))
    drop-shadow(0 0 4px rgba(255, 80, 80, 0.4));
}

.hu-health-tier-10.selected img {
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(205, 57, 57, 1.0))
    drop-shadow(0 0 4px rgba(143, 8, 8, 0.7))
    drop-shadow(0 0 8px rgba(255, 80, 80, 0.5));
}

/* Premium ACT+ emphasis */
.hu-action-tier-12 img {
  filter: brightness(1.1);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-action-tier-12:hover img {
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(255, 170, 70, 0.8))
    drop-shadow(0 0 4px rgba(255, 170, 70, 0.5));
}

.hu-action-tier-12.selected img {
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(255, 170, 70, 0.7))
    drop-shadow(0 0 4px rgba(255, 170, 70, 0.5))
    drop-shadow(0 0 8px rgba(255, 170, 70, 0.3));
}

/* Premium REACT+ emphasis */
.hu-reaction-tier-10 img {
  filter: brightness(1.1);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.hu-reaction-tier-10:hover img {
  filter:
    brightness(1.7)
    drop-shadow(0 0 2px rgba(77, 81, 193, 0.8))
    drop-shadow(0 0 4px rgba(74, 69, 230, 0.5));
}

.hu-reaction-tier-10.selected img {
  filter:
    brightness(2.0)
    drop-shadow(0 0 2px rgba(77, 81, 193, 0.9))
    drop-shadow(0 0 4px rgba(74, 69, 230, 0.7))
    drop-shadow(0 0 10px rgba(70, 24, 169, 0.6));
}

/* =========================
   HU PREMIUM APPLIED STATE
   ========================= */

.hu-10-tier-8.applied img,
.hu-11-tier-8.applied img,
.hu-12-tier-12.applied img,
.hu-10-minor-node-1.applied img,
.hu-10-minor-node-2.applied img,
.hu-10-minor-node-3.applied img,
.hu-10-minor-node-4.applied img {
  animation: node-breathe-hunter 3s ease-in-out infinite;
}

.hu-health-tier-10.applied img {
  animation: node-breathe-health 3s ease-in-out infinite;
}

.hu-reaction-tier-10.applied img {
  animation: node-breathe-react 3s ease-in-out infinite;
}

.hu-action-tier-12.applied img {
  animation: node-breathe-act 3s ease-in-out infinite;
}

.hu-10-tier-8.applied::before,
.hu-10-minor-node-1.applied::before,
.hu-10-minor-node-2.applied::before,
.hu-10-minor-node-3.applied::before,
.hu-10-minor-node-4.applied::before,
.hu-11-tier-8.applied::before,
.hu-12-tier-12.applied::before,
.hu-reaction-tier-10.applied::before,
.hu-action-tier-12.applied::before,
.hu-health-tier-10.applied::before
{
  content: '';
  position: absolute;
  inset: -48%;
  background:
    radial-gradient(circle at 80% 50%, rgba(58, 24, 194, 0.9) 1px, transparent 1px),
    radial-gradient(circle at 20% 50%, rgba(68, 43, 213, 0.9) 1px, transparent 1px);
  background-size: 100% 100%;
  animation: two-dot-rotate 3s linear infinite;
  pointer-events: none;
  z-index: -1;
  border-radius: 50%;
}

.hu-health-tier-10.applied::before {
  inset: -50%;
}

/* ============================================================
   TAMER NODES
   ============================================================ */

.tamer-1-tier-7,
.tr-2-tier-9,
.tr-3-tier-11,
.tr-4-tier-11
{
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.tamer-1-tier-7 img {
  width: 37px;
  height: auto;
}

.tr-2-tier-9 img,
.tr-3-tier-11 img,
.tr-4-tier-11 img {
  width: 17px;
  height: auto;
}

/* TR 2 minor nodes */
.tr-2-minor-node-1,
.tr-2-minor-node-2,
.tr-2-minor-node-3,
.tr-2-minor-node-4,
.tr-2-minor-node-5,
.tr-2-minor-node-6 {
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.tr-2-minor-node-1 img,
.tr-2-minor-node-2 img,
.tr-2-minor-node-3 img,
.tr-2-minor-node-4 img,
.tr-2-minor-node-5 img,
.tr-2-minor-node-6 img {
  width: 4px;
  height: auto;
}

.tamer-1-tier-7 .hunter-label {
  font-size: 6px;
}

/* =========================
   PLACEMENT: TAMER
   ========================= */

.tamer-1-tier-7      { left: 917px; top: 1245px; }
.tr-2-tier-9         { left: 929px; top: 1337px; }
.tr-3-tier-11        { left: 927px; top: 1406px; }
.tr-4-tier-11        { left: 965px; top: 1400px; }

.tr-2-minor-node-1   { left: 915px; top: 1333px; }
.tr-2-minor-node-2   { left: 965px; top: 1330px; }
.tr-2-minor-node-3   { left: 966px; top: 1317px; }
.tr-2-minor-node-4   { left: 947px; top: 1320px; }
.tr-2-minor-node-5   { left: 957px; top: 1337px; }
.tr-2-minor-node-6   { left: 975px; top: 1335px; }

/* =========================
   TAMER VISUAL EMPHASIS
   ========================= */

.tamer-1-tier-7 img,
.tr-2-tier-9 img,
.tr-3-tier-11 img,
.tr-4-tier-11 img {
  filter: brightness(1.2);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.tamer-1-tier-7:hover img,
.tr-2-tier-9:hover img,
.tr-3-tier-11:hover img,
.tr-4-tier-11:hover img {
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.85))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.45));
}

.tamer-1-tier-7.selected img,
.tr-2-tier-9.selected img,
.tr-3-tier-11.selected img,
.tr-4-tier-11.selected img {
  filter:
    brightness(1.4)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.95))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.70))
    drop-shadow(0 0 8px rgba(140, 230, 255, 0.50));
}

/* TR 2 minor emphasis */
.tr-2-minor-node-1 img,
.tr-2-minor-node-2 img,
.tr-2-minor-node-3 img,
.tr-2-minor-node-4 img,
.tr-2-minor-node-5 img,
.tr-2-minor-node-6 img {
  filter: brightness(1.3);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.tr-2-minor-node-1:hover img,
.tr-2-minor-node-2:hover img,
.tr-2-minor-node-3:hover img,
.tr-2-minor-node-4:hover img,
.tr-2-minor-node-5:hover img,
.tr-2-minor-node-6:hover img {
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.85))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.45));
}

.tr-2-minor-node-1.selected img,
.tr-2-minor-node-2.selected img,
.tr-2-minor-node-3.selected img,
.tr-2-minor-node-4.selected img,
.tr-2-minor-node-5.selected img,
.tr-2-minor-node-6.selected img {
  filter:
    brightness(1.7)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.95))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.70))
    drop-shadow(0 0 8px rgba(140, 230, 255, 0.50));
}

/* =========================
   TAMER APPLIED STATE
   ========================= */

.tamer-1-tier-7.applied img,
.tr-2-tier-9.applied img,
.tr-3-tier-11.applied img,
.tr-4-tier-11.applied img,
.tr-2-minor-node-1.applied img,
.tr-2-minor-node-2.applied img,
.tr-2-minor-node-3.applied img,
.tr-2-minor-node-4.applied img,
.tr-2-minor-node-5.applied img,
.tr-2-minor-node-6.applied img {
  animation: node-breathe-hunter 3s ease-in-out infinite;
}

.tamer-1-tier-7.applied::before,
.tr-2-tier-9.applied::before,
.tr-2-minor-node-1.applied::before,
.tr-2-minor-node-2.applied::before,
.tr-2-minor-node-3.applied::before,
.tr-2-minor-node-4.applied::before,
.tr-2-minor-node-5.applied::before,
.tr-2-minor-node-6.applied::before,
.tr-3-tier-11.applied::before,
.tr-4-tier-11.applied::before
{
  content: '';
  position: absolute;
  inset: -48%;
  background:
    radial-gradient(circle at 80% 50%, rgba(58, 24, 194, 0.9) 1px, transparent 1px),
    radial-gradient(circle at 20% 50%, rgba(68, 43, 213, 0.9) 1px, transparent 1px);
  background-size: 100% 100%;
  animation: two-dot-rotate 3s linear infinite;
  pointer-events: none;
  z-index: -1;
  border-radius: 50%;
}

/* ============================================================
   BOUNTY NODES
   ============================================================ */

.bounty-1-tier-7,
.bt-2-tier-9,
.bt-3-tier-11
{
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.bounty-1-tier-7 img {
  width: 38px;
  height: auto;
}

.bt-2-tier-9 img,
.bt-3-tier-11 img {
  width: 17px;
  height: auto;
}

/* BT 2 minor nodes */
.bt-2-minor-node-1,
.bt-2-minor-node-2,
.bt-2-minor-node-3,
.bt-2-minor-node-4 {
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.bt-2-minor-node-1 img,
.bt-2-minor-node-2 img,
.bt-2-minor-node-3 img,
.bt-2-minor-node-4 img,
.bt-3-minor-node-1 img,
.bt-3-minor-node-2 img,
.bt-3-minor-node-3 img {
  width: 6px;
  height: auto;
}

/* BT 3 minor nodes */
.bt-3-minor-node-1,
.bt-3-minor-node-2,
.bt-3-minor-node-3 {
  position: absolute;
  z-index: 9999;
  pointer-events: none;
  text-align: center;
}

.bounty-1-tier-7 .hunter-label {
  font-size: 6px;
}

.bt-3-tier-11 .hunter-label {
  margin-left: 6px;
}

/* =========================
   PLACEMENT: BOUNTY
   ========================= */

.bounty-1-tier-7     { left: 1035px;  top: 1210px; }
.bt-2-tier-9         { left: 1067px;  top: 1301px; }
.bt-3-tier-11        { left: 1090px;  top: 1368px; }

.bt-2-minor-node-1   { left: 1056px;  top: 1296px; }
.bt-2-minor-node-2   { left: 1060px;  top: 1309px; }
.bt-2-minor-node-3   { left: 1086px;  top: 1282px; }
.bt-2-minor-node-4   { left: 1089px;  top: 1297px; }

.bt-3-minor-node-1   { left: 1105px;  top: 1348px; }
.bt-3-minor-node-2   { left: 1110px;  top: 1365px; }
.bt-3-minor-node-3   { left: 1084px;  top: 1376px; }

/* =========================
   BOUNTY VISUAL EMPHASIS
   ========================= */

.bounty-1-tier-7 img,
.bt-2-tier-9 img,
.bt-3-tier-11 img {
  filter: brightness(1.2);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.bounty-1-tier-7:hover img,
.bt-2-tier-9:hover img,
.bt-3-tier-11:hover img {
  filter:
    brightness(1.3)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.85))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.45));
}

.bounty-1-tier-7.selected img,
.bt-2-tier-9.selected img,
.bt-3-tier-11.selected img {
  filter:
    brightness(1.4)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.95))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.70))
    drop-shadow(0 0 8px rgba(140, 230, 255, 0.50));
}

/* BT minor emphasis */
.bt-2-minor-node-1 img,
.bt-2-minor-node-2 img,
.bt-2-minor-node-3 img,
.bt-2-minor-node-4 img,
.bt-3-minor-node-1 img,
.bt-3-minor-node-2 img,
.bt-3-minor-node-3 img {
  filter: brightness(1.3);
  transition: none;
  pointer-events: auto;
  cursor: pointer;
}

.bt-2-minor-node-1:hover img,
.bt-2-minor-node-2:hover img,
.bt-2-minor-node-3:hover img,
.bt-2-minor-node-4:hover img,
.bt-3-minor-node-1:hover img,
.bt-3-minor-node-2:hover img,
.bt-3-minor-node-3:hover img {
  filter:
    brightness(1.5)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.85))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.45));
}

.bt-2-minor-node-1.selected img,
.bt-2-minor-node-2.selected img,
.bt-2-minor-node-3.selected img,
.bt-2-minor-node-4.selected img,
.bt-3-minor-node-1.selected img,
.bt-3-minor-node-2.selected img,
.bt-3-minor-node-3.selected img {
  filter:
    brightness(1.7)
    drop-shadow(0 0 2px rgba(40, 160, 255, 0.95))
    drop-shadow(0 0 4px rgba(80, 200, 255, 0.70))
    drop-shadow(0 0 8px rgba(140, 230, 255, 0.50));
}

/* =========================
   BOUNTY APPLIED STATE
   ========================= */

.bounty-1-tier-7.applied img,
.bt-2-tier-9.applied img,
.bt-3-tier-11.applied img,
.bt-2-minor-node-1.applied img,
.bt-2-minor-node-2.applied img,
.bt-2-minor-node-3.applied img,
.bt-2-minor-node-4.applied img,
.bt-3-minor-node-1.applied img,
.bt-3-minor-node-2.applied img,
.bt-3-minor-node-3.applied img {
  animation: node-breathe-hunter 3s ease-in-out infinite;
}

.bounty-1-tier-7.applied::before,
.bt-2-tier-9.applied::before,
.bt-2-minor-node-1.applied::before,
.bt-2-minor-node-2.applied::before,
.bt-2-minor-node-3.applied::before,
.bt-2-minor-node-4.applied::before,
.bt-3-tier-11.applied::before,
.bt-3-minor-node-1.applied::before,
.bt-3-minor-node-2.applied::before,
.bt-3-minor-node-3.applied::before
{
  content: '';
  position: absolute;
  inset: -48%;
  background:
    radial-gradient(circle at 80% 50%, rgba(58, 24, 194, 0.9) 1px, transparent 1px),
    radial-gradient(circle at 20% 50%, rgba(68, 43, 213, 0.9) 1px, transparent 1px);
  background-size: 100% 100%;
  animation: two-dot-rotate 3s linear infinite;
  pointer-events: none;
  z-index: -1;
  border-radius: 50%;
}
