/* ============================================================
   Logo
   The product mark on a solid near-white tile — the one place in
   the UI that inverts. Shared: the wizard's top bar and the
   console's side nav brand both use it.
   ============================================================ */

.logo {
  width: 24px;
  height: 24px;
  border-radius: var(--r);
  flex-shrink: 0;
  background: var(--solid);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--on-solid);
  text-decoration: none;
  transition: background-color var(--dur) var(--ease);
}

a.logo:hover {
  background: var(--solid-hover);
}