.match-status-bar {
  position: fixed;
  z-index: 24;
  left: 50%;
  bottom: 24px;
  width: min(480px, calc(100% - 32px));
  transform: translateX(-50%);
  border: 1px solid #dce0f4;
  border-radius: 20px;
  background: #f4f5ff;
  color: var(--ink);
  box-shadow: 0 6px 24px #20294412;
}
.match-status-content { display: flex; align-items: center; gap: 12px; padding: 10px 12px 10px 18px; }
.match-status-content p { flex: 1; margin: 0; font-size: 0.875rem; font-weight: 700; line-height: 1.45; }
.match-status-signal { display: flex; align-items: center; justify-content: center; gap: 3px; flex-shrink: 0; width: 24px; color: var(--accent-dark); }
.match-status-signal i { width: 4px; height: 4px; border-radius: 50%; background: var(--accent); animation: match-breathe 1.5s ease-in-out infinite; }
.match-status-signal i:nth-child(2) { animation-delay: 0.2s; }
.match-status-signal i:nth-child(3) { animation-delay: 0.4s; }
.match-status-signal.is-paused i { animation: none; background: var(--muted); }
.match-status-actions { display: flex; align-items: center; gap: 2px; flex-shrink: 0; }
.match-status-actions a, .match-status-actions button { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 8px; border: 0; border-radius: 12px; background: transparent; font-size: 0.8125rem; font-weight: 700; white-space: nowrap; }
.match-status-actions a { color: var(--accent-dark); }
.match-status-actions button { color: var(--muted); }
.match-status-actions :is(a, button):hover { background: var(--accent-soft); }
.has-match-status > main { padding-bottom: calc(var(--match-bar-height, 66px) + 48px); }
.detail-shell > .match-status-bar { position: relative; left: auto; bottom: auto; transform: none; width: min(880px, calc(100% - 56px)); margin: 12px auto 0; box-shadow: none; }
.detail-shell.has-match-status > main { padding-bottom: 40px; }
@keyframes match-breathe { 50% { opacity: 0.35; transform: translateY(-2px); } }
@media (max-width: 760px) {
  .match-status-bar { bottom: calc(var(--match-nav-height, 76px) + 10px); width: calc(100% - 24px); border-radius: 18px; }
  .match-status-content { gap: 8px; padding: 8px 8px 8px 12px; }
  .match-status-signal { width: 20px; }
  .has-match-status > main { padding-bottom: calc(var(--match-bar-height, 62px) + 112px + env(safe-area-inset-bottom)); }
  .detail-shell > .match-status-bar { width: calc(100% - 24px); margin: 8px 12px; }
  .detail-shell.has-match-status > main { padding: 0; }
}
@media (prefers-reduced-motion: reduce) { .match-status-signal i { animation: none; } }