/* Access control — the page's own layout: the rights grid inside an open area, the matrix mark, and the column and
   group washes of its two tables (decisions by shift, rights by level). Everything else is kit. */
@layer page {
  /* The level editor head: the name and description keep a readable width; Copy / Remove wrap under them on phones. */
  .ac-edhead > :first-child { flex: 1 1 280px; }
  .ac-edhead > #ed-actions { flex: none; }

  /* Rights of an open area: two columns of checks. */
  .ac-perms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s5); padding: 0 0 var(--s2) var(--s1); }
  @media (max-width: 900px) { .ac-perms { grid-template-columns: minmax(0, 1fr); } }

  /* Decisions by shift: the columns on duty now, and the between-shift columns where only day support decides. */
  .ac-dec tbody th[scope="row"] { min-width: 220px; }
  .ac-hrs { display: block; font-weight: 400; color: var(--text-3); font-variant-numeric: tabular-nums; }
  .ac-dec td[data-gapcol] { background: var(--sheet-2); }

  /* Rights by level: the mark is a filled or empty square. */
  /* The area rows' per-level counts sit centred under their level columns, like the marks. */
  #mx-results tr.table__group > td { text-align: center; }
  .ac-mx tbody th[scope="row"] { min-width: 260px; }
  .ac-sq { display: inline-block; width: 14px; height: 14px; border-radius: 3px; box-shadow: inset 0 0 0 1px var(--line-2); vertical-align: middle; }
  .ac-sq[data-on] { background: var(--accent); box-shadow: none; }
  @media (forced-colors: active) { .ac-sq { forced-color-adjust: none; outline: 1px solid CanvasText; } .ac-sq[data-on] { background: CanvasText; } }
}