/**
 * TexasInData data display.
 *
 * Styled after printed statistical abstracts: ruled tables rather than cards,
 * square marks, thin rules, no decorative chrome. Every view is stacked on the
 * page and numbered, the way figures appear in a report.
 */

/* The masthead sits outside the figure element, so it needs the palette too. */
.txd,
.txd-masthead {
    --txd-blue: var(--tx-blue, #002868);
    --txd-red: var(--tx-red, #BF0A30);
    --txd-ink: #1A1A1A;
    --txd-soft: #4A4A4A;
    --txd-mute: #767676;
    --txd-rule: #C9C9C9;
    --txd-hair: #E6E6E6;
    --txd-zebra: #FAFAFA;
}

.txd {
    margin: 2.25rem 0;
    padding: 0;
    background: none;
    border: 0;
    font-size: 15px;
    color: var(--txd-ink);
}

/* ----------------------------------------------------------------- masthead */

/* Title plus one byline. The story sits under this, not inside it. */
.txd-masthead {
    margin: 1.1rem 0 .85rem;
    padding: 0 0 .7rem;
    border-bottom: 1px solid var(--txd-ink);
    color: var(--txd-ink);
}
.txd-masthead-byline {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .2rem .75rem;
    margin: 0 0 .65rem;
    font-size: .78rem;
    line-height: 1.4;
    color: var(--txd-mute);
}
.txd-masthead .ipm-breadcrumb {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: inherit;
}
.txd-masthead .ipm-breadcrumb a { color: var(--txd-mute); }
.txd-masthead .ipm-breadcrumb a:hover { color: var(--txd-blue); }
.txd-masthead-facts { font-variant-numeric: tabular-nums; }
.txd-masthead-src,
.txd-masthead-dl a {
    color: var(--txd-blue);
    text-decoration: none;
}
.txd-masthead-src:hover,
.txd-masthead-dl a:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.txd-masthead-dl { color: var(--txd-mute); }

.txd-masthead-title {
    margin: 0 !important;
    font-size: clamp(1.7rem, 3.6vw, 2.2rem) !important;
    line-height: 1.15;
    letter-spacing: -0.022em;
    font-weight: 800;
    color: var(--txd-ink);
}

.txd-masthead-stand {
    margin: 0 0 1rem;
    max-width: none;
    font-size: 1.04rem;
    line-height: 1.55;
    color: var(--txd-soft);
}

/* Opening copy: one paragraph, full width. */
.txd-lede {
    margin: .85rem 0 1.35rem;
    max-width: none;
    width: 100%;
}
.txd-lede p {
    margin: 0;
    font-size: 1.05rem;
    line-height: 1.65;
    font-weight: 400;
    color: var(--txd-ink);
}

@media (max-width: 640px) {
    .txd-masthead { margin: .85rem 0 .7rem; }
}

/* ------------------------------------------------------------------ heading */

/* Shown when a figure is embedded on its own, away from the masthead. Same
   ruled language, one step down in scale. */
.txd-head {
    margin: 0 0 1.25rem;
    padding: 0 0 .65rem;
    border-bottom: 3px double var(--txd-ink);
}
.txd-title {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.28;
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--txd-ink);
}
.txd-sub {
    margin: .3rem 0 0;
    font-size: .88rem;
    color: var(--txd-soft);
    line-height: 1.45;
}

/* -------------------------------------------------------------------- views */

.txd-view {
    margin: 0 0 3.25rem;
    padding: 0;
}
.txd-view--kpi { margin-bottom: 2rem; }
.txd-view:last-of-type { margin-bottom: 1rem; }
.txd-view.is-summary {
    margin-top: .15rem;
    margin-bottom: 1.75rem;
}
.txd-view.is-summary + .txd-lede {
    margin-top: 0;
}

/* A navy slab, so the heading is a labelled block rather than a line of
   bold type sitting on white. Theme heading colours are overridden on
   purpose: this band is the figure's nameplate. */
.txd-view-head {
    margin: 0 0 1.25rem;
    padding: .85rem 1.1rem .95rem;
    background: var(--txd-blue);
    color: #fff;
    border: 0;
    border-left: 6px solid var(--txd-red);
}
.txd-num {
    display: inline-block;
    margin: 0 0 .5rem;
    padding: .3rem .6rem .26rem;
    background: var(--txd-red);
    color: #fff;
    font-size: .7rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .15em;
    text-transform: uppercase;
}
.txd-view-title {
    margin: 0 !important;
    padding: 0;
    font-size: clamp(1.35rem, 2.5vw, 1.6rem) !important;
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -0.022em;
    color: #fff !important;
}
.txd-view-meta {
    margin: .4rem 0 0;
    font-size: .84rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, .78);
}

