X Max Theater Player Height + Auto-Hide Header by QuadraticForm

/* ==UserStyle==
@name         X Max Theater Player Height + Auto-Hide Header
@version      20250111.23.45
@namespace    https://userstyles.world/user/QuadraticForm
@description  Auto-Hide header and then expand the theater mode player to 100vh (100% viewport height).
@author       QuadraticForm
@license      No License
==/UserStyle== */

@-moz-document domain("youtube.com") {
/* 
When header auto-hide and float on hover,
player can extend to full viewport height,
without having to deduce height by header height
*/
#full-bleed-container {
    max-height: calc(100vh) !important;
    /* Other styling */
}

/*
Auto-hide youtube header for max vertical height.
Copied from the following source with minor modifications.

@name         Auto-Hide YouTube Search Bar
@namespace    USO Archive
@author       Satoru 0
@description  Simple auto hide for YT search bar. Shows on hover. Bar is smaller and somewhat transparent to take us less space on the screen    *Let me know if there's any issues.    https://gyazo.com/adae0917a9d4df8142566db07e0785c2
@version      20190501.16.50
@license      NONE
@preprocessor uso

*/

ytd-watch[theater] #player.ytd-watch {
    padding-top: 15px !important;
}

/* xuxing: rounded corner, shadow and border for top bar, make it prettier and stand out more*/
#background.ytd-masthead
{
    border-radius: 1000px;
    
    box-shadow: rgba(0, 0, 0, 0.5) 0px 22px 70px 4px;
    
    border-style: solid;
    border-width: thin;
    border-color: rgba(255, 255, 255, .5);
}

/* Initial Hidden State */
#masthead-container {
    z-index: 10000;
    top: 16px !important; /* xuxing: move this lower for larger area for mouse hover */
    opacity: 0;
    /*left: 10%;*/
    left: 2.5%;
    right: 0;
    /*width: 80% !important;*/
    width: 95% !important;
    position: relative;
    margin-right: -50%;
    transform: translate(-50%, 0%);
    transition: all 300ms ease;
}

/* Hover State */
#masthead-container:hover {
    opacity: 1;
    transition: all 300ms ease;
}

#masthead-container:not(:hover) {
    opacity: 0;
    transition: all 300ms ease;
}

ytd-page-manager {
    margin-top: -6px !important;
}

#contents.ytd-section-list-renderer > .ytd-section-list-renderer:not(:last-child):not(ytd-page-introduction-renderer):not([item-dismissed]).ytd-section-list-renderer {
    border-color: transparent;
}



}