/* header-nav.css - styles for the shared site header nav.
   Extracted from the inline <style> that used to live in header.php so that
   header.php (included inside <body> on every surface, including standalone
   documents like the whitepaper and the dev portal) emits a body-valid
   <link rel="stylesheet"> instead of a <style> element, which the W3C
   validator rejects as a child of <body>/<main>. ASCII only, no em-dashes. */
.nav-auth{display:flex;align-items:center;gap:9px;margin-left:8px;min-height:34px}
/* Official Google "Sign in with Google" button (light theme, pill). Values track
   Google's gsi-material-button branding spec (C:\assets\gsi-google-signin-button.html):
   1px #747775 border, 20px pill radius, #1f1f1f label, Roboto 14px/.25px, 40px tall,
   official hover shadow. Google sign-in is the site's REQUIRED, only auth method. */
.gsi-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:#1f1f1f;
  border:1px solid #747775;border-radius:20px;height:40px;padding:0 14px;font-size:14px;font-weight:500;
  letter-spacing:.25px;text-decoration:none;font-family:Roboto,"Segoe UI",Arial,sans-serif;line-height:1;
  white-space:nowrap;transition:background-color .218s,border-color .218s,box-shadow .218s}
.gsi-btn:hover{background:#f7f8f8;box-shadow:0 1px 2px 0 rgba(60,64,67,.30),0 1px 3px 1px rgba(60,64,67,.15)}
.gsi-btn svg{width:18px;height:18px;display:block}
.nav-chip{display:flex;align-items:center;gap:8px;font-size:.86rem;color:var(--ink)}
.nav-chip img{width:28px;height:28px;border-radius:50%;display:block}
.nav-chip .nm{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-chip a{font-size:.8rem;text-decoration:none;color:var(--muted);border:1px solid var(--line);
  border-radius:7px;padding:5px 10px}
.nav-chip a.acct{color:#07111f;background:var(--blue,#38a1ff);border-color:transparent;font-weight:700}
.brand-logo{height:40px;width:auto;display:block}
.nav-mlsub{display:flex;align-items:center;gap:6px;margin:0 0 0 8px}
.nav-mlsub input[type=email]{padding:7px 11px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.06);color:var(--ink);font-size:.88rem;width:178px}
.nav-mlsub input[type=email]::placeholder{color:var(--muted)}
.nav-mlsub button{padding:7px 15px;border:0;border-radius:7px;background:var(--blue);color:#07111f;font-weight:700;font-size:.88rem;cursor:pointer}
.nav-mlsub button:disabled{opacity:.6;cursor:default}
.nav-mlsub-msg{color:var(--muted);font-size:.78rem;max-width:150px;line-height:1.15}
.nav-mlsub-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:820px){.nav-mlsub{display:none}}
/* Responsive header (was: hide the email form in a mid band, which still let the
   nav overflow + cut off the account chip). Now the header WRAPS gracefully:
   the whole menu can flow to a second row instead of overflowing the viewport. */
.nav-menu{flex-wrap:wrap;justify-content:flex-end;row-gap:6px}
/* Stage 1: when the single row won't fit, the email signup drops to its own
   full-width second row (right-aligned) instead of being hidden or cut off.
   Stage 2: if the nav links themselves still don't fit, they wrap too (handled
   by the flex-wrap above). */
@media (min-width:1281px) and (max-width:1780px){
  .nav-mlsub{order:10;flex-basis:100%;justify-content:flex-end;margin:8px 0 0}
}
