/* V1.150 — keyboard navigation gets a restrained local arrival frame; pointer/programmatic focus stays silent. */
.ui-focus-arrival,
.ui-focus-arrival > i {
  position: absolute;
  display: block;
  box-sizing: border-box;
  pointer-events: none;
}

.ui-focus-arrival {
  --ui-focus-primary: #f4dd96;
  --ui-focus-soft: rgba(244, 221, 150, 0.28);
  --ui-focus-duration: 390ms;
  left: var(--ui-focus-x);
  top: var(--ui-focus-y);
  width: var(--ui-focus-w);
  height: var(--ui-focus-h);
  opacity: 0;
  animation: ui-focus-arrival-root-v1150 var(--ui-focus-duration) linear both;
}

.ui-focus-arrival.is-danger {
  --ui-focus-primary: #ff8c7b;
  --ui-focus-soft: rgba(255, 112, 94, 0.28);
}

.ui-focus-arrival.is-confirm {
  --ui-focus-primary: #ffe39a;
  --ui-focus-soft: rgba(255, 218, 116, 0.3);
}

.ui-focus-arrival.is-tactical {
  --ui-focus-primary: #78e9ff;
  --ui-focus-soft: rgba(86, 218, 244, 0.28);
}

.ui-focus-arrival-frame {
  inset: -3px;
  border: 1px solid var(--ui-focus-primary);
  border-radius: 8px;
  box-shadow: 0 0 0 1px rgba(2, 9, 18, 0.76), 0 0 13px var(--ui-focus-soft);
  animation: ui-focus-arrival-frame-v1150 var(--ui-focus-duration) cubic-bezier(0.16, 0.82, 0.24, 1) both;
}

.ui-focus-arrival-brackets {
  inset: -6px;
  border-radius: 10px;
  background:
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) left top / 10px 2px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) left top / 2px 10px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) right top / 10px 2px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) right top / 2px 10px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) left bottom / 10px 2px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) left bottom / 2px 10px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) right bottom / 10px 2px no-repeat,
    linear-gradient(var(--ui-focus-primary), var(--ui-focus-primary)) right bottom / 2px 10px no-repeat;
  filter: drop-shadow(0 0 4px var(--ui-focus-soft));
  animation: ui-focus-arrival-brackets-v1150 var(--ui-focus-duration) cubic-bezier(0.16, 0.82, 0.24, 1) both;
}

.ui-focus-arrival-glint {
  top: -3px;
  bottom: -3px;
  left: -8%;
  width: 15%;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--ui-focus-soft), rgba(255, 255, 255, 0.46), transparent);
  transform: skewX(-14deg);
  animation: ui-focus-arrival-glint-v1150 var(--ui-focus-duration) cubic-bezier(0.22, 0.7, 0.2, 1) both;
}

.ui-focus-arrival.is-backward .ui-focus-arrival-glint {
  left: auto;
  right: -8%;
  transform: skewX(14deg);
  animation-name: ui-focus-arrival-glint-backward-v1179;
}

.ui-focus-arrival-glint-secondary {
  display: none;
}

.ui-focus-arrival.is-jump .ui-focus-arrival-glint-secondary {
  display: block;
}

.ui-focus-arrival.is-jump.is-forward .ui-focus-arrival-glint-secondary {
  left: auto;
  right: -8%;
  transform: skewX(14deg);
  animation-name: ui-focus-arrival-glint-backward-v1179;
}

.ui-focus-arrival.is-jump.is-backward .ui-focus-arrival-glint-secondary {
  left: -8%;
  right: auto;
  transform: skewX(-14deg);
  animation-name: ui-focus-arrival-glint-v1150;
}

.ui-focus-arrival.is-handoff {
  animation: ui-focus-arrival-handoff-v1181 90ms ease-out both !important;
}

.ui-focus-arrival.is-handoff > i {
  animation-play-state: paused !important;
}

@keyframes ui-focus-arrival-root-v1150 {
  0% { opacity: 0; }
  14%, 66% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes ui-focus-arrival-frame-v1150 {
  0% { opacity: 0; transform: scale(0.965); }
  24% { opacity: 0.82; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.018); }
}

@keyframes ui-focus-arrival-brackets-v1150 {
  0% { opacity: 0; transform: scale(1.08); }
  28% { opacity: 0.9; transform: scale(1); }
  100% { opacity: 0; transform: scale(0.985); }
}

@keyframes ui-focus-arrival-glint-v1150 {
  0% { opacity: 0; transform: translateX(0) skewX(-14deg); }
  18% { opacity: 0.72; }
  100% { opacity: 0; transform: translateX(760%) skewX(-14deg); }
}

@keyframes ui-focus-arrival-glint-backward-v1179 {
  0% { opacity: 0; transform: translateX(0) skewX(14deg); }
  18% { opacity: 0.72; }
  100% { opacity: 0; transform: translateX(-760%) skewX(14deg); }
}

