/* Shared across the Series and live public viewer renderers. */
.viewer-division-scope.viewer-division-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 54px;
  padding: 7px 28px;
  border-top: 1px solid rgba(100,160,220,.16);
  background: rgba(3,14,29,.72);
}
.viewer-division-scope.viewer-division-bar > strong {
  flex: 0 0 auto;
  color: #6f8daa;
  font-size: .66rem;
  font-weight: 950;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.viewer-division-bar nav.viewer-division-nav {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin: 0;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}
.viewer-division-scope.viewer-division-bar a {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 7px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid rgba(105,139,188,.25);
  border-radius: 8px;
  background: rgba(5,13,31,.62);
  color: #b9c8d8;
  font: inherit;
  font-size: .7rem;
  font-weight: 950;
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
}
.viewer-division-scope.viewer-division-bar a.active {
  border-color: rgba(90,174,255,.78);
  background: rgba(28,142,255,.2);
  color: #fff;
  box-shadow: inset 0 -2px 0 #5aaeff;
}
.viewer-division-scope.viewer-division-bar a:hover { border-color: #5aaeff; }
.viewer-division-scope.viewer-division-bar a:focus-visible { outline: 2px solid #5aaeff; outline-offset: -2px; }
.viewer-division-bar .viewer-division-tab-logo { width: 20px; height: 20px; object-fit: contain; flex: 0 0 20px; }
html.bracketr-theme-light .viewer-division-scope.viewer-division-bar { border-color: rgba(30,91,153,.15); background: rgba(241,247,253,.88); }
html.bracketr-theme-light .viewer-division-scope.viewer-division-bar > strong { color: #466684; }
html.bracketr-theme-light .viewer-division-scope.viewer-division-bar a { background: #fff; color: #173753; }
html.bracketr-theme-light .viewer-division-scope.viewer-division-bar a.active { background: #e5f3ff; color: #123558; }
@media (max-width:700px) {
  .viewer-division-scope.viewer-division-bar { align-items: flex-start; flex-direction: column; gap: 6px; padding: 9px 14px; }
  .viewer-division-bar nav.viewer-division-nav { width: 100%; }
  .viewer-division-scope.viewer-division-bar a { min-height: 40px; }
}