/* /news: the throat chakra's page (aspect swell). A region's posts (includes/views/news.php) as one flowing list on the temple black: the date and
   its kind in the margin, the title in the voice, the summary beneath, a hairline between rows; a cover, when a post has one, sits whole beside it.
   The category filter is a row of plain links (?category=), so the page needs no script. The whole row opens the post through the title link's touch
   area. No boxes, no cards. The page wears Temple Dark in both themes. Tokens only. No horizontal scroll from 320px. */
.nw-world { --ck: var(--ck-throat); --nw-pad: max(var(--ds-gutter, 1rem), calc((100% - 72rem) / 2)); font-family: var(--ds-font-ui); font-size: var(--ds-text-md); line-height: var(--ds-leading-normal); color: var(--ds-text); min-inline-size: 0; overflow-x: clip; }
.nw-world :is(a, button):focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 3px; border-radius: var(--ds-radius-sm); }
.nw-world .ds-chakra-beat { box-sizing: border-box; padding-inline: var(--nw-pad); padding-block: clamp(3.5rem, 11vh, 7rem) 0; }
.nw-world .ds-chakra-beat > * { max-inline-size: none; margin-inline: 0; }
.nw-world .ds-chakra-beat--rule { border-block-start: 0; }
.nw-world .nw-open { display: flex; align-items: center; min-block-size: min(36rem, 72svh); padding-block: calc(var(--ds-header-h) + var(--ds-space-8)) var(--ds-space-6); }
.nw-col { display: flex; flex-direction: column; gap: var(--ds-space-5); min-inline-size: 0; max-inline-size: 38rem; }
.nw-col--wide { max-inline-size: none; }
.nw-world .ds-chakra-beat--rule > .nw-col { padding-block-start: var(--ds-space-4); border-block-start: 1px solid var(--ds-border); }
.nw-world .nw-why { padding-block: var(--ds-space-8) clamp(3rem, 9vh, 6rem); }

.nw-title, .nw-card__title, .nw-empty__h, .nw-sec, .nw-note__title { font-family: var(--ds-font-display); font-weight: 500; color: var(--ds-text); text-wrap: balance; }
.nw-title { margin: 0; font-size: clamp(2.7rem, 1.8rem + 4.6vw, 5.6rem); line-height: .98; letter-spacing: -.012em;
  text-shadow: 0 0 2.2rem color-mix(in srgb, var(--ck) 38%, transparent), 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
.nw-lede { margin: 0; max-inline-size: 34rem; font-size: var(--ds-text-lg); text-wrap: pretty; }
.nw-world :is(p, li, time, .nw-chip) { text-shadow: 0 0 .7rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent), 0 0 .2rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }

/* the filter: text with a hairline under the row, the chosen one ivory with an amber rule */
.nw-chips { display: flex; flex-wrap: wrap; gap: 0 var(--ds-space-5); border-block-end: 1px solid var(--ds-border); }
.nw-chip { position: relative; display: inline-flex; align-items: center; min-block-size: 44px; margin-block-end: -1px; padding: 0; color: var(--ds-text-muted); text-decoration: none; white-space: nowrap;
  border-block-end: 2px solid transparent; transition: color var(--ds-dur-base) linear, border-color var(--ds-dur-base) linear; }
.nw-chip[aria-current="page"] { color: var(--ds-text); border-block-end-color: var(--ds-accent); }
@media (hover: hover) and (pointer: fine) { .nw-chip:hover { color: var(--ds-text); border-block-end-color: var(--ds-border); } .nw-chip[aria-current="page"]:hover { border-block-end-color: var(--ds-accent); } }

