body {
  font-family: Arial, sans-serif;
  margin: 0; padding: 0;
  background: linear-gradient(270deg, #fbc2eb, #a6c1ee, #fbc2eb);
  background-size: 600% 600%;
  animation: bgFlow 20s ease infinite;
  overflow-x: hidden;
  position: relative;
}

.container {display: flex; position: relative;}


.left-panel{
  width: 300px;                 /* chiều rộng cố định */
  height: 100vh;                /* chiều cao cố định */
  /*background: url("danhsach.png") no-repeat center center;*/
  box-sizing: border-box;
  position: relative;
  overflow: hidden;           /* ẩn tràn nếu có */
}

.left-panel .bg {
  position: absolute;
  top: 4px;
  left: 2px;
  bottom: 4px;
  right: 0;
  z-index: -1;
}
.left-panel .bg .h {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background-repeat: no-repeat;
  background-size: 100% 80px;
  background-position: center bottom;
  background-image: url(data:image/png;base64,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);
}
.left-panel .bg .b {
  position: absolute;
  z-index: 0;
  top: 80px;
  bottom: 80px;
  left: 0;
  width: 100%;
  background-repeat: repeat-y;
  background-size: 100%;
  background-image: url(data:image/png;base64,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);
}

.left-panel .bg .b:before {
  display: block;
  content: '';
  position: absolute;
  top: 0px;
  bottom: -20px;
  left: 25px;
  background: #fff;
  right: 25px;
  border-radius: 25px;
  background: rgba(158, 94, 75, 7.2);
  background: linear-gradient(0deg,rgba(158, 94, 75, 0.3) 0%, rgba(158, 94, 75, 0.08) 100%);
}

.left-panel .bg .f {
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background-repeat: no-repeat;
  background-size: 100% 80px;
  background-position: center bottom;
  background-image: url(data:image/png;base64,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);
}


.right-panel {
  flex: 1; padding: 20px; position: relative;
}
.candy-container {
  display: grid; grid-template-columns: repeat(10, 1fr); gap: 16px; justify-items: center; margin: 20px 0;
}



.candy {
  width: 60px; height: 60px; border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff8, #ff9a9e);
  display: flex; align-items: center; justify-content: center;
  font-weight: bold; cursor: pointer; font-size: 24px;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.8), inset 0 0 10px rgba(255, 200, 200, 0.6);
  animation: bounceCandy 2s infinite ease-in-out;
  position: relative; overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s;
}
.candy:hover { transform: scale(1.1); }
.hidden {display: none;}
.popup-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(0,0,0,0.6); display: none; justify-content: center; align-items: center; z-index: 1000;
}
.popup {
  background: #fff;
  border-radius: 15px;
  padding: 25px;
  width: 80%;
  height: 80%;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3);
  font-size: 26px;
}
#options{
  color: blue;
}
.option {
  margin: 10px; padding: 12px;
  border: 1px solid #ccc; border-radius: 12px; cursor: pointer;
  transition: all 0.3s; text-align: center; background: #fff;
}
.option:hover { background: #f0f0f0; transform: scale(1.05); }
.option.correct {background: lightgreen; color: #000; font-weight: bold;}
.option.wrong {background: #ccc; color: #000;}
#timer {font-size: 18px; font-weight: bold; margin: 10px;}
#score {font-size: 18px; margin-top: 10px;}
#nextBtn {margin-top: 15px; padding: 10px 25px; border: none; border-radius: 12px; background: orange; font-weight: bold; cursor: pointer; box-shadow: 2px 2px 8px rgba(0,0,0,0.2);}
#studentList {
  list-style: none;
  padding-left: 25px;
  margin: 0 20px 0 0;
  max-height: calc(100vh - 170px);
  overflow-y: auto;         /* có scroll dọc */}
#studentList li {
  padding: 8px 0 8px 12px;
  margin: 0;
  border-bottom:1px solid #ddd; cursor: pointer
}
#studentList li:hover {
  background: rgba(255,255,255,0.3);
}
#top3 {
  position: absolute; top: 0px; right: 0px;
  width: 160px;
  height: 130px;
  background: url("top3.png") no-repeat center center;
  background-size: contain;  /* để ảnh co vừa khung */
  padding: 30px 20px 20px 20px; /* chừa khoảng trống bên trong để hiển thị danh sách */
  text-align: left;
}
#top3 h3 {margin:0 0 5px 0; font-size:16px;
  text-align: center}
