:root {
  --main-theme-color: #d4af37;

  --bg-0: #050402;
  --bg-1: #0b0905;
  --bg-2: #151007;

  --surface-1: rgba(18, 14, 8, 0.88);
  --surface-2: rgba(28, 21, 10, 0.92);
  --surface-3: rgba(10, 8, 4, 0.96);

  --text-1: #fff8e8;
  --text-2: #d8c9a8;
  --text-3: #9c8c6a;

  --gold: #ffd76a;
  --gold-2: #d4af37;
  --gold-3: #9f6f18;
  --champagne: #fff1b8;
  --amber: #ffb347;
  --soft-white: #fffdf5;

  --danger: #ff4d4d;
  --success: #32e68b;

  --border-soft: rgba(255, 215, 106, 0.18);
  --border-strong: rgba(255, 215, 106, 0.42);

  --glow-gold: 0 0 0 1px rgba(255, 215, 106, .18), 0 0 18px rgba(255, 190, 75, .18);
  --glow-soft: 0 0 0 1px rgba(255,255,255,.08), 0 0 18px rgba(255, 215, 106, .12);
  --glow-red: 0 0 0 1px rgba(255, 77, 77, .16), 0 0 18px rgba(255, 77, 77, .13);

  --gradient-primary: linear-gradient(135deg, #fff1b8 0%, #ffd76a 28%, #d4af37 58%, #8b5d12 100%);
  --gradient-accent: linear-gradient(135deg, #fff6cf 0%, #ffd76a 45%, #ffb347 100%);
  --gradient-dark: linear-gradient(180deg, rgba(18,14,8,.96) 0%, rgba(7,5,3,.98) 100%);

  --card-radius: 16px;
  --soft-shadow: 0 12px 32px rgba(0,0,0,.34);
  --fast: .22s ease;
  --medium: .32s ease;
}

body,
.site-content-container,
.home-inner-container,
[data-container-background="general"],
[data-container-background="home"],
[data-container-background="slots"],
[data-container-background="arcade"],
[data-container-background="crash-game"],
[data-container-background="casino"],
[data-container-background="race"],
[data-container-background="others"],
[data-container-background="promotions"] {
  background:
    radial-gradient(circle at top left, rgba(255, 215, 106, .14), transparent 30%),
    radial-gradient(circle at top right, rgba(255, 77, 77, .10), transparent 28%),
    radial-gradient(circle at bottom center, rgba(255, 179, 71, .12), transparent 34%),
    linear-gradient(180deg, #090704 0%, #050402 100%);
  color: var(--text-1);
}

body {
  background-attachment: fixed;
}

.topbar-container,
.site-header,
.announcement-outer-container,
.standard-form-content,
.modal-body,
.modal-footer,
.bonus-slider-modal .modal-body,
.bonus-slider-modal .modal-footer,
.promotion-item,
.promotion-item .modal-body,
.transactions-table.table,
.reporting-detail-popup .reporting-detail-popup-content,
.pending-transaction-detail-card,
.transaction-item,
.claim-item,
.promotion-side-menu,
.promotion-list,
.mobile-app-container .logo-container,
.provider-slide,
.standard-profile-bar,
.standard-side-menu,
.large-game-list-container .large-game-list-section,
.footer-featured-product-section .site-info-description,
.footer-banking-section .banking-footer-section,
.footer-banking-section .bank-list-container,
.footer-banking-section .banking-footer-section .bank-service-container .site-info-description {
  background:
    linear-gradient(180deg, rgba(28,21,10,.94), rgba(8,6,3,.96));
  border: 1px solid var(--border-soft);
  box-shadow: var(--soft-shadow);
}

.topbar-container,
.site-header {
  background:
    linear-gradient(180deg, rgba(12,9,4,.96), rgba(7,5,3,.90));
  border-bottom: 1px solid rgba(255,215,106,.16);
  backdrop-filter: blur(8px);
}

.topbar-sub-section .topbar-item,
.site-info-inner-container,
.footer-description-section .site-description,
.footer-sitemap-section .footer-links>li>a,
.footer-sitemap-section .contact-list>li a,
.footer-sitemap-section .social-media-list>li>a,
.message-table,
.transactions-table.table thead tr th,
.transactions-table.table tbody,
.pending-transaction-detail-container .secondary,
.resolved-transaction-popup .secondary,
.transaction-item .info-section .details .secondary {
  color: var(--text-2);
}

.top-menu>li,
.game-list .game-name,
.game-list .game-player h5,
.game-description-container .game-title,
.game-description-container .game-description,
.profile-container .section-heading,
.register-done-container>h2,
.copyright-info-container .copyright,
.footer-description-section h4,
.footer-sitemap-section h4,
.footer-featured-product-section .site-info-description h4,
.footer-banking-section .banking-footer-section .bank-service-container .site-info-description h4,
.message-detail-title,
.pending-transaction-detail-container .primary,
.resolved-transaction-popup .primary,
.transaction-item .info-section .details .primary,
.claim-info-modal h4,
.confirmation-message-modal h4.modal-title {
  color: var(--text-1);
}

.top-menu>li[data-active="true"],
.top-menu>li:hover,
.topbar-sub-section .topbar-item a:hover,
.topbar-sub-section .topbar-item .live-chat:hover,
.contact-us-list li a,
.contact-us-list li a:hover,
.standard-form-title,
.info-center-container h2,
.standard-nav-bar .nav-bar-title,
.promotion-side-menu>h5,
.standard-profile-bar .username-field .username,
.standard-profile-bar .balance-field .balance,
.user-info .balance>span,
.deposit-container .formatted-balance,
.withdrawal-container .formatted-balance,
.deposit-summary-container .deposit-summary-header .summary-transfer-amount,
.withdrawal-summary-container .withdrawal-summary-header .summary-transfer-amount,
.replied-message,
.standard-content-info h2,
.claim-item .claim-details strong,
.claim-item .claim-title .free-spin-note {
  color: var(--gold);
  text-shadow: 0 0 10px rgba(255,215,106,.22);
}

.modal-header,
.confirmation-message-modal .modal-header {
  background: var(--gradient-primary);
  border-bottom: 1px solid rgba(255,255,255,.10);
  color: #150e04;
  font-weight: 700;
  box-shadow: var(--glow-gold);
}

.bonus-slider-modal .activation-button,
.claim-item .claim-button,
.claim-item .activation-button,
.claim-item .cancellation-button,
.claim-item .expiration-button,
.popular-game-title-container a,
.promotion-item .click-for-more-info-button,
.promotion-item-details .click-for-get-promo-button,
.register-done-container .btn-deposit,
.play-now,
.standard-button-group .btn-primary,
.standard-reporting-control-group .btn-primary,
.deposit-container .reveal-bank-account-button,
.copy-input-button-field .copy-input-button,
[data-payment-gateway] .download-qr-button,
.notification-tabs .notification-tab-item[data-active="true"],
.standard-nav-bar a[data-active="true"],
.standard-nav-bar a:not([data-active="true"]):hover,
.standard-side-menu a[data-active="true"],
.standard-side-menu a:not([data-active="true"]):hover,
.payment-method-selection input[type="radio"]:checked+label,
.login-panel .register-button,
.modal-footer .btn-primary,
.transaction-item .download-qr-btn,
.loyalty-reward-container .loyalty-reward-button,
.notification-popup-body .notification-footer,
.popup-modal [data-popup="maintenance"] p span {
  background: var(--gradient-primary);
  color: #120c03;
  border: 0;
  font-weight: 700;
  box-shadow: var(--glow-gold);
}

.bonus-slider-modal .activation-button:hover,
.claim-item .claim-button:hover,
.claim-item .activation-button:hover,
.claim-item .cancellation-button:hover,
.claim-item .expiration-button:hover,
.popular-game-title-container a:hover,
.promotion-item .click-for-more-info-button:hover,
.promotion-item-details .click-for-get-promo-button:hover,
.register-done-container .btn-deposit:hover,
.play-now:hover,
.standard-button-group .btn-primary:hover,
.standard-reporting-control-group .btn-primary:hover,
.deposit-container .reveal-bank-account-button:hover,
.copy-input-button-field .copy-input-button:hover,
[data-payment-gateway] .download-qr-button:hover,
.login-panel .register-button:hover,
.modal-footer .btn-primary:hover,
.transaction-item .download-qr-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.08);
}

.free-play,
.login-panel .login-button,
.profile-container .mobile-info-button,
.request-otp-button,
.contact-verification-link,
.set-as-default-button,
.claim-item .close-button,
.standard-outline-button.standard-outline-button,
.complaint-container .btn-appeal {
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,215,106,.22);
  color: var(--text-1);
  box-shadow: var(--glow-soft);
}

