/* Creature Lab (js/bestiary.js). */
.px-lab {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 1fr);
  gap: 18px;
  padding: 16px;
  border: 1px solid hsl(var(--th-bh) calc(24% * var(--th-bs)) 24%);
  background: hsl(var(--th-bh) calc(12% * var(--th-bs)) 8% / 0.7);
}
@media (max-width: 900px) {
  .px-lab {
    grid-template-columns: 1fr;
  }
}
.px-lab-form {
  display: grid;
  gap: 12px;
  align-content: start;
}
.px-lab label {
  display: grid;
  gap: 4px;
  font: 700 10.5px var(--head, sans-serif);
  letter-spacing: 0.1em;
  color: var(--muted, #9aa);
}
.px-lab-row {
  display: flex;
  gap: 8px;
  align-items: end;
  flex-wrap: wrap;
}
.px-lab-row label {
  flex: 1;
  min-width: 200px;
}
.px-lab-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}
.px-lab-traits {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 4px 12px;
}
.px-lab-traits > span {
  grid-column: 1 / -1;
  font: 700 10.5px var(--head, sans-serif);
  letter-spacing: 0.1em;
  color: var(--muted, #9aa);
}
.px-lab-traits label {
  display: flex;
  gap: 6px;
  align-items: center;
  font: 500 12.5px var(--font, sans-serif);
  letter-spacing: 0;
  color: inherit;
  cursor: pointer;
}
.px-lab-card {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 14px;
  border: 1px solid hsl(0 60% 45% / 0.6);
  background: hsl(0 30% 10% / 0.5);
}
.px-lab-title {
  font: 800 18px var(--head, sans-serif);
  letter-spacing: 0.04em;
}
.px-lab-sub {
  color: var(--muted, #9aa);
  font-size: 12.5px;
}
.px-lab-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.px-lab-stats span {
  display: grid;
  padding: 6px 8px;
  border: 1px solid #ffffff1c;
  font: 700 10px var(--head, sans-serif);
  letter-spacing: 0.1em;
  color: var(--muted, #9aa);
}
.px-lab-stats b {
  font-size: 17px;
  color: #fff;
  letter-spacing: 0;
}
.px-lab-attack {
  font-size: 13px;
}
.px-lab-tl {
  margin: 0;
  padding-left: 16px;
  font-size: 12.5px;
  display: grid;
  gap: 4px;
}
.px-lab-saved {
  margin-top: 10px;
}
.px-lab-saved summary {
  cursor: pointer;
  font: 700 11.5px var(--head, sans-serif);
  letter-spacing: 0.12em;
  color: var(--accent, #fff);
}
.px-lab-savedrow {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 6px 0;
  border-bottom: 1px solid #ffffff14;
}
.px-lab-savedrow span {
  flex: 1;
}
.px-lab-savedrow small {
  color: var(--muted, #9aa);
}
.pxe-src {
  font-style: normal;
  font-size: 9.5px;
  letter-spacing: 0.08em;
  padding: 1px 4px;
  border: 1px solid #ffffff33;
  color: var(--muted, #9aa);
  vertical-align: middle;
}