.mgbs-blk{position:absolute;box-sizing:border-box;border-radius:10px;background:#293146;border:1px solid #4c566a;box-shadow:0 18px 36px rgba(6,16,24,.45);animation:mgbs-b4snap 10s infinite both}
.mgbs-tab{position:absolute;left:-1px;top:-22px;height:18px;padding:0 7px;display:flex;align-items:center;gap:5px;border-radius:5px;background:#87d1f5;color:#061018;font:500 9.5px/1 'JetBrains Mono',monospace;white-space:nowrap;animation:mgbs-b4tab 10s infinite both}
@keyframes mgbs-b4snap{0%,16%{transform:translate(var(--sx),var(--sy)) rotate(var(--sr)) scale(.84);animation-timing-function:cubic-bezier(.34,1.5,.64,1)}38%,78%{transform:translate(0,0) rotate(0deg) scale(1);animation-timing-function:cubic-bezier(.6,0,.4,1)}96%,100%{transform:translate(var(--sx),var(--sy)) rotate(var(--sr)) scale(.84)}}
@keyframes mgbs-b4tab{0%,18%{opacity:1}30%,80%{opacity:0}92%,100%{opacity:1}}
@keyframes mgbs-b4glow{0%,36%{box-shadow:0 0 0 1px #354058}46%,76%{box-shadow:0 0 0 1px #87d1f5,0 0 48px rgba(135,209,245,.2)}86%,100%{box-shadow:0 0 0 1px #354058}}
@keyframes mgbs-b4cols{0%,36%{opacity:.25}46%,76%{opacity:.9}86%,100%{opacity:.25}}
@keyframes mgbs-pubA{0%,46%{opacity:1}50%,84%{opacity:0}88%,100%{opacity:1}}
@keyframes mgbs-pubB{0%,46%{opacity:0}50%,84%{opacity:1}88%,100%{opacity:0}}

/* Accessibility (2026-10-01): tab labels and publish states swap discretely so text is never half-transparent (contrast). */
.mgbs-tab{animation-timing-function:steps(1,end)}
.mgbs-root [style*="mgbs-pubA"],.mgbs-root [style*="mgbs-pubB"]{animation-timing-function:steps(1,end)!important}
