/* Generic dataset pages (/data/{scope}, /data/{scope}/{dataset}) and the stock page's Company
   panel (contract fmp-datasets-v1 §9). Colours come only from site.css's own tokens (--panel,
   --panel-2, --border-color, --muted, --body-color, --accent, --unavailable, --warning,
   --focus-ring), which are defined for both themes; Bootstrap's --bs-* colour variables are not
   defined on this site and would silently drop a declaration. */

.dataset-shell {
    display: grid;
    gap: 1rem;
    max-width: 1400px;
    margin: 0 auto;
    min-width: 0;
}
.dataset-shell [hidden],
.company-ref [hidden] {
    display: none !important;
}
/* Secondary copy (descriptions, input captions, counts, attribution). The site's own muted token
   keeps readable contrast in both themes, where Bootstrap's .text-secondary measured below 4.5:1. */
.dataset-muted {
    color: var(--muted);
}
.dataset-trail .breadcrumb {
    flex-wrap: wrap;
}
.dataset-header {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    min-width: 0;
}
.dataset-header > div {
    min-width: 0;
}
.dataset-header h1,
.dataset-header p {
    overflow-wrap: anywhere;
}
.dataset-header-icon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: .6rem;
    border: 1px solid var(--border-color);
    background: var(--panel-2);
    color: var(--accent);
    font-size: 1.15rem;
}

/* Notes and disclosures: shown before the data, never collapsed. */
.dataset-notes {
    border: 1px solid var(--border-color);
    border-left: 3px solid var(--accent);
    border-radius: .5rem;
    background: var(--panel);
    padding: .6rem .8rem;
}
.dataset-note-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: .35rem;
    font-size: .875rem;
}
.dataset-note-list li {
    display: flex;
    gap: .45rem;
    align-items: baseline;
}
.dataset-note-list i {
    color: var(--accent);
}