/* -------------------------------------------------------------------- table */

.txd-tools {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin: 0 0 .5rem;
}
.txd-search input[type="search"] {
    width: 240px;
    max-width: 100%;
    padding: .32rem .5rem;
    font-size: .85rem;
    font-family: inherit;
    border: 1px solid var(--txd-rule);
    border-radius: 0;
    background: #fff;
    color: var(--txd-ink);
}
.txd-search input:focus { outline: 2px solid var(--txd-blue); outline-offset: -1px; }
.txd .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.txd-count { font-size: .78rem; color: var(--txd-mute); white-space: nowrap; }

.txd-figure { margin: 0; }
.txd-table-caption {
    caption-side: top;
    text-align: left;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.3;
    padding: 0 0 .55rem;
    color: var(--txd-ink);
}

.txd-table-wrap { overflow-x: auto; }

/* Ruled like a printed table: heavy rules top and bottom, a hairline under the
   head, and no vertical lines at all. */
.txd-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
    margin: 0;
    border-top: 2px solid var(--txd-ink);
    border-bottom: 2px solid var(--txd-ink);
}
/* The table's summary sits above it, so the spacing flips. */
.txd-caption--above { margin: 0 0 .9rem; }
.txd-table th,
.txd-table td {
    padding: .38rem .7rem;
    border: 0;
    text-align: left;
    vertical-align: baseline;
    line-height: 1.4;
}
.txd-table thead th {
    border-bottom: 1px solid var(--txd-ink);
    background: #fff;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .01em;
    color: var(--txd-ink);
    white-space: nowrap;
    vertical-align: bottom;
    position: sticky;
    top: 0;
    z-index: 1;
}
.txd-table tbody tr:nth-child(even) { background: var(--txd-zebra); }
.txd-table tbody tr:hover { background: #F0F4FA; }
.txd-table tbody th[scope="row"] { font-weight: 400; }

.txd-table .is-right { text-align: right; font-variant-numeric: tabular-nums; }
.txd-table .is-center { text-align: center; }
.txd-table .is-left { text-align: left; }

.txd-table tfoot th,
.txd-table tfoot td {
    border-top: 1px solid var(--txd-ink);
    background: #fff;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.txd-unit { font-weight: 400; color: var(--txd-mute); }

.txd-sort {
    appearance: none;
    background: none;
    border: 0;
    padding: 0;
    margin: 0;
    font: inherit;
    font-weight: 700;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .28rem;
}
.txd-sort:hover { color: var(--txd-blue); }
.txd-arrow {
    width: 0;
    height: 0;
    border-left: 3.5px solid transparent;
    border-right: 3.5px solid transparent;
    border-top: 4.5px solid currentColor;
    opacity: .3;
}
th[aria-sort="ascending"] .txd-arrow { opacity: 1; transform: rotate(180deg); }
th[aria-sort="descending"] .txd-arrow { opacity: 1; }
th[aria-sort="ascending"] .txd-sort,
th[aria-sort="descending"] .txd-sort { color: var(--txd-blue); }

.txd-note {
    display: inline;
    margin-left: .2rem;
    color: var(--txd-red);
    font-size: .7rem;
    vertical-align: super;
    cursor: help;
    font-weight: 400;
}

.txd-pager {
    display: flex;
    gap: .25rem;
    flex-wrap: wrap;
    align-items: center;
    margin-top: .6rem;
}
.txd-pager button {
    appearance: none;
    border: 1px solid var(--txd-rule);
    background: #fff;
    color: var(--txd-soft);
    border-radius: 0;
    padding: .22rem .5rem;
    font: inherit;
    font-size: .8rem;
    cursor: pointer;
}
.txd-pager button.is-active { background: var(--txd-blue); border-color: var(--txd-blue); color: #fff; font-weight: 700; }
.txd-pager button:disabled { opacity: .4; cursor: default; }

/* ------------------------------------------------------- zoom / fullscreen */

.txd-stage { margin: 0; }
.txd-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .45rem 1.2rem;
    margin: 0 0 .7rem;
}
.txd-filter {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .45rem .7rem;
    flex: 1 1 16rem;
    min-width: min(100%, 16rem);
}
.txd-filter .txd-search input[type="search"] {
    width: min(100%, 22rem);
}
.txd-filter-empty {
    font-size: .8rem;
    color: var(--txd-mute);
}
.txd-chart.is-filtering .txd-mark.is-miss,
.txd-chart.is-filtering .txd-cat.is-miss {
    opacity: .14;
}
.txd-chart.is-filtering .txd-mark.is-match {
    opacity: 1;
}
.txd-zoombar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem .45rem;
    margin: 0;
}
.txd-zoombar-label {
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
    font-size: .64rem;
    color: var(--txd-mute);
    margin-right: .15rem;
}
.txd-zoom-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    padding: .28rem .55rem;
    border: 1px solid var(--txd-rule);
    background: #fff;
    color: var(--txd-ink);
    font: inherit;
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
}
.txd-zoom-btn:hover { border-color: var(--txd-blue); color: var(--txd-blue); }
.txd-zoom-btn:disabled { opacity: .4; cursor: default; }
.txd-zoom-pct {
    min-width: 3.2em;
    text-align: center;
    font-size: .78rem;
    font-variant-numeric: tabular-nums;
    color: var(--txd-soft);
}
.txd-zoom-fs { margin-left: .25rem; }
.txd-zoom-pan-hint {
    font-size: .72rem;
    color: var(--txd-mute);
    margin-left: .2rem;
}
.txd-viewport { overflow: visible; }
.txd-zoom-inner { width: 100%; transform-origin: top left; }
.txd-viewport.is-pannable {
    cursor: grab;
    touch-action: pan-x pan-y;
}
.txd-viewport.is-panning,
.txd-viewport.is-panning * {
    cursor: grabbing;
    user-select: none;
}