#top3 ul {list-style:none; padding-left:0; margin-top: 50px;text-align: center;color: white}
#top3 ul li {margin-bottom:5px;}

/* Hiệu ứng sao rơi */
@keyframes starFall {
  0% {transform: translateY(-20px); opacity: 0;}
  50% {opacity: 1;}
  100% {transform: translateY(100vh); opacity: 0;}
}
.star {
  top: 0;
  position: fixed; width: 6px; height: 6px; background: white; border-radius: 50%; opacity:0;
  animation-name: starFall; animation-timing-function: linear; animation-iteration-count: infinite;
}


/* Kẹo nhảy nhẹ liên tục */
@keyframes bounceCandy {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-6px) scale(1.05); }
}

.candy:hover { transform: scale(1.15); }

/* Hiệu ứng lấp lánh ánh sáng */
@keyframes sparkle {
  0% { opacity: 0; transform: translate(-10px, -10px) scale(0.5); }
  50% { opacity: 1; transform: translate(30px, 30px) scale(1.2); }
  100% { opacity: 0; transform: translate(60px, 60px) scale(0.5); }
}



/* Nền chuyển động */
@keyframes bgFlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Kẹo nhảy */
@keyframes bounceCandy {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-8px) scale(1.1); }
}


.candy:hover {
  transform: scale(1.2);
  box-shadow: 0 0 20px #ff7eb3, 0 0 40px #ff758c, 0 0 60px #ff5277;
}

/* Hiệu ứng lấp lánh ✨ */
@keyframes sparkle {
  0% { opacity: 0; transform: translate(-10px, -10px) scale(0.5); }
  50% { opacity: 1; transform: translate(20px, 20px) scale(1.3); }
  100% { opacity: 0; transform: translate(50px, 50px) scale(0.5); }
}
.candy::after {
  /* content: "✨";
   position: absolute;*/
  font-size: 18px;
  top: 5px; left: 5px;
  opacity: 0;
  animation: sparkle 3s infinite;
}

/* Viền neon chạy quanh kẹo */
@keyframes neonRotate {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.candy::before {
  content: "";
  position: absolute;
  width: 80px; height: 80px;
  border: 3px solid transparent;
  border-top: 3px solid #ff758c;
  border-right: 3px solid #ff7eb3;
  border-radius: 50%;
  top: -10px; left: -10px;
  animation: neonRotate 4s linear infinite;
}
@keyframes candyDisappear {
  0% { transform: scale(1); opacity: 1; }
  100% { transform: scale(0.1); opacity: 0; }
}
.candy.disappear {
  animation: candyDisappear 0.5s forwards;
}
.tenlop {
  display: flex;
  justify-content: center; /* căn giữa ngang */
  align-items: center;     /* căn giữa dọc */
  gap: 10px;               /* khoảng cách giữa các h2 */
  padding-bottom: 40px;
  padding-top: 30px;
}
.danhsach {
  display: flex;
  justify-content: center; /* căn giữa ngang */
  align-items: center;     /* căn giữa dọc */

}

.tenlop h2 {
  margin: 0;
  padding: 0;
  font-size: 24px;
}
#studentNameInput{
  width: 120px;
}
.sodapan{
  border: 1px solid;
  padding: 10px;
  border-radius: 6px;
  color: black;
  margin-bottom: 10px;
}








#welcomeScreen {
  position: fixed;
  top: 0; left: 0; width: 100%; height: 100%;
  background: linear-gradient(135deg, #ffecd2, #fcb69f);
  display: flex; justify-content: center; align-items: center;
  z-index: 2000;
}
.welcome-content {
  text-align: center;
  background: rgba(255,255,255,0.95);
  padding: 40px;
  border-radius: 20px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}
