.file-preview-grid{display:grid;gap:1rem;grid-template-columns:repeat(2, 1fr)}@media(min-width: 768px){.file-preview-grid{grid-template-columns:repeat(3, 1fr)}}@media(min-width: 1200px){.file-preview-grid{grid-template-columns:repeat(5, 1fr)}}.file-preview-grid>div{position:relative;border:1px solid var(--mud-palette-lines-default);padding:.5rem;background:var(--mud-palette-background);border-radius:6px;display:flex;flex-direction:column;align-items:center}.loader{border:4px solid #f3f3f3;border-top:4px solid var(--mud-palette-primary);border-radius:50%;width:40px;height:40px;animation:spin 1s linear infinite;margin:20px 0}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.file-preview-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.6);display:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);justify-content:center;align-items:center;z-index:9999}.file-preview-modal>div{position:relative;max-width:80vw;max-height:80vh}.file-preview-modal img{max-width:80vw;max-height:80vh;width:auto;height:auto;border-radius:8px}.file-preview-modal button.close-btn{position:absolute;top:5px;right:5px;background:var(--mud-palette-surface);border:none;font-size:1.5rem;cursor:pointer;border-radius:50%;width:32px;height:32px}.file-preview-grid>div button.delete-btn{position:absolute;top:5px;right:5px;background:var(--mud-palette-surface);border:none;cursor:pointer;border-radius:4px;font-size:1.1rem;padding:2px 6px}.zoom-icon{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);font-size:24px;color:hsla(0,0%,100%,.8);background:rgba(0,0,0,.5);border-radius:50%;padding:8px;transition:color .3s ease;pointer-events:auto;opacity:.8;z-index:10}.zoom-icon:hover{color:#fff;opacity:1}.preview-wrapper{position:relative;width:100%}.file-preview-modal-content{max-width:80vw;max-height:80vh;position:relative}.preview-img{max-height:300px;width:auto;-o-object-fit:contain;object-fit:contain;border-radius:4px;cursor:pointer;transition:transform .2s ease-in-out}