/* ============================================================
   BackBox Labs: cold-chain sabotage dashboard
   Components rendered by js/dashboard-cold-chain.js, layered on
   dashboard.css: hero, section bar, figures, chips, tables and
   the dialog come from there. Every colour comes from tokens.css.
   ============================================================ */


/* ------------------------------------------------------------
   Shared marks: record chips, change markers, ids, blocks
   ------------------------------------------------------------ */
.cc-id {
    font: 600 var(--fs-xs)/1 var(--font-mono);
    color: var(--accent-text);
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.cc-refs { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.cc-ref {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    max-width: 100%;
    white-space: nowrap;
    padding: 0.2rem 0.45rem;
    font: 500 0.72rem/1.3 var(--font-mono);
    color: var(--text-dim);
    letter-spacing: 0.02em;
    background: var(--surface-2);
    border: var(--hairline);
    border-radius: var(--radius-xs);
    transition: color var(--t-fast), border-color var(--t-fast);
}
.cc-ref:hover { color: var(--text); border-color: var(--accent); }
.cc-ref-id { color: var(--text); }
.cc-ref-name {
    min-width: 0;
    max-width: 18rem;
    overflow: hidden;
    font-family: var(--font-display);
    letter-spacing: 0;
    text-overflow: ellipsis;
}
.ev-ref { white-space: nowrap; }

.cc-filter-label {
    align-self: center;
    margin-right: 0.35rem;
    font: 600 var(--fs-xs)/1 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}

.kpi-value.is-text {
    max-width: 55%;
    font: 600 var(--fs-sm)/1.35 var(--font-display);
    letter-spacing: 0;
    text-align: right;
    text-wrap: balance;
    white-space: normal;
}

.cc-marker {
    display: inline-flex;
    align-items: center;
    margin-left: 0.5rem;
    padding: 0.15rem 0.4rem;
    font: 600 0.65rem/1.2 var(--font-mono);
    color: var(--on-accent);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
    vertical-align: middle;
    background: var(--accent);
    border-radius: var(--radius-xs);
}
.cc-marker[data-kind="updated"] {
    color: var(--accent-text);
    background: var(--accent-trace);
    box-shadow: inset 0 0 0 1px var(--accent);
}

.cc-muted { font-size: var(--fs-sm); line-height: 1.55; color: var(--text-mute); }
.cc-muted strong { font-weight: 600; color: var(--text-dim); }
.cc-empty {
    padding: var(--sp-md);
    font-size: var(--fs-sm);
    color: var(--text-mute);
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.cc-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }

.dash-conf-dots span.is-half {
    background: linear-gradient(90deg, var(--accent) 50%, transparent 50%);
    border-color: var(--accent);
}

.cc-block { display: grid; gap: 0.55rem; align-content: start; }
.cc-block-title {
    font: 600 var(--fs-xs)/1.2 var(--font-mono);
    color: var(--text);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.cc-block p { font-size: var(--fs-sm); line-height: 1.65; color: var(--text-dim); }

.cc-row-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem var(--sp-md);
}
.cc-record-meta {
    font: 500 var(--fs-xs)/1.4 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: 0.02em;
}


/* ------------------------------------------------------------
   Statements: one claim per line, with its evidence status
   ------------------------------------------------------------ */
.cc-statements {
    display: grid;
    background: var(--surface-2);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.cc-statement {
    display: grid;
    grid-template-columns: 10.5rem minmax(0, 1fr);
    gap: 0.45rem var(--sp-md);
    align-items: start;
    padding: 0.8rem var(--sp-md);
}
.cc-statement + .cc-statement { border-top: var(--hairline-sm); }
.cc-statement-head { display: flex; flex-direction: column; align-items: flex-start; gap: 0.45rem; }
.cc-statement-body { display: grid; gap: 0.45rem; min-width: 0; }
.cc-statement.no-kind,
.cc-procon .cc-statement { grid-template-columns: minmax(0, 1fr); }
.cc-statement.no-kind .cc-statement-head,
.cc-procon .cc-statement-head { flex-direction: row; flex-wrap: wrap; align-items: center; }
.cc-statement-kind {
    font: 600 0.7rem/1.2 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.cc-statement-text {
    max-width: 66rem;
    font-size: var(--fs-sm);
    line-height: 1.65;
    color: var(--text);
}


/* ------------------------------------------------------------
   Incidents: one expandable row each
   ------------------------------------------------------------ */
.cc-list {
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.cc-list .cc-row + .cc-row { border-top: var(--hairline-sm); }
.cc-list > .cc-empty { border: 0; }

.cc-incident-summary {
    display: grid;
    grid-template-columns: 4.75rem 9.5rem minmax(0, 1fr) minmax(7rem, 11rem) 11rem 1rem;
    gap: var(--sp-md);
    align-items: center;
    padding: 0.9rem var(--sp-md);
    list-style: none;
    cursor: pointer;
    transition: background var(--t-fast);
}
.cc-incident-summary::-webkit-details-marker { display: none; }
.cc-incident-summary:hover { background: var(--surface-2); }
.cc-incident-when {
    font: 500 var(--fs-xs)/1.35 var(--font-mono);
    color: var(--text-dim);
    letter-spacing: 0.01em;
}
.cc-incident-main { display: grid; gap: 0.25rem; min-width: 0; }
.cc-incident-title {
    font: 600 var(--fs-sm)/1.4 var(--font-display);
    color: var(--text);
}
.cc-incident-where { font-size: var(--fs-xs); line-height: 1.4; color: var(--text-mute); }
.cc-incident-scale {
    font: 600 var(--fs-sm)/1.35 var(--font-mono);
    color: var(--text);
}
.cc-incident-status { display: flex; }
.cc-incident.is-inactive .cc-incident-title,
.cc-incident.is-inactive .cc-incident-scale { color: var(--text-mute); }
.cc-row[open] .act-toggle { transform: rotate(180deg); }

.cc-row-body {
    display: grid;
    gap: var(--sp-md);
    padding: 0 var(--sp-md) var(--sp-md);
}
.cc-lede {
    max-width: 66rem;
    font-size: var(--fs-md);
    line-height: 1.65;
    color: var(--text-dim);
}
.cc-facets {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr));
    gap: var(--sp-md);
}
.cc-actor-conf { display: grid; gap: 0.5rem; }
.cc-actor-conf li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.75rem;
}
.cc-procon {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr));
    gap: var(--sp-md);
}


