/* TrackMMO by Sp1ke — ribbons/tags. */
.rb-stack { position: absolute; top: 10px; left: 10px; z-index: 3; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; pointer-events: none; }
.rb { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 6px; font-size: 10.5px; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; line-height: 1.3; color: #fff; box-shadow: 0 4px 12px -4px rgba(0,0,0,.55); white-space: nowrap; }
.rb-sm { padding: 1px 6px; font-size: 9.5px; letter-spacing: .5px; box-shadow: none; border-radius: 5px; }
.rb-inline { display: inline-flex; gap: 4px; margin-left: 8px; vertical-align: 2px; }
.rb-featured { background: linear-gradient(135deg, #f5b544, #e48a1e); color: #2a1600; }
.rb-today    { background: linear-gradient(135deg, #ff4f6d, #e0254a); }
.rb-tomorrow { background: linear-gradient(135deg, #ff7a59, #e8552f); }
.rb-new      { background: linear-gradient(135deg, #2ecc71, #1fa45a); }
.rb-hot      { background: linear-gradient(135deg, #ff6a3d, #d83a1a); }
.rb-hot::before { content: "\1F525"; font-size: 10px; letter-spacing: 0; }
.rb-hyped    { background: linear-gradient(135deg, #c86bfa, #8f3fe0); }
.rb-week     { background: linear-gradient(135deg, #3d9bff, #2467e0); }
.rb-soon     { background: linear-gradient(135deg, #5a7bff, #4152d6); }
.rb-live     { background: linear-gradient(135deg, #16c7b0, #0e9c8a); }
.rb-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: rbPulse 1.6s infinite; }
.rb-ea       { background: linear-gradient(135deg, #d9a33a, #b07f1d); color: #241600; }
.rb-upcoming { background: linear-gradient(135deg, #6b7a90, #4d5a6d); }
.rb-out      { background: linear-gradient(135deg, #4caf7a, #357f58); }
.rb-beta     { background: linear-gradient(135deg, #2bb3c0, #1c8793); }
.hero-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.hero-tags .rb-inline { margin-left: 0; }
.hero-tags .rb-sm { padding: 3px 9px; font-size: 10.5px; }
.dash-card-art { position: relative; }
.dash-game-info strong .rb-inline { margin-left: 6px; }
@keyframes rbPulse { 50% { opacity: .35; } }
.reduce-motion .rb-live::before { animation: none; }
/* Hover overlays on cards should not cover the ribbons awkwardly */
.card:hover .rb-stack { opacity: 0; transition: opacity .15s; }