.staff-sheet{display:grid;gap:20px}.staff-sheet-head{display:flex;align-items:center;gap:16px;padding:20px;border-radius:20px;background:linear-gradient(135deg,#f3f7ff,#f8fafc)}.staff-avatar{width:72px;height:72px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#dce8ff;color:#2052a3;font-size:1.35rem;font-weight:800}.staff-sheet-head h2{margin:3px 0}.staff-sheet-head p{margin:0;color:#667085}.staff-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.staff-form-grid label,.staff-functions label{display:grid;gap:7px}.staff-form-grid label>span{font-size:.8rem;font-weight:750;color:#596273}.staff-form-grid input,.staff-form-grid select{width:100%;padding:12px 13px;border:1px solid #d4d9e2;border-radius:11px;background:#fff;font:inherit}.staff-code-hint{color:#667085;font-size:.72rem;line-height:1.4}.staff-form-grid .field-wide{grid-column:1/-1}.staff-toggle{display:flex!important;grid-column:1/-1;grid-template-columns:none!important;align-items:center;justify-content:space-between;padding:14px;border:1px solid #e2e6ec;border-radius:13px}.staff-toggle input{width:20px;height:20px}.staff-functions{display:grid;gap:9px;padding:18px;border-radius:16px;background:#f6f7f9}.staff-functions h3{margin:0 0 5px}.staff-function{display:flex!important;grid-template-columns:none!important;align-items:center;justify-content:space-between;padding:11px 12px;border-radius:10px;background:#fff}.staff-function input{width:19px;height:19px}.staff-save-row{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding-top:8px}.staff-save-row .staff-status{margin-right:auto;color:#667085}.staff-table-person{display:grid;gap:3px}.staff-table-person strong{font-size:.93rem}.staff-table-person small{color:#667085}.staff-email{color:#245fae;text-decoration:none}.staff-email:hover{text-decoration:underline}
.staff-photo-editor,.staff-account-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px;border:1px solid #e3e8ef;border-radius:16px;background:#fff}.staff-photo-editor h3,.staff-account-actions h3{margin:0 0 5px}.staff-photo-editor p,.staff-account-actions p{margin:0;color:#667085}.staff-photo-preview{position:relative;width:104px;height:104px;display:grid;place-items:center;flex:0 0 auto;overflow:hidden;border-radius:50%;background:#e8effc;color:#245ca9;font-size:1.35rem;font-weight:800}.staff-photo-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.staff-photo-actions,.staff-account-actions>div:last-child{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:13px}.danger-button{border:1px solid #f1b8b8;border-radius:10px;padding:10px 14px;background:#fff1f1;color:#b42318;font:inherit;font-weight:750;cursor:pointer}.danger-button:hover{background:#ffe6e6}.staff-photo-actions button:disabled{opacity:.45;cursor:not-allowed}
.user-role-filter{display:flex;align-items:center;gap:8px;white-space:nowrap;color:#667085;font-size:.8rem;font-weight:700}.user-role-filter select{min-width:180px;padding:10px 34px 10px 12px;border:1px solid #d5dae3;border-radius:11px;background:#fff;color:#263244;font:inherit}
.staff-signature{display:grid;gap:18px;padding:20px;border:1px solid #dfe6f0;border-radius:20px;background:linear-gradient(145deg,#f7faff,#fff);box-shadow:0 10px 28px rgba(32,58,92,.06)}.staff-signature-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px}.staff-signature-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#e6efff;color:#245fae;font-size:1.6rem;font-weight:800}.staff-signature h3,.staff-signature p{margin:0}.staff-signature-head h3{margin:2px 0 3px;font-size:1.12rem}.staff-signature-head p{color:#667085;font-size:.82rem}.staff-signature-role{padding:6px 10px;border:1px solid #cfe0fb;border-radius:999px;background:#edf4ff;color:#245fae;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.035em}.staff-signature-grid{display:grid;grid-template-columns:minmax(360px,1.25fr) minmax(280px,.75fr);gap:16px}.staff-signature-panel{display:grid;align-content:start;gap:13px;padding:15px;border:1px solid #e3e8f0;border-radius:16px;background:#fff}.staff-signature-panel>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.staff-signature-panel>header div{display:grid;gap:3px}.staff-signature-panel>header strong{color:#253044;font-size:.9rem}.staff-signature-panel>header small{color:#7a8494;line-height:1.35}.staff-signature-canvas{position:relative;overflow:hidden;border:1px solid #d8dee8;border-radius:12px;background:#fff;box-shadow:inset 0 1px 3px rgba(16,24,40,.04)}.staff-signature-canvas canvas{position:relative;z-index:1;display:block;width:100%;height:170px;touch-action:none;background:transparent}.staff-signature-baseline{position:absolute;z-index:0;left:9%;right:9%;bottom:35px;border-bottom:1px dashed #d4dae4}.staff-signature-hint{color:#7a8494!important;font-size:.73rem!important;line-height:1.4}.staff-signature-fields{display:grid;align-content:start;gap:13px}.staff-signature-fields label{display:grid;gap:7px}.staff-signature-fields span{font-size:.76rem;font-weight:750;color:#596273}.staff-signature-fields input{width:100%;padding:12px 13px;border:1px solid #d4d9e2;border-radius:11px;background:#fff;font:inherit}.staff-signature-fields input:focus{border-color:#6b9ee8;outline:3px solid rgba(65,126,212,.12)}.staff-signature-copy aside{display:grid;gap:3px;padding:11px 12px;border-radius:11px;background:#f3f7fc;color:#607086;font-size:.73rem}.staff-signature-copy aside strong{color:#344054}.staff-signature-error{margin:0;color:#b42318;font-size:.8rem}
@media(max-width:900px){.staff-signature-grid{grid-template-columns:1fr}}
@media(max-width:680px){.staff-form-grid,.staff-signature-grid{grid-template-columns:1fr}.staff-form-grid .field-wide{grid-column:auto}.staff-save-row,.staff-photo-editor,.staff-account-actions{align-items:stretch;flex-direction:column}.staff-save-row .staff-status{margin:0}.staff-signature{padding:15px}.staff-signature-head{grid-template-columns:auto 1fr}.staff-signature-role{grid-column:1/-1;width:max-content}.staff-signature-canvas canvas{height:145px}.staff-photo-preview{align-self:center}.staff-photo-actions,.staff-account-actions>div:last-child{justify-content:stretch;flex-wrap:wrap}.staff-photo-actions>* ,.staff-account-actions button{flex:1;text-align:center}}