@keyframes ui-focus-arrival-root-reduced-v1195 {
  0%, 100% { opacity: 0; }
  18%, 72% { opacity: 1; }
}

@keyframes ui-focus-arrival-frame-reduced-v1195 {
  0%, 100% { opacity: 0; }
  18%, 72% { opacity: .84; }
}

@keyframes ui-focus-arrival-brackets-reduced-v1195 {
  0%, 100% { opacity: 0; }
  18%, 72% { opacity: .9; }
}

@keyframes ui-focus-arrival-handoff-v1181 {
  from { opacity: 0.72; }
  to { opacity: 0; }
}

body[data-vfx-quality="low"] .ui-focus-arrival {
  --ui-focus-duration: 240ms;
  animation-name: ui-focus-arrival-root-reduced-v1195;
}

body[data-vfx-quality="low"] .ui-focus-arrival-frame {
  box-shadow: none;
  animation-name: ui-focus-arrival-frame-reduced-v1195;
}

body[data-vfx-quality="low"] .ui-focus-arrival-brackets {
  filter: none;
  animation-name: ui-focus-arrival-brackets-reduced-v1195;
}

body[data-vfx-quality="low"] .ui-focus-arrival .ui-focus-arrival-glint {
  display: block;
  top: -2px;
  bottom: -2px;
  left: -4px;
  right: auto;
  width: 2px;
  border-radius: 0;
  background: var(--ui-focus-primary);
  transform: none;
  animation: none;
  opacity: .88;
  filter: none;
}

body[data-vfx-quality="low"] .ui-focus-arrival.is-backward .ui-focus-arrival-glint {
  left: auto;
  right: -4px;
}

body[data-vfx-quality="low"] .ui-focus-arrival .ui-focus-arrival-glint-secondary {
  display: none;
}

body[data-vfx-quality="low"] .ui-focus-arrival.is-jump.is-forward .ui-focus-arrival-glint-secondary {
  display: block;
  left: auto;
  right: -4px;
}

body[data-vfx-quality="low"] .ui-focus-arrival.is-jump.is-backward .ui-focus-arrival-glint-secondary {
  display: block;
  left: -4px;
  right: auto;
}

@media (prefers-reduced-motion: reduce) {
  .ui-focus-arrival {
    animation: ui-focus-arrival-root-reduced-v1195 180ms linear both !important;
  }

  .ui-focus-arrival-frame {
    animation: ui-focus-arrival-frame-reduced-v1195 180ms linear both !important;
  }

  .ui-focus-arrival-brackets {
    animation: ui-focus-arrival-brackets-reduced-v1195 180ms linear both !important;
  }

  .ui-focus-arrival .ui-focus-arrival-glint {
    display: block;
    top: -2px;
    bottom: -2px;
    left: -4px;
    right: auto;
    width: 2px;
    border-radius: 0;
    background: var(--ui-focus-primary);
    transform: none;
    animation: none;
    opacity: .88;
    filter: none;
  }

  .ui-focus-arrival.is-backward .ui-focus-arrival-glint {
    left: auto;
    right: -4px;
  }

  .ui-focus-arrival .ui-focus-arrival-glint-secondary {
    display: none;
  }

  .ui-focus-arrival.is-jump.is-forward .ui-focus-arrival-glint-secondary {
    display: block;
    left: auto;
    right: -4px;
  }

  .ui-focus-arrival.is-jump.is-backward .ui-focus-arrival-glint-secondary {
    display: block;
    left: -4px;
    right: auto;
  }
}

@media (forced-colors: active) {
  .ui-focus-arrival {
    animation: ui-focus-arrival-root-reduced-v1195 180ms linear both !important;
  }

  .ui-focus-arrival-frame {
    border-color: Highlight;
    box-shadow: none;
    animation: ui-focus-arrival-frame-reduced-v1195 180ms linear both !important;
  }

  .ui-focus-arrival-brackets {
    display: none;
  }

  .ui-focus-arrival .ui-focus-arrival-glint {
    display: block;
    top: -3px;
    bottom: -3px;
    left: -5px;
    right: auto;
    width: 3px;
    border-radius: 0;
    background: Highlight;
    transform: none;
    animation: none;
    opacity: 1;
    forced-color-adjust: auto;
  }

  .ui-focus-arrival.is-backward .ui-focus-arrival-glint {
    left: auto;
    right: -5px;
    transform: none;
  }

  .ui-focus-arrival .ui-focus-arrival-glint-secondary {
    display: none;
  }

  .ui-focus-arrival.is-jump.is-forward .ui-focus-arrival-glint-secondary {
    display: block;
    left: auto;
    right: -5px;
  }

  .ui-focus-arrival.is-jump.is-backward .ui-focus-arrival-glint-secondary {
    display: block;
    left: -5px;
    right: auto;
  }

  body[data-vfx-quality="low"] .ui-focus-arrival .ui-focus-arrival-glint {
    background: Highlight;
    opacity: 1;
  }
}