/* MoveMates 0.11.4: a compact, self-hosted wordmark. */
@font-face {
  font-family: 'MoveMates Brand';
  src: url('./manrope-brand.woff') format('woff');
  font-style: normal;
  font-weight: 680;
  font-display: swap;
}

.app-header .brand.mm114-brand {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 9px;
  min-height: 44px;
  color: var(--fg);
  font-family: 'MoveMates Brand', 'Avenir Next', Avenir, system-ui, sans-serif;
  font-size: 26px;
  font-weight: 680;
  font-style: normal;
  letter-spacing: -1px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.app-header .mm114-brand .mm114-word {
  color: var(--fg);
  display: inline-block;
  padding-bottom: 1px;
}

.app-header .mm114-brand .mm114-accent {
  color: var(--accent);
}

.app-header .mm114-brand .mm114-mark {
  display: block;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  overflow: visible;
}

.mm114-mark-bg { fill: var(--accent); }
.mm114-mark-line {
  fill: none;
  stroke: var(--bg);
  stroke-width: 3.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-header .mm114-brand:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 5px;
  border-radius: 8px;
}

/* The small header on other pages also contains three action buttons. */
@media (max-width: 379px) {
  .app-header .brand.mm114-brand { font-size: 20px; gap: 6px; letter-spacing: -.75px; }
  .app-header .mm114-brand .mm114-mark { width: 26px; height: 26px; flex-basis: 26px; }
  .mm107-page .app-header .brand.mm114-brand { font-size: 25px; gap: 8px; letter-spacing: -.9px; }
  .mm107-page .app-header .mm114-brand .mm114-mark { width: 32px; height: 32px; flex-basis: 32px; }
}