.frb { margin: 12px 0 0; }
.frb[hidden] { display: none; }
.frb-title { margin: 0 0 6px; font-size: 11px; line-height: 16px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #5a6676; }
.frb-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 6px; padding: 0; list-style: none; font-size: 12px; color: #334155; }
.frb-legend li { display: flex; align-items: center; gap: 6px; }
.frb-svg { display: block; width: 100%; height: auto; max-height: 240px; }
.frb-axis { stroke: #cbd5e0; stroke-width: 1; }
.frb-val { font-family: inherit; font-size: 13px; font-weight: 700; fill: #1a202c; font-variant-numeric: tabular-nums; }
.frb-lab { font-family: inherit; font-size: 12px; fill: #5a6676; }
.frb-grp { font-family: inherit; font-size: 12px; font-weight: 700; fill: #334155; }
.frb { position: relative; }
.frb .visually-hidden { display: block; max-width: 1px; position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
body.dark-mode .frb-title, body.dark-mode .frb-lab { color: #9ca3af; fill: #9ca3af; }
body.dark-mode .frb-val { fill: #f9fafb; }
body.dark-mode .frb-grp, body.dark-mode .frb-legend { fill: #e5e7eb; color: #e5e7eb; }
body.dark-mode .frb-axis { stroke: #374151; }
.frb-plot { position: relative; }
.frb .frb-read { position: static; display: flex; flex-wrap: wrap; align-items: baseline; align-content: flex-start; gap: 2px 14px; box-sizing: border-box; max-width: none; margin: 4px 0 0; padding: 6px 2px 0; border: 0; border-top: 1px solid #e3e8ef; border-radius: 0; background: transparent; box-shadow: none; font-size: 13px; line-height: 18px; color: #2d3748; white-space: normal; pointer-events: auto; }
.frb-read .r3-tip-t { flex: 1 1 100%; font-weight: 700; color: #003c87; }
.frb-read.is-idle .r3-tip-t { color: #5a6676; }
.frb-read .r3-tip-r { white-space: nowrap; }
.frb-read .r3-tip-total { font-weight: 600; }
.frb-read b { font-weight: 700; color: #1a202c; }
.frb-read .frb-sw { vertical-align: -1px; }
body.dark-mode .frb .frb-read { background: transparent; border-top-color: #2b3545; color: #e5e7eb; }
body.dark-mode .frb-read .r3-tip-t { color: #93c5fd; }
body.dark-mode .frb-read.is-idle .r3-tip-t { color: #9ca3af; }
body.dark-mode .frb-read b { color: #f9fafb; }
.frb-bar { cursor: help; transition: opacity .12s; }
.frb-bar:focus { outline: none; }
.frb-bar:focus-visible { stroke: #0b4aa2; stroke-width: 2px; }
.frb-plot.is-hot .frb-bar:not(.frb-on) { opacity: .45; }
.frb-bar.frb-on { stroke: #1a202c; stroke-width: 1.5px; }
body.dark-mode .frb-bar.frb-on, body.dark-mode .frb-bar:focus-visible { stroke: #f9fafb; }
@media (prefers-reduced-motion: reduce) { .frb-bar { transition: none; } }
.frb-sw { flex: 0 0 auto; }
.frb-tabs { display: inline-grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px; margin: 0 0 8px; padding: 3px; border: 1px solid #9aa8ba; border-radius: 10px; background: #fff; }
.frb-tab { min-height: 32px; padding: 4px 14px; border: 0; border-radius: 7px; background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: #1f2937; cursor: pointer; white-space: nowrap; }
.frb-tab[aria-pressed="true"] { background: #0b4aa2; color: #fff; }
.frb-tab:not([aria-pressed="true"]):hover { background: #eef3fa; color: #0b4aa2; }
.frb-tab:focus-visible { outline: 2px solid #0b4aa2; outline-offset: 2px; }
body.dark-mode .frb-tabs { background: #1f2937; border-color: #4b5563; }
body.dark-mode .frb-tab { color: #e5e7eb; }
body.dark-mode .frb-tab[aria-pressed="true"] { background: #3b82f6; color: #fff; }
body.dark-mode .frb-tab:not([aria-pressed="true"]):hover { background: #273449; color: #bfdbfe; }
body.dark-mode .frb-tab:focus-visible { outline-color: #93c5fd; }
@media print { .frb-tabs { display: none; } }
.frr-plot { position: relative; padding: 4px 0 0; }
.frr-plot--m { padding-top: 26px; }
.frr-track { position: relative; height: 14px; border-radius: 7px; background: #e6ebf2; overflow: hidden; }
.frr-seg { position: absolute; top: 0; bottom: 0; cursor: help; transition: opacity .12s; }
.frr-seg.r3-bar--a { background: #1d5fc9; }
.frr-seg.r3-bar--b { background: #93b4e6; }
.frr-seg.r3-bar--c { background: #0f766e; }
.frr-seg.r3-bar--d { background: #b45309; }
.frr-seg.r3-bar--f { background: #64748b; }
.frr-seg.r3-bar--g { background: #c2410c; }
.frr-seg:focus { outline: none; }
.frr-seg:focus-visible { box-shadow: inset 0 0 0 2px #0b4aa2; }
.frr-plot.is-hot .frr-seg:not(.frb-on) { opacity: .45; }
.frr-mark { position: absolute; top: 0; bottom: -4px; width: 0; pointer-events: none; }
.frr-mark::before { content: ''; position: absolute; left: -1.5px; top: 20px; bottom: 0; width: 3px; border-radius: 2px; background: #1a202c; }
.frr-mark > span { position: absolute; top: 0; left: 0; transform: translateX(-50%); font-size: 12px; line-height: 16px; font-weight: 700; white-space: nowrap; color: #1a202c; }
.frr-mark--l > span { transform: none; }
.frr-mark--r > span { transform: translateX(-100%); }
.frr-ticks { position: relative; height: 18px; margin: 6px 0 0; font-size: 12px; line-height: 18px; color: #5a6676; }
.frr-tick { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.frr-tick--l { transform: none; }
.frr-tick--r { transform: translateX(-100%); }
body.dark-mode .frr-track { background: #2b3545; }
body.dark-mode .frr-seg.r3-bar--a { background: #60a5fa; }
body.dark-mode .frr-seg.r3-bar--b { background: #7aa7e8; }
body.dark-mode .frr-seg.r3-bar--c { background: #2dd4bf; }
body.dark-mode .frr-seg.r3-bar--d { background: #fbbf24; }
body.dark-mode .frr-seg.r3-bar--g { background: #fb923c; }
body.dark-mode .frr-mark::before { background: #f9fafb; }
body.dark-mode .frr-mark > span { color: #f9fafb; }
body.dark-mode .frr-ticks { color: #9ca3af; }
@media (prefers-reduced-motion: reduce) { .frr-seg { transition: none; } }
.frc-graf .r3-bar--a { fill: #1d5fc9; }
.frc-graf .r3-bar--b { fill: #93b4e6; }
.frc-graf .r3-bar--c { fill: #0f766e; }
.frc-graf .r3-bar--d { fill: #b45309; }
.frc-graf .r3-bar--f { fill: #64748b; }
.frc-graf .r3-bar--g { fill: #c2410c; }
body.dark-mode .frc-graf .r3-bar--a { fill: #60a5fa; }
body.dark-mode .frc-graf .r3-bar--b { fill: #7aa7e8; }
body.dark-mode .frc-graf .r3-bar--c { fill: #2dd4bf; }
body.dark-mode .frc-graf .r3-bar--d { fill: #fbbf24; }
body.dark-mode .frc-graf .r3-bar--g { fill: #fb923c; }
.frp-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; margin: 6px 0 8px; }
.frp-plot { flex: 0 0 auto; width: 180px; max-width: 100%; }
.frp-svg { display: block; width: 100%; height: auto; }
.frp-seg { cursor: help; stroke: #fff; stroke-width: 1.5; transition: opacity .12s; }
.frp-seg:focus { outline: none; }
.frp-seg:focus-visible { stroke: #0b4aa2; stroke-width: 3; }
.frp-plot.is-hot .frp-seg:not(.frb-on) { opacity: .45; }
.frp-legend { flex-direction: column; flex-wrap: nowrap; gap: 6px; font-size: 13px; margin: 0; }
.frp-c { font-size: 18px; font-weight: 700; fill: #1f2937; }
body.dark-mode .frp-seg { stroke: #1e1e1e; }
body.dark-mode .frp-c { fill: #e5e7eb; }
@media (max-width: 480px) { .frp-wrap { justify-content: center; } .frp-plot { width: 160px; } }
