:root {--bg1: #131831;--bg2: #16213e;--bg3: #0e172c;--bg4: #060b18;--gold0: #fffb00;--gold1: #ffcc00;--gold2: #ffa600;--gold3: #ff9100;--green: #88ff00;--green1: #3b6e00;--green2:#0c8f00;--text0: #ffffff;--text1: #e9e9e9;--text2: #bdbdbd;--text3: #444444;--red: #b60000;--glass1: rgba(255, 255, 255, 0.04);--glass2: rgba(255, 255, 255, 0.1);--glass3: rgba(0, 0, 0, 0.25);--glass4: rgba(0, 0, 0, 0.5);--glass5: rgba(7, 10, 24, 0.952);--glass6: rgba(0, 0, 0, 0.952);--shadow1: rgba(255,255,255,0.1) 0, rgba(255,255,255,0.1) 8px;--shadow2: rgba(0,0,0,0.2) 8px, rgba(0,0,0,0.2) 16px;}
body {background: var(--bg4);color: var(--text2);font-family: Arial, Helvetica, sans-serif;margin: 0;}
a {color: inherit;text-decoration: none;}
.wrap {max-width: 1100px;margin: 0 auto;}
.site-header {z-index: 10;background: var(--glass4);border-bottom: 1px solid var(--gold1);}
.logo-img {height: 60px;object-fit: contain;visibility: hidden;opacity: 0;transition: opacity 0.3s ease;}
.header-btn {display: flex;align-items: center;justify-content: center;gap: 6px;font-weight: 700;font-size: 0.875rem;padding: 10px 18px;min-height: 42px;border-radius: 8px;border: 1px solid transparent;transition: all 0.25s ease;}
.header-btn:hover {transform: translateY(-2px);}
.header-btn-login {background: transparent;border-color: var(--gold0);color: var(--gold0);}
.header-btn-login:hover {background: var(--gold1);border-color: var(--gold2);color: var(--bg1);}
.header-btn-register {background: var(--gold0);border-color: var(--gold2);color: var(--bg1);}
.header-btn-register:hover {background: transparent;border-color: var(--gold1);color: var(--text2);}
.header-btn-whatsapp {background: var(--green);border-color: var(--green1);color: var(--bg1);}
.header-btn-whatsapp:hover {background: transparent;border-color: var(--green);color: var(--text2);}
.header-btn-whatsapp i {font-size: 1rem;}

.marquee-wrap {display: flex;align-items: center;gap: 12px;overflow: hidden;padding: 8px 0;border-radius: 6px;}
.marquee-left {display: flex;align-items: center;gap: 6px;white-space: nowrap;color: var(--text2);flex-shrink: 0;font-size: 0.85rem;}
.marquee {flex-grow: 1;overflow: hidden;white-space: nowrap;color: var(--text2);}
.marquee span {display: inline-block;padding-left: 100%;animation: marquee 12s linear infinite;}
.marquee:hover span {color: var(--gold0);animation-play-state: paused;}
@keyframes marquee {0% { transform: translateX(0); }100% { transform: translateX(-100%); }}

.left-frame {background-color: var(--bg3);border-radius: 8px;padding: 16px;display: flex;flex-direction: column;justify-content: space-between;min-height: 300px;color: var(--text2);}
#h1-text {font-family: "Orbitron", sans-serif;font-size: 1.5rem;font-weight: 600;color: var(--gold0);line-height: 1.2;margin-bottom: 0.75rem;}
#p {font-size: 1rem;color: var(--text2);line-height: 1.5;margin-bottom: 0;}
#login-btn-left, #register-btn-left {display: inline-flex;align-items: center;gap: 6px;font-weight: 700;font-size: 0.875rem;padding: 8px 16px;border-radius: 8px;border: 1px solid transparent;text-decoration: none;transition: all 0.3s ease;cursor: pointer;}
#login-btn-left {background: transparent;color: var(--gold0);border-color: var(--gold0);}
#login-btn-left:hover {background: var(--gold1);color: var(--bg1);transform: translateY(-2px) scale(1.05);}
#register-btn-left {background: var(--gold0);color: var(--bg1);border-color: var(--gold2);}
#register-btn-left:hover {background: transparent;color: var(--text2);border-color: var(--gold1);transform: translateY(-2px) scale(1.05);}
#login-btn-left i, #register-btn-left i {font-size: 1rem;}

.banner-frame {border-radius: 8px;position: relative;height: 100%;overflow: hidden;}
.banner-slider {width: 100%;height: 100%;border-radius: 8px;object-fit: cover;}
.banner-slider img {width: 100%;height: 100%;display: block;object-fit: cover;transform-style: preserve-3d;transform-origin: center center;}
.slider-btn {position: absolute;top: 50%;transform: translateY(-50%);background: transparent;border: none;color: var(--text0);padding: 8px 12px;cursor: pointer;font-size: 20px;border-radius: 6px;z-index: 5;transition: transform 0.4s ease-in-out, color 0.4s ease-in-out;}
.slider-btn:hover {color: var(--gold0);transform: translateY(-50%) scale(1.1);}
.slider-btn.prev { left: 10px; }
.slider-btn.next { right: 10px; }
.provider-bar-modern {position: relative;border-radius: 8px;padding: 10px;background: linear-gradient(to bottom, var(--gold2) 0%, var(--gold1) 100%);box-shadow: inset 0 4px 8px var(--glass4),inset 0 -4px 8px var(--glass4);border: 2px solid var(--gold0);transition: all 0.3s ease;}
.providers-wrapper {display: flex;gap: 8px;overflow-x: auto;scroll-behavior: smooth;padding-right: 8px;}
.provider-item {flex: 0 0 auto;text-align: center;font-weight: 700;}
.provider-card {background: transparent;border: 1px solid var(--gold0);box-shadow: inset 0 2px 6px var(--glass3);border-radius: 8px;padding: 8px 6px;width: 90px;cursor: pointer;transition: transform 0.3s ease, box-shadow 0.3s ease;display: flex;flex-direction: column;align-items: center;gap: 10px;overflow: hidden;}
.provider-card img {width: 60px;height: 60px;background: var(--bg1);object-fit: contain;border-radius: 8px;transition: all 0.3s ease;}
.provider-card:hover img {filter: grayscale(100%);}
.provider-name {font-size: 11px;font-weight: 700;text-align: center;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;width: 100%;color: var(--bg4);}
.provider-test-label {display: block;color: var(--text2);text-align: left;max-width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.provider-title {font-weight: bold;font-size: 20px;color: var(--text2);}
.provider-rating {font-size: 17px;display: block;margin-top: 2px;color: var(--gold1);}

.rtp-wrapper {background: linear-gradient(180deg, var(--gold3), var(--gold2), var(--gold1)); padding: 8px 10px; border-radius: 5px; display: flex; flex-direction: row; align-items: center; gap: 4px;width: 100%;box-sizing: border-box;transition: all 0.3s ease;}
.rtp-frame {flex: 0 0 180px;border-radius: 5px;border: 1px solid var(--glass4);box-shadow: inset 0 0 10px var(--glass6);overflow: hidden;background: transparent;display: flex;justify-content: center;align-items: center;padding: 0;transition: all 0.3s ease;}
.rtp-inner-frame {width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;position: relative;border-radius: 5px;overflow: hidden;transition: all 0.3s ease;}
.rtp-inner-frame img {width: 100%;height: 100%;object-fit: contain;border-radius: inherit;transform: scale(0.91);transition: transform 0.5s ease, filter 0.5s ease;}
.rtp-inner-frame:hover img {transform: scale(1);filter: grayscale(100%);}
.overlay-btn {position: absolute;inset: 0;display: flex;justify-content: center;align-items: center;opacity: 0;transition: opacity 0.3s;}
.rtp-inner-frame:hover .overlay-btn {opacity: 1;}
.overlay-btn button {padding: 4px 12px;font-size: 11px;font-weight: 700;border-radius: 6px;border: 2px solid var(--glass3);background: linear-gradient(180deg, var(--gold3), var(--gold2), var(--gold1));color: var(--bg4);cursor: pointer;transition: background 0.3s ease, color 0.3s ease;}
.overlay-btn button:hover {background: linear-gradient(180deg, var(--gold1), var(--gold2), var(--gold3));color: var(--text0);}
.rtp-info {flex: 1;display: flex;flex-direction: column;justify-content: center;padding: 8px 10px;background: var(--bg4);border-radius: 5px;}
.rtp-info .title {font-size: 15px;font-weight: 700;color: var(--text2);margin-bottom: 6px;display: flex;justify-content: center;align-items: center;gap: 6px;padding-bottom: 4px;border-bottom: 1px solid var(--text3);text-align: center;}
.rtp-info table {width: 100%;font-size: 11px;margin: 6px 0;border-collapse: collapse;}
.rtp-info td {padding: 2px 0;color: var(--text2);}
.rtp-info .rtp-time {margin-top: 8px;padding-top: 6px;border-top: 1px solid var(--text3);font-size: 11px;color: var(--text2);text-align: center;}
.percent {height: 25px;overflow: hidden;position: relative;margin-top: 8px;border-radius: 5px;background: var(--text0);}
.percent-bar {height: 100%;width: 0%;border-radius: inherit;position: relative;overflow: hidden;transition: width 1.5s ease;}
.percent-bar::before {content: '';position: absolute;top: 0;left: 0;width: 200%;height: 100%;pointer-events: none;background: repeating-linear-gradient(45deg,var(--shadow1),var(--shadow2));background-size: 160px 100%;animation: moveBgSlow 12s linear infinite;z-index: 1;border-radius: inherit;}
@keyframes moveBgSlow {0% { transform: translateX(0); }100% { transform: translateX(-50%); }}
.percent-text {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 2;font-weight: bold;font-size: 14px;color: var(--bg4);}
.pola-symbol-display {display: inline-flex;justify-content: center;align-items: center;width: 18px;height: 18px;border-radius: 50%;font-weight: bold;font-size: 14px;}
.pola-symbol-display[data-symbol="✔"] { background-color: var(--green2); color: var(--text0); }
.pola-symbol-display[data-symbol="×"] { background-color: var(--red); color: var(--text0); }

#rtp-readmore-btn {display: inline-block;margin: 12px auto;padding: 6px 16px;border-radius: 6px;border: 1px solid var(--text2);background: transparent;color: var(--text2);font-weight: 700;font-size: 12px;text-transform: uppercase;cursor: pointer;transition: all 0.3s ease;}
#rtp-readmore-btn:hover {border-color: var(--gold0);color: var(--gold0);transform: none;}
#scrollTopBtn {position: fixed;bottom: 16px;right: 16px;z-index: 999;display: none;width: 40px;height: 40px;border-radius: 6px;background: linear-gradient(135deg, var(--gold3), var(--gold2));color: var(--bg4);border: none;cursor: pointer;box-shadow: 0 4px 12px var(--glass5);display: flex;justify-content: center;align-items: center;font-size: 18px;transition: all 0.3s ease;}
#scrollTopBtn:hover {transform: translateY(-2px) scale(1.05);opacity: 0.9;color: var(--text0);}
#scrollTopBtn i {font-size: 20px;}

.top-footer{background:var(--bg1);padding:15px 0px;transition:all 0.3s ease;}
.top-footer a{color: var(--accent1);transition:color 0.3s ease;}
.top-footer a:hover{color: var(--gold0);}
.top-footer .container{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:24px;}
.footer-top-row,.footer-bottom-row{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;}
.footer-col{display:flex;flex-direction:column;gap:5px;flex:1;transition: all 0.3s ease;}
.footer-col .title{font-family:Orbitron,sans-serif;font-weight:700;font-size:17px;color:var(--accent1);display:flex;align-items:center;gap:6px;transition:all 0.3s ease;}
.footer-col .content-text{color:var(--text2);max-width:300px;display:block;padding:5px;transition:all 0.3s ease;}
.footer-col .content-text img{max-width:150px;height:auto;border-radius:8px;display:block;margin:0;transition:all 0.3s ease;}
.icon-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-start;padding:0 4px;transition:all 0.3s ease;}
.icon-row img{cursor:pointer;object-fit:contain;display:block;filter:none;transition:all 0.3s ease;opacity:1;transform:translateY(10px);}
.icon-row img.loaded{opacity:1;transform:translateY(0);transition:all 0.5s ease;}
.cm-image{max-width:300px;height:auto;border-radius:8px;transition:all 0.3s ease;}
.security-ftrmerge img{width:90px;height:40px;transition:all 0.3s ease;}
.paymentMethod-ftrmerge img{width:40px;height:36px;transition:all 0.3s ease;}
.responsibleGaming-ftrmerge img{width:45px;height:36px;transition:all 0.3s ease;}
.license-ftrmerge img{width:60px;height:40px;transition:all 0.3s ease;}

@media (max-width: 768px) {
.wrap{padding:0 5px;box-sizing:border-box;}
.logo-img {height: 50px;opacity: 1;}
.header-btn-login, .header-btn-register {display: none;}
.header-btn-whatsapp {font-size: 0.75rem;padding: 6px 12px;min-height: 30px;}
.header-btn {gap: 4px;}
.left-frame {padding: 12px;min-height: auto;}
#h1-text {font-size: 1.1rem;margin-bottom: 0.5rem;}
#p {font-size: 0.9rem;line-height: 1.3;}
#login-btn-left, #register-btn-left {font-size: 0.75rem;padding: 8px 15px;gap: 5px;}
.banner-frame {display: none;}
.provider-bar-modern {padding: 8px;border-radius: 6px;border-width: 1.5px;margin-top: 0;}
.providers-wrapper {gap: 4px;padding-right: 4px;}
.provider-card {width: 70px; padding: 6px 4px;gap: 6px;}
.provider-card img {width: 50px;height: 50px;}
.provider-name {font-size: 10px;}
.provider-title {font-size: 17px;}
.provider-rating {font-size: 15px;}
.provider-test-label {font-size: 10px;}
.rtp-wrapper {flex-direction: column;gap: 6px;padding: 6px;width: 100%;}
.rtp-frame {flex: 0 0 auto;width: 100%;max-height: auto;border-radius: 5px;}
.rtp-inner-frame {height: 100%;border-radius: 5px;}
.rtp-inner-frame img {transform: scale(0.9);}
.overlay-btn button {font-size: 10px;padding: 3px 8px;border-radius: 5px;}
.rtp-info {width: 100%;padding: 6px 8px;border-radius: 5px;}
.rtp-info .title {font-size: 13px;gap: 4px;}
.rtp-info table {font-size: 12px;}
.percent {height: 18px;margin-top: 6px;}
.percent-text {font-size: 12px;}
.pola-symbol-display {width: 16px;height: 16px;font-size: 12px;}
.top-footer {padding: 15px 10px;}
.top-footer .container {flex-direction: column;gap: 16px;}
.footer-top-row, .footer-bottom-row {flex-direction: column;gap: 12px;align-items: flex-start;}
.footer-col {width: 100%;flex: none;}
.footer-col .title {font-size: 15px;gap: 4px;}
.footer-col .content-text {max-width: 100%;font-size: 13px;padding: 3px 0;}
.footer-col .content-text img {max-width: 100px;}
.icon-row {justify-content: flex-start;gap: 8px;padding: 0;}
.icon-row img {width: 30px;height: 30px;transform: translateY(0);}
.cm-image {max-width: 250px;}
.security-ftrmerge img {width: 70px;height: 30px;}
.paymentMethod-ftrmerge img {width: 35px;height: 32px;}
.responsibleGaming-ftrmerge img {width: 40px;height: 32px;}
.license-ftrmerge img {width: 50px;height: 35px;}}