/* ==========================================================================
   COMPONENT — Source mix / independence + annotated source view
   ========================================================================== */

.insight-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}
.insight-head h3 { margin: 0; color: var(--text-strong); font-size: var(--text-xl); }
.insight-sub { font-size: var(--text-2xs); color: var(--text-muted); }

.insight-note {
    margin: 1rem 0 0;
    font-size: var(--text-2xs);
    color: var(--text-muted);
    line-height: var(--lh-snug);
    display: flex;
    gap: 0.45rem;
    max-width: var(--measure-read);
}
.insight-note i { color: var(--accent-fg); margin-top: 0.15rem; }

/* ---- Source mix --------------------------------------------------------
   The headline numbers are sources vs INDEPENDENT VOICES. "16 sources" is a
   volume metric and volume is easy to fake — one wire story carried by eight
   outlets is one voice. The gap between the two figures is the interesting
   part, so the two sit side by side and the second is annotated. */
.mix-stat-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 0.7rem;
    margin-bottom: 1.1rem;
}
.mix-stat {
    padding: 0.8rem 0.9rem;
    background: var(--surface-3);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
}
.mix-num {
    font-size: var(--text-2xl);
    font-weight: var(--fw-bold);
    color: var(--text-strong);
    line-height: 1;
    font-variant-numeric: tabular-nums;
}
.mix-lbl {
    font-size: var(--text-3xs);
    font-weight: var(--fw-semibold);
    text-transform: uppercase;
    letter-spacing: var(--ls-caps);
    color: var(--text-muted);
    margin-top: 0.35rem;
}
.mix-sub {
    display: block;
    font-size: var(--text-2xs);
    text-transform: none;
    letter-spacing: 0;
    color: var(--text-muted);
    margin-top: 0.25rem;
    line-height: var(--lh-snug);
}

.mix-group { margin-bottom: 0.9rem; }
.mix-group:last-of-type { margin-bottom: 0; }
.mix-group h4 {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0 0 0.45rem;
    font-size: var(--text-3xs);
    font-weight: var(--fw-bold);
    text-transform: uppercase;
    letter-spacing: var(--ls-caps);
    color: var(--text-tertiary);
}
.mix-cav {
    font-size: var(--text-3xs);
    font-weight: var(--fw-semibold);
    color: var(--warning-fg);
    background: var(--warning-bg);
    border: 1px solid var(--warning-border);
    padding: 0.02rem 0.4rem;
    border-radius: var(--radius-pill);
    text-transform: uppercase;
    letter-spacing: var(--ls-wide);
}

.mix-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.mix-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: var(--text-2xs);
    color: var(--text-secondary);
    background: var(--surface-3);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 0.2rem 0.65rem;
}
.mix-chip .mix-v {
    font-weight: var(--fw-bold);
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

/* ---- Annotated source -------------------------------------------------- */
.annotated-text {
    background: var(--surface-input);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 1.15rem;
    font-size: var(--text-md);
    line-height: 1.9;
    white-space: pre-wrap;
    color: var(--text-primary);
    max-height: 480px;
    overflow-y: auto;
    max-width: var(--measure-read);
}
.annotated-text[hidden] { display: none; }

/* Highlights carry a verdict glyph as generated content, so the annotation
   still reads as supported/disputed/unsupported in greyscale or high contrast. */
.anno {
    color: inherit;
    padding: 0.05rem 0.15rem;
    border-radius: 3px;
    cursor: pointer;
    border-bottom: 2px solid;
    background: transparent;
    font: inherit;
}
.anno::after {
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 0.72em;
    margin-left: 0.25em;
    vertical-align: 0.1em;
}
.anno.v-supported {
    background: var(--verdict-supported-bg);
    border-bottom-color: var(--verdict-supported-solid);
}
.anno.v-supported::after { content: '\f058'; color: var(--verdict-supported-fg); }

.anno.v-disputed {
    background: var(--verdict-disputed-bg);
    border-bottom-color: var(--verdict-disputed-solid);
}
.anno.v-disputed::after { content: '\f071'; color: var(--verdict-disputed-fg); }

.anno.v-unsupported {
    background: var(--verdict-unsupported-bg);
    border-bottom-color: var(--verdict-unsupported-solid);
}
.anno.v-unsupported::after { content: '\f057'; color: var(--verdict-unsupported-fg); }

.anno.v-insufficient {
    background: var(--verdict-insufficient-bg);
    border-bottom-color: var(--verdict-insufficient-solid);
}
.anno.v-insufficient::after { content: '\f059'; color: var(--verdict-insufficient-fg); }