.sq-live {
    display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem;
    width: 100%; max-width: 42.75rem; margin: 18px auto;
}
.sq-live.hud-frame { padding: 14px 18px; min-height: 64px; }
.sq-stat {
    font-family: "Orbitron", sans-serif; font-size: .8rem; letter-spacing: .12em;
    text-transform: uppercase; color: var(--hud-muted);
    display: inline-flex; align-items: center; gap: .45rem;
}
.sq-stat strong { color: var(--hud-text); font-size: 1.25rem; }
.sq-online strong { color: var(--hud-orange); }
.sq-dot { width: .5rem; height: .5rem; border-radius: 50%; background: #35d05a; display: inline-block; animation: sq-pulse 1.6s ease-in-out infinite; }
@keyframes sq-pulse { 0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(53, 208, 90, .6); } 50% { opacity: .55; box-shadow: 0 0 0 5px rgba(53, 208, 90, 0); } }

.sq-avatars { display: inline-flex; align-items: center; }
.sq-live.hud-frame .sq-av, .sq-av { display: inline-block; width: 34px; height: 34px; border-radius: 50%; border: 1.5px solid var(--hud-orange); object-fit: cover; margin-left: -8px; background: var(--hud-panel); }
.sq-av:first-child { margin-left: 0; }
.sq-av-skel { animation: sq-skel 1.4s ease-in-out infinite; }
@keyframes sq-skel { 0%, 100% { background: var(--hud-panel); } 50% { background: rgba(25, 179, 230, .25); } }

.sq-next {
    color: var(--hud-text); text-decoration: none; font-size: 1rem;
    border-bottom: 1px dotted var(--hud-border);
    flex-basis: 100%;
}
.sq-next:hover { color: var(--hud-cyan); border-color: var(--hud-cyan); }
.sq-lbl { font-family: "Orbitron", sans-serif; font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; color: var(--hud-cyan); }
.sq-cd { color: var(--hud-orange); font-family: "Orbitron", sans-serif; font-size: .75rem; letter-spacing: .06em; }

.btn-join {
    background: var(--hud-orange);
    color: #0a0a0c;
    white-space: nowrap;
    box-shadow: 0 0 14px rgba(255, 113, 0, .5);
}
.btn-join:hover, .btn-join:focus {
    background: #ff8a2a;
}