.registration-hero{padding:48px 24px 68px}.reg-form{width:min(760px,100%);padding:30px;border-radius:16px}.form-intro{padding-bottom:23px}.form-intro h1{font-family:'DM Sans',sans-serif;font-size:30px}.form-section{padding:23px 0}.section-label{margin-bottom:16px}.section-label h2{font:700 18px 'DM Sans',sans-serif}.section-label p{font-size:12px}.reg-form label{font:600 13px 'DM Sans',sans-serif}.reg-form input,.reg-form select,.reg-form textarea{padding:10px 11px;font-size:13px}.photo-field{align-items:flex-start}.photo-preview{width:196px;height:182px;flex-basis:196px;border-radius:8px}.photo-field p{max-width:450px;font-size:11px}.profession-toggles{gap:7px}.profession-toggles button{padding:7px 10px;font-size:12px}.submit{margin-top:23px;padding:13px;font:700 15px 'DM Sans',sans-serif}.crop-controls{display:grid;gap:4px;margin-top:9px}.crop-controls label{display:flex!important;align-items:center;gap:8px;margin:0;font-size:11px}.crop-controls input{padding:0!important;accent-color:#28734a}@media(max-width:680px){.registration-hero{padding:28px 14px;background-attachment:scroll}.reg-form{padding:22px 17px;border-radius:13px}.form-intro h1{font-size:26px}.photo-preview{width:150px;height:140px;flex-basis:150px}.profession-toggles{gap:6px}.profession-toggles button{font-size:11px;padding:6px 8px}}
.terms-check{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:9px;margin:18px 0 0!important;font-size:12px!important;line-height:1.5}.terms-check input{width:17px;height:17px;flex:0 0 17px;margin:1px 0 0;padding:0}.terms-check a{color:#28734a;text-decoration:underline}
.crop-controls label:first-child{font-size:12px}.crop-controls input[type="range"]{width:min(300px,100%);height:22px;cursor:pointer}.crop-controls input[type="range"]::-webkit-slider-thumb{width:18px;height:18px}.crop-controls input[type="range"]::-moz-range-thumb{width:18px;height:18px}@media(max-width:680px){.crop-controls input[type="range"]{width:100%;height:24px}}
.photo-preview{touch-action:none}.photo-preview:has(img),.photo-preview:has(canvas){cursor:grab}.photo-preview.is-adjusting{cursor:grabbing}

/* iOS Safari avoids automatic focus zoom with 16px form controls. */
.reg-form input, .reg-form select, .reg-form textarea { font-size: 16px; }
@media (max-width: 680px) {
  .photo-field { flex-direction: column; align-items: stretch; min-width: 0; }
  .photo-tools, .crop-controls { width: 100%; min-width: 0; max-width: 100%; }
  .crop-controls input[type="range"] { display: block; width: 100%; max-width: 100%; min-width: 0; }
}
.crop-controls[hidden], .crop-controls input[hidden] { display: none !important; }
.crop-controls input[type="range"]:disabled { opacity: .5; cursor: not-allowed; }
.photo-preview { cursor: pointer; }
.photo-preview:focus-visible { outline: 3px solid #5aaac6; outline-offset: 3px; }
.photo-frame-group { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.photo-title { color: #394941; font: 600 13px 'DM Sans', 'Noto Serif Bengali', sans-serif; }
.photo-frame-group .photo-upload { display: flex !important; flex-direction: column; align-items: flex-start; gap: 7px; width: max-content; max-width: 100%; margin: 0; }
.photo-tools { flex: 1 1 0; min-width: 0; }
.photo-processing { display: flex !important; align-items: center; justify-content: center; gap: 7px; margin: 0 !important; color: #397b96 !important; font-size: 12px !important; line-height: 1.4; }
.photo-processing[hidden] { display: none !important; }
.photo-processing-spinner { width: 14px; height: 14px; flex: 0 0 14px; border: 2px solid #b8dfec; border-top-color: #397b96; border-radius: 50%; animation: photo-processing-spin .75s linear infinite; }
@keyframes photo-processing-spin { to { transform: rotate(360deg); } }
@media (max-width: 680px) {
  .photo-frame-group { align-items: center; width: 100%; }
  .photo-frame-group .photo-upload { align-items: center; }
  .photo-preview { margin-inline: auto; }
  .profession-toggles { gap: 7px; }
  .profession-toggles button { min-height: 38px; padding: 8px 10px; font-size: 11px; }
}
/* Keep the registration and profile-update photo frames exactly the same size. */
.photo-field .photo-frame-group .photo-preview { width: 196px; height: 182px; flex: 0 0 196px; }
@media (max-width: 680px) {
  .photo-field .photo-frame-group .photo-preview { width: 150px; height: 140px; flex-basis: 150px; }
}