/* Only clip into a pane once the reader has zoomed or gone full screen —
   at 100% the figure still shows in full, nothing cropped. */
.txd-view.is-zoomed .txd-viewport,
.txd-view.is-fs .txd-viewport {
    max-height: min(75vh, 56rem);
    overflow: auto;
    border: 1px solid var(--txd-hair);
    background: #fff;
}

.txd-view:fullscreen,
.txd-view:-webkit-full-screen,
.txd-view.is-fs-fallback {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1.25rem 1.6rem 1.6rem;
    background: #fff;
    overflow: auto;
}
.txd-view:fullscreen .txd-view-head,
.txd-view:-webkit-full-screen .txd-view-head,
.txd-view.is-fs-fallback .txd-view-head {
    position: sticky;
    top: 0;
    z-index: 3;
}
.txd-view:fullscreen .txd-zoombar,
.txd-view:-webkit-full-screen .txd-zoombar,
.txd-view.is-fs-fallback .txd-zoombar {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: .45rem 0;
    background: #fff;
}
.txd-view:fullscreen .txd-viewport,
.txd-view:-webkit-full-screen .txd-viewport,
.txd-view.is-fs-fallback .txd-viewport {
    max-height: calc(100vh - 11rem);
    overflow: auto;
    border: 1px solid var(--txd-hair);
}
body.txd-fs-lock { overflow: hidden; }

/* -------------------------------------------------------------------- chart */

