/* Astrolinia Engine — cosmic promotional panel, imagery supplied by site owner. */
.ae-app--overview .ae-cosmic-promo{
  position:relative; isolation:isolate; box-sizing:border-box; flex:0 0 auto;
  min-height:clamp(210px,25dvh,245px);
  color:#fff5ef; border:1px solid rgba(221,169,198,.58); border-radius:19px;
  overflow:hidden;
  background-color:#301537;
  background-image:linear-gradient(90deg,rgba(32,12,45,.95) 0%,rgba(46,19,54,.86) 38%,rgba(48,23,61,.48) 67%,rgba(43,20,57,.10) 100%),
                   url("../img/engine-cosmic-guide-promo.7ca1ab84f65f.webp");
  background-size:cover,cover;
  background-position:center,58% 48%;
  background-repeat:no-repeat;
  box-shadow:0 8px 27px rgba(44,19,52,.3);
}
.ae-app--overview .ae-cosmic-promo__inner{
  position:relative; z-index:1; display:flex; flex-direction:column;
  align-items:flex-start; padding:clamp(12px,1.1vw,18px);
  min-height:inherit; box-sizing:border-box; gap:7px;
}
.ae-app--overview .ae-cosmic-promo__heading{
  display:flex; align-items:center; gap:9px;
}
.ae-app--overview .ae-cosmic-promo__heading img{
  object-fit:contain; width:36px; height:36px;
  filter:brightness(0) saturate(100%) invert(84%) sepia(29%) saturate(603%) hue-rotate(335deg) brightness(106%);
}
.ae-app--overview .ae-cosmic-promo h2{
  font:normal clamp(17px,1.28vw,21px)/1.1 Georgia,serif;
  color:#fff4e9; margin:0;
}
.ae-app--overview .ae-cosmic-promo p{
  font:clamp(11px,.85vw,12px)/1.37 Georgia,serif;
  color:#f6e3f0; max-width:64%; margin:1px 0 0;
}
.ae-app--overview .ae-cosmic-promo__action{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:8px 12px; margin-top:2px; text-decoration:none; white-space:nowrap;
  border:1px solid rgba(245,198,224,.82); border-radius:22px;
  background:rgba(63,20,61,.76); color:#fff9ef;
  font:clamp(10px,.8vw,12px)/1.2 Georgia,serif;
  transition:background-color .16s;
}
.ae-app--overview .ae-cosmic-promo__action:hover,
.ae-app--overview .ae-cosmic-promo__action:focus-visible{
  background:rgba(120,47,108,.92);
}
.ae-app--overview .ae-cosmic-promo blockquote{
  font:italic clamp(11px,.87vw,13px)/1.25 Georgia,serif;
  color:#f5dbe9; max-width:75%; margin:auto 0 0;
  text-shadow:0 1px 5px rgba(35,11,36,.5);
}
@media(min-width:701px) and (max-width:1320px){
  .ae-app--overview .ae-cosmic-promo{min-height:185px;}
  .ae-app--overview .ae-cosmic-promo__inner{padding:10px;gap:5px}
  .ae-app--overview .ae-cosmic-promo__heading img{width:27px;height:27px}
  .ae-app--overview .ae-cosmic-promo h2{font-size:15px}
  .ae-app--overview .ae-cosmic-promo p{font-size:10px;max-width:73%}
  .ae-app--overview .ae-cosmic-promo__action{font-size:9px;padding:6px 9px}
  .ae-app--overview .ae-cosmic-promo blockquote{font-size:10px}
}
@media(min-width:701px) and (max-height:760px){
  .ae-app--overview .ae-cosmic-promo{min-height:170px}
}
@media(max-width:700px){
  .ae-app--overview .ae-cosmic-promo{min-height:218px}
  .ae-app--overview .ae-cosmic-promo p{max-width:62%;font-size:12px}
}
@media(prefers-reduced-motion:reduce){.ae-cosmic-promo__action{transition:none!important}}

/* All desktop/tablet landscape layouts: save real space even if viewport
   height is >850px (the previous conditional never fired on tall monitors).
   The 12px top inset and mobile stack remain unchanged. */
@media(min-width:701px){
  .ae-app--overview .ae-right-rail{gap:7px}
  .ae-app--overview .ae-right-rail .ae-moon-now{
    padding:10px 12px 11px;
  }
  .ae-app--overview .ae-moon-now__glyph{width:34px;height:34px}
  .ae-app--overview .ae-moon-now__scene{
    min-height:clamp(78px,9.8dvh,105px);
  }
  .ae-app--overview .ae-moon-now__art{
    width:clamp(130px,12vw,162px);
    right:-10px;
  }
  .ae-app--overview .ae-moon-now__metrics p{margin-bottom:6px}
  .ae-app--overview .ae-moon-now__separator{margin:0 0 4px}
  .ae-app--overview .ae-moon-now__details p{margin-top:2px}
  .ae-app--overview .ae-upcoming{padding:10px 12px}
  .ae-app--overview .ae-upcoming__header{padding-bottom:7px}
  .ae-app--overview .ae-upcoming__event>a{
    min-height:clamp(39px,5dvh,55px);
    padding:3px 0;
  }
  .ae-app--overview .ae-upcoming__moon{max-width:40px}
  .ae-app--overview .ae-upcoming__date span,
  .ae-app--overview .ae-upcoming__description small{margin-top:2px}
  .ae-app--overview .ae-cosmic-promo{
    min-height:clamp(125px,calc(18dvh - 20px),165px);
  }
}
@media(min-width:701px) and (max-width:1059px){
  .ae-app--overview .ae-right-rail .ae-moon-now{padding:8px 10px 9px}
  .ae-app--overview .ae-moon-now__scene{min-height:76px}
  .ae-app--overview .ae-moon-now__art{width:120px;right:-8px}
  .ae-app--overview .ae-upcoming__event>a{min-height:40px}
  .ae-app--overview .ae-upcoming__moon{max-width:32px}
}
@media(min-width:701px) and (max-height:740px){
  .ae-app--overview .ae-right-rail{gap:6px}
  .ae-app--overview .ae-moon-now__scene{min-height:72px}
  .ae-app--overview .ae-cosmic-promo{min-height:125px}
}

/* Explicit desktop panel height (the earlier min-height alone allowed content
   to stretch the card back to its old size). Compact its internals to fit. */
@media(min-width:701px){
  .ae-app--overview .ae-cosmic-promo{
    height:clamp(145px,18dvh,165px);
    min-height:0;
  }
  .ae-app--overview .ae-cosmic-promo__inner{
    height:100%;min-height:0;
    padding:9px 12px;
    gap:3px;
  }
  .ae-app--overview .ae-cosmic-promo__heading{gap:7px}
  .ae-app--overview .ae-cosmic-promo__heading img{width:27px;height:27px}
  .ae-app--overview .ae-cosmic-promo h2{font-size:17px}
  .ae-app--overview .ae-cosmic-promo p{font-size:10px;line-height:1.22;max-width:75%;margin:0}
  .ae-app--overview .ae-cosmic-promo__action{padding:5px 10px;margin-top:0;font-size:10px}
  .ae-app--overview .ae-cosmic-promo blockquote{font-size:10px;line-height:1.17;max-width:84%}
}
@media(min-width:701px) and (max-height:740px){
  .ae-app--overview .ae-cosmic-promo{height:145px}
  .ae-app--overview .ae-cosmic-promo__inner{padding:7px 10px;gap:2px}
  .ae-app--overview .ae-cosmic-promo h2{font-size:15px}
  .ae-app--overview .ae-cosmic-promo__action{padding:4px 8px}
}
