:root {
  font: 14px/1.4 system-ui, sans-serif;
}

button,
.button {
  padding: .45rem .7rem;
  border-radius: .5rem;
}

input,
textarea,
select {
  padding: .52rem .6rem;
  border-radius: .45rem;
}

textarea {
  min-height: 9rem;
}

.login {
  margin-top: 6vh;
  padding: 1.5rem;
}

.login form,
.form {
  gap: .7rem;
}

.shell {
  grid-template-columns: 13.5rem 1fr;
}

.sidebar {
  padding: .85rem;
  gap: .4rem;
}

#admin-nav button {
  width: 100%;
}

.content {
  padding: .9rem;
}

.topbar {
  gap: .45rem;
}

.topbar input {
  min-width: 12rem;
}

.grid {
  grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
  gap: .7rem;
  margin-top: .8rem;
}

.card {
  padding: .72rem;
  border-radius: .65rem;
}

.card h2 {
  font-size: .98rem;
  margin: .25rem 0;
}

.preview {
  -webkit-line-clamp: 6;
  font-size: .88rem;
  line-height: 1.35;
}

.tag {
  font-size: .7rem;
  padding: .1rem .35rem;
}

.actions {
  gap: .3rem;
  margin-top: .55rem;
}

.meta {
  font-size: .75rem;
}

.empty {
  padding: 2.5rem;
}

dialog {
  padding: 1rem;
}

.row {
  gap: .7rem;
}

.dialog-actions {
  gap: .35rem;
  margin-top: .7rem;
}

.detail-body {
  padding: .75rem;
}

.admin-table td,
.admin-table th {
  padding: .38rem;
}

@media (max-width: 720px) {
  :root {
    font-size: 14px;
  }

  .content {
    padding: .6rem;
  }
}