.avatar-crop-dialog { width: min(760px, calc(100% - 28px)); max-height: calc(100dvh - 32px); padding: 0; overflow: auto; border: 0; border-radius: 7px; color: #1c2722; background: #fff; box-shadow: 0 28px 80px rgba(15, 28, 19, .32); }
.avatar-crop-dialog::backdrop { background: rgba(18, 28, 22, .68); backdrop-filter: blur(3px); }
.avatar-crop-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 21px; border-bottom: 1px solid #d9dfdb; }
.avatar-crop-head h2 { margin: 0; font-size: 19px; }
.avatar-crop-close { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 1px solid #d9dfdb; border-radius: 4px; color: #36433c; background: #fff; font-size: 22px; line-height: 1; }
.avatar-crop-body { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 22px; padding: 22px; }
.avatar-crop-stage { height: min(58vh, 460px); min-height: 360px; overflow: hidden; border: 1px solid #cbd4ce; border-radius: 5px; background: #18231d; }
.avatar-crop-stage img { width: 100%; height: 100%; display: block; max-width: 100%; object-fit: contain; }
.avatar-crop-side { display: grid; align-content: start; justify-items: center; gap: 11px; }
.avatar-crop-side strong { width: 100%; color: #59665f; font-size: 12px; text-align: left; }
.avatar-crop-preview { width: 128px; height: 128px; overflow: hidden; border: 3px solid #fff; border-radius: 50%; outline: 1px solid #caa96d; background: #edf1ee; box-shadow: 0 7px 22px rgba(24, 42, 31, .15); }
.avatar-crop-controls { display: grid; grid-template-columns: 36px minmax(70px, 1fr) 36px; gap: 7px; width: 100%; margin-top: 6px; }
.avatar-crop-controls button { width: 36px; height: 36px; padding: 0; border: 1px solid #bac5be; border-radius: 4px; color: #18382b; background: #fff; font-size: 19px; font-weight: 800; }
.avatar-crop-controls input { width: 100%; min-height: 36px; margin: 0; padding: 0; accent-color: #a57b39; }
.avatar-crop-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; width: 100%; }
.avatar-crop-tools button { min-height: 36px; padding: 0 9px; border: 1px solid #d0d8d3; border-radius: 4px; color: #405048; background: #f7f9f7; font-size: 11px; font-weight: 750; }
.avatar-crop-status { min-height: 18px; margin: 0; color: #9e3c34; font-size: 11px; text-align: center; }
.avatar-crop-actions { display: flex; justify-content: flex-end; gap: 9px; padding: 14px 21px; border-top: 1px solid #d9dfdb; background: #fbfcfb; }
.avatar-crop-button { min-height: 40px; padding: 0 17px; border: 1px solid #bac5be; border-radius: 5px; color: #18382b; background: #fff; font-weight: 750; }
.avatar-crop-button.primary { color: #fff; border-color: #18382b; background: #18382b; }
.avatar-crop-button:disabled { cursor: wait; opacity: .6; }
.avatar-crop-dialog .cropper-view-box, .avatar-crop-dialog .cropper-face { border-radius: 50%; }
.avatar-crop-dialog .cropper-view-box { outline: 2px solid #d8b56b; outline-color: rgba(216, 181, 107, .92); }
.avatar-crop-dialog .cropper-line { background-color: #d8b56b; }
.avatar-crop-dialog .cropper-point { width: 7px; height: 7px; background-color: #f2d18d; opacity: 1; }
@media (max-width: 620px) {
  .avatar-crop-dialog { width: calc(100% - 18px); max-height: calc(100dvh - 18px); }
  .avatar-crop-head { padding: 14px 15px; }
  .avatar-crop-body { grid-template-columns: 1fr; gap: 15px; padding: 14px; }
  .avatar-crop-stage { height: min(68vw, 330px); min-height: 250px; }
  .avatar-crop-side { grid-template-columns: 76px minmax(0, 1fr); align-items: center; justify-items: stretch; }
  .avatar-crop-side strong { grid-column: 1 / -1; }
  .avatar-crop-preview { grid-row: 2 / 5; width: 68px !important; height: 68px !important; }
  .avatar-crop-controls, .avatar-crop-tools, .avatar-crop-status { grid-column: 2; }
  .avatar-crop-actions { padding: 12px 14px; }
}