html,
body {
  background: #020617;
  color: #f8fafc;
  color-scheme: dark;
}

body {
  min-height: 100vh;
}

.lor-page,
.lor-dark-page {
  width: min(1180px, calc(100% - 2rem));
  margin-inline: auto;
  padding-block: 2rem;
  color: #f8fafc;
}

.lor-wide {
  width: min(1320px, calc(100% - 2rem));
}

.lor-page h1,
.lor-page h2,
.lor-page h3,
.lor-page h4,
.lor-page h5,
.lor-page h6,
.lor-dark-page h1,
.lor-dark-page h2,
.lor-dark-page h3,
.lor-dark-page h4,
.lor-dark-page h5,
.lor-dark-page h6 {
  color: #f8fafc !important;
}

.lor-page p,
.lor-page li,
.lor-page dd,
.lor-page dt,
.lor-page span,
.lor-page div,
.lor-dark-page p,
.lor-dark-page li,
.lor-dark-page dd,
.lor-dark-page dt,
.lor-dark-page span,
.lor-dark-page div {
  color: inherit;
}

.lor-page a,
.lor-dark-page a {
  color: #93c5fd;
}

.lor-page a:hover,
.lor-dark-page a:hover {
  color: #bfdbfe;
}

/* Main readable panels */
.lor-card,
.lor-panel,
.lor-list-item,
.lor-page .card,
.lor-page .list-group-item,
.lor-dark-page .card,
.lor-dark-page .list-group-item {
  background: #111827 !important;
  color: #f8fafc !important;
  border: 1px solid #334155 !important;
  border-radius: 0.875rem;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .24);
}

.lor-panel-soft {
  background: #1e293b !important;
  color: #f8fafc !important;
  border: 1px solid #475569 !important;
  border-radius: .75rem;
}

.lor-card-body {
  padding: 1rem;
}

.lor-muted {
  color: #cbd5e1 !important;
}

/* Stop old light Tailwind cards from staying white */
.lor-page .bg-white,
.lor-page .bg-gray-50,
.lor-page .bg-gray-100,
.lor-page .bg-slate-50,
.lor-page .bg-slate-100,
.lor-dark-page .bg-white,
.lor-dark-page .bg-gray-50,
.lor-dark-page .bg-gray-100,
.lor-dark-page .bg-slate-50,
.lor-dark-page .bg-slate-100 {
  background-color: #111827 !important;
  color: #f8fafc !important;
}

.lor-page .bg-gray-200,
.lor-page .bg-gray-300,
.lor-page .bg-slate-200,
.lor-page .bg-slate-300,
.lor-dark-page .bg-gray-200,
.lor-dark-page .bg-gray-300,
.lor-dark-page .bg-slate-200,
.lor-dark-page .bg-slate-300 {
  background-color: #1e293b !important;
  color: #f8fafc !important;
}

/* Fix unreadable gray text */
.lor-page .text-gray-900,
.lor-page .text-gray-800,
.lor-page .text-slate-900,
.lor-page .text-slate-800,
.lor-dark-page .text-gray-900,
.lor-dark-page .text-gray-800,
.lor-dark-page .text-slate-900,
.lor-dark-page .text-slate-800 {
  color: #f8fafc !important;
}

.lor-page .text-gray-700,
.lor-page .text-gray-600,
.lor-page .text-slate-700,
.lor-page .text-slate-600,
.lor-dark-page .text-gray-700,
.lor-dark-page .text-gray-600,
.lor-dark-page .text-slate-700,
.lor-dark-page .text-slate-600 {
  color: #e5e7eb !important;
}

.lor-page .text-gray-500,
.lor-page .text-gray-400,
.lor-page .text-slate-500,
.lor-page .text-slate-400,
.lor-page .text-slate-300,
.lor-dark-page .text-gray-500,
.lor-dark-page .text-gray-400,
.lor-dark-page .text-slate-500,
.lor-dark-page .text-slate-400,
.lor-dark-page .text-slate-300 {
  color: #cbd5e1 !important;
}

