/* =========================================================
   ARIA GHOST GRID FORCE-SPIN + GHOST MODE v4
   File: /assets/css/aria-ghost-grid-v4.css
   Purpose:
   - Grid is a faint ghost until ARIA is highlighted
   - Grid lights up on hover/speaking/listening
   - JS rotates the SVG group so CSS transform conflicts cannot stop it
========================================================= */

.aehGhostGeometry,
.ghost-geometry{
  display:block!important;
  overflow:visible!important;
  visibility:visible!important;
  pointer-events:none!important;
  opacity:.055!important;
  filter:
    drop-shadow(0 0 3px rgba(255,228,138,.07))
    drop-shadow(0 0 8px rgba(25,247,230,.035))!important;
  transition:opacity .28s ease, filter .28s ease!important;
  transform:none!important;
  animation:none!important;
}

.aehGhostGeometry *,
.ghost-geometry *{
  visibility:visible!important;
}

/* Fix old hard-scrub rule that accidentally forced SVG children into grid */
.aehCleanPortal .aehPortalLayer .aehGhostGeometry,
.aehCleanPortal .aehPortalLayer .ghost-geometry,
.aehCleanPortal .aehPortalLayer .aehGhostGeometry *,
.aehCleanPortal .aehPortalLayer .ghost-geometry *{
  visibility:visible!important;
}

.aehCleanPortal .aehPortalLayer .aehGhostGeometry,
.aehCleanPortal .aehPortalLayer .ghost-geometry{
  display:block!important;
}

.aehCleanPortal .aehPortalLayer .aehGhostGeometry circle,
.aehCleanPortal .aehPortalLayer .aehGhostGeometry polygon,
.aehCleanPortal .aehPortalLayer .aehGhostGeometry line,
.aehCleanPortal .aehPortalLayer .aehGhostGeometry path,
.aehCleanPortal .aehPortalLayer .ghost-geometry circle,
.aehCleanPortal .aehPortalLayer .ghost-geometry polygon,
.aehCleanPortal .aehPortalLayer .ghost-geometry line,
.aehCleanPortal .aehPortalLayer .ghost-geometry path{
  display:initial!important;
}

.aehGhostGeometry circle,
.aehGhostGeometry polygon,
.aehGhostGeometry line,
.aehGhostGeometry path,
.ghost-geometry circle,
.ghost-geometry polygon,
.ghost-geometry line,
.ghost-geometry path{
  fill:none!important;
  stroke:rgba(255,228,138,.18)!important;
  stroke-width:.7!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  stroke-dasharray:7 6!important;
  transition:stroke .28s ease, opacity .28s ease, stroke-width .28s ease!important;
}

.aehGhostGeometry line,
.ghost-geometry line{
  stroke:rgba(25,247,230,.13)!important;
}

/* Active/highlighted grid */
.aehGhostGeometry.aehGhostSpinActive,
.ghost-geometry.aehGhostSpinActive,
#ariaPortal:hover .aehGhostGeometry,
.aria-portal:hover .aehGhostGeometry,
.portal:hover .aehGhostGeometry,
.aria-stage:hover .aehGhostGeometry,
.aehPortalTarget.aehHover .aehGhostGeometry,
.aehPortalTarget.aehSpeaking .aehGhostGeometry,
.aehPortalTarget.aehListening .aehGhostGeometry{
  opacity:.58!important;
  filter:
    drop-shadow(0 0 8px rgba(255,228,138,.42))
    drop-shadow(0 0 18px rgba(25,247,230,.28))!important;
}

.aehGhostGeometry.aehGhostSpinActive circle,
.aehGhostGeometry.aehGhostSpinActive polygon,
.aehGhostGeometry.aehGhostSpinActive line,
.aehGhostGeometry.aehGhostSpinActive path,
.ghost-geometry.aehGhostSpinActive circle,
.ghost-geometry.aehGhostSpinActive polygon,
.ghost-geometry.aehGhostSpinActive line,
.ghost-geometry.aehGhostSpinActive path,
#ariaPortal:hover .aehGhostGeometry circle,
#ariaPortal:hover .aehGhostGeometry polygon,
#ariaPortal:hover .aehGhostGeometry line,
.aria-portal:hover .aehGhostGeometry circle,
.aria-portal:hover .aehGhostGeometry polygon,
.aria-portal:hover .aehGhostGeometry line,
.portal:hover .aehGhostGeometry circle,
.portal:hover .aehGhostGeometry polygon,
.portal:hover .aehGhostGeometry line,
.aria-stage:hover .aehGhostGeometry circle,
.aria-stage:hover .aehGhostGeometry polygon,
.aria-stage:hover .aehGhostGeometry line{
  stroke:rgba(255,228,138,.62)!important;
  stroke-width:.86!important;
}

.aehGhostGeometry.aehGhostListening circle,
.aehGhostGeometry.aehGhostListening polygon,
.aehGhostGeometry.aehGhostListening line,
.aehGhostGeometry.aehGhostListening path,
.ghost-geometry.aehGhostListening circle,
.ghost-geometry.aehGhostListening polygon,
.ghost-geometry.aehGhostListening line,
.ghost-geometry.aehGhostListening path{
  stroke:rgba(56,255,117,.62)!important;
}

.aehGhostSpinSpark{
  fill:rgba(255,228,138,.12)!important;
  stroke:none!important;
  opacity:.12!important;
  filter:
    drop-shadow(0 0 4px rgba(255,228,138,.18))
    drop-shadow(0 0 8px rgba(25,247,230,.10));
  transition:opacity .28s ease, fill .28s ease, filter .28s ease!important;
}

.aehGhostSpinActive .aehGhostSpinSpark,
#ariaPortal:hover .aehGhostSpinSpark,
.aria-portal:hover .aehGhostSpinSpark,
.portal:hover .aehGhostSpinSpark,
.aria-stage:hover .aehGhostSpinSpark{
  fill:rgba(255,228,138,.95)!important;
  opacity:.95!important;
  filter:
    drop-shadow(0 0 6px rgba(255,228,138,.80))
    drop-shadow(0 0 14px rgba(25,247,230,.38));
}

.aehGhostListening .aehGhostSpinSpark{
  fill:rgba(56,255,117,.95)!important;
  filter:
    drop-shadow(0 0 6px rgba(56,255,117,.80))
    drop-shadow(0 0 14px rgba(25,247,230,.45));
}

/* Debug helper: add ?ariaGridDebug=1 to page URL if needed */
body.aehGridDebug .aehGhostGeometry,
body.aehGridDebug .ghost-geometry{
  opacity:.9!important;
  outline:1px dashed rgba(255,228,138,.45);
}
