.online-info {text-align:center; width:100%}
.players {font-size:36px; font-weight:700; line-height:1.1; margin-bottom:5px}
.online-count,.max-count {transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275); display:inline-block}
.online-count.update-animation,.max-count.update-animation {transform:scale(1.2); color:#8a6e9c}
.separator {color:#aaa; margin:0 4px; font-weight:400}
.max-count {color:#666; font-weight:400}
.progress-bar-container {width:100%; height:10px; background-color:#e0e0e0; border-radius:5px; margin:10px 0 6px 0; overflow:hidden; position:relative}
.progress-bar-fill {height:100%; background:linear-gradient(90deg,#452d4f,#8a6e9c,#452d4f); background-size:200% 100%; border-radius:5px; transition:width 0.3s ease; animation:gradientMove 3s ease infinite}
@keyframes gradientMove {0% {background-position:0 50%}
 50% {background-position:100% 50%}
 100% {background-position:0 50%}
}
.status-badge {display:inline-flex; align-items:center; gap:4px; padding:4px 14px; border-radius:40px; font-size:13px; font-weight:500; margin-top:5px}
.status-badge .heart {display:inline-block; transform-origin:center; font-size:16px}
.heartbeat-slow {animation:heartbeat 1.8s ease infinite}
.heartbeat-normal {animation:heartbeat 1.3s ease infinite}
.heartbeat-fast {animation:heartbeat 0.8s ease infinite}
@keyframes heartbeat {0% {transform:scale(1)}
 25% {transform:scale(1.1)}
 35% {transform:scale(1.2)}
 45% {transform:scale(1.1)}
 55% {transform:scale(1)}
 100% {transform:scale(1)}
}
.status-online {background:rgba(76,175,80,0.15); color:#2E7D32}
.status-empty {background:rgba(255,152,0,0.15); color:#B26A00}
.status-offline {background:rgba(244,67,54,0.15); color:#C62828}
.update-time {display:block; font-size:10px; color:#888; margin-top:5px}
.cache-warning {display:block; font-size:10px; color:#f57c00; margin-top:5px; background:rgba(245,124,0,0.1); padding:3px 6px; border-radius:4px; text-align:center}
.emoji-icon {font-size:16px; width:16px; height:16px; display:inline-flex; align-items:center; justify-content:center}
.shop-link {transition:opacity 0.2s}
.shop-link:hover {text-decoration:underline !important; opacity:0.8}
#ip-address {transition:opacity 0.2s}
#ip-address:hover {opacity:0.8}
.value.d-flex {width:100%; display:flex !important; align-items:center}
.field-label {flex:0 0 auto; margin-right:8px; white-space:nowrap}
.field-value {flex:1 1 0; text-align:right; min-width:0; overflow:hidden; text-overflow:ellipsis}