/* PROXIMA // Base theme, layout and most screen styles (originally the first <style> block). */
:root {
  color-scheme: dark;
  --bg: hsl(calc(var(--th-bh) + 35) calc(31% * var(--th-bs)) 5.7%);
  --panel: hsl(calc(var(--th-bh) + 29.3) calc(25.9% * var(--th-bs)) 10.6%);
  --panel2: hsl(calc(var(--th-bh) + 32.9) calc(26% * var(--th-bs)) 14.3%);
  --panel3: hsl(calc(var(--th-bh) + 30.5) calc(24.4% * var(--th-bs)) 17.6%);
  --line: hsl(calc(var(--th-bh) + 30.5) calc(20.8% * var(--th-bs)) 20.8%);
  --ink: #ecf2fb;
  --sub: #9aa9bd;
  --dim: #718198;
  --red: #ee444a;
  --red2: #a82431;
  --blue: #67b9e9;
  --green: #7dd7b1;
  --amber: hsl(calc(var(--th-h) + -9.8) calc(81% * var(--th-s)) calc(69% + var(--th-l)));
  --font: 'Inter', system-ui, sans-serif;
  --head: 'Barlow Condensed', 'Arial Narrow', sans-serif;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 14px;
}
body {
  background-image: radial-gradient(ellipse at 83% -15%, rgba(80, 101, 136, 0.12), transparent 45%),
    linear-gradient(110deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
  background-size:
    auto,
    44px 44px;
}
button,
input,
select,
textarea {
  font: inherit;
}
button {
  cursor: pointer;
}
a {
  color: var(--blue);
}
input,
select,
textarea {
  outline: none;
  color: var(--ink);
  background: hsl(calc(var(--th-bh) + 28.8) calc(32% * var(--th-bs)) 9.8%);
  border: 1px solid #334257;
  border-radius: 7px;
  padding: 9px 10px;
  min-width: 0;
  width: 100%;
  transition: border-color 0.2s;
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 2px #67b9e922;
}
input[type='checkbox'] {
  width: 16px;
  height: 16px;
  accent-color: var(--red);
}
input[type='range'] {
  accent-color: var(--red);
}
input[type='number'] {
  font-variant-numeric: tabular-nums;
}
textarea {
  resize: vertical;
  min-height: 90px;
}
button:focus-visible {
  outline: 2px solid var(--blue);
  outline-offset: 2px;
}
button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.layout {
  display: grid;
  grid-template-columns: 235px 1fr;
  min-height: 100vh;
}
.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  border-right: 1px solid var(--line);
  background: hsl(calc(var(--th-bh) + 31.9) calc(33.3% * var(--th-bs)) 7.6%);
  display: flex;
  flex-direction: column;
  padding: 26px 16px;
  z-index: 5;
}
.logo {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 1px 9px 30px;
}
.n7-mark {
  font-family: var(--head);
  font-weight: 800;
  font-size: 40px;
  letter-spacing: -3px;
  line-height: 1;
}
.n7-mark span {
  color: var(--red);
}
.logo-title {
  font-family: var(--head);
  font-size: 21px;
  font-weight: 700;
  letter-spacing: 1px;
}
.micro {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  color: var(--dim);
  font-weight: 700;
}
.nav-label {
  padding: 20px 12px 10px;
}
.nav-btn {
  width: 100%;
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #a4b2c4;
  padding: 12px 14px;
  margin: 2px 0;
  text-align: left;
  border-radius: 7px;
  font-weight: 600;
}
.nav-btn:hover {
  background: hsl(calc(var(--th-bh) + 30.5) calc(29.7% * var(--th-bs)) 14.5%);
  color: white;
}
.nav-btn.active {
  background: linear-gradient(
    90deg,
    #70232a80,
    hsl(calc(var(--th-bh) + 33.8) calc(20% * var(--th-bs)) 16.7% / 0.3)
  );
  color: #fff;
  border-left: 3px solid var(--red);
}
.nav-btn .ico {
  font-size: 18px;
  width: 22px;
  text-align: center;
}
.side-bottom {
  margin-top: auto;
  padding: 20px 10px 5px;
  border-top: 1px solid var(--line);
}
.online {
  color: var(--green);
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}
.online:before {
  content: '';
  width: 7px;
  height: 7px;
  background: var(--green);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--green);
}
.main {
  min-width: 0;
}
.topbar {
  height: 76px;
  background: hsl(calc(var(--th-bh) + 30) calc(27.3% * var(--th-bs)) 8.6% / 0.8);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
  padding: 0 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  position: sticky;
  top: 0;
  z-index: 4;
}
.topbar h1 {
  font-family: var(--head);
  font-size: 27px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  font-weight: 700;
  margin: 0;
}
.top-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}
.avatar {
  background: hsl(calc(var(--th-bh) + 26) calc(27.9% * var(--th-bs)) 21.8%);
  border: 1px solid #426079;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-weight: 700;
  color: var(--blue);
}
.content {
  padding: 28px 38px 60px;
  max-width: 1610px;
  margin: auto;
}
.notice {
  background: hsl(calc(var(--th-bh) + 31) calc(33.3% * var(--th-bs)) 14.7%);
  border: 1px solid #38506c;
  border-left: 3px solid var(--blue);
  padding: 13px 16px;
  border-radius: 8px;
  color: #bed1e4;
  line-height: 1.55;
}
.notice.warn {
  border-color: #7a4d2d;
  border-left-color: var(--amber);
  background: #29211c;
  color: hsl(calc(var(--th-h) + -13.5) calc(71.1% * var(--th-s)) calc(83.7% + var(--th-l)));
}
.notice.good {
  border-color: #2b6854;
  border-left-color: var(--green);
  background: hsl(calc(var(--th-bh) + -20.8) calc(32.2% * var(--th-bs)) 11.6%);
  color: #bcf3da;
}
.hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 22px;
  gap: 20px;
}
.hero h2 {
  margin: 4px 0;
  font-family: var(--head);
  font-size: 44px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1;
}
.hero p {
  margin: 6px 0 0;
  color: var(--sub);
}
.eyebrow {
  font-family: var(--head);
  color: var(--red);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 3px;
  font-size: 14px;
}
.section-title {
  display: flex;
  align-items: center;
  gap: 13px;
  font-family: var(--head);
  font-size: 21px;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  margin: 27px 0 13px;
  font-weight: 700;
}
.section-title:after {
  content: '';
  height: 1px;
  background: var(--line);
  flex: 1;
}
.grid {
  display: grid;
  gap: 16px;
}
.grid.kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.grid.twocol {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid.threecol {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid.side {
  grid-template-columns: minmax(0, 1.6fr) minmax(285px, 1fr);
}
.card {
  background: linear-gradient(
    140deg,
    hsl(calc(var(--th-bh) + 31) calc(27.8% * var(--th-bs)) 14.1%),
    hsl(calc(var(--th-bh) + 30.3) calc(29.8% * var(--th-bs)) 11.2%)
  );
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 19px;
  min-width: 0;
}
.card.flat {
  background: hsl(calc(var(--th-bh) + 30.3) calc(28.8% * var(--th-bs)) 11.6%);
}
.card-title {
  margin: 0 0 15px;
  font-family: var(--head);
  font-size: 19px;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  font-weight: 700;
}
.kpi {
  padding: 17px 18px;
  position: relative;
  overflow: hidden;
}
.kpi:after {
  content: '';
  position: absolute;
  right: -16px;
  bottom: -16px;
  border: 1px solid #ffffff0b;
  width: 70px;
  height: 70px;
  transform: rotate(45deg);
}
.kpi .metric {
  font-family: var(--head);
  font-size: 38px;
  font-weight: 700;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}
.kpi .metric.red {
  color: var(--red);
}
.kpi .metric.blue {
  color: var(--blue);
}
.kpi .metric.green {
  color: var(--green);
}
.kpi .metric.amber {
  color: var(--amber);
}
.kpi .meta {
  font-size: 11px;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--sub);
  margin-bottom: 11px;
}
.kpi small {
  color: var(--dim);
}
.bar-track {
  height: 7px;
  border-radius: 5px;
  background: hsl(calc(var(--th-bh) + 28.8) calc(38.1% * var(--th-bs)) 8.2%);
  overflow: hidden;
  margin: 11px 0 7px;
}
.bar-track > div {
  height: 100%;
  border-radius: 5px;
  transition: width 0.2s;
}
.bar-hp {
  background: linear-gradient(90deg, #a82234, var(--red));
}
.bar-kb {
  background: linear-gradient(90deg, #1e7da7, var(--blue));
}
.field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
}
.field label {
  font-size: 11px;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: var(--sub);
  font-weight: 700;
}
.field-note {
  color: var(--dim);
  font-size: 11px;
  line-height: 1.5;
}
.fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.fields.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fields.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.btn {
  background: hsl(calc(var(--th-bh) + 27.9) calc(29% * var(--th-bs)) 21%);
  border: 1px solid #3a5167;
  color: var(--ink);
  border-radius: 7px;
  padding: 9px 14px;
  font-weight: 700;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.btn:hover {
  background: #344659;
}
.btn.red {
  background: #b52d3c;
  border-color: #d93b4a;
  color: white;
}
.btn.red:hover {
  background: #d13243;
}
.btn.ghost {
  background: transparent;
  border-color: #344154;
}
.btn.small {
  font-size: 12px;
  padding: 7px 10px;
}
.btn.green {
  background: hsl(calc(var(--th-bh) + -23.1) calc(40.2% * var(--th-bs)) 21%);
  border-color: #33765c;
}
.btn.full {
  width: 100%;
}
.btn-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.chip {
  font-size: 11px;
  letter-spacing: 0.2px;
  border: 1px solid #3e5062;
  padding: 5px 8px;
  border-radius: 6px;
  color: #afc5dc;
  background: hsl(calc(var(--th-bh) + 26.2) calc(26.9% * var(--th-bs)) 18.2%);
  display: inline-flex;
  gap: 5px;
  align-items: center;
}
.chip.red {
  background: #422027;
  border-color: #7f303c;
  color: #ffa6ad;
}
.chip.green {
  color: #9de5c7;
  border-color: #346a56;
  background: hsl(calc(var(--th-bh) + -24.3) calc(32.6% * var(--th-bs)) 16.9%);
}
.chip.amber {
  color: hsl(calc(var(--th-h) + -10.5) calc(78.4% * var(--th-s)) calc(80% + var(--th-l)));
  border-color: #755333;
  background: #382b20;
}
.muted {
  color: var(--sub);
}
.tiny {
  font-size: 12px;
}
.divider {
  border-top: 1px solid var(--line);
  margin: 16px 0;
}
.statrow {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  border-bottom: 1px solid hsl(calc(var(--th-bh) + 29.3) calc(19.6% * var(--th-bs)) 21%);
  padding: 9px 0;
}
.statrow:last-child {
  border-bottom: 0;
}
.statrow strong {
  font-variant-numeric: tabular-nums;
}
.scoregrid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 9px;
}
.score {
  text-align: center;
  border: 1px solid #34404e;
  background: hsl(calc(var(--th-bh) + 29.3) calc(36.8% * var(--th-bs)) 11.2%);
  border-radius: 9px;
  padding: 12px 5px;
}
.score span {
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--sub);
  font-weight: 700;
}
.score .num {
  font-family: var(--head);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.15;
}
.score .mod {
  font-size: 13px;
  color: var(--blue);
  font-weight: 700;
}
.score input {
  padding: 6px;
  text-align: center;
  margin-top: 9px;
}
.power-row,
.item-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid hsl(calc(var(--th-bh) + 29.3) calc(19.3% * var(--th-bs)) 21.4%);
}
.power-row:last-child,
.item-row:last-child {
  border: 0;
}
.power-name {
  font-weight: 700;
}
.power-note {
  color: var(--sub);
  font-size: 12px;
  margin-top: 5px;
  line-height: 1.5;
}
.power-right {
  display: flex;
  align-items: center;
  gap: 9px;
}
.power-right select {
  max-width: 75px;
}
.mini-counter {
  display: flex;
  align-items: center;
  gap: 7px;
}
.slot-line {
  display: grid;
  grid-template-columns: 75px 1fr 70px;
  gap: 10px;
  align-items: center;
  margin: 10px 0;
}
.slot-pips {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.pip {
  height: 13px;
  width: 13px;
  border-radius: 3px;
  background: #3b4d62;
  border: 1px solid #6281a0;
  cursor: pointer;
}
.pip.available {
  background: #5ca8d5;
  border-color: #a2d7f5;
}
.pip.used {
  background: hsl(calc(var(--th-bh) + 29.7) calc(19.2% * var(--th-bs)) 19.4%);
  border-color: #42536a;
}
.pill-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--sub);
  padding: 6px 0;
}
.pill-toggle input {
  width: 16px;
}
.tabs {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.tab {
  background: hsl(calc(var(--th-bh) + 31) calc(32.3% * var(--th-bs)) 12.2%);
  border: 1px solid #354356;
  border-radius: 7px;
  padding: 8px 12px;
  color: var(--sub);
  font-weight: 700;
}
.tab.active {
  background: #722732;
  color: white;
  border-color: #b93a48;
}
.empty {
  padding: 24px;
  text-align: center;
  background: hsl(calc(var(--th-bh) + 28.3) calc(33.3% * var(--th-bs)) 10.6%);
  border: 1px dashed #3d4a5c;
  border-radius: 9px;
  color: var(--sub);
  line-height: 1.7;
}
.helper {
  background: hsl(calc(var(--th-bh) + 30.3) calc(34.7% * var(--th-bs)) 9.6%);
  border-left: 2px solid var(--red);
  padding: 10px 13px;
  font-size: 12px;
  color: var(--sub);
  line-height: 1.5;
  margin: 10px 0 17px;
}
.label-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 11px;
}
.scroll {
  max-height: 480px;
  overflow: auto;
  padding-right: 4px;
}
.filter {
  max-width: 360px;
}
.table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.table th {
  text-align: left;
  color: var(--dim);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 10px 9px;
  border-bottom: 1px solid var(--line);
}
.table td {
  padding: 11px 9px;
  border-bottom: 1px solid hsl(calc(var(--th-bh) + 26.3) calc(23.2% * var(--th-bs)) 19.4%);
}
.table tr:hover td {
  background: #ffffff04;
}
.alertlist {
  display: grid;
  gap: 8px;
}
.alert {
  background: #38221f;
  border: 1px solid #654137;
  color: #f8c6a5;
  border-radius: 6px;
  padding: 9px 12px;
  font-size: 12px;
}
.toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  padding: 13px 17px;
  background: hsl(calc(var(--th-bh) + -27.5) calc(27.3% * var(--th-bs)) 17.3%);
  border: 1px solid #529477;
  color: #d8fff0;
  border-radius: 10px;
  box-shadow: 0 15px 45px #0008;
  z-index: 30;
  max-width: 340px;
}
.footer {
  color: var(--dim);
  font-size: 11px;
  margin-top: 30px;
  padding: 20px 0;
  border-top: 1px solid var(--line);
  line-height: 1.7;
}
.loading {
  display: flex;
  flex-direction: column;
  gap: 15px;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  color: var(--sub);
  letter-spacing: 2px;
}
.top-identity {
  display: flex;
  align-items: center;
  gap: 10px;
}
.credit {
  font-family: var(--head);
  font-weight: 700;
  font-size: 25px;
  color: var(--amber);
}
.subtle {
  font-size: 12px;
  color: var(--sub);
  line-height: 1.5;
}
.check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 15px;
}
.check-line {
  display: flex;
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid hsl(calc(var(--th-bh) + 28.6) calc(23.4% * var(--th-bs)) 21%);
  padding: 10px 0;
  font-size: 12px;
}
.check-line span {
  flex: 1;
}
.select-inline {
  max-width: 250px;
}
.form-error {
  color: #ff9da4;
  font-size: 12px;
}
.lozenge {
  color: var(--blue);
  font-size: 11px;
  letter-spacing: 1px;
  font-weight: 800;
  text-transform: uppercase;
}
.right {
  margin-left: auto;
}
.hidden {
  display: none;
}
.wide {
  grid-column: 1/-1;
}
@media (max-width: 1220px) {
  .grid.kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .grid.side {
    grid-template-columns: 1fr;
  }
  .scoregrid {
    grid-template-columns: repeat(3, 1fr);
  }
  .content {
    padding: 24px;
  }
  .topbar {
    padding: 0 24px;
  }
}
@media (max-width: 800px) {
  .layout {
    grid-template-columns: 1fr;
  }
  .sidebar {
    position: static;
    height: auto;
    padding: 12px;
    flex-direction: row;
    align-items: center;
    overflow-x: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .logo {
    padding: 0 12px 0 3px;
    flex-shrink: 0;
  }
  .logo-title,
  .logo .micro,
  .nav-label,
  .side-bottom {
    display: none;
  }
  .n7-mark {
    font-size: 30px;
  }
  .nav-btn {
    padding: 9px 12px;
    white-space: nowrap;
    width: auto;
  }
  .nav-btn .ico {
    display: none;
  }
  .topbar {
    height: 65px;
  }
  .topbar h1 {
    font-size: 22px;
  }
  .content {
    padding: 20px 14px;
  }
  .hero h2 {
    font-size: 35px;
  }
  .grid.kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .grid.twocol,
  .grid.threecol {
    grid-template-columns: 1fr;
  }
  .fields.four,
  .fields.three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .scoregrid {
    grid-template-columns: repeat(3, 1fr);
  }
  .top-identity .micro {
    display: none;
  }
  .power-row {
    grid-template-columns: 1fr;
  }
  .power-right {
    justify-content: flex-start;
  }
  .table {
    font-size: 12px;
  }
}

.codex-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.codex-stats > div {
  padding: 12px;
  background: hsl(calc(var(--th-bh) + 26.8) calc(34.7% * var(--th-bs)) 9.6%);
  border: 1px solid #304052;
  border-radius: 8px;
}
.codex-stats strong {
  display: block;
  font-size: 26px;
  color: var(--blue);
}
.codex-stats small {
  color: var(--sub);
  font-size: 11px;
}
.codex-list {
  max-height: 570px;
}
.codex-count {
  padding: 10px;
  color: var(--sub);
  font-size: 11px;
  letter-spacing: 0.7px;
}
.codex-entry {
  border-bottom: 1px solid #304052;
  padding: 5px 0;
}
.codex-entry summary {
  list-style: none;
  display: flex;
  gap: 15px;
  align-items: center;
  justify-content: space-between;
  padding: 12px;
  cursor: pointer;
}
.codex-entry summary::-webkit-details-marker {
  display: none;
}
.codex-entry summary strong {
  font-size: 13px;
}
.codex-entry summary span {
  font-size: 11px;
  color: var(--sub);
  text-align: right;
}
.codex-entry-body {
  padding: 2px 14px 17px;
  color: #d4dce7;
  font-size: 12px;
  line-height: 1.7;
}
.codex-entry-body p {
  color: var(--sub);
}
.codex-entry[open] {
  background: hsl(calc(var(--th-bh) + 30) calc(27.3% * var(--th-bs)) 17.3%);
  border-radius: 5px;
}
@media (max-width: 600px) {
  .codex-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .codex-entry summary {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }
}

.condition-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 12px 0;
}
.condition-tile {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  border: 1px solid #354252;
  border-radius: 8px;
  background: hsl(calc(var(--th-bh) + 28.8) calc(32% * var(--th-bs)) 9.8%);
  padding: 9px 11px;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
  transition:
    border-color 0.15s,
    background 0.15s;
}
.condition-tile:hover {
  border-color: #7b90a9;
}
.condition-tile.on {
  background: hsl(calc(var(--th-bh) + -13.6) calc(15.6% * var(--th-bs)) 17.6%);
  border-color: #53aa8a;
  color: #ddffe9;
}
.condition-tile input {
  accent-color: #69d6a4;
  width: 17px;
  height: 17px;
  flex: none;
  margin: 0;
  cursor: pointer;
}
.status-list {
  display: grid;
  gap: 8px;
}
.status-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid hsl(calc(var(--th-bh) + 27.3) calc(22% * var(--th-bs)) 23.1%);
  background: hsl(calc(var(--th-bh) + 28.8) calc(32% * var(--th-bs)) 9.8%);
  border-radius: 8px;
  padding: 12px;
}
.status-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.status-actions select {
  width: 145px;
  font-size: 12px;
  padding: 7px;
}
.compact-list {
  max-height: 260px;
  overflow: auto;
  border: 1px solid #313f4f;
  border-radius: 8px;
  padding: 9px;
}
.power-row {
  align-items: flex-start;
}
.power-right {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 7px;
  min-width: 120px;
}
.power-right select {
  min-width: 116px;
  max-width: 170px;
}
.power-note {
  max-width: 660px;
}
.power-row .power-right label {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
@media (max-width: 900px) {
  .condition-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .status-item {
    align-items: flex-start;
  }
}
@media (max-width: 500px) {
  .condition-grid {
    grid-template-columns: 1fr;
  }
  .status-item {
    flex-direction: column;
  }
  .status-actions {
    width: 100%;
    justify-content: flex-end;
  }
  .power-right {
    min-width: 100px;
  }
}

.manual-index {
  max-height: 540px;
  overflow: auto;
  margin-top: 12px;
  padding-right: 6px;
}
.manual-index .statrow {
  align-items: center;
  gap: 14px;
  padding: 11px 6px;
}
.manual-index .statrow > div {
  flex: 1;
}
.manual-frame {
  width: 100%;
  height: 76vh;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: white;
}
.manual-text-scroll {
  max-height: 70vh;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 13px;
  line-height: 1.62;
  background: var(--panel2);
  padding: 22px;
  border-radius: 8px;
  margin-top: 12px;
}
.manual-hit {
  margin: 7px 0;
  padding: 10px;
  background: var(--panel2);
  border-left: 2px solid var(--red);
  line-height: 1.5;
}
.implant-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.3fr) minmax(155px, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.implant-row select {
  min-width: 0;
}
.slot-line {
  min-height: 34px;
}
.slot-line .slot-pips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
@media (max-width: 780px) {
  .implant-row {
    grid-template-columns: 1fr;
  }
}

.unlock-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.unlock-card {
  background: linear-gradient(
    145deg,
    hsl(calc(var(--th-bh) + 25) calc(28.2% * var(--th-bs)) 15.3%),
    hsl(calc(var(--th-bh) + 30.3) calc(28.8% * var(--th-bs)) 11.6%)
  );
  border: 1px solid #384754;
  border-left: 4px solid #d63f4a;
  padding: 16px;
  border-radius: 10px;
  min-width: 0;
}
.unlock-card.locked {
  opacity: 0.57;
  border-left-color: #647180;
}
.unlock-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.unlock-top h3 {
  font-size: 16px;
  margin: 5px 0 8px;
  letter-spacing: 0.2px;
}
.unlock-description {
  font-size: 12px;
  color: #c2ced7;
  line-height: 1.65;
  margin: 6px 0 12px;
  max-height: 180px;
  overflow: auto;
  white-space: normal;
}
.feature-choices {
  display: grid;
  gap: 9px;
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid #32424f;
}
.feature-choice {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.feature-choice label {
  font-size: 11px;
  color: #d8e1e8;
}
.feature-choice small {
  color: hsl(calc(var(--th-h) + -5.8) calc(83.4% * var(--th-s)) calc(71.6% + var(--th-l)));
  line-height: 1.4;
}
.feature-choice input,
.feature-choice select {
  max-width: 100%;
  width: 100%;
}
.feature-flags {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.feature-flags .pill-toggle {
  font-size: 12px;
}
@media (max-width: 850px) {
  .unlock-list {
    grid-template-columns: 1fr;
  }
}

.wizard-steps {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  margin: 16px 0 22px;
}
.wizard-step {
  border: 1px solid #344255;
  background: hsl(calc(var(--th-bh) + 26.4) calc(35.6% * var(--th-bs)) 11.6%);
  color: #aabbd0;
  border-radius: 9px;
  padding: 9px 4px;
  font-size: 11px;
  line-height: 1.3;
  min-height: 58px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.wizard-step span {
  background: hsl(calc(var(--th-bh) + 26.8) calc(29.8% * var(--th-bs)) 22.4%);
  border-radius: 50%;
  height: 21px;
  width: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
}
.wizard-step.current {
  border-color: #f15c65;
  background: #3b1d27;
  color: #fff;
}
.wizard-step.current span {
  background: #ee444a;
  color: #fff;
}
.wizard-step.passed {
  border-color: #3b7566;
  color: #b8ead5;
}
.wizard-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin: 20px 0 35px;
}
.expertise-grant,
.advancement-card {
  padding: 14px;
  background: hsl(calc(var(--th-bh) + 28) calc(37% * var(--th-bs)) 10.6%);
  border: 1px solid #304055;
  border-radius: 10px;
  margin: 10px 0;
}
.expertise-grant small,
.adv-option small {
  display: block;
  color: #99a9bd;
  font-size: 12px;
  line-height: 1.45;
  margin-top: 4px;
}
.expertise-choice {
  display: grid;
  grid-template-columns: 95px 1fr;
  align-items: center;
  gap: 14px;
  margin: 9px 0;
}
.expertise-choice span {
  font-size: 12px;
  color: #9baac0;
}
.advancement-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.adv-grid {
  display: grid;
  gap: 7px;
  margin-top: 12px;
}
.adv-option {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #364559;
  background: hsl(calc(var(--th-bh) + 27.5) calc(31.6% * var(--th-bs)) 14.9%);
  cursor: pointer;
}
.adv-option input {
  width: 16px;
  min-width: 16px;
  margin: 3px 0 0;
  flex: 0 0 16px;
}
.adv-option.is-selected {
  border-color: #79d4ac;
  background: hsl(calc(var(--th-bh) + -10.5) calc(29.7% * var(--th-bs)) 14.5%);
}
.power-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 7px 0;
}
.fact-chip {
  font-size: 11px;
  padding: 5px 8px;
  border-radius: 6px;
  border: 1px solid #3a4658;
  background: hsl(calc(var(--th-bh) + 26.2) calc(31.6% * var(--th-bs)) 15.5%);
  color: #bcd0e5;
}
.fact-chip b {
  font-size: 10px;
  color: hsl(calc(var(--th-h) + -5.8) calc(81.2% * var(--th-s)) calc(70.8% + var(--th-l)));
  margin-right: 5px;
  letter-spacing: 0.4px;
}
@media (max-width: 1000px) {
  .wizard-steps {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 620px) {
  .wizard-steps {
    grid-template-columns: repeat(2, 1fr);
  }
  .expertise-choice {
    grid-template-columns: 1fr;
  }
  .advancement-list {
    grid-template-columns: 1fr;
  }
}
\n :root {
  color-scheme: dark;
  --bg: hsl(calc(var(--th-bh) + 10) calc(18.2% * var(--th-bs)) 4.3%);
  --panel: hsl(calc(var(--th-bh) + 17.5) calc(19% * var(--th-bs)) 8.2%);
  --panel2: hsl(calc(var(--th-bh) + 10) calc(15.4% * var(--th-bs)) 10.2%);
  --panel3: hsl(calc(var(--th-bh) + 8.3) calc(12.3% * var(--th-bs)) 14.3%);
  --line: #3b403b;
  --ink: #eff1e9;
  --sub: #afb3a8;
  --dim: #858c84;
  --red: #d55942;
  --red2: #9b402e;
  --blue: #84bfc1;
  --green: #8ec9a1;
  --amber: hsl(calc(var(--th-h) + 0.3) calc(72.4% * var(--th-s)) calc(55.9% + var(--th-l)));
  --font: 'Segoe UI', Arial, sans-serif;
  --head: Consolas, 'Liberation Mono', 'Courier New', monospace;
}
html,
body {
  background: hsl(calc(var(--th-bh) + 10) calc(20% * var(--th-bs)) 3.9%);
  color: var(--ink);
}
body {
  background-image: radial-gradient(
      circle at 95% 5%,
      hsl(calc(var(--th-h) + -0.4) calc(71.9% * var(--th-s)) calc(44.7% + var(--th-l)) / 0.1),
      transparent 38%
    ),
    linear-gradient(
      90deg,
      hsl(calc(var(--th-h) + 1) calc(68.1% * var(--th-s)) calc(55.7% + var(--th-l)) / 0) 1px,
      transparent 1px
    ),
    linear-gradient(
      hsl(calc(var(--th-h) + 1) calc(68.1% * var(--th-s)) calc(55.7% + var(--th-l)) / 0) 1px,
      transparent 1px
    );
  background-size:
    auto,
    30px 30px,
    30px 30px;
}
.sidebar {
  background: hsl(calc(var(--th-bh) + 7) calc(17.2% * var(--th-bs)) 5.7%);
  border-right: 1px solid hsl(calc(var(--th-h) + -1.8) calc(41.4% * var(--th-s)) calc(35.5% + var(--th-l)));
  padding: 19px 11px;
}
.logo {
  padding: 8px 7px 17px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 3.3) calc(40.4% * var(--th-s)) calc(22.4% + var(--th-l)));
  margin-bottom: 8px;
}
.n7-mark {
  color: var(--amber);
  font-size: 29px;
  letter-spacing: -2px;
}
.n7-mark span {
  color: var(--amber);
}
.logo-title {
  font-family: var(--head);
  font-size: 15px;
  letter-spacing: 1px;
  color: hsl(calc(var(--th-h) + 2.5) calc(80% * var(--th-s)) calc(70.6% + var(--th-l)));
}
.logo .micro {
  color: hsl(calc(var(--th-h) + 2.1) calc(55.2% * var(--th-s)) calc(58.8% + var(--th-l)));
}
.nav-label {
  color: hsl(calc(var(--th-h) + -0.2) calc(33.9% * var(--th-s)) calc(56.7% + var(--th-l)));
}
.nav-btn {
  border-radius: 2px;
  font-family: var(--head);
  font-size: 12px;
  letter-spacing: 0.25px;
  color: #d1d3c9;
  padding: 11px 10px;
}
.nav-btn:hover {
  background: #252b27;
  color: hsl(calc(var(--th-h) + 0.2) calc(83.8% * var(--th-s)) calc(78.2% + var(--th-l)));
}
.nav-btn.active {
  color: hsl(calc(var(--th-h) + -1.1) calc(87.2% * var(--th-s)) calc(81.6% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 5.8) calc(19.4% * var(--th-s)) calc(13.1% + var(--th-l)));
  border-left: 3px solid var(--amber);
}
.nav-btn .ico {
  color: hsl(calc(var(--th-h) + -0.7) calc(50.4% * var(--th-s)) calc(51% + var(--th-l)));
}
.side-bottom {
  border-top-color: hsl(calc(var(--th-h) + 0.4) calc(32.3% * var(--th-s)) calc(24.9% + var(--th-l)));
}
.topbar {
  background: hsl(calc(var(--th-bh) + -5) calc(14.3% * var(--th-bs)) 5.5% / 0.9);
  border-bottom: 1px solid hsl(calc(var(--th-h) + -0.4) calc(44.6% * var(--th-s)) calc(36.1% + var(--th-l)));
  padding: 0 24px;
  height: 67px;
}
.topbar h1 {
  font-size: 19px;
  letter-spacing: 1.3px;
  color: hsl(calc(var(--th-h) + 0.4) calc(86.5% * var(--th-s)) calc(73.9% + var(--th-l)));
}
.topbar .micro {
  font-size: 9px;
  letter-spacing: 1px;
  color: #9f9f93;
}
.main .content {
  max-width: 1600px;
  padding: 20px 23px 45px;
}
.hero {
  align-items: center;
  margin: 0 0 15px;
}
.hero h2 {
  font-size: 28px;
  color: hsl(calc(var(--th-h) + 0.9) calc(79.9% * var(--th-s)) calc(70.8% + var(--th-l)));
  letter-spacing: 1px;
}
.hero p {
  font-size: 12px;
}
.eyebrow,
.micro {
  color: hsl(calc(var(--th-h) + -1.7) calc(42.6% * var(--th-s)) calc(52.2% + var(--th-l)));
}
.card {
  background: hsl(calc(var(--th-bh) + 12.1) calc(14.3% * var(--th-bs)) 9.6%);
  border: 1px solid #3e433d;
  border-radius: 3px;
  padding: 14px;
}
.card.flat {
  background: hsl(calc(var(--th-bh) + 5) calc(15% * var(--th-bs)) 7.8%);
}
.card-title,
.section-title {
  font-family: var(--head);
  color: hsl(calc(var(--th-h) + 0.1) calc(70.9% * var(--th-s)) calc(61% + var(--th-l)));
  letter-spacing: 0.9px;
  font-size: 14px;
}
.section-title {
  margin: 22px 0 11px;
}
.section-title:after {
  background: hsl(calc(var(--th-h) + 0.3) calc(32.4% * var(--th-s)) calc(27.3% + var(--th-l)));
}
.kpi {
  padding: 14px;
}
.kpi .meta {
  font-size: 10px;
}
.kpi .metric {
  font-size: 30px;
}
.kpi:after {
  display: none;
}
input,
select,
textarea {
  background: hsl(calc(var(--th-bh) + 3.6) calc(20% * var(--th-bs)) 6.9%);
  border: 1px solid #4a534d;
  border-radius: 2px;
  color: #ecf0e6;
  padding: 8px 9px;
}
input:focus,
select:focus,
textarea:focus {
  border-color: hsl(calc(var(--th-h) + -0.3) calc(72.7% * var(--th-s)) calc(59.8% + var(--th-l)));
  box-shadow: 0 0 0 2px hsl(calc(var(--th-h) + 0.1) calc(63.2% * var(--th-s)) calc(56.3% + var(--th-l)) / 0.2);
}
input[type='checkbox'],
input[type='range'] {
  accent-color: hsl(calc(var(--th-h) + -0.2) calc(65.2% * var(--th-s)) calc(56.1% + var(--th-l)));
}
.field label {
  color: hsl(calc(var(--th-h) + 1.2) calc(34.5% * var(--th-s)) calc(65.3% + var(--th-l)));
}
.btn {
  border-radius: 2px;
  background: #30342e;
  border-color: #5d614c;
  color: hsl(calc(var(--th-h) + 5.8) calc(30.2% * var(--th-s)) calc(91.6% + var(--th-l)));
  font-family: var(--head);
  font-size: 12px;
  letter-spacing: 0.2px;
  padding: 9px 12px;
}
.btn:hover {
  background: #3e4437;
}
.btn.red {
  background: #8d3d2e;
  border-color: #ba5b40;
}
.btn.red:hover {
  background: #ae4d35;
}
.btn.green {
  background: hsl(calc(var(--th-bh) + -22.4) calc(33.9% * var(--th-bs)) 22%);
  border-color: #568a6d;
}
.chip {
  background: #292b23;
  border-color: hsl(calc(var(--th-h) + 5.9) calc(28.7% * var(--th-s)) calc(31.4% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.3) calc(78.6% * var(--th-s)) calc(72.5% + var(--th-l)));
  border-radius: 2px;
  font-family: var(--head);
  font-size: 10px;
}
.chip.red {
  background: #40241d;
  border-color: #a9523d;
  color: #ffa995;
}
.chip.green {
  background: hsl(calc(var(--th-bh) + -30.4) calc(31.7% * var(--th-bs)) 16.1%);
  border-color: #427553;
  color: #b6eac7;
}
.chip.amber {
  background: hsl(calc(var(--th-h) + -0.7) calc(46.7% * var(--th-s)) calc(17.6% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + 1.4) calc(54% * var(--th-s)) calc(41.8% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 0) calc(89.7% * var(--th-s)) calc(77.3% + var(--th-l)));
}
.notice {
  background: #202721;
  border-color: hsl(calc(var(--th-h) + 11.4) calc(27.5% * var(--th-s)) calc(35.7% + var(--th-l)));
  border-left-color: var(--amber);
  border-radius: 2px;
  color: hsl(calc(var(--th-h) + -0.8) calc(43.2% * var(--th-s)) calc(82.7% + var(--th-l)));
}
.notice.warn {
  background: #2c231d;
  border-left-color: hsl(calc(var(--th-h) + -9.2) calc(76.3% * var(--th-s)) calc(58.6% + var(--th-l)));
}
.notice.good {
  background: #192a21;
  border-left-color: #8ec9a1;
}
.helper {
  background: hsl(calc(var(--th-bh) + -17) calc(9.8% * var(--th-bs)) 10%);
  border-left-color: hsl(calc(var(--th-h) + 1.4) calc(51.2% * var(--th-s)) calc(49% + var(--th-l)));
}
.score {
  background: hsl(calc(var(--th-bh) + 3.6) calc(14.9% * var(--th-bs)) 9.2%);
  border-color: hsl(calc(var(--th-h) + 3.5) calc(17.8% * var(--th-s)) calc(28.6% + var(--th-l)));
  border-radius: 2px;
}
.score .mod {
  color: hsl(calc(var(--th-h) + 0.4) calc(77.4% * var(--th-s)) calc(68.8% + var(--th-l)));
}
.score span {
  color: hsl(calc(var(--th-h) + -0.4) calc(21% * var(--th-s)) calc(67.3% + var(--th-l)));
}
.tab,
.tabs button {
  border-radius: 2px;
}
.tab.active {
  background: hsl(calc(var(--th-h) + -2.7) calc(49.6% * var(--th-s)) calc(24.1% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + 0.2) calc(58.3% * var(--th-s)) calc(54.9% + var(--th-l)));
}
.lozenge {
  color: hsl(calc(var(--th-h) + 1.1) calc(62.2% * var(--th-s)) calc(60.6% + var(--th-l)));
}
.credit {
  color: hsl(calc(var(--th-h) + -0.8) calc(69.1% * var(--th-s)) calc(64.5% + var(--th-l)));
}
.bar-hp {
  background: linear-gradient(90deg, #738d58, #9ec885);
}
.bar-kb {
  background: linear-gradient(90deg, #377486, #78bcd0);
}
.pip.available {
  background: hsl(calc(var(--th-h) + -1.1) calc(65.1% * var(--th-s)) calc(53.9% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + 1.6) calc(81% * var(--th-s)) calc(77.3% + var(--th-l)));
}
.online {
  color: #9dc7a5;
}
.online:before {
  background: #b7d17a;
  box-shadow: 0 0 7px #b7d17a;
}
.footer {
  border-top-color: hsl(calc(var(--th-h) + 4.7) calc(23.2% * var(--th-s)) calc(24.5% + var(--th-l)));
  color: #97958d;
}
.table th {
  color: hsl(calc(var(--th-h) + -0.9) calc(72.4% * var(--th-s)) calc(60.2% + var(--th-l)));
}
.table td {
  border-bottom-color: #363d3a;
}
.toast {
  border-radius: 3px;
}
.alert {
  border-radius: 2px;
}
.avatar {
  border: 1px solid hsl(calc(var(--th-h) + 0.7) calc(35.1% * var(--th-s)) calc(37.5% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.8) calc(72.2% * var(--th-s)) calc(69% + var(--th-l)));
  background: #24261f;
  border-radius: 2px;
}

.prox-sheet {
  display: grid;
  grid-template-columns: minmax(275px, 0.88fr) minmax(500px, 2.12fr);
  gap: 12px;
  align-items: start;
}
.prox-left,
.prox-right {
  display: grid;
  gap: 11px;
  min-width: 0;
}
.prox-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.prox-seal {
  width: 59px;
  height: 67px;
  display: grid;
  place-items: center;
  border: 1px solid hsl(calc(var(--th-h) + 0.9) calc(50.7% * var(--th-s)) calc(42.9% + var(--th-l)));
  background: linear-gradient(
    140deg,
    hsl(calc(var(--th-h) + 11.5) calc(21% * var(--th-s)) calc(15.9% + var(--th-l))),
    hsl(calc(var(--th-bh) + 5) calc(15% * var(--th-bs)) 7.8%)
  );
  color: hsl(calc(var(--th-h) + 0.2) calc(75.3% * var(--th-s)) calc(62% + var(--th-l)));
  font: 800 21px var(--head);
  flex-shrink: 0;
  clip-path: polygon(0 0, 100% 0, 100% 84%, 50% 100%, 0 84%);
}
.prox-identity {
  flex: 1;
  min-width: 0;
}
.prox-identity h2 {
  font: 700 clamp(16px, 2vw, 22px) var(--head);
  text-transform: uppercase;
  margin: 0 0 4px;
  color: hsl(calc(var(--th-h) + -1.9) calc(88.1% * var(--th-s)) calc(80.2% + var(--th-l)));
  overflow-wrap: anywhere;
}
.prox-identity p {
  margin: 0;
  color: #aaa99d;
  font-size: 11px;
  line-height: 1.6;
}
.prox-caption {
  font: 700 10px var(--head);
  letter-spacing: 1.5px;
  color: hsl(calc(var(--th-h) + 1.3) calc(61.3% * var(--th-s)) calc(56.5% + var(--th-l)));
  text-transform: uppercase;
}
.prox-panel {
  background: hsl(calc(var(--th-bh) + 17.5) calc(19% * var(--th-bs)) 8.2%);
  border: 1px solid #454941;
  padding: 12px;
}
.prox-panelhead {
  font: 700 11px var(--head);
  color: hsl(calc(var(--th-h) + 0.5) calc(67.4% * var(--th-s)) calc(63.9% + var(--th-l)));
  letter-spacing: 1.4px;
  text-transform: uppercase;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 4.6) calc(18.4% * var(--th-s)) calc(24.5% + var(--th-l)));
  padding: 0 0 8px;
  margin: 0 0 10px;
}
.prox-kpirow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.prox-kpi {
  border: 1px solid #383f3d;
  padding: 9px 4px;
  text-align: center;
  background: hsl(calc(var(--th-bh) + -5) calc(12% * var(--th-bs)) 9.8%);
}
.prox-kpi .val {
  font: 700 24px var(--head);
  color: hsl(calc(var(--th-h) + 6.4) calc(36.8% * var(--th-s)) calc(92.5% + var(--th-l)));
}
.prox-kpi .tag {
  font: 700 9px var(--head);
  color: hsl(calc(var(--th-h) + 3.5) calc(35.4% * var(--th-s)) calc(62.4% + var(--th-l)));
}
.prox-resource {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
}
.prox-circle {
  --pct: 50;
  --color: hsl(calc(var(--th-h) + 1.3) calc(69.4% * var(--th-s)) calc(59% + var(--th-l)));
  width: 120px;
  height: 120px;
  margin: 5px auto;
  position: relative;
  border-radius: 50%;
  background: conic-gradient(
    var(--color) calc(var(--pct) * 1%),
    hsl(calc(var(--th-bh) + -25) calc(10.1% * var(--th-bs)) 17.5%) 0
  );
  display: grid;
  place-items: center;
}
.prox-circle:before {
  content: '';
  position: absolute;
  inset: 10px;
  background: hsl(calc(var(--th-bh) + 17.5) calc(19% * var(--th-bs)) 8.2%);
  border-radius: 50%;
}
.prox-circle .inside {
  position: relative;
  z-index: 1;
  text-align: center;
}
.prox-circle .inside strong {
  font: 700 19px var(--head);
}
.prox-circle .inside small {
  display: block;
  font: 9px var(--head);
  color: hsl(calc(var(--th-h) + 4.5) calc(33.3% * var(--th-s)) calc(76.5% + var(--th-l)));
  margin: 5px 0;
}
.prox-critical {
  display: grid;
  gap: 7px;
}
.prox-pool {
  font-size: 11px;
  text-align: center;
  color: #b6bead;
}
.prox-mini {
  font: 12px var(--head);
  padding: 6px 0;
  border-bottom: 1px solid #303934;
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.prox-statgrid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
}
.prox-stat {
  background: hsl(calc(var(--th-bh) + 15) calc(11.5% * var(--th-bs)) 10.2%);
  border: 1px solid #47483b;
  text-align: center;
  padding: 10px 3px;
}
.prox-stat label {
  font: 700 10px var(--head);
  color: hsl(calc(var(--th-h) + 1.7) calc(49.7% * var(--th-s)) calc(61% + var(--th-l)));
}
.prox-stat b {
  display: block;
  font: 700 23px var(--head);
  color: hsl(calc(var(--th-h) + 2.3) calc(76.7% * var(--th-s)) calc(91.6% + var(--th-l)));
  margin: 6px 0 2px;
}
.prox-stat .base {
  font-size: 11px;
  color: #a7ac9d;
}
.prox-twocol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
}
.prox-skill-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 12px;
}
.prox-skill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 7px 0;
  border-bottom: 1px solid #303731;
  font-size: 11px;
}
.prox-skill .mark {
  color: hsl(calc(var(--th-h) + 0.3) calc(72.4% * var(--th-s)) calc(55.9% + var(--th-l)));
  font-weight: 900;
  width: 13px;
}
.prox-skill strong {
  color: hsl(calc(var(--th-h) + 0.4) calc(100% * var(--th-s)) calc(92.7% + var(--th-l)));
  font: 700 12px var(--head);
}
.prox-subnav {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  border-bottom: 1px solid hsl(calc(var(--th-h) + -1.6) calc(37.1% * var(--th-s)) calc(34.3% + var(--th-l)));
  padding: 1px 0 8px;
  margin-bottom: 10px;
}
.prox-subnav button {
  font: 700 11px var(--head);
  padding: 8px 10px;
  color: #bcbfae;
  background: transparent;
  border: 1px solid transparent;
  white-space: nowrap;
}
.prox-subnav button.selected {
  color: hsl(calc(var(--th-h) + 0.7) calc(90.1% * var(--th-s)) calc(76.3% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -0.8) calc(37.3% * var(--th-s)) calc(40% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 0) calc(25.5% * var(--th-s)) calc(18.4% + var(--th-l)));
}
.prox-subnav button:hover {
  color: hsl(calc(var(--th-h) + 0.7) calc(90.1% * var(--th-s)) calc(76.3% + var(--th-l)));
}
.prox-list {
  display: grid;
  gap: 6px;
}
.prox-action {
  border: 1px solid #353c38;
  background: hsl(calc(var(--th-bh) + 3.6) calc(13.2% * var(--th-bs)) 10.4%);
  padding: 9px 10px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
  align-items: center;
}
.prox-action b {
  font: 700 12px var(--head);
}
.prox-action small {
  display: block;
  color: #a9b2a8;
  font-size: 10px;
  margin-top: 3px;
}
.prox-action .roll {
  font: 700 12px var(--head);
  color: hsl(calc(var(--th-h) + -0.8) calc(74.9% * var(--th-s)) calc(64.1% + var(--th-l)));
  white-space: nowrap;
}
.prox-banner {
  background: hsl(calc(var(--th-h) + 5) calc(17.1% * var(--th-s)) calc(13.7% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + 2.4) calc(39.7% * var(--th-s)) calc(30.6% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 0.8) calc(67.1% * var(--th-s)) calc(66.7% + var(--th-l)));
  font: 10px var(--head);
  letter-spacing: 1.2px;
  padding: 7px 10px;
  margin: 0 0 12px;
  text-transform: uppercase;
}
.prox-quick {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.prox-quick button {
  padding: 7px 9px;
}
.prox-compact-select {
  max-width: 230px;
}
.prox-splitter {
  color: hsl(calc(var(--th-h) + -0.3) calc(29.4% * var(--th-s)) calc(39.4% + var(--th-l)));
}
.prox-roster {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  gap: 12px;
}
.prox-operative-card {
  border: 1px solid hsl(calc(var(--th-h) + 9.8) calc(17% * var(--th-s)) calc(26.5% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + -5) calc(10.6% * var(--th-bs)) 9.2%);
  padding: 16px;
  display: grid;
  gap: 12px;
}
.prox-operative-card.active {
  border-color: hsl(calc(var(--th-h) + 0) calc(60.5% * var(--th-s)) calc(53.3% + var(--th-l)));
  box-shadow: inset 0 3px 0 hsl(calc(var(--th-h) + 0) calc(60.5% * var(--th-s)) calc(53.3% + var(--th-l)));
}
.prox-operative-card h3 {
  color: hsl(calc(var(--th-h) + 0.1) calc(85.4% * var(--th-s)) calc(73.1% + var(--th-l)));
  font: 700 17px var(--head);
  margin: 0;
  overflow-wrap: anywhere;
}
.prox-operative-card p {
  color: #adb2a6;
  font-size: 11px;
  margin: 5px 0;
}
.prox-danger {
  background: #40261f !important;
  border-color: #88493a !important;
  color: #f3c6ba !important;
}
.prox-top-roster {
  display: flex;
  align-items: center;
  gap: 8px;
  font: 700 11px var(--head);
  color: hsl(calc(var(--th-h) + 0.7) calc(61.6% * var(--th-s)) calc(61.2% + var(--th-l)));
}
.prox-top-roster select {
  width: auto;
  max-width: 210px;
  min-width: 140px;
}
.prox-roster-help {
  line-height: 1.7;
  color: #bfc0b4;
  font-size: 12px;
  max-width: 700px;
}
.prox-footnote {
  color: #aaa995;
  font-size: 11px;
  margin-top: 12px;
}
.prox-pill {
  background: #25291d;
  color: hsl(calc(var(--th-h) + -1.3) calc(67.6% * var(--th-s)) calc(73.3% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + 0) calc(31.3% * var(--th-s)) calc(32.5% + var(--th-l)));
  padding: 2px 6px;
  font: 700 10px var(--head);
}
@media (max-width: 1250px) {
  .prox-sheet {
    grid-template-columns: 1fr;
  }
  .prox-left {
    grid-template-columns: 1fr 1fr;
  }
  .prox-left > .prox-panel:first-child {
    grid-column: 1/-1;
  }
}
@media (max-width: 850px) {
  .prox-left {
    grid-template-columns: 1fr;
  }
  .prox-twocol {
    grid-template-columns: 1fr;
  }
  .prox-statgrid {
    grid-template-columns: repeat(3, 1fr);
  }
  .prox-skill-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .prox-top-roster {
    display: none;
  }
}
@media (max-width: 500px) {
  .prox-kpirow {
    grid-template-columns: repeat(2, 1fr);
  }
  .prox-skill-grid {
    grid-template-columns: 1fr;
  }
  .prox-resource {
    grid-template-columns: 1fr;
  }
  .prox-statgrid {
    grid-template-columns: repeat(3, 1fr);
  }
  .prox-quick {
    gap: 5px;
  }
  .main .content {
    padding: 14px 10px;
  }
}

.prox-stat label,
.prox-stat .base {
  display: block;
}
.prox-stat .prox-ability-roll {
  display: block;
  margin: 6px auto 4px;
}
.prox-stat {
  min-width: 0;
}
.proxima-brand-logo {
  width: 43px;
  height: 43px;
  object-fit: contain;
  filter: drop-shadow(
    0 0 5px hsl(calc(var(--th-h) + -2) calc(66.8% * var(--th-s)) calc(49.6% + var(--th-l)) / 0.1)
  );
  flex-shrink: 0;
}
.proxima-avatar {
  padding: 4px;
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
}
.proxima-avatar img {
  width: 25px;
  height: 25px;
  object-fit: contain;
}
.prox-seal img {
  width: 47px;
  height: 48px;
  object-fit: contain;
  filter: drop-shadow(
    0 0 7px hsl(calc(var(--th-h) + -0.2) calc(65.2% * var(--th-s)) calc(56.1% + var(--th-l)) / 0.1)
  );
}
.dice-top {
  color: hsl(calc(var(--th-h) + -0.5) calc(87.7% * var(--th-s)) calc(71.4% + var(--th-l))) !important;
  border-color: hsl(calc(var(--th-h) + -2.1) calc(44.2% * var(--th-s)) calc(42.2% + var(--th-l))) !important;
  background: hsl(calc(var(--th-h) + 6.4) calc(22.6% * var(--th-s)) calc(12.2% + var(--th-l))) !important;
  font-weight: 800;
}
.prox-roll-actions {
  display: flex;
  gap: 5px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.prox-roll-btn {
  min-width: 46px;
  background: hsl(calc(var(--th-h) + 11.5) calc(27.9% * var(--th-s)) calc(12% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 0.7) calc(88.7% * var(--th-s)) calc(72.2% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -1.6) calc(39.2% * var(--th-s)) calc(38% + var(--th-l)));
  font: 700 11px var(--head);
  padding: 5px 7px;
  border-radius: 2px;
  cursor: pointer;
  max-width: 150px;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
  transition:
    background 0.18s,
    transform 0.18s,
    box-shadow 0.18s;
}
.prox-ability-roll {
  margin: 6px auto 4px;
  min-width: 50px;
  font-size: 15px;
  padding: 5px 7px;
}
.prox-roll-btn:hover {
  background: hsl(calc(var(--th-h) + -3.1) calc(49.5% * var(--th-s)) calc(21% + var(--th-l)));
  box-shadow: 0 0 13px hsl(calc(var(--th-h) + -0.7) calc(54.2% * var(--th-s)) calc(47.1% + var(--th-l)) / 0.3);
  transform: translateY(-1px);
}
.prox-roll-btn:active {
  transform: scale(0.94);
}
#px-dice-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
}
#px-dice-modal.open {
  pointer-events: auto;
}
.dice-backdrop {
  position: absolute;
  inset: 0;
  background: hsl(calc(var(--th-bh) + -5) calc(60% * var(--th-bs)) 1% / 0.7);
  opacity: 0;
  transition: opacity 0.2s;
}
#px-dice-modal.open .dice-backdrop {
  opacity: 1;
}
.dice-panel {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: min(440px, 100vw);
  background: linear-gradient(
    165deg,
    hsl(calc(var(--th-bh) + -25) calc(12.5% * var(--th-bs)) 9.4%),
    hsl(calc(var(--th-bh) + -17) calc(23.8% * var(--th-bs)) 4.1%) 65%
  );
  border-left: 2px solid hsl(calc(var(--th-h) + -2.9) calc(54.8% * var(--th-s)) calc(43.3% + var(--th-l)));
  box-shadow: -24px 0 80px #000b;
  display: flex;
  flex-direction: column;
  transform: translateX(108%);
  transition: transform 0.24s cubic-bezier(0.14, 0.82, 0.21, 1);
  overflow-y: auto;
}
#px-dice-modal.open .dice-panel {
  transform: translateX(0);
}
.dice-panel-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 17px;
  background: hsl(calc(var(--th-bh) + -15) calc(13% * var(--th-bs)) 9%);
  border-bottom: 1px solid hsl(calc(var(--th-h) + -2.7) calc(39.4% * var(--th-s)) calc(38.8% + var(--th-l)));
}
.dice-panel-head img {
  width: 41px;
  height: 41px;
  object-fit: contain;
}
.dice-panel-head b {
  display: block;
  color: hsl(calc(var(--th-h) + -0.2) calc(87.1% * var(--th-s)) calc(72.5% + var(--th-l)));
  font: 800 15px var(--head);
  letter-spacing: 2px;
}
.dice-panel-head small {
  display: block;
  color: hsl(calc(var(--th-h) + 1.2) calc(24.5% * var(--th-s)) calc(61.6% + var(--th-l)));
  margin-top: 4px;
  font: 10px var(--head);
}
.dice-panel-head button {
  margin-left: auto;
  background: transparent;
  border: 1px solid hsl(calc(var(--th-h) + -3.5) calc(29.2% * var(--th-s)) calc(34.9% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -2.3) calc(84.3% * var(--th-s)) calc(72.5% + var(--th-l)));
  padding: 6px 10px;
}
.dice-current {
  background: repeating-linear-gradient(0deg, transparent 0, transparent 8px, #ffffff03 9px),
    radial-gradient(
      circle at 50% 0%,
      hsl(calc(var(--th-h) + 5.6) calc(37.2% * var(--th-s)) calc(16.9% + var(--th-l))),
      hsl(calc(var(--th-bh) + -15) calc(15% * var(--th-bs)) 7.8%) 65%
    );
  padding: 22px 20px;
  text-align: center;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 0) calc(27.7% * var(--th-s)) calc(25.5% + var(--th-l)));
}
.dice-big {
  display: block;
  color: hsl(calc(var(--th-h) + 0.3) calc(81.7% * var(--th-s)) calc(65.7% + var(--th-l)));
  font: 800 clamp(58px, 9vw, 88px) var(--head);
  text-shadow: 0 0 23px
    hsl(calc(var(--th-h) + -5.5) calc(46.3% * var(--th-s)) calc(48.2% + var(--th-l)) / 0.4);
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.dice-result-note {
  font-size: 13px;
  color: hsl(calc(var(--th-h) + 5.5) calc(26.8% * var(--th-s)) calc(86.1% + var(--th-l)));
  min-height: 22px;
}
.dice-details {
  font: 11px var(--head);
  color: #9cab9e;
  margin-top: 9px;
  display: flex;
  gap: 5px;
  justify-content: center;
  flex-wrap: wrap;
}
.dice-details span {
  padding: 3px 5px;
  border: 1px solid #394438;
}
.dice-body {
  padding: 20px;
  display: grid;
  gap: 12px;
}
.dice-body > label {
  font: 700 11px var(--head);
  color: hsl(calc(var(--th-h) + -1.1) calc(79.8% * var(--th-s)) calc(65.1% + var(--th-l)));
  letter-spacing: 0.7px;
}
.dice-body small {
  color: #98a49d;
  font-weight: 400;
}
#dice-expression {
  height: 46px;
  font: 800 20px var(--head);
  color: hsl(calc(var(--th-h) + 0.2) calc(89.5% * var(--th-s)) calc(81.4% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -3.2) calc(43.4% * var(--th-s)) calc(49.2% + var(--th-l)));
}
.dice-mode {
  display: flex;
  gap: 13px;
  padding: 13px 0;
}
.dice-mode label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  white-space: nowrap;
}
.dice-mode input {
  margin: 0;
  width: 16px;
  height: 16px;
  accent-color: hsl(calc(var(--th-h) + -0.8) calc(63.1% * var(--th-s)) calc(57.5% + var(--th-l)));
}
.dice-submit {
  width: 100%;
  background: hsl(calc(var(--th-h) + -3.5) calc(57.3% * var(--th-s)) calc(32.2% + var(--th-l))) !important;
  border-color: hsl(calc(var(--th-h) + -2.3) calc(48% * var(--th-s)) calc(51.8% + var(--th-l))) !important;
  color: hsl(calc(var(--th-h) + 0.3) calc(100% * var(--th-s)) calc(89.6% + var(--th-l))) !important;
  font-size: 15px !important;
  padding: 14px !important;
}
.dice-presets {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.dice-presets button {
  background: #25291f;
  border: 1px solid hsl(calc(var(--th-h) + 4.7) calc(22.3% * var(--th-s)) calc(30.8% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.4) calc(81.2% * var(--th-s)) calc(70.8% + var(--th-l)));
  padding: 9px 3px;
  font: 800 12px var(--head);
  cursor: pointer;
  transition: all 0.18s;
}
.dice-presets button:hover {
  background: hsl(calc(var(--th-h) + -2.1) calc(43.1% * var(--th-s)) calc(25.5% + var(--th-l)));
  transform: translateY(-2px);
}
.dice-history-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid hsl(calc(var(--th-h) + -0.4) calc(28.1% * var(--th-s)) calc(27.3% + var(--th-l)));
  padding: 10px 0;
  color: hsl(calc(var(--th-h) + -1.5) calc(67.6% * var(--th-s)) calc(58.8% + var(--th-l)));
  font: 800 11px var(--head);
  letter-spacing: 1px;
}
.dice-history-title button {
  background: transparent;
  color: hsl(calc(var(--th-h) + -4.1) calc(65.2% * var(--th-s)) calc(65.1% + var(--th-l)));
  border: 0;
  cursor: pointer;
}
#dice-history {
  display: grid;
  max-height: 230px;
  overflow-y: auto;
  gap: 3px;
}
.dice-history-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1px 8px;
  padding: 9px 7px;
  border-bottom: 1px solid #39403a;
  font-size: 12px;
}
.dice-history-item strong {
  font: 800 17px var(--head);
  color: hsl(calc(var(--th-h) + 0.3) calc(82.8% * var(--th-s)) calc(68% + var(--th-l)));
  grid-row: span 2;
}
.dice-history-item small {
  grid-column: 1;
  color: #89958c;
  font-size: 10px;
}
.dice-impact {
  animation: dice-impact 0.45s cubic-bezier(0.21, 0.92, 0.44, 1);
}
@keyframes dice-impact {
  0% {
    transform: scale(0.6);
    opacity: 0.4;
    filter: blur(5px);
  }
  55% {
    transform: scale(1.16);
    opacity: 1;
    filter: blur(0);
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.adv-review {
  display: block;
  color: hsl(calc(var(--th-h) + -7.3) calc(63.5% * var(--th-s)) calc(59.2% + var(--th-l)));
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  padding-top: 5px;
}
.nav-btn,
.btn,
.prox-subnav button,
.prox-operative-card,
.card,
.prox-panel,
.prox-action {
  transition:
    background-color 0.16s ease,
    border-color 0.2s ease,
    box-shadow 0.22s ease,
    transform 0.18s ease;
}
.nav-btn:hover,
.btn:hover {
  box-shadow: inset 0 0 12px
    hsl(calc(var(--th-h) + -3.3) calc(54.3% * var(--th-s)) calc(43.7% + var(--th-l)) / 0.1);
}
.btn:active,
.nav-btn:active {
  transform: scale(0.975);
}
.prox-operative-card:hover {
  border-color: hsl(calc(var(--th-h) + -1.9) calc(40.3% * var(--th-s)) calc(41.4% + var(--th-l)));
}
.hud-scan-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  animation: hud-scan-fade 0.47s ease forwards;
  background: linear-gradient(
      95deg,
      transparent 0,
      hsl(calc(var(--th-h) + 0.6) calc(63.4% * var(--th-s)) calc(43.9% + var(--th-l)) / 0.1) 48%,
      transparent 53%
    )
    left center/200% 100%;
}
.hud-scan-layer i {
  position: absolute;
  left: 20%;
  right: 10%;
  height: 1px;
  top: 50%;
  background: linear-gradient(
    90deg,
    transparent,
    hsl(calc(var(--th-h) + -1.4) calc(73.6% * var(--th-s)) calc(65.9% + var(--th-l))),
    transparent
  );
  box-shadow: 0 0 18px hsl(calc(var(--th-h) + -4.1) calc(72.5% * var(--th-s)) calc(60% + var(--th-l)));
  animation: hud-scan 0.47s ease-out forwards;
}
.hud-scan-layer span {
  margin-top: 48px;
  color: hsl(calc(var(--th-h) + -0.3) calc(76.6% * var(--th-s)) calc(69.8% + var(--th-l)));
  text-shadow: 0 0 10px hsl(calc(var(--th-h) + -7.4) calc(60.9% * var(--th-s)) calc(56.9% + var(--th-l)));
  font: 800 11px var(--head);
  letter-spacing: 2.5px;
  animation: hud-word 0.47s ease forwards;
}
@keyframes hud-scan {
  0% {
    transform: translateY(-120px) scaleX(0.25);
    opacity: 0;
  }
  30% {
    opacity: 0.95;
  }
  85% {
    transform: translateY(95px) scaleX(1.08);
    opacity: 0.9;
  }
  100% {
    opacity: 0;
    transform: translateY(110px) scaleX(0.6);
  }
}
@keyframes hud-word {
  0% {
    opacity: 0;
    letter-spacing: 8px;
  }
  35% {
    opacity: 1;
    letter-spacing: 3px;
  }
  80% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
  }
}
@keyframes hud-scan-fade {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.hud-page-out {
  opacity: 0.15;
  transform: translateY(9px);
  filter: blur(4px);
  transition: all 0.13s ease-out !important;
}
.hud-page-in {
  animation: hud-page-enter 0.27s cubic-bezier(0.2, 0.84, 0.3, 1);
}
@keyframes hud-page-enter {
  0% {
    opacity: 0;
    transform: translateY(18px) scale(0.992);
    filter: blur(5px);
  }
  70% {
    opacity: 1;
    filter: blur(0);
  }
  100% {
    transform: none;
    opacity: 1;
  }
}
.hud-sub-out {
  opacity: 0.25;
  filter: blur(3px);
  transition: all 0.11s ease;
}
.hud-sub-in {
  animation: hud-page-enter 0.25s ease-out;
}
@media (prefers-reduced-motion: reduce) {
  *,
  *:before,
  *:after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  .hud-scan-layer {
    display: none !important;
  }
}

#proxima-boot {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: hsl(calc(var(--th-bh) + 15) calc(15.8% * var(--th-bs)) 3.7%);
  color: hsl(calc(var(--th-h) + -1) calc(54.5% * var(--th-s)) calc(78.4% + var(--th-l)));
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  transition:
    opacity 0.4s ease,
    transform 0.78s cubic-bezier(0.18, 0.89, 0.23, 1);
}
#proxima-boot::before {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
      0deg,
      transparent 0 4px,
      hsl(calc(var(--th-h) + -0.6) calc(72.8% * var(--th-s)) calc(52.4% + var(--th-l)) / 0) 5px 6px
    ),
    radial-gradient(
      ellipse at 50% 45%,
      hsl(calc(var(--th-h) + 0.2) calc(70.4% * var(--th-s)) calc(45.1% + var(--th-l)) / 0.1),
      transparent 55%
    );
  pointer-events: none;
}
#proxima-boot::after {
  content: '';
  position: absolute;
  inset: 28px;
  border: 1px solid hsl(calc(var(--th-h) + -1.3) calc(59.8% * var(--th-s)) calc(45.9% + var(--th-l)) / 0.2);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  pointer-events: none;
}
.boot-scan {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent,
    hsl(calc(var(--th-h) + -2.1) calc(66.8% * var(--th-s)) calc(47.3% + var(--th-l)) / 0.8),
    transparent
  );
  opacity: 0.45;
  animation: bootSweep 2s linear infinite;
}
.boot-core {
  width: min(500px, calc(100vw - 44px));
  position: relative;
  text-align: center;
  animation: coreArrive 0.5s both;
}
.boot-logo-wrap {
  margin: auto;
  width: 138px;
  height: 138px;
  display: grid;
  place-items: center;
  filter: drop-shadow(
    0 0 25px hsl(calc(var(--th-h) + -1.2) calc(66% * var(--th-s)) calc(48.4% + var(--th-l)) / 0.3)
  );
  animation: bootLogo 2.5s ease-in-out infinite;
}
.boot-logo-wrap img {
  width: 118px;
  max-height: 115px;
  object-fit: contain;
}
.boot-command {
  font-family: Consolas, monospace;
  font-weight: 900;
  font-size: 18px;
  letter-spacing: 3px;
  margin: 18px auto 10px;
  color: hsl(calc(var(--th-h) + -0.8) calc(66% * var(--th-s)) calc(50.4% + var(--th-l)));
}
.boot-caption,
.boot-progress-meta,
.boot-gate {
  font-family: Consolas, monospace;
  font-size: 10px;
  letter-spacing: 1.7px;
  color: hsl(calc(var(--th-h) + -2.1) calc(15% * var(--th-s)) calc(54.3% + var(--th-l)));
}
.boot-progress-track {
  border: 1px solid hsl(calc(var(--th-h) + -3.2) calc(66.2% * var(--th-s)) calc(42.9% + var(--th-l)) / 0.4);
  background: hsl(calc(var(--th-h) + -5) calc(26.3% * var(--th-s)) calc(11.2% + var(--th-l)));
  height: 8px;
  margin-top: 33px;
  padding: 1px;
}
.boot-progress {
  width: 0;
  height: 100%;
  background: linear-gradient(
    90deg,
    hsl(calc(var(--th-h) + -0.8) calc(61.1% * var(--th-s)) calc(29.2% + var(--th-l))),
    hsl(calc(var(--th-h) + -1.1) calc(68.7% * var(--th-s)) calc(51.2% + var(--th-l))),
    hsl(calc(var(--th-h) + -0.4) calc(100% * var(--th-s)) calc(77.1% + var(--th-l)))
  );
  box-shadow: 0 0 16px hsl(calc(var(--th-h) + -1.1) calc(68.7% * var(--th-s)) calc(51.2% + var(--th-l)) / 0.5);
  transition: width 0.17s linear;
}
.boot-progress-meta {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 12px;
}
.boot-gate {
  position: absolute;
  bottom: 52px;
  left: 0;
  right: 0;
  text-align: center;
  color: hsl(calc(var(--th-h) + -3.5) calc(41.5% * var(--th-s)) calc(38.2% + var(--th-l)));
}
#proxima-boot.boot-releasing {
  transform: translateY(-110%);
  opacity: 0;
  pointer-events: none;
}
#proxima-boot.boot-releasing .boot-logo-wrap {
  animation: bootAscend 0.8s cubic-bezier(0.17, 0.67, 0.2, 1) both;
}
body.boot-locked {
  overflow: hidden;
}
body.boot-locked #root {
  opacity: 0.02;
  transform: translateY(25px);
}
#root {
  transition:
    opacity 0.55s ease,
    transform 0.6s ease;
}
body.boot-revealed #root {
  opacity: 1;
  transform: translateY(0);
}
@keyframes bootSweep {
  to {
    top: 100%;
  }
}
@keyframes coreArrive {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes bootLogo {
  50% {
    filter: drop-shadow(
      0 0 28px hsl(calc(var(--th-h) + -0.6) calc(66.4% * var(--th-s)) calc(54.5% + var(--th-l)) / 0.5)
    );
    transform: translateY(-4px);
  }
}
@keyframes bootAscend {
  to {
    transform: translateY(-170px) scale(0.55);
    opacity: 0;
  }
}
.recruit-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin: 14px 0 24px;
  padding: 22px;
  border: 1px solid hsl(calc(var(--th-h) + -1.6) calc(64.3% * var(--th-s)) calc(45.1% + var(--th-l)) / 0.3);
  background: linear-gradient(
    110deg,
    hsl(calc(var(--th-h) + 5) calc(14.3% * var(--th-s)) calc(8.2% + var(--th-l))),
    hsl(calc(var(--th-bh) + 25) calc(20% * var(--th-bs)) 7.8%) 65%
  );
  position: relative;
  overflow: hidden;
}
.recruit-head::before {
  content: '';
  width: 105px;
  height: 105px;
  position: absolute;
  right: -28px;
  top: -40px;
  border: 1px solid hsl(calc(var(--th-h) + -1.2) calc(66.1% * var(--th-s)) calc(46.3% + var(--th-l)) / 0.3);
  transform: rotate(45deg);
}
.recruit-kicker {
  color: hsl(calc(var(--th-h) + -0.9) calc(60.2% * var(--th-s)) calc(49.2% + var(--th-l)));
  font:
    700 11px Consolas,
    monospace;
  letter-spacing: 2.1px;
  text-transform: uppercase;
}
.recruit-head h2 {
  font-size: 29px;
  margin: 8px 0;
  color: hsl(calc(var(--th-h) + -2) calc(62.2% * var(--th-s)) calc(85.5% + var(--th-l)));
  font-family: 'Arial Narrow', Consolas, sans-serif;
  letter-spacing: 1.2px;
}
.recruit-head p {
  color: hsl(calc(var(--th-h) + 0.5) calc(17.6% * var(--th-s)) calc(63.3% + var(--th-l)));
  max-width: 730px;
  line-height: 1.5;
  margin: 0;
}
.recruit-count {
  border-left: 2px solid hsl(calc(var(--th-h) + -2.3) calc(54.7% * var(--th-s)) calc(51.6% + var(--th-l)));
  padding-left: 19px;
  min-width: 120px;
  font:
    700 12px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -0) calc(32.2% * var(--th-s)) calc(65.9% + var(--th-l)));
}
.recruit-count b {
  display: block;
  color: hsl(calc(var(--th-h) + -1.2) calc(78.8% * var(--th-s)) calc(61.2% + var(--th-l)));
  font-size: 29px;
  margin: 4px 0;
}
.recruit-stepnav {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 16px;
}
.recruit-stepnav .wizard-step {
  flex: 1 1 125px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 8px;
  border: 1px solid hsl(calc(var(--th-h) + -2.8) calc(19.4% * var(--th-s)) calc(27.3% + var(--th-l)));
  border-radius: 2px;
  background: #151717;
  color: hsl(calc(var(--th-h) + -3) calc(17.6% * var(--th-s)) calc(66.7% + var(--th-l)));
  min-width: 0;
}
.recruit-stepnav .wizard-step span {
  width: 21px;
  height: 21px;
  display: inline-grid;
  place-items: center;
  border: 1px solid hsl(calc(var(--th-h) + -1.4) calc(40.2% * var(--th-s)) calc(32.2% + var(--th-l)));
  border-radius: 0;
  color: hsl(calc(var(--th-h) + -2.9) calc(47.3% * var(--th-s)) calc(59.8% + var(--th-l)));
  font-size: 11px;
}
.recruit-stepnav .wizard-step.current {
  border-color: hsl(calc(var(--th-h) + -2.8) calc(63.8% * var(--th-s)) calc(52.4% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -4.4) calc(47.2% * var(--th-s)) calc(14.1% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 3) calc(100% * var(--th-s)) calc(88.2% + var(--th-l)));
}
.recruit-stepnav .wizard-step.passed {
  border-color: hsl(calc(var(--th-h) + 1.3) calc(42.7% * var(--th-s)) calc(32.2% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -3.7) calc(63% * var(--th-s)) calc(66.1% + var(--th-l)));
}
.recruit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(176px, 1fr));
  gap: 11px;
  margin: 16px 0 18px;
}
.recruit-card {
  min-height: 184px;
  text-align: left;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-items: flex-start;
  border: 1px solid #4a4940;
  border-radius: 3px;
  padding: 16px;
  background: linear-gradient(
    155deg,
    hsl(calc(var(--th-bh) + -29) calc(8.2% * var(--th-bs)) 12%),
    hsl(calc(var(--th-bh) + 17.5) calc(25% * var(--th-bs)) 6.3%)
  );
  color: #d6d4cb;
  transition:
    transform 0.18s,
    border-color 0.18s,
    background 0.18s,
    box-shadow 0.18s;
}
.recruit-card:hover {
  transform: translateY(-3px);
  border-color: hsl(calc(var(--th-h) + -0.9) calc(49% * var(--th-s)) calc(51.6% + var(--th-l)));
  box-shadow: 0 9px 26px #0007;
}
.recruit-card.selected {
  border-color: hsl(calc(var(--th-h) + -1.4) calc(74% * var(--th-s)) calc(59.2% + var(--th-l)));
  background: linear-gradient(
    142deg,
    hsl(calc(var(--th-h) + -3.3) calc(41.9% * var(--th-s)) calc(16.9% + var(--th-l))),
    hsl(calc(var(--th-bh) + -17) calc(10.6% * var(--th-bs)) 9.2%) 72%
  );
  box-shadow: inset 3px 0 hsl(calc(var(--th-h) + -1.5) calc(66.1% * var(--th-s)) calc(52.5% + var(--th-l)));
}
.recruit-card .recruit-title {
  font-weight: 800;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-size: 15px;
}
.recruit-card .recruit-meta {
  font:
    10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -1.2) calc(54.8% * var(--th-s)) calc(54.9% + var(--th-l)));
  letter-spacing: 0.7px;
  line-height: 1.3;
}
.recruit-card .recruit-note {
  font-size: 11px;
  color: #aaada4;
  line-height: 1.4;
}
.recruit-card .recruit-selected {
  position: absolute;
  right: 11px;
  top: 9px;
  color: hsl(calc(var(--th-h) + -0.7) calc(78.5% * var(--th-s)) calc(58% + var(--th-l)));
  font:
    700 10px Consolas,
    monospace;
}
.recruit-emblem {
  height: 70px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.recruit-emblem svg {
  width: 75px;
  height: 70px;
  stroke: hsl(calc(var(--th-h) + -2) calc(58.3% * var(--th-s)) calc(49.8% + var(--th-l)));
  fill: none;
  stroke-width: 1.5;
  filter: drop-shadow(
    0 0 7px hsl(calc(var(--th-h) + -2) calc(58.3% * var(--th-s)) calc(49.8% + var(--th-l)) / 0.2)
  );
}
.recruit-card.selected .recruit-emblem svg {
  stroke: hsl(calc(var(--th-h) + -0.9) calc(100% * var(--th-s)) calc(73.3% + var(--th-l)));
}
.recruit-wide {
  grid-column: 1/-1;
}
.recruit-info {
  border: 1px solid hsl(calc(var(--th-h) + -6.2) calc(25.8% * var(--th-s)) calc(25.9% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 0) calc(15.4% * var(--th-s)) calc(10.2% + var(--th-l)));
  padding: 14px;
  color: hsl(calc(var(--th-h) + 0) calc(25% * var(--th-s)) calc(74.9% + var(--th-l)));
  line-height: 1.5;
  margin: 12px 0 18px;
}
.recruit-info b {
  color: hsl(calc(var(--th-h) + -2.6) calc(76.5% * var(--th-s)) calc(63.3% + var(--th-l)));
}
.recruit-inline {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.recruit-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 9px 0;
  color: #a8aa9c;
  font:
    11px Consolas,
    monospace;
}
.recruit-summary strong {
  color: hsl(calc(var(--th-h) + -1.4) calc(78.1% * var(--th-s)) calc(62.4% + var(--th-l)));
}
.recruit-mark {
  font:
    700 26px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -3.7) calc(62.1% * var(--th-s)) calc(52.4% + var(--th-l)));
  letter-spacing: 1px;
  min-height: 60px;
  display: flex;
  align-items: center;
}
.px-cast-backdrop {
  position: fixed;
  inset: 0;
  background: #000c;
  backdrop-filter: blur(5px);
  z-index: 100001;
  display: grid;
  place-items: center;
  padding: 18px;
}
.px-cast-modal {
  width: min(670px, 100%);
  max-height: 94vh;
  overflow: auto;
  color: hsl(calc(var(--th-h) + -0) calc(33.3% * var(--th-s)) calc(85.9% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -3.2) calc(57.8% * var(--th-s)) calc(49.2% + var(--th-l)));
  background: linear-gradient(
    165deg,
    #24231d,
    hsl(calc(var(--th-bh) + 28.3) calc(22% * var(--th-bs)) 8%) 65%
  );
  box-shadow: 0 25px 90px #000b;
  animation: castEnter 0.27s cubic-bezier(0.15, 0.78, 0.15, 1) both;
}
.px-cast-top {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 18px 20px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + -4.4) calc(43.6% * var(--th-s)) calc(30.6% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 0) calc(35.7% * var(--th-s)) calc(11% + var(--th-l)));
}
.px-cast-top img {
  width: 43px;
  height: 43px;
  object-fit: contain;
}
.px-cast-top strong {
  font:
    800 18px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -2.7) calc(72.5% * var(--th-s)) calc(64.3% + var(--th-l)));
  display: block;
}
.px-cast-top small {
  font:
    10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -1.1) calc(37.3% * var(--th-s)) calc(56.9% + var(--th-l)));
  letter-spacing: 1.5px;
}
.px-cast-close {
  margin-left: auto;
  color: hsl(calc(var(--th-h) + -2.6) calc(50% * var(--th-s)) calc(73.3% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -3.9) calc(24.1% * var(--th-s)) calc(15.5% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -3) calc(27.8% * var(--th-s)) calc(28.2% + var(--th-l)));
  width: auto;
  padding: 7px 13px;
}
.px-cast-body {
  padding: 18px 20px;
  display: grid;
  gap: 15px;
}
.px-cast-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.px-cast-badges span {
  border: 1px solid hsl(calc(var(--th-h) + -2.9) calc(39.2% * var(--th-s)) calc(33.5% + var(--th-l)));
  padding: 5px 8px;
  font:
    11px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -4.3) calc(80.1% * var(--th-s)) calc(70.4% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -1.8) calc(35.2% * var(--th-s)) calc(13.9% + var(--th-l)));
}
.px-cast-rolls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
  gap: 10px;
}
.px-cast-roll {
  padding: 15px;
  border: 1px solid hsl(calc(var(--th-h) + -2.4) calc(21.1% * var(--th-s)) calc(28.8% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + 10) calc(8.7% * var(--th-bs)) 9%);
}
.px-cast-roll small {
  font:
    11px Consolas,
    monospace;
  letter-spacing: 0.7px;
  color: hsl(calc(var(--th-h) + 0) calc(16.3% * var(--th-s)) calc(61.6% + var(--th-l)));
}
.px-cast-roll strong {
  display: block;
  color: hsl(calc(var(--th-h) + 0.5) calc(83.3% * var(--th-s)) calc(71.8% + var(--th-l)));
  font:
    800 37px Consolas,
    monospace;
  margin: 10px 0 7px;
}
.px-cast-roll .detail {
  font:
    11px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -2.1) calc(21.7% * var(--th-s)) calc(68.4% + var(--th-l)));
  overflow-wrap: anywhere;
}
.px-cast-foot {
  border-top: 1px solid hsl(calc(var(--th-h) + -6.4) calc(20.9% * var(--th-s)) calc(26.3% + var(--th-l)));
  padding: 14px 20px;
  display: flex;
  gap: 9px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.px-cast-foot button {
  width: auto;
}
.px-cast-text {
  font-size: 12px;
  color: #b7b7aa;
  line-height: 1.55;
}
.px-cast-foot .btn.red {
  background: hsl(calc(var(--th-h) + -2.8) calc(61% * var(--th-s)) calc(40.2% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -0.7) calc(62% * var(--th-s)) calc(57.6% + var(--th-l)));
  color: #111311;
}
.px-cast-foot .btn.red:hover {
  background: hsl(calc(var(--th-h) + -1) calc(70.1% * var(--th-s)) calc(58% + var(--th-l)));
}
@keyframes castEnter {
  from {
    opacity: 0;
    transform: translateY(28px) scale(0.965);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@media (max-width: 760px) {
  .recruit-inline {
    grid-template-columns: 1fr;
  }
  .recruit-count {
    display: none;
  }
  .recruit-card {
    min-height: 155px;
  }
  .recruit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .px-cast-top strong {
    font-size: 14px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #proxima-boot,
  #root,
  .boot-logo-wrap,
  .boot-scan,
  .recruit-card,
  .px-cast-modal {
    animation: none !important;
    transition: none !important;
  }
}

.px-barrier-box {
  border: 1px solid hsl(calc(var(--th-h) + -2.8) calc(45.1% * var(--th-s)) calc(32.2% + var(--th-l)));
  background: linear-gradient(
    120deg,
    #1a1c19,
    hsl(calc(var(--th-bh) + 11.4) calc(29.7% * var(--th-bs)) 7.3%)
  );
  padding: 11px 12px;
  display: grid;
  gap: 10px;
  border-radius: 5px;
}
.px-barrier-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font:
    700 11px Consolas,
    monospace;
  letter-spacing: 1.05px;
  color: hsl(calc(var(--th-h) + -0.9) calc(72.3% * var(--th-s)) calc(63.1% + var(--th-l)));
}
.px-barrier-top strong {
  color: #efefe9;
}
.px-barrier-range {
  width: 100%;
  accent-color: hsl(calc(var(--th-h) + -1.6) calc(61.2% * var(--th-s)) calc(52.5% + var(--th-l)));
  height: 10px;
  cursor: pointer;
}
.px-barrier-report {
  font:
    11px/1.5 Consolas,
    monospace;
  background: hsl(calc(var(--th-bh) + -0.7) calc(28% * var(--th-bs)) 9.8%);
  border-left: 2px solid hsl(calc(var(--th-h) + -1.6) calc(61.2% * var(--th-s)) calc(52.5% + var(--th-l)));
  padding: 8px;
  color: hsl(calc(var(--th-h) + 4.4) calc(33.3% * var(--th-s)) calc(80% + var(--th-l)));
}
.px-shield-recharge-box {
  margin-top: 8px;
  border: 1px solid hsl(calc(var(--th-bh) + 6.6) calc(24.4% * var(--th-bs)) 24.9%);
  background: linear-gradient(
    140deg,
    hsl(calc(var(--th-bh) + 12.1) calc(35% * var(--th-bs)) 7.8%),
    hsl(calc(var(--th-bh) + 16.2) calc(33.3% * var(--th-bs)) 10%)
  );
  padding: 8px 10px;
  display: grid;
  gap: 6px;
}
.px-shield-recharge-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 0.8px;
  color: #83d2ee;
}
.px-shield-recharge-head strong {
  color: #d1f3ff;
}
.px-shield-recharge-log {
  font:
    10px/1.4 Consolas,
    monospace;
  color: #c7d7dc;
  border-top: 1px solid hsl(calc(var(--th-bh) + 7.9) calc(24.6% * var(--th-bs)) 22.4%);
  padding-top: 6px;
}
.pw-console {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: start;
}
.pw-column {
  display: grid;
  gap: 12px;
}
.pw-wheel-card {
  position: relative;
  overflow: hidden;
  border: 1px solid #2f6f86;
  background: radial-gradient(circle at 50% 10%, rgba(67, 175, 211, 0.16), transparent 40%),
    linear-gradient(
      155deg,
      hsl(calc(var(--th-bh) + 20.7) calc(41.2% * var(--th-bs)) 6.7%),
      hsl(calc(var(--th-bh) + 19) calc(38.5% * var(--th-bs)) 10.2%) 58%,
      hsl(calc(var(--th-bh) + 25) calc(31.2% * var(--th-bs)) 6.3%)
    );
  padding: 14px;
  min-height: 320px;
  box-shadow: inset 0 0 0 1px rgba(141, 216, 255, 0.08);
}
.pw-wheel-card.biotic {
  border-color: #6f5796;
  background: radial-gradient(circle at 50% 10%, rgba(150, 105, 255, 0.18), transparent 40%),
    linear-gradient(
      155deg,
      #0f0d18,
      #191325 58%,
      hsl(calc(var(--th-bh) + 37) calc(29.4% * var(--th-bs)) 6.7%)
    );
}
.pw-wheel-kicker {
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 1.2px;
  color: #8dd8ff;
}
.pw-wheel-card.biotic .pw-wheel-kicker {
  color: #c7aaff;
}
.pw-wheel-title {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-top: 5px;
}
.pw-wheel-title strong {
  font:
    800 18px Eurostile,
    Consolas,
    monospace;
  color: #eefaff;
  letter-spacing: 1px;
}
.pw-wheel-title span {
  font:
    700 10px Consolas,
    monospace;
  color: #9cbcc6;
}
.pw-wheel-visual {
  height: 150px;
  display: grid;
  place-items: center;
  position: relative;
  margin: 10px 0 12px;
}
.pw-wheel-visual svg {
  width: 100%;
  max-width: 230px;
  height: 140px;
  color: #77d7ff;
  filter: drop-shadow(0 0 14px rgba(80, 203, 255, 0.22));
}
.pw-wheel-card.biotic .pw-wheel-visual svg {
  color: #c799ff;
  filter: drop-shadow(0 0 14px rgba(180, 120, 255, 0.22));
}
.pw-wheel-ring {
  border: 1px solid rgba(115, 205, 242, 0.28);
  background: linear-gradient(
    180deg,
    rgba(61, 114, 134, 0.22),
    hsl(calc(var(--th-bh) + 15.9) calc(36.5% * var(--th-bs)) 12.4% / 0.1)
  );
  padding: 10px 12px;
  display: grid;
  gap: 6px;
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.pw-wheel-card.biotic .pw-wheel-ring {
  border-color: rgba(168, 129, 255, 0.28);
  background: linear-gradient(180deg, rgba(108, 82, 160, 0.18), rgba(25, 22, 41, 0.08));
}
.pw-wheel-ring:active {
  cursor: grabbing;
}
.pw-wheel-slot {
  padding: 7px 8px;
  border: 1px solid transparent;
  font:
    800 11px Consolas,
    monospace;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #7caab7;
  opacity: 0.56;
  transform: scale(0.95);
}
.pw-wheel-slot.active {
  border-color: #5bc9f0;
  background: rgba(59, 143, 180, 0.14);
  color: #ecfbff;
  opacity: 1;
  transform: scale(1.02);
}
.pw-wheel-card.biotic .pw-wheel-slot.active {
  border-color: #b07cff;
  background: rgba(119, 79, 194, 0.16);
}
.pw-wheel-help {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  align-items: center;
  margin-top: 8px;
  font:
    10px Consolas,
    monospace;
  color: #93a8b0;
}
.pw-wheel-help .btn-row {
  gap: 6px;
}
.pw-deck-card {
  border: 1px solid #3a4953;
  background: linear-gradient(
    165deg,
    hsl(calc(var(--th-bh) + 19) calc(22.7% * var(--th-bs)) 8.6%),
    hsl(calc(var(--th-bh) + 15) calc(22.2% * var(--th-bs)) 10.6%)
  );
  padding: 12px;
}
.pw-deck-card.biotic {
  border-color: #483b5f;
  background: linear-gradient(165deg, #13131b, #1a1524);
}
.pw-deck-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  border-bottom: 1px solid hsl(calc(var(--th-bh) + 21.1) calc(18.4% * var(--th-bs)) 24.5%);
  padding-bottom: 8px;
  margin-bottom: 10px;
}
.pw-deck-card.biotic .pw-deck-head {
  border-color: #3f3352;
}
.pw-deck-head b {
  font:
    800 12px Consolas,
    monospace;
  letter-spacing: 1px;
  color: #efefe6;
}
.pw-deck-head small {
  color: #8fa1a6;
  font:
    10px/1.4 Consolas,
    monospace;
}
.pw-support {
  margin-top: 14px;
}
.pw-support .grid.side {
  align-items: start;
}
@media (max-width: 980px) {
  .pw-console {
    grid-template-columns: 1fr;
  }
  .pw-wheel-card {
    min-height: auto;
  }
}
.px-action-full {
  align-items: flex-start !important;
  flex-wrap: wrap;
  gap: 10px;
}
.px-action-full > div:first-child {
  flex: 1;
  min-width: 210px;
}
.px-action-full .prox-roll-actions {
  max-width: 100%;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}
.px-inline-tier {
  min-width: 56px;
  width: 64px !important;
  padding: 6px !important;
  background: hsl(calc(var(--th-bh) + 1.7) calc(19.1% * var(--th-bs)) 9.2%) !important;
  color: hsl(calc(var(--th-h) + 1.9) calc(73.1% * var(--th-s)) calc(76.7% + var(--th-l))) !important;
  border: 1px solid hsl(calc(var(--th-h) + 2.6) calc(22.1% * var(--th-s)) calc(30.2% + var(--th-l))) !important;
}
.px-action-full .power-facts {
  margin-top: 6px;
}
.px-mod-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.px-mod-card {
  background: linear-gradient(
    140deg,
    hsl(calc(var(--th-bh) + 1.7) calc(19.1% * var(--th-bs)) 9.2%),
    hsl(calc(var(--th-bh) + 7) calc(17.2% * var(--th-bs)) 5.7%)
  );
  border: 1px solid hsl(calc(var(--th-h) + -3.8) calc(33.3% * var(--th-s)) calc(30% + var(--th-l)));
  padding: 14px;
  min-width: 0;
  display: grid;
  gap: 8px;
  border-radius: 5px;
}
.px-mod-head {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 10.7) calc(13.7% * var(--th-s)) calc(20% + var(--th-l)));
  padding-bottom: 9px;
}
.px-mod-head strong {
  font:
    800 13px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 0.1) calc(68.8% * var(--th-s)) calc(59.8% + var(--th-l)));
  letter-spacing: 1.1px;
}
.px-mod-head span {
  font:
    10px Consolas,
    monospace;
  color: #b9bbaf;
}
.px-mod-row {
  padding: 8px 0;
  border-top: 1px solid #32352f;
}
.px-mod-row .field {
  margin-bottom: 4px;
}
.px-mod-card .fields.two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.px-mod-card select {
  min-width: 0;
  width: 100%;
}
.px-enemy-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}
.px-enemy {
  border: 1px solid hsl(calc(var(--th-h) + -4.3) calc(37.8% * var(--th-s)) calc(29% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + 2.5) calc(19% * var(--th-bs)) 8.2%);
  padding: 13px;
  display: grid;
  gap: 10px;
}
.px-enemy-title {
  font:
    700 12px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -1.2) calc(68.6% * var(--th-s)) calc(58.8% + var(--th-l)));
}
.px-enemy-stats {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.px-enemy-stats span {
  background: hsl(calc(var(--th-bh) + -12.5) calc(10.3% * var(--th-bs)) 15.3%);
  border: 1px solid #4e503e;
  padding: 5px;
  font:
    700 11px Consolas,
    monospace;
}
.px-loot-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #36382c;
  padding: 12px 0;
}
.px-loot-row > div {
  flex: 1;
  min-width: 0;
}
@media (max-width: 970px) {
  .px-mod-grid,
  .px-enemy-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 580px) {
  .px-mod-card .fields.two {
    grid-template-columns: 1fr;
  }
  .px-barrier-top {
    flex-wrap: wrap;
  }
}

