:root {       --color-bg-01: #040913;       --color-bg-02: #071126;       --color-bg-03: #09152b;       --color-surface-01: #172346;       --color-surface-02: #0c1326;       --color-border: rgba(169, 181, 236, 0.16);       --color-text-main: #ffffff;       --color-text-soft: #a9b5ec;       --color-text-dim: #7d90c1;       --color-accent-cyan: #00e1fa;       --color-accent-blue: #557bff;       --color-accent-violet: #a302f1;       --color-success: #00e38c;       --shadow-large: 0 18px 50px rgba(0, 0, 0, 0.28);       --radius-large: 28px;       --radius-medium: 22px;       --radius-small: 18px;       --site-width: 1280px;     }      * { box-sizing: border-box; }     html { scroll-behavior: smooth; }     body {       margin: 0;       min-width: 320px;       font-family: Inter, Arial, sans-serif;       line-height: 1.55;       color: var(--color-text-main);       background:         radial-gradient(circle at top center, rgba(163, 2, 241, 0.14), transparent 30%),         radial-gradient(circle at 20% 0%, rgba(0, 225, 250, 0.10), transparent 24%),         linear-gradient(180deg, var(--color-bg-01) 0%, var(--color-bg-02) 38%, var(--color-bg-03) 100%);     }      img { display: block; max-width: 100%; }     a { color: inherit; text-decoration: none; }     h1, h2, h3, p { margin: 0; padding-top: 15px; }      .page-shell {       width: min(100% - 32px, var(--site-width));       margin: 0 auto;     }      .site-header {       position: sticky;       top: 0;       z-index: 20;       background: rgba(4, 9, 19, 0.88);       backdrop-filter: blur(10px);       border-bottom: 1px solid rgba(169, 181, 236, 0.10);     }      .site-header__inner {       display: grid;       grid-template-columns: auto 1fr auto;       gap: 20px;       align-items: center;       min-height: 84px;       padding: 10px 0;     }      .site-logo {       display: inline-flex;       align-items: center;       gap: 12px;       min-width: 0;       font-weight: 800;       letter-spacing: 0.03em;     }      .site-logo__mark {       width: 55px;       height: 55px;       flex: 0 0 55px;       display: grid;       place-items: center;       overflow: hidden;       border-radius: 16px;       background: linear-gradient(135deg, rgba(85,123,255,0.20), rgba(163,2,241,0.22));       /*border: 1px solid rgba(225, 125, 255, 0.28);*/       box-shadow: 0 0 0 1px rgba(255,255,255,0.03) inset;     }      .site-logo__text {       font-size: 18px;       text-transform: uppercase;       white-space: nowrap;     }      .main-menu {       display: flex;       justify-content: center;       align-items: center;       gap: 12px;       flex-wrap: wrap;       min-width: 0;     }      .main-menu__link,     .button,     .button-soft {       display: inline-flex;       align-items: center;       justify-content: center;       min-height: 44px;       padding: 0 18px;       border-radius: 999px;       border: 1px solid rgba(169, 181, 236, 0.14);       background: rgba(23, 35, 70, 0.68);       color: var(--color-text-main);       font-size: 14px;       font-weight: 700;       text-align: center;       transition: 0.6s all ease;     } .button:hover {   border: 1px solid rgba(169, 181, 236, 0.7);   transition: 0.6s all ease; }     .main-menu__link {       min-height: 40px;       padding: 0 16px;       color: var(--color-text-soft);     }  .button--primary {   border: 0;   background: linear-gradient(90deg, var(--color-accent-blue), var(--color-accent-violet), var(--color-accent-blue));   background-size: 200% 100%;   background-position: left;   box-shadow: 0 10px 24px rgba(85, 123, 255, 0.22);   transition: background-position 0.6s ease; }  .button--primary:hover {   border: 0;   background-position: right; }     .site-header__actions {       display: inline-flex;       align-items: center;       justify-content: flex-end;       gap: 12px;       flex-wrap: wrap;     }      .section-intro {       padding: 22px 0 18px;     }      .breadcrumbs-nav {       display: flex;       flex-wrap: wrap;       gap: 8px;       margin-bottom: 18px;       color: var(--color-text-soft);       font-size: 14px;     }      .surface-card {       background: linear-gradient(180deg, rgba(23, 35, 70, 0.94), rgba(12, 19, 38, 0.94));       border: 1px solid var(--color-border);       border-radius: var(--radius-large);       box-shadow: var(--shadow-large);     }      .hero-layout {       display: block;     }   .hero-banner {   width: 100%;   min-height: 420px;   position: relative;   overflow: hidden;    display: flex;   align-items: center;   justify-content: center;   text-align: center;    background:     linear-gradient(120deg, rgba(4,9,19,0.75), rgba(4,9,19,0.85)),     url("https://images.unsplash.com/photo-1511512578047-dfb367046420?auto=format&fit=crop&w=1600&q=80")     center/cover no-repeat; }      .promo-card {       position: relative;       overflow: hidden;       min-height: 205px;       padding: 24px;     }       .promo-card__title {       margin-top: 14px;       max-width: 8ch;       font-size: clamp(28px, 3vw, 34px);       line-height: 0.98;       font-weight: 800;     }      .promo-card__text {       margin-top: 12px;       max-width: 28ch;       color: #d7ddf7;     }      .winners-board {       display: grid;       grid-template-columns: repeat(6, minmax(0, 1fr));       gap: 12px;       margin-top: 18px;       padding: 18px;     }      .winner-card {       min-width: 0;       padding: 14px;       text-align: center;       border-radius: var(--radius-small);       background: rgba(9, 17, 37, 0.72);       border: 1px solid rgba(169, 181, 236, 0.10);     }      .winner-card__mark {       width: 42px;       height: 42px;       margin: 0 auto;       border-radius: 14px;       background: linear-gradient(135deg, rgba(85,123,255,0.26), rgba(163,2,241,0.34));     }      .winner-card__name {       display: block;       margin-top: 10px;       white-space: nowrap;       overflow: hidden;       text-overflow: ellipsis;       font-size: 14px;     }      .winner-card__amount {       display: block;       margin-top: 3px;       color: var(--color-success);       font-weight: 800;     }      .content-section {       padding: 18px 0;     }      .content-section__box {       padding: 22px;     }      .section-header {       display: flex;       align-items: center;       justify-content: space-between;       flex-wrap: wrap;       gap: 16px;       margin-bottom: 18px;     }      .section-header__title {       font-size: clamp(24px, 2.4vw, 34px);       letter-spacing: -0.02em;     }      .category-list {       display: flex;       flex-wrap: wrap;       gap: 10px;       margin-bottom: 18px;     }      .category-list__item {       padding: 10px 16px;       border-radius: 999px;       background: rgba(23, 35, 70, 0.70);       border: 1px solid rgba(169, 181, 236, 0.14);       color: var(--color-text-soft);       font-size: 14px;       font-weight: 700;     }      .category-list__item--active {       color: var(--color-text-main);       background: linear-gradient(90deg, rgba(85,123,255,0.20), rgba(163,2,241,0.20));       border-color: rgba(225, 125, 255, 0.25);     }      .game-grid {       display: grid;       grid-template-columns: repeat(5, minmax(0, 1fr));       gap: 16px;     }      .game-tile {       overflow: hidden;       border-radius: var(--radius-medium);       background: rgba(9, 17, 37, 0.85);       border: 1px solid rgba(169,181,236,0.10);     }      .game-tile__image-wrap {       position: relative;       aspect-ratio: 4 / 5;       overflow: hidden;     }      .game-tile__overlay {       position: absolute;       inset: 0;       display: flex;       align-items: center;       justify-content: center;       background: linear-gradient(180deg, rgba(4, 9, 19, 0.08), rgba(4, 9, 19, 0.72));       opacity: 0;       transition: opacity 0.25s ease;     }      .game-tile:hover .game-tile__overlay,     .game-tile:focus-within .game-tile__overlay {       opacity: 1;     }      .game-tile__image {       width: 100%;       height: 100%;       object-fit: cover;     }      .game-tile__body {       padding: 14px;     }      .game-tile__title {       display: block;       font-size: 16px;     }      .game-tile__meta {       display: block;       margin-top: 4px;       color: var(--color-text-soft);       font-size: 14px;     }      .jackpot-grid {       display: grid;       grid-template-columns: repeat(3, minmax(0, 1fr));       gap: 18px;       align-items: end;     }      .jackpot-box {       position: relative;       overflow: hidden;       min-height: 280px;       padding: 28px 24px;       text-align: center;     }      .jackpot-box::before {       content: '';       position: absolute;       inset: auto -20% -40% -20%;       height: 180px;       background: radial-gradient(circle, rgba(85,123,255,0.26), transparent 68%);       pointer-events: none;     }      .jackpot-box--featured {       min-height: 340px;        border-color: rgba(225, 125, 255, 0.24);     }      .jackpot-box__label {       font-size: 14px;       text-transform: uppercase;       letter-spacing: 0.14em;       color: var(--color-text-soft);     }      .jackpot-box__title {       margin-top: 10px;       font-size: 34px;     }      .jackpot-box__amount {       margin-top: 14px;       font-size: clamp(34px, 4vw, 56px);       line-height: 1;       font-weight: 900;       letter-spacing: -0.04em;       overflow-wrap: anywhere;     }      .jackpot-box__text {       margin-top: 8px;       color: var(--color-text-soft);     }      .feature-grid {       display: grid;       grid-template-columns: repeat(4, minmax(0, 1fr));       gap: 16px;     }      .feature-card {       padding: 18px;       border-radius: 20px;       background: rgba(9, 17, 37, 0.72);       border: 1px solid rgba(169,181,236,0.10);     }      .feature-card__mark {       width: 52px;       height: 52px;       border-radius: 16px;       background: linear-gradient(135deg, rgba(85,123,255,0.24), rgba(163,2,241,0.30));     }      .feature-card__title {       display: block;       margin-top: 12px;       font-size: 18px;     }      .feature-card__text {       margin-top: 8px;       color: var(--color-text-soft);       font-size: 15px;     }      .text-layout {       display: grid;       grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);       gap: 22px;       align-items: start;     }      .article-copy {       text-align: justify;     }      .article-copy__title {       margin-bottom: 16px;       font-size: clamp(28px, 3vw, 40px);     }      .article-copy p { color: #d7ddf7; }     .article-copy p + p { margin-top: 14px; }      .article-copy ul,     .article-copy ol {       margin: 18px 0 0;       padding-left: 0;       color: #d7ddf7;     }      .article-copy ul {       list-style: none;     }      .article-copy ul li {       position: relative;       padding-left: 22px;     }      .article-copy ul li::before {       content: '';       position: absolute;       left: 0;       top: 0.7em;       width: 8px;       height: 8px;       border-radius: 50%;       background: linear-gradient(90deg, var(--color-accent-blue), var(--color-accent-violet));       transform: translateY(-50%);     }      .article-copy ol {       list-style: none;       counter-reset: article-counter;     }      .article-copy ol li {       counter-increment: article-counter;       position: relative;       padding-left: 42px;       min-height: 28px;     }      .article-copy ol li::before {       content: counter(article-counter);       position: absolute;       left: 0;       top: 0;       width: 28px;       height: 28px;       border-radius: 50%;       display: inline-flex;       align-items: center;       justify-content: center;       background: linear-gradient(90deg, var(--color-accent-blue), var(--color-accent-violet));       color: var(--color-text-main);       font-size: 13px;       font-weight: 800;     }      .article-copy li + li { margin-top: 12px; }      .article-copy table {       width: 100%;       margin-top: 22px;       border-collapse: collapse;       overflow: hidden;       border-radius: 18px;       background: rgba(9, 17, 37, 0.62);       border: 1px solid rgba(169,181,236,0.12);     }      .article-copy thead {       background: linear-gradient(90deg, rgba(85,123,255,0.22), rgba(163,2,241,0.22));     }      .article-copy th,     .article-copy td {       padding: 14px 16px;       text-align: left;       border-bottom: 1px solid rgba(169,181,236,0.10);       color: #d7ddf7;       font-size: 15px;     }      .article-copy th {       color: var(--color-text-main);       font-weight: 800;     }      .article-copy tbody tr:last-child td {       border-bottom: 0;     }            .payment-grid {       display: grid;       grid-template-columns: repeat(6, minmax(0, 1fr));       gap: 12px;     }      .payment-grid__item {       min-height: 78px;       display: grid;       place-items: center;       padding: 12px;       border-radius: var(--radius-small);       background: rgba(9, 17, 37, 0.76);       border: 1px solid rgba(169,181,236,0.10);       color: #dce2ff;       font-size: 22px;       font-weight: 900;       text-align: center;     }      .site-footer {       padding: 20px 0 40px;     }      .site-footer__box {       padding: 24px;     }      .site-footer__grid {       display: grid;       grid-template-columns: 1.2fr 1fr 1fr 1fr;       gap: 20px;     }      .site-footer__brand {       display: inline-flex;       align-items: center;       gap: 12px;       margin-bottom: 12px;       font-weight: 800;       text-transform: uppercase;     }      .site-footer p,     .site-footer li,     .site-footer a { color: var(--color-text-soft); }      .site-footer ul {       list-style: none;       margin: 12px 0 0;       padding: 0;     }      .site-footer li + li { margin-top: 8px; }      .site-footer__bottom {       display: flex;       justify-content: space-between;       align-items: center;       flex-wrap: wrap;       gap: 20px;       margin-top: 20px;       padding-top: 18px;       border-top: 1px solid rgba(169, 181, 236, 0.10);     }      .site-footer__copy {       color: var(--color-text-dim);       font-size: 14px;     }      .trust-list {       display: flex;       flex-wrap: wrap;       align-items: center;       gap: 12px;     }      .trust-list__item {       min-width: 62px;       min-height: 62px;       display: inline-flex;       align-items: center;       justify-content: center;       padding: 10px 14px;       border-radius: var(--radius-small);       background: rgba(9, 17, 37, 0.80);       border: 1px solid rgba(169,181,236,0.10);       color: #dce2ff;       font-weight: 900;       text-align: center;       line-height: 1.1;     }      .trust-list__item small {       display: block;       margin-top: 4px;       font-size: 11px;       font-weight: 700;       color: var(--color-text-soft);     }      .back-top {       position: fixed;       right: 16px;       bottom: 16px;       z-index: 30;       min-width: 56px;       min-height: 56px;       display: inline-flex;       align-items: center;       justify-content: center;       padding: 0 18px;       border-radius: 999px;       background: linear-gradient(90deg, var(--color-accent-blue), var(--color-accent-violet));       color: var(--color-text-main);       font-size: 14px;       font-weight: 800;       box-shadow: 0 10px 24px rgba(85, 123, 255, 0.22);     }      .schema-hidden {       display: none;     } 	 .article-copy p a {   color: cornflowerblue; } .article-copy p a:hover {   color: #0f5be1; } 	 	.hero-banner__content {   max-width: 720px;   padding: 60px 40px;    display: flex;   flex-direction: column;   align-items: center;   justify-content: center;    text-align: center;   gap: 14px; } .hero-banner__actions {     display: flex;     gap: 14px;     flex-wrap: wrap;     justify-content: center;     align-items: center;     margin-top: 14px; 	width: 100%; } .hero-banner__actions .button {   width: 100%; } .label-pill span {   font-size: 45px;   font-weight: bold; } h1 {   font-size: 30px; }     @media (max-width: 1180px) {       .site-header__inner { grid-template-columns: 1fr; }       .site-logo,       .main-menu,       .site-header__actions { justify-content: center; }       .text-layout { grid-template-columns: 1fr; }       .game-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }       .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }       .payment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }       .winners-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }       .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }     }      @media (max-width: 920px) {       .hero-layout,       .jackpot-grid,       .text-layout,       .site-footer__grid { grid-template-columns: 1fr; }       .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }       .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }       .winners-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }       .main-menu,       .site-header__actions { justify-content: center; }       .site-footer__bottom { flex-direction: column; align-items: flex-start; }     }      @media (max-width: 640px) {       .page-shell { width: min(100% - 20px, var(--site-width)); }       .hero-banner__content,       .promo-card,       .content-section__box,       .site-footer__box { padding: 18px; }       .hero-banner { min-height: 360px; }       .winners-board,       .feature-grid,       .payment-grid,       .game-grid { grid-template-columns: 1fr; }       .hero-banner__actions,       .site-header__actions,       .main-menu { flex-direction: column; align-items: stretch; }       .main-menu__link,       .button,       .button-soft { width: 100%; }       .winner-card { text-align: left; }       .winner-card__mark { margin: 0 0 8px; }       .section-header { align-items: flex-start; }       .breadcrumbs-nav { font-size: 13px; }       .site-logo__text { white-space: normal; }       .trust-list { width: 100%; }       .trust-list__item { flex: 1 1 calc(33.333% - 8px); min-width: 0; }       .back-top {         right: 12px;         bottom: 12px;       }     }  /* lang */  .lang-menu {       width: 220px;       position: relative;     }      .lang-btn {       width: 100%;       background: #0b1638;       color: #fff;       border: none;       border-radius: 30px;       padding: 16px 20px;       display: flex;       align-items: center;       justify-content: space-between;       cursor: pointer;       font-size: 20px;       line-height: 1;     }      .lang-btn-left,     .lang-option-left {       display: flex;       align-items: center;       gap: 10px;       font-size: 24px;       font-weight: 500;     }      .lang-flag {       width: 24px;       height: 24px;       border-radius: 50%;       display: inline-flex;       align-items: center;       justify-content: center;       overflow: hidden;       flex-shrink: 0;       text-decoration: none;     }      .lang-flag img {       width: 100%;       height: 100%;       object-fit: cover;       display: block;     }      .lang-code {       font-size: 16px;       font-weight: 500;       letter-spacing: 0.02em;     }      .lang-arrow {       font-size: 18px;       transition: transform 0.2s ease;       margin-left: 12px;     }      .lang-menu.active .lang-arrow {       transform: rotate(180deg);     }      .lang-dropdown {       position: absolute;       top: calc(100% + 8px);       left: 0;       width: 100%;       display: none;       z-index: 1000;     }      .lang-menu.active .lang-dropdown {       display: block;     }      .lang-option {       width: 100%;       background: #0b1638;       color: #fff;       border-radius: 30px;       padding: 16px 20px;       display: flex;       align-items: center;       justify-content: space-between;       text-decoration: none;       box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);     }      .lang-option:hover {       opacity: 0.96;     }