/* Brand lockup (_brand.html): one size, weight and colour set for the public
 * header and footer, the console header and the auth card. Only room-driven
 * tweaks live elsewhere (site-chrome.css). */
.brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 12px;
  color: var(--tr-color-text-primary);
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.04em;
  white-space: nowrap;
  text-decoration: none;
}

.brand:hover {
  color: var(--tr-color-text-primary);
}

.brand-mark {
  display: block;
  flex: 0 0 27px;
  width: 27px;
  height: 27px;
}

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

.brand-mark-route {
  stroke: var(--tr-color-text-primary);
  stroke-width: 2;
}

.brand-mark-node {
  fill: var(--tr-color-accent-base);
}

.brand-mark-exit {
  stroke: var(--tr-color-accent-base);
  stroke-width: 2;
}