/* Ambient Data Bar -- scrolling ticker */
.ambient-bar {
    position: fixed;
    top: 60px;
    left: 0;
    right: 0;
    z-index: 99;
    height: 28px;
    background: rgba(8, 8, 14, 0.9);
    backdrop-filter: blur(10px);
    overflow: hidden;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.ticker-track {
    display: inline-flex;
    align-items: center;
    height: 100%;
    white-space: nowrap;
    animation: ticker-scroll 25s linear infinite;
}

.ambient-bar:hover .ticker-track {
    animation-play-state: paused;
}

.ticker-item {
    font-size: 0.78rem;
    color: #707070;
}

.ticker-item .mdi {
    background: linear-gradient(to right, #ff0080, #ff00ff, #00ffff, #00ff00, #ffff00, #ff7f00, #ff0000);
    background-size: 400% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: rgb-border 8s linear infinite;
}

.ticker-sep {
    margin: 0 1.2em;
    color: #404040;
    font-size: 0.78rem;
}

.ticker-pipe {
    margin: 0 1.5em;
    color: #505050;
    font-size: 0.78rem;
}

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