/* ═══════════════════════════════════════════════════════════════════════════
   FINEFIGHT — ADMIN role styling (register: compact operations console)
   The ONLY surface family with a persistent desktop sidebar (Master §70).
   Sidebar groups are WORK DOMAINS, never database tables.
   Mobile adapts contextually — it must not merely shrink the desktop table.
   ═══════════════════════════════════════════════════════════════════════════ */
[data-density="admin"] .tbl thead th { padding: 7px 11px; font-size: var(--t-2xs); }
[data-density="admin"] .tbl tbody td { padding: 7px 11px; }
[data-density="admin"] .tbl-compact tbody td { padding: 5px 10px; }
[data-density="admin"] .card-head { padding: 9px 12px; }
[data-density="admin"] .card-head h3 { font-size: var(--t-md); }
[data-density="admin"] .page-head { padding: 14px 0 12px; border-bottom-color: var(--line); }
[data-density="admin"] .stat-tile { padding: 10px 12px; }
[data-density="admin"] .stat-tile .val { font-size: var(--t-lg); }
[data-density="admin"] .stat-tile .label { font-size: 9.5px; }
[data-density="admin"] .queue-item { padding: 9px 12px; }
[data-density="admin"] .listrow { padding: 8px 12px; }
[data-density="admin"] .kv-row { padding: 5px 0; font-size: var(--t-sm); }
[data-density="admin"] .def-list { grid-template-columns: 132px minmax(0,1fr); font-size: var(--t-sm); }
[data-density="admin"] .def-list dt, [data-density="admin"] .def-list dd { padding: 6px 0; }
/* Admin is the one family whose desktop shell is a two-column layout. */
.admin-body > .container { max-width: none; padding-left: 0; padding-right: 0; }
.admin .container { max-width: none; }
@container (min-width: 768px) {
  .admin-side { position: sticky; top: 0; }
}
@container (max-width: 767px) {
  .admin { display: block; }
  .admin-side { position: fixed; inset: 0 auto 0 0; z-index: 480; transform: translateX(-100%); }
  [data-density="admin"] .admin-top { height: 50px; padding: 0 12px; }
}

/* ── Admin: consequence map, audit strip, review readings ─────────────── */
.consequence-map {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(228px, 1fr)); gap: 12px;
}
.consequence-cell {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 11px 12px; border-radius: var(--r-sm);
  border: 1px solid var(--line-soft); background: var(--s0);
}
.audit-strip {
  margin-top: 24px; padding: 13px 14px; border-radius: var(--r-sm);
  border: 1px solid var(--line-soft); background: var(--s1);
}
.review-reading {
  padding: 13px 14px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--s0);
}
.review-reading p { line-height: 1.7; }
@container (max-width: 767px) {
  .consequence-map { grid-template-columns: minmax(0, 1fr); }
  [data-density="admin"] .admin-body { padding-left: 14px; padding-right: 14px; }
}

/* ── Admin index header ────────────────────────────────────────────────
   The action row must be able to wrap under the title rather than forcing a
   minimum content width that pushes the page sideways at 390. */
.admin-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; min-width: 0;
}
.admin-head-actions {
  display: flex; gap: 8px; flex-wrap: wrap; min-width: 0;
}
.admin-head-actions .input-icon, .admin-head-actions .input { min-width: 0; }
@container (max-width: 640px) {
  .admin-head { flex-direction: column; align-items: stretch; }
  .admin-head-actions > * { flex: 1 1 auto; min-width: 0; }
  .admin-head-actions > div { min-width: 0 !important; }
}
/* A wide admin table scrolls inside its own wrapper. The page itself must
   never gain a horizontal scrollbar because of a table. */
.tbl-wrap { max-width: 100%; min-width: 0; }
.admin-main { min-width: 0; overflow-x: clip; }