/* reference stylesheet 1 */

    :root {
      --bg: #060815;
      --bg-2: #0d1531;
      --panel: rgba(14, 24, 52, 0.94);
      --panel-2: rgba(21, 36, 72, 0.92);
      --line: rgba(255, 255, 255, 0.13);
      --text: #eef5ff;
      --muted: #9fb3dc;
      --soft: #d5e3ff;
      --cyan: #68e3ff;
      --gold: #ffd064;
      --orange: #ff8b55;
      --green: #57e6b2;
      --red: #ff6d7a;
      --radius: 12px;
      --shadow: 0 22px 70px rgba(0, 0, 0, 0.38);
    }

    * { box-sizing: border-box; }

    body {
      margin: 0;
      color: var(--text);
      font-family: "Be Vietnam Pro", "Montserrat", "Segoe UI", Arial, sans-serif;
      background:
        linear-gradient(130deg, rgba(255, 139, 85, 0.13), transparent 30%),
        radial-gradient(circle at 78% 8%, rgba(104, 227, 255, 0.18), transparent 36%),
        radial-gradient(circle at 10% 22%, rgba(87, 230, 178, 0.12), transparent 34%),
        var(--bg);
      min-height: 100vh;
    }

    a { color: inherit; text-decoration: none; }

    .shell {
      width: min(1240px, calc(100% - 28px));
      margin: 0 auto;
    }

    .top-strip {
      border-bottom: 1px solid var(--line);
      background: rgba(4, 8, 20, 0.75);
      font-size: 12px;
      color: var(--muted);
    }

    .top-strip .shell {
      min-height: 36px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }

    .top-links {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 10;
      background: rgba(7, 12, 29, 0.88);
      border-bottom: 1px solid var(--line);
      backdrop-filter: blur(14px);
    }

    .nav {
      min-height: 72px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 164px;
    }

    .brand-mark {
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      background: conic-gradient(from 210deg, var(--cyan), var(--gold), var(--orange), var(--cyan));
      color: #08111f;
      font-weight: 900;
      box-shadow: 0 0 28px rgba(104, 227, 255, 0.28);
    }

    .brand strong {
      display: block;
      font-size: 23px;
      letter-spacing: 0.3px;
      line-height: 1;
    }

    .brand span {
      display: block;
      color: var(--muted);
      font-size: 11px;
      margin-top: 5px;
    }

    .main-menu {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      flex-wrap: wrap;
      font-size: 13px;
      color: #dbe8ff;
    }

    .main-menu a {
      padding: 9px 11px;
      border-radius: 999px;
      border: 1px solid transparent;
    }

    .main-menu a.active,
    .main-menu a:hover {
      border-color: rgba(104, 227, 255, 0.22);
      background: rgba(104, 227, 255, 0.08);
    }

    .actions {
      display: flex;
      gap: 8px;
      flex-shrink: 0;
    }

    .btn {
      border: 0;
      border-radius: 999px;
      padding: 10px 15px;
      font-weight: 800;
      color: #08111f;
      background: linear-gradient(135deg, var(--gold), var(--orange));
      cursor: pointer;
      white-space: nowrap;
    }

    .btn.alt {
      color: #edf7ff;
      background: rgba(255, 255, 255, 0.08);
      border: 1px solid rgba(255, 255, 255, 0.16);
    }

    .ticker {
      margin: 14px auto;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: rgba(11, 20, 43, 0.84);
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 12px;
      align-items: center;
      padding: 10px 14px;
      box-shadow: var(--shadow);
    }

    .ticker strong {
      color: var(--gold);
      font-size: 13px;
    }

    .ticker span {
      color: var(--soft);
      font-size: 13px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .ticker small {
      color: var(--cyan);
      font-size: 12px;
    }

    .hero-layout {
      display: grid;
      grid-template-columns: 1.7fr 0.78fr;
      gap: 14px;
      align-items: stretch;
    }

    .hero {
      position: relative;
      overflow: hidden;
      min-height: 438px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background:
        linear-gradient(92deg, rgba(8, 14, 32, 0.96), rgba(8, 14, 32, 0.76) 50%, rgba(8, 14, 32, 0.32)),
        radial-gradient(circle at 72% 32%, rgba(104, 227, 255, 0.22), transparent 30%),
        linear-gradient(140deg, #122656, #1a315f 48%, #271c42);
      box-shadow: var(--shadow);
      padding: 28px;
      display: grid;
      grid-template-columns: 1.08fr 0.92fr;
      gap: 18px;
      align-items: center;
    }

    .hero::after {
      content: "C168";
      position: absolute;
      right: 22px;
      bottom: -15px;
      font-size: 118px;
      line-height: 1;
      font-weight: 900;
      color: rgba(255, 255, 255, 0.035);
      pointer-events: none;
    }

    .hero h1 {
      margin: 0;
      max-width: 620px;
      font-size: 45px;
      line-height: 1.08;
      letter-spacing: 0;
    }

    .hero p {
      margin: 14px 0 0;
      max-width: 610px;
      color: #bfd1f7;
      line-height: 1.72;
      font-size: 15px;
    }

    .hero-actions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 20px;
    }

    .hero-tags {
      margin-top: 18px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .tag {
      border: 1px solid rgba(255, 255, 255, 0.17);
      border-radius: 999px;
      padding: 7px 10px;
      color: #deebff;
      background: rgba(255, 255, 255, 0.07);
      font-size: 12px;
    }

    .hero-board {
      display: grid;
      gap: 10px;
      position: relative;
      z-index: 1;
    }

    .board-card {
      border: 1px solid rgba(255, 255, 255, 0.16);
      background: rgba(8, 14, 32, 0.68);
      border-radius: 12px;
      padding: 13px;
    }

    .board-card strong {
      display: block;
      font-size: 22px;
      color: var(--cyan);
    }

    .board-card span {
      color: var(--muted);
      font-size: 12px;
    }

    .side-panel {
      display: grid;
      gap: 12px;
    }

    .login-box,
    .notice-box,
    .ranking-box {
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--panel);
      padding: 16px;
      box-shadow: var(--shadow);
    }

    .box-title {
      margin: 0 0 12px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
      font-size: 17px;
    }

    .box-title small {
      color: var(--cyan);
      font-size: 12px;
      font-weight: 600;
    }

    .field {
      height: 40px;
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 10px;
      margin-bottom: 8px;
      background: rgba(255, 255, 255, 0.06);
      display: flex;
      align-items: center;
      padding: 0 12px;
      color: #9fb3dc;
      font-size: 13px;
    }

    .panel-list {
      margin: 0;
      padding: 0;
      list-style: none;
      display: grid;
      gap: 9px;
    }

    .panel-list li {
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 8px;
      align-items: center;
      color: var(--soft);
      font-size: 13px;
    }

    .rank {
      width: 24px;
      height: 24px;
      border-radius: 8px;
      background: rgba(104, 227, 255, 0.14);
      display: grid;
      place-items: center;
      color: var(--cyan);
      font-weight: 800;
      font-size: 12px;
    }

    .money {
      color: var(--gold);
      font-weight: 800;
      white-space: nowrap;
    }

    .grid-quick {
      margin-top: 14px;
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 10px;
    }

    .quick-item {
      min-height: 94px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: linear-gradient(155deg, rgba(18, 34, 70, 0.95), rgba(12, 20, 44, 0.92));
      padding: 12px;
      display: grid;
      align-content: space-between;
      box-shadow: 0 14px 44px rgba(0, 0, 0, 0.24);
    }

    .quick-icon {
      width: 34px;
      height: 34px;
      border-radius: 10px;
      background: linear-gradient(135deg, rgba(104, 227, 255, 0.3), rgba(255, 208, 100, 0.22));
      display: grid;
      place-items: center;
      color: var(--cyan);
      font-weight: 900;
    }

    .quick-item strong {
      font-size: 14px;
      margin-top: 9px;
    }

    .quick-item span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
    }

    .content-grid {
      display: grid;
      grid-template-columns: 1fr 330px;
      gap: 14px;
      margin-top: 14px;
      align-items: start;
    }

    .section,
    .rail-box {
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--panel);
      padding: 18px;
      box-shadow: var(--shadow);
    }

    .section + .section,
    .rail-box + .rail-box {
      margin-top: 14px;
    }

    .section-head {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      gap: 12px;
      margin-bottom: 14px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      padding-bottom: 12px;
    }

    .section-head h2 {
      margin: 0;
      font-size: 23px;
      line-height: 1.18;
    }

    .section-head a,
    .rail-box a {
      color: var(--cyan);
      font-size: 13px;
    }

    .game-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
    }

    .game-card {
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 12px;
      background: rgba(7, 13, 30, 0.72);
    }

    .game-art {
      height: 112px;
      position: relative;
      background:
        linear-gradient(145deg, rgba(255, 208, 100, 0.3), rgba(104, 227, 255, 0.2)),
        linear-gradient(45deg, #172c59, #3a2445);
      background-size: cover;
      background-position: center;
      isolation: isolate;
    }

    .game-art::before {
      content: "";
      position: absolute;
      left: 10px;
      top: 10px;
      z-index: 2;
      min-width: 54px;
      height: 24px;
      padding: 0 8px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      color: #06101e;
      background: rgba(255, 255, 255, 0.86);
      font-size: 11px;
      font-weight: 900;
      letter-spacing: 0;
    }

    .game-art::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(180deg, transparent 52%, rgba(2, 8, 18, 0.32)),
        radial-gradient(circle at 80% 25%, rgba(255, 255, 255, 0.12), transparent 0 28px, transparent 29px);
      pointer-events: none;
    }

    .game-card:nth-child(1) .game-art {
      background:
        radial-gradient(circle at 72% 34%, rgba(255, 208, 100, 0.95) 0 16px, transparent 17px),
        radial-gradient(circle at 58% 48%, rgba(104, 227, 255, 0.78) 0 22px, transparent 23px),
        repeating-linear-gradient(135deg, rgba(255,255,255,0.08) 0 2px, transparent 2px 15px),
        linear-gradient(135deg, #173b73, #351f52);
    }

    .game-card:nth-child(1) .game-art::before { content: "LIVE"; }

    .game-card:nth-child(2) .game-art {
      background:
        radial-gradient(circle at 75% 50%, rgba(255, 208, 100, 0.92) 0 18px, transparent 19px),
        radial-gradient(circle at 56% 38%, rgba(255, 139, 85, 0.8) 0 13px, transparent 14px),
        linear-gradient(90deg, rgba(255,255,255,0.08) 1px, transparent 1px),
        linear-gradient(135deg, #3b2f20, #142e62 62%, #061225);
      background-size: auto, auto, 22px 22px, cover;
    }

    .game-card:nth-child(2) .game-art::before { content: "SLOT"; }

    .game-card:nth-child(3) .game-art {
      background:
        radial-gradient(circle at 70% 38%, rgba(255, 255, 255, 0.85) 0 18px, transparent 19px),
        repeating-linear-gradient(90deg, rgba(87,230,178,0.18) 0 18px, rgba(87,230,178,0.08) 18px 36px),
        linear-gradient(135deg, #0f4f3a, #0c2852);
    }

    .game-card:nth-child(3) .game-art::before { content: "SPORT"; }

    .game-card:nth-child(4) .game-art {
      background:
        linear-gradient(74deg, transparent 39%, rgba(255,255,255,0.9) 40% 54%, transparent 55%),
        linear-gradient(108deg, transparent 48%, rgba(255, 109, 122, 0.95) 49% 63%, transparent 64%),
        radial-gradient(circle at 73% 30%, rgba(255, 208, 100, 0.65) 0 20px, transparent 21px),
        linear-gradient(135deg, #452138, #132a59);
    }

    .game-card:nth-child(4) .game-art::before { content: "BAI"; }

    .game-card:nth-child(5) .game-art {
      background:
        radial-gradient(circle at 70% 42%, rgba(104, 227, 255, 0.62) 0 15px, transparent 16px),
        radial-gradient(circle at 48% 56%, rgba(255,255,255,0.32) 0 9px, transparent 10px),
        radial-gradient(circle at 84% 24%, rgba(255,255,255,0.22) 0 7px, transparent 8px),
        linear-gradient(135deg, #064268, #0a1740);
    }

    .game-card:nth-child(5) .game-art::before { content: "FISH"; }

    .game-card:nth-child(6) .game-art {
      background:
        linear-gradient(120deg, transparent 35%, rgba(104, 227, 255, 0.36) 36% 41%, transparent 42%),
        linear-gradient(48deg, transparent 45%, rgba(255, 208, 100, 0.36) 46% 50%, transparent 51%),
        radial-gradient(circle at 76% 36%, rgba(255, 139, 85, 0.75) 0 18px, transparent 19px),
        linear-gradient(135deg, #1b1957, #351852);
    }

    .game-card:nth-child(6) .game-art::before { content: "ESPORT"; }

    .game-card:nth-child(7) .game-art {
      background:
        radial-gradient(circle at 72% 35%, rgba(255, 208, 100, 0.95) 0 14px, transparent 15px),
        radial-gradient(circle at 56% 55%, rgba(104, 227, 255, 0.85) 0 13px, transparent 14px),
        radial-gradient(circle at 82% 62%, rgba(255,255,255,0.8) 0 10px, transparent 11px),
        repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0 1px, transparent 1px 13px),
        linear-gradient(135deg, #27365d, #10182f);
    }

    .game-card:nth-child(7) .game-art::before { content: "XOSO"; }

    .game-card:nth-child(8) .game-art {
      background:
        radial-gradient(circle at 72% 40%, rgba(255,255,255,0.9) 0 24px, transparent 25px),
        radial-gradient(circle at 78% 35%, #06101e 0 3px, transparent 4px),
        radial-gradient(circle at 68% 43%, #06101e 0 3px, transparent 4px),
        radial-gradient(circle at 82% 48%, #06101e 0 3px, transparent 4px),
        linear-gradient(135deg, #143664, #46213f);
    }

    .game-card:nth-child(8) .game-art::before { content: "MINI"; }

    .game-card:nth-child(1) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-001.jpg');
      background-position: center 45%;
    }

    .game-card:nth-child(2) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-002.jpg');
      background-position: center 45%;
    }

    .game-card:nth-child(3) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-003.jpg');
      background-position: center 46%;
    }

    .game-card:nth-child(4) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-004.jpg');
      background-position: center 62%;
    }

    .game-card:nth-child(5) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-005.jpg');
      background-position: center 55%;
    }

    .game-card:nth-child(6) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-006.jpg');
      background-position: center 45%;
    }

    .game-card:nth-child(7) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-007.jpg');
      background-position: center 48%;
    }

    .game-card:nth-child(8) .game-art {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0), rgba(8, 14, 32, 0.14)), url('/assets/5666bet-refasset-008.jpg');
      background-position: center 54%;
    }

    .game-meta {
      padding: 11px;
    }

    .game-meta h3 {
      margin: 0 0 5px;
      font-size: 15px;
      line-height: 1.25;
    }

    .game-meta p {
      margin: 0;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .bonus-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
    }

    .bonus {
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 12px;
      padding: 14px;
      background:
        linear-gradient(135deg, rgba(255, 139, 85, 0.16), rgba(104, 227, 255, 0.09)),
        rgba(8, 14, 32, 0.74);
      min-height: 146px;
    }

    .bonus strong {
      display: block;
      color: var(--gold);
      font-size: 24px;
      margin-bottom: 4px;
    }

    .bonus h3 {
      margin: 0 0 8px;
      font-size: 16px;
    }

    .bonus p {
      margin: 0;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.62;
    }

    .article-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
    }

    .article {
      display: grid;
      grid-template-columns: 118px 1fr;
      gap: 12px;
      min-height: 104px;
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 12px;
      background: rgba(7, 13, 30, 0.72);
      padding: 10px;
    }

    .thumb {
      border-radius: 10px;
      background:
        linear-gradient(135deg, rgba(104, 227, 255, 0.28), rgba(255, 208, 100, 0.24)),
        #10234b;
      min-height: 84px;
      position: relative;
      overflow: hidden;
      isolation: isolate;
    }

    .thumb::before {
      content: "";
      position: absolute;
      inset: 9px 9px auto auto;
      width: 34px;
      height: 24px;
      border-radius: 7px;
      background: rgba(255, 255, 255, 0.24);
      z-index: 2;
    }

    .thumb::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(180deg, transparent 34%, rgba(2, 8, 18, 0.55)),
        radial-gradient(circle at 24% 74%, rgba(255, 255, 255, 0.2), transparent 0 34px, transparent 35px);
    }

    .article:nth-child(1) .thumb {
      background:
        linear-gradient(90deg, rgba(255,255,255,0.82) 0 5px, transparent 5px 14px),
        linear-gradient(180deg, rgba(104,227,255,0.28), transparent 58%),
        linear-gradient(135deg, #1f467a, #132247);
      background-size: 22px 52px, auto, cover;
    }

    .article:nth-child(2) .thumb {
      background:
        radial-gradient(circle at 66% 42%, rgba(255, 208, 100, 0.9) 0 18px, transparent 19px),
        radial-gradient(circle at 45% 52%, rgba(104, 227, 255, 0.45) 0 24px, transparent 25px),
        linear-gradient(135deg, #3c213e, #173b73);
    }

    .article:nth-child(3) .thumb {
      background:
        linear-gradient(90deg, transparent 22%, rgba(255,255,255,0.78) 23% 47%, transparent 48%),
        linear-gradient(0deg, transparent 34%, rgba(255,208,100,0.52) 35% 45%, transparent 46%),
        linear-gradient(135deg, #12305f, #274d35);
    }

    .article:nth-child(4) .thumb {
      background:
        radial-gradient(circle at 68% 44%, rgba(104, 227, 255, 0.86) 0 20px, transparent 21px),
        linear-gradient(135deg, transparent 46%, rgba(255,255,255,0.48) 47% 53%, transparent 54%),
        linear-gradient(135deg, #0d3155, #1e264d);
    }

    .article:nth-child(5) .thumb {
      background:
        linear-gradient(90deg, transparent 42%, rgba(255,208,100,0.9) 43% 57%, transparent 58%),
        linear-gradient(0deg, transparent 38%, rgba(255,208,100,0.75) 39% 54%, transparent 55%),
        linear-gradient(135deg, #3a2445, #183a68);
    }

    .article:nth-child(6) .thumb {
      background:
        linear-gradient(90deg, rgba(104,227,255,0.44) 0 18%, transparent 18% 23%, rgba(255,208,100,0.52) 23% 41%, transparent 41% 46%, rgba(255,139,85,0.48) 46% 64%, transparent 64%),
        linear-gradient(135deg, #142d5d, #111a39);
    }

    .article:nth-child(1) .thumb {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0.04), rgba(8, 14, 32, 0.42)), url('/assets/5666bet-refasset-009.jpg');
      background-size: cover;
      background-position: center;
    }

    .article:nth-child(2) .thumb {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0.04), rgba(8, 14, 32, 0.42)), url('/assets/5666bet-refasset-010.jpg');
      background-size: cover;
      background-position: center;
    }

    .article:nth-child(3) .thumb {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0.04), rgba(8, 14, 32, 0.42)), url('/assets/5666bet-refasset-011.jpg');
      background-size: cover;
      background-position: center;
    }

    .article:nth-child(4) .thumb {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0.04), rgba(8, 14, 32, 0.42)), url('/assets/5666bet-refasset-012.jpg');
      background-size: cover;
      background-position: center;
    }

    .article:nth-child(5) .thumb {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0.04), rgba(8, 14, 32, 0.42)), url('/assets/5666bet-refasset-013.jpg');
      background-size: cover;
      background-position: center;
    }

    .article:nth-child(6) .thumb {
      background-image: linear-gradient(180deg, rgba(8, 14, 32, 0.04), rgba(8, 14, 32, 0.42)), url('/assets/5666bet-refasset-014.jpg');
      background-size: cover;
      background-position: center;
    }

    .article h3 {
      margin: 0 0 5px;
      font-size: 15px;
      line-height: 1.32;
    }

    .article p {
      margin: 0 0 7px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .date {
      color: var(--cyan);
      font-size: 11px;
      font-weight: 700;
    }

    .guide-layout {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
    }

    .guide-card {
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 12px;
      background: rgba(7, 13, 30, 0.72);
      padding: 14px;
    }

    .guide-card h3 {
      margin: 0 0 10px;
      font-size: 16px;
    }

    .steps {
      margin: 0;
      padding-left: 18px;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.72;
    }

    .data-table {
      width: 100%;
      border-collapse: collapse;
      overflow: hidden;
      border-radius: 12px;
      font-size: 13px;
    }

    .data-table th,
    .data-table td {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      padding: 11px 10px;
      text-align: left;
      color: var(--soft);
    }

    .data-table th {
      color: var(--cyan);
      background: rgba(104, 227, 255, 0.07);
      font-weight: 800;
    }

    .data-table tr:last-child td { border-bottom: 0; }

    .rail-news {
      margin: 0;
      padding: 0;
      list-style: none;
      display: grid;
      gap: 12px;
    }

    .rail-news li {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      padding-bottom: 11px;
      color: var(--soft);
      font-size: 13px;
      line-height: 1.5;
    }

    .rail-news li:last-child {
      border-bottom: 0;
      padding-bottom: 0;
    }

    .rail-news span {
      display: block;
      color: var(--muted);
      font-size: 11px;
      margin-top: 5px;
    }

    .support-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
    }

    .support {
      border-radius: 12px;
      padding: 13px;
      background: rgba(255, 255, 255, 0.07);
      border: 1px solid rgba(255, 255, 255, 0.12);
    }

    .support strong {
      display: block;
      font-size: 14px;
      margin-bottom: 5px;
    }

    .support span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
    }

    .hero {
      background:
        linear-gradient(92deg, rgba(8, 14, 32, 0.98), rgba(8, 14, 32, 0.84) 49%, rgba(8, 14, 32, 0.34)),
        url('/assets/5666bet-refasset-015.jpg');
      background-size: cover;
      background-position: center;
    }

    .quick-item,
    .bonus,
    .guide-card,
    .support,
    .login-box,
    .ranking-box {
      position: relative;
      overflow: hidden;
      isolation: isolate;
    }

    .quick-item > *,
    .bonus > *,
    .guide-card > *,
    .support > *,
    .login-box > *,
    .ranking-box > * {
      position: relative;
      z-index: 1;
    }

    .quick-item::before,
    .bonus::before,
    .guide-card::before,
    .support::before,
    .login-box::before,
    .ranking-box::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background-size: cover;
      background-position: center;
      opacity: 0.44;
      transform: scale(1.02);
    }

    .quick-item::after,
    .bonus::after,
    .guide-card::after,
    .support::after,
    .login-box::after,
    .ranking-box::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background:
        linear-gradient(180deg, rgba(8, 14, 32, 0.18), rgba(8, 14, 32, 0.86)),
        radial-gradient(circle at 80% 18%, rgba(104, 227, 255, 0.16), transparent 35%);
    }

    .quick-item:nth-child(1)::before { background-image: url('/assets/5666bet-refasset-016.jpg'); }
    .quick-item:nth-child(2)::before { background-image: url('/assets/5666bet-refasset-017.jpg'); }
    .quick-item:nth-child(3)::before { background-image: url('/assets/5666bet-refasset-018.jpg'); }
    .quick-item:nth-child(4)::before { background-image: url('/assets/5666bet-refasset-019.jpg'); }
    .quick-item:nth-child(5)::before { background-image: url('/assets/5666bet-refasset-020.jpg'); }
    .quick-item:nth-child(6)::before { background-image: url('/assets/5666bet-refasset-021.jpg'); }

    .bonus:nth-child(1)::before { background-image: url('/assets/5666bet-refasset-022.jpg'); }
    .bonus:nth-child(2)::before { background-image: url('/assets/5666bet-refasset-023.jpg'); }
    .bonus:nth-child(3)::before { background-image: url('/assets/5666bet-refasset-024.jpg'); }

    .guide-card:nth-child(1)::before { background-image: url('/assets/5666bet-refasset-025.jpg'); }
    .guide-card:nth-child(2)::before { background-image: url('/assets/5666bet-refasset-026.jpg'); }
    .guide-card:nth-child(3)::before { background-image: url('/assets/5666bet-refasset-027.jpg'); }

    .support:nth-child(1)::before { background-image: url('/assets/5666bet-refasset-028.jpg'); }
    .support:nth-child(2)::before { background-image: url('/assets/5666bet-refasset-029.jpg'); }
    .support:nth-child(3)::before { background-image: url('/assets/5666bet-refasset-030.jpg'); }
    .support:nth-child(4)::before { background-image: url('/assets/5666bet-refasset-031.jpg'); }

    .login-box::before { background-image: url('/assets/5666bet-refasset-032.jpg'); }
    .ranking-box::before { background-image: url('/assets/5666bet-refasset-033.jpg'); }

    .faq-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
    }

    .faq {
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 12px;
      background: rgba(7, 13, 30, 0.72);
      padding: 14px;
    }

    .faq strong {
      display: block;
      margin-bottom: 6px;
      font-size: 15px;
    }

    .faq p {
      margin: 0;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.6;
    }

    .footer {
      margin: 14px 0 22px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: rgba(5, 10, 24, 0.78);
      padding: 18px;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.7;
      display: grid;
      grid-template-columns: 1.2fr 0.8fr;
      gap: 18px;
    }

    .footer strong { color: var(--text); }

    @media (max-width: 1180px) {
      .hero-layout,
      .content-grid,
      .footer {
        grid-template-columns: 1fr;
      }

      .grid-quick {
        grid-template-columns: repeat(3, 1fr);
      }
    }

    @media (max-width: 900px) {
      .hero {
        grid-template-columns: 1fr;
        min-height: auto;
      }

      .game-grid,
      .bonus-grid,
      .guide-layout,
      .article-list,
      .faq-grid {
        grid-template-columns: 1fr 1fr;
      }

      .nav {
        align-items: flex-start;
      }
    }

    @media (max-width: 640px) {
      .shell {
        width: min(100% - 18px, 1240px);
      }

      .top-strip .shell,
      .nav,
      .ticker {
        align-items: flex-start;
      }

      .nav,
      .ticker {
        grid-template-columns: 1fr;
        display: grid;
      }

      .actions,
      .main-menu {
        width: 100%;
        justify-content: flex-start;
      }

      .main-menu a {
        padding: 7px 9px;
      }

      .hero {
        padding: 20px;
      }

      .hero h1 {
        font-size: 32px;
      }

      .grid-quick,
      .game-grid,
      .bonus-grid,
      .guide-layout,
      .article-list,
      .faq-grid,
      .support-grid {
        grid-template-columns: 1fr;
      }

      .article {
        grid-template-columns: 96px 1fr;
      }

      .section,
      .rail-box {
        padding: 14px;
      }
    }
  

