/* CM Ticker Tape styles */
.cmtt-wrapper{--bg:#ffffff;--fg:#131722;--muted:#6b7280;--up:#16a34a;--down:#dc2626;--flat:#6b7280;border:1px solid rgba(0,0,0,.06);border-radius:8px;overflow:hidden;background:var(--bg)}
.cmtt-dark{--bg:#0b0f1a;--fg:#e5e7eb;--muted:#9ca3af;--up:#22c55e;--down:#f87171;--flat:#9ca3af;border-color:rgba(255,255,255,.08)}
.cmtt-transparent{background:transparent;border-color:transparent}
.cmtt-wrapper *{box-sizing:border-box}
.cmtt-tape{position:relative;white-space:nowrap;overflow:hidden}
.cmtt-track{display:inline-flex;gap:8px;padding:8px 10px;animation:cmtt-scroll linear infinite}
.cmtt-wrapper.cmtt-compact .cmtt-track{gap:4px;padding:4px 6px}
@keyframes cmtt-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
/* JS duplicates track content for seamless loop */

.cmtt-item{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid rgba(0,0,0,.06);border-radius:8px;color:var(--fg);text-decoration:none;background:rgba(0,0,0,0.02)}
.cmtt-dark .cmtt-item{border-color:rgba(255,255,255,.08);background:rgba(255,255,255,0.03)}
.cmtt-compact .cmtt-item{padding:6px 8px;gap:6px}

.cmtt-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center}
.cmtt-icon img{width:20px;height:20px;border-radius:50%}
.cmtt-letter{display:inline-flex;width:20px;height:20px;border-radius:50%;align-items:center;justify-content:center;background:#334155;color:#fff;font:600 10px/1 system-ui}

.cmtt-body{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:8px;row-gap:2px;align-items:center}
.cmtt-name{grid-column:1 / span 2;font:600 12px/1.1 system-ui}
.cmtt-status{margin-left:6px;font:400 11px/1 system-ui;color:var(--muted)}
.cmtt-last{font:600 12px/1 system-ui;display:flex;align-items:center;gap:6px}
.cmtt-mode{font:700 10px/1 system-ui;border:1px solid rgba(0,0,0,.15);border-radius:3px;padding:1px 3px;color:var(--muted)}
.cmtt-change{font:600 12px/1 system-ui}
.cmtt-up{color:var(--up)}
.cmtt-down{color:var(--down)}
.cmtt-flat{color:var(--flat)}

@media (max-width: 640px){
  .cmtt-name{font-size:11px}
  .cmtt-last, .cmtt-change{font-size:11px}
}
