/* Crime report v3: answer first, phone first. Navy and teal only, no red. */
/* The page offsets itself below the fixed site header (as the crime base does). */
body { padding-top: 0 !important; }
.r3 {
  --r3-navy: #0b1f3a;
  --r3-ink: #1a2433;
  --r3-muted: #4b5563;
  --r3-teal: #0e7490;
  --r3-teal-wash: #e6f3f5;
  --r3-navy-wash: #eef2f7;
  --r3-line: #dde3ea;
  --r3-bg: #f7f9fb;
  --r3-card: #ffffff;
  background: var(--r3-bg);
  color: var(--r3-ink);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  line-height: 1.55;
  padding-top: var(--ecpt-content-offset, 64px);
  padding-bottom: 2rem;
}
.r3 a { color: var(--r3-teal); }
.r3 a:focus-visible, .r3 [tabindex]:focus-visible { outline: 2px solid var(--r3-teal); outline-offset: 2px; }
.r3-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.r3-crumbs { max-width: 720px; margin: 0 auto; padding: .5rem 16px 0; font-size: .8rem; color: var(--r3-muted); }
.r3-crumbs a { text-decoration: none; }
.r3-crumbs span[aria-hidden] { margin: 0 .3rem; }

/* Compact sticky report nav: one row, scrolls sideways on a phone. */
.r3-nav { position: sticky; top: var(--ecpt-content-offset, 64px); z-index: 50; background: var(--r3-navy); }
.r3-nav ul { display: flex; gap: .25rem; margin: 0 auto; padding: 0 12px; max-width: 720px; list-style: none; overflow-x: auto; scrollbar-width: none; }
.r3-nav ul::-webkit-scrollbar { display: none; }
.r3-nav a { display: flex; align-items: center; min-height: 44px; padding: 0 .75rem; color: #fff; opacity: .85; text-decoration: none; font-size: .875rem; font-weight: 500; white-space: nowrap; }
.r3-nav a[aria-current="page"] { opacity: 1; box-shadow: inset 0 -3px 0 #5ec8d8; }
.r3-nav a:hover { opacity: 1; }

.r3-preview { max-width: 720px; margin: .75rem auto 0; padding: .5rem 16px; background: var(--r3-teal-wash); font-size: .85rem; }

.r3-wrap { max-width: 720px; margin: 0 auto; padding: 0 16px; display: grid; gap: 1.25rem; }
.r3-wrap > * { min-width: 0; }

.r3-head { padding-top: 1.25rem; display: grid; gap: .35rem; }
.r3-eyebrow { margin: 0; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--r3-teal); }
.r3-head h1 { margin: 0; font-size: 1.75rem; line-height: 1.2; color: var(--r3-navy); font-weight: 700; }
.r3-areas { margin: 0; font-size: .85rem; color: var(--r3-muted); }
.r3-stamp { margin: .25rem 0 0; display: flex; flex-wrap: wrap; gap: .4rem; font-size: .78rem; }
.r3-stamp span { background: var(--r3-navy-wash); color: var(--r3-navy); border-radius: 999px; padding: .2rem .6rem; }

.r3-answer { background: var(--r3-card); border: 1px solid var(--r3-line); border-left: 4px solid var(--r3-teal); border-radius: 12px; padding: 1rem 1.1rem; }
.r3-answer p { margin: 0 0 .6rem; }
.r3-answer p:last-child { margin-bottom: 0; }
.r3-headline { font-size: 1.15rem; font-weight: 700; line-height: 1.35; color: var(--r3-navy); }

.r3-sec { background: var(--r3-card); border: 1px solid var(--r3-line); border-radius: 12px; padding: 1rem 1.1rem; }
.r3-sec h2 { margin: 0; font-size: 1.2rem; color: var(--r3-navy); font-weight: 700; }
.r3-sec h3 { margin: .75rem 0 .25rem; font-size: 1.05rem; color: var(--r3-navy); }
.r3-sec h4 { margin: .9rem 0 .35rem; font-size: .9rem; color: var(--r3-muted); font-weight: 600; }
.r3-sec p { margin: .5rem 0 0; }
.r3-sub, .r3-note { font-size: .85rem; color: var(--r3-muted); }
.r3-sub { margin-top: .15rem !important; }

.r3-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .75rem 0 .25rem; }
.r3-chip { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .9rem; border: 1px solid var(--r3-line); border-radius: 999px; background: #fff; color: var(--r3-navy) !important; font-size: .875rem; text-decoration: none; }
.r3-chip[aria-current="true"] { background: var(--r3-navy); border-color: var(--r3-navy); color: #fff !important; }

.r3-hood { border-top: 1px solid var(--r3-line); margin-top: .75rem; padding-top: .5rem; scroll-margin-top: 130px; }
.r3-js .r3-hood { border-top: 0; margin-top: .25rem; }
.r3-hood-top { display: flex; align-items: baseline; gap: .5rem; }
.r3-big { font-size: 2rem; font-weight: 700; color: var(--r3-navy); font-variant-numeric: tabular-nums; }
.r3-hood-top span:last-child { font-size: .9rem; color: var(--r3-muted); }

.r3-bars { display: grid; gap: .35rem; margin-top: .6rem; }
.r3-bar { display: grid; grid-template-columns: 9.5rem 1fr 2rem; align-items: center; gap: .5rem; font-size: .85rem; }
.r3-track { height: 10px; background: var(--r3-navy-wash); border-radius: 5px; overflow: hidden; }
.r3-track span { display: block; height: 100%; border-radius: 5px; }
.r3-n { text-align: right; font-variant-numeric: tabular-nums; }
.r3-chart-text, .r3-hood p { font-size: .9rem; }

.r3-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; font-size: .9rem; }
.r3-list li { display: grid; grid-template-columns: 5.8rem 1fr; gap: .5rem; }
.r3-list time { color: var(--r3-muted); font-size: .82rem; font-variant-numeric: tabular-nums; }
.r3-src { font-size: .78rem; color: var(--r3-muted); }
a.r3-src { color: var(--r3-teal); }

.r3-when { width: 100%; border-collapse: separate; border-spacing: 3px; margin-top: .6rem; font-size: .82rem; table-layout: fixed; }
.r3-when th { font-weight: 500; text-align: left; }
.r3-when thead th { text-align: center; color: var(--r3-muted); font-size: .75rem; }
.r3-when tbody th { width: 38%; }
.r3-when td { text-align: center; height: 34px; border-radius: 6px; color: var(--r3-navy); background: color-mix(in srgb, var(--r3-teal) calc(var(--lvl) * 45%), var(--r3-navy-wash)); font-variant-numeric: tabular-nums; }
.r3-when td.r3-hi { color: #fff; font-weight: 600; background: color-mix(in srgb, var(--r3-navy) calc(var(--lvl) * 70%), var(--r3-teal)); }

.r3-tips { margin: .5rem 0 0; padding-left: 1.1rem; display: grid; gap: .4rem; font-size: .92rem; }

.r3-station { font-weight: 600; color: var(--r3-navy); }
.r3-police { width: 100%; border-collapse: collapse; margin-top: .5rem; font-size: .9rem; }
.r3-police th, .r3-police td { padding: .4rem .3rem .4rem 0; border-bottom: 1px solid var(--r3-line); text-align: left; font-weight: 400; }
.r3-police .r3-v { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.r3-police .r3-c { text-align: right; color: var(--r3-muted); font-size: .82rem; }
/* The column heads show: the year-earlier cells are bare numbers. */
.r3-police .r3-police-head th { font-size: .75rem; font-weight: 600; color: var(--r3-muted); vertical-align: bottom; }
.r3-dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-right: .45rem; }
.r3-agree { margin-top: .75rem; background: var(--r3-teal-wash); border-radius: 10px; padding: .6rem .8rem; font-size: .9rem; }
.r3-agree h3 { margin: 0; font-size: .95rem; }

/* Station benchmark: the card above the answer, one line and the peer table in the police section. */
.r3-bm { background: var(--r3-card); border: 1px solid var(--r3-line); border-radius: 12px; padding: 1rem 1.1rem; }
.r3-bm p { margin: .5rem 0 0; }
.r3-bm-verdict { margin-top: .35rem !important; }
.r3-bm-point { font-size: .95rem; }
.r3-bm-bottom { background: var(--r3-teal-wash); border-left: 4px solid var(--r3-teal); border-radius: 6px; padding: .6rem .75rem; font-weight: 600; color: var(--r3-navy); }
.r3-bm-source { font-size: .8rem; color: var(--r3-muted); }
/* Benchmark charts: inline SVG from reports/benchmark_charts.py; series colours on marks only, text in the page's tokens. */
.r3-bm-fig { margin: .9rem 0 0; padding-top: .8rem; border-top: 1px solid var(--r3-line); }
.r3-bm .r3-bm-title { margin: 0 0 .15rem; font-size: 1.02rem; line-height: 1.35; font-weight: 700; color: var(--r3-navy); }
.r3-bm .r3-bm-sub { margin: 0 0 .55rem; font-size: .8rem; line-height: 1.4; color: var(--r3-muted); }
.r3-bm-cap { margin: .5rem 0 0; font-size: .9rem; color: var(--r3-ink); }
.r3-bm-legend { display: flex; flex-wrap: wrap; gap: .2rem .9rem; margin: 0 0 .45rem; padding: 0; list-style: none; font-size: .8rem; line-height: 1.35; color: var(--r3-muted); }
.r3-bm-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.r3-bm-legend i.r3-bm-s1 { background: #2a78d6; }
.r3-bm-legend i.r3-bm-s2 { background: #eb6834; }
.r3-bm-legend i.r3-bm-s3 { background: #1baf7a; }
.r3-bm-svg { display: block; width: 100%; height: auto; overflow: visible; }
/* Wider than a phone the charts stop growing, so their labels keep close to the text size. */
.r3-bm-fig > .r3-bm-svg, .r3-bm-minis { max-width: 460px; }
.r3-bm-svg .r3-bm-s1, .r3-bm-svg .r3-bm-hl { fill: #2a78d6; }
.r3-bm-svg .r3-bm-s2 { fill: #eb6834; }
.r3-bm-svg .r3-bm-s3 { fill: #1baf7a; }
.r3-bm-ctx { fill: #c7d0da; }
.r3-bm-marker { fill: #2a78d6; }
.r3-bm-notch { fill: none; stroke: #fff; stroke-width: 1.5; }
.r3-bm-ref { stroke: #0b1f3a; stroke-width: 1; stroke-dasharray: 3 3; }
.r3-bm-lead { stroke: #0b1f3a; stroke-width: 1; }
.r3-bm-base { stroke: var(--r3-line); stroke-width: 1; }
.r3-bm-line { fill: none; stroke: #2a78d6; stroke-width: 2; stroke-linejoin: round; }
.r3-bm-dot { fill: #2a78d6; stroke: #fff; stroke-width: 2; }
.r3-bm-lab { font-size: 12px; font-weight: 600; fill: var(--r3-navy); }
.r3-bm-small { font-size: 10.5px; fill: var(--r3-muted); }
.r3-bm-in { font-size: 12px; font-weight: 600; fill: #fff; }
.r3-bm-val { font-size: 12px; font-weight: 600; fill: var(--r3-ink); }
.r3-bm-halo { paint-order: stroke; stroke: #fff; stroke-width: 3px; stroke-linejoin: round; }
.r3-bm-minis { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.r3-bm-minis > * { min-width: 0; }
.r3-bm .r3-bm-mini-h { margin: 0 0 .2rem; display: flex; flex-direction: column; font-size: .85rem; line-height: 1.3; color: var(--r3-navy); }
.r3-bm-mini-h span { font-size: .78rem; color: var(--r3-muted); }
.r3-bm-mini-h .r3-bm-mini-t { font-size: .85rem; font-weight: 700; color: var(--r3-navy); }
.r3-bm-numbers { margin-top: .9rem; font-size: .85rem; }
.r3-bm-numbers summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; color: var(--r3-teal); font-weight: 600; }
.r3-bm-numbers table { width: 100%; margin: .4rem 0 .8rem; border-collapse: collapse; }
.r3-bm-numbers caption { caption-side: top; text-align: left; font-size: .8rem; color: var(--r3-muted); padding-bottom: .25rem; }
.r3-bm-numbers th, .r3-bm-numbers td { padding: .25rem .4rem .25rem 0; border-bottom: 1px solid var(--r3-line); text-align: left; font-weight: 400; }
.r3-bm-numbers thead th { font-weight: 600; color: var(--r3-navy); }
.r3-bm-numbers td { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.r3-bm-hit { fill: transparent; pointer-events: none; }
/* The interactive layer (report_v3.js): tooltips, the hovered mark lifted, the compare choice. */
.r3-bm-js .r3-bm-fig { position: relative; }
.r3-bm-js .r3-bm-hit { pointer-events: all; cursor: crosshair; }
.r3-bm-js .r3-bm-svg[tabindex]:focus { outline: none; }
.r3-bm-js .r3-bm-svg[tabindex]:focus-visible { outline: 2px solid var(--r3-teal); outline-offset: 3px; border-radius: 4px; }
.r3-bm-svg rect.is-on { stroke: #0b1f3a; stroke-width: 1.5; }
.r3-bm-svg .r3-bm-ctx.is-on { fill: #8795a6; }
.r3-bm-svg .r3-bm-dot.is-on { stroke: #0b1f3a; }
.r3-bm-hair { stroke: #0b1f3a; stroke-width: 1; stroke-dasharray: 2 2; }
.r3-bm-tip { position: absolute; z-index: 5; width: max-content; max-width: min(16rem, 100%); padding: .35rem .55rem; background: var(--r3-navy); color: #fff; border-radius: 6px; font-size: .8rem; line-height: 1.35; pointer-events: none; box-shadow: 0 2px 8px rgba(11, 31, 58, .25); transition: opacity .12s; }
.r3-bm-tip strong { font-weight: 700; }
.r3-bm-tip-n { color: #c9d4e2; }
.r3-bm-tip-block { display: block; }
.r3-bm-tip.is-pinned { pointer-events: auto; }
.r3-bm-tip-more { display: block; margin-top: .2rem; }
.r3-bm-tip button { display: inline-flex; align-items: center; min-height: 32px; margin-top: .35rem; padding: .2rem .6rem; font: inherit; font-weight: 600; color: var(--r3-navy); background: #fff; border: 0; border-radius: 4px; cursor: pointer; }
.r3-bm-tip button:focus-visible { outline: 2px solid #5ec8d8; outline-offset: 2px; }
.r3-bm-compare { margin: 0 0 .5rem !important; font-size: .85rem; color: var(--r3-muted); }
.r3-bm-compare select { max-width: 100%; min-height: 36px; margin-left: .25rem; padding: .2rem .4rem; font: inherit; color: var(--r3-ink); border: 1px solid var(--r3-line); border-radius: 6px; background: #fff; }
@media (prefers-reduced-motion: reduce) { .r3-bm-tip { transition: none; } }
.r3-bm-words { margin: .4rem 0 .2rem; font-size: .9rem; border-collapse: collapse; }
.r3-bm-words th, .r3-bm-words td { padding: .2rem .8rem .2rem 0; text-align: left; border-bottom: 1px solid var(--r3-line); }
.r3-bm-words tbody th { font-weight: 600; }
.r3-bm-peers { margin-top: 1rem; }
.r3-bm-scroll { overflow-x: auto; }
.r3-bm-peers table { min-width: 34rem; font-size: .85rem; }
.r3-bm-peers .r3-bm-caption { margin: 0 0 .35rem; font-weight: 600; color: var(--r3-navy); }
.r3-bm-peers thead th { font-size: .75rem; font-weight: 600; color: var(--r3-muted); vertical-align: bottom; }
.r3-bm-peers td { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.r3-bm-peers tbody th { white-space: nowrap; }
.r3-bm-peers .r3-bm-this > * { font-weight: 700; color: var(--r3-navy); }

.r3-links { display: grid; gap: .5rem; }
.r3-links a { display: flex; align-items: center; min-height: 48px; padding: 0 1rem; background: var(--r3-card); border: 1px solid var(--r3-line); border-radius: 10px; font-weight: 600; text-decoration: none; }
.r3-links a::after { content: "›"; margin-left: auto; font-size: 1.2rem; }

/* Other district reports: a small wrapped list of names, same on every tab. */
.r3-others-wrap { margin-top: 1.25rem; }
.r3-others h2 { font-size: 1rem; }
.r3-others-list { list-style: none; margin: .5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.r3-others-list a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 .8rem; border: 1px solid var(--r3-line); border-radius: 999px; background: #fff; color: var(--r3-navy); font-size: .875rem; text-decoration: none; }
.r3-others-list a:hover { border-color: var(--r3-teal); }
.r3-others-more { display: flex; flex-wrap: wrap; gap: 0 1.25rem; font-size: .875rem; }
.r3-others-more a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; }

.r3-about { font-size: .82rem; color: var(--r3-muted); }
.r3-about p { margin: .3rem 0 0; }

.r3-hots { display: grid; gap: .5rem; margin-top: .5rem; }
.r3-hot { border: 1px solid var(--r3-line); border-radius: 10px; padding: .6rem .8rem; }
.r3-hot h3 { margin: 0; font-size: 1rem; }
.r3-hot p { margin: .25rem 0 0; font-size: .88rem; }
.r3-hot p.r3-note { font-size: .82rem; line-height: 1.45; }
.r3-hot a { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: -.4rem; font-size: .85rem; font-weight: 600; }

.r3-radar { margin: .75rem 0 0; }
.r3-radar figcaption { font-size: .95rem; color: var(--r3-navy); }
.r3-radar-box { position: relative; height: 250px; max-width: 420px; margin: .25rem auto 0; }
.r3-legend { list-style: none; margin: .2rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .82rem; color: var(--r3-muted); }
.r3-legend li { display: flex; align-items: center; gap: .4rem; }
.r3-key { display: inline-block; width: 14px; height: 10px; border-radius: 2px; }
.r3-key--now { background: rgba(14, 116, 144, .35); border: 2px solid #0e7490; }
.r3-key--before { border: 2px dashed #7c8ea3; }

/* Source chips: the text and icon name the source; colour only repeats it. */
.r3-srcs { display: flex; flex-wrap: wrap; gap: .3rem; margin: .35rem 0 0 !important; }
.r3-srcchip { display: inline-flex; align-items: center; gap: .3rem; padding: .15rem .5rem; border-radius: 999px; font-size: .72rem; font-weight: 600; line-height: 1.4; }
.r3-srcchip--street { background: var(--r3-teal-wash); color: #0b5566; border: 1px solid #b7dde3; }
.r3-srcchip--news { background: #fff; color: var(--r3-navy); border: 1px dashed #7c8ea3; }
.r3-srcchip--police { background: var(--r3-navy); color: #fff; border: 1px solid var(--r3-navy); }
.r3-sourcekey { margin: -.6rem 0 0; font-size: .8rem; color: var(--r3-muted); }

.r3-multiples { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem .8rem; margin-top: .6rem; }
.r3-mini { margin: 0; }
.r3-mini figcaption { font-size: .82rem; font-weight: 600; color: var(--r3-navy); }
.r3-mini-box { position: relative; height: 90px; }
.r3-mini .r3-note { margin: .15rem 0 0; font-size: .75rem; line-height: 1.35; }
.r3-bars-box { position: relative; height: 220px; margin-top: .5rem; }

.r3-emergency { margin: .5rem 0 0; padding: .6rem .8rem; background: var(--r3-teal-wash); border-radius: 10px; font-size: .92rem; }

@media (min-width: 768px) {
  .r3-multiples { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .r3-mini-box { height: 110px; }
  .r3-hots { grid-template-columns: repeat(2, 1fr); }
  .r3-head h1 { font-size: 2.1rem; }
  .r3-links { grid-template-columns: repeat(3, 1fr); }
}