/* SOF AI Brain Layout Restore V1 – visual-only dashboard hero */
#page-dashboard #sofBrainHeroMount {
  position: relative;
  overflow: hidden;
  min-height: 230px;
  padding: 0 !important;
  isolation: isolate;
}

.sof-brain-dashboard-visual-only {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 230px;
  height: 100%;
  border-radius: inherit;
  background:
    radial-gradient(circle at 50% 45%, rgba(20, 140, 255, 0.15), transparent 34%),
    radial-gradient(circle at 66% 60%, rgba(255, 36, 155, 0.12), transparent 38%),
    radial-gradient(circle at 34% 68%, rgba(125, 48, 255, 0.10), transparent 38%);
  isolation: isolate;
}

.sof-brain-dashboard-visual-only::before {
  content: "";
  position: absolute;
  inset: -55%;
  z-index: 0;
  opacity: 0.23;
  pointer-events: none;
  background:
    conic-gradient(
      from 180deg,
      transparent,
      rgba(22, 210, 255, 0.22),
      transparent 25%,
      rgba(255, 43, 157, 0.18),
      transparent 56%,
      rgba(132, 50, 255, 0.18),
      transparent
    );
  animation: sofBrainVisualHalo 22s linear infinite;
}

.sof-brain-dashboard-visual-only__glow,
.sof-brain-dashboard-visual-only__energy,
.sof-brain-dashboard-visual-only__image {
  position: absolute;
  pointer-events: none;
}

.sof-brain-dashboard-visual-only__glow {
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 56%;
  height: 74%;
  border-radius: 50%;
  opacity: 0.22;
  filter: blur(42px);
  transform: translate(-50%, -50%);
  background:
    radial-gradient(circle at 32% 40%, rgba(16, 178, 255, 0.88), transparent 56%),
    radial-gradient(circle at 70% 62%, rgba(255, 31, 154, 0.78), transparent 58%);
  animation: sofBrainVisualGlow 4.4s ease-in-out infinite;
}

.sof-brain-dashboard-visual-only__energy {
  inset: 9% 7%;
  z-index: 3;
  opacity: 0.25;
  background-image:
    radial-gradient(circle, rgba(62, 225, 255, 0.96) 0 1px, transparent 2px),
    radial-gradient(circle, rgba(255, 64, 174, 0.94) 0 1px, transparent 2px);
  background-position: 0 0, 27px 19px;
  background-size: 78px 78px, 113px 113px;
  mix-blend-mode: screen;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 78%);
  -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 78%);
  animation: sofBrainVisualEnergy 8s linear infinite;
}

.sof-brain-dashboard-visual-only__image {
  left: 50%;
  top: 50%;
  z-index: 2;
  width: auto;
  height: 360px;
  max-width: none;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.985);
  filter:
    brightness(1.02)
    saturate(1.07)
    drop-shadow(0 0 16px rgba(0, 188, 255, 0.22))
    drop-shadow(0 0 30px rgba(255, 31, 155, 0.16));
  transition:
    opacity 620ms cubic-bezier(0.22, 0.85, 0.30, 1),
    transform 850ms cubic-bezier(0.22, 0.85, 0.30, 1),
    filter 420ms ease;
  user-select: none;
  will-change: opacity, transform, filter;
}

.sof-brain-dashboard-visual-only__image.is-visible {
  opacity: 1;
  animation: sofBrainVisualPulse 4.2s ease-in-out infinite;
}

.sof-brain-dashboard-visual-only.is-bursting
.sof-brain-dashboard-visual-only__image.is-visible {
  filter:
    brightness(1.23)
    saturate(1.18)
    drop-shadow(0 0 24px rgba(0, 212, 255, 0.66))
    drop-shadow(0 0 45px rgba(255, 43, 167, 0.56));
}

.sof-brain-dashboard-visual-only.is-complete
.sof-brain-dashboard-visual-only__image.is-visible {
  animation-duration: 6.4s;
  filter:
    brightness(1.08)
    saturate(1.10)
    drop-shadow(0 0 19px rgba(0, 211, 255, 0.34))
    drop-shadow(0 0 35px rgba(255, 46, 164, 0.28));
}

.sof-brain-dashboard-visual-only.is-error
.sof-brain-dashboard-visual-only__image.is-visible {
  animation: sofBrainVisualError 3.2s ease-in-out infinite;
}

