/* Compact directory heading on desktop, tablet, and mobile. */
.reference-main .reference-header-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:0 0 9px;
}
.reference-main .reference-header-row .reference-intro-row{
  grid-column:1;
  grid-row:1;
  display:flex;
  align-items:center;
  gap:0;
  min-width:0;
  margin:0;
}
.reference-main .reference-header-row .reference-copy{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.reference-main .reference-header-row .reference-stat-card{
  width:252px;
  max-width:100%;
  margin:0;
  justify-self:start;
}
.reference-main .reference-header-row .reference-back{
  grid-column:2;
  grid-row:1;
  position:relative;
  inset:auto;
  justify-self:end;
  margin:0;
  z-index:20;
  pointer-events:auto;
  white-space:nowrap;
}
.reference-main #categoryFilters{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  max-width:100%;
  overflow:visible;
  gap:4px 6px;
}
.reference-main #categoryFilters .filter-btn{
  flex:0 0 auto;
  min-height:36px;
  padding:5px 10px;
  font-size:12.54px;
}
@media(max-width:700px){
  .reference-main .reference-header-row{gap:8px;margin-bottom:10px}
  .reference-main .reference-header-row .reference-stat-card{
    width:max-content;
    min-height:0;
    padding:7px 10px;
    border-radius:999px;
  }
  .reference-main .reference-header-row .reference-stat-card>div{gap:5px}
  .reference-main .reference-header-row .hero-stat{
    font-size:13px;
    line-height:1.15;
    letter-spacing:-.02em;
  }
  .reference-main .reference-header-row .reference-stat-card p{
    font-size:11px;
    line-height:1.15;
    white-space:nowrap;
  }
  .reference-main .reference-header-row .reference-back{
    min-height:29px;
    padding:6px 9px;
    font-size:11px;
  }
  .reference-main .toolbar{padding:5px 8px;margin-bottom:12px}
  .reference-main #categoryFilters .filter-btn{
    min-height:32px;
    padding:4px 8px;
    font-size:12.32px;
  }
}
@media(max-width:360px){
  .reference-main .reference-header-row{gap:5px}
  .reference-main .reference-header-row .reference-stat-card{padding-inline:8px}
  .reference-main .reference-header-row .reference-back{padding-inline:7px;font-size:10.5px}
}