.txd-chart { position: relative; }
.txd-svg { display: block; width: 100%; height: auto; overflow: visible; }
.txd-svg.is-packed { overflow: hidden; }
.txd-row.is-miss { display: none !important; }
.txd-svg text { font-family: inherit; }
.txd-mark { transition: opacity .1s; }
.txd-chart.is-hovering .txd-mark { opacity: .5; }
.txd-chart.is-hovering .txd-mark.is-hot { opacity: 1; }
.txd-map .txd-county { vector-effect: non-scaling-stroke; }
.txd-chart.is-hovering .txd-map .txd-county { opacity: .72; }
.txd-chart.is-hovering .txd-map .txd-county.is-hot {
    opacity: 1;
    stroke: #1A1A1A;
    stroke-width: 1.6;
}
.txd-chart.is-filtering .txd-map .txd-county.is-match {
    stroke: #002868;
    stroke-width: 1.6;
}
.txd-chart.is-filtering .txd-map .txd-county.is-miss,
.txd-chart.is-filtering.is-hovering .txd-map .txd-county.is-miss,
.txd-chart.is-filtering .txd-map .txd-county.is-miss.is-hot,
.txd-chart.is-filtering .txd-map .txd-county.is-miss.is-pinned {
    opacity: 0.1;
    pointer-events: none;
    stroke: #fff;
    stroke-width: 0.7;
}
.txd-chart.is-filtering .txd-map .txd-county.is-match,
.txd-chart.is-filtering.is-hovering .txd-map .txd-county.is-match,
.txd-chart.is-filtering .txd-map .txd-county.is-match.is-hot,
.txd-chart.is-filtering .txd-map .txd-county.is-match.is-pinned {
    opacity: 1;
}

/* The written summary under a figure. Set as a note block that runs the full
   width of the figure, so the prose is not narrower than the chart it explains. */
.txd-caption {
    display: block;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    margin: .9rem 0 0;
    padding: .7rem .95rem .8rem;
    border: 1px solid var(--txd-hair);
    border-top: 2px solid var(--txd-ink);
    background: #FCFCFC;
    text-align: left;
}
.txd-caption-label {
    display: block;
    margin: 0 0 .3rem;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--txd-red);
}
.txd-caption p {
    display: block;
    margin: 0;
    max-width: none;
    font-size: .875rem;
    line-height: 1.68;
    color: var(--txd-soft);
}

.txd-tip {
    position: absolute;
    z-index: 20;
    pointer-events: none;
    background: var(--txd-ink);
    color: #fff;
    font-size: .76rem;
    line-height: 1.3;
    padding: .28rem .45rem;
    border-radius: 0;
    white-space: nowrap;
    transform: translate(-50%, -128%);
    opacity: 0;
    transition: opacity .1s;
}
.txd-tip.is-on { opacity: 1; }
.txd-tip.is-card {
    white-space: normal;
    min-width: 13.5rem;
    max-width: min(20rem, calc(100% - 1rem));
    padding: .55rem .7rem .6rem;
    background: #fff;
    color: var(--txd-ink);
    border: 1px solid var(--txd-ink);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .16);
    transform: translate(-50%, calc(-100% - 14px));
}
.txd-tip.is-card.is-below {
    transform: translate(-50%, 14px);
}
.txd-tip-name {
    display: block;
    margin: 0 0 .4rem;
    padding-bottom: .35rem;
    border-bottom: 1px solid var(--txd-hair);
    font-size: .9rem;
    font-weight: 800;
    letter-spacing: -0.015em;
    color: var(--txd-red);
}
.txd-tip-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: .85rem;
    font-size: .78rem;
    line-height: 1.45;
}
.txd-tip-row span { color: var(--txd-soft); }
.txd-tip-row b {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    text-align: right;
}
.txd-tip-empty {
    font-size: .78rem;
    color: var(--txd-mute);
}
.txd-map .txd-county { cursor: pointer; }
.txd-chart.is-hovering .txd-map .txd-county.is-pinned,
.txd-map .txd-county.is-pinned {
    opacity: 1;
    stroke: #002868;
    stroke-width: 2;
}
.txd-map-wrap { position: relative; }
.txd-map-names {
    margin: 0 0 .65rem;
    border: 1px solid var(--txd-ink);
    background: #fff;
}
.txd-map-names > summary {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    padding: .45rem .7rem;
    cursor: pointer;
    list-style: none;
    font-size: .82rem;
}
.txd-map-names > summary::-webkit-details-marker { display: none; }
.txd-map-names-kicker {
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--txd-mute);
}
.txd-map-names-current {
    font-weight: 800;
    color: var(--txd-red);
}
.txd-map-names[open] > summary {
    border-bottom: 1px solid var(--txd-hair);
}
.txd-map-names-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr));
    gap: 0;
    max-height: 14rem;
    overflow: auto;
}
.txd-map-name {
    display: block;
    width: 100%;
    padding: .38rem .65rem;
    border: 0;
    background: transparent;
    color: var(--txd-ink);
    font: inherit;
    font-size: .8rem;
    text-align: left;
    cursor: pointer;
}
.txd-map-name:hover,
.txd-map-name:focus-visible {
    background: #f6f6f6;
    color: var(--txd-red);
}
.txd-map-name.is-on {
    background: var(--txd-red);
    color: #fff;
    font-weight: 700;
}