/* ------------------------------------------------------------
   Geography: a grid cartogram beside the selected country
   ------------------------------------------------------------ */
.geo-layout {
    display: grid;
    grid-template-columns: minmax(0, 44rem) minmax(18rem, 1fr);
    gap: var(--sp-lg);
    align-items: start;
}
.geo-map-wrap { display: grid; gap: var(--sp-md); }
.geo-map {
    display: grid;
    gap: var(--sp-md);
    padding: var(--sp-md);
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.geo-grid {
    display: grid;
    grid-template-columns: repeat(var(--geo-cols), minmax(0, 1fr));
    grid-template-rows: repeat(var(--geo-rows), auto);
    gap: 4px;
}
.geo-grid-outside { grid-template-rows: auto; }
.geo-tile {
    --fill: var(--surface-2);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    aspect-ratio: 1;
    min-width: 0;
    padding: 0.3rem 0.35rem;
    color: var(--text-dim);
    text-align: left;
    background: var(--fill);
    border-radius: var(--radius-xs);
    transition: transform var(--t-fast), box-shadow var(--t-fast);
}
.geo-code {
    font: 600 clamp(0.6rem, 1.2vw, 0.75rem)/1 var(--font-mono);
    letter-spacing: 0.02em;
}
.geo-figure {
    overflow: hidden;
    font: 600 clamp(0.52rem, 0.95vw, 0.66rem)/1.1 var(--font-mono);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.geo-tile[data-role="context"] { --fill: color-mix(in srgb, var(--text) 4%, transparent); color: var(--text-quiet); }
.geo-tile[data-role="none"] { --fill: transparent; color: var(--text-mute); box-shadow: inset 0 0 0 1px var(--line); }
.geo-tile[data-role="watch"] { --fill: transparent; color: var(--text-dim); box-shadow: inset 0 0 0 1px var(--line-strong); }
.geo-tile[data-role="watch"]::after {
    content: '';
    position: absolute;
    right: 0.35rem;
    top: 0.35rem;
    width: 6px;
    height: 6px;
    border: 1px solid var(--text-mute);
    border-radius: 50%;
}
.geo-tile[data-role="reported"] {
    --fill: color-mix(in srgb, var(--tone-warning) 14%, var(--surface));
    color: var(--text);
    box-shadow: inset 0 0 0 1px var(--tone-warning);
}
.geo-tile[data-role="hit"] { color: var(--text); }
.geo-tile[data-role="hit"][data-level="1"] { --fill: color-mix(in srgb, var(--accent) 22%, var(--surface)); }
.geo-tile[data-role="hit"][data-level="2"] { --fill: color-mix(in srgb, var(--accent) 45%, var(--surface)); }
.geo-tile[data-role="hit"][data-level="3"] { --fill: color-mix(in srgb, var(--accent) 72%, var(--surface)); }
.geo-tile[data-role="hit"][data-level="4"] { --fill: var(--accent-hi); color: var(--on-accent); }
button.geo-tile:hover { transform: var(--card-lift); box-shadow: 0 0 0 1px var(--accent); }
button.geo-tile[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--accent); }

.geo-outside { display: grid; gap: 0.5rem; padding-top: var(--sp-sm); border-top: var(--hairline-sm); }
.geo-outside-title {
    font: 600 var(--fs-xs)/1 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.geo-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem var(--sp-md);
    padding-top: var(--sp-sm);
    font-size: var(--fs-xs);
    color: var(--text-mute);
    border-top: var(--hairline-sm);
}
.geo-legend-scale { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.7rem; }
.geo-legend-title { font-family: var(--font-display); }
.geo-legend-item { display: inline-flex; align-items: center; gap: 0.35rem; font-family: var(--font-mono); }
.geo-swatch {
    --fill: transparent;
    position: relative;
    width: 0.85rem;
    height: 0.85rem;
    background: var(--fill);
    border-radius: var(--radius-xs);
}
.geo-swatch[data-role="hit"][data-level="1"] { --fill: color-mix(in srgb, var(--accent) 22%, var(--surface)); }
.geo-swatch[data-role="hit"][data-level="2"] { --fill: color-mix(in srgb, var(--accent) 45%, var(--surface)); }
.geo-swatch[data-role="hit"][data-level="3"] { --fill: color-mix(in srgb, var(--accent) 72%, var(--surface)); }
.geo-swatch[data-role="hit"][data-level="4"] { --fill: var(--accent-hi); }
.geo-swatch[data-role="reported"] {
    --fill: color-mix(in srgb, var(--tone-warning) 14%, var(--surface));
    box-shadow: inset 0 0 0 1px var(--tone-warning);
}
.geo-swatch[data-role="watch"] { box-shadow: inset 0 0 0 1px var(--line-strong); }

.geo-detail {
    position: sticky;
    top: calc(var(--nav-h) + 4.5rem);
    display: grid;
    gap: var(--sp-sm);
    padding: var(--sp-md) var(--sp-lg);
    background: var(--surface);
    border: var(--hairline);
    border-left: 2px solid var(--accent);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.geo-detail-empty { display: flex; align-items: center; gap: 0.6rem; }
.geo-hits { display: grid; gap: var(--sp-sm); }
.geo-hit {
    display: grid;
    gap: 0.4rem;
    padding-top: var(--sp-sm);
    border-top: var(--hairline-sm);
}
.geo-hit-head,
.geo-hit-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.75rem; }
.geo-hit-sites {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--sp-sm);
    font-size: var(--fs-sm);
    color: var(--text-mute);
}
.geo-hit-sites strong { font: 600 var(--fs-md)/1.2 var(--font-mono); color: var(--text); text-align: right; }
.geo-hit-sites strong.is-text { font: 600 var(--fs-sm)/1.35 var(--font-display); }

