/* ============================================================
   THE NIGHT SKY
   The backdrop for every page. Black was always the brand's ground
   colour; these layers turn that black into a sky without touching
   anything sitting on top of it.

   Three repeating SVG tiles stack into depth — fine dust at the
   back, brighter points in the middle, four-point sparkles in front
   — over two very faint brand-tinted washes so the black is never
   quite flat. One tile per layer costs a single decode, where the
   same star count written as radial-gradients would need dozens of
   them, and the tile widths (620 / 470 / 880) share no factors, so
   the repeats never line up into a grid the eye can catch.
   background-attachment holds the sky still while the page scrolls.

   Loaded LAST in the head on every page: custom.html, mission.html
   and popups.html still carry their own body background from before
   the shared chrome existed, and the sky has to win over those.
   ============================================================ */

body {
  background-color: #000;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='880' height='880'%3E%3Cg fill='%23fff'%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(658 781) scale(1.1)' opacity='.77'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(55 199) scale(.68)' opacity='.95'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(110 460) scale(.84)' opacity='.82'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(351 46) scale(.8)' opacity='.74' fill='%23f2ffd0'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(405 253) scale(1.03)' opacity='.86'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(64 799) scale(.87)' opacity='.9'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(855 802) scale(.87)' opacity='.89'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(609 146) scale(.83)' opacity='.91'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(279 658) scale(.99)' opacity='.95' fill='%23ffd9ec'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(833 600) scale(1.03)' opacity='.83'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(33 564) scale(.79)' opacity='.8'/%3E%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='470' height='470'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='99' cy='71' r='1.04' opacity='.67'/%3E%3Ccircle cx='182' cy='163' r='1.06' opacity='.69'/%3E%3Ccircle cx='116' cy='17' r='1.24' opacity='.6'/%3E%3Ccircle cx='288' cy='348' r='1.43' opacity='.74'/%3E%3Ccircle cx='327' cy='26' r='1.4' opacity='.84'/%3E%3Ccircle cx='355' cy='129' r='1.19' opacity='.63'/%3E%3Ccircle cx='134' cy='40' r='.89' opacity='.77'/%3E%3Ccircle cx='120' cy='163' r='.94' opacity='.69'/%3E%3Ccircle cx='294' cy='147' r='1.38' opacity='.81'/%3E%3Ccircle cx='291' cy='154' r='1.35' opacity='.75'/%3E%3Ccircle cx='383' cy='39' r='.9' opacity='.82'/%3E%3Ccircle cx='137' cy='17' r='1.3' opacity='.72'/%3E%3Ccircle cx='97' cy='77' r='1.21' opacity='.66'/%3E%3Ccircle cx='118' cy='300' r='1.2' opacity='.63'/%3E%3Ccircle cx='346' cy='259' r='1.13' opacity='.73'/%3E%3Ccircle cx='96' cy='414' r='.93' opacity='.85'/%3E%3Ccircle cx='142' cy='409' r='1.02' opacity='.82'/%3E%3Ccircle cx='404' cy='181' r='1.13' opacity='.72'/%3E%3Ccircle cx='420' cy='123' r='1.12' opacity='.65'/%3E%3Ccircle cx='172' cy='418' r='1.41' opacity='.74'/%3E%3Ccircle cx='182' cy='25' r='.91' opacity='.72'/%3E%3Ccircle cx='278' cy='209' r='1.19' opacity='.66'/%3E%3Ccircle cx='105' cy='469' r='1.22' opacity='.65'/%3E%3Ccircle cx='310' cy='194' r='1.12' opacity='.79'/%3E%3Ccircle cx='389' cy='277' r='1.39' opacity='.73'/%3E%3Ccircle cx='342' cy='404' r='1' opacity='.63'/%3E%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='620'%3E%3Cg fill='%23fff'%3E%3Ccircle cx='317' cy='329' r='.72' opacity='.46'/%3E%3Ccircle cx='527' cy='334' r='.49' opacity='.44'/%3E%3Ccircle cx='377' cy='279' r='.67' opacity='.53'/%3E%3Ccircle cx='260' cy='416' r='.76' opacity='.33'/%3E%3Ccircle cx='111' cy='171' r='.63' opacity='.39'/%3E%3Ccircle cx='361' cy='79' r='.72' opacity='.45'/%3E%3Ccircle cx='259' cy='523' r='.81' opacity='.51'/%3E%3Ccircle cx='197' cy='386' r='.56' opacity='.3'/%3E%3Ccircle cx='459' cy='606' r='.58' opacity='.32'/%3E%3Ccircle cx='461' cy='215' r='.7' opacity='.45'/%3E%3Ccircle cx='524' cy='89' r='.83' opacity='.53'/%3E%3Ccircle cx='239' cy='16' r='.48' opacity='.53'/%3E%3Ccircle cx='308' cy='326' r='.57' opacity='.43'/%3E%3Ccircle cx='455' cy='55' r='.74' opacity='.29'/%3E%3Ccircle cx='276' cy='394' r='.89' opacity='.41'/%3E%3Ccircle cx='289' cy='219' r='.47' opacity='.5'/%3E%3Ccircle cx='260' cy='471' r='.59' opacity='.45'/%3E%3Ccircle cx='216' cy='522' r='.52' opacity='.32'/%3E%3Ccircle cx='391' cy='387' r='.51' opacity='.39'/%3E%3Ccircle cx='234' cy='581' r='.83' opacity='.47'/%3E%3Ccircle cx='255' cy='570' r='.71' opacity='.41'/%3E%3Ccircle cx='191' cy='319' r='.45' opacity='.54'/%3E%3Ccircle cx='187' cy='253' r='.51' opacity='.3'/%3E%3Ccircle cx='462' cy='338' r='.68' opacity='.31'/%3E%3Ccircle cx='347' cy='386' r='.85' opacity='.57'/%3E%3Ccircle cx='371' cy='374' r='.71' opacity='.43'/%3E%3Ccircle cx='59' cy='404' r='.74' opacity='.58'/%3E%3Ccircle cx='441' cy='84' r='.51' opacity='.47'/%3E%3Ccircle cx='603' cy='213' r='.87' opacity='.39'/%3E%3Ccircle cx='472' cy='405' r='.48' opacity='.37'/%3E%3Ccircle cx='412' cy='305' r='.73' opacity='.35'/%3E%3Ccircle cx='445' cy='195' r='.49' opacity='.45'/%3E%3Ccircle cx='236' cy='112' r='.82' opacity='.56'/%3E%3Ccircle cx='465' cy='3' r='.64' opacity='.54'/%3E%3Ccircle cx='353' cy='434' r='.73' opacity='.28'/%3E%3Ccircle cx='308' cy='305' r='.52' opacity='.52'/%3E%3Ccircle cx='39' cy='53' r='.9' opacity='.46'/%3E%3Ccircle cx='436' cy='518' r='.86' opacity='.57'/%3E%3Ccircle cx='31' cy='104' r='.72' opacity='.4'/%3E%3Ccircle cx='259' cy='330' r='.47' opacity='.3'/%3E%3Ccircle cx='287' cy='168' r='.64' opacity='.5'/%3E%3Ccircle cx='257' cy='210' r='.71' opacity='.39'/%3E%3Ccircle cx='605' cy='184' r='.65' opacity='.35'/%3E%3Ccircle cx='424' cy='197' r='.7' opacity='.47'/%3E%3Ccircle cx='2' cy='81' r='.52' opacity='.53'/%3E%3Ccircle cx='84' cy='506' r='.54' opacity='.47'/%3E%3Ccircle cx='512' cy='458' r='.82' opacity='.31'/%3E%3Ccircle cx='55' cy='461' r='.55' opacity='.31'/%3E%3Ccircle cx='212' cy='60' r='.85' opacity='.47'/%3E%3Ccircle cx='447' cy='358' r='.79' opacity='.49'/%3E%3Ccircle cx='238' cy='474' r='.55' opacity='.34'/%3E%3Ccircle cx='86' cy='388' r='.45' opacity='.45'/%3E%3Ccircle cx='599' cy='537' r='.68' opacity='.54'/%3E%3Ccircle cx='35' cy='327' r='.8' opacity='.36'/%3E%3Ccircle cx='609' cy='86' r='.84' opacity='.42'/%3E%3Ccircle cx='575' cy='614' r='.63' opacity='.42'/%3E%3Ccircle cx='270' cy='61' r='.53' opacity='.31'/%3E%3Ccircle cx='55' cy='581' r='.7' opacity='.45'/%3E%3Ccircle cx='144' cy='579' r='.48' opacity='.53'/%3E%3Ccircle cx='168' cy='39' r='.65' opacity='.39'/%3E%3Ccircle cx='87' cy='231' r='.51' opacity='.55'/%3E%3Ccircle cx='359' cy='286' r='.9' opacity='.38'/%3E%3Ccircle cx='353' cy='337' r='.57' opacity='.43'/%3E%3Ccircle cx='586' cy='187' r='.66' opacity='.4'/%3E%3Ccircle cx='79' cy='147' r='.73' opacity='.29'/%3E%3Ccircle cx='57' cy='460' r='.52' opacity='.34'/%3E%3Ccircle cx='268' cy='485' r='.72' opacity='.46'/%3E%3Ccircle cx='419' cy='234' r='.79' opacity='.56'/%3E%3Ccircle cx='204' cy='440' r='.49' opacity='.32'/%3E%3Ccircle cx='324' cy='423' r='.49' opacity='.56'/%3E%3Ccircle cx='565' cy='83' r='.85' opacity='.39'/%3E%3Ccircle cx='441' cy='354' r='.8' opacity='.57'/%3E%3Ccircle cx='275' cy='139' r='.59' opacity='.49'/%3E%3Ccircle cx='436' cy='31' r='.77' opacity='.32'/%3E%3Ccircle cx='265' cy='469' r='.64' opacity='.56'/%3E%3Ccircle cx='459' cy='76' r='.49' opacity='.33'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(ellipse 58% 42% at 14% 4%, rgba(255, 79, 154, .13), transparent 72%),
    radial-gradient(ellipse 52% 38% at 86% 74%, rgba(214, 255, 73, .07), transparent 74%);
  background-position: 0 0, 90px 40px, 0 0, 0 0, 0 0;
  background-size: 880px 880px, 470px 470px, 620px 620px, auto, auto;
  background-repeat: repeat, repeat, repeat, no-repeat, no-repeat;
  background-attachment: fixed;
}

/* A handful of near stars breathe on their own fixed layer, so the twinkle is
   one composited opacity animation rather than a repaint of the whole sky.
   z-index: -1 keeps it under the page the way the pages that have their own
   texture overlay already do. */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='760'%3E%3Cg fill='%23fff'%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(176 684) scale(1.18)' opacity='.99'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(310 511) scale(.86)' opacity='.92' fill='%23ffd9ec'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(158 237) scale(1.1)' opacity='.9' fill='%23f2ffd0'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(421 422) scale(.84)' opacity='.88'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(572 449) scale(1.22)' opacity='.89'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(297 533) scale(.79)' opacity='.85' fill='%23f2ffd0'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(674 475) scale(.71)' opacity='.87'/%3E%3Cpath d='M0-5.2 1-1 5.2 0 1 1 0 5.2-1 1-5.2 0-1-1Z' transform='translate(372 508) scale(1.25)' opacity='.88' fill='%23ffd9ec'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 760px 760px;
  animation: luckyTwinkle 6.5s ease-in-out infinite alternate;
}

@keyframes luckyTwinkle {
  from { opacity: .3; }
  to { opacity: .95; }
}

@media (prefers-reduced-motion: reduce) {
  body::after { animation: none; opacity: .8; }
}