/* SLOT777 visual refresh — loaded last so it wins over earlier blocks */
:root {
  --sg-deep: #0a0e18;
  --sg-deep-mid: #111d32;
  --sg-panel: rgba(14, 22, 38, 0.92);
  --sg-panel-2: rgba(18, 28, 48, 0.78);
  --sg-gold: #d4a20c;
  --sg-gold-hi: #f0c94d;
  --sg-gold-soft: #e8c547;
  --sg-gold-glow: rgba(240, 201, 77, 0.42);
  --sg-violet: #9b7edb;
  --sg-violet-glow: rgba(155, 126, 219, 0.32);
  --sg-border: rgba(212, 162, 12, 0.45);
  --sg-text: #e8edf7;
  --sg-muted: #b8c5dc;
  --sg-ice: #9ec8ee;
}

/* --- RTP generator --- */
.rtp-machine-v3 {
  background:
    radial-gradient(circle at 15% 0%, var(--sg-violet-glow), transparent 48%),
    radial-gradient(circle at 85% 100%, var(--sg-gold-glow), transparent 55%),
    linear-gradient(155deg, var(--sg-deep-mid) 0%, var(--sg-deep) 100%) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow:
    inset 0 0 20px rgba(20, 35, 60, 0.45),
    0 0 22px var(--sg-gold-glow) !important;
  color: var(--sg-text) !important;
}

.rtp-machine-v3::before {
  background: linear-gradient(
    120deg,
    transparent 40%,
    rgba(155, 126, 219, 0.07),
    transparent 65%
  ) !important;
}

.rtp-title-v3 {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 12px var(--sg-gold-glow), 0 0 24px rgba(155, 126, 219, 0.35) !important;
}

.rtp-controls-v3 {
  background: var(--sg-panel) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow: inset 0 0 16px rgba(0, 0, 0, 0.35) !important;
}

.rtp-controls-v3 label {
  color: var(--sg-muted) !important;
}

.rtp-controls-v3 select,
.rtp-controls-v3 input {
  background: var(--sg-panel-2) !important;
  color: var(--sg-text) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.28) !important;
}

#btnRtpRandom {
  background: linear-gradient(145deg, #a67c00, var(--sg-gold-hi)) !important;
  color: #1a1406 !important;
  box-shadow: 0 0 18px var(--sg-gold-glow) !important;
}

#btnRtpRandom:hover {
  filter: brightness(1.06);
}

.rtp-main-result-v3 {
  background: var(--sg-panel-2) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.3) !important;
}

.rtp-status-v3 {
  color: var(--sg-gold-soft) !important;
}

.rtp-highlight-box {
  border-bottom-color: var(--sg-border) !important;
}

.k,
.k-rtp {
  color: var(--sg-muted) !important;
}

.rtp-game-img {
  border-color: var(--sg-border) !important;
  box-shadow: 0 0 14px var(--sg-gold-glow) !important;
}

.provider-info .k-small {
  color: var(--sg-gold-soft) !important;
}

.provider-info .v-small,
.v-game {
  color: var(--sg-text) !important;
}

.v-rtp-huge {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 14px var(--sg-gold-glow), 0 0 28px rgba(155, 126, 219, 0.25) !important;
}

.rtp-details-v3 {
  background: rgba(8, 14, 28, 0.55) !important;
}

.k-detail {
  color: var(--sg-muted) !important;
}

.v-detail {
  color: var(--sg-text) !important;
}

.rtp-tip-v3 {
  color: var(--sg-muted) !important;
}

.rtp-alts-v3 {
  background: rgba(10, 16, 30, 0.72) !important;
  border: 1px solid var(--sg-border) !important;
}

.rtp-alts-title-v3 {
  color: var(--sg-gold-hi) !important;
}

.rtp-alt-item {
  background: rgba(12, 20, 40, 0.92) !important;
  border-left-color: var(--sg-gold) !important;
}

.rtp-alt-item .g {
  color: var(--sg-text) !important;
}

.rtp-alt-item .p {
  color: var(--sg-ice) !important;
}

.rtp-alt-item .r {
  color: var(--sg-violet) !important;
}

.rtp-note-v3 {
  color: var(--sg-muted) !important;
}

