:root { --toastify-color-light: #fff; --toastify-color-dark: #121212; --toastify-color-info: #3498db; --toastify-color-success: #07bc0c; --toastify-color-warning: #f1c40f; --toastify-color-error: hsl(6, 78%, 57%); --toastify-color-transparent: rgba(255, 255, 255, .7); --toastify-icon-color-info: var(--toastify-color-info); --toastify-icon-color-success: var(--toastify-color-success); --toastify-icon-color-warning: var(--toastify-color-warning); --toastify-icon-color-error: var(--toastify-color-error); --toastify-container-width: fit-content; --toastify-toast-width: 320px; --toastify-toast-offset: 16px; --toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top)); --toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right)); --toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left)); --toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom)); --toastify-toast-background: #fff; --toastify-toast-padding: 14px; --toastify-toast-min-height: 64px; --toastify-toast-max-height: 800px; --toastify-toast-bd-radius: 6px; --toastify-toast-shadow: 0px 4px 12px rgba(0, 0, 0, .1); --toastify-font-family: sans-serif; --toastify-z-index: 9999; --toastify-text-color-light: #757575; --toastify-text-color-dark: #fff; --toastify-text-color-info: #fff; --toastify-text-color-success: #fff; --toastify-text-color-warning: #fff; --toastify-text-color-error: #fff; --toastify-spinner-color: #616161; --toastify-spinner-color-empty-area: #e0e0e0; --toastify-color-progress-light: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55); --toastify-color-progress-dark: #bb86fc; --toastify-color-progress-info: var(--toastify-color-info); --toastify-color-progress-success: var(--toastify-color-success); --toastify-color-progress-warning: var(--toastify-color-warning); --toastify-color-progress-error: var(--toastify-color-error); --toastify-color-progress-bgo: .2; }
.Toastify__toast-container { z-index: var(--toastify-z-index); transform: translate3d(0,0,var(--toastify-z-index)); position: fixed; width: var(--toastify-container-width); box-sizing: border-box; color: var(--colors-skyLightest, rgb(255, 255, 255)); display: flex; flex-direction: column; }
.Toastify__toast-container--top-left { top: var(--toastify-toast-top); left: var(--toastify-toast-left); }
.Toastify__toast-container--top-center { top: var(--toastify-toast-top); left: 50%; transform: translate(-50%); align-items: center; }
.Toastify__toast-container--top-right { top: var(--toastify-toast-top); right: var(--toastify-toast-right); align-items: end; }
.Toastify__toast-container--bottom-left { bottom: var(--toastify-toast-bottom); left: var(--toastify-toast-left); }
.Toastify__toast-container--bottom-center { bottom: var(--toastify-toast-bottom); left: 50%; transform: translate(-50%); align-items: center; }
.Toastify__toast-container--bottom-right { bottom: var(--toastify-toast-bottom); right: var(--toastify-toast-right); align-items: end; }
.Toastify__toast { --y: 0; position: relative; touch-action: none; width: var(--toastify-toast-width); min-height: var(--toastify-toast-min-height); box-sizing: border-box; margin-bottom: 1rem; padding: var(--toastify-toast-padding); border-radius: var(--toastify-toast-bd-radius); box-shadow: var(--toastify-toast-shadow); max-height: var(--toastify-toast-max-height); font-family: var(--toastify-font-family); z-index: 0; display: flex; flex: 1 1 auto; align-items: center; word-break: break-word; }
@media only screen and (max-width: 480px) {
  .Toastify__toast-container { width: 100vw; left: env(safe-area-inset-left); margin: 0px; }
  .Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right { top: env(safe-area-inset-top); transform: translate(0px); }
  .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right { bottom: env(safe-area-inset-bottom); transform: translate(0px); }
  .Toastify__toast-container--rtl { right: env(safe-area-inset-right); left: initial; }
  .Toastify__toast { --toastify-toast-width: 100%; margin-bottom: 0px; border-radius: 0px; }
}
.Toastify__toast-container[data-stacked="true"] { width: var(--toastify-toast-width); }
.Toastify__toast--stacked { position: absolute; width: 100%; transform: translate3d(0,var(--y),0) scale(var(--s)); transition: transform 0.3s; }
.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body, .Toastify__toast--stacked[data-collapsed] .Toastify__close-button { transition: opacity 0.1s; }
.Toastify__toast--stacked[data-collapsed="false"] { overflow: visible; }
.Toastify__toast--stacked[data-collapsed="true"]:not(:last-child) > * { opacity: 0; }
.Toastify__toast--stacked::after { content: ""; position: absolute; left: 0px; right: 0px; height: calc(var(--g) * 1px); bottom: 100%; }
.Toastify__toast--stacked[data-pos="top"] { top: 0px; }
.Toastify__toast--stacked[data-pos="bot"] { bottom: 0px; }
.Toastify__toast--stacked[data-pos="bot"].Toastify__toast--stacked::before { transform-origin: center top; }
.Toastify__toast--stacked[data-pos="top"].Toastify__toast--stacked::before { transform-origin: center bottom; }
.Toastify__toast--stacked::before { content: ""; position: absolute; left: 0px; right: 0px; bottom: 0px; height: 100%; transform: scaleY(3); z-index: -1; }
.Toastify__toast--rtl { direction: rtl; }
.Toastify__toast--close-on-click { cursor: pointer; }
.Toastify__toast-icon { margin-inline-end: 10px; width: 22px; flex-shrink: 0; display: flex; }
.Toastify__toast-body { margin: auto 0; flex: 1 1 auto; padding: 6px; display: flex; align-items: center; }
.Toastify__toast-body > div:last-child { word-break: break-word; flex: 1; }
.Toastify--animate { animation-fill-mode: both; animation-duration: 0.5s; }
.Toastify--animate-icon { animation-fill-mode: both; animation-duration: 0.3s; }
.Toastify__toast-theme--dark { background: var(--toastify-color-dark); color: var(--toastify-text-color-dark); }
.Toastify__toast-theme--light, .Toastify__toast-theme--colored.Toastify__toast--default { background: var(--toastify-color-light); color: var(--toastify-text-color-light); }
.Toastify__toast-theme--colored.Toastify__toast--info { color: var(--toastify-text-color-info); background: var(--toastify-color-info); }
.Toastify__toast-theme--colored.Toastify__toast--success { color: var(--toastify-text-color-success); background: var(--toastify-color-success); }
.Toastify__toast-theme--colored.Toastify__toast--warning { color: var(--toastify-text-color-warning); background: var(--toastify-color-warning); }
.Toastify__toast-theme--colored.Toastify__toast--error { color: var(--toastify-text-color-error); background: var(--toastify-color-error); }
.Toastify__progress-bar-theme--light { background: var(--toastify-color-progress-light); }
.Toastify__progress-bar-theme--dark { background: var(--toastify-color-progress-dark); }
.Toastify__progress-bar--info { background: var(--toastify-color-progress-info); }
.Toastify__progress-bar--success { background: var(--toastify-color-progress-success); }
.Toastify__progress-bar--warning { background: var(--toastify-color-progress-warning); }
.Toastify__progress-bar--error { background: var(--toastify-color-progress-error); }
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--success, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--error { background: var(--toastify-color-transparent); }
.Toastify__close-button { color: var(--colors-skyLightest, rgb(255, 255, 255)); position: absolute; top: 6px; right: 6px; background: transparent; outline: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; cursor: pointer; opacity: 0.7; transition: 0.3s; z-index: 1; }
.Toastify__toast--rtl .Toastify__close-button { left: 6px; right: unset; }
.Toastify__close-button--light { color: rgb(0, 0, 0); opacity: 0.3; }
.Toastify__close-button > svg { fill: currentcolor; height: 16px; width: 14px; }
.Toastify__close-button:hover, .Toastify__close-button:focus { opacity: 1; }
@keyframes Toastify__trackProgress { 
  0% { transform: scaleX(1); }
  100% { transform: scaleX(0); }
}
.Toastify__progress-bar { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 100%; z-index: 1; opacity: 0.7; transform-origin: left center; }
.Toastify__progress-bar--animated { animation: auto linear 0s 1 normal forwards running Toastify__trackProgress; }
.Toastify__progress-bar--controlled { transition: transform 0.2s; }
.Toastify__progress-bar--rtl { right: 0px; left: initial; transform-origin: right center; border-bottom-left-radius: initial; }
.Toastify__progress-bar--wrp { position: absolute; overflow: hidden; bottom: 0px; left: 0px; width: 100%; height: 5px; border-bottom-left-radius: var(--toastify-toast-bd-radius); border-bottom-right-radius: var(--toastify-toast-bd-radius); }
.Toastify__progress-bar--wrp[data-hidden="true"] { opacity: 0; }
.Toastify__progress-bar--bg { opacity: var(--toastify-color-progress-bgo); width: 100%; height: 100%; }
.Toastify__spinner { width: 20px; height: 20px; box-sizing: border-box; border-width: 2px; border-style: solid; border-image: initial; border-radius: 100%; border-top-color: ; border-bottom-color: ; border-left-color: ; border-right-color: var(--toastify-spinner-color); animation: 0.65s linear 0s infinite normal none running Toastify__spin; }
@keyframes Toastify__bounceInRight { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(3000px, 0px, 0px); }
  60% { opacity: 1; transform: translate3d(-25px, 0px, 0px); }
  75% { transform: translate3d(10px, 0px, 0px); }
  90% { transform: translate3d(-5px, 0px, 0px); }
  100% { transform: none; }
}
@keyframes Toastify__bounceOutRight { 
  20% { opacity: 1; transform: translate3d(-20px,var(--y),0); }
  100% { opacity: 0; transform: translate3d(2000px,var(--y),0); }
}
@keyframes Toastify__bounceInLeft { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(-3000px, 0px, 0px); }
  60% { opacity: 1; transform: translate3d(25px, 0px, 0px); }
  75% { transform: translate3d(-10px, 0px, 0px); }
  90% { transform: translate3d(5px, 0px, 0px); }
  100% { transform: none; }
}
@keyframes Toastify__bounceOutLeft { 
  20% { opacity: 1; transform: translate3d(20px,var(--y),0); }
  100% { opacity: 0; transform: translate3d(-2000px,var(--y),0); }
}
@keyframes Toastify__bounceInUp { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(0px, 3000px, 0px); }
  60% { opacity: 1; transform: translate3d(0px, -20px, 0px); }
  75% { transform: translate3d(0px, 10px, 0px); }
  90% { transform: translate3d(0px, -5px, 0px); }
  100% { transform: translateZ(0px); }
}
@keyframes Toastify__bounceOutUp { 
  20% { transform: translate3d(0,calc(var(--y) - 10px),0); }
  40%, 45% { opacity: 1; transform: translate3d(0,calc(var(--y) + 20px),0); }
  100% { opacity: 0; transform: translate3d(0px, -2000px, 0px); }
}
@keyframes Toastify__bounceInDown { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(0px, -3000px, 0px); }
  60% { opacity: 1; transform: translate3d(0px, 25px, 0px); }
  75% { transform: translate3d(0px, -10px, 0px); }
  90% { transform: translate3d(0px, 5px, 0px); }
  100% { transform: none; }
}
@keyframes Toastify__bounceOutDown { 
  20% { transform: translate3d(0,calc(var(--y) - 10px),0); }
  40%, 45% { opacity: 1; transform: translate3d(0,calc(var(--y) + 20px),0); }
  100% { opacity: 0; transform: translate3d(0px, 2000px, 0px); }
}
.Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left { animation-name: Toastify__bounceInLeft; }
.Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right { animation-name: Toastify__bounceInRight; }
.Toastify__bounce-enter--top-center { animation-name: Toastify__bounceInDown; }
.Toastify__bounce-enter--bottom-center { animation-name: Toastify__bounceInUp; }
.Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left { animation-name: Toastify__bounceOutLeft; }
.Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right { animation-name: Toastify__bounceOutRight; }
.Toastify__bounce-exit--top-center { animation-name: Toastify__bounceOutUp; }
.Toastify__bounce-exit--bottom-center { animation-name: Toastify__bounceOutDown; }
@keyframes Toastify__zoomIn { 
  0% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
  50% { opacity: 1; }
}
@keyframes Toastify__zoomOut { 
  0% { opacity: 1; }
  50% { opacity: 0; transform: translate3d(0,var(--y),0) scale3d(.3,.3,.3); }
  100% { opacity: 0; }
}
.Toastify__zoom-enter { animation-name: Toastify__zoomIn; }
.Toastify__zoom-exit { animation-name: Toastify__zoomOut; }
@keyframes Toastify__flipIn { 
  0% { transform: perspective(400px) rotateX(90deg); animation-timing-function: ease-in; opacity: 0; }
  40% { transform: perspective(400px) rotateX(-20deg); animation-timing-function: ease-in; }
  60% { transform: perspective(400px) rotateX(10deg); opacity: 1; }
  80% { transform: perspective(400px) rotateX(-5deg); }
  100% { transform: perspective(400px); }
}
@keyframes Toastify__flipOut { 
  0% { transform: translate3d(0,var(--y),0) perspective(400px); }
  30% { transform: translate3d(0,var(--y),0) perspective(400px) rotateX(-20deg); opacity: 1; }
  100% { transform: translate3d(0,var(--y),0) perspective(400px) rotateX(90deg); opacity: 0; }
}
.Toastify__flip-enter { animation-name: Toastify__flipIn; }
.Toastify__flip-exit { animation-name: Toastify__flipOut; }
@keyframes Toastify__slideInRight { 
  0% { transform: translate3d(110%, 0px, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideInLeft { 
  0% { transform: translate3d(-110%, 0px, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideInUp { 
  0% { transform: translate3d(0px, 110%, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideInDown { 
  0% { transform: translate3d(0px, -110%, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideOutRight { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(110%,var(--y),0); }
}
@keyframes Toastify__slideOutLeft { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(-110%,var(--y),0); }
}
@keyframes Toastify__slideOutDown { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(0px, 500px, 0px); }
}
@keyframes Toastify__slideOutUp { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(0px, -500px, 0px); }
}
.Toastify__slide-enter--top-left, .Toastify__slide-enter--bottom-left { animation-name: Toastify__slideInLeft; }
.Toastify__slide-enter--top-right, .Toastify__slide-enter--bottom-right { animation-name: Toastify__slideInRight; }
.Toastify__slide-enter--top-center { animation-name: Toastify__slideInDown; }
.Toastify__slide-enter--bottom-center { animation-name: Toastify__slideInUp; }
.Toastify__slide-exit--top-left, .Toastify__slide-exit--bottom-left { animation-name: Toastify__slideOutLeft; animation-timing-function: ease-in; animation-duration: 0.3s; }
.Toastify__slide-exit--top-right, .Toastify__slide-exit--bottom-right { animation-name: Toastify__slideOutRight; animation-timing-function: ease-in; animation-duration: 0.3s; }
.Toastify__slide-exit--top-center { animation-name: Toastify__slideOutUp; animation-timing-function: ease-in; animation-duration: 0.3s; }
.Toastify__slide-exit--bottom-center { animation-name: Toastify__slideOutDown; animation-timing-function: ease-in; animation-duration: 0.3s; }
@keyframes Toastify__spin { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
:root { --toastify-color-light: #fff; --toastify-color-dark: #121212; --toastify-color-info: #3498db; --toastify-color-success: #07bc0c; --toastify-color-warning: #f1c40f; --toastify-color-error: hsl(6, 78%, 57%); --toastify-color-transparent: rgba(255, 255, 255, .7); --toastify-icon-color-info: var(--toastify-color-info); --toastify-icon-color-success: var(--toastify-color-success); --toastify-icon-color-warning: var(--toastify-color-warning); --toastify-icon-color-error: var(--toastify-color-error); --toastify-container-width: fit-content; --toastify-toast-width: 320px; --toastify-toast-offset: 16px; --toastify-toast-top: max(var(--toastify-toast-offset), env(safe-area-inset-top)); --toastify-toast-right: max(var(--toastify-toast-offset), env(safe-area-inset-right)); --toastify-toast-left: max(var(--toastify-toast-offset), env(safe-area-inset-left)); --toastify-toast-bottom: max(var(--toastify-toast-offset), env(safe-area-inset-bottom)); --toastify-toast-background: #fff; --toastify-toast-padding: 14px; --toastify-toast-min-height: 64px; --toastify-toast-max-height: 800px; --toastify-toast-bd-radius: 6px; --toastify-toast-shadow: 0px 4px 12px rgba(0, 0, 0, .1); --toastify-font-family: sans-serif; --toastify-z-index: 9999; --toastify-text-color-light: #757575; --toastify-text-color-dark: #fff; --toastify-text-color-info: #fff; --toastify-text-color-success: #fff; --toastify-text-color-warning: #fff; --toastify-text-color-error: #fff; --toastify-spinner-color: #616161; --toastify-spinner-color-empty-area: #e0e0e0; --toastify-color-progress-light: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55); --toastify-color-progress-dark: #bb86fc; --toastify-color-progress-info: var(--toastify-color-info); --toastify-color-progress-success: var(--toastify-color-success); --toastify-color-progress-warning: var(--toastify-color-warning); --toastify-color-progress-error: var(--toastify-color-error); --toastify-color-progress-bgo: .2; }
.Toastify__toast-container { z-index: var(--toastify-z-index); transform: translate3d(0,0,var(--toastify-z-index)); position: fixed; width: var(--toastify-container-width); box-sizing: border-box; color: var(--colors-skyLightest, rgb(255, 255, 255)); display: flex; flex-direction: column; }
.Toastify__toast-container--top-left { top: var(--toastify-toast-top); left: var(--toastify-toast-left); }
.Toastify__toast-container--top-center { top: var(--toastify-toast-top); left: 50%; transform: translate(-50%); align-items: center; }
.Toastify__toast-container--top-right { top: var(--toastify-toast-top); right: var(--toastify-toast-right); align-items: end; }
.Toastify__toast-container--bottom-left { bottom: var(--toastify-toast-bottom); left: var(--toastify-toast-left); }
.Toastify__toast-container--bottom-center { bottom: var(--toastify-toast-bottom); left: 50%; transform: translate(-50%); align-items: center; }
.Toastify__toast-container--bottom-right { bottom: var(--toastify-toast-bottom); right: var(--toastify-toast-right); align-items: end; }
.Toastify__toast { --y: 0; position: relative; touch-action: none; width: var(--toastify-toast-width); min-height: var(--toastify-toast-min-height); box-sizing: border-box; margin-bottom: 1rem; padding: var(--toastify-toast-padding); border-radius: var(--toastify-toast-bd-radius); box-shadow: var(--toastify-toast-shadow); max-height: var(--toastify-toast-max-height); font-family: var(--toastify-font-family); z-index: 0; display: flex; flex: 1 1 auto; align-items: center; word-break: break-word; }
@media only screen and (max-width: 480px) {
  .Toastify__toast-container { width: 100vw; left: env(safe-area-inset-left); margin: 0px; }
  .Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right { top: env(safe-area-inset-top); transform: translate(0px); }
  .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right { bottom: env(safe-area-inset-bottom); transform: translate(0px); }
  .Toastify__toast-container--rtl { right: env(safe-area-inset-right); left: initial; }
  .Toastify__toast { --toastify-toast-width: 100%; margin-bottom: 0px; border-radius: 0px; }
}
.Toastify__toast-container[data-stacked="true"] { width: var(--toastify-toast-width); }
.Toastify__toast--stacked { position: absolute; width: 100%; transform: translate3d(0,var(--y),0) scale(var(--s)); transition: transform 0.3s; }
.Toastify__toast--stacked[data-collapsed] .Toastify__toast-body, .Toastify__toast--stacked[data-collapsed] .Toastify__close-button { transition: opacity 0.1s; }
.Toastify__toast--stacked[data-collapsed="false"] { overflow: visible; }
.Toastify__toast--stacked[data-collapsed="true"]:not(:last-child) > * { opacity: 0; }
.Toastify__toast--stacked::after { content: ""; position: absolute; left: 0px; right: 0px; height: calc(var(--g) * 1px); bottom: 100%; }
.Toastify__toast--stacked[data-pos="top"] { top: 0px; }
.Toastify__toast--stacked[data-pos="bot"] { bottom: 0px; }
.Toastify__toast--stacked[data-pos="bot"].Toastify__toast--stacked::before { transform-origin: center top; }
.Toastify__toast--stacked[data-pos="top"].Toastify__toast--stacked::before { transform-origin: center bottom; }
.Toastify__toast--stacked::before { content: ""; position: absolute; left: 0px; right: 0px; bottom: 0px; height: 100%; transform: scaleY(3); z-index: -1; }
.Toastify__toast--rtl { direction: rtl; }
.Toastify__toast--close-on-click { cursor: pointer; }
.Toastify__toast-icon { margin-inline-end: 10px; width: 22px; flex-shrink: 0; display: flex; }
.Toastify__toast-body { margin: auto 0; flex: 1 1 auto; padding: 6px; display: flex; align-items: center; }
.Toastify__toast-body > div:last-child { word-break: break-word; flex: 1; }
.Toastify--animate { animation-fill-mode: both; animation-duration: 0.5s; }
.Toastify--animate-icon { animation-fill-mode: both; animation-duration: 0.3s; }
.Toastify__toast-theme--dark { background: var(--toastify-color-dark); color: var(--toastify-text-color-dark); }
.Toastify__toast-theme--light, .Toastify__toast-theme--colored.Toastify__toast--default { background: var(--toastify-color-light); color: var(--toastify-text-color-light); }
.Toastify__toast-theme--colored.Toastify__toast--info { color: var(--toastify-text-color-info); background: var(--toastify-color-info); }
.Toastify__toast-theme--colored.Toastify__toast--success { color: var(--toastify-text-color-success); background: var(--toastify-color-success); }
.Toastify__toast-theme--colored.Toastify__toast--warning { color: var(--toastify-text-color-warning); background: var(--toastify-color-warning); }
.Toastify__toast-theme--colored.Toastify__toast--error { color: var(--toastify-text-color-error); background: var(--toastify-color-error); }
.Toastify__progress-bar-theme--light { background: var(--toastify-color-progress-light); }
.Toastify__progress-bar-theme--dark { background: var(--toastify-color-progress-dark); }
.Toastify__progress-bar--info { background: var(--toastify-color-progress-info); }
.Toastify__progress-bar--success { background: var(--toastify-color-progress-success); }
.Toastify__progress-bar--warning { background: var(--toastify-color-progress-warning); }
.Toastify__progress-bar--error { background: var(--toastify-color-progress-error); }
.Toastify__progress-bar-theme--colored.Toastify__progress-bar--info, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--success, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--error { background: var(--toastify-color-transparent); }
.Toastify__close-button { color: var(--colors-skyLightest, rgb(255, 255, 255)); position: absolute; top: 6px; right: 6px; background: transparent; outline: none; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; cursor: pointer; opacity: 0.7; transition: 0.3s; z-index: 1; }
.Toastify__toast--rtl .Toastify__close-button { left: 6px; right: unset; }
.Toastify__close-button--light { color: rgb(0, 0, 0); opacity: 0.3; }
.Toastify__close-button > svg { fill: currentcolor; height: 16px; width: 14px; }
.Toastify__close-button:hover, .Toastify__close-button:focus { opacity: 1; }
@keyframes Toastify__trackProgress { 
  0% { transform: scaleX(1); }
  100% { transform: scaleX(0); }
}
.Toastify__progress-bar { position: absolute; bottom: 0px; left: 0px; width: 100%; height: 100%; z-index: 1; opacity: 0.7; transform-origin: left center; }
.Toastify__progress-bar--animated { animation: auto linear 0s 1 normal forwards running Toastify__trackProgress; }
.Toastify__progress-bar--controlled { transition: transform 0.2s; }
.Toastify__progress-bar--rtl { right: 0px; left: initial; transform-origin: right center; border-bottom-left-radius: initial; }
.Toastify__progress-bar--wrp { position: absolute; overflow: hidden; bottom: 0px; left: 0px; width: 100%; height: 5px; border-bottom-left-radius: var(--toastify-toast-bd-radius); border-bottom-right-radius: var(--toastify-toast-bd-radius); }
.Toastify__progress-bar--wrp[data-hidden="true"] { opacity: 0; }
.Toastify__progress-bar--bg { opacity: var(--toastify-color-progress-bgo); width: 100%; height: 100%; }
.Toastify__spinner { width: 20px; height: 20px; box-sizing: border-box; border-width: 2px; border-style: solid; border-image: initial; border-radius: 100%; border-top-color: ; border-bottom-color: ; border-left-color: ; border-right-color: var(--toastify-spinner-color); animation: 0.65s linear 0s infinite normal none running Toastify__spin; }
@keyframes Toastify__bounceInRight { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(3000px, 0px, 0px); }
  60% { opacity: 1; transform: translate3d(-25px, 0px, 0px); }
  75% { transform: translate3d(10px, 0px, 0px); }
  90% { transform: translate3d(-5px, 0px, 0px); }
  100% { transform: none; }
}
@keyframes Toastify__bounceOutRight { 
  20% { opacity: 1; transform: translate3d(-20px,var(--y),0); }
  100% { opacity: 0; transform: translate3d(2000px,var(--y),0); }
}
@keyframes Toastify__bounceInLeft { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(-3000px, 0px, 0px); }
  60% { opacity: 1; transform: translate3d(25px, 0px, 0px); }
  75% { transform: translate3d(-10px, 0px, 0px); }
  90% { transform: translate3d(5px, 0px, 0px); }
  100% { transform: none; }
}
@keyframes Toastify__bounceOutLeft { 
  20% { opacity: 1; transform: translate3d(20px,var(--y),0); }
  100% { opacity: 0; transform: translate3d(-2000px,var(--y),0); }
}
@keyframes Toastify__bounceInUp { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(0px, 3000px, 0px); }
  60% { opacity: 1; transform: translate3d(0px, -20px, 0px); }
  75% { transform: translate3d(0px, 10px, 0px); }
  90% { transform: translate3d(0px, -5px, 0px); }
  100% { transform: translateZ(0px); }
}
@keyframes Toastify__bounceOutUp { 
  20% { transform: translate3d(0,calc(var(--y) - 10px),0); }
  40%, 45% { opacity: 1; transform: translate3d(0,calc(var(--y) + 20px),0); }
  100% { opacity: 0; transform: translate3d(0px, -2000px, 0px); }
}
@keyframes Toastify__bounceInDown { 
  0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; transform: translate3d(0px, -3000px, 0px); }
  60% { opacity: 1; transform: translate3d(0px, 25px, 0px); }
  75% { transform: translate3d(0px, -10px, 0px); }
  90% { transform: translate3d(0px, 5px, 0px); }
  100% { transform: none; }
}
@keyframes Toastify__bounceOutDown { 
  20% { transform: translate3d(0,calc(var(--y) - 10px),0); }
  40%, 45% { opacity: 1; transform: translate3d(0,calc(var(--y) + 20px),0); }
  100% { opacity: 0; transform: translate3d(0px, 2000px, 0px); }
}
.Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left { animation-name: Toastify__bounceInLeft; }
.Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right { animation-name: Toastify__bounceInRight; }
.Toastify__bounce-enter--top-center { animation-name: Toastify__bounceInDown; }
.Toastify__bounce-enter--bottom-center { animation-name: Toastify__bounceInUp; }
.Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left { animation-name: Toastify__bounceOutLeft; }
.Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right { animation-name: Toastify__bounceOutRight; }
.Toastify__bounce-exit--top-center { animation-name: Toastify__bounceOutUp; }
.Toastify__bounce-exit--bottom-center { animation-name: Toastify__bounceOutDown; }
@keyframes Toastify__zoomIn { 
  0% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); }
  50% { opacity: 1; }
}
@keyframes Toastify__zoomOut { 
  0% { opacity: 1; }
  50% { opacity: 0; transform: translate3d(0,var(--y),0) scale3d(.3,.3,.3); }
  100% { opacity: 0; }
}
.Toastify__zoom-enter { animation-name: Toastify__zoomIn; }
.Toastify__zoom-exit { animation-name: Toastify__zoomOut; }
@keyframes Toastify__flipIn { 
  0% { transform: perspective(400px) rotateX(90deg); animation-timing-function: ease-in; opacity: 0; }
  40% { transform: perspective(400px) rotateX(-20deg); animation-timing-function: ease-in; }
  60% { transform: perspective(400px) rotateX(10deg); opacity: 1; }
  80% { transform: perspective(400px) rotateX(-5deg); }
  100% { transform: perspective(400px); }
}
@keyframes Toastify__flipOut { 
  0% { transform: translate3d(0,var(--y),0) perspective(400px); }
  30% { transform: translate3d(0,var(--y),0) perspective(400px) rotateX(-20deg); opacity: 1; }
  100% { transform: translate3d(0,var(--y),0) perspective(400px) rotateX(90deg); opacity: 0; }
}
.Toastify__flip-enter { animation-name: Toastify__flipIn; }
.Toastify__flip-exit { animation-name: Toastify__flipOut; }
@keyframes Toastify__slideInRight { 
  0% { transform: translate3d(110%, 0px, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideInLeft { 
  0% { transform: translate3d(-110%, 0px, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideInUp { 
  0% { transform: translate3d(0px, 110%, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideInDown { 
  0% { transform: translate3d(0px, -110%, 0px); visibility: visible; }
  100% { transform: translate3d(0,var(--y),0); }
}
@keyframes Toastify__slideOutRight { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(110%,var(--y),0); }
}
@keyframes Toastify__slideOutLeft { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(-110%,var(--y),0); }
}
@keyframes Toastify__slideOutDown { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(0px, 500px, 0px); }
}
@keyframes Toastify__slideOutUp { 
  0% { transform: translate3d(0,var(--y),0); }
  100% { visibility: hidden; transform: translate3d(0px, -500px, 0px); }
}
.Toastify__slide-enter--top-left, .Toastify__slide-enter--bottom-left { animation-name: Toastify__slideInLeft; }
.Toastify__slide-enter--top-right, .Toastify__slide-enter--bottom-right { animation-name: Toastify__slideInRight; }
.Toastify__slide-enter--top-center { animation-name: Toastify__slideInDown; }
.Toastify__slide-enter--bottom-center { animation-name: Toastify__slideInUp; }
.Toastify__slide-exit--top-left, .Toastify__slide-exit--bottom-left { animation-name: Toastify__slideOutLeft; animation-timing-function: ease-in; animation-duration: 0.3s; }
.Toastify__slide-exit--top-right, .Toastify__slide-exit--bottom-right { animation-name: Toastify__slideOutRight; animation-timing-function: ease-in; animation-duration: 0.3s; }
.Toastify__slide-exit--top-center { animation-name: Toastify__slideOutUp; animation-timing-function: ease-in; animation-duration: 0.3s; }
.Toastify__slide-exit--bottom-center { animation-name: Toastify__slideOutDown; animation-timing-function: ease-in; animation-duration: 0.3s; }
@keyframes Toastify__spin { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
--sxs { --sxs: 0 t-goXYqq t-jjUASA; }
@media  {
  :root, .t-goXYqq { --colors-redDark: #A82200; --colors-redDefault: #DD2C00; --colors-redLight: #FF3F0F; --colors-redLighter: #FF6842; --colors-redLightest: #FFD6CC; --colors-blueDark: #0077E6; --colors-blueDefault: #1890FF; --colors-blueLight: #4CA9FF; --colors-blueLighter: #80C2FF; --colors-blueLightest: #CCE6FF; --colors-greenDark: #20950E; --colors-greenDefault: #2BC312; --colors-greenLight: #3AEA1F; --colors-greenLighter: #63EF4E; --colors-greenLightest: #D6FBD0; --colors-yellowDark: #B27700; --colors-yellowDefault: #FFB31C; --colors-yellowLight: #FFC34D; --colors-yellowLighter: #FFD480; --colors-yellowLightest: #FFEECC; --colors-radialRed: radial-gradient(50% 50% at 50% 50%, #FF3F0F 7.29%, #A82200 100%); --colors-radialGreen: radial-gradient(50% 50% at 50% 50%, #3AEA1F 7.29%, #20950E 100%); --colors-radialBlack: radial-gradient(343.26% 209.7% at 50% 50.3%, #252627 0%, #000000 100%); --colors-error: var(--colors-redDefault); --colors-success: var(--colors-greenDefault); --fontWeights-light: 300; --fontWeights-regular: 400; --fontWeights-medium: 500; --fontWeights-bold: 700; --fontSizes-size10: 10px; --fontSizes-size12: 12px; --fontSizes-size14: 14px; --fontSizes-size16: 16px; --fontSizes-size18: 18px; --fontSizes-size24: 24px; --fontSizes-size32: 32px; --fontSizes-size48: 48px; --lineHeights-xxxxs: 13px; --lineHeights-xxxs: 16px; --lineHeights-xxs: 18px; --lineHeights-xs: 21px; --lineHeights-sm: 23px; --lineHeights-md: 31px; --lineHeights-lg: 42px; --lineHeights-xl: 62px; --sizes-pageMaxWidth: 1504px; --sizes-xs: 490px; --sizes-sm: 690px; --sizes-md: 740px; --sizes-lg: 900px; --sizes-xl: 1140px; --sizes-xxl: 1280px; --sizes-xxxl: 1540px; --space-space4: 4px; --space-space8: 8px; --space-space12: 12px; --space-space16: 16px; --space-space20: 20px; --space-space24: 24px; --space-space36: 36px; --space-space48: 48px; --space-xs: 8px; --space-sm: 12px; --space-md: 24px; --space-lg: 36px; --space-xl: 48px; --space-xxl: 86px; --space-xxxl: 108px; --space-xxxxl: 156px; --zIndices-header: 119; }
  .t-jjUASA { --colors-redDark: #A82200; --colors-redDefault: #DD2C00; --colors-redLight: #FF3F0F; --colors-redLighter: #FF6842; --colors-redLightest: #FFD6CC; --colors-blueDark: #0077E6; --colors-blueDefault: #1890FF; --colors-blueLight: #4CA9FF; --colors-blueLighter: #80C2FF; --colors-blueLightest: #CCE6FF; --colors-greenDark: #20950E; --colors-greenDefault: #2BC312; --colors-greenLight: #3AEA1F; --colors-greenLighter: #63EF4E; --colors-greenLightest: #D6FBD0; --colors-yellowDark: #B27700; --colors-yellowDefault: #FFB31C; --colors-yellowLight: #FFC34D; --colors-yellowLighter: #FFD480; --colors-yellowLightest: #FFEECC; --colors-radialRed: radial-gradient(50% 50% at 50% 50%, var(--colors-redLight, #FF3F0F) 7.29%, var(--colors-redDark, #A82200) 100%); --colors-radialGreen: radial-gradient(50% 50% at 50% 50%, var(--colors-greenLight, #3AEA1F) 7.29%, var(--colors-greenDark, #20950E) 100%); --colors-radialBlack: radial-gradient(343.26% 209.7% at 50% 50.3%, #252627 0%, #000000 100%); --colors-error: var(--colors-redDefault); --colors-success: var(--colors-greenDefault); --colors-primaryDark: #ADD001; --colors-primaryDefault: #D4FD07; --colors-primaryLight: #DBFD30; --colors-primaryLighter: #DFFE49; --colors-primaryLightest: #E8FE7B; --colors-secondaryDark: #9F8487; --colors-secondaryDefault: #009D7C; --colors-secondaryLight: #ADD001; --colors-secondaryLighter: #CBBDBF; --colors-secondaryLightest: #E2DADB; --colors-inkDark: #0C262A; --colors-inkDefault: #11363C; --colors-inkLight: #16454B; --colors-inkLighter: #1B575F; --colors-inkLightest: #20666F; --colors-skyDarker: #707475; --colors-skyDefault: #8A8E8F; --colors-skyDefaultHalf: rgba(138, 142, 143, 0.2); --colors-skyLight: #BEC0C1; --colors-skyLighter: #F2F2F3; --colors-skyLightest: #FFFFFF; --colors-angularGold: conic-gradient(from -30.07deg at 50% 50%, var(--colors-primaryLightest, #E8FE7B) 0deg, var(--colors-primaryLightest, #E8FE7B) 0.04deg, #ADCF02 18.14deg, var(--colors-primaryLightest, #E8FE7B) 90.32deg, #ADCF02 161.47deg, var(--colors-primaryLightest, #E8FE7B) 180.96deg, #ADCF02 210.72deg, var(--colors-primaryLightest, #E8FE7B) 273.52deg, #ADCF02 337.77deg, var(--colors-primaryLightest, #E8FE7B) 360deg); --colors-linear: linear-gradient(90deg, rgba(22, 69, 75, 0.9) 21.88%, rgba(32, 102, 111, 0.9) 100%); --colors-linearCard: linear-gradient(180deg, #27488E 0%, #12254C 100%); --urls-gameCategoryBg: /themes/whiskey/game-category-bg-8.png; --urls-rtpBg: /themes/whiskey/rtp-bg-8.webp; --urls-jackpotDesktop: /themes/whiskey/jackpot-8.webp; --urls-jackpotMobile: /themes/whiskey/jackpot-8.webp; }
}
--sxs { --sxs: 2 c-fNvXDc c-jjpMwf c-hSKcfS c-UazGY c-bLdNGJ c-iWpHqy c-PJLV c-cIdiJW c-dVOKBM c-kolHsO c-hOwCtY c-eBIusB c-fewYWN c-gTynjM c-eRhPxt c-hqXzi c-hlTBXk c-kokaPQ c-bNHULD c-hzUrXJ c-jDjnIk c-fZlHvM c-hJhMRA c-gtpFUc c-dFfuhX c-dJpCLK c-fmXhxl c-bCRLag c-koofwM c-lcPmgm c-bHzkZd c-SNhSq c-MstJl c-eITHhL c-fGHEql c-dhzjXW c-iefmez c-kbRxRG c-iFAMB c-hEWFPv c-gzflTi c-iMHPmU c-flWDnm c-bpaGqe c-kYtbRs c-hrlkMa c-exXVOH c-bZNrxE c-hyEoVL c-kHqjIX c-ldfSEu c-ekzekW c-dlRlrD c-iUzUHX c-kiLWvQ c-kVFvxy c-bhjCFi c-jDChox c-eCRKlW c-fqrbKy c-iOUgsF c-kZdsED c-flysGN c-kEGpHA c-lptOrU c-dlmoIL c-lkBNdM c-fNsOmT c-fsejKH c-bjbdTA c-cmpvrW c-dbclGt c-lkXhhf c-iBnCZM c-dvYIiP c-krIkwM c-fKbFaO c-jjBYZd c-iwYAmO c-fxrEBZ c-bsedBV c-ciVisu c-iflkHV c-jRSoJY c-ckhQIw c-gWIrTz c-bkRTOV c-jlrkmt c-eOCYEU c-dMEYqg c-iLMlZX c-ekwkue c-hiIaNd c-dIVmuX c-bmJXHW c-iKKfHF c-fixGjY c-iBqmQN c-dZxKON c-gDWphG c-ismpOc c-jByKpI c-gxkYxW c-hWnzoL c-eecxgq c-iyYdBa c-gyesvQ c-iEaapN c-bAZTzz c-jRurjG c-ilxIoK c-bUelen c-jGlcIr c-kWkSpo c-bKXnuv c-cKeKw c-gotZkf c-jnjWSo c-efADIY c-bIJGHM c-fHwvSc c-fcTNLc c-dKVYBe c-fjePfl c-ljuApQ c-iKuNVO c-eFFvwl c-hBfzWL c-jRapcH c-iuXpvk c-kojyFS c-fwQTao c-kNqXEb c-jWtoMJ c-liRYQG c-huLkeJ c-eaeJEI c-eFTPCr c-iSwBqf c-bCyjow c-hjBzDg c-gSCRyo c-bNfHEu c-eFYwtl c-ewwrgk c-ekCNeI c-ewxXJy c-eUgBAM c-gNkPVL c-vINCg c-ivhbiN c-cHomai c-bQHvIY c-fxBZHy c-hWkySb c-cNuIPk c-kqvkfk c-KfFnA c-fFhAKI c-gCKge c-deZXRM c-fcclLm c-gquuCI c-UUNBw c-gFctFD c-gVTmWq c-jLIMzR c-eagrSl c-eWVgET c-kVHZSi c-hdMaTR c-cQcWEW c-fFxTms c-jHtcEb c-jPWlCg c-cTGEgl c-fCMKGn c-eyOZaa; }
--sxs { --sxs: 1; }
@media  {
  @keyframes k-fhCilR { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
  @keyframes k-kRVhFq { 
  0% { transform: rotate(0deg); }
  25% { transform: rotate(2deg); }
  50% { transform: rotate(-2deg); }
  75% { transform: rotate(2deg); }
  100% { transform: rotate(0deg); }
}
}
@media  {
  .c-fNvXDc { display: flex; flex: 1 1 0%; flex-direction: column; }
  .c-jjpMwf { background: var(--colors-inkLight); position: fixed; width: 300px; height: 100%; overflow: scroll; z-index: 1201; transition: 0.15s; box-shadow: rgba(0, 0, 0, 0.1) 0.1rem 0px 0.02rem; transform: translateX(-100%); left: 0px; top: 0px; bottom: 0px; }
  @media (min-width: 992px) {
  .c-jjpMwf { display: none; }
}
  .c-hSKcfS { display: flex; justify-content: space-between; align-items: center; padding: 16px; }
  .c-UazGY { display: flex; align-items: center; }
  .c-bLdNGJ { display: flex; cursor: pointer; }
  .c-iWpHqy { border-bottom: 1px solid rgb(217, 233, 242); }
  .c-cIdiJW { text-decoration: none; }
  .c-dVOKBM { display: flex; align-items: center; padding: 16px; }
  .c-kolHsO { margin-left: 8px; }
  .c-hOwCtY { color: var(--colors-secondaryDefault, rgb(0, 157, 124)); }
  .c-eBIusB { line-height: 1.2; margin: 0px; font-weight: var(--fontWeights-regular); display: block; }
  .c-fewYWN { color: var(--colors-skyLightest, rgb(255, 255, 255)); }
  .c-gTynjM { display: flex; flex-direction: row; flex: 1 1 0%; cursor: pointer; color: white; align-items: center; }
  .c-gTynjM span { color: white; }
  .c-gTynjM > svg { margin-right: var(--space-xs); }
  .c-eRhPxt { margin-right: 4px; filter: drop-shadow(rgba(0, 0, 0, 0.35) 0px 0px 2px); }
  .c-hqXzi { width: 16px; height: 16px; border-radius: 8px; }
  .c-hlTBXk { color: var(--colors-skyLightest); text-transform: capitalize; }
  .c-kokaPQ { margin-right: 8px; }
  .c-bNHULD { border-radius: 0px; flex: 1 1 0%; width: 100%; }
  @media (min-width: 992px) {
  .c-hzUrXJ { display: none; }
}
  .c-jDjnIk { display: flex; }
  .c-jDjnIk button { border-radius: 0px; }
  .c-fZlHvM svg path { stroke: var(--colors-secondaryDark); }
  .c-hJhMRA { overflow: hidden; width: fit-content; height: fit-content; }
  .c-gtpFUc { cursor: pointer; outline: none; user-select: none; justify-content: center; width: 100%; color: var(--colors-white); border: unset; transition: 150ms ease-out; display: flex; align-items: center; }
  .c-dFfuhX { color: var(--colors-skyLightest); }
  .c-dJpCLK { display: flex; flex-wrap: wrap; border-bottom: 0.5px solid rgb(217, 233, 242); }
  .c-fmXhxl { display: flex; width: 33%; align-items: center; justify-content: center; padding-top: 16px; padding-bottom: 16px; flex-direction: column; }
  .c-bCRLag { max-width: 32px; max-height: 32px; }
  .c-koofwM { margin-bottom: 8px; }
  .c-lcPmgm { display: flex; flex: 1 1 0%; gap: 8px; justify-content: center; }
  .c-lcPmgm > .c-fGHEql:empty { display: none; }
  .c-bHzkZd { padding-bottom: 16px; padding-right: 8px; margin-top: 20px; align-self: flex-end; }
  .c-SNhSq { display: flex; flex: 1 1 0%; position: relative; height: 100%; flex-direction: column; }
  @media (max-width: 991px) {
  .c-SNhSq { margin-bottom: 72px; }
}
  .c-MstJl { position: fixed; width: 100%; z-index: 1000; box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 10px; }
  @media (max-width: 991px) {
  .c-MstJl { display: none; }
}
  .c-MstJl { background: var(--colors-inkDefault); height: 143px; }
  .c-eITHhL { display: flex; align-items: center; background: var(--colors-inkLightest); height: 24px; }
  .c-fGHEql { width: 100%; }
  .c-dhzjXW { display: flex; }
  .c-iefmez { overflow: hidden; flex: 1 1 0%; align-items: center; display: flex; }
  .c-kbRxRG { color: white; height: 24px; }
  .c-iFAMB { display: flex; align-items: center; padding-top: 12px; }
  .c-hEWFPv { display: flex; flex: 1 1 0%; max-height: 34px; padding-top: 8px; padding-bottom: 8px; }
  .c-gzflTi { border-left: 0.5px solid white; border-right: 0.5px solid white; margin-left: 12px; margin-right: 12px; }
  .c-iMHPmU { display: flex; flex-direction: row; align-items: center; text-decoration: none; position: relative; }
  .c-iMHPmU::after { content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1px; background: var(--colors-secondaryDefault); transition: transform 300ms; transform: scale(0); transform-origin: center center; }
  .c-flWDnm { width: fit-content; }
  .c-bpaGqe { width: 140px; }
  @media (min-width: 1280px) {
  .c-bpaGqe { width: initial; }
}
  .c-kYtbRs { position: relative; display: flex; margin-right: 8px; }
  .c-hrlkMa { background: var(--colors-inkLightest, rgb(32, 102, 111)); border-radius: 4px; }
  .c-exXVOH { padding-top: 9px; padding-bottom: 9px; max-height: 36px; }
  .c-bZNrxE { display: flex; flex-direction: row; }
  .c-hyEoVL { position: relative; border-radius: 4px; display: flex; flex-direction: row; flex: 1 1 0%; align-items: center; }
  .c-kHqjIX { background: unset; border: unset; outline: none; color: white; display: flex; flex: 1 1 0%; padding-left: 16px; padding-right: 16px; }
  .c-kHqjIX::placeholder { color: var(--colors-skyLightest); opacity: 0.5; }
  .c-kHqjIX:disabled { color: var(--colors-skyLighter); opacity: 0.5; }
  @media (min-width: 992px) {
  .c-kHqjIX { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  @media (max-width: 991px) {
  .c-kHqjIX { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  .c-ldfSEu { position: absolute; user-select: none; pointer-events: none; left: 16px; opacity: 0.5; }
  .c-ekzekW { margin-left: 4px; margin-right: 4px; }
  .c-dlRlrD { margin-right: 12px; display: flex; align-items: center; }
  .c-iUzUHX { cursor: pointer; height: fit-content; display: flex; }
  .c-kiLWvQ svg path { stroke: var(--colors-primaryLight); }
  .c-kVFvxy { display: flex; margin-top: auto; }
  .c-bhjCFi { position: relative; width: 303px; }
  .c-jDChox { display: flex; height: 100%; align-items: center; }
  .c-eCRKlW { position: absolute; inset: 0px; display: flex; align-items: self-end; }
  .c-fqrbKy { width: 100%; margin-top: auto; margin-left: -32px; }
  .c-iOUgsF { background: var(--colors-inkLight); height: 37px; display: flex; flex: 1 1 0%; }
  .c-kZdsED { display: flex; flex: 1 1 0%; max-width: 984px; }
  .c-flysGN { display: flex; flex: 1 1 0%; align-items: center; justify-content: space-evenly; }
  .c-kEGpHA { text-decoration: none; position: relative; cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; background: transparent; display: flex; align-items: center; }
  .c-kEGpHA::after { content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1px; background: var(--colors-secondaryDefault); transition: transform 300ms; transform: scale(0); transform-origin: center center; }
  .c-lptOrU:hover { color: var(--colors-secondaryLight); }
  .c-dlmoIL { height: 72px; position: fixed; width: 100%; z-index: 1000; box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 10px; }
  @media (min-width: 992px) {
  .c-dlmoIL { display: none; }
}
  .c-fNsOmT { display: flex; flex: 1 1 0%; justify-content: space-between; align-items: center; height: 100%; }
  .c-fsejKH { width: 25px; height: 20px; position: relative; margin: 8px auto; transform: rotate(0deg); transition: 0.5s ease-in-out; cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: inherit; }
  .c-fsejKH > span { display: block; position: absolute; height: 2.4px; width: 100%; background: var(--colors-skyLightest); border-radius: 9px; opacity: 1; left: 0px; transform: rotate(0deg); transition: 0.25s ease-in-out; }
  .c-fsejKH > span:nth-child(1) { top: 0px; }
  .c-fsejKH > span:nth-child(2) { top: 9px; }
  .c-fsejKH > span:nth-child(3) { top: 9px; }
  .c-fsejKH > span:nth-child(4) { top: 18px; }
  .c-bjbdTA { background: var(--colors-skyLightest); }
  .c-cmpvrW { position: relative; }
  .c-lkBNdM { height: 100%; }
  .c-dbclGt { background: var(--colors-inkDark); }
  .c-lkXhhf { background-repeat: no-repeat; background-size: cover; background-position: center center; }
  .c-iBnCZM { margin-top: 20px; }
  .c-dvYIiP { position: relative; }
  @media (min-width: 992px) {
  .c-dvYIiP { padding-bottom: 24px; }
}
  .c-dvYIiP .awssld__bullets { bottom: 8px; z-index: 120; }
  .c-dvYIiP .awssld__bullets button { border-radius: 8px; height: 6px; width: 6px; cursor: pointer; background: var(--colors-secondaryLightest); margin: 0px 6px 0px 0px; }
  .c-dvYIiP .awssld__bullets .awssld__bullets--active { border-radius: 8px; height: 6px; width: 36px; margin: 0px 6px 0px 0px; cursor: pointer; background: var(--colors-secondaryLightest); transform: unset; }
  @media (min-width: 992px) {
  .c-krIkwM { display: none; }
}
  .c-fKbFaO { background: var(--colors-inkDefault); position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; }
  .c-jjBYZd { height: 40px; width: 40px; border-color: white; border-width: 5px; }
  .c-iwYAmO { border-style: solid; border-bottom-color: transparent; border-radius: 50%; display: inline-block; box-sizing: border-box; animation: 1s linear 0s infinite normal none running k-fhCilR; }
  .c-fxrEBZ { overflow: hidden; }
  .c-bsedBV { display: none; }
  @media (min-width: 992px) {
  .c-bsedBV { display: block; }
}
  .c-ciVisu { display: none; }
  @media (max-width: 991px) {
  .c-ciVisu { display: inherit; }
}
  .c-iflkHV { margin-top: 12px; }
  .c-jRSoJY { display: none; }
  @media (min-width: 992px) {
  .c-jRSoJY { display: inherit; }
}
  .c-ckhQIw { margin-left: 20px; }
  .c-gWIrTz { position: relative; height: 60%; margin-left: auto; margin-right: auto; margin-top: 5%; }
  .c-bkRTOV { position: absolute; bottom: -40%; left: 0px; right: 0px; padding-left: 8px; padding-right: 8px; }
  .c-jlrkmt { color: var(--colors-inkDefault, rgb(17, 54, 60)); text-transform: capitalize; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
  .c-eOCYEU { display: flex; flex: 1 1 0%; justify-content: space-between; background: var(--colors-inkLight); align-items: center; overflow-x: scroll; position: relative; height: 72px; }
  .c-dMEYqg { padding: 4px; max-height: 70px; object-fit: contain; }
  .c-iLMlZX { min-width: 72px; width: 100%; cursor: pointer; }
  .c-iLMlZX:hover { opacity: 0.9; }
  .c-ekwkue { margin-top: 4px; }
  .c-hiIaNd { width: 100%; color: var(--colors-skyLightest); font-style: normal; font-weight: 900; text-align: center; font-size: 16px; }
  @media (min-width: 414px) {
  .c-hiIaNd { font-size: 20px; }
}
  @media (min-width: 576px) {
  .c-hiIaNd { font-size: 24px; }
}
  @media (min-width: 768px) {
  .c-hiIaNd { font-size: 40px; }
}
  @media (min-width: 992px) {
  .c-hiIaNd { font-size: 44px; }
}
  @media (min-width: 1280px) {
  .c-hiIaNd { font-size: 52px; }
}
  @media (min-width: 1380px) {
  .c-hiIaNd { font-size: 60px; }
}
  @media (min-width: 992px) {
  .c-hiIaNd { font-family: "Markazi Text"; font-weight: 700; font-size: 70px; letter-spacing: 0.1em; }
}
  .c-dIVmuX { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; }
  .c-bmJXHW { display: flex; align-items: center; position: absolute; width: 80%; }
  @media (max-width: 991px) {
  .c-bmJXHW { flex-direction: column; justify-content: center; height: 20%; }
}
  @media (min-width: 992px) {
  .c-bmJXHW { height: 40%; }
}
  .c-bmJXHW { border-radius: 12px; margin-top: initial; margin-bottom: initial; height: initial; padding-top: 4%; }
  .c-iKKfHF { border: 8px double transparent; border-radius: 78px; background-origin: border-box; background-clip: content-box, border-box; width: 100%; }
  @media (max-width: 991px) {
  .c-iKKfHF { border: 4px double transparent; }
}
  @media (min-width: 992px) {
  .c-iKKfHF { border: 8px double transparent; margin-left: 24px; }
}
  .c-fixGjY { display: flex; flex-direction: column; }
  .c-iBqmQN { margin-top: 20px; margin-bottom: 20px; }
  .c-dZxKON { display: flex; flex-direction: row; gap: 12px; align-items: center; }
  @media (min-width: 992px) {
  .c-gDWphG { margin-bottom: 20px; }
}
  @media (max-width: 991px) {
  .c-gDWphG { margin-bottom: 12px; }
}
  .c-ismpOc { position: relative; }
  .c-ismpOc::before { top: 0px; position: absolute; left: 0px; width: 50px; height: 100%; content: ""; transition: opacity 0.3s; z-index: 2; opacity: 0; pointer-events: none; }
  .c-ismpOc::after { top: 0px; position: absolute; right: 0px; width: 50px; height: 100%; content: ""; transition: opacity 0.3s; z-index: 2; opacity: 0; pointer-events: none; }
  .c-jByKpI::before { background: linear-gradient(90deg, var(--colors-inkDefault, rgb(17, 54, 60)) 0px, transparent); }
  .c-jByKpI::after { background: linear-gradient(270deg, var(--colors-inkDefault, rgb(17, 54, 60)) 0px, transparent); }
  @media (min-width: 992px) {
  .c-gxkYxW { margin-left: 20px; }
}
  @media (max-width: 991px) {
  .c-gxkYxW { margin-left: 12px; }
}
  .c-hWnzoL { display: flex; overflow-x: scroll; }
  .c-hWnzoL::-webkit-scrollbar { display: none; }
  .c-eecxgq { max-width: 112px; max-height: 112px; min-width: 112px; min-height: 112px; object-fit: cover; padding: 2px; }
  @media (min-width: 992px) {
  .c-eecxgq { max-width: 136px; max-height: 136px; min-width: 136px; min-height: 136px; }
}
  .c-iyYdBa { border: 4px double transparent; border-radius: 20px; background-image: linear-gradient(white, white), conic-gradient(from -30.07deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 0deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 0.04deg, rgb(173, 207, 2) 18.14deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 90.32deg, rgb(173, 207, 2) 161.47deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 180.96deg, rgb(173, 207, 2) 210.72deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 273.52deg, rgb(173, 207, 2) 337.77deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 360deg); background-origin: border-box; background-clip: content-box, border-box; }
  @media (max-width: 991px) {
  .c-iyYdBa { border: 2px double transparent; }
}
  .c-gyesvQ { align-items: center; max-width: 112px; min-width: 112px; }
  @media (min-width: 992px) {
  .c-gyesvQ { max-width: 136px; min-width: 136px; }
}
  .c-iEaapN { position: relative; cursor: pointer; }
  .c-bAZTzz { position: absolute; inset: 6% 0px 0px; display: flex; transition: 0.3s linear; z-index: 1; }
  .c-bAZTzz svg { width: auto; height: 100%; }
  .c-bAZTzz path { transition: 0.3s linear; }
  .c-bAZTzz { height: 12px; }
  @media (min-width: 576px) {
  .c-bAZTzz { height: 20px; }
}
  .c-jRurjG { display: flex; padding-left: 0.4em; padding-right: 0.4em; transition: 0.3s linear; }
  .c-jRurjG span { line-height: 0px; margin-top: auto; margin-bottom: auto; font-size: 8px; }
  @media (min-width: 576px) {
  .c-jRurjG span { font-size: clamp(0.5em, 0.7em, 1em); }
}
  .c-ilxIoK { display: flex; flex-direction: column; align-items: center; margin-top: 8px; }
  @media (min-width: 992px) {
  .c-ilxIoK { margin-top: 12px; }
}
  @media (min-width: 992px) {
  .c-bUelen { background: var(--colors-inkDefault); }
}
  @media (max-width: 991px) {
  .c-bUelen { background: var(--colors-inkDark); }
}
  .c-bUelen { padding-bottom: 12px; }
  .c-jGlcIr { border-radius: 4px; overflow: hidden; }
  .c-kWkSpo { position: relative; background: transparent; border-style: solid; border-color: currentcolor; border-image-source: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-slice: 1; border-width: 2px; display: flex; flex: 1 1 0%; align-items: center; height: 100%; justify-content: space-between; }
  @media (min-width: 992px) {
  .c-kWkSpo { padding: 24px 40px; }
}
  @media (max-width: 991px) {
  .c-kWkSpo { padding: 24px 16px; flex-direction: column-reverse; }
}
  .c-bKXnuv { position: absolute; inset: 0px; }
  @media (min-width: 992px) {
  .c-bKXnuv { opacity: 0.16; }
}
  @media (max-width: 991px) {
  .c-bKXnuv { opacity: 0; }
}
  .c-bKXnuv { background: var(--colors-secondaryLightest); }
  .c-cKeKw { width: 40%; }
  @media (max-width: 991px) {
  .c-cKeKw { width: 100%; }
}
  .c-gotZkf { border-radius: 4px; width: 100%; }
  .c-jnjWSo { display: flex; align-items: center; justify-content: center; width: 100%; }
  .c-jnjWSo:first-child { margin-bottom: 24px; }
  .c-efADIY { display: flex; align-items: center; justify-content: center; border-radius: 50%; width: 105px; height: 105px; background: var(--colors-skyLightest); }
  @media (max-width: 991px) {
  .c-efADIY > * { width: 100%; height: 100%; }
}
  @media (min-width: 992px) {
  .c-efADIY { margin-right: 32px; }
}
  @media (max-width: 991px) {
  .c-efADIY { width: 88px; height: 88px; padding: 16px; }
}
  .c-bIJGHM { display: flex; flex-direction: column; flex: 1 1 0%; }
  @media (max-width: 991px) {
  .c-bIJGHM { margin-left: 25px; }
}
  .c-fHwvSc { display: flex; align-items: flex-end; margin-bottom: 16px; }
  .c-fcTNLc { display: flex; flex-direction: column; flex: 1 1 0%; }
  .c-dKVYBe { height: 12px; border-radius: 20px; background: var(--colors-skyLightest); width: 100%; overflow: hidden; }
  .c-fjePfl { background: var(--colors-secondaryDefault); height: 100%; }
  .c-ljuApQ { background: var(--colors-primaryDefault); margin-top: 32px; margin-bottom: 32px; width: 100%; height: 2px; }
  @media (min-width: 992px) {
  .c-ljuApQ { width: 2px; margin-left: 20px; margin-right: 20px; height: auto; align-self: stretch; }
}
  @media (min-width: 1280px) {
  .c-ljuApQ { width: 2px; margin-left: 56px; margin-right: 56px; height: auto; align-self: stretch; }
}
  .c-iKuNVO { display: flex; flex-wrap: wrap; justify-content: center; width: 60%; }
  @media (max-width: 991px) {
  .c-iKuNVO { width: 100%; }
}
  .c-eFFvwl { filter: invert(50%) sepia(100%) saturate(0%) hue-rotate(10deg) brightness(1000%) contrast(100%) grayscale(100%); }
  @media (max-width: 991px) {
  .c-eFFvwl { max-height: 16px; }
}
  @media (min-width: 992px) {
  .c-eFFvwl { max-height: 30px; }
}
  .c-hBfzWL { position: relative; margin: 20px 15px; width: 20%; }
  @media (min-width: 576px) {
  .c-hBfzWL { width: 17%; }
}
  @media (min-width: 768px) {
  .c-hBfzWL { width: 13%; }
}
  @media (min-width: 992px) {
  .c-hBfzWL { width: 22%; }
}
  .c-jRapcH { border-radius: 4px; height: 2px; background: var(--colors-primaryDefault); }
  .c-iuXpvk { position: absolute; top: -8px; left: 50%; transform: translate(-50%, 0px); }
  .c-kojyFS { margin-top: 8px; }
  .c-fwQTao { display: flex; max-width: 14px; max-height: 14px; min-width: 14px; min-height: 14px; border-radius: 50%; background: var(--colors-primaryDefault); margin-right: 20px; padding: 2px; }
  @media (max-width: 991px) {
  .c-fwQTao { margin-right: 8px; }
}
  .c-kNqXEb { width: 100%; border-radius: 50%; }
  .c-jWtoMJ { word-break: break-all; }
  @media (min-width: 992px) {
  .c-liRYQG { background: var(--colors-inkDefault); }
}
  @media (max-width: 991px) {
  .c-liRYQG { background: var(--colors-inkDark); }
}
  .c-liRYQG { padding-bottom: 24px; }
  .c-huLkeJ { position: relative; background: transparent; border-style: solid; border-color: currentcolor; border-image-source: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-slice: 1; border-width: 2px; display: flex; flex: 1 1 0%; height: 100%; flex-direction: column; }
  @media (min-width: 992px) {
  .c-huLkeJ { padding: 24px 40px 4px; }
}
  @media (max-width: 991px) {
  .c-huLkeJ { padding: 24px 16px 4px; }
}
  .c-eaeJEI { position: absolute; inset: 0px; }
  @media (min-width: 992px) {
  .c-eaeJEI { opacity: 0.16; }
}
  @media (max-width: 991px) {
  .c-eaeJEI { opacity: 0; }
}
  .c-eaeJEI { background: var(--colors-secondaryLightest); touch-action: none; pointer-events: none; }
  .c-eFTPCr { margin-bottom: 16px; }
  .c-iSwBqf { display: flex; flex-wrap: wrap; }
  .c-bCyjow { width: 100%; }
  @media (min-width: 576px) {
  .c-bCyjow { width: 49%; }
}
  @media (min-width: 768px) {
  .c-bCyjow { width: 32%; }
}
  @media (min-width: 992px) {
  .c-bCyjow { width: 24%; }
}
  .c-bCyjow { margin-bottom: 20px; margin-right: 8px; }
  .c-hjBzDg { width: 36px; height: 36px; max-height: 36px; max-width: 36px; min-width: 36px; min-height: 36px; background: var(--colors-secondaryDefault); border-radius: 4px; display: flex; align-items: center; justify-content: center; }
  .c-gSCRyo { padding-top: 8px; background: var(--colors-inkDefault); }
  .c-bNfHEu { padding-top: 48px; padding-bottom: 48px; }
  .c-eFYwtl { margin-top: 16px; }
  .c-ewwrgk { margin-bottom: 40px; }
  .c-ekCNeI { margin-bottom: 4px; }
  .c-ewxXJy { margin-top: 40px; }
  .c-eUgBAM { display: flex; flex: 1 1 0%; justify-content: center; }
  .c-gNkPVL { margin-left: 8px; display: flex; align-items: center; }
  .c-vINCg { display: flex; flex-direction: column; }
  @media (max-width: 991px) {
  .c-vINCg:nth-child(1), .c-vINCg:nth-child(2) { margin-bottom: 40px; }
}
  .c-vINCg:nth-child(2), .c-vINCg:nth-child(3) { align-items: center; }
  .c-vINCg:nth-child(1) { width: 30%; }
  @media (min-width: 992px) {
  .c-vINCg:nth-child(1) { border-right: 0.5px solid var(--colors-skyLightest); }
}
  .c-vINCg:nth-child(2) { width: 40%; }
  @media (min-width: 992px) {
  .c-vINCg:nth-child(2) { border-right: 0.5px solid var(--colors-skyLightest); }
}
  .c-vINCg:nth-child(3) { width: 30%; }
  .c-ivhbiN { width: 60%; }
  @media (max-width: 575px) {
  .c-ivhbiN { width: 80%; }
}
  .c-cHomai { display: flex; justify-content: space-between; }
  @media (max-width: 991px) {
  .c-cHomai { flex-direction: column; }
}
  .c-bQHvIY { display: flex; align-items: center; }
  .c-bQHvIY img { width: 20px; height: 20px; object-fit: contain; }
  .c-fxBZHy { max-width: 160px; max-height: 100px; min-width: 100px; object-fit: contain; }
  @media (max-width: 991px) {
  .c-fxBZHy { max-width: 80px; min-width: 50px; }
}
  .c-hWkySb { display: flex; align-items: center; height: 145px; }
  @media (max-width: 991px) {
  .c-hWkySb { height: 98px; }
}
  .c-hWkySb { overflow-y: scroll; }
  .c-cNuIPk { background: var(--colors-inkDark); padding-top: 20px; padding-bottom: 20px; }
  .c-kqvkfk { display: flex; justify-content: center; }
  .c-KfFnA { display: flex; flex-direction: column; align-items: center; justify-content: end; }
  .c-fFhAKI { padding-top: 12px; padding-bottom: 12px; background: var(--colors-skyLightest); }
  .c-gCKge { display: flex; flex: 1 1 0%; align-items: center; }
  @media (max-width: 991px) {
  .c-gCKge { flex-direction: column; }
}
  .c-deZXRM { display: flex; flex: 1 1 0%; align-items: center; }
  .c-fcclLm { margin-right: 24px; }
  .c-gquuCI { color: var(--colors-inkDefault, rgb(17, 54, 60)); }
  .c-UUNBw { cursor: pointer; padding-left: var(--space-space12); padding-right: var(--space-space12); display: flex; list-style-type: none; text-decoration: none; flex-direction: column; justify-content: center; align-items: center; }
  .c-gFctFD { display: flex; flex: 1 1 0%; flex-direction: row; position: fixed; bottom: 0px; z-index: 1001; height: 72px; width: 100%; align-items: center; box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 4px; background: var(--colors-inkDark); }
  @media (min-width: 992px) {
  .c-gFctFD { display: none; }
}
  .c-gVTmWq { height: 100%; display: flex; flex: 1 1 0%; user-select: none; justify-content: center; align-items: center; }
  .c-jLIMzR { position: fixed; right: 0px; width: fit-content; height: 0px; background: blue; top: 20%; transition: transform 250ms ease-out; }
  .c-eagrSl { background: var(--colors-angularGold); padding: 4px; width: 248px; float: right; }
  .c-eWVgET { width: 100%; height: 100%; background: var(--colors-redDark); }
  .c-kVHZSi { display: flex; flex: 1 1 0%; align-items: center; justify-content: center; }
  .c-hdMaTR { background: radial-gradient(50% 50%, var(--colors-redLight, rgb(255, 63, 15)) 7.29%, var(--colors-redDark, rgb(168, 34, 0)) 100%); padding: 12px; }
  .c-cQcWEW { width: 100%; height: 4px; background: var(--colors-angularGold); }
  .c-fFxTms { overflow: scroll; height: 400px; }
  @media screen and (max-height: 590px) {
  .c-fFxTms { height: 300px; }
}
  @media screen and (max-height: 460px) {
  .c-fFxTms { height: 200px; }
}
  .c-jHtcEb { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-left: 16px; }
  .c-jPWlCg { border-radius: 4px; display: flex; flex: 1 1 0%; align-items: center; padding: 12px 16px; cursor: pointer; }
  .c-cTGEgl { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
  .c-fCMKGn { height: 76px; width: 76px; padding: 4px; border-radius: 36px; float: right; cursor: pointer; background: var(--colors-angularGold); background-repeat: round; pointer-events: all; position: relative; transition: 300ms; }
  .c-eyOZaa { width: 100%; height: 100%; border-radius: 50%; background: radial-gradient(50% 50%, var(--colors-redLight, rgb(255, 63, 15)) 7.29%, var(--colors-redDark, rgb(168, 34, 0)) 100%); display: flex; justify-content: center; align-items: center; transform-origin: left top; white-space: nowrap; }
}
--sxs { --sxs: 3 c-dVOKBM-iDfZUm-active-true c-eBIusB-lcbVhe-whitelabel-default c-eBIusB-jMbvfn-variant-body1Regular c-dVOKBM-hmxryr-active-false c-hqXzi-iPvquN-isMobile-true c-gtpFUc-epMvHt-variant-small c-gtpFUc-byHMer-buttonType-tertiary c-eBIusB-loYxcV-variant-body3Medium c-gtpFUc-ewcrAC-buttonType-primary c-eBIusB-fKCCCT-variant-body2Medium c-eBIusB-gGtGlI-variant-caption1Regular c-eBIusB-gsXdEb-align-right c-fGHEql-fvfCsT-variant-onlyLeft c-dhzjXW-ejCoEP-direction-horizontal c-dhzjXW-DIXHo-alignContent-stretch c-dhzjXW-jroWjL-alignItems-center c-dhzjXW-bWhLCh-alignSelf-auto c-dhzjXW-awKDG-justify-start c-dhzjXW-kVNAnR-wrap-noWrap c-fGHEql-jvtgLD-variant-default c-eBIusB-jzvilD-variant-caption1Medium c-dFfuhX-knjGtB-isGaruda-false c-eBIusB-eKEuTC-variant-body3Regular c-gtpFUc-khvKJZ-buttonType-secondary c-kVFvxy-jpKRnm-isAuthenticated-false c-iMHPmU-bOqmrA-state-active c-dFfuhX-dBHBrn-state-active-false c-eBIusB-Wtgcs-variant-body2Regular c-dlmoIL-iDfZUm-isGaruda-false c-fNvXDc-iBMrbG-isGaruda-false c-PJLV-iYrBIK-media-onlyDesktop c-fGHEql-iYrBIK-media-onlyDesktop c-eBIusB-gjdJOs-align-center c-eBIusB-fNkPXa-variant-caption2Regular c-eBIusB-hyvuql-weight-bold c-eBIusB-kLOZSH-variant-caption1Bold c-kNqXEb-jVhoZ-isActive-true c-PJLV-csntYZ-size-md c-PJLV-gboIbk-size-sm c-PJLV-cELXAq-size-mobile c-PJLV-bsuXh-size-lg c-bNfHEu-hmxryr-isGaruda-false c-dFfuhX-hXcvcN-isGaruda-false c-bNfHEu-iDfZUm-isGaruda-false c-fxBZHy-bMYZZi-separator-true c-KfFnA-fbYFYg-separator-true c-PJLV-cwdgLk-media-onlyMobile c-jLIMzR-ebohZG-isOpen-false c-eagrSl-hjkvhz-isOpen-false c-eBIusB-gfCyWM-variant-title3Bold; }
--sxs { --sxs: 2; }
@media  {
}
@media  {
  .c-dVOKBM-iDfZUm-active-true { background: var(--colors-inkDefault); }
  .c-eBIusB-lcbVhe-whitelabel-default { font-family: var(--font-be-vietnam-pro); }
  .c-eBIusB-jMbvfn-variant-body1Regular { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-sm); }
  .c-dVOKBM-hmxryr-active-false { background: var(--colors-inkLight); }
  .c-hqXzi-iPvquN-isMobile-true { width: 24px; height: 24px; border-radius: 12px; }
  .c-gtpFUc-epMvHt-variant-small { padding: 9px 24px; }
  .c-gtpFUc-byHMer-buttonType-tertiary { background: var(--colors-skyLightest); }
  .c-gtpFUc-byHMer-buttonType-tertiary span { color: var(--colors-inkDefault); }
  .c-gtpFUc-byHMer-buttonType-tertiary svg path { stroke: var(--colors-inkDefault); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover { background: var(--colors-secondaryLightest); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active { background: var(--colors-secondaryLighter); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] { background: var(--colors-secondaryLighter); cursor: wait; }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled span { color: var(--colors-skyLight); }
  .c-eBIusB-loYxcV-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
  .c-gtpFUc-ewcrAC-buttonType-primary { background: var(--colors-primaryLight); }
  .c-gtpFUc-ewcrAC-buttonType-primary svg path { stroke: var(--colors-inkDefault); }
  .c-gtpFUc-ewcrAC-buttonType-primary span { color: var(--colors-inkDefault); }
  .c-gtpFUc-ewcrAC-buttonType-primary:hover { background: var(--colors-primaryLighter); }
  .c-gtpFUc-ewcrAC-buttonType-primary:active { background: var(--colors-primaryLighteyarnst); }
  .c-gtpFUc-ewcrAC-buttonType-primary[loading] { background: var(--colors-primaryDefault); cursor: wait; }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled span { color: var(--colors-skyLight); }
  .c-eBIusB-fKCCCT-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
  .c-eBIusB-gGtGlI-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
  .c-eBIusB-gsXdEb-align-right { text-align: right; }
  .c-fGHEql-fvfCsT-variant-onlyLeft { margin: 0px auto; padding-left: var(--space-sm); }
  @media (min-width: 414px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-sm); }
}
  @media (min-width: 576px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-md); }
}
  @media (min-width: 768px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-md); }
}
  @media (min-width: 992px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-xl); }
}
  @media (min-width: 1280px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { max-width: 1580px; }
}
  .c-dhzjXW-ejCoEP-direction-horizontal { flex-direction: row; }
  .c-dhzjXW-DIXHo-alignContent-stretch { align-content: stretch; }
  .c-dhzjXW-jroWjL-alignItems-center { align-items: center; }
  .c-dhzjXW-bWhLCh-alignSelf-auto { align-self: auto; }
  .c-dhzjXW-awKDG-justify-start { justify-content: flex-start; }
  .c-dhzjXW-kVNAnR-wrap-noWrap { flex-wrap: nowrap; }
  .c-fGHEql-jvtgLD-variant-default { width: 100%; margin: 0px auto; padding-left: 8px; padding-right: 8px; }
  @media (min-width: 414px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-sm); padding-right: var(--space-sm); }
}
  @media (min-width: 576px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-md); padding-right: var(--space-md); }
}
  @media (min-width: 768px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-md); padding-right: var(--space-md); }
}
  @media (min-width: 992px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-xl); padding-right: var(--space-xl); }
}
  @media (min-width: 1280px) {
  .c-fGHEql-jvtgLD-variant-default { max-width: 1580px; padding-left: var(--space-xl); padding-right: var(--space-xl); }
}
  .c-eBIusB-jzvilD-variant-caption1Medium { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxxs); }
  .c-dFfuhX-knjGtB-isGaruda-false:hover { color: var(--colors-secondaryDefault); }
  .c-eBIusB-eKEuTC-variant-body3Regular { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
  .c-gtpFUc-khvKJZ-buttonType-secondary { background: transparent; border-style: solid; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-slice: 1; border-width: 1.5px; border-image-source: var(--colors-primaryDefault); border-color: transparent; }
  .c-gtpFUc-khvKJZ-buttonType-secondary span { background: var(--colors-primaryLight); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:hover { background: var(--colors-secondaryLightest); }
  .c-gtpFUc-khvKJZ-buttonType-secondary:hover span { color: var(--colors-secondaryDefault); background: transparent; -webkit-text-fill-color: initial; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:hover svg path { stroke: var(--colors-secondaryDefault); }
  .c-gtpFUc-khvKJZ-buttonType-secondary:active { border-image-source: none; }
  .c-gtpFUc-khvKJZ-buttonType-secondary[loading] { background: var(--colors-secondaryLightest); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: wait; }
  .c-gtpFUc-khvKJZ-buttonType-secondary[loading] span { color: var(--colors-secondaryDefault); background: transparent; -webkit-text-fill-color: initial; }
  .c-gtpFUc-khvKJZ-buttonType-secondary[loading] svg path { stroke: var(--colors-secondaryDefault); }
  .c-gtpFUc-khvKJZ-buttonType-secondary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; border-image-source: none; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:disabled span { color: var(--colors-skyLight); background: transparent; -webkit-text-fill-color: initial; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-kVFvxy-jpKRnm-isAuthenticated-false { height: 71px; }
  .c-iMHPmU-bOqmrA-state-active::after { transform: scale(1); background: var(--colors-secondaryDefault); }
  .c-eBIusB-Wtgcs-variant-body2Regular { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xs); }
  .c-dFfuhX-dBHBrn-state-active-false { color: var(--colors-secondaryDefault); }
  .c-dlmoIL-iDfZUm-isGaruda-false { background: var(--colors-inkDefault); }
  @media (min-width: 992px) {
  .c-fNvXDc-iBMrbG-isGaruda-false { margin-top: 143px; }
}
  @media (max-width: 991px) {
  .c-fNvXDc-iBMrbG-isGaruda-false { margin-top: 96px; }
}
  @media (max-width: 991px) {
  .c-PJLV-iYrBIK-media-onlyDesktop { margin: 0px; padding: 0px; }
}
  @media (max-width: 991px) {
  .c-fGHEql-iYrBIK-media-onlyDesktop { margin: 0px; padding: 0px; }
}
  .c-eBIusB-gjdJOs-align-center { text-align: center; }
  .c-eBIusB-fNkPXa-variant-caption2Regular { font-size: var(--fontSizes-size10); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxxs); }
  .c-eBIusB-hyvuql-weight-bold { font-weight: var(--fontWeights-bold); }
  .c-eBIusB-kLOZSH-variant-caption1Bold { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xxxs); }
  .c-kNqXEb-jVhoZ-isActive-true { background: var(--colors-radialGreen); }
  .c-PJLV-csntYZ-size-md { width: 0%; }
  @media (min-width: 768px) {
  .c-PJLV-csntYZ-size-md { width: 3%; }
}
  @media (min-width: 992px) {
  .c-PJLV-csntYZ-size-md { width: 0%; }
}
  .c-PJLV-gboIbk-size-sm { width: 0%; }
  @media (min-width: 576px) {
  .c-PJLV-gboIbk-size-sm { width: 3%; }
}
  @media (min-width: 768px) {
  .c-PJLV-gboIbk-size-sm { width: 0%; }
}
  .c-PJLV-cELXAq-size-mobile { width: 5%; }
  @media (min-width: 576px) {
  .c-PJLV-cELXAq-size-mobile { width: 0%; }
}
  .c-PJLV-bsuXh-size-lg { width: 0%; }
  @media (min-width: 992px) {
  .c-PJLV-bsuXh-size-lg { width: 3%; }
}
  .c-bNfHEu-hmxryr-isGaruda-false { background: var(--colors-inkLight); }
  @media (min-width: 992px) {
  .c-dFfuhX-hXcvcN-isGaruda-false { color: var(--colors-secondaryDefault); }
}
  .c-bNfHEu-iDfZUm-isGaruda-false { background: var(--colors-inkDefault); }
  .c-fxBZHy-bMYZZi-separator-true { margin-left: 48px; }
  .c-KfFnA-fbYFYg-separator-true { margin-left: 24px; }
  @media (min-width: 992px) {
  .c-PJLV-cwdgLk-media-onlyMobile { margin: 0px; padding: 0px; }
}
  .c-jLIMzR-ebohZG-isOpen-false { z-index: 10000; }
  @media (max-width: 991px) {
  .c-eagrSl-hjkvhz-isOpen-false { display: none; }
}
  .c-eBIusB-gfCyWM-variant-title3Bold { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
}
--sxs { --sxs: 4 c-eBIusB-kSJUXs-variant-body3Medium c-eBIusB-fDixPJ-variant-body3Bold c-eBIusB-gKMNip-variant-body1Bold c-eBIusB-cNUKOG-variant-caption1Regular c-eBIusB-jpHPls-variant-title3Bold c-eBIusB-gBCbql-variant-body1Bold c-gtpFUc-cbzYqV-variant-small c-gtpFUc-hBVbCC-variant-extrasmall c-eBIusB-LfmpZ-variant-body3Medium c-eBIusB-ioMTLi-variant-caption1Medium c-eBIusB-eKviWz-variant-body1Regular c-eBIusB-hYBfdz-variant-body3Regular c-eBIusB-ikrVeB-variant-title2Bold c-eBIusB-kDaEZN-variant-title3Bold c-eBIusB-cKoJQG-variant-body2Medium c-eBIusB-ceAgew-variant-title3Medium c-eBIusB-keWrTP-variant-body2Bold c-eBIusB-ghrupU-variant-body3Bold c-eBIusB-fFCBbE-variant-body2Regular c-eBIusB-KiKpV-variant-caption1Regular c-eBIusB-kQBDqU-variant-body1Medium c-eBIusB-hHeUkq-variant-body3Regular c-eBIusB-dIvCrr-variant-body2Medium c-eBIusB-QwcWc-variant-body3Medium; }
@media  {
  @media (min-width: 1280px) {
  .c-eBIusB-kSJUXs-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-fDixPJ-variant-body3Bold { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 1280px) {
  .c-eBIusB-gKMNip-variant-body1Bold { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-sm); }
}
  @media (min-width: 576px) {
  .c-eBIusB-cNUKOG-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-jpHPls-variant-title3Bold { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
}
  @media (max-width: 991px) {
  .c-eBIusB-gBCbql-variant-body1Bold { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-sm); }
}
  @media (min-width: 992px) {
  .c-gtpFUc-cbzYqV-variant-small { padding: 9px 24px; }
}
  @media (max-width: 991px) {
  .c-gtpFUc-hBVbCC-variant-extrasmall { padding: 6px 16px; }
}
  @media (min-width: 992px) {
  .c-eBIusB-LfmpZ-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-ioMTLi-variant-caption1Medium { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-eKviWz-variant-body1Regular { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-sm); }
}
  @media (max-width: 991px) {
  .c-eBIusB-hYBfdz-variant-body3Regular { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-ikrVeB-variant-title2Bold { font-size: var(--fontSizes-size32); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-lg); }
}
  @media (max-width: 991px) {
  .c-eBIusB-kDaEZN-variant-title3Bold { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
}
  @media (max-width: 991px) {
  .c-eBIusB-cKoJQG-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-ceAgew-variant-title3Medium { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-md); }
}
  @media (min-width: 992px) {
  .c-eBIusB-keWrTP-variant-body2Bold { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-ghrupU-variant-body3Bold { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-fFCBbE-variant-body2Regular { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-KiKpV-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-kQBDqU-variant-body1Medium { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-sm); }
}
  @media (min-width: 992px) {
  .c-eBIusB-hHeUkq-variant-body3Regular { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-dIvCrr-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-QwcWc-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
}
}
--sxs { --sxs: 5 c-gtpFUc-cCcRdZ-cv; }
@media  {
  .c-gtpFUc-cCcRdZ-cv { padding: 7.5px 22.5px; }
}
--sxs { --sxs: 6 c-dhzjXW-iknTffZ-css c-lkXhhf-icPoupP-css c-kWkSpo-ieNoVsq-css c-fjePfl-itYszh-css c-fjePfl-ibdnoLv-css c-dhzjXW-iPJLV-css c-huLkeJ-ieNoVsq-css c-gFctFD-iPJLV-css c-PJLV-icqLMts-css; }
@media  {
  .c-dhzjXW-iknTffZ-css > :not(:first-child) { margin-left: 8px; }
  .c-lkXhhf-icPoupP-css { background-image: url("/reference/assets/ff33e4a415386814.webp"); }
  .c-kWkSpo-ieNoVsq-css { border-image-source: linear-gradient(90deg, var(--colors-primaryDefault, rgb(212, 253, 7)) 100%, var(--colors-primaryDefault, rgb(212, 253, 7)) 130%); border-image-slice: 1; }
  .c-fjePfl-itYszh-css { width: 10%; }
  .c-fjePfl-ibdnoLv-css { width: 30%; }
  .c-huLkeJ-ieNoVsq-css { border-image-source: linear-gradient(90deg, var(--colors-primaryDefault, rgb(212, 253, 7)) 100%, var(--colors-primaryDefault, rgb(212, 253, 7)) 130%); border-image-slice: 1; }
  .c-PJLV-icqLMts-css { margin-bottom: var(--space-space8); }
}
:root { color-scheme: light only; }
h1, h2, h3, h4, h5, h6 { margin: 0px; }
html { font-family: var(--font-be-vietnam-pro); font-size: 16px; clear: both; box-shadow: none; }
* { box-sizing: border-box; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: darkgrey transparent; }
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: none; border-radius: 50%; }
::-webkit-scrollbar-thumb { background-color: darkgrey; border-radius: 24px; }
::-webkit-scrollbar-corner { background: rgba(0, 0, 0, 0); visibility: hidden; }
.no-scrollbar::-webkit-scrollbar { width: 0px; height: 0px; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition-delay: 9999s; }
::before { box-sizing: border-box; }
::after { box-sizing: border-box; }
ul[class] { margin: 0px; list-style: none; }
ol[class] { margin: 0px; list-style: none; }
body { max-width: 100vw; min-height: 100vh; text-rendering: optimizespeed; margin: 0px; display: flex; flex: 1 1 0%; flex-direction: column; }
body > div#__next { height: 100vh; }
figure { margin: 0px; }
blockquote { margin: 0px; }
dl { margin: 0px; }
dd { margin: 0px; }
a:not([class]) { text-decoration-skip-ink: auto; }
img { max-width: 100%; display: block; }
input { font: inherit; }
button { font: inherit; }
textarea { font: inherit; }
select { font: inherit; }
img:not([alt]) { filter: blur(10px); }
img { color: white; }
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms; animation-iteration-count: 1; transition-duration: 0.01ms; scroll-behavior: auto; }
}
amp-script { opacity: 1; }
.marqueeAMP { height: 20px; width: 100%; position: relative; }
.marqueeAMP div { display: flex; min-width: 200%; width: max-content; height: 100%; position: absolute; animation: 20s linear 0s infinite normal none running marqueeAMP; }
.marqueeAMP span { width: 50%; display: flex; align-items: center; }
@keyframes marqueeAMP { 
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}
.lottery-marquee-container { overflow: hidden; width: 100%; display: flex; }
.lottery-marquee-track { display: flex; flex-direction: row; animation: 20s linear 0s infinite normal none running lotteryMarqueeAMP; gap: 12px; }
@keyframes lotteryMarqueeAMP { 
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}
--sxs { --sxs: 0; }
@media  {
  :root, .t-goXYqq { --colors-redDark: #A82200; --colors-redDefault: #DD2C00; --colors-redLight: #FF3F0F; --colors-redLighter: #FF6842; --colors-redLightest: #FFD6CC; --colors-blueDark: #0077E6; --colors-blueDefault: #1890FF; --colors-blueLight: #4CA9FF; --colors-blueLighter: #80C2FF; --colors-blueLightest: #CCE6FF; --colors-greenDark: #20950E; --colors-greenDefault: #2BC312; --colors-greenLight: #3AEA1F; --colors-greenLighter: #63EF4E; --colors-greenLightest: #D6FBD0; --colors-yellowDark: #B27700; --colors-yellowDefault: #FFB31C; --colors-yellowLight: #FFC34D; --colors-yellowLighter: #FFD480; --colors-yellowLightest: #FFEECC; --colors-radialRed: radial-gradient(50% 50% at 50% 50%, #FF3F0F 7.29%, #A82200 100%); --colors-radialGreen: radial-gradient(50% 50% at 50% 50%, #3AEA1F 7.29%, #20950E 100%); --colors-radialBlack: radial-gradient(343.26% 209.7% at 50% 50.3%, #252627 0%, #000000 100%); --colors-error: var(--colors-redDefault); --colors-success: var(--colors-greenDefault); --fontWeights-light: 300; --fontWeights-regular: 400; --fontWeights-medium: 500; --fontWeights-bold: 700; --fontSizes-size10: 10px; --fontSizes-size12: 12px; --fontSizes-size14: 14px; --fontSizes-size16: 16px; --fontSizes-size18: 18px; --fontSizes-size24: 24px; --fontSizes-size32: 32px; --fontSizes-size48: 48px; --lineHeights-xxxxs: 13px; --lineHeights-xxxs: 16px; --lineHeights-xxs: 18px; --lineHeights-xs: 21px; --lineHeights-sm: 23px; --lineHeights-md: 31px; --lineHeights-lg: 42px; --lineHeights-xl: 62px; --sizes-pageMaxWidth: 1504px; --sizes-xs: 490px; --sizes-sm: 690px; --sizes-md: 740px; --sizes-lg: 900px; --sizes-xl: 1140px; --sizes-xxl: 1280px; --sizes-xxxl: 1540px; --space-space4: 4px; --space-space8: 8px; --space-space12: 12px; --space-space16: 16px; --space-space20: 20px; --space-space24: 24px; --space-space36: 36px; --space-space48: 48px; --space-xs: 8px; --space-sm: 12px; --space-md: 24px; --space-lg: 36px; --space-xl: 48px; --space-xxl: 86px; --space-xxxl: 108px; --space-xxxxl: 156px; --zIndices-header: 119; }
  .t-jjUASA { --colors-redDark: #A82200; --colors-redDefault: #DD2C00; --colors-redLight: #FF3F0F; --colors-redLighter: #FF6842; --colors-redLightest: #FFD6CC; --colors-blueDark: #0077E6; --colors-blueDefault: #1890FF; --colors-blueLight: #4CA9FF; --colors-blueLighter: #80C2FF; --colors-blueLightest: #CCE6FF; --colors-greenDark: #20950E; --colors-greenDefault: #2BC312; --colors-greenLight: #3AEA1F; --colors-greenLighter: #63EF4E; --colors-greenLightest: #D6FBD0; --colors-yellowDark: #B27700; --colors-yellowDefault: #FFB31C; --colors-yellowLight: #FFC34D; --colors-yellowLighter: #FFD480; --colors-yellowLightest: #FFEECC; --colors-radialRed: radial-gradient(50% 50% at 50% 50%, var(--colors-redLight, #FF3F0F) 7.29%, var(--colors-redDark, #A82200) 100%); --colors-radialGreen: radial-gradient(50% 50% at 50% 50%, var(--colors-greenLight, #3AEA1F) 7.29%, var(--colors-greenDark, #20950E) 100%); --colors-radialBlack: radial-gradient(343.26% 209.7% at 50% 50.3%, #252627 0%, #000000 100%); --colors-error: var(--colors-redDefault); --colors-success: var(--colors-greenDefault); --colors-primaryDark: #ADD001; --colors-primaryDefault: #D4FD07; --colors-primaryLight: #DBFD30; --colors-primaryLighter: #DFFE49; --colors-primaryLightest: #E8FE7B; --colors-secondaryDark: #9F8487; --colors-secondaryDefault: #009D7C; --colors-secondaryLight: #ADD001; --colors-secondaryLighter: #CBBDBF; --colors-secondaryLightest: #E2DADB; --colors-inkDark: #0C262A; --colors-inkDefault: #11363C; --colors-inkLight: #16454B; --colors-inkLighter: #1B575F; --colors-inkLightest: #20666F; --colors-skyDarker: #707475; --colors-skyDefault: #8A8E8F; --colors-skyDefaultHalf: rgba(138, 142, 143, 0.2); --colors-skyLight: #BEC0C1; --colors-skyLighter: #F2F2F3; --colors-skyLightest: #FFFFFF; --colors-angularGold: conic-gradient(from -30.07deg at 50% 50%, var(--colors-primaryLightest, #E8FE7B) 0deg, var(--colors-primaryLightest, #E8FE7B) 0.04deg, #ADCF02 18.14deg, var(--colors-primaryLightest, #E8FE7B) 90.32deg, #ADCF02 161.47deg, var(--colors-primaryLightest, #E8FE7B) 180.96deg, #ADCF02 210.72deg, var(--colors-primaryLightest, #E8FE7B) 273.52deg, #ADCF02 337.77deg, var(--colors-primaryLightest, #E8FE7B) 360deg); --colors-linear: linear-gradient(90deg, rgba(22, 69, 75, 0.9) 21.88%, rgba(32, 102, 111, 0.9) 100%); --colors-linearCard: linear-gradient(180deg, #27488E 0%, #12254C 100%); --urls-gameCategoryBg: /themes/whiskey/game-category-bg-8.png; --urls-rtpBg: /themes/whiskey/rtp-bg-8.webp; --urls-jackpotDesktop: /themes/whiskey/jackpot-8.webp; --urls-jackpotMobile: /themes/whiskey/jackpot-8.webp; }
}
--sxs { --sxs: 1; }
@media  {
}
--sxs { --sxs: 2; }
@media  {
  .c-fNvXDc { display: flex; flex: 1 1 0%; flex-direction: column; }
  .c-jjpMwf { background: var(--colors-inkLight); position: fixed; width: 300px; height: 100%; overflow: scroll; z-index: 1201; transition: 0.15s; box-shadow: rgba(0, 0, 0, 0.1) 0.1rem 0px 0.02rem; transform: translateX(-100%); left: 0px; top: 0px; bottom: 0px; }
  @media (min-width: 992px) {
  .c-jjpMwf { display: none; }
}
  .c-hSKcfS { display: flex; justify-content: space-between; align-items: center; padding: 16px; }
  .c-UazGY { display: flex; align-items: center; }
  .c-bLdNGJ { display: flex; cursor: pointer; }
  .c-iWpHqy { border-bottom: 1px solid rgb(217, 233, 242); }
  .c-cIdiJW { text-decoration: none; }
  .c-dVOKBM { display: flex; align-items: center; padding: 16px; }
  .c-kolHsO { margin-left: 8px; }
  .c-hOwCtY { color: var(--colors-secondaryDefault, rgb(0, 157, 124)); }
  .c-eBIusB { line-height: 1.2; margin: 0px; font-weight: var(--fontWeights-regular); display: block; }
  .c-fewYWN { color: var(--colors-skyLightest, rgb(255, 255, 255)); }
  .c-gTynjM { display: flex; flex-direction: row; flex: 1 1 0%; cursor: pointer; color: white; align-items: center; }
  .c-gTynjM span { color: white; }
  .c-gTynjM > svg { margin-right: var(--space-xs); }
  .c-eRhPxt { margin-right: 4px; filter: drop-shadow(rgba(0, 0, 0, 0.35) 0px 0px 2px); }
  .c-hqXzi { width: 16px; height: 16px; border-radius: 8px; }
  .c-hlTBXk { color: var(--colors-skyLightest); text-transform: capitalize; }
  .c-kokaPQ { margin-right: 8px; }
  .c-bNHULD { border-radius: 0px; flex: 1 1 0%; width: 100%; }
  @media (min-width: 992px) {
  .c-hzUrXJ { display: none; }
}
  .c-jDjnIk { display: flex; }
  .c-jDjnIk button { border-radius: 0px; }
  .c-fZlHvM svg path { stroke: var(--colors-secondaryDark); }
  .c-hJhMRA { overflow: hidden; width: fit-content; height: fit-content; }
  .c-gtpFUc { cursor: pointer; outline: none; user-select: none; justify-content: center; width: 100%; color: var(--colors-white); border: unset; transition: 150ms ease-out; display: flex; align-items: center; }
  .c-dFfuhX { color: var(--colors-skyLightest); }
  .c-dJpCLK { display: flex; flex-wrap: wrap; border-bottom: 0.5px solid rgb(217, 233, 242); }
  .c-fmXhxl { display: flex; width: 33%; align-items: center; justify-content: center; padding-top: 16px; padding-bottom: 16px; flex-direction: column; }
  .c-bCRLag { max-width: 32px; max-height: 32px; }
  .c-koofwM { margin-bottom: 8px; }
  .c-lcPmgm { display: flex; flex: 1 1 0%; gap: 8px; justify-content: center; }
  .c-lcPmgm > .c-fGHEql:empty { display: none; }
  .c-bHzkZd { padding-bottom: 16px; padding-right: 8px; margin-top: 20px; align-self: flex-end; }
}
--sxs { --sxs: 3; }
@media  {
  .c-dVOKBM-iDfZUm-active-true { background: var(--colors-inkDefault); }
  .c-eBIusB-lcbVhe-whitelabel-default { font-family: var(--font-be-vietnam-pro); }
  .c-eBIusB-jMbvfn-variant-body1Regular { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-sm); }
  .c-dVOKBM-hmxryr-active-false { background: var(--colors-inkLight); }
  .c-hqXzi-iPvquN-isMobile-true { width: 24px; height: 24px; border-radius: 12px; }
  .c-gtpFUc-epMvHt-variant-small { padding: 9px 24px; }
  .c-gtpFUc-byHMer-buttonType-tertiary { background: var(--colors-skyLightest); }
  .c-gtpFUc-byHMer-buttonType-tertiary span { color: var(--colors-inkDefault); }
  .c-gtpFUc-byHMer-buttonType-tertiary svg path { stroke: var(--colors-inkDefault); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover { background: var(--colors-secondaryLightest); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active { background: var(--colors-secondaryLighter); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] { background: var(--colors-secondaryLighter); cursor: wait; }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled span { color: var(--colors-skyLight); }
  .c-eBIusB-loYxcV-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
  .c-gtpFUc-ewcrAC-buttonType-primary { background: var(--colors-primaryLight); }
  .c-gtpFUc-ewcrAC-buttonType-primary svg path { stroke: var(--colors-inkDefault); }
  .c-gtpFUc-ewcrAC-buttonType-primary span { color: var(--colors-inkDefault); }
  .c-gtpFUc-ewcrAC-buttonType-primary:hover { background: var(--colors-primaryLighter); }
  .c-gtpFUc-ewcrAC-buttonType-primary:active { background: var(--colors-primaryLighteyarnst); }
  .c-gtpFUc-ewcrAC-buttonType-primary[loading] { background: var(--colors-primaryDefault); cursor: wait; }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled span { color: var(--colors-skyLight); }
  .c-eBIusB-fKCCCT-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
  .c-eBIusB-gGtGlI-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
  .c-eBIusB-gsXdEb-align-right { text-align: right; }
}
--sxs { --sxs: 4; }
@media  {
}
--sxs { --sxs: 5; }
@media  {
}
--sxs { --sxs: 6; }
@media  {
}
--sxs { --sxs: 0; }
@media  {
  :root, .t-goXYqq { --colors-redDark: #A82200; --colors-redDefault: #DD2C00; --colors-redLight: #FF3F0F; --colors-redLighter: #FF6842; --colors-redLightest: #FFD6CC; --colors-blueDark: #0077E6; --colors-blueDefault: #1890FF; --colors-blueLight: #4CA9FF; --colors-blueLighter: #80C2FF; --colors-blueLightest: #CCE6FF; --colors-greenDark: #20950E; --colors-greenDefault: #2BC312; --colors-greenLight: #3AEA1F; --colors-greenLighter: #63EF4E; --colors-greenLightest: #D6FBD0; --colors-yellowDark: #B27700; --colors-yellowDefault: #FFB31C; --colors-yellowLight: #FFC34D; --colors-yellowLighter: #FFD480; --colors-yellowLightest: #FFEECC; --colors-radialRed: radial-gradient(50% 50% at 50% 50%, #FF3F0F 7.29%, #A82200 100%); --colors-radialGreen: radial-gradient(50% 50% at 50% 50%, #3AEA1F 7.29%, #20950E 100%); --colors-radialBlack: radial-gradient(343.26% 209.7% at 50% 50.3%, #252627 0%, #000000 100%); --colors-error: var(--colors-redDefault); --colors-success: var(--colors-greenDefault); --fontWeights-light: 300; --fontWeights-regular: 400; --fontWeights-medium: 500; --fontWeights-bold: 700; --fontSizes-size10: 10px; --fontSizes-size12: 12px; --fontSizes-size14: 14px; --fontSizes-size16: 16px; --fontSizes-size18: 18px; --fontSizes-size24: 24px; --fontSizes-size32: 32px; --fontSizes-size48: 48px; --lineHeights-xxxxs: 13px; --lineHeights-xxxs: 16px; --lineHeights-xxs: 18px; --lineHeights-xs: 21px; --lineHeights-sm: 23px; --lineHeights-md: 31px; --lineHeights-lg: 42px; --lineHeights-xl: 62px; --sizes-pageMaxWidth: 1504px; --sizes-xs: 490px; --sizes-sm: 690px; --sizes-md: 740px; --sizes-lg: 900px; --sizes-xl: 1140px; --sizes-xxl: 1280px; --sizes-xxxl: 1540px; --space-space4: 4px; --space-space8: 8px; --space-space12: 12px; --space-space16: 16px; --space-space20: 20px; --space-space24: 24px; --space-space36: 36px; --space-space48: 48px; --space-xs: 8px; --space-sm: 12px; --space-md: 24px; --space-lg: 36px; --space-xl: 48px; --space-xxl: 86px; --space-xxxl: 108px; --space-xxxxl: 156px; --zIndices-header: 119; }
  .t-jjUASA { --colors-redDark: #A82200; --colors-redDefault: #DD2C00; --colors-redLight: #FF3F0F; --colors-redLighter: #FF6842; --colors-redLightest: #FFD6CC; --colors-blueDark: #0077E6; --colors-blueDefault: #1890FF; --colors-blueLight: #4CA9FF; --colors-blueLighter: #80C2FF; --colors-blueLightest: #CCE6FF; --colors-greenDark: #20950E; --colors-greenDefault: #2BC312; --colors-greenLight: #3AEA1F; --colors-greenLighter: #63EF4E; --colors-greenLightest: #D6FBD0; --colors-yellowDark: #B27700; --colors-yellowDefault: #FFB31C; --colors-yellowLight: #FFC34D; --colors-yellowLighter: #FFD480; --colors-yellowLightest: #FFEECC; --colors-radialRed: radial-gradient(50% 50% at 50% 50%, var(--colors-redLight, #FF3F0F) 7.29%, var(--colors-redDark, #A82200) 100%); --colors-radialGreen: radial-gradient(50% 50% at 50% 50%, var(--colors-greenLight, #3AEA1F) 7.29%, var(--colors-greenDark, #20950E) 100%); --colors-radialBlack: radial-gradient(343.26% 209.7% at 50% 50.3%, #252627 0%, #000000 100%); --colors-error: var(--colors-redDefault); --colors-success: var(--colors-greenDefault); --colors-primaryDark: #ADD001; --colors-primaryDefault: #D4FD07; --colors-primaryLight: #DBFD30; --colors-primaryLighter: #DFFE49; --colors-primaryLightest: #E8FE7B; --colors-secondaryDark: #9F8487; --colors-secondaryDefault: #009D7C; --colors-secondaryLight: #ADD001; --colors-secondaryLighter: #CBBDBF; --colors-secondaryLightest: #E2DADB; --colors-inkDark: #0C262A; --colors-inkDefault: #11363C; --colors-inkLight: #16454B; --colors-inkLighter: #1B575F; --colors-inkLightest: #20666F; --colors-skyDarker: #707475; --colors-skyDefault: #8A8E8F; --colors-skyDefaultHalf: rgba(138, 142, 143, 0.2); --colors-skyLight: #BEC0C1; --colors-skyLighter: #F2F2F3; --colors-skyLightest: #FFFFFF; --colors-angularGold: conic-gradient(from -30.07deg at 50% 50%, var(--colors-primaryLightest, #E8FE7B) 0deg, var(--colors-primaryLightest, #E8FE7B) 0.04deg, #ADCF02 18.14deg, var(--colors-primaryLightest, #E8FE7B) 90.32deg, #ADCF02 161.47deg, var(--colors-primaryLightest, #E8FE7B) 180.96deg, #ADCF02 210.72deg, var(--colors-primaryLightest, #E8FE7B) 273.52deg, #ADCF02 337.77deg, var(--colors-primaryLightest, #E8FE7B) 360deg); --colors-linear: linear-gradient(90deg, rgba(22, 69, 75, 0.9) 21.88%, rgba(32, 102, 111, 0.9) 100%); --colors-linearCard: linear-gradient(180deg, #27488E 0%, #12254C 100%); --urls-gameCategoryBg: /themes/whiskey/game-category-bg-8.png; --urls-rtpBg: /themes/whiskey/rtp-bg-8.webp; --urls-jackpotDesktop: /themes/whiskey/jackpot-8.webp; --urls-jackpotMobile: /themes/whiskey/jackpot-8.webp; }
}
--sxs { --sxs: 1; }
@media  {
}
--sxs { --sxs: 2; }
@media  {
  .c-fNvXDc { display: flex; flex: 1 1 0%; flex-direction: column; }
  .c-jjpMwf { background: var(--colors-inkLight); position: fixed; width: 300px; height: 100%; overflow: scroll; z-index: 1201; transition: 0.15s; box-shadow: rgba(0, 0, 0, 0.1) 0.1rem 0px 0.02rem; transform: translateX(-100%); left: 0px; top: 0px; bottom: 0px; }
  @media (min-width: 992px) {
  .c-jjpMwf { display: none; }
}
  .c-hSKcfS { display: flex; justify-content: space-between; align-items: center; padding: 16px; }
  .c-UazGY { display: flex; align-items: center; }
  .c-bLdNGJ { display: flex; cursor: pointer; }
  .c-iWpHqy { border-bottom: 1px solid rgb(217, 233, 242); }
  .c-cIdiJW { text-decoration: none; }
  .c-dVOKBM { display: flex; align-items: center; padding: 16px; }
  .c-kolHsO { margin-left: 8px; }
  .c-hOwCtY { color: var(--colors-secondaryDefault, rgb(0, 157, 124)); }
  .c-eBIusB { line-height: 1.2; margin: 0px; font-weight: var(--fontWeights-regular); display: block; }
  .c-fewYWN { color: var(--colors-skyLightest, rgb(255, 255, 255)); }
  .c-gTynjM { display: flex; flex-direction: row; flex: 1 1 0%; cursor: pointer; color: white; align-items: center; }
  .c-gTynjM span { color: white; }
  .c-gTynjM > svg { margin-right: var(--space-xs); }
  .c-eRhPxt { margin-right: 4px; filter: drop-shadow(rgba(0, 0, 0, 0.35) 0px 0px 2px); }
  .c-hqXzi { width: 16px; height: 16px; border-radius: 8px; }
  .c-hlTBXk { color: var(--colors-skyLightest); text-transform: capitalize; }
  .c-kokaPQ { margin-right: 8px; }
  .c-bNHULD { border-radius: 0px; flex: 1 1 0%; width: 100%; }
  @media (min-width: 992px) {
  .c-hzUrXJ { display: none; }
}
  .c-jDjnIk { display: flex; }
  .c-jDjnIk button { border-radius: 0px; }
  .c-fZlHvM svg path { stroke: var(--colors-secondaryDark); }
  .c-hJhMRA { overflow: hidden; width: fit-content; height: fit-content; }
  .c-gtpFUc { cursor: pointer; outline: none; user-select: none; justify-content: center; width: 100%; color: var(--colors-white); border: unset; transition: 150ms ease-out; display: flex; align-items: center; }
  .c-dFfuhX { color: var(--colors-skyLightest); }
  .c-dJpCLK { display: flex; flex-wrap: wrap; border-bottom: 0.5px solid rgb(217, 233, 242); }
  .c-fmXhxl { display: flex; width: 33%; align-items: center; justify-content: center; padding-top: 16px; padding-bottom: 16px; flex-direction: column; }
  .c-bCRLag { max-width: 32px; max-height: 32px; }
  .c-koofwM { margin-bottom: 8px; }
  .c-lcPmgm { display: flex; flex: 1 1 0%; gap: 8px; justify-content: center; }
  .c-lcPmgm > .c-fGHEql:empty { display: none; }
  .c-bHzkZd { padding-bottom: 16px; padding-right: 8px; margin-top: 20px; align-self: flex-end; }
  .c-SNhSq { display: flex; flex: 1 1 0%; position: relative; height: 100%; flex-direction: column; }
  @media (max-width: 991px) {
  .c-SNhSq { margin-bottom: 72px; }
}
  .c-MstJl { position: fixed; width: 100%; z-index: 1000; box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 10px; }
  @media (max-width: 991px) {
  .c-MstJl { display: none; }
}
  .c-MstJl { background: var(--colors-inkDefault); height: 143px; }
  .c-eITHhL { display: flex; align-items: center; background: var(--colors-inkLightest); height: 24px; }
  .c-fGHEql { width: 100%; }
  .c-dhzjXW { display: flex; }
  .c-iefmez { overflow: hidden; flex: 1 1 0%; align-items: center; display: flex; }
  .c-kbRxRG { color: white; height: 24px; }
  .c-iFAMB { display: flex; align-items: center; padding-top: 12px; }
  .c-hEWFPv { display: flex; flex: 1 1 0%; max-height: 34px; padding-top: 8px; padding-bottom: 8px; }
  .c-gzflTi { border-left: 0.5px solid white; border-right: 0.5px solid white; margin-left: 12px; margin-right: 12px; }
  .c-iMHPmU { display: flex; flex-direction: row; align-items: center; text-decoration: none; position: relative; }
  .c-iMHPmU::after { content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1px; background: var(--colors-secondaryDefault); transition: transform 300ms; transform: scale(0); transform-origin: center center; }
  .c-flWDnm { width: fit-content; }
  .c-bpaGqe { width: 140px; }
  @media (min-width: 1280px) {
  .c-bpaGqe { width: initial; }
}
  .c-kYtbRs { position: relative; display: flex; margin-right: 8px; }
  .c-hrlkMa { background: var(--colors-inkLightest, rgb(32, 102, 111)); border-radius: 4px; }
  .c-exXVOH { padding-top: 9px; padding-bottom: 9px; max-height: 36px; }
  .c-bZNrxE { display: flex; flex-direction: row; }
  .c-hyEoVL { position: relative; border-radius: 4px; display: flex; flex-direction: row; flex: 1 1 0%; align-items: center; }
  .c-kHqjIX { background: unset; border: unset; outline: none; color: white; display: flex; flex: 1 1 0%; padding-left: 16px; padding-right: 16px; }
  .c-kHqjIX::placeholder { color: var(--colors-skyLightest); opacity: 0.5; }
  .c-kHqjIX:disabled { color: var(--colors-skyLighter); opacity: 0.5; }
  @media (min-width: 992px) {
  .c-kHqjIX { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  @media (max-width: 991px) {
  .c-kHqjIX { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  .c-ldfSEu { position: absolute; user-select: none; pointer-events: none; left: 16px; opacity: 0.5; }
  .c-ekzekW { margin-left: 4px; margin-right: 4px; }
  .c-dlRlrD { margin-right: 12px; display: flex; align-items: center; }
  .c-iUzUHX { cursor: pointer; height: fit-content; display: flex; }
  .c-kiLWvQ svg path { stroke: var(--colors-primaryLight); }
  .c-kVFvxy { display: flex; margin-top: auto; }
  .c-bhjCFi { position: relative; width: 303px; }
  .c-jDChox { display: flex; height: 100%; align-items: center; }
  .c-eCRKlW { position: absolute; inset: 0px; display: flex; align-items: self-end; }
  .c-fqrbKy { width: 100%; margin-top: auto; margin-left: -32px; }
  .c-iOUgsF { background: var(--colors-inkLight); height: 37px; display: flex; flex: 1 1 0%; }
  .c-kZdsED { display: flex; flex: 1 1 0%; max-width: 984px; }
  .c-flysGN { display: flex; flex: 1 1 0%; align-items: center; justify-content: space-evenly; }
  .c-kEGpHA { text-decoration: none; position: relative; cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 0px; background: transparent; display: flex; align-items: center; }
  .c-kEGpHA::after { content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1px; background: var(--colors-secondaryDefault); transition: transform 300ms; transform: scale(0); transform-origin: center center; }
  .c-lptOrU:hover { color: var(--colors-secondaryLight); }
  .c-dlmoIL { height: 72px; position: fixed; width: 100%; z-index: 1000; box-shadow: rgba(0, 0, 0, 0.3) 0px 2px 10px; }
  @media (min-width: 992px) {
  .c-dlmoIL { display: none; }
}
  .c-fNsOmT { display: flex; flex: 1 1 0%; justify-content: space-between; align-items: center; height: 100%; }
  .c-fsejKH { width: 25px; height: 20px; position: relative; margin: 8px auto; transform: rotate(0deg); transition: 0.5s ease-in-out; cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; background: inherit; }
  .c-fsejKH > span { display: block; position: absolute; height: 2.4px; width: 100%; background: var(--colors-skyLightest); border-radius: 9px; opacity: 1; left: 0px; transform: rotate(0deg); transition: 0.25s ease-in-out; }
  .c-fsejKH > span:nth-child(1) { top: 0px; }
  .c-fsejKH > span:nth-child(2) { top: 9px; }
  .c-fsejKH > span:nth-child(3) { top: 9px; }
  .c-fsejKH > span:nth-child(4) { top: 18px; }
  .c-bjbdTA { background: var(--colors-skyLightest); }
  .c-cmpvrW { position: relative; }
  .c-lkBNdM { height: 100%; }
  .c-dbclGt { background: var(--colors-inkDark); }
  .c-lkXhhf { background-repeat: no-repeat; background-size: cover; background-position: center center; }
  .c-iBnCZM { margin-top: 20px; }
  .c-dvYIiP { position: relative; }
  @media (min-width: 992px) {
  .c-dvYIiP { padding-bottom: 24px; }
}
  .c-dvYIiP .awssld__bullets { bottom: 8px; z-index: 120; }
  .c-dvYIiP .awssld__bullets button { border-radius: 8px; height: 6px; width: 6px; cursor: pointer; background: var(--colors-secondaryLightest); margin: 0px 6px 0px 0px; }
  .c-dvYIiP .awssld__bullets .awssld__bullets--active { border-radius: 8px; height: 6px; width: 36px; margin: 0px 6px 0px 0px; cursor: pointer; background: var(--colors-secondaryLightest); transform: unset; }
  @media (min-width: 992px) {
  .c-krIkwM { display: none; }
}
  .c-fKbFaO { background: var(--colors-inkDefault); position: absolute; inset: 0px; display: flex; align-items: center; justify-content: center; }
  .c-jjBYZd { height: 40px; width: 40px; border-color: white; border-width: 5px; }
  .c-iwYAmO { border-style: solid; border-bottom-color: transparent; border-radius: 50%; display: inline-block; box-sizing: border-box; animation: 1s linear 0s infinite normal none running k-fhCilR; }
  .c-fxrEBZ { overflow: hidden; }
  .c-bsedBV { display: none; }
  @media (min-width: 992px) {
  .c-bsedBV { display: block; }
}
  .c-ciVisu { display: none; }
  @media (max-width: 991px) {
  .c-ciVisu { display: inherit; }
}
  .c-iflkHV { margin-top: 12px; }
  .c-jRSoJY { display: none; }
  @media (min-width: 992px) {
  .c-jRSoJY { display: inherit; }
}
  .c-ckhQIw { margin-left: 20px; }
  .c-gWIrTz { position: relative; height: 60%; margin-left: auto; margin-right: auto; margin-top: 5%; }
  .c-bkRTOV { position: absolute; bottom: -40%; left: 0px; right: 0px; padding-left: 8px; padding-right: 8px; }
  .c-jlrkmt { color: var(--colors-inkDefault, rgb(17, 54, 60)); text-transform: capitalize; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
  .c-eOCYEU { display: flex; flex: 1 1 0%; justify-content: space-between; background: var(--colors-inkLight); align-items: center; overflow-x: scroll; position: relative; height: 72px; }
  .c-dMEYqg { padding: 4px; max-height: 70px; object-fit: contain; }
  .c-iLMlZX { min-width: 72px; width: 100%; cursor: pointer; }
  .c-iLMlZX:hover { opacity: 0.9; }
  .c-ekwkue { margin-top: 4px; }
  .c-hiIaNd { width: 100%; color: var(--colors-skyLightest); font-style: normal; font-weight: 900; text-align: center; font-size: 16px; }
  @media (min-width: 414px) {
  .c-hiIaNd { font-size: 20px; }
}
  @media (min-width: 576px) {
  .c-hiIaNd { font-size: 24px; }
}
  @media (min-width: 768px) {
  .c-hiIaNd { font-size: 40px; }
}
  @media (min-width: 992px) {
  .c-hiIaNd { font-size: 44px; }
}
  @media (min-width: 1280px) {
  .c-hiIaNd { font-size: 52px; }
}
  @media (min-width: 1380px) {
  .c-hiIaNd { font-size: 60px; }
}
  @media (min-width: 992px) {
  .c-hiIaNd { font-family: "Markazi Text"; font-weight: 700; font-size: 70px; letter-spacing: 0.1em; }
}
  .c-dIVmuX { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; }
  .c-bmJXHW { display: flex; align-items: center; position: absolute; width: 80%; }
  @media (max-width: 991px) {
  .c-bmJXHW { flex-direction: column; justify-content: center; height: 20%; }
}
  @media (min-width: 992px) {
  .c-bmJXHW { height: 40%; }
}
  .c-bmJXHW { border-radius: 12px; margin-top: initial; margin-bottom: initial; height: initial; padding-top: 4%; }
  .c-iKKfHF { border: 8px double transparent; border-radius: 78px; background-origin: border-box; background-clip: content-box, border-box; width: 100%; }
  @media (max-width: 991px) {
  .c-iKKfHF { border: 4px double transparent; }
}
  @media (min-width: 992px) {
  .c-iKKfHF { border: 8px double transparent; margin-left: 24px; }
}
  .c-fixGjY { display: flex; flex-direction: column; }
  .c-iBqmQN { margin-top: 20px; margin-bottom: 20px; }
  .c-dZxKON { display: flex; flex-direction: row; gap: 12px; align-items: center; }
  @media (min-width: 992px) {
  .c-gDWphG { margin-bottom: 20px; }
}
  @media (max-width: 991px) {
  .c-gDWphG { margin-bottom: 12px; }
}
  .c-ismpOc { position: relative; }
  .c-ismpOc::before { top: 0px; position: absolute; left: 0px; width: 50px; height: 100%; content: ""; transition: opacity 0.3s; z-index: 2; opacity: 0; pointer-events: none; }
  .c-ismpOc::after { top: 0px; position: absolute; right: 0px; width: 50px; height: 100%; content: ""; transition: opacity 0.3s; z-index: 2; opacity: 0; pointer-events: none; }
  .c-jByKpI::before { background: linear-gradient(90deg, var(--colors-inkDefault, rgb(17, 54, 60)) 0px, transparent); }
  .c-jByKpI::after { background: linear-gradient(270deg, var(--colors-inkDefault, rgb(17, 54, 60)) 0px, transparent); }
  @media (min-width: 992px) {
  .c-gxkYxW { margin-left: 20px; }
}
  @media (max-width: 991px) {
  .c-gxkYxW { margin-left: 12px; }
}
  .c-hWnzoL { display: flex; overflow-x: scroll; }
  .c-hWnzoL::-webkit-scrollbar { display: none; }
  .c-eecxgq { max-width: 112px; max-height: 112px; min-width: 112px; min-height: 112px; object-fit: cover; padding: 2px; }
  @media (min-width: 992px) {
  .c-eecxgq { max-width: 136px; max-height: 136px; min-width: 136px; min-height: 136px; }
}
  .c-iyYdBa { border: 4px double transparent; border-radius: 20px; background-image: linear-gradient(white, white), conic-gradient(from -30.07deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 0deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 0.04deg, rgb(173, 207, 2) 18.14deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 90.32deg, rgb(173, 207, 2) 161.47deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 180.96deg, rgb(173, 207, 2) 210.72deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 273.52deg, rgb(173, 207, 2) 337.77deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 360deg); background-origin: border-box; background-clip: content-box, border-box; }
  @media (max-width: 991px) {
  .c-iyYdBa { border: 2px double transparent; }
}
  .c-gyesvQ { align-items: center; max-width: 112px; min-width: 112px; }
  @media (min-width: 992px) {
  .c-gyesvQ { max-width: 136px; min-width: 136px; }
}
  .c-iEaapN { position: relative; cursor: pointer; }
  .c-bAZTzz { position: absolute; inset: 6% 0px 0px; display: flex; transition: 0.3s linear; z-index: 1; }
  .c-bAZTzz svg { width: auto; height: 100%; }
  .c-bAZTzz path { transition: 0.3s linear; }
  .c-bAZTzz { height: 12px; }
  @media (min-width: 576px) {
  .c-bAZTzz { height: 20px; }
}
  .c-jRurjG { display: flex; padding-left: 0.4em; padding-right: 0.4em; transition: 0.3s linear; }
  .c-jRurjG span { line-height: 0px; margin-top: auto; margin-bottom: auto; font-size: 8px; }
  @media (min-width: 576px) {
  .c-jRurjG span { font-size: clamp(0.5em, 0.7em, 1em); }
}
  .c-ilxIoK { display: flex; flex-direction: column; align-items: center; margin-top: 8px; }
  @media (min-width: 992px) {
  .c-ilxIoK { margin-top: 12px; }
}
  @media (min-width: 992px) {
  .c-bUelen { background: var(--colors-inkDefault); }
}
  @media (max-width: 991px) {
  .c-bUelen { background: var(--colors-inkDark); }
}
  .c-bUelen { padding-bottom: 12px; }
  .c-jGlcIr { border-radius: 4px; overflow: hidden; }
  .c-kWkSpo { position: relative; background: transparent; border-style: solid; border-color: currentcolor; border-image-source: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-slice: 1; border-width: 2px; display: flex; flex: 1 1 0%; align-items: center; height: 100%; justify-content: space-between; }
  @media (min-width: 992px) {
  .c-kWkSpo { padding: 24px 40px; }
}
  @media (max-width: 991px) {
  .c-kWkSpo { padding: 24px 16px; flex-direction: column-reverse; }
}
  .c-bKXnuv { position: absolute; inset: 0px; }
  @media (min-width: 992px) {
  .c-bKXnuv { opacity: 0.16; }
}
  @media (max-width: 991px) {
  .c-bKXnuv { opacity: 0; }
}
  .c-bKXnuv { background: var(--colors-secondaryLightest); }
  .c-cKeKw { width: 40%; }
  @media (max-width: 991px) {
  .c-cKeKw { width: 100%; }
}
  .c-gotZkf { border-radius: 4px; width: 100%; }
  .c-jnjWSo { display: flex; align-items: center; justify-content: center; width: 100%; }
  .c-jnjWSo:first-child { margin-bottom: 24px; }
  .c-efADIY { display: flex; align-items: center; justify-content: center; border-radius: 50%; width: 105px; height: 105px; background: var(--colors-skyLightest); }
  @media (max-width: 991px) {
  .c-efADIY > * { width: 100%; height: 100%; }
}
  @media (min-width: 992px) {
  .c-efADIY { margin-right: 32px; }
}
  @media (max-width: 991px) {
  .c-efADIY { width: 88px; height: 88px; padding: 16px; }
}
  .c-bIJGHM { display: flex; flex-direction: column; flex: 1 1 0%; }
  @media (max-width: 991px) {
  .c-bIJGHM { margin-left: 25px; }
}
  .c-fHwvSc { display: flex; align-items: flex-end; margin-bottom: 16px; }
  .c-fcTNLc { display: flex; flex-direction: column; flex: 1 1 0%; }
  .c-dKVYBe { height: 12px; border-radius: 20px; background: var(--colors-skyLightest); width: 100%; overflow: hidden; }
  .c-fjePfl { background: var(--colors-secondaryDefault); height: 100%; }
  .c-ljuApQ { background: var(--colors-primaryDefault); margin-top: 32px; margin-bottom: 32px; width: 100%; height: 2px; }
  @media (min-width: 992px) {
  .c-ljuApQ { width: 2px; margin-left: 20px; margin-right: 20px; height: auto; align-self: stretch; }
}
  @media (min-width: 1280px) {
  .c-ljuApQ { width: 2px; margin-left: 56px; margin-right: 56px; height: auto; align-self: stretch; }
}
  .c-iKuNVO { display: flex; flex-wrap: wrap; justify-content: center; width: 60%; }
  @media (max-width: 991px) {
  .c-iKuNVO { width: 100%; }
}
  .c-eFFvwl { filter: invert(50%) sepia(100%) saturate(0%) hue-rotate(10deg) brightness(1000%) contrast(100%) grayscale(100%); }
  @media (max-width: 991px) {
  .c-eFFvwl { max-height: 16px; }
}
  @media (min-width: 992px) {
  .c-eFFvwl { max-height: 30px; }
}
  .c-hBfzWL { position: relative; margin: 20px 15px; width: 20%; }
  @media (min-width: 576px) {
  .c-hBfzWL { width: 17%; }
}
  @media (min-width: 768px) {
  .c-hBfzWL { width: 13%; }
}
  @media (min-width: 992px) {
  .c-hBfzWL { width: 22%; }
}
  .c-jRapcH { border-radius: 4px; height: 2px; background: var(--colors-primaryDefault); }
  .c-iuXpvk { position: absolute; top: -8px; left: 50%; transform: translate(-50%, 0px); }
  .c-kojyFS { margin-top: 8px; }
  .c-fwQTao { display: flex; max-width: 14px; max-height: 14px; min-width: 14px; min-height: 14px; border-radius: 50%; background: var(--colors-primaryDefault); margin-right: 20px; padding: 2px; }
  @media (max-width: 991px) {
  .c-fwQTao { margin-right: 8px; }
}
  .c-kNqXEb { width: 100%; border-radius: 50%; }
  .c-jWtoMJ { word-break: break-all; }
  @media (min-width: 992px) {
  .c-liRYQG { background: var(--colors-inkDefault); }
}
  @media (max-width: 991px) {
  .c-liRYQG { background: var(--colors-inkDark); }
}
  .c-liRYQG { padding-bottom: 24px; }
  .c-huLkeJ { position: relative; background: transparent; border-style: solid; border-color: currentcolor; border-image-source: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-slice: 1; border-width: 2px; display: flex; flex: 1 1 0%; height: 100%; flex-direction: column; }
  @media (min-width: 992px) {
  .c-huLkeJ { padding: 24px 40px 4px; }
}
  @media (max-width: 991px) {
  .c-huLkeJ { padding: 24px 16px 4px; }
}
  .c-eaeJEI { position: absolute; inset: 0px; }
  @media (min-width: 992px) {
  .c-eaeJEI { opacity: 0.16; }
}
  @media (max-width: 991px) {
  .c-eaeJEI { opacity: 0; }
}
  .c-eaeJEI { background: var(--colors-secondaryLightest); touch-action: none; pointer-events: none; }
  .c-eFTPCr { margin-bottom: 16px; }
  .c-iSwBqf { display: flex; flex-wrap: wrap; }
  .c-bCyjow { width: 100%; }
  @media (min-width: 576px) {
  .c-bCyjow { width: 49%; }
}
  @media (min-width: 768px) {
  .c-bCyjow { width: 32%; }
}
  @media (min-width: 992px) {
  .c-bCyjow { width: 24%; }
}
  .c-bCyjow { margin-bottom: 20px; margin-right: 8px; }
  .c-hjBzDg { width: 36px; height: 36px; max-height: 36px; max-width: 36px; min-width: 36px; min-height: 36px; background: var(--colors-secondaryDefault); border-radius: 4px; display: flex; align-items: center; justify-content: center; }
  .c-gSCRyo { padding-top: 8px; background: var(--colors-inkDefault); }
  .c-bNfHEu { padding-top: 48px; padding-bottom: 48px; }
  .c-eFYwtl { margin-top: 16px; }
  .c-ewwrgk { margin-bottom: 40px; }
  .c-ekCNeI { margin-bottom: 4px; }
  .c-ewxXJy { margin-top: 40px; }
  .c-eUgBAM { display: flex; flex: 1 1 0%; justify-content: center; }
  .c-gNkPVL { margin-left: 8px; display: flex; align-items: center; }
  .c-vINCg { display: flex; flex-direction: column; }
  @media (max-width: 991px) {
  .c-vINCg:nth-child(1), .c-vINCg:nth-child(2) { margin-bottom: 40px; }
}
  .c-vINCg:nth-child(2), .c-vINCg:nth-child(3) { align-items: center; }
  .c-vINCg:nth-child(1) { width: 30%; }
  @media (min-width: 992px) {
  .c-vINCg:nth-child(1) { border-right: 0.5px solid var(--colors-skyLightest); }
}
  .c-vINCg:nth-child(2) { width: 40%; }
  @media (min-width: 992px) {
  .c-vINCg:nth-child(2) { border-right: 0.5px solid var(--colors-skyLightest); }
}
  .c-vINCg:nth-child(3) { width: 30%; }
  .c-ivhbiN { width: 60%; }
  @media (max-width: 575px) {
  .c-ivhbiN { width: 80%; }
}
  .c-cHomai { display: flex; justify-content: space-between; }
  @media (max-width: 991px) {
  .c-cHomai { flex-direction: column; }
}
  .c-bQHvIY { display: flex; align-items: center; }
  .c-bQHvIY img { width: 20px; height: 20px; object-fit: contain; }
  .c-fxBZHy { max-width: 160px; max-height: 100px; min-width: 100px; object-fit: contain; }
  @media (max-width: 991px) {
  .c-fxBZHy { max-width: 80px; min-width: 50px; }
}
  .c-hWkySb { display: flex; align-items: center; height: 145px; }
  @media (max-width: 991px) {
  .c-hWkySb { height: 98px; }
}
  .c-hWkySb { overflow-y: scroll; }
  .c-cNuIPk { background: var(--colors-inkDark); padding-top: 20px; padding-bottom: 20px; }
  .c-kqvkfk { display: flex; justify-content: center; }
  .c-KfFnA { display: flex; flex-direction: column; align-items: center; justify-content: end; }
  .c-fFhAKI { padding-top: 12px; padding-bottom: 12px; background: var(--colors-skyLightest); }
  .c-gCKge { display: flex; flex: 1 1 0%; align-items: center; }
  @media (max-width: 991px) {
  .c-gCKge { flex-direction: column; }
}
  .c-deZXRM { display: flex; flex: 1 1 0%; align-items: center; }
  .c-fcclLm { margin-right: 24px; }
  .c-gquuCI { color: var(--colors-inkDefault, rgb(17, 54, 60)); }
  .c-UUNBw { cursor: pointer; padding-left: var(--space-space12); padding-right: var(--space-space12); display: flex; list-style-type: none; text-decoration: none; flex-direction: column; justify-content: center; align-items: center; }
  .c-gFctFD { display: flex; flex: 1 1 0%; flex-direction: row; position: fixed; bottom: 0px; z-index: 1001; height: 72px; width: 100%; align-items: center; box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 4px; background: var(--colors-inkDark); }
  @media (min-width: 992px) {
  .c-gFctFD { display: none; }
}
  .c-gVTmWq { height: 100%; display: flex; flex: 1 1 0%; user-select: none; justify-content: center; align-items: center; }
  .c-jLIMzR { position: fixed; right: 0px; width: fit-content; height: 0px; background: blue; top: 20%; transition: transform 250ms ease-out; }
  .c-eagrSl { background: var(--colors-angularGold); padding: 4px; width: 248px; float: right; }
  .c-eWVgET { width: 100%; height: 100%; background: var(--colors-redDark); }
  .c-kVHZSi { display: flex; flex: 1 1 0%; align-items: center; justify-content: center; }
  .c-hdMaTR { background: radial-gradient(50% 50%, var(--colors-redLight, rgb(255, 63, 15)) 7.29%, var(--colors-redDark, rgb(168, 34, 0)) 100%); padding: 12px; }
  .c-cQcWEW { width: 100%; height: 4px; background: var(--colors-angularGold); }
  .c-fFxTms { overflow: scroll; height: 400px; }
  @media screen and (max-height: 590px) {
  .c-fFxTms { height: 300px; }
}
  @media screen and (max-height: 460px) {
  .c-fFxTms { height: 200px; }
}
  .c-jHtcEb { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-left: 16px; }
  .c-jPWlCg { border-radius: 4px; display: flex; flex: 1 1 0%; align-items: center; padding: 12px 16px; cursor: pointer; }
  .c-cTGEgl { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
  .c-fCMKGn { height: 76px; width: 76px; padding: 4px; border-radius: 36px; float: right; cursor: pointer; background: var(--colors-angularGold); background-repeat: round; pointer-events: all; position: relative; transition: 300ms; }
  .c-eyOZaa { width: 100%; height: 100%; border-radius: 50%; background: radial-gradient(50% 50%, var(--colors-redLight, rgb(255, 63, 15)) 7.29%, var(--colors-redDark, rgb(168, 34, 0)) 100%); display: flex; justify-content: center; align-items: center; transform-origin: left top; white-space: nowrap; }
  .c-iBnegm { margin-right: 20px; }
  .c-fPtuDW { position: fixed; inset: 0px; background: rgba(0, 0, 0, 0.7); display: flex; z-index: 2000; justify-content: center; align-items: center; }
  .c-lcEBRE { min-width: 35%; max-width: 90%; padding: 32px; background: var(--colors-inkLight); position: relative; border-radius: 12px; z-index: 9999; min-height: 160px; max-height: 90vh; overflow: scroll; width: 90%; }
  @media (min-width: 768px) {
  .c-lcEBRE { width: 70%; }
}
  @media (min-width: 992px) {
  .c-lcEBRE { width: unset; }
}
  .c-bKfYky { display: flex; flex: 1 1 0%; align-items: center; justify-content: space-between; }
  .c-iYAduS { width: 24px; height: 24px; visibility: hidden; }
  .c-kogryL { margin-top: 8px; margin-bottom: 8px; }
  .c-knpVsn { margin-top: 32px; }
  .c-izUtmu img { display: initial; }
  .c-izUtmu div:has(> img) { text-align: center; }
  .c-fZohTH::after { opacity: 1; }
  .c-gEfSPq { flex: 1 1 0%; display: flex; }
  .c-ikLBct { margin-bottom: var(--space-space8); display: flex; }
  .c-eGwvuq { display: flex; flex: 1 1 0%; justify-content: center; margin-top: 48px; margin-bottom: 32px; flex-direction: column; width: 100%; gap: 12px; }
  .c-ekyIxM { margin-right: 4px; }
  .c-eRzzoS { display: flex; flex-direction: row; align-items: center; text-decoration: none; position: relative; }
  .c-eRzzoS::after { content: ""; position: absolute; bottom: 0px; left: 0px; width: 100%; height: 1px; background: var(--colors-secondaryDefault); transition: transform 300ms; transform: scale(0); transform-origin: center center; }
  .c-eRzzoS:hover::after, .c-eRzzoS:focus::after { transform: scale(1); }
  .c-eRzzoS:active::after { background: var(--colors-secondaryDark); }
  .c-jcRQsm { color: var(--colors-secondaryDefault); }
  .c-jcRQsm:active { color: var(--colors-secondaryDark); }
  .c-iYAIuc { padding: 4px; display: flex; align-items: center; color: var(--colors-redDefault); }
  .c-XlZOi { color: var(--colors-error); }
}
--sxs { --sxs: 3; }
@media  {
  .c-dVOKBM-iDfZUm-active-true { background: var(--colors-inkDefault); }
  .c-eBIusB-lcbVhe-whitelabel-default { font-family: var(--font-be-vietnam-pro); }
  .c-eBIusB-jMbvfn-variant-body1Regular { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-sm); }
  .c-dVOKBM-hmxryr-active-false { background: var(--colors-inkLight); }
  .c-hqXzi-iPvquN-isMobile-true { width: 24px; height: 24px; border-radius: 12px; }
  .c-gtpFUc-epMvHt-variant-small { padding: 9px 24px; }
  .c-gtpFUc-byHMer-buttonType-tertiary { background: var(--colors-skyLightest); }
  .c-gtpFUc-byHMer-buttonType-tertiary span { color: var(--colors-inkDefault); }
  .c-gtpFUc-byHMer-buttonType-tertiary svg path { stroke: var(--colors-inkDefault); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover { background: var(--colors-secondaryLightest); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:hover svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active { background: var(--colors-secondaryLighter); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:active svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] { background: var(--colors-secondaryLighter); cursor: wait; }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] span { color: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary[loading] svg path { stroke: var(--colors-secondaryDark); }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-gtpFUc-byHMer-buttonType-tertiary:disabled span { color: var(--colors-skyLight); }
  .c-eBIusB-loYxcV-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
  .c-gtpFUc-ewcrAC-buttonType-primary { background: var(--colors-primaryLight); }
  .c-gtpFUc-ewcrAC-buttonType-primary svg path { stroke: var(--colors-inkDefault); }
  .c-gtpFUc-ewcrAC-buttonType-primary span { color: var(--colors-inkDefault); }
  .c-gtpFUc-ewcrAC-buttonType-primary:hover { background: var(--colors-primaryLighter); }
  .c-gtpFUc-ewcrAC-buttonType-primary:active { background: var(--colors-primaryLighteyarnst); }
  .c-gtpFUc-ewcrAC-buttonType-primary[loading] { background: var(--colors-primaryDefault); cursor: wait; }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-gtpFUc-ewcrAC-buttonType-primary:disabled span { color: var(--colors-skyLight); }
  .c-eBIusB-fKCCCT-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
  .c-eBIusB-gGtGlI-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
  .c-eBIusB-gsXdEb-align-right { text-align: right; }
  .c-fGHEql-fvfCsT-variant-onlyLeft { margin: 0px auto; padding-left: var(--space-sm); }
  @media (min-width: 414px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-sm); }
}
  @media (min-width: 576px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-md); }
}
  @media (min-width: 768px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-md); }
}
  @media (min-width: 992px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-xl); }
}
  @media (min-width: 1280px) {
  .c-fGHEql-fvfCsT-variant-onlyLeft { max-width: 1580px; }
}
  .c-dhzjXW-ejCoEP-direction-horizontal { flex-direction: row; }
  .c-dhzjXW-DIXHo-alignContent-stretch { align-content: stretch; }
  .c-dhzjXW-jroWjL-alignItems-center { align-items: center; }
  .c-dhzjXW-bWhLCh-alignSelf-auto { align-self: auto; }
  .c-dhzjXW-awKDG-justify-start { justify-content: flex-start; }
  .c-dhzjXW-kVNAnR-wrap-noWrap { flex-wrap: nowrap; }
  .c-fGHEql-jvtgLD-variant-default { width: 100%; margin: 0px auto; padding-left: 8px; padding-right: 8px; }
  @media (min-width: 414px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-sm); padding-right: var(--space-sm); }
}
  @media (min-width: 576px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-md); padding-right: var(--space-md); }
}
  @media (min-width: 768px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-md); padding-right: var(--space-md); }
}
  @media (min-width: 992px) {
  .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-xl); padding-right: var(--space-xl); }
}
  @media (min-width: 1280px) {
  .c-fGHEql-jvtgLD-variant-default { max-width: 1580px; padding-left: var(--space-xl); padding-right: var(--space-xl); }
}
  .c-eBIusB-jzvilD-variant-caption1Medium { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxxs); }
  .c-dFfuhX-knjGtB-isGaruda-false:hover { color: var(--colors-secondaryDefault); }
  .c-eBIusB-eKEuTC-variant-body3Regular { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
  .c-gtpFUc-khvKJZ-buttonType-secondary { background: transparent; border-style: solid; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; border-image-slice: 1; border-width: 1.5px; border-image-source: var(--colors-primaryDefault); border-color: transparent; }
  .c-gtpFUc-khvKJZ-buttonType-secondary span { background: var(--colors-primaryLight); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:hover { background: var(--colors-secondaryLightest); }
  .c-gtpFUc-khvKJZ-buttonType-secondary:hover span { color: var(--colors-secondaryDefault); background: transparent; -webkit-text-fill-color: initial; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:hover svg path { stroke: var(--colors-secondaryDefault); }
  .c-gtpFUc-khvKJZ-buttonType-secondary:active { border-image-source: none; }
  .c-gtpFUc-khvKJZ-buttonType-secondary[loading] { background: var(--colors-secondaryLightest); border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; cursor: wait; }
  .c-gtpFUc-khvKJZ-buttonType-secondary[loading] span { color: var(--colors-secondaryDefault); background: transparent; -webkit-text-fill-color: initial; }
  .c-gtpFUc-khvKJZ-buttonType-secondary[loading] svg path { stroke: var(--colors-secondaryDefault); }
  .c-gtpFUc-khvKJZ-buttonType-secondary:disabled { background: var(--colors-skyLighter); cursor: not-allowed; border-image-source: none; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:disabled span { color: var(--colors-skyLight); background: transparent; -webkit-text-fill-color: initial; }
  .c-gtpFUc-khvKJZ-buttonType-secondary:disabled svg path { stroke: var(--colors-skyLight); }
  .c-kVFvxy-jpKRnm-isAuthenticated-false { height: 71px; }
  .c-iMHPmU-bOqmrA-state-active::after { transform: scale(1); background: var(--colors-secondaryDefault); }
  .c-eBIusB-Wtgcs-variant-body2Regular { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xs); }
  .c-dFfuhX-dBHBrn-state-active-false { color: var(--colors-secondaryDefault); }
  .c-dlmoIL-iDfZUm-isGaruda-false { background: var(--colors-inkDefault); }
  @media (min-width: 992px) {
  .c-fNvXDc-iBMrbG-isGaruda-false { margin-top: 143px; }
}
  @media (max-width: 991px) {
  .c-fNvXDc-iBMrbG-isGaruda-false { margin-top: 96px; }
}
  @media (max-width: 991px) {
  .c-PJLV-iYrBIK-media-onlyDesktop { margin: 0px; padding: 0px; }
}
  @media (max-width: 991px) {
  .c-fGHEql-iYrBIK-media-onlyDesktop { margin: 0px; padding: 0px; }
}
  .c-eBIusB-gjdJOs-align-center { text-align: center; }
  .c-eBIusB-fNkPXa-variant-caption2Regular { font-size: var(--fontSizes-size10); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxxs); }
  .c-eBIusB-hyvuql-weight-bold { font-weight: var(--fontWeights-bold); }
  .c-eBIusB-kLOZSH-variant-caption1Bold { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xxxs); }
  .c-kNqXEb-jVhoZ-isActive-true { background: var(--colors-radialGreen); }
  .c-PJLV-csntYZ-size-md { width: 0%; }
  @media (min-width: 768px) {
  .c-PJLV-csntYZ-size-md { width: 3%; }
}
  @media (min-width: 992px) {
  .c-PJLV-csntYZ-size-md { width: 0%; }
}
  .c-PJLV-gboIbk-size-sm { width: 0%; }
  @media (min-width: 576px) {
  .c-PJLV-gboIbk-size-sm { width: 3%; }
}
  @media (min-width: 768px) {
  .c-PJLV-gboIbk-size-sm { width: 0%; }
}
  .c-PJLV-cELXAq-size-mobile { width: 5%; }
  @media (min-width: 576px) {
  .c-PJLV-cELXAq-size-mobile { width: 0%; }
}
  .c-PJLV-bsuXh-size-lg { width: 0%; }
  @media (min-width: 992px) {
  .c-PJLV-bsuXh-size-lg { width: 3%; }
}
  .c-bNfHEu-hmxryr-isGaruda-false { background: var(--colors-inkLight); }
  @media (min-width: 992px) {
  .c-dFfuhX-hXcvcN-isGaruda-false { color: var(--colors-secondaryDefault); }
}
  .c-bNfHEu-iDfZUm-isGaruda-false { background: var(--colors-inkDefault); }
  .c-fxBZHy-bMYZZi-separator-true { margin-left: 48px; }
  .c-KfFnA-fbYFYg-separator-true { margin-left: 24px; }
  @media (min-width: 992px) {
  .c-PJLV-cwdgLk-media-onlyMobile { margin: 0px; padding: 0px; }
}
  .c-jLIMzR-ebohZG-isOpen-false { z-index: 10000; }
  @media (max-width: 991px) {
  .c-eagrSl-hjkvhz-isOpen-false { display: none; }
}
  .c-eBIusB-gfCyWM-variant-title3Bold { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
  .c-gtpFUc-cDKPwz-variant-medium { padding: 12px 28px; }
  .c-dhzjXW-iTKOFX-direction-vertical { flex-direction: column; }
  .c-dhzjXW-irEjuD-alignItems-stretch { align-items: stretch; }
  .c-jLIMzR-SBxHj-isOpen-true { z-index: 10001; }
  .c-fCMKGn-DPZLQ-isOpen-true { margin-right: -12%; margin-top: -4%; }
  .c-jjpMwf-eZdROQ-isOpen-true { transform: translateX(0px); }
}
--sxs { --sxs: 4; }
@media  {
  @media (min-width: 1280px) {
  .c-eBIusB-kSJUXs-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-fDixPJ-variant-body3Bold { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 1280px) {
  .c-eBIusB-gKMNip-variant-body1Bold { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-sm); }
}
  @media (min-width: 576px) {
  .c-eBIusB-cNUKOG-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-jpHPls-variant-title3Bold { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
}
  @media (max-width: 991px) {
  .c-eBIusB-gBCbql-variant-body1Bold { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-sm); }
}
  @media (min-width: 992px) {
  .c-gtpFUc-cbzYqV-variant-small { padding: 9px 24px; }
}
  @media (max-width: 991px) {
  .c-gtpFUc-hBVbCC-variant-extrasmall { padding: 6px 16px; }
}
  @media (min-width: 992px) {
  .c-eBIusB-LfmpZ-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-ioMTLi-variant-caption1Medium { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-eKviWz-variant-body1Regular { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-sm); }
}
  @media (max-width: 991px) {
  .c-eBIusB-hYBfdz-variant-body3Regular { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-ikrVeB-variant-title2Bold { font-size: var(--fontSizes-size32); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-lg); }
}
  @media (max-width: 991px) {
  .c-eBIusB-kDaEZN-variant-title3Bold { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
}
  @media (max-width: 991px) {
  .c-eBIusB-cKoJQG-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-ceAgew-variant-title3Medium { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-md); }
}
  @media (min-width: 992px) {
  .c-eBIusB-keWrTP-variant-body2Bold { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-ghrupU-variant-body3Bold { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-fFCBbE-variant-body2Regular { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-KiKpV-variant-caption1Regular { font-size: var(--fontSizes-size12); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-kQBDqU-variant-body1Medium { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-sm); }
}
  @media (min-width: 992px) {
  .c-eBIusB-hHeUkq-variant-body3Regular { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-regular); line-height: var(--lineHeights-xxs); }
}
  @media (min-width: 992px) {
  .c-eBIusB-dIvCrr-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-QwcWc-variant-body3Medium { font-size: var(--fontSizes-size14); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xxs); }
}
  @media (max-width: 991px) {
  .c-eBIusB-gZvxvX-variant-popupBannerTitle { font-size: var(--fontSizes-size22); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
}
  @media not all {
  .c-eBIusB-koelJl-variant-body2Medium { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-xs); }
}
}
--sxs { --sxs: 5; }
@media  {
  .c-gtpFUc-cCcRdZ-cv { padding: 7.5px 22.5px; }
}
--sxs { --sxs: 6; }
@media  {
  .c-dhzjXW-iknTffZ-css > :not(:first-child) { margin-left: 8px; }
  .c-lkXhhf-icKKirK-css { background-image: url("/reference/assets/ff33e4a415386814.webp"); }
  .c-kWkSpo-ieNoVsq-css { border-image-source: linear-gradient(90deg, var(--colors-primaryDefault, rgb(212, 253, 7)) 100%, var(--colors-primaryDefault, rgb(212, 253, 7)) 130%); border-image-slice: 1; }
  .c-fjePfl-itYszh-css { width: 10%; }
  .c-fjePfl-ibdnoLv-css { width: 30%; }
  .c-huLkeJ-ieNoVsq-css { border-image-source: linear-gradient(90deg, var(--colors-primaryDefault, rgb(212, 253, 7)) 100%, var(--colors-primaryDefault, rgb(212, 253, 7)) 130%); border-image-slice: 1; }
  .c-PJLV-icqLMts-css { margin-bottom: var(--space-space8); }
  .c-dhzjXW-ieyoHqM-css { }
  .c-dhzjXW-ieyoHqM-css > :not(:first-child) { margin-top: 16px; }
}
.marquee-container { position: relative; width: 100%; overflow-x: hidden !important; display: flex !important; flex-direction: row !important; }
.marquee-container:hover div { animation-play-state: var(--pause-on-hover); }
.marquee-container:active div { animation-play-state: var(--pause-on-click); }
.overlay { position: absolute; width: 100%; height: 100%; }
.overlay::before, .overlay::after { background: linear-gradient(to right, var(--gradient-color)); content: ""; height: 100%; position: absolute; width: var(--gradient-width); z-index: 2; }
.overlay::after { right: 0px; top: 0px; transform: rotateZ(180deg); }
.overlay::before { left: 0px; top: 0px; }
.marquee { flex: 0 0 auto; min-width: 100%; z-index: 1; display: flex; flex-direction: row; align-items: center; animation-name: scroll; animation-duration: var(--duration); animation-timing-function: linear; animation-iteration-count: var(--iteration-count, infinite); animation-fill-mode: forwards; animation-play-state: var(--play); animation-delay: var(--delay); animation-direction: var(--direction); }
@keyframes scroll { 
  0% { transform: translateX(0%); }
  100% { transform: translateX(-100%); }
}
input.c-kHqjIX.c-exXVOH.c-bpaGqe { font-family: var(--font-be-vietnam-pro) !important; }
span.c-eBIusB.c-eBIusB-lcbVhe-whitelabel-default.c-eBIusB-hyvuql-weight-bold.c-dFfuhX { font-family: var(--font-markazi-text) !important; }
.marquee-container { position: relative; width: 100%; overflow-x: hidden !important; display: flex !important; flex-direction: row !important; }
.marquee-container:hover div { animation-play-state: var(--pause-on-hover); }
.marquee-container:active div { animation-play-state: var(--pause-on-click); }
.overlay { position: absolute; width: 100%; height: 100%; }
.overlay::before, .overlay::after { background: linear-gradient(to right, var(--gradient-color)); content: ""; height: 100%; position: absolute; width: var(--gradient-width); z-index: 2; }
.overlay::after { right: 0px; top: 0px; transform: rotateZ(180deg); }
.overlay::before { left: 0px; top: 0px; }
.marquee { flex: 0 0 auto; min-width: 100%; z-index: 1; display: flex; flex-direction: row; align-items: center; animation-name: scroll; animation-duration: var(--duration); animation-timing-function: linear; animation-iteration-count: var(--iteration-count, infinite); animation-fill-mode: forwards; animation-play-state: var(--play); animation-delay: var(--delay); animation-direction: var(--direction); }
@keyframes scroll { 
  0% { transform: translateX(0%); }
  100% { transform: translateX(-100%); }
}
/* Hide ornate gold decorative frames on tablet/mobile (project breakpoint 991px). Desktop keeps them. */
@media (max-width: 991px) {
  .custom-frame { display: none; }
}


/* === Source stitches rules from /games/slot — appended for layout coverage === */
@media{.c-fNvXDc{display:flex;flex:1;flex-direction:column}.c-jjpMwf{background:var(--colors-inkLight);position:fixed;width:300px;height:100%;overflow:scroll;z-index:1201;transition:all 0.15s ease;box-shadow:0.1rem 0 0.02rem rgba(0,0,0,0.1);transform:translateX(-100%);left:0;top:0;bottom:0}@media (min-width: 992px){.c-jjpMwf{display:none}}.c-hSKcfS{display:flex;justify-content:space-between;align-items:center;padding:16px}.c-UazGY{display:flex;align-items:center}.c-bLdNGJ{display:flex;cursor:pointer}.c-iWpHqy{border-bottom:1px solid #D9E9F2}.c-cIdiJW{text-decoration:none}.c-dVOKBM{display:flex;align-items:center;padding:16px}.c-kolHsO{margin-left:8px}.c-fewYWN{color:var(--colors-skyLightest, #FFFFFF)}.c-eBIusB{line-height:1.2;margin:0;font-weight:var(--fontWeights-regular);display:block}.c-gTynjM{display:flex;flex-direction:row;flex:1;cursor:pointer;color:white;align-items:center}.c-gTynjM span{color:white}.c-gTynjM > svg{margin-right:var(--space-xs)}.c-eRhPxt{margin-right:4px;filter:drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.35))}.c-hqXzi{width:16px;height:16px;border-radius:8px}.c-hlTBXk{color:var(--colors-skyLightest);text-transform:capitalize}.c-kokaPQ{margin-right:8px}.c-bNHULD{border-radius:0px;flex:1;width:100%}@media (min-width: 992px){.c-hzUrXJ{display:none}}.c-jDjnIk{display:flex}.c-jDjnIk button{border-radius:0px}.c-fZlHvM svg path{stroke:var(--colors-secondaryDark)}.c-hJhMRA{overflow:hidden;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content}.c-gtpFUc{cursor:pointer;outline:none;-webkit-user-select:none;user-select:none;justify-content:center;width:100%;color:var(--colors-white);border:unset;transition:all 150ms ease-out;display:flex;align-items:center}.c-dFfuhX{color:var(--colors-skyLightest)}.c-dJpCLK{display:flex;flex-wrap:wrap;border-bottom:0.5px solid #D9E9F2}.c-fmXhxl{display:flex;width:33%;align-items:center;justify-content:center;padding-top:16px;padding-bottom:16px;flex-direction:column}.c-bCRLag{max-width:32px;max-height:32px}.c-koofwM{margin-bottom:8px}.c-lcPmgm{display:flex;flex:1}.c-bHzkZd{padding-bottom:16px;padding-right:8px;margin-top:20px;align-self:flex-end}.c-SNhSq{display:flex;flex:1;position:relative;height:100%;flex-direction:column}@media (max-width:  991px){.c-SNhSq{margin-bottom:72px}}.c-MstJl{position:fixed;width:100%;z-index:1000;box-shadow:0px 2px 10px rgba(0,0,0,0.3)}@media (max-width:  991px){.c-MstJl{display:none}}.c-MstJl{background:var(--colors-inkDefault);height:143px}.c-eITHhL{display:flex;align-items:center;background:var(--colors-inkLightest);height:24px}.c-fGHEql{width:100%}.c-dhzjXW{display:flex}.c-iefmez{overflow:hidden;flex:1;align-items:center;display:flex}.c-kbRxRG{color:white;height:24px}.c-iFAMB{display:flex;align-items:center;padding-top:12px}.c-hEWFPv{display:flex;flex:1;max-height:34px;padding-top:8px;padding-bottom:8px}.c-gzflTi{border-left:0.5px solid white;border-right:0.5px solid white;margin-left:12px;margin-right:12px}.c-iMHPmU{display:flex;flex-direction:row;align-items:center;text-decoration:none;position:relative}.c-iMHPmU::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--colors-secondaryDefault);transition:transform 300ms;transform:scale(0);transform-origin:center}.c-flWDnm{width:-moz-fit-content;width:fit-content}.c-bpaGqe{width:140px}@media (min-width: 1280px){.c-bpaGqe{width:initial}}.c-kYtbRs{position:relative;display:flex;margin-right:8px}.c-hrlkMa{background:#20666F;border-radius:4px}.c-exXVOH{padding-top:9px;padding-bottom:9px;max-height:36px}.c-bZNrxE{display:flex;flex-direction:row}.c-hyEoVL{position:relative;border-radius:4px;display:flex;flex-direction:row;flex:1;align-items:center}.c-kHqjIX{background:unset;border:unset;outline:none;color:white;display:flex;flex:1;padding-left:16px;padding-right:16px}.c-kHqjIX::placeholder{color:var(--colors-skyLightest);opacity:0.5}.c-kHqjIX:disabled{color:var(--colors-skyLighter);opacity:0.5}@media (min-width: 992px){.c-kHqjIX{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxs)}}@media (max-width:  991px){.c-kHqjIX{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxs)}}.c-ldfSEu{position:absolute;-webkit-user-select:none;user-select:none;pointer-events:none;left:16px;opacity:0.5}.c-ekzekW{margin-left:4px;margin-right:4px}.c-dlRlrD{margin-right:12px;display:flex;align-items:center}.c-iUzUHX{cursor:pointer;height:-moz-fit-content;height:fit-content;display:flex}.c-kiLWvQ svg path{stroke:var(--colors-primaryLight)}.c-kVFvxy{display:flex;margin-top:auto}.c-bhjCFi{position:relative;width:303px}.c-jDChox{display:flex;height:100%;align-items:center}.c-eCRKlW{position:absolute;inset:0;display:flex;align-items:self-end}.c-fqrbKy{width:100%;margin-top:auto;margin-left:-32px}.c-iOUgsF{background:var(--colors-inkLight);height:37px;display:flex;flex:1}.c-kZdsED{display:flex;flex:1;max-width:984px}.c-flysGN{display:flex;flex:1;align-items:center;justify-content:space-evenly}.c-kEGpHA{text-decoration:none;position:relative;cursor:pointer;border:none;padding:0;background:transparent;display:flex;align-items:center}.c-kEGpHA::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--colors-secondaryDefault);transition:transform 300ms;transform:scale(0);transform-origin:center}.c-lptOrU:hover{color:var(--colors-secondaryLight)}.c-dlmoIL{height:72px;position:fixed;width:100%;z-index:1000;box-shadow:0px 2px 10px rgba(0,0,0,0.3)}@media (min-width: 992px){.c-dlmoIL{display:none}}.c-fNsOmT{display:flex;flex:1;justify-content:space-between;align-items:center;height:100%}.c-fsejKH{width:25px;height:20px;position:relative;margin:8px auto;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform: rotate(0deg);transform:rotate(0deg);-webkit-transition: .5s ease-in-out;-moz-transition: .5s ease-in-out;-o-transition:.5s ease-in-out;transition: .5s ease-in-out;cursor:pointer;border:none;background:inherit}.c-fsejKH > span{display:block;position:absolute;height:2.4px;width:100%;background:var(--colors-skyLightest);border-radius:9px;opacity:1;left:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out}.c-fsejKH > span:nth-child(1){top:0}.c-fsejKH > span:nth-child(2){top:9px}.c-fsejKH > span:nth-child(3){top:9px}.c-fsejKH > span:nth-child(4){top:18px}.c-bjbdTA{background:var(--colors-skyLightest)}.c-cmpvrW{position:relative}.c-lkBNdM{height:100%}.c-dbclGt{background:var(--colors-inkDark)}.c-bJYOuh{margin-bottom:32px}.c-jRSoJY{display:none}@media (min-width: 992px){.c-jRSoJY{display:inherit}}.c-iYKciF{margin-left:12px}.c-hmxryr{background:var(--colors-inkLight)}.c-cLMKLl{display:flex;flex:1;align-items:center;padding-top:16px;padding-bottom:16px;overflow:auto}.c-iYefnR{display:flex;width:100%;height:100%;align-items:center;padding:8px;position:relative}.c-lcjRkL{z-index:1;object-fit:contain;width:24px;height:24px}.c-imxXhq{width:100%;cursor:pointer}.c-izpPVv{display:flex;width:100%;height:100%;align-items:center;padding:8px;position:relative;flex-direction:row}.c-bVqTIw{display:flex;width:36px;height:36px;position:relative;margin-right:8px}.c-jlrkmt{color:#11363C;text-transform:capitalize;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.c-ciVisu{display:none}@media (max-width:  991px){.c-ciVisu{display:inherit}}.c-llBWyL{display:flex;flex:1;justify-content:space-between;background:var(--colors-inkLight);align-items:center;overflow:scroll;height:72px}.c-kSnIEN{max-height:36px;object-fit:contain}.c-MuAPf{min-width:72px;cursor:pointer}.c-MuAPf:hover{opacity:0.9}.c-ekwkue{margin-top:4px}.c-cNCLhd{color:#009D7C;text-transform:capitalize;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.c-cDsaNG{color:var(--colors-skyLightest);text-transform:capitalize;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.c-zNWNd{width:100%;margin:0 auto;padding-left:8px;padding-right:8px}@media (min-width: 414px){.c-zNWNd{padding-left:calc(var(--space-sm) - 16px);padding-right:calc(var(--space-sm) - 16px)}}@media (min-width: 576px){.c-zNWNd{padding-left:calc(var(--space-md) - 16px);padding-right:calc(var(--space-md) - 16px)}}@media (min-width: 768px){.c-zNWNd{padding-left:calc(var(--space-md) - 16px);padding-right:calc(var(--space-md) - 16px)}}@media (min-width: 992px){.c-zNWNd{padding-left:calc(var(--space-xl) - 16px);padding-right:calc(var(--space-xl) - 16px)}}@media (min-width: 1280px){.c-zNWNd{max-width:1580px;padding-left:calc(var(--space-xl) - 16px);padding-right:calc(var(--space-xl) - 16px)}}.c-iOpAfs{display:flex;flex:1;justify-content:space-between}.c-dpwgnB{width:360px;min-width:360px}@media (max-width:  991px){.c-dpwgnB{display:none}}.c-bBgzfM{margin-left:12px;display:flex;align-items:center}.c-fcaOLc{margin-top:24px}.c-eJYBbS{display:flex;width:33.33%;align-items:center;flex-direction:column;margin-bottom:20px}.c-bQCWve{object-fit:contain;aspect-ratio:1;width:100%;height:100%}.c-ebObwl{display:flex;flex-wrap:wrap;width:100%;padding:20px 20px 0px 20px;border-top-left-radius:12px;border-top-right-radius:12px;background:var(--colors-inkLightest)}.c-eTYFsW{background:var(--colors-skyLightest);max-width:64px;width:100%;height:100%;max-height:64px;border-radius:50%;position:relative;padding-top:8px;padding-bottom:8px;padding-left:8px;padding-right:8px;margin-bottom:8px}.c-jcWDlP{position:absolute;top:-4px;right:0}.c-kJKJMj{background:var(--colors-inkLighter);border-bottom-left-radius:12px;border-bottom-right-radius:12px;padding-left:20px;padding-right:20px}.c-kojyFS{margin-top:8px}.c-VnRDZ{position:relative;width:100%;background:var(--colors-inkLight);border-radius:4px;padding-top:20px;padding-bottom:20px;margin-top:8px;margin-bottom:8px}.c-bkvLuU{width:calc(100% - 400px)}@media (max-width:  991px){.c-bkvLuU{width:100%}}.c-mIdCe{display:flex;align-items:center;padding:8px 0px;flex-wrap:wrap}@media (min-width: 992px){.c-mIdCe{padding:0px}}.c-hXKxio{display:flex;flex:1;align-items:flex-end;justify-content:space-between}.c-dWksIc{overflow:auto}.c-gApJDj{display:flex;flex:1;overflow-x:scroll}.c-gApJDj::-webkit-scrollbar{display:none}.c-eFYwtl{margin-top:16px}.c-bVDGww{display:flex;align-items:center;flex-direction:column;background:var(--colors-inkLightest);border-radius:12px;min-width:65px;width:65px;min-height:96px;padding:8px;margin-right:12px}.c-fRKYWh{object-fit:contain}.c-jWtoMJ{word-break:break-all}.c-gQBKVi{display:flex;overflow-x:scroll;width:100%;position:relative}.c-dfrprK{background:var(--colors-skyLightest);width:100%;height:100%;max-width:44px;max-height:44px;border-radius:50%;position:relative;padding-top:8px;padding-bottom:8px;padding-left:8px;padding-right:8px;margin-bottom:8px}.c-eGbDAs{margin-top:16px;margin-bottom:16px}.c-XolLN{display:flex;flex-direction:row;flex-wrap:wrap}.c-fNOVIW{position:relative;width:32%;margin-bottom:var(--space-space24);background:var(--colors-inkLight);border-radius:4px}@media (min-width: 768px){.c-fNOVIW{width:22%}}@media (min-width: 992px){.c-fNOVIW{width:14%;max-width:initial}}@media (min-width: 1280px){.c-fNOVIW{width:12%;max-width:initial}}.c-cgMItF{width:2%}@media (min-width: 768px){.c-cgMItF{display:none}}.c-gPSLuh{display:none}@media (min-width: 1280px){.c-gPSLuh{display:block;min-width:2.66%}}.c-iqNdIn{display:none}@media (min-width: 992px){.c-iqNdIn{display:block;min-width:3.2%}}@media (min-width: 1280px){.c-iqNdIn{display:none}}@media (min-width: 768px){.c-jZBWJo{width:4%}}@media (min-width: 992px){.c-jZBWJo{display:none}}.c-gSCRyo{padding-top:8px;background:var(--colors-inkDefault)}.c-bNfHEu{padding-top:48px;padding-bottom:48px}.c-ewwrgk{margin-bottom:40px}.c-eFTPCr{margin-bottom:16px}.c-ekCNeI{margin-bottom:4px}.c-ewxXJy{margin-top:40px}.c-eUgBAM{display:flex;flex:1;justify-content:center}.c-gNkPVL{margin-left:8px;display:flex;align-items:center}.c-vINCg{display:flex;flex-direction:column}@media (max-width:  991px){.c-vINCg:nth-child(1),.c-vINCg:nth-child(2){margin-bottom:40px}}.c-vINCg:nth-child(2),.c-vINCg:nth-child(3){align-items:center}.c-vINCg:nth-child(1){width:30%}@media (min-width: 992px){.c-vINCg:nth-child(1){border-right:0.5px solid var(--colors-skyLightest)}}.c-vINCg:nth-child(2){width:40%}@media (min-width: 992px){.c-vINCg:nth-child(2){border-right:0.5px solid var(--colors-skyLightest)}}.c-vINCg:nth-child(3){width:30%}.c-ivhbiN{width:60%}@media (max-width: 575px){.c-ivhbiN{width:80%}}.c-hOwCtY{color:var(--colors-secondaryDefault, #009D7C)}.c-cHomai{display:flex;justify-content:space-between}@media (max-width:  991px){.c-cHomai{flex-direction:column}}.c-bQHvIY{display:flex;align-items:center}.c-bQHvIY img{width:20px;height:20px;object-fit:contain}.c-fxBZHy{max-width:160px;max-height:100px;min-width:100px;object-fit:contain}@media (max-width:  991px){.c-fxBZHy{max-width:80px;min-width:50px}}.c-hWkySb{display:flex;align-items:center;height:145px}@media (max-width:  991px){.c-hWkySb{height:98px}}.c-hWkySb{overflow-y:scroll}.c-cNuIPk{background:var(--colors-inkDark);padding-top:20px;padding-bottom:20px}.c-kqvkfk{display:flex;justify-content:center}.c-KfFnA{display:flex;flex-direction:column;align-items:center;justify-content:end}.c-fFhAKI{padding-top:12px;padding-bottom:12px;background:var(--colors-skyLightest)}.c-gCKge{display:flex;flex:1;align-items:center}@media (max-width:  991px){.c-gCKge{flex-direction:column}}.c-deZXRM{display:flex;flex:1;align-items:center}.c-fcclLm{margin-right:24px}.c-iflkHV{margin-top:12px}.c-gquuCI{color:var(--colors-inkDefault, #11363C)}.c-UUNBw{cursor:pointer;padding-left:var(--space-space12);padding-right:var(--space-space12);display:flex;list-style-type:none;text-decoration:none;flex-direction:column;justify-content:center;align-items:center}.c-gFctFD{display:flex;flex:1;flex-direction:row;position:fixed;bottom:0;z-index:1001;height:72px;width:100%;align-items:center;box-shadow:0px 0 4px rgba(0, 0, 0, 0.6);background:var(--colors-inkDark)}@media (min-width: 992px){.c-gFctFD{display:none}}.c-gVTmWq{height:100%;display:flex;flex:1;-webkit-user-select:none;user-select:none;justify-content:center;align-items:center}.c-jLIMzR{position:fixed;right:0;width:-moz-fit-content;width:fit-content;height:0px;background:blue;top:20%;transition:transform 250ms ease-out}.c-eagrSl{background:var(--colors-angularGold);padding-top:4px;padding-bottom:4px;padding-left:4px;padding-right:4px;width:248px;float:right}.c-eWVgET{width:100%;height:100%;background:var(--colors-redDark)}.c-kVHZSi{display:flex;flex:1;align-items:center;justify-content:center}.c-hdMaTR{background:radial-gradient(50% 50% at 50% 50%, var(--colors-redLight, #FF3F0F) 7.29%, var(--colors-redDark, #A82200) 100%);padding-top:12px;padding-bottom:12px;padding-left:12px;padding-right:12px}.c-cQcWEW{width:100%;height:4px;background:var(--colors-angularGold)}.c-fFxTms{overflow:scroll;height:400px}@media screen and (max-height: 590px){.c-fFxTms{height:300px}}@media screen and (max-height: 460px){.c-fFxTms{height:200px}}.c-jHtcEb{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin-left:16px}.c-jPWlCg{border-radius:4px;display:flex;flex:1;align-items:center;padding-left:16px;padding-right:16px;padding-top:12px;padding-bottom:12px;cursor:pointer}.c-cTGEgl{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center}.c-fCMKGn{height:76px;width:76px;padding:4px;border-radius:36px;float:right;cursor:pointer;background:var(--colors-angularGold);background-repeat:round;pointer-events:all;position:relative;transition:all 300ms}.c-eyOZaa{width:100%;height:100%;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%, var(--colors-redLight, #FF3F0F) 7.29%, var(--colors-redDark, #A82200) 100%);display:flex;justify-content:center;align-items:center;transform-origin:top left;white-space:nowrap}}--sxs{--sxs:3 c-dVOKBM-hmxryr-active-false c-eBIusB-lcbVhe-whitelabel-default c-eBIusB-jMbvfn-variant-body1Regular c-hqXzi-iPvquN-isMobile-true c-gtpFUc-epMvHt-variant-small c-gtpFUc-byHMer-buttonType-tertiary c-eBIusB-loYxcV-variant-body3Medium c-gtpFUc-ewcrAC-buttonType-primary c-eBIusB-fKCCCT-variant-body2Medium c-eBIusB-gGtGlI-variant-caption1Regular c-eBIusB-gsXdEb-align-right c-fGHEql-fvfCsT-variant-onlyLeft c-dhzjXW-ejCoEP-direction-horizontal c-dhzjXW-DIXHo-alignContent-stretch c-dhzjXW-jroWjL-alignItems-center c-dhzjXW-bWhLCh-alignSelf-auto c-dhzjXW-awKDG-justify-start c-dhzjXW-kVNAnR-wrap-noWrap c-fGHEql-jvtgLD-variant-default c-eBIusB-jzvilD-variant-caption1Medium c-dFfuhX-knjGtB-isGaruda-false c-eBIusB-eKEuTC-variant-body3Regular c-gtpFUc-khvKJZ-buttonType-secondary c-kVFvxy-jpKRnm-isAuthenticated-false c-eBIusB-Wtgcs-variant-body2Regular c-iMHPmU-bOqmrA-state-active c-dFfuhX-dBHBrn-state-active-false c-dlmoIL-iDfZUm-isGaruda-false c-fNvXDc-iBMrbG-isGaruda-false c-imxXhq-hIjDUz-active-true c-eBIusB-gjdJOs-align-center c-eBIusB-jArXUZ-variant-caption2Bold c-eBIusB-fNkPXa-variant-caption2Regular c-iOpAfs-bKeqbn-isGin-false c-dhzjXW-iTKOFX-direction-vertical c-dhzjXW-irEjuD-alignItems-stretch c-bVDGww-hmxryr-active-false c-bNfHEu-hmxryr-isGaruda-false c-dFfuhX-hXcvcN-isGaruda-false c-bNfHEu-iDfZUm-isGaruda-false c-fxBZHy-bMYZZi-separator-true c-KfFnA-fbYFYg-separator-true c-PJLV-cwdgLk-media-onlyMobile c-jLIMzR-ebohZG-isOpen-false c-eagrSl-hjkvhz-isOpen-false c-eBIusB-gfCyWM-variant-title3Bold}@media{.c-dVOKBM-hmxryr-active-false{background:var(--colors-inkLight)}.c-eBIusB-lcbVhe-whitelabel-default{font-family:var(--font-be-vietnam-pro)}.c-eBIusB-jMbvfn-variant-body1Regular{font-size:var(--fontSizes-size18);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-sm)}.c-hqXzi-iPvquN-isMobile-true{width:24px;height:24px;border-radius:12px}.c-gtpFUc-epMvHt-variant-small{padding:9px 24px}.c-gtpFUc-byHMer-buttonType-tertiary{background:var(--colors-skyLightest)}.c-gtpFUc-byHMer-buttonType-tertiary span{color:var(--colors-inkDefault)}.c-gtpFUc-byHMer-buttonType-tertiary svg path{stroke:var(--colors-inkDefault)}.c-gtpFUc-byHMer-buttonType-tertiary:hover{background:var(--colors-secondaryLightest)}.c-gtpFUc-byHMer-buttonType-tertiary:hover span{color:var(--colors-secondaryDark)}.c-gtpFUc-byHMer-buttonType-tertiary:hover svg path{stroke:var(--colors-secondaryDark)}.c-gtpFUc-byHMer-buttonType-tertiary:active{background:var(--colors-secondaryLighter)}.c-gtpFUc-byHMer-buttonType-tertiary:active span{color:var(--colors-secondaryDark)}.c-gtpFUc-byHMer-buttonType-tertiary:active svg path{stroke:var(--colors-secondaryDark)}.c-gtpFUc-byHMer-buttonType-tertiary[loading]{background:var(--colors-secondaryLighter);cursor:wait}.c-gtpFUc-byHMer-buttonType-tertiary[loading] span{color:var(--colors-secondaryDark)}.c-gtpFUc-byHMer-buttonType-tertiary[loading] svg path{stroke:var(--colors-secondaryDark)}.c-gtpFUc-byHMer-buttonType-tertiary:disabled{background:var(--colors-skyLighter);cursor:not-allowed}.c-gtpFUc-byHMer-buttonType-tertiary:disabled svg path{stroke:var(--colors-skyLight)}.c-gtpFUc-byHMer-buttonType-tertiary:disabled span{color:var(--colors-skyLight)}.c-eBIusB-loYxcV-variant-body3Medium{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xxs)}.c-gtpFUc-ewcrAC-buttonType-primary{background:var(--colors-primaryLight)}.c-gtpFUc-ewcrAC-buttonType-primary svg path{stroke:var(--colors-inkDefault)}.c-gtpFUc-ewcrAC-buttonType-primary span{color:var(--colors-inkDefault)}.c-gtpFUc-ewcrAC-buttonType-primary:hover{background:var(--colors-primaryLighter)}.c-gtpFUc-ewcrAC-buttonType-primary:active{background:var(--colors-primaryLighteyarnst)}.c-gtpFUc-ewcrAC-buttonType-primary[loading]{background:var(--colors-primaryDefault);cursor:wait}.c-gtpFUc-ewcrAC-buttonType-primary:disabled{background:var(--colors-skyLighter);cursor:not-allowed}.c-gtpFUc-ewcrAC-buttonType-primary:disabled svg path{stroke:var(--colors-skyLight)}.c-gtpFUc-ewcrAC-buttonType-primary:disabled span{color:var(--colors-skyLight)}.c-eBIusB-fKCCCT-variant-body2Medium{font-size:var(--fontSizes-size16);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xs)}.c-eBIusB-gGtGlI-variant-caption1Regular{font-size:var(--fontSizes-size12);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxxs)}.c-eBIusB-gsXdEb-align-right{text-align:right}.c-fGHEql-fvfCsT-variant-onlyLeft{margin:0 auto;padding-left:var(--space-sm)}@media (min-width: 414px){.c-fGHEql-fvfCsT-variant-onlyLeft{padding-left:var(--space-sm)}}@media (min-width: 576px){.c-fGHEql-fvfCsT-variant-onlyLeft{padding-left:var(--space-md)}}@media (min-width: 768px){.c-fGHEql-fvfCsT-variant-onlyLeft{padding-left:var(--space-md)}}@media (min-width: 992px){.c-fGHEql-fvfCsT-variant-onlyLeft{padding-left:var(--space-xl)}}@media (min-width: 1280px){.c-fGHEql-fvfCsT-variant-onlyLeft{max-width:1580px}}.c-dhzjXW-ejCoEP-direction-horizontal{flex-direction:row}.c-dhzjXW-DIXHo-alignContent-stretch{align-content:stretch}.c-dhzjXW-jroWjL-alignItems-center{align-items:center}.c-dhzjXW-bWhLCh-alignSelf-auto{align-self:auto}.c-dhzjXW-awKDG-justify-start{justify-content:flex-start}.c-dhzjXW-kVNAnR-wrap-noWrap{flex-wrap:nowrap}.c-fGHEql-jvtgLD-variant-default{width:100%;margin:0 auto;padding-left:8px;padding-right:8px}@media (min-width: 414px){.c-fGHEql-jvtgLD-variant-default{padding-left:var(--space-sm);padding-right:var(--space-sm)}}@media (min-width: 576px){.c-fGHEql-jvtgLD-variant-default{padding-left:var(--space-md);padding-right:var(--space-md)}}@media (min-width: 768px){.c-fGHEql-jvtgLD-variant-default{padding-left:var(--space-md);padding-right:var(--space-md)}}@media (min-width: 992px){.c-fGHEql-jvtgLD-variant-default{padding-left:var(--space-xl);padding-right:var(--space-xl)}}@media (min-width: 1280px){.c-fGHEql-jvtgLD-variant-default{max-width:1580px;padding-left:var(--space-xl);padding-right:var(--space-xl)}}.c-eBIusB-jzvilD-variant-caption1Medium{font-size:var(--fontSizes-size12);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xxxs)}.c-dFfuhX-knjGtB-isGaruda-false:hover{color:var(--colors-secondaryDefault)}.c-eBIusB-eKEuTC-variant-body3Regular{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxs)}.c-gtpFUc-khvKJZ-buttonType-secondary{background:transparent;border:1.5px solid;border-image-slice:1;border-width:1.5px;border-image-source:var(--colors-primaryDefault);border-color:transparent}.c-gtpFUc-khvKJZ-buttonType-secondary span{background:var(--colors-primaryLight);-webkit-background-clip:text;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-fill-color:transparent}.c-gtpFUc-khvKJZ-buttonType-secondary:hover{background:var(--colors-secondaryLightest)}.c-gtpFUc-khvKJZ-buttonType-secondary:hover span{color:var(--colors-secondaryDefault);-webkit-background-clip:initial;background-clip:initial;-webkit-background-clip:initial;background:transparent;-webkit-text-fill-color:initial;text-fill-color:initial}.c-gtpFUc-khvKJZ-buttonType-secondary:hover svg path{stroke:var(--colors-secondaryDefault)}.c-gtpFUc-khvKJZ-buttonType-secondary:active{border-image-source:none}.c-gtpFUc-khvKJZ-buttonType-secondary[loading]{background:var(--colors-secondaryLightest);border-image-source:none;border:none;cursor:wait}.c-gtpFUc-khvKJZ-buttonType-secondary[loading] span{color:var(--colors-secondaryDefault);-webkit-background-clip:initial;background-clip:initial;-webkit-background-clip:initial;background:transparent;-webkit-text-fill-color:initial;text-fill-color:initial}.c-gtpFUc-khvKJZ-buttonType-secondary[loading] svg path{stroke:var(--colors-secondaryDefault)}.c-gtpFUc-khvKJZ-buttonType-secondary:disabled{background:var(--colors-skyLighter);cursor:not-allowed;border-image-source:none}.c-gtpFUc-khvKJZ-buttonType-secondary:disabled span{color:var(--colors-skyLight);-webkit-background-clip:initial;background-clip:initial;-webkit-background-clip:initial;background:transparent;-webkit-text-fill-color:initial;text-fill-color:initial}.c-gtpFUc-khvKJZ-buttonType-secondary:disabled svg path{stroke:var(--colors-skyLight)}.c-kVFvxy-jpKRnm-isAuthenticated-false{height:71px}.c-eBIusB-Wtgcs-variant-body2Regular{font-size:var(--fontSizes-size16);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xs)}.c-iMHPmU-bOqmrA-state-active::after{transform:scale(1);background:var(--colors-secondaryDefault)}.c-dFfuhX-dBHBrn-state-active-false{color:var(--colors-secondaryDefault)}.c-dlmoIL-iDfZUm-isGaruda-false{background:var(--colors-inkDefault)}@media (min-width: 992px){.c-fNvXDc-iBMrbG-isGaruda-false{margin-top:143px}}@media (max-width:  991px){.c-fNvXDc-iBMrbG-isGaruda-false{margin-top:96px}}.c-imxXhq-hIjDUz-active-true{border:2px solid;border-color:var(--colors-secondaryLightest);border-radius:4px}.c-eBIusB-gjdJOs-align-center{text-align:center}.c-eBIusB-jArXUZ-variant-caption2Bold{font-size:var(--fontSizes-size10);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-xxxxs)}.c-eBIusB-fNkPXa-variant-caption2Regular{font-size:var(--fontSizes-size10);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxxxs)}.c-iOpAfs-bKeqbn-isGin-false{margin-top:32px}.c-dhzjXW-iTKOFX-direction-vertical{flex-direction:column}.c-dhzjXW-irEjuD-alignItems-stretch{align-items:stretch}.c-bVDGww-hmxryr-active-false{background:var(--colors-inkLight)}.c-bNfHEu-hmxryr-isGaruda-false{background:var(--colors-inkLight)}@media (min-width: 992px){.c-dFfuhX-hXcvcN-isGaruda-false{color:var(--colors-secondaryDefault)}}.c-bNfHEu-iDfZUm-isGaruda-false{background:var(--colors-inkDefault)}.c-fxBZHy-bMYZZi-separator-true{margin-left:48px}.c-KfFnA-fbYFYg-separator-true{margin-left:24px}@media (min-width: 992px){.c-PJLV-cwdgLk-media-onlyMobile{margin:0px;padding:0px}}.c-jLIMzR-ebohZG-isOpen-false{z-index:10000}@media (max-width:  991px){.c-eagrSl-hjkvhz-isOpen-false{display:none}}.c-eBIusB-gfCyWM-variant-title3Bold{font-size:var(--fontSizes-size24);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-md)}}--sxs{--sxs:4 c-eBIusB-kSJUXs-variant-body3Medium c-eBIusB-fDixPJ-variant-body3Bold c-eBIusB-gKMNip-variant-body1Bold c-eBIusB-hgJImp-variant-caption1Bold c-eBIusB-cNUKOG-variant-caption1Regular c-eBIusB-cKoJQG-variant-body2Medium c-eBIusB-ceAgew-variant-title3Medium c-eBIusB-keWrTP-variant-body2Bold c-eBIusB-ghrupU-variant-body3Bold c-eBIusB-fFCBbE-variant-body2Regular c-eBIusB-KiKpV-variant-caption1Regular c-eBIusB-kQBDqU-variant-body1Medium c-eBIusB-ioMTLi-variant-caption1Medium c-eBIusB-hHeUkq-variant-body3Regular c-eBIusB-dIvCrr-variant-body2Medium c-eBIusB-QwcWc-variant-body3Medium}@media{@media (min-width: 1280px){.c-eBIusB-kSJUXs-variant-body3Medium{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xxs)}}@media (min-width: 992px){.c-eBIusB-fDixPJ-variant-body3Bold{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-xxs)}}@media (min-width: 1280px){.c-eBIusB-gKMNip-variant-body1Bold{font-size:var(--fontSizes-size18);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-sm)}}@media (min-width: 576px){.c-eBIusB-hgJImp-variant-caption1Bold{font-size:var(--fontSizes-size12);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-xxxs)}}@media (min-width: 576px){.c-eBIusB-cNUKOG-variant-caption1Regular{font-size:var(--fontSizes-size12);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxxs)}}@media (max-width:  991px){.c-eBIusB-cKoJQG-variant-body2Medium{font-size:var(--fontSizes-size16);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xs)}}@media (min-width: 992px){.c-eBIusB-ceAgew-variant-title3Medium{font-size:var(--fontSizes-size24);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-md)}}@media (min-width: 992px){.c-eBIusB-keWrTP-variant-body2Bold{font-size:var(--fontSizes-size16);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-xs)}}@media (max-width:  991px){.c-eBIusB-ghrupU-variant-body3Bold{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-bold);line-height:var(--lineHeights-xxs)}}@media (min-width: 992px){.c-eBIusB-fFCBbE-variant-body2Regular{font-size:var(--fontSizes-size16);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xs)}}@media (max-width:  991px){.c-eBIusB-KiKpV-variant-caption1Regular{font-size:var(--fontSizes-size12);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxxs)}}@media (min-width: 992px){.c-eBIusB-kQBDqU-variant-body1Medium{font-size:var(--fontSizes-size18);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-sm)}}@media (max-width:  991px){.c-eBIusB-ioMTLi-variant-caption1Medium{font-size:var(--fontSizes-size12);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xxxs)}}@media (min-width: 992px){.c-eBIusB-hHeUkq-variant-body3Regular{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-regular);line-height:var(--lineHeights-xxs)}}@media (min-width: 992px){.c-eBIusB-dIvCrr-variant-body2Medium{font-size:var(--fontSizes-size16);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xs)}}@media (max-width:  991px){.c-eBIusB-QwcWc-variant-body3Medium{font-size:var(--fontSizes-size14);font-weight:var(--fontWeights-medium);line-height:var(--lineHeights-xxs)}}}--sxs{--sxs:5 c-gtpFUc-cCcRdZ-cv}@media{.c-gtpFUc-cCcRdZ-cv{padding:7.5px 22.5px}}--sxs{--sxs:6 c-dhzjXW-iknTffZ-css c-dhzjXW-iPJLV-css c-gFctFD-iPJLV-css c-PJLV-icqLMts-css}@media{.c-dhzjXW-iknTffZ-css > *:not(:first-child){margin-left:8px}.c-PJLV-icqLMts-css{margin-bottom:var(--space-space8)}}

:root{
  color-scheme : light only;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
}
html {
  font-family: var(--font-be-vietnam-pro);
  font-size: 16px;
  clear: both;
  box-shadow: none;
}

* {
  box-sizing: border-box;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: darkgrey transparent;
}
*::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
*::-webkit-scrollbar-track {
  background: none;
  border-radius: 50%;
}
*::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  border-radius: 24px;
}
::-webkit-scrollbar-corner {
  background: rgba(0,0,0,0);
  visibility : hidden;
}

.no-scrollbar::-webkit-scrollbar{
  width: 0;
  height: 0;
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-transition: "color 9999s ease-out, background-color 9999s ease-out";
    -webkit-transition-delay: 9999s;
}

*::before {
  box-sizing: border-box;
}
*::after {
  box-sizing: border-box;
}
ul[class] {
  margin: 0;
  list-style: none;
}
ol[class] {
  margin: 0;
  list-style: none;
}
body {
  max-width: 100vw;
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  margin: 0;
  display: flex;
  flex: 1;
  flex-direction: column;
}
body > div#__next {
  height: 100vh;
}
figure {
  margin: 0;
}
blockquote {
  margin: 0;
}
dl {
  margin: 0;
}
dd {
  margin: 0;
}
a:not([class]) {
  text-decoration-skip-ink: auto;
}
img {
  max-width: 100%;
  display: block;
}
input {
  font: inherit;
}
button {
  font: inherit;
}
textarea {
  font: inherit;
}
select {
  font: inherit;
}
img:not([alt]) {
  filter: blur(10px);
}
img {
  color : white;
}
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms;
    animation-iteration-count: 1 ;
    transition-duration: 0.01ms ;
    scroll-behavior: auto ;
  }
}

amp-script {
  opacity: 1;
}


.marqueeAMP {
  height: 20px;
  width : 100%;

  position: relative;
}

.marqueeAMP div {
  display: flex;
  min-width:200%;
  width: max-content;
  height : 100%;
  position: absolute;

  animation: marqueeAMP 20s linear infinite;
}
.marqueeAMP span {
  width : 50%;
  display : flex;
  align-items:center;
}


@keyframes marqueeAMP {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}


 .lottery-marquee-container {
  overflow: hidden;
  width: 100%;
  display: flex;
}

.lottery-marquee-track {
  display: flex;
  flex-direction: row;
  animation: lotteryMarqueeAMP 20s linear infinite;
  gap: 12px;
}

@keyframes lotteryMarqueeAMP {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}


            

/* Provider filter sidebar — extracted VERBATIM from live KATAKJP stitches
   runtime on 2026-05-21 at https://katakjpads2.org/games/slot/pgsoft.
   Active state = swap c-eTYFsW → c-eTYFsW + c-eTYFsW-grRtKH-active-true,
   and label class c-hlTBXk → c-heFbDP (same active/inactive pattern as tabs). */
.c-ebObwl { display: flex; flex-wrap: wrap; width: 100%; padding: 20px 20px 0px; border-top-left-radius: 12px; border-top-right-radius: 12px; background: var(--colors-inkLightest, var(--colors-inkLightest, #20666F)); }
.c-eJYBbS { display: flex; width: 33.33%; align-items: center; flex-direction: column; margin-bottom: 20px; }
.c-eTYFsW { background: var(--colors-skyLightest, var(--colors-skyLightest, #FFFFFF)); max-width: 64px; width: 100%; height: 100%; max-height: 64px; border-radius: 50%; position: relative; padding: 8px; margin-bottom: 8px; }
.c-eTYFsW-grRtKH-active-true { border: 3px solid var(--colors-secondaryDefault, var(--colors-secondaryDefault, #009D7C)); }
.c-cIdiJW { text-decoration: none; }

/* Sidebar filter tabs (Semua + Top) for /games — anchor link wrapper helper.
   The visual rules below come from live stitches runtime; active/inactive
   distinction is via swapping .c-heFbDP (green) vs .c-hlTBXk (white) on
   the label span, NOT via this wrapper class. */
.ref-filter-tab { text-decoration: none; display: block; }

/* ============================================================
   Sidebar filter tabs — extracted VERBATIM from live KATAKJP
   stitches runtime (document.styleSheets[2]) on 2026-05-21.
   Source: https://katakjpads2.org/games/slot/pgsoft computed cssRules.
   ============================================================ */
.c-kJKJMj { background: var(--colors-inkLighter, var(--colors-inkLighter, #1B575F)); border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; padding-left: 20px; padding-right: 20px; }
.c-gloSmZ { padding-top: 20px; padding-bottom: 20px; display: flex; align-items: center; cursor: pointer; position: relative; }
.c-lnXPmx { max-width: 24px; max-height: 24px; min-height: 24px; min-width: 24px; }
.c-lnXPmx svg { max-width: 24px; max-height: 24px; min-height: 24px; min-width: 24px; }
.c-ifjbUZ { margin-left: 12px; }
.c-heFbDP { color: var(--colors-secondaryDefault, rgb(0, 157, 124)); text-transform: capitalize; }
.c-gloSmZ-bSNSsp-divider-true::before { content: ""; height: 1px; background: rgb(217, 233, 242); width: 100%; position: absolute; top: 0px; opacity: 0.2; }

/* ============================================================
   Desktop category strip (c-jRSoJY) + cards — extracted VERBATIM
   from live KATAKJP stitches runtime on 2026-05-21 at
   https://katakjpads2.org/games/slot/pgsoft.
   ============================================================ */
.c-fGHEql { width: 100%; }
.c-jRSoJY { display: none; }
@media (min-width: 992px) { .c-jRSoJY { display: inherit; } }
.c-hmxryr { background: var(--colors-inkLight, var(--colors-inkLight, #16454B)); }
.c-cLMKLl { display: flex; flex: 1 1 0%; align-items: center; padding-top: 16px; padding-bottom: 16px; overflow: auto; }
.c-iYKciF { margin-left: 12px; }
.c-iYefnR { display: flex; width: 100%; height: 100%; align-items: center; padding: 8px; position: relative; }
.c-lcjRkL { z-index: 1; object-fit: contain; width: 24px; height: 24px; }
.c-imxXhq { width: 100%; cursor: pointer; }
.c-izpPVv { display: flex; width: 100%; height: 100%; align-items: center; padding: 8px; position: relative; flex-direction: row; }
.c-bVqTIw { display: flex; width: 36px; height: 36px; position: relative; margin-right: 8px; }
.c-jlrkmt { color: var(--colors-inkDefault, rgb(17, 54, 60)); text-transform: capitalize; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.c-fGHEql-fvfCsT-variant-onlyLeft { margin: 0px auto; padding-left: var(--space-sm, 12px); }
@media (min-width: 576px) { .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-md, 24px); } }
@media (min-width: 768px) { .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-md, 24px); } }
@media (min-width: 992px) { .c-fGHEql-fvfCsT-variant-onlyLeft { padding-left: var(--space-xl, 48px); } }
@media (min-width: 1280px) { .c-fGHEql-fvfCsT-variant-onlyLeft { max-width: 1580px; } }
.c-fGHEql-jvtgLD-variant-default { width: 100%; margin: 0px auto; padding-left: 8px; padding-right: 8px; }
@media (min-width: 414px) { .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-sm, 12px); padding-right: var(--space-sm, 12px); } }
@media (min-width: 576px) { .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-md, 24px); padding-right: var(--space-md, 24px); } }
@media (min-width: 768px) { .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-md, 24px); padding-right: var(--space-md, 24px); } }
@media (min-width: 992px) { .c-fGHEql-jvtgLD-variant-default { padding-left: var(--space-xl, 48px); padding-right: var(--space-xl, 48px); } }
@media (min-width: 1280px) { .c-fGHEql-jvtgLD-variant-default { max-width: 1580px; padding-left: var(--space-xl, 48px); padding-right: var(--space-xl, 48px); } }
.c-imxXhq-hIjDUz-active-true { border-width: 2px; border-style: solid; border-color: var(--colors-secondaryLightest, var(--colors-secondaryLightest, #E2DADB)); border-radius: 4px; }

/* ============================================================
   Tablet/Mobile provider carousel + tabs (c-gQBKVi etc.) —
   extracted VERBATIM from live tablet stitches runtime 2026-05-21.
   Block is wrapped with .ref-tablet-only — hidden at desktop ≥992
   since desktop renders the same content via sidebar (c-dpwgnB).
   ============================================================ */
.c-gQBKVi { display: flex; overflow-x: scroll; width: 100%; position: relative; }
.c-bVDGww { display: flex; align-items: center; flex-direction: column; background: var(--colors-inkLightest, var(--colors-inkLightest, #20666F)); border-radius: 12px; min-width: 65px; width: 65px; min-height: 96px; padding: 8px; margin-right: 12px; }
.c-bVDGww-hmxryr-active-false { background: var(--colors-inkLight, var(--colors-inkLight, #16454B)); }
.c-dfrprK { background: var(--colors-skyLightest, var(--colors-skyLightest, #FFFFFF)); width: 100%; height: 100%; max-width: 44px; max-height: 44px; border-radius: 50%; position: relative; padding: 8px; margin-bottom: 8px; }
.c-fRKYWh { object-fit: contain; }
.c-jcWDlP { position: absolute; top: -4px; right: 0px; }
.c-jWtoMJ { word-break: break-all; }
.c-eFYwtl { margin-top: 16px; }
.ref-tablet-only { display: block; }
@media (min-width: 992px) { .ref-tablet-only { display: none !important; } }

/* Tablet/mobile pill buttons (Top + Semua) — extracted VERBATIM from live
   stitches runtime 2026-05-21 at /games/slot. Pills are text-only at
   tablet (NO icon), in a flex container with overflow-x:scroll. Active =
   green bg via c-bHZeqw-cZDFwA-active-true. Label color via c-gYAmBH. */
.c-gApJDj { display: flex; flex: 1 1 0%; overflow-x: scroll; }
.c-gApJDj::-webkit-scrollbar { display: none; }
.c-bHZeqw { border-radius: 8px; cursor: pointer; height: -moz-fit-content; height: fit-content; display: flex; align-items: center; padding: 4px 12px; }
@media (min-width: 992px) { .c-bHZeqw { padding: 12px 16px; } }
.c-bHZeqw:hover { background: var(--colors-secondaryLight, #3CD7B6); }
.c-bHZeqw-cZDFwA-active-true { background: var(--colors-secondaryDefault, var(--colors-secondaryDefault, #009D7C)); }
.c-gYAmBH { color: var(--colors-skyLightest, var(--colors-skyLightest, #FFFFFF)); width: max-content; }
.c-eBIusB-idjDtlJ-css { width: max-content; }

/* Hamburger drawer open-state override — live's React app toggles inline
   transform style; we use a class swap from reference-events.js instead.
   When initHamburgerMenu adds .c-jjpMwf-eZdROQ-isOpen-true, this overrides
   the base .c-jjpMwf transform:translateX(-100%) to slide the drawer in. */
.c-jjpMwf.c-jjpMwf-eZdROQ-isOpen-true { transform: translateX(0px); }

/* ============================================================
   /promotions page — extracted VERBATIM from live KATAKJP
   stitches runtime on 2026-05-21 at /promotion.
   ============================================================ */
.c-fZiyxt { margin-top: 24px; margin-bottom: 16px; }
@media (min-width: 992px) { .c-fZiyxt { margin-top: 32px; margin-bottom: 20px; } }
.c-cAMcvS { background: var(--colors-skyDefaultHalf, rgba(255, 255, 255, 0.05)); margin-bottom: 32px; }
.c-cAMcvS-cVmUIS-isGin-false { padding-top: 32px; padding-bottom: 32px; }
.c-jjaClU { background: rgb(217, 233, 242); width: 100%; height: 1px; margin-top: 20px; margin-bottom: 20px; }
@media (min-width: 992px) { .c-jjaClU { margin-top: 16px; margin-bottom: 16px; } }
.c-eGbDAs { margin-top: 16px; margin-bottom: 16px; }
.c-dtCxlD { display: flex; flex-direction: column; gap: 16px; }
/* Tablet/mobile promo list horizontal padding — mirrors the EXACT responsive
   padding pattern of c-fGHEql-jvtgLD-variant-default (the inner section that
   wraps the title block). Cards align with title at every breakpoint:
     base (<414):  8px  (matches c-fGHEql base padding)
     >=414:        12px (var(--space-sm))
     >=576:        24px (var(--space-md))
     >=992:        DESKTOP — no rule applied (user 2026-05-21: 'desktop is okay
                   already, dont modify anything, this is for tablet and mobile')
   Sentinel gets matching margin (not padding — it's a 1px tall element so margin
   keeps the IntersectionObserver trigger position aligned with cards above).
   Without this responsive matching, hardcoded 24px at all <992 over-inset the
   cards at <576 viewports (cards narrower than title — incident 2026-05-21).
   SCOPED to .c-cAMcvS (promotions list container) — same .c-dtCxlD class is
   reused on /deposit + /withdraw for the back-arrow heading wrapper which must
   stay full-width inside its section (no horizontal padding). User-reported
   2026-05-23: alert banner under breadcrumb on /deposit narrower than parent. */
@media (max-width: 991px) {
  .c-cAMcvS .c-dtCxlD { padding-left: 8px; padding-right: 8px; }
  .c-crxOsD[data-promo-sentinel] { margin-left: 8px; margin-right: 8px; }
}
@media (min-width: 414px) and (max-width: 991px) {
  .c-cAMcvS .c-dtCxlD { padding-left: var(--space-sm, 12px); padding-right: var(--space-sm, 12px); }
  .c-crxOsD[data-promo-sentinel] { margin-left: var(--space-sm, 12px); margin-right: var(--space-sm, 12px); }
}
@media (min-width: 576px) and (max-width: 991px) {
  .c-cAMcvS .c-dtCxlD { padding-left: var(--space-md, 24px); padding-right: var(--space-md, 24px); }
  .c-crxOsD[data-promo-sentinel] { margin-left: var(--space-md, 24px); margin-right: var(--space-md, 24px); }
}
/* DESKTOP padding — matches inner c-fGHEql-jvtgLD-variant-default 48px at >=992.
   Without this, c-dtCxlD spans full c-cAMcvS width (1344 at vw=1440) while title
   block (inside inner section) is at 1248 wide. Cards/image/c-dkpoxx are then
   WIDER than title, creating visual mismatch — user-reported 2026-05-21 with
   red-line marked screenshot showing c-dkpoxx extending past image bounds.
   At 48px inset, c-dtCxlD content area = 1344-96 = 1248, matching title. */
@media (min-width: 992px) {
  .c-cAMcvS .c-dtCxlD { padding-left: var(--space-xl, 48px); padding-right: var(--space-xl, 48px); }
  .c-crxOsD[data-promo-sentinel] { margin-left: var(--space-xl, 48px); margin-right: var(--space-xl, 48px); }
}

/* ============================================================
   /promotions filter UI — responsive show/hide + dropdown style
   - Desktop (>=992): show .ref-filter-pills (c-bHZeqw button row), hide .ref-filter-dropdown
   - Tablet/mobile (<=991): show .ref-filter-dropdown (react-select style), hide .ref-filter-pills
   Source: live katakjpads tablet/mobile 2026-05-21 react-select component
   (css-b62m3t-container, css-14iq5fi, css-1m7mkk8, etc.)
   ============================================================ */
/* Use compound selector to win specificity over base .c-hXKxio { display: flex } */
.c-hXKxio.ref-filter-pills { display: none; }
.ref-filter-dropdown { display: block; }
@media (min-width: 992px) {
  .c-hXKxio.ref-filter-pills { display: flex; }
  .ref-filter-dropdown { display: none !important; }
}

/* react-select runtime CSS — extracted VERBATIM from live katakjpads tablet 2026-05-21.
   Closed state: container > control > value/indicators.
   Open state: menu (css-931ibp-menu) > menu-list (css-qr46ko) > options (css-tkbe7n-option) OR no-options (css-9x5mqu). */
.css-b62m3t-container { position: relative; box-sizing: border-box; }
.css-7pg0cj-a11yText { z-index: 9999; border: 0px; clip: rect(1px, 1px, 1px, 1px); height: 1px; width: 1px; position: absolute; overflow: hidden; padding: 0px; white-space: nowrap; }
.css-14iq5fi { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; display: flex; flex: 1 1 0%; padding: 0px; font-size: 14px; border-radius: 4px; font-family: var(--font-be-vietnam-pro); background: var(--colors-skyDarker, rgb(112, 116, 117)); cursor: pointer; }
@media only screen and (min-width: 991px) { .css-14iq5fi { font-size: 14px; } }
.css-1m7mkk8 { -webkit-box-align: center; align-items: center; display: grid; flex: 1 1 0%; flex-wrap: wrap; position: relative; overflow: hidden; padding: 9px 14px; box-sizing: border-box; font-family: var(--font-be-vietnam-pro); }
.css-1295bly-singleValue { grid-area: 1 / 1 / 2 / 3; color: var(--colors-skyLightest, rgb(255, 255, 255)); margin-left: 2px; margin-right: 2px; box-sizing: border-box; padding: 0px; font-family: var(--font-be-vietnam-pro); }
.css-1jlgr0u { visibility: visible; flex: 1 1 auto; display: inline-grid; grid-area: 1 / 1 / 2 / 3; grid-template-columns: 0px min-content; margin: 0px; color: var(--colors-skyLightest, rgb(255, 255, 255)); box-sizing: border-box; padding: 0px; font-family: var(--font-be-vietnam-pro); }
.css-1jlgr0u::after { content: attr(data-value) " "; visibility: hidden; white-space: pre; grid-area: 1 / 2; font: inherit; min-width: 2px; border: 0px; margin: 0px; outline: 0px; padding: 0px; }
.css-1wy0on6 { align-items: center; align-self: stretch; display: flex; flex-shrink: 0; box-sizing: border-box; }
.css-1xc3v61-indicatorContainer { display: flex; transition: color 150ms; color: rgb(204, 204, 204); padding: 8px; box-sizing: border-box; cursor: pointer; }
.css-1xc3v61-indicatorContainer:hover { color: rgb(153, 153, 153); }
.css-157885t-indicatorContainer { display: flex; transition: color 150ms; color: var(--colors-skyLightest, rgb(255, 255, 255)); padding: 8px 16px 8px 8px; box-sizing: border-box; cursor: pointer; font-family: var(--font-be-vietnam-pro); }
.css-157885t-indicatorContainer:hover { color: rgb(51, 51, 51); }
.css-caz6l5-indicatorContainer { display: flex; transition: color 150ms; color: var(--colors-skyLightest, rgb(255, 255, 255)); padding: 8px 16px 8px 8px; box-sizing: border-box; cursor: pointer; font-family: var(--font-be-vietnam-pro); }
.css-caz6l5-indicatorContainer:hover { color: rgb(51, 51, 51); }
.css-0 { background-color: hsl(0, 0%, 80%); align-self: stretch; width: 1px; box-sizing: border-box; }
.css-8mmkcg { display: inline-block; fill: currentColor; line-height: 1; stroke: currentColor; stroke-width: 0; }

/* Open state — menu + options + no-data.
 * z-index bumped 2 -> 1000 to float above .c-eWVHrr game tiles in the
 * grid below (tiles use position:relative which creates their own
 * stacking context; without higher z-index the menu sits behind).
 * Wrapper css-b62m3t-container also given explicit position+z-index
 * so the dropdown's stacking context can escape parent containers. */
.css-b62m3t-container { position: relative; z-index: 1000; }
.css-931ibp-menu { top: 100%; position: absolute; width: 100%; z-index: 1000; border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px 1px, rgba(0, 0, 0, 0.1) 0px 4px 11px; margin-bottom: 8px; margin-top: 8px; box-sizing: border-box; background: var(--colors-skyDarker, rgb(112, 116, 117)); font-family: var(--font-be-vietnam-pro); }
.css-931ibp-menu[hidden] { display: none; }
.css-qr46ko { max-height: 300px; overflow-y: auto; position: relative; padding-bottom: 4px; padding-top: 4px; box-sizing: border-box; }
.css-tkbe7n-option { cursor: pointer; display: block; font-size: inherit; width: 100%; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); color: var(--colors-skyLightest, rgb(255, 255, 255)); padding: 8px 16px; box-sizing: border-box; background: var(--colors-skyDarker, rgb(112, 116, 117)); font-family: var(--font-be-vietnam-pro); }
.css-tkbe7n-option[hidden] { display: none; }
.css-tkbe7n-option:active { background-color: rgb(178, 212, 255); }
.css-tkbe7n-option:hover { background: var(--colors-skyDefault, rgb(138, 142, 143)); }
.css-tkbe7n-option:not(:first-of-type) { border-top: 1px solid rgba(255, 255, 255, 0.1); }
.css-9x5mqu { text-align: center; color: rgb(153, 153, 153); padding: 8px 12px; box-sizing: border-box; }
.css-9x5mqu[hidden] { display: none; }
.c-eBIusB-gBCbql-variant-body1Bold { font-size: var(--fontSizes-size18, 18px); font-weight: var(--fontWeights-bold, 700); line-height: var(--lineHeights-sm, 1.4); }
.c-hXKxio { display: flex; flex: 1 1 0%; align-items: flex-end; justify-content: space-between; }
.c-dWksIc { overflow: auto; }
.c-ckhQIw { margin-left: 20px; }
.c-fixGjY { display: flex; flex-direction: column; }
.c-hinyfY { width: 100%; height: 100%; }
.c-dkpoxx { background: var(--colors-inkDefault, var(--colors-inkDefault, #11363C)); padding: 28px 16px; }
@media (min-width: 992px) { .c-dkpoxx { padding: 28px 20px; } }
.c-bHZeqw-gwGaeD-active-false { background: var(--colors-inkLightest, var(--colors-inkLightest, #20666F)); }

/* Collapsible (react-collapsible library) — non-stitches classes. We replicate
   the open/closed transition via JS-toggled aria-expanded + class. */
.Collapsible__contentOuter { overflow: hidden; transition: height 150ms linear; }
.Collapsible__trigger { display: block; cursor: pointer; }

/* Promo expanded card body structure (live shows: title big white, body bullet list, Tutup pill below).
   Width inherits from .c-fGHEql which is 100% of parent (.c-dtCxlD grid item) — same as banner img above. */
.ref-promo-title { text-align: center; margin-bottom: 16px; }
.ref-promo-body { color: var(--colors-skyLightest, var(--colors-skyLightest, #FFFFFF)); }
.ref-promo-body ul, .ref-promo-body ol { padding-left: 20px; margin: 12px 0; }
.ref-promo-body li { margin-bottom: 6px; line-height: 1.5; }
.ref-promo-body p { margin: 8px 0; line-height: 1.5; }
.ref-promo-close-wrap { display: flex; justify-content: center; margin-top: 20px; }
.ref-promo-close { background: var(--colors-primaryLight, var(--colors-primaryDefault, #D4FD07)); border: none; border-radius: 4px; padding: 9px 28px; cursor: pointer; }
.ref-promo-close span { color: var(--colors-inkDefault, var(--colors-inkDefault, #11363C)) !important; font-weight: 600; }
.ref-promo-close:hover { background: var(--colors-primaryLighter, #E8FF66); }

/* ============================================================
   Breadcrumb (c-mIdCe) — extracted VERBATIM from live KATAKJP
   stitches runtime on 2026-05-21 at /games/casino/pragmaticplay.
   ============================================================ */
.c-mIdCe { display: flex; align-items: center; padding: 8px 0px; flex-wrap: wrap; }
@media (min-width: 992px) { .c-mIdCe { padding: 0px; } }
.c-eGbqkd { margin-left: 16px; margin-right: 16px; }
.c-ihvneE { text-transform: capitalize; }
.c-ihvneE:hover { font-weight: var(--fontWeights-bold, 700); }
.c-dBHBrn { color: var(--colors-secondaryDefault, var(--colors-secondaryDefault, #009D7C)); }

/* ============================================================
   SEO footer wrapper — extracted VERBATIM from live KATAKJP
   stitches runtime on 2026-05-21.
   NOTE: do NOT add `.c-dFfuhX { color: ... }` here. That base rule already
   exists at line 1160 + 1256 of this file. Re-declaring it AFTER the
   `-state-active-false` variant (line 1778) cascades it as the winning
   rule for ALL .c-dFfuhX elements — clobbering the Game nav link's green
   active color. Bug caught 2026-05-21 when /games active state went white.
   ============================================================ */
.c-gSCRyo { padding-top: 8px; background: var(--colors-inkDefault, var(--colors-inkDefault, #11363C)); }

/* ============================================================
   Game tile grid CSS — extracted VERBATIM from live KATAKJP
   stitches runtime (document.styleSheets[2]) on 2026-05-21.
   Source: https://katakjpads2.org/games/slot computed rules.
   These selectors do NOT exist in the static 3d7d0b637e992174.css
   (1.27MB linked stylesheet); they live only in stitches runtime
   which we don't ship. ONE drift = "tile grid broken without
   stitches runtime"; this is the ONE rule fix.
   ============================================================ */
.c-gUbJzU { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (min-width: 768px)  { .c-gUbJzU { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 992px)  { .c-gUbJzU { grid-template-columns: repeat(7, 1fr); } }
@media (min-width: 1280px) { .c-gUbJzU { grid-template-columns: repeat(8, 1fr); } }
.c-eWVHrr { position: relative; width: 100%; margin-bottom: var(--space-space24, 24px); border-radius: 4px; }
.c-eWVHrr:hover .c-krlVLJ { opacity: 1; }
@media (min-width: 992px) { .c-eWVHrr:hover .c-iNIKcL { display: block; } }
.c-kQVMcY { position: relative; border-radius: 6px; padding: 2px; overflow: hidden; cursor: pointer; z-index: 2; }

/* ─── Favorite overlay (c-HWpHG > c-bIxTfR) ─────────────────────────────
   Snapshot-canonical structure from app_legacy_member_reference.
   Live drifted by 2026-05-23 (component removed). CSS values reconstructed
   via reasonable defaults — no extractable stitches source. Positioned
   top-right of tile, padded hit area, CSS filter for filled state (gold). */
.c-HWpHG.ref-fav-overlay {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
  user-select: none;
}
.c-HWpHG.ref-fav-overlay:hover { background: rgba(0, 0, 0, 0.55); transform: scale(1.08); }
.c-HWpHG.ref-fav-overlay:active { transform: scale(0.95); }
.c-HWpHG.ref-fav-overlay .c-bIxTfR {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.c-HWpHG.ref-fav-overlay .c-bIxTfR img {
  display: block;
  width: 20px;
  height: 20px;
  transition: filter 0.18s ease;
}
.c-HWpHG.ref-fav-overlay.is-fav .c-bIxTfR img {
  /* Tint webp to gold/yellow for active state (filled-state asset hash not available). */
  filter: brightness(0) saturate(100%) invert(82%) sepia(56%) saturate(2487%) hue-rotate(2deg) brightness(101%) contrast(101%);
}

/* ─── Drawer menu icon color (drives SVG via currentColor) ──────────────
   Menu icons (beranda/profil/promosi/favorit/bonus/referral/rtp/info/etc)
   use stroke/fill="currentColor" so they inherit color from .c-dVOKBM
   wrapper. Inactive = white, active = teal. Matches the text-color logic
   (.c-fewYWN inactive vs .c-hOwCtY active) so icon + text move together. */
.c-dVOKBM { color: #FFFFFF; }
.c-dVOKBM-iDfZUm-active-true { color: #009D7C; }

.c-mjFTm  { position: relative; overflow: hidden; border-radius: 6px; }
.c-bAZTzz { position: absolute; inset: 6% 0 0; display: flex; transition: 0.3s linear; z-index: 1; height: 12px; }
.c-bAZTzz svg  { width: auto; height: 100%; }
.c-bAZTzz path { transition: 0.3s linear; }
@media (min-width: 576px) { .c-bAZTzz { height: 20px; } }
.c-jRurjG       { display: flex; padding-left: 0.4em; padding-right: 0.4em; transition: 0.3s linear; }
.c-jRurjG span  { line-height: 0; margin-top: auto; margin-bottom: auto; font-size: 8px; }
@media (min-width: 576px) { .c-jRurjG span { font-size: clamp(0.5em, 0.7em, 1em); } }
.c-gtQfJn {
  border: 4px double transparent;
  border-radius: 20px;
  background-image: linear-gradient(white, white), conic-gradient(from -30.07deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 0deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 0.04deg, rgb(173, 207, 2) 18.14deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 90.32deg, rgb(173, 207, 2) 161.47deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 180.96deg, rgb(173, 207, 2) 210.72deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 273.52deg, rgb(173, 207, 2) 337.77deg, var(--colors-primaryLightest, rgb(232, 254, 123)) 360deg);
  background-origin: border-box;
  background-clip: content-box, border-box;
  width: 100%;
  height: 100%;
  object-fit: fill;
}
.c-kojyFS { margin-top: 8px; }

/* ═══════════════════════════════════════════════════════════════════
   /info-center additions (2026-05-21)
   Extracted verbatim from live katakjpads2.org/info-center stitches
   runtime via document.styleSheets cssRules. HARD RULE 5 stitches
   extraction gate. Other classes (c-mIdCe, c-bHZeqw, c-fGHEql, etc)
   already present above (shared with /promotions + dashboard).
   ─────────────────────────────────────────────────────────────────── */

/* Header container (breadcrumb + title + tabs row) */
.c-hPWMmR                                    { margin-top: 16px; margin-bottom: 16px; }
@media (min-width: 992px) { .c-hPWMmR        { margin-top: 32px; margin-bottom: 32px; } }

/* Title + tabs row */
.c-noDte                                     { margin-bottom: 20px; }
@media (min-width: 992px) { .c-noDte         { margin-bottom: 32px; } }

/* Tab pill icon wrapper (c-bHZeqw already in CSS above) */
.c-kDcypY                                    { display: flex; margin-right: 8px; }
.c-kDcypY svg                                { width: 16px; height: 16px; }
@media (min-width: 992px) {
  .c-kDcypY                                  { margin-right: 10px; }
  .c-kDcypY svg                              { width: 24px; height: 24px; }
}

/* Content layout (flex row desktop, column mobile) */
.c-iHusjg                                    { display: flex; }
@media (max-width: 991px) { .c-iHusjg        { flex-direction: column; } }

/* Sub-nav container (inkLight bg, 12px radius) */
.c-ePAOBe                                    { background: var(--colors-inkLight); border-radius: 12px; }

/* Sub-nav items (cursor + padding + first/last special) */
.c-crRwht                                    { cursor: pointer; padding: 16px 32px; }
.c-crRwht:first-child                        { padding-top: 24px; }
.c-crRwht:last-child                         { padding-bottom: 24px; }
.c-crRwht span                               { width: max-content; }

/* Column spacer between sub-nav and content (40px desktop, hidden mobile via column flex) */
.c-ewAvNg                                    { margin-right: 40px; }
@media (max-width: 991px) { .c-ewAvNg        { margin-right: 0; margin-bottom: 16px; } }

/* Accordion list container (inkLight bg, 12/24 padding) */
.c-jreRcL                                    { border-radius: 12px; overflow: hidden; background: var(--colors-inkLight); padding-left: 16px; padding-right: 16px; }
@media (min-width: 992px) { .c-jreRcL        { padding-left: 24px; padding-right: 24px; } }

/* Accordion item wrapper (responsive padding + border between, first/last 32px) */
.c-dLxUYO                                    { background: var(--colors-inkLight); padding-top: 24px; padding-bottom: 24px; }
.c-dLxUYO:first-child                        { padding-top: 32px; }
.c-dLxUYO:last-child                         { padding-bottom: 32px; }
.c-dLxUYO:not(:last-child)                   { border-bottom: 1px solid var(--colors-skyLightest); }
@media (min-width: 992px) {
  .c-dLxUYO                                  { padding-top: 40px; padding-bottom: 40px; }
}

/* Accordion header (flex space-between, cursor pointer) */
.c-cOupQz                                    { display: flex; flex: 1 1 0%; justify-content: space-between; cursor: pointer; }

/* Sub-nav text variant (body1Medium) — used in c-eBIusB-cxCcUo-variant-body1Medium */
.c-eBIusB-cxCcUo-variant-body1Medium         { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-medium); line-height: var(--lineHeights-sm); }

/* Text width utility (used by tab labels + sub-nav spans) */
.c-eBIusB-idjDtlJ-css                        { width: max-content; }

/* ═══════════════════════════════════════════════════════════════════
   /info-center fix round 2 (2026-05-21) — user-reported issues:
   1. Active pill mepet ke pill lain (no horizontal gap)
   2. Horizontal scrollbar arrows ◄ ► visible at bottom (also /promotions)
   3. Tablet/mobile subnav vertical list → harus dropdown react-select style
   ─────────────────────────────────────────────────────────────────── */

/* Issue 1 — Pill container gap (works for both direct-children pills
   like live KATAKJP and anchor-wrapped pills like our SSR port.
   Live's .c-ckhQIw{margin-left:20px} only applies to INACTIVE pills →
   when active is middle, mepet. Using flex `gap` fixes regardless. */
.c-gApJDj                                    { gap: 20px; }
@media (max-width: 991px) { .c-gApJDj        { gap: 12px; } }

/* Issue 2 — Hide scroll arrows when no overflow. Live forces overflow-x:scroll
   which shows scrollbar even when content fits. Cross-browser scrollbar hide. */
.c-gApJDj                                    { scrollbar-width: none; -ms-overflow-style: none; }
.c-gApJDj::-webkit-scrollbar                 { display: none; height: 0; width: 0; }
.c-dWksIc                                    { scrollbar-width: none; -ms-overflow-style: none; }
.c-dWksIc::-webkit-scrollbar                 { display: none; height: 0; width: 0; }

/* Issue 3 — Subnav sidebar/dropdown responsive switching */
.ref-subnav-sidebar                          { display: block; }
.ref-subnav-dropdown                         { display: none; }
.ref-subnav-spacer                           { display: block; }
@media (max-width: 991px) {
  .ref-subnav-sidebar                        { display: none; }
  .ref-subnav-dropdown                       { display: block; margin-bottom: 16px; }
  .ref-subnav-spacer                         { display: none; }
}

/* c-ckhQIw margin-left ADDS to container gap (was 20px live, now flex `gap` handles
   spacing properly). Override inside .c-gApJDj so gap is the only spacing source.
   Also benefits /promotions (single pill, no visual change). */
.c-gApJDj .c-ckhQIw                          { margin-left: 0; }

/* ═══════════════════════════════════════════════════════════════════
   /contact-us additions (2026-05-21) — page is simple: header + button row.
   Extracted verbatim from live katakjpads2.org/contact-us stitches runtime.
   HARD RULE 5 stitches extraction gate.
   ─────────────────────────────────────────────────────────────────── */

/* Content area wrapper (mobile margin only) */
@media (max-width: 991px) { .c-cQxOAG          { margin-bottom: 20px; } }

/* Button row container — flex-wrap row desktop, column mobile */
.c-dTDLod                                      { display: flex; flex: 1 1 0%; flex-wrap: wrap; }
@media (max-width: 991px) { .c-dTDLod          { flex-direction: column; } }

/* Contact button (c-loEIbt) — 18% width desktop (max ~5 per row), 100% mobile */
.c-loEIbt                                      { display: flex; cursor: pointer; flex-direction: column; padding: 27px 4px; border-radius: 12px; background: var(--colors-inkLighter); align-items: center; transition: 150ms; width: 18%; }
.c-loEIbt:hover                                { background: var(--colors-inkLight); }
@media (min-width: 992px) { .c-loEIbt          { margin-bottom: 32px; margin-right: 16px; } }
@media (max-width: 991px) { .c-loEIbt          { width: 100%; flex-direction: row; padding: 12px 24px; margin-bottom: 12px; } }

/* Icon wrapper — circle border, 64x64 desktop, 48x48 mobile */
.c-jCabtP                                      { width: 64px; height: 64px; padding: 16px; border: 3px solid var(--colors-skyLightest); border-radius: 50%; box-sizing: border-box; }
.c-jCabtP svg                                  { width: 100%; height: 100%; }
@media (max-width: 991px) { .c-jCabtP          { width: 48px; height: 48px; padding: 10px; } }

/* Spacer between icon and text (desktop only — collapsed mobile) */
.c-bKeqbn                                      { margin-top: 32px; }
@media (max-width: 991px) { .c-PJLV-iYrBIK-media-onlyDesktop { margin: 0; padding: 0; } }

/* Text wrapper — column center desktop, row mobile w/ margin-left */
.c-ganect                                      { display: flex; flex-direction: column; align-items: center; }
@media (max-width: 991px) { .c-ganect          { align-items: flex-start; margin-left: 16px; } }

/* Text color (used by other routes too — already may exist above; safe override) */
.c-hlTBXk                                      { color: var(--colors-skyLightest); text-transform: capitalize; }

/* /contact-us fix 2026-05-21 — multi-word button labels (WhatsApp KATAKJP etc)
   wrap to 2 lines but text inside span defaults to text-align:left → looks shifted
   under the icon on DESKTOP only. Tablet/mobile already OK per user (icon-left
   text-right row layout, natural left-align). Scope fix to ≥992px only. */
@media (min-width: 992px) {
  .c-loEIbt .c-ganect span                   { text-align: center; word-break: break-word; }
}

/* ═══════════════════════════════════════════════════════════════════
   /register additions (2026-05-22) — extracted verbatim from live KATAKJP
   /register snapshot stitches inline styles. 2-column form layout.
   ─────────────────────────────────────────────────────────────────── */

/* 2-column form container (flex row desktop, column mobile) */
.c-hEStbp                                    { display: flex; justify-content: center; gap: 28px; }
@media (max-width: 991px) { .c-hEStbp        { flex-direction: column; gap: 16px; } }

/* Each form column (48% desktop, 100% mobile) */
.c-bjTSiL                                    { width: 100%; }
@media (min-width: 992px) { .c-bjTSiL        { width: 48%; } }

/* Section header ("Informasi Pengguna" / "Informasi Rekening") — centered */
.c-hqvLSH                                    { padding: 8px; padding-bottom: 16px; display: flex; justify-content: center; margin-bottom: 16px; }
@media (min-width: 992px) { .c-hqvLSH        { margin-bottom: 28px; } }

/* Status indicator below input (validation result: checking/ok/taken) */
.ref-reg-status                              { min-height: 18px; margin-top: 4px; padding-left: 4px; font-size: 12px; line-height: 1.3; }
.ref-reg-status.is-checking                  { color: #a3a3a3; }
.ref-reg-status.is-ok                        { color: #22c55e; }
.ref-reg-status.is-taken                     { color: #ef4444; }
.ref-reg-status .status-icon                 { display: inline-block; vertical-align: middle; margin-right: 4px; }

/* Select dropdown — match input field appearance */
.ref-reg-select                              { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20'><path d='M4.5 7.5l5.5 5.5 5.5-5.5' stroke='%23ffffff' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 32px; cursor: pointer; }
.ref-reg-select option                       { background: var(--colors-inkLight); color: #fff; }

/* ═══════════════════════════════════════════════════════════════════
   /rtp additions (2026-05-22) — game grid + RTP % badge.
   Provider pill strip reuses c-bHZeqw + c-gApJDj from info-center.
   ─────────────────────────────────────────────────────────────────── */

/* Responsive games grid — match reference: 3 col mobile, 4 col tablet+, 6 col wide */
.ref-rtp-grid                                { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 16px 0; }
@media (min-width: 576px) { .ref-rtp-grid    { grid-template-columns: repeat(4, 1fr); gap: 12px; } }
@media (min-width: 768px) { .ref-rtp-grid    { grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 24px 0; } }
@media (min-width: 1200px){ .ref-rtp-grid    { grid-template-columns: repeat(6, 1fr); } }

/* Game tile — image + name + RTP badge stacked */
.ref-rtp-tile                                { background: var(--colors-inkLight); border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }
.ref-rtp-tile-img                            { position: relative; width: 100%; aspect-ratio: 1; background: var(--colors-inkLighter); }
.ref-rtp-tile-img img                        { width: 100%; height: 100%; object-fit: cover; display: block; }
.ref-rtp-tile-name                           { padding: 8px 8px 4px; text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

/* RTP badge — colored progress-bar style (fill from 0 to --rtp-fill %, then darker shade)
   Color class drives --badge-color base; --rtp-fill set by JS. */
.ref-rtp-badge                               { margin: 4px 8px 8px; padding: 4px 8px; border-radius: 4px; font-size: 11px; font-weight: 700; text-align: center; color: #fff; --badge-color: #888; --rtp-fill: 50%; background: linear-gradient(to right, var(--badge-color) 0%, var(--badge-color) var(--rtp-fill), rgba(0,0,0,0.35) var(--rtp-fill), rgba(0,0,0,0.35) 100%); }
.ref-rtp-badge.is-green                      { --badge-color: #22c55e; }
.ref-rtp-badge.is-yellow                     { --badge-color: #eab308; }
.ref-rtp-badge.is-red                        { --badge-color: #ef4444; }
.ref-rtp-badge-text                          { display: inline-block; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }

/* Sentinel — invisible 1px high element for IntersectionObserver */
.ref-rtp-sentinel                            { height: 1px; width: 100%; margin-top: 24px; }

/* /rtp banner additions (2026-05-22) — extracted verbatim from snapshot inline styles.
   Bg image: assets/ba278cccf2e35fce.webp, mascot: assets/769cf677746faac6.webp.
   Animation keyframe k-iFozuG for c-kGijpO blink effect on "RTP HARI INI". */
.c-gJNkxH                                    { margin-bottom: 80px; }
@media (min-width: 768px) { .c-gJNkxH        { margin-bottom: 100px; } }
@media (min-width: 1200px){ .c-gJNkxH        { margin-bottom: 120px; } }
.c-MsWyA                                     { background: url(../assets/ba278cccf2e35fce.webp); background-repeat: no-repeat; background-size: 100%; }
.c-dwKnnF                                    { display: flex; justify-content: center; height: 100%; align-items: center; padding-bottom: 16px; }
@media (min-width: 576px) { .c-dwKnnF        { padding-bottom: 20px; } }
@media (min-width: 768px) { .c-dwKnnF        { padding-bottom: 50px; } }
.c-jxdTCW                                    { display: flex; flex-direction: column; align-items: center; }
.c-jzXnMl                                    { color: #E2DADB; }
.c-juZAuk                                    { font-size: 4vw; font-weight: bold; font-style: italic; font-family: var(--font-be-vietnam-pro); touch-action: none; }
.c-kGijpO                                    { color: var(--colors-skyLightest); animation: k-iFozuG 1s ease-in-out infinite alternate; }
.c-LTETK                                     { font-size: 10vw; font-weight: bold; font-style: italic; font-family: var(--font-be-vietnam-pro); }
.c-kILYf                                     { font-size: 4vw; font-weight: bold; font-style: italic; font-family: var(--font-be-vietnam-pro); }
.c-faiJdN                                    { display: flex; margin-top: 40px; }
.c-fmmKpD                                    { display: flex; align-items: center; justify-content: center; width: 100%; transform: translate(0%, 50%); position: absolute; bottom: 0; }
.c-fbGuHH                                    { position: relative; }
.c-fbGuHH svg                                { width: 100%; height: 100%; }
.c-cwkiSM                                    { position: absolute; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 30px 50px; }
@media (min-width: 768px) { .c-cwkiSM        { padding: 30px 80px; } }
.c-bYzuTg                                    { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.c-PzJOC                                     { margin-bottom: 40px; }
.c-dudkZN                                    { margin-top: 40px; margin-bottom: 48px; text-align: center; }
.c-bsogun                                    { object-fit: contain; max-width: 263px; width: 100%; height: 100%; }
@media (max-width: 575px) { .c-bsogun        { display: none; } }
.c-ddYIVO                                    { min-width: 160px; border-radius: 4px; }
.c-eSZagN                                    { margin-bottom: 4px; }
@media (min-width: 768px) { .c-eSZagN        { margin-bottom: 16px; } }
.c-BQipi                                     { text-align: center; }
.c-fcclLm                                    { margin-right: 24px; }
.c-eBIusB-iqgKgX-variant-title1Bold          { font-size: var(--fontSizes-size48); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xl); }
.c-eBIusB-hahggd-variant-body2Bold           { font-size: var(--fontSizes-size16); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-xs); }
.c-eBIusB-bVTOAn-variant-title3Bold          { font-size: var(--fontSizes-size24); font-weight: var(--fontWeights-bold); line-height: var(--lineHeights-md); }
.c-eBIusB-kxUiEO-align-center                { text-align: center; }
.c-eBIusB-eDHTpb-variant-body1Light          { font-size: var(--fontSizes-size18); font-weight: var(--fontWeights-light); line-height: var(--lineHeights-sm); }
.c-gtpFUc-ArRRI-variant-normal               { padding: 16px 32px; }

@keyframes k-iFozuG { from { opacity: 1; transform: scale(1); } to { opacity: 0.85; transform: scale(1.03); } }

/* /rtp banner MOBILE — match reference compact layout (2026-05-22 revert overcorrection).
   Reference at <576px: NO Masuk/Daftar buttons rendered, compact bubble w/ tiny text.
   Keep banner natural aspect-ratio (48.97%), subtitle overhangs banner bottom edge. */
/* /rtp tablet (576-991): section title title3Bold (~24px), subtitle medium,
   Masuk/Daftar CTAs ALSO hidden (reference doesn't show them at tablet either).
   Reference responsive variants would activate properly with stitches @media but
   our CSS lacks the @media wrappers — override per breakpoint manually. */
@media (max-width: 991px) {
  /* Hide Masuk/Daftar CTAs at tablet+mobile — reference shows them only at desktop ≥992 */
  .c-faiJdN { display: none; }
  /* Section title — reference uses title3Bold (~24px) at <992, title1Bold (48px) ≥992 */
  .c-dudkZN .c-eBIusB { font-size: 24px !important; line-height: 1.3 !important; }
  .c-dudkZN { margin-top: 32px; margin-bottom: 32px; }
  /* Subtitle bubble text — reference uses body2Bold (16px) at tablet, smaller at mobile */
  .c-bYzuTg .c-eBIusB { font-size: 14px !important; font-weight: 700; line-height: 1.3 !important; }
  .c-bYzuTg .c-eBIusB.c-BQipi { font-size: 11px !important; font-weight: 400; }
}

@media (max-width: 575px) {
  /* Compact subtitle bubble padding + smallest text at mobile (caption2Bold variant). */
  .c-cwkiSM { padding: 8px 16px; }
  .c-bYzuTg .c-eBIusB { font-size: 10px !important; line-height: 1.25 !important; }
  .c-bYzuTg .c-eBIusB.c-BQipi { font-size: 8px !important; }
  .c-eSZagN { margin-bottom: 2px; }
  /* Section title smaller still at mobile */
  .c-dudkZN .c-eBIusB { font-size: 20px !important; }
  .c-dudkZN { margin-top: 24px; margin-bottom: 24px; }
}

/* ───────────────────────────────────────────────────────────────────────
 * LOGGED-IN TOPBAR — Saldo container + Tarik/Deposit row + K avatar
 * Extracted verbatim from katakjpads2.org stitches runtime
 * (document.styleSheets scan 2026-05-22). All rules below have NO
 * matching rule in our prior CSS — every class was 0x0 or display:block
 * fallback, causing the topbar right area to render as inline stacked
 * text + vertically-stacked buttons + invisible avatar.
 * ─────────────────────────────────────────────────────────────────────── */
.c-cRhPRs {
  width: 44px;
  height: 44px;
  border-radius: 22px;
  position: relative;
  overflow: hidden;
  margin-right: 6px;
  background: var(--colors-secondaryLight);
  display: flex;
  justify-content: center;
  align-items: center;
}
.c-ggfdvY {
  display: flex;
  flex-direction: row;
  cursor: pointer;
  color: white;
  align-items: center;
}
.c-ggfdvY > svg { margin-right: var(--space-xs); }
.c-jNRCgj { min-width: 140px; }
.c-dxdjtL { display: flex; align-items: center; }
.c-frAldy { display: flex; align-items: center; }
.c-frAldy * { border-radius: 4px; }
.c-kCjzGf { margin-top: 4px; display: flex; align-items: center; }
.c-iflkHV { margin-top: 12px; }
.c-gquuCI { color: var(--colors-inkDefault, rgb(17, 54, 60)); }
.c-kEsCAY { margin-left: 6px; margin-right: 6px; }
.c-ciVisu { display: none; }
@media (max-width: 991px) {
  .c-jNRCgj { flex: 1 1 0%; display: flex; align-items: center; }
  .c-dxdjtL { margin-left: 8px; }
  .c-ciVisu { display: inherit; }
}

/* Saldo label font variant + color helper — fixes 4px height overage
 * (label was rendering at default 16px instead of caption1Light 12px).
 * Extracted verbatim from katakjpads2.org stitches runtime 2026-05-22. */
.c-eBIusB-bMbepo-variant-caption1Light {
  font-size: var(--fontSizes-size12);
  font-weight: var(--fontWeights-light);
  line-height: var(--lineHeights-xxxs);
}
.c-gGaKXp { color: var(--colors-inkDark, rgb(12, 38, 42)); }

/* Saldo container wrapper — provides the bordered/padded BOX appearance
 * around the "Saldo / Rp 0 ↻" content. Caught only via Chrome MCP zoom
 * side-by-side compare (NOT JS measurements). 2026-05-22 */
.c-gdRiwH { background: var(--colors-secondaryLightest); }
@media (min-width: 992px) {
  .c-gdRiwH { padding: 4px 12px; border-radius: 4px; }
}
@media (max-width: 991px) {
  .c-gdRiwH { padding: 8px 16px; }
}

/* Topbar right-side row sibling spacing — 20px gap between Bell, Saldo box,
 * button row, and avatar wrapper. Caught when user pointed out visual gap
 * (buttons "rapat" / no breathing room). Extracted verbatim from
 * katakjpads2.org stitches data-css runtime 2026-05-22. */
.c-dhzjXW-ijkskuT-css > *:not(:first-child) { margin-left: 20px; }

/* Button extrasmall variant — used for mobile Tarik Saldo / Deposit buttons
 * (.c-gtpFUc-dVVGEb-variant-extrasmall). Without this rule the buttons render
 * with browser-default tiny padding (1px 6px) instead of 6px 16px. Caught
 * 2026-05-22 when user reported mobile button margin/padding mismatch. */
.c-gtpFUc-dVVGEb-variant-extrasmall { padding: 6px 16px; }

/* Drawer button icon flex wrapper — Tarik Saldo / Deposit buttons each have
 * an icon container .c-cYfCKk before the text span. Without this rule
 * container renders display:block (height = text line-height ~20px),
 * making button +4px taller than ref (28→32). Also missing 8px right margin
 * between icon and label. Extracted from katakjpads2.org stitches runtime
 * 2026-05-22. */
.c-cYfCKk { margin-right: 8px; display: flex; align-items: center; }

/* Drawer Keluar (logout) button — currently renders padding 0 (no rule),
 * REF has padding 16px making it visually align with nav items above.
 * Extracted from katakjpads2.org stitches runtime 2026-05-22. */
.c-cCfiqL { display: flex; align-items: center; padding: 16px; cursor: pointer; }

/* K avatar dropdown panel — click avatar reveals Profil + Keluar menu.
 * Extracted verbatim from katakjpads2.org stitches runtime 2026-05-22. */
.c-cYRojO {
  z-index: 999;
  box-shadow: rgba(14, 18, 22, 0.15) 0px 5px 15px -5px;
  border-radius: 6px;
  overflow: hidden;
  min-width: 130px;
  padding: 5px;
  margin-top: 4px;
  background: var(--colors-skyLightest);
}
/* Menu item hover state (mirrors button-like behaviour). Not extracted from
 * ref stitches (ref uses React onClick); these are local helper rules so
 * keyboard nav + hover give visual feedback. */
#ref-avatar-menu a:hover,
#ref-avatar-menu a:focus { background: var(--colors-secondaryLightest); outline: none; }

/* ============================================================
 * Profile page stitches CSS — extracted verbatim from
 * https://katakjpads2.org/profile (document.styleSheets runtime)
 * captured 2026-05-22 for /profile literal port.
 * Per HARD RULE 5 (Stitches Runtime Extraction Gate) in CLAUDE.md.
 * ============================================================ */

.c-hOGJBR { display: flex; align-items: center; cursor: pointer; padding: 20px 32px; }
/* Live uses :first-child / :last-child on c-hOGJBR (DIV-only nav).
 * Our SSR port wraps each c-hOGJBR with <a href> so each c-hOGJBR is the
 * sole child of its <a>; native pseudo-classes match wrong. Use ancestor
 * `a:first-child / a:last-child` selectors instead. */
.c-ePAOBe > a:first-child .c-hOGJBR { padding-top: 24px; }
.c-ePAOBe > a:last-child .c-hOGJBR { padding-bottom: 24px; }
.c-hOGJBR span { width: max-content; }
.c-ifiMEn { margin-right: 12px; }
.c-kbqVau { display: flex; flex: 1 1 0%; flex-direction: column; justify-content: space-between; }
.c-fMVcKX { background: var(--colors-inkLight); border-radius: 12px; padding: 24px; }
.c-kBcrAL { display: flex; align-items: center; margin-bottom: 24px; }
.c-jhOIXO { display: flex; justify-content: center; align-items: center; background: var(--colors-secondaryLightest); height: 72px; width: 72px; border-radius: 50%; }
@media (max-width: 991px) { .c-jhOIXO { height: 56px; width: 56px; } }
.c-kGBaZW { background: var(--colors-skyDarker, rgb(112, 116, 117)); border-radius: 4px; }
.c-kGFjsj { color: var(--colors-skyLight, rgb(190, 192, 193)); }
.c-iqKdIq { align-items: center; display: flex; flex: 1 1 0%; justify-content: center; }
.c-fNjegx { display: flex; align-items: center; background: var(--colors-inkLight); border-radius: 12px; padding: 24px; }
@media (max-width: 991px) { .c-fNjegx { flex-direction: column; text-align: center; } }
@media (min-width: 992px) { .c-fNjegx { flex-direction: row; } }
.c-jywSVR { display: flex; }
@media (min-width: 992px) { .c-jywSVR { margin-right: 16px; } }
@media (max-width: 991px) { .c-jywSVR { width: 100%; justify-content: center; margin-bottom: 24px; } }
.c-ZrbtO { display: flex; flex: 1 1 0%; flex-direction: column; }
@media (min-width: 992px) { .c-ZrbtO { margin-right: 16px; } }
@media (max-width: 991px) { .c-ZrbtO span { text-align: center; } }
@media (max-width: 991px) { .c-ZrbtO { margin-bottom: 20px; } }

/* Profile mobile-dropdown wrapper — hide at desktop ≥992px.
 * Extracted from live katakjpads2.org/profile stitches runtime 2026-05-22.
 * snapshot uses `c-PJLV-hzUrXJ-media-onlyMobile` variant; default static CSS
 * had only `c-PJLV-cwdgLk-media-onlyMobile` so the hzUrXJ wrapper stayed visible. */
@media (min-width: 992px) { .c-PJLV-hzUrXJ-media-onlyMobile { display: none; } }
/* ============================================================
 * Profile sub-tabs (Banks/Histories/Balance Histories/My-bets/
 * Notifications) stitches CSS — extracted verbatim from
 * https://katakjpads2.org/profile (Rekening Transaksi state)
 * (document.styleSheets runtime) captured 2026-05-22.
 * Per HARD RULE 5 (Stitches Runtime Extraction Gate) in CLAUDE.md.
 * ============================================================ */

/* Outer container for sub-tab content panel */
.c-cKkrLx { width: 100%; }
@media (min-width: 992px) { .c-cKkrLx { background: var(--colors-inkLight); border-radius: 12px; padding: 24px; } }

/* Header row wrapper (responsive: hidden on mobile, visible on desktop) */
.c-jRSoJY { display: none; }
@media (min-width: 992px) { .c-jRSoJY { display: inherit; } }

/* Header row flex container — title left + button right */
.c-ciKXky { display: flex; justify-content: space-between; align-items: center; }

/* Filter button (text-only style with underline hover) */
.c-kEGpHA {
  text-decoration: none;
  position: relative;
  cursor: pointer;
  border: none;
  padding: 0;
  background: transparent;
  display: flex;
  align-items: center;
}
.c-kEGpHA::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--colors-secondaryDefault);
  transition: transform 300ms;
  transform: scale(0);
  transform-origin: center center;
}
.c-lptOrU:hover { color: var(--colors-secondaryLight); }

/* Thin separator between header and content */
.c-ihatxd {
  height: 0.5px;
  width: 100%;
  margin-top: 24px;
  margin-bottom: 24px;
  background: rgb(217, 233, 242);
}
@media (max-width: 991px) { .c-ihatxd { margin-top: 20px; margin-bottom: 20px; } }

/* Spacer above pagination */
.c-fcaOLc { margin-top: 24px; }

/* Payment method card (alternating bg by row) */
.c-dKwpSD { display: flex; align-items: center; padding: 12px 16px; border-radius: 12px; }
.c-dKwpSD:nth-child(2n) { background: var(--colors-inkLighter); }
.c-dKwpSD:nth-child(2n+1) { background: var(--colors-inkLightest); }
@media (min-width: 992px) { .c-dKwpSD { margin-top: 24px; } }
@media (max-width: 991px) { .c-dKwpSD { margin-top: 12px; } }

/* Payment method icon container (left of card) */
.c-eSJiyd {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: var(--colors-skyLightest);
  border-radius: 8px;
}
@media (min-width: 992px) { .c-eSJiyd { margin-right: 32px; } }
@media (max-width: 991px) { .c-eSJiyd { margin-right: 12px; } }
.c-eSJiyd svg { width: 22px; height: 22px; }

/* Pagination list */
.c-jBDfmG { padding: 0; }
.c-jBDfmG > li { display: inline-block; padding-left: 0; list-style: none; cursor: pointer; }
.c-jBDfmG > li > a {
  position: relative;
  float: left;
  border-radius: 4px;
  outline: none;
  margin: 0 20px;
  color: white;
  user-select: none;
}
@media (max-width: 991px) { .c-jBDfmG > li > a { margin: 0 16px; } }
.c-jBDfmG > li.active > a > span { color: var(--colors-secondaryDefault); }

/* Disabled pagination item */
.c-bMGqoF { opacity: 0.5; cursor: not-allowed; }

/* Pagination wrapper */
.c-kYvxmt { display: flex; margin-top: 20px; align-items: center; flex: 1 1 0%; }
.c-gMlCTz { display: flex; flex: 2 1 0%; justify-content: center; }

/* Title3 medium variant (used for "Rekening Transaksi", "Riwayat Transaksi" etc) */
.c-eBIusB-jiqNAg-variant-title3Medium {
  font-size: var(--fontSizes-size24);
  font-weight: var(--fontWeights-medium);
  line-height: var(--lineHeights-md);
}

/* dhzjXW custom layout for c-lcPmgm inner (payment method label stack) */
.c-dhzjXW-iirxunb-css { display: flex; flex-direction: column; }

/* ============================================================
 * /referrals page stitches CSS — extracted verbatim from
 * https://katakjpads2.org/referral (document.styleSheets runtime)
 * captured 2026-05-22.
 * Per HARD RULE 5 (Stitches Runtime Extraction Gate) in CLAUDE.md.
 * ============================================================ */

/* Breadcrumb wrapper on /referral (replaces c-hPWMmR on profile pages) */
@media (min-width: 992px) { .c-cWORga { margin-top: 32px; margin-bottom: 20px; } }
@media (max-width: 991px) { .c-cWORga { margin-top: 24px; } }

/* Page content wrapper (heading + 2-col content) */
.c-bLiloM { display: flex; flex: 1 1 0%; flex-direction: column; margin-bottom: 32px; }

/* Heading wrapper */
.c-bqFgtz { margin-bottom: 32px; }
@media (max-width: 991px) { .c-bqFgtz { margin-bottom: 16px; } }

/* 2-col layout */
.c-gKUdqi { display: flex; flex: 1 1 0%; justify-content: space-between; }
@media (max-width: 991px) { .c-gKUdqi { flex-direction: column; } }

/* Column wrapper */
.c-gNhdhZ { width: 49%; }
@media (max-width: 991px) { .c-gNhdhZ { width: 100%; } }

/* Left card outer wrapper */
.c-gYuhzM { background: var(--colors-inkLight); padding: 24px 24px 32px; width: 100%; border-radius: 12px; }

/* Referral Saya content row (text + spacer + svg) */
.c-iviQyT { display: flex; flex: 1 1 0%; align-items: center; }
@media (max-width: 991px) { .c-iviQyT { flex-direction: row-reverse; } }

/* Text column in Referral Saya */
.c-bdQWS { display: flex; flex-direction: column; flex-shrink: 1; flex-basis: 100%; }

/* Small spacers used in Referral Saya */
.c-kojyFS { margin-top: 8px; }
.c-iBnCZM { margin-top: 20px; }
.c-eFXUjn { margin-right: 16px; }
.c-fraYPp { margin-top: 30px; }

/* Tautan Referral input wrapper */
.c-bdrint { width: 280px; }
@media (max-width: 575px) { .c-bdrint { width: 100%; } }
@media (max-width: 575px) { .c-bviPGn { width: 100%; } }

/* Salin/Ubah buttons row */
.c-dFjjck { display: flex; flex: 1 1 0%; align-items: flex-start; flex-wrap: wrap; }

/* Button column */
.c-bWWaqL { display: flex; flex-direction: column; }
.c-bWWaqL button { height: 35px; }

/* Vertical spacer 1px x 28px between buttons */
.c-jsgfPP { width: 1px; height: 28px; }

/* Horizontal separator above Kategori */
.c-bxeNeE { background: rgb(217, 233, 242); width: 100%; height: 1px; opacity: 0.2; }

/* Right column wrapper (Riwayat Member + Bonus) */
.c-eNnZw { width: 100%; display: flex; flex-direction: column; }

/* Riwayat Member card */
.c-jNLDLz { background: var(--colors-inkLight); padding: 24px; border-radius: 12px; width: 100%; }

/* Header row of Riwayat card (title + "Lihat semua") */
.c-gjNVxK { display: flex; flex: 1 1 0%; justify-content: space-between; align-items: center; }

/* "Lihat semua" link */
.c-eRzzoS {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-decoration: none;
  position: relative;
}
.c-eRzzoS::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--colors-secondaryDefault);
  transition: transform 300ms;
  transform: scale(0);
  transform-origin: center center;
}
.c-eRzzoS:hover::after, .c-eRzzoS:focus::after { transform: scale(1); }
.c-eRzzoS:active::after { background: var(--colors-secondaryDark); }
.c-jcRQsm { color: var(--colors-secondaryDefault); }
.c-jcRQsm:active { color: var(--colors-secondaryDark); }

/* Vertical spacer between Member + Bonus cards */
.c-ifmvVs { margin-top: 12px; margin-bottom: 12px; }

/* Riwayat Bonus card (same style as Member but second instance) */
.c-gNlhqA { background: var(--colors-inkLight); padding: 24px 24px 32px; border-radius: 12px; width: 100%; }

/* Riwayat Bonus header row */
.c-cpiiRI { display: flex; flex: 1 1 0%; justify-content: space-between; align-items: center; margin-bottom: 16px; }

/* Kategori table container */
.c-cqbbdN { padding: 20px; background: var(--colors-inkLighter); border-radius: 20px; }

/* Kategori table header row */
.c-Vxiqf { background: var(--colors-inkDefault); display: flex; align-items: center; padding: 12px 8px; border-radius: 20px; }

/* Kategori table body row */
.c-iJNWDe { display: flex; padding: 12px 8px; }

/* Row separator line */
.c-jaLVRY { width: 100%; height: 1px; background: var(--colors-secondaryDefault); }

/* ============================================================
 * Ganti Password modal stitches CSS — extracted verbatim from
 * https://katakjpads2.org/profile modal (document.styleSheets runtime)
 * captured 2026-05-22.
 * Per HARD RULE 5 (Stitches Runtime Extraction Gate) in CLAUDE.md.
 * ============================================================ */

/* Modal backdrop (fixed full-screen, dark overlay) */
.c-fPtuDW {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  z-index: 2000;
  justify-content: center;
  align-items: center;
}
/* Per HARD RULE 5 in CLAUDE.md (Lessons 2026-05-21): [hidden] attribute
 * is overridden by ANY display rule. Must explicitly re-assert display:none
 * for elements styled with c-fPtuDW that have the hidden attribute. */
.c-fPtuDW[hidden] { display: none; }

/* Modal box */
.c-lcEBRE {
  min-width: 35%;
  max-width: 90%;
  padding: 32px;
  background: var(--colors-inkLight);
  position: relative;
  border-radius: 12px;
  z-index: 9999;
  min-height: 160px;
  max-height: 90vh;
  overflow: scroll;
  width: 90%;
}
@media (min-width: 768px) { .c-lcEBRE { width: 70%; } }
@media (min-width: 992px) { .c-lcEBRE { width: unset; } }

/* Modal header row (title left + close X right + invisible spacer for centering) */
.c-bKfYky { display: flex; flex: 1 1 0%; align-items: center; justify-content: space-between; }

/* Spacer 24x24 (hidden) — to balance the close X icon width so title centers */
.c-iYAduS { width: 24px; height: 24px; visibility: hidden; }

/* Modal body */
.c-knpVsn { margin-top: 32px; }

/* Modal input background variant (darker than form input on /profile) */
.c-hrlkMa { background: var(--colors-inkLightest, rgb(32, 102, 111)); border-radius: 4px; }

/* Eye icon cursor */
.c-iUzUHX { cursor: pointer; height: fit-content; display: flex; }

/* Simpan button container */
.c-jdwXTC { display: flex; flex: 1 1 0%; justify-content: center; margin-top: 32px; }


/* ============================================================
 * Ganti Password modal — loading spinner on submit button.
 * Active when button has [loading] attribute. Hides text label,
 * shows rotating ring spinner via CSS pseudo-element.
 * ============================================================ */
#ref-ganti-password-submit[loading] { position: relative; cursor: wait; }
#ref-ganti-password-submit[loading] > span { visibility: hidden; }
#ref-ganti-password-submit[loading]::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  margin-left: -9px;
  border: 2px solid rgba(12, 38, 42, 0.25);
  border-top-color: var(--colors-inkDefault, var(--colors-inkDark, #0C262A));
  border-radius: 50%;
  animation: ref-spin 0.7s linear infinite;
  box-sizing: border-box;
}
@keyframes ref-spin { to { transform: rotate(360deg); } }

/* Disabled state for password modal inputs during submit (read-only look) */
#ref-ganti-password-form input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ============================================================
 * Profile form panel — typography + field gap fixes
 * Extracted from https://katakjpads2.org/profile live stitches runtime
 * 2026-05-22. Per HARD RULE 5 (Stitches Runtime Extraction Gate).
 * Targets the "Kedrick" display name (title2Medium @ desktop) and
 * the 24px gap between form fields (c-dhzjXW-ibOZRmx-css).
 * ============================================================ */

/* Title2Medium (desktop ≥992px) — used for "Kedrick" display name */
@media (min-width: 992px) {
  .c-eBIusB-cbQucB-variant-title2Medium {
    font-size: var(--fontSizes-size32);
    font-weight: var(--fontWeights-medium);
    line-height: var(--lineHeights-lg);
  }
}

/* Title3Medium responsive variants (mobile uses lmXVal, desktop uses ceAgew).
 * "Kedrick" element has both variants applied; mobile gets 24px, desktop 32px.
 * "Profil" page heading uses ceAgew-variant-title3Medium @ desktop = 24px. */
@media (max-width: 991px) {
  .c-eBIusB-lmXVal-variant-title3Medium {
    font-size: var(--fontSizes-size24);
    font-weight: var(--fontWeights-medium);
    line-height: var(--lineHeights-md);
  }
}
@media (min-width: 992px) {
  .c-eBIusB-ceAgew-variant-title3Medium {
    font-size: var(--fontSizes-size24);
    font-weight: var(--fontWeights-medium);
    line-height: var(--lineHeights-md);
  }
}

/* Body1Medium responsive (mobile gets 18px medium) */
@media (max-width: 991px) {
  .c-eBIusB-gzgeiJ-variant-body1Medium {
    font-size: var(--fontSizes-size18);
    font-weight: var(--fontWeights-medium);
    line-height: var(--lineHeights-sm);
  }
}

/* Form field gap — 24px between every sibling after the first.
 * Applied via c-dhzjXW-ibOZRmx-css on the form's vertical-flex container.
 * Without this, fields stack tight; live shows 24px breathing room. */
.c-dhzjXW-ibOZRmx-css > :not(:first-child) { margin-top: 24px; }

/* Tambah Akun (banks) submit button — same loading spinner pattern */
#ref-banks-add-submit[loading] { position: relative; cursor: wait; }
#ref-banks-add-submit[loading] > span { visibility: hidden; }
#ref-banks-add-submit[loading]::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  margin-left: -9px;
  border: 2px solid rgba(12, 38, 42, 0.25);
  border-top-color: var(--colors-inkDefault, var(--colors-inkDark, #0C262A));
  border-radius: 50%;
  animation: ref-spin 0.7s linear infinite;
  box-sizing: border-box;
}
#ref-banks-add-form input:disabled,
#ref-banks-add-form select:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ============================================================
 * Drift fix for /banks Rekening Transaksi payment card.
 * Live's c-lcPmgm has no gap + no justify-content; OLDER static
 * rules (lines 436/1165/1261) set gap:8px + justify-content:center.
 * Override with later rule + higher specificity to win.
 * dhzjXW-iirxunb-css > :not(:first-child) { margin-top: 4px } —
 * provides the 4px breathing room between paymentTitle and paymentSub.
 * Per HARD RULE 5: verbatim from live document.styleSheets 2026-05-22.
 * ============================================================ */
.c-lcPmgm { display: flex; flex: 1 1 0%; gap: normal; justify-content: flex-start; }
.c-dhzjXW-iirxunb-css > :not(:first-child) { margin-top: 4px; }

/* ============================================================
 * /histories Riwayat Transaksi — row card (Collapsible) classes.
 * Source: live katakjpads2.org/profile?tab=transaction-history, captured
 * via Chrome MCP document.styleSheets 2026-05-22. Per HARD RULE 5
 * (Stitches Extraction Gate) — extracted verbatim where possible.
 *
 * Outer card uses live's `--colors-inkLighter` (nth-child 2n+1) as the
 * resolved color var(--colors-inkLighter, rgb(27,87,95)) — same as /banks payment card bg.
 * Inner detail panel uses `--colors-inkLightest` var(--colors-inkLightest, rgb(32,102,111)).
 *
 * Status variants:
 *   - .c-jFaajK-gNfkZo-status-pending  bg yellowLightest (verbatim)
 *   - .c-jFaajK-bnvWNk-status-success  defensive palette (live had no
 *     rendered success row at capture time — refine when live populates)
 *   - .c-jFaajK-fEUbLO-status-rejected defensive palette (same as above)
 * ============================================================ */
.c-cpZdZr { border-radius: 12px; background: var(--colors-inkLighter, rgb(27, 87, 95)); padding: 12px 16px; }
.c-cpZdZr:not(:last-child) { margin-bottom: 12px; }
@media (max-width: 991px) { .c-cpZdZr { padding: 12px; } }

.Collapsible { display: block; }
.Collapsible__trigger { display: block; cursor: pointer; }
.Collapsible__contentOuter { overflow: hidden; transition: height 0.3s ease; }
.Collapsible__contentInner { padding: 0; }

.c-BrPqv { display: flex; cursor: pointer; align-items: center; }
.c-fNvXDc { display: flex; flex: 1 1 0%; flex-direction: column; }
.c-deZXRM { display: flex; flex: 1 1 0%; align-items: center; }
.c-ekwkue { margin-top: 4px; }

.c-eVZoTY { display: flex; align-items: center; justify-content: center; margin-right: 32px; }
@media (max-width: 991px) { .c-eVZoTY { flex-direction: column; align-items: flex-end; margin-right: 16px; } }

.c-ifiMEn { margin-right: 12px; }
.c-ekCNeI { margin-bottom: 4px; }

.c-jFaajK { padding: 3px 16px; border-radius: 33px; display: inline-flex; align-items: center; }
.c-jFaajK-gNfkZo-status-pending { background: var(--colors-yellowLightest, var(--colors-yellowLightest, rgb(255, 238, 204))); }
.c-jFaajK-gNfkZo-status-pending span { color: var(--colors-yellowDark, var(--colors-yellowDark, rgb(178, 119, 0))); }
/* Live: status=error variant (used for rejected). Verbatim values
 * captured 2026-05-22 after user transitioned their live row to rejected.
 * Class hash GpImA, label "Ditolak" (Indonesian). */
.c-jFaajK-GpImA-status-error { background: var(--colors-redLightest, var(--colors-redLightest, rgb(255, 214, 204))); }
.c-jFaajK-GpImA-status-error span { color: var(--colors-redDark, var(--colors-redDark, rgb(168, 34, 0))); }
/* Success variant: still NOT in live runtime CSS (no row has had
 * approved/success state at any capture point). Defensive palette
 * derived from same lightness as pending/error. Refine when live
 * populates a success-state row. */
.c-jFaajK-bnvWNk-status-success { background: rgb(204, 238, 221); }
.c-jFaajK-bnvWNk-status-success span { color: rgb(0, 119, 60); }

.c-hJPBRt { opacity: 0.2; background: rgb(217, 233, 242); width: 100%; height: 1px; margin-top: 12px; margin-bottom: 12px; }
.c-iCpNMU { padding: 8px 16px; border-radius: 12px; background: var(--colors-inkLightest, rgb(32, 102, 111)); }
.c-eQHxTD { display: flex; width: 100%; flex-wrap: wrap; }
.c-eoYeRZ { width: 50%; }
.c-eoYeRZ:not(:nth-last-child(-n+2)) { margin-bottom: 8px; }
@media (max-width: 991px) { .c-eoYeRZ { width: 100%; } .c-eoYeRZ:not(:last-child) { margin-bottom: 4px; } }
.c-fqcRAQ { display: flex; align-items: center; }
.c-kPueqD { display: inline-block; min-width: 110px; }
.c-newLy { display: inline-block; flex: 1 1 0%; }

/* ============================================================
 * /histories — c-ihatxd divider (between Riwayat Transaksi header
 * and row list). Source: live verbatim 2026-05-22:
 *   height 0.5px, width 100%, bg rgb(217,233,242), margin 24px top/bottom
 *   (mobile: margin 20px)
 * c-jBDfmG: react-paginate <ul> wrapper. Live structure:
 *   <ul class="c-jBDfmG">
 *     <li class="previous c-bMGqoF" (disabled)><a>...</a></li>
 *     <li class="active"><a><span>1</span></a></li>
 *     <li class="next c-bMGqoF" (disabled)><a>...</a></li>
 *   </ul>
 * .c-bMGqoF dims to opacity 0.5 for prev/next when disabled.
 * ============================================================ */
.c-ihatxd { height: 0.5px; width: 100%; margin-top: 24px; margin-bottom: 24px; background: rgb(217, 233, 242); }
@media (max-width: 991px) { .c-ihatxd { margin-top: 20px; margin-bottom: 20px; } }

.c-jBDfmG { padding: 0; list-style: none; text-align: center; display: flex; justify-content: center; align-items: center; }
.c-jBDfmG > li { display: inline-block; padding-left: 0; list-style: none; cursor: pointer; }
.c-jBDfmG > li > a { position: relative; display: inline-flex; align-items: center; border-radius: 4px; outline: none; margin: 0 20px; color: white; text-decoration: none; user-select: none; }
@media (max-width: 991px) { .c-jBDfmG > li > a { margin: 0 16px; } }
.c-jBDfmG > li.active > a > span { color: var(--colors-secondaryDefault, var(--colors-secondaryDefault, #009D7C)); }
.c-bMGqoF { opacity: 0.5; cursor: not-allowed; }

/* /profile sidebar (.c-ePAOBe) — desktop-only. Below 992px live hides the
 * sidebar and replaces it with the react-select dropdown above (rendered
 * inside .c-PJLV-hzUrXJ-media-onlyMobile, which has its own show/hide
 * rules elsewhere). Verified live capture 2026-05-23. */
@media (max-width: 991px) {
  .c-ePAOBe { display: none; }
}

/* ============================================================
 * /histories Filter modal — Chrome MCP capture 2026-05-22.
 * Live class names + computed values verbatim.
 * ============================================================ */
.c-cehMYO { min-width: 40%; max-width: 90%; padding: 16px; background: var(--colors-inkLighter, rgb(27, 87, 95)); position: relative; border-radius: 5px; z-index: 9999; min-height: 160px; max-height: 90vh; overflow: auto; width: 90%; }
@media (min-width: 768px) { .c-cehMYO { width: 70%; } }
@media (min-width: 992px) { .c-cehMYO { width: unset; } }
.c-iuRKbE { margin: 24px; }
@media (max-width: 413px) { .c-iuRKbE { margin: 8px; } }
.c-jJhqOj { margin-bottom: 32px; }
.c-ccDIyR { margin-bottom: 12px; }
.c-boewvb { display: flex; flex: 1 1 0%; flex-wrap: wrap; }
.c-dCNONz { border: 1px dashed rgb(217, 233, 242); }

/* Pill button (single + multi select share same class).
 * Unselected: white text + light-gray border. Selected: teal text + teal
 * border + leading checkmark svg. */
.c-dwpODm { display: flex; align-items: center; text-align: center; cursor: pointer; user-select: none; justify-content: center; border-radius: 30px; padding: 8px 16px; border: 1px solid; background: transparent; }
.c-dwpODm-iyEfER-selected-false { border-color: var(--colors-skyLight, rgb(190, 192, 193)); }
.c-dwpODm-iyEfER-selected-false span { color: var(--colors-skyLightest, rgb(255, 255, 255)); }
.c-dwpODm-dfChGn-selected-true { border-color: var(--colors-secondaryDefault, rgb(0, 157, 124)); }
.c-dwpODm-dfChGn-selected-true span { color: var(--colors-secondaryDefault, rgb(0, 157, 124)); }
.c-dGuCMq { margin-right: 8px; display: flex; justify-content: center; align-items: center; }

/* Date input (react-datepicker pattern). */
.c-bjqBVm { background: var(--colors-inkLightest, rgb(32, 102, 111)); outline: none; border: 0; border-radius: 4px; width: 100%; min-height: 40px; padding: 0 8px; color: var(--colors-skyLightest, rgb(255, 255, 255)); font-family: var(--font-be-vietnam-pro); font-size: 16px; }
.c-bjqBVm::placeholder { color: rgba(255, 255, 255, 0.5); }
.c-iwGZMo { display: flex; flex: 1 1 0%; align-items: center; gap: 12px; }
@media (max-width: 575px) { .c-iwGZMo { flex-direction: column; } }
.c-cugrQW { width: 100%; }

/* Footer button container (Reset + Terapkan). */
.c-extQcP { display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: 24px; }
.c-bkTHFZ { width: 112px; }
@media (max-width: 991px) { .c-bkTHFZ { width: 100px; } }

/* ============================================================
 * /favorites — pill row classes. Verbatim live capture 2026-05-23
 * from snapshot HTML. Pills inline, scrollable horizontally if
 * overflow. Active = secondaryDefault bg, inactive = inkLightest.
 * ============================================================ */
.c-hXKxio { display: flex; flex: 1; align-items: flex-end; justify-content: space-between; }
.c-dWksIc { overflow: auto; }
.c-gApJDj { display: flex; flex: 1; overflow-x: scroll; }
.c-gApJDj::-webkit-scrollbar { display: none; }
.c-bHZeqw { border-radius: 8px; cursor: pointer; height: fit-content; display: flex; align-items: center; padding: 12px 16px; }
@media (max-width: 991px) { .c-bHZeqw { padding: 4px 12px; } }
.c-bHZeqw:hover { background: var(--colors-secondaryLight, var(--colors-inkLighter, #1B575F)); }
.c-bHZeqw-cZDFwA-active-true { background: var(--colors-secondaryDefault, var(--colors-secondaryDefault, #009D7C)); }
.c-bHZeqw-gwGaeD-active-false { background: var(--colors-inkLightest, var(--colors-inkLightest, rgb(32, 102, 111))); }
.c-ckhQIw { margin-left: 20px; }
.c-gYAmBH { color: var(--colors-skyLightest, rgb(217, 233, 242)); width: max-content; }
.c-eBIusB-idjDtlJ-css { width: max-content; }

/* Pill row wrapper — desktop-only show/hide. Live's
 * c-PJLV-iYrBIK-media-onlyDesktop only zeros padding at mobile;
 * doesn't hide. Use explicit wrapper class. */
.ref-favorites-cat-row { display: block; }
@media (max-width: 991px) { .ref-favorites-cat-row { display: none; } }

/* ============================================================
 * /referrals/members + /referrals/bonus subpages — verbatim live
 * stitches capture 2026-05-23 from katakjpads2.org/referral/
 * referral-history-{member,bonus}. Layout: breadcrumb + back-arrow
 * heading + username/count card + Total/Filter bar + table with
 * pill-shaped header row + body cell.
 * ============================================================ */
.c-bRkJfO { margin-bottom: 16px; display: flex; align-items: center; }
.c-fYqGBW { display: flex; flex-direction: row; align-items: center; }
.c-kXSjKy { display: flex; flex: 1 1 0%; flex-direction: column; border-radius: 12px; background: var(--colors-inkLight); padding: 24px; }
.c-nebSS { display: flex; background: var(--colors-inkDefault); padding: 12px 28px; border-radius: 8px; max-width: 425px; position: relative; }
.c-nebSS::after { content: ""; position: absolute; top: 12px; bottom: 12px; width: 2px; background: var(--colors-skyLightest); left: 120px; }
@media (max-width: 413px) { .c-nebSS::after { left: 96px; } }
.c-bXPJvK { margin-left: 40px; }
.c-bdurRD { background: var(--colors-inkLighter); padding: 8px; border-radius: 20px; margin-top: 16px; }
.c-jnLpGr { display: flex; flex: 1 1 0%; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.c-hOybqy { background: var(--colors-inkDefault); padding: 12px 8px; border-radius: 20px; }
.c-eoVbPn { overflow: auto; position: relative; }
.c-kaauEL { padding: 20px; background: var(--colors-inkLighter); width: 100%; position: sticky; border-collapse: collapse; }
.c-hIOvWe { position: relative; border-radius: 20px; overflow: hidden; }
.c-gyCxWi { align-items: center; padding: 12px 8px; position: sticky; top: 0px; }
.c-bHqRnO { text-align: center; padding: 12px 8px; background: var(--colors-inkDefault); min-width: 120px; }
.c-bHqRnO:first-child { border-top-left-radius: 100px; border-bottom-left-radius: 100px; }
.c-bHqRnO:last-child { border-top-right-radius: 100px; border-bottom-right-radius: 100px; }
.c-eCtndB { padding: 20px; text-align: center; }

/* ============================================================
 * /referrals — mobile tab swap (Referral Saya / Riwayat Referral)
 * Live mobile (≤991px) shows pill row above content; desktop shows
 * 2-col layout (left + right) and ignores tabs. On mobile only the
 * panel with .is-active is visible.
 * ============================================================ */
.ref-referral-mobile-tabs { display: none; }
@media (max-width: 991px) { .ref-referral-mobile-tabs { display: block; margin-bottom: 16px; } }
@media (max-width: 991px) {
  .c-gKUdqi > [data-ref-page-panel]:not(.is-active) { display: none; }
}

/* ============================================================
 * /transaction main page — Saldo card + Riwayat preview layout
 * Captured live 2026-05-23 from katakjpads2.org/transaction.
 * 2-col on desktop (left 328px + right calc(100% - 368px)),
 * stacks at mobile.
 * ============================================================ */
.c-jIETMl { width: 328px; min-width: 328px; }
@media (max-width: 991px) { .c-jIETMl { width: 100%; min-width: 100%; } }
.c-fixGjY { display: flex; flex-direction: column; }
.c-fVEMOb { border-radius: 12px; background: var(--colors-inkLight); padding: 24px; }
.c-gIyWgu { background: rgb(217, 233, 242); width: 100%; height: 1px; }
@media (min-width: 992px) { .c-gIyWgu { margin-top: 32px; margin-bottom: 32px; } }
@media (max-width: 991px) { .c-gIyWgu { margin-top: 20px; margin-bottom: 20px; } }
.c-jCoQmt { width: calc(100%); }
.c-jCoQmt button { width: calc(100%); }
.c-jeYyyN { width: calc(100% - 368px); }
@media (max-width: 991px) { .c-jeYyyN { width: 100%; margin-top: 16px; } }
.c-cLgGMH { background: var(--colors-inkLight); display: flex; flex: 1 1 0%; flex-direction: column; padding: 24px 24px 32px; border-radius: 12px; }
.c-lLzLD { height: 0.5px; width: 100%; background: rgb(217, 233, 242); }
@media (min-width: 992px) { .c-lLzLD { margin-top: 24px; margin-bottom: 24px; } }
@media (max-width: 991px) { .c-lLzLD { margin-top: 20px; margin-bottom: 20px; } }

/* /transaction/transaction-account additional classes */
.c-fIaqhA { display: flex; justify-content: space-between; }
.c-kYvxmt { display: flex; margin-top: 20px; align-items: center; flex: 1 1 0%; }
.c-gMlCTz { display: flex; flex: 2 1 0%; justify-content: center; }
.c-bKiqXG button { padding: 9px; }

/* Bottom nav (c-gFctFD) — c-UUNBw link wrappers had no color set; browser
 * default rgb(0,0,238) leaked through to SVGs using stroke=currentColor
 * (regression from task #38 drawer icon refactor). Explicit white so the
 * currentColor cascade resolves correctly. */
.c-UUNBw { color: #FFFFFF; }

/* ============================================================
 * /deposit + /withdraw — verbatim live stitches capture 2026-05-23.
 * Form sections (QRIS auto + Manual Deposit), payment method tabs,
 * provider dropdowns, amount currency input, action buttons.
 * ============================================================ */
.c-dtCxlD { display: flex; flex-direction: column; gap: 16px; }
.c-bKzxuL { border-radius: 8px; padding: 16px; margin-bottom: 16px; background: var(--colors-inkLight); }
.c-jRxVLK { height: 0.5px; width: 100%; margin-bottom: 24px; background: rgb(217, 233, 242); }
.c-dmmkaZ { display: flex; justify-content: space-between; }
@media (max-width: 991px) { .c-dmmkaZ { flex-direction: column; margin-bottom: 20px; } }
.c-ifeHXr { margin-bottom: 12px; }
.c-bWMCCu { display: flex; align-items: center; overflow-x: scroll; gap: 32px; }
@media (min-width: 992px) { .c-bWMCCu { margin-bottom: 40px; } }
@media (max-width: 991px) { .c-bWMCCu { margin-bottom: 24px; } }
.c-eHwoJY { min-width: 300px; }
.c-lmtjvu { display: flex; flex: 1 1 0%; flex-direction: column; background: var(--colors-inkLight); border-radius: 12px; }
@media (min-width: 992px) { .c-lmtjvu { padding: 40px; } }
@media (max-width: 991px) { .c-lmtjvu { padding: 24px 16px 32px; } }
.c-cXwrJZ { margin-top: 32px; display: flex; flex: 1 1 0%; flex-direction: column; }
@media (min-width: 992px) { .c-cXwrJZ { justify-content: space-between; flex-direction: row; } }
.c-dWJYXw { width: 100%; }
@media (min-width: 992px) { .c-dWJYXw { width: 47%; } }
.c-fnIqnl { color: var(--colors-error, #FF6B6B); line-height: 1; margin-left: 2px; }
.c-doEuFM { background: unset; border: 1px solid white; outline: none; display: flex; color: var(--colors-skyLightest); flex: 1 1 0%; width: 100%; min-height: 38px; padding: 4px 8px; }
.c-doEuFM::placeholder { color: var(--colors-skyLightest); opacity: 0.5; }
.c-bbrmbu { display: flex; align-items: center; justify-content: center; flex-direction: column; cursor: pointer; transition: 250ms; border-radius: 12px; width: 92px; height: 92px; }
@media (min-width: 992px) { .c-bbrmbu { width: 112px; height: 112px; } }
.c-bbrmbu svg { object-fit: contain; width: 36px; height: 36px; }
@media (min-width: 992px) { .c-bbrmbu svg { width: 44px; height: 44px; } }
.c-bbrmbu:not(:first-child) { margin-left: 32px; }
.c-jQmpjc { background: var(--colors-inkLightest, rgb(32, 102, 111)); }
.c-fnnnQf { background: var(--colors-secondaryDefault, rgb(0, 157, 124)); }
.c-fSmvwS { border: 2px dashed white; cursor: pointer; height: 128px; border-radius: 4px; }
.c-jbugHd { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; }
.c-bPSmKn { padding: 8px 16px; border-radius: 33px; }
.c-dSdAEr { display: flex; justify-content: center; margin-top: 64px; margin-bottom: 32px; }
.c-kDjFOu { width: 92px; }
@media (min-width: 992px) { .c-kDjFOu { width: 112px; } }
.c-eJWaln { margin-top: 24px; }
.c-jCKAip { display: flex; margin-top: 8px; }
.c-cDiqoc { margin-left: 24px; }
.c-dIdZd { background: var(--colors-skyDarker); border-radius: 4px; padding: 24px; margin-bottom: 8px; }

/* /deposit info card rows (Bank / Nama Akun / Nomor Akun) and copy icons.
 * Captured from live katakjpads2.org 2026-05-23 — stitches runtime rules
 * not present in snapshot inline CSS. */
.c-bQwVyu { display: flex; align-items: center; transition: 0.3s; }
.c-bQwVyu:not(:first-child) { margin-top: 20px; }
.c-gsmDXe { cursor: pointer; }

/* react-select clone placeholder text style. Live: stitches runtime rule. */
.css-1v7nmpn-placeholder {
  grid-area: 1 / 1 / 2 / 3;
  color: #FFFFFF;
  margin-left: 2px;
  margin-right: 2px;
  box-sizing: border-box;
  padding: 0;
  font-family: var(--font-be-vietnam-pro);
  opacity: 0.5;
}

/* Vanilla react-select clone — menu pop-up styling (live uses
 * css-XXX-menu/css-XXX-menuList; our ref-select-menu class hosts
 * <ul><li> options. Background, border-radius, font-family chosen to
 * match live's grey-on-dark dropdown surface). */
.ref-select-menu {
  list-style: none;
  margin: 4px 0 0;
  padding: 4px 0;
  position: absolute;
  z-index: 100;
  min-width: 100%;
  background: var(--colors-skyDarker, rgb(112, 116, 117));
  border-radius: 4px;
  font-family: var(--font-be-vietnam-pro);
  color: #FFFFFF;
  font-size: 14px;
  box-shadow: 0 8px 16px rgba(0,0,0,0.4);
  max-height: 240px;
  overflow-y: auto;
}
.ref-select-option {
  padding: 8px 12px;
  cursor: pointer;
}
.ref-select-option:hover { background: rgba(255,255,255,0.1); }

/* /withdraw — divider between heading and form, and method-tab container.
 * Captured from live katakjpads2.org 2026-05-23. */
.c-bdnkjV { height: 0.5px; width: 100%; margin-top: 24px; margin-bottom: 24px; background: rgb(217, 233, 242); }
.c-kXmBrj { display: flex; align-items: center; overflow-x: scroll; }
@media (min-width: 992px) { .c-kXmBrj { margin-bottom: 40px; } }
@media (max-width: 991px) { .c-kXmBrj { margin-bottom: 24px; } }

/* Input wrapper background + active/inactive payment method tab variants.
 * Captured from live katakjpads2.org 2026-05-23 — stitches runtime rules.
 * Required for Username/Jumlah/etc input box backgrounds (live: dark teal
 * surface around inputs in QRIS form) and tab active/inactive border state. */
.c-PJLV-ihrlkMa-css { background: var(--colors-inkLightest, rgb(32, 102, 111)); border-radius: 4px; }
.c-PJLV-kqyBvW-isGaruda-false::placeholder { color: var(--colors-skyLightest); }
.c-bbrmbu-bOpIeM-active-false { background: var(--colors-inkLighter); }
.c-bbrmbu-ipHlGk-active-true {
  background: var(--colors-inkDefault);
  border: 3px solid var(--colors-secondaryDefault);
}

/* QRIS form .separator — adds 24px margin-top between fields (Username
 * to Jumlah to Tampilkan QRIS button). Live: scoped to .separator.svelte-sx4d9v,
 * but since we strip svelte-* classes the rule needs the bare .separator
 * selector to apply. Required for vertical rhythm in Deposit QRIS section. */
.separator { margin-top: 24px; }

/* Title margin under section headings (Deposit QRIS, Manual Deposit, etc).
 * Live: scoped to .title-mb.svelte-sx4d9v; without svelte runtime our
 * bare .title-mb needs the bare selector to apply 16px bottom margin. */
.title-mb { margin-bottom: 16px; }

/* When a react-select clone menu is open, raise its wrapper z-index above
 * sibling wrappers. Without this, sibling css-b62m3t-container at the same
 * z-index:1000 level paints on top because it comes LATER in DOM — observed
 * 2026-05-23 on /deposit Rekening Pengirim dropdown getting clipped by
 * Nomor Rekening Penerima box below it. Driven by JS toggle of .is-menu-open
 * class on the wrapper. */
.css-b62m3t-container.is-menu-open {
  z-index: 9999;
}

/* Nomor Rekening Penerima dropdown — hide X clear button.
 * User 2026-05-23: receiver must always match sender's provider_code
 * (sesama-bank rule). Clearing the receiver would leave it unset, breaking
 * the rule + form submit. Only the matching option is ever shown in the
 * menu (driven by JS in deposit_loggedin.ejs sender-click handler). */
[data-ref-select="receiver"] [data-ref-clear] {
  display: none;
}

/* "Tambah akun baru +" CTA at end of Pengirim / Akun Bank dropdowns.
 * Live reference shows green teal text + plus icon at right, separator
 * line above to distinguish from real account options. Hover bg uses a
 * subtle green tint instead of the generic white-alpha applied to other
 * options. (Specificity wins because compound .ref-select-option.ref-tambah-akun-cta
 * is 0,2,0 vs base .ref-select-option:hover at 0,1,1.) */
.ref-select-option.ref-tambah-akun-cta {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  color: #009D7C;
  font-weight: 600;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  margin-top: 4px;
  padding: 10px 12px;
  cursor: pointer;
  user-select: none;
}
.ref-select-option.ref-tambah-akun-cta:hover {
  background: rgba(0, 157, 124, 0.12);
  color: #00b890;
}
.ref-select-option.ref-tambah-akun-cta svg {
  flex-shrink: 0;
}