:root {
  color-scheme: light dark;
  --panel-ink: #20242a;
  --panel-muted: #68717d;
  --panel-line: #d8dde4;
  --panel-paper: #f4f1ea;
  --panel-accent: #0f6b57;
  --panel-danger: #b3261e;
}

html {
  letter-spacing: 0;
}

body {
  background:
    linear-gradient(90deg, rgba(15, 107, 87, .06) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(32, 36, 42, .05) 0 1px, transparent 1px 100%),
    var(--panel-paper);
  background-size: 32px 32px;
}

.dark body {
  --panel-paper: #111315;
  --panel-line: #2d333b;
  background:
    linear-gradient(90deg, rgba(110, 167, 148, .08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(255, 255, 255, .04) 0 1px, transparent 1px 100%),
    var(--panel-paper);
}

.rounded-xl,
.rounded-lg,
.rounded {
  border-radius: 8px !important;
}

button,
select,
input,
textarea {
  font: inherit;
}

button {
  transition: transform .12s ease, background-color .12s ease, border-color .12s ease;
}

button:hover {
  transform: translateY(-1px);
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

th {
  font-weight: 650;
  color: var(--panel-muted);
}