/* Production article/list refinements */
html { scroll-behavior: smooth; }
img { max-width: 100%; display: block; }
.brand span span { color: var(--muted); font-size: 11px; margin-top: 5px; }
.article a { color: inherit; }
.article .thumb { display: block; }
.article-hero {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background:
    linear-gradient(95deg, rgba(8, 14, 32, 0.96), rgba(8, 14, 32, 0.7)),
    url('/assets/5666bet-refasset-034.jpg');
  background-size: cover;
  background-position: center;
  padding: 34px 28px;
  box-shadow: var(--shadow);
}
.article-hero h1 {
  margin: 0;
  max-width: 860px;
  font-size: 40px;
  line-height: 1.14;
}
.article-hero p {
  max-width: 760px;
  color: #bfd1f7;
  line-height: 1.72;
  margin: 12px 0 0;
}
.breadcrumb {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 13px;
}
.breadcrumb a { color: var(--cyan); }
.article-page-grid {
  grid-template-columns: 1fr 330px;
}
.article-shell {
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel);
  padding: 24px;
  box-shadow: var(--shadow);
}
.article-shell h1 {
  margin: 0 0 12px;
  font-size: 34px;
  line-height: 1.18;
}
.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 18px;
  color: var(--muted);
  font-size: 13px;
}
.article-body {
  color: #dbe8ff;
  font-size: 15px;
  line-height: 1.85;
}
.article-body h2 {
  margin: 24px 0 10px;
  color: var(--text);
  font-size: 24px;
}
.article-body p,
.article-body ul,
.article-body ol { margin: 0 0 14px; }
.article-body a { color: var(--cyan); font-weight: 700; }
.article-body li { margin-bottom: 8px; }
.pagebreak,
.prenext {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.12);
}
.prenext {
  display: grid;
  gap: 10px;
  color: var(--soft);
  font-size: 14px;
}
.prenext a { color: var(--cyan); }
.related-card {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 10px;
  padding: 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(7,13,30,.72);
  margin-bottom: 10px;
}
.related-card .thumb { min-height: 74px; }
.related-card h3 {
  margin: 0 0 4px;
  font-size: 14px;
  line-height: 1.35;
}
.related-card p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}
.static-note {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.06);
}
.pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  margin: 16px 0 0;
  list-style: none;
}
.pagination a,
.pagination span,
.pagination li {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  padding: 7px 11px;
  color: var(--soft);
  background: rgba(255,255,255,.06);
  font-size: 13px;
}
@media (max-width: 900px) {
  .article-page-grid { grid-template-columns: 1fr; }
  .article-hero h1, .article-shell h1 { font-size: 30px; }
}
@media (max-width: 640px) {
  .article-hero { padding: 22px 18px; }
  .article-shell { padding: 16px; }
  .article-hero h1, .article-shell h1 { font-size: 26px; }
  .related-card { grid-template-columns: 86px 1fr; }
}