.px-score-workshop {
  display: grid;
  gap: 13px;
  min-width: 0;
  color: #e6eaf0;
}
.px-score-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-bottom: 9px;
  border-bottom: 1px solid #384051;
}
.px-score-heading b {
  display: block;
  font-family: var(--head, monospace);
  letter-spacing: 0.07em;
  color: hsl(calc(var(--th-h) + -2.3) calc(80.2% * var(--th-s)) calc(64.3% + var(--th-l)));
  font-size: 13px;
}
.px-score-heading small {
  display: block;
  color: #9ea8b8;
  margin-top: 4px;
  font-size: 11px;
}
.px-score-verified {
  font-size: 10px;
  white-space: nowrap;
  letter-spacing: 0.07em;
  color: hsl(calc(var(--th-h) + -1.5) calc(62.6% * var(--th-s)) calc(60.2% + var(--th-l)));
  font-family: monospace;
}
.px-score-methods {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 7px;
}
.px-score-method {
  background: hsl(calc(var(--th-bh) + 32.5) calc(33.3% * var(--th-bs)) 9.4%);
  border: 1px solid hsl(calc(var(--th-bh) + 28.6) calc(19.7% * var(--th-bs)) 24.9%);
  border-radius: 5px;
  color: #d0d6df;
  text-align: left;
  padding: 11px 9px;
  cursor: pointer;
  min-height: 67px;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease;
}
.px-score-method b {
  display: block;
  font-size: 11px;
  letter-spacing: 0.04em;
  white-space: normal;
}
.px-score-method small {
  display: block;
  line-height: 1.3;
  color: #8290a4;
  font-size: 10px;
  margin-top: 5px;
}
.px-score-method:hover {
  border-color: hsl(calc(var(--th-h) + -1.3) calc(46% * var(--th-s)) calc(48.6% + var(--th-l)));
  transform: translateY(-2px);
}
.px-score-method.active {
  background: hsl(calc(var(--th-h) + 5) calc(17.1% * var(--th-s)) calc(13.7% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -2.5) calc(73.7% * var(--th-s)) calc(59.8% + var(--th-l)));
  box-shadow: inset 0 2px 0 hsl(calc(var(--th-h) + -2.5) calc(73.7% * var(--th-s)) calc(59.8% + var(--th-l)));
}
.px-score-method.active b {
  color: hsl(calc(var(--th-h) + -2.3) calc(80.2% * var(--th-s)) calc(64.3% + var(--th-l)));
}
.px-score-notice {
  font-size: 12px;
  background: hsl(calc(var(--th-bh) + 28.8) calc(25.8% * var(--th-bs)) 12.2%);
  border: 1px solid #364255;
  padding: 12px;
  border-left: 3px solid hsl(calc(var(--th-h) + -1.4) calc(46.2% * var(--th-s)) calc(49.6% + var(--th-l)));
  line-height: 1.55;
  color: #b8c4d3;
}
.px-score-notice b {
  color: hsl(calc(var(--th-h) + -2.6) calc(81% * var(--th-s)) calc(67.1% + var(--th-l)));
}
.px-score-notice.bad {
  border-left-color: #e45b52;
}
.px-score-budget {
  height: 7px;
  background: hsl(calc(var(--th-bh) + 32.1) calc(18.9% * var(--th-bs)) 21.8%);
  border-radius: 5px;
  overflow: hidden;
  margin: 9px 0;
}
.px-score-budget span {
  display: block;
  height: 100%;
  background: linear-gradient(
    90deg,
    hsl(calc(var(--th-h) + -1.1) calc(48.2% * var(--th-s)) calc(33.3% + var(--th-l))),
    hsl(calc(var(--th-h) + -1.9) calc(75.6% * var(--th-s)) calc(61.4% + var(--th-l)))
  );
  transition: width 0.25s;
}
.px-score-btns,
.px-score-rolled-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.px-score-small {
  background: #2a2b29;
  border: 1px solid hsl(calc(var(--th-h) + -1.5) calc(29.1% * var(--th-s)) calc(34.3% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -2.3) calc(80.2% * var(--th-s)) calc(64.3% + var(--th-l)));
  border-radius: 4px;
  min-height: 30px;
  padding: 6px 10px;
  cursor: pointer;
  font-size: 11px;
  font-family: monospace;
}
.px-score-small:hover {
  background: hsl(calc(var(--th-h) + -0.5) calc(27.4% * var(--th-s)) calc(22.2% + var(--th-l)));
}
.px-score-dice {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  margin: 11px 0;
}
.px-score-dice > div {
  background: hsl(calc(var(--th-bh) + 30.3) calc(39.5% * var(--th-bs)) 8.4%);
  border: 1px solid #303e51;
  padding: 9px 4px;
  text-align: center;
  min-width: 0;
}
.px-score-dice b {
  display: block;
  font-size: 23px;
  color: hsl(calc(var(--th-h) + -1.9) calc(74.1% * var(--th-s)) calc(60.6% + var(--th-l)));
}
.px-score-dice small {
  font: 10px monospace;
  display: block;
  white-space: normal;
  color: #aab6c5;
}
.px-score-dice s {
  color: #ed7776;
  text-decoration-thickness: 2px;
}
.px-score-rows {
  display: grid;
  gap: 5px;
}
.px-score-line {
  display: grid;
  grid-template-columns: minmax(92px, 1fr) minmax(125px, 1.1fr) minmax(67px, 0.7fr) minmax(100px, 1.1fr);
  align-items: center;
  gap: 9px;
  background: hsl(calc(var(--th-bh) + 28.8) calc(32% * var(--th-bs)) 9.8%);
  border: 1px solid hsl(calc(var(--th-bh) + 31.9) calc(21.3% * var(--th-bs)) 23.9%);
  padding: 8px 11px;
  border-radius: 4px;
}
.px-score-name b {
  display: block;
  color: hsl(calc(var(--th-h) + -3.6) calc(75.9% * var(--th-s)) calc(67.5% + var(--th-l)));
  font-size: 13px;
  letter-spacing: 0.1em;
}
.px-score-name small {
  font-size: 10px;
  color: #9aa6b5;
}
.px-score-select {
  max-width: 100%;
  width: 100%;
  color: #dfe8f1;
  background: hsl(calc(var(--th-bh) + 26.3) calc(25.3% * var(--th-bs)) 17.8%);
  border: 1px solid #495265;
  padding: 9px;
  border-radius: 3px;
  font-size: 12px;
}
.px-score-current {
  font-size: 18px;
  color: #c9d2e0;
}
.px-score-numbers strong {
  display: block;
  font-size: 21px;
  line-height: 1.1;
  color: #f7fafc;
}
.px-score-numbers small,
.px-score-bonus {
  color: #8c9eb2;
  font-size: 10px;
}
.px-score-footer {
  font: 11px monospace;
  color: #8fc6ac;
}
.px-score-gm {
  background: #1a1c23;
  border: 1px dashed hsl(calc(var(--th-h) + -0.3) calc(22.1% * var(--th-s)) calc(38.2% + var(--th-l)));
  border-radius: 5px;
  padding: 11px;
}
.px-score-gm summary {
  cursor: pointer;
  font: 12px var(--head, monospace);
  letter-spacing: 0.07em;
  color: hsl(calc(var(--th-h) + -3.2) calc(67.7% * var(--th-s)) calc(68.4% + var(--th-l)));
}
.px-score-gm summary span {
  float: right;
  font-size: 10px;
}
.px-score-gm p {
  font-size: 11px;
  color: #a8b2c0;
  line-height: 1.5;
}
.px-score-gm-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.px-score-gm-grid label {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.px-score-gm-grid small {
  font: 10px monospace;
  color: hsl(calc(var(--th-h) + -3.7) calc(66.8% * var(--th-s)) calc(63.3% + var(--th-l)));
}
.px-score-gm-grid input {
  width: 100%;
  min-width: 0;
  background: hsl(calc(var(--th-bh) + 29.3) calc(31.8% * var(--th-bs)) 8.6%);
  color: #f0f4f8;
  border: 1px solid #5d6269;
  border-radius: 3px;
  padding: 8px 4px;
}
.px-score-muted {
  color: #8391a5 !important;
}
@media (max-width: 900px) {
  .px-score-methods {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .px-score-dice {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .px-score-gm-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 580px) {
  .px-score-line {
    grid-template-columns: 80px minmax(100px, 1fr) 65px;
  }
  .px-score-bonus {
    grid-column: 2 / -1;
  }
  .px-score-heading {
    align-items: start;
    flex-direction: column;
  }
  .px-score-method {
    padding: 9px 6px;
  }
  .px-score-gm-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.px-gate-shell {
  --prox-gold: hsl(calc(var(--th-h) + -1.3) calc(66.4% * var(--th-s)) calc(53.3% + var(--th-l)));
  --prox-line: hsl(calc(var(--th-h) + -2) calc(44.8% * var(--th-s)) calc(26.3% + var(--th-l)));
  min-height: 100svh;
  position: relative;
  isolation: isolate;
  background: radial-gradient(
      ellipse at 65% -25%,
      hsl(calc(var(--th-h) + -3) calc(65.9% * var(--th-s)) calc(43.7% + var(--th-l)) / 0.1),
      transparent 60%
    ),
    linear-gradient(
      140deg,
      hsl(calc(var(--th-bh) + -5) calc(13% * var(--th-bs)) 4.5%),
      hsl(calc(var(--th-bh) + -5) calc(10.5% * var(--th-bs)) 7.5%) 55%,
      hsl(calc(var(--th-bh) + -25) calc(13% * var(--th-bs)) 4.5%)
    );
  color: hsl(calc(var(--th-h) + -0.8) calc(37.3% * var(--th-s)) calc(90% + var(--th-l)));
  overflow-x: hidden;
}
.px-gate-grid {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: linear-gradient(
      hsl(calc(var(--th-h) + -1.6) calc(48.7% * var(--th-s)) calc(46.7% + var(--th-l)) / 0) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      hsl(calc(var(--th-h) + -1.6) calc(48.7% * var(--th-s)) calc(46.7% + var(--th-l)) / 0) 1px,
      transparent 1px
    );
  background-size: 58px 58px;
  mask-image: linear-gradient(100deg, transparent 3%, black 55%, transparent 100%);
}
.px-gate-shell::before {
  content: '';
  position: absolute;
  pointer-events: none;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(
    90deg,
    transparent,
    hsl(calc(var(--th-h) + -3.2) calc(60.8% * var(--th-s)) calc(49% + var(--th-l))),
    transparent
  );
  opacity: 0.8;
}
.px-gate-header {
  min-height: 86px;
  padding: 22px clamp(22px, 5vw, 86px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 2.7) calc(41.5% * var(--th-s)) calc(20.8% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + -5) calc(27.3% * var(--th-bs)) 2.2% / 0.7);
}
.px-gate-brand {
  display: flex;
  align-items: center;
  gap: 16px;
}
.px-gate-brand img {
  width: 56px;
  height: 50px;
  object-fit: contain;
  filter: drop-shadow(
    0 0 15px hsl(calc(var(--th-h) + -2.3) calc(67.5% * var(--th-s)) calc(50.6% + var(--th-l)) / 0.2)
  );
}
.px-gate-brand div {
  display: grid;
  gap: 5px;
}
.px-gate-brand b {
  font:
    900 24px 'Arial Narrow',
    var(--head);
  color: hsl(calc(var(--th-h) + -0.6) calc(76.7% * var(--th-s)) calc(57.8% + var(--th-l)));
  letter-spacing: 3.4px;
}
.px-gate-brand span {
  font:
    10px Consolas,
    monospace;
  letter-spacing: 1.4px;
  color: hsl(calc(var(--th-h) + -2.8) calc(13.7% * var(--th-s)) calc(61.4% + var(--th-l)));
}
.px-gate-classification,
.px-gate-node {
  font:
    10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -2.7) calc(30% * var(--th-s)) calc(60.2% + var(--th-l)));
  letter-spacing: 1.5px;
  text-align: center;
}
.px-gate-node {
  border: 1px solid hsl(calc(var(--th-h) + 0.6) calc(43.1% * var(--th-s)) calc(22.7% + var(--th-l)));
  padding: 10px;
  color: hsl(calc(var(--th-h) + -2.3) calc(50% * var(--th-s)) calc(53.7% + var(--th-l)));
}
.px-gate-exit {
  background: transparent;
  color: hsl(calc(var(--th-h) + 0) calc(58% * var(--th-s)) calc(60.8% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -3.9) calc(45.8% * var(--th-s)) calc(32.5% + var(--th-l)));
  padding: 10px 15px;
  font:
    700 11px Consolas,
    monospace;
  letter-spacing: 1px;
  cursor: pointer;
  transition:
    background 0.22s,
    transform 0.22s;
}
.px-gate-exit:hover {
  background: hsl(calc(var(--th-h) + 0.2) calc(65.8% * var(--th-s)) calc(43.5% + var(--th-l)) / 0.2);
  transform: translateY(-2px);
}
.px-gate-main {
  margin: auto;
  width: min(1290px, calc(100% - 44px));
  padding: clamp(28px, 5vw, 64px) 0 52px;
}
.px-roster-stage {
  animation: pxRiseIn 0.52s cubic-bezier(0.22, 0.75, 0.25, 1) both;
}
.px-gate-intro {
  text-align: center;
  max-width: 850px;
  margin: 0 auto 46px;
}
.px-eyebrow {
  font:
    11px Consolas,
    monospace;
  letter-spacing: 1.7px;
  color: hsl(calc(var(--th-h) + 0.1) calc(48.4% * var(--th-s)) calc(55.9% + var(--th-l)));
}
.px-eyebrow i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #90bf92;
  box-shadow: 0 0 9px #90bf9277;
  margin: 0 10px 2px;
}
.px-gate-intro h1 {
  font:
    900 clamp(34px, 5vw, 66px) / 1.05 'Arial Narrow',
    var(--head);
  letter-spacing: 2px;
  margin: 22px 0 12px;
  color: hsl(calc(var(--th-h) + -1) calc(51.7% * var(--th-s)) calc(94.3% + var(--th-l)));
}
.px-gate-intro h1 em {
  color: hsl(calc(var(--th-h) + -2) calc(69.2% * var(--th-s)) calc(54.1% + var(--th-l)));
  font-style: normal;
}
.px-gate-intro p {
  color: #b0b3ad;
  line-height: 1.7;
  max-width: 570px;
  margin: 0 auto;
}
.px-gate-roster {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr));
  gap: 16px;
  align-items: stretch;
}
.px-create-card,
.px-select-operative {
  min-height: 290px;
  background: hsl(calc(var(--th-bh) + -5) calc(12.8% * var(--th-bs)) 7.6%);
  border: 1px solid hsl(calc(var(--th-h) + -1.5) calc(31.2% * var(--th-s)) calc(25.1% + var(--th-l)));
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 20px;
  transition:
    border-color 0.24s,
    transform 0.24s,
    box-shadow 0.24s;
}
.px-create-card {
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-style: dashed;
  color: hsl(calc(var(--th-h) + -0.7) calc(71.9% * var(--th-s)) calc(62.4% + var(--th-l)));
  cursor: pointer;
  background: radial-gradient(
      circle at center,
      hsl(calc(var(--th-h) + -4.2) calc(66% * var(--th-s)) calc(28.8% + var(--th-l)) / 0.1),
      transparent 65%
    ),
    hsl(calc(var(--th-bh) + -35) calc(10.5% * var(--th-bs)) 7.5%);
  font-family: inherit;
}
.px-create-card:hover,
.px-create-card:focus-visible,
.px-select-operative:hover {
  transform: translateY(-5px);
  border-color: hsl(calc(var(--th-h) + -3.4) calc(65% * var(--th-s)) calc(51.8% + var(--th-l)));
  box-shadow:
    0 15px 25px #0007,
    inset 0 0 0 1px hsl(calc(var(--th-h) + -3.5) calc(54.2% * var(--th-s)) calc(37.6% + var(--th-l)) / 0.3);
}
.px-plus-ring {
  width: 94px;
  height: 94px;
  border: 1px solid hsl(calc(var(--th-h) + -3.6) calc(56.3% * var(--th-s)) calc(44.9% + var(--th-l)));
  display: grid;
  place-items: center;
  clip-path: polygon(25% 0, 75% 0, 100% 25%, 100% 75%, 75% 100%, 25% 100%, 0 75%, 0 25%);
  background: hsl(calc(var(--th-h) + -2.3) calc(72.7% * var(--th-s)) calc(56.9% + var(--th-l)) / 0.1);
  transition:
    transform 0.28s,
    background 0.28s;
}
.px-create-card:hover .px-plus-ring {
  transform: scale(1.08) rotate(45deg);
  background: hsl(calc(var(--th-h) + -2.3) calc(72.7% * var(--th-s)) calc(56.9% + var(--th-l)) / 0.2);
}
.px-plus-ring span {
  font: 200 65px/1 system-ui;
  color: hsl(calc(var(--th-h) + -0.9) calc(76.4% * var(--th-s)) calc(58.4% + var(--th-l)));
}
.px-create-card strong {
  letter-spacing: 1.4px;
  font: 800 18px var(--head);
}
.px-create-card small {
  font:
    10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 3) calc(13% * var(--th-s)) calc(54.9% + var(--th-l)));
  letter-spacing: 1px;
}
.px-create-corner {
  position: absolute;
  bottom: 16px;
  right: 18px;
  font:
    9px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -3.2) calc(42.6% * var(--th-s)) calc(41% + var(--th-l)));
}
.px-select-operative {
  animation: pxRiseIn 0.5s ease both;
  animation-delay: calc(var(--idx) * 65ms);
}
.px-select-top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.px-select-id {
  font:
    9px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 3.4) calc(12.7% * var(--th-s)) calc(52% + var(--th-l)));
}
.px-select-status {
  font:
    9px Consolas,
    monospace;
  color: #86c6a7;
  letter-spacing: 0.5px;
}
.px-select-status.draft {
  color: hsl(calc(var(--th-h) + -3.9) calc(67.4% * var(--th-s)) calc(63.9% + var(--th-l)));
}
.px-select-avatar {
  width: 54px;
  height: 54px;
  border: 1px solid hsl(calc(var(--th-h) + -1.2) calc(50% * var(--th-s)) calc(30.6% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 0.2) calc(54.8% * var(--th-s)) calc(50.6% + var(--th-l)) / 0.1);
  margin-top: 19px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.px-select-avatar img {
  width: 35px;
  height: 35px;
  object-fit: contain;
}
.px-select-avatar span {
  display: none;
}
.px-select-operative h3 {
  font: 900 22px var(--head);
  margin: 18px 0 4px;
  letter-spacing: 0.5px;
  overflow-wrap: anywhere;
}
.px-select-operative p {
  font:
    11px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -3.1) calc(43.9% * var(--th-s)) calc(61.6% + var(--th-l)));
  margin: 0;
}
.px-select-line {
  font-size: 11px;
  color: #a6a5a0;
  margin-top: 9px;
  min-height: 34px;
  line-height: 1.5;
}
.px-select-open {
  width: 100%;
  margin-top: auto;
  border: 1px solid hsl(calc(var(--th-h) + -2.9) calc(39.2% * var(--th-s)) calc(47.1% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -3.8) calc(51.1% * var(--th-s)) calc(36.9% + var(--th-l)) / 0.1);
  color: hsl(calc(var(--th-h) + -3.1) calc(76.2% * var(--th-s)) calc(75.3% + var(--th-l)));
  padding: 12px;
  display: flex;
  justify-content: space-between;
  font:
    700 11px Consolas,
    monospace;
  cursor: pointer;
  transition: background 0.2s;
}
.px-select-open:hover {
  background: hsl(calc(var(--th-h) + -2) calc(51.8% * var(--th-s)) calc(52% + var(--th-l)) / 0.3);
}
.px-select-tools {
  display: flex;
  gap: 8px;
  margin-top: 9px;
}
.px-select-tools .btn {
  flex: 1;
}
.px-empty-roster,
.px-gate-footnote {
  margin: 24px auto;
  color: #958e79;
  font:
    10px Consolas,
    monospace;
  text-align: center;
  line-height: 1.8;
  letter-spacing: 1px;
}
.px-gate-bottom {
  padding: 17px 30px;
  display: flex;
  justify-content: space-between;
  gap: 15px;
  border-top: 1px solid hsl(calc(var(--th-h) + 1.7) calc(38.5% * var(--th-s)) calc(22.9% + var(--th-l)));
  color: #88816c;
  font:
    9px Consolas,
    monospace;
  letter-spacing: 1px;
}
.px-onboard-shell .px-gate-main {
  max-width: 1200px;
  padding-top: 32px;
  animation: pxRiseIn 0.4s ease both;
}
.px-onboard-shell .recruit-head {
  margin: 0 0 10px;
}
.px-onboard-shell .recruit-stepnav {
  margin: 8px 0 25px;
}
.px-onboard-shell .recruit-stage {
  min-height: 365px;
}
.px-onboard-shell .wizard-footer {
  padding: 24px 0;
  position: relative;
}
.px-onboard-shell .wizard-step[disabled] {
  opacity: 0.35;
  cursor: not-allowed;
}
.px-onboard-shell .recruit-count {
  border-color: hsl(calc(var(--th-h) + -2.5) calc(43.9% * var(--th-s)) calc(32.2% + var(--th-l)));
}
.px-wizard-progress {
  height: 4px;
  background: hsl(calc(var(--th-h) + -2.5) calc(33.3% * var(--th-s)) calc(14.1% + var(--th-l)));
  overflow: hidden;
  margin: 17px 0 18px;
}
.px-wizard-progress-fill {
  height: 100%;
  background: linear-gradient(
    90deg,
    hsl(calc(var(--th-h) + -3.9) calc(66% * var(--th-s)) calc(31.2% + var(--th-l))),
    hsl(calc(var(--th-h) + -1.1) calc(70.3% * var(--th-s)) calc(60.4% + var(--th-l)))
  );
  transition: width 0.36s ease;
}
.px-onboard-shell .px-gate-stage {
  animation: pxStepIn 0.45s cubic-bezier(0.2, 0.7, 0.2, 1) both;
}
.px-onboard-shell.px-changing-step .px-gate-stage {
  opacity: 0;
  transform: translateX(-18px);
  transition:
    opacity 0.17s,
    transform 0.17s;
  animation: none;
}
.px-onboard-shell.px-opening-terminal {
  opacity: 0;
  transform: translateY(-22px);
  transition:
    opacity 0.35s,
    transform 0.35s;
}
@keyframes pxRiseIn {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes pxStepIn {
  from {
    opacity: 0;
    transform: translateX(17px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@media (max-width: 750px) {
  .px-gate-header {
    flex-wrap: wrap;
    padding: 17px 22px;
  }
  .px-gate-classification {
    display: none;
  }
  .px-gate-main {
    width: calc(100% - 32px);
  }
  .px-gate-bottom {
    flex-wrap: wrap;
  }
  .px-gate-intro h1 {
    font-size: 38px;
  }
  .px-onboard-shell .recruit-stepnav {
    overflow: auto;
    display: flex;
  }
  .px-onboard-shell .recruit-stepnav .wizard-step {
    flex: 0 0 110px;
  }
  .px-gate-exit {
    margin-left: auto;
  }
}
@media (prefers-reduced-motion: reduce) {
  .px-gate-shell * {
    animation: none !important;
    transition: none !important;
  }
}

@media (min-width: 801px) {
  .sidebar {
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: hsl(calc(var(--th-h) + -6) calc(34.5% * var(--th-s)) calc(34.1% + var(--th-l)))
      hsl(calc(var(--th-bh) + 7) calc(17.2% * var(--th-bs)) 5.7%);
  }
  .sidebar .nav-label {
    padding: 15px 12px 7px;
  }
  .sidebar .nav-btn {
    padding-top: 9px;
    padding-bottom: 9px;
  }
}
@media (max-width: 800px) {
  .sidebar {
    overflow-y: hidden;
  }
}

.px-perk-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  margin: 14px 0;
}
.px-perk-tier {
  min-width: 0;
  border: 1px solid hsl(calc(var(--th-h) + -2.3) calc(33.3% * var(--th-s)) calc(34.7% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + -5) calc(17.4% * var(--th-bs)) 9%);
  padding: 13px;
  display: grid;
  gap: 9px;
}
.px-perk-tier.locked {
  border-color: #42453e;
  opacity: 0.65;
}
.px-perk-title {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid hsl(calc(var(--th-h) + -4.4) calc(26.6% * var(--th-s)) calc(25.1% + var(--th-l)));
  padding-bottom: 8px;
  font: 800 11px var(--head);
  color: hsl(calc(var(--th-h) + -1.2) calc(76% * var(--th-s)) calc(65.7% + var(--th-l)));
}
.px-perk-title span {
  color: hsl(calc(var(--th-h) + 1) calc(26.4% * var(--th-s)) calc(68% + var(--th-l)));
  font-size: 9px;
  text-align: right;
}
.px-perk-detail {
  padding: 10px;
  background: #1e241e;
  border-left: 3px solid hsl(calc(var(--th-h) + 0.6) calc(41.3% * var(--th-s)) calc(50.6% + var(--th-l)));
  font-size: 12px;
  line-height: 1.5;
}
.px-perk-detail b {
  color: hsl(calc(var(--th-h) + -0.6) calc(82.8% * var(--th-s)) calc(77.3% + var(--th-l)));
}
.px-perk-detail p {
  margin: 5px 0;
  color: hsl(calc(var(--th-h) + 4.4) calc(21.5% * var(--th-s)) calc(84.5% + var(--th-l)));
}
.px-perk-detail small {
  color: #b7baa9;
}
.px-perk-use {
  margin-top: 9px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  color: hsl(calc(var(--th-h) + -1.8) calc(68.2% * var(--th-s)) calc(69.2% + var(--th-l)));
  font: 700 11px var(--head);
}
.px-perk-warning {
  margin-top: 9px;
  color: #ffa08f;
  font: 700 11px/1.5 var(--head);
}
.px-perk-opt {
  padding: 8px 0;
  border-top: 1px solid #333d35;
}
.px-perk-opt strong {
  color: hsl(calc(var(--th-h) + -1) calc(76.2% * var(--th-s)) calc(72% + var(--th-l)));
}
.px-perk-opt span {
  font: 10px var(--head);
  color: #a8bfaa;
}
.px-perk-opt p {
  font-size: 11px;
  margin: 4px 0;
}
.px-perk-opt small {
  color: #aeb4a3;
}
.px-faction-bands {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 5px;
  margin: 14px 0;
}
.px-faction-bands span {
  padding: 9px 4px;
  border: 1px solid hsl(calc(var(--th-h) + 1.5) calc(22.3% * var(--th-s)) calc(27.3% + var(--th-l)));
  background: #1d231d;
  min-width: 0;
  text-align: center;
  display: grid;
  gap: 6px;
}
.px-faction-bands b {
  font: 700 10px var(--head);
  color: hsl(calc(var(--th-h) + 7.8) calc(18.8% * var(--th-s)) calc(73.9% + var(--th-l)));
  overflow-wrap: anywhere;
}
.px-faction-bands strong {
  font: 800 19px var(--head);
  color: hsl(calc(var(--th-h) + -2.5) calc(70.6% * var(--th-s)) calc(66.7% + var(--th-l)));
}
.px-consequence {
  background: hsl(calc(var(--th-bh) + 1.7) calc(20.9% * var(--th-bs)) 8.4%);
  border: 1px solid #42483d;
  padding: 12px;
  font-size: 12px;
  color: #bfc2b6;
  line-height: 1.55;
}
.px-consequence b {
  font: 800 12px var(--head);
  color: hsl(calc(var(--th-h) + -0.1) calc(74.3% * var(--th-s)) calc(66.5% + var(--th-l)));
}
.px-consequence p {
  margin: 6px 0 0;
}
@media (max-width: 900px) {
  .px-faction-bands {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 660px) {
  .px-perk-grid {
    grid-template-columns: 1fr;
  }
  .px-faction-bands {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .px-rep-table th:nth-child(3),
  .px-rep-table td:nth-child(3) {
    display: none;
  }
}

.px-stage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.px-stage-card {
  border: 1px solid hsl(calc(var(--th-h) + -3.9) calc(36.5% * var(--th-s)) calc(29% + var(--th-l)));
  background: linear-gradient(140deg, #1b201b, hsl(calc(var(--th-bh) + -13.6) calc(17.1% * var(--th-bs)) 8%));
  padding: 14px;
  min-width: 0;
}
.px-stage-card.danger {
  border-color: #b76648;
  background: #251b19;
}
.px-stage-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}
.px-stage-head strong {
  font: 800 13px var(--head);
  color: hsl(calc(var(--th-h) + -0.8) calc(79.6% * var(--th-s)) calc(69.2% + var(--th-l)));
  letter-spacing: 0.7px;
}
.px-stage-counter {
  display: flex;
  align-items: center;
  gap: 9px;
}
.px-stage-counter button {
  border: 1px solid hsl(calc(var(--th-h) + -1.3) calc(40% * var(--th-s)) calc(45.1% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -0) calc(32.6% * var(--th-s)) calc(16.9% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.8) calc(100% * var(--th-s)) calc(81.4% + var(--th-l)));
  font: 800 17px var(--head);
  width: 36px;
  height: 34px;
  cursor: pointer;
}
.px-stage-counter .px-stage-number {
  display: grid;
  place-items: center;
  min-width: 43px;
  height: 36px;
  background: hsl(calc(var(--th-bh) + 3.6) calc(24.1% * var(--th-bs)) 5.7%);
  color: hsl(calc(var(--th-h) + -1.2) calc(82.5% * var(--th-s)) calc(79.8% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -0.4) calc(26.5% * var(--th-s)) calc(28.8% + var(--th-l)));
  font: 800 24px var(--head);
}
.px-stage-track {
  display: flex;
  gap: 5px;
  margin: 12px 0;
}
.px-stage-track span {
  flex: 1;
  height: 8px;
  background: #303834;
  border: 1px solid hsl(calc(var(--th-h) + 12.4) calc(14.3% * var(--th-s)) calc(31.6% + var(--th-l)));
}
.px-stage-track span.on {
  background: hsl(calc(var(--th-h) + -0.2) calc(55.4% * var(--th-s)) calc(52.5% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -0.4) calc(79.6% * var(--th-s)) calc(69.2% + var(--th-l)));
}
.px-stage-effects {
  display: grid;
  gap: 5px;
  font-size: 11px;
  line-height: 1.5;
}
.px-stage-effects div {
  border-left: 2px solid hsl(calc(var(--th-h) + -2.1) calc(22% * var(--th-s)) calc(31.2% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + 1.7) calc(20.9% * var(--th-bs)) 8.4%);
  padding: 6px 9px;
}
.px-stage-effects div.current {
  border-left-color: hsl(calc(var(--th-h) + -3.2) calc(74% * var(--th-s)) calc(60.8% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 4.1) calc(16.4% * var(--th-s)) calc(13.1% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -1.2) calc(84.1% * var(--th-s)) calc(82.7% + var(--th-l)));
}
.px-conditions-tag {
  display: inline-block;
  padding: 3px 6px;
  border: 1px solid hsl(calc(var(--th-h) + -0.3) calc(32.5% * var(--th-s)) calc(33.1% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 1.2) calc(17.8% * var(--th-s)) calc(14.3% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.1) calc(87.2% * var(--th-s)) calc(72.4% + var(--th-l)));
  font: 800 10px var(--head);
  margin-left: 7px;
}
.px-status-note {
  font-size: 11px;
  color: #c1c3b7;
  line-height: 1.5;
  margin-top: 5px;
}
.px-condition-entry {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 1px solid #3d4339;
  padding: 9px 0;
}
.px-condition-entry:last-child {
  border-bottom: 0;
}
.px-status-legend {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin: 12px 0;
}
.px-status-legend span {
  border: 1px solid hsl(calc(var(--th-h) + 1.5) calc(24.4% * var(--th-s)) calc(32.2% + var(--th-l)));
  padding: 4px 7px;
  font: 10px var(--head);
  color: hsl(calc(var(--th-h) + -2.6) calc(52.9% * var(--th-s)) calc(65.9% + var(--th-l)));
  background: #24251d;
}
.px-rep-meters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.px-rep-meter {
  border: 1px solid hsl(calc(var(--th-h) + -2.5) calc(32% * var(--th-s)) calc(29.4% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + 1.7) calc(20.9% * var(--th-bs)) 8.4%);
  padding: 14px;
}
.px-rep-meter strong {
  font: 800 23px var(--head);
  color: hsl(calc(var(--th-h) + 0.7) calc(72.2% * var(--th-s)) calc(70.4% + var(--th-l)));
}
.px-rep-meter input {
  margin-top: 8px;
}
.px-rep-meter .track {
  background: #353a33;
  height: 7px;
  margin-top: 9px;
}
.px-rep-meter .fill {
  height: 100%;
  background: #88c5c6;
}
.px-rep-meter.renegade .fill {
  background: #d4755b;
}
.px-rep-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.px-rep-table th {
  text-align: left;
  font: 800 10px var(--head);
  color: hsl(calc(var(--th-h) + -0.8) calc(64% * var(--th-s)) calc(65.1% + var(--th-l)));
  letter-spacing: 1px;
  padding: 9px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + -0) calc(25% * var(--th-s)) calc(28.2% + var(--th-l)));
}
.px-rep-table td {
  padding: 9px;
  border-bottom: 1px solid #343b36;
  vertical-align: middle;
}
.px-rep-table input[type='number'] {
  max-width: 85px;
}
.px-rep-table tr:hover {
  background: #ffffff04;
}
.px-rep-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 12px 0;
}
.px-rep-filter input {
  flex: 1;
  min-width: 180px;
}
.px-rep-filter select {
  width: auto;
  max-width: 220px;
}
.px-rep-badge {
  border: 1px solid hsl(calc(var(--th-h) + -2.5) calc(32.5% * var(--th-s)) calc(33.1% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 5.8) calc(17.8% * var(--th-s)) calc(14.3% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.7) calc(71.6% * var(--th-s)) calc(69.6% + var(--th-l)));
  padding: 4px 6px;
  font: 700 10px var(--head);
  white-space: nowrap;
}
.px-rep-badge.negative {
  border-color: #854638;
  color: #f1a58f;
  background: #37241e;
}
.px-rep-badge.positive {
  border-color: #3e7660;
  color: #b3e2c7;
  background: hsl(calc(var(--th-bh) + -35) calc(34.2% * var(--th-bs)) 14.9%);
}
.px-rep-history {
  max-height: 270px;
  overflow: auto;
}
.px-rep-history .statrow {
  font-size: 11px;
}
.px-rep-history .statrow strong {
  color: hsl(calc(var(--th-h) + 0) calc(66.7% * var(--th-s)) calc(70.6% + var(--th-l)));
}
.px-rep-summary {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  font: 11px var(--head);
}
.px-rep-summary strong {
  color: hsl(calc(var(--th-h) + 0.4) calc(72.6% * var(--th-s)) calc(65.7% + var(--th-l)));
}
.px-rep-summary span {
  color: hsl(calc(var(--th-h) + 9) calc(12.7% * var(--th-s)) calc(69% + var(--th-l)));
}
@media (max-width: 750px) {
  .px-stage-grid,
  .px-rep-meters {
    grid-template-columns: 1fr;
  }
  .px-rep-table {
    font-size: 11px;
  }
  .px-rep-table td,
  .px-rep-table th {
    padding: 7px 3px;
  }
}

.pxg-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  background: hsl(calc(var(--th-bh) + -20) calc(19% * var(--th-bs)) 8.2%);
  border: 1px solid hsl(calc(var(--th-h) + 2.8) calc(30.7% * var(--th-s)) calc(34.5% + var(--th-l)));
  color: #b9c1b4;
  padding: 12px 16px;
  margin: 12px 0;
  font:
    700 10px Consolas,
    monospace;
  letter-spacing: 1px;
}
.pxg-banner strong {
  color: hsl(calc(var(--th-h) + -0.5) calc(68.2% * var(--th-s)) calc(65.5% + var(--th-l)));
}
.pxg-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  background: #92bc78;
  border-radius: 50%;
  margin-right: 7px;
  box-shadow: 0 0 10px #93c77a;
}
.pxg-workspace {
  display: grid;
  grid-template-columns: minmax(340px, 1.05fr) minmax(320px, 0.95fr);
  gap: 13px;
  align-items: stretch;
}
.pxg-rack,
.pxg-browser {
  border: 1px solid #525647;
  background: repeating-linear-gradient(
      90deg,
      hsl(calc(var(--th-bh) + -5) calc(13% * var(--th-bs)) 9%) 0,
      hsl(calc(var(--th-bh) + -5) calc(13% * var(--th-bs)) 9%) 30px,
      #20282066 31px
    ),
    hsl(calc(var(--th-bh) + -5) calc(13% * var(--th-bs)) 9%);
  padding: 14px;
  min-width: 0;
}
.pxg-rack-title {
  font:
    800 11px Consolas,
    monospace;
  letter-spacing: 1.1px;
  color: hsl(calc(var(--th-h) + -0.3) calc(70.5% * var(--th-s)) calc(64.1% + var(--th-l)));
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #45483e;
  padding: 0 0 10px;
  margin: 0 0 12px;
  gap: 8px;
}
.pxg-rack-title small {
  color: #818e86;
  font-size: 9px;
}
.pxg-body {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(2, minmax(148px, auto));
  gap: 10px;
  isolation: isolate;
}
.pxg-silhouette {
  position: absolute;
  inset: 4px 8px;
  display: grid;
  place-items: center;
  opacity: 0.27;
  z-index: -1;
  pointer-events: none;
}
.pxg-silhouette svg {
  height: 100%;
  max-height: 355px;
  width: 100%;
  object-fit: contain;
}
.pxg-slot {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 148px;
  padding: 9px 11px;
  text-align: left;
  color: #d9ded5;
  background: linear-gradient(
    150deg,
    hsl(calc(var(--th-bh) + -11.7) calc(12.3% * var(--th-bs)) 14.3% / 0.9),
    hsl(calc(var(--th-bh) + 3.6) calc(20% * var(--th-bs)) 6.9% / 0.9)
  );
  border: 1px solid #4e5b52;
  clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%);
  overflow: visible;
  min-width: 0;
  transition:
    background 0.16s,
    border-color 0.16s,
    transform 0.16s;
  cursor: pointer;
}
.pxg-slot:hover,
.pxg-slot:focus-visible {
  border-color: hsl(calc(var(--th-h) + 0.4) calc(56.4% * var(--th-s)) calc(58.6% + var(--th-l)));
  z-index: 2;
  background: #29322de8;
}
.pxg-slot.selected {
  border-color: hsl(calc(var(--th-h) + -1.3) calc(77.1% * var(--th-s)) calc(60.6% + var(--th-l)));
  box-shadow: inset 0 0 0 1px
    hsl(calc(var(--th-h) + -1.9) calc(56.5% * var(--th-s)) calc(53.1% + var(--th-l)));
  background: hsl(calc(var(--th-h) + 2.4) calc(26% * var(--th-s)) calc(14.3% + var(--th-l)) / 0.9);
}
.pxg-slot.filled {
  border-left: 3px solid #91ac79;
}
.pxg-slot-head {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  font:
    800 9px Consolas,
    monospace;
  letter-spacing: 0.7px;
  color: hsl(calc(var(--th-h) + 0.5) calc(79.5% * var(--th-s)) calc(71.4% + var(--th-l)));
}
.pxg-slot-head span {
  font-size: 8px;
  color: #8d9e91;
}
.pxg-slot-icon {
  display: grid;
  place-items: center;
  height: 64px;
  color: #b3b89d;
  opacity: 0.85;
}
.pxg-slot-icon svg {
  height: 65px;
  width: 87px;
}
.pxg-slot strong {
  font:
    800 11px Consolas,
    monospace;
  letter-spacing: 0.2px;
  white-space: normal;
  overflow-wrap: anywhere;
  color: #e9eadf;
}
.pxg-slot small {
  margin-top: 4px;
  color: #95a198;
  font-size: 10px;
}
.pxg-slot[data-tip]:hover:after,
.pxg-slot[data-tip]:focus-visible:after {
  content: attr(data-tip);
  position: absolute;
  z-index: 100;
  bottom: calc(100% + 7px);
  left: 0;
  width: min(280px, 75vw);
  white-space: normal;
  background: hsl(calc(var(--th-bh) + 2.5) calc(26.7% * var(--th-bs)) 5.9%);
  color: hsl(calc(var(--th-h) + 0.4) calc(74.5% * var(--th-s)) calc(81.6% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -0.3) calc(47% * var(--th-s)) calc(45.9% + var(--th-l)));
  padding: 10px;
  font:
    11px/1.5 Consolas,
    monospace;
  box-shadow: 0 15px 25px #000c;
  pointer-events: none;
}
.pxg-weapon-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.pxg-weapon-grid .pxg-slot {
  min-height: 135px;
}
.pxg-weapon-grid .pxg-slot-icon {
  height: 50px;
}
.pxg-device-slot .pxg-slot {
  width: 100%;
  min-height: 125px;
}
.pxg-device-slot .pxg-slot-icon {
  height: 45px;
}
.pxg-readout {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin-top: 15px;
}
.pxg-readout span {
  padding: 10px 6px;
  border: 1px solid hsl(calc(var(--th-h) + 5.9) calc(22.8% * var(--th-s)) calc(28.4% + var(--th-l)));
  color: #a4a99a;
  font:
    800 9px/1.5 Consolas,
    monospace;
  text-align: center;
}
.pxg-readout b {
  display: block;
  font-size: 21px;
  color: hsl(calc(var(--th-h) + 0.5) calc(78.9% * var(--th-s)) calc(70.2% + var(--th-l)));
}
.pxg-browser {
  display: flex;
  flex-direction: column;
  min-height: 540px;
}
.pxg-catalogue-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.pxg-kicker {
  font:
    800 10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 2.2) calc(29.9% * var(--th-s)) calc(49.2% + var(--th-l)));
  letter-spacing: 1px;
}
.pxg-catalogue-top h3,
.pxg-devices-card h3 {
  font:
    800 19px Consolas,
    monospace;
  letter-spacing: 1px;
  color: hsl(calc(var(--th-h) + 0.3) calc(81.8% * var(--th-s)) calc(67.6% + var(--th-l)));
  margin: 5px 0 10px;
}
.pxg-unequip {
  background: #2d2420;
  border: 1px solid #8e6045;
  color: #f4c2ab;
  font:
    800 10px Consolas,
    monospace;
  padding: 9px 10px;
  cursor: pointer;
}
.pxg-tabs {
  display: flex;
  gap: 5px;
  overflow-x: auto;
  padding: 9px 0 13px;
  scrollbar-width: thin;
}
.pxg-tabs button {
  flex-shrink: 0;
  color: #b6bdb3;
  font:
    800 10px Consolas,
    monospace;
  padding: 9px 10px;
  background: hsl(calc(var(--th-bh) + -20) calc(13.8% * var(--th-bs)) 11.4%);
  border: 1px solid #455048;
  cursor: pointer;
}
.pxg-tabs button.active {
  color: hsl(calc(var(--th-bh) + -17) calc(16.1% * var(--th-bs)) 6.1%);
  background: hsl(calc(var(--th-h) + -0.1) calc(68.5% * var(--th-s)) calc(60.2% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -0.9) calc(82.3% * var(--th-s)) calc(71.2% + var(--th-l)));
}
.pxg-search {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #515b51;
  background: hsl(calc(var(--th-bh) + -5) calc(25.9% * var(--th-bs)) 5.3%);
  padding: 2px 9px;
}
.pxg-search span {
  color: hsl(calc(var(--th-h) + 5.7) calc(39.2% * var(--th-s)) calc(64.5% + var(--th-l)));
  font:
    800 11px Consolas,
    monospace;
  white-space: nowrap;
}
.pxg-search input {
  border: 0;
  box-shadow: none !important;
  background: transparent;
  min-width: 0;
  flex: 1;
  padding: 10px 0;
  font:
    12px Consolas,
    monospace;
}
.pxg-items {
  flex: 1;
  min-height: 350px;
  max-height: 720px;
  overflow: auto;
  padding: 9px 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  scrollbar-width: thin;
}
.pxg-item {
  display: grid;
  grid-template-columns: 55px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  background: linear-gradient(
    120deg,
    hsl(calc(var(--th-bh) + -27.5) calc(11.1% * var(--th-bs)) 14.1%),
    hsl(calc(var(--th-bh) + 2.5) calc(16.7% * var(--th-bs)) 9.4%)
  );
  border: 1px solid #465146;
  color: #e6e8df;
  padding: 10px;
  text-align: left;
  cursor: pointer;
  min-width: 0;
}
.pxg-item:hover,
.pxg-item:focus-visible {
  border-color: hsl(calc(var(--th-h) + -3.4) calc(63.1% * var(--th-s)) calc(57.5% + var(--th-l)));
  background: #333425;
}
.pxg-item.installed {
  border-color: #87aa79;
  box-shadow: inset 3px 0 #90ba82;
}
.pxg-item-glyph {
  width: 52px;
  height: 53px;
  display: grid;
  place-items: center;
  border: 1px solid #3c473e;
  background: hsl(calc(var(--th-bh) + -18.3) calc(22% * var(--th-bs)) 8%);
  color: #aabc9e;
}
.pxg-item-glyph svg {
  height: 41px;
  width: 49px;
}
.pxg-item-text {
  min-width: 0;
}
.pxg-item-text b {
  display: block;
  font:
    800 12px Consolas,
    monospace;
  color: #e6e7dc;
  white-space: normal;
  overflow-wrap: anywhere;
}
.pxg-item-text small {
  display: block;
  color: hsl(calc(var(--th-h) + -0.4) calc(68.7% * var(--th-s)) calc(61.2% + var(--th-l)));
  font-size: 10px;
  margin-top: 4px;
}
.pxg-item-text em {
  display: block;
  color: #a0aba3;
  font:
    normal 10px/1.4 Segoe UI,
    Arial,
    sans-serif;
  max-height: 30px;
  overflow: hidden;
  margin-top: 4px;
}
.pxg-item-meta {
  text-align: right;
  display: grid;
  gap: 6px;
  min-width: 78px;
  color: hsl(calc(var(--th-h) + -2) calc(70.2% * var(--th-s)) calc(64.5% + var(--th-l)));
  font:
    800 10px Consolas,
    monospace;
}
.pxg-item-meta small {
  color: #98a498;
  font-size: 9px;
}
.pxg-none {
  padding: 30px;
  text-align: center;
  color: #aab3ab;
  font-size: 12px;
}
.pxg-catalogue-foot {
  padding: 11px 0 0;
  border-top: 1px solid #495047;
  color: #899a8f;
  font:
    9px/1.6 Consolas,
    monospace;
}
.pxg-devices-card {
  border: 1px solid hsl(calc(var(--th-h) + -0.5) calc(33% * var(--th-s)) calc(34.5% + var(--th-l)));
  padding: 16px;
  background: #181c1b;
  margin-top: 14px;
}
.pxg-devices-card p {
  font-size: 12px;
  line-height: 1.6;
  color: #aeb5a9;
  max-width: 850px;
}
.pxg-device-controls {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 13px;
}
.pxg-device-spec {
  border: 1px solid #4d5c51;
  background: hsl(calc(var(--th-bh) + -5) calc(20% * var(--th-bs)) 7.8%);
  padding: 10px;
}
.pxg-device-spec span,
.pxg-device-spec small {
  display: block;
  font-size: 10px;
  color: #abb3a5;
}
.pxg-device-spec b {
  display: block;
  color: hsl(calc(var(--th-h) + -2) calc(70.9% * var(--th-s)) calc(64.9% + var(--th-l)));
  font:
    800 12px Consolas,
    monospace;
  margin: 6px 0;
}
.pxg-workbench {
  margin-top: 14px;
  border: 1px solid #555741;
  background: hsl(calc(var(--th-bh) + -5) calc(13.5% * var(--th-bs)) 7.3%);
}
.pxg-workbench > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  cursor: pointer;
  padding: 17px;
  color: hsl(calc(var(--th-h) + -0.6) calc(69.6% * var(--th-s)) calc(66.5% + var(--th-l)));
  font:
    800 12px Consolas,
    monospace;
}
.pxg-workbench > summary span {
  color: #8d9f92;
  font-size: 10px;
}
.pxg-workbench-body {
  border-top: 1px solid #444e42;
  padding: 15px;
}
.pxg-workbench-body > .hero {
  display: none;
}
.pxg-workbench-body .section-title:first-of-type {
  margin-top: 0;
}
@media (max-width: 1250px) {
  .pxg-workspace {
    grid-template-columns: 1fr;
  }
  .pxg-items {
    max-height: 480px;
  }
  .pxg-body {
    grid-template-columns: repeat(2, 1fr);
  }
  .pxg-browser {
    min-height: 480px;
  }
}
@media (max-width: 560px) {
  .pxg-rack,
  .pxg-browser {
    padding: 10px;
  }
  .pxg-body {
    gap: 6px;
  }
  .pxg-slot {
    padding: 9px;
    min-height: 140px;
  }
  .pxg-weapon-grid .pxg-slot {
    min-height: 130px;
  }
  .pxg-readout {
    grid-template-columns: repeat(2, 1fr);
  }
  .pxg-item {
    grid-template-columns: 43px minmax(0, 1fr);
    gap: 7px;
  }
  .pxg-item-glyph {
    width: 39px;
    height: 40px;
  }
  .pxg-item-glyph svg {
    width: 37px;
    height: 34px;
  }
  .pxg-item-meta {
    grid-column: 2;
    display: flex;
    min-width: 0;
    justify-content: space-between;
    text-align: left;
  }
  .pxg-device-controls {
    grid-template-columns: 1fr;
  }
  .pxg-workbench > summary {
    align-items: flex-start;
    flex-direction: column;
  }
}

