:root {
  --ea-global-nav-size: 48px;
  --ea-global-nav-gap: 12px;
  --ea-global-nav-bottom: 20px;
  --ea-global-nav-inactive-opacity: 0.4;
  --ea-global-nav-layer: 999999;
  --ea-site-title-top: 20px;
  --ea-site-title-side: 20px;
  --ea-site-title-color: #000;
  --ea-site-title-layer: 999998;
  --ea-site-title-left-parenthesis-1-x: 0px;
  --ea-site-title-left-parenthesis-1-y: 0px;
  --ea-site-title-left-parenthesis-2-x: 0px;
  --ea-site-title-left-parenthesis-2-y: 0px;
  --ea-site-title-right-parenthesis-1-x: 0px;
  --ea-site-title-right-parenthesis-1-y: 0px;
  --ea-site-title-right-parenthesis-2-x: 0px;
  --ea-site-title-right-parenthesis-2-y: 0px;
}

/* Global site title. Typography comes from Laytheme's _SiteTitle style. */
html.ea-global-interface .ea-global-title {
  position: fixed;
  z-index: var(--ea-site-title-layer);
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  color: var(--ea-site-title-color);
}

html.ea-global-interface .ea-site-title-part {
  position: absolute;
  top: var(--ea-site-title-top);
  display: block;
  width: max-content;
  max-width: none;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  color: inherit;
  text-decoration: none;
  pointer-events: auto;
  cursor: pointer;
}

html.ea-global-interface .ea-site-title-left {
  left: var(--ea-site-title-side);
}

html.ea-global-interface .ea-site-title-right {
  right: var(--ea-site-title-side);
  transform: scaleX(-1);
  transform-origin: center center;
}

html.ea-global-interface .ea-site-title-text,
html.ea-global-interface .ea-site-title-parenthesis {
  display: inline-block;
}

/*
 * On desktop, hovering either title keeps both links in place and
 * clickable, hides all letterforms, and leaves the four parentheses visible.
 */
@media (hover: hover) {
  html.ea-global-interface.ea-layout-desktop
  .ea-global-title:has(.ea-site-title-part:hover)
  .ea-site-title-text {
    opacity: 0;
  }
}

/* Equivalent desktop feedback for keyboard navigation. */
html.ea-global-interface.ea-layout-desktop
.ea-global-title:focus-within
.ea-site-title-text {
  opacity: 0;
}

html.ea-global-interface .ea-site-title-left-parenthesis-1 {
  position: relative;
  left: var(--ea-site-title-left-parenthesis-1-x);
  top: var(--ea-site-title-left-parenthesis-1-y);
}

html.ea-global-interface .ea-site-title-left-parenthesis-2 {
  position: relative;
  left: var(--ea-site-title-left-parenthesis-2-x);
  top: var(--ea-site-title-left-parenthesis-2-y);
}

html.ea-global-interface .ea-site-title-right-parenthesis-1 {
  position: relative;
  left: var(--ea-site-title-right-parenthesis-1-x);
  top: var(--ea-site-title-right-parenthesis-1-y);
}

html.ea-global-interface .ea-site-title-right-parenthesis-2 {
  position: relative;
  left: var(--ea-site-title-right-parenthesis-2-x);
  top: var(--ea-site-title-right-parenthesis-2-y);
}

html.ea-global-interface nav.laynav.desktop-nav.primary,
html.ea-global-interface nav.laynav.mobile-nav {
  position: fixed !important;
  z-index: var(--ea-global-nav-layer) !important;
  top: auto !important;
  right: auto !important;
  bottom: var(--ea-global-nav-bottom) !important;
  left: 50% !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  background: transparent !important;
  overflow: visible !important;
  scrollbar-width: none !important;
  white-space: nowrap !important;
}

html.ea-global-interface nav.laynav.desktop-nav.primary::-webkit-scrollbar,
html.ea-global-interface nav.laynav.mobile-nav::-webkit-scrollbar {
  display: none !important;
}

html.ea-global-interface.ea-layout-desktop nav.laynav.mobile-nav,
html.ea-global-interface.ea-layout-mobile nav.laynav.desktop-nav.primary {
  display: none !important;
}

html.ea-global-interface.ea-layout-desktop nav.laynav.desktop-nav.primary,
html.ea-global-interface.ea-layout-mobile nav.laynav.mobile-nav {
  display: block !important;
}

html.ea-global-interface.ea-layout-mobile .lay-mobile-icons-wrap {
  display: none !important;
}

html.ea-global-interface nav.laynav.desktop-nav.primary > ul,
html.ea-global-interface nav.laynav.mobile-nav > ul {
  position: static !important;
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--ea-global-nav-gap) !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  background: transparent !important;
  list-style: none !important;
}

html.ea-global-interface nav.laynav li.ea-nav-index,
html.ea-global-interface nav.laynav li.ea-nav-home,
html.ea-global-interface nav.laynav li.ea-nav-about {
  position: relative !important;
  display: block !important;
  flex: 0 0 auto !important;
  width: var(--ea-global-nav-size) !important;
  height: var(--ea-global-nav-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: var(--ea-global-nav-inactive-opacity);
}

html.ea-global-interface nav.laynav li.is-ea-active,
html.ea-global-interface nav.laynav li:focus-within {
  opacity: 1;
}

@media (hover: hover) {
  html.ea-global-interface nav.laynav li.ea-nav-index:hover,
  html.ea-global-interface nav.laynav li.ea-nav-home:hover,
  html.ea-global-interface nav.laynav li.ea-nav-about:hover {
    opacity: 1;
  }
}

html.ea-global-interface nav.laynav li.ea-nav-index > a,
html.ea-global-interface nav.laynav li.ea-nav-home > a,
html.ea-global-interface nav.laynav li.ea-nav-about > a {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: transparent !important;
  text-decoration: none !important;
}

html.ea-global-interface nav.laynav li.ea-nav-index > a::before,
html.ea-global-interface nav.laynav li.ea-nav-home > a::before,
html.ea-global-interface nav.laynav li.ea-nav-about > a::before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

html.ea-global-interface nav.laynav li.ea-nav-index > a::before {
  background-image: url("ea-index.svg");
}

html.ea-global-interface nav.laynav li.ea-nav-home > a::before {
  background-image: url("ea-home.svg");
}

html.ea-global-interface nav.laynav li.ea-nav-about > a::before {
  background-image: url("ea-about.svg");
}

html.ea-global-interface nav.laynav li.ea-nav-index > a > span,
html.ea-global-interface nav.laynav li.ea-nav-home > a > span,
html.ea-global-interface nav.laynav li.ea-nav-about > a > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body.lay-hide-menu nav.laynav.desktop-nav.primary,
body.lay-hide-menu nav.laynav.mobile-nav {
  display: none !important;
}

/* Keep compatibility with the Reflection Note modal. */
html.ea-global-interface.rn-mobile-note-open nav.laynav.desktop-nav.primary,
html.ea-global-interface.rn-mobile-note-open nav.laynav.mobile-nav {
  visibility: hidden !important;
  pointer-events: none !important;
}

html.ea-global-interface.rn-mobile-note-open .ea-global-title {
  visibility: hidden !important;
}