/* The same compact menu, balance and wallet indicator on every page. */
body #header { max-width:1510px; padding:19px 30px 0; }
body #header .topline { margin-bottom:15px; }
body #header .nav-shell { display:flex; flex-wrap:nowrap; align-items:center; gap:22px; }
body #header nav { display:flex; flex:1; padding:4px; border:4px solid #66b3d6; border-radius:28px; background:linear-gradient(#22628b,#063353); box-shadow:inset 0 2px 0 #9ceaff,0 4px 0 #022139; }
body #header nav a { flex:1; display:flex; align-items:center; justify-content:center; gap:10px; padding:13px 14px; border-radius:18px; font:22px/1.05 Cartoon,sans-serif; color:#fff; white-space:nowrap; }
body #header nav a + a { border-left:1px solid #84b2ca66; }
body #header nav a.active { color:#071b3a; background:linear-gradient(#fff589,#ffce22); border:2px solid #fff495; box-shadow:inset 0 -3px 0 #d79c05,0 2px 0 #785b10; text-shadow:none; }
body #header nav .icon,body #header nav .nav-crate { width:30px; height:30px; object-fit:contain; flex-shrink:0; }
body #header .header-account { display:flex; position:static; flex:none; align-items:center; gap:0; padding:7px 10px; border:4px solid #67b4d5; border-radius:30px; background:linear-gradient(#154d78,#071e45); box-shadow:inset 0 1px #96e7ff,0 4px #021c36; }
body #header .wallet-pill { display:flex; position:static; align-items:center; gap:10px; padding:2px 12px 2px 0; margin:0; border:0; border-radius:0; background:none; box-shadow:none; }
body #header .hangar-token-coin { width:32px; height:32px; object-fit:contain; mix-blend-mode:normal; clip-path:circle(48% at 49% 48%); }
body #header .wallet-pill .amount { font:24px/1 Cartoon,sans-serif; color:white; }
body #header .header-wallet-connect { display:flex; align-items:center; justify-content:center; gap:8px; min-height:32px; padding:0 0 0 12px; border:0; border-left:1px solid #76a9ca; background:none; color:#eefaff; font:14px/1.2 Cartoon,sans-serif; white-space:nowrap; }
.connection-dot { width:10px; height:10px; border-radius:50%; background:#d5dfe8; box-shadow:0 0 5px #d5dfe850; flex-shrink:0; }
.connection-dot.connected { background:#4fff8a; box-shadow:0 0 6px #4fff8a60; }
@media(min-width:1024px) { body > #header { zoom:var(--game-ui-scale,.85); } }
@media(max-width:1100px) {
  body #header .nav-shell { flex-wrap:wrap; justify-content:flex-end; gap:16px; }
  body #header nav { flex-basis:100%; }
}
@media(max-width:760px) {
  body #header { padding:19px 17px 0; }
  body #header nav a { font-size:13px; padding:10px 5px; gap:5px; flex-direction:column; }
  body #header nav .icon,body #header nav .nav-crate { width:24px; height:24px; }
  body #header .wallet-pill .amount { font-size:21px; }
  body #header .header-wallet-connect { font-size:12px; }
}

/* One continuous frame for navigation, balance and wallet connection. */
body #header .nav-shell {
  gap:0; min-height:74px; padding:0;
  border:4px solid #66b3d6; border-radius:28px;
  background:linear-gradient(#22628b,#063353);
  box-shadow:inset 0 2px 0 #9ceaff,0 4px 0 #022139;
  align-items:stretch;
}
body #header nav {
  min-width:0; border:0; border-radius:0;
  background:none; box-shadow:none; margin:0;
}
body #header .header-account {
  border:0; border-left:1px solid #84b2ca88;
  border-radius:0; background:none; box-shadow:none;
  padding:8px 16px; margin:0;
}
@media(max-width:1100px) {
  body #header .nav-shell { gap:0; }
  body #header .header-account { width:100%; justify-content:flex-end; min-height:54px; border-left:0; border-top:1px solid #84b2ca88; }
}