/**
 * 20261025p4recent1
 * Phone homepage only (<=768px). Desktop is not in this file.
 * One Recent card, swipe rail, hero clear of the fixed nav, island clearance.
 * 20261025p6hero1: do not set hero title font-size, line-height, or letter-spacing.
 * Header clearance is padding and scroll-margin only. Pre-today title size stays.
 */
@media (min-width: 769px) {
  .video-carousel-dots {
    display: none !important;
  }
}

@media (max-width: 768px) {
  html body:has(nav .nav-center),
  html body:has(nav.wdhc-site-nav) {
    padding-top: calc(var(--wdhc-nav-h, 64px) + env(safe-area-inset-top, 0px) + 6px) !important;
    scroll-padding-top: calc(var(--wdhc-nav-h, 64px) + 8px) !important;
  }

  html body .marquee-container {
    margin-top: 0 !important;
    scroll-margin-top: calc(var(--wdhc-nav-h, 64px) + 8px) !important;
  }

  html body > header,
  html body .marquee-container + header {
    overflow: visible !important;
    scroll-margin-top: calc(var(--wdhc-nav-h, 64px) + 8px) !important;
  }

  /* LOCK 20261025p6hero1
     Pre-today phone hero. Header clearance stays padding and scroll-margin.
     Do not replace these with a smaller clamp. <=429 is the 20261024ssf size.
     430-768 is the wdhc-mobile.css size Phase 4 had shrunk. */
  @media (max-width: 429px) {
    html body .marquee-container + header h1.hero-title,
    html body > header h1.hero-title {
      font-size: clamp(1.55rem, 8.35vw, 2.35rem) !important;
      line-height: 0.98 !important;
      letter-spacing: 0.01em !important;
    }
  }
  @media (min-width: 430px) {
    html body .marquee-container + header h1.hero-title,
    html body > header h1.hero-title {
      font-size: clamp(2.95rem, 13.2vw, 4.7rem) !important;
      line-height: 0.96 !important;
      letter-spacing: 0.02em !important;
    }
  }

  html body .marquee-container + header h1.hero-title span,
  html body > header h1.hero-title span,
  html body header h1.hero-title .hero-gold,
  html body header h1.hero-title .dead-hang-text {
    overflow: visible !important;
    max-width: 100% !important;
  }

  html body:has(#wdhc-island):not(.wdhc-form-page):not(.page-submit) {
    padding-bottom: calc(var(--wdhc-island-h, 60px) + env(safe-area-inset-bottom, 0px) + 12px) !important;
    scroll-padding-bottom: calc(var(--wdhc-island-h, 60px) + env(safe-area-inset-bottom, 0px) + 12px) !important;
  }

  html body:has(#wdhc-island) .wdhc-site-footer,
  html body:has(#wdhc-island) #home-rules,
  html body:has(#wdhc-island) [data-wdhc-email-mount="home"] {
    scroll-margin-bottom: calc(var(--wdhc-island-h, 60px) + env(safe-area-inset-bottom, 0px) + 12px) !important;
  }

  /* One container. The section is not a second bordered card. */
  html body #wdhc-recent.video-submissions-section,
  html body #wdhc-recent.video-submissions-section--lead {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }

  html body #wdhc-recent .video-submissions-head__titles {
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body #wdhc-recent .video-submissions-title-row {
    margin: 0 0 12px !important;
  }

  html body #wdhc-recent .video-submissions-lead,
  html body #wdhc-recent .video-submissions-tagline {
    display: none !important;
  }

  html body #wdhc-recent .wdhc-open-reels-row {
    order: 2 !important;
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 0 0 12px !important;
  }

  html body #wdhc-recent .video-carousel {
    order: 3 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body #wdhc-recent .video-carousel-stage {
    padding: 0 !important;
  }

  html body #wdhc-recent .video-carousel-btn {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body #wdhc-recent .video-carousel-viewport {
    scroll-snap-type: x mandatory !important;
    scroll-padding-left: 0 !important;
  }

  html body #wdhc-recent .video-carousel-slide {
    padding: 0 10px 0 0 !important;
    box-sizing: border-box !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;
  }

  html body #wdhc-recent .video-carousel-slide .video-submission-item {
    aspect-ratio: auto !important;
    height: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(212, 175, 55, 0.4) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #070707 !important;
    box-shadow: none !important;
  }

  html body #wdhc-recent .video-submission-frame,
  html body #wdhc-recent .video-submission-frame.is-portrait,
  html body #wdhc-recent .video-submission-item.is-film-mode .video-submission-frame {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 9 / 16 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #000 !important;
    align-self: stretch !important;
  }

  html body #wdhc-recent .video-carousel .video-submission-meta {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    background: #0c0c0c !important;
    padding: 6px 8px 4px !important;
  }

  html body #wdhc-recent .video-carousel .video-submission-name-row,
  html body #wdhc-recent .video-carousel .video-submission-time-row {
    margin-bottom: 4px !important;
  }

  html body #wdhc-recent .video-carousel .video-submission-hangtype {
    margin-bottom: 4px !important;
  }

  html body #wdhc-recent .video-carousel-dots {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 10px 0 2px !important;
    min-height: 18px !important;
    padding: 0 !important;
  }

  html body #wdhc-recent .video-carousel-dot {
    width: 6px !important;
    height: 6px !important;
    min-width: 6px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(212, 175, 55, 0.35) !important;
    box-shadow: none !important;
    cursor: pointer !important;
  }

  html body #wdhc-recent .video-carousel-dot.is-active {
    width: 8px !important;
    height: 8px !important;
    min-width: 8px !important;
    background: #d4af37 !important;
  }

  html body #wdhc-recent .video-carousel-progress {
    display: none !important;
  }
}