.free-play:hover,
.login-panel .login-button:hover,
.profile-container .mobile-info-button:hover,
.request-otp-button:hover,
.contact-verification-link:hover,
.set-as-default-button:hover,
.standard-outline-button.standard-outline-button:hover,
.complaint-container .btn-appeal:hover {
  background: rgba(255,215,106,.08);
  border-color: rgba(255,215,106,.42);
  color: var(--champagne);
}

.login-panel input[type=text],
.login-panel input[type=password],
.standard-inline-form-group .form-control,
.standard-form-content .form-control,
.mobile-app-container .mobile-app-select,
.appeal-form textarea.form-control,
.rating-review-modal textarea.form-control,
.standard-reporting-control-group>input,
.games-list-container .filter-section,
.games-list-container .filter-section input[type=text],
.bonus-controls-field .bonus-amount,
.standard-inline-form-group .form-control[disabled],
.standard-inline-form-group .form-control[readonly] {
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,215,106,.14);
  color: var(--text-1);
  box-shadow: none;
}

.standard-inline-form-group .form-control:focus,
.standard-form-content .form-control:focus,
.games-list-container .filter-section input[type=text]:focus,
.login-panel input[type=text]:focus,
.login-panel input[type=password]:focus,
.standard-reporting-control-group>input:focus {
  border-color: rgba(255,215,106,.48);
  box-shadow: var(--glow-gold);
  outline: none;
}