/* --------------------------------------------------------------------- KPIs */

/* A lead-in, not a numbered exhibit: no navy slab, no red tab. */
.txd-kpi-head {
    margin: 0 0 .85rem;
    padding: 0;
    border: 0;
    background: none;
}
.txd-kpi-title {
    margin: 0 !important;
    padding: 0;
    font-size: 1.2rem !important;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.015em;
    color: var(--txd-ink) !important;
}

.txd-kpis {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
    gap: .75rem;
    width: 100%;
    border: 0;
}
.txd-kpi {
    padding: 1rem 1.05rem 1.1rem;
    background: #F4F6FA;
    border: 0;
    border-top: 4px solid var(--txd-kpi, var(--txd-blue));
}
.txd-kpi b {
    display: block;
    font-size: clamp(1.7rem, 3vw, 2.15rem);
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -0.03em;
    color: var(--txd-kpi, var(--txd-blue));
    font-variant-numeric: tabular-nums;
}
.txd-kpi span {
    display: block;
    margin-top: .4rem;
    font-size: .92rem;
    font-weight: 600;
    color: var(--txd-ink);
    line-height: 1.35;
}
.txd-kpi i {
    display: block;
    margin-top: .15rem;
    font-style: normal;
    font-size: .8rem;
    color: var(--txd-mute);
    line-height: 1.4;
}

/* ------------------------------------------------- downloads and data notes */

/* Sits above the figures. Squared buttons, in keeping with the ruled style. */
.txd-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem .8rem;
    margin: 0 0 1rem;
    padding: 0 0 .9rem;
    border-bottom: 1px solid var(--txd-hair);
}
.txd-actions-label {
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
    font-size: .67rem;
    color: var(--txd-mute);
}
.txd-actions-set { display: flex; flex-wrap: wrap; gap: .45rem; }

.txd-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .75rem;
    border: 1px solid var(--txd-rule);
    border-radius: 0;
    background: #fff;
    color: var(--txd-ink);
    font-size: .8rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    letter-spacing: .01em;
    transition: background .12s, border-color .12s, color .12s;
}
.txd-btn:hover,
.txd-btn:focus-visible {
    background: var(--txd-blue);
    border-color: var(--txd-blue);
    color: #fff;
}
.txd-btn-i { width: 15px; height: 15px; flex: none; }

/* Caveats that qualify the numbers, after the figures. */
.txd-about {
    margin: 2rem 0 0;
    padding: .7rem .95rem .75rem;
    border: 1px solid var(--txd-hair);
    border-left: 3px solid var(--txd-rule);
    background: #FCFCFC;
}
.txd-about-label {
    display: block;
    margin: 0 0 .3rem;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--txd-mute);
}
.txd-about ul {
    margin: 0;
    padding-left: 1.1rem;
    font-size: .8rem;
    line-height: 1.6;
    color: var(--txd-soft);
}
.txd-about li { margin: .15rem 0; }

/* Shortcuts: one line, not a chip grid. */
.txd-toc {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .25rem .15rem;
    margin: 0 0 1.35rem;
    padding: .45rem 0;
    border-bottom: 1px solid var(--txd-hair);
    font-size: .84rem;
    line-height: 1.45;
}
.txd-toc-label {
    margin-right: .55rem;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--txd-mute);
}
.txd-toc a {
    color: var(--txd-blue);
    font-weight: 600;
    text-decoration: none;
}
.txd-toc a:hover,
.txd-toc a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.txd-toc-dot {
    margin: 0 .45rem;
    color: var(--txd-rule);
    font-weight: 400;
}
.txd-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.txd-view,
.txd-refs { scroll-margin-top: 6.5rem; }

