/* Shared sizing for the Touchcraft header logo. Single source of truth so the
   logo dimensions can be tuned in one place across every page.
   - .brand-logo          base size (big centered/document headers)
   - .brand-logo--center  centers the logo in a centered header
   - .brand-logo--bar     smaller variant for bar headers with side actions
                          (profile, leaderboard) */
.brand-logo {
  height: 46px;
  width: auto;
  display: block;
}
.brand-logo--center {
  margin-left: auto;
  margin-right: auto;
}
.brand-logo--bar {
  height: 40px;
}
@media (max-width: 620px) {
  .brand-logo { height: 38px; }
  .brand-logo--bar { height: 32px; }
}