/* Cyan selection crops source pixels; white outer handles resize the photo view. */
body[data-page="photo-enhancement-station"] #photoCropStage {
  position: relative;
  flex: 0 0 auto;
  overflow: visible;
  margin: 0;
  padding: 0;
}
body[data-page="photo-enhancement-station"] #photoCropStage > #previewFrame.is-photo-crop-editor {
  position: absolute !important;
  margin: 0 !important;
  max-width: none !important;
  max-height: none !important;
}
body[data-page="photo-enhancement-station"] #previewFrame.is-photo-crop-editor {
  position: relative !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: 0 10px 40px rgb(0 0 0 / 25%) !important;
  flex: 0 0 auto;
  margin: 16px auto !important;
  background: #10151c;
}
body[data-page="photo-enhancement-station"] #previewFrame.is-photo-crop-editor::after,
body[data-page="photo-enhancement-station"] #previewFrame.is-photo-crop-editor::before,
body[data-page="photo-enhancement-station"] #previewFrame.is-photo-crop-editor > img {
  display: none !important;
}
body[data-page="photo-enhancement-station"] .photo-crop-canvas,
body[data-page="photo-enhancement-station"] .photo-crop-edge {
  display: none;
}
body[data-page="photo-enhancement-station"] .is-photo-crop-editor > .photo-crop-canvas {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  touch-action: none;
  user-select: none;
}
body[data-page="photo-enhancement-station"] .photo-crop-selection-layer { display: none; }
/* Drag handles must follow pointer geometry immediately, without button animations. */
body[data-page="photo-enhancement-station"] .photo-crop-selection,
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge,
body[data-page="photo-enhancement-station"] .photo-crop-edge {
  transition: none !important;
}
body[data-page="photo-enhancement-station"] .is-photo-crop-editing > .photo-crop-selection-layer {
  display: block;
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: hidden;
  pointer-events: none;
}
body[data-page="photo-enhancement-station"] .photo-crop-selection {
  position: absolute;
  box-sizing: border-box;
  border: 2px solid #20e3ed;
  box-shadow: 0 0 0 9999px rgb(0 0 0 / 58%);
  touch-action: none;
  pointer-events: auto;
  cursor: move;
}
body[data-page="photo-enhancement-station"] .photo-crop-selection::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, transparent 33%, rgb(255 255 255 / 38%) 33%, rgb(255 255 255 / 38%) calc(33% + 1px), transparent calc(33% + 1px), transparent 66%, rgb(255 255 255 / 38%) 66%, rgb(255 255 255 / 38%) calc(66% + 1px), transparent calc(66% + 1px)), linear-gradient(to bottom, transparent 33%, rgb(255 255 255 / 38%) 33%, rgb(255 255 255 / 38%) calc(33% + 1px), transparent calc(33% + 1px), transparent 66%, rgb(255 255 255 / 38%) 66%, rgb(255 255 255 / 38%) calc(66% + 1px), transparent calc(66% + 1px));
  pointer-events: none;
}
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge {
  position: absolute;
  z-index: 2;
  width: 28px;
  height: 28px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 7px solid transparent;
  border-radius: 2px;
  background: #20e3ed;
  background-clip: padding-box;
  box-shadow: none;
  touch-action: none;
}
/* Selection handles stay inside the photo, away from the outer white handles. */
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-n { left: 50%; top: 0; transform: translateX(-50%); cursor: ns-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-ne { right: 0; top: 0; cursor: nesw-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-e { right: 0; top: 50%; transform: translateY(-50%); cursor: ew-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-se { right: 0; bottom: 0; cursor: nwse-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-s { left: 50%; bottom: 0; transform: translateX(-50%); cursor: ns-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-sw { left: 0; bottom: 0; cursor: nesw-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-w { left: 0; top: 50%; transform: translateY(-50%); cursor: ew-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge-nw { left: 0; top: 0; cursor: nwse-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-selection:focus-visible,
body[data-page="photo-enhancement-station"] .photo-crop-selection-edge:focus-visible { outline: 2px solid white; outline-offset: -3px; }
body[data-page="photo-enhancement-station"] .photo-crop-selection.is-compact .photo-crop-selection-edge-n,
body[data-page="photo-enhancement-station"] .photo-crop-selection.is-compact .photo-crop-selection-edge-e,
body[data-page="photo-enhancement-station"] .photo-crop-selection.is-compact .photo-crop-selection-edge-s,
body[data-page="photo-enhancement-station"] .photo-crop-selection.is-compact .photo-crop-selection-edge-w { display: none; }
body[data-page="photo-enhancement-station"] .photo-crop-selection.is-compact .photo-crop-selection-edge { width: var(--crop-compact-handle-size, 24px); height: var(--crop-compact-handle-size, 24px); border-width: var(--crop-compact-handle-border, 5px); }
body[data-page="photo-enhancement-station"] #previewFrame.is-photo-crop-editing > .photo-crop-edge {
  display: block;
  position: absolute;
  z-index: 4;
  width: 26px;
  height: 26px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 7px solid transparent;
  border-radius: 9px;
  background: #f3f7fc;
  background-clip: padding-box;
  box-shadow: none;
  touch-action: none;
  transform: translate(-50%, -50%);
}
body[data-page="photo-enhancement-station"] .photo-crop-edge::after {
  content: '';
  position: absolute;
  inset: -1px;
  border: 1px solid #20364d;
  border-radius: 2px;
  pointer-events: none;
}
body[data-page="photo-enhancement-station"] .photo-crop-edge-n { left: 50%; top: -16px; cursor: ns-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-ne { left: calc(100% + 16px); top: -16px; cursor: nesw-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-e { left: calc(100% + 16px); top: 50%; cursor: ew-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-se { left: calc(100% + 16px); top: calc(100% + 16px); cursor: nwse-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-s { left: 50%; top: calc(100% + 16px); cursor: ns-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-sw { left: -16px; top: calc(100% + 16px); cursor: nesw-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-w { left: -16px; top: 50%; cursor: ew-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge-nw { left: -16px; top: -16px; cursor: nwse-resize; }
body[data-page="photo-enhancement-station"] .photo-crop-edge:focus-visible,
body[data-page="photo-enhancement-station"] .photo-crop-canvas:focus-visible {
  outline: 2px solid #69b5ff;
  outline-offset: 3px;
}
body[data-page="photo-enhancement-station"] #imagePreviewBox.is-photo-crop-mode {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px;
  padding: 24px !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  flex: 0 0 auto;
  overflow: visible !important;
}
body[data-page="photo-enhancement-station"] .photo-crop-direct-controls {
  position: relative;
  z-index: 6;
  width: 100%;
  flex: 0 0 auto;
  text-align: center;
  color: #cbd5e1;
}
body[data-page="photo-enhancement-station"] .photo-crop-direct-controls[hidden] { display: none !important; }
body[data-page="photo-enhancement-station"] #imagePreviewCard.is-photo-crop-mode .photo-tool-group[aria-label="Compare view"],
body[data-page="photo-enhancement-station"] #imagePreviewCard.is-photo-crop-mode .photo-tool-group[aria-label="Zoom controls"],
body[data-page="photo-enhancement-station"] #imagePreviewCard.is-photo-crop-mode #photoCompareToggle,
body[data-page="photo-enhancement-station"] #imagePreviewCard.is-photo-crop-mode #photoViewReset {
  display: none !important;
}
body[data-page="photo-enhancement-station"] .photo-crop-direct-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}
body[data-page="photo-enhancement-station"] .photo-crop-direct-actions button {
  min-height: 38px;
  padding: 6px 12px;
}
body[data-page="photo-enhancement-station"] #photoCropZoomReadout { min-width: 48px; font-variant-numeric: tabular-nums; font-size: 13px; }
body[data-page="photo-enhancement-station"] #photoCropPixelReadout { margin-top: 8px; color: #bdfaff; font-size: 12px; font-variant-numeric: tabular-nums; }
body[data-page="photo-enhancement-station"] #photoCropDirectHint { margin: 10px 0 0; font-size: 12px; line-height: 1.4; }
body[data-page="photo-enhancement-station"].photo-crop-full-view #imagePreviewCard {
  inset: 0 !important;
  height: 100dvh !important;
  border-radius: 0 !important;
}
body[data-page="photo-enhancement-station"].photo-crop-full-view .hero,
body[data-page="photo-enhancement-station"].photo-crop-full-view .account-panel-backdrop {
  display: none !important;
}
body[data-page="photo-enhancement-station"].photo-crop-full-view #imagePreviewBox {
  padding: 48px 20px 12px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
/* JS fits both dimensions together; legacy max-width must not squash one axis. */
body[data-page="photo-enhancement-station"].photo-crop-full-view #previewFrame.is-photo-crop-editor {
  max-width: none !important;
  max-height: none !important;
}
body[data-page="photo-enhancement-station"].photo-crop-full-view .photo-crop-full-view-exit { top: 6px; right: 8px; }
body[data-page="photo-enhancement-station"].photo-crop-full-view #photoOutputTargetBadge { top: 12px; bottom: auto; left: 10px; right: auto; max-width: calc(100% - 150px); }
@media (pointer: coarse) {
  body[data-page="photo-enhancement-station"] #previewFrame.is-photo-crop-editing > .photo-crop-edge { width: 40px; height: 40px; border-width: 14px; }
  body[data-page="photo-enhancement-station"] .photo-crop-selection-edge { width: 36px; height: 36px; border-width: 10px; }
}