/* Filters */
.dataset-filters {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    align-items: flex-end;
    padding: .75rem;
    border: 1px solid var(--border-color);
    border-radius: .5rem;
    background: var(--panel);
    min-width: 0;
}
.dataset-filter {
    min-width: 0;
}
.dataset-filter input {
    width: 12rem;
    max-width: 100%;
}
.dataset-filter select {
    width: 14rem;
    max-width: 100%;
}
.dataset-filter-range {
    border: 0;
    margin: 0;
    padding: 0;
    min-width: 0;
}
.dataset-filter-range legend {
    float: none;
    width: auto;
    margin-bottom: .25rem;
}
.dataset-range-inputs {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.dataset-range-inputs label {
    display: block;
}
.dataset-filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.dataset-filter-error {
    flex-basis: 100%;
    margin: 0;
    color: var(--loss);
}

/* Freshness stamp and attribution */
.dataset-stamp {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1.25rem;
    margin: 0;
    font-size: .8rem;
    color: var(--muted);
}
.dataset-stamp-item {
    display: flex;
    gap: .35rem;
}
.dataset-stamp dt {
    font-weight: 600;
}
.dataset-stamp dd {
    margin: 0;
    color: var(--body-color);
}
.dataset-attribution {
    margin: 0;
}

/* Status cards: one per state, each with its own icon and copy. */
.dataset-status-card {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding: 1rem;
    border: 1px solid var(--border-color);
    border-radius: .5rem;
    background: var(--panel);
    color: var(--body-color);
}
.dataset-status-card > i {
    font-size: 1.25rem;
    line-height: 1.2;
    color: var(--muted);
}
.dataset-status-card[data-status="error"] > i,
.dataset-status-card[data-status="invalid"] > i {
    color: var(--warning);
}
.dataset-status-card[data-status="licence-pending"] > i,
.dataset-status-card[data-status="sign-in-required"] > i {
    color: var(--accent);
}
.dataset-status-title {
    display: block;
    margin-bottom: .15rem;
}
/* plan-required (§16.4): the shared upgrade notice sits inside the card instead of above it. */
.dataset-status-card[data-status="plan-required"] > i {
    color: var(--accent);
}
.dataset-status-card > div {
    min-width: 0;
}
.dataset-plan-prompt .alert {
    margin: .4rem 0 0;
    padding: .5rem .75rem;
    font-size: .875rem;
    overflow-wrap: anywhere;
}

/* Table (wider than a phone) */
.dataset-results {
    min-width: 0;
}
.dataset-table-wrap {
    border: 1px solid var(--border-color);
    border-radius: .5rem;
    background: var(--panel);
}
.dataset-table {
    margin: 0;
    font-size: .85rem;
    color: var(--body-color);
}
.dataset-table thead th {
    background: var(--panel-2);
    color: var(--body-color);
    font-weight: 600;
    white-space: nowrap;
    vertical-align: bottom;
}
.dataset-table td {
    vertical-align: top;
    overflow-wrap: anywhere;
    min-width: 5rem;
}
.dataset-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.dataset-when {
    white-space: nowrap;
}
/* A right-aligned figure must not run into the left-aligned column after it. */
.dataset-table .dataset-num,
.company-ref-table .dataset-num {
    padding-right: 1rem;
}
.dataset-sort {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    font-weight: 600;
    /* A button does not inherit these by default; the header row styles them for its cells. */
    text-transform: inherit;
    letter-spacing: inherit;
    white-space: nowrap;
}
.dataset-sort.is-active {
    color: var(--accent);
}
.dataset-sort:focus-visible,
.dataset-index-card:focus-visible {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
    border-radius: .25rem;
}
.dataset-symbol {
    font-weight: 600;
    white-space: nowrap;
}
.dataset-venue {
    display: inline-block;
    padding: 0 .3rem;
    border: 1px solid var(--border-color);
    border-radius: .25rem;
    font-size: .7rem;
    color: var(--muted);
    vertical-align: middle;
}
.dataset-missing {
    color: var(--unavailable);
}
/* Provider text shown exactly as printed (an article's tickers). A code element only so the
   site's suffix-stripping display pass skips it; it reads like the cells around it. */
.dataset-verbatim {
    font: inherit;
    color: inherit;
    background: none;
    padding: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}
.dataset-link {
    white-space: nowrap;
}
.dataset-detail-col {
    width: 1%;
    white-space: nowrap;
}

/* Cards (a phone): primary columns first, every field kept. */
.dataset-cards {
    display: none;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: .75rem;
}
.dataset-card {
    padding: .75rem;
    border: 1px solid var(--border-color);
    border-radius: .5rem;
    background: var(--panel);
    color: var(--body-color);
    min-width: 0;
}
.dataset-card-fields {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    gap: .3rem .75rem;
    margin: 0;
}
.dataset-card-field {
    display: contents;
}
.dataset-card-field dt {
    font-size: .75rem;
    font-weight: 600;
    color: var(--muted);
    overflow-wrap: anywhere;
}
.dataset-card-field dd {
    margin: 0;
    font-size: .85rem;
    overflow-wrap: anywhere;
}
.dataset-card-field.is-primary dd {
    font-weight: 600;
}
.dataset-card-field .dataset-link,
.dataset-card-field .dataset-symbol {
    white-space: normal;
}
.dataset-card-actions {
    margin-top: .6rem;
}
@media (max-width: 576px) {
    .dataset-table-wrap {
        display: none;
    }
    .dataset-cards {
        display: grid;
    }
    .dataset-filter,
    .dataset-filter input,
    .dataset-filter select,
    .dataset-range-inputs > div {
        width: 100%;
    }
}

/* Pager */
.dataset-pager {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
}
.dataset-pager-steps,
.dataset-pager-size {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}
.dataset-pager-size select {
    width: auto;
}

/* Long-text drawer */
.dataset-detail {
    background: var(--panel);
    color: var(--body-color);
}
.dataset-detail.offcanvas-end {
    --bs-offcanvas-width: min(44rem, 94vw);
}
.dataset-detail.offcanvas-bottom {
    --bs-offcanvas-height: 85vh;
}
.dataset-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1.25rem;
    margin: 0 0 .75rem;
    color: var(--muted);
}
.dataset-detail-meta > div {
    display: flex;
    gap: .35rem;
}
.dataset-detail-meta dt {
    font-weight: 600;
}
.dataset-detail-meta dd {
    margin: 0;
    color: var(--body-color);
}
/* A pre so the provider's article text stays verbatim (the suffix-stripping display pass skips pre
   text) and keeps its newlines; it reads as body copy, not as a code sample. */
.dataset-detail-body {
    margin: 0;
    overflow: visible;
    font-family: inherit;
    color: inherit;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: normal;
    font-size: .9rem;
    line-height: 1.55;
}

