/* Members & staff (TTR-005): uses the admin.css variables */
body.narrow { max-width: 560px; margin: 0 auto; }
#msg.ok { color: var(--ok); } #msg.bad, .bad { color: var(--bad); }
.who { color: var(--ink2); margin: 6px 0 10px; }
.chip { display: inline-block; padding: 1px 8px; border-radius: 10px; border: 1px solid var(--line2); font-size: 12px; }
.chip.trial { border-color: var(--accent); color: #9ec1ff; } .chip.member { border-color: var(--ok); color: var(--ok); }
.chip.expired { border-color: var(--warn); color: var(--warn); } .chip.blocked { border-color: var(--bad); color: var(--bad); }
.chip.staff { border-color: var(--line2); color: var(--ink2); }

/* TTR-009: the email-code sign-in and invitation steps, and the links between Admin and the room */
.stack { display: grid; gap: 8px; max-width: 360px; }
.stack input { margin: 0; }
.stack label { color: var(--ink2); }
.note { border-left: 3px solid var(--accent); padding: 6px 10px; background: var(--panel2); }
.row-links { display: flex; gap: 14px; flex-wrap: wrap; margin: 4px 0 0; }
button.linkish { background: none; border: 0; padding: 0; color: var(--accent); text-decoration: underline; cursor: pointer; font: inherit; }
button.linkish:disabled { color: var(--ink2); text-decoration: none; cursor: default; }
.aside { margin-top: 28px; border-top: 1px solid var(--line); padding-top: 10px; }
.staff-nav { margin-left: auto; display: inline-flex; gap: 10px; align-items: center; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.filters { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.filters input, .filters select { width: auto; margin: 0; }
tr.sel { background: var(--panel2); }
.detail { display: grid; gap: 8px; }
.detail form { display: grid; gap: 4px; border-top: 1px solid var(--line); padding-top: 8px; }
.detail label { color: var(--ink2); }
.grants label { display: inline-flex; gap: 4px; margin-right: 10px; }
.grants input { width: auto; margin: 0; }

/* TTR-006: forms that don't apply under the room's access policy */
.na { display: none !important; }

/* TTR-007 audit R7: the wider members table and the correction forms stay inside a phone screen */
.grid > * { min-width: 0; }
.table-wrap { overflow-x: auto; max-width: 100%; }
.detail form label { display: grid; gap: 2px; }
.detail form input { max-width: 100%; box-sizing: border-box; }
.form-title { margin: 0; color: var(--ink2); }
#mInfo { overflow-wrap: anywhere; }
@media (max-width: 420px) { .grid { grid-template-columns: minmax(0, 1fr); } }