*{
  box-sizing:border-box;
}

body{
  margin:0;
  background:#050505;
  color:white;
  font-family:Arial,sans-serif;
  overflow:hidden;
}

.panel{
  width:100vw;
  height:100vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:30px;
}

.logo-small{
  width:220px;
  margin-bottom:20px;
}

h1{
  font-size:42px;
  margin-bottom:25px;
}

#playlistContainer{
  width:80%;
  max-width:900px;
  max-height:300px;
  overflow-y:auto;
  margin-bottom:30px;
}

.video-button{
  width:100%;
  padding:20px;
  margin-bottom:12px;
  border:none;
  border-radius:12px;
  font-size:22px;
  cursor:pointer;
  background:white;
  color:black;
  text-align:left;
}

.video-button:hover{
  background:#dddddd;
}

button{
  padding:18px 35px;
  font-size:22px;
  border:none;
  border-radius:12px;
  cursor:pointer;
  background:white;
  color:black;
}

#playerBox{
  width:720px;
  height:405px;
  margin-top:30px;
  background:#111;
}

.logo-mode{
  display:none;
  width:100vw;
  height:100vh;
  background:#050505;
  align-items:center;
  justify-content:center;
  position:relative;
}

.logo-big{
  max-width:65vw;
  max-height:65vh;
}

#closeBtn{
  position:absolute;
  top:25px;
  right:25px;
  background:rgba(255,255,255,0.9);
  color:black;
  font-size:26px;
  padding:14px 22px;
  border-radius:50%;
  opacity:0;
  pointer-events:none;
  transition:opacity 0.3s ease;
}

.logo-mode.show-close #closeBtn{
  opacity:1;
  pointer-events:auto;
}