/* Series drawer (contract §14.1, detail.kind series): the interval choice, a close-price line and
   a compact OHLC table, newest first. The table scrolls inside its own box, so neither the drawer
   nor the page ever scrolls sideways at phone widths. */
.dataset-series {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
    min-width: 0;
}
.dataset-series-intervals {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}
.dataset-series-intervals legend {
    float: none;
    width: auto;
    margin: 0 0 .3rem;
    padding: 0;
}
.dataset-series-interval-options {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}
.dataset-series-interval-options .btn {
    color: var(--body-color);
    border-color: var(--border-color);
    background: var(--panel-2);
}
.dataset-series-interval-options .btn-check:checked + .btn {
    color: var(--body-color);
    border-color: var(--accent);
    background: var(--panel);
    box-shadow: inset 0 -2px 0 var(--accent);
    font-weight: 600;
}
.dataset-series-interval-options .btn-check:focus-visible + .btn {
    outline: 2px solid var(--focus-ring);
    outline-offset: 2px;
}
.dataset-series-chart {
    position: relative;
    height: 220px;
    min-width: 0;
}
.dataset-series-table-wrap {
    max-width: 100%;
    max-height: 20rem;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: .4rem;
    background: var(--panel);
}
.dataset-series-table {
    margin: 0;
    font-size: .8rem;
    color: var(--body-color);
}
.dataset-series-table caption {
    caption-side: top;
    padding: .35rem .5rem;
}
.dataset-series-table th,
.dataset-series-table td {
    white-space: nowrap;
}
/* Compact rows: Bootstrap's table cell selector outranks a plain th/td rule, so match it. */
.dataset-series-table.table > :not(caption) > * > * {
    padding: .3rem .5rem;
    line-height: 1.3;
}
.dataset-series-table thead th {
    position: sticky;
    top: 0;
    background: var(--panel-2);
    color: var(--body-color);
}
.dataset-series-table tbody th {
    font-weight: 500;
}
.dataset-series-table .dataset-num {
    padding-right: .75rem;
}
@media (max-width: 576px) {
    .dataset-series-chart {
        height: 180px;
    }
    .dataset-series-table {
        font-size: .72rem;
    }
    .dataset-series-table.table > :not(caption) > * > * {
        padding: .2rem .35rem;
    }
}

/* Scope index */
.dataset-index-group {
    display: grid;
    gap: .6rem;
}
/* A navbar More item lands on the group heading (FMP-A41); keep it clear of the sticky navbar. */
.dataset-index-group-title {
    scroll-margin-top: 7rem;
}
.dataset-index-group-title {
    margin: 0;
    display: flex;
    gap: .45rem;
    align-items: center;
}
.dataset-index-group-title i {
    color: var(--accent);
}
.dataset-index-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr));
    gap: .75rem;
}
.dataset-index-card {
    display: flex;
    gap: .75rem;
    padding: .85rem;
    border: 1px solid var(--border-color);
    border-radius: .5rem;
    background: var(--panel);
    color: var(--body-color);
    text-decoration: none;
    min-width: 0;
}
.dataset-index-card:hover {
    border-color: var(--accent);
    color: var(--body-color);
}
.dataset-index-card > i {
    color: var(--accent);
    font-size: 1.25rem;
}
.dataset-index-card strong,
.dataset-index-card small {
    display: block;
    overflow-wrap: anywhere;
}
.dataset-index-card small {
    color: var(--muted);
}
.dataset-index-scope-links {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1rem;
}

