html.header-pinned {
		scroll-padding-top: 60px;
	}
    mg-countdown {
      background: linear-gradient(135deg, var(--main-mg-countdown-bg-1), var(--main-mg-countdown-bg-2));
      text-align: center;
      padding: 4rem 2rem;
	  display: block;
	  display: flex;
      flex-direction: column;
      gap: 16px;
      justify-content: center;
      align-items: center;
	  overflow: hidden;
    }
	mg-countdown.launched {
		padding: calc(4rem + 17.5px) 2rem;
	}
    mg-countdown h1 {
      font-size: 3rem;
      margin-bottom: 0.5rem;
    }
    mg-countdown p {
      font-size: 1.25rem;
    }
    .section {
      padding: 2rem 2rem;
      max-width: 1600px;
      margin: 0 auto;
    }
    .section h1 {
      font-size: 3rem;
      margin-top: 0;
      margin-bottom: 2rem;
    }	
	.gradient-text {
      display: inline-block;
      color: transparent;
	  white-space: nowrap;
	  background: var(--main-countdown-grad);
      background-size: 200% 500%;
	  background-position: 0%;
      background-clip: text;
	  position: relative;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      font-size: 90px;
	  font-weight: 600;
	  letter-spacing: -2px;
	  margin-top: -20px;
	  -webkit-mask-image: linear-gradient(to bottom, transparent 100%, black 140%);
    }
	
	.gradient-tag {
      display: inline-block;
      font-size: 24px;
	  white-space: nowrap;
    }
	
	@keyframes gradientMove {
  0% {
    background-position: 0% 40%;
  }
  100% {
    background-position: 0% 100%;
  }
}


	
	.part {
	font-weight: 600;
	}
	
	.part .gradient-tag {
		font-size: 30px;
	}
	
	.part2 {
  z-index: 9999;
	}
	
	.part1 {
  opacity: 0;
	}
	
	.mg-count-head {
		transform: scale(2);
		opacity: 0;
	}
	
	.c-sep {
		transform: translateY(-7px);
	}
	
	.ini-colon {
		vertical-align: 7px;
	}
	
	.ini-cd {
		font-variant-numeric: tabular-nums;
		margin-bottom: 5px;
	}
	
	#countdown {
      display: flex;
      justify-content: center;
	  color: var(--main-countdown-color);
	  -webkit-text-fill-color: var(--main-countdown-color);
	  position: relative;
	  top: 7px;
	  margin-bottom: 7px;
	  font-variant-numeric: tabular-nums;
    }
	
	.unit {
      text-align: center;
	  display: flex;
      justify-content: center;
    }

    .digit-scroll {
      display: flex;
      justify-content: center;
	  margin-bottom: 5px;
    }

    .digit {
      display: inline-block;
	  position: relative;
    }
	
	.digit .ghost {
		visibility: hidden;
	}

    .value {
      position: absolute;
      width: 100%;
      text-align: center;
      top: 0;
    }

    label {
      font-size: 14px;
      display: block;
      position: absolute;
      bottom: 40px;
	  opacity: 0;
      letter-spacing: normal;
    }
	
	


.explore {
	background: var(--main-explore-bg) !important;
	font-size: 40px;
    padding: 10px 30px;
    font-weight: 600;
    display: inline-block;
    transition: all 10ms ease-in-out;
    white-space: nowrap;
    text-align: center;
    height: auto;
    text-decoration: none;
    letter-spacing: 0;
    border: 2px solid transparent;
    border-radius: 6px;
    color: #FFFFFF !important;
	position: relative;
}

.explore:before {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
    border: 1px solid transparent;
    text-decoration: none;
}

.explore:hover:after {
	right: -8px !important;
}

.explore:hover span {
    right: 0 !important;
    box-shadow: 0 2px currentColor !important;
    left: 0 !important;
    }

.explore:after {
    margin-left: 6px;
    display: inline-block;
	position: relative;
    right: -4px;
    content: "";
	font-size: 0.5em;
    transition: all 200ms ease-in-out;
    text-decoration: none;
    font-family: "MGW-Icons";
}

.explore span {
    max-width: 100%;
    display: inline-block;
    left: 0;
    text-overflow: clip;
    transition: all 200ms ease-in-out;
    }
	
	@media (max-width: 859px) {
  .gradient-text {
    font-size: 48px;
  }

  .gradient-tag {
    font-size: 18px;
	text-wrap: auto;
  }
  
  label {
	  font-size: 8px;
  }
  .part .gradient-tag {
		font-size: 22px;
	}
	.c-sep {
		transform: translateY(-4px);
	}
	#countdown {
		top: 4px;
		margin-bottom: 4px;
	}
	.ini-colon {
		vertical-align: 4px;
	}
   .explore {
	   font-size: 24px;
	   text-wrap: auto;
   }
   mg-countdown.launched {
		padding: calc(4rem - 1.5px) 2rem;
	}
}

