/* V1.46 · Per-command submission state and local success/error punctuation. */
:is(.action-card, .inline-skill-action).is-battle-command-committing {
  position: relative !important;
  isolation: isolate !important;
}

.battle-command-commit-layer {
  --battle-command-commit-accent: #77e3ff;
  position: absolute !important;
  z-index: 98 !important;
  inset: 3px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 5px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  border: 1px solid color-mix(in srgb, var(--battle-command-commit-accent) 68%, rgba(255,255,255,.34)) !important;
  border-radius: max(5px, calc(var(--ui-button-radius, 8px) - 2px)) !important;
  color: #effcff !important;
  background:
    radial-gradient(circle at 50% 44%, color-mix(in srgb, var(--battle-command-commit-accent) 20%, transparent), transparent 48%),
    linear-gradient(155deg, rgba(10, 29, 40, .94), rgba(3, 9, 14, .97)) !important;
  box-shadow:
    inset 0 0 22px color-mix(in srgb, var(--battle-command-commit-accent) 12%, transparent),
    0 0 14px color-mix(in srgb, var(--battle-command-commit-accent) 26%, transparent) !important;
  pointer-events: none !important;
  animation: battle-command-commit-enter 160ms cubic-bezier(.12,.82,.18,1) both !important;
}

.battle-command-commit-layer::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(105deg, transparent 22%, rgba(255,255,255,.12) 46%, transparent 68%) !important;
  transform: translateX(-130%) !important;
  animation: battle-command-commit-scan 920ms ease-in-out infinite !important;
}

.battle-command-commit-rune {
  position: relative !important;
  width: 26px !important;
  height: 26px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid rgba(222, 248, 255, .25) !important;
  border-top-color: var(--battle-command-commit-accent) !important;
  border-right-color: color-mix(in srgb, var(--battle-command-commit-accent) 72%, white) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 12px color-mix(in srgb, var(--battle-command-commit-accent) 38%, transparent) !important;
  animation: battle-command-rune-spin 760ms linear infinite !important;
}

.battle-command-commit-rune::before,
.battle-command-commit-rune::after,
.battle-command-commit-rune > i {
  content: "" !important;
  position: absolute !important;
  width: 3px !important;
  height: 3px !important;
  border-radius: 50% !important;
  background: #f7fdff !important;
  box-shadow: 0 0 6px var(--battle-command-commit-accent) !important;
}

.battle-command-commit-rune::before { top: 3px !important; left: 10px !important; }
.battle-command-commit-rune::after { right: 3px !important; bottom: 7px !important; }
.battle-command-commit-rune > i { left: 4px !important; bottom: 5px !important; }

.battle-command-commit-label {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(239, 252, 255, .94) !important;
  font: 900 10px/1 system-ui, "Microsoft YaHei", sans-serif !important;
  letter-spacing: .08em !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 3px #000, 0 0 8px color-mix(in srgb, var(--battle-command-commit-accent) 40%, transparent) !important;
}

.battle-command-commit-layer.is-resolving[data-outcome="success"] {
  --battle-command-commit-accent: #76f0bd;
  animation: battle-command-commit-success 115ms ease-out both !important;
}

.battle-command-commit-layer.is-resolving[data-outcome="error"] {
  --battle-command-commit-accent: #ff7568;
  animation: battle-command-commit-error 115ms ease-out both !important;
}

.battle-command-commit-layer.is-resolving .battle-command-commit-rune {
  animation: none !important;
  border-color: var(--battle-command-commit-accent) !important;
}

@keyframes battle-command-commit-enter {
  0% { opacity: 0; transform: scale(.96); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes battle-command-commit-scan {
  0%, 12% { transform: translateX(-130%); }
  72%, 100% { transform: translateX(130%); }
}

@keyframes battle-command-rune-spin {
  to { transform: rotate(360deg); }
}

@keyframes battle-command-commit-success {
  0% { opacity: 1; filter: brightness(1); transform: scale(1); }
  55% { opacity: 1; filter: brightness(1.35); transform: scale(1.015); }
  100% { opacity: 0; filter: brightness(1.1); transform: scale(1); }
}

@keyframes battle-command-commit-error {
  0% { opacity: 1; filter: saturate(1); transform: scale(1); }
  52% { opacity: 1; filter: saturate(1.35) brightness(1.2); transform: scale(.985); }
  100% { opacity: 0; filter: saturate(1.1); transform: scale(1); }
}

@media (max-width: 720px) {
  .battle-command-commit-layer {
    inset: 2px !important;
    gap: 4px !important;
  }

  .battle-command-commit-rune {
    width: 22px !important;
    height: 22px !important;
  }

  .battle-command-commit-label {
    font-size: 9px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .battle-command-commit-layer,
  .battle-command-commit-layer::before,
  .battle-command-commit-rune,
  .battle-command-commit-layer.is-resolving {
    animation-duration: 80ms !important;
    animation-iteration-count: 1 !important;
  }
}
