[hidden] {
  display: none !important;
}
.site-page {
  animation: pageIn 0.32s ease both;
}
@keyframes pageIn {
  from {
    opacity: 0;
    transform: translateY(0.7rem);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@media (max-width: 1120px) {
  header {
    height: auto;
    min-height: 78px;
    flex-wrap: wrap;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
  }
  nav {
    order: 3;
    width: 100%;
    margin: 0.65rem 0 0;
    gap: 0.35rem;
    overflow-x: auto;
    scrollbar-width: thin;
  }
  nav button {
    flex: 0 0 auto;
    padding: 0.7rem 0.85rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--paper);
  }
  nav .active {
    background: var(--ink);
    color: var(--cream);
    border-color: var(--ink);
  }
  .theme {
    position: absolute;
    right: 4vw;
    top: 1rem;
  }
}
@media (max-width: 460px) {
  nav {
    display: flex;
  }
  .logo {
    padding-right: 3rem;
  }
}