@charset "UTF-8";header{justify-content:space-between;font-family:Noto Sans JP,Noto Sans KR,sans-serif}header .search-connection-details{width:65%}header,header section{align-items:center;gap:var(--padding);display:flex}.search-container{position:relative;flex-grow:1}.search-container i{position:absolute;top:50%;transform:translateY(-50%);left:var(--padding);color:var(--color-paper);font-size:var(--icon-button-md)}.search-container input{background-color:var(--color-card);border:1px solid var(--color-border);padding:calc(var(--padding) * 2);padding-left:calc(var(--padding) * 4);color:var(--color-paper);border-radius:var(--padding);width:100%}.connection-details{display:none;color:var(--color-primary);align-items:center;gap:var(--padding);border:1px solid var(--color-primary);padding:calc(var(--padding) / var(--dimension-magic)) var(--padding);border-radius:var(--padding);transition:font-size ease-in-out var(--duration)}.connection-details i.fa-play{font-size:var(--icon-button-md)}.connection-details p{display:flex;font-size:var(--font-size-xs);flex-direction:column;color:var(--color-border-transparent)}.connection-details p span a{color:var(--color-paper)}.notification-bell-button{border-radius:var(--rounded);padding:var(--padding);border:1px solid var(--color-border);font-size:var(--icon-button-md);background-color:var(--color-border);color:var(--color-paper);transition:background-color ease-in-out var(--duration),color ease-in-out var(--duration),border-color ease-in-out var(--duration)}.notification-bell-button:hover{border-color:transparent;background-color:var(--color-border-transparent);color:var(--color-primary)}.notification-bell-button:active{border-color:var(--color-primary);background-color:var(--color-primary);color:var(--color-background)}.notification-bell-button:hover:disabled,.notification-bell-button:active:disabled,.notification-bell-button:disabled,.notification-bell-button[disabled],.notification-bell-button[disabled]:hover,.notification-bell-button[disabled]:active{border-color:transparent!important;background-color:var(--color-border)!important;color:var(--color-border-transparent)!important}.avatar-profile-container img{border-radius:var(--rounded);object-fit:contain;object-position:center}@media not (max-width:720px){.connection-details{display:flex}.connection-details p{font-size:inherit}}@media not (max-width:1920px){header{grid-column:2/3}}.card{background-color:var(--color-card);padding:var(--padding);border:2px solid var(--color-border);border-radius:calc(var(--padding) * 2);font-family:Noto Sans JP,Noto Sans KR,sans-serif}.now-playing{grid-row:1/2;display:flex;flex-direction:column}.track-image-controller-container{display:grid;gap:var(--padding);grid-template-columns:repeat(4,1fr);flex-grow:1}.fallback-background{background-color:var(--color-background);width:100%;height:100%}.track-image{border-radius:var(--padding);border:1px solid var(--color-border);overflow:hidden;position:relative;grid-column:1/3;z-index:0}.track-image img{object-fit:contain;object-position:center;width:100%;height:100%}.now-playing-banner{display:flex;align-items:center;justify-content:center;background-color:var(--color-primary);border-radius:var(--padding);gap:var(--padding);padding:calc(var(--padding) / var(--dimension-magic)) calc(var(--padding) * var(--dimension-magic));position:absolute;font-size:var(--icon-button-xs);left:0;top:0}.now-playing-banner h3,.now-playing-banner i{color:var(--color-background)!important}.song-controller-container{grid-column:3/5;position:relative;display:flex;flex-direction:column;justify-content:space-between}.song-controller-container .floating-mute-button{position:absolute;right:0;top:0;padding:var(--padding);background-color:var(--color-border);border-radius:var(--rounded);font-size:var(--icon-button-md);color:var(--color-paper);transform:scale(1);transition:background-color ease-in-out var(--duration),color ease-in-out var(--duration),transform ease-in-out var(--duration)}.song-controller-container .floating-mute-button:hover{background-color:var(--color-border-transparent);transform:scale(1.1);color:var(--color-primary)}.song-controller-container .floating-mute-button:active{background-color:var(--color-primary);color:var(--color-border-transparent)}.song-controller-container .title-artist-container{flex-grow:1;padding:var(--padding);display:flex;flex-direction:column;justify-content:center;gap:calc(var(--padding) * 2)}.song-controller-container .title-artist-container h1{color:var(--color-paper);font-size:var(--font-size-lg)}.song-controller-container .title-artist-container h2{color:var(--color-primary);font-size:var(--font-size-md)}.song-controller-container .title-artist-container h1,.song-controller-container .title-artist-container h2{font-weight:var(--font-weight-standard)}.song-controller-container .title-artist-container .requester-details{display:flex;align-items:center;padding-block:var(--padding);gap:var(--padding)}.song-controller-container .title-artist-container .requester-details a img{border-radius:var(--rounded)}.song-controller-container .title-artist-container .requester-details p{color:var(--color-border-transparent)}.song-controller-container .title-artist-container .requester-details span{color:var(--color-paper)}.song-track-progress{padding:var(--padding)}.song-track-progress div{display:flex;align-items:center;justify-content:space-between}.song-track-progress .bar-line{height:16px;position:relative;border-radius:var(--rounded);background-color:var(--color-border);overflow:hidden}.song-controller-buttons{display:flex;align-items:center;justify-content:space-between}.song-controller-buttons [data-state],.song-controller-buttons .back,.song-controller-buttons .next{color:var(--color-paper);font-size:var(--icon-button-md);transition:color ease-in-out var(--duration)}.song-controller-buttons [data-state]:hover,.song-controller-buttons .back:hover,.song-controller-buttons .next:hover{color:var(--color-border-transparent)}.song-controller-buttons [data-state]:active,.song-controller-buttons .back:active,.song-controller-buttons .next:active{color:var(--color-primary)}.song-controller-buttons .play-pause{background-color:var(--color-background);border-radius:var(--rounded);font-size:var(--icon-button-lg)!important}.song-controller-buttons .play-pause:has([data-button-state=idle]){color:var(--color-border-transparent)}.song-controller-buttons .play-pause:has([data-button-state=playing]),.song-controller-buttons .play-pause:has([data-button-state=pause]){color:var(--color-primary)}.song-controller-buttons [data-state=off],.song-controller-buttons [data-state=on],.song-controller-buttons [data-state=one],.song-controller-buttons [data-state=queue]{position:relative}.song-controller-buttons [data-state=off] p,.song-controller-buttons [data-state=on] p,.song-controller-buttons [data-state=one] p,.song-controller-buttons [data-state=queue] p{position:absolute;font-size:.75rem;border:2px solid var(--color-background);border-radius:var(--rounded);color:var(--color-background);padding:calc(var(--padding) / 3 / 1.6) calc(var(--padding) / 3);background-color:var(--color-primary);top:var(--padding);left:var(--padding);-webkit-user-select:none;user-select:none;transition:color ease-in-out var(--duration),background-color ease-in-out var(--duration),opacity ease-in-out var(--duration)}.song-controller-buttons [data-state=on],.song-controller-buttons [data-state=one],.song-controller-buttons [data-state=queue]{color:var(--color-primary)}.song-controller-buttons [data-state=on],.song-controller-buttons .play-pause{transform:scale(1);transition:color ease-in-out var(--duration),transform ease-in-out var(--duration)}.song-controller-buttons [data-state=on]:hover,.song-controller-buttons .play-pause:hover{transform:scale(1.1);color:var(--color-primary)}.song-controller-buttons [data-state=on]:active,.song-controller-buttons .play-pause:active{color:var(--color-border-transparent)}@media not (max-width:1280px){.now-playing{grid-row:1/2}}.request-queue-item{padding:var(--padding);justify-content:space-between;position:relative;border-bottom:1px solid var(--color-border);transition:background-color ease-in-out var(--duration),border-radius ease-in-out var(--duration)}.request-queue-item[data-state]{background-color:transparent}.request-queue-item[data-state] .track-duration:after{content:attr(data-track-duration)}.request-queue-item[data-state] .playing-icon{display:none}.request-queue-item[data-state]:hover{background-color:var(--color-border);border-radius:var(--padding)}.request-queue-item[data-state]:active{background-color:var(--color-primary)}.request-queue-item[data-state=playing]{border-radius:var(--padding);background-color:color-mix(in srgb,var(--color-primary) 30%,transparent 20%)}.request-queue-item[data-state=playing] .track-duration:after{content:"▶ Now Playing"}.request-queue-item[data-state=playing] .track-duration:after,.request-queue-item[data-state=playing] .item-number,.request-queue-item[data-state=playing] .playing-icon{color:var(--color-primary)}.request-queue-item[data-state=playing] .playing-icon{display:block}.request-queue-item[data-state=playing] .track-more-options{display:none}.request-queue-item[data-state=playing]:hover{background-color:color-mix(in srgb,var(--color-primary) 50%,transparent 50%)}.request-queue-item .track-more-options,.request-queue-item .playing-icon{width:32px}.request-queue-item .track-more-options{color:var(--color-paper);transition:color ease-in-out var(--duration)}.request-queue-item .track-more-options:hover{color:var(--color-border-transparent)}.request-queue-item .track-more-options:active{color:var(--color-background)}.request-queue-item,.request-queue-item .request-details-container{display:flex;align-items:center}.item-number{width:32px}.request-details-container .track-image{border-radius:var(--padding);border:1px solid var(--color-border);transform:scale(1);transition:transform ease-in-out var(--duration)}.request-details-container .track-image:hover{transform:scale(1.1)}.track-artist-title-container{padding-inline:var(--padding)}.track-artist-title-container h2{color:var(--color-paper)}.track-artist-title-container p{color:var(--color-border-transparent)}.track-duration{font-size:.75rem}.track-duration:after{width:max-content;position:absolute;bottom:16px;right:calc(var(--padding) * 4)}.request-queue{display:flex;flex-direction:column;grid-row:2/3}.request-queue-header{padding:var(--padding)}.request-queue-header div{gap:var(--padding)}.request-queue-header div .request-queue-number{border-radius:var(--rounded);background-color:var(--color-primary);font-size:1rem;color:var(--color-background);width:32px;text-align:center}.request-queue-header button{color:var(--color-paper);padding:var(--padding);border:solid 1px var(--color-border);border-radius:var(--padding);transition:border-color ease-in-out var(--duration),color ease-in-out var(--duration)}.request-queue-header button:hover{border-color:var(--color-primary);color:var(--color-primary)}.request-queue-header button:active{border-color:var(--color-border-transparent);color:var(--color-border-transparent)}.request-queue-header button:hover:disabled,.request-queue-header button:active:disabled,.request-queue-header button:disabled,.request-queue-header button[disabled],.request-queue-header button[disabled]:hover,.request-queue-header button[disabled]:active{border-color:var(--color-border)!important;color:var(--color-border)!important}.request-queue-header,.request-queue-header div{display:flex;align-items:center;justify-content:space-between}.request-item-list-container{display:grid;grid-template-rows:repeat(12,1fr)}.request-a-song-button{margin-top:auto;background:var(--color-primary);padding:var(--padding);width:100%;border-radius:var(--padding);color:var(--color-background);font-size:1rem;display:flex;align-items:center;gap:var(--padding);justify-content:center}.request-a-song-button i{font-size:var(--icon-button-md);background-color:var(--color-background);color:var(--color-primary);border-radius:var(--rounded);padding:2px}.request-a-song-button:hover{background-color:var(--color-background);color:var(--color-primary)}.request-a-song-button:hover i{background-color:var(--color-primary);color:var(--color-background)}.request-a-song-button:active{background-color:var(--color-primary);color:var(--color-paper)}.request-a-song-button:active i{background-color:var(--color-paper);color:var(--color-primary)}.request-a-song-button:hover:disabled,.request-a-song-button:active:disabled,.request-a-song-button:disabled,.request-a-song-button[disabled],.request-a-song-button[disabled]:hover,.request-a-song-button[disabled]:active{background-color:var(--color-border)!important;color:var(--color-border-transparent)!important}.request-a-song-button:hover:disabled i,.request-a-song-button:active:disabled i,.request-a-song-button:disabled i,.request-a-song-button[disabled] i,.request-a-song-button[disabled]:hover i,.request-a-song-button[disabled]:active i{background-color:var(--color-border-transparent)!important;color:var(--color-border)!important}.request-a-song-button,.request-a-song-button i{transition:background-color ease-in-out var(--duration),color ease-in-out var(--duration)}.request-queue-header div .request-queue-number,.request-a-song-button{font-weight:var(--font-weight-standard)}@media not (max-width:1280px){.request-queue{grid-row:1/6}}.tutorial-item{flex-direction:column;border:1px solid var(--color-border);padding:var(--padding);gap:var(--padding);border-radius:var(--padding)}.tutorial-item .tutorial-image{flex-grow:1;position:relative;background:color-mix(in srgb,var(--color-background) 80%,var(--color-primary) 50%)}.tutorial-item .tutorial-image img{object-fit:contain;object-position:center;height:100%;width:100%;transform:scale(1);transition:transform ease-in-out var(--duration),border-radius ease-in-out var(--duration)}.tutorial-item .tutorial-image img:hover{transform:scale(1.05);border-radius:var(--padding)}.tutorial-item .tutorial-image p{gap:var(--padding);border-radius:var(--padding);padding:calc(var(--padding) / var(--dimension-magic));background-color:var(--color-background);color:var(--color-paper);position:absolute;bottom:var(--padding);right:var(--padding);-webkit-user-select:none;user-select:none}.tutorial-item p{gap:var(--padding)}.tutorial-item,.tutorial-item p,.tutorial-item p span{display:flex;font-size:var(--font-size-xs);color:var(--color-border-transparent)}.channel-tutorials{grid-row:3/4}.tutorial-avatar-details{gap:var(--padding)}.tutorial-avatar-details i{font-size:var(--icon-button-lg);color:var(--color-primary)}.tutorial-avatar-details div p{color:var(--color-border-transparent)}.tutorial-filter .tutorial-filter-button{display:block;padding-block:var(--padding);color:var(--color-paper)}.tutorial-filter ul{list-style:none;display:none;gap:var(--padding)}.tutorial-filter ul [data-selected=true]{border-color:var(--color-primary)!important;background-color:var(--color-primary)}.tutorial-filter ul [data-selected=true] button{color:var(--color-background)!important}.tutorial-filter ul button{text-transform:capitalize;color:var(--color-paper)}.tutorial-filter ul li,.tutorial-filter .tutorial-filter-button{border:1px solid var(--color-border);padding-inline:var(--padding);border-radius:var(--padding)}.tutorial-filter:has(.tutorial-filter-button[data-state=expanded]){position:relative}.tutorial-filter:has(.tutorial-filter-button[data-state=expanded]) ul{position:absolute;background-color:var(--color-background);padding:var(--padding);border:1px solid var(--color-border);border-radius:var(--padding);display:flex!important;top:calc(var(--padding) * 3);right:var(--padding);z-index:1}.tutorial-filter ul li,.tutorial-filter ul li button,.tutorial-filter .tutorial-filter-button{transition:color ease-in-out var(--duration),border-color ease-in-out var(--duration)}.tutorial-filter ul li:hover,.tutorial-filter ul li button:hover,.tutorial-filter .tutorial-filter-button:hover{color:var(--color-paper);border-color:var(--color-paper)}.tutorial-filter ul li:active,.tutorial-filter ul li button:active,.tutorial-filter .tutorial-filter-button:active{color:var(--color-primary);border-color:var(--color-primary)}.tutorial-filter ul li:hover:disabled,.tutorial-filter ul li:active:disabled,.tutorial-filter ul li:disabled,.tutorial-filter ul li[disabled],.tutorial-filter ul li[disabled]:hover,.tutorial-filter ul li[disabled]:active,.tutorial-filter ul li button:hover:disabled,.tutorial-filter ul li button:active:disabled,.tutorial-filter ul li button:disabled,.tutorial-filter ul li button[disabled],.tutorial-filter ul li button[disabled]:hover,.tutorial-filter ul li button[disabled]:active,.tutorial-filter .tutorial-filter-button:hover:disabled,.tutorial-filter .tutorial-filter-button:active:disabled,.tutorial-filter .tutorial-filter-button:disabled,.tutorial-filter .tutorial-filter-button[disabled],.tutorial-filter .tutorial-filter-button[disabled]:hover,.tutorial-filter .tutorial-filter-button[disabled]:active{color:var(--color-border)!important;border-color:var(--color-border)!important}.tutorials-header{justify-content:space-between;padding-block:var(--padding)}.tutorials-header,.tutorials-header .tutorial-avatar-details{display:flex;align-items:center}.tutorial-item-list{display:grid;grid-auto-flow:row;gap:var(--padding)}@media not (max-width:640px){.tutorial-item-list{grid-template-columns:repeat(2,1fr)}}@media not (max-width:1280px){.channel-tutorials{grid-row:2/7}.tutorial-filter ul{display:flex!important;position:inherit!important;background-color:transparent!important;padding:0!important;border:1px solid transparent!important;border-radius:0!important;top:0!important;right:0!important}.tutorial-filter-button{display:none!important}.tutorial-item-list{display:grid;grid-template-columns:repeat(3,1fr)}}@media not (max-width:1440px){.tutorial-item-list{grid-template-columns:repeat(4,1fr)}}.live-stat-card{display:flex;align-items:center;justify-content:space-between;background-color:color-mix(in srgb,var(--color-border) 10%,var(--color-paper) 1%);border-radius:calc(var(--padding) * 2);padding:var(--padding)}.live-stat-card i{color:var(--color-primary);width:var(--icon-dimension);font-size:var(--icon-button-md)}.live-stat-card div{display:grid}.live-stat-card div input{font-family:Noto Sans JP,Noto Sans KR,sans-serif;background-color:transparent;font-size:var(--font-size-md);color:var(--color-paper);max-width:calc(var(--icon-dimension) * 2)}.live-stat-card div label{font-family:Noto Sans JP,Noto Sans KR,sans-serif;color:var(--color-border-transparent);font-size:.75rem}.live-stats{position:fixed;z-index:2;bottom:var(--padding);left:var(--padding)}.live-stats h3{transition:max-height ease-in-out var(--duration),width ease-in-out var(--duration),opacity ease-in-out var(--duration)}.live-stats:has(.expand-button[data-livestatstate]) h3{max-height:0;width:0;-webkit-user-select:none;user-select:none;opacity:0}.live-stats:has(.expand-button[data-livestatstate]) .live-stats-cards-container{-webkit-user-select:none;user-select:none;opacity:0;display:none;max-height:0}.live-stats:has(.expand-button[data-livestatstate]) .expand-button{opacity:.5}.live-stats:has(.expand-button[data-livestatstate]) .expand-button:hover{opacity:1}.live-stats:has(.expand-button[data-livestatstate=expanded]) h3,.live-stats:has(.expand-button[data-livestatstate=expanded]) .live-stats-cards-container{max-height:max-content;width:max-content;display:grid;-webkit-user-select:text;user-select:text;opacity:1}.live-stats:has(.expand-button[data-livestatstate=expanded]) .expand-button{opacity:1}.expand-button{color:var(--color-primary);font-size:var(--icon-button-md);transition:opacity ease-in-out var(--duration)}.live-stats-cards-container{display:grid;margin-inline:auto;gap:var(--padding);grid-template-columns:repeat(2,1fr);transition:max-height ease-in-out var(--duration),width ease-in-out var(--duration),opacity ease-in-out var(--duration)}@media not (max-width:1280px){.live-stats{grid-row:6/7;display:block;position:inherit}.live-stats .expand-button{display:none!important}.live-stats h3,.live-stats .live-stats-cards-container{display:grid!important;max-height:max-content!important;width:max-content!important;-webkit-user-select:text!important;user-select:text!important;opacity:1!important}}.sidebar{display:none;border:2px solid var(--color-border);background-color:var(--color-card);border-radius:calc(var(--padding) * 2);padding:var(--padding)}.starting{display:flex;align-items:center;padding-block:calc(var(--padding) * 4)}.starting .presentation-typographies h3{font-size:var(--font-size-lg)}.starting .presentation-typographies h3 span{color:var(--color-primary)}.starting .presentation-typographies p{font-size:var(--font-size-xs)}.navigations{flex-grow:1;list-style:none;width:100%;display:flex;flex-direction:column;gap:var(--padding)}.navigations li{background-color:transparent;border-radius:var(--padding);transform:scale(1);transition:background-color ease-in-out var(--duration),transform ease-in-out var(--duration)}.navigations li a{text-decoration:none;font-size:var(--font-size-md)}.navigations li i,.navigations li a{color:var(--color-primary);transition:color ease-in-out var(--duration)}.navigations li:hover{transform:scale(1.1)}.navigations li[data-state=selected]{background-color:var(--color-primary)}.navigations li[data-state=selected] i,.navigations li[data-state=selected] a{color:var(--color-background)}.navigations li[data-state=selected] .link-item .floating-number{background-color:var(--color-background);color:var(--color-primary)}.ending{display:flex;flex-direction:column;gap:var(--padding);width:100%;border:2px solid var(--color-border);border-radius:calc(var(--padding) * 2);padding:var(--padding)}.ending img{width:100%;height:auto;object-position:center;object-fit:contain}.ending p{font-size:var(--font-size-md);display:flex;align-items:center;gap:var(--padding);flex-direction:column;color:var(--color-paper)}.ending p span{color:var(--color-border-transparent)}.ending .donate-button{display:flex;align-items:center;justify-content:center;gap:var(--padding);padding:var(--padding);font-size:var(--font-size-lg);border-radius:calc(var(--padding) * 2);color:var(--color-background);background-color:var(--color-primary);width:100%;transition:background-color ease-in-out var(--duration),color ease-in-out var(--duration)}.ending .donate-button:hover{background-color:var(--color-border-transparent);color:var(--color-primary)}.ending .donate-button:active{background-color:var(--color-primary);color:var(--color-paper)}.link-item{display:flex;align-items:center;gap:calc(var(--padding) * 2);padding:var(--padding);padding-inline:calc(var(--padding) * 4);position:relative}.link-item .floating-number{transition:background-color ease-in-out var(--duration),color ease-in-out var(--duration);position:absolute;right:var(--padding);border-radius:var(--rounded);padding:var(--padding) calc(var(--padding) * var(--dimension-magic));background-color:var(--color-primary);color:var(--color-background)}.starting .presentation-typographies,.ending p,.navigations li a,.donate-button{font-family:Noto Sans JP,Noto Sans KR,sans-serif}@media not (max-width:1920px){.sidebar{display:flex;flex-direction:column;align-items:center;grid-column:1/2;grid-row:1/3}}main{display:grid;min-height:100vh;background-color:var(--color-background);grid-template-columns:1fr;grid-template-rows:minmax(auto,max-content) 1fr}h3,p{color:var(--color-paper)}.cards-container{display:grid;height:100%;gap:var(--padding);grid-template-rows:minmax(240px,max-content) repeat(2,1fr)}header,.cards-container,.live-stats-cards-container{padding:var(--padding)}@media not (max-width:1280px){.cards-container{grid-template-columns:2fr 1fr;grid-template-rows:minmax(auto,max-content) repeat(5,1fr)}}@media not (max-width:1920px){main{grid-template-columns:minmax(auto,max-content) 1fr;grid-template-rows:minmax(auto,max-content) 1fr}}