mg-celeb {
  position: fixed;
  top: 0; left: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 99999;
  overflow: hidden;
  opacity: 1;
  transition: opacity 2s ease;
}

mg-celeb .celebration-confetti {
  position: absolute;
  width: 10px; height: 10px;
  background: red;
  opacity: 1;
  transform: rotate(45deg);
  animation: confetti-fall 3s linear infinite;
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.5);
}
@keyframes confetti-fall {
  0% { transform: translateY(-100px) rotate(0deg); opacity: 1; }
  100% { transform: translateY(110vh) rotate(360deg); opacity: 0; }
}

mg-celeb .celebration-sparkle {
  position: absolute;
  width: 8px; height: 8px;
  background: white;
  border-radius: 50%;
  box-shadow: 0 0 12px white, 0 0 20px white;
  animation: sparkle-pop 1.2s ease-out forwards;
  opacity: 1;
}
@keyframes sparkle-pop {
  0% { transform: scale(0); opacity: 1; }
  50% { transform: scale(1.8); opacity: 1; }
  100% { transform: scale(0); opacity: 0; }
}

mg-celeb .firework {
  position: absolute;
  width: 6px;
  height: 6px;
  background: white;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0 8px currentColor;
  animation: firework-burst 1.2s ease-out forwards;
}
@keyframes firework-burst {
  0% { transform: scale(0) translate(0, 0); opacity: 1; }
  100% { transform: scale(1.3) translate(var(--x), var(--y)); opacity: 0; }
}

.mg-article {
  max-width: 1600px;
  margin: 0 auto;
  padding: 64px 32px;
  color: var(--main-mg-article-text-color);
  font-size: 16px;
  line-height: 1.8;
  display: flex;
  align-items: flex-start;
  gap: 2rem;
  position: relative;
}

.mg-article ul, .mg-article ol {
    word-wrap: break-word;
    margin: 16px 0 16px 38px;
}

.mg-article ul > li, .mg-article ol > li {
    list-style: disc;
}

.mg-article article {
  max-width: 100%;
  flex: 3;
}

.mg-article .article-nav {
  flex: 1;
  position: sticky;
  top: 0;
  align-self: flex-start;
  overflow-y: auto;
  padding-block-end: 1rem !important;
  border-block-end: 1px solid var(--main-mg-article-bottom-border-color) !important;
  --article-nav-scroll-cutoff: 90;
}

html.header-pinned .mg-article .article-nav {
  top: 60px;
  --article-nav-scroll-cutoff: 150;
}

.mg-article .article-nav h2 {
  font-size: 1.125rem;
  margin-bottom: 1.5rem;
  font-weight: 600;
  line-height: 1.125;
}

.mg-article .article-nav ol {
  margin: 10px 0 0;
  list-style-type: none;
  padding: 0;
}

.mg-article .article-nav ol li {
  list-style-type: none;
      margin: 4px 0;
    padding: 2px 0 2px 7px;
    font-size: .875rem;
    line-height: 1.3;
	border-inline-start: .125rem solid transparent !important;
}

.mg-article .article-nav ol li a {
    color: var(--main-mg-article-subtitle-color);
}

.mg-article .article-nav ol li.active {
    border-color: var(--main-mg-article-blockquote-line-color) !important;
}

.mg-article .article-nav ol li.active a {
    font-weight: 600 !important;
    color: inherit !important;
}

.mg-article .article-nav ol li a:hover {
    text-decoration: underline;
}

.mg-article .article-nav-mobile {
  padding-block-end: 1rem !important;
  display: none;
  overflow-y: auto;
}

.mg-article .article-nav-mobile h2 {
  font-size: 1.125rem;
  margin-bottom: 1.5rem;
  font-weight: 600;
  line-height: 1.125;
}

.mg-article .article-nav-mobile ol {
  margin: 10px 0 0;
  border-inline-start: 1px solid var(--main-mg-article-bottom-border-color) !important;
  list-style-type: none;
  padding: 0;
}

.mg-article .article-nav-mobile ol li {
  list-style-type: none;
      margin: 4px 0;
    padding: 2px 0 2px 10px;
    font-size: .875rem;
    line-height: 1.3;
}

