.cgl--ticker .crypto-ticker {
overflow: hidden;
white-space: nowrap;
position: relative;
border-bottom: 1px solid var(--global-palette7);
width: 100%;
mask-image: linear-gradient(var(--mask-direction, to right), hsl(0 0% 0% / 0), hsl(0 0% 0% / 1) 5%, hsl(0 0% 0% / 1) 95%, hsl(0 0% 0% / 0));
}
.cgl--ticker .crypto-ticker .ticker-wrapper {
display: flex;
animation: cgl-ticker-moveLeft 80s linear infinite;
width: fit-content;
}
.cgl--ticker .crypto-ticker .ticker-content {
display: flex;
align-items: center;
}
.cgl--ticker .crypto-ticker .crypto-item {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
background: var(--global-palette8);
border-right: 1px solid var(--global-palette7);
white-space: nowrap;
flex-shrink: 0;
min-width: 160px;
}
.cgl--ticker .crypto-ticker .crypto-icon {
width: 30px;
height: 30px;
border-radius: 50%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-weight: bold;
font-size: 14px;
flex-shrink: 0;
}
.cgl--ticker .crypto-ticker .crypto-icon .crypto-icon-img {
width: 34px;
height: 34px;
min-width: 34px;
min-height: 34px;
aspect-ratio: 1 / 1;
object-fit: cover;
border-radius: 50%;
display: inline-block;
}
.cgl--ticker .crypto-ticker .crypto-details {
display: flex;
align-items: flex-start;
flex-direction: column;
gap: 0px;
flex: 1;
min-width: 0;
}
.cgl--ticker .crypto-ticker .crypto-details .crypto-det1 {
display: flex;
align-items: center;
gap: 8px;
line-height: 1;
}
.cgl--ticker .crypto-ticker .crypto-details .crypto-det2 {
line-height: 1;
}
.cgl--ticker .crypto-ticker .crypto-name {
font-weight: 500;
color: #2c3e50;
font-size: 14px;
}
.cgl--ticker .crypto-ticker .crypto-symbol {
color: var(--global-palette3);
font-size: 13px;
font-weight: 400;
}
.cgl--ticker .crypto-ticker .crypto-price {
font-weight: 400;
color: var(--global-palette5);
font-size: 13px;
}
.cgl--ticker .crypto-ticker .crypto-change {
font-size: 13px;
font-weight: 400;
}
.cgl--ticker .crypto-ticker .positive { color: #27ae60; }
.cgl--ticker .crypto-ticker .negative { color: #e74c3c; }
.cgl--ticker .crypto-ticker .mini-chart {
width: 35px;
height: 18px;
margin-left: 6px;
flex-shrink: 0;
line-height: 0; }
.cgl--ticker .crypto-ticker .mini-chart svg {
width: 100%;
height: 100%;
display: block;
} @keyframes cgl-ticker-moveLeft {
0%   { transform: translateX(0); }
100% { transform: translateX(-50%); }
} @media (max-width: 768px) {
.cgl--ticker .crypto-ticker .crypto-item { min-width: 140px; padding: 5px 10px; gap: 6px; }
.cgl--ticker .crypto-ticker .crypto-icon { width: 30px; height: 30px; font-size: 14px; }
.cgl--ticker .crypto-ticker .crypto-name { font-size: 12px; }
.cgl--ticker .crypto-ticker .crypto-symbol { font-size: 11px; }
.cgl--ticker .crypto-ticker .crypto-price { font-size: 12px; }
.cgl--ticker .crypto-ticker .crypto-change { font-size: 12px; }
.cgl--ticker .crypto-ticker .mini-chart { width: 25px; height: 14px; }
.cgl--ticker .crypto-ticker .mini-chart svg { width: 25px; height: 14px; }
.cgl--ticker .crypto-ticker .ticker-wrapper { animation-duration: 60s; }
}
@media (max-width: 480px) {
.cgl--ticker .crypto-ticker .crypto-item { min-width: 120px; padding: 3px 6px; }
.cgl--ticker .crypto-ticker .ticker-wrapper { animation-duration: 45s; }
} .cgl--ticker .ticker-item .crypto-icon-img {
width: 34px !important;
height: 34px !important;
aspect-ratio: 1 / 1;
flex-shrink: 0;
display: inline-block;
} .cgl--ticker .ticker-item {
min-height: 40px; align-items: center;
} .cgl--ticker .ticker-item .symbol,
.cgl--ticker .ticker-item .price,
.cgl--ticker .ticker-item .change {
display: inline-flex;
align-items: center;
}