/* ══════════════════════════════════════════════════════════════
   PERSONNEL SCREEN STYLES
   ══════════════════════════════════════════════════════════════ */
#screen-personnel {
  background: var(--fob-bg);
  color: var(--fob-text);
  font-family: var(--fob-mono);
  flex-direction: column;
  overflow: hidden;
  padding-top: 66px;
  position: relative;
}

/* Scanline overlay */
#screen-personnel .pers-scanline {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.07) 2px,rgba(0,0,0,0.07) 4px);
  pointer-events: none;
  z-index: 0;
}

/* ── Layout shell ───────────────────────────────────────────── */
.pers-layout {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* ── Page header ────────────────────────────────────────────── */
.pers-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  padding: 20px 40px 14px;
  border-bottom: 1px solid var(--fob-border);
  flex-shrink: 0;
  gap: 24px;
}
.pers-header-left { display: flex; flex-direction: column; gap: 3px; }
.pers-classification {
  font-size: 8px;
  letter-spacing: 0.24em;
  color: var(--fob-amber);
  opacity: 0.55;
  text-transform: uppercase;
}
.pers-title {
  font-family: var(--fob-display);
  font-size: 20px;
  font-weight: 600;
  color: var(--fob-amber);
  letter-spacing: 0.06em;
  margin: 0;
}
.pers-subtitle {
  font-size: 8px;
  letter-spacing: 0.16em;
  color: var(--fob-dim);
  text-transform: uppercase;
}

/* Header controls */
.pers-header-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* Scope toggle */
.pers-scope-toggle {
  display: flex;
  border: 1px solid var(--fob-border-hi);
  overflow: hidden;
}
.pers-scope-btn {
  background: transparent;
  border: none;
  color: var(--fob-dim);
  font-family: var(--fob-mono);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 6px 14px;
  cursor: pointer;
  transition: all 0.15s;
  border-right: 1px solid var(--fob-border);
}
.pers-scope-btn:last-child { border-right: none; }
.pers-scope-btn:hover { color: var(--fob-amber); background: var(--fob-amber-glow); }
.pers-scope-btn.active {
  background: rgba(201,168,76,0.14);
  color: var(--fob-amber-bright);
}

/* Filter chips */
.pers-filter-row {
  display: flex;
  gap: 6px;
  align-items: center;
}
.pers-filter-chip {
  background: transparent;
  border: 1px solid rgba(201,168,76,0.2);
  color: var(--fob-dim);
  font-family: var(--fob-mono);
  font-size: 8px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 10px;
  cursor: pointer;
  transition: all 0.15s;
}
.pers-filter-chip:hover { border-color: var(--fob-amber); color: var(--fob-amber); }
.pers-filter-chip.active {
  background: rgba(201,168,76,0.14);
  border-color: var(--fob-amber);
  color: var(--fob-amber-bright);
}

/* ── Tab navigation ─────────────────────────────────────────── */
.pers-tabs {
  display: flex;
  border-bottom: 1px solid var(--fob-border);
  flex-shrink: 0;
  padding: 0 40px;
  gap: 0;
}
.pers-tab {
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--fob-dim);
  font-family: var(--fob-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 10px 18px;
  cursor: pointer;
  transition: all 0.15s;
  margin-bottom: -1px;
}
.pers-tab:hover { color: var(--fob-amber); }
.pers-tab.active {
  color: var(--fob-amber-bright);
  border-bottom-color: var(--fob-amber);
}

/* ── Tab panels ─────────────────────────────────────────────── */
.pers-panel { display: none; flex: 1; overflow: hidden; }
.pers-panel.active { display: flex; }

/* ══════════════════════════════════════════════════════════════
   PANEL 1 — ROSTER
   ══════════════════════════════════════════════════════════════ */
.pers-roster-panel {
  flex-direction: row;
  gap: 0;
  overflow: hidden;
}

