.drop-zone { border: 2px dashed var(--border-color); border-radius: 8px; padding: 25px; text-align: center; cursor: pointer; transition: all 0.2s; background: #fafafa; }
			.drop-zone:hover { border-color: var(--primary-color); background: #eff6ff; }
			.drop-zone input { display: none; }
			.drop-zone p { font-size: 0.9rem; color: var(--text-muted); margin-top: 6px; }

			.editor-container { display: none; margin-top: 20px; text-align: center; }
        
			.img-preview-box { height: 350px; width: 100%; background: #f1f5f9; border-radius: 8px; overflow: hidden; display: flex; justify-content: center; align-items: center; padding: 10px; border: 1px solid var(--border-color); margin-bottom: 15px; }
			.img-preview-box img { max-width: 330px; max-height: 300px; display: block; border-radius: 4px; transition: transform 0.3s ease; }

			.controls-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 15px; }
			.control-btn { background: #e2e8f0; border: none; padding: 10px; border-radius: 8px; font-size: 0.9rem; font-weight: 600; cursor: pointer; color: var(--text-main); transition: background 0.2s; display: flex; align-items: center; justify-content: center; gap: 6px; }
			.control-btn:hover { background: #cbd5e1; }

			.action-btn { width: 100%; background-color: var(--primary-color); color: white; border: none; border-radius: 8px; padding: 12px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: background-color 0.2s; }
			.action-btn:hover { background-color: var(--primary-hover); }