/* Ranking footers follow the tallest sibling without constraining the text.
   No data, presentation colors, decorative animation or print changes. */
@media screen {
  body #homeBoard .hb-periods { align-items:stretch; }
  body #homeBoard .hb-period { display:flex; flex-direction:column; min-width:0; }
  body #homeBoard .hb-period-head { flex-shrink:0; }
  body #homeBoard .hb-period .hb-rank-grid { flex:1 1 auto; align-items:stretch; }
  body #homeBoard .hb-period .hb-rank-card { display:flex; flex-direction:column; min-width:0; }
  body #homeBoard .hb-period .hb-rank-card-head { flex-shrink:0; }
  body #homeBoard .hb-period .hb-rank-list { flex:0 1 auto; min-width:0; }
  body #homeBoard .hb-period .hb-rank-more {
    order:2;
    flex-shrink:0;
    align-items:center;
    gap:12px;
    min-height:44px;
    margin-top:auto;
    line-height:1.45;
    text-align:left;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  body #homeBoard .hb-period .hb-rank-more>span { flex-shrink:0; }
  body #homeBoard .hb-period .hb-tie-note {
    order:1;
    flex-shrink:0;
    min-width:0;
    white-space:normal;
    word-break:keep-all;
    overflow-wrap:anywhere;
  }
  body #homeBoard .hb-period-note {
    display:block;
    flex-shrink:0;
    min-width:0;
    max-width:100%;
    height:auto;
    max-height:none;
    margin-top:12px;
    margin-bottom:0;
    white-space:normal;
    word-break:keep-all;
    overflow-wrap:anywhere;
    overflow:visible;
    line-height:1.6;
  }
  body #homeBoard .hb-period-note small {
    display:block;
    min-width:0;
    max-width:100%;
    margin-top:2px;
    white-space:normal;
    word-break:keep-all;
    overflow-wrap:anywhere;
    line-height:1.6;
  }
}

/* Side-by-side months reserve room for the current-month explanation and
   optional status line. Longer explanations still grow rather than clipping. */
@media screen and (min-width:1251px) {
  body #homeBoard .hb-period-note { min-height:54px; }
}