/*
  style.css
*/

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}


@font-face {
  font-family: 'EsaManru';
  font-weight: 300;
  font-style: normal;
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruLight.eot);
  src: url(https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruLight.eot?#iefix) format('embedded-opentype'), url(https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruLight.woff2) format('woff2'), url(https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruLight.woff) format('woff'), url(https://cdn.jsdelivr.net/gh/webfontworld/gonggames/EsaManruLight.ttf) format("truetype");
  font-display: swap;
}

body {
  background-color: #000 !important;
}

header button {
  font-family: 'EsaManru';
  font-weight: 400;
}

.bg-\[linear-gradient\(180deg\,rgba\(20\,26\,32\,\.92\)_0\%\,rgba\(10\,14\,18\,\.92\)_100\%\)\] {
  background-image: linear-gradient(#234 0%, #358 100%) !important;
}


nav button{
  background: linear-gradient(#51f484 0%, #0d6bbe 100%);
}

#live article>div>svg,
#slots article>div>svg {
  opacity: 0;
}

.hover\:ring-emerald-400\/70:hover {
  --tw-ring-color: #00ccffff !important;
}


.hover\:shadow-\[0_0_24px_rgba\(16\,185\,129\,\.55\)\,inset_0_0_2px_rgba\(16\,185\,129\,\.7\)\]:hover {
  --tw-shadow: 0 0 24px #00ccffff, inset 0 0 2px #00ccffff !important;
  --tw-shadow-colored: 0 0 24px var(--tw-shadow-color), inset 0 0 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.via-blue-400\/70 {
    --tw-gradient-to: #60a5fa00 var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), #cf0 var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}

.via-blue-400\/80 {
    --tw-gradient-to: #60a5fa00 var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), #cf0 var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}

.focus\:ring-cyan-400\/60:focus {
    --tw-ring-color: #cf0;
}

.btn-login{
  background: linear-gradient(#51f484 0%, #0d6bbe 100%);
  font-family: 'EsaManru';
  font-size:18px;
}

.btn-join{
  background: linear-gradient(#51f484 0%, #0d6bbe 100%);
  font-family: 'EsaManru';
}

.btn-close{
  --tw-ring-color: #60fa9499;
}


.btn-close:hover{
  background-color: #60fa9533;
}
#intro {
  max-width: 1920px;
  margin: 0 auto;
}

#intro .pointer-events-none{
  display:none;
}
#transaction .notice{
  color:#fc0;
  font-family: 'EsaManru';
  font-weight: 500;
}

#transaction .notice-bg{
  background: url(/images/bg_notice.jpg) center top repeat-x;
}


#live article .items-center button,
#slots article .gap-2 button {
  display: none;
}



.py-10 button {
  border: 1px solid #5ccb17;
  border-radius: 5px;
  box-shadow: 0px 0px 70px rgb(0 255 188 / 50%);
}

#event .rounded-2xl {
  box-shadow: 0px 0px 70px rgb(0 255 188 / 50%);
  border: 1px solid #5ccb17;
}

.contents-section {
  background: url(/images/content_bg.jpg) no-repeat center top;
  box-shadow: inset 0 6px 20px 2px rgba(0, 0, 0, .7);
  margin-bottom: 30px;
}

#partner, footer{
  background-color: #0f1012 !important;
}

#slots article:hover, #live article:hover{
  --tw-ring-color: #8f8;
  --tw-shadow: 0 0 24px #00ffbc80, inset 0 0 8px #00ffbc80;
}
.f_logo img{
  margin:0 auto;
  vertical-align: middle;
}
.f_copy {
    float: left;
    width: 100%;
    text-align: center;
    margin: 0 0 30px 0;
    font-family: 'EsaManru';
    font-weight: 500;
    color: #545454;
    font-size: 16px;
}



h2.text-xl span.to-cyan-500, h2.text-xl span.to-blue-600{
  --tw-gradient-to: #ccff00 var(--tw-gradient-to-position);

}
h2.text-xl span.from-blue-400, h2.text-xl span.from-blue-400{
  --tw-gradient-from: #ccff00 var(--tw-gradient-from-position);
  --tw-gradient-to: #60a5fa00 var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}