.image-management-container{max-width:1400px;padding:var(--spacing-xl);background-color:var(--background-color);min-height:100vh;margin:0 auto}.image-management-header{margin-bottom:var(--spacing-2xl);justify-content:space-between;align-items:center;gap:var(--spacing-lg);flex-wrap:wrap;display:flex}.image-management-header .back-btn{text-decoration:none;display:inline-block}.image-management-header h1{color:var(--text-primary);margin:0;font-size:2rem}.upload-btn{background:var(--primary-color);color:#fff;padding:var(--spacing-md)var(--spacing-xl);border-radius:var(--radius-sm);cursor:pointer;transition:opacity var(--transition-normal);border:none;font-size:1rem;font-weight:600}.upload-btn:hover{opacity:.9}.upload-section{background:var(--card-bg);border-radius:var(--radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-2xl);box-shadow:var(--shadow-md)}.upload-form h3{color:var(--text-primary);margin-bottom:var(--spacing-lg)}.upload-form input[type=file]{width:100%;padding:var(--spacing-md);border:2px dashed var(--border-color);border-radius:var(--radius-md);background:var(--background-color);color:var(--text-primary);cursor:pointer;margin-bottom:var(--spacing-lg)}.upload-form input[type=file]:hover{border-color:var(--primary-color)}.upload-options{gap:var(--spacing-md);margin-top:var(--spacing-lg);flex-direction:column;display:flex}.upload-options label{color:var(--text-primary);align-items:center;gap:var(--spacing-sm);font-weight:500;display:flex}.upload-options input[type=checkbox]{cursor:pointer;width:18px;height:18px}.upload-options select,.upload-options input[type=text]{margin-left:var(--spacing-sm);padding:var(--spacing-sm)var(--spacing-md);border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--input-bg);color:var(--text-primary)}.upload-error{border:1px solid var(--color-error);color:var(--color-error);padding:var(--spacing-md);border-radius:var(--radius-sm);margin-top:var(--spacing-md);background:#dc35451a}.upload-progress{align-items:center;gap:var(--spacing-md);margin-top:var(--spacing-lg);flex-direction:column;display:flex}.image-grid-container{min-height:400px}.images-grid{gap:var(--spacing-xl);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}@media (max-width:768px){.images-grid{gap:var(--spacing-lg);grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}.image-card{background:var(--card-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:transform var(--transition-normal),box-shadow var(--transition-normal);position:relative;overflow:hidden}.image-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px)}.cover-badge{top:var(--spacing-sm);left:var(--spacing-sm);background:var(--primary-color);color:#fff;padding:var(--spacing-xs)var(--spacing-md);border-radius:var(--radius-sm);z-index:10;box-shadow:var(--shadow-md);font-size:.85rem;font-weight:600;position:absolute}.public-badge,.private-badge{top:var(--spacing-sm);right:var(--spacing-sm);padding:var(--spacing-xs)var(--spacing-md);border-radius:var(--radius-sm);z-index:10;box-shadow:var(--shadow-md);font-size:.85rem;font-weight:600;position:absolute}.public-badge{color:#fff;background:#22c55ee6}.private-badge{color:#fff;background:#64748be6}.image-preview{background:var(--background-color);cursor:pointer;width:100%;height:250px;position:relative;overflow:hidden}.image-preview img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-normal)}.image-card:hover .image-preview img{transform:scale(1.05)}.image-error,.image-loading{width:100%;height:100%;color:var(--text-secondary);justify-content:center;align-items:center;display:flex}.image-info{padding:var(--spacing-md)}.image-filename{color:var(--text-primary);margin:0 0 var(--spacing-xs)0;white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.image-details{color:var(--text-secondary);margin:0;font-size:.85rem}.image-actions{gap:var(--spacing-sm);padding:0 var(--spacing-md)var(--spacing-md);flex-direction:column;display:flex}.btn-set-cover,.btn-delete,.btn-toggle-public,.btn-reposition{border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-normal);text-align:center;border:none;width:100%!important;padding:12px 20px!important;font-size:1rem!important;font-weight:600!important;line-height:1.5!important}.btn-set-cover,.btn-reposition{color:#fff;background:#ff8c00}.btn-set-cover:hover,.btn-reposition:hover{background:#f70}.btn-toggle-public{color:#fff;background:#6b7280}.btn-toggle-public:hover{background:#4b5563}.btn-delete{color:#fff;background:#dc143c}.btn-delete:hover{background:#b01030;transform:translateY(-1px);box-shadow:0 4px 8px #dc143c4d}.btn-set-cover:disabled,.btn-delete:disabled{opacity:.5;cursor:not-allowed}.image-modal{z-index:1000;cursor:pointer;padding:var(--spacing-xl);background:#000000e6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{cursor:default;max-width:90vw;max-height:90vh}.modal-content img{object-fit:contain;border-radius:var(--radius-md);max-width:100%;max-height:90vh}.empty-state,.error-state,.loading-state{text-align:center;padding:var(--spacing-2xl);flex-direction:column;justify-content:center;align-items:center;min-height:400px;display:flex}.empty-state p{color:var(--text-secondary);margin:var(--spacing-md)0;font-size:1.2rem}.empty-subtitle{color:var(--text-tertiary)!important;font-size:1rem!important}.error-state{color:var(--color-error)}.error-state button{margin-top:var(--spacing-lg);padding:var(--spacing-md)var(--spacing-xl);background:var(--primary-color);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;font-size:1rem;font-weight:600}.loading-spinner-small{border:3px solid var(--border-color);border-top:3px solid var(--primary-color);border-radius:50%;width:30px;height:30px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.reposition-modal{z-index:2000;padding:var(--spacing-lg);background:#000000e6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.reposition-content{background:var(--card-bg);border-radius:var(--radius-lg);padding:var(--spacing-xl);width:100%;max-width:800px;max-height:90vh;overflow-y:auto}.reposition-content h3{color:var(--text-primary);margin:0 0 var(--spacing-md)0}.reposition-help{color:var(--text-secondary);margin-bottom:var(--spacing-lg);font-size:.9rem}.reposition-drag-container{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.zoom-indicator{pointer-events:none;z-index:10;font-family:monospace;font-weight:700}.position-indicators{font-family:monospace}.zoom-controls button:hover{background:#000000d9!important}.zoom-controls button:active{transform:scale(.95);background:#000000f2!important}@media (max-width:768px){.image-management-container{padding:var(--spacing-md)}.image-management-header{align-items:stretch;gap:var(--spacing-md);flex-direction:column}.image-management-header h1{font-size:1.5rem}.upload-btn{width:100%;padding:var(--spacing-md)}.reposition-modal{padding:var(--spacing-md)}.reposition-content{padding:var(--spacing-lg);max-height:95vh}.reposition-content h3{font-size:1.2rem}.reposition-help{font-size:.85rem}.reposition-drag-container{height:400px!important}.image-actions{flex-direction:column}.btn-set-cover,.btn-delete{padding:var(--spacing-md);min-height:44px;font-size:1rem}.zoom-indicator{padding:8px 12px!important;font-size:14px!important}.position-indicators{gap:var(--spacing-xs);flex-direction:column;font-size:14px!important}.zoom-controls button{width:44px!important;height:44px!important;font-size:24px!important}}@media (min-width:769px) and (max-width:1024px){.images-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.reposition-content{max-width:700px}}.btn-edit-image{width:100%;padding:var(--spacing-md)var(--spacing-lg);background:var(--primary-color);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;font-size:.95rem;font-weight:600;transition:all .2s}.btn-edit-image:hover{opacity:.9}.image-edit-modal-overlay{z-index:1100;background:#000000d9;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.image-edit-modal{background:var(--card-bg);border-radius:var(--radius-lg);border:1px solid var(--border-color);width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #00000080}.image-edit-modal-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.image-edit-modal-header h3{color:var(--text-primary);margin:0;font-size:1.25rem}.image-edit-modal-header .close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:0;font-size:1.5rem;line-height:1;transition:color .2s}.image-edit-modal-header .close-btn:hover{color:var(--primary-color)}.image-edit-modal-body{padding:1.5rem}.edit-image-preview{border-radius:var(--radius-md);background:var(--background-color);justify-content:center;align-items:center;width:100%;height:250px;margin-bottom:1.5rem;display:flex;overflow:hidden}.edit-image-preview img{object-fit:contain;max-width:100%;max-height:100%}.edit-section{margin-bottom:1.25rem}.edit-section label{color:var(--text-primary);margin-bottom:.5rem;font-size:.95rem;font-weight:600;display:block}.edit-section .rotation-controls{background:var(--background-color);border-radius:var(--radius-md);justify-content:center;align-items:center;gap:1rem;padding:.75rem;display:flex}.edit-section .btn-rotate{background:var(--card-bg);width:44px;height:44px;color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;font-size:1.5rem;transition:all .2s;display:flex}.edit-section .btn-rotate:hover{border-color:var(--primary-color);color:var(--primary-color)}.edit-section .rotation-indicator{color:var(--text-primary);text-align:center;min-width:50px;font-size:1.1rem;font-weight:600}.edit-section .btn-reposition{background:var(--background-color);width:100%;color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;padding:.75rem 1rem;font-size:.95rem;font-weight:500;transition:all .2s}.edit-section .btn-reposition:hover{border-color:var(--primary-color);color:var(--primary-color)}.visibility-toggle{background:var(--background-color);border-radius:var(--radius-md);gap:.5rem;padding:.25rem;display:flex}.visibility-btn{color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;flex:1;padding:.6rem 1rem;font-size:.95rem;font-weight:500;transition:all .2s}.visibility-btn.active{background:var(--card-bg);color:var(--primary-color);box-shadow:var(--shadow-sm)}.visibility-btn:hover:not(.active){color:var(--text-primary)}.visibility-help{color:var(--text-secondary);margin:.5rem 0 0;font-size:.85rem}.btn-set-cover-full{width:100%;color:var(--primary-color);border:1px solid var(--primary-color);border-radius:var(--radius-sm);cursor:pointer;background:0 0;padding:.75rem 1rem;font-size:.95rem;font-weight:500;transition:all .2s}.btn-set-cover-full:hover:not(:disabled){background:var(--primary-color);color:#fff}.btn-set-cover-full:disabled{opacity:.5;cursor:not-allowed}.image-edit-modal-footer{border-top:1px solid var(--border-color);background:var(--background-color);border-radius:0 0 var(--radius-lg)var(--radius-lg);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.btn-delete-image{color:#dc2626;border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:1px solid #dc2626;padding:.7rem 1.25rem;font-size:.95rem;font-weight:500;transition:all .2s}.btn-delete-image:hover:not(:disabled){color:#fff;background:#dc2626}.btn-delete-image:disabled{opacity:.5;cursor:not-allowed}.image-edit-modal-footer .footer-right{gap:.75rem;display:flex}.image-edit-modal-footer .btn-cancel{color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;background:0 0;padding:.7rem 1.25rem;font-size:.95rem;font-weight:500;transition:all .2s}.image-edit-modal-footer .btn-cancel:hover:not(:disabled){border-color:var(--text-secondary)}.image-edit-modal-footer .btn-cancel:disabled{opacity:.5;cursor:not-allowed}.image-edit-modal-footer .btn-save{background:var(--primary-color);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;padding:.7rem 1.25rem;font-size:.95rem;font-weight:500;transition:all .2s}.image-edit-modal-footer .btn-save:hover:not(:disabled){opacity:.9}.image-edit-modal-footer .btn-save:disabled{opacity:.5;cursor:not-allowed}.zoom-controls-row{background:var(--background-color);border-radius:var(--radius-md);justify-content:center;align-items:center;gap:1rem;margin-top:1rem;padding:.75rem;display:flex}.btn-zoom{background:var(--card-bg);width:40px;height:40px;color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;font-size:1.25rem;font-weight:700;transition:all .2s;display:flex}.btn-zoom:hover{border-color:var(--primary-color);color:var(--primary-color)}@media (max-width:768px){.image-edit-modal-overlay{align-items:flex-end;padding:0}.image-edit-modal{border-radius:var(--radius-lg)var(--radius-lg)0 0;max-width:100%;max-height:90vh}.image-edit-modal-header{padding:1rem 1.25rem}.image-edit-modal-body{padding:1.25rem}.edit-image-preview{height:200px}.image-edit-modal-footer{flex-direction:column;gap:.75rem;padding:1rem 1.25rem 1.5rem}.btn-delete-image{order:3;width:100%}.image-edit-modal-footer .footer-right{flex-direction:column-reverse;width:100%}.image-edit-modal-footer .footer-right button{width:100%}.visibility-toggle{flex-direction:row}.visibility-btn{min-height:44px}.edit-section .btn-rotate{width:50px;height:50px;font-size:1.75rem}}