/* Census tables and the source, after the figures. */
.txd-refs {
    margin: 2.4rem 0 0;
    padding: 1rem 0 0;
    border-top: 3px double var(--txd-ink);
}
.txd-refs-label {
    display: block;
    margin: 0 0 .45rem;
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--txd-mute);
}
.txd-refs-src {
    margin: 0 0 .55rem;
    font-size: .85rem;
    color: var(--txd-ink);
    line-height: 1.45;
}
.txd-refs-src span { color: var(--txd-mute); }
.txd-refs-list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.txd-refs-list li { margin: .25rem 0; }
.txd-refs-list a {
    color: var(--txd-blue);
    text-decoration: underline;
    text-underline-offset: 2px;
    font-size: .85rem;
}
.txd-refs-list a:hover { color: var(--txd-red); }

/* Image of each figure, at the bottom, with its own downloads. */
.txd-pack {
    margin: 2.6rem 0 0;
    padding: 1.2rem 0 0;
    border-top: 3px solid var(--txd-ink);
    scroll-margin-top: 6.5rem;
}
.txd-pack-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    margin: 0 0 1rem;
}
.txd-pack-title {
    margin: 0 !important;
    font-size: 1.2rem !important;
    font-weight: 800;
    color: var(--txd-ink) !important;
}
.txd-pack-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1rem;
}
.txd-pack-card {
    padding: .75rem .8rem .85rem;
    background: #F4F6FA;
    border-top: 3px solid var(--txd-blue);
}
.txd-pack-kicker {
    margin: 0 0 .2rem;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--txd-red);
}
.txd-pack-name {
    margin: 0 0 .65rem !important;
    font-size: .95rem !important;
    font-weight: 700;
    line-height: 1.3;
    color: var(--txd-ink) !important;
}
.txd-pack-shot {
    display: block;
    max-height: 22rem;
    overflow: auto;
    margin: 0 0 .7rem;
    background: #fff;
    border: 1px solid var(--txd-hair);
}
.txd-pack-shot img {
    display: block;
    width: 100%;
    height: auto;
}
.txd-pack-dl .txd-view-dl { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.txd-view-dl { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.txd-view-dl a { text-decoration: none; }

/* Fixed bottom-right; hidden until the page has been scrolled. */
.txd-top {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .05rem;
    width: 3.1rem;
    height: 3.1rem;
    padding: 0;
    border: 0;
    background: var(--txd-blue, #002868);
    color: #fff;
    font: inherit;
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity .18s ease, transform .18s ease;
}
.txd-top.is-on {
    opacity: 1;
    pointer-events: auto;
    transform: none;
}
.txd-top:hover,
.txd-top:focus-visible {
    background: var(--txd-red, #BF0A30);
    outline: none;
}
.txd-top-txt {
    font-size: .55rem;
    letter-spacing: .12em;
    text-transform: uppercase;
}
body.txd-fs-lock .txd-top { display: none; }

/* ------------------------------------------------------------------- errors */

.txd-error {
    margin: 1.5rem 0;
    padding: .8rem 1rem;
    border: 1px solid var(--txd-red);
    border-radius: 0;
    background: #FDF6F7;
    color: #6B1020;
    font-size: .86rem;
}
.txd-error ul { margin: .4rem 0 .4rem 1.1rem; }
.txd-error p { margin: 0; font-size: .76rem; opacity: .75; }

/* ------------------------------------------------------------- small screens */

@media (max-width: 640px) {
    .txd { font-size: 14px; }
    .txd-tools { flex-direction: column; align-items: stretch; gap: .4rem; }
    .txd-search input[type="search"] { width: 100%; }
    .txd-table th, .txd-table td { padding: .34rem .5rem; }
    .txd-view { margin-bottom: 2.5rem; }
    .txd-view-head { padding: .75rem .85rem .8rem; }
    .txd-view-title { font-size: 1.22rem !important; }
    .txd-kpis { grid-template-columns: 1fr 1fr; }
}

@media print {
    .txd-tools, .txd-filter, .txd-actions, .txd-pager, .txd-zoombar, .txd-toc, .txd-top { display: none; }
    .txd-view { break-inside: avoid; }
    .txd-view-head {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    .txd-table thead th { position: static; }
}