ニコニコ動画の再生画面をYouTubeっぽく使いやすく！

/* ニュース非表示 */
.MainContainer-marquee{
    display:none;
}

/* プレミアム登録催促バナー非表示 */
.VideoOverlayContainer *{
    display:none;
}

/* 動画サイズレスポンシブに */

.PlayerContainer > .VideoContainer{
    width:auto;
    height:100%;
    aspect-ratio:16/9;
}

@media screen and (min-width: 1286px) and (min-height: 590px){
    body.is-autoResize:not(.is-fullscreen) .VideoContainer{
        width:auto;
        height:100%;
        aspect-ratio:16/9;
    }
}

@media screen and (min-width: 1392px) and (min-height: 650px) {
    body.is-autoResize:not(.is-fullscreen) .VideoContainer{
        width:auto;
        height:100%;
        aspect-ratio:16/9;
}
}

/* Youtube風なレイアウトに */

.MainContainer{
    margin-top:3em;
}

.WatchAppContainer-main{
     display:flex;
     flex-direction:column;
}

@media screen and (min-width: 1736px) and (min-height: 850px),screen and (min-width: 1392px) and (min-height: 650px),screen and (min-width: 1286px) and (min-height: 590px){
    body.is-autoResize .WatchAppContainer-main{
        display:flex;
        flex-direction:column;
    }
}

.HeaderContainer{
    display:flex;
    flex-direction:column;
    order:1;
    padding:0;
}

.BottomContainer{
    order:2;
}

/* タイトル 投稿者&コメ　並び替え*/

.HeaderContainer-topArea{
    order:2;
}
.HeaderContainer-row{
    order:3;
}

.TagContainer{
    order:1;
}
.VideoDescriptionContainer{
    order:4;
}


/* コメントをレスポンシブに */

@media screen and (max-width: 1286px) {
.MainContainer-playerPanel{
    position:relative;
    width:100%;
    height:25vh;
}
.MainContainer-player{
    width:100%
}
}

/* 下部レスポンシブ */
@media screen and (max-width: 1286px) {
    .BottomContainer-main{
        flex-direction:column;
    }
    .BottomSideContainer{
    width:100%
    }
    .BottomMainContainer{
    padding-right:initial;
    }
    .BottomContainer {
    width:100%;
    }
    .VideoGenreMeta,.GenreRankMeta{display:none}
    .MainContainer{
        margin-top:0;
    }
}
.FooterContainer{
    min-width:initial;
}
.FooterContainer-informationInner{
    width:100%;
}
.FooterContainer-additionalsInner{
    width:100%;
}

/* その他調整 */
body,html{
    min-width:initial;
}

.WatchAppContainer-main{
    width:100%;
　　max-width:1920px;
}

@media screen and (min-width: 1736px) and (min-height: 850px){
    body.is-autoResize .WatchAppContainer-main{
        width:min(80vw,1920px)
    }
}

.nico-CommonHeaderRoot .common-header-h0l8yl{
    max-width:initial;
    min-width:initial;
    width:clamp(100px,100%,1024px);
}

.VideoDescriptionContainer{
    width:100%;
}
.BottomContainer{
    margin-top:3em
}
.baselayout{
    overflow:hidden;
}