body {

    margin: 0;

    background-image:
        url('/media/fon/FON.gif');

    background-size: cover;

    background-position: center;

    background-attachment: fixed;

    background-repeat: no-repeat;

    font-family:  
"Segoe UI Emoji",
"Noto Color Emoji",
        Arial,
        sans-serif;

    color: white;
}



#albumsBar {

    position: sticky;

    top: 0;

    z-index: 999;

    display: flex;

    gap: 15px;

    overflow-x: auto;

    padding: 20px;

    background: rgba(0,0,0,0.7);

    backdrop-filter: blur(10px);
}



.albumButton {

    border: none;

    background: rgba(255,255,255,0.15);

    color: white;

    padding: 12px 20px;

    border-radius: 999px;

    cursor: pointer;

    white-space: nowrap;
}



.albumSection {

    display: none;

    grid-template-columns:
        repeat(auto-fill,minmax(180px,1fr));

    gap: 18px;

    padding: 20px;
}



.albumSection.active {

    display: grid;
}


.videoPreview {

    width: 100%;

    aspect-ratio: 16/9;

    object-fit: cover;

    border-radius: 20px;

    cursor: pointer;

    display: block;

    background: black;
}


.videoTitle {

    margin-top: 8px;

    color: white;

    text-shadow: 0 0 10px black;

    line-height: 1.3;

}



.videoContainer video {

    width: 100%;

    margin-top: 15px;

    border-radius: 20px;
}



#upArrow,
#downArrow {

    width: 120px;
    height: 120px;

    position: fixed;

    right: 20px;

    z-index: 99999;

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    cursor: pointer;
}



#upArrow {

    top: 20px;

    background-image:
        url('/media/arrows/up-white.gif');
}



#downArrow {

    bottom: 20px;

    background-image:
        url('/media/arrows/down-white.gif');
}

#videoModal {

    position: fixed;

    inset: 0;

    background: rgba(0,0,0,0.9);

    display: none;

    justify-content: center;

    align-items: center;

    z-index: 999999;
}



#videoModal.active {

    display: flex;
}



#videoModalContent {

    width: 90%;

    max-width: 1200px;
}



#videoModal video {

    width: 100%;

    max-height: 90vh;

    border-radius: 12px;

    background: black;
}