/* A quiet sky around the controls. All movement stays on the shared CSS clock. */
.sky-constellation {
  position: absolute;
  display: block;
  overflow: visible;
  pointer-events: none;
  color: oklch(83% .025 225);
  opacity: .58;
}
.sky-constellation-taurus {
  width: clamp(154px,30vw,248px);
  height: auto;
  left: max(10px,env(safe-area-inset-left,0px));
  bottom: max(16px,env(safe-area-inset-bottom,0px));
}
.sky-constellation-cassiopeia {
  width: clamp(108px,21vw,184px);
  height: auto;
  right: max(8px,env(safe-area-inset-right,0px));
  top: max(142px,calc(env(safe-area-inset-top,0px) + 112px));
  opacity: .34;
}
.sky-constellation-lines {
  fill: none;
  stroke: currentColor;
  stroke-width: .65;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  opacity: .3;
}
.sky-constellation-star {
  fill: currentColor;
  opacity: .62;
  animation: sky-constellation-glimmer var(--star-duration,10s) ease-in-out var(--star-delay,0s) infinite alternate;
  animation-play-state: paused;
}
.sky-constellation-star-warm { color: oklch(87% .067 62); }
.sky-constellation-halo { opacity: .075; }
.sky-constellation-cluster { opacity: .7; }
.session-screen[data-motion='running']:not(.dim-night) .sky-constellation-star { animation-play-state: running; }
@keyframes sky-constellation-glimmer {
  from { opacity: .4; }
  to { opacity: .95; }
}
@media (max-height:520px) {
  .sky-constellation-taurus { width: 132px; }
  .sky-constellation-cassiopeia { top: 96px; width: 96px; }
}
@media (prefers-reduced-motion:reduce) {
  .sky-constellation-star { animation: none !important; opacity: .62; }
}
@media (forced-colors:active) {
  .sky-constellation { display: none; }
}

/* Dim is an optional low-luminance view, not a system brightness setting.
   Individual colours preserve legibility; a parent opacity would dim focus,
   warnings and the wake-up controls indiscriminately. */
@media (forced-colors:none) {
  .session-screen.dim-night,
  .night-ambience-dialog.dim-night {
    --bg: #000;
    --surface: oklch(10% .004 245);
    --surface-raised: oklch(14% .006 245);
    --ink: oklch(70% .012 150);
    --muted: oklch(62% .01 220);
    --subtle: oklch(62% .01 220);
    --sage: oklch(70% .025 155);
    --sage-ink: var(--bg);
    --peach: oklch(73% .035 75);
    --aube: var(--peach);
    --aube-ink: var(--bg);
    --line: oklch(62% .012 220 / .28);
    color: var(--ink);
    background: var(--bg);
    background-image: none;
    box-shadow: none;
    text-shadow: none;
  }
  .session-screen.dim-night .night-sky,
  .session-screen.dim-night .dawn-art-night,
  .session-screen.dim-night .breathing-orbit { visibility: hidden; opacity: 0; }
  .session-screen.dim-night *,
  .session-screen.dim-night *::before,
  .session-screen.dim-night *::after,
  .night-ambience-dialog.dim-night *,
  .night-ambience-dialog.dim-night *::before,
  .night-ambience-dialog.dim-night *::after {
    animation-play-state: paused !important;
    transition: none !important;
  }
  .session-screen.dim-night .session-content { opacity: 1; }
  .session-screen.dim-night .session-top .brand,
  .session-screen.dim-night .session-top .brand svg,
  .session-screen.dim-night .session-now .session-clock { color: var(--muted); }
  .session-screen.dim-night .session-content .night-target-time { color: var(--peach); text-shadow: none; }
  .session-screen.dim-night .session-actions button,
  .session-screen.dim-night .session-utilities,
  .session-screen.dim-night .night-ambience-controls button,
  .session-screen.dim-night .night-tracking-actions button,
  .session-screen.dim-night .night-edit-confirm,
  .session-screen.dim-night .night-edit-confirm button,
  .session-screen.dim-night .small-pill,
  .session-screen.dim-night .experiment-label,
  .night-ambience-dialog.dim-night button,
  .night-ambience-dialog.dim-night select {
    background: transparent;
    color: var(--ink);
    border-color: var(--line);
    box-shadow: none;
    text-shadow: none;
  }
  .session-screen.dim-night .session-actions .session-stop { border: 1px solid var(--line); }
  .session-screen.dim-night .session-utilities { border-color: transparent; }
  .session-screen.dim-night .session-actions button:hover,
  .session-screen.dim-night .night-ambience-controls button:hover,
  .night-ambience-dialog.dim-night button:hover:not(:disabled) { background: oklch(18% .006 245 / .45); }
  .session-screen.dim-night [data-action='dim-night'],
  .session-screen.dim-night [data-action='stop-night-ambience'],
  .night-ambience-dialog.dim-night [data-action='stop-night-ambience'] { color: var(--sage); }
  .session-screen.dim-night :focus-visible,
  .night-ambience-dialog.dim-night :focus-visible { outline: 2px solid var(--sage); outline-offset: 4px; }
  .night-ambience-dialog.dim-night {
    background: oklch(9% .004 245);
    border-color: var(--line);
    animation: none;
  }
  .night-ambience-dialog.dim-night::backdrop { background: rgb(0 0 0 / .9); }
  .night-ambience-dialog.dim-night .night-ambience-choice[aria-pressed='true'] {
    background: oklch(17% .012 155 / .45);
    color: var(--sage);
  }
  .night-ambience-dialog.dim-night img { opacity: .38; }
  .session-screen.dim-night [role='alert'],
  .night-ambience-dialog.dim-night [role='alert'] {
    color: oklch(78% .045 65);
    background: oklch(14% .012 65 / .6);
    border: 1px solid oklch(72% .04 65 / .4);
    border-radius: 12px;
    padding: .75rem;
  }
  /* The sound-recovery action and a sounding alarm keep a clear priority. */
  .session-screen.dim-night .session-actions [data-action='retry-audio'],
  .session-screen.dim-night.waking .session-actions [data-action='end-session'],
  .session-screen.dim-night.waking .session-actions [data-action='snooze'] {
    color: oklch(82% .045 75);
    border: 1px solid oklch(72% .04 65 / .55);
    background: oklch(14% .012 65 / .45);
  }
  .session-screen.dim-night.waking .night-target-time,
  .session-screen.dim-night .session-subtitle { color: oklch(77% .025 75); }
}
@media (prefers-contrast:more) and (forced-colors:none) {
  .session-screen.dim-night,.night-ambience-dialog.dim-night {
    --ink: oklch(84% .01 150);
    --muted: oklch(78% .01 220);
    --subtle: var(--muted);
    --sage: oklch(85% .025 155);
    --peach: oklch(85% .035 75);
    --line: oklch(75% .01 220 / .65);
  }
}
