.e-who .sub { margin-top: 0; }   /* fixes a global .sub leak into person rows */
.pe .e-card .e-field + .e-field { margin-top: 0; }   /* person grids space fields with gap (admin.css adds a stacked-field margin to every .e-card) */

/* =====================================================================
   Person pages (/edit/person/...). Classes: pe-*.
   Department Leadership people get .pe-lead (gold).
   ===================================================================== */
.pe { --pe-acc: var(--sage); --pe-acc-hi: var(--sage-ink); --pe-line: color-mix(in srgb, var(--sage) 55%, transparent); }
.pe.pe-lead { --pe-acc: var(--gold-solid); --pe-acc-hi: var(--gold); --pe-line: var(--gold-wash); }

/* header: the file's cover, same as a member's public file */
.pe-head { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 6px 22px;
  padding: 2px 0 20px; border-bottom: 3px double var(--rule-ink); }
.pe-head .e-av.lg { width: 84px; height: 84px; font-size: 1.15rem; border-color: var(--rule-2); }
.pe-lead .pe-head .e-av.lg { border-color: var(--gold-line); }
.pe-who { min-width: 0; padding-top: 2px; }
.pe-who h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(1.9rem, 3.2vw, 2.6rem); line-height: 1.02; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.pe-handle { color: var(--muted); margin-top: 4px; overflow-wrap: anywhere; }
.pe-chips { margin-top: 10px; }
.pe-leadchip { gap: 6px; color: var(--on-gold); background: var(--gold-solid); border-color: var(--gold-solid); font-weight: 700; }
.pe-leadchip svg { width: 13px; height: 13px; }
.pe-id { align-self: start; }
.pe-tabs { margin: 0 0 20px; }
.pe-lead .pe-tabs button.on::after { background: var(--gold-solid); }

