:root {
  --bg-color: #05080d;
  --surface: rgba(10, 17, 27, .88);
  --surface-2: rgba(17, 29, 43, .92);
  --text-first: #f4fbff;
  --text-muted: #a8bac8;
  --text-second: #031014;
  --first-color: #dce8ef;
  --second-color: #55efff;
  --third-color: #15d7ed;
  --fourth-color: #8aebff;
  --fifth-color: #9eaeb9;
  --g1: #56efff;
  --g2: #aab9c4;
  --border: rgba(132, 231, 255, .28);
  --shadow: 0 18px 50px rgba(0, 0, 0, .38), 0 0 28px rgba(65, 224, 255, .08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; color-scheme: dark; }
body {
  min-height: 100vh;
  margin: 0;
  padding-bottom: 72px;
  background-color: var(--bg-color) !important;
  background-image:
    radial-gradient(circle at 20% 0%, rgba(58, 214, 244, .15), transparent 34%),
    radial-gradient(circle at 90% 12%, rgba(190, 205, 216, .11), transparent 28%),
    linear-gradient(145deg, #05080d 0%, #07111b 48%, #030609 100%) !important;
  color: var(--text-first);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .34;
  background-image: linear-gradient(rgba(95,230,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(95,230,255,.025) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, #000, transparent 90%);
}
.container { width: min(1440px, calc(100% - 24px)); max-width: 1440px; }
.logo img { width: min(290px, 70vw); margin-top: 20px; filter: drop-shadow(0 0 18px rgba(65,225,255,.25)); }
.slider-wrapper { border: 1px solid var(--border); border-radius: 18px !important; overflow: hidden; background: var(--surface); box-shadow: var(--shadow); }
.slider { padding: 10px; }
.slider-img { width: 100%; max-height: 390px; object-fit: cover; border-radius: 12px; }
.running-text { overflow: hidden; padding: 9px 14px; background: linear-gradient(90deg, #55efff, #b7c6d0, #55efff); color: #031014; font-size: clamp(.72rem, 2vw, .9rem); letter-spacing: .04em; }
.running-text marquee { display: block; }
.btn-credit { min-height: 48px; background: linear-gradient(135deg, #62efff, #9eafb9); color: #031014; transition: transform .2s ease, filter .2s ease; }
.btn-credit:hover, .btn-credit:focus-visible { transform: translateY(-1px); filter: brightness(1.08); }
.icon-prov { justify-content: flex-start; gap: 4px; margin-bottom: 20px; padding: 8px; background: rgba(8, 18, 28, .9); border: 1px solid var(--border); border-top: 0; scrollbar-width: thin; }
.item-prov { flex: 0 0 auto; padding: 0 5px; }
.icon-card-bg { min-width: 82px; border-radius: 12px; transition: background-color .2s ease, transform .2s ease; color: var(--text-first); }
.icon-card-bg:hover { background: rgba(80, 226, 255, .1); transform: translateY(-2px); }
.icon-card-bg p { margin: 0; color: var(--text-first); font-size: .68rem; }
.img-prov { width: 48px; height: 34px; object-fit: contain; }
.rtp-toolbar { position: sticky; top: 8px; z-index: 20; display: grid; grid-template-columns: minmax(180px, 1fr) minmax(150px, 220px) auto; gap: 10px; align-items: center; margin: 16px 0; padding: 10px; border: 1px solid var(--border); border-radius: 15px; background: rgba(5, 12, 19, .82); backdrop-filter: blur(16px); box-shadow: 0 12px 35px rgba(0,0,0,.25); }
.rtp-search, .rtp-filter { width: 100%; min-height: 42px; border: 1px solid rgba(116,226,249,.25); border-radius: 10px; padding: 8px 12px; outline: none; background: #0b1621; color: var(--text-first); }
.rtp-search:focus, .rtp-filter:focus { border-color: var(--second-color); box-shadow: 0 0 0 3px rgba(85,239,255,.12); }
.rtp-result { color: var(--text-muted); white-space: nowrap; font-size: .82rem; }
.rtp-grid { align-items: stretch; content-visibility: auto; }
.rtp-card { width: 100%; height: 100%; min-height: 190px; margin-bottom: 14px; padding: 8px; border: 1px solid rgba(121, 226, 247, .24); border-radius: 15px; background: linear-gradient(145deg, rgba(19,35,49,.95), rgba(7,13,20,.98)); box-shadow: 0 10px 26px rgba(0,0,0,.28); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; contain: layout paint style; }
.rtp-card:hover { transform: translateY(-3px); border-color: rgba(89,235,255,.58); box-shadow: 0 16px 34px rgba(0,0,0,.38), 0 0 20px rgba(61,220,247,.08); }
.place-img-rtp { min-height: 160px; padding: 0; border-radius: 11px; background: #08111a; box-shadow: none; }
.rtp-card-img { width: 100%; height: 174px; object-fit: cover; border-radius: 11px; background: #0b151f; transition: opacity .25s ease, transform .25s ease; }
.rtp-card:hover .rtp-card-img { transform: scale(1.015); }
.image-error { opacity: .35; object-fit: contain; }
.btn-play { width: min(150px, 76%); min-height: 34px; border: 1px solid rgba(255,255,255,.65); background: linear-gradient(135deg, rgba(83,235,255,.95), rgba(173,190,202,.96)); color: #031014; box-shadow: 0 8px 20px rgba(0,0,0,.34); opacity: 0; transform: translate(-50%, -45%); transition: opacity .2s ease, transform .2s ease; }
.place-img-rtp:hover .btn-play, .btn-play:focus-visible { opacity: 1; transform: translate(-50%, -50%); }
.pola-wrapper { width: 100%; min-height: 174px; padding: 11px; border: 1px solid rgba(255,255,255,.05); border-radius: 11px; background: linear-gradient(180deg, rgba(5,11,17,.98), rgba(12,22,31,.98)); }
.pola-wrapper hr { margin: 7px 0; border-color: rgba(105,230,255,.24); }
.pola-wrapper h4 { margin: 0; color: #dffaff; font-size: .78rem; }
.pola-wrapper h5 { min-height: 30px; margin: 8px 0 0 !important; color: var(--text-muted); font-size: .65rem; }
.table-pola { width: 100%; }
.table-pola tr td { padding: 2px; color: #d4e8f1; font-size: .66rem; }
.percent { position: relative; height: 24px; overflow: hidden; border: 1px solid rgba(127,225,246,.18); border-radius: 999px; background: #071019; }
.percent p { position: relative; z-index: 2; margin: 0; line-height: 22px; color: #fff; font-size: .72rem; font-weight: 800; text-shadow: 0 1px 3px rgba(0,0,0,.8); }
.percent-bar { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: linear-gradient(90deg, #29c9dd, #67f0ff); transition: width .75s cubic-bezier(.2,.7,.2,1); }
.percent-bar.is-medium { background: linear-gradient(90deg, #7fa8bd, #56dff0); }
.percent-bar.is-low { background: linear-gradient(90deg, #526270, #8a9eab); }
.icon-providers { top: 7px; right: 7px; opacity: .8; }
.top-game, .hot-game { background-size: contain !important; pointer-events: none; }
.btn-up { position: fixed; right: 16px; bottom: 78px; z-index: 30; opacity: 0; visibility: hidden; transform: translateY(10px); border-color: var(--second-color); background: #0b1721; color: var(--second-color); transition: .2s ease; }
.btn-up.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-bottom { border-top: 1px solid rgba(92,231,255,.38); background: rgba(3,8,13,.9); backdrop-filter: blur(16px); }
.item-nav-bottom { min-height: 56px; padding: 7px 4px; background: transparent; color: #dff8ff; border-right: 1px solid rgba(255,255,255,.05); cursor: pointer; }
.item-nav-bottom p { margin: 2px 0 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }
@media (max-width: 991.98px) { .rtp-card { min-height: 0; } .rtp-card-img, .pola-wrapper { min-height: 150px; height: 150px; } .place-img-rtp { min-height: 150px; } }
@media (max-width: 767.98px) { .container { width: min(100% - 14px, 1440px); padding-inline: 0; } .rtp-toolbar { top: 4px; grid-template-columns: 1fr 145px; } .rtp-result { grid-column: 1 / -1; } .rtp-card { padding: 6px; border-radius: 12px; } .rtp-card > .row { display: block; } .rtp-card > .row > [class*="col-"] { width: 100%; } .rtp-card-img, .pola-wrapper, .place-img-rtp { min-height: 0; height: auto; } .rtp-card-img { aspect-ratio: 1 / 1; } .pola-wrapper { margin-top: 6px; } .btn-play { opacity: .92; } }
@media (max-width: 480px) { body { padding-bottom: 64px; } .logo img { margin-top: 12px; } .slider-wrapper { border-radius: 12px !important; } .slider { padding: 5px; } .rtp-toolbar { grid-template-columns: 1fr; border-radius: 12px; } .rtp-result { grid-column: auto; } .rtp-grid > .col-6 { width: 50%; padding-inline: 3px; } .rtp-card { margin-bottom: 7px; } .pola-wrapper { padding: 7px 5px; } .pola-wrapper h4 { font-size: .69rem; } .pola-wrapper h5, .table-pola tr td { font-size: .58rem; } .icon-providers { display: none; } .btn-play { width: 82%; font-size: .55rem; } .item-nav-bottom { min-height: 52px; font-size: .65rem !important; } }


/* Smart blue UI v2 */
:root{--bg-color:#030b13;--surface:rgba(6,22,36,.92);--surface-2:rgba(8,31,49,.96);--text-first:#f2fcff;--text-muted:#9ec7d8;--second-color:#52e7ff;--third-color:#14cce9;--fourth-color:#a8f4ff;--border:rgba(82,231,255,.34);--shadow:0 18px 52px rgba(0,0,0,.44),0 0 34px rgba(49,215,255,.12)}
body{background-image:radial-gradient(circle at 50% -10%,rgba(69,224,255,.24),transparent 34%),radial-gradient(circle at 100% 25%,rgba(69,173,255,.12),transparent 28%),linear-gradient(155deg,#02070c 0%,#061725 52%,#02080e 100%)!important}
.quick-actions{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin:10px 0 16px}
.quick-action{display:flex;align-items:center;gap:9px;min-height:64px;padding:10px;border:1px solid rgba(82,231,255,.28);border-radius:14px;background:linear-gradient(145deg,rgba(12,42,65,.94),rgba(4,18,29,.98));color:var(--text-first);text-decoration:none;box-shadow:0 8px 22px rgba(0,0,0,.24);transition:.2s ease}
.quick-action:hover,.quick-action:focus-visible{color:#fff;border-color:#62eaff;transform:translateY(-2px);box-shadow:0 12px 28px rgba(0,0,0,.34),0 0 18px rgba(55,220,255,.14)}
.quick-action-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:11px;background:linear-gradient(135deg,#45dcf7,#b5f5ff);color:#04121c;box-shadow:0 0 16px rgba(75,225,255,.25)}
.quick-action svg,.nav-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.quick-action strong{display:block;font-size:.78rem}.quick-action small{display:block;color:var(--text-muted);font-size:.62rem;margin-top:2px}
.rtp-toolbar{grid-template-columns:minmax(170px,1fr) minmax(145px,190px) minmax(145px,190px) auto;background:rgba(3,17,28,.9);border-color:rgba(77,226,255,.38)}
.smart-status{display:flex;align-items:center;gap:9px}.smart-status strong,.smart-status small{display:block}.smart-status strong{font-size:.84rem;color:#dffbff}.smart-status small{font-size:.65rem;color:var(--text-muted)}.live-dot{width:10px;height:10px;border-radius:50%;background:#55eaff;box-shadow:0 0 0 5px rgba(85,234,255,.1),0 0 16px #55eaff;animation:livePulse 1.8s infinite}@keyframes livePulse{50%{opacity:.5;transform:scale(.82)}}
.rtp-filter,.rtp-sort{width:100%;min-height:42px;border:1px solid rgba(116,226,249,.3);border-radius:10px;padding:8px 12px;background:#071b2a;color:var(--text-first);outline:none}.rtp-filter:focus,.rtp-sort:focus{border-color:#55eaff;box-shadow:0 0 0 3px rgba(85,239,255,.12)}
.pola-wrapper h5.is-active{color:#69efff;text-shadow:0 0 12px rgba(83,232,255,.4)}
.nav-bottom{display:grid!important;grid-template-columns:repeat(5,1fr);padding-bottom:env(safe-area-inset-bottom);background:rgba(2,13,22,.94)!important}.item-nav-bottom{display:flex!important;flex-direction:column;align-items:center;justify-content:center;text-decoration:none!important;color:#dffaff!important}.nav-icon{display:grid;place-items:center}.nav-icon svg{width:22px;height:22px}.item-nav-bottom span:last-child{font-size:.66rem;margin-top:3px}.item-nav-bottom:hover,.item-nav-bottom:focus-visible{background:rgba(70,222,255,.11);color:#62eaff!important}
.btn-credit{border:1px solid rgba(255,255,255,.35)!important;background:linear-gradient(135deg,#3bdaf5,#a9eff9)!important}.percent-bar{background:linear-gradient(90deg,#10bcd9,#69edff)!important}.percent-bar.is-medium{background:linear-gradient(90deg,#258caf,#57dff3)!important}.percent-bar.is-low{background:linear-gradient(90deg,#31566d,#5999b4)!important}
@media(max-width:1100px){.quick-actions{grid-template-columns:repeat(4,1fr)}}
@media(max-width:767.98px){.quick-actions{grid-template-columns:repeat(2,1fr);gap:6px}.quick-action{min-height:58px;padding:8px}.rtp-toolbar{grid-template-columns:1fr 1fr}.smart-status{grid-column:1/-1}.rtp-result{grid-column:1/-1}.quick-action strong{font-size:.72rem}}
@media(max-width:420px){.quick-action-icon{width:32px;height:32px;flex-basis:32px}.quick-action small{display:none}.rtp-toolbar{grid-template-columns:1fr}.smart-status,.rtp-result{grid-column:auto}.item-nav-bottom span:last-child{font-size:.58rem}}


/* =========================================================
   KUDAJP SIGNATURE THEME — DOMINANT BLACK / GOLD / SILVER
   ========================================================= */
:root{--bg-color:#020202;--surface:rgba(8,8,8,.97);--surface-2:rgba(15,15,15,.98);--text-first:#f5f4ef;--text-muted:#aaa9a3;--text-second:#050505;--first-color:#e7e7e3;--second-color:#f4c84d;--third-color:#c99622;--fourth-color:#f8e395;--fifth-color:#989894;--g1:#f4c84d;--g2:#a87813;--border:rgba(244,200,77,.25);--shadow:0 20px 58px rgba(0,0,0,.66),0 0 30px rgba(244,200,77,.065)}
body{background-color:#020202!important;background-image:radial-gradient(circle at 50% -10%,rgba(244,200,77,.115),transparent 30%),radial-gradient(circle at 92% 16%,rgba(205,205,198,.05),transparent 24%),linear-gradient(155deg,#010101 0%,#090909 48%,#020202 100%)!important;color:#f5f4ef}
body::before{opacity:.38;background-image:linear-gradient(rgba(244,200,77,.016) 1px,transparent 1px),linear-gradient(90deg,rgba(244,200,77,.016) 1px,transparent 1px)}
.logo.kudajp-logo img{width:min(320px,76vw);height:auto;filter:drop-shadow(0 0 22px rgba(244,200,77,.18))}
.slider-wrapper{background:linear-gradient(180deg,rgba(12,12,12,.99),rgba(4,4,4,.99));border-color:rgba(244,200,77,.24);box-shadow:var(--shadow)}
.running-text{background:linear-gradient(90deg,#856011 0%,#f0cb56 28%,#d7d7d2 50%,#f0cb56 72%,#856011 100%);color:#070707;font-weight:850}
.access-primary .btn-credit,.btn-credit{border:1px solid rgba(244,200,77,.48)!important;background:linear-gradient(135deg,#f6d667 0%,#bc8618 58%,#deded9 135%)!important;color:#060606!important;font-weight:900;letter-spacing:.045em}
.quick-action{border-color:rgba(244,200,77,.19);background:linear-gradient(145deg,rgba(17,17,17,.99),rgba(4,4,4,.995));box-shadow:0 11px 28px rgba(0,0,0,.5)}
.quick-action:hover,.quick-action:focus-visible{color:#fff;border-color:rgba(244,200,77,.7);box-shadow:0 15px 32px rgba(0,0,0,.62),0 0 18px rgba(244,200,77,.09)}
.quick-action-icon{background:linear-gradient(145deg,#f7d86a,#ad7914);color:#070707;box-shadow:0 0 18px rgba(244,200,77,.11)}
.quick-action small{color:#aaa9a3}.icon-prov{background:linear-gradient(180deg,rgba(12,12,12,.99),rgba(4,4,4,.995));border-color:rgba(244,200,77,.19)}
.icon-card-bg p{color:#d8d7d2}.icon-card-bg:hover,.icon-card-bg.active{background:linear-gradient(180deg,rgba(244,200,77,.125),rgba(244,200,77,.04));box-shadow:inset 0 0 0 1px rgba(244,200,77,.20)}
.provider-heading{border-bottom:1px solid rgba(244,200,77,.14);padding-bottom:10px}.provider-heading .title-game,.title-game{color:#f3f2ed;text-shadow:0 0 16px rgba(244,200,77,.07)}.provider-count{color:#d4b65b}
.rtp-toolbar{background:rgba(6,6,6,.94);border-color:rgba(244,200,77,.22);box-shadow:0 15px 40px rgba(0,0,0,.5)}.live-dot{background:#f4c84d;box-shadow:0 0 0 5px rgba(244,200,77,.075),0 0 16px rgba(244,200,77,.66)}
.rtp-filter,.rtp-sort,.rtp-search{background:#0c0c0c;border-color:rgba(198,198,191,.16);color:#f3f2ee}.rtp-filter:focus,.rtp-sort:focus,.rtp-search:focus{border-color:#d1aa35;box-shadow:0 0 0 3px rgba(244,200,77,.085)}
.rtp-card{border-color:rgba(205,205,198,.12);background:linear-gradient(145deg,rgba(16,16,16,.99),rgba(3,3,3,.997));box-shadow:0 12px 31px rgba(0,0,0,.58)}.rtp-card:hover{border-color:rgba(244,200,77,.44);box-shadow:0 18px 40px rgba(0,0,0,.7),0 0 20px rgba(244,200,77,.055)}
.place-img-rtp,.rtp-card-img{background:#070707}.btn-play{border-color:rgba(244,200,77,.6);background:linear-gradient(135deg,#f4d262,#ac7613);color:#060606;font-weight:850}.pola-wrapper{border-color:rgba(207,207,200,.075);background:linear-gradient(180deg,rgba(4,4,4,.998),rgba(12,12,12,.995))}.pola-wrapper hr{border-color:rgba(244,200,77,.16)}.pola-wrapper h4{color:#e9e8e2}.pola-wrapper h5.is-active{color:#f2cb54;text-shadow:0 0 12px rgba(244,200,77,.16)}
.percent{background:#060606;border-color:rgba(201,201,194,.13)}.percent-bar{background:linear-gradient(90deg,#9a6910,#f0ca55)!important}.percent-bar.is-medium{background:linear-gradient(90deg,#6d6d69,#c39e38)!important}.percent-bar.is-low{background:linear-gradient(90deg,#353533,#858580)!important}
.btn-up{background:#090909;border-color:#cda532;color:#f1cb55}.nav-bottom{background:rgba(2,2,2,.975)!important;border-top-color:rgba(244,200,77,.27);box-shadow:0 -10px 30px rgba(0,0,0,.38)}.item-nav-bottom{color:#dddcd6!important}.item-nav-bottom:hover,.item-nav-bottom:focus-visible{background:rgba(244,200,77,.075);color:#f1ca54!important}
.seo-panel{margin:28px 0 92px;padding:18px;border:1px solid rgba(244,200,77,.18);border-radius:16px;background:linear-gradient(145deg,rgba(13,13,13,.98),rgba(5,5,5,.99));box-shadow:0 14px 34px rgba(0,0,0,.38)}.seo-panel h2{margin:0 0 10px;color:#f1ca54;font-size:clamp(1.05rem,2.5vw,1.35rem)}.seo-panel p{color:#bbb9b1;font-size:.82rem;line-height:1.7}.seo-faq{display:grid;gap:7px;margin-top:12px}.seo-faq details{border:1px solid rgba(205,205,198,.11);border-radius:10px;background:#090909}.seo-faq summary{cursor:pointer;padding:10px 12px;color:#e8e6df;font-size:.8rem;font-weight:750}.seo-faq details p{margin:0;padding:0 12px 12px}