canvas { image-rendering: pixelated; }
.portrait { object-fit: contain; }
.select-card { border-radius: 4px; border-color: #536650; background: #1a3029ed; }
.select-card:nth-child(2) { border-color: #746653; background: #332f26ed; }
.select-card:nth-child(3) { border-color: #506a76; background: #20333ded; }
.select-card:nth-child(2):hover { background: #403d2fed; }
.select-card:nth-child(3):hover { background: #2a4450ed; }
.button, .icon-button, .name-input { border-radius: 3px; }
.selection h1, .hub h1, .identity strong { overflow-wrap: anywhere; }
@media (max-width: 650px) { .select-card .portrait { align-self: center; } }
.laboratory { max-width: 1220px; margin: auto; padding: 112px 28px 40px; pointer-events: auto; }
.lab-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.lab-heading h1 { font-size: 30px; margin: 0; }
.lab-heading .eyebrow { margin-bottom: 9px; }
.lab-layout { display: grid; grid-template-columns: minmax(300px, .85fr) minmax(450px, 1.15fr); gap: 40px; background: #10251def; padding: 26px; border-top: 1px solid #547062; }
.lab-name { display: flex; align-items: center; justify-content: space-between; gap: 12px; overflow-wrap: anywhere; font-size: 18px; }
.specimen-stage { height: 350px; display: grid; place-items: center; background: repeating-linear-gradient(0deg,transparent 0 31px,#b7cf8410 31px 32px),repeating-linear-gradient(90deg,transparent 0 31px,#b7cf8410 31px 32px); border-bottom: 2px solid #648f75; margin-top: 14px; }
#lab-preview { width: min(256px, 100%); height: auto; aspect-ratio: 1; object-fit: contain; }
.pose-tabs { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 18px; border: 1px solid #50665a; }
.pose-tabs button { pointer-events: auto; background: #172e25; border: 0; padding: 11px 7px; color: #b9cbbf; font-size: 12px; }
.pose-tabs button[aria-selected=true] { background: #b5dcb6; color: #16271e; }
.preset-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 19px; }
.preset-row span { font-size: 12px; color: #a4bcad; margin-right: auto; }
.preset-row .button { padding: 8px 12px; min-height: 36px; font-size: 12px; }
.part-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 18px; }
.part-field { display: flex; flex-direction: column; gap: 7px; font-size: 12px; color: #abc3b4; }
.part-field select { pointer-events: auto; width: 100%; min-width: 0; height: 42px; padding: 0 8px; border: 1px solid #526858; background: #20362c; color: #eff3e8; font: inherit; border-radius: 3px; }
.part-field select:focus-visible { outline: 2px solid #bfdfb0; outline-offset: 2px; }
.lab-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px 8px; border-top: 1px solid #415849; border-bottom: 1px solid #415849; padding: 20px 0; margin: 23px 0; }
.lab-stats dt { font-size: 11px; color: #91ad9d; }
.lab-stats dd { margin: 8px 0 0; font-size: 14px; color: #d6e6cb; overflow-wrap: anywhere; }
.lab-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.lab-actions .button { min-height: 43px; padding: 11px 16px; }
#lab-save-state { margin-right: auto; font-size: 11px; color: #d3b389; }
.edit-parts-btn { position: absolute; top: 156px; right: 4%; }
@media(max-width:1000px) {
  .lab-layout { grid-template-columns: minmax(240px,.8fr) minmax(360px,1.2fr); gap: 22px; padding: 20px; }
  .specimen-stage { height: 290px; }
}
@media(max-width:750px) {
  .laboratory { padding: 98px 16px 28px; }
  .lab-heading { align-items: flex-start; }
  .lab-heading h1 { font-size: 25px; }
  .lab-heading .button { font-size: 11px; min-height: 36px; padding: 8px; white-space: nowrap; }
  .lab-layout { grid-template-columns: minmax(0,1fr); padding: 16px; }
  .specimen-stage { height: 280px; }
  .lab-stats { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .lab-actions { justify-content: space-between; }
  #lab-save-state { width: 100%; }
  .edit-parts-btn { top: 131px; right: 18px; }
  .selection-footer .actions { justify-content: stretch; }
  .selection-footer .actions .button { flex: 1; }
}