.geo-rank { display: grid; }
.geo-rank-row {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr) auto;
    gap: var(--sp-sm);
    align-items: center;
    width: 100%;
    padding: 0.55rem 0;
    text-align: left;
    border-top: var(--hairline-sm);
}
.geo-rank li:first-child .geo-rank-row { border-top: 0; }
.geo-rank-code { font: 600 var(--fs-xs)/1 var(--font-mono); color: var(--text-mute); }
.geo-rank-name {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.5rem;
    font-size: var(--fs-sm);
    color: var(--text);
    transition: color var(--t-fast);
}
.geo-rank-row:hover .geo-rank-name { color: var(--accent-text); }
.geo-rank-flag {
    font: 500 0.65rem/1.2 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.geo-rank-figure { font: 600 var(--fs-sm)/1.2 var(--font-mono); color: var(--text); text-align: right; white-space: nowrap; }
.geo-rank-figure.is-text { font: 500 var(--fs-sm)/1.35 var(--font-display); color: var(--text-dim); }
.geo-show { justify-self: start; margin-top: 0.25rem; }
.geo-table { margin-top: var(--sp-md); }


/* ------------------------------------------------------------
   Timeline additions: year rules, record links
   ------------------------------------------------------------ */
.cc-tl-year {
    padding: var(--sp-md) 0 0.25rem;
    font: 600 var(--fs-sm)/1 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
}
.cc-tl-refs { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.75rem; margin-top: 0.6rem; }
.tl-tags .dash-tag { white-space: normal; }


/* ------------------------------------------------------------
   Correlations: the central question, the matrix, the hypotheses
   ------------------------------------------------------------ */
.cq-card {
    display: grid;
    gap: var(--sp-sm);
    padding: var(--sp-lg);
    background: var(--surface);
    border: var(--hairline);
    border-left: 2px solid var(--accent);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.cq-card:empty { display: none; }
.cq-label {
    font: 600 var(--fs-xs)/1 var(--font-mono);
    color: var(--accent-text);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.cq-question { max-width: 60rem; font-size: var(--fs-md); line-height: 1.6; color: var(--text-dim); }
.cq-verdict {
    max-width: 62rem;
    font: 600 clamp(1.1rem, 1.6vw, 1.35rem)/1.45 var(--font-display);
    letter-spacing: -0.01em;
    color: var(--text);
}
.cq-claims { display: grid; gap: 0.6rem; margin-top: var(--sp-sm); }
.cq-list { display: grid; }
.cq-claim {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 13rem;
    gap: 0.35rem var(--sp-md);
    padding: 0.85rem 0;
    border-top: var(--hairline-sm);
}
.cq-claim-text { font: 500 var(--fs-sm)/1.55 var(--font-display); color: var(--text); }
.cq-claim-conf { justify-self: start; }
.cq-claim-basis,
.cq-claim .ev-refs { grid-column: 1; }
.cq-claim-basis { font-size: var(--fs-sm); line-height: 1.6; color: var(--text-mute); }
.cq-claim-basis span { font-weight: 600; color: var(--text-dim); }

.mx-block { display: grid; gap: var(--sp-sm); margin-top: var(--sp-xl); }
.mx-block:empty { display: none; }
.mx-title { margin-bottom: 0; }
.mx-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem var(--sp-md);
    font-size: var(--fs-xs);
    color: var(--text-mute);
}
.mx-legend li { display: inline-flex; align-items: center; gap: 0.45rem; }

.mx-mark {
    position: relative;
    display: inline-block;
    flex: none;
    width: 0.8rem;
    height: 0.8rem;
    border-radius: 50%;
}
.mx-mark[data-v="fact"] { background: var(--tone-good); }
.mx-mark[data-v="reported"] {
    background: linear-gradient(90deg, var(--tone-warning) 50%, transparent 50%);
    box-shadow: inset 0 0 0 1.5px var(--tone-warning);
}
.mx-mark[data-v="hypothesis"] { box-shadow: inset 0 0 0 1.5px var(--tone-assessment); }
.mx-mark[data-v="no"] { height: 2px; border-radius: 1px; background: var(--text-quiet); }
.mx-mark[data-v="unknown"] { width: 0.35rem; height: 0.35rem; background: var(--text-quiet); }

.mx-wrap { max-height: none; }
.mx-table { font-size: var(--fs-xs); }
.mx-table th.mx-corner,
.mx-table th.mx-row {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 14rem;
    background: var(--surface);
    box-shadow: 1px 0 0 var(--line);
}
.mx-table th.mx-row {
    z-index: 1;
    font: 500 var(--fs-xs)/1.35 var(--font-display);
    color: var(--text-dim);
    letter-spacing: 0;
    text-transform: none;
    white-space: normal;
    border-bottom: var(--hairline-sm);
}
.mx-table tbody tr:last-child th.mx-row { border-bottom: 0; }
.mx-row-inner { display: flex; align-items: center; gap: 0.6rem; }
.mx-row-title { min-width: 0; }
.mx-table th.mx-col {
    min-width: 4.2rem;
    max-width: 6rem;
    padding-inline: 0.35rem;
    font-size: 0.62rem;
    line-height: 1.3;
    text-align: center;
    white-space: normal;
    vertical-align: bottom;
}
.mx-table td.mx-cell { padding: 0; text-align: center; vertical-align: middle; }
.mx-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 2.5rem;
    min-height: 2.5rem;
    border-radius: var(--radius-xs);
    transition: background var(--t-fast);
}
button.mx-btn:hover { background: var(--accent-trace); }
.mx-dlg-mark { display: flex; align-items: center; gap: 0.5rem; }

.hyp-block { display: grid; gap: var(--sp-sm); margin-top: var(--sp-xl); }
.hyp-block:empty { display: none; }
.cc-hyp-summary,
.cc-actor-summary { grid-template-columns: minmax(12rem, 1.1fr) minmax(0, 2fr) 11rem 1rem; }


/* ------------------------------------------------------------
   Techniques: observed marks in the row summary
   ------------------------------------------------------------ */
.cc-tech-summary { grid-template-columns: minmax(14rem, 1.3fr) minmax(0, 1fr) minmax(5rem, 9rem) 1rem; }
.cc-observed { display: flex; flex-wrap: wrap; gap: 4px; }
.cc-tech-legend { margin-bottom: var(--sp-sm); }
.cc-legend-lead { color: var(--text-mute); }


/* ------------------------------------------------------------
   Equipment: ranked exposure bars, then one card per family
   ------------------------------------------------------------ */
.xp-chart {
    display: grid;
    gap: var(--sp-md);
    margin-bottom: var(--sp-lg);
    padding: var(--sp-md) var(--sp-lg);
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.xp-chart:empty { display: none; }
.xp-head { display: grid; gap: 0.4rem; }
.xp-bars { display: grid; gap: 0.35rem; }
.xp-row {
    display: grid;
    grid-template-columns: minmax(11rem, 15rem) minmax(0, 1fr) 4.5rem;
    grid-template-areas:
        "label track value"
        ".     meta  meta";
    gap: 0.3rem var(--sp-md);
    align-items: center;
    padding: 0.45rem 0.5rem;
    border-radius: var(--radius-xs);
    outline-offset: 2px;
    transition: background var(--t-fast);
}
.xp-row:hover,
.xp-row:focus-visible { background: var(--surface-2); }
.xp-label { grid-area: label; min-width: 0; }
.xp-name {
    font: 500 var(--fs-sm)/1.35 var(--font-display);
    color: var(--text);
    text-align: left;
    transition: color var(--t-fast);
}
.xp-name.is-link:hover { color: var(--accent-text); }
.xp-track {
    grid-area: track;
    display: block;
    height: 14px;
    background: color-mix(in srgb, var(--accent) 10%, var(--surface));
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.xp-fill {
    display: block;
    height: 100%;
    background: var(--accent);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.xp-value {
    grid-area: value;
    font: 600 var(--fs-sm)/1 var(--font-mono);
    color: var(--text);
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.xp-meta {
    grid-area: meta;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.75rem;
    font: 500 var(--fs-xs)/1.4 var(--font-mono);
    color: var(--text-mute);
}

.eq-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(26rem, 100%), 1fr));
    align-items: start;
    gap: var(--sp-md);
}
.eq-card {
    display: grid;
    gap: var(--sp-sm);
    align-content: start;
    min-width: 0;
    padding: var(--sp-md);
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.eq-head { display: grid; gap: 0.45rem; }
.eq-kicker {
    font: 500 var(--fs-xs)/1.2 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: 0.02em;
}
.eq-title { font: 600 var(--fs-lg)/1.3 var(--font-display); color: var(--text); }
.eq-class { font-size: var(--fs-sm); line-height: 1.45; color: var(--text-mute); }
.eq-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.eq-summary { font-size: var(--fs-sm); line-height: 1.6; color: var(--text-dim); }
.eq-exposure {
    display: grid;
    gap: 0.25rem;
    padding: 0.65rem 0;
    border-block: var(--hairline-sm);
}
.eq-exposure-label {
    font: 600 0.7rem/1.2 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.eq-exposure-text { font: 600 var(--fs-sm)/1.45 var(--font-display); color: var(--text); }
.eq-cves {
    display: grid;
    background: var(--surface-2);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.eq-cve { display: grid; gap: 0.3rem; padding: 0.6rem 0.75rem; }
.eq-cve + .eq-cve { border-top: var(--hairline-sm); }
.eq-cve-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.75rem; }
.eq-cve-id { font: 600 var(--fs-xs)/1.3 var(--font-mono); color: var(--text); }
.eq-cvss {
    padding: 0.15rem 0.4rem;
    font: 600 0.68rem/1.2 var(--font-mono);
    color: var(--text-dim);
    border: var(--hairline);
    border-radius: var(--radius-xs);
}
.eq-cvss[data-sev="critical"] { border-color: var(--tone-critical); }
.eq-cvss[data-sev="high"] { border-color: var(--tone-warning); }
.eq-cve-fix { margin-left: auto; font: 500 var(--fs-xs)/1.3 var(--font-mono); color: var(--text-mute); }
.eq-cve-text { font-size: var(--fs-sm); line-height: 1.5; color: var(--text-dim); }
.eq-foot { margin-top: auto; }


/* ------------------------------------------------------------
   Indicators
   ------------------------------------------------------------ */
/* Keeps the absolutely placed sr-only labels inside the scroller, or they widen the page on phones. */
.dash-table-wrap { position: relative; }
.ind-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-sm) var(--sp-md);
    margin-bottom: var(--sp-sm);
}
.ind-toolbar .dash-note { max-width: 52rem; margin: 0; }
.ind-download { gap: 0.5rem; }
.ind-value { white-space: nowrap; }
.ind-value code {
    font: 500 var(--fs-xs)/1.4 var(--font-mono);
    color: var(--text);
    word-break: break-all;
    white-space: normal;
}
.ind-copy {
    margin-left: 0.5rem;
    padding: 0.2rem 0.3rem;
    font-size: 0.75rem;
    color: var(--text-mute);
    border-radius: var(--radius-xs);
    transition: color var(--t-fast);
}
.ind-copy:hover { color: var(--accent-text); }
.ind-copy.is-done { color: var(--tone-good); }
.ind-extra {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(24rem, 100%), 1fr));
    gap: var(--sp-lg);
    margin-top: var(--sp-lg);
}
.cc-bullets,
.cc-checks {
    display: grid;
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.cc-bullets li,
.cc-checks li {
    display: grid;
    gap: 0.4rem;
    padding: 0.8rem var(--sp-md);
}
.cc-bullets li + li,
.cc-checks li + li { border-top: var(--hairline-sm); }
.cc-checks { counter-reset: check; }
.cc-checks li { counter-increment: check; grid-template-columns: 1.75rem minmax(0, 1fr); }
.cc-checks li::before {
    content: counter(check, decimal-leading-zero);
    font: 600 var(--fs-xs)/1.6 var(--font-mono);
    color: var(--accent-text);
}
.cc-checks li > * { grid-column: 2; }
.cc-checks li > p:first-of-type { grid-row: 1; }


/* ------------------------------------------------------------
   Outlook: open questions for the next research cycle
   ------------------------------------------------------------ */
.oq-list {
    display: grid;
    background: var(--surface);
    border: var(--hairline);
    border-radius: var(--radius-sm);
}
.oq-row { display: grid; gap: 0.5rem; padding: var(--sp-md); }
.oq-row + .oq-row { border-top: var(--hairline-sm); }
.oq-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }
.oq-priority {
    font: 500 0.7rem/1.2 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: var(--tracking-mono);
    text-transform: uppercase;
}
.oq-priority[data-priority="high"] { color: var(--accent-text); }
.oq-text { max-width: 66rem; font: 500 var(--fs-md)/1.55 var(--font-display); color: var(--text); }


