/* Grade keeps the channel grid and player; common reading primitives support the task. */
.grade-human { --mm-accent: var(--grade-ink); }
.grade-human [hidden] { display: none !important; }
.grade-human .grade-work { grid-template-columns: 17rem minmax(0, 1fr); }
.grade-intro { padding: 1rem .85rem .5rem; }
.grade-intro h1 { font-size: 1.35rem; line-height: 1.25; margin: 0 0 .5rem; font-weight: 650; }
.grade-intro p { font-size: .875rem; color: var(--grade-mute); line-height: 1.5; margin: 0; }
.grade-human .grade-top { padding: .4rem .85rem; }
.grade-human .grade-top .navbar-brand { text-transform: none; letter-spacing: 0; }
/* As duas páginas da casa no cabeçalho da home (números e oferta): dois links cabem também no celular —
   a `.grade-pages` das páginas SSR, com seis, fica só no desktop e manda o resto para o rodapé. */
.grade-human .grade-top .grade-casa { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .85rem; font-size: .875rem; }
.grade-human .grade-top .grade-casa a { min-height: 2.25rem; }
.grade-language { position: relative; margin-left: auto; font-size: .875rem; }
.grade-language summary { padding: .5rem; cursor: pointer; }
.grade-language .grade-langs { position: absolute; z-index: 30; right: 0; top: 100%; padding: .6rem; border: 1px solid var(--grade-rule); background: var(--grade-cell); }
.grade-human .grade-top .btn-group { margin-left: 0; }
.grade-human .grade-top .btn-group .btn span { display: inline; }
.grade-human .grade-search { padding: .6rem .75rem; }
.grade-human .grade-filtros { padding: .5rem .75rem; }
.grade-human .grade-kind { gap: .4rem; }
.grade-human .grade-kind-btn { min-height: 2.5rem; font-size: .95rem; }
.grade-secondary-filters { margin-top: .5rem; }
.grade-secondary-filters > summary { font-size: .9rem; padding: .4rem 0; cursor: pointer; }
.grade-secondary-filters .grade-filtros-list { padding-block: .4rem; }
.grade-human .grade-filter { font-size: .875rem; min-height: 2.4rem; }
.grade-human .grade-rail { overflow-y: auto; }
.grade-human .grade-rail-cats { flex-shrink: 0; }
.grade-human .channel-body { padding: .65rem .75rem; gap: .25rem; }
.grade-human .channel-name { font-size: 1rem; line-height: 1.4; }
.grade-human .channel-meta { font-size: .8rem; white-space: normal; overflow-wrap: anywhere; }
.channel-info { font-size: .8rem; color: var(--grade-mute); }
.channel-info p { margin: .4rem 0; overflow-wrap: anywhere; }
.channel-info summary { cursor: pointer; }
.grade-human .channel-cell .channel-social { flex-wrap: wrap; gap: .3rem; }
/* Detailed community counts remain in the player and health panel. Keep personal failure visible. */
.grade-human .channel-cell .social-com,
.grade-human .channel-cell .social-n,
.grade-human .channel-cell .social-medido,
.grade-human .channel-cell .social-fav .social-badge { display: none; }
.grade-human .channel-cell .social-fav .social-nome { display: inline; }
.grade-human .channel-cell .social-fav { min-height: 2.25rem; border: 0; padding: .25rem 0; font-size: .8rem; background: transparent; }
.grade-human .channel-cell .social-alerta { white-space: normal; min-height: 2.25rem; margin-left: 0; }
.grade-human .channel-play { min-height: 2.5rem; font-size: .875rem; }
.grade-human .grade-foot { font-size: .8rem; padding: .5rem .85rem; gap: .35rem 1rem; }
.grade-help-body { max-height: 40vh; overflow: auto; padding-block: .75rem; }
.grade-help-body > details { margin-block: .75rem; }
.grade-help-body nav { display: flex; flex-wrap: wrap; gap: .5rem; }
.grade-references > span { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding-block: .5rem; }
@media (max-width: 767.98px) {
  .grade-human .grade-work { grid-template-columns: minmax(0, 1fr); }
  .grade-intro { padding: .7rem .85rem .2rem; }
  .grade-intro h1 { font-size: 1.2rem; margin-bottom: .25rem; }
  .grade-intro p { font-size: .8rem; }
  .grade-human .grade-rail { max-height: 48vh; }
  .grade-human .grade-filtros { display: flex; flex-wrap: wrap; align-items: start; gap: .3rem 1rem; }
  .grade-human .grade-kind { flex: 1 0 10rem; margin: 0; }
  .grade-secondary-filters { margin-top: 0; flex: 1 0 8rem; }
  .grade-secondary-filters[open] { flex-basis: 100%; }
  .grade-human .grade-filtros-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grade-human .grade-filter { min-width: 0; }
  .grade-human .channel-body { padding: .55rem; }
}