.formicoi23d-app { font-family: peyda, sans-serif; direction: rtl; color: #111111; }
.formicoi23d-notice { background: #FFF7E6; color: #7A5900; border-radius: 10px; padding: 10px 14px; font-size: 12.5px; margin-bottom: 16px; }
.formicoi23d-grid { display: flex; gap: 24px; flex-wrap: wrap; }
.formicoi23d-col { flex: 1 1 300px; min-width: 260px; display: flex; flex-direction: column; gap: 12px; }
.formicoi23d-dropzone {
  height: 260px; border: 2px dashed #C9CBCE; border-radius: 14px; background: #F9F9FA;
  display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden;
  transition: border-color .2s ease, background .2s ease;
}
.formicoi23d-dropzone.formicoi23d-dragover { border-color: #2E2EDC; background: #EEF0FF; }
#formicoi23d-placeholder { text-align: center; color: #6b6c70; font-size: 13px; }
#formicoi23d-preview-img { width: 100%; height: 100%; object-fit: contain; }
.formicoi23d-convert-btn {
  background: #011E37; color: #fff; border: none; border-radius: 10px; padding: 12px; font-family: inherit;
  font-weight: 700; font-size: 14px; cursor: pointer;
}
.formicoi23d-convert-btn:disabled { background: #C9CBCE; cursor: not-allowed; }
.formicoi23d-status { background: #EEF0FF; color: #2E2EDC; border-radius: 8px; padding: 10px 12px; font-size: 13px; text-align: center; }
.formicoi23d-error { background: #fdecea; color: #c0392b; border-radius: 8px; padding: 10px 12px; font-size: 13px; }
.formicoi23d-viewport {
  position: relative; height: 260px; border-radius: 14px; background: #F3F3F3;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
#formicoi23d-viewport-placeholder { color: #9a9b9e; font-size: 13px; }
#formicoi23d-canvas { width: 100%; height: 100%; display: block; cursor: grab; }
.formicoi23d-downloads { display: flex; gap: 10px; }
.formicoi23d-download-btn {
  flex: 1; text-align: center; background: #2E2EDC; color: #fff; border-radius: 10px; padding: 10px;
  font-family: inherit; font-size: 13px; font-weight: 700; text-decoration: none;
}
@media (max-width: 640px) {
  .formicoi23d-grid { flex-direction: column; }
  .formicoi23d-dropzone, .formicoi23d-viewport { height: 220px; }
}
.formicoi23d-dropzone { position: relative; }
.formicoi23d-remove-img-btn {
  position: absolute; top: 10px; left: 10px; width: 28px; height: 28px; border-radius: 50%;
  background: rgba(17,17,17,0.7); color: #fff; border: none; font-size: 16px; line-height: 1;
  cursor: pointer; z-index: 5; align-items: center; justify-content: center;
}
.formicoi23d-remove-img-btn:hover { background: #c0392b; }