/* Move-and-scale for face photos (js/photo-crop.js). Shared by /apply and the member portal. */
.photo-crop-dialog { width:min(400px,calc(100vw - 32px)); padding:20px; border:1px solid #2f3846; border-radius:18px; background:#171d26; color:#e5e7eb; }
.photo-crop-dialog::backdrop { background:rgba(0,0,0,.75); }
.photo-crop-dialog h2 { margin:0 0 6px; font-size:21.5px; letter-spacing:0; }
.photo-crop-hint { margin:0 0 14px; color:#a7b0bd; font-size:15px; line-height:1.4; }
.photo-crop-stage { position:relative; width:100%; aspect-ratio:1; overflow:hidden; border-radius:12px; background:#0f141b; touch-action:none; cursor:grab; user-select:none; -webkit-user-select:none; }
.photo-crop-stage:active { cursor:grabbing; }
.photo-crop-stage:focus-visible { outline:2px solid #96b7e3; outline-offset:3px; }
.photo-crop-image { position:absolute; top:0; left:0; max-width:none; transform-origin:0 0; pointer-events:none; }
/* The circle: everything outside it is dimmed by the huge shadow. */
.photo-crop-mask { position:absolute; inset:0; border-radius:50%; box-shadow:0 0 0 9999px rgba(10,13,18,.72); border:2px solid rgba(255,255,255,.85); pointer-events:none; }
.photo-crop-dialog .photo-crop-zoom { display:flex; align-items:center; gap:12px; margin:18px 0 0; color:#c9d1dc; font-size:15px; font-weight:600; }
.photo-crop-dialog .photo-crop-zoom input { flex:1; margin:0; accent-color:#96b7e3; }
.photo-crop-dialog .feedback-actions { display:flex; gap:10px; margin-top:12px; }
.photo-crop-dialog .feedback-actions button { flex:1 1 0; margin-top:0; }
.photo-crop-dialog .feedback-status { min-height:1.4em; margin:8px 0 0; font-size:15px; }
/* "Use this photo?" after the photo picker (js/photo-crop.js confirm), and "Choose another photo" under the cropper. */
.photo-confirm-frame { display:grid; place-items:center; width:100%; height:min(56vh,420px); margin-top:10px; overflow:hidden; border-radius:12px; background:#0f141b; }
.photo-confirm-image { display:block; max-width:100%; max-height:100%; object-fit:contain; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.photo-confirm-name { margin:0; padding:0 16px; color:#c9d1dc; overflow-wrap:anywhere; text-align:center; }
.photo-crop-dialog .photo-crop-again { display:block; width:100%; margin:10px 0 0; padding:10px; border:0; background:transparent; color:#a7b0bd; font:inherit; font-size:16px; font-weight:600; cursor:pointer; }
.photo-confirm-dialog.is-grid .primary-button { background:#D97757; border-color:#D97757; color:#fff; }
/* Crop in "Use this photo?": a box over the photo with a handle on each corner; outside it is dimmed. */
.photo-confirm-frame { position:relative; }
.photo-confirm-zone { position:absolute; overflow:hidden; touch-action:none; }
.photo-confirm-zone.hidden, .photo-confirm-hint.hidden, .photo-crop-dialog .feedback-actions.hidden, .photo-crop-dialog .hidden { display:none; }
.photo-confirm-box { position:absolute; box-sizing:border-box; border:2px solid rgba(255,255,255,.92); box-shadow:0 0 0 9999px rgba(10,13,18,.62); cursor:move; touch-action:none; }
.photo-confirm-handle { position:absolute; width:26px; height:26px; touch-action:none; }
.photo-confirm-handle::after { content:''; position:absolute; width:14px; height:14px; border:3px solid #fff; }
.photo-confirm-handle.is-nw { left:-6px; top:-6px; cursor:nwse-resize; } .photo-confirm-handle.is-nw::after { left:4px; top:4px; border-right:0; border-bottom:0; }
.photo-confirm-handle.is-ne { right:-6px; top:-6px; cursor:nesw-resize; } .photo-confirm-handle.is-ne::after { right:4px; top:4px; border-left:0; border-bottom:0; }
.photo-confirm-handle.is-sw { left:-6px; bottom:-6px; cursor:nesw-resize; } .photo-confirm-handle.is-sw::after { left:4px; bottom:4px; border-right:0; border-top:0; }
.photo-confirm-handle.is-se { right:-6px; bottom:-6px; cursor:nwse-resize; } .photo-confirm-handle.is-se::after { right:4px; bottom:4px; border-left:0; border-top:0; }
.photo-crop-dialog .photo-confirm-crop { display:block; margin:10px auto 0; padding:8px 18px; border:1px solid #3a4352; border-radius:999px; background:transparent; color:#e5e7eb; font:inherit; font-size:16px; font-weight:700; cursor:pointer; }
.photo-confirm-dialog.is-grid .photo-confirm-crop { border-color:#D97757; color:#D97757; }
.photo-confirm-dialog .photo-confirm-hint { margin:10px 0 0; text-align:center; }
.photo-crop-dialog .photo-confirm-crop.hidden { display:none; }
/* "Save to My photos" under a chat photo (options.save in photo-crop.js confirm). */
.photo-crop-dialog .photo-confirm-save { display:flex; align-items:center; justify-content:center; gap:10px; margin:12px 0 0; color:#e5e7eb; font-size:16px; font-weight:600; cursor:pointer; }
.photo-crop-dialog .photo-confirm-save input { width:20px; height:20px; accent-color:#96b7e3; }
.photo-confirm-dialog.is-grid .photo-confirm-save input { accent-color:#D97757; }