/* the posts: one row each */
.nw-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.nw-card { position: relative; min-inline-size: 0; border-block-start: 1px solid var(--ds-border); }
.nw-card:first-child { border-block-start: 0; }
.nw-card > article { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-2); padding-block: var(--ds-space-7); }
.nw-card__body { display: contents; }
.nw-card__media { margin-block-end: var(--ds-space-3); }
.nw-card__media img { display: block; inline-size: 100%; max-inline-size: 28rem; block-size: auto; aspect-ratio: 16 / 9; object-fit: contain; object-position: left center; }
.nw-card__meta { display: grid; gap: var(--ds-space-1); margin: 0; font-size: var(--ds-text-sm); color: var(--ds-text-muted); font-variant-numeric: lining-nums tabular-nums; }
.nw-card__meta time { color: var(--ds-text); font-size: var(--ds-text-md); }
.nw-tag { color: var(--ds-accent); }
.nw-card__title { margin: 0; font-size: var(--ds-text-2xl); line-height: var(--ds-leading-tight); overflow-wrap: break-word; }
.nw-card__title a { color: var(--ds-text); text-decoration: none; }
/* the whole row opens the post: the title link's touch area covers it */
.nw-card__title a::after { content: ""; position: absolute; inset: 0; }
.nw-card__title a:focus-visible { outline: none; }
.nw-card:has(.nw-card__title a:focus-visible) { outline: 2px solid var(--ds-focus); outline-offset: -2px; }
@media (hover: hover) and (pointer: fine) { .nw-card:hover .nw-card__title a { color: var(--ds-accent); } }
.nw-card__summary { margin: 0; max-inline-size: 60ch; line-height: 1.7; color: var(--ds-text-muted); overflow-wrap: anywhere; }

.nw-empty { max-inline-size: 40rem; margin: 0; padding: var(--ds-space-5) 0; border-block: 1px solid var(--ds-border); }
.nw-empty__h { margin: 0 0 var(--ds-space-2); font-size: var(--ds-text-2xl); }
.nw-empty p { margin: 0; color: var(--ds-text-muted); }
.nw-empty p.nw-empty__h { color: var(--ds-text); }
.nw-more { display: inline-flex; align-items: center; min-block-size: 44px; font-weight: 600; color: var(--ds-accent); text-underline-offset: .2em; }
.nw-world .story-trust { text-shadow: 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent); }

/* the live announcements: a short run of plain rows above the posts, the same hairlines, no boxes */
.nw-world .nw-notices { padding-block-start: var(--ds-space-8); }
.nw-world .nw-notices + .nw-body { padding-block-start: var(--ds-space-8); }
.nw-sec { margin: 0; font-size: var(--ds-text-2xl); line-height: var(--ds-leading-tight); }
.nw-notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.nw-note { display: grid; gap: var(--ds-space-2); padding-block: var(--ds-space-6); border-block-start: 1px solid var(--ds-border); min-inline-size: 0; }
.nw-note:first-child { border-block-start: 0; padding-block-start: var(--ds-space-3); }
.nw-note__title { margin: 0; font-size: var(--ds-text-xl); line-height: var(--ds-leading-tight); overflow-wrap: break-word; }
.nw-note__body { margin: 0; max-inline-size: 60ch; line-height: 1.7; color: var(--ds-text-muted); overflow-wrap: anywhere; }
.nw-note__link { margin: 0; }

@media (min-width: 48rem) {
  .nw-card > article { grid-template-columns: minmax(8rem, 11rem) minmax(0, 1fr); grid-template-areas: "meta title" "meta summary"; column-gap: var(--ds-space-8); row-gap: var(--ds-space-2); align-content: start; }
  .nw-card__meta { grid-area: meta; align-self: start; padding-block-start: .35rem; }
  .nw-card__title { grid-area: title; }
  .nw-card__summary { grid-area: summary; }
  .nw-card--cover > article { grid-template-columns: minmax(8rem, 11rem) minmax(0, 1fr) minmax(10rem, 16rem); grid-template-areas: "meta title media" "meta summary media"; }
  .nw-card__media { grid-area: media; align-self: start; margin: 0; }
}
@media (prefers-reduced-motion: reduce) { .nw-chip { transition: none; } }