/* State Red Tape Index explorer (/red-tape-index/). Loaded only on that page. */

  /* The dashboard's own design tokens, mapped onto the site's (light and dark follow site.css). */
  :root {
    --color-fg: var(--ink);
    --color-fg-muted: var(--muted);
    --color-bg: var(--paper);
    --color-panel: var(--surface);
    --color-border-line: var(--rule);
    --font-sans: var(--font-body);
    --font-serif: var(--font-display);
    --cds-gap-xs: 4px;
    --cds-gap-sm: 8px;
    --cds-gap-md: 14px;
    --cds-gap-lg: 24px;
    --cds-gap-xl: 36px;
    --cds-pad-xs: 6px;
    --cds-pad-sm: 10px;
    --cds-pad-md: 14px;
    --cds-pad-lg: 20px;
    --cds-radius: 6px;
    --cds-font-size-caption: 0.8125rem;
    --cds-font-size-body: 0.9375rem;
    --cds-font-size-heading: var(--step-1);
    --cds-font-size-title: var(--step-2);
    --cds-font-weight-medium: 500;
    --cds-surface-popover: var(--surface);
    --cds-border: var(--rule);
    --cds-shadow-popover: 0 6px 20px rgba(15, 23, 42, 0.16);
    --cds-text-secondary: var(--muted);
    --cds-chart-reference: var(--muted);
    --cds-chart-muted: #9aa4b2;
    --cds-chart-status-critical: #c2410c;
    --cds-dur-slow: 300ms;
  }
  .rt-back { display: inline-block; margin-bottom: 1.25rem; font-size: 0.9375rem; }
  .rt-main .rt-title { font-size: var(--step-3); }
  .rt-main .cite-as { margin-top: 2.5rem; }
  .rt [hidden] { display: none !important; }

  /* Layout: header + toggles, four headline figures, tile map, three-column ranking, method notes. */
  .rt {
    --rt-neutral: color-mix(in oklab, var(--color-fg) 7%, var(--color-panel));
    --rt-hot: color-mix(in oklab, var(--color-fg) 9%, transparent);
    container-type: inline-size;
    display: grid;
    gap: var(--cds-gap-lg);
    max-width: 76rem;
    margin-inline: auto;
    font-family: var(--font-sans);
    color: var(--color-fg);
  }
  .rt-head { display: grid; gap: var(--cds-gap-xs); }
  .rt-title {
    margin: 0;
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--cds-font-size-title);
    line-height: 1.15;
    text-wrap: balance;
  }
  .rt-take { margin: 0; max-width: 68ch; color: var(--color-fg-muted); font-size: var(--cds-font-size-body); line-height: 1.5; }
  .rt-take b { color: var(--color-fg); }
  .rt-version { margin: 0; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); letter-spacing: 0.01em; }

  .rt-controls { display: flex; flex-wrap: wrap; gap: var(--cds-gap-md) var(--cds-gap-lg); align-items: end; }
  .rt-field { display: grid; gap: var(--cds-gap-xs); }
  .rt-field-label { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
  .rt-seg {
    display: inline-flex;
    border: 1px solid var(--color-border-line);
    border-radius: var(--cds-radius);
    background: var(--color-panel);
    overflow: hidden;
    flex-wrap: wrap;
    max-width: 100%;
  }
  .rt-opt {
    appearance: none;
    border: 0;
    margin: 0;
    background: transparent;
    color: var(--color-fg-muted);
    font: inherit;
    font-size: var(--cds-font-size-caption);
    padding: var(--cds-pad-xs) var(--cds-pad-md);
    cursor: pointer;
  }
  .rt-opt + .rt-opt { border-left: 1px solid var(--color-border-line); }
  @container (max-width: 26rem) { .rt-opt { padding-inline: var(--cds-pad-sm); } }
  .rt-opt:hover { color: var(--color-fg); }
  .rt-opt[aria-pressed="true"] { background: var(--color-fg); color: var(--color-bg); }
  .rt-opt:focus-visible { outline: 2px solid var(--color-fg); outline-offset: 2px; }

  .rt-kpis { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cds-gap-md); }
  @container (min-width: 26rem) { .rt-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @container (min-width: 54rem) { .rt-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .rt-kpi {
    display: grid;
    gap: var(--cds-gap-xs);
    align-content: start;
    background: var(--color-panel);
    border: 1px solid var(--color-border-line);
    border-radius: var(--cds-radius);
    padding: var(--cds-pad-md) var(--cds-pad-lg);
    min-width: 0;
  }
  .rt-kpi-label { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
  .rt-kpi-value {
    margin: 0;
    font-family: var(--font-serif);
    font-weight: 400;
    font-size: var(--cds-font-size-title);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
  }
  .rt-of { font-family: var(--font-sans); font-size: var(--cds-font-size-body); color: var(--color-fg-muted); }
  .rt-kpi-note { margin: 0; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); line-height: 1.45; }

  .rt-card {
    display: grid;
    gap: var(--cds-gap-md);
    background: var(--color-panel);
    border: 1px solid var(--color-border-line);
    border-radius: var(--cds-radius);
    padding: var(--cds-pad-lg);
    min-width: 0;
  }
  .rt-card-head { display: grid; gap: var(--cds-gap-xs); }
  .rt-card-title { margin: 0; font-size: var(--cds-font-size-heading); font-weight: var(--cds-font-weight-medium); }
  .rt-card-note { margin: 0; max-width: 72ch; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); line-height: 1.5; }

  .rt-map { position: relative; min-height: 20rem; }
  .rt-map svg { display: block; margin-inline: auto; overflow: visible; }
  .rt-tile { outline: none; cursor: default; }
  .rt-tile rect { stroke: transparent; stroke-width: 2; }
  .rt-tile.is-hot rect, .rt-tile:focus-visible rect { stroke: var(--color-fg); }
  .rt-legend { display: flex; flex-wrap: wrap; gap: var(--cds-gap-sm) var(--cds-gap-lg); align-items: center; justify-content: center; margin-top: var(--cds-gap-md); font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
  .rt-ramp { display: grid; gap: 4px; width: min(100%, 22rem); }
  .rt-ramp-bar { height: 0.625rem; border-radius: 3px; }
  .rt-ramp-ticks { display: flex; justify-content: space-between; font-variant-numeric: tabular-nums; }
  .rt-ramp-ticks span:nth-child(2) { color: var(--color-fg); }
  .rt-swatch { display: inline-flex; gap: var(--cds-gap-xs); align-items: center; }
  .rt-swatch i { display: inline-block; width: 0.875rem; height: 0.875rem; border-radius: 3px; border: 1px dashed var(--color-border-line); }

  .rt-tip {
    position: absolute;
    z-index: 3;
    pointer-events: none;
    min-width: 13rem;
    max-width: 17rem;
    background: var(--cds-surface-popover);
    border: 1px solid var(--cds-border);
    border-radius: var(--cds-radius);
    box-shadow: var(--cds-shadow-popover);
    padding: var(--cds-pad-xs) var(--cds-pad-sm);
    font-size: var(--cds-font-size-caption);
    color: var(--color-fg);
  }
  .rt-tip-name { color: var(--cds-text-secondary); margin-bottom: 4px; }
  .rt-tip-row { display: flex; justify-content: space-between; gap: var(--cds-gap-md); font-variant-numeric: tabular-nums; }
  .rt-tip-row span:first-child { color: var(--color-fg-muted); }
  .rt-tip-row.is-lead span:last-child { font-weight: 600; }

  .rt-rank { position: relative; min-height: 20rem; }
  .rt-rank-cols { column-width: 21rem; column-gap: var(--cds-gap-xl); }
  .rt-row {
    display: grid;
    grid-template-columns: 1.75rem minmax(0, 8.5rem) minmax(2.5rem, 1fr) 6.25rem;
    gap: var(--cds-gap-sm);
    align-items: center;
    break-inside: avoid;
    padding: 3px 4px;
    border-radius: 3px;
    font-size: var(--cds-font-size-caption);
  }
  .rt-row.is-hot { background: var(--rt-hot); }
  .rt-rk { color: var(--color-fg-muted); text-align: right; font-variant-numeric: tabular-nums; }
  .rt-nm { line-height: 1.25; }
  .rt-track { position: relative; height: 0.7rem; }
  .rt-bar { position: absolute; inset: 0 auto 0 0; border-radius: 2px; }
  .rt-ref { position: absolute; top: -4px; bottom: -4px; width: 0; border-left: 1px dashed var(--cds-chart-reference); }
  .rt-val { display: flex; justify-content: flex-end; gap: var(--cds-gap-sm); font-variant-numeric: tabular-nums; white-space: nowrap; }
  .rt-v2 { color: var(--color-fg-muted); min-width: 3.25rem; text-align: right; }

  .rt-fail { display: flex; align-items: center; justify-content: center; gap: var(--cds-gap-sm); min-height: inherit; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
  .rt-fail i { width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--color-bad); }

  .rt-method dl { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--cds-gap-md) var(--cds-gap-xl); margin: 0; }
  @container (min-width: 44rem) { .rt-method dl { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  .rt-method dt { font-size: var(--cds-font-size-body); font-weight: var(--cds-font-weight-medium); margin-bottom: 2px; }
  .rt-method dd { margin: 0; max-width: 62ch; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); line-height: 1.55; }
  .rt-method a { color: inherit; }
  .rt-method a:focus-visible { outline: 2px solid var(--color-fg); outline-offset: 2px; }

  @container (max-width: 25rem) {
    .rt-row { grid-template-columns: 1.5rem minmax(0, 6.5rem) minmax(2rem, 1fr) 5.75rem; }
  }
  .rt [data-dash-source-state=empty] { color: transparent; }
  .rt [data-dash-source-state=refreshing] { opacity: .5; transition: opacity var(--cds-dur-slow); }