/* Figma uses this font's hhea metrics. Browser defaults otherwise select its
   shorter OS/2 ascender and draw 80px display text 12px above the source. */
@font-face {
  font-family: "TPR Rader Figma";
  src: url("assets/fonts/pp-rader/PPRader-Bold.otf") format("opentype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  ascent-override: 100%;
  descent-override: 20.01953125%;
  line-gap-override: 0%;
}

/* Geometry from the updated Figma frames and their 2026-10-30 PDF exports.
   Full-page PDF chrome adds 30px above the website; these are page coordinates.
   Artwork, edge masks, and asset source selection remain separate from geometry. */
@media (min-width: 901px) {
  .preview-offer-description {
    letter-spacing: -0.24px;
  }
  .preview-offer-tags span {
    padding: 4px 8px;
  }
  .preview-offer-carousel {
    padding-bottom: 0;
  }
  .preview-offer-card#ufficio-virtuale {
    display: flex;
    flex-direction: column;
    height: 756px;
  }
  .preview-offer-card#ufficio-virtuale .preview-offer-body {
    flex: 1;
    width: 100%;
  }
  .preview-offer-card#ufficio-virtuale .preview-offer-tags:empty {
    display: none;
  }
  .preview-offer-card#ufficio-virtuale .preview-offer-body > .preview-button {
    margin-top: auto;
  }
  .preview-offer-media {
    position: relative;
    flex: none;
    width: 560px;
    margin-inline: -64px;
    overflow: hidden;
  }
  .preview-company-media {
    min-height: 0;
  }
  .preview-offers-heading h2:has(.preview-inline-wordmark) {
    height: 57px;
    line-height: 0.9;
  }
  .preview-inline-wordmark {
    height: 57px;
  }
  .preview-partners {
    padding-top: 120px;
  }
  .preview-partner-logos {
    width: max-content;
    max-width: 100%;
    height: 120px;
    gap: 90px;
  }
  .preview-partner-logos > span {
    flex: none;
  }
  .preview-partner-logos > span:nth-child(1) {
    width: 104.347px;
    height: 120px;
  }
  .preview-partner-logos > span:nth-child(2) {
    width: 296.488px;
    height: 75px;
  }
  .preview-partner-logos > span:nth-child(3) {
    width: 89.364px;
    height: 90.001px;
  }
  .preview-partner-logos > span:nth-child(4) {
    width: 424.286px;
    height: 90px;
  }
}

/* The importer adds a semantic role to each image's clipping wrapper.
   Source photographs use explicit crop geometry; SVG logos keep their own size. */
