
:root {
    --color-primary: #00fbc8;
    --color-secondary: #ff2e09;
    --color-bg: #323234;
    --color-header: #000000;
    --color-text-light: #ffffff;
    --color-text-muted: #b8b8b8;
    --color-card-bg: #2a2a2c;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'PT Sans', sans-serif;
    background-color: var(--color-bg);
    color: var(--color-text-light);
    line-height: 1.6;
    overflow-x: hidden;
}

.wrapper-main { min-height: 100vh; display: flex; flex-direction: column; }
.main-content { flex: 1; }

.gd9k3jx {
    background-color: var(--color-header);
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.px7m2qw { padding: 0 1rem; }
.rt5nx8v { display: inline-block; }
.hq2j9mk { max-height: 50px; width: auto; }

.burger-menu.wm7q5kn {
    background: transparent;
    border: none;
    display: flex;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 5px;
}

.burger-menu.wm7q5kn span {
    display: block;
    width: 25px;
    height: 3px;
    background: var(--color-primary);
    transition: all 0.3s;
    border-radius: 2px;
}

.burger-menu.wm7q5kn.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.burger-menu.wm7q5kn.active span:nth-child(2) { opacity: 0; }
.burger-menu.wm7q5kn.active span:nth-child(3) { transform: rotate(-45deg) translate(7px, -6px); }

.mobile-menu.qm8k3vx {
    display: none;
    background: #1a1a1c;
    padding: 1rem;
    border-top: 2px solid var(--color-primary);
}

.mobile-menu.qm8k3vx.active { display: block; animation: slideDown 0.3s ease; }

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

.fp2n7kx li { padding: 0.5rem 0; }
.fp2n7kx a {
    color: var(--color-text-light);
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s;
}
.fp2n7kx a:hover { color: var(--color-primary); }

.yn3k2mp .nav-link {
    color: var(--color-text-light) !important;
    font-weight: 600;
    transition: color 0.3s;
}
.yn3k2mp .nav-link:hover { color: var(--color-primary) !important; }

.btn {
    border-radius: 8px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.3s;
    border: none;
    cursor: pointer;
    display: inline-block;
    text-align: center;
}

.vx3k7mn {
    background: var(--color-primary);
    color: #000 !important;
    padding: 0.5rem 1.2rem;
}
.vx3k7mn:hover {
    background: #00e0b8;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 251, 200, 0.4);
}

.uf4n9kr {
    background: var(--color-secondary);
    color: var(--color-text-light) !important;
    padding: 0.5rem 1.2rem;
}
.uf4n9kr:hover {
    background: #e02808;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 46, 9, 0.4);
}

.ld8p2qj { font-size: 0.9rem; }

.bc7m2xk {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: rgba(0, 251, 200, 0.1);
    padding: 0.5rem 1rem;
    border-radius: 20px;
    font-size: 0.9rem;
}

.pulse-dot.gv5n8jp {
    width: 10px;
    height: 10px;
    background: var(--color-primary);
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.2); }
}

.hero-section.qk7m3px {
    position: relative;
    height: 500px;
    overflow: hidden;
}

.hero-slider.xm9k2vp { height: 100%; position: relative; }

.hero-slide.vn8p4kx {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 0.5s ease;
    display: flex;
    align-items: center;
}

.hero-slide.vn8p4kx::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.3) 100%);
}

.hero-slide.active { opacity: 1; z-index: 1; }

.hero-content.px5k9mn {
    position: relative;
    z-index: 2;
}

.hero-title.ht7k2px {
    font-size: 2.5rem;
    font-weight: 700;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.hero-text.hp9m3kx {
    font-size: 1.2rem;
    color: var(--color-text-muted);
}

.btn-hero { font-size: 1.2rem; padding: 0.8rem 2rem; }

.hero-nav.bn7k2mx {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 251, 200, 0.3);
    color: white;
    border: none;
    font-size: 3rem;
    width: 50px;
    height: 50px;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s;
    border-radius: 50%;
    line-height: 1;
}

.hero-nav.bn7k2mx:hover { background: rgba(0, 251, 200, 0.6); }
.hero-nav.prev { left: 1rem; }
.hero-nav.next { right: 1rem; }