/* ------------------------------------------------------------
   Sources and changes
   ------------------------------------------------------------ */
.src-toolbar-checks { margin-bottom: var(--sp-sm); }
.src-publisher {
    display: block;
    margin-bottom: 0.15rem;
    font: 600 var(--fs-xs)/1.3 var(--font-display);
    color: var(--text);
}

.chg-list { display: grid; gap: var(--sp-md); }
.chg-version {
    display: grid;
    gap: 0.75rem;
    padding: var(--sp-md) var(--sp-lg);
    background: var(--surface);
    border: var(--hairline);
    border-left: 2px solid var(--accent);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.chg-version.is-cycle { border-left-color: var(--line-strong); }
.chg-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem var(--sp-md); }
.chg-id { font: 600 var(--fs-md)/1 var(--font-mono); color: var(--text); }
.chg-date { font: 500 var(--fs-xs)/1 var(--font-mono); color: var(--text-mute); }
.chg-summary { max-width: 66rem; font-size: var(--fs-sm); line-height: 1.65; color: var(--text-dim); }
.chg-items { display: grid; }
.chg-item {
    display: grid;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    gap: 0.35rem var(--sp-md);
    align-items: start;
    padding: 0.6rem 0;
    border-top: var(--hairline-sm);
}
.chg-type {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font: 500 var(--fs-xs)/1.5 var(--font-mono);
    color: var(--text-mute);
    letter-spacing: 0.02em;
}
.chg-item[data-type="corrected"] .chg-type i,
.chg-item[data-type="downgraded"] .chg-type i { color: var(--tone-warning); }
.chg-item[data-type="merged"] .chg-type i,
.chg-item[data-type="removed"] .chg-type i { color: var(--tone-critical); }
.chg-item[data-type="added"] .chg-type i,
.chg-item[data-type="upgraded"] .chg-type i { color: var(--tone-good); }
.chg-text { font-size: var(--fs-sm); line-height: 1.6; color: var(--text-dim); }
.chg-item .cc-refs { grid-column: 2; }

