/* ICS read aloud (P14, speed stepper P20): panel controls and current-chunk highlight (assets/js/ics-read.js).
   Tokens only; the stepper buttons reuse .ics-a11y-tb (48px, same as A−/A+). */
.ics-read-ctrls[hidden] { display: none; }
.ics-read-ctrls { flex-wrap: wrap; gap: var(--sp-xs); }
.ics-read-ctrls .ics-a11y-tb[aria-pressed="true"] { outline: 2px solid currentColor; outline-offset: 2px; }
.ics-read-stepper { gap: var(--sp-xs); }
.ics-read-rate-val {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 3.5rem;
  font-family: var(--ff-mono);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--neutral-850);
  white-space: nowrap;
}
.ics-read-status {
  margin: 0;
  padding: 0;
  font-family: var(--ff-mono);
  font-size: 0.8125rem;
  color: var(--neutral-850);
  min-height: 0;
}
.ics-read-status:not(:empty) { padding: var(--sp-2xs) 0; }
.ics-read-current {
  outline: 3px solid var(--ics-read-hl, #b45309);
  outline-offset: 4px;
  background-color: var(--ics-read-hl-bg, rgba(180, 83, 9, 0.12));
  border-radius: 4px;
}
@media (prefers-contrast: more) { .ics-read-current { outline-width: 4px; background-color: transparent; } }
@media (prefers-reduced-motion: reduce) { .ics-read-ctrls *, .ics-read-current { transition: none !important; } }
html[data-ics-motion="reduce"] .ics-read-current { transition: none; }

/* H123 C26 (2026-11-11, Figma sticker 2148:19614, frame 2136:19411): single news post. Head (category chip, title, excerpt) left aligned as in the design; banner image full viewport width (100vw, bleeds out of the 87.5 percent container; torn bottom mask stays, height 556 stays). Scope body.single-post (EN posts too). */
html body.single-post #brxe-ct0001 { align-items: flex-start !important; text-align: left !important; }
html body.single-post #brxe-exc001 { max-width: var(--measure-intro, 54rem); text-align: left !important; margin-inline: 0 !important; }
html body.single-post #brxe-hx1001 { text-align: left !important; }
html body.single-post #brxe-img001#brxe-img001 { width: 100vw !important; max-width: none !important; margin-left: calc(50% - 50vw) !important; margin-right: 0 !important; }
html body.single-post #brxe-rt0001 { overflow-x: clip; }

/* H124 C29 (2026-11-11, Figma sticker 2148:19614, frame 2136:19429): single post reading column typography. Section headings in the body = EB Garamond 400 36/40 -0.54px (design Phan bai viet content-block), paragraphs 16/24, 8px paragraph gap, colour neutral-850. Scope body.single-post .brxe-post-content (EN posts too). */
html body.single-post .brxe-post-content h2 { font-family: "EB Garamond", Georgia, serif; font-weight: 400; font-size: 2.25rem; line-height: 2.5rem; letter-spacing: -0.54px; margin: var(--sp-xl) 0 var(--sp-xs); }
html body.single-post .brxe-post-content h2:first-child { margin-top: 0; }
html body.single-post .brxe-post-content p { font-size: 1rem; line-height: 1.5rem; margin: 0 0 var(--sp-xs); }
@media (max-width: 767px) { html body.single-post .brxe-post-content h2 { font-size: 1.75rem; line-height: 2rem; } }
