/* Beyond the Sky — shared atmosphere presentation v148 */

.sound-dot { width:.42rem; height:.42rem; border-radius:50%; background:#7c8387; transition:background .25s,box-shadow .25s; }
.sound-toggle.is-playing { color:#dce1df; }
.sound-toggle.is-playing .sound-dot { background:#bfe2ff; box-shadow:0 0 .8rem rgba(191,226,255,.55); }

body.is-daylight .rain-atmosphere,
body.is-daylight .ambient-controls .rain-toggle {
  display:none!important;
}

.rain-atmosphere {
  position:fixed;
  inset:0;
  z-index:72;
  overflow:hidden;
  pointer-events:none;
  opacity:1;
  transition:opacity 1s cubic-bezier(.22,.61,.36,1);
  contain:strict;
}
.rain-atmosphere.is-off {
  opacity:0;
}
.rain-canvas,
.lens-rain {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.rain-canvas {
  display:block;
  opacity:.7;
  mix-blend-mode:screen;
}
body.is-daylight .rain-canvas {
  opacity:.42;
  mix-blend-mode:multiply;
}
.lens-rain {
  z-index:2;
  overflow:hidden;
}
.lens-drop {
  position:absolute;
  left:var(--drop-x);
  top:var(--drop-y);
  width:var(--drop-size);
  aspect-ratio:.92;
  border-radius:50%;
  opacity:0;
  overflow:visible;
  background:transparent;
  border:0;
  box-shadow:none;
  -webkit-mask-image:radial-gradient(ellipse at 48% 50%,rgba(0,0,0,.76) 0%,rgba(0,0,0,.58) 21%,rgba(0,0,0,.34) 45%,rgba(0,0,0,.15) 66%,rgba(0,0,0,.05) 82%,transparent 100%);
  mask-image:radial-gradient(ellipse at 48% 50%,rgba(0,0,0,.76) 0%,rgba(0,0,0,.58) 21%,rgba(0,0,0,.34) 45%,rgba(0,0,0,.15) 66%,rgba(0,0,0,.05) 82%,transparent 100%);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  backdrop-filter:blur(34px) saturate(.86);
  -webkit-backdrop-filter:blur(34px) saturate(.86);
  filter:none;
  will-change:transform,opacity;
  animation:lensDropFallV40 var(--drop-life) cubic-bezier(.28,.04,.24,1) both;
}
.lens-drop::after {
  content:none;
}
body.is-daylight .lens-drop {
  background:transparent;
  box-shadow:none;
  backdrop-filter:blur(32px) saturate(.9);
  -webkit-backdrop-filter:blur(32px) saturate(.9);
  filter:none;
}
@keyframes lensDropFallV40 {
  0% {
    opacity:0;
    transform:translate3d(0,-.7rem,0) scale(.9,.84);
  }
  14% {
    opacity:var(--drop-opacity);
    transform:translate3d(0,0,0) scale(1);
  }
  58% {
    opacity:var(--drop-opacity);
    transform:translate3d(var(--drop-drift),var(--drop-travel-mid),0) scale(.98,1.04);
  }
  100% {
    opacity:0;
    transform:translate3d(var(--drop-drift-end),var(--drop-travel),0) scale(.82,1.13);
  }
}

.ambient-controls {
  position:fixed;
  z-index:90;
  right:var(--pad);
  bottom:6rem;
  display:flex;
  align-items:center;
  gap:.55rem;
}
.ambient-controls .sound-toggle,
.ambient-controls .rain-toggle {
  position:relative;
  inset:auto;
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  min-height:2.15rem;
  margin:0;
  padding:.62rem .9rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(8,10,11,.54);
  color:#a8adaf;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-family:Inter,system-ui,sans-serif;
  font-size:.56rem;
  line-height:1;
  cursor:pointer;
  transition:color .25s,border-color .25s,background .35s,opacity .35s;
}
.ambient-controls .sound-toggle:hover,
.ambient-controls .rain-toggle:hover {
  color:#f1f2ef;
  border-color:rgba(255,255,255,.25);
}
.rain-mark {
  display:inline-flex;
  align-items:center;
  gap:2px;
  width:.62rem;
  height:.68rem;
  transform:skewX(-11deg);
}
.rain-mark i {
  display:block;
  width:1px;
  height:.42rem;
  border-radius:999px;
  background:#bfe2ff;
  box-shadow:0 0 .45rem rgba(191,226,255,.28);
  opacity:.82;
  transition:height .3s,opacity .3s,background .3s;
}
.rain-mark i:nth-child(2) {
  height:.64rem;
  opacity:1;
}
.rain-toggle:not(.is-active) .rain-mark i {
  height:.2rem;
  background:#7c8387;
  box-shadow:none;
  opacity:.56;
}
body.is-daylight .ambient-controls .sound-toggle,
body.is-daylight .ambient-controls .rain-toggle {
  background:rgba(242,239,232,.72);
  color:#505551;
  border-color:rgba(24,27,25,.15);
}
body.is-daylight .ambient-controls .sound-toggle:hover,
body.is-daylight .ambient-controls .rain-toggle:hover {
  color:#171a18;
  border-color:rgba(24,27,25,.3);
}
body.is-daylight .rain-mark i {
  background:#72828a;
  box-shadow:0 0 .4rem rgba(90,112,122,.2);
}
body.is-flipping .ambient-controls {
  pointer-events:none;
}

@media (max-width:760px) {
  .entry-reveal-title {
    font-size:.78rem;
    letter-spacing:.32em;
    text-indent:0;
  }
  .rain-atmosphere {
    opacity:.72;
  }
  .ambient-controls {
    right:auto;
    left:var(--pad);
    bottom:4.2rem;
    gap:.4rem;
  }
  .ambient-controls .sound-toggle,
  .ambient-controls .rain-toggle {
    gap:.52rem;
    min-height:2rem;
    padding:.56rem .72rem;
    font-size:.5rem;
    letter-spacing:.13em;
  }
}

@media (prefers-reduced-motion:reduce) {
  html.entry-pending,
  html.entry-pending body {
    overflow:auto;
  }
  .entry-reveal {
    display:none!important;
  }
}

/* v56 — interactive procedural lightning */
.lightning-atmosphere {
  position:fixed;
  inset:0;
  z-index:84;
  overflow:hidden;
  pointer-events:none;
  mix-blend-mode:screen;
  contain:strict;
}
.lightning-canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  pointer-events:none;
}
.ambient-controls .lightning-toggle {
  position:relative;
  inset:auto;
  display:inline-grid;
  place-items:center;
  width:2.15rem;
  min-width:2.15rem;
  height:2.15rem;
  min-height:2.15rem;
  margin:0;
  padding:0;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(8,10,11,.54);
  color:#a8adaf;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  cursor:pointer;
  transition:color .2s,border-color .2s,background .35s,transform .14s,box-shadow .2s;
}
.lightning-icon {
  width:.82rem;
  height:.82rem;
  fill:currentColor;
  filter:drop-shadow(0 0 0 rgba(191,226,255,0));
  transition:filter .2s,color .2s,transform .14s;
}
.ambient-controls .lightning-toggle:hover {
  color:#edf7ff;
  border-color:rgba(205,231,255,.33);
  box-shadow:0 0 1.05rem rgba(164,207,244,.08);
}
.ambient-controls .lightning-toggle:hover .lightning-icon {
  filter:drop-shadow(0 0 .34rem rgba(191,226,255,.54));
}
.ambient-controls .lightning-toggle:active {
  transform:scale(.91);
  color:#fff;
  border-color:rgba(222,240,255,.48);
}
body.is-daylight .lightning-atmosphere,
body.is-daylight .ambient-controls .lightning-toggle {
  display:none!important;
}
body.is-flipping .ambient-controls .lightning-toggle {
  pointer-events:none;
}
@media (max-width:760px) {
  .ambient-controls .lightning-toggle {
    width:2rem;
    min-width:2rem;
    height:2rem;
    min-height:2rem;
  }
  .lightning-icon { width:.75rem; height:.75rem; }
}
@media (prefers-reduced-motion:reduce) {
  body:not(.atmosphere-motion-opt-in) .lightning-atmosphere { display:none!important; }
}


/* v60 — keep all atmosphere controls inside the universe-transition scene blur */
body.is-flipping .ambient-controls {
  filter:blur(var(--scene-blur));
  will-change:filter;
}
body.is-flipping .ambient-controls .sound-toggle,
body.is-flipping .ambient-controls .rain-toggle,
body.is-flipping .ambient-controls .lightning-toggle {
  filter:none!important;
  will-change:auto;
}

/* v73 — clearer first-discovery cue for ambient sound */
.sound-toggle.is-sound-undiscovered {
  position:relative;
  animation:btsSoundButtonBreath 3.35s cubic-bezier(.4,0,.2,1) .8s infinite;
}
.sound-toggle.is-sound-undiscovered::after {
  content:"";
  position:absolute;
  inset:-.28rem;
  border:1px solid rgba(191,226,255,.42);
  border-radius:inherit;
  box-shadow:0 0 1.4rem rgba(191,226,255,.11);
  pointer-events:none;
  opacity:.12;
  transform:scale(.985);
  animation:btsSoundDiscoveryBreath 3.35s cubic-bezier(.4,0,.2,1) .8s infinite;
}
.sound-toggle.is-sound-undiscovered .sound-dot {
  animation:btsSoundDiscoveryDot 3.35s cubic-bezier(.4,0,.2,1) .8s infinite;
}
body.is-daylight .sound-toggle.is-sound-undiscovered::after {
  border-color:rgba(238,249,255,.54);
  box-shadow:0 0 1.45rem rgba(215,240,252,.16);
}
@keyframes btsSoundButtonBreath {
  0%,100% { box-shadow:0 .35rem 1.7rem rgba(0,0,0,.10),0 0 0 rgba(191,226,255,0); }
  46% { box-shadow:0 .35rem 1.7rem rgba(0,0,0,.10),0 0 1.35rem rgba(191,226,255,.20); }
  64% { box-shadow:0 .35rem 1.7rem rgba(0,0,0,.10),0 0 .45rem rgba(191,226,255,.07); }
}
@keyframes btsSoundDiscoveryBreath {
  0%,100% { opacity:.10; transform:scale(.985); }
  46% { opacity:.78; transform:scale(1.07); }
  64% { opacity:.24; transform:scale(1.022); }
}
@keyframes btsSoundDiscoveryDot {
  0%,100% { transform:scale(1); box-shadow:0 0 0 rgba(191,226,255,0); }
  46% { transform:scale(1.22); box-shadow:0 0 .88rem rgba(191,226,255,.50); }
  64% { transform:scale(1.05); box-shadow:0 0 .24rem rgba(191,226,255,.11); }
}
@media (prefers-reduced-motion:reduce) {
  .sound-toggle.is-sound-undiscovered::after,
  .sound-toggle.is-sound-undiscovered .sound-dot { animation:none!important; }
  .sound-toggle.is-sound-undiscovered { animation:none!important; box-shadow:0 .35rem 1.7rem rgba(0,0,0,.10),0 0 1rem rgba(191,226,255,.18); }
  .sound-toggle.is-sound-undiscovered::after { opacity:.48; transform:scale(1.035); }
  .sound-toggle.is-sound-undiscovered .sound-dot { box-shadow:0 0 .65rem rgba(191,226,255,.42); }
}

/* v78 — a lighter Daylight control and a clearly readable sound prompt */
body.is-daylight .ambient-controls .sound-toggle {
  background:rgba(245,243,237,.78)!important;
  color:#303735!important;
  border-color:rgba(31,40,39,.18)!important;
  box-shadow:0 .35rem 1.4rem rgba(20,28,28,.10);
  backdrop-filter:blur(16px) saturate(.92);
  -webkit-backdrop-filter:blur(16px) saturate(.92);
}
body.is-daylight .ambient-controls .sound-toggle .sound-label {
  color:inherit!important;
}
body.is-daylight .ambient-controls .sound-toggle:hover {
  background:rgba(249,247,242,.94)!important;
  color:#171c1a!important;
  border-color:rgba(31,40,39,.30)!important;
}
body.is-daylight .ambient-controls .sound-toggle .sound-dot {
  background:#738086;
  border-color:transparent;
}
body.is-daylight .ambient-controls .sound-toggle.is-playing .sound-dot {
  background:#547889;
  box-shadow:0 0 .72rem rgba(75,119,139,.38);
}
body.is-daylight .sound-toggle.is-sound-undiscovered::after {
  border-color:rgba(245,252,255,.82);
  box-shadow:0 0 1.45rem rgba(225,244,252,.42);
}
body.is-daylight .sound-toggle.is-sound-undiscovered {
  animation-name:btsDaylightSoundButtonBreath;
}
@keyframes btsDaylightSoundButtonBreath {
  0%,100% { box-shadow:0 0 0 rgba(225,244,252,0); }
  46% { box-shadow:0 0 1.6rem rgba(225,244,252,.68); }
  64% { box-shadow:0 0 .58rem rgba(225,244,252,.22); }
}
@media (prefers-reduced-motion:reduce) {
  body.is-daylight .sound-toggle.is-sound-undiscovered { box-shadow:0 0 1.15rem rgba(225,244,252,.58)!important; }
  body.is-daylight .sound-toggle.is-sound-undiscovered::after { border-color:rgba(245,252,255,.82); box-shadow:0 0 1.25rem rgba(225,244,252,.38); }
}

@media (max-width:760px) {
.ambient-controls {
    right:auto;
    bottom:calc(env(safe-area-inset-bottom,0px) + 5.15rem);
    left:var(--pad);
    max-width:calc(100vw - (var(--pad) * 2));
    gap:.42rem;
  }
  .ambient-controls .sound-toggle,
  .ambient-controls .rain-toggle,
  .ambient-controls .lightning-toggle {
    flex:0 0 auto;
  }
  .ambient-controls .sound-toggle,
  .ambient-controls .rain-toggle {
    min-height:2.2rem;
    padding:.6rem .76rem;
  }
  .ambient-controls .lightning-toggle {
    width:2.2rem;
    height:2.2rem;
  }
}

@media (max-width:380px) {
.ambient-controls {
    gap:.3rem;
  }
  .ambient-controls .sound-toggle,
  .ambient-controls .rain-toggle {
    gap:.42rem;
    padding:.56rem .62rem;
    letter-spacing:.1em;
  }
}