.grade-empty {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem .75rem;
  padding: 1rem;
  color: var(--grade-mute);
}
.grade-empty p { margin: 0; }

.grade-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem 1rem;
  padding: .3rem .75rem;
  border-top: 1px solid var(--grade-rule);
  font-size: .75rem;
  color: var(--grade-mute);
  background: var(--grade-paper);
}
.grade-foot a,
.grade-foot button {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  color: inherit;
}
.grade-foot nav,
.grade-foot > span {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .3rem .45rem;
}
.grade-foot .btn { min-height: 1.75rem; }
.btn .silk,
.nav-link .silk,
.input-group-text .silk,
.modal-title .silk,
.page-link .silk {
  vertical-align: -2px;
}

.grade-watch { background: #000; color: #eee; }
.grade-watch .modal-header {
  padding: .3rem .55rem;
  gap: .5rem;
  align-items: center;
  min-height: 0;
  background: #111;
  border-color: #2a2a2a;
}
.grade-watch .modal-body {
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #000;
}
.grade-watch .modal-title {
  font-size: .95rem;
  font-weight: 650;
  margin: 0;
  max-width: min(80vw, 36rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#stream-modal,
#atalhos-modal { z-index: 1100; }

.atalhos-lead {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .75rem;
  color: var(--bs-secondary-color);
}
.atalhos-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem .85rem;
}
.atalhos-row {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-height: 1.75rem;
}
.atalhos-row kbd {
  flex: 0 0 4.25rem;
  text-align: center;
  font-size: .75rem;
}
@media (max-width: 575.98px) {
  .atalhos-grid { grid-template-columns: 1fr; }
}

.grade-seo-main { flex: 1 0 auto; padding: 1rem 1.25rem 2rem; }
.grade-seo-main > p,
.grade-seo-main > ol,
.grade-seo-main > ul,
.grade-seo-main > h2 { max-width: 42rem; }
.grade-seo-main .channel-grid { border-left: 1px solid var(--grade-rule); margin-top: .75rem; }

.copy-row { display: flex; gap: .4rem; align-items: stretch; }
.copy-row code {
  flex: 1 1 auto;
  min-width: 0;
  display: block;
  padding: .3rem .45rem;
  font-size: .7rem;
  word-break: break-all;
  background: var(--grade-cell);
  border: 1px solid var(--grade-rule);
}
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }