
.accounts-page{padding:24px}
.accounts-page .page-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:22px}
.accounts-page .eyebrow{font-size:.72rem;letter-spacing:.14em;font-weight:800;color:#718096}
.accounts-page .card{background:#fff;border:1px solid #e5eaf2;border-radius:18px;padding:22px;box-shadow:0 8px 28px rgba(31,48,79,.06)}
.table-responsive{overflow:auto}
.data-table{width:100%;border-collapse:collapse}
.data-table th,.data-table td{padding:14px 12px;border-bottom:1px solid #edf1f6;text-align:left;white-space:nowrap}
.inline-form{display:inline}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.form-grid label span,.roles-fieldset legend{display:block;font-weight:750;margin-bottom:7px}
.form-grid input{width:100%;padding:13px 14px;border:1px solid #dce3ee;border-radius:12px}
.form-grid .wide{grid-column:1/-1}
.roles-fieldset{border:1px solid #e1e7f0;border-radius:14px;padding:16px}
.role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.role-card{display:flex!important;gap:10px;align-items:center;border:1px solid #e3e8f0;border-radius:12px;padding:13px}
.role-card input{width:auto}
.role-card small{display:block;color:#718096;margin-top:3px}
.badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:.8rem;font-weight:700}
.badge-success{background:#e8f8ef;color:#167442}
.badge-muted{background:#edf1f6;color:#64748b}
@media(max-width:760px){
 .accounts-page{padding:14px}
 .accounts-page .page-head{flex-direction:column}
 .form-grid,.role-grid{grid-template-columns:1fr}
 .data-table thead{display:none}
 .data-table,.data-table tbody,.data-table tr,.data-table td{display:block;width:100%}
 .data-table tr{padding:12px 0;border-bottom:1px solid #e8edf4}
 .data-table td{border:0;padding:7px 0;white-space:normal}
}
