/* 入試の傾向ページ(trends.html)で、landing.css の .tr-* に足す分(2026-10-27)。
   ★直したら trends.html の ?v= も上げること。 */
.tr-badge { display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; font-size: 0.72rem; background: var(--accent-soft); color: var(--accent-text); white-space: nowrap; }
.tr-pair { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--border); }
.tr-pair-names { min-width: 0; }
.tr-times { margin: 0 8px; color: var(--muted); }
.tr-pair .tr-count { text-align: right; }
.tr-pair .tr-count .tr-cat { display: block; margin-left: 0; }
.tr-tagrow { align-items: flex-start; }
.tr-tagrow .tr-name { flex-basis: 11em; }
.tr-tagrow .tr-tags { flex: 1 1 auto; }
.tr-diffrow .tr-name { flex-basis: 11em; }
.tr-diffrow .tr-name .tr-cat { display: block; margin-left: 0; }
.tr-count .tr-cat { display: block; margin-left: 0; }
.tr-wide { min-width: 9em; }
.tr-matrix { max-width: none; }
.tr-matrix th { white-space: nowrap; }
.tr-mcell { display: block; height: 22px; line-height: 22px; border-radius: 3px; text-align: center; font-size: 0.78rem;
            background: color-mix(in srgb, var(--accent) calc(var(--v) * 85%), var(--tag-bg)); }
.tr-mcell[style*="--v:0.00"] { color: var(--muted); }
@media (max-width: 560px) {
    .tr-tagrow, .tr-diffrow { flex-wrap: wrap; }
    .tr-tagrow .tr-name, .tr-diffrow .tr-name { flex-basis: 100%; }
    .tr-diffrow .tr-bar { flex: 1 1 40%; }
    .tr-pair { flex-wrap: wrap; }
}

/* 年度×単元の表: 出た年は数字入り。1問は中くらいの色、2問以上は濃い色。出ていない年は空白のまま薄く(2026-10-28) */
.tr-cell { background: var(--tag-bg); opacity: 0.6; }
.tr-cell.one { opacity: 1; background: color-mix(in srgb, var(--accent) 55%, var(--tag-bg)); color: #fff; font-weight: 600; }
.tr-cell.many { opacity: 1; background: var(--accent); color: #fff; font-weight: 700; }