.access-root { display: grid; gap: 22px; }
.access-root .access-grid { grid-template-columns: minmax(0, 1.5fr) minmax(260px, .85fr); margin: 0; align-items: start; }
.access-root .access-grid > .panel + .panel { margin-top: 0; }
.access-session { padding: 23px 26px; display: flex; align-items: center; gap: 18px; }
.access-session-icon { width: 48px; height: 48px; border-radius: 13px; background: #eee8f6; color: var(--purple, #7158a2); display: grid; place-items: center; flex-shrink: 0; }
.access-session .eyebrow { margin-bottom: 5px; }
.access-session h3 { font-size: 17px; margin: 0 0 4px; }
.access-session p { margin: 0; font-size: 12px; color: #84778e; overflow-wrap: anywhere; }
.access-session > .badge { margin-left: auto; white-space: nowrap; }
.access-sharing-note { margin: 0; align-items: flex-start; }
.access-sharing-note p { margin: 5px 0 0; line-height: 1.7; font-size: 12px; }
.access-root .panel-head { align-items: center; gap: 18px; }
.access-root .panel-head h3 { margin-bottom: 4px; }
.access-root .panel-head p { margin: 0; font-size: 11px; line-height: 1.6; color: #897b93; }
.access-members-panel { min-width: 0; }
.access-members-panel table { min-width: 580px; }
.access-members-panel .panel-head { flex-wrap: wrap; }
.access-person { display: flex; align-items: center; gap: 10px; min-width: 180px; }
.access-person .avatar { width: 32px; height: 32px; font-size: 11px; background: #ede6f4; color: #8b70a8; flex-shrink: 0; }
.access-person strong { font-size: 12px; overflow-wrap: anywhere; }
.access-person small { display: block; margin-top: 3px; color: #95869f; font-size: 10px; }
.access-scope { max-width: 250px; display: inline-block; font-size: 11px; line-height: 1.6; color: #807089; }
.access-table-action { text-align: right; }
.access-you { color: #9a88a7; font-size: 10px; }
.access-remove { color: #a86d73 !important; }
.access-members-panel .panel-foot { gap: 15px; flex-wrap: wrap; }
.access-roles-panel .panel-body { padding-top: 3px; }
.access-role-list { display: grid; gap: 17px; }
.access-role-item { display: flex; align-items: flex-start; gap: 11px; }
.access-role-item strong { display: block; font-size: 12px; color: #5d4a6b; }
.access-role-item p { margin: 4px 0 0; font-size: 11px; line-height: 1.7; color: #8b7b96; }
.access-role-dot { width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: #a994bc; flex-shrink: 0; }
.access-role-dot.coordinator { background: #9374b8; }
.access-role-dot.coach { background: #d5a27f; }
.access-role-dot.vendor { background: #8eaaa0; }
.access-role-dot.family { background: #c78da6; }
.access-role-dot.door { background: #a9b491; }
.access-invitations-panel .panel-body { padding-top: 0; padding-bottom: 4px; }
.access-invite-row { display: flex; align-items: center; gap: 13px; padding: 18px 0; border-bottom: 1px solid var(--line, #eeedf2); }
.access-invite-row:last-child { border-bottom: 0; }
.access-invite-icon { width: 34px; height: 34px; border-radius: 10px; background: #f3edf8; color: #a18ab7; display: grid; place-items: center; flex-shrink: 0; }
.access-invite-copy { flex: 1; min-width: 0; }
.access-invite-copy strong { display: block; font-size: 12px; overflow-wrap: anywhere; }
.access-invite-copy small { display: block; margin-top: 4px; font-size: 11px; color: #8b7b96; line-height: 1.6; }
.access-invite-meta { text-align: right; flex-shrink: 0; }
.access-invite-meta small { display: block; margin-top: 5px; color: #9a8ba3; font-size: 10px; }
.access-empty { display: flex; gap: 17px; align-items: flex-start; padding: 19px 0 23px; }
.access-empty > span { color: #a38bb8; background: #f5f0f9; padding: 12px; border-radius: 12px; }
.access-empty strong { display: block; margin-top: 1px; font-size: 13px; }
.access-empty p { margin: 5px 0 0; color: #8d7c98; font-size: 12px; line-height: 1.7; }
.access-loading { color: #8e7a9c; font-size: 12px; padding: 30px 25px; }
.access-error { margin: 0 23px 17px; padding: 12px 14px; background: #fff1ec; border: 1px solid #f2d9d0; color: #a16c61; border-radius: 8px; font-size: 12px; line-height: 1.7; }
.access-error .text-btn { margin-left: 8px; }
.access-role-help { margin: 13px 0 18px; color: #917d9e; font-size: 12px; line-height: 1.7; }
[data-access-invite-fields] [hidden] { display: none !important; }
.access-invite-success { display: flex; gap: 14px; align-items: center; margin-bottom: 23px; padding: 16px; border-radius: 11px; background: #eff5f0; color: #5f8d72; }
.access-invite-success > svg { flex-shrink: 0; }
.access-invite-success strong { font-size: 13px; overflow-wrap: anywhere; }
.access-invite-success p { margin: 5px 0 0; font-size: 11px; color: #7d9986; }
#access-invite-link { font-size: 11px; color: #786085; }
.access-small { font-size: 12px; line-height: 1.8; }
@media (max-width: 1180px) { .access-root .access-grid { grid-template-columns: 1fr; } .access-role-list { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); } }
@media (max-width: 640px) {
  .access-root { gap: 17px; }
  .access-session { padding: 20px; gap: 12px; flex-wrap: wrap; }
  .access-session-icon { width: 40px; height: 40px; }
  .access-session h3 { font-size: 15px; }
  .access-session > .badge { margin: 0 0 0 52px; }
  .access-invite-row { gap: 10px; flex-wrap: wrap; }
  .access-invite-meta { margin-left: 47px; text-align: left; display: flex; gap: 12px; align-items: center; }
  .access-invite-meta small { margin-top: 0; }
  .access-sharing-note p { font-size: 11px; }
  .access-members-panel .panel-foot { align-items: flex-start; }
  .access-role-list { grid-template-columns: 1fr; }
}