h1{color:#333;font-size:24px;margin-bottom:20px}figure{margin:20px;border:1px solid #ddd;padding:10px;display:flex;flex-direction:column;align-items:center}img{width:100%;height:auto;object-fit:cover}figcaption{text-align:center;margin-top:10px}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-gap:20px;gap:20px;padding:20px}.media-wrapper{max-height:calc(100vh);overflow-y:scroll}#mediaDialog,dialog{border:none;border-radius:8px}#mediaDialog{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:1000;box-shadow:0 4px 6px rgba(0,0,0,.1);width:auto;max-width:80%;padding:20px;box-sizing:border-box}#mediaDialog figure{margin:0;display:flex;flex-direction:column;align-items:center}#mediaDialog img{max-width:100%;width:500px;margin-bottom:15px;max-height:calc(100vh - 350px);object-fit:contain}#mediaDialog figcaption{font-size:1rem;margin-bottom:20px}.media-wrapper-title{font-size:1.5rem;padding:0 20px}#closeDialog{cursor:pointer;background-color:#007bff;color:white;border:none;border-radius:5px;font-size:1rem;transition:background-color .3s ease;&:hover{background-color:#0056b3}}@media screen and (max-width:768px){#mediaDialog{width:100%;max-width:100%}#mediaDialog img{width:100%;height:auto}.media-grid{padding:0}}