/* layout */
.pe-grid { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); align-items: start; }
.pe-grid > .e-card + .e-card { margin-top: 0; }
@media (min-width: 980px) {
  .pe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pe-span2 { grid-column: span 2; }
}
@media (min-width: 1500px) {
  .pe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pe-details .pe-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr); }
  .pe-details .pe-span2 { grid-column: auto; }
}
.pe-span-all { grid-column: 1 / -1; }
.pe-fields { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.pe-fields.two { grid-template-columns: repeat(auto-fit, minmax(max(150px, calc(50% - 7px)), 1fr)); } /* two across, one on very small phones */
.pe-grow { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pe-grow b { overflow-wrap: anywhere; }
.pe-grow .e-muted { font-size: .84rem; }
.pe-len { color: var(--ink-2); font-size: .82rem; font-weight: 600; padding: 2px 9px; border-radius: var(--r-sm); background: var(--well); white-space: nowrap; }
.pe-h2 { font-size: .95rem; color: var(--ink-2); margin: 20px 2px 10px; font-weight: 600; }
.pe-h3 { font-size: .9rem; color: var(--ink-2); margin-bottom: 10px; font-weight: 600; }
.pe-mono { font-family: var(--mono); }

/* details */
.pe-stats { display: grid; gap: 12px; align-items: start; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pe-stats.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pe-stat input { font-variant-numeric: tabular-nums; font-size: 1.05rem; font-weight: 600; }
.pe-req { font-size: .76rem; line-height: 1.2; color: var(--muted); min-height: 0; }
.pe-req:empty { display: none; }
.pe-req.ok { color: var(--dmo); }
.pe-req.no b { color: var(--warn); }
.pe-total { grid-column: 1 / -1; display: flex; align-items: baseline; justify-content: space-between; padding: 10px 14px; border-radius: var(--r);
  background: var(--sage-wash); border: 1px solid var(--sage-wash); }
.pe-total span { color: var(--ink-2); font-size: .86rem; }
.pe-total b { font-family: var(--serif); font-size: 1.7rem; font-weight: 700; color: var(--pe-acc-hi); font-variant-numeric: tabular-nums; }
.pe-lead .pe-total { background: var(--gold-wash); border-color: var(--gold-wash); }
.pe-careful { border-style: dashed; }
.pe-careful .e-hint { margin-bottom: 12px; }
.pe-careful-row, .pe-inline { display: flex; gap: 8px; flex-wrap: wrap; }
.pe-careful-row .e-input, .pe-inline .e-input { flex: 1 1 160px; min-width: 0; }
.pe-retire { border-color: var(--gold-wash); }
.pe-retire .e-card-title { color: var(--gold); }
.e-btn.pe-gold { background: var(--gold-solid); border-color: var(--gold-solid); color: var(--on-gold); font-weight: 600; }
.e-btn.pe-gold:hover:not(:disabled) { background: var(--gold); border-color: var(--gold); }
.e-btn.pe-gold.armed { color: var(--on-gold); }
.pe-dirty { width: 8px; height: 8px; border-radius: 50%; background: var(--warn); }
.pe .e-savebar { background: var(--paper); border-top: 1px solid var(--rule-2); }

/* awards */
.pe-awards { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); align-items: start; }
.pe-awards > .e-card + .e-card { margin-top: 0; }
.pe-award { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-top: 1px solid var(--rule); }
.pe-agroup .e-card-title + .pe-award { border-top: 0; }
.pe-award .e-check { flex: 1; min-width: 0; }
.pe-award .e-check span { overflow-wrap: anywhere; }
.pe-award.held .e-check { cursor: default; }
.pe-award.held .e-check span { color: var(--ink-2); }
.pe-award.locked:not(.held) .e-check { cursor: not-allowed; }
.pe-award.locked:not(.held) .e-check span { color: var(--muted); }
.pe-award .aw-lock { margin-left: 0; }
.pe-held { font-size: .76rem; font-weight: 600; color: var(--sage-ink); padding: 1px 7px; border-radius: var(--r-sm); background: var(--sage-wash); }
.pe-info { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: none; border-radius: var(--r); border: 0; background: none; color: var(--muted); cursor: pointer; }
.pe-info:hover, .pe-info[aria-expanded="true"] { color: var(--sage-ink); background: var(--well); }
.pe-award-desc { margin: -2px 0 8px 27px; color: var(--muted); font-size: .85rem; }

/* punishment */
.pe-pun { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.pe-pun-opt { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 14px; border-radius: var(--r); border: 1px solid var(--rule-2);
  background: var(--field); color: var(--ink); font: inherit; font-weight: 500; cursor: pointer; text-align: left; }
.pe-pun-opt i { width: 10px; height: 10px; border-radius: 50%; flex: none; background: var(--warn); }
.pe-pun-opt.high i { background: var(--orange); } .pe-pun-opt.severe i { background: var(--bad); }
.pe-pun-opt:hover { border-color: color-mix(in srgb, var(--sage) 55%, transparent); }
.pe-pun-opt[aria-checked="true"] { border-color: var(--bad); background: var(--bad-wash); }
.pe-perm { align-self: end; min-height: 40px; }
.pe-fields .pe-span2 { grid-column: 1 / -1; }

/* departments */
.pe-dept .e-card-title { justify-content: flex-start; }
.pe-dept .e-card-title .e-chip { margin-left: auto; }
.pe-radio { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: var(--r); cursor: pointer; }
.pe-radio:hover { background: var(--well); }
.pe-radio input { width: 17px; height: 17px; accent-color: var(--sage); }
.pe-dept.dmo .pe-radio input { accent-color: var(--dmo); }
.pe-dept.cpm .pe-radio input { accent-color: var(--cpm); }
.pe-radio:has(input:checked) { background: var(--well); }

/* LOA */
.pe-loalen[hidden] { display: none; }
.pe-loalen { display: flex; justify-content: space-between; align-items: baseline; margin-top: 12px; padding: 10px 14px; border-radius: var(--r); background: var(--sage-wash); }
.pe-loalen span { color: var(--ink-2); font-size: .86rem; }
.pe-loalen b { font-size: 1.15rem; }
.pe-loalen.bad b { color: var(--bad); }
.pe-loarow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pe-loarow .pe-grow { flex-basis: 180px; }

/* rank history */
.pe-htotals { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pe-stints { display: grid; gap: 8px; }
@media (min-width: 1500px) { .pe-stints { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
.pe-stint { border: 1px solid var(--rule); border-radius: var(--r); background: var(--sheet); }
.pe-stint.now { border-color: var(--pe-line); }
.pe-stint summary { display: flex; align-items: center; gap: 12px; padding: 12px 14px; cursor: pointer; list-style: none; }
.pe-stint summary::-webkit-details-marker { display: none; }
.pe-stint summary::before { content: "▸"; color: var(--muted); transition: transform .15s; }
.pe-stint[open] summary::before { transform: rotate(90deg); }
.pe-stint .e-hint { padding: 0 14px 12px; }
.pe-roles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 0 14px 12px; }
.pe-roles div { padding: 8px 10px; border-radius: var(--r); background: var(--well); }
.pe-roles b { display: block; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.pe-roles span { color: var(--muted); font-size: .76rem; }

/* admin */
.pe-big { font-family: var(--serif); font-size: 2rem; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 10px; font-variant-numeric: tabular-nums; }
.pe-admin .e-status { display: block; margin-top: 8px; }
.pe-preview { margin-top: 8px; }
.pe-tagx { display: inline-flex; align-items: center; gap: 6px; padding-right: 3px; font-size: .74rem; }
.pe-rm { border: 0; background: transparent; color: inherit; border-radius: var(--r-sm); min-width: 20px; height: 20px; padding: 0 6px; font-size: .7rem; cursor: pointer; }
.pe-rm.armed { background: var(--bad-solid); color: #fff; font-weight: 700; }
.pe-tagform { display: grid; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--rule-2); }
.pe-swatches { display: flex; flex-wrap: wrap; gap: 6px; }
.pe-sw { width: 30px; height: 30px; padding: 0; border: 2px solid transparent; border-radius: var(--r-sm); cursor: pointer; position: relative; }
.pe-sw::after { content: ""; position: absolute; inset: 9px; border-radius: 1px; background: currentColor; }
.pe-sw.on { border-color: currentColor; }
.pe-hist { display: grid; }
.pe-hist > li { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0; border-top: 1px solid var(--rule); }
.pe-hist > li:first-child { border-top: 0; }
.pe-hist > li.editing { display: block; margin: 4px -12px; padding: 12px; border-radius: var(--r); background: var(--sage-wash); border-top-color: transparent; }
.pe-hist > li.editing + li { border-top-color: transparent; }
.pe-hist-top { display: flex; align-items: center; gap: 8px; }
.pe-hadd { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--rule-2); }
.pe-hadd-row { display: grid; gap: 10px; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr)) auto; align-items: end; }
.pe-lock { max-width: 420px; }

@media (max-width: 700px) {
  .pe-head { grid-template-columns: auto minmax(0, 1fr); padding: 0 0 16px; gap: 10px 14px; }
  .pe-head .e-av.lg { width: 60px; height: 60px; }
  .pe-id { grid-column: 1 / -1; justify-self: start; }
  .pe-id .e-empid { flex-direction: row; align-items: baseline; gap: 8px; }
  .pe-hadd-row { grid-template-columns: 1fr 1fr; }
  .pe-hadd-row .e-field:first-child, .pe-hadd-row .e-btn { grid-column: 1 / -1; }
  .pe-htotals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pe-roles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pe-pun { grid-template-columns: 1fr 1fr; }
}
.pe-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* Admin tab: earning freeze */
.pe-fzkinds { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 10px 0 4px; }
.pe-fzmore { margin-top: 12px; }
.pe-fzrow { margin-top: 12px; }
.pe-fzchip { cursor: default; }
/* Punishment tab: their punishments */
.pe-ph-h { margin: 6px 0 8px; font-weight: 600; font-size: .9rem; color: var(--ink-2); }
.pe-ph-h + .pe-ph-none, .pe-ph + .pe-ph-h, .pe-ph-none + .pe-ph-h { margin-top: 0; }
.pe-ph + .pe-ph-h, .pe-ph-none + .pe-ph-h { padding-top: 14px; }
.pe-ph { list-style: none; margin: 0 0 6px; padding: 0; }
.pe-ph-item { display: flex; flex-direction: column; gap: 3px; padding: 10px 0; border-top: 1px solid var(--rule); }
.pe-ph-item:first-child { border-top: 0; padding-top: 2px; }
.pe-ph-top { display: flex; align-items: center; justify-content: space-between; gap: 6px 12px; flex-wrap: wrap; }
.pe-ph-name { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.pe-ph-name i { width: 9px; height: 9px; border-radius: 50%; background: var(--warn); flex: none; }
.pe-ph-name.high i { background: var(--orange); } .pe-ph-name.severe i { background: var(--bad); }
.pe-ph-when { color: var(--muted); font-size: .85rem; font-variant-numeric: tabular-nums; }
.pe-ph-why { color: var(--ink-2); font-size: .9rem; overflow-wrap: anywhere; }
.pe-ph-none { margin-bottom: 4px; }
/* Admin ▸ Punishments (owners) and confidential reasons */
.pe-ph-acts { display: inline-flex; align-items: center; gap: 10px; }
.pe-phx .pe-ph-name { flex-wrap: wrap; }
.pe-phx .pe-ph-item.editing { padding: 14px; margin: 6px 0; border: 1px solid var(--rule-2); border-radius: var(--r); background: var(--sheet); }
.pe-phx form { display: grid; gap: 10px; }
.pe-phx textarea { width: 100%; resize: vertical; }
.pe-ph-row { flex-wrap: wrap; }
.pe-ph-rm { margin-left: auto; }
.pe-ph-undo { font-size: .88rem; }
.pe-conf { margin-right: 4px; vertical-align: 1px; }
.pe-pun-st { margin-top: 8px; }
/* Awards tab: take one award off (admins and owners) */
.pe-award-rm { flex: none; min-width: 28px; height: 28px; padding: 0 6px; border-radius: var(--r-sm); border: 1px solid transparent; background: none; color: var(--muted); font: inherit; font-size: .85rem; cursor: pointer; }
.pe-award-rm:hover, .pe-award-rm:focus-visible { color: var(--bad); border-color: var(--bad-line); }
.pe-award-rm.armed { color: var(--bad); border-color: var(--bad-line); background: var(--bad-wash); font-weight: 600; }