/* Tracking tab: followed players on the left, matches together on the right. */
.track-intro{display:flex;justify-content:space-between;align-items:flex-start;gap:14px 28px;flex-wrap:wrap;margin:4px 0 6px}
.track-intro p{margin:0;max-width:58ch;color:var(--muted);font-size:15px}
.track-intro p strong{color:var(--text);font-weight:600}
.track-add{flex:1 1 340px;max-width:460px}
.track-count{color:var(--muted);font-size:13px;margin:0 0 4px}
.track-count b{color:var(--text);font-weight:600}
.track-browser{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);column-gap:clamp(20px,2.8vw,36px);align-items:start;margin-top:10px}
.track-list{list-style:none;margin:0;padding:0}
.track-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;border-bottom:1px solid var(--line2)}
.track-item.selected{border-bottom-color:var(--text)}
.track-open{all:unset;box-sizing:border-box;display:block;min-width:0;padding:16px 0;min-height:72px;cursor:pointer}
.track-open:focus-visible{outline:2px solid var(--red2);outline-offset:3px}
.track-name{display:block;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.track-meta{display:flex;gap:4px 12px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-top:3px}
.track-meta .live{color:var(--text)}
.track-item .switch{padding:7px 10px;gap:10px;font-size:13px}
.track-detail{min-width:0;padding:16px 0 0}
.track-detail h3{font-size:17px;font-weight:600;margin:0 0 4px}
.track-detail>p{color:var(--muted);font-size:13px;margin:0 0 14px}
.track-summary{display:grid;grid-template-columns:repeat(2,minmax(0,180px));gap:12px;margin:0 0 16px}
.track-summary>div{border-left:2px solid var(--line2);padding:2px 0 2px 12px}
.track-summary dt{color:var(--muted);font-size:13px}
.track-summary dd{margin:2px 0 0;display:flex;align-items:baseline;gap:10px;font-variant-numeric:tabular-nums}
.track-summary dd b{font-size:24px;font-weight:700;line-height:1.1}
.track-summary .wl{color:var(--muted);font-size:14px}
.track-summary .wl .w{color:var(--win)}.track-summary .wl .l{color:var(--loss)}
.track-games{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.track-games th{font-size:12px;font-weight:500;color:var(--muted);text-align:left;padding:4px 6px 6px 0;border-bottom:1px solid var(--line2)}
.track-games td{padding:9px 6px 9px 0;border-bottom:1px solid var(--line);vertical-align:top;color:#c6baa8}
.track-games tr[data-match]{cursor:pointer}
.track-games tr[data-match]:hover td{color:var(--text)}
.track-games tr[data-match]:focus-visible{outline:2px solid var(--red2);outline-offset:-2px}
.track-games td:first-child,.track-games .res{white-space:nowrap}
.track-games .res{font-weight:650;color:var(--text)}
.track-games .res.win{color:var(--win)}.track-games .res.loss{color:var(--loss)}
.track-games .heroes{color:var(--muted)}
.track-games .heroes b{color:#c6baa8;font-weight:500}
.track-remove{margin-top:18px;font-size:13px!important;padding:8px 12px!important;color:var(--muted)!important}
.track-empty{color:var(--muted);font-size:14px;padding:16px 0}
@media (max-width:780px){
  .track-browser{display:block}
  .track-item .track-detail{grid-column:1 / -1;padding:4px 0 22px}
  .track-games .mode{display:none}
}
@media (max-width:430px){
  .track-item .switch .track-switch-label{display:none}
  .track-games{font-size:12.5px}
}
