/* Native categories and New share normal document flow, so expiry leaves no empty slot.
   Palette colors come from the identity and home palettes; yellow belongs only to New. */
.article-badges {
  --category-0: #30d2d4;
  --category-1: oklch(0.92 0.07 160);
  --category-2: oklch(0.88 0.06 295);
  --category-3: oklch(0.92 0.06 225);
  --category-4: oklch(0.86 0.08 35);
  --category-5: oklch(0.88 0.03 240);
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; max-width: 100%;
}
.article-badges[data-badge-brand="leh"] {
  --category-0: #ffc8c2;
  --category-1: oklch(0.88 0.06 295);
  --category-2: oklch(0.9 0.09 160);
  --category-3: oklch(0.86 0.08 35);
  --category-4: oklch(0.9 0.05 195);
  --category-5: oklch(0.88 0.03 240);
}
.card-category[data-category-color="0"] { --category-color: var(--category-0); }
.card-category[data-category-color="1"] { --category-color: var(--category-1); }
.card-category[data-category-color="2"] { --category-color: var(--category-2); }
.card-category[data-category-color="3"] { --category-color: var(--category-3); }
.card-category[data-category-color="4"] { --category-color: var(--category-4); }
.card-category[data-category-color="5"] { --category-color: var(--category-5); }
.card-category, .article-new { display: inline-flex; align-items: center; justify-content: center; max-width: 100%; min-width: 0; padding: 4px 12px; border: 2px solid #181818; border-radius: 0; color: #100c07; font-size: 12px; font-weight: 700; line-height: 16px; overflow-wrap: anywhere; }
.card-category { background: var(--category-color, #30d2d4); }
/* New retains its exclusive yellow regardless of the site preset. */
.article-new { background: #ffe07b; background: oklch(91% .145 92); }
.article-badges a.card-category { color: #100c07; text-decoration: none; }
.article-badges a.card-category:focus-visible { outline: 3px solid #100c07; outline-offset: 4px; }
.article-badges:not(:has(> :not([hidden]))) { display: none; }
.article-badges [hidden], .article-new[hidden] { display: none !important; }
.article-read { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; padding: 3px 10px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); font-size: 12px; cursor: pointer; }
.article-read:hover { background: var(--surface); }
.article-read:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
:is(.content-card, .featured-card).is-read { background: color-mix(in srgb, var(--ink) 9%, transparent); }
:is(.content-card, .featured-card).is-read :is(.card-image, .featured-image) { filter: saturate(.55); }
.leh-card article.is-read .leh-cover img { filter: saturate(.5) brightness(.84); }
.leh-card article > .article-badges { position: absolute; inset-block-start: 12px; inset-inline: 12px; z-index: 1; gap: 6px; pointer-events: none; }
.leh-card .article-read { pointer-events: auto; }
.article-header { position: relative; }
.article-page.is-read .article-body { opacity: 1; }
#live-results li.is-read { background: color-mix(in srgb, var(--ink) 9%, transparent); }
#live-results .article-new { padding: 2px 7px; margin-inline-end: 8px; vertical-align: baseline; font-size: 11px; }

/* The Leh wordmark occupies the same category row without a second site identity. */
/* Preserve the complete uploaded logo, including its dots and ascenders. */
.article-badges .card-category.card-category-leh { background: transparent; border: 0; box-shadow: none; padding: 0; flex: 0 0 44px; width: 44px; height: 32px; }
.card-category-leh img { display: block; width: 100%; height: 100%; object-fit: contain; }