@media (forced-colors: active) {
  :focus-visible {
    outline: 2px solid Highlight !important;
    outline-offset: 3px;
  }

  .card:not(.back),
  .seat.active-seat,
  .player-bar.active-seat,
  .turn-pill,
  .turn-clock {
    border-color: CanvasText;
  }

  .card.selected,
  .card.playable:focus-visible,
  .seat.active-seat,
  .player-bar.active-seat {
    outline: 2px solid Highlight;
    outline-offset: 2px;
  }

  .turn-clock.urgent {
    border: 2px solid Mark;
    background: Mark;
    color: MarkText;
  }

  .turn-clock-track {
    border: 1px solid CanvasText;
    background: Canvas;
  }

  .turn-clock-fill {
    background: Highlight;
  }
}