.access-content{max-width:1180px}.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0}.access-panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:21px;margin-bottom:18px}.access-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}.access-heading h2{font:500 19px Georgia,serif;margin:0;color:#233b31}.access-heading p{font-size:10px;color:var(--muted);margin:6px 0 0;line-height:1.5}.access-form{display:grid;grid-template-columns:1fr auto;gap:9px;align-items:end}.access-form label,.admin-load-form label{grid-column:1/-1;font-size:10px;font-weight:700;color:#58685f}.access-form input,.admin-load-form input{height:39px;border:1px solid #dfe5e0;border-radius:8px;padding:0 10px;font:11px system-ui,sans-serif;min-width:0}.access-form .primary-button,.admin-load-form button{height:39px;white-space:nowrap}.admin-load-form{display:grid;grid-template-columns:minmax(180px,1fr) auto;gap:9px;align-items:end;max-width:560px}.admin-load-form label{grid-column:1/-1}.access-message{min-height:15px;font-size:10px;line-height:1.5;color:#52775e;margin:12px 0 0}.access-message.error{color:#a34f42}.membership-list,.request-list{display:grid;gap:10px}.membership-item,.request-card{border:1px solid #e8ece8;border-radius:9px;padding:13px}.membership-item strong,.request-card strong{font-size:11px;color:#31463b}.membership-item p,.request-card p{font-size:10px;color:#7c8981;margin:5px 0}.role-chips{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}.role-chip{font-size:8px;padding:4px 7px;border-radius:20px;background:#eef3ef;color:#4f6d59}.request-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:13px}.request-actions button{border-radius:7px;padding:8px 12px;font-size:9px;font-weight:700;cursor:pointer}.approve-request{background:#173b35;color:white;border:0}.reject-request{background:#fff;color:#a34f42;border:1px solid #ead6d2}.role-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.role-picker label{display:flex;gap:7px;align-items:center;font-size:9px;color:#58685f}.role-picker input{accent-color:#315c47}.empty-state{font-size:10px;color:#87938b;padding:8px 0}.access-footnote{font-size:9px;line-height:1.6;color:#89958d;margin:4px 0 22px}@media(max-width:760px){.access-grid{grid-template-columns:1fr}.access-form{grid-template-columns:1fr}.access-form label{grid-column:auto}.admin-load-form{grid-template-columns:1fr}.admin-load-form label{grid-column:auto}.role-picker{grid-template-columns:1fr 1fr}.access-panel{padding:16px}}

@media(max-width:760px){
 .access-panel{padding:16px}
 .access-heading h2{font-size:22px}
 .access-heading p,.access-message,.membership-item p,.request-card p,.access-footnote,.empty-state{font-size:14px;line-height:1.5}
 .access-form label,.admin-load-form label,.membership-item strong,.request-card strong{font-size:15px}
 .access-form input,.admin-load-form input{height:46px;font-size:16px}
 .access-form button,.admin-load-form button,.request-actions button{min-height:44px;font-size:14px}
 .role-chip,.role-picker label{font-size:13px}
 .role-picker{grid-template-columns:1fr}
 .role-picker input{width:18px;height:18px}
 .request-actions{flex-wrap:wrap}
}

/* Readable church selection and prominent church roles */
.access-form select,.admin-load-form select{height:46px;border:1px solid #d3dfd7;border-radius:8px;padding:0 12px;background:#fff;color:#243d31;font:500 15px system-ui,sans-serif;min-width:0;width:100%}
.membership-item{padding:19px;border-radius:12px;background:#fbfdfb;border-color:#d7e3db}
.membership-item strong{font-size:18px;line-height:1.4;display:block}
.membership-item p{font-size:13px;line-height:1.5;margin:8px 0}
.role-chips{gap:9px;margin-top:12px}
.role-chip{font-size:13px;font-weight:650;padding:7px 11px;border-radius:8px;background:#e1efe5;color:#205338;border:1px solid #c8dfd0}
.role-label{display:block;font-size:12px;font-weight:700;letter-spacing:.03em;color:#536b5d;margin-top:13px}
@media(max-width:760px){.access-form select,.admin-load-form select{height:48px;font-size:16px}.membership-item strong{font-size:18px}.membership-item p,.role-chip{font-size:14px}}

.role-form{display:grid;gap:12px;margin-bottom:20px;max-width:850px}
.role-form>label{font-size:14px;font-weight:700;color:#344c3e}
.role-form input:not([type=checkbox]),.role-form select,.role-form textarea{width:100%;min-height:46px;border:1px solid #ccdcd1;border-radius:9px;padding:10px 12px;font:16px system-ui,sans-serif}
.role-form fieldset{border:1px solid #dce8df;border-radius:12px;padding:14px}
.role-form legend{font-weight:700;font-size:14px;padding:0 6px}
.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.permission-grid label{font-size:14px;display:flex;align-items:center;gap:9px;min-height:40px}
.permission-grid input{width:19px;height:19px;accent-color:#315c47}
.role-form .request-actions{justify-content:flex-start}
@media(max-width:680px){.permission-grid{grid-template-columns:1fr}.role-form .request-actions{flex-wrap:wrap}.role-form button{min-height:46px;font-size:15px}}

/* Role manager mobile-first layout and accessibility */
#role-manager[hidden]{display:none!important}
#role-manager{min-width:0}
#role-manager .access-heading{margin-bottom:20px}
#role-manager .access-heading h2{font-size:clamp(23px,4vw,30px);line-height:1.2}
#role-manager .access-heading p{font-size:14px;line-height:1.55}
.role-form{width:100%;max-width:100%;min-width:0;gap:10px}
.role-form>label{font-size:15px;margin-top:7px}
.role-form input:not([type=checkbox]),.role-form select,.role-form textarea{box-sizing:border-box;max-width:100%;min-width:0;min-height:50px;font-size:16px;border-radius:12px}
.role-form textarea{resize:vertical;min-height:90px}
.role-form fieldset{min-width:0;padding:18px;border-radius:14px}
.role-form legend{font-size:16px}
.permission-help{font-size:13px;line-height:1.5;color:#617367;margin:0 0 12px}
.permission-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.permission-grid label{display:flex;align-items:center;gap:12px;min-width:0;padding:12px;border:1px solid #dbe8df;background:#f9fcfa;border-radius:11px;font-size:15px;line-height:1.4;cursor:pointer}
.permission-grid input{flex-shrink:0;width:22px;height:22px}
#role-manager .membership-item{min-width:0;overflow-wrap:anywhere}
#role-manager .membership-item p{overflow-wrap:anywhere}
#role-manager .request-actions button{min-height:46px;font-size:15px;padding:12px 16px}
@media(max-width:760px){
 #role-manager{padding:20px 16px}
 #role-manager .access-heading{margin-bottom:18px}
 .role-form{gap:9px}
 .role-form fieldset{padding:14px 12px}
 .permission-grid{grid-template-columns:1fr;gap:9px}
 .permission-grid label{min-height:52px;padding:12px;font-size:15px}
 #role-manager .request-actions{display:grid;grid-template-columns:1fr;gap:10px}
 #role-manager .request-actions button{width:100%;min-height:50px;font-size:16px}
 #role-manager .membership-item .request-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}

#people-roles[hidden]{display:none!important}
.people-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:12px;align-items:end;margin-bottom:16px}
.people-toolbar label{display:grid;gap:8px;font-size:15px;font-weight:650}
.people-toolbar input,.people-toolbar select{width:100%;min-width:0;box-sizing:border-box;min-height:48px;border:1px solid #d3dfd7;border-radius:10px;padding:10px;font:16px system-ui}
.people-toolbar button{min-height:48px;font-size:15px}
.people-role-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.people-role-options label{display:flex;align-items:center;gap:10px;font-size:14px;min-height:44px;padding:10px;background:#f7faf8;border:1px solid #e0e9e3;border-radius:10px}
.people-role-options input{width:20px;height:20px;flex-shrink:0;accent-color:#315c47}
.people-role-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
.people-role-footer span{font-size:13px;color:#67766d}
.people-role-footer button{min-height:46px;padding:10px 18px;font-size:15px}
.people-role-footer button:disabled{opacity:.55}
@media(max-width:760px){.people-toolbar{grid-template-columns:1fr}.people-role-options{grid-template-columns:1fr}.people-role-footer{flex-direction:column;align-items:stretch}.people-role-footer button{width:100%}.people-role-options label{min-height:50px;font-size:15px}}

.permission-matrix{display:grid;gap:8px;width:100%}
.permission-matrix-head,.permission-matrix-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(90px,1fr) minmax(110px,1fr);align-items:center;gap:12px;padding:10px 12px}
.permission-matrix-head{border-bottom:2px solid #d9e5dd;font-size:14px}
.permission-matrix-row{background:#f7faf8;border:1px solid #e0e9e3;border-radius:10px}
.permission-matrix-cell{display:flex;align-items:center;gap:9px;min-height:42px;cursor:pointer}
.permission-matrix-cell input{width:20px;height:20px;accent-color:#315c47}
.permission-matrix-cell span{font-size:13px}
@media(max-width:600px){.permission-matrix-head{display:none}.permission-matrix-row{grid-template-columns:1fr 1fr;gap:4px 12px}.permission-matrix-row>strong{grid-column:1/-1}.permission-matrix-cell{min-height:48px}.permission-matrix-cell span{font-size:15px}}

/* Role manager: consistent responsive controls and readable permission matrix */
#role-manager{max-width:1100px}
#role-manager .access-heading p{font-size:14px;line-height:1.5}
#role-form.role-form{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px 20px!important;align-items:stretch!important}
#role-form>label{display:block!important;font-size:14px!important;font-weight:650;color:#334a3d}
#role-form>input,#role-form>select,#role-form>textarea{display:block!important;width:100%!important;min-width:0!important;box-sizing:border-box!important;min-height:44px!important;border:1px solid #ccd9cf;border-radius:9px;padding:10px 12px;font-size:15px!important;background:#fff}
#role-form>label[for="role-church"],#role-form>#role-church,#role-form>label[for="role-selection"],#role-form>#role-selection,#role-form>label[for="role-name"],#role-form>#role-name,#role-form>label[for="role-description"],#role-form>#role-description{grid-column:1/-1}
#role-form fieldset{grid-column:1/-1;min-width:0;border:1px solid #dce5dd;border-radius:12px;padding:16px;margin:8px 0}
#role-form fieldset legend{font-weight:700;font-size:17px;padding:0 8px}
#role-form .permission-help{font-size:14px;line-height:1.5}
#role-form .request-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:flex-end}
#role-form .request-actions button{min-height:44px;font-size:14px;padding:10px 18px}
.role-protected-note{grid-column:1/-1;font-size:14px;background:#f2f5f1;border-radius:9px;padding:12px}
.permission-matrix-head,.permission-matrix-row{font-size:14px}
.permission-matrix-head strong,.permission-matrix-row strong{font-size:14px}
@media(min-width:800px){#role-form>label[for="role-church"],#role-form>#role-church,#role-form>label[for="role-selection"],#role-form>#role-selection{grid-column:1/-1}}
@media(max-width:600px){#role-form.role-form{grid-template-columns:1fr!important}#role-form fieldset{padding:10px}.permission-matrix-row{grid-template-columns:1fr 1fr}.permission-matrix-row>strong{grid-column:1/-1}}