.pxu-shell {
  --pxu-bg: hsl(calc(var(--th-bh) + -5) calc(13.5% * var(--th-bs)) 7.3%);
  --pxu-edge: #454a43;
  --pxu-gold: hsl(calc(var(--th-h) + -0.7) calc(55.6% * var(--th-s)) calc(59.4% + var(--th-l)));
  --pxu-txt: #e5e7dc;
  --pxu-dim: #9a9f97;
  color: var(--pxu-txt);
  border: 1px solid hsl(calc(var(--th-h) + 6.1) calc(17.6% * var(--th-s)) calc(30% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + 7) calc(16.1% * var(--th-bs)) 6.1%);
  box-shadow:
    inset 0 0 70px hsl(calc(var(--th-h) + 0.8) calc(77% * var(--th-s)) calc(41% + var(--th-l)) / 0.1),
    0 20px 50px #0006;
  font-family: Consolas, monospace;
}
.pxu-top {
  min-height: 41px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 10px 17px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 2) calc(22.4% * var(--th-s)) calc(32.4% + var(--th-l)));
  background: linear-gradient(180deg, #2b302b, hsl(calc(var(--th-bh) + -5) calc(14.9% * var(--th-bs)) 9.2%));
  font:
    700 10px Consolas,
    monospace;
  letter-spacing: 1px;
  color: #c1c6b7;
}
.pxu-top strong {
  color: hsl(calc(var(--th-h) + 1) calc(59.7% * var(--th-s)) calc(71.8% + var(--th-l)));
}
.pxu-signal {
  color: #91bd8a;
}
.pxu-two {
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(0, 1.07fr);
  gap: 0;
}
.pxu-stash,
.pxu-kit {
  min-width: 0;
  padding: 15px;
  background: radial-gradient(ellipse at 50% 2%, #25282055, transparent 50%),
    hsl(calc(var(--th-bh) + 5) calc(17.6% * var(--th-bs)) 6.7%);
}
.pxu-stash {
  border-right: 1px solid #514f43;
}
.pxu-kit {
  background: radial-gradient(
      ellipse at 48% 25%,
      hsl(calc(var(--th-h) + 12.6) calc(25.3% * var(--th-s)) calc(19.4% + var(--th-l)) / 0.2),
      transparent 48%
    ),
    hsl(calc(var(--th-bh) + 15) calc(18.8% * var(--th-bs)) 6.3%);
}
.pxu-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 3) calc(14.3% * var(--th-s)) calc(27.5% + var(--th-l)));
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.pxu-overline {
  font:
    700 9px Consolas,
    monospace;
  letter-spacing: 1.65px;
  color: #8b987f;
}
.pxu-panel-heading h3 {
  font:
    800 19px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 1.2) calc(53.7% * var(--th-s)) calc(76.3% + var(--th-l)));
  letter-spacing: 1.2px;
  margin: 5px 0 0;
}
.pxu-panel-heading h3 small {
  font:
    700 10px Consolas,
    monospace;
  color: #a3ae9d;
  margin-left: 5px;
}
.pxu-count {
  padding: 5px 7px;
  border: 1px solid #454b43;
  background: hsl(calc(var(--th-bh) + -13.6) calc(11.1% * var(--th-bs)) 12.4%);
  color: hsl(calc(var(--th-h) + 11.3) calc(16.8% * var(--th-s)) calc(62.7% + var(--th-l)));
  font:
    700 9px Consolas,
    monospace;
  white-space: nowrap;
}
.pxu-stash-tools {
  display: grid;
  gap: 9px;
  margin-bottom: 10px;
}
.pxu-filters {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.pxu-filters button {
  font:
    700 9px Consolas,
    monospace;
  padding: 7px 8px;
  border: 1px solid #475047;
  background: hsl(calc(var(--th-bh) + -22.1) calc(12.3% * var(--th-bs)) 11.2%);
  color: #a9b3a8;
  cursor: pointer;
}
.pxu-filters button:hover {
  color: hsl(calc(var(--th-h) + 0.7) calc(89.8% * var(--th-s)) calc(80.8% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -1.5) calc(32.4% * var(--th-s)) calc(41.8% + var(--th-l)));
}
.pxu-filters button.active {
  background: hsl(calc(var(--th-h) + -2.4) calc(49.6% * var(--th-s)) calc(51% + var(--th-l)));
  color: #141712;
  border-color: hsl(calc(var(--th-h) + -1.1) calc(82.7% * var(--th-s)) calc(68.2% + var(--th-l)));
}
.pxu-stash-tools input,
.pxu-supply input {
  background: hsl(calc(var(--th-bh) + 12.1) calc(24.1% * var(--th-bs)) 5.7%);
  border: 1px solid #3f4844;
  font:
    11px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 8.1) calc(28.9% * var(--th-s)) calc(82.4% + var(--th-l)));
  min-height: 33px;
  padding: 8px;
}
#pxu-stash-grid-wrap {
  position: relative;
}
.pxu-stash-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: 67px;
  grid-auto-flow: row dense;
  gap: 3px;
  padding: 5px;
  max-height: 502px;
  min-height: 340px;
  overflow-y: auto;
  align-content: start;
  background: repeating-linear-gradient(
    135deg,
    hsl(calc(var(--th-bh) + -5) calc(10.6% * var(--th-bs)) 9.2%) 0 9px,
    hsl(calc(var(--th-bh) + 5) calc(14.3% * var(--th-bs)) 8.2%) 9px 18px
  );
  border: 1px solid #464c46;
  scrollbar-width: thin;
  scrollbar-color: hsl(calc(var(--th-h) + -1.8) calc(26.9% * var(--th-s)) calc(36.5% + var(--th-l))) #1c211e;
}
.pxu-empty-cell {
  border: 1px solid #373d3a;
  background: linear-gradient(
    135deg,
    hsl(calc(var(--th-bh) + -5) calc(8.5% * var(--th-bs)) 11.6% / 0.9),
    hsl(calc(var(--th-bh) + 5) calc(14.3% * var(--th-bs)) 8.2% / 0.9)
  );
}
.pxu-item {
  position: relative;
  z-index: 1;
  grid-column: span 2;
  min-width: 0;
  grid-row: span 2;
  padding: 7px;
  text-align: left;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-between;
  border: 1px solid #626858;
  background: repeating-linear-gradient(
    132deg,
    hsl(calc(var(--th-bh) + -17) calc(13.9% * var(--th-bs)) 14.1%) 0 8px,
    hsl(calc(var(--th-bh) + -18.3) calc(15.3% * var(--th-bs)) 11.6%) 8px 16px
  );
  color: hsl(calc(var(--th-h) + 7.9) calc(17.9% * var(--th-s)) calc(81.4% + var(--th-l)));
  cursor: grab;
  overflow: hidden;
  transition:
    filter 0.16s,
    border-color 0.16s,
    box-shadow 0.16s;
}
.pxu-item:hover {
  border-color: hsl(calc(var(--th-h) + -1.4) calc(65.4% * var(--th-s)) calc(63.7% + var(--th-l)));
  box-shadow: inset 0 0 0 1px
    hsl(calc(var(--th-h) + -3.2) calc(50.2% * var(--th-s)) calc(53.5% + var(--th-l)));
  z-index: 4;
}
.pxu-item.selected {
  border-color: hsl(calc(var(--th-h) + -0.5) calc(68.2% * var(--th-s)) calc(65.5% + var(--th-l)));
  box-shadow:
    inset 0 0 0 1px hsl(calc(var(--th-h) + -1.4) calc(69.9% * var(--th-s)) calc(62.2% + var(--th-l))),
    0 0 13px hsl(calc(var(--th-h) + 5) calc(50.8% * var(--th-s)) calc(46.3% + var(--th-l)) / 0.3);
  background: #2e3026;
}
.pxu-item.wide {
  grid-column: span 3;
  grid-row: span 2;
}
.pxu-item.medium {
  grid-column: span 2;
  grid-row: span 1;
}
.pxu-item-kind {
  color: #acb29a;
  letter-spacing: 0.7px;
  font:
    700 8px Consolas,
    monospace;
  text-transform: uppercase;
}
.pxu-item-graphic {
  flex: 1;
  display: grid;
  place-items: center;
  min-height: 20px;
  color: #a9b99f;
  opacity: 0.8;
}
.pxu-item-graphic svg {
  max-width: 95%;
  max-height: 78px;
  width: 75px;
  height: 74px;
  filter: drop-shadow(0 4px 6px #0009);
}
.pxu-item.medium .pxu-item-graphic svg {
  height: 33px;
}
.pxu-item-name {
  font:
    700 9px/1.15 Consolas,
    monospace;
  color: #e4e9d9;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pxu-item-qty {
  position: absolute;
  right: 4px;
  top: 4px;
  border: 1px solid hsl(calc(var(--th-h) + -2.8) calc(31.1% * var(--th-s)) calc(40.4% + var(--th-l)));
  background: #171c19e9;
  color: hsl(calc(var(--th-h) + -0.3) calc(79.2% * var(--th-s)) calc(71.8% + var(--th-l)));
  padding: 2px 4px;
  font:
    800 10px Consolas,
    monospace;
}
.pxu-empty-note {
  position: absolute;
  top: 50%;
  left: 5%;
  width: 90%;
  text-align: center;
  color: #a9b19c;
  font:
    700 10px Consolas,
    monospace;
  pointer-events: none;
}
.pxu-inspector {
  border: 1px solid #515647;
  background: hsl(calc(var(--th-bh) + -5) calc(11.5% * var(--th-bs)) 10.2%);
  padding: 11px;
  margin-top: 11px;
}
.pxu-inner-head {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #3b453e;
  padding-bottom: 9px;
  color: hsl(calc(var(--th-h) + -0.1) calc(66.5% * var(--th-s)) calc(67.3% + var(--th-l)));
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 1px;
}
.pxu-inner-head span {
  color: #a2ac9e;
}
.pxu-idle {
  padding: 20px 6px;
  color: #8f9d92;
  font:
    11px/1.6 Consolas,
    monospace;
  text-align: center;
}
.pxu-inspected {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 0;
}
.pxu-inspected-icon {
  flex: 0 0 66px;
  height: 62px;
  display: grid;
  place-items: center;
  color: #b3bda9;
  background: hsl(calc(var(--th-bh) + -27.5) calc(10% * var(--th-bs)) 15.7%);
  border: 1px solid #526058;
}
.pxu-inspected-icon svg {
  height: 56px;
  width: 64px;
}
.pxu-inspected b {
  font-size: 12px;
  color: hsl(calc(var(--th-h) + 2.3) calc(35.5% * var(--th-s)) calc(81.8% + var(--th-l)));
  overflow-wrap: anywhere;
}
.pxu-inspected small {
  display: block;
  font:
    10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 3.8) calc(33.9% * var(--th-s)) calc(56.7% + var(--th-l)));
  margin-top: 5px;
}
.pxu-inspected p {
  color: #afb5a6;
  margin: 6px 0 0;
  font:
    10px/1.5 Consolas,
    monospace;
  max-height: 65px;
  overflow: auto;
}
.pxu-actions {
  display: flex;
  gap: 6px;
  margin-bottom: 9px;
}
.pxu-actions button,
.pxu-deploy button,
.pxu-target button {
  background: #252d27;
  color: hsl(calc(var(--th-h) + -2.3) calc(76.3% * var(--th-s)) calc(76.9% + var(--th-l)));
  border: 1px solid hsl(calc(var(--th-h) + -2.6) calc(31.9% * var(--th-s)) calc(35.7% + var(--th-l)));
  padding: 8px 11px;
  font:
    800 10px Consolas,
    monospace;
  cursor: pointer;
}
.pxu-actions button:hover,
.pxu-deploy button:hover,
.pxu-target button:hover {
  background: hsl(calc(var(--th-h) + -2.3) calc(37.8% * var(--th-s)) calc(23.3% + var(--th-l)));
}
.pxu-deploy {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
}
.pxu-deploy select {
  min-width: 0;
  font-size: 10px;
  padding: 7px;
}
.pxu-deploy button.gold {
  background: hsl(calc(var(--th-h) + -4) calc(49.5% * var(--th-s)) calc(41.2% + var(--th-l)));
  color: #141812;
  border-color: hsl(calc(var(--th-h) + -1.8) calc(63% * var(--th-s)) calc(57.6% + var(--th-l)));
}
.pxu-advice {
  font:
    10px/1.5 Consolas,
    monospace;
  color: #a3ab9b;
}
.pxu-supply,
.pxu-finance {
  margin-top: 11px;
  border: 1px solid #515345;
  background: hsl(calc(var(--th-bh) + -5) calc(10.6% * var(--th-bs)) 9.2%);
}
.pxu-supply summary,
.pxu-finance summary {
  list-style: none;
  cursor: pointer;
  padding: 12px;
  display: flex;
  justify-content: space-between;
  gap: 9px;
  align-items: center;
  flex-wrap: wrap;
  color: hsl(calc(var(--th-h) + 0) calc(66.7% * var(--th-s)) calc(64.7% + var(--th-l)));
  font:
    800 11px Consolas,
    monospace;
  letter-spacing: 0.4px;
}
.pxu-supply summary::-webkit-details-marker,
.pxu-finance summary::-webkit-details-marker {
  display: none;
}
.pxu-supply summary:before,
.pxu-finance summary:before {
  content: '▸';
  color: hsl(calc(var(--th-h) + 0.6) calc(49.4% * var(--th-s)) calc(53.5% + var(--th-l)));
}
.pxu-supply[open] summary:before,
.pxu-finance[open] summary:before {
  content: '▾';
}
.pxu-supply summary span,
.pxu-finance summary span {
  color: #a4afa0;
  font-size: 9px;
}
.pxu-supply-body,
.pxu-finance-body {
  padding: 12px;
  border-top: 1px solid #43493f;
  display: grid;
  gap: 10px;
}
.pxu-acquire-list {
  max-height: 210px;
  overflow: auto;
  display: grid;
  gap: 3px;
}
.pxu-acquire-list button {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  background: hsl(calc(var(--th-bh) + -27.5) calc(11.8% * var(--th-bs)) 13.3%);
  border: 1px solid #3d4a41;
  padding: 8px;
  text-align: left;
  color: #dde2d2;
  font:
    10px Consolas,
    monospace;
}
.pxu-acquire-list button:hover {
  border-color: hsl(calc(var(--th-h) + -2.6) calc(58.3% * var(--th-s)) calc(57.6% + var(--th-l)));
  background: #343329;
}
.pxu-acquire-list button b {
  font:
    700 10px Consolas,
    monospace;
  overflow-wrap: anywhere;
}
.pxu-acquire-list button span {
  white-space: nowrap;
  color: hsl(calc(var(--th-h) + 1) calc(33.6% * var(--th-s)) calc(57.5% + var(--th-l)));
  font-size: 9px;
}
.pxu-acquire-list button strong {
  font-size: 14px;
}
.pxu-supply-body small {
  font:
    10px/1.4 Consolas,
    monospace;
  color: #9ca598;
}
.pxu-wallet {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
}
.pxu-wallet strong {
  display: block;
  color: hsl(calc(var(--th-h) + -0.5) calc(69.5% * var(--th-s)) calc(62.7% + var(--th-l)));
  font:
    800 20px Consolas,
    monospace;
}
.pxu-wallet small {
  color: #a3a796;
}
.pxu-credit-fields {
  display: grid;
  gap: 8px;
}
.pxu-ledger {
  max-height: 170px;
  overflow: auto;
}
.pxu-ledger > div {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  gap: 10px;
  font:
    10px Consolas,
    monospace;
  border-bottom: 1px solid #354038;
}
.pxu-ledger b {
  color: #b3d5b9;
}
.pxu-ledger b.negative {
  color: #efb098;
}
.pxu-kit {
  position: relative;
}
.pxu-body-grid {
  display: grid;
  position: relative;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(102px, auto));
  gap: 6px;
  isolation: isolate;
}
.pxu-figure {
  position: absolute;
  z-index: -1;
  inset: 15px 10% 0;
  display: grid;
  place-items: center;
  opacity: 0.27;
  pointer-events: none;
}
.pxu-figure svg {
  height: 100%;
  max-height: 450px;
  width: 80%;
  filter: drop-shadow(
    0 0 24px hsl(calc(var(--th-h) + 4.4) calc(44.5% * var(--th-s)) calc(37.5% + var(--th-l)) / 0.3)
  );
}
.pxu-slot {
  position: relative;
  min-width: 0;
  border: 1px solid #505b54;
  background: repeating-linear-gradient(
    135deg,
    hsl(calc(var(--th-bh) + -5) calc(13.6% * var(--th-bs)) 8.6% / 0.9) 0 6px,
    hsl(calc(var(--th-bh) + -5) calc(14.3% * var(--th-bs)) 11% / 0.9) 6px 11px
  );
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  color: hsl(calc(var(--th-h) + 11.5) calc(20% * var(--th-s)) calc(83.3% + var(--th-l)));
  text-align: left;
  cursor: pointer;
  transition:
    filter 0.16s,
    border-color 0.16s,
    transform 0.15s,
    box-shadow 0.16s;
}
.pxu-slot:hover,
.pxu-slot:focus-visible {
  border-color: hsl(calc(var(--th-h) + -0.5) calc(52.6% * var(--th-s)) calc(55.3% + var(--th-l)));
  background: #2b3028;
  z-index: 4;
  transform: translateY(-2px);
  box-shadow: 0 9px 23px #000a;
}
.pxu-slot.active {
  border-color: hsl(calc(var(--th-h) + 0.5) calc(76.3% * var(--th-s)) calc(70.2% + var(--th-l)));
  box-shadow: inset 0 0 0 1px hsl(calc(var(--th-h) + 0) calc(58.3% * var(--th-s)) calc(59.6% + var(--th-l)));
  background: #292d25;
}
.pxu-slot.loaded .pxu-slot-art {
  opacity: 0.89;
}
.pxu-slot-title {
  background: linear-gradient(#3b413a, #242b26);
  border-bottom: 1px solid #495248;
  padding: 5px 7px;
  min-height: 24px;
  color: #d5d6cb;
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 0.3px;
  display: flex;
  justify-content: space-between;
}
.pxu-slot-arrow {
  color: hsl(calc(var(--th-h) + 2.7) calc(56% * var(--th-s)) calc(59% + var(--th-l)));
}
.pxu-slot-art {
  flex: 1;
  display: grid;
  place-items: center;
  min-height: 32px;
  opacity: 0.24;
  color: #c7d4bd;
}
.pxu-slot-art svg {
  width: min(90%, 99px);
  height: 60px;
  filter: drop-shadow(0 2px 4px #0008);
}
.pxu-slot-name {
  font:
    800 10px/1.2 Consolas,
    monospace;
  overflow-wrap: anywhere;
  padding: 6px 7px;
  color: #c9cfba;
}
.pxu-slot.loaded .pxu-slot-name {
  color: hsl(calc(var(--th-h) + -0.5) calc(82.3% * var(--th-s)) calc(77.8% + var(--th-l)));
}
.pxu-slot-mini {
  font-size: 8px;
  color: #9da895;
  padding: 0 7px 6px;
}
.pxu-slot[data-tip]:hover:after,
.pxu-slot[data-tip]:focus-visible:after {
  content: attr(data-tip);
  position: absolute;
  bottom: calc(100% + 6px);
  left: 0;
  z-index: 10;
  min-width: 180px;
  max-width: 270px;
  padding: 9px;
  white-space: normal;
  background: hsl(calc(var(--th-bh) + 3.6) calc(28% * var(--th-bs)) 4.9%);
  border: 1px solid hsl(calc(var(--th-h) + 0.8) calc(46.6% * var(--th-s)) calc(53.7% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 0.3) calc(47.7% * var(--th-s)) calc(78.2% + var(--th-l)));
  box-shadow: 0 12px 24px #000c;
  font:
    10px/1.5 Consolas,
    monospace;
  pointer-events: none;
}
.pxu-slot.ear {
  grid-column: 1;
  grid-row: 1;
}
.pxu-slot.head {
  grid-column: 2;
  grid-row: 1;
}
.pxu-slot.face {
  grid-column: 3;
  grid-row: 1;
}
.pxu-slot.eyes {
  grid-column: 4;
  grid-row: 1;
}
.pxu-slot.arms {
  grid-column: 1;
  grid-row: 2;
}
.pxu-slot.chest {
  grid-column: 2 / span 2;
  grid-row: 2;
}
.pxu-slot.legs {
  grid-column: 4;
  grid-row: 2;
}
.pxu-slot.shield {
  grid-column: 2 / span 2;
  grid-row: 3;
}
.pxu-equip-rule {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 3) calc(17.2% * var(--th-s)) calc(28.4% + var(--th-l)));
  font:
    800 11px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 0.3) calc(64% * var(--th-s)) calc(65.1% + var(--th-l)));
  padding: 15px 0 7px;
  letter-spacing: 0.6px;
}
.pxu-equip-rule small {
  font-size: 9px;
  color: #959e91;
}
.pxu-weapons {
  display: grid;
  grid-template-columns: 1.45fr 0.85fr;
  gap: 6px;
  margin-top: 8px;
}
.pxu-weapons .pxu-slot {
  min-height: 98px;
}
.pxu-weapons .pxu-slot-art {
  min-height: 25px;
}
.pxu-weapons .pxu-slot-art svg {
  height: 45px;
  width: 98px;
}
.pxu-utility-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 8px;
}
.pxu-utility-grid .pxu-slot {
  min-height: 85px;
}
.pxu-utility-grid .pxu-slot-art svg {
  height: 44px;
}
.pxu-rig .pxu-slot {
  height: 100%;
}
.pxu-pockets {
  border: 1px solid #414941;
  padding: 4px;
}
.pxu-mini-head {
  font:
    700 9px Consolas,
    monospace;
  color: #b3c0b2;
  margin-bottom: 5px;
}
.pxu-pocket-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 3px;
}
.pxu-pocket-grid .pxu-slot {
  min-height: 79px;
}
.pxu-pocket-grid .pxu-slot-title {
  font-size: 8px;
  padding: 4px;
  min-height: 18px;
}
.pxu-pocket-grid .pxu-slot-art svg {
  height: 28px;
}
.pxu-pocket-grid .pxu-slot-name {
  font-size: 8px;
  padding: 3px;
}
.pxu-pocket-grid .pxu-slot-arrow {
  display: none;
}
.pxu-target {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 9px;
  padding: 11px;
  border: 1px solid hsl(calc(var(--th-h) + 4.3) calc(28.7% * var(--th-s)) calc(30.8% + var(--th-l)));
  background: #29291d;
  margin-top: 13px;
}
.pxu-target strong {
  color: hsl(calc(var(--th-h) + 0.1) calc(82.3% * var(--th-s)) calc(71.2% + var(--th-l)));
  font:
    800 12px Consolas,
    monospace;
  display: block;
  margin: 4px 0;
}
.pxu-target small {
  color: #afb5a2;
  font:
    10px/1.5 Consolas,
    monospace;
  display: block;
  max-width: 400px;
}
.pxu-noitem {
  color: #898c7f;
  font:
    700 10px Consolas,
    monospace;
}
.pxu-readouts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-top: 11px;
}
.pxu-readouts span {
  border: 1px solid #484b3c;
  background: #191e1b;
  text-align: center;
  padding: 10px 4px;
  font:
    800 9px Consolas,
    monospace;
  color: #a9b2a5;
}
.pxu-readouts b {
  display: block;
  color: hsl(calc(var(--th-h) + 0.8) calc(74.3% * var(--th-s)) calc(71% + var(--th-l)));
  font-size: 22px;
  margin-top: 6px;
}
.pxu-shield-opts {
  border-top: 1px solid #414b44;
  margin-top: 12px;
  padding-top: 12px;
}
.pxu-workbench {
  margin-top: 14px;
}
.pxu-footnote {
  font:
    10px/1.5 Consolas,
    monospace;
  color: #9eac9d;
  padding: 13px;
  border-left: 2px solid hsl(calc(var(--th-h) + -2.1) calc(53.4% * var(--th-s)) calc(53.7% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + -25) calc(13% * var(--th-bs)) 9%);
  margin-top: 13px;
}
.pxu-slot.pxu-drop-on,
.pxu-stash-grid.pxu-drop-on {
  outline: 2px dashed hsl(calc(var(--th-h) + -2.2) calc(69.3% * var(--th-s)) calc(65.5% + var(--th-l)));
  outline-offset: -3px;
  background: hsl(calc(var(--th-h) + 6.9) calc(36.6% * var(--th-s)) calc(19.8% + var(--th-l))) !important;
}
.pxu-item:active {
  cursor: grabbing;
}
.pxu-cargo-panel {
  margin-top: 10px;
  border: 1px solid hsl(calc(var(--th-h) + 7) calc(19.7% * var(--th-s)) calc(29.8% + var(--th-l)));
  background: linear-gradient(160deg, #141916, hsl(calc(var(--th-bh) + -35) calc(11.1% * var(--th-bs)) 7.1%));
  padding: 10px;
  display: grid;
  gap: 8px;
}
.pxu-cargo-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  font:
    800 11px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 1.1) calc(69.9% * var(--th-s)) calc(66.1% + var(--th-l)));
}
.pxu-cargo-head span {
  color: #adb5a2;
  font-size: 10px;
}
.pxu-cargo-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
  border-top: 1px solid #363a31;
}
.pxu-cargo-row:first-of-type {
  border-top: 0;
}
.pxu-cargo-row b {
  color: hsl(calc(var(--th-h) + 3) calc(36.6% * var(--th-s)) calc(92% + var(--th-l)));
  font:
    700 11px Consolas,
    monospace;
}
.pxu-cargo-row span {
  color: hsl(calc(var(--th-h) + 3.4) calc(50.6% * var(--th-s)) calc(65.9% + var(--th-l)));
  font:
    800 11px Consolas,
    monospace;
}
.pxu-cargo-actions {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}
.pxu-cargo-actions button {
  padding: 6px 8px;
  border: 1px solid hsl(calc(var(--th-h) + 0) calc(28.9% * var(--th-s)) calc(29.8% + var(--th-l)));
  background: #23251d;
  color: hsl(calc(var(--th-h) + 1.8) calc(72.2% * var(--th-s)) calc(70.4% + var(--th-l)));
  font:
    700 10px Consolas,
    monospace;
}
.pxu-cargo-actions button:hover {
  background: hsl(calc(var(--th-h) + 5) calc(24.5% * var(--th-s)) calc(19.2% + var(--th-l)));
}
.pxu-cargo-idle,
.pxu-cargo-foot {
  color: #aeb4a8;
  font:
    10px/1.5 Consolas,
    monospace;
}
.pxu-cargo-foot {
  padding-top: 3px;
  border-top: 1px solid #32372f;
}
@media (max-width: 660px) {
  .pxu-cargo-row {
    grid-template-columns: 1fr;
  }
  .pxu-cargo-actions {
    justify-content: flex-start;
  }
}
@media (max-width: 1280px) {
  .pxu-two {
    grid-template-columns: 1fr;
  }
  .pxu-stash {
    border-right: 0;
    border-bottom: 1px solid hsl(calc(var(--th-h) + -5) calc(24.8% * var(--th-s)) calc(30.8% + var(--th-l)));
  }
  .pxu-stash-grid {
    max-height: 360px;
  }
  .pxu-body-grid {
    grid-template-rows: repeat(3, minmax(90px, auto));
  }
}
@media (max-width: 660px) {
  .pxu-stash,
  .pxu-kit {
    padding: 9px;
  }
  .pxu-stash-grid {
    grid-auto-rows: 48px;
    min-height: 265px;
  }
  .pxu-item {
    grid-row: span 2;
  }
  .pxu-item.medium {
    grid-row: span 2;
  }
  .pxu-item-name {
    font-size: 8px;
  }
  .pxu-item-kind {
    font-size: 7px;
  }
  .pxu-item-graphic svg {
    height: 44px;
  }
  .pxu-panel-heading h3 {
    font-size: 16px;
  }
  .pxu-body-grid {
    grid-template-rows: repeat(3, minmax(84px, auto));
    gap: 4px;
  }
  .pxu-slot-title {
    font-size: 8px;
    padding: 5px 3px;
  }
  .pxu-slot-name {
    font-size: 8px;
    padding: 4px;
  }
  .pxu-slot-art svg {
    height: 43px;
  }
  .pxu-readouts span {
    font-size: 8px;
  }
  .pxu-readouts b {
    font-size: 17px;
  }
  .pxu-top {
    font-size: 9px;
  }
  .pxu-pocket-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pxu-deploy {
    grid-template-columns: 1fr;
  }
  .pxu-inspected-icon {
    flex-basis: 55px;
    width: 55px;
  }
  .pxu-figure {
    opacity: 0.17;
  }
}
@media (prefers-reduced-motion: reduce) {
  .pxu-slot,
  .pxu-item {
    transition: none !important;
    transform: none !important;
  }
}