.mg-article .article-nav-mobile ol li a {
    color: var(--main-mg-article-subtitle-color);
}

.mg-article .article-nav-mobile ol li a:hover {
    text-decoration: underline;
}

.mg-article .article-nav-mobile button {
	background-color: transparent;
	color: var(--main-hyperlink-color);
    cursor: pointer;
    border: none;
    padding: 0;
    display: inline-block;
	font-weight: 600 !important;
	font-size: .875rem !important;
	margin-inline-start: 1rem !important;
	margin-block-start: .5rem !important;
}

.mg-article .article-nav-mobile button:hover,
.mg-article .article-nav-mobile button:focus {
  text-decoration: underline;
}

.mg-article .infobox {
  float: right;
  width: 320px;
  margin: 0 0 24px 40px;
  background-color: var(--main-mg-article-infobox-bg-color);
  border: 1px solid var(--main-mg-article-bottom-border-color);
  padding: 20px;
  border-radius: 3px;
  font-size: 0.95rem;
  color: var(--main-mg-article-subtitle-color);
}

.mg-article .infobox h2 {
  line-height: 1.8;
  font-size: 1.2rem;
  margin-top: 0;
  margin-bottom: 16px;
  font-weight: 600;
  color: var(--main-mg-article-h1-color);
  border-bottom: 1px solid var(--main-mg-article-bottom-border-color);
  padding-bottom: 8px;
}

.mg-article .infobox ul {
  padding: 0;
  margin: 0;
  margin-bottom: 16px;
}

.mg-article .infobox ul > li {
  list-style: none;
}

.mg-article .infobox ul:not(:nth-last-child(-n+1)) {
  border-bottom: 1px solid var(--main-mg-article-bottom-border-color);
}

.mg-article .infobox li {
  margin-bottom: 12px;
  padding-bottom: 8px;
}

.mg-article .infobox li:last-child {
  border-bottom: none;
}

.mg-article .infobox strong {
  display: block;
  font-weight: 600;
  color: var(--main-mg-article-h1-color);
  margin-bottom: 2px;
}
.mg-article .infobox a {
  display: inline-block;
  color: var(--main-hyperlink-color);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.2s ease, text-decoration 0.2s ease;
}

.mg-article .infobox a:hover,
.mg-article .infobox a:focus {
  text-decoration: underline;
}
.mg-article .infobox .countdown {
  font-weight: 600;
  color: #7e22ce;
  background-color: var(--main-mg-article-infobox-countdown-bg-color);
  padding: 4px 10px;
  border-radius: 3px;
  display: inline-block;
}

