/* ---------------------------------------------------------------------------
   The one header every page wears (polish, Push 1, ruling Q2).

   Navy bar, one gold line, the logo on a white tile, the role's links, and on
   the right only the person's name, which opens the account menu. The links
   and the menu are drawn by email-header.js; this file only lays them out.

   The logo sits on a rounded white tile rather than straight on the navy: the
   only logo file (logo.gif) is navy lettering and a gold gear on white, and
   the gear touches the image's top-right edge, so the tile carries padding.

   A page whose body is wider than 1200px sets --page-width on :root so the
   header lines up with it.
   --------------------------------------------------------------------------- */
.app-header{background:#1a2572;border-bottom:4px solid #d4970b;}
.app-header-inner{max-width:var(--page-width,1200px);margin:0 auto;padding:12px 1.5rem;display:flex;align-items:center;box-sizing:border-box;}
.app-logo{display:flex;align-items:center;flex-shrink:0;background:#fff;border-radius:6px;padding:5px 10px;margin-right:40px;line-height:0;text-decoration:none;}
.app-logo img{height:38px;width:auto;display:block;}
.app-nav{display:flex;align-items:center;flex-wrap:wrap;gap:28px;}
.app-nav .header-link{color:#fff;text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:6px 0 4px;border-bottom:2px solid transparent;line-height:1.2;}
.app-nav .header-link:hover{border-bottom-color:rgba(212,151,11,.55);}
.app-nav .header-link[aria-current="page"]{border-bottom-color:#d4970b;}
.app-session{margin-left:auto;padding-left:24px;display:flex;align-items:center;gap:16px;}
.app-session > a{color:#fff;font-size:13px;text-decoration:none;}
.app-session > a:hover{text-decoration:underline;}
