/*
 * Keep angled CTA gradients inside one paint tile.
 *
 * Gradient buttons retain a transparent 1px border from their shared control
 * styles.  With the CSS background defaults (padding-box origin + repeat),
 * Chromium paints the opposite end of the gradient underneath each border.
 * That wraparound becomes a visible 1–2 physical-pixel vertical stripe at
 * fractional display scaling.  Using the border box as the positioning area
 * and disabling tiling removes the seam without changing control geometry.
 */
.button.button--gradient,
.mockup-button.mockup-button--gradient {
  background-origin: border-box;
  background-clip: border-box;
  background-repeat: no-repeat;
}

/* The same transparent-border/gradient combination is used by selected
   filters. Keep their colour endpoints from wrapping at fractional DPR too. */
.cases-chips input:checked + span,
.filter-chips input:checked + span,
.clients-filters button.is-active,
.mock-office-filters button.is-active {
  background-origin: border-box;
  background-clip: border-box;
  background-repeat: no-repeat;
}