/* Interactive charts (map, rank-over-time) on /data pages and their embed frames: the control
   row (find, measure switch, pinning chips), the tooltip and the hover states that
   js/v3/data-chart-ix.js drives. Self-contained colours (the embed frame has no site tokens).
   The control row is server-rendered and only shown once html.ujd-js is set (inline script
   before the figure), so nothing moves when the script arrives and no-JS readers never see
   dead controls. Printing keeps the static chart only. */
.ujd-ix { display: none; }
.ujd-js .ujd-ix { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 14px; font: 400 13px/1.35 Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: #374151; }
.ujd-ix__find { display: flex; align-items: center; gap: 8px; flex: 1 1 220px; max-width: 340px; }
.ujd-ix__find label { font-weight: 600; color: #0B0F19; white-space: nowrap; }
.ujd-ix__find input { flex: 1 1 auto; min-width: 0; height: 34px; padding: 0 10px; border: 1px solid #D1D5DB; border-radius: 6px; background: #fff;
  font: inherit; color: #0B0F19; }
.ujd-ix__find input:focus { outline: 2px solid #0B0F19; outline-offset: 1px; border-color: #0B0F19; }
.ujd-ix__group { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.ujd-ix__btn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border: 1px solid #D1D5DB; border-radius: 999px;
  background: #fff; color: #374151; font: 500 12.5px/1 Inter, system-ui, sans-serif; cursor: pointer; }
.ujd-ix__btn:hover { border-color: #9CA3AF; color: #0B0F19; }
.ujd-ix__btn:focus-visible { outline: 2px solid #0B0F19; outline-offset: 2px; }
.ujd-ix__btn[aria-pressed="true"] { background: #0B0F19; border-color: #0B0F19; color: #fff; }
.ujd-ix__sw { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.ujd-ix__clear { background: none; border: 0; padding: 0 4px; color: #9A3412; font: 500 12.5px/1 Inter, system-ui, sans-serif; text-decoration: underline;
  text-underline-offset: 3px; cursor: pointer; }
.ujd-ix__out { flex: 1 0 100%; min-height: 18px; margin: 0; font-size: 12.5px; color: #4B5563; }

/* Tooltip (shared look with data-chart.js bar tips) */
.ujd-tip--ix { position: absolute; z-index: 30; pointer-events: none; background: #0B0F19; color: #fff; font: 400 13px/1.4 Inter, system-ui, sans-serif;
  padding: 9px 12px; border-radius: 6px; box-shadow: 0 8px 22px rgba(0,0,0,.22); max-width: 280px; }
.ujd-tip--ix strong { display: block; font-weight: 600; margin-bottom: 2px; }
.ujd-tip__val { display: flex; align-items: center; gap: 7px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ujd-tip__sw { width: 10px; height: 10px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,.35); }
.ujd-tip__muted { display: block; color: #CBD5E1; font-size: 12px; }
.ujd-tip__grid { display: grid; gap: 1px; margin-top: 4px; font-variant-numeric: tabular-nums; }
.ujd-tip__row { display: grid; grid-template-columns: auto 3.2em auto; gap: 10px; align-items: baseline; }
.ujd-tip__row .ujd-tip__muted { display: inline; }
.ujd-tip__row.is-at { color: #FB923C; font-weight: 600; }

/* Map */
.is-ix .ujc-region, .is-ix .ujc-point { cursor: pointer; }
.is-ix .ujc-region:focus { outline: none; }
.is-ix .ujc-ring { stroke: #0B0F19; }
.is-ix .ujc-region--nodata { cursor: default; }

/* Rank over time: hover or pin one line, dim the rest */
.is-ix .ujc-entity { cursor: pointer; }
.is-ix.is-focusing .ujc-entity { opacity: .16; }
.is-ix.is-focusing .ujc-entity.is-hot { opacity: 1; }
.is-ix .ujc-entity.is-hot:not(.is-hl) .ujc-line { stroke: #374151; stroke-width: 2.5px; }
.is-ix .ujc-entity.is-hot:not(.is-hl) .ujc-dot { fill: #374151; }
.is-ix .ujc-entity.is-hot:not(.is-hl) .ujc-end:not(.ujc-end--rank) { fill: #0B0F19; font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
  .is-ix .ujc-entity { transition: opacity .18s ease; }
  .is-ix .ujc-region { transition: fill .2s ease; }
}

@media print {
  .ujd-js .ujd-ix, .ujd-tip--ix { display: none !important; }
}