@media (hover: none) and (pointer: coarse) {
  button,
  a,
  [role="button"],
  .btn-base,
  .display-color-mode-btn,
  .color-preset-btn,
  .nav-icon,
  .status-item,
  .reset-colors-btn {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  .page-content-container,
  .expression-container {
    touch-action: pan-y !important;
  }

  input[type="range"],
  .vsm-slider,
  .bn-slider,
  .spiral-thickness-slider {
    touch-action: pan-x;
    cursor: pointer;
  }

  input[type="range"]::-webkit-slider-thumb,
  .spiral-thickness-slider::-webkit-slider-thumb {
    width: 24px;
    height: 24px;
  }

  input[type="range"]::-moz-range-thumb,
  .spiral-thickness-slider::-moz-range-thumb {
    width: 24px;
    height: 24px;
  }

  .direction-toggle-switch {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  input[type="color"] {
    touch-action: manipulation;
    min-width: 44px;
    min-height: 44px;
  }
}