:root {
      --bg: #120202;
      --bg-2: #290506;
      --red-900: #5d0507;
      --red-800: #83090d;
      --red-700: #b70f14;
      --red-600: #df1c1f;
      --gold-700: #b76f19;
      --gold-600: #d78d25;
      --gold-500: #f3b33c;
      --gold-300: #ffe28c;
      --paper: #fffaf0;
      --paper-2: #f7efe3;
      --ink: #22120d;
      --muted: #7b665c;
      --line: rgba(255, 226, 140, .22);
      --white: #ffffff;
      --green: #22b36d;
      --blue: #2d8cff;
      --shadow: 0 18px 48px rgba(50, 4, 5, .22);
      --max: 1180px;
    }

    * {
      box-sizing: border-box;
    }

    html,
    body {
      margin: 0;
      min-height: 100%;
      overflow-x: hidden;
    }

    body {
      color: var(--paper);
      background:
        radial-gradient(circle at 12% -6%, rgba(255, 196, 72, .18), transparent 28%),
        linear-gradient(180deg, #250204 0%, #120202 46%, #fff8ed 46%, #fff8ed 100%);
      font-family: Arial, "Helvetica Neue", sans-serif;
      line-height: 1.6;
      letter-spacing: 0;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    img {
      display: block;
      max-width: 100%;
    }

    .shell {
      width: min(var(--max), calc(100% - 40px));
      margin: 0 auto;
    }

    .topbar {
      background: #740609;
      border-bottom: 1px solid rgba(255, 226, 140, .18);
    }

    .topbar .shell {
      min-height: 84px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
    }

    .brand-mark {
      position: relative;
      width: 54px;
      height: 54px;
      flex: 0 0 54px;
      border-radius: 14px;
      background:
        radial-gradient(circle at 50% 28%, #fff8bf 0 8%, transparent 9%),
        linear-gradient(145deg, #ffef91 0%, #cf791d 58%, #7c3306 100%);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28), 0 10px 22px rgba(0, 0, 0, .28);
    }

    .brand-mark::before,
    .brand-mark::after {
      content: "";
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      background: #681008;
    }

    .brand-mark::before {
      top: 14px;
      width: 21px;
      height: 25px;
      border-radius: 50% 50% 44% 44%;
      clip-path: polygon(50% 0, 100% 40%, 70% 100%, 30% 100%, 0 40%);
    }

    .brand-mark::after {
      bottom: 11px;
      width: 26px;
      height: 5px;
      border-radius: 999px;
    }

    .brand-word {
      display: grid;
      gap: 0;
      line-height: 1;
    }

    .brand-word strong {
      color: var(--white);
      font-size: clamp(32px, 4vw, 48px);
      font-weight: 900;
      letter-spacing: 0;
      text-shadow: 0 3px 0 rgba(0, 0, 0, .16);
    }

    .brand-word span {
      color: var(--gold-300);
      font-size: 18px;
      font-weight: 900;
      text-transform: uppercase;
    }

    .socials,
    .top-actions,
    .nav-list,
    .hero-actions,
    .trust-row,
    .game-grid,
    .news-grid {
      display: flex;
      align-items: center;
    }

    .socials {
      gap: 8px;
      flex: 1;
    }

    .social {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      color: var(--white);
      font-size: 13px;
      font-weight: 900;
      box-shadow: inset 0 -8px 14px rgba(0, 0, 0, .16);
    }

    .social:nth-child(1) { background: #315fba; }
    .social:nth-child(2) { background: #25a9e9; }
    .social:nth-child(3) { background: #111; }
    .social:nth-child(4) { background: #21b66b; }
    .social:nth-child(5) { background: #e8472f; }
    .social:nth-child(6) { background: #ff8a00; }
    .social:nth-child(7) { background: #1683f2; }

    .top-actions {
      gap: 14px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 44px;
      max-width: 100%;
      padding: 0 26px;
      border-radius: 999px;
      border: 0;
      color: var(--white);
      background: linear-gradient(180deg, #ffbe5b 0%, #f2772a 100%);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .36), 0 12px 24px rgba(84, 12, 0, .24);
      font-weight: 900;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .btn.secondary {
      color: #4a1105;
      background: linear-gradient(180deg, #ffe88f 0%, #f1a733 100%);
    }

    .btn.ghost {
      color: var(--gold-300);
      background: rgba(255, 226, 140, .08);
      box-shadow: inset 0 0 0 1px rgba(255, 226, 140, .42);
    }

    .nav {
      position: sticky;
      top: 0;
      z-index: 20;
      background: #c4070c;
      box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
    }

    .nav .shell {
      min-height: 68px;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }

    .nav-list {
      width: 100%;
      justify-content: center;
      gap: 4px;
      list-style: none;
      padding: 0;
      margin: 0;
      flex-wrap: wrap;
    }

    .nav-list a {
      display: inline-flex;
      align-items: center;
      min-height: 44px;
      padding: 0 13px;
      border-radius: 999px;
      color: var(--white);
      font-size: 14px;
      font-weight: 900;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .nav-list a:hover,
    .nav-list .active {
      color: #fff56e;
      background: rgba(0, 0, 0, .14);
    }

    .hero {
      position: relative;
      isolation: isolate;
      min-height: 560px;
      display: grid;
      align-items: center;
      background:
        linear-gradient(90deg, rgba(18, 2, 2, .95) 0%, rgba(35, 4, 5, .74) 38%, rgba(35, 4, 5, .24) 72%, rgba(18, 2, 2, .72) 100%),
        url("ev99-hero-visual.png") center / cover no-repeat;
      border-bottom: 1px solid rgba(255, 226, 140, .2);
      overflow: hidden;
    }

    .hero::after {
      content: "";
      position: absolute;
      inset: auto 0 0;
      height: 120px;
      background: linear-gradient(180deg, transparent, rgba(18, 2, 2, .72));
      z-index: -1;
    }

    .hero-content {
      width: min(690px, 100%);
      padding: 56px 0 76px;
    }

    h1,
    h2,
    h3,
    p {
      margin-top: 0;
    }

    h1 {
      margin-bottom: 18px;
      color: var(--white);
      font-size: clamp(42px, 7vw, 78px);
      line-height: .98;
      font-weight: 900;
      text-transform: uppercase;
      text-shadow: 0 5px 0 rgba(0, 0, 0, .18), 0 18px 36px rgba(0, 0, 0, .26);
    }

    .hero-lead {
      max-width: 620px;
      margin-bottom: 28px;
      color: rgba(255, 250, 240, .88);
      font-size: clamp(17px, 2vw, 21px);
      font-weight: 700;
    }

    .hero-actions {
      gap: 14px;
      flex-wrap: wrap;
      margin-bottom: 30px;
    }

    .trust-row {
      align-items: stretch;
      gap: 12px;
      flex-wrap: wrap;
    }

    .trust-item {
      min-width: 158px;
      padding: 14px 16px;
      border: 1px solid rgba(255, 226, 140, .24);
      border-radius: 8px;
      background: rgba(40, 6, 5, .64);
      backdrop-filter: blur(12px);
    }

    .trust-item strong {
      display: block;
      color: var(--gold-300);
      font-size: 22px;
      line-height: 1.1;
    }

    .trust-item span {
      color: rgba(255, 250, 240, .78);
      font-size: 13px;
      font-weight: 700;
    }

    .main {
      color: var(--ink);
      background:
        linear-gradient(180deg, #fff8ed 0%, #fffaf3 46%, #f6eee2 100%);
    }

    .intro {
      padding: 36px 0 24px;
      text-align: center;
    }

    .intro h2 {
      margin-bottom: 18px;
      color: #b70f14;
      font-size: clamp(26px, 4vw, 38px);
      line-height: 1.16;
      font-weight: 900;
    }

    .intro-box {
      max-width: 1040px;
      margin: 0 auto;
      padding: clamp(20px, 3vw, 30px);
      border-left: 3px solid var(--red-700);
      border-radius: 8px;
      background: #fffdf8;
      box-shadow: var(--shadow);
      text-align: left;
    }

    .intro-box p {
      margin-bottom: 16px;
      font-size: 18px;
    }

    .intro-box p:last-child {
      margin-bottom: 0;
    }

    .intro-box a {
      color: #005cbf;
      font-weight: 900;
    }

    .section {
      padding: 56px 0;
    }

    .section-head {
      max-width: 760px;
      margin: 0 auto 28px;
      text-align: center;
    }

    .section-head h2 {
      margin-bottom: 10px;
      color: #7a0609;
      font-size: clamp(28px, 4vw, 42px);
      line-height: 1.12;
      font-weight: 900;
    }

    .section-head p {
      margin-bottom: 0;
      color: var(--muted);
      font-size: 17px;
      font-weight: 700;
    }

    .game-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 16px;
      align-items: stretch;
    }

    .game-card {
      min-height: 188px;
      position: relative;
      overflow: hidden;
      padding: 22px;
      border-radius: 8px;
      color: var(--white);
      background:
        radial-gradient(circle at 76% 16%, rgba(255, 226, 140, .28), transparent 26%),
        linear-gradient(145deg, #7b0508 0%, #240303 100%);
      box-shadow: 0 16px 36px rgba(48, 4, 5, .22);
    }

    .game-card::after {
      content: "";
      position: absolute;
      right: -30px;
      bottom: -44px;
      width: 126px;
      height: 126px;
      border-radius: 50%;
      border: 18px solid rgba(255, 226, 140, .24);
    }

    .game-card .icon {
      width: 48px;
      height: 48px;
      display: grid;
      place-items: center;
      margin-bottom: 26px;
      border-radius: 50%;
      color: #4c1505;
      background: linear-gradient(180deg, #fff1a5, #e7982d);
      font-size: 24px;
      font-weight: 900;
    }

    .game-card h3 {
      position: relative;
      z-index: 1;
      margin-bottom: 6px;
      font-size: 22px;
      line-height: 1.16;
      font-weight: 900;
    }

    .game-card p {
      position: relative;
      z-index: 1;
      margin-bottom: 0;
      color: rgba(255, 250, 240, .78);
      font-weight: 700;
    }

    .split {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
      gap: 32px;
      align-items: center;
    }

    .promo-panel {
      min-height: 360px;
      position: relative;
      overflow: hidden;
      border-radius: 8px;
      background:
        linear-gradient(90deg, rgba(21, 2, 2, .14), rgba(21, 2, 2, 0)),
        url("ev99-feature-visual.png") center / cover no-repeat;
      box-shadow: var(--shadow);
      border: 1px solid rgba(153, 8, 12, .18);
    }

    .promo-panel::before {
      content: "";
      position: absolute;
      inset: 14px;
      border: 1px solid rgba(255, 226, 140, .22);
      border-radius: 6px;
      pointer-events: none;
    }

    .promo-panel::after {
      content: "";
      position: absolute;
      inset: auto 0 0;
      height: 34%;
      background:
        linear-gradient(180deg, transparent, rgba(21, 2, 2, .46));
      pointer-events: none;
    }

    .feature-list {
      display: grid;
      gap: 14px;
    }

    .feature-row {
      display: grid;
      grid-template-columns: 52px minmax(0, 1fr);
      gap: 16px;
      align-items: start;
      padding: 18px;
      border-radius: 8px;
      background: #fffdf8;
      border: 1px solid #f0dfc7;
      box-shadow: 0 12px 28px rgba(50, 4, 5, .08);
    }

    .feature-row .num {
      width: 52px;
      height: 52px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: #5c1804;
      background: linear-gradient(180deg, #ffe590, #e99b2f);
      font-weight: 900;
    }

    .feature-row h3 {
      margin-bottom: 4px;
      color: #7a0609;
      font-size: 20px;
      line-height: 1.25;
      font-weight: 900;
    }

    .feature-row p {
      margin-bottom: 0;
      color: var(--muted);
      font-weight: 700;
    }

    .news {
      background: #fffdf8;
      border-top: 1px solid #f0dfc7;
      border-bottom: 1px solid #f0dfc7;
    }

    .news-grid {
      display: grid;
      grid-template-columns: 1.15fr repeat(2, minmax(0, 1fr));
      gap: 18px;
      align-items: stretch;
    }

    .article-card {
      min-height: 238px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      position: relative;
      overflow: hidden;
      padding: 22px;
      border-radius: 8px;
      color: var(--white);
      background:
        linear-gradient(180deg, rgba(23, 3, 3, .05), rgba(23, 3, 3, .88)),
        radial-gradient(circle at 78% 20%, rgba(255, 226, 140, .38), transparent 26%),
        linear-gradient(135deg, #8f070b, #260304);
      box-shadow: 0 14px 32px rgba(50, 4, 5, .14);
    }

    .article-card:first-child {
      min-height: 360px;
    }

    .article-card::before {
      content: "";
      position: absolute;
      inset: 18px;
      border: 1px solid rgba(255, 226, 140, .22);
      border-radius: 6px;
      pointer-events: none;
    }

    .article-card time {
      position: relative;
      z-index: 1;
      margin-bottom: 8px;
      color: var(--gold-300);
      font-size: 13px;
      font-weight: 900;
      text-transform: uppercase;
    }

    .article-card h3 {
      position: relative;
      z-index: 1;
      margin-bottom: 10px;
      font-size: clamp(21px, 3vw, 30px);
      line-height: 1.16;
      font-weight: 900;
    }

    .article-card p {
      position: relative;
      z-index: 1;
      margin-bottom: 0;
      color: rgba(255, 250, 240, .8);
      font-weight: 700;
    }

    .article-card.small h3 {
      font-size: 22px;
    }

    .content-band {
      padding: 56px 0 72px;
    }

    .content-box {
      max-width: 1030px;
      margin: 0 auto;
      padding: clamp(22px, 4vw, 36px);
      border-radius: 8px;
      background: #fffdf8;
      box-shadow: var(--shadow);
    }

    .content-box h2 {
      color: #7a0609;
      font-size: clamp(26px, 4vw, 36px);
      line-height: 1.16;
      font-weight: 900;
    }

    .content-box h3 {
      margin: 24px 0 8px;
      color: #9c090d;
      font-size: 22px;
      line-height: 1.24;
      font-weight: 900;
    }

    .content-box p,
    .content-box li {
      color: #38231b;
      font-size: 17px;
      font-weight: 600;
    }

    .content-box ul {
      margin: 0;
      padding-left: 20px;
    }

    .footer {
      color: rgba(255, 250, 240, .78);
      background:
        radial-gradient(circle at 74% 0%, rgba(255, 226, 140, .16), transparent 30%),
        #130202;
      border-top: 1px solid rgba(255, 226, 140, .18);
    }

    .footer .shell {
      display: grid;
      grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr));
      gap: 28px;
      padding: 38px 0;
    }

    .footer h3 {
      margin-bottom: 12px;
      color: var(--gold-300);
      font-size: 18px;
      font-weight: 900;
    }

    .footer p,
    .footer a {
      margin: 0 0 8px;
      color: rgba(255, 250, 240, .72);
      font-size: 14px;
      font-weight: 700;
    }

    @media (max-width: 1020px) {
      .topbar .shell {
        min-height: 108px;
        flex-wrap: wrap;
        padding: 16px 0;
      }

      .socials {
        order: 3;
        flex-basis: 100%;
        justify-content: center;
      }

      .game-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }

      .split,
      .news-grid,
      .footer .shell {
        grid-template-columns: 1fr;
      }

      .article-card:first-child,
      .promo-panel {
        min-height: 300px;
      }
    }

    @media (max-width: 720px) {
      .shell {
        width: min(100% - 28px, var(--max));
      }

      .topbar .shell {
        justify-content: center;
        text-align: center;
      }

      .brand {
        width: 100%;
        justify-content: center;
      }

      .brand-word strong {
        font-size: 38px;
      }

      .top-actions {
        width: 100%;
        justify-content: center;
      }

      .top-actions .btn {
        width: min(100%, 260px);
        flex: 0 1 260px;
        padding: 0 14px;
        font-size: 14px;
      }

      .nav {
        position: static;
      }

      .nav .shell {
        min-height: auto;
        padding: 10px 0;
      }

      .nav-list {
        justify-content: center;
        flex-wrap: wrap;
        overflow: visible;
        max-width: 100%;
        padding-bottom: 0;
      }

      .nav-list a {
        min-height: 38px;
        padding: 0 10px;
        font-size: 12px;
      }

      .hero {
        min-height: 640px;
        background-position: 62% center;
      }

      .hero-content {
        padding: 46px 0 54px;
      }

      h1 {
        font-size: 48px;
      }

      .hero-lead {
        font-size: 17px;
      }

      .hero-actions .btn {
        width: 100%;
      }

      .trust-item {
        flex: 1 1 calc(50% - 8px);
        min-width: 0;
      }

      .intro,
      .section,
      .content-band {
        padding: 38px 0;
      }

      .intro-box p,
      .content-box p,
      .content-box li {
        font-size: 16px;
      }

      .game-grid {
        grid-template-columns: 1fr;
      }

      .game-card {
        min-height: 164px;
      }

      .news-grid {
        gap: 14px;
      }

      .article-card,
      .article-card:first-child {
        min-height: 236px;
      }
    }

/* DedeBiz dynamic content states */
.ev99-page-link { color: inherit; text-decoration: none; }
.news-grid.ev99-dynamic-list { align-items: stretch; }
.article-card .ev99-more { position: relative; z-index: 1; display: inline-flex; margin-top: 16px; color: var(--gold-300); font-size: 13px; font-weight: 900; text-transform: uppercase; }
.ev99-pagination { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 28px; }
.ev99-pagination a,
.ev99-pagination span { min-width: 38px; min-height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; border-radius: 999px; background: #fffdf8; border: 1px solid #ecd9bd; color: #7a0609; font-weight: 900; box-shadow: 0 8px 18px rgba(50, 4, 5, .08); }
.ev99-pagination .thisclass,
.ev99-pagination strong { background: linear-gradient(180deg, #ffe590, #e99b2f); color: #4c1505; border-color: transparent; }
.article-hero { background: linear-gradient(180deg, #250204 0%, #120202 100%); padding: 64px 0 46px; border-bottom: 1px solid rgba(255, 226, 140, .2); }
.article-hero h1 { max-width: 920px; margin: 0 auto 16px; text-align: center; font-size: clamp(34px, 5vw, 58px); line-height: 1.08; }
.article-meta { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; color: rgba(255, 250, 240, .72); font-weight: 800; }
.article-wrap { padding: 56px 0 72px; color: var(--ink); background: linear-gradient(180deg, #fff8ed 0%, #f6eee2 100%); }
.article-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 28px; align-items: start; }
.article-main,
.article-side-card { border-radius: 8px; background: #fffdf8; box-shadow: var(--shadow); }
.article-main { padding: clamp(22px, 4vw, 42px); }
.article-body { color: #38231b; font-size: 18px; font-weight: 600; line-height: 1.85; }
.article-body h2,
.article-body h3 { color: #8d080c; line-height: 1.22; font-weight: 900; }
.article-body img { border-radius: 8px; margin: 22px auto; }
.article-body a { color: #005cbf; font-weight: 900; }
.article-update,
.article-editor { margin-top: 20px; color: var(--muted); font-weight: 800; }
.article-side-card { padding: 22px; position: sticky; top: 92px; }
.article-side-card h2 { color: #7a0609; font-size: 24px; line-height: 1.16; font-weight: 900; }
.article-side-card p { color: var(--muted); font-weight: 700; }
.prenext { display: grid; gap: 10px; margin-top: 26px; }
.prenext a { display: block; padding: 14px 16px; border-radius: 8px; background: #fff8ed; border: 1px solid #ecd9bd; color: #7a0609; font-weight: 900; }
@media (max-width: 900px) { .article-layout { grid-template-columns: 1fr; } .article-side-card { position: static; } }
@media (max-width: 720px) { .article-hero { padding: 42px 0 34px; } .article-body { font-size: 16px; } }