.employee-photo-tools{display:flex;align-items:center;gap:12px;flex-shrink:0}.employee-photo-frame{width:88px;height:110px;border-radius:13px;overflow:hidden;border:1px solid #dde5f1;background:#eef3fc;display:grid;place-items:center}.employee-photo-frame>img{width:100%;height:100%;object-fit:cover}.employee-photo-frame>.avatar{width:100%;height:100%;border-radius:0;font-size:27px}.employee-photo-actions{display:flex;flex-direction:column;gap:7px}.employee-photo-actions .btn{font-size:10px;justify-content:center;white-space:nowrap}.employee-photo-editor{max-width:540px;margin:auto}.employee-photo-editor>p{font-size:12px;color:#71829c;line-height:1.8;margin-bottom:16px}.employee-photo-crop{position:relative;width:240px;height:300px;margin:20px auto;background:#edf2f9;border:1px solid #dce5f2;border-radius:12px;overflow:hidden}.employee-photo-crop canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}.employee-photo-crop canvas:active{cursor:grabbing}.employee-photo-crop>span{position:absolute;inset:0;display:grid;place-items:center;color:#8b9ab0;font-size:11px;pointer-events:none}.employee-photo-crop>span[hidden]{display:none}.employee-photo-file{position:absolute;opacity:0;width:1px;height:1px;overflow:hidden}.employee-photo-file:focus-visible+*{outline:2px solid #6481c6}.employee-photo-editor>.employee-photo-help{font-size:10px;margin-top:10px}.employee-photo-zoom{display:flex;gap:20px;align-items:center;color:#657c9e;font-size:12px;margin:20px 0}.employee-photo-zoom>input{flex:1;min-width:0;padding:0;accent-color:#637bc9}.employee-photo-editor [data-photo-status]{min-height:24px;color:#526c97}.employee-photo-footer{border-top:1px solid #e5ebf3;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px}.employee-badge-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start}.employee-badge-preview{padding:25px;min-width:0;background:#eef2f8}.employee-badge-preview>header{display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:1px;color:#8c9bb2;margin-bottom:24px}.employee-badge-card{width:100%;height:auto;display:block;background:white;box-shadow:0 6px 28px #2039511a;border-radius:7px}.employee-badge-preview>p{margin:21px 0 0;font-size:11px;color:#7a8da8;text-align:center}.employee-badge-settings{padding:23px}.employee-badge-settings h2{font-size:15px;color:#4f6586;margin-bottom:23px}.employee-badge-settings label{display:flex;flex-direction:column;gap:9px;font-size:11px;color:#768aa7;margin:20px 0}.employee-badge-settings input,.employee-badge-settings select{width:100%;font-size:12px;min-height:42px}.employee-badge-settings p{font-size:11px;color:#8293ad;line-height:1.9}.employee-badge-settings [role=status]{margin-top:18px;color:#536f9b}.employee-badge-missing{border-top:1px solid #e6ecf5;margin-top:23px;padding-top:18px;font-size:11px;color:#8a9bb3;line-height:1.9}.employee-badge-missing>a{display:flex;align-items:center;gap:7px;margin-top:8px;color:#607cbd}.employee-badge-missing .icon{width:13px;height:13px}
@media(max-width:1200px){.employee-badge-layout{grid-template-columns:minmax(0,1fr) 245px;gap:18px}.employee-photo-tools{flex-direction:column;gap:8px}.employee-photo-frame{width:75px;height:94px}.employee-photo-actions .btn{padding:5px 8px;font-size:9px}.employee-profile-identity{align-items:flex-start}.employee-badge-preview{padding:18px}}
@media(max-width:900px){.employee-badge-layout{grid-template-columns:1fr}.employee-badge-settings{display:grid;grid-template-columns:1fr 1fr;column-gap:20px}.employee-badge-settings h2,.employee-badge-settings>p,.employee-badge-missing{grid-column:1/-1}.employee-badge-settings label{margin-top:0}.employee-badge-settings h2{margin-bottom:20px}}
@media(max-width:760px){.employee-photo-frame{width:66px;height:83px}.employee-photo-actions .btn{font-size:9px;gap:4px}.employee-profile-identity h1{font-size:18px}.employee-photo-actions .icon{width:12px;height:12px}.employee-badge-preview{padding:13px}.employee-badge-preview>header{font-size:8px;letter-spacing:.4px;margin-bottom:17px}.employee-badge-settings{display:block}.employee-badge-settings label{margin:20px 0}.employee-photo-footer{flex-wrap:wrap}.employee-photo-footer .btn{font-size:11px}.employee-photo-editor>p{font-size:11px}.employee-photo-crop{width:216px;height:270px}}
