#cg-live-cards-wrapper {
  --cg-card-bg: #ffffff;
  --cg-card-border: #e5e5e5;
  --cg-text: #111111;
  --cg-up: #0f9d58;
  --cg-down: #d93025;
}

#cg-live-cards-wrapper.cg-dark {
  --cg-card-bg: #050711;
  --cg-card-border: #1b1f33;
  --cg-text: #f5f5f5;
}

/* Layout containers */
#cg-live-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 18px;
  max-width: 1000px;
  margin: 0 auto;
}

#cg-live-cards-wrapper.cg-layout-list #cg-live-cards {
  display: flex;
  flex-direction: column;
}

#cg-live-cards-wrapper.cg-layout-ticker #cg-live-cards {
  display: block;
}

.cg-ticker {
  overflow: hidden;
  white-space: nowrap;
}

.cg-ticker-inner {
  display: inline-flex;
  gap: 12px;
  animation: cg-ticker-scroll 40s linear infinite;
}

@keyframes cg-ticker-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Cards */
.cg-card {
  background: var(--cg-card-bg);
  border: 1px solid var(--cg-card-border);
  border-radius: 14px;
  padding: 18px 20px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--cg-text);
  min-width: 280px;
}

#cg-live-cards-wrapper.cg-layout-ticker .cg-card {
  flex: 0 0 auto;
}

.cg-left {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cg-card-header {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cg-card-header img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}

.cg-card-title {
  font-size: 16px;
  font-weight: 600;
}

.cg-price {
  font-size: 20px;
  font-weight: 700;
}

.cg-change {
  font-size: 14px;
  font-weight: 600;
}

.cg-up { color: var(--cg-up); }
.cg-down { color: var(--cg-down); }

.cg-chart-wrapper {
  width: 130px;
  height: 50px;
}

/* Line animation */
.cg-line-path {
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  animation: cg-line-draw 1.4s ease-out forwards;
}

@keyframes cg-line-draw {
  to { stroke-dashoffset: 0; }
}

@media (max-width: 600px) {
  #cg-live-cards {
    grid-template-columns: 1fr;
  }
}