.hero-dots.dm3k8vx {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.hero-dots .dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.3s;
}

.hero-dots .dot.active { background: var(--color-primary); width: 30px; border-radius: 6px; }

.section-title.sh9k2px {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-text-light);
    position: relative;
    padding-bottom: 1rem;
}

.section-title.sh9k2px::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    border-radius: 2px;
}

.hd2k9px {
    font-size: 2.5rem;
    font-weight: 700;
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Card Blocks */
.card-block {
    background: var(--color-card-bg);
    border-radius: 15px;
    padding: 2rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s, box-shadow 0.3s;
}

.card-block:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 251, 200, 0.2);
}

.vh7m9kx { border-left: 4px solid var(--color-primary); }
.cn7k4mx { border-left: 4px solid var(--color-secondary); }

.block-title.bt3k8vp { font-size: 1.5rem; color: var(--color-text-light); }

.pros-list.pm9k2vx li,
.cons-list.cm8p2vx li {
    padding: 0.5rem 0;
    line-height: 1.8;
}

.pros-list.pm9k2vx li::before {
    content: '✓ ';
    color: var(--color-primary);
    font-weight: bold;
    margin-right: 8px;
}

.cons-list.cm8p2vx li::before {
    content: '✗ ';
    color: var(--color-secondary);
    font-weight: bold;
    margin-right: 8px;
}

.jackpot-card.jc7k2mx { text-align: center; background: linear-gradient(135deg, #2a2a2c 0%, #3a3a3c 100%); }

.jackpot-name.jn9p3vx {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-primary);
    text-transform: uppercase;
}

.jackpot-amount.ja8k4mp {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-secondary);
    text-shadow: 0 0 10px rgba(255, 46, 9, 0.5);
}

.btn-jackpot { background: var(--color-secondary); color: white; }

.winners-table-wrapper.wt7m2kx {
    overflow-x: auto;
    border-radius: 15px;
    background: var(--color-card-bg);
    padding: 1rem;
}

.winners-table.tb9k3vp {
    margin: 0;
    width: 100%;
}

.winners-table.tb9k3vp thead {
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    color: #000;
}

.winners-table.tb9k3vp th,
.winners-table.tb9k3vp td {
    padding: 1rem;
    text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.winners-table.tb9k3vp tbody tr {
    transition: background 0.3s;
}

.winners-table.tb9k3vp tbody tr:hover {
    background: rgba(0, 251, 200, 0.1);
}

.win-amount {
    color: var(--color-primary);
    font-weight: 700;
}

.game-card.gc7k2mx {
    text-align: center;
    background: linear-gradient(135deg, #2a2a2c 0%, #3a3a3c 100%);
    padding: 1.5rem;
}

.game-logo.gl8p3vx {
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.3);
}

.game-name.gn9k2px {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-light);
    margin-top: 0.5rem;
}

.btn-game { font-size: 0.9rem; padding: 0.5rem 1rem; }

.wheel-wrapper.ww7m2kx {
    background: var(--color-card-bg);
    border-radius: 15px;
    padding: 2rem;
}

.wheel-container.wc9k3vp {
    max-width: 400px;
    margin: 0 auto;
}

#wheelCanvas {
    max-width: 100%;
    height: auto;
}

.wheel-pointer.wp7k2mx {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 30px solid var(--color-secondary);
    z-index: 10;
}

.btn-spin {
    font-size: 1.2rem;
    padding: 0.8rem 2rem;
    animation: pulse-button 2s infinite;
}

@keyframes pulse-button {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 46, 9, 0.7); }
    50% { box-shadow: 0 0 0 15px rgba(255, 46, 9, 0); }
}

.wheel-result.wr8p3kx,
.wheel-loss.wl8p3kx {
    background: linear-gradient(135deg, rgba(0, 251, 200, 0.1) 0%, rgba(255, 46, 9, 0.1) 100%);
    border-radius: 10px;
    padding: 2rem;
    text-align: center;
}

.result-title.rt9k3vx,
.loss-title.lt9k3vx {
    font-size: 2rem;
    color: var(--color-primary);
}