/* Target Bengali content and Dede integration */
:root{--clone-dark:#3a2445;--clone-bg2:#ffd064;--clone-accent:#68e3ff;--clone-gold:#ffd064;--clone-blue:#9fb3dc;}
body.true-reference-clone{font-family:Arial,"Kohinoor Bangla","Noto Sans Bengali",sans-serif;letter-spacing:0;}
body.true-reference-clone img[src*="5666bet-logo"]{height:auto;object-fit:contain;}
body.true-reference-clone img[src*="5666bet-hero"]{height:auto;object-fit:contain;}
body.true-reference-clone .clone-visual-band{padding:38px 0;background:rgba(255,255,255,.92);}
body.true-reference-clone .clone-visual-inner{width:min(1180px,calc(100% - 32px));margin:0 auto;display:grid;grid-template-columns:320px minmax(0,1fr);gap:22px;align-items:center;}
body.true-reference-clone .clone-visual-copy h2{margin:0 0 10px;font-size:clamp(26px,3vw,42px);line-height:1.16;font-weight:900;color:var(--clone-dark);}
body.true-reference-clone .clone-visual-copy p{margin:0;color:#5f6675;line-height:1.7;}
body.true-reference-clone .clone-visual-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
body.true-reference-clone .clone-visual-card{margin:0;border-radius:12px;overflow:hidden;background:#fff;border:1px solid rgba(20,25,40,.12);box-shadow:0 16px 36px rgba(20,25,40,.1);}
body.true-reference-clone .clone-visual-card img{display:block;width:100%;aspect-ratio:1.25/1;object-fit:cover;}
body.true-reference-clone .clone-visual-card figcaption{padding:10px 12px;font-weight:900;color:var(--clone-dark);}
.dede-update-zone,.article-detail-zone{padding:34px 0;}
.clone-update-inner,.clone-article-inner{width:min(1180px,calc(100% - 32px));margin:0 auto;}
.clone-update-head{text-align:center;margin-bottom:20px;}
.clone-update-head h2{margin:0;font-size:clamp(26px,3vw,38px);font-weight:900;line-height:1.2;}
.clone-update-head p{max-width:760px;margin:10px auto 0;color:#667085;}
.clone-update-list{display:grid;gap:16px;}
.clone-update-card{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;padding:16px;border:1px solid rgba(20,25,40,.12);border-radius:10px;background:#fff;box-shadow:0 14px 34px rgba(20,25,40,.08);}
.clone-update-thumb{min-height:120px;border-radius:8px;background:linear-gradient(135deg,var(--clone-dark),var(--clone-accent));color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:900;text-decoration:none;}
.clone-update-tag{display:inline-flex;margin-bottom:6px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.06);color:var(--clone-accent);font-weight:900;font-size:12px;}
.clone-update-body h3{margin:0;font-size:22px;line-height:1.32;}
.clone-update-body p{margin:8px 0;color:#5f6675;}
.clone-update-meta{display:flex;flex-wrap:wrap;gap:12px;color:#8a91a1;font-size:13px;}
.clone-readmore{display:inline-flex;margin-top:10px;color:var(--clone-accent);font-weight:900;text-decoration:none;}
.clone-pagination{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:22px 0 0;}
.clone-pagination li{list-style:none;}
.clone-pagination a,.clone-pagination span{display:inline-flex;min-width:38px;min-height:36px;align-items:center;justify-content:center;border:1px solid rgba(20,25,40,.14);border-radius:8px;padding:0 12px;background:#fff;color:#1c2433;text-decoration:none;font-weight:800;}
.clone-article-inner{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start;}
.clone-article,.clone-article-side{background:#fff;border:1px solid rgba(20,25,40,.12);border-radius:10px;box-shadow:0 14px 34px rgba(20,25,40,.08);padding:24px;}
.clone-crumb{color:#778094;font-size:14px;margin-bottom:12px;}
.clone-article h1{margin:0;font-size:clamp(30px,3vw,46px);line-height:1.2;}
.clone-article-meta{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0 18px;color:#7d8494;font-size:14px;}
.clone-article-summary{padding:14px 16px;border-left:4px solid var(--clone-accent);background:rgba(0,0,0,.04);margin-bottom:20px;color:#505a6c;}
.clone-article-body{font-size:17px;line-height:1.9;color:#252b38;}
.clone-prenext{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;}
.clone-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.clone-actions a,.clone-article-side a{display:inline-flex;margin:6px 6px 0 0;padding:9px 12px;border-radius:8px;background:var(--clone-accent);color:#fff;text-decoration:none;font-weight:800;}
@media(max-width:900px){body.true-reference-clone .clone-visual-inner{grid-template-columns:1fr;}body.true-reference-clone .clone-visual-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:780px){.clone-update-card,.clone-article-inner,.clone-prenext{grid-template-columns:1fr;}}
