/* reference stylesheet 1 */
:root {
      --ink: #07090d;
      --ink-soft: #12161d;
      --cyan: #12b8ee;
      --cyan-deep: #0787c4;
      --gold: #ffc928;
      --orange: #f27912;
      --line: #e4e8ee;
      --text: #141922;
      --muted: #697483;
      --panel: #ffffff;
      --page: #f4f7fa;
      --radius: 8px;
      --shadow: 0 14px 34px rgba(18, 29, 43, .10);
    }

    * {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      background: var(--page);
      color: var(--text);
      font-family: Arial, "Helvetica Neue", sans-serif;
      letter-spacing: 0;
      overflow-x: hidden;
    }

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

    .shell {
      width: min(1220px, calc(100vw - 56px));
      margin: 0 auto;
    }

    .topbar {
      background: #050608;
      border-bottom: 1px solid rgba(255, 255, 255, .08);
    }

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

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      color: #fff;
      font-weight: 900;
      font-size: 31px;
      line-height: 1;
    }

    .brand-mark {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 8px;
      color: #0b0c10;
      font-size: 17px;
      font-weight: 900;
      background:
        linear-gradient(135deg, #fff176 0%, #ffbb20 40%, #f47713 100%);
      box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .22), 0 0 20px rgba(255, 201, 40, .26);
    }

    .brand strong {
      color: var(--gold);
    }

    .actions {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .btn {
      min-height: 40px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      padding: 0 20px;
      border-radius: 7px;
      border: 1px solid rgba(255, 255, 255, .22);
      background: transparent;
      color: #fff;
      font-size: 14px;
      font-weight: 800;
      white-space: nowrap;
    }

    .btn svg {
      width: 16px;
      height: 16px;
      flex: none;
    }

    .btn.primary {
      border-color: transparent;
      color: #171006;
      background: linear-gradient(180deg, #ffe36a, #ffc321);
      box-shadow: 0 7px 18px rgba(255, 201, 40, .24);
    }

    .nav {
      background: linear-gradient(90deg, #10c8f4 0%, #099be1 100%);
    }

    .nav .shell {
      height: 46px;
      display: flex;
      align-items: center;
      gap: 38px;
      color: #fff;
      font-size: 14px;
      font-weight: 900;
      text-transform: uppercase;
    }

    .nav a {
      position: relative;
      height: 46px;
      display: inline-flex;
      align-items: center;
      text-shadow: 0 1px 0 rgba(0, 0, 0, .16);
    }

    .nav a.active {
      color: #ffe86a;
    }

    .nav a.active::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 4px;
      border-radius: 4px 4px 0 0;
      background: #ffe35b;
    }

    .hero {
      overflow: hidden;
      background:
        radial-gradient(circle at 80% 45%, rgba(255, 193, 32, .33), transparent 28%),
        linear-gradient(105deg, #050608 0%, #0c1018 42%, #120b05 67%, #1c0c02 100%);
      color: #fff;
    }

    .hero .shell {
      min-height: 440px;
      display: grid;
      grid-template-columns: 1fr 540px;
      align-items: center;
      gap: 46px;
      position: relative;
    }

    .hero-copy h1 {
      margin: 0;
      max-width: 660px;
      font-size: 56px;
      line-height: 1.06;
      font-weight: 900;
      color: #fff;
    }

    .hero-copy h1 span {
      display: block;
    }

    .hero-copy,
    .article > div,
    .card,
    .sidebar,
    .topic-card,
    .step-card,
    .info-card {
      min-width: 0;
    }

    .hero-copy p {
      max-width: 620px;
      margin: 22px 0 30px;
      color: #dbe3ed;
      font-size: 17px;
      line-height: 1.75;
      font-weight: 500;
    }

    .cta-row {
      display: flex;
      flex-wrap: wrap;
      gap: 16px;
    }

    .cta {
      height: 48px;
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 0 24px;
      border-radius: 7px;
      font-weight: 900;
      font-size: 15px;
      border: 1px solid rgba(255, 255, 255, .28);
      color: #fff;
    }

    .cta.main {
      border: 0;
      color: #160f05;
      background: linear-gradient(180deg, #ffe066, #ffc018);
      box-shadow: 0 12px 28px rgba(255, 192, 24, .25);
    }

    .hero-art {
      position: relative;
      min-height: 360px;
    }

    .orbit {
      position: absolute;
      left: 42px;
      right: -52px;
      bottom: 22px;
      height: 118px;
      border-radius: 50%;
      border: 2px solid rgba(255, 184, 32, .72);
      transform: rotate(-8deg);
      box-shadow: 0 0 28px rgba(255, 154, 12, .42), inset 0 0 30px rgba(255, 198, 45, .18);
    }

    .device {
      position: absolute;
      right: 68px;
      top: 28px;
      width: 318px;
      height: 318px;
      padding: 22px;
      border-radius: 28px;
      border: 2px solid rgba(255, 212, 124, .74);
      background:
        linear-gradient(145deg, rgba(255, 255, 255, .08), transparent 32%),
        linear-gradient(180deg, #171717, #07090d);
      box-shadow: 0 26px 48px rgba(0, 0, 0, .48), 0 0 0 7px rgba(255, 192, 24, .09);
      transform: rotate(6deg);
    }

    .device-logo {
      text-align: center;
      color: #fff;
      font-size: 29px;
      font-weight: 900;
      margin-bottom: 16px;
    }

    .device-logo span {
      color: var(--gold);
    }

    .balance {
      height: 56px;
      margin-bottom: 14px;
      border: 1px solid rgba(255, 255, 255, .15);
      border-radius: 8px;
      padding: 8px 14px;
      color: #fff;
      background: rgba(0, 0, 0, .36);
    }

    .balance small {
      display: block;
      color: #b7c3d1;
      font-size: 11px;
      font-weight: 700;
    }

    .balance strong {
      color: #ffd83d;
      font-size: 18px;
      line-height: 1.5;
    }

    .game-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
    }

    .game-tile {
      height: 67px;
      display: grid;
      place-items: center;
      border-radius: 10px;
      color: #fff;
      text-align: center;
      font-size: 11px;
      font-weight: 900;
      background: linear-gradient(180deg, #292d34, #11141a);
      border: 1px solid rgba(255, 255, 255, .12);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    }

    .game-tile span {
      display: block;
      margin-bottom: 5px;
      color: #ffd13f;
      font-size: 24px;
    }

    .coin {
      position: absolute;
      width: 58px;
      height: 58px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      color: #5a2d00;
      font-size: 24px;
      font-weight: 900;
      background: linear-gradient(145deg, #fff07a, #f89b14);
      border: 5px solid rgba(113, 60, 7, .35);
      box-shadow: 0 12px 28px rgba(255, 156, 18, .35);
    }

    .coin.one {
      left: 26px;
      top: 104px;
      transform: rotate(-16deg);
    }

    .coin.two {
      right: 4px;
      bottom: 72px;
      width: 86px;
      height: 86px;
      font-size: 34px;
    }

    .trophy {
      position: absolute;
      left: 80px;
      bottom: 102px;
      width: 88px;
      height: 86px;
      border-radius: 0 0 28px 28px;
      background: linear-gradient(145deg, #ffe474, #f79211);
      box-shadow: 0 13px 32px rgba(247, 146, 17, .38);
    }

    .trophy::before,
    .trophy::after {
      content: "";
      position: absolute;
      top: 14px;
      width: 42px;
      height: 42px;
      border: 8px solid #f7a51e;
      border-radius: 50%;
    }

    .trophy::before {
      left: -30px;
    }

    .trophy::after {
      right: -30px;
    }

    .features {
      margin-top: 18px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }

    .feature {
      min-height: 72px;
      display: grid;
      grid-template-columns: 56px 1fr 38px;
      align-items: center;
      gap: 16px;
      padding: 14px 18px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--panel);
      box-shadow: var(--shadow);
    }

    .num {
      width: 46px;
      height: 46px;
      display: grid;
      place-items: center;
      border-radius: 7px;
      color: #fff;
      font-size: 18px;
      font-weight: 900;
      background: linear-gradient(180deg, #fb8a16, #eb660e);
    }

    .feature h3,
    .card h3,
    .sidebar h3 {
      margin: 0;
      font-size: 20px;
      line-height: 1.2;
      font-weight: 900;
    }

    .feature p {
      margin: 6px 0 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.35;
    }

    .feature svg {
      width: 30px;
      height: 30px;
      color: var(--orange);
    }

    .page-main {
      padding: 16px 0 30px;
    }

    .layout {
      display: grid;
      grid-template-columns: 1fr 390px;
      gap: 18px;
      align-items: start;
      margin-top: 14px;
    }

    .card,
    .sidebar {
      background: #fff;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }

    .card {
      padding: 18px 20px;
    }

    .section-title {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding-bottom: 13px;
      border-bottom: 1px solid var(--line);
      margin-bottom: 2px;
    }

    .section-title h2 {
      margin: 0;
      font-size: 24px;
      line-height: 1.2;
      font-weight: 900;
    }

    .article {
      display: grid;
      grid-template-columns: 230px 1fr;
      gap: 20px;
      padding: 14px 0;
      border-bottom: 1px solid var(--line);
    }

    .article:last-of-type {
      border-bottom: 0;
    }

    .thumb {
      height: 118px;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 16px;
      border-radius: 7px;
      overflow: hidden;
      color: #fff;
      font-weight: 900;
      background: linear-gradient(135deg, #171b22, #291307 50%, #f49b19);
      box-shadow: inset 0 -42px 60px rgba(0, 0, 0, .42);
    }

    .thumb .big {
      color: #ffe047;
      font-size: 25px;
      line-height: 1.04;
    }

    .thumb.sport {
      background: linear-gradient(135deg, #0a1320, #164a65 50%, #101318);
    }

    .thumb.cards {
      background: linear-gradient(135deg, #170d0b, #53190c 48%, #e24019);
    }

    .thumb.app {
      background: linear-gradient(135deg, #08131b, #0f6e9d 48%, #13b9ee);
    }

    .thumb.promo {
      background: linear-gradient(135deg, #1c0d05, #80410c 48%, #ffbd2e);
    }

    .article-meta {
      color: var(--orange);
      font-size: 12px;
      text-transform: uppercase;
      font-weight: 900;
      margin: 5px 0 8px;
    }

    .article h3 {
      margin: 0 0 8px;
      font-size: 18px;
      line-height: 1.35;
      font-weight: 900;
    }

    .article p {
      margin: 0;
      color: #657080;
      font-size: 14px;
      line-height: 1.55;
    }

    .byline {
      display: flex;
      align-items: center;
      gap: 20px;
      color: #8a95a3;
      font-size: 12px;
      margin-top: 10px;
    }

    .more {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 7px 0 0 250px;
      height: 42px;
      padding: 0 24px;
      border-radius: 7px;
      border: 1px solid var(--line);
      color: var(--text);
      font-size: 14px;
      font-weight: 900;
      background: #fff;
    }

    .section-block {
      margin-top: 18px;
    }

    .section-head {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 20px;
      margin-bottom: 14px;
    }

    .section-head h2 {
      margin: 0;
      font-size: 24px;
      line-height: 1.2;
      font-weight: 900;
    }

    .section-head p {
      max-width: 610px;
      margin: 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.55;
    }

    .topic-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
    }

    .topic-card {
      min-height: 150px;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }

    .topic-icon {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      margin-bottom: 16px;
      border-radius: 8px;
      color: #170f04;
      font-size: 21px;
      font-weight: 900;
      background: linear-gradient(180deg, #ffe36a, #ffb81a);
    }

    .topic-card h3 {
      margin: 0 0 8px;
      font-size: 18px;
      line-height: 1.2;
      font-weight: 900;
    }

    .topic-card p {
      margin: 0;
      color: #657080;
      font-size: 14px;
      line-height: 1.5;
    }

    .guide-band {
      margin-top: 18px;
      padding: 24px;
      border-radius: var(--radius);
      color: #fff;
      background:
        radial-gradient(circle at 88% 10%, rgba(255, 201, 40, .26), transparent 28%),
        linear-gradient(110deg, #080b10 0%, #111923 52%, #201006 100%);
      box-shadow: 0 16px 36px rgba(9, 12, 18, .18);
    }

    .guide-band .section-head p {
      color: #c6d0dc;
    }

    .step-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
    }

    .step-card {
      min-height: 138px;
      padding: 18px;
      border-radius: 8px;
      background: rgba(255, 255, 255, .07);
      border: 1px solid rgba(255, 255, 255, .12);
    }

    .step-card strong {
      display: inline-grid;
      place-items: center;
      width: 34px;
      height: 34px;
      margin-bottom: 14px;
      border-radius: 7px;
      color: #180f04;
      background: var(--gold);
      font-size: 15px;
      font-weight: 900;
    }

    .step-card h3 {
      margin: 0 0 8px;
      color: #fff;
      font-size: 17px;
      line-height: 1.25;
      font-weight: 900;
    }

    .step-card p {
      margin: 0;
      color: #c6d0dc;
      font-size: 13px;
      line-height: 1.5;
    }

    .knowledge-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 18px;
      margin-top: 18px;
    }

    .info-card {
      min-height: 270px;
      padding: 20px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #fff;
      box-shadow: var(--shadow);
    }

    .info-card h2 {
      margin: 0 0 14px;
      font-size: 23px;
      line-height: 1.2;
      font-weight: 900;
    }

    .score-list,
    .faq-list {
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .score-list li {
      display: grid;
      grid-template-columns: 150px 1fr 46px;
      gap: 12px;
      align-items: center;
      padding: 10px 0;
      border-bottom: 1px solid var(--line);
      color: #3e4855;
      font-size: 14px;
      font-weight: 800;
    }

    .score-list li:last-child,
    .faq-list li:last-child {
      border-bottom: 0;
    }

    .bar {
      height: 9px;
      overflow: hidden;
      border-radius: 999px;
      background: #edf1f5;
    }

    .bar span {
      display: block;
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, var(--orange), var(--gold));
    }

    .faq-list li {
      padding: 12px 0;
      border-bottom: 1px solid var(--line);
    }

    .faq-list h3 {
      margin: 0 0 6px;
      font-size: 16px;
      line-height: 1.3;
      font-weight: 900;
    }

    .faq-list p {
      margin: 0;
      color: #657080;
      font-size: 14px;
      line-height: 1.5;
    }

    .sidebar {
      padding: 18px;
      margin-bottom: 14px;
    }

    .side-list {
      margin: 16px 0 0;
      padding: 0;
      list-style: none;
    }

    .side-list li {
      display: grid;
      grid-template-columns: 24px 1fr 34px;
      align-items: center;
      gap: 10px;
      min-height: 29px;
      color: #3e4855;
      font-size: 14px;
      font-weight: 700;
    }

    .side-list svg {
      width: 18px;
      height: 18px;
      color: var(--orange);
    }

    .count {
      display: inline-flex;
      justify-content: center;
      min-width: 31px;
      padding: 3px 7px;
      border-radius: 999px;
      border: 1px solid var(--line);
      color: #6d7785;
      font-size: 12px;
      font-weight: 800;
      background: #f8fafc;
    }

    .hot {
      margin: 15px 0 0;
      padding: 0;
      list-style: none;
      counter-reset: hot;
    }

    .hot li {
      counter-increment: hot;
      display: grid;
      grid-template-columns: 24px 1fr;
      gap: 10px;
      min-height: 28px;
      color: #3e4855;
      font-size: 14px;
      line-height: 1.35;
      font-weight: 700;
    }

    .hot li::before {
      content: counter(hot);
      color: var(--orange);
      font-size: 23px;
      line-height: 1;
      font-weight: 900;
    }

    .footer {
      background: #111821;
      color: #c7d0dc;
      font-size: 13px;
      padding: 22px 0;
    }

    .footer .shell {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
    }

    .footer-links {
      display: flex;
      flex-wrap: wrap;
      gap: 28px;
    }

    @media (max-width: 900px) {
      .shell {
        width: auto;
        max-width: none;
        margin-left: 14px;
        margin-right: 14px;
      }

      .topbar .shell,
      .footer .shell {
        height: auto;
        padding: 16px 0;
        align-items: flex-start;
        flex-direction: column;
      }

      .nav .shell {
        overflow-x: auto;
        gap: 24px;
        width: 100vw;
        max-width: 100vw;
        margin-left: 0;
        margin-right: 0;
        padding: 0 14px;
      }

      .hero .shell,
      .layout,
      .features,
      .topic-grid,
      .step-grid,
      .knowledge-grid {
        grid-template-columns: 1fr;
      }

      .hero .shell {
        display: block;
        padding: 34px 0;
      }

      .hero-copy h1 {
        max-width: 100%;
        font-size: 30px;
        overflow-wrap: anywhere;
      }

      .hero-copy p {
        max-width: 100%;
        font-size: 15px;
      }

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

      .cta-row {
        align-items: stretch;
        flex-direction: column;
      }

      .hero-art {
        min-height: 300px;
        overflow: hidden;
      }

      .orbit {
        left: 20px;
        right: 14px;
        bottom: 28px;
      }

      .trophy {
        left: 44px;
        bottom: 118px;
        transform: scale(.78);
      }

      .device {
        left: 54px;
        right: auto;
        top: 18px;
        width: 276px;
        height: 276px;
        padding: 18px;
      }

      .device-logo {
        font-size: 25px;
        margin-bottom: 12px;
      }

      .balance {
        height: 52px;
      }

      .balance strong {
        font-size: 15px;
      }

      .game-tile {
        height: 58px;
        font-size: 9px;
      }

      .game-tile span {
        font-size: 20px;
      }

      .coin.one {
        left: 10px;
        top: 104px;
      }

      .coin.two {
        right: 0;
        bottom: 84px;
        width: 62px;
        height: 62px;
        font-size: 25px;
      }

      .section-title h2,
      .section-head h2 {
        font-size: 22px;
        overflow-wrap: anywhere;
      }

      .article h3,
      .article p,
      .topic-card p,
      .step-card p,
      .faq-list p {
        overflow-wrap: anywhere;
        word-break: break-word;
      }

      .article h3 {
        font-size: 17px;
      }

      .article p {
        font-size: 13px;
      }

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

      .thumb {
        min-width: 0;
      }

      .more {
        margin-left: 0;
      }

      .section-head {
        align-items: flex-start;
        flex-direction: column;
      }

      .score-list li {
        grid-template-columns: 1fr;
      }
    }


.brand, .nav a, .cta, .btn, .topic-card, .step-card, .more, .article h3 a {
  transition: color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.brand:hover, .nav a:hover, .article h3 a:hover {
  color: var(--gold);
}

.cta:hover, .btn:hover, .more:hover {
  transform: translateY(-1px);
}

.thumb {
  text-decoration: none;
}

.article-detail-card {
  padding: 26px 28px;
}

.article-detail-card .detail-title {
  margin: 0 0 14px;
  color: var(--text);
  font-size: 34px;
  line-height: 1.18;
  font-weight: 900;
}

.detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  padding: 12px 0 18px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--line);
  color: #7b8796;
  font-size: 13px;
  font-weight: 700;
}

.article-content {
  color: #303a48;
  font-size: 16px;
  line-height: 1.82;
}

.article-content h2,
.article-content h3 {
  margin: 28px 0 12px;
  color: #101722;
  font-weight: 900;
}

.article-content p {
  margin: 0 0 16px;
}

.article-content ul,
.article-content ol {
  margin: 0 0 18px 22px;
  padding: 0;
}

.article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.article-note {
  margin-top: 22px;
  padding: 16px 18px;
  border-radius: 8px;
  border: 1px solid #ffd47a;
  background: #fff8e6;
  color: #634008;
  font-size: 14px;
  font-weight: 700;
}

.zq-pages,
.article-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.zq-pages li,
.zq-pages a,
.zq-pages span {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
}

.zq-pages a,
.zq-pages span,
.article-nav a {
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.article-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 24px;
}

.article-like-box {
  margin-top: 22px;
}

@media (max-width: 900px) {
  .article-detail-card {
    padding: 20px 16px;
  }

  .article-detail-card .detail-title {
    font-size: 28px;
  }

  .article-nav {
    grid-template-columns: 1fr;
  }
}



/* Target Bengali content and Dede integration */
:root{--clone-dark:#3e4855;--clone-bg2:#0787c4;--clone-accent:#12b8ee;--clone-gold:#ffe36a;--clone-blue:#657080;}
body.true-reference-clone{font-family:Arial,"Kohinoor Bangla","Noto Sans Bengali",sans-serif;letter-spacing:0;}
body.true-reference-clone img[src*="wj2-logo"]{height:auto;object-fit:contain;}
body.true-reference-clone img[src*="wj2-hero"]{height:auto;object-fit:contain;}
.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:780px){.clone-update-card,.clone-article-inner,.clone-prenext{grid-template-columns:1fr;}}