/* The streaker (streak.js): a band just above the composer where a Bii with its pants down crosses the chat.
   Speaks the plaza's voice (rounded type, name tag pill in the owner's color, the orange "!" when poked). */
.streak { position: fixed; left: 0; right: 0; z-index: 10; pointer-events: none; overflow: hidden; }
.streak canvas { display: block; width: 100%; height: 100%; }
.streak-tag, .streak-bang, .streak-hit { position: absolute; left: 0; top: 0; }
.streak-tag { white-space: nowrap; padding: 2px 10px; border-radius: 99px; background: var(--c); color: #fff;
  font: 800 13px/1.4 "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", var(--font, sans-serif); }
.streak-bang { font: 800 28px/1 "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", sans-serif; color: #2d45f0; opacity: 0; }
.streak-bang.on { animation: streak-bang 1s ease-out; }
@keyframes streak-bang { 0% { opacity: 0; scale: .5; } 15% { opacity: 1; scale: 1; } 75% { opacity: 1; } 100% { opacity: 0; } }
.streak-hit { pointer-events: auto; border: 0; padding: 0; margin: 0; background: transparent; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation; }