/* Phase 11 — accessibility and readability validation */

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Keep keyboard focus visible even when component-specific styles change. */
button:focus-visible,
[role="button"]:focus-visible,
.board-unit:focus-visible,
.board-recycle:focus-visible,
.perk-choice:focus-visible {
  outline: 3px solid #e8fbff;
  outline-offset: 3px;
  box-shadow: 0 0 0 2px #061018, 0 0 0 5px rgba(102, 231, 255, 0.86) !important;
}

/* Keyboard board manipulation mirrors pointer drop states without relying on color alone. */
.board-preview[data-keyboard-move="true"] {
  outline: 2px solid rgba(232, 251, 255, 0.5);
  outline-offset: 2px;
}

.board-unit--keyboard-source {
  outline: 3px double rgba(232, 251, 255, 0.96);
  outline-offset: 3px;
}

.board-preview__slot--keyboard-target {
  outline: 2px solid rgba(232, 251, 255, 0.9);
  outline-offset: -4px;
}

.board-preview__slot--keyboard-target.board-preview__slot--drop-move {
  background-image:
    repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 5px, transparent 5px 10px),
    radial-gradient(circle at 50% 42%, rgba(102, 231, 255, 0.19), transparent 58%);
}

.board-preview__slot--keyboard-target.board-preview__slot--drop-merge {
  outline-style: double;
  outline-width: 4px;
  background-image:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.12) 0 12%, transparent 13% 100%),
    radial-gradient(circle at 50% 42%, rgba(255, 201, 103, 0.22), transparent 60%);
}

.board-preview__slot--keyboard-target.board-preview__slot--drop-invalid {
  outline-style: dashed;
  background-image:
    repeating-linear-gradient(45deg, rgba(255,255,255,.06) 0 4px, transparent 4px 8px);
}

/* Core integrity states differ by structure as well as color. */
.hud-item--core[data-hud-state="damaged"] {
  border-style: dashed;
}

.hud-item--core[data-hud-state="critical"] {
  border-style: double;
  border-width: 3px;
}

.hud-item--core[data-hud-state="destroyed"] {
  border-style: solid;
  filter: grayscale(.4);
}

/* Preserve readable text when controls are unavailable; disabled state is not opacity-only. */
button:disabled {
  text-decoration: none;
}

.primary-action:disabled,
.pause-action:disabled,
.deploy-action:disabled,
.deploy-type:disabled {
  opacity: 0.7;
  border-style: dashed;
}

@media (prefers-contrast: more) {
  :root {
    --text: #ffffff;
    --muted: #c5d8e0;
    --line: rgba(220, 248, 255, 0.62);
    --line-strong: rgba(235, 252, 255, 0.92);
  }

  .hud-label,
  .hud-item__signal,
  .environment-status,
  .context-hint,
  .perk-choice__description,
  .setting-row__copy small,
  .boss-hud__signals,
  .wave-progress__meta {
    color: #d5e7ed !important;
  }

  .hud-item,
  .board-preview,
  .board-preview__slot,
  .combat-stage,
  .control-dock,
  .perk-choice,
  .pause-panel,
  .settings-panel,
  .victory-panel,
  .boss-hud {
    border-color: rgba(235, 252, 255, 0.62) !important;
  }

  .primary-action:disabled,
  .pause-action:disabled,
  .deploy-action:disabled,
  .deploy-type:disabled {
    opacity: 0.86;
  }
}

@media (forced-colors: active) {
  button,
  .hud-item,
  .board-preview,
  .board-preview__slot,
  .combat-stage,
  .control-dock,
  .perk-choice,
  .pause-panel,
  .settings-panel,
  .victory-panel,
  .boss-hud {
    border: 1px solid CanvasText;
  }

  button:focus-visible,
  [role="button"]:focus-visible,
  .board-unit:focus-visible,
  .board-recycle:focus-visible,
  .perk-choice:focus-visible {
    outline: 3px solid Highlight;
    box-shadow: none !important;
  }

  .board-preview__slot--keyboard-target,
  .board-unit--keyboard-source {
    outline-color: Highlight;
  }
}

/* Make reduced motion a complete fallback even if a future component forgets its own rule. */
@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    transition-duration: 0.001ms !important;
    transition-delay: 0ms !important;
    animation-duration: 0.001ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
  }

  .combat-enemy--slowed::after {
    border-style: dashed;
  }

  .onboarding-gesture[data-kind="drag"]::after {
    content: "DRAG";
    position: absolute;
    top: calc(100% + 5px);
    left: 50%;
    transform: translateX(-50%);
    color: #eafcff;
    font-size: .46rem;
    font-weight: 1000;
    letter-spacing: .08em;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .pause-overlay,
  .settings-overlay,
  .perk-overlay,
  .victory-overlay,
  .control-dock,
  .hud,
  .onboarding-coach {
    backdrop-filter: none !important;
  }

  .pause-overlay,
  .settings-overlay,
  .perk-overlay,
  .victory-overlay {
    background: #02070b !important;
  }
}