/* CHRICharts (2.17.0) — compact chart widgets for the public stats page and the member dashboards. */
.chri-charts__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 1rem; align-items: start; }
.chri-public-charts__note { font-size: .85rem; color: #5b6b7b; margin: 0 0 1rem; }

/* card */
.chri-chart { position: relative; background: #fff; border: 1px solid #e3e8ee; border-radius: 10px; padding: .9rem 1rem 1rem; box-shadow: 0 1px 2px rgba(20,30,45,.04); min-width: 0; }
.chri-chart__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 28px; }
.chri-chart h3.chri-chart__title, .chri-chart .chri-chart__title, .chri-kpis h3.chri-chart__title {
	margin: 0; font-size: .72rem; line-height: 1.2; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #5b6b7b;
}
.chri-chart__summary { margin: .35rem 0 .6rem; font-size: 1rem; line-height: 1.3; font-weight: 600; color: #1e2b3a; }
.chri-chart__plot { position: relative; width: 100%; }
.chri-chart__plot canvas { max-width: 100%; }
.chri-chart__canvas { position: relative; width: 100%; height: 100%; min-width: 0; }
.chri-chart__plot--pie { display: flex; align-items: center; gap: 1rem; }
.chri-chart__plot--pie .chri-chart__canvas { flex: 0 0 42%; max-width: 180px; }
.chri-chart__legend { list-style: none; margin: 0; padding: 0; flex: 1 1 auto; min-width: 0; font-size: .82rem; }
.chri-chart__legend li { display: flex; align-items: center; gap: .5rem; padding: .28rem 0; border-bottom: 1px solid #eef1f4; }
.chri-chart__legend li:last-child { border-bottom: 0; }
.chri-chart__swatch { flex: none; width: 10px; height: 10px; border-radius: 3px; }
.chri-chart__legend-label { flex: 1 1 auto; min-width: 0; color: #1e2b3a; overflow-wrap: anywhere; }
.chri-chart__legend-value { flex: none; font-weight: 600; color: #1e2b3a; font-variant-numeric: tabular-nums; }

/* tools: a small select + a "···" menu */
.chri-chart__tools { display: inline-flex; align-items: center; gap: .35rem; flex: none; }
.chri-chart .chri-chart__view, .chri-dashboards__pick .chri-chart__view {
	font: inherit; font-size: .75rem; line-height: 1; padding: .3rem 1.4rem .3rem .55rem; border: 1px solid #d6dee6; border-radius: 6px; background: #fff; color: #23384f; height: 28px;
	appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235b6b7b' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .5rem center;
}
.chri-chart__menu { position: relative; }
.chri-chart__menu > summary { list-style: none; cursor: pointer; width: 28px; height: 28px; border: 1px solid #d6dee6; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; letter-spacing: .05em; color: #5b6b7b; background: #fff; user-select: none; }
.chri-chart__menu > summary::-webkit-details-marker { display: none; }
.chri-chart__menu > summary:hover, .chri-chart__menu[open] > summary, .chri-chart .chri-chart__view:hover { border-color: #4292c6; color: #1f5c8f; }
.chri-chart__menu > summary:focus-visible, .chri-chart .chri-chart__view:focus-visible { outline: none; box-shadow: 0 0 0 2px rgba(66,146,198,.3); }
.chri-chart__menu-list { position: absolute; right: 0; top: 32px; z-index: 20; min-width: 170px; background: #fff; border: 1px solid #d6dee6; border-radius: 8px; box-shadow: 0 6px 18px rgba(20,30,45,.12); padding: .3rem; display: flex; flex-direction: column; }
.chri-chart__menu-list button { font: inherit; font-size: .8rem; text-align: left; padding: calc(.45rem - .0735em) .6rem calc(.45rem + .0735em); border: 0; background: transparent; color: #23384f; border-radius: 5px; cursor: pointer; }
.chri-chart__menu-list button:hover, .chri-chart__menu-list button:focus-visible { background: #eef5fb; color: #1f5c8f; outline: none; }

/* table (also the no-JS fallback) */
.chri-chart__table { width: 100%; border-collapse: collapse; margin: .6rem 0 0; font-size: .82rem; }
.chri-chart__table caption { text-align: left; font-weight: 600; padding: .25rem 0; color: #5b6b7b; font-size: .75rem; }
.chri-chart__table th, .chri-chart__table td { border-bottom: 1px solid #eef1f4; padding: .3rem .4rem; text-align: left; font-weight: 500; }
.chri-chart__table td { text-align: right; font-variant-numeric: tabular-nums; }
.chri-chart__table[hidden] { display: none; }
.chri-chart__meta { margin: .5rem 0 0; font-size: .72rem; color: #7a8794; }
.chri-chart__live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }
.chri-chart__stale { display: inline-block; margin-left: .5rem; padding: .05rem .45rem; border-radius: 999px; background: #fff4e5; color: #8a4b00; font-size: .7rem; }
.chri-chart--nojs .chri-chart__tools { display: none; }

/* KPI strip */
.chri-kpis { background: #fff; border: 1px solid #e3e8ee; border-radius: 10px; padding: .9rem 1rem 1rem; margin: 0 0 1rem; }
.chri-kpis__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem 1.25rem; margin: .5rem 0 0; }
.chri-kpi { display: flex; flex-direction: column-reverse; margin: 0; }
.chri-kpi__value { margin: 0; font-size: 1.5rem; line-height: 1.1; font-weight: 700; color: #1e2b3a; font-variant-numeric: tabular-nums; }
.chri-kpi__value small { font-size: .72rem; font-weight: 500; color: #7a8794; margin-left: .2rem; }
.chri-kpi__label { margin: 0 0 .15rem; font-size: .75rem; color: #5b6b7b; }

/* dashboards */
.chri-dashboards__bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; margin: 0 0 1rem; font-size: .85rem; }
.chri-dashboards__pick { display: inline-flex; align-items: center; gap: .4rem; color: #5b6b7b; }
.chri-dashboards__gen { font-size: .75rem; color: #7a8794; }
.chri-dashboards__chart { margin: 0; }
@media (prefers-reduced-motion: reduce) { .chri-chart__menu-list, .chri-chart__view { transition: none; } }

/* 2.26.0 (wf-63): per-chart footnote with a cross-link. */
.chri-chart__foot { margin: .4rem 0 0; font-size: .72rem; color: #5b6b7b; }
.chri-chart__foot a { color: #449fd8; }
