.modal-backdrop{z-index:1000;background-color:#000000bf;justify-content:center;align-items:center;width:100vw;height:100vh;padding:2rem;display:flex;position:fixed;top:0;left:0}.modal-content{background-color:#fff;border-radius:8px;flex-direction:column;width:100%;max-width:1000px;max-height:90vh;display:flex;position:relative;overflow:hidden}.modal-close{cursor:pointer;color:var(--color-gray-500);z-index:10;background:0 0;border:none;font-size:1.5rem;font-weight:700;position:absolute;top:10px;right:15px}.modal-body{flex-direction:row;height:100%;max-height:90vh;display:flex}.modal-image-container{background-color:#000;flex:60%;justify-content:center;align-items:center;min-height:400px;display:flex;position:relative}.modal-image{object-fit:contain;max-width:100%;max-height:100%}.no-image{color:#fff}.nav-btn{cursor:pointer;background:#ffffffb3;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.2rem;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.prev-btn{left:10px}.next-btn{right:10px}.image-counter{color:#fff;background:#00000080;border-radius:12px;padding:4px 8px;font-size:.8rem;position:absolute;bottom:10px;right:10px}.modal-sidebar{border-left:1px solid var(--color-gray-200);background-color:#fff;flex-direction:column;flex:40%;display:flex}.modal-header{border-bottom:1px solid var(--color-gray-200);align-items:center;padding:1rem;display:flex}.profile-info{align-items:center;gap:10px;display:flex}.profile-pic{background-color:var(--color-gray-300);border-radius:50%;width:32px;height:32px}.profile-name{font-size:.9rem;font-weight:700}.modal-description{white-space:pre-wrap;flex-grow:1;padding:1rem;font-size:.9rem;line-height:1.5;overflow-y:auto}.modal-footer{border-top:1px solid var(--color-gray-200);padding:1rem}.post-date{color:var(--color-gray-500);font-size:.8rem}@media (max-width:768px){.modal-body{flex-direction:column}.modal-image-container{flex:none;height:50vh;min-height:auto}.modal-sidebar{flex:none;height:40vh}}.global-nav-btn{color:#fff;cursor:pointer;z-index:1010;opacity:.7;text-shadow:0 0 10px #00000080;background:0 0;border:none;padding:1rem;font-size:3rem;transition:opacity .2s;position:absolute;top:50%;transform:translateY(-50%)}.global-nav-btn:hover{opacity:1}.global-prev-btn{left:20px}.global-next-btn{right:20px}@media (max-width:768px){.global-nav-btn{padding:.5rem;font-size:2rem}.global-prev-btn{left:5px}.global-next-btn{right:5px}}