/* Desktop only: reuse the existing photography behind the entire document.
   Colour alpha, never element opacity, keeps text and controls crisp. */
@media (min-width:641px) {
  body[data-desktop-scene] {
    --desktop-photo:image-set(url('/assets/hero/weather-1600.avif') type('image/avif'),url('/assets/hero/weather-1600.webp') type('image/webp'));
    --desktop-glass:rgba(6,22,38,.58);
    --activity-surface:var(--desktop-glass);
    --muted:#c3d1e2;
    --text-secondary:#c3d1e2;
    background:linear-gradient(rgba(3,13,25,.48),rgba(3,13,25,.68)),var(--desktop-photo) center / cover fixed;
    background-attachment:fixed;
  }
  body[data-desktop-scene="motorcycle"] {--desktop-photo:image-set(url('/assets/hero/motorcycle-1600.avif') type('image/avif'),url('/assets/hero/motorcycle-1600.webp') type('image/webp'))}
  body[data-desktop-scene="cycling"] {--desktop-photo:image-set(url('/assets/hero/cycling-1600.avif') type('image/avif'),url('/assets/hero/cycling-1600.webp') type('image/webp'))}
  body[data-desktop-scene="drone"] {--desktop-photo:image-set(url('/assets/hero/drone-1600.avif') type('image/avif'),url('/assets/hero/drone-1600.webp') type('image/webp'))}
  body[data-desktop-scene="hiking"] {--desktop-photo:image-set(url('/assets/hero/hiking-1600.avif') type('image/avif'),url('/assets/hero/hiking-1600.webp') type('image/webp'))}
  body[data-desktop-scene="running"] {--desktop-photo:image-set(url('/assets/hero/running-1600.avif') type('image/avif'),url('/assets/hero/running-1600.webp') type('image/webp'))}
  body[data-desktop-scene="fishing"] {--desktop-photo:image-set(url('/assets/hero/fishing-1600.avif') type('image/avif'),url('/assets/hero/fishing-1600.webp') type('image/webp'))}
  body[data-desktop-scene="kitesurf"] {--desktop-photo:image-set(url('/assets/hero/kitesurf-1600.avif') type('image/avif'),url('/assets/hero/kitesurf-1600.webp') type('image/webp'))}
  body[data-desktop-scene="sailing"] {--desktop-photo:image-set(url('/assets/hero/sailing-1600.avif') type('image/avif'),url('/assets/hero/sailing-1600.webp') type('image/webp'))}
  body[data-desktop-scene="golf"] {--desktop-photo:image-set(url('/assets/hero/golf-1600.avif') type('image/avif'),url('/assets/hero/golf-1600.webp') type('image/webp'))}
  body[data-desktop-scene] .hero-activity,
  body[data-desktop-scene] .hero-home,
  body[data-desktop-scene] .hero-text {background:transparent}
  /* The same scene now continues behind the forecast, without a hard seam. */
  body[data-desktop-scene] .hero-activity .hero-photo {display:none}
  /* Keep the homepage weather effects, but not a second cropped photo/fade. */
  body[data-desktop-scene] .hero-home-photo {background:transparent}
  body[data-desktop-scene] .hero-home-photo .hero-media,
  body[data-desktop-scene] .hero-home-photo .hero-scrim {display:none}
  body[data-desktop-scene] .site-header {background:rgba(5,16,29,.70);backdrop-filter:blur(8px)}
  body[data-desktop-scene] .site-footer {background:rgba(5,16,29,.64)}
  body[data-desktop-scene] .widget,
  body[data-desktop-scene] #gng-app .verdict,
  body[data-desktop-scene] #gng-app .tomorrow-card,
  body[data-desktop-scene] #gng-app .window-callout,
  body[data-desktop-scene] .decision-window,
  body[data-desktop-scene] .activity-card,
  body[data-desktop-scene] .act-card,
  body[data-desktop-scene] .hub-card,
  body[data-desktop-scene] .gng-comparison-card,
  body[data-desktop-scene] .gng-review-note,
  body[data-desktop-scene] details.faq {background:var(--desktop-glass);border-color:rgba(193,221,242,.28)}
  body[data-desktop-scene] .widget,
  body[data-desktop-scene] #gng-app .verdict {backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
  body[data-desktop-scene] #gng-app .verdict.go {background:linear-gradient(110deg,rgba(26,106,77,.24),transparent 70%),var(--desktop-glass)}
  body[data-desktop-scene] #gng-app .verdict.maybe {background:linear-gradient(110deg,rgba(130,90,22,.24),transparent 70%),var(--desktop-glass)}
  body[data-desktop-scene] #gng-app .verdict.nogo {background:linear-gradient(110deg,rgba(145,36,60,.24),transparent 70%),var(--desktop-glass)}
  body[data-desktop-scene] #gng-app .activity-factors>div,
  body[data-desktop-scene] #gng-app .hour,
  body[data-desktop-scene] #gng-app .wday,
  body[data-desktop-scene] .metric,
  body[data-desktop-scene] .wxhour,
  body[data-desktop-scene] .wxday,
  body[data-desktop-scene] .wx-chip,
  body[data-desktop-scene] .wx-sun {background:rgba(9,29,46,.52)}
  body[data-desktop-scene] .mode-tabs,
  body[data-desktop-scene] .loc-bar input,
  body[data-desktop-scene] .sel {background:rgba(4,18,32,.60)}
  body[data-desktop-scene] .prose {background:rgba(5,19,33,.68);border-radius:16px}
  /* Keep the light editorial sections light, but let the scenery show through. */
  body[data-desktop-scene] .section-light {background:rgba(238,242,248,.83)}
  body[data-desktop-scene] .section-light .prose {background:transparent}
  body[data-desktop-scene] .section-light .faq {background:rgba(255,255,255,.64);color:#12203a}
  body[data-desktop-scene] .section-light .prose p,
  body[data-desktop-scene] .section-light .prose li {color:#26354d}
  body[data-desktop-scene] .section-light .gear {background:rgba(255,255,255,.70)}
}
@media (min-width:641px) and (prefers-reduced-transparency:reduce),
       (min-width:641px) and (prefers-contrast:more),
       (min-width:641px) and (forced-colors:active) {
  body[data-desktop-scene] {--desktop-glass:#09192b;background:#07111f}
  body[data-desktop-scene] .site-header,
  body[data-desktop-scene] .site-footer,
  body[data-desktop-scene] .prose,
  body[data-desktop-scene] .widget,
  body[data-desktop-scene] #gng-app .verdict,
  body[data-desktop-scene] #gng-app .activity-factors>div,
  body[data-desktop-scene] #gng-app .hour,
  body[data-desktop-scene] #gng-app .wday,
  body[data-desktop-scene] .metric,
  body[data-desktop-scene] .wxhour,
  body[data-desktop-scene] .wxday,
  body[data-desktop-scene] .wx-chip,
  body[data-desktop-scene] .wx-sun,
  body[data-desktop-scene] .mode-tabs,
  body[data-desktop-scene] .loc-bar input,
  body[data-desktop-scene] .sel {background:#09192b;backdrop-filter:none;-webkit-backdrop-filter:none}
  body[data-desktop-scene] .section-light,
  body[data-desktop-scene] .section-light .prose,
  body[data-desktop-scene] .section-light .faq,
  body[data-desktop-scene] .section-light .gear {background:#eef2f8}
}