.method-block h3 { line-height: 1.4; }


/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */
@media (max-width: 1100px) {
    .geo-layout { grid-template-columns: minmax(0, 1fr); }
    .geo-detail { position: static; }
    .cc-incident-summary { grid-template-columns: 4.75rem minmax(0, 1fr) minmax(6rem, 9rem) 1rem; }
    .cc-incident-when { grid-column: 2; grid-row: 2; }
    .cc-incident-main { grid-column: 2; grid-row: 1; }
    .cc-incident-scale { grid-column: 3; grid-row: 1; }
    .cc-incident-status { grid-column: 3; grid-row: 2; }
    .cc-incident-summary .act-toggle { grid-column: 4; grid-row: 1; }
    .cq-claim { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
    .cc-incident-summary { grid-template-columns: minmax(0, 1fr) 1rem; gap: 0.4rem var(--sp-sm); padding-inline: var(--sp-sm); }
    .cc-incident-summary > * { grid-column: 1; grid-row: auto; }
    .cc-incident-summary .act-toggle { grid-column: 2; grid-row: 1; }
    .cc-incident-when,
    .cc-incident-main,
    .cc-incident-scale,
    .cc-incident-status { grid-column: 1; grid-row: auto; }
    .cc-row-body { padding-inline: var(--sp-sm); }
    .cc-statement { grid-template-columns: minmax(0, 1fr); padding-inline: var(--sp-sm); }
    .cc-statement-head { flex-direction: row; flex-wrap: wrap; align-items: center; }
    .kpi-value.is-text { max-width: 50%; }
    .cc-ref-name { max-width: 11rem; }

    .cc-hyp-summary,
    .cc-actor-summary,
    .cc-tech-summary { grid-template-columns: minmax(0, 1fr) 1rem; }
    .cc-observed,
    .cc-hyp-summary .dash-conf,
    .cc-actor-summary .dash-conf { grid-column: 1; }

    .geo-map { padding: var(--sp-sm); }
    .geo-detail { padding: var(--sp-md); }
    .cq-card { padding: var(--sp-md); }
    .xp-chart { padding: var(--sp-md); }
    .xp-row {
        grid-template-columns: minmax(0, 1fr) 4rem;
        grid-template-areas:
            "label value"
            "track track"
            "meta  meta";
    }
    .chg-version { padding: var(--sp-md); }
    .chg-item { grid-template-columns: minmax(0, 1fr); }
    .chg-item .cc-refs { grid-column: 1; }
}

@media (max-width: 480px) {
    .geo-grid { gap: 3px; }
    .geo-tile { padding: 0.2rem; }
    .geo-figure { display: none; }
}

@media print {
    .ind-download,
    .ind-copy,
    .geo-show { display: none !important; }
    .geo-detail { position: static; }
    .cc-row:not([open]) .cc-row-body { display: grid; }
}