/* Desktop-only Random Card of the Day glass panel.
   Applies equally to logged-in members and logged-out guests.
   Mobile remains unchanged. */
@media (min-width: 781px){
  /* Add clearer separation from the Pro Tip slider above. */
  #randomCardDayWrap.random-card-day-wrap,
  .random-card-day-wrap{
    margin-top: 52px !important;
  }

  /* Shared member + guest glass treatment. */
  #randomCardDay .random-card-day-btn,
  .random-card-day-btn,
  .random-card-day-btn.is-guest-viewer{
    border: 1px solid rgba(255,255,255,.13) !important;
    background: rgba(18,18,28,.50) !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.28) !important;
    -webkit-backdrop-filter: blur(16px) saturate(120%);
    backdrop-filter: blur(16px) saturate(120%);
  }

  #randomCardDay .random-card-day-btn:hover,
  .random-card-day-btn:hover,
  .random-card-day-btn.is-guest-viewer:hover{
    border-color: rgba(255,255,255,.20) !important;
    background: rgba(24,24,36,.56) !important;
  }

  /* Logged-out desktop mirrors the logged-in three-column presentation when
     both the cut image and imagecomic exist. */
  .random-card-day-btn.is-guest-viewer.has-dual-media{
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px) !important;
    grid-template-areas: "cut copy comic" !important;
  }

  /* If a guest record only has imagecomic, keep the same centered member
     geometry: centered copy with imagecomic in the right-hand image slot. */
  .random-card-day-btn.is-guest-viewer:not(.has-dual-media){
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) minmax(110px, 150px) !important;
    grid-template-areas: ". copy comic" !important;
    align-items: center !important;
  }

  .random-card-day-btn.is-guest-viewer .random-card-day-copy{
    grid-area: copy !important;
    width: 100%;
    place-self: center;
    text-align: center !important;
    justify-items: center !important;
    align-content: center !important;
  }

  .random-card-day-btn.is-guest-viewer .random-card-day-kicker{
    justify-content: center !important;
  }

  .random-card-day-btn.is-guest-viewer:not(.has-dual-media) .random-card-day-media{
    grid-area: comic !important;
    width: 100%;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* Both Random Card images are frameless; the glass panel itself keeps its
     subtle white border. imagecomic remains borderless as requested. */
  #randomCardDay .random-card-day-media.is-comic-only,
  .random-card-day-btn .random-card-day-media.is-comic-only{
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
  }

  #randomCardDay .random-card-day-comic,
  .random-card-day-btn .random-card-day-comic,
  #randomCardDay .random-card-day-cut,
  .random-card-day-btn .random-card-day-cut{
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  /* When the Random Card cut is the only image, the border comes from its
     shared media wrapper rather than the img itself. Remove that frame too. */
  #randomCardDay .random-card-day-media:not(.is-comic-only):has(.random-card-day-cut),
  .random-card-day-btn .random-card-day-media:not(.is-comic-only):has(.random-card-day-cut){
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
  }
}