.onyxbb-currency-card {
  --bg: var(--card-bg, #2a2a2a);
  --text: var(--text-main, #e0e0e0);
  --accent: var(--accent, #7f56d9);
  --border: var(--border-color, #4a4a4a);

  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  font-family: inherit;
  color: var(--text);
  max-width: 500px;
}

/* Header */
.onyxbb-currency-card .occ-header {
  background: var(--accent);
  padding: 10px 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
}

.onyxbb-currency-card .occ-header-icon {
 font-size: 1rem;
}

/* Grid */
.onyxbb-currency-card .occ-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 8px;
  padding: 14px;
}

.occ-item {
  text-align: center;
  background: var(--bg);
  
  border-radius: 8px;
  padding: 10px 6px;
}

 .occ-ticker {
  font-size: 0.8rem;
  margin-bottom: 6px;
  font-weight: 600;
}

.occ-coin {
  font-size: 1.6rem;
  margin-bottom: 6px;
}

.occ-price {
  font-size: 0.85rem;
  font-weight: 500;
}



.onyx-textads{
margin:12px auto;padding:0 12px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
padding: 0 30px;
}

.txad{
  position:relative;display:flex;flex-direction:column;gap:6px;
  background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;
  padding:10px;box-shadow:0 8px 18px var(--shadow-color);
  transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
  cursor:pointer; min-height:92px;
}

.txad:hover{
transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 45%, var(--border-color));box-shadow:0 12px 26px var(--shadow-color)
}

.txad__head{
display:flex;align-items:center;justify-content:space-between
}

.txad__brand{
display:flex;align-items:center;gap:8px;font-weight:900
}

.txad__brand i{
color:var(--accent)
}

.txad__brand a{
color:#fff;text-decoration:none
}

.txad__brand a:hover{
color:#fff;text-decoration:underline
}

.txad__badge{
font-size:11px;font-weight:800;color:#fff;
  background:linear-gradient(90deg,var(--accent),var(--accent-soft));
  border:1px solid rgba(0,0,0,.25);border-radius:999px;padding:3px 8px
}

.txad__tagline{
margin:0;color:var(--text-main);font-size:13px;line-height:1.25
}

.txad__chips{
display:flex;gap:6px;flex-wrap:wrap
}

.chip{
display:inline-flex;gap:6px;align-items:center;padding:4px 8px;border-radius:999px;
  background:var(--highlight-bg);border:1px solid var(--border-color);color:var(--text-light);font-size:11.5px
}

.chip i{
font-size:12px;color:var(--accent-soft)
}

.txad__cta{
position:absolute;right:10px;bottom:10px;color:var(--text-light);font-size:12px;display:inline-flex;gap:6px;align-items:center
}

.txad:hover .txad__cta{
color:#fff
}

@media (max-width:980px){
 .onyx-textads{
grid-template-columns:1fr 1fr
}


}

@media (max-width:640px){
  .onyx-textads{
grid-template-columns:1fr
}

.txad{
min-height:auto
}


}


:root{

  --ix-banner-h: 90px;
}

.onyx-indexhead{
padding: 0 30px;margin:10px auto;display:grid;gap:8px
}

.ix-header{
display:flex;align-items:center;justify-content:flex-end;gap:8px;background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;padding:6px 8px;min-height:36px
}

.ix-quick{
display:flex;gap:6px;flex-wrap:wrap
}

.chip{
display:inline-flex;gap:6px;align-items:center;padding:5px 8px;border-radius:9px;border:1px solid var(--border-color);background:var(--highlight-bg);color:var(--text-main);text-decoration:none;font-weight:700;font-size:12px;line-height:1
}

.chip b{
color:#fff
}

.chip:hover{
border-color:var(--accent);color:#fff
}
.ix-banners {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 per row */
  gap: 8px;
}

.ix-banner {
  position: relative;
  display: block;
  isolation: isolate;
  height: var(--ix-banner-h);
  background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border: 1px solid var(--border-color);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 22px var(--shadow-color);
  transition: transform .14s, box-shadow .14s, border-color .14s;
}

.ix-banner:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent) 50%, var(--border-color));
  box-shadow: 0 12px 28px var(--shadow-color);
}

.ix-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ix-banner.is-empty {
  background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,.12), rgba(255,255,255,.05));
  background-size: 200% 100%;
  animation: ixShimmer 1.2s linear infinite;
}

@keyframes ixShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.ix-badge {
  position: absolute;
  left: 8px;
  top: 8px;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  backdrop-filter: saturate(1.2) blur(2px);
  color: #fff;
  font-size: 11px;
  border: 1px solid rgba(255,255,255,.15);
}

.ix-badge i {
  color: var(--accent-soft);
  font-size: 12px;
}

/* Tablet */
@media (max-width: 900px) {
  .ix-banners {
    grid-template-columns: repeat(2, 1fr); /* 2 per row */
  }
  :root { --ix-banner-h: 100px; }
}

/* Mobile */
@media (max-width: 700px) {
  .ix-banners {
    grid-template-columns: 1fr; /* 1 per row */
  }
  :root { --ix-banner-h: 90px; }
  .ix-header { justify-content: center; }
  .chip { font-size: 11.5px; padding: 5px 7px; }
}



}

.onyx-textads{
margin:12px auto;padding:0 12px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
padding: 0 30px;
}

.txad{
  position:relative;display:flex;flex-direction:column;gap:6px;
  background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;
  padding:10px;box-shadow:0 8px 18px var(--shadow-color);
  transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
  cursor:pointer; min-height:92px;
}

.txad:hover{
transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 45%, var(--border-color));box-shadow:0 12px 26px var(--shadow-color)
}

.txad__head{
display:flex;align-items:center;justify-content:space-between
}

.txad__brand{
display:flex;align-items:center;gap:8px;font-weight:900
}

.txad__brand i{
color:var(--accent)
}

.txad__brand a{
color:#fff;text-decoration:none
}

.txad__brand a:hover{
color:#fff;text-decoration:underline
}

.txad__badge{
font-size:11px;font-weight:800;color:#fff;
  background:linear-gradient(90deg,var(--accent),var(--accent-soft));
  border:1px solid rgba(0,0,0,.25);border-radius:999px;padding:3px 8px
}

.txad__tagline{
margin:0;color:var(--text-main);font-size:13px;line-height:1.25
}

.txad__chips{
display:flex;gap:6px;flex-wrap:wrap
}

.chip{
display:inline-flex;gap:6px;align-items:center;padding:4px 8px;border-radius:999px;
  background:var(--highlight-bg);border:1px solid var(--border-color);color:var(--text-light);font-size:11.5px
}

.chip i{
font-size:12px;color:var(--accent-soft)
}

.txad__cta{
position:absolute;right:10px;bottom:10px;color:var(--text-light);font-size:12px;display:inline-flex;gap:6px;align-items:center
}

.txad:hover .txad__cta{
color:#fff
}

@media (max-width:980px){
 .onyx-textads{
grid-template-columns:1fr 1fr
}


}

@media (max-width:640px){
  .onyx-textads{
grid-template-columns:1fr
}

.txad{
min-height:auto
}


}