/* Tarjetas compactas de medios. Utiliza los tokens y movimiento de Delta. */
.d-stories-grid { align-items: start; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); }
.d-story-card {
  align-self: start;
  justify-content: flex-start;
  min-height: 0;
  border: none;
  gap: var(--space-16);
  transition: box-shadow var(--dur-hover) var(--ease-hover), transform var(--dur-hover) var(--ease-hover);
}
.d-story-card:hover { box-shadow: var(--shadow-elevated); transform: translateY(calc(var(--space-2) * -1)); }
.d-story-card > * { flex-grow: 0; min-width: 0; }
.d-story-card .d-story-summary { margin: 0; }
.d-story-card .d-story-meta { margin-bottom: var(--space-8); flex-wrap: wrap; }
.media-story-heading { display: flex; align-items: center; gap: var(--space-8); flex-wrap: wrap; }
.media-note-count { color: var(--text-secondary); font-size: var(--space-12); font-weight: var(--weight-semibold); }
.media-outlet-coverage { display: flex; flex-direction: column; gap: var(--space-8); }
.media-coverage-label, .media-article-list-label { color: var(--text-secondary); font-size: var(--space-12); font-weight: var(--weight-semibold); }
.media-outlet-strip { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-8); }
.media-outlet-mark { display: inline-flex; align-items: center; gap: var(--space-6); padding: var(--space-4) var(--space-8) var(--space-4) var(--space-4); max-width: 100%; border-radius: var(--radius-full); color: var(--text-primary); background: var(--surface-card-elevated); text-decoration: none; transition: background-color var(--dur-hover) var(--ease-hover), transform var(--dur-hover) var(--ease-hover); }
.media-outlet-mark:hover { background: var(--surface-highlight); text-decoration: none; transform: translateY(calc(var(--space-2) * -1)); }
.media-outlet-mark:focus-visible, .media-more-articles > summary:focus-visible { outline: var(--space-2) solid var(--border-focus); outline-offset: var(--space-4); }
.media-outlet-symbol { position: relative; display: inline-grid; place-items: center; width: var(--space-32); height: var(--space-32); flex-shrink: 0; background: var(--surface-bg-primary); border-radius: var(--radius-full); overflow: hidden; }
.media-outlet-initials { font-size: var(--space-10); font-weight: var(--weight-bold); color: var(--text-secondary); }
.media-outlet-favicon { position: absolute; inset: var(--space-6); width: var(--space-20); height: var(--space-20); object-fit: contain; background: var(--surface-bg-primary); }
.media-outlet-favicon[hidden] { display: none; }
.media-outlet-label { font-size: var(--space-10); font-weight: var(--weight-semibold); overflow-wrap: anywhere; }
.media-article-list-label { display: block; margin-bottom: var(--space-8); }
.media-more-articles { margin-top: var(--space-8); border-radius: var(--radius-md); }
.media-more-articles > summary { cursor: pointer; color: var(--text-brand); font-size: var(--space-12); font-weight: var(--weight-bold); padding: var(--space-10) var(--space-12); border-radius: var(--radius-md); background: var(--brand-bg); transition: background-color var(--dur-hover) var(--ease-hover); }
.media-more-articles > summary::marker { color: var(--text-brand); }
.media-more-count { float: right; font-size: var(--space-10); }
.media-more-expanded, .media-more-articles[open] .media-more-collapsed, .media-more-articles[open] .media-more-count { display: none; }
.media-more-articles[open] .media-more-expanded { display: inline; }
.media-more-content { padding-top: var(--space-8); }
.story-outlet-title { overflow-wrap: anywhere; }
.story-outlet-name { flex-wrap: wrap; }
@supports (interpolate-size: allow-keywords) {
  .media-more-articles { interpolate-size: allow-keywords; }
  .media-more-articles::details-content { block-size: 0; opacity: 0; overflow: clip; transition: block-size var(--dur-layout) var(--ease-layout), opacity var(--dur-enter) var(--ease-enter), content-visibility var(--dur-layout) allow-discrete; }
  .media-more-articles[open]::details-content { block-size: auto; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .d-story-card, .media-outlet-mark, .media-more-articles > summary, .media-more-articles::details-content { transition: none; transform: none; }
  .d-story-card:hover, .media-outlet-mark:hover { transform: none; }
}
.media-bias { background: var(--surface-bg-secondary); border-radius: var(--radius-lg); padding: var(--space-16); }
.media-bias-header { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-8); }
.media-bias-header h4 { font-size: var(--space-14); font-weight: var(--weight-bold); margin: 0; color: var(--text-primary); }
.media-bias-header > span, .media-bias-explainer { font-size: var(--space-10); color: var(--text-secondary); }
.media-bias-explainer { margin: var(--space-6) 0 var(--space-12); line-height: 1.5; }
.media-bias-bar { display: flex; min-height: var(--space-32); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface-card-elevated); }
.media-bias-segment { display: grid; place-items: center; font-size: var(--space-10); font-weight: var(--weight-bold); white-space: nowrap; overflow: hidden; }
.bias-left { background: var(--status-error-bg); color: var(--status-error-text); }
.bias-center { background: var(--surface-card); color: var(--text-primary); }
.bias-right { background: var(--status-info-bg); color: var(--status-info-text); }
.media-bias-no-data { font-size: var(--space-10); padding: var(--space-8); color: var(--text-secondary); }
.media-bias-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-12); margin-top: var(--space-12); align-items: start; }
.media-bias-column { display: flex; flex-direction: column; align-items: center; min-width: 0; gap: var(--space-8); }
.media-bias-column-title { font-size: var(--space-10); color: var(--text-secondary); display: flex; gap: var(--space-6); align-items: center; }
.media-bias-column-title strong { color: var(--text-primary); }
.media-bias-stack { display: flex; flex-direction: column; align-items: center; gap: var(--space-8); padding: var(--space-10); border-radius: var(--radius-3xl); width: 100%; min-width: 0; }
.media-bias-stack .media-outlet-mark { flex-direction: column; background: transparent; padding: 0; gap: var(--space-4); }
.media-bias-stack .media-outlet-symbol { width: var(--space-40); height: var(--space-40); background: var(--surface-card); }
.media-bias-stack .media-outlet-favicon { width: var(--space-24); height: var(--space-24); inset: var(--space-8); background: var(--surface-card); }
.media-bias-stack .media-outlet-label { font-size: var(--space-10); text-align: center; line-height: 1.3; }
.media-bias-empty { color: var(--text-secondary); font-size: var(--space-10); padding: var(--space-10) 0; }
.media-bias-extra { margin-top: var(--space-12); display: flex; flex-direction: column; gap: var(--space-8); }
.media-extra-outlets { font-size: var(--space-10); color: var(--text-secondary); text-align: center; }
.media-extra-outlets > summary { cursor: pointer; padding: var(--space-4) var(--space-8); border-radius: var(--radius-full); background: var(--surface-card-elevated); color: var(--text-primary); }
.media-extra-outlets[open] > summary { margin-bottom: var(--space-8); }
.media-extra-outlets .media-outlet-mark { margin-bottom: var(--space-8); }
.media-extra-outlets > summary:focus-visible { outline: var(--space-2) solid var(--border-focus); outline-offset: var(--space-4); }
.media-compact-story { gap:var(--space-12); }
.media-compact-story .d-story-headline { margin:0; }
.media-compact-story .d-story-headline a { color:var(--text-primary); text-decoration:none; }
.media-compact-story .d-story-headline a:hover { color:var(--text-brand); }
.media-compact-outlets { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-8); }
.media-compact-caption { margin:0; color:var(--text-secondary); font-size:var(--space-12); }
.media-compact-bar { margin:0; }
.media-story-open { color:var(--text-brand); font-size:var(--space-12); font-weight:var(--weight-semibold); text-decoration:none; }
