body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

.card + .card {
  margin-top: 1rem;
}

.variant-card {
  background-color: #1f1f1f;
  border: 1px solid #333;
}

.monster-feature {
  max-width: 720px;
  width: 100%;
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.35);
}

.monster-art-frame {
  background-color: #0d0d0d;
  border-radius: 0.75rem;
  border: 1px solid #2c2c2c;
  padding: 0.5rem;
}

.monster-art-card .btn {
  min-width: 9rem;
}

.monster-art-preview {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background-color: #0d0d0d;
}

.variant-card .card-header {
  background-color: #2c2c2c;
  border-bottom: 1px solid #444;
  color: #f1f3f5;
}

.variant-card .card-header .text-muted,
.variant-card .card-header small,
.variant-card .card-header .badge,
.variant-card .card-header label {
  color: #f8f9fa !important;
}

.stat-grid {
  background-color: #101010;
  border-radius: 0.5rem;
  padding: 0.5rem;
  margin-bottom: 1rem;
}

.stat-grid .border {
  background-color: #181818;
  border-color: #2d2d2d !important;
}

pre {
  background-color: #111;
  color: #ddd;
  padding: 1rem;
  border-radius: 0.5rem;
  max-height: 24rem;
  overflow: auto;
}

.table-hover tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.05);
}

.badge-bg {
  background-color: #343434;
  border-radius: 999px;
  padding: 0.25rem 0.75rem;
}

.search-summary {
  margin-bottom: 1rem;
}

.stat-grid .border > div:nth-of-type(2),
.stat-grid .border > div:nth-of-type(2) span {
  color: #f8f9fa;
  font-weight: 600;
}

.stat-grid .border .small.text-secondary {
  color: #cfd4da !important;
}

.variant-card .card-body {
  color: #e8eaed;
}

.variant-card .card-title a {
  color: #8bd3ff !important;
}

.variant-card .card-title a:hover,
.variant-card .card-title a:focus {
  color: #c6e6ff !important;
  text-decoration: underline;
}

.variant-card .card-text,
.variant-card .card-text small {
  color: #c5cbd3 !important;
}

.card.bg-dark {
  color: #e8eaed;
}

.card.bg-dark .card-body,
.card.bg-dark .card-text,
.card.bg-dark .form-label {
  color: #e8eaed;
}

.card.bg-dark .card-title {
  color: #f8f9fa;
}

.card.bg-dark .text-secondary {
  color: #b8bec8 !important;
}

.card.bg-dark .form-label {
  font-weight: 500;
}

.variant-card .btn-outline-info {
  color: #8bd3ff;
  border-color: #8bd3ff;
}

.variant-card .btn-outline-info:hover,
.variant-card .btn-outline-info:focus {
  background-color: #8bd3ff;
  color: #0a1a24;
  border-color: #8bd3ff;
}

.accordion-button.bg-secondary {
  background-color: #2c2c2c !important;
  color: #f1f3f5;
}

.accordion-item {
  border-color: #3a3a3a !important;
}

.accordion-button:not(.collapsed) {
  background-color: #3a3a3a !important;
  color: #fff;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.accordion-button:focus {
  box-shadow: 0 0 0 0.2rem rgba(139, 211, 255, 0.25);
}

.skill-summary-table th {
  color: #9ea6b0;
  width: 30%;
}

code {
  background-color: #1d1f22;
  color: #e8eaed;
  padding: 0.1rem 0.35rem;
  border-radius: 0.3rem;
  font-size: 0.9em;
}