#welcomeScreen h1 {
  margin-bottom: 20px;
  font-size: 28px;
  color: #333;
}
#welcomeScreen button {
  padding: 12px 30px;
  border: none;
  border-radius: 12px;
  background: #ff7eb3;
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  cursor: pointer;
  box-shadow: 0 5px 15px rgba(0,0,0,0.2);
  transition: transform 0.2s;
}
#welcomeScreen button:hover {
  transform: scale(1.1);
}
.hidden { display: none; }
.inp.neon {
  background: linear-gradient(180deg,#fff,#fff);
  color: #222;
  border: 2px solid rgba(0,0,0,0.06);
  padding: 12px 14px;
  border-radius: 12px;
  transition: box-shadow .18s, border-color .12s;
}
.inp.neon:focus {
  border-color: #ff7eb3;
  box-shadow: 0 0 18px rgba(255,126,179,0.18), 0 0 36px rgba(124,58,237,0.06);
}
.inp.neon::placeholder { color: #bbb; }

.btn{
  margin-left:6px; padding:10px 20px; 
  border:none; border-radius:12px; 
  background:#0084FF; color:#fff; 
  font-weight:bold; cursor:pointer; 
  box-shadow:2px 2px 8px rgba(0,0,0,0.2);
}
.btn1{
  margin-top:15px; padding:10px 20px; 
  border:none; border-radius:12px; 
  background:red; color:#fff; 
  font-weight:bold; cursor:pointer; 
  box-shadow:2px 2px 8px rgba(0,0,0,0.2);
}
.gt{
	font-size: 34px;
	 font-weight:bold
}
.candy {
  opacity: 0;
  transform: scale(0.5);
  transition: all 0.5s ease;
}

.candy.show {
  opacity: 1;
  transform: scale(1);
}
/* Màn hình chào mừng */
#welcomeScreen {
  position: fixed;
  top:0; left:0; right:0; bottom:0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: linear-gradient(135deg, #74ebd5, #ACB6E5);
  font-family: "Poppins", sans-serif;
  text-align: center;
  color: #fff;
  transition: opacity 1s ease;
  z-index: 1000;
  overflow: hidden;
}

/* Logo góc trên phải */
#welcomeScreen .logo {
  position: absolute;
  top: 15px;
  right: 25px;
  flex-direction: column; /* thêm dòng này để xuống dòng */
  align-items: flex-end;  /* căn phải */
  align-items: center;
  gap: 10px;
  animation: slideInRight 1.2s ease;
}

#welcomeScreen .logo img {
  width: 50px;
  height: 50px;
}

#welcomeScreen .logo span {
  font-size: 1.4em;
  font-weight: bold;
  color: #fff;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.3);
}

/* Tiêu đề */
#welcomeScreen .title {
  font-size: 2.5em;
  font-weight: 700;
  margin-bottom: 30px;
  animation: slideDown 1.2s ease;
  text-shadow: 3px 3px 6px rgba(0,0,0,0.4);
}

/* Nút bắt đầu */
#welcomeScreen button {
  padding: 15px 40px;
  font-size: 1.2em;
  font-weight: bold;
  border: none;
  border-radius: 50px;
  background: #ff9800;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 6px 15px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  animation: fadeIn 2s ease;
}

#welcomeScreen button:hover {
  background: #ffb84d;
  transform: scale(1.05);
  box-shadow: 0 8px 18px rgba(0,0,0,0.4);
}

/* Hiệu ứng khi biến mất */
#welcomeScreen.fadeOut {
  opacity: 0;
  pointer-events: none;
}

/* Keyframes */
@keyframes slideDown {
  from {transform: translateY(-100px); opacity: 0;}
  to {transform: translateY(0); opacity: 1;}
}

@keyframes slideInRight {
  from {transform: translateX(100px); opacity: 0;}
  to {transform: translateX(0); opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}
/* Gradient động cho welcome screen */
#welcomeScreen {
  background: linear-gradient(135deg, #74ebd5, #ACB6E5, #fbc2eb, #a6c1ee);
  background-size: 400% 400%;
  animation: gradientMove 10s ease infinite;
}

/* Hiệu ứng gradient chạy */
@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Tiêu đề ánh sáng chạy qua */
#welcomeScreen .title {
  position: relative;
  overflow: hidden;
}
#welcomeScreen .title::after {
  content: "";
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.8), transparent);
  animation: shine 3s infinite;
}
@keyframes shine {
  0% { left: -100%; }
  50% { left: 100%; }
  100% { left: 100%; }
}

/* Nút Start rung nhẹ */
#welcomeScreen button {
  animation: bounce 2s infinite;
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
  40% { transform: translateY(-6px); }
  60% { transform: translateY(-3px); }
}

/* Khi biến mất: zoom out + fade */
#welcomeScreen.fadeOut {
  opacity: 0;
  transform: scale(1.2);
  transition: opacity 1s ease, transform 1s ease;
}