@media (min-width: 1281px) {
  .pxu-two {
    grid-template-columns: minmax(0, 1.07fr) minmax(0, 1.03fr);
  }
  .pxu-kit {
    border-right: 1px solid #514f43;
  }
  .pxu-stash {
    border-right: 0;
    border-left: 0;
  }
}
@media (max-width: 1280px) {
  .pxu-kit {
    border-bottom: 1px solid hsl(calc(var(--th-h) + -5) calc(24.8% * var(--th-s)) calc(30.8% + var(--th-l)));
  }
  .pxu-stash {
    border: 0;
  }
}

.pxu-body-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(114px, auto));
  gap: 9px;
}
.pxu-slot-wrap {
  position: relative;
  min-width: 0;
  min-height: 0;
  isolation: auto;
}
.pxu-slot-wrap .pxu-slot {
  height: 100%;
  min-height: 100%;
  width: 100%;
}
.pxu-slot-wrap.head {
  grid-column: 2;
  grid-row: 1;
}
.pxu-slot-wrap.arms {
  grid-column: 1;
  grid-row: 2;
}
.pxu-slot-wrap.chest {
  grid-column: 2;
  grid-row: 2;
}
.pxu-slot-wrap.legs {
  grid-column: 3;
  grid-row: 2;
}
.pxu-slot-wrap.shield {
  grid-column: 2;
  grid-row: 3;
}
.pxu-figure {
  opacity: 0.16;
  inset: 10px 3% 0;
}
.pxu-slot-wrap:hover,
.pxu-slot-wrap:focus-within,
.pxu-slot-wrap.opened {
  z-index: 80;
}
.pxu-slot-wrap:hover .pxu-slot,
.pxu-slot-wrap:focus-within .pxu-slot {
  border-color: hsl(calc(var(--th-h) + 0.6) calc(59% * var(--th-s)) calc(59.8% + var(--th-l)));
  box-shadow: 0 7px 20px #0007;
}
.pxu-slot-wrap .pxu-slot[data-tip]:after {
  content: none !important;
}
.pxu-weapons .pxu-slot-wrap {
  min-height: 98px;
}
.pxu-weapons .pxu-slot-wrap .pxu-slot {
  min-height: 98px;
}
.pxu-weapons .pxu-slot-wrap .pxu-slot-art svg {
  height: 45px;
  width: 98px;
}
.pxu-utility-grid .pxu-slot-wrap {
  min-height: 85px;
}
.pxu-utility-grid .pxu-slot-wrap .pxu-slot-art svg {
  height: 44px;
}
.pxu-pocket-grid .pxu-slot-wrap {
  min-height: 79px;
}
.pxu-pocket-grid .pxu-slot-wrap .pxu-slot-title {
  font-size: 8px;
  padding: 4px;
  min-height: 18px;
}
.pxu-pocket-grid .pxu-slot-wrap .pxu-slot-art svg {
  height: 28px;
}
.pxu-pocket-grid .pxu-slot-wrap .pxu-slot-name {
  font-size: 8px;
  padding: 3px;
}
.pxu-rig .pxu-slot-wrap {
  height: 100%;
}
.pxu-menu-head {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  padding: 12px 12px 8px;
  background: linear-gradient(#2b2c20, hsl(calc(var(--th-bh) + -30.7) calc(12.3% * var(--th-bs)) 11.2%));
  border-bottom: 1px solid hsl(calc(var(--th-h) + -3.1) calc(29.3% * var(--th-s)) calc(28.8% + var(--th-l)));
}
.pxu-menu-head span {
  font:
    800 11px Consolas,
    monospace;
  letter-spacing: 0.45px;
  color: hsl(calc(var(--th-h) + 1.6) calc(82.3% * var(--th-s)) calc(71.2% + var(--th-l)));
}
.pxu-menu-head small {
  display: block;
  color: #afb5a7;
  font:
    10px/1.5 Consolas,
    monospace;
  margin-top: 6px;
}
.pxu-menu-close {
  border: 1px solid hsl(calc(var(--th-h) + 4.4) calc(22.7% * var(--th-s)) calc(29.4% + var(--th-l)));
  background: #262a20;
  color: hsl(calc(var(--th-h) + -0.4) calc(63% * var(--th-s)) calc(66.1% + var(--th-l)));
  width: 26px;
  height: 26px;
  padding: 0;
  flex: 0 0 26px;
  cursor: pointer;
}
.pxu-menu-search {
  min-height: 35px !important;
  margin: 9px 10px 6px;
  width: calc(100% - 20px);
  border: 1px solid hsl(calc(var(--th-h) + -5) calc(27.6% * var(--th-s)) calc(29.8% + var(--th-l))) !important;
  background: hsl(calc(var(--th-bh) + -13.6) calc(17.9% * var(--th-bs)) 7.6%) !important;
  color: hsl(calc(var(--th-h) + -3.8) calc(69.1% * var(--th-s)) calc(81% + var(--th-l))) !important;
  font:
    11px Consolas,
    monospace !important;
}
.pxu-menu-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  padding: 0 9px 7px;
  border-bottom: 1px solid #363d32;
}
.pxu-menu-filters button {
  cursor: pointer;
  border: 1px solid #4a513f;
  background: #20271f;
  color: #b9bca8;
  padding: 6px 7px;
  font:
    700 9px Consolas,
    monospace;
}
.pxu-menu-filters button.selected {
  border-color: hsl(calc(var(--th-h) + -0) calc(72.3% * var(--th-s)) calc(63.1% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -0.7) calc(51.1% * var(--th-s)) calc(26.5% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 1) calc(100% * var(--th-s)) calc(88.2% + var(--th-l)));
}
.pxu-menu-choices {
  min-height: 56px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  flex: 1;
}
.pxu-menu-summary {
  font:
    700 9px Consolas,
    monospace;
  letter-spacing: 0.6px;
  padding: 8px 10px;
  color: hsl(calc(var(--th-h) + -2.1) calc(55% * var(--th-s)) calc(62.5% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + -20) calc(14.3% * var(--th-bs)) 11%);
  border-bottom: 1px solid #424638;
}
.pxu-menu-results {
  display: grid;
  gap: 2px;
  padding: 5px;
}
.pxu-menu-choice {
  display: grid;
  grid-template-columns: 33px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  text-align: left;
  padding: 7px 6px;
  background: hsl(calc(var(--th-bh) + -25) calc(15.8% * var(--th-bs)) 11.2%);
  border: 1px solid #3d473e;
  color: #e9eadf;
  cursor: pointer;
  min-width: 0;
}
.pxu-menu-choice:hover,
.pxu-menu-choice:focus-visible {
  background: #32372a;
  border-color: hsl(calc(var(--th-h) + -1.9) calc(53.8% * var(--th-s)) calc(55.9% + var(--th-l)));
}
.pxu-menu-choice.equipped {
  background: hsl(calc(var(--th-h) + 2.1) calc(31.1% * var(--th-s)) calc(17.6% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + 0.9) calc(61.5% * var(--th-s)) calc(59.2% + var(--th-l)));
}
.pxu-menu-choice-glyph {
  display: grid;
  place-items: center;
  color: hsl(calc(var(--th-h) + 4.2) calc(34.1% * var(--th-s)) calc(64.9% + var(--th-l)));
}
.pxu-menu-choice-glyph svg {
  width: 32px;
  height: 30px;
}
.pxu-menu-choice-name {
  min-width: 0;
  font:
    10px/1.3 Consolas,
    monospace;
  overflow-wrap: anywhere;
}
.pxu-menu-choice-name b {
  display: block;
}
.pxu-menu-choice-name small {
  display: block;
  color: hsl(calc(var(--th-h) + 4.5) calc(21.1% * var(--th-s)) calc(62.7% + var(--th-l)));
  margin-top: 2px;
}
.pxu-menu-choice-action {
  font:
    800 8px Consolas,
    monospace;
  padding: 5px 4px;
  border: 1px solid hsl(calc(var(--th-h) + 3) calc(23.3% * var(--th-s)) calc(33.7% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 1.2) calc(64.6% * var(--th-s)) calc(65.7% + var(--th-l)));
  text-align: center;
  white-space: nowrap;
  max-width: 85px;
}
.pxu-menu-choice-action.owned {
  border-color: #487d5f;
  color: #b8e5c9;
}
.pxu-menu-empty {
  padding: 15px 10px;
  color: hsl(calc(var(--th-h) + 5) calc(15.8% * var(--th-s)) calc(62.7% + var(--th-l)));
  font:
    10px/1.5 Consolas,
    monospace;
}
.pxu-menu-foot {
  padding: 8px 10px;
  color: hsl(calc(var(--th-h) + 8.8) calc(14.6% * var(--th-s)) calc(61% + var(--th-l)));
  background: #191c19;
  border-top: 1px solid hsl(calc(var(--th-h) + -4.5) calc(27% * var(--th-s)) calc(26.9% + var(--th-l)));
  font:
    9px/1.4 Consolas,
    monospace;
}
@media (max-width: 1280px) {
  .pxu-body-grid {
    grid-template-rows: repeat(3, minmax(100px, auto));
  }
}
@media (max-width: 750px) {
  .pxu-body-grid {
    grid-template-rows: repeat(3, minmax(86px, auto));
  }
  .pxu-menu-results {
    padding: 4px;
  }
}

