@property --chp-trail-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}


.chp-code-grid {
  display:grid;
  grid-template-columns:minmax(0,760px);
  justify-content:center;
  gap:16px;
}

.chp-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.chp-featured-grid {
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:14px;
}

.chp-code-card,
.chp-card {
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  border-radius:18px;
  transition:transform .26s ease, box-shadow .26s ease, filter .26s ease;
}

.chp-code-card {
  overflow:hidden;
  padding:18px;
  border:1px solid #303842;
  background:linear-gradient(160deg,rgba(17,22,28,.96),rgba(10,13,17,.96));
  box-shadow:0 16px 35px rgba(0,0,0,.24);
}

.chp-card {
  overflow:visible;
  isolation:isolate;
  padding:16px;
  --line-main:#ff6f1f;
  --line-soft:rgba(255,111,31,.40);
  --line-hot:#ffd75b;
  --line-shadow:255,111,31;
  border:2px solid rgba(var(--line-shadow),.48);
  background:radial-gradient(circle at 50% 18%,rgba(var(--line-shadow),.10),transparent 36%),linear-gradient(180deg,#1b151b 0%,#11151b 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 18px 38px rgba(0,0,0,.34);
  animation:chpCardBreath 4.2s ease-in-out infinite;
}

.chp-code-card:hover,
.chp-card:hover {
  transform:translateY(-5px) scale(1.015);
}

.chp-code-card:hover { box-shadow:0 24px 55px rgba(0,0,0,.38); }
.chp-card:hover {
  animation-play-state:paused;
  box-shadow:inset 0 0 0 1px rgba(var(--line-shadow),.16),0 26px 58px rgba(0,0,0,.42);
}

.chp-code-card:before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:linear-gradient(transparent,#ff7417,transparent);
  opacity:.8;
}

.chp-card::before,
.chp-card::after {
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:20px;
  pointer-events:none;
}

.chp-card::before {
  padding:2px;
  background:conic-gradient(
    from var(--chp-trail-angle),
    transparent 0deg 285deg,
    rgba(255,255,255,.0) 285deg 305deg,
    var(--line-main) 305deg 320deg,
    var(--line-hot) 320deg 332deg,
    var(--line-main) 332deg 344deg,
    rgba(255,255,255,0) 344deg 360deg
  );
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:chpLineRun 3s linear infinite;
  z-index:-1;
}

.chp-card::after {
  inset:-2px;
  padding:2px;
  background:conic-gradient(
    from var(--chp-trail-angle),
    transparent 0deg 300deg,
    rgba(var(--line-shadow),0) 300deg 308deg,
    var(--line-main) 308deg 318deg,
    var(--line-hot) 318deg 330deg,
    #fff5c4 330deg 334deg,
    var(--line-hot) 334deg 340deg,
    var(--line-main) 340deg 350deg,
    rgba(var(--line-shadow),0) 350deg 360deg
  );
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:1;
  animation:chpLineRun 3s linear infinite;
  z-index:-1;
}

.chp-code-top { display:flex; align-items:center; gap:9px; }
.chp-code-top img { width:30px; height:30px; object-fit:contain; filter:drop-shadow(0 6px 10px rgba(0,0,0,.35)); }
.chp-code-top span,.chp-mini-kicker{ font-size:9px; letter-spacing:1.2px; font-weight:950; color:#ff9a52; text-transform:uppercase; }
.chp-code-top b { margin-left:auto; padding:5px 8px; border:1px solid rgba(54,219,121,.35); border-radius:99px; background:rgba(54,219,121,.09); color:#5ee792; font-size:9px; letter-spacing:.5px; }
.chp-code-card h3 { margin:16px 0 9px; color:#fff; font-size:31px; letter-spacing:-.04em; }
.chp-code-card p { min-height:68px; color:#aab2bd; font-size:12.5px; line-height:1.55; }
.chp-code-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:auto; }
.chp-code-actions button,.chp-code-actions a,.chp-card > a,.chp-showcase-link {
  display:flex; align-items:center; justify-content:center; min-height:44px; padding:10px 12px;
  border:1px solid #ffd35e; border-radius:10px; background:linear-gradient(180deg,#ffe777,#f7b625);
  color:#1d1103; text-align:center; text-decoration:none; font:900 11px/1.1 inherit; cursor:pointer;
}
.chp-card > a {
  position:relative;
  overflow:hidden;
  box-shadow:0 8px 18px rgba(255,185,48,.20);
}
.chp-card > a:before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  transform:translateX(-120%);
  animation:chpBtnSweep 2.4s linear infinite;
}
.chp-code-actions a,.chp-showcase-link { border-color:#3b434c; background:#14191e; color:#f5f7f9; }
.chp-code-actions button.is-copied { background:#31d77a; border-color:#31d77a; }
.chp-see-giveaways { margin-top:9px !important; padding:9px 8px !important; min-height:auto !important; border:1px solid #343c45 !important; background:transparent !important; color:#c9d0d8 !important; font-size:10px !important; }

.chp-total { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin:0 0 34px; overflow:hidden; border:1px solid #3a2b22; border-radius:16px; background:#3a2b22; }
.chp-total > div { display:flex; flex-direction:column; padding:22px; background:linear-gradient(145deg,#171b20,#101317); }
.chp-total strong { font-size:clamp(42px,6vw,70px); line-height:1; color:#ff7b20; letter-spacing:-.05em; }
.chp-total span { margin-top:7px; font-size:10px; font-weight:950; text-transform:uppercase; letter-spacing:1.2px; color:#bbc2ca; }
.chp-total-value { text-align:right; }
.chp-total-value strong { color:#fff; }

.chp-showcase { margin:0 0 52px; }
.chp-showcase-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:18px; }
.chp-showcase-head h3 { margin:6px 0 8px; color:#fff; font-size:clamp(28px,3vw,40px); line-height:1.04; letter-spacing:-.05em; }
.chp-showcase-head p { max-width:760px; margin:0; color:#b8c1ca; }

.chp-card--hero { grid-column:span 3; min-height:300px; padding:18px; }
.chp-card--mini { grid-column:span 2; min-height:212px; padding:14px; }
.chp-card--feed { min-height:290px; }
.chp-card--hero::after { inset:-2px; }

.chp-card--mini .chp-art { min-height:72px; margin-bottom:6px; }
.chp-card--mini img { height:78px; }
.chp-card--mini h4 { font-size:14px; margin-bottom:6px; }
.chp-card--mini .chp-price { font-size:15px; margin-bottom:2px; }
.chp-card--mini .chp-value-caption { font-size:8px; margin-bottom:5px; }
.chp-card--mini .chp-deposit { font-size:10px; margin-bottom:10px; }
.chp-card--mini .chp-card-top { margin-bottom:8px; }
.chp-card--mini .chp-rarity { font-size:8px; padding:5px 8px; }
.chp-card--mini .chp-code-chip { top:40px; font-size:8px; padding:3px 6px; }
.chp-card--mini > a { min-height:36px; font-size:10px; }
.chp-card--mini .chp-logo-badge { width:34px; height:34px; bottom:56px; right:10px; border-radius:10px; }
.chp-card--mini .chp-logo-badge img { width:20px; height:20px; }

.chp-code-section { margin:48px 0; }
.chp-code-banner { display:flex; align-items:center; gap:14px; margin:0 0 16px; padding:17px 19px; border:1px solid #4a3426; border-radius:14px; background:linear-gradient(100deg,#171b20,#111419 58%,#241307); text-decoration:none; color:#fff; box-shadow:0 12px 28px rgba(0,0,0,.23); transition:transform .2s,border-color .2s; }
.chp-code-banner:hover { transform:translateY(-2px); border-color:#ff7417; }
.chp-code-banner span { font-size:9px; font-weight:950; letter-spacing:1.25px; color:#ff9a52; }
.chp-code-banner strong { font-size:clamp(22px,3vw,36px); line-height:1; letter-spacing:-.04em; }
.chp-code-banner em { margin-left:auto; padding:9px 12px; border-radius:8px; background:#ff7417; color:#160b03; font-style:normal; font-size:10px; font-weight:950; white-space:nowrap; }

.chp-card-top {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
  z-index:2;
}

.chp-label { display:inline-flex; align-items:center; gap:7px; color:#f8f2de; font-size:10px; font-weight:900; letter-spacing:.8px; text-transform:uppercase; }
.chp-label-dot { width:8px; height:8px; border-radius:50%; background:#ff8a2e; box-shadow:0 0 10px rgba(255,138,46,.8); }
.chp-rarity { padding:6px 10px; border-radius:999px; font-size:9px; font-weight:950; letter-spacing:.9px; line-height:1; }

.chp-art,
.chp-card h4,
.chp-price,
.chp-value-caption,
.chp-deposit,
.chp-card > a,
.chp-logo-badge,
.chp-code-chip { position:relative; z-index:2; }

.chp-art {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:108px;
  margin:0 0 9px;
}

.chp-art::before {
  content:"";
  position:absolute;
  left:6%;
  right:6%;
  top:10%;
  bottom:9%;
  border-radius:16px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.025) 42%,rgba(var(--line-shadow),.16)),
    radial-gradient(ellipse at 50% 56%,rgba(var(--line-shadow),.42),transparent 64%);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),inset 0 -18px 32px rgba(0,0,0,.12),0 0 18px rgba(var(--line-shadow),.12);
  transform:skewX(-3deg);
  z-index:-1;
}

.chp-art::after {
  content:"";
  position:absolute;
  left:14%;
  right:14%;
  bottom:8%;
  height:22px;
  border-radius:50%;
  background:rgba(var(--line-shadow),.34);
  filter:blur(13px);
  z-index:-1;
}

.chp-card img {
  width:100%;
  height:124px;
  object-fit:contain;
  transform-origin:center;
  filter:saturate(1.28) brightness(1.14) contrast(1.12) drop-shadow(0 5px 2px rgba(0,0,0,.58)) drop-shadow(0 16px 18px rgba(0,0,0,.42)) drop-shadow(0 0 12px rgba(var(--line-shadow),.22));
  animation:chpItemFloat 3.0s ease-in-out infinite;
}

.chp-card h4 { margin:0 0 8px; color:#fff; font-size:16px; line-height:1.2; }
.chp-price { margin:0 0 2px; font-size:20px; font-weight:950; line-height:1; }
.chp-value-caption { margin:0 0 6px; color:#aeb7c1; font-size:8px; font-weight:850; text-transform:uppercase; letter-spacing:1px; }
.chp-deposit { margin:0 0 14px; color:#d0d6dc; font-size:11px; }
.chp-card > a { margin-top:auto; }
.chp-logo-badge { position:absolute; right:12px; bottom:64px; display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:rgba(8,10,13,.58); border:1px solid rgba(255,255,255,.10); box-shadow:0 10px 25px rgba(0,0,0,.25); }
.chp-logo-badge img { width:24px; height:24px; margin:0; filter:none; }
.chp-code-chip { position:absolute; left:14px; top:42px; display:inline-flex; padding:3px 7px; border-radius:999px; border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.05); color:#d4dce5; font-size:9px; font-weight:850; letter-spacing:.65px; }
.giveaway-empty { grid-column:1/-1; padding:16px; border:1px dashed #555e68; border-radius:12px; color:#c8ced5; background:#11161b; }

.chp-tier-legendary {
  --line-main:#ff4330;
  --line-soft:rgba(255,67,48,.38);
  --line-hot:#ffd95f;
  --line-shadow:255,67,48;
  background:radial-gradient(circle at 50% 18%,rgba(255,67,48,.14),transparent 38%),linear-gradient(180deg,#2d1317 0%,#171116 100%);
}
.chp-tier-legendary .chp-rarity { background:linear-gradient(90deg,#ff2f24,#ff7f20); color:#fff7df; }
.chp-tier-legendary .chp-price { color:#ffc86a; }

.chp-tier-rare {
  --line-main:#ff8e2a;
  --line-soft:rgba(255,142,42,.38);
  --line-hot:#ffe072;
  --line-shadow:255,142,42;
  background:radial-gradient(circle at 50% 18%,rgba(255,142,42,.14),transparent 38%),linear-gradient(180deg,#2a1811 0%,#171116 100%);
}
.chp-tier-rare .chp-rarity { background:linear-gradient(90deg,#ff6d1f,#ffb13e); color:#250f03; }
.chp-tier-rare .chp-price { color:#ffbb63; }

.chp-tier-popular {
  --line-main:#2ce47a;
  --line-soft:rgba(44,228,122,.34);
  --line-hot:#bbffd9;
  --line-shadow:44,228,122;
  background:radial-gradient(circle at 50% 18%,rgba(44,228,122,.12),transparent 38%),linear-gradient(180deg,#132019 0%,#11161a 100%);
}
.chp-tier-popular .chp-rarity { background:#37de7a; color:#04120a; }
.chp-tier-popular .chp-price { color:#77efaa; }

.chp-tier-budget {
  --line-main:#ffb13b;
  --line-soft:rgba(255,177,59,.34);
  --line-hot:#fff0a2;
  --line-shadow:255,177,59;
  background:radial-gradient(circle at 50% 18%,rgba(255,177,59,.12),transparent 38%),linear-gradient(180deg,#201911 0%,#12161a 100%);
}
.chp-tier-budget .chp-rarity { background:#ffbc49; color:#1f1203; }
.chp-tier-budget .chp-price { color:#ffd57a; }

@keyframes chpLineRun {
  from { --chp-trail-angle: 0deg; }
  to { --chp-trail-angle: 360deg; }
}

@keyframes chpGlowPulse {
  0% { opacity:.56; transform:scale(.99); }
  50% { opacity:1; transform:scale(1.02); }
  100% { opacity:.56; transform:scale(.99); }
}

@keyframes chpCardBreath {
  0% { transform:translateY(0) scale(1); }
  50% { transform:translateY(-1px) scale(1.012); }
  100% { transform:translateY(0) scale(1); }
}

@keyframes chpItemFloat {
  0% { transform:translateY(0) scale(1); }
  50% { transform:translateY(-4px) scale(1.025); }
  100% { transform:translateY(0) scale(1); }
}

@keyframes chpBtnSweep {
  0% { transform:translateX(-120%); }
  100% { transform:translateX(130%); }
}

@media (max-width: 1280px) {
  .chp-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1100px) {
  .chp-featured-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .chp-card--hero { grid-column:span 3; }
  .chp-card--mini { grid-column:span 2; }
}
@media (max-width: 920px) {
  .chp-code-grid,.chp-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .chp-featured-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .chp-card--hero,.chp-card--mini { grid-column:span 2; }
  .chp-showcase-head { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 620px) {
  .chp-code-grid,.chp-grid,.chp-featured-grid { grid-template-columns:1fr; }
  .chp-card--hero,.chp-card--mini { grid-column:span 1; }
  .chp-code-banner { align-items:flex-start; flex-direction:column; }
  .chp-code-banner em { margin-left:0; }
  .chp-total { grid-template-columns:1fr; }
  .chp-total-value { text-align:left; }
  .chp-code-actions { grid-template-columns:1fr; }
}

@supports not (background: conic-gradient(from 1deg, red, blue)) {
  .chp-card::before {
    background:linear-gradient(90deg,var(--line-main),var(--line-hot),var(--line-main));
    opacity:.9;
  }
  .chp-card::after {
    background:radial-gradient(circle,rgba(var(--line-shadow),.32),transparent 66%);
  }
}

/* DEX-only promo card emphasis */
.chp-code-grid .chp-code-card{padding:26px;border-color:rgba(255,126,35,.5);background:radial-gradient(circle at 85% 10%,rgba(255,116,23,.12),transparent 30%),linear-gradient(150deg,#171c22,#0d1014)}
.chp-code-grid .chp-code-card h3{font-size:clamp(44px,7vw,72px);color:#ff8a2c;text-shadow:0 0 24px rgba(255,116,23,.18)}
.chp-code-grid .chp-code-card p{min-height:0;max-width:620px;font-size:14px}
@media(max-width:620px){.chp-code-grid{grid-template-columns:1fr}}