@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Code:wght@400;500;600;700&display=swap');
/* ============================================================
   bbrust.com — SITE HEADER (shared)
   One copy of the header styles for every page: the dashboard,
   /leaderboards, /contest, /map (both instances), /hunt, /rules,
   /lb and /ore-test all link this file and carry the same
   <header class="plate strip"> markup. Self-contained (own tokens,
   own plate chrome, own font import) so it renders identically on
   pages that don't use the FIELD HUD tokens (the parchment pages).
   Loaded AFTER each page's own CSS so these rules win any tie.
   ============================================================ */
.strip{
  --sh-gap:14px;
  --sh-pad:16px;
  --sh-text:#ebe2f0;
  --sh-dim:#a494b1;
  --sh-faint:#6f5c7c;
  --sh-signal:#d63bc8;
  --sh-amber:#e8b34b;
  --sh-blurple:#5865F2;
  --sh-chrome-hi:rgba(177,160,190,.45);
  --sh-plate-hi:rgba(24,14,31,.82);
  --sh-font:'Google Sans Code',Consolas,'Courier New',monospace;
  position:relative;box-sizing:border-box;
  background:rgba(255,73,239,.1);
  border:2px solid #ff49ef;border-radius:16px;overflow:hidden;
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  margin:0 0 var(--sh-gap);
  font-family:var(--sh-font);font-size:17px;line-height:1.5;color:var(--sh-text);
  text-align:left;
}
.strip *,.strip *::before,.strip *::after{box-sizing:border-box}
.strip img{max-width:100%;display:block}
.strip-main{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:14px var(--sh-pad);margin:0}
.strip-id{display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none}
.strip-word{height:84px;width:auto;max-width:min(56vw,320px);object-fit:contain}
.strip-buns{height:84px;width:auto;object-fit:contain;flex:none}
/* flex-basis 0 + a floor: the nav gives up width (its rows re-wrap) before the auth/Discord group wraps to a 2nd row */
.strip-nav{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1 1 0;min-width:min(100%,300px);font-size:14px;letter-spacing:.12em;text-transform:uppercase}
.strip-nav-row{display:flex;flex-wrap:wrap;gap:4px 18px;justify-content:center}
.strip-nav a,.strip-nav a:visited{color:#fff;text-decoration:none}
.strip-nav a:hover{color:var(--sh-signal)}
.strip-right{display:flex;flex-direction:column;align-items:center;gap:8px;margin-left:auto}   /* Discord over Steam, stacked */
.discord-btn{
  display:inline-flex;align-items:center;gap:9px;background:var(--sh-blurple);color:#fff;
  font-family:var(--sh-font);font-weight:600;font-size:17px;letter-spacing:.06em;text-transform:uppercase;
  text-decoration:none;padding:10px 18px;border-radius:999px;transition:filter .15s;white-space:nowrap;line-height:1.5;
}
.discord-btn:hover{filter:brightness(1.12)}
.discord-btn svg{width:19px;height:15px;flex:none}
/* auth widgets: Valve's "Sign in through Steam" image button (sits_landing.png, 114×43) or the signed-in chip */
.auth-area{display:flex;align-items:center;gap:10px}
.steam-btn{display:inline-flex;align-items:center;line-height:0;border-radius:3px;transition:filter .15s,transform .15s}
.steam-btn img{display:block;width:114px;height:43px}
.steam-btn:hover{filter:brightness(1.12)}
.steam-btn.pulse{animation:btn-pulse 1.2s ease-out 2}
@keyframes btn-pulse{0%{box-shadow:0 0 0 0 rgba(214,59,200,.8)}100%{box-shadow:0 0 0 18px rgba(214,59,200,0)}}
.user-chip{display:flex;align-items:center;gap:10px;border:1px solid var(--sh-chrome-hi);background:rgba(9,4,14,.55);padding:6px 12px 6px 6px;border-radius:999px;font-family:var(--sh-font);color:var(--sh-text)}
.user-chip img,.user-chip .ava-fallback{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1px solid var(--sh-chrome-hi);display:grid;place-items:center;font-size:15px;background:var(--sh-plate-hi)}
.user-chip .u-wrap{min-width:0;max-width:220px}
.user-chip .u-name{display:block;font-weight:600;font-size:15px;letter-spacing:.03em;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-chip .u-sub{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--sh-faint);font-weight:400;white-space:nowrap}
.user-chip .u-sub.ph{color:var(--sh-amber)}
.user-chip form{display:inline}
.user-chip .out{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--sh-dim);padding:4px 6px;text-decoration:none;background:none;border:0;cursor:pointer;font-family:inherit}
.user-chip .out:hover{color:var(--sh-text)}
/* wrapper for pages that don't have the dashboard's .console shell (parchment pages, /lb, /ore-test) */
.site-head{width:100%;max-width:1720px;margin:0 auto;flex:none;box-sizing:border-box}
@media (max-width:1080px){
  .strip-nav{order:3;flex-basis:100%}
  .strip-right{margin-left:0;width:100%}
}
@media (max-width:640px){
  .strip-main{gap:14px}
  .strip-word{height:68px}
  .strip-buns{height:68px}
}
@media (prefers-reduced-motion: reduce){
  .strip *{animation:none!important;transition:none!important}
}