.btn-claim,
.btn-retry {
    font-size: 1.1rem;
    padding: 0.7rem 1.8rem;
}

.author-card.ac7m2kx { background: var(--color-card-bg); }
.author-photo.ap9k3vx img { max-width: 200px; }
.author-name.an7k2px { font-size: 1.8rem; font-weight: 700; color: var(--color-primary); }
.author-role.ar8p3kx { color: var(--color-text-muted); font-size: 1.1rem; }
.author-bio.ab9k2vx { line-height: 1.8; }
.btn-social { font-size: 0.9rem; padding: 0.5rem 1rem; }

.nk7m3px {
    background: var(--color-header);
    color: var(--color-text-light);
    margin-top: auto;
}

.footer-heading {
    color: var(--color-primary);
    font-size: 1.2rem;
    font-weight: 700;
}

.footer-menu.pv6k3xm a,
.footer-contacts.yk3m8px a {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color 0.3s;
}

.footer-menu.pv6k3xm a:hover,
.footer-contacts.yk3m8px a:hover {
    color: var(--color-primary);
}

.op7k3mx { opacity: 0.7; }
.mw9k2px { max-width: 180px; }

.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--color-primary);
    color: #000;
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s;
}

.social-icon:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0, 251, 200, 0.4);
}

.payment-logo.vh2k8mx,
.provider-logo.bx7m9kp {
    padding: 0.5rem 1rem;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 600;
    transition: all 0.3s;
}

.payment-logo.vh2k8mx:hover,
.provider-logo.bx7m9kp:hover {
    background: rgba(0, 251, 200, 0.2);
    transform: translateY(-2px);
}

.bonus-widget.wd8k3mx {
    background: linear-gradient(90deg, var(--color-secondary) 0%, #cc2507 100%);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.5);
    z-index: 999;
}

.widget-title {
    font-size: 1.1rem;
    color: var(--color-text-light);
}

.widget-desc {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.9);
}

.btn-widget {
    background: var(--color-text-light);
    color: var(--color-secondary) !important;
    font-size: 1rem;
    padding: 0.6rem 1.5rem;
}

.btn-widget:hover {
    background: var(--color-primary);
    color: #000 !important;
}

.widget-close {
    background: transparent;
    border: 2px solid white;
    color: white;
    font-size: 1.5rem;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    transition: all 0.3s;
}

.widget-close:hover {
    background: white;
    color: var(--color-secondary);
}

.text-content.yn8p4kx {
    line-height: 1.8;
    color: var(--color-text-light);
}

.text-content.yn8p4kx h2 {
    font-size: 1.8rem;
    margin-top: 2rem;
    margin-bottom: 1rem;
    color: var(--color-primary);
}

.text-content.yn8p4kx h3 {
    font-size: 1.5rem;
    margin-top: 1.5rem;
    margin-bottom: 0.8rem;
    color: var(--color-text-light);
}

.text-content.yn8p4kx p {
    margin-bottom: 1rem;
}

.text-content.yn8p4kx ul,
.text-content.yn8p4kx ol {
    margin-left: 2rem;
    margin-bottom: 1rem;
}

.text-content.yn8p4kx li {
    margin-bottom: 0.5rem;
}

.text-content.yn8p4kx table {
    width: 100%;
    border-collapse: collapse;
    margin: 2rem auto;
    background: var(--color-card-bg);
    border-radius: 10px;
    overflow: hidden;
}

