/* ===== Fonts & Typography ===== */
@font-face {
      font-family: 'digital_sans_ef_medium';
      font-display: swap;
      src: url('https://dsuown9evwz4y.cloudfront.net/Fonts/digital_sans_ef_medium.woff2?v=0') format('woff2'), url('https://dsuown9evwz4y.cloudfront.net/Fonts/digital_sans_ef_medium.woff?v=0') format('woff');
      font-weight: normal;
      font-style: normal
    }

    @font-face {
      font-family: 'gilroybold';
      font-display: swap;
      src: url('https://dsuown9evwz4y.cloudfront.net/Fonts/Gilroy-Bold.woff2?v=0') format('woff2'), url('https://dsuown9evwz4y.cloudfront.net/Fonts/Gilroy-Bold.woff?v=0') format('woff');
      font-weight: normal;
      font-style: normal
    }

    @font-face {
      font-family: 'Open24DisplaySt';
      font-display: swap;
      src: url('https://dsuown9evwz4y.cloudfront.net/Fonts/Open24DisplaySt.woff2?v=0') format('woff2');
      font-weight: normal;
      font-style: normal
    }

    @font-face {
      font-family: 'Glyphicons Halflings';
      font-display: swap;
      src: url('https://dsuown9evwz4y.cloudfront.net/Fonts/glyphicons-halflings-regular.woff?v=0') format('woff')
    }

    body {
      font-family: 'digital_sans_ef_medium', Arial, Helvetica, sans-serif;
      font-size: 14px
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6 {
      font-family: inherit
    }

    .home-progressive-jackpot .jackpot-play-section .jackpot-play-text {
      font-family: 'gilroybold'
    }

    .home-progressive-jackpot .jackpot-container {
      font-family: 'Open24DisplaySt'
    }

    .glyphicon {
      font-family: 'Glyphicons Halflings'
    }

/* ===== Responsive Optimization ===== */
/* Safety: avoid horizontal overflow & keep media fluid */
  body {
    overflow-x: hidden;
  }

  img,
  picture,
  video,
  canvas,
  svg {
    max-width: 100%;
  }

  /* ============ Tablet and below (<= 991px) ============ */
  @media (max-width: 991px) {
    .home-inner-container {
      gap: 14px;
      margin-bottom: 26px;
    }

    .home-progressive-jackpot .border-container {
      gap: 24px;
    }

    .home-progressive-jackpot .jackpot-container {
      font-size: 30px;
      letter-spacing: 3px;
    }

    .footer-sitemap-section {
      padding-right: 0;
    }
  }

  /* ============ Mobile (<= 767px) ============ */
  @media (max-width: 767px) {

    /* Jackpot + Lottery: stack vertically, full width */
    .home-inner-container {
      flex-direction: column;
      align-items: stretch;
      gap: 14px;
      margin: 12px 0 26px;
    }

    .home-inner-container [data-section="jackpot"],
    .home-inner-container [data-section="lottery"] {
      width: 100%;
    }

    .home-inner-container [data-section="lottery"] .lottery-result-container {
      max-width: 420px;
      margin: 0 auto;
    }

    /* Progressive jackpot: shrink nested paddings, gaps & fonts so it fits */
    .home-progressive-jackpot {
      padding: 6px;
      border-radius: 18px;
    }

    .home-progressive-jackpot .outer-container,
    .home-progressive-jackpot .inner-container {
      padding: 6px;
    }

    .home-progressive-jackpot .border-container {
      gap: 12px;
      padding: 6px;
    }

    .home-progressive-jackpot .jackpot-play-section {
      margin-left: 8px;
    }

    .home-progressive-jackpot .jackpot-play-section img {
      width: 62px;
    }

    .home-progressive-jackpot .jackpot-play-section .jackpot-play-text {
      font-size: 18px;
    }

    .home-progressive-jackpot .jackpot-container {
      font-size: 22px;
      letter-spacing: 1px;
      padding: 6px;
    }

    .home-progressive-jackpot .jackpot-inner-container,
    .home-progressive-jackpot .jackpot-border-container {
      padding: 6px;
      line-height: 32px;
    }

    .home-progressive-jackpot .jackpot-currency {
      margin-right: 5px;
    }

    /* Announcement bar: stack title / marquee / date */
    .announcement-container {
      flex-direction: column;
      align-items: stretch;
      gap: 6px;
      padding: 8px 12px;
    }

    .announcement-container>[data-section="announcements"] {
      width: 100%;
    }

    .announcement-container [data-section="date"] {
      font-size: 11px;
      text-align: left;
    }

    /* Banner navigation arrows: closer to edges & smaller */
    .nav-btn {
      width: 34px;
      height: 34px;
      padding: 6px;
    }

    .nav-btn.main-prev {
      left: 8px;
    }

    .nav-btn.main-next {
      right: 8px;
    }

    .nav-btn img {
      width: 16px;
      height: 16px;
    }

    /* Topbar: allow wrapping instead of squeezing into 46%/54% */
    .topbar-container .row {
      flex-wrap: wrap;
      row-gap: 6px;
    }

    .topbar-left-container,
    .topbar-right-container {
      width: 100%;
    }

    /* Footer sitemap: wrap the 5 columns */
    .footer-sitemap-section {
      flex-wrap: wrap;
      row-gap: 14px;
    }

    .footer-sitemap-section>div {
      width: 50%;
    }

    /* Game carousels: fewer, larger tiles (still horizontally scrollable) */
    .game-list .game-item {
      width: calc((100% - (5px * 3.2 * 2)) / 3.2);
    }

    .container-content .game-list .game-item {
      width: calc((100% - (5px * 3.2 * 2)) / 3.2);
    }

    .popular-game-title-container .container-content .game-list .game-item {
      width: calc((100% - (5px * 3.2 * 2)) / 3.2);
    }

    /* Section title chevrons: less side padding */
    .container-title span,
    .popular-game-title-container .container-title span {
      padding: 5px 26px;
    }

    /* Footer sub-sections: stack & prevent right-edge overflow */
    .site-footer .row {
      margin-left: 0;
      margin-right: 0;
    }

    .footer-featured-product-section>div {
      width: 100%;
      min-width: 0;
    }

    .footer-featured-product-section .site-info-description {
      min-width: 0;
    }

    .footer-banking-section .banking-footer-section .bank-service-container {
      grid-template-columns: 1fr;
      margin: 14px;
      gap: 12px;
    }

    .footer-banking-section .bank-list-container {
      margin: 14px;
      padding: 16px;
    }

    .footer-copyright-section .col-md-12 {
      flex-wrap: wrap;
      gap: 14px;
    }

    .footer-copyright-section .col-md-12 .copyright {
      margin-left: 0;
    }

    .footer-description-section .site-description h1 {
      font-size: 20px;
      line-height: 1.3;
    }

    .footer-description-section .site-description p {
      text-align: left !important;
    }

    .footer-description-section h4,
    .footer-description-section .site-description {
      overflow-wrap: break-word;
      word-break: break-word;
    }
  }

  /* ============ Small phones (<= 480px) ============ */
  @media (max-width: 480px) {
    .footer-sitemap-section>div {
      width: 100%;
    }

    .home-progressive-jackpot .jackpot-container {
      font-size: 18px;
    }

    .home-progressive-jackpot .jackpot-play-section .jackpot-play-text {
      font-size: 15px;
    }

    .home-progressive-jackpot .jackpot-play-section img {
      width: 52px;
    }

    /* Game carousels: ~2.4 tiles per row on very small screens */
    .game-list .game-item {
      width: calc((100% - (5px * 2.4 * 2)) / 2.4);
    }

    .container-content .game-list .game-item {
      width: calc((100% - (5px * 2.4 * 2)) / 2.4);
    }

    .popular-game-title-container .container-content .game-list .game-item {
      width: calc((100% - (5px * 2.4 * 2)) / 2.4);
    }
  }

/* ===== Last Deposit & Withdraw ===== */
.txn-wrap {
                              margin: 0 0 18px;
                              font-family: 'digital_sans_ef_medium', Arial, Helvetica, sans-serif;
                            }
                      
                            .txn-title {
                              text-align: center;
                              font-size: 18px;
                              font-weight: 700;
                              letter-spacing: .5px;
                              margin: 0 0 14px;
                              color: #bf941f;
                            }
                      
                            .txn-section {
                              display: grid;
                              grid-template-columns: 1fr 1fr;
                              gap: 16px;
                            }
                      
                            .txn-panel {
                              background: linear-gradient(160deg, #00ff2a7a 0%, #000000 100%);
                              border: 1px solid rgba(212, 175, 55, .4);
                              border-radius: 14px;
                              overflow: hidden;
                              box-shadow: 0 2px 10px rgba(212, 175, 55, .10);
                            }
                      
                            .txn-head {
                              display: flex;
                              align-items: center;
                              gap: 8px;
                              padding: 12px 16px;
                              font-size: 14px;
                              font-weight: 700;
                              letter-spacing: .5px;
                              color: #d2d2d2;
                              border-bottom: 1px solid rgba(212, 175, 55, .25);
                              background: rgba(212, 175, 55, .06);
                            }
                      
                            .txn-ico {
                              font-size: 12px;
                            }
                      
                            .txn-deposit .txn-ico {
                              color: #1e9e57;
                            }
                      
                            .txn-withdraw .txn-ico {
                              color: #d4af37;
                            }
                      
                            .txn-live {
                              margin-left: auto;
                              font-size: 10px;
                              font-weight: 700;
                              color: #1e9e57;
                              display: inline-flex;
                              align-items: center;
                              gap: 5px;
                            }
                      
                            .txn-live::before {
                              content: "";
                              width: 7px;
                              height: 7px;
                              border-radius: 50%;
                              background: #2ecc71;
                              box-shadow: 0 0 6px #2ecc71;
                              animation: txnPulse 1.4s infinite;
                            }
                      
                            @keyframes txnPulse {
                      
                              0%,
                              100% {
                                opacity: 1
                              }
                      
                              50% {
                                opacity: .3
                              }
                            }
                      
                            .txn-list {
                              list-style: none;
                              margin: 0;
                              padding: 4px 0;
                              overflow: hidden;
                            }
                      
                            .txn-row {
                              display: flex;
                              align-items: center;
                              gap: 10px;
                              padding: 8px 16px;
                              border-bottom: 1px dashed rgba(212, 175, 55, .18);
                              animation: txnIn .5s ease;
                            }
                      
                            .txn-row:last-child {
                              border-bottom: none;
                            }
                      
                            @keyframes txnIn {
                              from {
                                opacity: 0;
                                transform: translateY(-10px);
                              }
                      
                              to {
                                opacity: 1;
                                transform: translateY(0);
                              }
                            }
                      
                            .txn-avatar {
                              flex: 0 0 30px;
                              width: 30px;
                              height: 30px;
                              border-radius: 50%;
                              display: flex;
                              align-items: center;
                              justify-content: center;
                              font-size: 12px;
                              font-weight: 700;
                              color: #fff;
                            }
                      
                            .txn-deposit .txn-avatar {
                              background: linear-gradient(135deg, #75cc2e, #1e9e57);
                            }
                      
                            .txn-withdraw .txn-avatar {
                              background: linear-gradient(135deg, #f57a7a, #d4af37);
                              color: #5a4500;
                            }
                      
                            .txn-meta {
                              min-width: 0;
                              flex: 1;
                            }
                      
                            .txn-id {
                              font-size: 13px;
                              font-weight: 700;
                              color: #a2a2a2;
                              overflow: hidden;
                              text-overflow: ellipsis;
                              white-space: nowrap;
                            }
                      
                            .txn-sub {
                              font-size: 11px;
                              color: #8a8a8a;
                            }
                      
                            .txn-amt {
                              font-weight: 800;
                              font-size: 14px;
                              white-space: nowrap;
                            }
                      
                            .txn-deposit .txn-amt {
                              color: #1e9e57;
                            }
                      
                            .txn-withdraw .txn-amt {
                              color: #bf941f;
                            }
                      
                            @media (max-width: 600px) {
                              .txn-section {
                                grid-template-columns: 1fr;
                              }
                            }

/* ===== RTP Live & Jam Gacor ===== */
.rtp-live-section {
      background:
        radial-gradient(120% 80% at 50% 0%, rgba(212, 175, 55, .10) 0%, rgba(212, 175, 55, 0) 55%),
        linear-gradient(180deg, #053e00 0%, #000000 40%);
      padding: 48px 0 56px;
      color: #2a2a2a;
      font-family: 'digital_sans_ef_medium', Arial, Helvetica, sans-serif;
      border-top: 1px solid rgba(212, 175, 55, .28);
    }
  
    .rtp-live-section .container {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 16px;
    }
  
    .rtp-live-header {
      text-align: center;
      margin-bottom: 30px;
    }
  
    .rtp-live-header h2 {
      margin: 0 0 8px;
      font-size: 30px;
      font-weight: 700;
      letter-spacing: 1px;
      background: linear-gradient(90deg, #c8911a, #e6b93f, #c8911a);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: #bf941f;
    }
  
    .rtp-live-header p {
      margin: 0 auto;
      max-width: 660px;
      color: #6b6b6b;
      font-size: 14px;
      line-height: 1.5;
    }
  
    .rtp-live-controls {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 14px;
      flex-wrap: wrap;
      margin-top: 16px;
    }
  
    .rtp-live-clock {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: rgba(212, 175, 55, .10);
      border: 1px solid rgba(212, 175, 55, .45);
      color: #a67c00;
      padding: 8px 16px;
      border-radius: 999px;
      font-size: 14px;
      letter-spacing: .5px;
    }
  
    .rtp-live-clock::before {
      content: "";
      width: 9px;
      height: 9px;
      border-radius: 50%;
      background: #2ecc71;
      box-shadow: 0 0 8px #2ecc71;
      animation: rtpPulse 1.4s infinite;
    }
  
    @keyframes rtpPulse {
  
      0%,
      100% {
        opacity: 1
      }
  
      50% {
        opacity: .3
      }
    }
  
    .rtp-refresh-btn {
      cursor: pointer;
      border: none;
      border-radius: 999px;
      background: linear-gradient(135deg, #f5d77a, #d4af37);
      color: #2a2210;
      font-weight: 700;
      font-size: 14px;
      padding: 9px 20px;
      transition: transform .15s, box-shadow .15s;
      box-shadow: 0 4px 12px rgba(212, 175, 55, .30);
    }
  
    .rtp-refresh-btn:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 18px rgba(212, 175, 55, .45);
    }
  
    .rtp-refresh-btn:active {
      transform: translateY(0);
    }
  
    .rtp-refresh-btn[disabled] {
      opacity: .6;
      cursor: default;
    }
  
    .rtp-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
      gap: 18px;
    }
  
    .rtp-card {
      background: linear-gradient(160deg, #00ff2a7a 0%, #000000 100%);
      border: 1px solid rgba(0, 255, 85, 0.35);
      border-radius: 14px;
      padding: 0;
      position: relative;
      overflow: hidden;
      box-shadow: 0 2px 10px rgba(212, 175, 55, .10);
      transition: transform .18s, border-color .18s, box-shadow .18s;
    }
  
    .rtp-card:hover {
      transform: translateY(-4px);
      border-color: rgba(212, 175, 55, .75);
      box-shadow: 0 10px 26px rgba(212, 175, 55, .28);
    }
  
    .rtp-thumb {
      position: relative;
      width: 100%;
      height: 140px;
      background: #f3eddc;
      overflow: hidden;
    }
  
    .rtp-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform .35s;
    }
  
    .rtp-card:hover .rtp-thumb img {
      transform: scale(1.06);
    }
  
    .rtp-thumb::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(0, 0, 0, .12) 0%, rgba(0, 0, 0, 0) 40%);
      pointer-events: none;
    }
  
    .rtp-card-content {
      padding: 14px 16px 16px;
    }
  
    .rtp-prov {
      display: inline-block;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .4px;
      padding: 4px 10px;
      border-radius: 6px;
      color: #fff;
      text-transform: uppercase;
    }
  
    .rtp-status {
      font-size: 11px;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 6px;
      white-space: nowrap;
    }
  
    .rtp-thumb .rtp-prov {
      position: absolute;
      top: 8px;
      left: 8px;
      z-index: 1;
      box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
    }
  
    .rtp-thumb .rtp-status {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 1;
      background: rgba(255, 255, 255, .93);
    }
  
    .rtp-thumb .rtp-status.is-gacor {
      color: #1e9e57;
      border: 1px solid rgba(46, 204, 113, .55);
    }
  
    .rtp-thumb .rtp-status.is-normal {
      color: #a67c00;
      border: 1px solid rgba(212, 175, 55, .6);
    }
  
    .rtp-thumb .rtp-status.is-low {
      color: #d63a2f;
      border: 1px solid rgba(231, 76, 60, .55);
    }
  
    .rtp-game {
      font-size: 17px;
      font-weight: 700;
      color: #d4d4d4;
      margin: 0 0 12px;
      line-height: 1.25;
    }
  
    .rtp-meter-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 14px;
    }
  
    .rtp-bar {
      flex: 1;
      height: 9px;
      border-radius: 999px;
      background: rgba(0, 0, 0, .08);
      overflow: hidden;
    }
  
    .rtp-bar>span {
      display: block;
      height: 100%;
      border-radius: 999px;
      width: 0;
      transition: width .9s cubic-bezier(.22, 1, .36, 1);
    }
  
    .rtp-pct {
      font-size: 18px;
      font-weight: 700;
      min-width: 56px;
      text-align: right;
      font-variant-numeric: tabular-nums;
    }
  
    .rtp-info {
      border-top: 1px dashed rgba(212, 175, 55, .4);
      padding-top: 12px;
      display: grid;
      gap: 9px;
    }
  
    .rtp-info-item {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      font-size: 13px;
    }
  
    .rtp-info-item .rtp-label {
      color: #8a8a8a;
      min-width: 78px;
    }
  
    .rtp-info-item .rtp-value {
      color: #333333;
      font-weight: 600;
    }
  
    .rtp-info-item .rtp-value.jam {
      color: #a67c00;
    }
  
    .rtp-disclaimer {
      text-align: center;
      margin-top: 26px;
      font-size: 12px;
      color: #9a9a9a;
    }
  
    /* ===== Member Win Popup ===== */
    .win-popup {
      position: fixed;
      left: 18px;
      bottom: 18px;
      z-index: 1035;
      width: 312px;
      max-width: calc(100vw - 36px);
      display: flex;
      gap: 12px;
      align-items: center;
      padding: 12px 34px 12px 12px;
      background: linear-gradient(160deg, #287900dc 0%, #090800 100%);
      border: 1px solid rgba(212, 175, 55, .5);
      border-radius: 14px;
      box-shadow: 0 12px 32px rgba(0, 0, 0, .18);
      font-family: 'digital_sans_ef_medium', Arial, Helvetica, sans-serif;
      transform: translateX(-130%);
      opacity: 0;
      transition: transform .5s cubic-bezier(.22, 1, .36, 1), opacity .5s;
    }
  
    .win-popup.is-visible {
      transform: translateX(0);
      opacity: 1;
    }
  
    .win-popup-thumb {
      flex: 0 0 56px;
      width: 56px;
      height: 56px;
      border-radius: 10px;
      overflow: hidden;
      border: 1px solid rgba(212, 175, 55, .4);
      background: #f3eddc;
    }
  
    .win-popup-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
  
    .win-popup-body {
      min-width: 0;
      flex: 1;
    }
  
    .win-popup-head {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 2px;
    }
  
    .win-popup-badge {
      font-size: 10px;
      font-weight: 700;
      color: #1e9e57;
      background: rgba(46, 204, 113, .14);
      border: 1px solid rgba(46, 204, 113, .4);
      padding: 1px 7px;
      border-radius: 999px;
      white-space: nowrap;
    }
  
    .win-popup-id {
      font-size: 12px;
      font-weight: 700;
      color: #a67c00;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  
    .win-popup-game {
      font-size: 13px;
      font-weight: 700;
      color: #2a2a2a;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  
    .win-popup-prov {
      font-size: 11px;
      color: #8a8a8a;
      margin-bottom: 3px;
    }
  
    .win-popup-amount {
      font-size: 16px;
      font-weight: 800;
      color: #bf941f;
      letter-spacing: .3px;
    }
  
    .win-popup.is-visible .win-popup-amount {
      animation: winPop .6s ease;
    }
  
    @keyframes winPop {
      0% {
        transform: scale(.7);
        opacity: 0
      }
  
      60% {
        transform: scale(1.08)
      }
  
      100% {
        transform: scale(1);
        opacity: 1
      }
    }
  
    .win-popup-close {
      position: absolute;
      top: 6px;
      right: 8px;
      border: none;
      background: transparent;
      color: #b9b297;
      font-size: 18px;
      line-height: 1;
      cursor: pointer;
      padding: 2px;
    }
  
    .win-popup-close:hover {
      color: #7d7868;
    }
  
    @media (max-width: 480px) {
      .rtp-live-header h2 {
        font-size: 23px;
      }
  
      .rtp-grid {
        grid-template-columns: 1fr;
      }
  
      .win-popup {
        width: 270px;
        left: 10px;
        bottom: 10px;
      }
    }