/* Shared metadata rhythm for post cards, homepage stories and archives. */
.card .card__meta,
.samurai-card .sc-card__meta,
.hp-latest-cinema .hp-story__details,
.archive-story .archive-story__meta {
 --meta-ink:var(--card-muted,#aeb8c4);
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 justify-content:flex-start;
 gap:6px 0;
 min-inline-size:0;
 margin:0;
 color:var(--meta-ink);
 font-family:Heebo,Arial,sans-serif;
 font-size:11px;
 font-weight:400;
 font-variant-numeric:tabular-nums;
 letter-spacing:0;
 line-height:18px;
 white-space:normal;
}
.samurai-card .sc-card__meta,
.hp-latest-cinema .hp-story__details,
.archive-story .archive-story__meta { --meta-ink:#aeb8c4; }

:is(.card .card__meta,.samurai-card .sc-card__meta,.hp-latest-cinema .hp-story__details,.archive-story .archive-story__meta) > :where(span,a,time):not(.card__sep) {
 position:relative;
 display:inline-flex;
 flex:0 0 auto;
 align-items:center;
 justify-content:flex-start;
 gap:5px;
 min-inline-size:0;
 min-block-size:18px;
 padding:0;
 border:0;
 color:inherit;
 font-size:inherit;
 font-weight:inherit;
 line-height:inherit;
 white-space:nowrap;
 unicode-bidi:isolate;
}
/* A short divider belongs to its item, so wrapped lines never begin with one. */
:is(.card .card__meta,.samurai-card .sc-card__meta,.hp-latest-cinema .hp-story__details,.archive-story .archive-story__meta) > :where(span,a,time):not(.card__sep):not(:last-child)::after {
 content:"";
 flex:none;
 inline-size:1px;
 block-size:10px;
 margin-inline:5px 10px;
 background:currentColor;
 opacity:.22;
}
:is(.card .card__meta,.samurai-card .sc-card__meta,.hp-latest-cinema .hp-story__details,.archive-story .archive-story__meta) .icon {
 display:block;
 align-self:center;
 margin:0;
 flex:none;
 inline-size:14px;
 block-size:14px;
 stroke-width:1.5;
 color:inherit;
 opacity:.8;
}
:is(.card .card__meta,.samurai-card .sc-card__meta,.hp-latest-cinema .hp-story__details,.archive-story .archive-story__meta) :is(time,.card__time,.hp-story__read) {
 color:inherit;
 font-size:inherit;
 font-weight:inherit;
 line-height:inherit;
 direction:inherit;
}
.samurai-card:not(.samurai-card--panorama) .sc-card__footer {
 gap:10px;
 padding-block-start:12px;
 border-block-start:1px solid rgb(174 184 196 / 14%);
}
.hp-latest-cinema .hp-story__details,
.archive-story .archive-story__meta {
 padding-block-start:12px;
 border-block-start:1px solid rgb(174 184 196 / 14%);
}
.samurai-card .sc-card__meta { flex:1 1 170px; }
.samurai-card--featured .sc-card__meta { justify-content:flex-start; }
.samurai-card--mini .sc-card__meta { flex-basis:70px; }
.samurai-card .sc-card__meta .sc-card__author img,
.card .card__meta .card__avatar { flex:none; }
.hp-latest-cinema .hp-story__body { container-name:post-card-body; }
.hp-latest-cinema .hp-story__details .post-meta-short { display:none; }
@container post-card-body (max-width:250px) {
 .hp-latest-cinema .hp-story__details { flex-wrap:nowrap; font-size:10px; }
 .hp-latest-cinema .hp-story__details > :is(span,a) { gap:3px; }
 .hp-latest-cinema .hp-story__details .icon { inline-size:12px; block-size:12px; }
 .hp-latest-cinema .hp-story__details > :is(span,a):not(:last-child)::after { margin-inline:0 4px; }
 .hp-latest-cinema .hp-story__details .post-meta-short { display:inline; }
 .hp-latest-cinema .hp-story__details .post-meta-long { position:absolute; inline-size:1px; block-size:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
}

/* Heebo's visible glyphs sit slightly above the centre of its line box. */
.post-card :is(.sc-card__meta,.hp-story__details) .post-meta-text {
 display:block; align-self:center; margin:0; padding:0;
 font-family:inherit; font-size:inherit; font-weight:400; line-height:18px;
 transform:translateY(1px);
}
.post-card .hp-story__details .post-meta-short { display:none; }
@container post-card-body (max-width:250px) {
 .post-card .hp-story__details .post-meta-short { display:block; }
}
@container samurai-card (max-width:460px) {
 .samurai-card--list .sc-card__meta > .sc-card__read { display:none; }
 .samurai-card:is(.samurai-card--list,.samurai-card--mini) .sc-card__meta { flex:1 1 auto; }
}
@container samurai-card (max-width:260px) {
 .samurai-card:not(.samurai-card--panorama) .sc-card__footer { gap:4px; padding-block-start:8px; }
 .samurai-card .sc-card__meta > .sc-card__date { display:none; }
 .samurai-card .sc-card__meta { font-size:10px; }
 .samurai-card .sc-card__meta .icon { inline-size:12px; block-size:12px; }
}

/* Reading stays on the metadata baseline, without a separate CTA row. */
.post-card .post-card-meta-strip {
 display:flex; flex-wrap:nowrap; align-items:center; gap:8px;
 min-inline-size:0; margin-block-start:auto; padding-block-start:12px;
 border-block-start:1px solid rgb(174 184 196 / 14%);
}
.post-card:not(.samurai-card--panorama) .post-card-meta-strip { position:relative; }
.post-card:not(.samurai-card--panorama) .post-card-meta-strip::before {
 content:""; position:absolute; inset-block-start:-1px; inset-inline-start:0;
 inline-size:24px; block-size:2px; border-radius:1px; background:var(--c-crimson);
 pointer-events:none; transition:background-color .2s ease;
}
.post-card.samurai-card:is(.samurai-card--portrait,.samurai-card--video,.samurai-card--tall,.samurai-card--standard,.samurai-card--brief,.samurai-card--mini,.samurai-card--list,.samurai-card--gallery):is(:hover,:focus-within) .post-card-meta-strip::before { background:#fff; }
.post-card-meta-strip > :is(.sc-card__meta,.hp-story__details) { flex:1 1 0; min-inline-size:0; padding:0; border:0; }
.post-card .post-card-meta-strip > .sc-card__meta { flex-basis:0; }
.samurai-card--landscape .sc-card__meta { flex-wrap:nowrap; }
.samurai-card--landscape .sc-card__meta > .sc-card__date { flex-shrink:1; min-inline-size:0; }
.samurai-card--landscape .sc-card__date .post-meta-text { min-inline-size:0; overflow:hidden; text-overflow:ellipsis; }
/* The publication date stays visible in compact horizontal cards. */
@container samurai-card (max-width:260px) {
 .samurai-card--landscape .sc-card__meta > .sc-card__date { display:inline-flex; }
 .samurai-card:is(.samurai-card--podcast,.samurai-card--gallery,.samurai-card--tool,.samurai-card--video,.samurai-card--brief,.samurai-card--list,.samurai-card--mini) .sc-card__meta > .sc-card__date { display:inline-flex; }
}
.post-card .post-card-action {
 position:relative; z-index:5; display:inline-grid; place-items:center; flex:0 0 28px;
 inline-size:28px; block-size:28px; padding:0; margin-inline-start:auto;
 border:1px solid rgb(255 255 255 / 14%); border-radius:7px;
 background:rgb(255 255 255 / 4%); color:var(--c-crimson); box-shadow:none;
 line-height:1;
 text-decoration:none; transition:background-color .18s,border-color .18s;
}
.post-card .post-card-action > .icon { display:block; place-self:center; inline-size:14px; block-size:14px; margin:0; padding:0; stroke-width:1.35; transform:var(--icon-direction,none); }
.post-card .post-card-action:hover { background:rgb(255 255 255 / 9%); border-color:rgb(255 255 255 / 24%); color:color-mix(in srgb,var(--c-crimson) 82%,#fff); }
.post-card .post-card-action:focus-visible { outline:2px solid #ff5264; outline-offset:3px; }
.samurai-card--panorama .post-card-meta-strip { border:0; padding:0; }
@container samurai-card (max-width:460px) { .samurai-card--featured .sc-card__author { display:none; } }
@container samurai-card (max-width:260px) {
 .post-card .post-card-meta-strip { gap:4px; }
 .post-card .post-card-action { flex-basis:24px; inline-size:24px; block-size:24px; }
}
@container post-card-body (max-width:250px) {
 .post-card .post-card-meta-strip { gap:4px; }
 .post-card .post-card-action { flex-basis:24px; inline-size:24px; block-size:24px; }
 .hp-latest-cinema .hp-story__details { flex-wrap:wrap; }
}
