/* Earn header fixes + signed-in Earn menu (public/_assets/earn-header.js). Loaded by EarnShell and, for GGE-served pages,
   injected by the script, so a rule here reaches both. */

/* GLORi Marketing burger menu: opaque, and above everything. gheader.css gives the open menu a 97% background with a
   backdrop blur nested inside the nav's own blur, which (notably iOS Safari) let the gold thank-you bar and the page
   (gold Earn buttons/tabs) show through; the unscrolled nav row is also transparent. While open, the nav and menu are
   solid and the nav sits above the thank-you bar. */
/* Header above ALL page content: gheader.css's z-index 100 and 82%-opaque scrolled nav let the portal's gold pills and
   "Hi ..." line read as on top of the nav text when scrolling. Scrolled nav is opaque; bar and nav sit at 1000+. */
nav.gh-nav{z-index:1000}
nav.gh-nav.scrolled{background:#16252c}
.gh .gh-thanks{z-index:1001}
nav.gh-nav.open{z-index:1002;background:#16252c}
/* Signed-in links inside the GLORi burger menu (earn-header.js adds .rr-mm), shown below 980px where the row is only the avatar. */
.rr-mm{display:none}
.rr-mm .rr-signout{display:block;margin:0}
.rr-mm .rr-signout button{background:none;border:0;font:inherit;color:inherit;cursor:pointer;width:100%;text-align:left}
@media(max-width:980px){
  nav.gh-nav.open .gh-links{background:#16252c;backdrop-filter:none;-webkit-backdrop-filter:none;z-index:1002;box-shadow:0 24px 40px -20px rgba(0,0,0,.6)}
  .gh-nav.open .gh-links .rr-mm{display:flex;flex-direction:column;align-items:stretch;border-bottom:1px solid rgba(246,241,231,.12);margin-bottom:6px}
  .rr-mm .rr-signout button{padding:13px 0;border-bottom:1px solid rgba(246,241,231,.06);color:rgba(246,241,231,.82)}
}

/* The footer line ("Rewards are paid by GLORi Technologies, LLC.") is centred. */
.rr-footer .rr-disclosure{text-align:center}

.rr-header .rr-nav[data-signed-in]{width:100%;justify-content:flex-end;align-items:center;gap:6px 22px}
/* The member links before the avatar (desktop); below 980px the burger menu carries them and the row is just the avatar. */
.rr-header .rr-nav[data-signed-in]>a.rr-sublink{color:#d4dce8;text-decoration:none;font-size:.95rem;white-space:nowrap}
.rr-header .rr-nav[data-signed-in]>a.rr-sublink:hover,.rr-header .rr-nav[data-signed-in]>a.rr-sublink:focus-visible{color:var(--gold,#e0bf6c)}
.rr-header .rr-nav[data-signed-in]>a[aria-current="page"]{color:var(--gold,#e0bf6c);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}

/* Native account menu: the same initials bubble as GGE's portal pages (its referral.css .rr-acct/.rr-avatar values),
   with the menu in the Earn dark palette. Scoped to .rr-acct-n so GGE's own avatar keeps GGE's styles. */
.rr-acct-n{position:relative;margin-left:12px}
.rr-acct-n .rr-avatar{list-style:none;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:var(--gold,#e0bf6c);color:#26333E;font-weight:800;font-size:.9rem;letter-spacing:.02em;cursor:pointer;user-select:none}
.rr-acct-n .rr-avatar::-webkit-details-marker{display:none}
.rr-acct-n[open] .rr-avatar{box-shadow:0 0 0 3px rgba(224,178,78,.45)}
.rr-acct-n .rr-acct-menu{position:absolute;right:0;top:46px;z-index:60;min-width:210px;padding:8px;border-radius:12px;background:#0f1829;color:#d4dce8;border:1px solid #2d4060;box-shadow:0 12px 30px -12px rgba(0,0,0,.6)}
.rr-acct-n .rr-acct-name{margin:0 0 4px;padding:6px 10px 8px;font-size:.82rem;color:#94a3b8;border-bottom:1px solid #2d4060;overflow-wrap:anywhere}
.rr-header .rr-nav .rr-acct-n .rr-acct-menu a[href],.rr-header .rr-nav .rr-acct-n .rr-acct-menu .rr-signout button{display:block;width:100%;text-align:left;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:#d4dce8;font:inherit;font-size:.95rem;text-decoration:none;cursor:pointer}
.rr-header .rr-nav .rr-acct-n .rr-acct-menu a[href]:hover,.rr-header .rr-nav .rr-acct-n .rr-acct-menu .rr-signout button:hover,.rr-header .rr-nav .rr-acct-n .rr-acct-menu a[href]:focus-visible,.rr-header .rr-nav .rr-acct-n .rr-acct-menu .rr-signout button:focus-visible{background:rgba(224,191,108,.16);color:var(--gold,#e0bf6c)}
.rr-header .rr-nav .rr-acct-n .rr-acct-menu .rr-signout{display:block;margin:4px 0 0;padding-top:4px;border-top:1px solid #2d4060}
.rr-acct-n :focus-visible{outline-color:var(--gold,#e0bf6c)}

/* Member sub-nav pinned just under the fixed GLORi Marketing nav while scrolling, at every width (Steve, 2026-10-19).
   64px = gheader.css `.gh-nav.scrolled{height:64px}` (sticking only starts after the nav has gone to its scrolled
   height). z-index 999: above page content, under the nav (1000+); background is opaque so nothing shows through.
   `sticky` needs no scrolling ancestor, so the page wrappers clip horizontally instead of overflow-x:hidden. */
html div.rr-page,html body.rr{overflow-x:clip}
.rr-header:has(.rr-nav[data-signed-in]){position:sticky;top:64px;z-index:999;background:#0f1829}
@media(max-width:980px){
  .rr-header .rr-nav[data-signed-in]{justify-content:flex-end;flex-wrap:wrap;gap:6px 14px}
  .rr-header .rr-nav[data-signed-in]>a.rr-sublink{display:none}
}
@media(max-width:420px){
  .rr-header .rr-nav[data-signed-in]{gap:6px 10px;font-size:.78rem}
  .rr-header .rr-nav[data-signed-in] .rr-acct-n{margin-left:2px}
  .rr-header .rr-nav[data-signed-in] .rr-avatar{width:32px;height:32px;font-size:.8rem}
  .rr-acct-n .rr-acct-menu{top:40px}
}

/* Steve, 2026-11-04: signed out, the sub-bar is empty (the top nav's "Sign In" is the entry), so the bar is not drawn at all. */
.rr-header:not(:has(.rr-nav[data-signed-in])){display:none}
/* ...and the page then starts below the fixed nav itself, or the hero heading slides under it (Steve, 2026-11-04). */
.rr-header:not(:has(.rr-nav[data-signed-in]))+#main{margin-top:var(--ea-bar,74px)}
/* Signed in, the initials avatar takes the place of "Sign In" in the top GLORi Marketing nav (its menu is the .rr-acct-n
   rules above; these re-scope the item styles from `.rr-header .rr-nav` to `.gh-links`). Below 980px the burger menu
   (.rr-mm) lists the same items instead. */
.gh-links .rr-acct-top{margin-left:0}
.gh-links .rr-acct-top .rr-acct-menu a[href],.gh-links .rr-acct-top .rr-acct-menu .rr-signout button{display:block;width:100%;min-height:0;text-align:left;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:#d4dce8;font:inherit;font-size:.95rem;text-decoration:none;cursor:pointer;white-space:nowrap}
.gh-links .rr-acct-top .rr-acct-menu a[href]::after{display:none}
.gh-links .rr-acct-top .rr-acct-menu a[href]:hover,.gh-links .rr-acct-top .rr-acct-menu .rr-signout button:hover,.gh-links .rr-acct-top .rr-acct-menu a[href]:focus-visible,.gh-links .rr-acct-top .rr-acct-menu .rr-signout button:focus-visible{background:rgba(224,191,108,.16);color:var(--gold,#e0bf6c)}
.gh-links .rr-acct-top .rr-acct-menu .rr-signout{display:block;margin:4px 0 0;padding-top:4px;border-top:1px solid #2d4060}
.gh-links .rr-acct-top .rr-acct-menu .rr-portal-form{margin:0;padding-top:0;border-top:0}
@media(max-width:980px){.gh-links .rr-acct-top{display:none}}

/* Plain-text button (e.g. "Use a different email" on /earn/start). */
.rr-linkbtn{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}