.standard-form-note,
.claim-info-modal .alert-container,
.payment-account-creation-remarks,
.modal-body .pending-transaction-summary-container,
.remarks-container,
.notification-list .notification-item[data-seen="false"],
.register-done-container .register-verification-done,
.update-verification-note,
.pending-transactions-container .pending-transactions-item .pending-transaction-remarks-container {
  background: linear-gradient(180deg, rgba(255,215,106,.12), rgba(255,77,77,.055));
  border: 1px solid rgba(255,215,106,.20);
  color: var(--text-1);
}

.standard-form-note span,
.standard-form-note a,
.register-done-container .register-verification-done .info,
.register-done-container .register-verification-done a,
.simple-form-note,
.referral-verification-container .standard-form-note,
.standard-form-note.with-icon>div:last-child p,
.referral-features .referral-features-item .feature-info p,
.pending-verification-container p,
.pending-verification-container .icon-container,
.remarks-container i {
  color: var(--gold);
}

.claim-item,
.promotion-item,
.pending-transactions-container .pending-transactions-item,
.pending-transaction-detail-card,
.transaction-item,
.game-list .game-item,
.large-game-list li,
.top-menu .games-container>li,
.footer-featured-product-section .site-info-description,
.footer-banking-section .banking-footer-section {
  border-radius: var(--card-radius);
  overflow: hidden;
}

.game-list .game-item,
.top-menu .games-container>li,
.large-game-list li,
.provider-slide,
.promotion-item,
.claim-item,
.transaction-item,
.pending-transaction-detail-card,
.standard-form-content,
.mobile-app-container .logo-container,
.footer-featured-product-section .site-info-description,
.footer-banking-section .banking-footer-section {
  transition: transform var(--fast), box-shadow var(--fast), border-color var(--fast), background-color var(--fast);
}

.game-list .wrapper-container:hover,
.top-menu .games-container>li:hover,
.large-game-list li:hover,
.provider-slide:hover,
.promotion-item:hover,
.claim-item:hover,
.transaction-item:hover,
.pending-transaction-detail-card:hover,
.footer-featured-product-section .site-info-description:hover,
.footer-banking-section .banking-footer-section:hover {
  transform: translateY(-3px);
  border-color: rgba(255,215,106,.36);
  box-shadow:
    0 16px 34px rgba(0,0,0,.38),
    0 0 0 1px rgba(255,215,106,.10),
    0 0 18px rgba(255,179,71,.12);
}

.game-list .provider-name,
.about-us-container h5[data-title="safe-and-secure-gaming-environment"],
.about-us-container h5[data-title="customer-experience"],
.how-it-works-container .how-it-works-section .how-it-works-section-title,
.introjs-tooltiptext .subtitle,
.introjs-nextbutton.introjs-nextbutton,
.introjs-nextbutton.introjs-nextbutton:focus,
.introjs-skipbutton.introjs-skipbutton,
.large-game-list li a.game-info,
.notification-list .notification-item .notification-play-button,
.floating-action-button .floating-action-button-item {
  color: #120c03;
  background: var(--gradient-accent);
  border-color: rgba(255,215,106,.42);
  box-shadow: var(--glow-gold);
}

.about-us-container h5[data-title="fast-and-secure-payments"],
.about-us-container h5[data-title="sky-is-not-the-limit"],
.benefit-container h2,
.otp-popup .otp-popup-content .resend-button,
.mobile-app-container .title-container,
.promotion-side-menu>a[data-active="true"],
.promotion-side-menu>a:hover {
  color: var(--amber);
  text-shadow: 0 0 10px rgba(255,179,71,.22);
}

