.sector-skill-activation-layer {
  position:absolute;
  inset:12px 12px auto;
  z-index:36;
  display:grid;
  justify-items:center;
  gap:6px;
  pointer-events:none;
}

.sector-skill-activation-card {
  --skill-color:rgba(202,224,226,.60);
  --skill-glow:rgba(202,224,226,.14);
  position:relative;
  min-width:min(340px,82vw);
  max-width:min(520px,88vw);
  padding:8px 34px 9px 14px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--skill-color) 38%,transparent);
  border-left:2px solid var(--skill-color);
  border-radius:2px;
  background:linear-gradient(110deg,rgba(5,12,17,.90),rgba(11,22,27,.76));
  box-shadow:0 12px 34px rgba(0,0,0,.24),0 0 26px var(--skill-glow),inset 0 0 24px var(--skill-glow);
  opacity:0;
  transform:translateY(-7px) scale(.992);
  animation:akasha-skill-activation-card 620ms ease-out forwards;
}

.sector-skill-activation-card::after {
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:4px;
  height:1px;
  background:linear-gradient(90deg,var(--skill-color),transparent 78%);
  opacity:.58;
  transform-origin:left center;
  animation:akasha-skill-activation-line 540ms ease-out both;
}

.sector-skill-activation-card.actor-aegis {
  --skill-color:rgba(75,121,211,.60);
  --skill-glow:rgba(75,121,211,.15);
}
.sector-skill-activation-card.actor-logos {
  --skill-color:rgba(159,103,202,.60);
  --skill-glow:rgba(159,103,202,.14);
}
.sector-skill-activation-card.actor-demeter {
  --skill-color:rgba(203,163,80,.62);
  --skill-glow:rgba(143,177,86,.12);
}
.sector-skill-activation-card.actor-hermes {
  --skill-color:rgba(74,190,179,.62);
  --skill-glow:rgba(74,190,179,.14);
}

.sector-skill-activation-card .sector-skill-activation-kind {
  display:block;
  margin-bottom:1px;
  color:rgba(219,235,237,.66);
  font-size:.64rem;
  line-height:1.2;
  letter-spacing:.13em;
}

.sector-skill-activation-card strong {
  display:inline-block;
  margin-right:.8em;
  color:rgba(245,249,249,.96);
  font-size:.94rem;
  letter-spacing:.04em;
  text-shadow:0 0 16px var(--skill-glow);
}

.sector-skill-activation-card small {
  color:rgba(211,228,230,.68);
  font-size:.70rem;
  letter-spacing:.05em;
}

.akasha-skill-activator-pulse {
  animation:akasha-skill-activator-pulse 560ms ease-out!important;
}

@keyframes akasha-skill-activation-card {
  0% { opacity:0;transform:translateY(-7px) scale(.992);filter:brightness(.82); }
  20% { opacity:1;transform:translateY(0) scale(1);filter:brightness(1.14); }
  72% { opacity:1;transform:translateY(0) scale(1);filter:brightness(1); }
  100% { opacity:0;transform:translateY(-2px) scale(.998);filter:brightness(.94); }
}

@keyframes akasha-skill-activation-line {
  0% { opacity:0;transform:scaleX(.04); }
  30% { opacity:.78;transform:scaleX(1); }
  100% { opacity:.32;transform:scaleX(.72); }
}

@keyframes akasha-skill-activator-pulse {
  0% { filter:brightness(1);box-shadow:inherit; }
  28% { filter:brightness(1.18);box-shadow:0 0 22px rgba(142,214,220,.17); }
  100% { filter:brightness(1);box-shadow:inherit; }
}

@media (prefers-reduced-motion:reduce) {
  .sector-skill-activation-card,
  .sector-skill-activation-card::after,
  .akasha-skill-activator-pulse {
    animation-duration:1ms!important;
    animation-delay:0ms!important;
  }
}