/* Shared glass material. Geometry belongs to the component styles. */
:root {
  --ek-glass-tint: rgba(24, 31, 23, .07);
  --ek-glass-light: linear-gradient(155deg, rgba(255, 255, 244, .22), rgba(255, 255, 255, .018) 43%, rgba(255, 255, 243, .07));
  --ek-glass-edge: rgba(255, 251, 229, .48);
  --ek-glass-optics: blur(12px) saturate(150%) brightness(1.15);
  --ek-glass-shadow: inset 0 1px 1px rgba(255,255,248,.8), inset 1px 0 1px rgba(255,255,248,.16), inset 0 -1px 1px rgba(255,255,248,.2), 0 8px 28px rgba(0,0,0,.2);
  --ek-glass-ink: #fffaf0;
}

/* Every bar and enabled pill uses exactly the same surface, including the header's paint layer. */
:root body .site-header::before,
:root body dialog#navigation,
:root body :is(.mobile-action, .crew-image figcaption, .button:not(:disabled), .desktop-cta, .menu-button, .brand-seal, .caption-tag, .story-number, .hero-replay) {
  background: var(--ek-glass-light), var(--ek-glass-tint);
  border-color: var(--ek-glass-edge);
  -webkit-backdrop-filter: var(--ek-glass-optics);
  backdrop-filter: var(--ek-glass-optics);
  box-shadow: var(--ek-glass-shadow);
  color: var(--ek-glass-ink);
  text-shadow: 0 1px 7px rgba(0,0,0,.62);
}

/* The shared rim supplies the highlight; do not stack older CTA shine on top. */
:root body .button:not(:disabled)::before {
  background: none;
  border-color: transparent;
}
:root body dialog#navigation::backdrop {
  background: rgba(10,16,12,.78);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
/* The backdrop supplies dimming; avoid filtering an entire long scrolling page. */
:root body :is(.button:not(:disabled), .desktop-cta, .menu-button) {
  -webkit-tap-highlight-color: transparent;
}
@media (hover:hover) and (pointer:fine) {
  :root body :is(.button:not(:disabled), .desktop-cta, .menu-button):hover {
    --ek-glass-tint: rgba(255,255,242,.12);
    --ek-glass-edge: rgba(255,255,242,.72);
  }
}
:root body :is(.button:not(:disabled), .desktop-cta, .menu-button):active {
  --ek-glass-tint: rgba(255,255,242,.17);
}

/* Preferences override tokens so hover can never restore transparency. */
@media (prefers-reduced-transparency:reduce), (prefers-contrast:more) {
  :root body {
    --ek-glass-tint: #20271e;
    --ek-glass-light: linear-gradient(#20271e,#20271e);
    --ek-glass-optics: none;
    --ek-glass-edge: #d6c99f;
    --ek-glass-shadow: none;
  }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  :root body {
    --ek-glass-light: linear-gradient(#20271e,#20271e);
    --ek-glass-optics: none;
  }
}