.terminal {
  --row-gap: 0.2lh;

  background-color: var(--color-ink);
  color: var(--color-positive);
  font-family: var(--font-mono);
  font-size: var(--text-normal);
  inset: auto 0 0 0;
  padding: 0.4lh calc(34ch + var(--inline-space-double)) 0.4lh;
  position: fixed;
  z-index: 1;

  .terminal__input {
    --input-border-color: transparent;
    --input-border-radius: 0.3em;
    --hover-color: transparent;
    --input-color: var(--color-positive);
    --outline-size: 0;
    --outline-color: transparent;
    
    accent-color: var(--color-positive);
    caret-color: var(--color-positive);
    font-family: inherit;

    &::placeholder {
      color: var(--color-positive-light);
      opacity: 0.5;
    }

    .terminal__link & {
      color: var(--color-positive-light);
      opacity: 0.5;
    }
  }
}

.terminal__link {
  --hover-size: 0;

  color: var(--color-positive);
}

.terminal__menu {
  display: none;
  list-style: none;
  transition: display 1000ms allow-discrete;

  .terminal--open & {
    display: flex;
  }
}