/* One decorative viewport-sized Galaxy layer behind all public page sections. */
.mr-galaxy-page > .mr-galaxy-canvas {
  position: fixed;
  inset: 0 auto auto 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: var(--mr-galaxy-height, 100vh);
  pointer-events: none;
  -webkit-mask-image: none;
  mask-image: none;
}
#mr-root.mr-galaxy-page > main,
#cs-root.mr-galaxy-page > main,
#career-story.mr-galaxy-page > main,
body.mr-galaxy-page > main {
  position: relative;
  z-index: 1;
}
/* Tint only the decorative layer; UI surfaces and typography retain their colors. */
.mr-galaxy-canvas[data-palette="career"],
.mr-galaxy-canvas[data-palette="crd"] {
  background: rgba(14, 9, 28, .7);
}
.mr-galaxy-canvas[data-palette="cosmic"] {
  background: rgba(10, 13, 29, .7);
}

/* Content keeps its existing maximum width; only the background spans the page. */
#mr-root .editorial-home-hero { background: transparent; }

/* Fade within the visible portrait frame, before its clipping boundary. */
#mr-root .editorial-portrait {
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 60%, rgba(0,0,0,.95) 68%, rgba(0,0,0,.75) 76%, rgba(0,0,0,.42) 84%, rgba(0,0,0,.14) 91%, rgba(0,0,0,.025) 96%, transparent 99%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 60%, rgba(0,0,0,.95) 68%, rgba(0,0,0,.75) 76%, rgba(0,0,0,.42) 84%, rgba(0,0,0,.14) 91%, rgba(0,0,0,.025) 96%, transparent 99%);
}
#mr-root .editorial-portrait img { -webkit-mask-image: none; mask-image: none; }

/* Hero metrics: fuller green glass, with no visible border. */
#mr-root .editorial-home-hero .editorial-stat {
  background: rgba(35, 46, 38, .55);
  border: 0;
  box-shadow: 0 4px 30px rgba(0, 0, 0, .1);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
#mr-root .editorial-home-hero .editorial-stat span {
  color: #b1b8ab;
}

/* Match the mobile homepage cards while keeping career copy on its solid panel. */
@media (max-width: 768px) {
  #mr-root .editorial-home-hero .editorial-stat,
  #mr-root #career-timeline .career-card,
  #mr-root #feedback .mr-feedback-card {
    background: rgba(35, 46, 38, .55);
    border: 0;
    box-shadow: 0 4px 30px rgba(0, 0, 0, .1);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }
}

/* Continue the mobile glass surfaces on About me. */
@media (max-width: 768px) {
  #cs-root .about-page .about-story-card,
  #cs-root .about-page .about-recommendation,
  #cs-root .about-page .mr-cert-card {
    background: rgba(35, 46, 38, .55);
    border: 0;
    box-shadow: 0 4px 30px rgba(0, 0, 0, .1);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
  }
}