/* =========================================================
   Mission 03 · P28–P37 unified full-screen background system
   Visual baseline: P28 full-bleed city + deep-blue atmosphere
   Content/layout intentionally untouched.
   ========================================================= */

:root{
  --m03-bg-image:url("../assets/mission-system/digital-network-bg.webp");
  --m03-bg-base:#021025;
  --m03-cyan:#62f1df;
}

/* Full viewport safety net: never reveal a white/transparent edge. */
html,body,.reveal,.reveal-viewport{
  background:var(--m03-bg-base)!important;
}

/* P28–P37: enforce identical full-bleed canvas behavior. */
#page28Mission03,
#page28Mission03Intro,
#page28Mission03Beacon,
#page29Mission03Network,
#page30Mission03Reality,
#page31Mission03DigitalChina,
#page32Mission03ImpactMap,
#page33Mission03LanguageKit,
#page34Mission03StoryFrame,
#page35Mission03LocalLens,
#page36Mission03WorldVoice,
#page37Mission03Report{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  background:
    linear-gradient(180deg,rgba(1,12,30,.24) 0%,rgba(1,13,31,.42) 58%,rgba(1,13,31,.54) 100%),
    radial-gradient(circle at 52% 48%,rgba(36,201,190,.075) 0%,rgba(2,16,37,0) 36%),
    var(--m03-bg-image) center center / cover no-repeat!important;
  background-attachment:scroll!important;
}

/* Reveal sometimes paints its own slide background behind sections.
   Force the same dark base while Mission 03 is active. */
.reveal-viewport:has(#page28Mission03.present),
.reveal-viewport:has(#page28Mission03Intro.present),
.reveal-viewport:has(#page28Mission03Beacon.present),
.reveal-viewport:has(#page29Mission03Network.present),
.reveal-viewport:has(#page30Mission03Reality.present),
.reveal-viewport:has(#page31Mission03DigitalChina.present),
.reveal-viewport:has(#page32Mission03ImpactMap.present),
.reveal-viewport:has(#page33Mission03LanguageKit.present),
.reveal-viewport:has(#page34Mission03StoryFrame.present),
.reveal-viewport:has(#page35Mission03LocalLens.present),
.reveal-viewport:has(#page36Mission03WorldVoice.present),
.reveal-viewport:has(#page37Mission03Report.present){
  background:var(--m03-bg-base)!important;
}

/* Existing FX containers on P34–P37 share one motion/brightness system. */
#page34Mission03StoryFrame .p34-bg-fx,
#page35Mission03LocalLens .p35-bg-fx,
#page36Mission03WorldVoice .p36-fx,
#page37Mission03Report .p37-fx{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
  pointer-events:none!important;
  z-index:1!important;
}

#page34Mission03StoryFrame .p34-bg-fx i,
#page35Mission03LocalLens .p35-bg-fx i,
#page36Mission03WorldVoice .p36-fx i,
#page37Mission03Report .p37-fx i{
  width:7px!important;
  height:7px!important;
  border-radius:50%!important;
  background:rgba(98,241,223,.92)!important;
  box-shadow:
    0 0 8px rgba(98,241,223,.88),
    0 0 20px rgba(98,241,223,.42)!important;
  opacity:.82;
  animation-duration:9s!important;
  animation-timing-function:linear!important;
  animation-iteration-count:infinite!important;
}

/* P28–P33 use different legacy FX class names.
   Normalize their particles without changing DOM or interactions. */
#page28Mission03 [class*="particle"],
#page28Mission03 [class*="orb"],
#page28Mission03Intro [class*="particle"],
#page28Mission03Intro [class*="orb"],
#page28Mission03Beacon [class*="particle"],
#page28Mission03Beacon [class*="orb"],
#page29Mission03Network [class*="particle"],
#page29Mission03Network [class*="orb"],
#page30Mission03Reality [class*="particle"],
#page30Mission03Reality [class*="orb"],
#page31Mission03DigitalChina [class*="particle"],
#page31Mission03DigitalChina [class*="orb"],
#page32Mission03ImpactMap [class*="particle"],
#page32Mission03ImpactMap [class*="orb"],
#page33Mission03LanguageKit [class*="particle"],
#page33Mission03LanguageKit [class*="orb"]{
  box-shadow:0 0 16px rgba(98,241,223,.55)!important;
}

/* Keep all real page content above the atmospheric layer. */
#page28Mission03 > *:not([class*="fx"]):not([class*="particle"]),
#page28Mission03Intro > *:not([class*="fx"]):not([class*="particle"]),
#page28Mission03Beacon > *:not([class*="fx"]):not([class*="particle"]),
#page29Mission03Network > *:not([class*="fx"]):not([class*="particle"]),
#page30Mission03Reality > *:not([class*="fx"]):not([class*="particle"]),
#page31Mission03DigitalChina > *:not([class*="fx"]):not([class*="particle"]),
#page32Mission03ImpactMap > *:not([class*="fx"]):not([class*="particle"]),
#page33Mission03LanguageKit > *:not([class*="fx"]):not([class*="particle"]),
#page34Mission03StoryFrame > *:not(.p34-bg-fx),
#page35Mission03LocalLens > *:not(.p35-bg-fx),
#page36Mission03WorldVoice > *:not(.p36-fx),
#page37Mission03Report > *:not(.p37-fx){
  position:relative;
  z-index:2;
}