
.enhancer-main-layout { width: 100%; min-height: 300px; position: relative; }
.st-upload-area { border: 2px dashed #cbd5e1; background: #f8fafc; padding: 40px; border-radius: 15px; text-align: center; cursor: pointer; transition: 0.3s; }
.st-upload-area:hover { border-color: #6366f1; background: #eff6ff; }

/* Comparison Slider */
.comparison-container { position: relative; width: 100%; max-width: 800px; margin: 0 auto; border-radius: 15px; border: 4px solid #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.1); overflow: hidden; background: #000; }

.comparison-container img { width: 100%; height: auto; display: block; }

#img-after-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%); }

#img-after-box img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; }

.slider-bar { position: absolute; top: 0; left: 50%; width: 2px; height: 100%; background: var(--tool-card-bg, #fff); z-index: 10; pointer-events: none; }

.slider-button { position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; background: #6366f1; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; transform: translate(-50%, -50%); z-index: 11; box-shadow: 0 0 10px rgba(0,0,0,0.3); cursor: grab; }

.slider-button:active { cursor: grabbing; }

.label-before, .label-after { position: absolute; bottom: 10px; padding: 5px 10px; background: rgba(0,0,0,0.5); color: #fff; font-size: 10px; font-weight: 800; border-radius: 4px; z-index: 5; pointer-events: none; }
.label-before { right: 10px; } .label-after { left: 10px; }

.enhance-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 20px; }

.spinner { width: 40px; height: 40px; border: 4px solid rgba(99, 102, 241, 0.2); border-top: 4px solid #6366f1; border-radius: 50%; animation: spin 1s linear infinite; margin: 0 auto; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

@media (max-width: 600px) {
    .enhance-controls { grid-template-columns: 1fr; }
}

