/* Shared StreamSuites feature-edge language.
   Status keeps its original page-owned implementation; production pages
   inherit these same geometries through their existing shared stylesheets. */

:root {
  --feature-edge-accent: #76c3ff;
}

html[data-product] {
  --feature-edge-accent: var(--product-accent-bright, #76c3ff);
}

body.public-shell-page {
  --feature-edge-accent: var(--ps-link-primary, #9ad1ff);
}

body.standalone-page {
  --feature-edge-accent: var(--product-accent-bright, #76c3ff);
}

body.download-surface {
  --feature-edge-accent: var(--download-accent-bright, #76c3ff);
}

body:not(.status-page) :where(
  .site-footer,
  .public-footer,
  .download-footer,
  .footer-bar,
  .profile-shell-footer,
  .not-found-footer
) {
  position: relative;
}

body:not(.status-page) :where(
  .site-footer,
  .public-footer,
  .download-footer,
  .footer-bar,
  .profile-shell-footer,
  .not-found-footer
) {
  isolation: isolate;
  overflow: visible;
}

body:not(.status-page) :where(
  .site-footer,
  .public-footer,
  .download-footer,
  .footer-bar,
  .profile-shell-footer,
  .not-found-footer
)::before {
  position: absolute;
  top: -1px;
  left: 10%;
  width: 34%;
  height: 1px;
  z-index: 20;
  display: block;
  background-color: var(--feature-edge-accent);
  box-shadow: 0 0 10px color-mix(in srgb, var(--feature-edge-accent) 30%, transparent);
  content: "";
  opacity: 0.76;
  pointer-events: none;
  transform: translateZ(0);
  transition: background-color 520ms cubic-bezier(.2,.7,.2,1), box-shadow 520ms ease, opacity 220ms ease;
  visibility: visible;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 28%, #000 72%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 28%, #000 72%, transparent);
}

@media (forced-colors: active) {
  body:not(.status-page) :where(
    .site-footer,
    .public-footer,
    .download-footer,
    .footer-bar,
    .profile-shell-footer,
    .not-found-footer
  )::before {
    background: CanvasText;
    opacity: 1;
    -webkit-mask-image: none;
    mask-image: none;
  }
}