/* The home card owns its sky so desktop and mobile use the same surface. */
.rovno-full-dashboard .rovno-trial-offer {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02)),
    linear-gradient(rgba(23, 39, 51, .24), rgba(23, 39, 51, .24)),
    var(--rovno-sky-overlay),
    url("/rovno-sky.webp") center top / cover no-repeat !important;
}
.rovno-trial-offer {
  --color-dark-50: 253, 254, 254;
  --color-dark-400: 177, 195, 204;
  --color-dark-800: 32, 52, 65;
  background: linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02)),
    var(--rovno-trial-background, #101b25) !important;
  /* Avoid compositor seams when the translucent surface is resized. */
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  box-shadow: none !important;
}
.rovno-trial-offer > button[style*="--color-accent"] {
  background: rgba(32, 52, 65, .45) !important;
  color: rgb(var(--color-dark-50)) !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  box-shadow: none !important;
}
.rovno-browse-plans {
  margin-top: 12px !important;
  font-size: 14px !important;
  line-height: 20px !important;
  font-weight: 600;
  border-radius: 16px;
  padding: 14px;
  border: 0;
  background: #d9fd71 !important;
  color: #0e1720 !important;
  text-shadow: none;
}
.rovno-browse-plans:hover {
  background: #ccf459 !important;
}


.rovno-trial-offer > .pointer-events-none.inset-0 {
  opacity: .025 !important;
  background-image: linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px) !important;
}