/* Company panel on the stock page */
.company-ref {
    display: grid;
    gap: 1rem;
    min-width: 0;
}
.company-ref-section {
    border: 1px solid var(--border-color);
    border-radius: .5rem;
    background: var(--panel);
    padding: .85rem;
    min-width: 0;
}
.company-ref-section > h3 {
    font-size: 1rem;
    margin: 0 0 .6rem;
    display: flex;
    gap: .45rem;
    align-items: center;
}
.company-ref-section > h3 i {
    color: var(--accent);
}
.company-ref-identity {
    display: flex;
    gap: .75rem;
    align-items: center;
    margin-bottom: .6rem;
    min-width: 0;
}
.company-ref-logo {
    width: 48px;
    height: 48px;
    object-fit: contain;
    border-radius: .4rem;
    background: var(--panel-2);
    flex: 0 0 auto;
}
.company-ref-fields {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(14rem, 100%), 1fr));
    gap: .5rem 1rem;
    margin: 0;
}
.company-ref-fields dt {
    font-size: .75rem;
    font-weight: 600;
    color: var(--muted);
}
.company-ref-fields dd {
    margin: 0;
    overflow-wrap: anywhere;
}
.company-ref-description {
    white-space: pre-line;
    overflow-wrap: anywhere;
    font-size: .9rem;
}
.company-ref-note,
.company-ref-stamp {
    font-size: .8rem;
    color: var(--muted);
    margin: .5rem 0 0;
}
.company-ref-table-wrap {
    max-height: 22rem;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: .4rem;
}
.company-ref-table {
    margin: 0;
    font-size: .85rem;
    color: var(--body-color);
}
.company-ref-table td,
.company-ref-table th {
    white-space: nowrap;
}
.company-ref-table thead th {
    position: sticky;
    top: 0;
    background: var(--panel-2);
    color: var(--body-color);
    white-space: nowrap;
}
.company-ref-links {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.company-ref-links a {
    overflow-wrap: anywhere;
}
.company-ref-chart {
    position: relative;
    height: 180px;
    margin-bottom: .75rem;
}

@media print {
    .dataset-filters,
    .dataset-pager,
    .dataset-detail-open,
    .dataset-cards,
    .dataset-detail {
        display: none !important;
    }
    .dataset-table-wrap {
        display: block !important;
        border: 0;
        max-height: none !important;
        overflow: visible !important;
    }
    /* Wide evidence tables such as COT have dozens of columns. A screen scrollbar is useful, but
       print engines clip an overflow container at its first page. Let the table participate in
       print layout and wrap its cells so every returned column remains in the printed evidence. */
    .dataset-table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed;
        font-size: 6pt;
    }
    .dataset-table th,
    .dataset-table td {
        padding: 1pt !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }
}

/* Phase 3b provider panels (contract fmp-datasets-v1 §15): the Held by ETFs card, the provider
   revenue segments block and the provider statements fallback. The ETF card sits in the Ownership
   grid, a narrow column on a desktop and the full width on a phone, so its table follows its own
   width rather than the viewport: below 34rem each holding becomes a stacked row that keeps every
   field with its label. The same applies to the segments table and to each provider statement table,
   whose line items stack with every period labelled. */
