[dir='rtl'] .rtl-mirror {
  transform: scaleX(-1);
}

[dir='rtl'] .switch.is-on::after {
  transform: translateX(-20px);
}

/* No .progress-track rules here on purpose: the seek and volume bars are forced
   to direction: ltr in player.css, so inset-inline-start is always the physical
   left edge and the base -50% thumb transform is already correct. Flipping it
   here would push the thumb a full width off. */

@media (max-width: 900px) {
  [dir='rtl'] .sidebar {
    transform: translateX(100%);
  }
  [dir='rtl'] .sidebar.is-open {
    transform: translateX(0);
  }
}