.jackpot-container,
.home-progressive-jackpot .jackpot-container {
  background:
    linear-gradient(135deg, #fff6cf 0%, #ffd76a 38%, #d4af37 68%, #8b5d12 100%);
  color: #120c03;
  box-shadow:
    var(--glow-gold),
    0 10px 26px rgba(0,0,0,.28);
}

.home-progressive-jackpot .inner-container,
.large-game-list img,
.top-menu .games-container>li>a img {
  background:
    linear-gradient(180deg, rgba(255,215,106,.22) 0%, rgba(255,77,77,.10) 100%);
}

.home-progressive-jackpot .border-container,
.home-progressive-jackpot .jackpot-border-container,
.jackpot-border-container,
.bank-info-container .carousel-indicators .active,
.carousel-indicators .active,
.carousel-indicators .slick-active,
.resolved-transactions-carousel .carousel-indicators .active,
.resolved-transactions-carousel .carousel-indicators .slick-active,
.otp-input,
.otp-fake-inputs div.filled,
.otp-fake-inputs div.focused {
  border-color: var(--gold);
  background-color: var(--gold);
}

.popover,
.bonus-selection-container,
.bonus-selection-list .bonus-selection-card.selected,
.modal-content:has(.resolved-transaction-popup),
.notification-popup-body .notification-popup-title,
.notification-popup-body .notification-tabs .notification-tab-item,
.notification-popup-body .notification-tabs .notification-tab-item[data-active="true"] {
  background: var(--surface-2);
  border-color: var(--border-strong);
  color: var(--text-1);
}

.large-game-list .link-container,
.game-list .link-container,
.arcade-game-list,
.crash-game-game-list,
.user-info .dropdown-menu.vendor-balances-container,
.top-menu .game-list-container {
  background: rgba(8, 6, 3, 0.88);
  backdrop-filter: blur(8px);
}

.game-list-title,
.popular-game-title-container,
.large-game-list-container,
.game-list-title>div,
.announcement-container>[data-section="announcements"],
.search-header .search-title {
  background-color: transparent;
}

.game-list-title {
  background-image:
    linear-gradient(90deg, transparent 0%, rgba(255,215,106,.28) 20%, rgba(255,179,71,.22) 52%, rgba(255,77,77,.12) 82%, transparent 100%);
}

.game-list-title>div,
.popular-game-title-container,
.info-center-container h3,
.standard-form-sub-title,
.loyalty-container .standard-form-title,
.complaint-container .standard-form-title,
.complaint-container .complaint-section-header {
  border-color: rgba(255,215,106,.14);
}

.progressbar {
  background: rgba(255,255,255,.12) !important;
}

.proggress {
  background: var(--gradient-accent) !important;
}

.unread-announcements-popup,
.unread-announcements-popup:before {
  border-color: var(--gold);
}

.unread-announcements-popup:before {
  border-bottom-color: var(--gold);
}

.footer-sitemap-section .contact-list>li a i,
.footer-sitemap-section .social-media-list>li a i,
.nav-btn {
  background: rgba(255,215,106,.08);
}

.nav-btn:hover {
  background: rgba(255,215,106,.14);
}

/* Animasi ringan: tetap hidup tapi tidak berat */
@keyframes neonPulse {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(255,215,106,.16),
      0 0 14px rgba(255,179,71,.12);
  }
  50% {
    box-shadow:
      0 0 0 1px rgba(255,215,106,.28),
      0 0 22px rgba(255,215,106,.20);
  }
}

@keyframes floatSoft {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-3px);
  }
}

.jackpot-container,
.home-progressive-jackpot .jackpot-container,
.notification-popup-body .notification-footer,
.modal-header,
.claim-item .claim-button,
.play-now,
.login-panel .register-button {
  animation: neonPulse 4.2s ease-in-out infinite;
}

.floating-action-button .floating-action-button-item,
.provider-slide>i,
.carousel-indicators .active,
.resolved-transactions-carousel .carousel-indicators .active {
  animation: floatSoft 3.4s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

@media (max-width: 768px) {
  :root {
    --card-radius: 12px;
  }

  .game-list .wrapper-container:hover,
  .top-menu .games-container>li:hover,
  .large-game-list li:hover,
  .provider-slide:hover,
  .promotion-item:hover,
  .claim-item:hover,
  .transaction-item:hover,
  .pending-transaction-detail-card:hover {
    transform: none;
  }
}