.etf-holders,
.fmp-segments,
.provider-fallback-statement {
    container-type: inline-size;
}
.etf-holders-table-wrap,
.fmp-segments-table-wrap,
.provider-fallback-table-wrap {
    max-height: 28rem;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: .4rem;
    background: var(--panel);
}
.etf-holders-table,
.fmp-segments-table,
.provider-fallback-table {
    margin: 0;
    font-size: .85rem;
    color: var(--body-color);
}
.etf-holders-table thead th,
.fmp-segments-table thead th,
.provider-fallback-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--panel-2);
    color: var(--body-color);
    white-space: nowrap;
    vertical-align: bottom;
}
.etf-holders-table td,
.fmp-segments-table td,
.provider-fallback-table td {
    white-space: nowrap;
}
.etf-holders-table th[scope="row"],
.fmp-segments-name,
.provider-fallback-line {
    font-weight: 400;
    white-space: normal;
    overflow-wrap: anywhere;
    min-width: 8rem;
}
.etf-holders-etf {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.etf-holders-symbol {
    font-weight: 600;
}
.etf-holders-name {
    font-size: .78rem;
    color: var(--muted);
    overflow-wrap: anywhere;
}
.fmp-segments-kind + .fmp-segments-kind {
    margin-top: 1.25rem;
}
.fmp-segments-kind-title {
    font-size: .95rem;
    margin: 0 0 .5rem;
}
.fmp-segments-chart {
    position: relative;
    margin-bottom: .75rem;
}
.fmp-segments-period + .fmp-segments-period {
    margin-top: .9rem;
}
.fmp-segments-period-title {
    font-size: .8rem;
    font-weight: 600;
    color: var(--muted);
    margin: .25rem 0 .4rem;
}
@container (max-width: 34rem) {
    /* Stacked rows flow with the page rather than scrolling inside it; the show-all toggle bounds
       the ETF list and a breakdown has only a handful of segments. */
    .etf-holders-table-wrap,
    .fmp-segments-table-wrap,
    .provider-fallback-table-wrap {
        max-height: none;
        overflow: visible;
    }
    .etf-holders-table thead,
    .fmp-segments-table thead,
    .provider-fallback-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
    .etf-holders-table,
    .etf-holders-table tbody,
    .etf-holders-table tr,
    .fmp-segments-table,
    .fmp-segments-table tbody,
    .fmp-segments-table tr,
    .provider-fallback-table,
    .provider-fallback-table tbody,
    .provider-fallback-table tr {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .etf-holders-table tr,
    .fmp-segments-table tr,
    .provider-fallback-table tr {
        padding: .5rem .65rem;
        border-bottom: 1px solid var(--border-color);
    }
    .etf-holders-table th,
    .etf-holders-table td,
    .fmp-segments-table th,
    .fmp-segments-table td,
    .provider-fallback-table th,
    .provider-fallback-table td {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: .75rem;
        padding: .1rem 0;
        border: 0;
        text-align: right;
        white-space: normal;
        min-width: 0;
    }
    .etf-holders-table th[scope="row"],
    .fmp-segments-table th[scope="row"],
    .provider-fallback-table th[scope="row"] {
        display: block;
        min-width: 0;
        text-align: left;
        padding-bottom: .3rem;
        font-weight: 600;
    }
    .etf-holders-table td::before,
    .fmp-segments-table td::before,
    .provider-fallback-table td::before {
        content: attr(data-label);
        flex: 0 1 auto;
        text-align: left;
        color: var(--muted);
        font-size: .75rem;
        font-weight: 600;
    }
}

/* Provider cards on the /finance workspace. Deliberately not .financial-section (the filed
   statement sections), the same choice the forward outlook makes: provider figures must never be
   counted, styled or navigated as a filed section. The frame matches so the page still reads as one. */
.provider-section {
    margin-bottom: 1rem;
    overflow: hidden;
    scroll-margin-top: 5rem;
    background: var(--panel);
    color: var(--body-color);
    border-color: var(--border-color);
}
.provider-section > .card-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .6rem;
    padding: .85rem 1rem;
    background: var(--panel-2);
    border-color: var(--border-color);
}
.provider-section > .card-header h2 {
    font-size: 1.05rem;
    margin: 0;
}

/* Provider statements fallback: a dashed warning border and the disclosure first, so it can never
   be read as part of the filed statements around it. */
.provider-fallback-card {
    border: 1px dashed var(--warning);
}
.provider-fallback-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
}
.provider-fallback-header h2 i {
    color: var(--warning);
}
.provider-fallback-badge {
    background: var(--panel-2);
    color: var(--body-color);
    border: 1px solid var(--warning);
    font-weight: 600;
    white-space: normal;
}
.provider-fallback-disclosure {
    margin: 0 0 .75rem;
    padding: .5rem .7rem;
    border-left: 3px solid var(--warning);
    background: var(--panel-2);
    color: var(--body-color);
    font-size: .85rem;
}
.provider-fallback-meta {
    margin-bottom: .5rem;
}
.provider-fallback-statement {
    margin-top: 1rem;
}
/* One block per statement type (quarterly, annual) when /finance shows both. */
.provider-fallback-block + .provider-fallback-block {
    border-top: 1px dashed var(--warning);
}
.provider-fallback-filed th,
.provider-fallback-filed td {
    color: var(--muted);
    font-size: .8rem;
}
.provider-fallback-gap {
    font-weight: 400;
    white-space: normal;
}
.fmp-segments-chart-caption {
    margin: 0 0 .35rem;
    font-size: .8rem;
}
@media print {
    .provider-fallback-card {
        display: none !important;
    }
}

/* Analyst & valuation sub-tab (fmp-global-datasets-v1 §5.7). Neutral by contract: every figure and
   provider string takes the body colour, never a gain/loss or verdict colour, and the cards keep the
   API's order. The notes come first, framed so they cannot be skimmed past. */
