body {
      background-color: #000;
      color: #fff;
      font-family: 'Courier New', Courier, monospace;
    }
	

	.poster {
	  max-width: 100%;
	  max-height: 75vh;
	  height: auto;
	  width: auto;
	  display: block;
	  margin-left: auto;
	  margin-right: auto;
	}
	
	
    .hero {
      position: relative;
      width: 100%;
      height: 100vh;
      overflow: hidden;
    }
    .hero video {
      position: absolute;
      top: 0;
      left: 0;
      min-width: 100%;
      min-height: 100%;
      object-fit: cover;
      z-index: -1;
    }
    .hero .overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.4);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      padding: 20px;
    }


    .highlight {
      color: #ff0033;
    }
	
	.highlight-red-rules {
      color: #ff0033;
      text-shadow: 0 0 10px #ff0033;
      user-select: none;
    }

	.hero-subtitle {
	  color: rgba(255, 255, 255, 0.8);
	}
	
	.btn-outline-light {
	  border-color: #fff;
	  color: #fff;
	  font-weight: bold;
	  opacity: 0.5;
	}

	.btn-outline-light:hover {
	  background-color: #ff0033;
	  color: #fff;
	  opacity: 1;
	}
	
	.btn-outline-lighter {
	  border-color: #fff;
	  color: #fff;
	  font-weight: bold;
	}

	.btn-outline-lighter:hover {
	  border-color: #f00;
	  color: #f00;
	  box-shadow: 0px 0px 15px rgba(255, 0, 0, 0.8);
	  text-shadow: 0px 0px 5px #ff0000;
	  transition: box-shadow 0.5s ease, text-shadow 0.5s ease, border-color 0.5s ease, color 0.5s ease, background 0.5s ease;
	  background: rgba(255, 0, 0, 0.2);
	}
	
	.btn-outline-strong {

	  font-weight: bold;
	  border-color: #f00;
	  color: #f00;
	  
	}

	.btn-outline-strong:hover {
	  border-color: #fff;
	  color: #fff;
	  background-color: #ff0033;
	  opcatiy: 1 !important;
	}
	
	.section-neon {
		background: rgba(255, 0, 153, 0.2);
		border-top: 2px solid #ff0099;
		border-bottom: 2px solid #ff0099;
		box-shadow: 0px 0px 15px rgba(255, 0, 153, 0.6);
	}
	
	.section-red-border {
		background: rgba(255, 0, 0, 0.1);
		border-top: 2px solid #ff0000;
		border-bottom: 2px solid #ff0000;
		box-shadow: 0px 0px 25px rgba(255, 0, 0, 0.8);
	}
	
	.highlight-red {
	  position: relative;
	  left: 50%;
	  transform: translateX(-50%);
	  width: 100vw;
	  margin-left: 0 !important;
	  margin-right: 0 !important;
	  padding: 0.5rem 0;
  
		color: #880033;
		background: rgba(255, 0, 0, 0.15);
		border-top: 2px solid #880033;
		border-bottom: 2px solid #880033;
		box-shadow: 0px 0px 15px rgba(255, 0, 0, 0.5);
		text-shadow: 0px 0px 5px #ff0000;
		
		  user-select: none;
		  -webkit-user-select: none;
		  -moz-user-select: none;
		  -ms-user-select: none;
	}
	
	.highlight-red.active {
	  border-top: 2px solid #ff0000;
	  border-bottom: 2px solid #ff0000;
	  box-shadow: 0px 0px 40px rgba(255, 0, 0, 1);
	  text-shadow: 0 0 10px #ff0000, 0 0 20px #ff0033;
	  color: #ff0033;
	  background: rgba(255, 0, 0, 0.3);
	  transition: box-shadow 0.3s ease, text-shadow 0.3s ease, background 0.3s ease, color 0.3s ease;
	  cursor: default;
	  animation: flickerBurst 6s infinite ease-in-out;
	}	
	
	.highlight-red:hover {
	  box-shadow: 0px 0px 40px rgba(255, 0, 0, 1);
	  text-shadow: 0 0 10px #ff0000, 0 0 20px #ff0033;
	  background: rgba(255, 0, 0, 0.3);
	  transition: box-shadow 0.3s ease, text-shadow 0.3s ease, background 0.3s ease;
	  cursor: default;
	  animation: flickerBurst 6s infinite ease-in-out;
	}	

	.section-red {
		background: rgba(255, 0, 0, 0.15);
	}
	
    .section {
      padding: 40px 20px;
    }
    .footer {
      padding: 10px;
      text-align: center;
	  color: #666;
	  
	  	background: rgba(255, 0, 0, 0.2);
		border-top: 2px solid #ff0000;
		box-shadow: 0px 0px 25px rgba(255, 0, 0, 0.8);
    }
	
		.footer.active {
	  box-shadow: 0px 0px 40px rgba(255, 0, 0, 1);
	  text-shadow: 0 0 10px #ff0000, 0 0 20px #ff0033;
	  color: #fff;
	  background: rgba(255, 0, 0, 0.3);
	  transition: box-shadow 0.3s ease, text-shadow 0.3s ease, background 0.3s ease, color 0.3s ease;
	  cursor: default;
	  animation: flickerBurst 6s infinite ease-in-out;
	}	
	
	.red {
		color: #ff0033;
	}
	
    .logo-img {
      max-height: 40px;
    }
	
	.custom-link {
	  color: #ffffff;
	  text-decoration: none;
	  transition: color 0.3s ease, text-shadow 0.3s ease;
	}

	.custom-link:hover {
	  color: #ff0033;
	  text-shadow: 0 0 6px #ff0033;
	}
	
	.poster-img {
	  border-radius: 250px !important;
	}
	
	.judge-img {
	  border-radius: 15px;
	  box-shadow: 0 0 25px rgba(255, 0, 0, 0.5);
	  width: 100%;
	  height: auto;
	  max-height: 600px;
	  transition: box-shadow 0.3s ease, transform 0.3s ease;
	}

	.judge-img:hover {
	  box-shadow: 0 0 40px rgba(255, 0, 0, 0.9);
	  transform: scale(1.02);
	}
	
	.category-box {
	  background: rgba(255, 0, 0, 0.1);
	  border: 2px solid #ff0033;
	  border-radius: 12px;
	  box-shadow: 0 0 25px rgba(255, 0, 0, 0.5);
	  transition: transform 0.3s ease, box-shadow 0.3s ease;
	}

	.category-box:hover {
	  transform: scale(1.02);
	  box-shadow: 0 0 35px rgba(255, 0, 0, 0.9);
	}
	
	.sub-highlight-red {
	  color: #ff0033;
	  text-shadow: 0 0 3px rgba(255, 0, 0, 0.5);
	  font-weight: bold;
	  font-size: 1.25rem;
	  margin-bottom: 1rem;
	}
	.cassette-animate {
	  animation: floatCassette 3s ease-in-out infinite;
	  transition: transform 0.3s ease, filter 0.3s ease;
	}

	.cassette-animate:hover {
	  transform: scale(1.05);
	  filter: drop-shadow(0 0 15px #ff0033);
	}

	@keyframes floatCassette {
	  0%   { transform: translateY(0px); }
	  50%  { transform: translateY(-10px); }
	  100% { transform: translateY(0px); }
	}
	
	
	.footer.active img {
	  animation: spinCassette 2s linear infinite;
	  filter: drop-shadow(0 0 5px #ff0033);
	}



	@keyframes spinCassette {
	  0% { transform: rotate(0deg); }
	  100% { transform: rotate(360deg); }
	}
	
	@keyframes flickerBurst {
	  0%, 95%, 100% {
		text-shadow: 0 0 5px #ff0033;
		opacity: 1;
	  }

	  1%   { text-shadow: 0 0 12px #ff0033; opacity: 0.8; }
	  2%   { text-shadow: 0 0 3px #ff0033; opacity: 0.95; }
	  3%   { text-shadow: 0 0 14px #ff0033; opacity: 0.7; }
	  4%   { text-shadow: 0 0 6px #ff0033; opacity: 1; }
	  5%   { text-shadow: 0 0 11px #ff0033; opacity: 0.9; }
	  6%   { text-shadow: 0 0 2px #ff0033; opacity: 1; }

	  /* 7%–95% is calm period */
	}

		.sponsor-logo {
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  padding: 10px;
		  height: 100%; /* Ensure the container fills the grid cell vertically */
		}

		.sponsor-logo img {
		  max-height: 120px;
		  max-width: 200px;
		  width: auto;
		  height: auto;
		}

		.sponsor-logo img:hover {
		  transform: scale(1.2);
		  filter: brightness(1.3) saturate(1.3) contrast(1.1) drop-shadow(0 0 15px #ff0033);
		}

		.sponsor-logo.vip img {
		  filter: drop-shadow(0 0 15px #ff0033);
		}

		.sponsor-logo.vip img:hover {
		  filter: drop-shadow(0 0 25px #ff0033);
		}
		
		@media (max-width: 576px) {
		  .sponsor-logo img {
			max-width: 150px;
			max-height: 100px;
		  }
		}
		  
		  
		  .lang-switch {
		  border: 1px solid #ff0033;
		  border-radius: 20px;
		  padding: 4px 12px !important;
		  font-weight: bold;
		  transition: all 0.3s ease;
		}
		
		

		.lang-switch:hover {
		  background: #ff0033;
		  color: #fff !important;
		  box-shadow: 0 0 10px #ff0033;
		}
		
		

	.video-container {
	  width: 100%;
	  height: 50vh;
	  background: #000;
	  overflow: hidden;
	  position: relative;
	}

	.video-container video {
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  height: 100%;
	  width: auto;
	  transform: translate(-50%, -50%);
	  object-fit: cover;
	}
    pre {
      white-space: pre-wrap;
      word-break: break-word;
	    font-size: 1.1rem;
		line-height: 1.6;
    }
	.red-bold {
	  color: #ff0033;
	  font-weight: bold;
	}
