/* Its own component rather than Gantry's menu bar reused, having no links, dropdown or
   controller, but it occupies the same first row of o-appshell and so is held to the same --bar-h
   height and the padding c-menubar gives its brand. */
.c-hyperclank-header {
  grid-row: 1;
  height: var(--bar-h);
  background: var(--panel);
  border-bottom: var(--bw) solid var(--line);
  font-size: var(--text-sm);
}
/* The bar runs the full width of the window: the page column below it is capped by --shell-max,
   the chrome around it is not. */
.c-hyperclank-header__nav {
  display: flex;
  align-items: center;
  gap: 0;
  height: 100%;
  padding-inline: var(--space-xs);
}

.c-hyperclank-header__brand {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-2xs);
  padding-inline: var(--space-sm) var(--space-md);
  color: var(--text-dim);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tracking-wide);
}
.c-hyperclank-header__brand:hover { color: var(--accent); text-decoration: none; }
.c-hyperclank-header__brand-mark { color: var(--accent); }