.pxu-kit {
  position: relative;
  z-index: 2;
}
.pxu-stash {
  position: relative;
  z-index: 1;
}

#pxu-global-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147481000;
  pointer-events: none;
}
#pxu-global-overlay .pxu-global-backdrop {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
#pxu-global-overlay .pxu-global-panel {
  position: fixed;
  z-index: 2;
  width: min(510px, calc(100vw - 24px));
  max-height: min(720px, calc(100dvh - 24px));
  display: flex;
  flex-direction: column;
  pointer-events: auto;
  border: 1px solid hsl(calc(var(--th-h) + -3) calc(27.6% * var(--th-s)) calc(50.2% + var(--th-l)));
  background: hsl(calc(var(--th-bh) + -5) calc(22.6% * var(--th-bs)) 6.1%);
  box-shadow: 0 12px 35px #0009;
}
#pxu-global-overlay .pxu-menu {
  display: flex !important;
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  width: 100% !important;
  max-height: inherit !important;
  max-width: 100%;
  height: 100%;
  border: 0 !important;
  box-shadow: none !important;
  animation: none !important;
  flex-direction: column;
  overflow: hidden;
}
#pxu-global-overlay.pinned {
  pointer-events: auto;
}
#pxu-global-overlay.pinned .pxu-global-backdrop {
  pointer-events: auto;
  background: transparent;
  backdrop-filter: none;
}
#pxu-global-overlay.pinned .pxu-global-panel {
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%);
  width: min(510px, calc(100vw - 24px));
  max-height: min(720px, calc(100dvh - 24px));
}
#pxu-global-overlay .pxu-menu-choices {
  overflow: auto;
}

