.rn-real-image-crop-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    margin: 10px 8px 4px 0 !important;
}

.rn-image-crop-status {
    display: block;
    margin-top: 6px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.4;
}

.rn-image-crop-status.is-ready {
    color: #08783f;
    font-weight: 700;
}

body.rn-real-cropper-open { overflow: hidden !important; }

.rn-real-cropper {
    position: fixed;
    inset: 0;
    z-index: 2147483600;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    box-sizing: border-box;
}

.rn-real-cropper.is-open { display: flex; }

.rn-real-cropper-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 6, 23, .82);
    backdrop-filter: blur(12px);
}

.rn-real-cropper-dialog {
    position: relative;
    width: min(920px, 96vw);
    max-height: 96vh;
    overflow: auto;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 22px;
    color: #e5e7eb;
    background: #0b1020;
    box-shadow: 0 30px 90px rgba(0,0,0,.55);
    box-sizing: border-box;
}

.rn-real-cropper-dialog header,
.rn-real-cropper-dialog footer,
.rn-real-cropper-zoom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.rn-real-cropper-dialog h2 { margin: 2px 0 0; color: #fff; font-size: 25px; }
.rn-real-cropper-dialog header small { color: #fb3151; font-weight: 900; letter-spacing: .12em; }
.rn-real-cropper-close { border: 0; background: transparent; color: #fff; font-size: 34px; cursor: pointer; }
.rn-real-cropper-help { margin: 14px 0; color: #aeb8ca; line-height: 1.5; }

.rn-real-cropper-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border: 2px solid #fff;
    border-radius: 14px;
    background: #020617;
    cursor: grab;
    touch-action: none;
    user-select: none;
}

.rn-real-cropper-stage.is-dragging { cursor: grabbing; }
.rn-real-cropper-stage img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: auto;
    height: auto;
    max-width: none !important;
    pointer-events: none;
    transform-origin: center;
}

.rn-real-cropper-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, transparent 33.2%, rgba(255,255,255,.28) 33.3%, rgba(255,255,255,.28) 33.6%, transparent 33.7%, transparent 66.3%, rgba(255,255,255,.28) 66.4%, rgba(255,255,255,.28) 66.7%, transparent 66.8%), linear-gradient(0deg, transparent 33.2%, rgba(255,255,255,.28) 33.3%, rgba(255,255,255,.28) 33.6%, transparent 33.7%, transparent 66.3%, rgba(255,255,255,.28) 66.4%, rgba(255,255,255,.28) 66.7%, transparent 66.8%);
}

.rn-real-cropper-zoom { margin: 16px 0; }
.rn-real-cropper-zoom span { min-width: 50px; font-weight: 800; }
.rn-real-cropper-zoom input { width: 100%; accent-color: #e9002b; }
.rn-real-cropper-dialog footer { justify-content: flex-end; }

@media (max-width: 600px) {
    .rn-real-cropper { padding: 8px; }
    .rn-real-cropper-dialog { width: 100%; padding: 15px; border-radius: 16px; }
    .rn-real-cropper-dialog h2 { font-size: 20px; }
    .rn-real-cropper-help { font-size: 12px; }
    .rn-real-cropper-dialog footer .button { flex: 1; min-height: 44px; }
}