@media (min-width: 901px) {
  [data-asset-role="home.hero"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="home.hero"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2384px;
    height: 3301px;
    left: -507px;
    top: -2574.0176px;
    transform: none;
    transform: rotate(-180deg) scaleX(-1);
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="home.events"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="home.events"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2267px;
    height: 3185px;
    left: -400px;
    top: 0.24px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="offers.day-pass"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="offers.day-pass"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 630px;
    height: 420px;
    left: -54px;
    top: 0px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="offers.all-inclusive"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="offers.all-inclusive"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 523px;
    height: 348px;
    left: 0px;
    top: 0px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="offers.flex-8"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="offers.flex-8"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 1925px;
    height: 1283px;
    left: -568px;
    top: -423px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="offers.ufficio-virtuale"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="offers.ufficio-virtuale"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 842px;
    height: 561px;
    left: -123px;
    top: -25px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="offers.company"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="offers.company"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 1404px;
    height: 936px;
    left: -385px;
    top: 0px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="about.offers"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="about.offers"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 630px;
    height: 420px;
    left: -54px;
    top: 0px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="about.events"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="about.events"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 560px;
    height: 701px;
    left: 0px;
    top: -181px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="contact.map"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="contact.map"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 618px;
    height: 824px;
    left: -3px;
    top: -216.5px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="events.shamans-ritual"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="events.shamans-ritual"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 787px;
    height: 525px;
    left: -114px;
    top: -140px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="events.the-dinner"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="events.the-dinner"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 560px;
    height: 701px;
    left: 0px;
    top: -190px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="events.ceramic-workshop"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="events.ceramic-workshop"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 738.785px;
    height: 1108.042px;
    left: 289.18px;
    top: 220.18px;
    transform: translate(-50%, -50%) rotate(0.81deg);
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="events.the-peoples-week-talk"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="events.the-peoples-week-talk"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 561px;
    height: 374px;
    left: 0px;
    top: -27px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.coworking.artwork"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.coworking.artwork"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2196px;
    height: 3262px;
    left: 1580px;
    top: -608px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.coworking.picture"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.coworking.picture"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 636px;
    height: 848px;
    left: -38px;
    top: -207px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.coworking.cards.postazioni"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.coworking.cards.postazioni"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 1053.075px;
    height: 702.136px;
    left: 280.49px;
    top: 169.41px;
    transform: translate(-50%, -50%) rotate(1.13deg);
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.coworking.cards.sale-riunioni"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.coworking.cards.sale-riunioni"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 635px;
    height: 423px;
    left: -37px;
    top: -42px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.coworking.cards.eventi"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.coworking.cards.eventi"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 560px;
    height: 701px;
    left: 0px;
    top: -190px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.reformer.artwork"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.reformer.artwork"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2196px;
    height: 3262px;
    left: 1580px;
    top: -608px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.reformer.picture"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.reformer.picture"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 636px;
    height: 848px;
    left: -38px;
    top: -207px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.reformer.cards.studio"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.reformer.cards.studio"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 601px;
    height: 401px;
    left: -28px;
    top: -50px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.reformer.cards.classi"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.reformer.cards.classi"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 658px;
    height: 438px;
    left: -49px;
    top: -50px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.reformer.cards.attrezzature"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.reformer.cards.attrezzature"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 774px;
    height: 516px;
    left: -107px;
    top: -89px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.wellness.artwork"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.wellness.artwork"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2196px;
    height: 3262px;
    left: 1580px;
    top: -608px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.wellness.picture"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.wellness.picture"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 636px;
    height: 848px;
    left: -38px;
    top: -207px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.wellness.cards.gym"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.wellness.cards.gym"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 560px;
    height: 374px;
    left: 0px;
    top: -18px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.wellness.cards.contrast-therapy"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.wellness.cards.contrast-therapy"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 560px;
    height: 374px;
    left: 0px;
    top: -18px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.wellness.cards.longevity"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.wellness.cards.longevity"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 160px;
    height: 160px;
    left: 200px;
    top: 89px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.bar.artwork"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.bar.artwork"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2196px;
    height: 3262px;
    left: 1580px;
    top: -608px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.bar.picture"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.bar.picture"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 636px;
    height: 848px;
    left: -38px;
    top: -207px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.bar.cards.servizi"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.bar.cards.servizi"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 1106.332px;
    height: 1659.295px;
    left: 347.8px;
    top: 168.697px;
    transform: translate(-50%, -50%) rotate(-19.73deg);
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.bar.cards.accessibilita"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.bar.cards.accessibilita"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 1456px;
    height: 970px;
    left: -514px;
    top: -381px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.bar.cards.storage"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.bar.cards.storage"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 1041px;
    height: 694px;
    left: -169px;
    top: -132px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.media.artwork"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.media.artwork"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 2196px;
    height: 3262px;
    left: 1580px;
    top: -608px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.media.picture"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.media.picture"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 636px;
    height: 848px;
    left: -38px;
    top: -207px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.media.cards.podcast"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.media.cards.podcast"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 764px;
    height: 509px;
    left: -102px;
    top: -63px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.media.cards.set-fotografico"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.media.cards.set-fotografico"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 801px;
    height: 535px;
    left: -121px;
    top: -63px;
    transform: none;
    object-fit: cover;
  }
}

@media (min-width: 901px) {
  [data-asset-role="rooms.media.cards.studio-audio"] {
    position: relative;
    overflow: hidden;
  }
  [data-asset-role="rooms.media.cards.studio-audio"] > img {
    position: absolute;
    display: block;
    max-width: none;
    margin: 0;
    width: 160px;
    height: 160px;
    left: 200px;
    top: 89px;
    transform: none;
    object-fit: cover;
  }
}


/* Cap-trimmed source headings use distinct text nodes so their image wordmark
   and visible capital-letter edge align without changing surrounding flow. */
@media (min-width: 901px) {
  .updated-preview main {
    --preview-display: "TPR Rader Figma", Arial, sans-serif;
  }
  .preview-cap-text {
    display: block;
    text-box-trim: trim-both;
    text-box-edge: cap alphabetic;
  }
  .preview-vivi-intro h1 {
    height: 57px;
    line-height: 0.9;
  }
  .preview-discover-content:not(.is-detail) > h2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
  .preview-discover-content:not(.is-detail) > h2 > br {
    display: none;
  }
  .preview-discover-content:not(.is-detail) > h2 .preview-inline-wordmark {
    margin-top: 0;
  }
}

/* The offer tags retain their source category colors across viewport sizes. */
.preview-offer-card#all-inclusive .preview-offer-tags > span:nth-child(1) {
  background: var(--pink);
}
.preview-offer-card#all-inclusive .preview-offer-tags > span:nth-child(2),
.preview-offer-card#flex-8 .preview-offer-tags > span:nth-child(1) {
  background: var(--yellow);
}
.preview-offer-card#all-inclusive .preview-offer-tags > span:nth-child(3) {
  background: var(--green);
  color: var(--yellow);
}
.preview-offer-body ul {
  letter-spacing: -0.2px;
}