.sof-brain-dashboard-visual-only__sr {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

@keyframes sofBrainVisualPulse {
  0%, 100% {
    transform: translate(-50%, -50%) scale(1);
    filter:
      brightness(1.01)
      saturate(1.06)
      drop-shadow(0 0 15px rgba(0, 185, 255, 0.20))
      drop-shadow(0 0 28px rgba(255, 31, 154, 0.15));
  }
  48% {
    transform: translate(-50%, -50%) scale(1.019);
    filter:
      brightness(1.11)
      saturate(1.12)
      drop-shadow(0 0 23px rgba(0, 208, 255, 0.40))
      drop-shadow(0 0 39px rgba(255, 42, 164, 0.31));
  }
}

@keyframes sofBrainVisualGlow {
  0%, 100% {
    opacity: 0.16;
    transform: translate(-50%, -50%) scale(0.94);
  }
  50% {
    opacity: 0.30;
    transform: translate(-50%, -50%) scale(1.08);
  }
}

@keyframes sofBrainVisualEnergy {
  from {
    background-position: 0 0, 27px 19px;
  }
  to {
    background-position: 78px -78px, -86px 132px;
  }
}

@keyframes sofBrainVisualHalo {
  to {
    transform: rotate(360deg);
  }
}

@keyframes sofBrainVisualError {
  0%, 100% {
    transform: translate(-50%, -50%) scale(1);
    filter:
      brightness(0.95)
      saturate(0.94)
      drop-shadow(0 0 14px rgba(255, 72, 102, 0.18));
  }
  50% {
    transform: translate(-50%, -50%) scale(1.009);
    filter:
      brightness(1.05)
      saturate(1.05)
      drop-shadow(0 0 28px rgba(255, 72, 102, 0.42));
  }
}

@media (max-width: 900px) {
  .sof-brain-dashboard-visual-only__image {
    height: 330px;
  }
}

@media (max-width: 620px) {
  #page-dashboard #sofBrainHeroMount,
  .sof-brain-dashboard-visual-only {
    min-height: 260px;
  }

  .sof-brain-dashboard-visual-only__image {
    height: 350px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sof-brain-dashboard-visual-only::before,
  .sof-brain-dashboard-visual-only__glow,
  .sof-brain-dashboard-visual-only__energy,
  .sof-brain-dashboard-visual-only__image {
    animation: none !important;
  }

  .sof-brain-dashboard-visual-only__image {
    transition-duration: 1ms !important;
  }
}

/* SOF AI Brain Full Right Area V1 */
@media (min-width: 1101px) {
  #page-dashboard #sofBrainHeroMount.sof-brain-full-right-area {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: stretch;
    min-height: 660px;
    height: 100%;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only {
    min-height: 660px;
    height: 100%;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__image {
    height: 88%;
    min-height: 520px;
    max-height: 780px;
    max-width: 92%;
    object-fit: contain;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__glow {
    width: 74%;
    height: 72%;
    filter: blur(58px);
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__energy {
    inset: 7% 4%;
  }
}

@media (min-width: 1101px) and (max-height: 820px) {
  #page-dashboard #sofBrainHeroMount.sof-brain-full-right-area,
  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only {
    min-height: 600px;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__image {
    min-height: 470px;
    max-height: 700px;
  }
}

/* SOF AI Brain Full Right Area V1.1 – no left-column shift */
@media (min-width: 1101px) {
  #page-dashboard #sofBrainHeroMount.sof-brain-full-right-area {
    min-height: 0;
    height: auto;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only {
    min-height: 0;
    height: 100%;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__image {
    height: 92%;
    min-height: 0;
    max-height: none;
  }
}

@media (min-width: 1101px) and (max-height: 820px) {
  #page-dashboard #sofBrainHeroMount.sof-brain-full-right-area,
  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only {
    min-height: 0;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__image {
    min-height: 0;
    max-height: none;
  }
}

/* SOF AI Brain Full Right Area V1.2 – fill grid span without shifting */
@media (min-width: 1101px) {
  #page-dashboard #sofBrainHeroMount.sof-brain-full-right-area {
    grid-column: 2 !important;
    grid-row: 1 / span 3 !important;
    align-self: stretch !important;
    justify-self: stretch !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only {
    min-height: 0 !important;
    height: 100% !important;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__image {
    width: auto !important;
    height: calc(100% - 28px) !important;
    min-height: 0 !important;
    max-width: 94% !important;
    max-height: none !important;
    object-fit: contain !important;
  }
}

@media (min-width: 1101px) and (max-height: 820px) {
  #page-dashboard #sofBrainHeroMount.sof-brain-full-right-area,
  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only {
    min-height: 0 !important;
    height: 100% !important;
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area
  .sof-brain-dashboard-visual-only__image {
    height: calc(100% - 24px) !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}

/* SOF AI Brain Structural Right Column V1 */
#page-dashboard .sof-brain-overview-grid {
  display: grid;
  grid-template-columns:
    minmax(0, 1.08fr)
    minmax(0, 0.92fr);
  gap: 20px;
  align-items: stretch;
  margin-bottom: 20px;
}

#page-dashboard .sof-brain-overview-left {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 20px;
  min-width: 0;
}

#page-dashboard .sof-brain-overview-hero,
#page-dashboard .sof-brain-overview-body {
  display: block;
  grid-template-columns: none;
  min-width: 0;
  width: 100%;
  margin: 0;
}

#page-dashboard
.sof-brain-overview-hero
.hero-copy,
#page-dashboard
.sof-brain-overview-body
.dashboard-left-column {
  min-width: 0;
  width: 100%;
}

#page-dashboard
#sofBrainHeroMount.sof-brain-full-right-area {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

#page-dashboard
#sofBrainHeroMount.sof-brain-full-right-area
.sof-brain-dashboard-visual-only {
  min-height: 0 !important;
  height: 100% !important;
}

#page-dashboard
#sofBrainHeroMount.sof-brain-full-right-area
.sof-brain-dashboard-visual-only__image {
  width: 98% !important;
  height: 98% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
}

@media (max-width: 1280px) {
  #page-dashboard .sof-brain-overview-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area {
    grid-column: 1 !important;
    grid-row: auto !important;
    min-height: 520px !important;
  }
}

@media (max-width: 700px) {
  #page-dashboard
  #sofBrainHeroMount.sof-brain-full-right-area {
    min-height: 400px !important;
  }
}