/* Borders */
.lor-page .border-gray-100,
.lor-page .border-gray-200,
.lor-page .border-gray-300,
.lor-page .border-slate-100,
.lor-page .border-slate-200,
.lor-page .border-slate-300,
.lor-dark-page .border-gray-100,
.lor-dark-page .border-gray-200,
.lor-dark-page .border-gray-300,
.lor-dark-page .border-slate-100,
.lor-dark-page .border-slate-200,
.lor-dark-page .border-slate-300 {
  border-color: #334155 !important;
}

.lor-page .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.lor-page .divide-gray-200 > :not([hidden]) ~ :not([hidden]),
.lor-dark-page .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.lor-dark-page .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
  border-color: #334155 !important;
}

/* Hover */
.lor-page .hover\:bg-gray-50:hover,
.lor-page .hover\:bg-gray-100:hover,
.lor-page .hover\:bg-slate-50:hover,
.lor-page .hover\:bg-slate-100:hover,
.lor-dark-page .hover\:bg-gray-50:hover,
.lor-dark-page .hover\:bg-gray-100:hover,
.lor-dark-page .hover\:bg-slate-50:hover,
.lor-dark-page .hover\:bg-slate-100:hover {
  background-color: #1e293b !important;
}

/* Tables */
.lor-table-wrap,
.lor-page .table-wrap,
.lor-dark-page .table-wrap {
  overflow-x: auto;
  background: #111827 !important;
  border: 1px solid #334155 !important;
  border-radius: .875rem;
}

.lor-page table,
.lor-dark-page table {
  width: 100%;
  border-collapse: collapse;
  color: #f8fafc !important;
}

.lor-page table th,
.lor-dark-page table th {
  background: #1e293b !important;
  color: #f8fafc !important;
  border-color: #334155 !important;
}

.lor-page table td,
.lor-dark-page table td {
  background: #111827 !important;
  color: #f8fafc !important;
  border-color: #334155 !important;
}

.lor-page table tr:hover td,
.lor-dark-page table tr:hover td {
  background: #243449 !important;
}

/* Forms */
.lor-page input:not([type="checkbox"]):not([type="radio"]),
.lor-page select,
.lor-page textarea,
.lor-page .form-control,
.lor-page .form-select,
.lor-dark-page input:not([type="checkbox"]):not([type="radio"]),
.lor-dark-page select,
.lor-dark-page textarea {
  background: #020617 !important;
  color: #f8fafc !important;
  border: 1px solid #475569 !important;
}

.lor-page input::placeholder,
.lor-page textarea::placeholder,
.lor-dark-page input::placeholder,
.lor-dark-page textarea::placeholder {
  color: #94a3b8 !important;
}

/* Badges / tags */
.lor-chip,
.lor-page .badge,
.lor-page .tag,
.lor-dark-page .badge,
.lor-dark-page .tag {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid #475569 !important;
  background: #1e293b !important;
  color: #f8fafc !important;
  padding: .15rem .55rem;
  font-size: .75rem;
  line-height: 1.2;
}

/* Rich text / rulebook content */
.lor-page .prose,
.lor-page .richhtml,
.lor-dark-page .prose,
.lor-dark-page .richhtml {
  color: #e5e7eb !important;
}

.lor-page .prose :where(p, li, dd, dt),
.lor-page .richhtml :where(p, li, dd, dt),
.lor-dark-page .prose :where(p, li, dd, dt),
.lor-dark-page .richhtml :where(p, li, dd, dt) {
  color: #e5e7eb !important;
}

.lor-page .prose :where(h1,h2,h3,h4,strong),
.lor-page .richhtml :where(h1,h2,h3,h4,strong),
.lor-dark-page .prose :where(h1,h2,h3,h4,strong),
.lor-dark-page .richhtml :where(h1,h2,h3,h4,strong) {
  color: #f8fafc !important;
}

.lor-page .prose a,
.lor-page .richhtml a,
.lor-dark-page .prose a,
.lor-dark-page .richhtml a {
  color: #93c5fd !important;
}

.lor-page code,
.lor-dark-page code {
  color: #fde68a !important;
  background: #020617 !important;
  border: 1px solid #334155;
  border-radius: .25rem;
  padding: .05rem .25rem;
}