.mg-article .infobox .status {
  display: inline-flex;
  align-items: center; 
  gap: 0.5rem; 
}
.mg-article .infobox .status.soon svg { color: #fbbc04; }
.mg-article .infobox .status.active svg { color: #27c24c; }
.mg-article .infobox .status.ended svg { color: #ef4444; }

.mg-article h1 {
  font-size: clamp(1.875rem, 22.1053px + 1.64474vw, 2.5rem);
  font-weight: 600;
  margin-bottom: 12px;
  margin-top: -10px;
  color: var(--main-mg-article-h1-color);
  letter-spacing: -0.5px;
}

.mg-article h2 {
  font-size: clamp(1.59375rem, 18.7895px + 1.39803vw, 2.125rem);
  margin-top: 32px;
  margin-bottom: 12px;
  line-height: 1.3;
  font-weight: 600;
}

.mg-article h3 {
  font-size: clamp(1.3125rem, 15.4737px + 1.15132vw, 1.75rem);
  margin-top: 30px;
  margin-bottom: 18px;
  line-height: 1.3;
  font-weight: 600;
}

.mg-article .subtitle {
  font-size: 18px;
  color: var(--main-mg-article-subtitle-color);
  margin-bottom: 48px;
}

.mg-article p {
  margin-top: 1rem;
  margin-bottom: 0;
}

.mg-article blockquote {
  border-left: 4px solid var(--main-mg-article-blockquote-line-color);
  padding-left: 16px;
  margin: 40px 0;
  font-style: italic;
  color: var(--main-mg-article-blockquote-color);
}

.mg-article blockquote span {
  display: block;
  margin-top: 12px;
  font-size: 0.9rem;
  color: var(--main-mg-article-blockquote-span-color);
}

.mg-article figure {
  margin: 48px 0;
  text-align: center;
}

.mg-article figure img {
  max-width: 100%;
  box-shadow: 0 4px 16px var(--main-mg-article-fig-box-shadow);
}

.mg-article figcaption {
  margin-top: 12px;
  font-size: 0.95rem;
  color: var(--main-mg-article-fig-caption-color);
}

.mg-article .footer-note {
  font-size: 0.85rem;
  color: var(--main-mg-article-footer-color);
  margin-top: 64px;
  border-top: 1px solid var(--main-mg-article-bottom-border-color);
  padding-top: 24px;
}

@media (max-width: 859px) {
  html.header-pinned {
  	scroll-padding-top: 90px;
  }
  .mg-article .infobox {
    float: none;
    width: auto;
    margin: 0 0 24px 0px;
  }
  
  .mg-article .article-nav-mobile {
    display: block !important;
  }
  
  .mg-article .article-nav {
    display: none !important;
  }
  
  .mg-article .subtitle {
    margin-bottom: 0;
  }
}

:root[data-theme="light"] {
		--main-mg-countdown-bg-1: #869bdb;
		--main-mg-countdown-bg-2: #9cb7e6;
		--main-hyperlink-color: #0067c5;
		--main-countdown-grad: linear-gradient(to bottom, transparent 60%, #2A2A2A 80%),    
	                           linear-gradient(to right,
	                             #0073BE 0%,        
                                 #1A3767 9%,
                                 #004F9D 20%,       
                                 #019CDE 35%,       
                                 #0073BE 44%,       
                                 #1A3767 50%,
                                 #019CDE 56%,       
                                 #004F9D 75%,       
                                 #1A2167 85%,
                                 #004F9D 100%       
                                );
		--main-countdown-color: #2A2A2A;
		--main-explore-bg: #001968;
		--celeb-1: #f44336;
		--celeb-2: #2196f3;
		--celeb-3: #4caf50;
		--celeb-4: #ffeb3b;
		--celeb-5: #9c27b0;
		--main-mg-article-text-color: #222;
		--main-mg-article-h1-color: #111;
		--main-mg-article-subtitle-color: #555;
		--main-mg-article-blockquote-color: #333;
		--main-mg-article-blockquote-line-color: #0078d4;
		--main-mg-article-blockquote-span-color: #888;
		--main-mg-article-fig-caption-color: #666;
		--main-mg-article-fig-box-shadow: rgba(0,0,0,0.2);
		--main-mg-article-footer-color: #999;
		--main-mg-article-bottom-border-color: #ddd;
		--main-mg-article-infobox-bg-color: rgba(255, 255, 255, 0.2);
		--main-mg-article-infobox-countdown-bg-color: rgba(126, 34, 206, 0.3);
	}
	:root[data-theme="dark"] {
		--main-mg-countdown-bg-1: #0f1e4d;
		--main-mg-countdown-bg-2: #1e3a8a;
		--main-hyperlink-color:#56c6e7;
		--main-countdown-grad: linear-gradient(to bottom, transparent 60%, #D700FF 80%),
                               linear-gradient(to right,
                                 #00B7FF 0%,        
                                 #1EC8FF 9%,        
                                 #009EF7 20%,       
                                 #3AD3FF 35%,       
                                 #00B7FF 44%,       
                                 #1EC8FF 50%,
                                 #3AD3FF 56%,
                                 #009EF7 75%,
                                 #4AD9FF 85%,
                                 #00B7FF 100%       
                               );
		--main-countdown-color: #D700FF;
		--main-explore-bg: #5B21B6;
		--celeb-1: #ffffff;
		--celeb-2: #90caf9;
		--celeb-3: #f48fb1;
		--celeb-4: #ce93d8;
		--celeb-5: #ffcc80;
		--main-mg-article-text-color: #e5e5e5;
		--main-mg-article-h1-color: #ffffff;
		--main-mg-article-subtitle-color: #c2c2c2;
		--main-mg-article-blockquote-color: #d0d0d0;
		--main-mg-article-blockquote-line-color: #3aa1f2;
		--main-mg-article-blockquote-span-color: #aaaaaa;
		--main-mg-article-fig-caption-color: #a3a3a3;
		--main-mg-article-fig-box-shadow: rgba(255,255,255,0.2);
		--main-mg-article-footer-color: #9a9a9a;
		--main-mg-article-bottom-border-color: #1d1f3b;
		--main-mg-article-infobox-bg-color: rgba(0, 0, 0, 0.1);
		--main-mg-article-infobox-countdown-bg-color: rgba(126, 34, 206, 0.2);
	}