.xionia-snowly{box-sizing:border-box;width:calc(100% - 28px);max-width:1152px;margin:2rem auto;padding:0;scroll-margin-top:1rem}
.xionia-snowly h2{line-height:1.35;overflow-wrap:anywhere}
.xionia-snowly p{max-width:75ch;margin:.8rem auto;line-height:1.6;text-align:start}
.xionia-snowly .xionia-snowly-frame{position:relative;box-sizing:border-box;width:100%;height:620px;height:clamp(480px,75svh,720px);overflow:hidden;border:1px solid #708299;border-radius:10px;background:#e8eff5}
html .xionia-legacy .xionia-snowly-frame>iframe{display:block;box-sizing:border-box;width:100%!important;max-width:none!important;height:100%!important;min-height:0!important;margin:0!important;border:0;aspect-ratio:auto}
.xionia-snowly-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;color:#18364f;pointer-events:none;padding:1rem;text-align:center}
.xionia-snowly-placeholder button{pointer-events:auto;font:inherit;padding:.7rem 1rem;min-height:44px;border:1px solid #496780;border-radius:8px;background:#fff;color:#18364f;cursor:pointer}
.xionia-snowly-placeholder button:focus-visible{outline:3px solid #1682db;outline-offset:3px}
.xionia-snowly-placeholder [hidden],.xionia-snowly-frame.is-loaded .xionia-snowly-placeholder{display:none}
.xionia-map-shortcuts{max-width:75ch;margin:1rem auto;line-height:1.7}
.xionia-map-shortcuts a{display:inline;text-underline-offset:.16em}
#rain-radar,#lightning-detection,#satellite-images{scroll-margin-top:1rem}
.xionia-meteox-view{box-sizing:border-box;width:calc(100% - 28px);max-width:800px;aspect-ratio:1;margin:24px auto;overflow:hidden}
html .xionia-legacy .xionia-meteox-view>iframe{display:block;box-sizing:border-box;width:100%!important;max-width:none!important;height:100%!important;min-height:0!important;aspect-ratio:auto;margin:0!important;border:0;pointer-events:none}
@media(max-width:600px){.xionia-snowly,.xionia-meteox-view{width:calc(100% - 16px)}.xionia-map-shortcuts{padding:0 8px}}
@media(orientation:landscape) and (max-height:540px){.xionia-snowly .xionia-snowly-frame{height:calc(100svh - 24px);min-height:240px}}

/* xionia-snowly-height-r1 */
html body .xionia-snowly .xionia-snowly-frame > .xn-map-frame:not(.xn-map-full) {
  box-sizing:border-box;width:100%;height:100%;min-height:0;margin:0;padding:0;
}
html body .xionia-snowly .xionia-snowly-frame > iframe:not([hidden]),
html body .xionia-snowly .xionia-snowly-frame > .xn-map-frame > iframe:not([hidden]) {
  display:block!important;box-sizing:border-box;width:100%!important;height:100%!important;
  min-height:0!important;max-height:none!important;max-width:none!important;
  margin:0!important;padding:0!important;border:0!important;aspect-ratio:auto!important;
}

/* v31.4.4: media stays in its own containing block, including inside main. */
body.xionia-satellite-page {
  --xionia-media-width: 1180px;
  --xionia-media-gutter: 0px;
}
html body.xionia-satellite-page > .xionia-weather-media,
html body.xionia-satellite-page > .xionia-snowly,
html body.xionia-legacy.xionia-satellite-page .xionia-legacy-main > .xionia-weather-media,
html body.xionia-legacy.xionia-satellite-page .xionia-legacy-main > .xionia-snowly {
  box-sizing: border-box;
  width: calc(100% - var(--xionia-media-gutter));
  max-width: var(--xionia-media-width);
  margin: 24px auto;
}
.xionia-weather-frame {
  position: relative;
  min-width: 0;
  overflow: hidden;
  height: clamp(360px, 75vh, 800px);
  height: clamp(360px, 75svh, 800px);
  background: #dce8f1;
}
html body.xionia-satellite-page .xionia-weather-frame > iframe {
  display: block;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0;
  aspect-ratio: auto;
}
html body.xionia-satellite-page .xionia-weather-image > img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: contain;
}
/* A passive map keeps one geographic viewport on every screen size. */
html body.xionia-satellite-page .xionia-passive-map {
  position: relative;
  height: auto;
  aspect-ratio: 6 / 5;
  overflow: hidden;
}
html body.xionia-satellite-page .xionia-passive-map.is-fitted > iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 1200px !important;
  height: 1000px !important;
  transform: scale(var(--xionia-passive-scale));
  transform-origin: top left;
  border-radius: 0;
  pointer-events: none;
}
@media (max-width: 600px) {
  body.xionia-satellite-page { --xionia-media-gutter: 0px; }
}
@media (orientation: landscape) and (max-height: 600px) {
  .xionia-satellite-page .xionia-weather-frame:not(.xionia-passive-map) {
    height: clamp(240px, 85vh, 540px);
    height: clamp(240px, 85svh, 540px);
  }
}

/* v33.9.22: fullscreen wrappers retain each satellite panel's dimensions.
   The legacy rules targeted direct iframe children; .xn-map-frame inserted
   by the fullscreen control must occupy that same sizing box. */
html body.xionia-satellite-page .xionia-weather-frame > .xn-map-frame:not(.xn-map-full),
html body.xionia-satellite-page .xionia-snowly-frame > .xn-map-frame:not(.xn-map-full) {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
html body.xionia-satellite-page .xionia-weather-frame > .xn-map-frame > iframe,
html body.xionia-satellite-page .xionia-snowly-frame > .xn-map-frame > iframe {
  display: block;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0;
  aspect-ratio: auto;
}
/* Keep Meteox's original 1200 x 1000 geographic view completely visible.
   Absolutely position the sizing wrapper, too, so its height does not depend
   on an empty, out-of-flow iframe. The fullscreen button remains unscaled. */
html body.xionia-satellite-page .xionia-passive-map.is-fitted > .xn-map-frame:not(.xn-map-full) {
  position: absolute;
  inset: 0;
}
html body.xionia-satellite-page .xionia-passive-map.is-fitted > .xn-map-frame:not(.xn-map-full) > iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 1200px !important;
  height: 1000px !important;
  transform: scale(var(--xionia-passive-scale));
  transform-origin: top left;
  border-radius: 0;
  pointer-events: none;
}
/* Fullscreen provides the provider with the available screen dimensions;
   do not retain the scaled inline preview or fixed-height HTML attributes. */
html body.xionia-satellite-page .xionia-passive-map.is-fitted > .xn-map-frame.xn-map-full > iframe {
  position: static;
  width: 100% !important;
  height: 100% !important;
  transform: none;
}

