.uploadArea{width:100%;border:2px dashed var(--color-border);border-radius:var(--primary-border-radious);padding:3rem 2rem;text-align:center;background:var(--color-bg-tertiary);transition:all .3s ease;margin-bottom:2rem;cursor:pointer}.uploadArea:hover{border-color:var(--color-primary);background:var(--color-card)}.uploadContent{display:flex;flex-direction:column;align-items:center;gap:1rem}.uploadIcon{font-size:3rem;opacity:.7}.uploadText{display:flex;flex-direction:column;gap:.5rem;color:var(--color-text)}.uploadText strong{font-size:1.1rem;color:var(--color-primary)}.uploadText span{opacity:.7;font-size:.9rem}.browseButton{background:var(--color-primary);color:var(--color-btn-text);border:none;border-radius:var(--primary-border-radious);padding:.75rem 2rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.browseButton:hover{background:var(--color-accent);transform:translateY(-2px)}.browseButton:active{transform:translateY(0)}.imagesSection{width:100%;margin-bottom:2rem}.imagesHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.imagesHeader h2{color:var(--color-text);font-size:1.3rem;margin:0}.clearButton{background:rgba(0,0,0,0);color:var(--color-error);border:1px solid var(--color-error);border-radius:var(--primary-border-radious);padding:.5rem 1rem;font-size:.9rem;cursor:pointer;transition:all .2s ease}.clearButton:hover{background:var(--color-error);color:var(--color-text)}.imagesGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-gap:1rem;gap:1rem;margin-bottom:1rem}.imageCard{background:var(--color-bg-tertiary);border:1px solid var(--color-border);border-radius:var(--primary-border-radious);overflow:hidden;transition:all .2s ease;cursor:move}.imageCard:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 12px rgba(255,153,0,.1)}.imageCard.dragging{opacity:.5;transform:scale(.95)}.imagePreview{position:relative;width:100%;aspect-ratio:1;overflow:hidden;background:var(--color-bg-secondary)}.imagePreview img{width:100%;height:100%;object-fit:cover}.imageOverlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:flex-start;justify-content:space-between;padding:.5rem;opacity:0;transition:opacity .2s ease}.imageCard:hover .imageOverlay{opacity:1}.imageNumber{background:var(--color-primary);color:var(--color-btn-text);border-radius:50%;width:24px;height:24px;font-size:.8rem;font-weight:700}.imageNumber,.removeButton{display:flex;align-items:center;justify-content:center}.removeButton{background:var(--color-error);color:var(--color-text);border:none;border-radius:50%;width:28px;height:28px;font-size:1.2rem;cursor:pointer;transition:all .2s ease}.removeButton:hover{background:#ff6b6b;transform:scale(1.1)}.imageName{padding:.75rem;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.imageName,.reorderHint{color:var(--color-text);text-align:center}.reorderHint{opacity:.7;font-size:.9rem;margin-top:1rem}.downloadButton{background:var(--color-success);color:var(--color-text)}.downloadButton:hover{background:#2db85a}@media(min-width:768px){.imagesGrid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}@media(min-width:1024px){.imagesGrid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}