/* Shared RolePocket identity, matching the Chrome extension. */
.brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #172b4d;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 21px;
  font-weight: 750;
  letter-spacing: -0.6px;
  text-decoration: none;
}

.brand-mark {
  display: inline-flex;
  flex: 0 0 auto;
  width: 34px;
  height: 38px;
}

.brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
}

.brand-compact { font-size: 17px; }
.brand-compact .brand-mark { width: 27px; height: 30px; }