/* v74.10 — attack-surface evidence-spine hardening
   - keeps the legend copy inside its cards at all widths
   - promotes the topology visual above the legend sooner on constrained layouts
   - removes any chance that opening a deep-dive reads as blank
*/

.attack-surface-v72_3 .tag.brand{
  min-width: 0;
  width: auto;
}

.attack-surface-v72_3 .attack-topology-inner{
  gap: clamp(1.15rem, 2.45vw, 1.9rem);
}

.attack-surface-v72_3 .attack-topology-legend{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

.attack-surface-v72_3 .attack-legend-item{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: .72rem;
  min-width: 0;
  padding: .92rem 1rem;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.016)),
    radial-gradient(220px 120px at 100% 0%, rgba(255,255,255,.025), transparent 70%);
  box-shadow: 0 18px 44px rgba(2,6,18,.18);
}

.attack-surface-v72_3 .attack-legend-item .tag{
  justify-self: start;
  align-self: start;
}

.attack-surface-v72_3 .attack-legend-text{
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.attack-surface-v72_3 details.attack-detail-item[open] .attack-detail-body,
.attack-surface-v72_3 details.attack-detail-item[open] .attack-detail-body *{
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

@media (max-width: 1240px){
  .attack-surface-v72_3 .attack-topology-inner{
    grid-template-columns: 1fr;
  }

  .attack-surface-v72_3 .attack-topology-visual{
    justify-self: start;
    max-width: min(100%, 36rem);
    order: -1;
  }
}

@media (max-width: 980px){
  .attack-surface-v72_3 .attack-topology-legend{
    grid-template-columns: 1fr;
  }

  .attack-surface-v72_3 .attack-legend-item{
    grid-template-columns: 1fr;
    gap: .55rem;
  }
}
