.daui-LinkNav {
  display: flex;
  align-items: flex-end;
  padding: 0.5em 0;
  white-space: nowrap;
  text-decoration: none;
  color: hsl(
    var(--daui-interact-hue),
    var(--daui-interact-saturation),
    var(--daui-interact-lightness)
  );
}

.daui-LinkNav:focus,
.daui-LinkNav--active {
  box-shadow: inset 0 -2px;
}

.daui-LinkNav:focus {
  color: hsl(
    var(--daui-interact-hue),
    var(--daui-interact-saturation),
    calc(var(--daui-interact-lightness) + 10%)
  );
  outline: 0;
}

.daui-LinkNav:active {
  color: hsl(
    var(--daui-interact-hue),
    var(--daui-interact-saturation),
    calc(var(--daui-interact-lightness) + 20%)
  );
}