/* icehockeyapi.com: the browse pages (leagues, games, teams, the MCP page), as approved in the phase 3 preview.
   Loaded on those pages only, after site.css; every class here starts br- or is the shared plan dot. */
.br-chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: var(--r); font-size: 12px; white-space: nowrap; background: var(--ice); color: var(--muted); }
.br-chip.full { background: #E6F4EC; color: var(--green); }
.ui-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: none; }
.ui-d-free { background: var(--green); } .ui-d-paid { background: var(--blue); } .ui-d-live { background: var(--red); } .ui-d-odds { background: #C98A12; }
.br-num { font-variant-numeric: tabular-nums; text-align: right; }
.br-empty { padding: 16px; color: var(--muted); font-size: 14px; }
.br-gap { margin-top: 18px; }
.br-head { background: linear-gradient(180deg, var(--ice) 0%, #fff 100%); border-bottom: 1px solid var(--line); }
.br-head .wrap { padding-top: 40px; padding-bottom: 28px; }
.br-crumb { color: var(--muted); font-size: 13px; }
.br-crumb a { color: var(--blue); }
.br-kw { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); font-weight: 500; margin-top: 10px; }
.br-big { display: block; font-size: 38px; line-height: 1.1; letter-spacing: -.03em; font-weight: 500; margin-top: 6px; }
.br-line { color: var(--text); margin-top: 10px; max-width: 720px; }
.br-figs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 22px; }
.br-figs div { border: 1px solid var(--line); border-radius: var(--r); background: #fff; padding: 14px 16px; }
.br-figs b { display: block; font-size: 24px; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.br-figs span { color: var(--muted); font-size: 13px; }
.br-sec { padding-top: 32px; padding-bottom: 32px; }
.br-sh { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 14px; }
.br-sec > .br-sh { margin-top: 28px; }
.br-sh h2 { font-size: 20px; font-weight: 500; letter-spacing: -.015em; }
.br-sh a { color: var(--blue); font-size: 14px; }
.br-tools { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 20px; }
.br-search { position: relative; flex: 1; min-width: 240px; max-width: 420px; }
.br-search input { width: 100%; height: 42px; border: 1px solid var(--line); border-radius: var(--r); padding: 0 12px 0 38px; font: 14px Inter, sans-serif; background: #fff; }
.br-search svg { position: absolute; left: 13px; top: 13px; width: 16px; height: 16px; color: var(--muted); }
.br-select { height: 42px; border: 1px solid var(--line); border-radius: var(--r); padding: 0 12px; font: 14px Inter, sans-serif; background: #fff; min-width: 170px; }
.br-tabs { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r); padding: 3px; background: #fff; }
.br-tabs a, .br-tabs button { height: 34px; border: 0; background: none; cursor: pointer; font-family: Inter, sans-serif; min-width: 112px; display: grid; place-items: center; border-radius: var(--r); font-size: 13.5px; color: var(--muted); white-space: nowrap; padding: 0 10px; }
.br-tabs a.on, .br-tabs button.on { background: var(--ink); color: #fff; }
.br-table { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; }
.br-frame { border: 1px solid var(--line); border-radius: var(--r); overflow: clip; background: #fff; }
.br-table th { text-align: left; font-weight: 500; color: var(--muted); font-size: 12.5px; padding: 11px 14px; border-bottom: 1px solid var(--line); white-space: nowrap; position: sticky; top: 64px; background: #fff; }
.br-table th.br-num { text-align: right; }
.br-table td { padding: 11px 14px; border-bottom: 1px solid var(--ice); white-space: nowrap; }
.br-table tr:hover td { background: #FAFCFE; }
.br-table tr.hl td { background: #F2F7FD; }
.br-lg { display: flex; align-items: center; gap: 10px; }
.br-flag { width: 30px; height: 22px; border-radius: 5px; background: var(--ice); color: var(--blue); font: 500 11px "JetBrains Mono", monospace; display: grid; place-items: center; flex: none; }
.br-lg small { display: block; color: var(--muted); font-size: 12px; }
.br-bar { display: flex; align-items: center; gap: 8px; justify-content: flex-end; }
.br-bar i { display: block; width: 60px; height: 6px; border-radius: 6px; background: var(--ice); overflow: hidden; }
.br-bar b { display: block; height: 100%; background: var(--blue); }
.br-acts { width: 1%; text-align: right; }
.br-acts a { display: inline-grid; place-items: center; width: 88px; height: 30px; border: 1px solid var(--line); border-radius: var(--r); font-size: 13px; }
.br-acts a + a { margin-left: 6px; }
.br-acts a:hover { border-color: var(--blue); color: var(--blue); }
.br-pager { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; font-size: 13.5px; color: var(--muted); }
.br-pager div { display: flex; gap: 6px; }
.br-pager a, .br-pager button { display: grid; background: #fff; cursor: pointer; font: 13.5px Inter, sans-serif; min-width: 88px; padding: 0 12px; place-items: center; height: 32px; border: 1px solid var(--line); border-radius: var(--r); color: var(--ink); }
.br-days { display: grid; grid-template-columns: 44px repeat(7, minmax(0, 1fr)) 44px; gap: 6px; margin-top: 20px; }
.br-days a { height: 54px; border: 1px solid var(--line); border-radius: var(--r); background: #fff; display: grid; place-items: center; text-align: center; font-size: 13px; line-height: 1.25; }
.br-days a small { display: block; color: var(--muted); font-size: 11.5px; }
.br-days a.on { background: var(--ink); color: #fff; border-color: var(--ink); }
.br-days a.on small { color: #C9D8EA; }
.br-lgroup { margin-top: 18px; padding: 0; }
.br-lgh { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: var(--ice); border: 1px solid var(--line); border-bottom: 0; border-radius: var(--r) var(--r) 0 0; font-size: 14px; }
.br-lgh span { color: var(--muted); font-size: 12.5px; }
.br-lgh a:hover, .br-g a.h:hover, .br-g a.a:hover, .br-st a:hover, .br-kv a { color: var(--blue); }
.br-lgroup[hidden], .br-g[hidden] { display: none; }
.br-g { display: grid; grid-template-columns: 70px minmax(0, 1fr) 70px minmax(0, 1fr) 110px 96px; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid var(--line); border-top: 0; background: #fff; font-size: 14px; }
.br-g:last-child { border-radius: 0 0 var(--r) var(--r); }
.br-g .t { color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.br-g .t.live { color: var(--red); }
.br-g .h { text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.br-g .a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.br-g .sc { text-align: center; font-size: 16px; font-variant-numeric: tabular-nums; background: var(--ice); border-radius: var(--r); height: 30px; display: grid; place-items: center; }
.br-g .lost { color: var(--muted); }
.br-g .e { font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.br-g a.o { display: grid; place-items: center; height: 30px; border: 1px solid var(--line); border-radius: var(--r); font-size: 13px; }
.br-two { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.br-panel { border: 1px solid var(--line); border-radius: var(--r); background: #fff; }
.br-ph { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.br-ph h2 { font-size: 15.5px; font-weight: 500; }
.br-ph a { color: var(--blue); font-size: 13.5px; }
.br-score { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 24px; margin-top: 18px; }
.br-team { display: flex; align-items: center; gap: 14px; }
a.br-team:hover b { color: var(--blue); }
.br-team.r { flex-direction: row-reverse; text-align: right; }
.br-crest { width: 56px; height: 56px; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; font: 500 15px "JetBrains Mono", monospace; flex: none; }
.br-crest.away { background: var(--blue); }
.br-team b { display: block; font-size: 22px; font-weight: 500; letter-spacing: -.02em; }
.br-team div span { color: var(--muted); font-size: 13px; }
.br-mid { text-align: center; }
.br-mid b { font-size: 48px; font-weight: 500; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.br-mid span { display: block; color: var(--muted); font-size: 13px; }
.br-per { width: 100%; border-collapse: collapse; font-size: 14px; }
.br-per th, .br-per td { padding: 10px 14px; border-bottom: 1px solid var(--ice); text-align: center; font-variant-numeric: tabular-nums; }
.br-per th { color: var(--muted); font-weight: 500; font-size: 12.5px; }
.br-per td:first-child, .br-per th:first-child { text-align: left; }
.br-goal { display: grid; grid-template-columns: 66px 50px minmax(0, 1fr) 64px; gap: 10px; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--ice); font-size: 14px; }
a.br-goal:hover { background: #FAFCFE; }
.br-goal .p { color: var(--muted); font-size: 12.5px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.br-goal .s { font: 500 12px "JetBrains Mono", monospace; color: var(--ink); background: var(--ice); border-radius: 6px; padding: 3px 6px; text-align: center; }
.br-goal small { display: block; color: var(--muted); font-size: 12.5px; }
.br-goal > span:nth-child(3), .br-goal small { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.br-goal .sc { text-align: right; font-variant-numeric: tabular-nums; }
.br-ts { padding: 6px 16px 14px; }
.br-ts div { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; gap: 10px; align-items: center; padding: 8px 0; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.br-ts div span:last-child { text-align: right; }
.br-ts i { display: block; height: 8px; border-radius: 8px; background: var(--blue); position: relative; }
.br-ts i b { position: absolute; right: 0; top: 0; bottom: 0; background: var(--sky); border-radius: 0 8px 8px 0; }
.br-ts em { display: block; grid-column: 1 / -1; font-style: normal; color: var(--muted); font-size: 12px; text-align: center; margin-bottom: -4px; }
.br-kv { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 8px 14px; padding: 14px 16px; font-size: 14px; }
.br-kv span:nth-child(odd) { color: var(--muted); }
.br-lock { padding: 22px 16px; text-align: center; }
.br-lock p { color: var(--text); font-size: 14px; }
.br-lock .btn { margin-top: 12px; }
.br-odds { width: 100%; border-collapse: collapse; font-size: 14px; filter: blur(3px); user-select: none; }
.br-odds td { padding: 8px 16px; border-bottom: 1px solid var(--ice); text-align: right; }
.br-odds td:first-child { text-align: left; }
.br-api { padding: 6px 0; }
.br-api a { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 10px; align-items: center; padding: 8px 16px; font: 500 12.5px "JetBrains Mono", monospace; }
.br-api a:hover { background: #FAFCFE; color: var(--blue); }
.br-mcp { display: grid; grid-template-columns: minmax(0, 1fr) 460px; gap: 32px; align-items: start; }
.br-tools2 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.br-tools2 a { border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; background: #fff; }
.br-tools2 a:hover { border-color: var(--blue); }
.br-tools2 b { font: 500 13px "JetBrains Mono", monospace; display: block; }
.br-tools2 span { color: var(--muted); font-size: 12.5px; }
.br-steps { counter-reset: s; display: grid; gap: 12px; min-width: 0; }
.br-mcp > div, .br-steps > div { min-width: 0; }
.br-steps > div { border: 1px solid var(--line); border-radius: var(--r); padding: 16px 16px 16px 58px; position: relative; background: #fff; }
.br-steps > div::before { counter-increment: s; content: counter(s); position: absolute; left: 16px; top: 16px; width: 28px; height: 28px; border-radius: var(--r); background: #E6EEF9; color: var(--blue); display: grid; place-items: center; }
.br-steps h2 { font-size: 15px; font-weight: 500; }
.br-steps p { color: var(--text); font-size: 13.5px; margin-top: 4px; }
.br-steps p a { color: var(--blue); }
.br-code { background: #0E2340; color: #DCE7F4; border-radius: var(--r); padding: 12px 14px; font: 12.5px/1.6 "JetBrains Mono", monospace; margin-top: 10px; overflow-x: auto; white-space: pre; }
.br-chat { border: 1px solid var(--line); border-radius: var(--r); background: #fff; padding: 18px; display: grid; gap: 10px; }
.br-msg { padding: 10px 14px; border-radius: var(--r); font-size: 14px; max-width: 88%; }
.br-msg.me { background: var(--ink); color: #fff; justify-self: end; }
.br-msg.bot { background: var(--ice); }
.br-call { font: 12px "JetBrains Mono", monospace; color: var(--muted); display: flex; gap: 8px; align-items: center; }
.br-call i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); }
.br-st { width: 100%; border-collapse: collapse; font-size: 14px; }
.br-st th { text-align: right; color: var(--muted); font-weight: 500; font-size: 12.5px; padding: 9px 12px; border-bottom: 1px solid var(--line); }
.br-st th:nth-child(-n+2) { text-align: left; }
.br-st td { padding: 9px 12px; border-bottom: 1px solid var(--ice); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.br-st td:nth-child(-n+2) { text-align: left; }
.br-st td:first-child { color: var(--muted); width: 28px; }
.br-form { display: inline-flex; gap: 3px; }
.br-form i { width: 16px; height: 16px; border-radius: 4px; font: 500 10px Inter, sans-serif; display: grid; place-items: center; font-style: normal; color: #fff; }
.br-form .w { background: var(--green); } .br-form .l { background: #C6CFDA; } .br-form .o { background: #E8B04A; }
@media (max-width: 1000px) {
  .br-two, .br-mcp { grid-template-columns: minmax(0, 1fr); }
  .br-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .br-tools2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .br-big { font-size: 28px; }
  .br-hide { display: none; }
  .br-days { grid-template-columns: 36px repeat(3, minmax(0, 1fr)) 36px; }
  .br-days a.far { display: none; }
  .br-g { grid-template-columns: 58px minmax(0, 1fr) 54px minmax(0, 1fr); gap: 8px; padding: 11px 10px; }
  .br-g .e, .br-g a.o { display: none; }
  .br-score { gap: 10px; }
  .br-team { flex-direction: column; gap: 6px; text-align: center; }
  a.br-team:hover b { color: var(--blue); }
.br-team.r { flex-direction: column; text-align: center; }
  .br-team b { font-size: 15px; }
  .br-crest { width: 40px; height: 40px; font-size: 12px; }
  .br-mid b { font-size: 34px; }
  .br-tools2 { grid-template-columns: minmax(0, 1fr); }
  .br-acts a + a { display: none; }
  .br-table th, .br-table td { padding: 10px; }
  .br-search, .br-select { flex: 1 1 100%; max-width: none; min-width: 0; }
  .br-tabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); width: 100%; }
  .br-tabs a, .br-tabs button { min-width: 0; padding: 0 4px; font-size: 13px; }
}