.rtp-alt-thumb {
  border-color: var(--sg-border) !important;
}

/* --- Review slider --- */
.tnt-review-mecha {
  background: radial-gradient(circle at center, var(--sg-deep-mid), #050810) !important;
  border: 2px solid var(--sg-border) !important;
  box-shadow:
    0 0 24px var(--sg-gold-glow),
    inset 0 0 22px rgba(30, 45, 80, 0.35) !important;
  color: var(--sg-text) !important;
}

.tnt-review-mecha::before {
  background: repeating-linear-gradient(
    to bottom,
    rgba(155, 126, 219, 0.05),
    rgba(155, 126, 219, 0.05) 1px,
    transparent 2px,
    transparent 4px
  ) !important;
}

.tnt-header h2 {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 12px var(--sg-gold-glow), 0 0 20px rgba(155, 126, 219, 0.35) !important;
}

.tnt-header p {
  color: var(--sg-ice) !important;
}

.tnt-name {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 8px var(--sg-gold-glow) !important;
}

.tnt-comment {
  color: var(--sg-muted) !important;
}

/* --- Qoala / login strip --- */
.qoala-banner {
  background: linear-gradient(135deg, var(--sg-deep) 0%, var(--sg-deep-mid) 50%, #1a1530 100%) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow:
    0 0 16px var(--sg-gold-glow),
    inset 0 0 18px rgba(30, 40, 70, 0.35) !important;
  color: var(--sg-text) !important;
}

.qoala-shield-img {
  filter: drop-shadow(0 0 8px var(--sg-gold-glow)) !important;
}

.qoala-title {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 10px var(--sg-gold-glow) !important;
}

.qoala-subtitle {
  color: var(--sg-muted) !important;
}

.qoala-cta {
  background: rgba(212, 162, 12, 0.2) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow: 0 0 12px var(--sg-gold-glow) !important;
  color: var(--sg-text) !important;
}

.qoala-cta:hover {
  background: rgba(212, 162, 12, 0.35) !important;
  box-shadow: 0 0 16px var(--sg-gold-glow) !important;
}

/* --- Article + FAQ cyber blocks --- */
.cyber-mecha {
  background: radial-gradient(circle at top, var(--sg-deep-mid), #050810 72%) !important;
  border: 1px solid var(--sg-border) !important;
  box-shadow:
    0 0 24px var(--sg-gold-glow),
    inset 0 0 24px rgba(25, 40, 70, 0.25) !important;
}

.cyber-mecha::before {
  background: repeating-linear-gradient(
    to bottom,
    rgba(212, 162, 12, 0.04),
    rgba(212, 162, 12, 0.04) 1px,
    transparent 1px,
    transparent 3px
  ) !important;
}

.pd-full-desc-title {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 14px var(--sg-gold-glow), 0 0 26px rgba(155, 126, 219, 0.3) !important;
}

.faq-item {
  border: 1px solid var(--sg-border) !important;
  background: rgba(12, 20, 38, 0.55) !important;
}

.faq-item:hover {
  border-color: var(--sg-gold) !important;
  box-shadow: 0 0 16px var(--sg-gold-glow) !important;
}

.faq-question {
  color: var(--sg-muted) !important;
}

.faq-question::after {
  color: var(--sg-gold) !important;
}

.faq-answer {
  color: var(--sg-muted) !important;
}

.mecha-header h3 {
  color: var(--sg-gold-soft) !important;
  text-shadow: 0 0 12px var(--sg-gold-glow) !important;
}

.mecha-content p {
  color: var(--sg-muted) !important;
}

.glow {
  color: var(--sg-gold-hi) !important;
  text-shadow: 0 0 10px var(--sg-gold-glow), 0 0 20px rgba(155, 126, 219, 0.25) !important;
}

.glow-strong {
  color: var(--sg-gold-soft) !important;
  text-shadow: 0 0 12px var(--sg-gold-glow), 0 0 24px rgba(155, 126, 219, 0.28) !important;
}

.final-line {
  border: 1px solid var(--sg-border) !important;
  background: rgba(212, 162, 12, 0.08) !important;
  box-shadow: 0 0 14px var(--sg-gold-glow) !important;
  color: var(--sg-text) !important;
}