/* MyCrowd monochrome identity. The symbol stays decorative beside the real text. */
a.mc-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  text-transform: none;
}
.mc-brand .mc-logo {
  display: block;
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  margin: 0;
  background: #fff;
  -webkit-mask: url('/assets/brand/mycrowd-mark-256-v1.png') center / contain no-repeat;
  mask: url('/assets/brand/mycrowd-mark-256-v1.png') center / contain no-repeat;
}
.mc-brand .mc-wordmark {
  display: block;
  margin: 0;
  color: #fff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.055em;
  text-transform: none;
}
.mc-brand .mc-context {
  margin: 0 0 0 6px;
  color: #aeb7ba;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
}
.mc-brand:hover { color: #fff; }
@media (max-width: 600px) {
  .mc-brand .mc-context { display: none; }
  .guide-nav .mc-brand .mc-logo,
  .guide-nav .mc-brand .mc-wordmark {
  display: block; display: block; }
}

/* Riot's editorial page uses a light background. */
.nav .mc-brand, .nav .mc-brand .mc-wordmark { color: #000; }
.nav .mc-brand .mc-logo { background: #000; }
.nav .mc-brand .mc-context { color: #4e6269; }
