.upload-box{border:2px dashed #d0d5dd;border-radius:16px;padding:22px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:#fafafa}
.upload-box p{margin:5px 0 0;color:#667085;font-size:13px}
.upload-button{display:inline-flex!important;align-items:center;justify-content:center;background:#111315;color:#fff;border-radius:10px;padding:12px 16px;cursor:pointer;white-space:nowrap}
.image-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.preview-item{position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:#eee}
.preview-item img{width:100%;height:100%;object-fit:cover;display:block}
.preview-item span{position:absolute;left:8px;bottom:8px;background:rgba(17,19,21,.85);color:#fff;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:800}
.card-photo{aspect-ratio:4/3;background:#e9ecef;overflow:hidden}
.card-photo img{width:100%;height:100%;object-fit:cover;display:block}
.gallery{display:grid;gap:12px}
.gallery-main{background:#e9ecef;border-radius:20px;overflow:hidden;aspect-ratio:16/10}
.gallery-main img{width:100%;height:100%;object-fit:cover;display:block}
.gallery-thumbs{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}
.gallery-thumb{padding:0;border:2px solid transparent;background:none;border-radius:10px;overflow:hidden;aspect-ratio:4/3;cursor:pointer}
.gallery-thumb.active{border-color:#ff5a1f}
.gallery-thumb img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){
  .upload-box{align-items:flex-start;flex-direction:column}
  .image-preview{grid-template-columns:repeat(3,1fr)}
  .gallery-thumbs{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:480px){
  .image-preview{grid-template-columns:repeat(2,1fr)}
}
