/* ===== audit ===== (owner: 12-audit.js — see docs/UI-SEAM.md)
   Audit / replay / archive / presence UI. Stays inside the existing
   t-classic language: no new custom properties, no new fonts, no new
   accent colours. Rhythm matches the 23px compact row height used
   elsewhere via var(--rowh) where a literal is unavoidable (dialog
   chrome is not the app grid, so an 23px-consistent row height is set
   directly rather than inherited from .app.t-classic, which only
   applies inside .app). */

.audit-dlg .content { padding: 0; }

/* ---- filter bar ------------------------------------------------------- */
.audit-filters {
  display: flex; flex-wrap: wrap; align-items: end; gap: 10px 14px;
  padding: 10px 14px; border-bottom: 1px solid #dcdfe4; background: #f6f7f8;
}
.audit-filters label {
  display: flex; flex-direction: column; gap: 3px; font-size: 10px;
  letter-spacing: .08em; text-transform: uppercase; color: #5a6570; min-width: 0;
}
.audit-filters select, .audit-filters input {
  font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid #b9c4d0;
  background: #fff; max-width: 190px;
}
.audit-fillspace { flex: 1 1 auto; }

/* ---- entry list -------------------------------------------------------- */
.audit-body { display: flex; flex-direction: column; min-height: 0; }
.audit-list { padding: 10px 14px; overflow: auto; max-height: 52vh; }
.audit-empty { color: #6b7280; font-style: italic; padding: 14px 4px; text-align: center; }
.audit-empty.audit-err { color: #8e211d; font-style: normal; }

.audit-entry {
  border: 1px solid #dcdfe4; border-radius: 2px; margin-bottom: 8px; background: #fff;
}
.audit-entry-head {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  padding: 6px 10px; background: #eef3f8; border-bottom: 1px solid #dcdfe4;
  font-size: 11.5px;
}
.audit-when { font-family: 'IBM Plex Mono', monospace; color: #26333f; white-space: nowrap; }
.audit-who { font-weight: 600; color: #14395c; overflow: hidden; text-overflow: ellipsis; max-width: 220px; white-space: nowrap; }
.audit-label { color: #3b4652; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1 1 auto; }
.audit-rev { margin-left: auto; color: #6b7280; font-family: 'IBM Plex Mono', monospace; white-space: nowrap; }

.audit-ops { list-style: none; margin: 0; padding: 6px 10px; display: flex; flex-direction: column; gap: 3px; }
.audit-ops li {
  font-size: 12px; color: #1a1a1a; line-height: 1.5; overflow-wrap: anywhere;
  padding-left: 12px; position: relative;
}
.audit-ops li::before { content: '\2013'; position: absolute; left: 0; color: #9fb0c2; }
.audit-more { padding: 2px 10px 8px; font-size: 11px; color: #6b7280; font-style: italic; }

/* ---- peer list (presence) --------------------------------------------- */
.audit-peers-slot { border-top: 1px solid #dcdfe4; }
.audit-peers {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 14px; background: #f6f7f8; min-height: 23px;
}
.audit-peers-title {
  font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #5a6570;
  flex: 0 0 auto;
}
.audit-peers-none { color: #6b7280; font-style: italic; font-size: 11.5px; }
.audit-peer-chip {
  display: inline-flex; align-items: center; background: #e6f0fa; border: 1px solid #7fa6cc;
  color: #14395c; border-radius: 9px; padding: 2px 9px; font-size: 11px; font-weight: 600;
  max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ---- as-of replay ------------------------------------------------------ */
.audit-asof-pick {
  display: flex; align-items: end; gap: 12px; flex-wrap: wrap; padding: 14px;
  border-bottom: 1px solid #dcdfe4; background: #f6f7f8;
}
.audit-asof-pick label {
  display: flex; flex-direction: column; gap: 3px; font-size: 10px;
  letter-spacing: .08em; text-transform: uppercase; color: #5a6570;
}
.audit-asof-pick input {
  font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid #b9c4d0; background: #fff;
  max-width: 160px;
}
.audit-or { color: #6b7280; font-style: italic; font-size: 11.5px; align-self: center; padding-bottom: 6px; }
.audit-asof-result { padding: 14px; overflow: auto; max-height: 56vh; }

.audit-asof-meta {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 10px;
  font-size: 12px; color: #3b4652;
}
.audit-asof-meta b { font-family: 'IBM Plex Mono', monospace; color: #14395c; }
.audit-asof-summary { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.audit-asof-summary .chip {
  background: #eef3f8; border: 1px solid #b9c4d0; border-radius: 2px; padding: 3px 10px; font-size: 12px;
}
.audit-asof-summary .chip b { font-family: 'IBM Plex Mono', monospace; color: #14395c; margin-left: 4px; }
.audit-addrem { font-size: 12px; color: #3b4652; margin-bottom: 4px; overflow-wrap: anywhere; }
.audit-addrem b { color: #14395c; margin-right: 6px; }
.audit-h4 {
  font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: #5a6570;
  margin: 14px 0 6px;
}

table.audit-movers, table.audit-archives {
  width: 100%; border-collapse: collapse; font-size: 12px;
}
table.audit-movers th, table.audit-archives th {
  text-align: left; padding: 5px 8px; border-bottom: 1px solid #dcdfe4;
  font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: #5a6570;
  white-space: nowrap; background: #eef3f8;
}
table.audit-movers td, table.audit-archives td {
  padding: 5px 8px; border-bottom: 1px solid #e6e9ee; vertical-align: middle;
  overflow-wrap: anywhere;
}
table.audit-movers td:first-child { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audit-late { color: #8e211d; font-weight: 600; }
.audit-early { color: #14395c; font-weight: 600; }

/* ---- transmittal register --------------------------------------------- */
.audit-fname { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audit-sha { font-family: 'IBM Plex Mono', monospace; font-size: 11px; color: #5a6570; white-space: nowrap; }
tr.audit-stale-row td { background: #fff7e6; }
.audit-warn-badge {
  display: inline-block; margin-left: 6px; background: #ffe1c2; color: #7a4d00;
  border: 1px solid #d99a3f; border-radius: 9px; padding: 1px 7px; font-size: 10px;
  font-weight: 700; white-space: nowrap;
}

/* ---- responsive guard: dialog max-width already clamps to 94vw via .dlg;
   keep long identifiers (sha256, filenames, user emails) from forcing
   horizontal scroll or overflowing their cell. */
.audit-dlg, .dlg.audit-dlg { max-width: min(920px, 94vw); }
.audit-who, .audit-fname, .audit-peer-chip { min-width: 0; }

/* ---- people admin (owner: 13-people-admin.js) -------------------------
   Added with the magic-link auth swap (docs/AUTH.md). Deliberately reuses
   this file's tokens/typography rather than introducing a new stylesheet
   or font — same border/background/text colours as the audit tables and
   filter bar above. */
.people-admin { display: flex; flex-direction: column; gap: 12px; }
.people-invite {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding: 10px 12px; border: 1px solid #dcdfe4; background: #f6f7f8;
}
.people-invite input, .people-invite select {
  font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid #b9c4d0; background: #fff;
}
.people-invite input[type="email"] { min-width: 220px; }
.people-invite input[type="text"] { min-width: 160px; }

table.people-table { width: 100%; border-collapse: collapse; font-size: 12px; }
table.people-table th {
  text-align: left; padding: 5px 8px; border-bottom: 1px solid #dcdfe4;
  font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: #5a6570;
  white-space: nowrap; background: #eef3f8;
}
table.people-table td { padding: 5px 8px; border-bottom: 1px solid #e6e9ee; vertical-align: middle; }
table.people-table td:first-child { overflow-wrap: anywhere; max-width: 220px; }
.people-role { font: inherit; font-size: 12px; padding: 3px 5px; border: 1px solid #b9c4d0; background: #fff; }
.people-enabled { color: #14634a; font-weight: 600; }
.people-disabled { color: #8e211d; font-weight: 600; }
.people-actions .btn.small { font-size: 11px; padding: 3px 7px; }