.text-content.yn8p4kx th,
.text-content.yn8p4kx td {
    padding: 1rem;
    text-align: left;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.text-content.yn8p4kx th {
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    color: #000;
    font-weight: 700;
}

.text-content.yn8p4kx a {
    color: var(--color-primary);
    text-decoration: underline;
}

.text-content.yn8p4kx a:hover {
    color: var(--color-secondary);
}

.qx8jk3m { display: none; }
.z9p2nv7 { visibility: hidden; }
.d4k8mq1 { opacity: 0; position: absolute; left: -9999px; }
.unused-style-1 { font-weight: 500; }
.unused-style-2 { letter-spacing: 0.5px; }
.unused-style-3 { text-transform: uppercase; }

@media (max-width: 768px) {
    .hero-title.ht7k2px { font-size: 1.8rem; }
    .hero-text.hp9m3kx { font-size: 1rem; }
    .section-title.sh9k2px { font-size: 1.5rem; }
    .hd2k9px { font-size: 1.8rem; }
    .jackpot-amount.ja8k4mp { font-size: 1.5rem; }
    .hero-nav.bn7k2mx { width: 40px; height: 40px; font-size: 2rem; }
    .card-block { padding: 1.5rem; }
}

@media (max-width: 576px) {
    .widget-title { font-size: 0.95rem; }
    .widget-desc { font-size: 0.8rem; }
    .btn-widget { font-size: 0.9rem; padding: 0.5rem 1rem; }
}

.container.okpl{
    max-width: 960px;
    margin: 0 auto;
    padding: 2.5rem 1.75rem;
    background: linear-gradient(135deg, rgba(0,251,200,.06), rgba(255,46,9,.04));
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    box-shadow: 0 10px 35px rgba(0,0,0,.35);
}

.container.okpl > *{
    max-width: 72ch;
}

.container.okpl h2,
.container.okpl h3{
    margin: 2rem 0 1rem;
    line-height: 1.2;
    text-wrap: balance;
}

.container.okpl h2{
    color: var(--color-primary);
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: .2px;
    position: relative;
    padding-left: 1rem;
}

.container.okpl h2::before{
    content:"";
    position:absolute;
    left:0;
    top:.15em;
    bottom:.15em;
    width:4px;
    border-radius:999px;
    background: linear-gradient(180deg, var(--color-primary), rgba(0,251,200,.15));
}

.container.okpl h3{
    color: var(--color-text-light);
    font-size: 1.35rem;
    font-weight: 800;
}

.container.okpl p{
    margin: 0 0 1rem;
    color: rgba(255,255,255,.92);
    line-height: 1.85;
    font-size: 1.05rem;
}

.container.okpl a{
    color: var(--color-primary);
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    transition: all .25s ease;
    word-break: break-word;
}

.container.okpl a:hover{
    color: var(--color-secondary);
}

.container.okpl a:focus-visible{
    outline: 2px solid var(--color-primary);
    outline-offset: 4px;
    border-radius: 6px;
}

.container.okpl ul,
.container.okpl ol{
    margin: 0 0 1.25rem;
    padding-left: 1.25rem;
    color: rgba(255,255,255,.9);
}

.container.okpl li{
    margin: .45rem 0;
}

.container.okpl ul li::marker{
    color: var(--color-primary);
}

.container.okpl ol li::marker{
    color: var(--color-secondary);
    font-weight: 800;
}

.container.okpl h2 + p{
    margin-top: .6rem;
}

.container.okpl{
    scroll-margin-top: 90px;
}

@media (max-width: 992px){
    .container.okpl{
        max-width: 920px;
        padding: 2.25rem 1.5rem;
    }
    .container.okpl h2{
        font-size: 1.75rem;
    }
    .container.okpl p{
        font-size: 1.02rem;
    }
}

@media (max-width: 768px){
    .container.okpl{
        padding: 1.65rem 1.05rem;
        border-radius: 16px;
    }
    .container.okpl > *{
        max-width: 100%;
    }
    .container.okpl h2{
        font-size: 1.45rem;
        margin: 1.55rem 0 .85rem;
        padding-left: .9rem;
    }
    .container.okpl h2::before{
        width: 3px;
    }
    .container.okpl h3{
        font-size: 1.15rem;
        margin: 1.25rem 0 .75rem;
    }
    .container.okpl p{
        font-size: 1rem;
        line-height: 1.8;
    }
    .container.okpl ul,
    .container.okpl ol{
        padding-left: 1.1rem;
    }
}

@media (max-width: 480px){
    .container.okpl{
        padding: 1.25rem .95rem;
        border-radius: 14px;
    }
    .container.okpl h2{
        font-size: 1.3rem;
    }
    .container.okpl h3{
        font-size: 1.05rem;
    }
}