.analyst-notes {
    border: 1px solid var(--border-color);
    border-left: 3px solid var(--accent);
    border-radius: .5rem;
    background: var(--panel-2);
    color: var(--body-color);
    padding: .75rem .9rem;
    min-width: 0;
}
.analyst-notes-title {
    font-size: .95rem;
    margin: 0 0 .35rem;
}
.analyst-notes-list {
    margin: 0;
    padding-left: 1.1rem;
    font-size: .85rem;
}
.analyst-notes-list li + li {
    margin-top: .25rem;
}
.analyst-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(22rem, 100%), 1fr));
    gap: 1rem;
    min-width: 0;
}
.analyst-card,
.analyst-card dd,
.analyst-rating-letter {
    color: var(--body-color);
}
.analyst-fields {
    grid-template-columns: repeat(auto-fill, minmax(min(10rem, 100%), 1fr));
}
.analyst-fields dd {
    font-variant-numeric: tabular-nums;
}
.analyst-rating-letter {
    font-size: 1.15rem;
    font-weight: 600;
}
.analyst-subheading {
    font-size: .75rem;
    font-weight: 600;
    color: var(--muted);
    margin: .75rem 0 .35rem;
}
.analyst-section-state {
    font-size: .9rem;
    color: var(--muted);
}
/* GDS-A21(4): the grade table takes the whole row of the card grid, so its five columns fit at
   desktop and tablet; words wrap only at spaces, never mid-word, and the table never scrolls there. */
.analyst-card[data-analyst-section="grades"] {
    grid-column: 1 / -1;
}
.analyst-grades-wrap {
    border: 1px solid var(--border-color);
    border-radius: .4rem;
}
.analyst-grades-table {
    margin: 0;
    font-size: .85rem;
    color: var(--body-color);
}
.analyst-grades-table thead th {
    background: var(--panel-2);
    color: var(--body-color);
}
.analyst-grades-table th,
.analyst-grades-table td {
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: manual;
}
.analyst-grades-table [data-column="date"] {
    white-space: nowrap;
}
@media (max-width: 576px) {
    /* Phone cards: each grade action stacks with every field labelled. A word longer than the card
       scrolls inside the card instead of breaking (the only place this table may scroll). */
    .analyst-grades-wrap {
        overflow-x: auto;
        border: 0;
    }
    .analyst-grades-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
    .analyst-grades-table,
    .analyst-grades-table tbody,
    .analyst-grades-table tr {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .analyst-grades-table tr {
        border: 1px solid var(--border-color);
        border-radius: .4rem;
        padding: .45rem .65rem;
        margin-bottom: .5rem;
        background: var(--panel);
    }
    .analyst-grades-table td {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: .75rem;
        padding: .1rem 0;
        border: 0;
        text-align: right;
        white-space: normal;
    }
    .analyst-grades-table td::before {
        content: attr(data-label);
        flex: 0 1 auto;
        text-align: left;
        color: var(--muted);
        font-size: .75rem;
        font-weight: 600;
    }
}

/* Provider sector board on Market Activity (fmp-global-datasets-v1 §6.3). Plain numbers only: no
   heatmap or gain/loss colouring, so it cannot be read as the app's breadth heatmap above it. */
.sector-perf {
    background: var(--panel);
    color: var(--body-color);
    border-color: var(--border-color);
}
.sector-perf > .card-header {
    background: var(--panel-2);
    border-color: var(--border-color);
}
.sector-perf-date {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}
.sector-perf-date select {
    width: auto;
    max-width: 100%;
}
.sector-perf-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: .4rem;
}
.sector-perf-table {
    margin: 0;
    font-size: .85rem;
    color: var(--body-color);
}
/* GDS-A21(4): every column stays visible at 360 px in every culture. Headers wrap at spaces (a
   long Tamil or Malayalam caption takes two lines instead of pushing P/E out of the card), the
   figures never wrap, and the name column gives way first. */
.sector-perf-table thead th {
    background: var(--panel-2);
    color: var(--body-color);
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    vertical-align: bottom;
}
.sector-perf-table th[scope="row"] {
    font-weight: 400;
    overflow-wrap: anywhere;
    color: var(--body-color);
}
.sector-perf-table td {
    color: var(--body-color);
    white-space: nowrap;
}
@media (max-width: 576px) {
    .sector-perf-table {
        font-size: .8rem;
    }
    .sector-perf-table > :not(caption) > * > * {
        padding: .25rem .3rem;
    }
}
.sector-perf-industries > summary {
    cursor: pointer;
    font-weight: 600;
    margin-bottom: .5rem;
}
.sector-perf-notes {
    margin: 0;
    padding-left: 1.1rem;
    font-size: .8rem;
    color: var(--muted);
}