/* The era material becomes a filmed universe; objects appear only in close view. */
#stellar-wave[data-hero-immersive="true"] {
  --immersion-white: #e8ece9;
  --immersion-accent: var(--immersion-light, #acc8c1);
}
#stellar-wave[data-hero-immersive="true"] .sw-culture-host {
  transition: opacity .65s ease;
}
#stellar-wave[data-hero-immersive="true"][data-hero-artifact-open="false"] .sw-culture-host {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#stellar-wave[data-hero-immersive="true"][data-hero-artifact-open="true"] .sw-culture-host {
  opacity: 1;
  visibility: visible;
}
#stellar-wave[data-hero-immersive="true"] .sh-cosmos {
  transition: filter .65s ease;
}
#stellar-wave[data-hero-immersive="true"] .sh-cosmos .era-cinema-shade {
  background: linear-gradient(90deg, #02090cc4, #02090c70 29%, #02090c08 60%),
    linear-gradient(0deg, #02090fe8, transparent 30%),
    linear-gradient(180deg, #02090fa3, transparent 18%);
}
#stellar-wave[data-hero-immersive="true"] .sh-copy {
  top: 30%;
  left: 6.5%;
  max-width: 43%;
}
#stellar-wave[data-hero-immersive="true"] .sh-copy h1 {
  font-size: clamp(44px, 5.3vw, 82px);
  line-height: 1.45;
  letter-spacing: .045em;
  color: var(--immersion-white);
  font-weight: 300;
}
#stellar-wave[data-hero-immersive="true"] .sh-sky-name {
  margin: 8px 0 18px;
  color: var(--immersion-accent);
  font-size: 11px;
  letter-spacing: .24em;
}
#stellar-wave[data-hero-immersive="true"] .sh-era {
  font-size: 12px;
  letter-spacing: .13em;
}
#stellar-wave[data-hero-immersive="true"] .sh-intro {
  margin: 20px 0 30px;
  font-size: clamp(14px, 1.12vw, 18px);
  line-height: 2;
  letter-spacing: .065em;
  color: #c1d0cb;
}
#stellar-wave[data-hero-immersive="true"] .sh-inspect {
  min-width: 146px;
  border-color: color-mix(in srgb, var(--immersion-accent) 36%, transparent);
  color: var(--immersion-white);
  background: #07191c55;
  font-size: 13px;
  padding: 11px 22px;
}
#stellar-wave[data-hero-immersive="true"] .sh-inspect:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--immersion-accent) 72%, transparent);
  background: #a6c8bd14;
}
#stellar-wave[data-hero-immersive="true"] .sh-evidence,
#stellar-wave[data-hero-immersive="true"][data-hero-artifact-open="false"] .sh-gesture {
  display: none;
}
#stellar-wave[data-hero-immersive="true"] .sh-story {
  display: block;
  min-width: 130px;
  max-width: 190px;
  min-height: 54px;
  padding: 8px 12px 8px 30px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, #04131ac4, #04131a7a);
  backdrop-filter: none;
  box-shadow: none;
  color: var(--immersion-white);
}
#stellar-wave[data-hero-immersive="true"] .sh-story::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 19px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #edf7ee;
  box-shadow: 0 0 0 4px #d2ece817, 0 0 14px #c2e6df8c;
}
#stellar-wave[data-hero-immersive="true"] .sh-story strong {
  font-size: 15px;
  letter-spacing: .12em;
}
#stellar-wave[data-hero-immersive="true"] .sh-story span {
  color: color-mix(in srgb, var(--immersion-accent) 65%, #e1e5e6);
  font-size: 11px;
  margin-top: 4px;
}
#stellar-wave[data-hero-immersive="true"] .sh-story:hover,
#stellar-wave[data-hero-immersive="true"] .sh-story:focus-visible {
  background: linear-gradient(90deg, #0d2a33d9, #0d2a3330);
  transform: translateY(-2px);
}
#stellar-wave[data-hero-immersive="true"] .sh-person { left: 54%; top: 28%; }
#stellar-wave[data-hero-immersive="true"] .sh-writing { right: 6%; top: 47%; }
#stellar-wave[data-hero-immersive="true"] .sh-ritual { right: 13%; top: 67%; }
#stellar-wave[data-hero-immersive="true"][data-hero-artifact-open="true"] .sh-cosmos {
  filter: brightness(.42) saturate(.72) blur(2px);
}
#stellar-wave[data-hero-immersive="true"][data-hero-artifact-open="true"] .sh-stories {
  visibility: hidden;
}
#stellar-wave[data-hero-immersive="true"] .sh-detail {
  border-radius: 6px;
  border-color: color-mix(in srgb, var(--immersion-accent) 22%, transparent);
  background: #071419eb;
}
#stellar-wave[data-hero-immersive="true"] .sh-time {
  background: linear-gradient(0deg, #02090edb, #02090e18);
}
#stellar-wave[data-hero-immersive="true"] .sw-top-controls {
  color: #dce7e2;
  text-shadow: 0 1px 8px #000;
}
@media (max-width: 700px) {
  #stellar-wave[data-hero-immersive="true"] .sh-cosmos .ch-hero-film {
    object-position: 70% center;
  }
  #stellar-wave[data-hero-immersive="true"] .sh-cosmos .era-cinema-shade {
    background: linear-gradient(0deg, #02090ff5, #02090fa6 32%, #02090f0a 65%),
      linear-gradient(180deg, #02090f99, transparent 18%);
  }
  #stellar-wave[data-hero-immersive="true"] .sh-copy {
    top: auto;
    left: 7%;
    bottom: 22%;
    max-width: 86%;
  }
  #stellar-wave[data-hero-immersive="true"] .sh-copy h1 { font-size: clamp(34px, 6.5vw, 46px); }
  #stellar-wave[data-hero-immersive="true"] .sh-era { font-size: 11px; }
  #stellar-wave[data-hero-immersive="true"] .sh-sky-name { font-size: 10px; margin: 7px 0 12px; }
  #stellar-wave[data-hero-immersive="true"] .sh-intro { font-size: 13px; margin: 12px 0 20px; line-height: 1.95; }
  #stellar-wave[data-hero-immersive="true"] .sh-story { min-width: 130px; padding: 8px 10px 8px 25px; }
  #stellar-wave[data-hero-immersive="true"] .sh-story::before { left: 5px; top: 18px; }
  #stellar-wave[data-hero-immersive="true"] .sh-story strong { font-size: 13px; }
  #stellar-wave[data-hero-immersive="true"] .sh-story span { display: block; font-size: 10px; }
  #stellar-wave[data-hero-immersive="true"] .sh-person { left: 8%; top: 18%; }
  #stellar-wave[data-hero-immersive="true"] .sh-writing { right: 6%; top: 29%; }
  #stellar-wave[data-hero-immersive="true"] .sh-ritual { right: 11%; top: 42%; }
}
@media (max-width: 420px) {
  #stellar-wave[data-hero-immersive="true"] .sh-copy { bottom: 23%; }
  #stellar-wave[data-hero-immersive="true"] .sh-copy h1 { font-size: clamp(31px, 9vw, 38px); }
  #stellar-wave[data-hero-immersive="true"] .sh-intro { font-size: 12px; letter-spacing: .02em; }
  #stellar-wave[data-hero-immersive="true"] .sh-actions { gap: 18px; }
  #stellar-wave[data-hero-immersive="true"] .sh-inspect { min-width: 132px; padding: 10px 17px; font-size: 12px; }
  #stellar-wave[data-hero-immersive="true"] .sh-browse { font-size: 11px; }
  #stellar-wave[data-hero-immersive="true"] .sh-story { min-width: 114px; max-width: 144px; }
  #stellar-wave[data-hero-immersive="true"] .sh-person { left: 7%; top: 16%; }
  #stellar-wave[data-hero-immersive="true"] .sh-writing { right: 3%; top: 26%; }
  #stellar-wave[data-hero-immersive="true"] .sh-ritual { right: 8%; top: 37%; }
}
@media (max-height: 580px) and (min-width: 701px) {
  #stellar-wave[data-hero-immersive="true"] .sh-copy { top: 21%; }
  #stellar-wave[data-hero-immersive="true"] .sh-copy h1 { font-size: 40px; }
  #stellar-wave[data-hero-immersive="true"] .sh-intro { margin: 10px 0 15px; font-size: 13px; }
  #stellar-wave[data-hero-immersive="true"] .sh-sky-name { margin-bottom: 8px; }
  #stellar-wave[data-hero-immersive="true"] .sh-person { top: 23%; }
  #stellar-wave[data-hero-immersive="true"] .sh-writing { top: 42%; }
  #stellar-wave[data-hero-immersive="true"] .sh-ritual { top: 62%; }
}
@media (max-height: 650px) and (max-width: 700px) {
  #stellar-wave[data-hero-immersive="true"] .sh-copy { bottom: 22%; }
  #stellar-wave[data-hero-immersive="true"] .sh-copy h1 { font-size: 31px; }
  #stellar-wave[data-hero-immersive="true"] .sh-intro { font-size: 12px; margin: 8px 0 12px; }
  #stellar-wave[data-hero-immersive="true"] .sh-sky-name { margin: 5px 0 8px; }
  #stellar-wave[data-hero-immersive="true"] .sh-person { top: 15%; }
  #stellar-wave[data-hero-immersive="true"] .sh-writing { top: 24%; }
  #stellar-wave[data-hero-immersive="true"] .sh-ritual { top: 35%; }
}
@media (max-height: 760px) and (max-width: 420px) {
  #stellar-wave[data-hero-immersive="true"] .sh-story { min-height: 44px; padding-block: 6px; }
  #stellar-wave[data-hero-immersive="true"] .sh-story span { display: none; }
  #stellar-wave[data-hero-immersive="true"] .sh-person { top: 11%; }
  #stellar-wave[data-hero-immersive="true"] .sh-writing { top: 20%; }
  #stellar-wave[data-hero-immersive="true"] .sh-ritual { top: 29%; }
}
@media (prefers-reduced-motion: reduce) {
  #stellar-wave[data-hero-immersive="true"] :is(.sh-cosmos, .sw-culture-host) { transition: none; }
}