/* Roster list column */
.pers-roster-list {
  width: 420px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--fob-border);
  overflow: hidden;
}
.pers-roster-search {
  padding: 10px 14px;
  border-bottom: 1px solid var(--fob-border);
  flex-shrink: 0;
}
.pers-search-input {
  width: 100%;
  background: rgba(201,168,76,0.04);
  border: 1px solid var(--fob-border);
  color: var(--fob-text);
  font-family: var(--fob-mono);
  font-size: 10px;
  padding: 6px 10px;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.15s;
}
.pers-search-input:focus { border-color: var(--fob-amber-dim); }
.pers-search-input::placeholder { color: var(--fob-faint); }

.pers-roster-scroll {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--fob-amber-dim) transparent;
}

/* Roster row */
.pers-roster-row {
  display: flex;
  align-items: center;
  padding: 8px 14px;
  border-bottom: 1px solid rgba(201,168,76,0.06);
  cursor: pointer;
  gap: 8px;
  transition: background 0.12s;
  position: relative;
}
.pers-roster-row:hover { background: rgba(201,168,76,0.06); }
.pers-roster-row.selected { background: rgba(201,168,76,0.12); }
.pers-roster-row.selected::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 2px;
  background: var(--fob-amber);
}

.pers-row-rank {
  font-size: 9px;
  color: var(--fob-amber-dim);
  letter-spacing: 0.06em;
  min-width: 32px;
  flex-shrink: 0;
}
.pers-row-name {
  flex: 1;
  font-size: 10px;
  color: var(--fob-text);
  letter-spacing: 0.04em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
  gap: 5px;
}
.pers-actor-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  font-size: 9px;
  flex-shrink: 0;
  position: relative;
  cursor: default;
}
.pers-actor-badge--pc   { color: var(--fob-amber-bright); }
.pers-actor-badge--com  { color: #7ab0d4; }

/* Tooltip */
.pers-tooltip {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--fob-bg2);
  border: 1px solid var(--fob-border-hi);
  color: var(--fob-text);
  font-size: 9px;
  letter-spacing: 0.06em;
  padding: 4px 8px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s;
  z-index: 100;
}
.pers-actor-badge:hover .pers-tooltip { opacity: 1; }