.px-map-editor-above {
  display: grid;
  grid-template-columns: minmax(260px, 0.85fr) minmax(350px, 1.35fr);
  gap: 12px;
  padding: 14px 14px 0;
}
.px-map-settings,
.px-map-editor {
  border: 1px solid hsl(calc(var(--th-h) + 7.5) calc(17.4% * var(--th-s)) calc(27.1% + var(--th-l)));
  background: linear-gradient(135deg, #1d2420, hsl(calc(var(--th-bh) + -15) calc(15% * var(--th-bs)) 7.8%));
  padding: 13px;
  min-width: 0;
}
.px-map-settings-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  border-bottom: 1px solid hsl(calc(var(--th-h) + -3.2) calc(25.2% * var(--th-s)) calc(25.7% + var(--th-l)));
  padding-bottom: 9px;
  margin-bottom: 12px;
}
.px-map-settings-head b {
  font:
    800 12px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 0.1) calc(66.9% * var(--th-s)) calc(65.7% + var(--th-l)));
  letter-spacing: 0.9px;
}
.px-map-settings-head small {
  font:
    9px Consolas,
    monospace;
  color: #a9b493;
}
.px-map-dimensions {
  display: grid;
  grid-template-columns: minmax(60px, 1fr) minmax(60px, 1fr) minmax(100px, 1fr) auto;
  gap: 7px;
  align-items: end;
}
.px-map-dimensions label {
  font:
    700 10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -0.8) calc(41.2% * var(--th-s)) calc(62% + var(--th-l)));
  display: grid;
  gap: 5px;
}
.px-map-dimensions input,
.px-map-dimensions select {
  padding: 8px;
  width: 100%;
  font:
    11px Consolas,
    monospace;
}
.px-map-dimensions button {
  height: 34px;
}
.px-map-settings .px-board-help {
  margin: 10px 0 0;
}
.px-board-modes {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.px-board-toolmode,
.px-board-brush {
  border: 1px solid #515b4b;
  background: hsl(calc(var(--th-bh) + -23) calc(16.1% * var(--th-bs)) 12.2%);
  color: #bbc2ae;
  cursor: pointer;
  font:
    700 10px Consolas,
    monospace;
  padding: 8px 10px;
}
.px-board-toolmode.active,
.px-board-brush.active {
  border-color: hsl(calc(var(--th-h) + 0.6) calc(64% * var(--th-s)) calc(62.9% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -2) calc(46.1% * var(--th-s)) calc(22.5% + var(--th-l)));
  color: hsl(calc(var(--th-h) + 3.2) calc(100% * var(--th-s)) calc(85.1% + var(--th-l)));
  box-shadow: inset 0 0 0 1px
    hsl(calc(var(--th-h) + -0.6) calc(51.5% * var(--th-s)) calc(53.1% + var(--th-l)) / 0.3);
}
.px-map-brushes {
  display: grid;
  grid-template-columns: repeat(4, minmax(95px, 1fr));
  gap: 5px;
  max-height: 220px;
  overflow-y: auto;
}
.px-board-brush {
  min-height: 42px;
  text-align: left;
  display: flex;
  gap: 7px;
  align-items: center;
  min-width: 0;
  padding: 6px;
}
.px-board-brush b {
  font-size: 19px;
  width: 22px;
  text-align: center;
  color: hsl(calc(var(--th-h) + -3.7) calc(63% * var(--th-s)) calc(66.1% + var(--th-l)));
  flex: none;
}
.px-board-brush span {
  font-size: 9px;
  line-height: 1.3;
}
.px-map-editor .px-board-help {
  margin: 10px 0;
}
.px-board-grid {
  user-select: none;
}
.px-board-cell {
  overflow: hidden;
}
.px-cell-tile {
  font:
    800 23px Consolas,
    monospace;
  color: #8a9f8b;
  opacity: 0.7;
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
}
.px-board-cell .px-board-token {
  position: relative;
  z-index: 2;
}
.px-board-cell.px-tile-difficult {
  background: hsl(calc(var(--th-h) + 11.5) calc(19.5% * var(--th-s)) calc(17.1% + var(--th-l)));
}
.px-board-cell.px-tile-rubble {
  background: #34322c;
}
.px-board-cell.px-tile-water {
  background: hsl(calc(var(--th-bh) + 7.9) calc(46.7% * var(--th-bs)) 17.6%);
}
.px-tile-water .px-cell-tile {
  color: #83bac0;
}
.px-board-cell.px-tile-high {
  background: #273c31;
}
.px-board-cell.px-tile-half {
  background: #333525;
}
.px-tile-half .px-cell-tile {
  color: hsl(calc(var(--th-h) + -2.4) calc(54.4% * var(--th-s)) calc(66.5% + var(--th-l)));
}
.px-board-cell.px-tile-three {
  background: hsl(calc(var(--th-h) + 2.6) calc(33.3% * var(--th-s)) calc(20% + var(--th-l)));
}
.px-tile-three .px-cell-tile {
  color: hsl(calc(var(--th-h) + -3.2) calc(68% * var(--th-s)) calc(70.6% + var(--th-l)));
}
.px-board-cell.px-tile-wall {
  background: repeating-linear-gradient(
    45deg,
    #3a3f3e 0 6px,
    hsl(calc(var(--th-bh) + -5) calc(10.5% * var(--th-bs)) 14.9%) 6px 12px
  );
  outline: 1px solid #6f7971;
  outline-offset: -2px;
}
.px-tile-wall .px-cell-tile {
  color: #9daca3;
}
.px-board-cell.px-tile-door {
  background: hsl(calc(var(--th-h) + -5) calc(23.5% * var(--th-s)) calc(20% + var(--th-l)));
}
.px-tile-door .px-cell-tile {
  color: hsl(calc(var(--th-h) + 1.4) calc(69.5% * var(--th-s)) calc(62.7% + var(--th-l)));
}
.px-board-cell.px-tile-barrel {
  background: #4d3024;
}
.px-tile-barrel .px-cell-tile {
  color: #f4ad6a;
}
.px-board-cell.px-tile-flame {
  background: #4e2a1e;
}
.px-tile-flame .px-cell-tile {
  color: #f7ab60;
}
.px-board-cell.px-tile-toxic {
  background: #2e3b22;
}
.px-tile-toxic .px-cell-tile {
  color: #b4e17f;
}
.px-board-cell.px-tile-electric {
  background: hsl(calc(var(--th-bh) + 18.7) calc(36.5% * var(--th-bs)) 20.4%);
}
.px-tile-electric .px-cell-tile {
  color: #95d0ec;
}
.px-board-cell.px-tile-objective {
  background: hsl(calc(var(--th-h) + -6.2) calc(18.3% * var(--th-s)) calc(18.2% + var(--th-l)));
}
.px-tile-objective .px-cell-tile {
  color: hsl(calc(var(--th-h) + -3.7) calc(86.3% * var(--th-s)) calc(68.6% + var(--th-l)));
}
.px-board-cell.px-tile-extraction {
  background: hsl(calc(var(--th-bh) + -20.6) calc(27.8% * var(--th-bs)) 19%);
}
.px-tile-extraction .px-cell-tile {
  color: #9edfc6;
}
.px-board-legal {
  font:
    10px/1.6 Consolas,
    monospace;
  color: #a9ae9f;
  border-left: 2px solid hsl(calc(var(--th-h) + -0.1) calc(49.8% * var(--th-s)) calc(48.4% + var(--th-l)));
  padding: 10px;
  margin-top: 14px;
  background: #19201b;
}
@media (max-width: 1250px) {
  .px-map-editor-above {
    grid-template-columns: 1fr;
  }
  .px-map-brushes {
    grid-template-columns: repeat(4, minmax(95px, 1fr));
  }
}
@media (max-width: 660px) {
  .px-map-editor-above {
    padding: 8px 8px 0;
  }
  .px-map-brushes {
    grid-template-columns: repeat(2, minmax(105px, 1fr));
  }
  .px-map-dimensions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.pxu-menu-more {
  width: 100%;
  cursor: pointer;
  padding: 11px 8px;
  border: 1px solid hsl(calc(var(--th-h) + -2.6) calc(38.3% * var(--th-s)) calc(42% + var(--th-l)));
  background: #2d3024;
  color: hsl(calc(var(--th-h) + -0.1) calc(82.2% * var(--th-s)) calc(73.5% + var(--th-l)));
  font:
    800 11px Consolas,
    monospace;
}
.pxu-menu-more:hover {
  background: hsl(calc(var(--th-h) + -3) calc(25.9% * var(--th-s)) calc(22.7% + var(--th-l)));
}

.pw-wheel-card.px12-card {
  min-height: auto;
}
.pw-wheel-visual.px12-visual {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 8px auto 14px;
  overflow: hidden;
  background: radial-gradient(circle, rgba(64, 114, 123, 0.13), transparent 70%);
}
.pw-wheel-visual.px12-visual img {
  height: 100%;
  width: 100%;
  max-width: 230px;
  max-height: 196px;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(
    0 0 15px hsl(calc(var(--th-h) + -5.7) calc(77.9% * var(--th-s)) calc(53.9% + var(--th-l)) / 0.3)
  );
}
.pw-wheel-visual.px12-visual.px12-skull img {
  mix-blend-mode: screen;
  opacity: 0.86;
  filter: sepia(0.3) hue-rotate(179deg) saturate(1.1) contrast(1.2)
    drop-shadow(0 0 11px rgba(105, 176, 238, 0.15));
}
.pw-wheel-visual.px12-visual.px12-omni img {
  max-height: 196px;
  filter: drop-shadow(
    0 0 19px hsl(calc(var(--th-h) + -9.7) calc(88.3% * var(--th-s)) calc(53.1% + var(--th-l)) / 0.3)
  );
}
.px12-choices {
  display: grid;
  gap: 5px;
}
.px12-choice {
  min-height: 39px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  text-align: left;
  padding: 9px 12px;
  border: 1px solid rgba(113, 161, 175, 0.26);
  background: linear-gradient(
    90deg,
    hsl(calc(var(--th-bh) + 11.9) calc(31.2% * var(--th-bs)) 24.5% / 0.2),
    transparent
  );
  color: #acc8cb;
  font:
    800 12px Consolas,
    monospace;
  letter-spacing: 0.4px;
  transition:
    background 0.18s,
    border-color 0.18s,
    transform 0.15s;
}
.px12-choice:hover {
  border-color: #8bcbda;
  background: hsl(calc(var(--th-bh) + 9.4) calc(26.9% * var(--th-bs)) 18.2%);
  transform: translateX(2px);
}
.px12-choice.active {
  border-color: hsl(calc(var(--th-h) + -1.7) calc(61.4% * var(--th-s)) calc(55.3% + var(--th-l)));
  background: linear-gradient(
    90deg,
    hsl(calc(var(--th-h) + -3.9) calc(36.1% * var(--th-s)) calc(19% + var(--th-l))),
    hsl(calc(var(--th-bh) + 15) calc(28.1% * var(--th-bs)) 12.5%)
  );
  color: hsl(calc(var(--th-h) + -1.4) calc(100% * var(--th-s)) calc(81.4% + var(--th-l)));
  box-shadow: inset 3px 0 hsl(calc(var(--th-h) + -1.7) calc(67% * var(--th-s)) calc(63.1% + var(--th-l)));
}
.px12-choice-mark {
  color: hsl(calc(var(--th-h) + -8.6) calc(25.5% * var(--th-s)) calc(56.9% + var(--th-l)));
  font-size: 10px;
}
.pw-wheel-card.biotic .px12-choice.active {
  border-color: #ae8ce1;
  background: linear-gradient(90deg, #302645, #181b28);
  box-shadow: inset 3px 0 #b18ce2;
  color: #e6d6ff;
}
.px-wheel-desc {
  padding: 9px 2px 0;
  color: #9eb2b4;
  font:
    10px/1.5 Consolas,
    monospace;
}
.px12-slot-note {
  display: block;
  padding: 4px 5px;
  color: hsl(calc(var(--th-h) + -1.5) calc(52.6% * var(--th-s)) calc(66.1% + var(--th-l)));
  font:
    700 8px Consolas,
    monospace;
  letter-spacing: 0.45px;
}
.px12-open-selected {
  width: 100%;
  margin-top: 8px;
  padding: 9px 11px;
  border: 1px solid hsl(calc(var(--th-h) + -3.3) calc(35.6% * var(--th-s)) calc(39.6% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -1.1) calc(73.2% * var(--th-s)) calc(75.1% + var(--th-l)));
  background: #25271f;
  font:
    700 11px Consolas,
    monospace;
}
.px12-open-selected:hover {
  background: hsl(calc(var(--th-h) + -2.1) calc(22.1% * var(--th-s)) calc(18.6% + var(--th-l)));
}
.px12-carry-overlay {
  position: fixed;
  inset: 0;
  z-index: 2147482100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px;
}
.px12-carry-backdrop {
  position: absolute;
  inset: 0;
  background: hsl(calc(var(--th-bh) + 12.1) calc(77.8% * var(--th-bs)) 1.8% / 0.8);
  backdrop-filter: blur(4px);
}
.px12-carry-dialog {
  position: relative;
  width: min(600px, 100%);
  max-height: calc(100dvh - 30px);
  overflow: auto;
  border: 1px solid hsl(calc(var(--th-h) + -1.2) calc(58% * var(--th-s)) calc(56.1% + var(--th-l)));
  background: linear-gradient(
    145deg,
    hsl(calc(var(--th-bh) + -5) calc(11.5% * var(--th-bs)) 12%),
    hsl(calc(var(--th-bh) + 13) calc(33.3% * var(--th-bs)) 5.9%)
  );
  box-shadow:
    0 22px 80px #000c,
    0 0 18px hsl(calc(var(--th-h) + -2.7) calc(54% * var(--th-s)) calc(53.1% + var(--th-l)) / 0.1);
  animation: castEnter 0.18s ease-out both;
}
.px12-carry-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 13px;
  padding: 17px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 5.6) calc(21.1% * var(--th-s)) calc(29.8% + var(--th-l)));
  background: #24271d;
}
.px12-carry-heading h3 {
  margin: 3px 0;
  color: hsl(calc(var(--th-h) + 0) calc(83.6% * var(--th-s)) calc(78.4% + var(--th-l)));
  font:
    800 18px Consolas,
    monospace;
  letter-spacing: 0.6px;
}
.px12-carry-heading small {
  color: hsl(calc(var(--th-h) + 12.7) calc(18.8% * var(--th-s)) calc(72.9% + var(--th-l)));
  font:
    10px Consolas,
    monospace;
}
.px12-eyebrow {
  color: hsl(calc(var(--th-h) + 0.3) calc(54.8% * var(--th-s)) calc(59.2% + var(--th-l)));
  font:
    800 9px Consolas,
    monospace;
  letter-spacing: 1.4px;
}
.px12-close {
  flex: none;
  padding: 5px 12px;
  color: hsl(calc(var(--th-h) + 1.2) calc(66.1% * var(--th-s)) calc(76.9% + var(--th-l)));
  background: transparent;
  border: 1px solid hsl(calc(var(--th-h) + 1.9) calc(31.1% * var(--th-s)) calc(34.7% + var(--th-l)));
  width: auto;
  font-size: 20px;
}
.px12-carry-body {
  display: grid;
  gap: 13px;
  padding: 16px;
}
.px12-storage-readout {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  background: hsl(calc(var(--th-bh) + 5.9) calc(25.6% * var(--th-bs)) 8.4%);
  border: 1px solid #3e554a;
  color: #9cb9ac;
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 0.7px;
}
.px12-storage-readout strong {
  color: hsl(calc(var(--th-h) + 0.1) calc(69.3% * var(--th-s)) calc(68% + var(--th-l)));
}
.px12-cargo-list {
  min-height: 85px;
  display: grid;
  align-content: start;
  gap: 7px;
}
.px12-cargo-line {
  display: flex;
  align-items: center;
  gap: 9px;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 11px;
  background: hsl(calc(var(--th-bh) + 10) calc(24% * var(--th-bs)) 9.8%);
  border: 1px solid #364a45;
}
.px12-cargo-line strong {
  color: #eaece0;
  font:
    800 12px Consolas,
    monospace;
}
.px12-cargo-line small {
  display: block;
  color: #9bafa8;
  margin-top: 4px;
  font:
    10px Consolas,
    monospace;
}
.px12-counter {
  display: flex;
  align-items: center;
  gap: 8px;
  font:
    800 13px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + 0.7) calc(81.3% * var(--th-s)) calc(70.6% + var(--th-l)));
}
.px12-counter button,
.px12-return,
.px12-carry-footer button {
  border: 1px solid hsl(calc(var(--th-h) + -3.2) calc(30.4% * var(--th-s)) calc(36.1% + var(--th-l)));
  background: #2b3027;
  color: hsl(calc(var(--th-h) + -6.2) calc(69.9% * var(--th-s)) calc(81.8% + var(--th-l)));
  padding: 8px 11px;
  width: auto;
  font:
    800 11px Consolas,
    monospace;
  cursor: pointer;
}
.px12-counter button:hover,
.px12-return:hover,
.px12-carry-footer button:hover {
  background: hsl(calc(var(--th-h) + 0) calc(27.6% * var(--th-s)) calc(22.7% + var(--th-l)));
}
.px12-counter button:disabled,
.px12-carry-body button:disabled {
  opacity: 0.36;
  cursor: not-allowed;
}
.px12-transfer {
  display: grid;
  gap: 9px;
  padding: 13px;
  background: hsl(calc(var(--th-bh) + 11.4) calc(25.6% * var(--th-bs)) 8.4%);
  border: 1px solid #3d4d4c;
}
.px12-transfer label {
  font:
    800 10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -0.8) calc(65.4% * var(--th-s)) calc(68.2% + var(--th-l)));
  letter-spacing: 0.7px;
}
.px12-transfer small {
  font-size: 10px;
  color: #9eb3af;
}
.px12-transfer select {
  max-width: 100%;
}
.px12-transfer .px12-primary,
.px12-carry-footer .px12-primary {
  background: hsl(calc(var(--th-h) + -3.4) calc(54.8% * var(--th-s)) calc(30.4% + var(--th-l)));
  border-color: hsl(calc(var(--th-h) + -2.9) calc(53.9% * var(--th-s)) calc(52.4% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -0.5) calc(100% * var(--th-s)) calc(88.6% + var(--th-l)));
}
.px12-empty {
  padding: 19px;
  color: #abbcb7;
  font:
    11px/1.7 Consolas,
    monospace;
  border: 1px dashed #56604b;
  background: hsl(calc(var(--th-bh) + 1.7) calc(20.9% * var(--th-bs)) 8.4%);
}
.px12-carry-footer {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px solid hsl(calc(var(--th-h) + 7.8) calc(17.2% * var(--th-s)) calc(28.4% + var(--th-l)));
}
@media (max-width: 520px) {
  .pw-wheel-visual.px12-visual {
    height: 155px;
  }
  .pw-wheel-visual.px12-visual img {
    max-height: 154px;
  }
  .px12-cargo-line {
    align-items: flex-start;
  }
  .px12-carry-heading h3 {
    font-size: 16px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .px12-carry-dialog,
  .px12-choice {
    transition: none !important;
    animation: none !important;
  }
}

.pxd-root .prox-panelhead {
  margin-bottom: 12px;
}
.pxd-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.pxd-panel {
  min-width: 0;
  border: 1px solid #43514b;
  background: linear-gradient(
    155deg,
    hsl(calc(var(--th-bh) + -13.6) calc(13.7% * var(--th-bs)) 10%),
    hsl(calc(var(--th-bh) + 2.5) calc(20% * var(--th-bs)) 7.8%)
  );
  padding: 11px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.pxd-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  color: hsl(calc(var(--th-h) + 5.7) calc(54.2% * var(--th-s)) calc(74.3% + var(--th-l)));
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 0.6px;
}
.pxd-head span {
  color: #91aca7;
  font-size: 9px;
}
.pxd-chips {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  min-height: 29px;
  align-items: flex-start;
}
.pxd-chip {
  border: 1px solid #697158;
  background: #272b24;
  color: hsl(calc(var(--th-h) + 2.4) calc(45.2% * var(--th-s)) calc(83.5% + var(--th-l)));
  padding: 5px 7px;
  font:
    700 10px Consolas,
    monospace;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.pxd-chip small {
  font-size: 8px;
  color: #94c4ac;
}
.pxd-chip.pxd-manual {
  border-color: hsl(calc(var(--th-h) + -11) calc(17% * var(--th-s)) calc(34.5% + var(--th-l)));
}
.pxd-chip.pxd-immune-conflict {
  border-color: #bb7762;
  color: #ecbbad;
}
.pxd-chip button {
  border: 0;
  background: #49382d;
  color: hsl(calc(var(--th-h) + -12.9) calc(74.7% * var(--th-s)) calc(70.6% + var(--th-l)));
  cursor: pointer;
  font-weight: 800;
  padding: 1px 5px;
}
.pxd-none {
  font:
    10px Consolas,
    monospace;
  color: #87938d;
}
.pxd-add {
  display: flex;
  gap: 5px;
}
.pxd-add select {
  min-width: 0;
  width: 100%;
  flex: 1;
  max-width: 100%;
  padding: 8px 4px;
  background: hsl(calc(var(--th-bh) + 1.7) calc(20.9% * var(--th-bs)) 8.4%);
  border: 1px solid #435248;
  color: hsl(calc(var(--th-h) + 0.9) calc(27.9% * var(--th-s)) calc(88% + var(--th-l)));
  font:
    10px Consolas,
    monospace;
}
.pxd-add button {
  border: 1px solid hsl(calc(var(--th-h) + -4.2) calc(39.8% * var(--th-s)) calc(38.4% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -4.1) calc(28.2% * var(--th-s)) calc(15.3% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -4.6) calc(67.5% * var(--th-s)) calc(69.8% + var(--th-l)));
  padding: 6px 8px;
  font:
    700 10px Consolas,
    monospace;
  cursor: pointer;
}
.pxd-add button:disabled {
  opacity: 0.45;
}
.pxd-hint {
  font:
    9px/1.45 Consolas,
    monospace;
  color: #a0aca5;
}
.pxd-hint select {
  margin-left: 6px;
  background: hsl(calc(var(--th-bh) + -12.5) calc(17.4% * var(--th-bs)) 9%);
  color: hsl(calc(var(--th-h) + -1.7) calc(19.1% * var(--th-s)) calc(81.6% + var(--th-l)));
  border: 1px solid #465047;
  padding: 4px;
  font-size: 10px;
}
.pxd-stages summary,
.pxd-advanced summary {
  cursor: pointer;
  color: hsl(calc(var(--th-h) + 0.9) calc(41.6% * var(--th-s)) calc(69.8% + var(--th-l)));
  font:
    800 10px Consolas,
    monospace;
  padding: 9px;
  border: 1px solid #465347;
  background: #1e2420;
  letter-spacing: 0.4px;
}
.pxd-stages .px-stage-grid {
  margin-top: 12px;
  grid-template-columns: 1fr;
}
.pxd-immunity-col {
  display: grid;
  gap: 9px;
}
.pxd-turn-summary {
  color: #9fb0a6;
  font:
    700 10px Consolas,
    monospace;
  margin-bottom: 10px;
}
.pxd-advanced {
  margin-top: 11px;
}
.pxd-advanced .px-barrier-box {
  margin-top: 10px;
}
.pxd-advanced .grid.threecol {
  grid-template-columns: 1fr;
}
.pxd-grid .px-stage-card {
  min-width: 0;
}
@media (max-width: 860px) {
  .pxd-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 420px) {
  .pxd-add {
    flex-wrap: wrap;
  }
  .pxd-add select {
    flex-basis: 100%;
  }
}

.pxr-common {
  --pxr: #adb4ba;
}
.pxr-uncommon {
  --pxr: #74c69b;
}
.pxr-rare {
  --pxr: #7fafe9;
}
.pxr-very-rare {
  --pxr: #c3a0ec;
}
.pxr-spectre {
  --pxr: #ea978b;
}
.pxr-legendary {
  --pxr: #e6c468;
}
.pxr-unrated {
  --pxr: #8f9999;
}
.pxr-card {
  border-left: 3px solid var(--pxr, #879398) !important;
}
.pxr-card .pxu-item-name,
.pxr-card .pxu-menu-choice-name > b,
.pxr-card .pxu-slot-name {
  color: var(--pxr, #d4dcd7);
}
.pxr-badge {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--pxr, #9ba5a5);
  color: var(--pxr, #b5c1bd);
  background: hsl(calc(var(--th-bh) + -5) calc(16.3% * var(--th-bs)) 8.4%);
  padding: 2px 5px;
  font:
    800 8px/1.3 Consolas,
    monospace;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  white-space: nowrap;
}
.pxr-inline {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 4px;
}
.pxr-price,
.pxr-stash-price {
  color: hsl(calc(var(--th-h) + 0.5) calc(55.4% * var(--th-s)) calc(78% + var(--th-l)));
  font:
    700 9px/1.25 Consolas,
    monospace;
  white-space: normal;
}
.pxr-stash-price {
  padding: 0 2px 1px;
  display: block;
  font-size: 9px;
}
.pxr-slot-meta {
  padding: 0 6px 6px;
  display: flex;
  gap: 5px;
  align-items: center;
  flex-wrap: wrap;
}
.pxr-slot-meta .pxr-badge {
  font-size: 7px;
}
.pxr-slot-meta .pxr-price {
  font-size: 8px;
}
.pxu-item.pxr-card {
  padding-left: 5px;
}
.pxu-item.pxr-card .pxu-item-kind {
  color: var(--pxr, #adb7ab);
}
.pxu-menu-choice.pxr-card {
  padding-left: 7px;
}
.pxu-acquire-list .pxr-card > b {
  min-width: 0;
}
.pxu-acquire-list .pxr-inline {
  margin-top: 4px;
}
.pxr-legend {
  padding: 8px 13px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  background: hsl(calc(var(--th-bh) + 5) calc(21.4% * var(--th-bs)) 5.5%);
  border-bottom: 1px solid #454c40;
}
.pxr-legend small {
  margin-left: auto;
  color: #8e9b94;
  font:
    700 9px Consolas,
    monospace;
}
.pxr-mod-summary {
  padding: 10px;
  margin: 9px 0;
  color: hsl(calc(var(--th-h) + -1.7) calc(67.2% * var(--th-s)) calc(74.9% + var(--th-l)));
  font:
    700 11px/1.5 Consolas,
    monospace;
  border: 1px solid hsl(calc(var(--th-h) + 1.3) calc(22% * var(--th-s)) calc(31.2% + var(--th-l)));
  background: #141916;
}
@media (max-width: 660px) {
  .pxr-legend {
    padding: 6px;
  }
  .pxr-legend small {
    margin-left: 0;
    width: 100%;
  }
  .pxr-stash-price {
    font-size: 8px;
  }
  .pxr-badge {
    font-size: 7px;
  }
}

/* v1.20: readable rarity, effect and slot details for upgrade manager */
.pxr-homebrew {
  --pxr: #b6b2e1;
}
.pxm-socket.pxr-card {
  border-left: 3px solid var(--pxr, #b0b9a4) !important;
}
.pxm-socket.pxr-card strong {
  color: var(--pxr, hsl(calc(var(--th-h) + -1.1) calc(57.1% * var(--th-s)) calc(80.8% + var(--th-l))));
}
.pxm-socket small {
  display: block;
  font:
    9px/1.2 Consolas,
    monospace;
  color: #9daea6;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.pxm-detail {
  border: 1px solid #43544a;
  border-left: 3px solid var(--pxr, #879398);
  padding: 9px 10px;
  background: hsl(calc(var(--th-bh) + -11.7) calc(20.9% * var(--th-bs)) 8.4%);
  margin: 8px 0;
  color: #d6e0d6;
  min-width: 0;
}
.pxm-detail-top {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font:
    700 9px/1.3 Consolas,
    monospace;
  color: #abb9b0;
}
.pxm-detail-top span:last-child {
  color: hsl(calc(var(--th-h) + -0.2) calc(55.9% * var(--th-s)) calc(75.1% + var(--th-l)));
  margin-left: auto;
}
.pxm-detail p.pxm-description {
  color: #c0d2ca;
  font:
    11px/1.45 Consolas,
    monospace;
  margin: 8px 0;
  white-space: normal;
}
.pxm-grants {
  border-top: 1px solid #344139;
  padding-top: 7px;
}
.pxm-grants > b {
  color: hsl(calc(var(--th-h) + -2.1) calc(54.8% * var(--th-s)) calc(63.5% + var(--th-l)));
  font:
    800 9px/1.4 Consolas,
    monospace;
  letter-spacing: 0.7px;
}
.pxm-grants > p {
  font:
    11px/1.45 Consolas,
    monospace !important;
  color: #e2e8df !important;
  margin: 4px 0 0 !important;
  white-space: normal;
}
.pxm-bonuses {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 8px;
}
.pxm-bonus {
  border: 1px solid #56654f;
  background: hsl(calc(var(--th-bh) + -32.7) calc(19.4% * var(--th-bs)) 13.1%);
  padding: 3px 6px;
  color: #b8e4c7;
  font:
    700 9px/1.4 Consolas,
    monospace;
}
.pxm-bonus.tracked {
  border-color: hsl(calc(var(--th-h) + -11.1) calc(25.8% * var(--th-s)) calc(34.9% + var(--th-l)));
  background: hsl(calc(var(--th-h) + -7.5) calc(24.2% * var(--th-s)) calc(12.9% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -7.4) calc(63.6% * var(--th-s)) calc(72% + var(--th-l)));
}
.pxm-origin {
  display: block;
  color: #8fa39b;
  font:
    9px/1.45 Consolas,
    monospace;
  margin-top: 7px;
}
.pxm-list {
  max-height: 380px;
}
.pxm-list button.pxm-upgrade-choice {
  display: block;
  text-align: left;
  padding: 10px 12px;
  min-width: 0;
  border: 1px solid #4b554d;
  background: hsl(calc(var(--th-bh) + -23) calc(17.9% * var(--th-bs)) 11%);
  white-space: normal;
}
.pxm-upgrade-choice .pxm-detail {
  margin-bottom: 0;
}
.pxm-choice-heading {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}
.pxm-choice-heading > b {
  font:
    800 12px Consolas,
    monospace;
  color: var(--pxr, #d7e0d4);
}
.pxm-choice-heading > strong {
  font:
    800 10px Consolas,
    monospace;
  color: hsl(calc(var(--th-h) + -2.5) calc(71.6% * var(--th-s)) calc(73.7% + var(--th-l)));
  white-space: nowrap;
}
.pxm-list button.pxm-upgrade-choice:hover {
  border-color: var(--pxr, hsl(calc(var(--th-h) + -1) calc(51.1% * var(--th-s)) calc(63.9% + var(--th-l))));
  background: #263029;
}
.pxm-modal {
  width: min(760px, 96vw);
}
.pxu-inspected .pxm-detail {
  margin-top: 8px;
}
.px-mod-row .pxm-detail {
  margin-top: 6px;
}
@media (max-width: 600px) {
  .pxm-choice-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .pxm-modal {
    padding: 10px;
  }
  .pxm-list {
    max-height: 270px;
  }
}

/* v1.21: functional offline ME5e weapon modification browser */
.pxm-catalog-find {
  display: grid;
  gap: 6px;
  margin: 12px 0 7px;
  color: #b9c2b8;
  font:
    700 10px Consolas,
    monospace;
  letter-spacing: 0.7px;
}
.pxm-catalog-find input {
  width: 100%;
  padding: 10px 12px;
  background: hsl(calc(var(--th-bh) + 15) calc(29% * var(--th-bs)) 6.1%);
  color: hsl(calc(var(--th-h) + -4.1) calc(44% * var(--th-s)) calc(90.2% + var(--th-l)));
  border: 1px solid #4b5b51;
  outline: none;
  font:
    12px Consolas,
    monospace;
}
.pxm-catalog-find input:focus {
  border-color: hsl(calc(var(--th-h) + -3.4) calc(54.8% * var(--th-s)) calc(59.2% + var(--th-l)));
}
.pxm-catalog-count {
  font:
    700 10px Consolas,
    monospace;
  color: #aeb8b4;
  padding: 3px 0 8px;
}
.pxm-catalog-record {
  display: grid;
  gap: 8px;
  border: 1px solid #46534a;
  border-left-width: 3px;
  padding: 11px;
  background: hsl(calc(var(--th-bh) + -25) calc(11.5% * var(--th-bs)) 10.2%);
}
.pxm-catalog-record[hidden] {
  display: none !important;
}
.pxm-catalog-record .pxm-choice-heading {
  display: flex;
  gap: 8px;
  justify-content: space-between;
  align-items: center;
}
.pxm-catalog-record .pxm-choice-heading strong {
  font:
    700 9px Consolas,
    monospace;
  color: #b7c8b4;
}
.pxm-catalog-cta {
  background: #25281e;
  border: 1px solid hsl(calc(var(--th-h) + -0.5) calc(44.5% * var(--th-s)) calc(41% + var(--th-l)));
  color: hsl(calc(var(--th-h) + -3.2) calc(76.7% * var(--th-s)) calc(74.7% + var(--th-l)));
  cursor: pointer;
  padding: 9px 12px;
  text-align: center;
  font:
    800 10px Consolas,
    monospace;
  letter-spacing: 0.7px;
}
.pxm-catalog-cta:hover {
  background: hsl(calc(var(--th-h) + 5.4) calc(28.1% * var(--th-s)) calc(17.5% + var(--th-l)));
}
.pxm-catalog-record .pxm-detail {
  border-width: 0;
  background: transparent;
  padding: 0;
}
.pxm-catalog-list {
  display: grid;
  gap: 9px;
  max-height: min(49vh, 520px);
  overflow-y: auto;
}
.pxm-modal {
  max-height: 94vh;
  overflow-y: auto;
}
.pxm-upgrade-choice {
  cursor: pointer;
}

/* v1.22 GM Compendium creation studio */
.pxgm-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  background: hsl(calc(var(--th-bh) + 8.3) calc(20% * var(--th-bs)) 8.8%);
  border: 1px solid #464839;
  margin: 14px 0;
}
.pxgm-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: 14px;
}
.pxgm-editor,
.pxgm-browser {
  border: 1px solid hsl(calc(var(--th-h) + 7.9) calc(13.2% * var(--th-s)) calc(25.3% + var(--th-l)));
  background: linear-gradient(
    145deg,
    hsl(calc(var(--th-bh) + -5) calc(12.5% * var(--th-bs)) 9.4%),
    hsl(calc(var(--th-bh) + 3.6) calc(17.9% * var(--th-bs)) 7.6%)
  );
  padding: 16px;
  min-width: 0;
}
.pxgm-form {
  display: grid;
  gap: 13px;
}
.pxgm-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.pxgm-field {
  display: grid;
  gap: 6px;
  min-width: 0;
}
.pxgm-field > span {
  font:
    700 10px/1.3 Consolas,
    monospace;
  letter-spacing: 0.45px;
  color: hsl(calc(var(--th-h) + -0.2) calc(48.2% * var(--th-s)) calc(61.4% + var(--th-l)));
}
.pxgm-field input,
.pxgm-field select,
.pxgm-field textarea,
.pxgm-form textarea {
  width: 100%;
  min-width: 0;
  background: hsl(calc(var(--th-bh) + 10) calc(25% * var(--th-bs)) 6.3%);
  border: 1px solid #4c5550;
  color: hsl(calc(var(--th-h) + 6.8) calc(36.7% * var(--th-s)) calc(88.2% + var(--th-l)));
  padding: 9px;
  font:
    12px Consolas,
    monospace;
  border-radius: 3px;
}
.pxgm-field textarea {
  resize: vertical;
}
.pxgm-subhead {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid hsl(calc(var(--th-h) + 4.1) calc(16.7% * var(--th-s)) calc(25.9% + var(--th-l)));
  padding: 12px 0 7px;
  color: hsl(calc(var(--th-h) + -0.5) calc(67.4% * var(--th-s)) calc(65.1% + var(--th-l)));
  font:
    800 12px Consolas,
    monospace;
  letter-spacing: 0.7px;
}
.pxgm-subhead small {
  font:
    10px Consolas,
    monospace;
  color: #99a39e;
}
.pxgm-advanced {
  border: 1px solid #393f39;
  padding: 8px;
}
.pxgm-advanced summary {
  cursor: pointer;
  color: hsl(calc(var(--th-h) + 4.6) calc(14.1% * var(--th-s)) calc(68% + var(--th-l)));
  font:
    700 11px Consolas,
    monospace;
}
.pxgm-advanced textarea {
  margin-top: 10px;
}
.pxgm-records {
  max-height: 515px;
  overflow: auto;
  scrollbar-width: thin;
  padding-right: 5px;
}
.pxgm-import {
  border-top: 1px solid hsl(calc(var(--th-h) + 2.6) calc(20.3% * var(--th-s)) calc(28% + var(--th-l)));
  margin-top: 16px;
  padding-top: 12px;
}
.pxgm-import input[type='file'] {
  width: 100%;
  color: hsl(calc(var(--th-h) + 1.8) calc(37.6% * var(--th-s)) calc(78.6% + var(--th-l)));
  margin: 8px 0;
}
.pxgm-import code {
  color: hsl(calc(var(--th-h) + -2.3) calc(70.3% * var(--th-s)) calc(71% + var(--th-l)));
  font-size: 10px;
  overflow-wrap: anywhere;
}
@media (max-width: 1020px) {
  .pxgm-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 610px) {
  .pxgm-toolbar {
    grid-template-columns: 1fr;
  }
  .pxgm-grid {
    grid-template-columns: 1fr;
  }
  .pxgm-editor,
  .pxgm-browser {
    padding: 10px;
  }
}

/* v1.22 rarity audit: show the rarity tier and credit price in GM lists too. */
.pxgm-record-row {
  padding-left: 10px !important;
  border-left-width: 3px !important;
  gap: 10px;
  flex-wrap: wrap;
}
.pxgm-record-row > .pxr-inline {
  justify-content: flex-end;
  max-width: 42%;
}
.pxgm-record-row > .pxr-inline .pxr-badge {
  font-size: 9px;
}
@media (max-width: 650px) {
  .pxgm-record-row > .pxr-inline {
    max-width: 100%;
    justify-content: flex-start;
  }
}

/* v1.25 · gear is intentionally motionless. Hover changes only a flat highlight. */
.pxu-shell,
.pxu-shell *,
#pxu-global-overlay,
#pxu-global-overlay *,
#pxu-workbench,
#pxu-workbench * {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
  backdrop-filter: none !important;
}
.pxu-shell .pxu-slot:hover,
.pxu-shell .pxu-slot:focus-visible {
  transform: none !important;
  box-shadow: none !important;
  border-color: hsl(calc(var(--th-h) + -0.7) calc(45.8% * var(--th-s)) calc(62.4% + var(--th-l))) !important;
  background: #28302a !important;
}
.pxu-shell .pxu-slot-art svg,
.pxu-shell .pxu-item-graphic svg,
.pxu-shell .pxu-figure svg {
  filter: none !important;
}
.pxu-shell .pxu-item:hover {
  box-shadow: none !important;
  border-color: hsl(calc(var(--th-h) + -0.7) calc(45.8% * var(--th-s)) calc(62.4% + var(--th-l))) !important;
  background: #273129 !important;
}
.pxu-shell .pxu-slot-wrap:hover .pxu-slot,
.pxu-shell .pxu-slot-wrap:focus-within .pxu-slot {
  box-shadow: none !important;
}
.pxu-shell .pxu-item.selected,
.pxu-shell .pxu-slot.active {
  box-shadow: none !important;
}
#pxu-global-overlay .pxu-menu-choice:hover,
#pxu-global-overlay .pxu-menu-choice:focus-visible {
  background: #32392e !important;
  border-color: hsl(calc(var(--th-h) + -2.8) calc(52.3% * var(--th-s)) calc(62.2% + var(--th-l))) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}
#pxu-global-overlay .pxu-global-panel {
  animation: none !important;
  transition: none !important;
  filter: none !important;
}