.rec-screen-1 img[src^="/rec/svg/"] {
  max-width: none;
}

.rec-media-fill {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  color: transparent;
}

.rec-media--contain {
  object-fit: contain;
}

.rec-media-transparent {
  color: transparent;
}

.rec-icon {
  display: inline-flex;
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  overflow: hidden;
  background-color: currentColor;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
  transition: color 160ms ease;
}

.rec-icon--dark {
  color: var(--strong);
}

.rec-icon--light {
  color: var(--inverse);
}

.rec-icon--close {
  mask-image: url("/icons/sign_x.svg");
}

.rec-icon--arrow {
  mask-image: url("/icons/arrow_right.svg");
}

.rec-icon--square {
  mask-image: url("/icons/square_s.svg");
}

.rec-icon--double-left {
  mask-image: url("/icons/two_arrows_left.svg");
}

.rec-icon--double-right {
  mask-image: url("/icons/two_arrows_right.svg");
}

.rec-badge__count--blue {
  background-color: var(--accent-blue);
}

.rec-badge__count--green {
  background-color: var(--accent-green);
}

.rec-align-end {
  align-self: end;
}

.rec-position-absolute {
  position: absolute;
}

.rec-position-relative {
  position: relative;
}

.rec-overflow-hidden {
  overflow: hidden;
}

.rec-padel-success-flow {
  shape-outside: polygon(18vw 9vw, 15vw 54vw, 70vw 70vw, 70vw 9vw);
}