.pers-row-status {
  font-size: 8px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  flex-shrink: 0;
}
.pers-row-status--active   { color: #4a8a3a; }
.pers-row-status--wounded  { color: #c0932b; }
.pers-row-status--deployed { color: #4a7aaa; }
.pers-row-status--kia      { color: var(--fob-red); opacity: 0.7; }
.pers-row-status--critical { color: var(--fob-red); }

.pers-row-fob {
  font-size: 8px;
  color: var(--fob-faint);
  flex-shrink: 0;
  max-width: 80px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Roster footer — strength summary */
.pers-roster-footer {
  padding: 8px 14px;
  border-top: 1px solid var(--fob-border);
  font-size: 8px;
  color: var(--fob-dim);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
}
.pers-roster-footer-count { color: var(--fob-amber-dim); }

/* ── Dossier panel (right side of roster) ───────────────────── */
.pers-dossier {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.pers-dossier-empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  color: var(--fob-faint);
}
.pers-dossier-empty-icon { font-size: 28px; opacity: 0.3; }
.pers-dossier-empty-text { font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; }

.pers-dossier-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--fob-amber-dim) transparent;
}

/* Dossier header band */
.pers-dossier-header {
  padding: 18px 24px 14px;
  border-bottom: 1px solid var(--fob-border);
  background: rgba(201,168,76,0.03);
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.pers-dossier-name-block { display: flex; flex-direction: column; gap: 3px; }
.pers-dossier-rank-label {
  font-size: 8px;
  letter-spacing: 0.18em;
  color: var(--fob-amber-dim);
  text-transform: uppercase;
}
.pers-dossier-name {
  font-family: var(--fob-display);
  font-size: 17px;
  font-weight: 600;
  color: var(--fob-amber-bright);
  letter-spacing: 0.04em;
}
.pers-dossier-type-line {
  font-size: 8px;
  letter-spacing: 0.12em;
  color: var(--fob-dim);
  text-transform: uppercase;
  margin-top: 2px;
}
.pers-dossier-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.pers-action-btn {
  background: transparent;
  border: 1px solid var(--fob-border);
  color: var(--fob-dim);
  font-family: var(--fob-mono);
  font-size: 8px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 5px 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.pers-action-btn:hover { border-color: var(--fob-amber); color: var(--fob-amber); }
.pers-action-btn--export { border-color: rgba(201,168,76,0.3); }

/* Dossier sections */
.pers-dossier-section {
  padding: 14px 24px;
  border-bottom: 1px solid rgba(201,168,76,0.07);
}
.pers-dossier-section-label {
  font-size: 7px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
  margin-bottom: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(201,168,76,0.1);
}

/* Characteristic grid */
.pers-char-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
}
.pers-char-cell {
  background: rgba(201,168,76,0.03);
  border: 1px solid rgba(201,168,76,0.1);
  padding: 6px 4px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pers-char-abbr {
  font-size: 7px;
  letter-spacing: 0.1em;
  color: var(--fob-dim);
  text-transform: uppercase;
}
.pers-char-val {
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
}
.pers-char-label {
  font-size: 6px;
  color: var(--fob-faint);
  letter-spacing: 0.06em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Bio fields */
.pers-bio-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 16px;
}
.pers-bio-field { display: flex; flex-direction: column; gap: 2px; }
.pers-bio-key {
  font-size: 7px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fob-dim);
}
.pers-bio-val {
  font-size: 10px;
  color: var(--fob-text);
}

/* Wounds/Fate bar */
.pers-condition-row {
  display: flex;
  gap: 20px;
  margin-bottom: 8px;
}
.pers-condition-block { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.pers-condition-label { font-size: 7px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--fob-dim); }
.pers-condition-bar-wrap { height: 6px; background: rgba(201,168,76,0.08); border: 1px solid rgba(201,168,76,0.1); }
.pers-condition-bar {
  height: 100%;
  transition: width 0.3s;
}
.pers-condition-bar--wounds { background: #8b1a1a; }
.pers-condition-bar--fate   { background: var(--fob-amber-dim); }
.pers-condition-nums { font-size: 9px; color: var(--fob-dim); }

/* ══════════════════════════════════════════════════════════════
   PANEL 2 — SQUADS
   ══════════════════════════════════════════════════════════════ */
.pers-squads-panel {
  flex-direction: column;
  padding: 20px 40px;
  overflow-y: auto;
  gap: 16px;
}
.pers-squads-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pers-squads-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}
.pers-squad-card {
  border: 1px solid var(--fob-border);
  background: rgba(201,168,76,0.02);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  cursor: pointer;
  transition: border-color 0.15s;
}
.pers-squad-card:hover { border-color: var(--fob-amber-dim); }
.pers-squad-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.pers-squad-name {
  font-family: var(--fob-display);
  font-size: 12px;
  color: var(--fob-amber);
  letter-spacing: 0.04em;
}
.pers-squad-type-badge {
  font-size: 7px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fob-dim);
  border: 1px solid var(--fob-border);
  padding: 2px 6px;
}
.pers-squad-members {
  font-size: 9px;
  color: var(--fob-dim);
}
.pers-squad-task {
  font-size: 8px;
  color: #4a8a3a;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.pers-squad-task.unassigned { color: var(--fob-faint); }

/* ══════════════════════════════════════════════════════════════
   PANEL 3 — MORALE
   ══════════════════════════════════════════════════════════════ */
.pers-morale-panel {
  flex-direction: column;
  padding: 24px 40px;
  overflow-y: auto;
  gap: 20px;
}
.pers-morale-summary {
  display: flex;
  gap: 20px;
  align-items: stretch;
}
.pers-cohesion-card {
  flex: 0 0 220px;
  border: 1px solid var(--fob-border-hi);
  background: rgba(201,168,76,0.03);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  text-align: center;
}
.pers-cohesion-pct {
  font-family: var(--fob-display);
  font-size: 48px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
}
.pers-cohesion-label {
  font-size: 8px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fob-dim);
}
.pers-cohesion-sublabel {
  font-size: 9px;
  color: var(--fob-dim);
  line-height: 1.4;
}
.pers-cohesion-bar-wrap {
  width: 100%;
  height: 4px;
  background: rgba(201,168,76,0.08);
  margin-top: 4px;
}
.pers-cohesion-bar {
  height: 100%;
  transition: width 0.5s;
}

/* Capacity panel */
.pers-capacity-card {
  flex: 1;
  border: 1px solid var(--fob-border);
  background: rgba(201,168,76,0.02);
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pers-capacity-title {
  font-size: 8px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(201,168,76,0.1);
}
.pers-capacity-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 9px;
}
.pers-capacity-key { color: var(--fob-dim); letter-spacing: 0.08em; text-transform: uppercase; }
.pers-capacity-val { color: var(--fob-text); }
.pers-capacity-state-badge {
  font-size: 8px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 3px 10px;
  border: 1px solid;
}
.pers-capacity-state-badge--nominal       { color: #4a8a3a; border-color: rgba(74,138,58,0.4); }
.pers-capacity-state-badge--over          { color: #c0932b; border-color: rgba(192,147,43,0.4); }
.pers-capacity-state-badge--critical      { color: var(--fob-red); border-color: rgba(192,57,43,0.4); }

/* Morale modifier list */
.pers-modifier-list {
  border: 1px solid var(--fob-border);
}
.pers-modifier-list-header {
  padding: 10px 16px;
  background: rgba(201,168,76,0.04);
  border-bottom: 1px solid var(--fob-border);
  font-size: 8px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
}
.pers-modifier-row {
  display: flex;
  align-items: center;
  padding: 9px 16px;
  border-bottom: 1px solid rgba(201,168,76,0.05);
  gap: 12px;
  font-size: 9px;
}
.pers-modifier-row:last-child { border-bottom: none; }
.pers-modifier-sign {
  width: 32px;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  flex-shrink: 0;
}
.pers-modifier-sign--pos { color: #4a8a3a; }
.pers-modifier-sign--neg { color: var(--fob-red); }
.pers-modifier-label { flex: 1; color: var(--fob-text); }
.pers-modifier-expiry { font-size: 8px; color: var(--fob-faint); flex-shrink: 0; }

/* Squad breakdown table */
.pers-morale-squads { border: 1px solid var(--fob-border); }
.pers-morale-squads-header {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 120px;
  padding: 8px 16px;
  background: rgba(201,168,76,0.04);
  border-bottom: 1px solid var(--fob-border);
  font-size: 7px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
  gap: 8px;
}
.pers-morale-squad-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 120px;
  padding: 9px 16px;
  border-bottom: 1px solid rgba(201,168,76,0.05);
  font-size: 9px;
  gap: 8px;
  align-items: center;
}
.pers-morale-squad-row:last-child { border-bottom: none; }
.pers-squad-morale-bar-wrap { height: 5px; background: rgba(201,168,76,0.08); }
.pers-squad-morale-bar { height: 100%; transition: width 0.4s; }

/* ══════════════════════════════════════════════════════════════
   PANEL 4 — CASUALTIES & REINFORCEMENTS
   ══════════════════════════════════════════════════════════════ */
.pers-cas-panel {
  flex-direction: column;
  overflow: hidden;
}
.pers-cas-split {
  display: flex;
  flex: 1;
  overflow: hidden;
}

/* Casualties side */
.pers-casualties-col {
  width: 320px;
  flex-shrink: 0;
  border-right: 1px solid var(--fob-border);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.pers-col-header {
  padding: 12px 18px;
  border-bottom: 1px solid var(--fob-border);
  background: rgba(201,168,76,0.03);
  flex-shrink: 0;
}
.pers-col-title {
  font-size: 8px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
}
.pers-col-scroll {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--fob-amber-dim) transparent;
}
.pers-casualty-row {
  display: flex;
  align-items: center;
  padding: 8px 18px;
  border-bottom: 1px solid rgba(201,168,76,0.06);
  gap: 8px;
  font-size: 9px;
}
.pers-cas-name { flex: 1; color: var(--fob-text); }
.pers-cas-cause { font-size: 8px; color: var(--fob-dim); }
.pers-cas-status {
  font-size: 8px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.pers-cas-status--kia      { color: var(--fob-red); }
.pers-cas-status--critical { color: #c0392b; }
.pers-cas-status--recovery { color: #c0932b; }

/* Reinforcements side */
.pers-reinf-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Transfer order header */
.pers-transfer-header {
  padding: 12px 18px 10px;
  border-bottom: 1px solid var(--fob-border);
  background: rgba(201,168,76,0.03);
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
}
.pers-transfer-doc-block { display: flex; flex-direction: column; gap: 2px; }
.pers-transfer-doc-title {
  font-size: 8px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
}
.pers-transfer-doc-ref {
  font-size: 9px;
  color: var(--fob-dim);
}
.pers-transfer-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}
.pers-transfer-btn {
  background: transparent;
  border: 1px solid var(--fob-border);
  color: var(--fob-dim);
  font-family: var(--fob-mono);
  font-size: 8px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 5px 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.pers-transfer-btn:hover { border-color: var(--fob-amber); color: var(--fob-amber); }
.pers-transfer-btn--accept {
  background: rgba(74,138,58,0.12);
  border-color: rgba(74,138,58,0.4);
  color: #4a8a3a;
}
.pers-transfer-btn--accept:hover {
  background: rgba(74,138,58,0.22);
  border-color: #4a8a3a;
  color: #6ab05a;
}

/* Recruit grid table */
.pers-recruit-table-wrap {
  flex: 1;
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--fob-amber-dim) transparent;
}
.pers-recruit-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 9px;
  min-width: 860px;
}
.pers-recruit-table thead tr {
  background: rgba(201,168,76,0.05);
  border-bottom: 1px solid var(--fob-border-hi);
}
.pers-recruit-table th {
  padding: 8px 10px;
  text-align: left;
  font-size: 7px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--fob-amber-dim);
  white-space: nowrap;
  user-select: none;
  cursor: default;
}
.pers-recruit-table th.sortable { cursor: pointer; }
.pers-recruit-table th.sortable:hover { color: var(--fob-amber); }
.pers-recruit-table th.sort-asc::after  { content: ' ↑'; color: var(--fob-amber-bright); }
.pers-recruit-table th.sort-desc::after { content: ' ↓'; color: var(--fob-amber-bright); }
.pers-recruit-table th .th-tooltip {
  display: none;
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--fob-bg2);
  border: 1px solid var(--fob-border-hi);
  color: var(--fob-text);
  font-size: 9px;
  letter-spacing: 0.04em;
  padding: 5px 10px;
  white-space: nowrap;
  z-index: 200;
  text-transform: none;
  font-weight: normal;
  pointer-events: none;
}
.pers-recruit-table th { position: relative; }
.pers-recruit-table th:hover .th-tooltip { display: block; }

.pers-recruit-table tbody tr {
  border-bottom: 1px solid rgba(201,168,76,0.06);
  transition: background 0.1s;
}
.pers-recruit-table tbody tr:hover { background: rgba(201,168,76,0.05); }
.pers-recruit-table tbody tr.selected-row { background: rgba(201,168,76,0.1); }

.pers-recruit-table td {
  padding: 7px 10px;
  color: var(--fob-text);
  white-space: nowrap;
}
.td-check { width: 28px; text-align: center; }
.td-check input[type="checkbox"] { accent-color: var(--fob-amber); cursor: pointer; }

/* Stat value colour grading */
.stat-val { font-weight: bold; }
.stat-tier-1 { color: #8b1a1a; }   /* ≤25 */
.stat-tier-2 { color: #c0392b; }   /* 26-35 */
.stat-tier-3 { color: #c07330; }   /* 36-45 */
.stat-tier-4 { color: var(--fob-text); } /* 46-55 */
.stat-tier-5 { color: #7ab05a; }   /* 56-65 */
.stat-tier-6 { color: #4a8a3a; }   /* 66-75 */
.stat-tier-7 { color: #2ecc71; }   /* 76+ */

/* Accept button in row */
.td-accept-btn {
  background: transparent;
  border: 1px solid rgba(74,138,58,0.3);
  color: #4a8a3a;
  font-family: var(--fob-mono);
  font-size: 8px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 3px 10px;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
}
.td-accept-btn:hover {
  background: rgba(74,138,58,0.15);
  border-color: #4a8a3a;
  color: #6ab05a;
}

/* Facility sub-headers in recruit table */
.pers-facility-subheader td {
  background: rgba(201,168,76,0.04);
  color: var(--fob-amber-dim);
  font-size: 7px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 5px 10px;
  border-top: 1px solid var(--fob-border);
}

/* Capacity bar at footer */
.pers-capacity-bar-footer {
  padding: 8px 18px;
  border-top: 1px solid var(--fob-border);
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 8px;
  color: var(--fob-dim);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  flex-shrink: 0;
}
.pers-cap-bar-wrap {
  flex: 1;
  height: 6px;
  background: rgba(201,168,76,0.08);
  border: 1px solid rgba(201,168,76,0.1);
  position: relative;
}
.pers-cap-bar-fill {
  height: 100%;
  background: #4a8a3a;
  transition: width 0.4s;
}
.pers-cap-bar-fill.over  { background: #c0932b; }
.pers-cap-bar-fill.crit  { background: var(--fob-red); }
.pers-cap-bar-ideal-marker {
  position: absolute;
  top: -2px;
  bottom: -2px;
  width: 2px;
  background: var(--fob-amber-dim);
  opacity: 0.6;
}
.pers-cap-label { color: var(--fob-amber-dim); min-width: 80px; text-align: right; }

/* ══════════════════════════════════════════════════════════════
   PANEL 5 — ROLES
   ══════════════════════════════════════════════════════════════ */
.pers-roles-panel {
  flex-direction: column;
  padding: 24px 40px;
  overflow-y: auto;
  gap: 16px;
}
.pers-roles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}
.pers-role-card {
  border: 1px solid var(--fob-border);
  background: rgba(201,168,76,0.02);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pers-role-card-name {
  font-family: var(--fob-display);
  font-size: 12px;
  color: var(--fob-amber);
  letter-spacing: 0.04em;
}
.pers-role-card-desc { font-size: 9px; color: var(--fob-dim); line-height: 1.5; }
.pers-role-card-assignee {
  font-size: 9px;
  color: var(--fob-text);
  border-top: 1px solid rgba(201,168,76,0.1);
  padding-top: 6px;
}
.pers-role-card-assignee.empty { color: var(--fob-faint); font-style: italic; }
.pers-role-bonuses {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.pers-role-bonus-tag {
  font-size: 7px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 2px 6px;
  border: 1px solid rgba(74,138,58,0.3);
  color: #4a8a3a;
}

/* ── Shared utility buttons ─────────────────────────────────── */
.pers-btn-primary {
  background: rgba(201,168,76,0.1);
  border: 1px solid var(--fob-amber-dim);
  color: var(--fob-amber);
  font-family: var(--fob-mono);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 7px 16px;
  cursor: pointer;
  transition: all 0.15s;
}
.pers-btn-primary:hover {
  background: rgba(201,168,76,0.2);
  border-color: var(--fob-amber);
  color: var(--fob-amber-bright);
}

/* Empty state */
.pers-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 48px;
  color: var(--fob-faint);
}
.pers-empty-state-text {
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* GM Add Recruit Modal */
.pers-add-recruit-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 8100;
  background: rgba(0,0,0,0.8);
  align-items: center;
  justify-content: center;
}
.pers-add-recruit-backdrop.open { display: flex; }
.pers-add-recruit-modal {
  background: #0e0c08;
  border: 1px solid rgba(201,168,76,0.3);
  min-width: 400px;
  max-width: 500px;
  width: 90vw;
  font-family: var(--fob-mono,'Share Tech Mono',monospace);
  padding: 24px 28px;
}
.pers-arm-title {
  font-family: 'Cinzel',serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: #f0c060;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.pers-arm-sub {
  font-size: 8px;
  color: #6a6040;
  letter-spacing: 0.08em;
  margin-bottom: 18px;
}
.pers-arm-row {
  margin-bottom: 12px;
}
.pers-arm-label {
  font-size: 8px;
  letter-spacing: 0.16em;
  color: #7a6230;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.pers-arm-select, .pers-arm-input {
  width: 100%;
  box-sizing: border-box;
  background: #080705;
  border: 1px solid rgba(201,168,76,0.2);
  color: #d4c89a;
  font-family: var(--fob-mono,'Share Tech Mono',monospace);
  font-size: 11px;
  padding: 8px 10px;
  outline: none;
  appearance: none;
}
.pers-arm-select:focus, .pers-arm-input:focus {
  border-color: rgba(201,168,76,0.5);
}
.pers-arm-select option { background: #0e0c08; }
.pers-arm-error {
  font-size: 8px;
  color: #c0392b;
  min-height: 14px;
  margin-bottom: 10px;
  letter-spacing: 0.06em;
}
.pers-arm-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.pers-arm-accept {
  background: transparent;
  border: 1px solid #c9a84c;
  color: #c9a84c;
  font-family: var(--fob-mono,'Share Tech Mono',monospace);
  font-size: 9px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 9px 18px;
  cursor: pointer;
  transition: all 0.15s;
}
.pers-arm-accept:hover { background: rgba(201,168,76,0.08); }
.pers-arm-cancel {
  background: transparent;
  border: 1px solid rgba(201,168,76,0.15);
  color: #4a4030;
  font-family: var(--fob-mono,'Share Tech Mono',monospace);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 9px 14px;
  cursor: pointer;
}
.pers-arm-cancel:hover { color: #8a7a50; }


.pers-manage-pools-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 8200;
  background: rgba(0,0,0,0.82);
  align-items: center;
  justify-content: center;
}
.pers-manage-pools-backdrop.open { display: flex; }
.pers-manage-pools-modal {
  background: #0e0c08;
  border: 1px solid rgba(201,168,76,0.3);
  min-width: 420px;
  max-width: 560px;
  width: 92vw;
  font-family: var(--fob-mono, 'Share Tech Mono', monospace);
  padding: 24px 28px 20px;
  display: flex;
  flex-direction: column;
}
.pers-mpool-title {
  font-family: 'Cinzel', serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: #f0c060;
  text-transform: uppercase;
  margin-bottom: 3px;
}
.pers-mpool-sub {
  font-size: 8px;
  color: #6a6040;
  letter-spacing: 0.08em;
  margin-bottom: 18px;
  line-height: 1.5;
}
.pers-mpool-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 52vh;
  overflow-y: auto;
  margin-bottom: 18px;
  padding-right: 4px;
}
.pers-mpool-list::-webkit-scrollbar { width: 3px; }
.pers-mpool-list::-webkit-scrollbar-track { background: transparent; }
.pers-mpool-list::-webkit-scrollbar-thumb { background: rgba(201,168,76,0.2); }
.pers-mpool-row {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 10px 12px;
  border: 1px solid rgba(201,168,76,0.1);
  background: rgba(201,168,76,0.02);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.pers-mpool-row:hover { border-color: rgba(201,168,76,0.28); background: rgba(201,168,76,0.05); }
.pers-mpool-chk {
  margin-top: 3px;
  flex-shrink: 0;
  accent-color: #c9a84c;
  width: 13px;
  height: 13px;
  cursor: pointer;
}
.pers-mpool-info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pers-mpool-name {
  font-size: 10px;
  color: var(--fob-text, #d4c89a);
  letter-spacing: 0.06em;
}
.pers-mpool-meta {
  font-size: 8px;
  color: var(--fob-dim, #7a7060);
  letter-spacing: 0.08em;
}
.pers-mpool-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  border-top: 1px solid rgba(201,168,76,0.1);
  padding-top: 14px;
}
.pers-mpool-done {
  background: rgba(201,168,76,0.08);
  border: 1px solid rgba(201,168,76,0.35);
  color: #c9a84c;
  font-family: var(--fob-mono, 'Share Tech Mono', monospace);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 8px 22px;
  cursor: pointer;
  transition: all 0.15s;
}
.pers-mpool-done:hover { background: rgba(201,168,76,0.16); border-color: #c9a84c; color: #f0c060; }