@media (min-width: 901px) {
  /* The source discovery grid ends at Media's y=656 plus its 72px frame. */
  .preview-discover {
    height: 728px;
  }
  /* Source room selector sits inside its footer's 80px padding. */
  .preview-room-nav {
    bottom: 80px;
  }
}

@media (min-width: 901px) {
  /* Footer display labels use the same source hhea metrics; SVG marks retain
     their existing artwork and geometry. */
  .updated-preview .preview-footer nav h2 {
    font-family: "TPR Rader Figma", Arial, sans-serif;
  }
}

/* Homepage figures retain their original inline SVG artwork. Their individual
   frames follow source616:1740 (1512 ×240), then scale with the viewport. */
.updated-preview .preview-home-about .people-nav {
  height: auto;
  min-height: 0;
  max-height: none;
  aspect-ratio: 1512 / 240;
}
.updated-preview .preview-home-about .people-canvas {
  height: 100%;
  min-height: 0;
  max-height: none;
}
.updated-preview .preview-home-about .people-figures {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin-left: 0;
}
.updated-preview .preview-home-about .people-figure {
  position: absolute;
  display: block;
  min-width: 0;
}
.updated-preview .preview-home-about .people-figure[data-room-link="coworking"] {
  left: 13.49%;
  top: 16.97%;
  width: 10.52%;
  height: 82.75%;
}
.updated-preview .preview-home-about .people-figure[data-room-link="bar"] {
  left: 30.36%;
  top: 13.58%;
  width: 7.52%;
  height: 86.2%;
}
.updated-preview .preview-home-about .people-figure[data-room-link="media"] {
  left: 44.23%;
  top: 0;
  width: 8.79%;
  height: 99.97%;
}
.updated-preview .preview-home-about .people-figure[data-room-link="reformer"] {
  left: 59.37%;
  top: 16.12%;
  width: 10.67%;
  height: 83.61%;
}
.updated-preview .preview-home-about .people-figure[data-room-link="wellness"] {
  left: 76.39%;
  top: 11.03%;
  width: 10.16%;
  height: 88.97%;
}
.updated-preview .preview-home-about .people-figure .little-man {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
}
.updated-preview .preview-home-about .people-nav::before {
  top: 91.25%;
}

/* Reuse the unchanged PDF control contour on a decorative layer. Nine-slice
   sizing prevents letterboxing as the banner wraps; text, focus outline and
   the native link hit area are never masked. */
.updated-preview .preview-pilates-banner {
  position: relative;
  isolation: isolate;
  background: transparent;
  border-radius: 0;
}
.updated-preview .preview-pilates-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--yellow);
  border-radius: 12px;
  -webkit-mask-box-image: url("assets/figma-updated/shapes/pilates-banner-cta-mask.svg")
    12 fill / 16px / 0 stretch;
  pointer-events: none;
}

/* The source's white V is the existing hand-drawn control arrow, rotated.
   Keep the full select above its paper background and reserve the arrow space. */
.updated-preview .preview-fields > label.preview-select > select {
  appearance: none;
  padding-right: 48px;
}
.updated-preview .preview-fields > label.preview-select::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  z-index: 1;
  width: 12px;
  height: 22px;
  background: white;
  mask: url("assets/figma-updated/shapes/control-arrow.svg") center / contain
    no-repeat;
  transform: translateY(-50%) rotate(90deg);
  pointer-events: none;
}

/* Preserve the original company paper's CSS-pixel edge depth when its content
   changes the card proportions. Repeat the unchanged source edge slices rather
   than stretching a whole-page silhouette over the tall responsive card.
   The exact 1352 x 920 source treatment remains owned by has-source-paper. */
@supports (-webkit-mask-box-image-source: url("")) {
  .updated-preview .preview-company-card:not(.has-source-paper) {
    mask: none;
    -webkit-mask-box-image: url("assets/figma-updated/shapes/company-card-mask-1352x920.svg")
      24 fill / 24px / 0 repeat;
  }
  .updated-preview .preview-company-card:not(.has-source-paper)::after {
    border: 24px solid transparent;
    border-radius: 0;
    border-image: url("assets/figma-updated/shapes/company-card-frame-1352x920.svg")
      24 / 24px / 0 repeat;
  }
}

/* Standalone Room cards use the original single chevron in its irregular
   circle, also used by the source About cards. Keep the 52 × 54 painted canvas
   around a nominal 48px control; the existing label/photo layout stays intact. */
body.updated-preview .preview-room-card-label > .preview-room-card-arrow {
  position: relative;
  display: block;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
}
body.updated-preview .preview-room-card-arrow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 108.3333333%;
  height: 112.5%;
  transform: translate(-50%, -50%);
  background: currentColor;
  mask: url("assets/route-arrow-zigzag.png") center /
    contain no-repeat;
  pointer-events: none;
}
@media (max-width: 900px) {
  body.updated-preview .preview-room-card-label > .preview-room-card-arrow {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
  }
}