/* Księżyc · same editorial structure as Słońce i dzień.
   Cosmic background and moving orbits come from engine-unified-sky.css. */
.ae-lunar{display:grid;grid-template-columns:minmax(0,44%) minmax(0,56%);gap:12px;min-width:0;min-height:0}
.ae-lunar__information{display:flex;flex-direction:column;gap:11px;min-width:0;min-height:0;padding:clamp(10px,.9vw,17px);border:1px solid #e5d0dd;border-radius:12px;background:rgba(255,252,254,.77);backdrop-filter:blur(8px)}
.ae-lunar__intro{align-items:flex-start;gap:9px;flex:0 0 auto}
.ae-lunar__intro .ae-sky-atlas__intro-copy{min-width:0}
.ae-lunar__intro p:not(.ae-sky-atlas__eyebrow){font-size:11px;max-width:310px}
.ae-lunar__snapshot{flex:0 1 192px;max-width:52%;min-width:125px;white-space:normal}
.ae-lunar__snapshot>small{overflow-wrap:anywhere}
.ae-lunar__card{background:rgba(255,255,255,.78);border:1px solid rgba(201,162,183,.48);border-radius:11px;padding:11px 13px}
.ae-lunar__card h3,.ae-lunar__visual-card h3{font:normal clamp(17px,1.17vw,21px)/1.2 Georgia,serif;color:#693552;margin:0 0 9px}
.ae-lunar__phase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ae-lunar__phase>div{display:flex;flex-direction:column;gap:5px;min-width:0;background:linear-gradient(130deg,#fdf7fb,#f6e8f1);border:1px solid #efdce6;border-radius:8px;padding:10px}
.ae-lunar__phase small,.ae-lunar__position small{color:#825d73;font:11px/1.3 "Segoe UI",sans-serif}
.ae-lunar__phase strong{font:normal clamp(19px,1.55vw,27px)/1.13 Georgia,serif;color:#642749;overflow-wrap:anywhere}
.ae-lunar__light-track{height:10px;background:#e5d2df;overflow:hidden;border-radius:20px;margin:12px 0 7px}
.ae-lunar__light-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#905081,#e3a9d2)}
.ae-lunar__explain{font:11px/1.48 "Segoe UI",sans-serif;color:#735268;margin:9px 0 0}
.ae-lunar__position{display:flex;align-items:center;gap:10px;min-width:0}
.ae-lunar__position img{object-fit:contain;flex:none}
.ae-lunar__position strong{display:block;font:normal 18px/1.25 Georgia,serif;color:#642749}
.ae-lunar__symbolism{margin-top:10px;padding:10px 12px;background:#fbf1f6;border-left:2px solid #d2a5bf;border-radius:7px}
.ae-lunar__symbolism strong{font:700 11px "Segoe UI",sans-serif;color:#70365b}
.ae-lunar__symbolism p{font:11px/1.45 "Segoe UI",sans-serif;color:#735268;margin:5px 0 0}
.ae-lunar__visual{min-height:0;position:relative;display:flex;flex-direction:column;gap:12px;padding:clamp(12px,1.3vw,23px);border:1px solid #663354;border-radius:12px;color:#ffe9dc;overflow-x:hidden;overflow-y:auto;box-shadow:inset 0 0 35px #24092866}
.ae-lunar__sky{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;position:relative;min-height:clamp(230px,34dvh,365px);flex:0 0 auto;isolation:isolate;z-index:1}
.ae-lunar__moon-art{display:block;max-width:min(65%,285px);width:clamp(155px,23dvh,250px);height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 0 26px rgba(230,195,239,.55));animation:ae-lunar-pulse 10s ease-in-out infinite alternate}
@keyframes ae-lunar-pulse{from{filter:drop-shadow(0 0 13px rgba(230,195,239,.28))}to{filter:drop-shadow(0 0 32px rgba(230,195,239,.65))}}
.ae-lunar__moon-caption{display:flex;align-items:center;flex-direction:column;text-align:center;gap:4px}
.ae-lunar__moon-caption span{font:800 10px "Segoe UI",sans-serif;letter-spacing:.1em;color:#e6b6d8}
.ae-lunar__moon-caption strong{font:normal clamp(22px,1.8vw,30px)/1.15 Georgia,serif;color:#ffe5c4}
.ae-lunar__moon-caption small{font:11px "Segoe UI",sans-serif;color:#e0b5d6}
.ae-lunar__visual-card{position:relative;z-index:2;flex:0 0 auto;padding:12px 14px;border:1px solid rgba(236,185,221,.4);background:rgba(43,18,57,.58);border-radius:10px}
.ae-lunar__visual-card h3{color:#ffdfc3}
.ae-lunar__visual-card h4{font:normal 16px Georgia,serif;color:#ffdfc3;margin:12px 0 6px}
.ae-lunar__facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ae-lunar__facts>div{padding:8px 9px;border:1px solid rgba(236,185,221,.2);background:rgba(35,13,52,.4);border-radius:7px}
.ae-lunar__facts small{display:block;font:10px/1.35 "Segoe UI",sans-serif;color:#dbb4d0}
.ae-lunar__facts strong{display:block;font:normal clamp(13px,.95vw,17px)/1.25 Georgia,serif;color:#fff2e8;margin-top:3px;overflow-wrap:anywhere}
.ae-lunar__visual-card p,.ae-lunar__source{font:11px/1.45 "Segoe UI",sans-serif;color:#ead2e6;margin:5px 0}
.ae-lunar__visual-card a{color:#f6ceab}
.ae-lunar__visual-card ul{padding:0;margin:0;list-style:none}
.ae-lunar__visual-card li{display:grid;grid-template-columns:90px minmax(0,1fr) 48px;gap:8px;align-items:center;padding:7px 0;border-top:1px solid #ae7ca044;font:11px/1.3 "Segoe UI",sans-serif}
.ae-lunar__visual-card li time{color:#d6aed0}.ae-lunar__visual-card li strong{font-weight:600}.ae-lunar__visual-card li span{text-align:right;color:#ffdfc3}
.ae-lunar__source{position:relative;z-index:2;margin-top:auto}
@media(min-width:1060px){.ae-lunar{height:100%;min-height:0}.ae-lunar__information{overflow-y:auto}.ae-lunar__visual{scrollbar-width:thin;scrollbar-color:#946589 transparent}}
@media(max-width:1260px){.ae-lunar__intro{flex-wrap:wrap}.ae-lunar__snapshot{flex:1 1 100%;max-width:100%;min-width:0}.ae-lunar__intro .ae-sky-atlas__intro-copy p:not(.ae-sky-atlas__eyebrow){max-width:none}}
@media(max-width:1059px){.ae-lunar{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.ae-lunar__visual{min-height:540px}}
@media(max-width:800px){.ae-lunar{grid-template-columns:1fr}.ae-lunar__visual{grid-row:1;min-height:420px}.ae-lunar__information{grid-row:2}}
@media(max-width:430px){.ae-lunar__phase,.ae-lunar__facts{grid-template-columns:1fr}.ae-lunar__visual-card li{grid-template-columns:75px minmax(0,1fr) 36px;gap:4px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.ae-lunar__moon-art{animation:none}}
@media(min-width:1450px) and (min-height:650px){.ae-app--lunar.ae-app--pro .ae-lunar__sky{min-height:clamp(150px,24dvh,240px)}.ae-app--lunar.ae-app--pro .ae-lunar__moon-art{width:clamp(105px,15dvh,175px)}.ae-app--lunar.ae-app--pro .ae-lunar__information{gap:8px;padding:10px 11px}.ae-app--lunar.ae-app--pro .ae-lunar__card{padding:9px 11px}.ae-app--lunar.ae-app--pro .ae-lunar__visual{gap:8px;padding:11px 13px}}


/* Give the phase photograph its own dark, quiet focal zone rather than
   allowing the detailed nebula backdrop to visually swallow the Moon.
   The original shared clouds and animated orbits stay in the outer panel. */
.ae-lunar__sky{
  isolation:isolate;
  min-height:clamp(275px,39dvh,400px);
  padding:12px 8px 8px;
  box-sizing:border-box;
}
.ae-lunar__sky::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:clamp(210px,30dvh,335px);
  height:clamp(210px,30dvh,335px);
  max-width:85%;
  aspect-ratio:1;
  left:50%;
  top:44%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle at 50% 47%,rgba(9,7,25,.98) 0%,rgba(20,10,38,.94) 48%,rgba(32,12,51,.72) 64%,rgba(40,16,56,.16) 79%,transparent 88%);
  box-shadow:0 0 45px rgba(7,5,25,.44);
  pointer-events:none;
}
.ae-lunar__moon-art{
  position:relative;
  z-index:1;
  width:clamp(190px,29dvh,300px);
  max-width:min(70%,300px);
  height:auto;
  flex:0 0 auto;
  object-fit:contain;
  opacity:1;
  filter:brightness(1.13) contrast(1.2) drop-shadow(0 0 18px rgba(248,230,255,.48));
  animation:ae-lunar-moon-glow 8s ease-in-out infinite alternate;
}
@keyframes ae-lunar-moon-glow{
  from{filter:brightness(1.09) contrast(1.18) drop-shadow(0 0 12px rgba(248,230,255,.36))}
  to{filter:brightness(1.17) contrast(1.23) drop-shadow(0 0 24px rgba(248,230,255,.62))}
}
.ae-lunar__moon-caption{position:relative;z-index:2;text-shadow:0 1px 6px rgba(9,5,25,.9)}
@media(min-width:1450px) and (min-height:650px){
  .ae-app--lunar.ae-app--pro .ae-lunar__sky{min-height:clamp(205px,27dvh,270px)}
  .ae-app--lunar.ae-app--pro .ae-lunar__sky::before{width:clamp(145px,19dvh,210px);height:clamp(145px,19dvh,210px)}
  .ae-app--lunar.ae-app--pro .ae-lunar__moon-art{width:clamp(145px,19dvh,205px);max-width:72%}
}
@media(prefers-reduced-motion:reduce){.ae-lunar__moon-art{animation:none}}

/* Lunar heading now inherits exactly the Solar instrument's title scale
   from engine-unified-sky.css. Match Solar metadata width and proportions. */
.ae-lunar__intro .ae-sky-atlas__intro-copy{flex:1 1 auto;min-width:0}
.ae-lunar__snapshot{flex:0 1 192px;max-width:52%;min-width:125px}
.ae-lunar__intro p:not(.ae-sky-atlas__eyebrow){max-width:300px;font-size:11px}

/* Until approved lunar imagery is available, leave the phase artwork slot
   empty: the shared cloud background and animated orbits remain visible. */
.ae-lunar__sky::before{display:none}
.ae-lunar__sky{
  min-height:clamp(150px,21dvh,215px);
  padding:12px 8px;
}
.ae-lunar__moon-caption strong{
  font:normal clamp(16px,1.14vw,20px)/1.18 Georgia,"Times New Roman",serif;
  max-width:100%;
  overflow-wrap:normal;
  text-wrap:balance;
}
@media(min-width:1450px) and (min-height:650px){
  .ae-app--lunar.ae-app--pro .ae-lunar__sky{
    min-height:clamp(125px,17dvh,175px);
  }
}

/* Compact long phase names specifically inside the left metric card.
   The generic two-column metric font used to cause a three-line title. */
.ae-lunar__phase-name strong{
  font:normal clamp(14px,1.05vw,18px)/1.16 Georgia,"Times New Roman",serif;
  letter-spacing:-.018em;
  overflow-wrap:normal;
  hyphens:none;
}

/* One document scroll area, not a scrollbar over the purple sky.
   The lunar canvas expands to fit Explorer and Pro data naturally. */
@media(min-width:1060px){
  .ae-app--lunar .ae-main{
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior-y:contain;
  }
  .ae-app--lunar .ae-lunar{
    height:auto;
    min-height:100%;
    align-items:start;
  }
  .ae-app--lunar .ae-lunar__visual{
    overflow:visible;
    height:auto;
    min-height:100%;
    gap:8px;
    padding:clamp(10px,.9vw,16px);
  }
  .ae-app--lunar .ae-lunar__sky{
    min-height:clamp(105px,15dvh,165px);
  }
}
@media(min-width:1060px) and (max-height:800px){
  .ae-app--lunar .ae-lunar__sky{min-height:95px}
  .ae-app--lunar .ae-lunar__visual-card{padding:9px 11px}
  .ae-app--lunar .ae-lunar__facts{gap:5px}
  .ae-app--lunar .ae-lunar__facts>div{padding:6px 8px}
}

/* Moon workspace geometry uses the same outer spacing as Sky & Planets.
   Previously Moon inherited the generic 19px top / 36px bottom padding,
   while Sky used 7px / 8px. That left a conspicuous empty strip above
   the Moon observatory and reduced the room for its data cards. */
@media(min-width:1060px) and (min-height:650px){
  .ae-app--lunar .ae-main{
    padding:7px clamp(9px,1.1vw,18px) 8px;
  }
  .ae-app--lunar .ae-lunar{
    width:100%;
    margin:0;
  }
  .ae-app--lunar .ae-lunar__information{
    padding:clamp(9px,.8vw,14px) clamp(10px,1vw,18px);
    gap:10px;
  }
}

/* Phase observatory: square night window, actual illuminated fraction. */
.ae-lunar__sky{min-height:0!important;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(12px,1.5vw,24px);padding:10px 4px!important}
.ae-lunar__phase-scene{position:relative;isolation:isolate;flex:0 0 auto;width:clamp(155px,18vw,225px);aspect-ratio:1;overflow:hidden;border:1px solid rgba(231,193,223,.34);border-radius:7px;background:#05040b;box-shadow:0 0 32px #08020d88,inset 0 0 30px #17101d}
.ae-lunar__phase-scene::before,.ae-lunar__phase-scene::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,#fff 0 1px,transparent 1.4px),radial-gradient(circle,#cbb4e8 0 .7px,transparent 1px);background-size:49px 61px,73px 83px;background-position:12px 7px,29px 35px;opacity:.42;animation:ae-lunar-stars 9s ease-in-out infinite alternate}
.ae-lunar__phase-scene::after{transform:scale(1.08);opacity:.18;animation-delay:-4s}
.ae-lunar__phase-svg{position:relative;z-index:1;display:block;width:100%;height:100%;filter:drop-shadow(0 0 9px #e6d9df55)}
.ae-lunar__moon-caption{flex:1 1 160px;max-width:290px;align-items:flex-start;text-align:left}
@keyframes ae-lunar-stars{from{opacity:.18}to{opacity:.52}}
@media(max-width:520px){.ae-lunar__moon-caption{align-items:center;text-align:center;flex-basis:100%}.ae-lunar__phase-scene{width:min(65vw,220px)}}
@media(prefers-reduced-motion:reduce){.ae-lunar__phase-scene::before,.ae-lunar__phase-scene::after{animation:none}}

/* Full Moon photograph is the source texture in both lighting layers.
   The foreground is clipped to the Engine-computed phase boundary. */
.ae-lunar__moon-dark{filter:brightness(.11) saturate(.6)}
.ae-lunar__moon-light{filter:brightness(1.05) contrast(1.08)}

/* Non-repeating points of light replace the regularly tiled star grid. */
.ae-lunar__phase-scene::before,.ae-lunar__phase-scene::after{background-size:auto;background-position:0 0;transform:none}
.ae-lunar__phase-scene::before{
background-image:radial-gradient(circle at 12% 17%,#fff 0 .8px,transparent 1.4px),radial-gradient(circle at 83% 13%,#d6c1ed 0 .7px,transparent 1.3px),radial-gradient(circle at 94% 52%,#fff 0 1px,transparent 1.6px),radial-gradient(circle at 11% 74%,#fff 0 .6px,transparent 1.2px),radial-gradient(circle at 29% 6%,#bca3d7 0 .6px,transparent 1.2px),radial-gradient(circle at 87% 87%,#e4d1fc 0 .7px,transparent 1.3px),radial-gradient(circle at 7% 41%,#d6c1ed 0 .8px,transparent 1.4px),radial-gradient(circle at 71% 96%,#fff 0 .5px,transparent 1.1px)}
.ae-lunar__phase-scene::after{
background-image:radial-gradient(circle at 6% 92%,#fff 0 .6px,transparent 1.2px),radial-gradient(circle at 96% 27%,#fff 0 .75px,transparent 1.3px),radial-gradient(circle at 77% 5%,#e1c4eb 0 .6px,transparent 1.2px),radial-gradient(circle at 19% 96%,#dcc3e6 0 .6px,transparent 1.2px),radial-gradient(circle at 92% 70%,#fff 0 .7px,transparent 1.3px),radial-gradient(circle at 3% 59%,#bda2ce 0 .6px,transparent 1.2px)}
.ae-lunar__moon-light{filter:none}
.ae-lunar__moon-dark{filter:brightness(.10) saturate(.7)}

/* Lunar refinement: readable shadow, feathered boundary in the SVG mask,
   and left alignment with the Observation card below. */
.ae-lunar__moon-dark{filter:brightness(.34) saturate(.85)}
.ae-lunar__sky{justify-content:flex-start;padding:10px 0!important}
@media(max-width:520px){.ae-lunar__sky{justify-content:center}}

/* Lunar observatory: larger translucent night window and a matching rhythm card. */
.ae-lunar__sky{
  display:grid;
  grid-template-columns:minmax(0, .98fr) minmax(0, 1fr);
  align-items:stretch;
  justify-content:stretch;
  gap:clamp(9px,1vw,15px);
  min-height:0!important;
  padding:8px 0 6px!important;
}
.ae-lunar__phase-scene{
  width:100%;
  max-width:none;
  min-width:0;
  height:auto;
  justify-self:stretch;
  align-self:start;
  aspect-ratio:1;
  background:rgba(5,4,11,.74);
}
.ae-lunar__rhythm{
  display:flex;
  flex-direction:column;
  min-width:0;
  gap:9px;
  padding:clamp(10px,1vw,15px);
}
.ae-lunar__rhythm h3{margin:0 0 3px}
.ae-lunar__rhythm-facts{display:grid;grid-template-columns:1fr;gap:7px}
.ae-lunar__rhythm-facts>div{
  padding:8px 10px;
  border:1px solid rgba(236,185,221,.2);
  background:rgba(35,13,52,.4);
  border-radius:7px;
  min-width:0;
}
.ae-lunar__rhythm-facts small{display:block;font:10px/1.35 "Segoe UI",sans-serif;color:#dbb4d0}
.ae-lunar__rhythm-facts strong{display:block;margin-top:3px;font:normal clamp(14px,1.1vw,18px)/1.2 Georgia,serif;color:#fff2e8;overflow-wrap:anywhere}
.ae-lunar__rhythm-explain{font:11px/1.45 "Segoe UI",sans-serif;color:#ead2e6;margin:2px 0 0}
@media(max-width:1250px) and (min-width:801px){
  .ae-lunar__sky{grid-template-columns:minmax(0, 1fr) minmax(0, 1fr)}
  .ae-lunar__rhythm{padding:9px}
  .ae-lunar__rhythm-facts>div{padding:6px 8px}
}
@media(max-width:580px){
  .ae-lunar__sky{grid-template-columns:minmax(0,1fr)}
  .ae-lunar__phase-scene{width:min(100%,300px);justify-self:center}
}

/* The shared Engine disclaimer is placed after the full-height lunar atlas.
   On desktop it creates an unnecessary extra scroll segment even when the
   actual Moon cards fit the viewport. Keep natural scrolling on smaller screens. */
@media (min-width:1060px){
  .ae-app--lunar .ae-main > .ae-disclaimer{display:none}
}

/* Fixed desktop viewport: avoid a feedback loop between the main scrollbar,
   percentage column widths + gutter, and the aspect-ratio Moon window.
   A real content overflow stays scrollable INSIDE the relevant column. */
@media (min-width:1060px){
  .ae-app--lunar .ae-main{
    display:flex;
    flex-direction:column;
    overflow:hidden;
    min-height:0;
  }
  .ae-app--lunar .ae-lunar{
    flex:1 1 auto;
    height:100%;
    min-height:0;
    width:100%;
    grid-template-columns:minmax(0,44fr) minmax(0,56fr);
    align-items:stretch;
  }
  .ae-app--lunar .ae-lunar__information{
    min-height:0;
    max-height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
  }
  .ae-app--lunar .ae-lunar__visual{
    height:100%;
    min-height:0;
    max-height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
  }
}

/* The purple sky panel needs no permanently visible scrollbar.
   Retain wheel/touch/keyboard scrolling if Pro content ever exceeds height. */
@media (min-width:1060px){
  .ae-app--lunar .ae-lunar__visual{
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  .ae-app--lunar .ae-lunar__visual::-webkit-scrollbar{
    display:none;
    width:0;
    height:0;
  }
}