.album{display:grid;grid-template-columns:auto 1fr;margin:2rem;width:calc(100vw - 4rem);height:calc(100vh - 4rem);background-color:#fff;border-radius:1rem;background-color:#222;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;animation:album__show__animation .25s ease-out;overscroll-behavior:contain}@media screen and (max-width:768px){.album{grid-template-columns:1fr;width:calc(100vw);height:calc(100vh);margin:0;border-radius:0}}body:has(.album){overflow:hidden}@keyframes album__show__animation{0%{opacity:0;transform:scale(.1)}to{opacity:1;transform:scale(1)}}.album__image{margin:1rem;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.album__image img{position:absolute;width:auto;height:100%;object-fit:contain;background-color:#222}.album__previews{display:flex;flex-direction:column;padding:3px 1rem;margin:1rem 0;width:min-content;overflow-x:auto;gap:1rem;overscroll-behavior:contain}.album__preview{width:200px;height:auto;flex-shrink:0;filter:brightness(.75);transition:filter .25s ease-in-out;cursor:pointer}.album__preview:hover{filter:brightness(1)}.album__preview--selected{outline:3px solid #fff;filter:brightness(1)}.album__image__controls{position:absolute;width:100%;display:flex;justify-content:space-between}@media screen and (hover:none) and (max-width:768px){.album__image__controls{display:none}}.album__image__controls svg{width:20rem;height:20rem;cursor:pointer;opacity:.2;transition:opacity .25s ease-in-out}.album__image__controls svg:hover{opacity:1}.album__image__controls svg path{fill:#fff}.album__close{position:absolute;top:1rem;right:2rem;cursor:pointer;height:3rem;display:flex;align-items:center;background:none;border:none;margin:0;color:#fff;background-color:#222;padding:.5rem 1rem .5rem .5rem;transition:opacity .25s ease-in-out,background-color .25s ease-in-out,color .25s ease-in-out}.album__close:hover{opacity:1;color:#fff;background-color:#000}.album__close svg{width:3rem;height:3rem}.album__close svg path{transition:fill .25s ease-in-out;fill:#fff}.album__close:hover svg path{fill:#fff}.hamburger-menu-icon{display:none;width:2.5rem;height:2.5rem}.hamburger-menu-icon svg path{fill:var(--border-color);opacity:.8}@media (max-width:768px){.hamburger-menu-icon{display:block}}