/* Editorial posts and feeds. Uses the network tokens (--bg, --t1, --t2, --line, --accent) with system fallbacks. */
.nxo-ed-article { color: var(--t1, CanvasText); line-height: 1.6; }
.nxo-ed-dek { font-size: 1.2em; color: var(--t2, CanvasText); }
.nxo-ed-takeaways, .nxo-ed-faq, .nxo-ed-glossary, .nxo-ed-references { margin-block: 2.5rem; }
.nxo-ed-takeaways { border-inline-start: 3px solid var(--accent, currentColor); padding-inline-start: 1rem; }
.nxo-ed-chapter { margin-block: 2.5rem; }
.nxo-ed-cite { line-height: 0; }
.nxo-ed-cite a { text-decoration: none; padding-inline: 0.1em; }
.nxo-ed-cite a:focus-visible, .nxo-ed-references a:focus-visible, .nxo-ed-card a:focus-visible { outline: 2px solid var(--accent, Highlight); outline-offset: 2px; }
.nxo-ed-figure { margin: 2rem 0; padding: 1rem; border: 1px solid var(--line, color-mix(in srgb, CanvasText 20%, transparent)); border-radius: 4px; }
.nxo-ed-stage { position: relative; aspect-ratio: 16 / 10; min-height: 240px; margin-block-end: 0.75rem; }
.nxo-ed-stage[hidden] { display: none; }
.nxo-ed-fig-text table { border-collapse: collapse; width: 100%; }
.nxo-ed-fig-text th, .nxo-ed-fig-text td { text-align: start; padding: 0.25rem 0.5rem; border-block-end: 1px solid var(--line, color-mix(in srgb, CanvasText 15%, transparent)); }
.nxo-ed-figure[data-live] .nxo-ed-fig-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nxo-ed-figure figcaption { font-size: 0.9em; color: var(--t2, CanvasText); }
.nxo-ed-fig-n { font-weight: 600; }
.nxo-ed-glossary dt { font-weight: 600; margin-block-start: 0.75rem; }
.nxo-ed-glossary dd { margin-inline-start: 0; }
.nxo-ed-references ol { padding-inline-start: 1.5rem; font-size: 0.92em; }
.nxo-ed-references li { margin-block: 0.4rem; overflow-wrap: anywhere; }
.nxo-ed-references li:target { background: color-mix(in srgb, var(--accent, Highlight) 15%, transparent); }
.nxo-ed-asof { font-size: 0.9em; color: var(--t2, CanvasText); }
.nxo-ed-cards { list-style: none; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
.nxo-ed-card { border: 1px solid var(--line, color-mix(in srgb, CanvasText 20%, transparent)); border-radius: 4px; padding: 1rem; }
.nxo-ed-card-format { margin: 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.06em; color: var(--t2, CanvasText); }
.nxo-ed-card-title { margin: 0.4rem 0; font-size: 1.1em; }
.nxo-ed-card-dek, .nxo-ed-card-asof { margin: 0.4rem 0 0; font-size: 0.92em; }
.nxo-ed-card-asof { color: var(--t2, CanvasText); }

/* Scripts. A post (or its title) in another script uses the matching IBM Plex family, the faces the pages load for that
   locale (i18n/fonts-<lang>.css, enqueued per post), with Plex Mono kept for Latin codes and numbers. Joined and
   caseless scripts drop Latin tracking and get the leading they need; CJK breaks lines strictly and Korean keeps words. */
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(ar),
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(fa),
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(ur) { font-family: "IBM Plex Sans Arabic", var(--sans, "IBM Plex Sans"), sans-serif; }
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(he) { font-family: "IBM Plex Sans Hebrew", var(--sans, "IBM Plex Sans"), sans-serif; }
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(hi) { font-family: "IBM Plex Sans", "IBM Plex Sans Devanagari", sans-serif; }
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(ja) { font-family: "IBM Plex Sans", "IBM Plex Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif; }
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(ko) { font-family: "IBM Plex Sans", "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; }
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):lang(zh-Hans) { font-family: "IBM Plex Sans", "IBM Plex Sans SC", "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif; }
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):is(:lang(ar), :lang(fa), :lang(ur), :lang(he), :lang(hi), :lang(ja), :lang(ko), :lang(zh-Hans)),
:where(.nxo-ed-article, .wp-block-post-title, .nxo-ed-card-title, .nxo-ed-card-dek):is(:lang(ar), :lang(fa), :lang(ur), :lang(he), :lang(hi), :lang(ja), :lang(ko), :lang(zh-Hans)) * { letter-spacing: 0 !important; }
.nxo-ed-article:is(:lang(ar), :lang(fa), :lang(ur)) { line-height: 1.85; }
.nxo-ed-article:is(:lang(hi), :lang(he)) { line-height: 1.8; }
.nxo-ed-article:is(:lang(ja), :lang(ko), :lang(zh-Hans)) { line-height: 1.8; line-break: strict; overflow-wrap: anywhere; }
.nxo-ed-article:lang(ko), .wp-block-post-title:lang(ko) { word-break: keep-all; }
:where(.nxo-ed-article, .wp-block-post-title):is(:lang(ar), :lang(fa), :lang(ur), :lang(he), :lang(hi)) :is(h1, h2, h3),
.wp-block-post-title:is(:lang(ar), :lang(fa), :lang(ur), :lang(he), :lang(hi)) { line-height: 1.45; }
:where(.nxo-ed-article, .wp-block-post-title):is(:lang(ja), :lang(ko), :lang(zh-Hans)) :is(h1, h2, h3),
.wp-block-post-title:is(:lang(ja), :lang(ko), :lang(zh-Hans)) { line-height: 1.35; text-wrap: balance; }
.nxo-ed-article:is(:lang(de), :lang(ru), :lang(tr), :lang(id)) :is(h1, h2, h3) { hyphens: auto; overflow-wrap: anywhere; }
/* Emphasis: CJK and Arabic have no true italics; set emphasis in weight instead of a slanted fallback. */
.nxo-ed-article:is(:lang(ar), :lang(fa), :lang(ur), :lang(he), :lang(ja), :lang(ko), :lang(zh-Hans)) :is(em, i) { font-style: normal; font-weight: 600; }
.nxo-ed-article:is(:lang(ar), :lang(fa), :lang(ur), :lang(he), :lang(ja), :lang(ko), :lang(zh-Hans)) cite { font-style: normal; }

/* Direction. Code, identifiers and the drawn stage keep left to right inside right-to-left posts; citations and
   source titles are isolated runs. Lists and borders mirror through the logical properties above; list numbers stay
   ASCII in every language, matching the citation numbers in the text. */
.nxo-ed-stage { direction: ltr; }
.nxo-ed-article :is(code, kbd, samp, pre) { direction: ltr; unicode-bidi: isolate; font-family: var(--mono, "IBM Plex Mono"), monospace; }
.nxo-ed-cite, .nxo-ed-references bdi, .nxo-ed-article time { unicode-bidi: isolate; }
.nxo-ed-references ol { list-style-type: decimal; }

@media (prefers-reduced-motion: reduce) { .nxo-ed-article * { scroll-behavior: auto; } }

/* ---------------------------------------------------------------- Page layout (story template) ----------------
   One reading column, centred. Every figure is a CAD scene of what the chapter describes, drawn at full content width
   where the text introduces it; the first opens the post under the title. A thin bar under the site header names the
   chapter in view. Ink structure; red only for signals (the format cell, the chapter number, progress, live parts). */
.nxo-ed-main-wrap, .nxo-ed-main-wrap.nxo-main { padding: 0; }
.nxo-ed-page { --ed-pad: clamp(16px, 4vw, 48px); --ed-col: 720px; --ed-wide: 1240px; --ed-top: calc(var(--space-nav-h, 64px) + 16px);
  --ed-hex: polygon(50% 0, 93.3% 25%, 93.3% 75%, 50% 100%, 6.7% 75%, 6.7% 25%);
  --ed-hex-line: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5 20.2 7.25v9.5L12 21.5 3.8 16.75v-9.5Z' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E");
  box-sizing: border-box; padding-inline: var(--ed-pad); font-family: var(--sans, "IBM Plex Sans", system-ui, sans-serif); color: var(--t1, CanvasText); line-height: 1.65; }
.nxo-ed-page *, .nxo-ed-page *::before, .nxo-ed-page *::after { box-sizing: border-box; }
/* The reading column and the wide measure both centre in the page. */
.nxo-ed-hero, .nxo-ed-main { max-width: var(--ed-col); margin-inline: auto; }
.nxo-ed-page .nxo-ed-figure { inline-size: min(var(--ed-wide), 100vw - 2 * var(--ed-pad)); margin-inline: calc((100% - min(var(--ed-wide), 100vw - 2 * var(--ed-pad))) / 2); }

/* Hero */
.nxo-ed-hero { padding-block: clamp(32px, 6vw, 80px) clamp(24px, 3vw, 40px); }
.nxo-ed-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 0; list-style: none; margin: 0 0 24px; padding: 0; font: 500 12px/1.4 var(--mono, monospace); letter-spacing: var(--track-nav, .06em); text-transform: uppercase; color: var(--t3, GrayText); }
.nxo-ed-crumbs li + li::before { content: "/"; padding-inline: 8px; color: var(--hair2, GrayText); }
.nxo-ed-crumbs a { color: inherit; text-decoration: none; }
.nxo-ed-crumbs a:hover, .nxo-ed-crumbs a:focus-visible { color: var(--t1); text-decoration: underline; }
.nxo-ed-eyebrow { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0 0 16px; font: 500 12px/1.4 var(--mono, monospace); letter-spacing: var(--track-eyebrow, .16em); text-transform: uppercase; color: var(--t3); }
.nxo-ed-eyebrow .nxo-ed-fmt { display: inline-flex; align-items: center; gap: 8px; color: var(--t1); }
.nxo-ed-eyebrow .nxo-ed-fmt::before { content: ""; inline-size: 9px; block-size: 10px; clip-path: var(--ed-hex); background: var(--accent, #FF1F1F); }
.nxo-ed-page .nxo-ed-title { margin: 0 0 20px; font-size: clamp(2.1rem, 1.2rem + 3.4vw, 4rem); line-height: 1.05; font-weight: 600; letter-spacing: var(--track-display-1, -.03em); text-wrap: balance; }
.nxo-ed-page .nxo-ed-dek { margin: 0 0 28px; font-size: clamp(1.1rem, 1rem + .5vw, 1.35rem); line-height: 1.5; color: var(--t2); letter-spacing: var(--track-lede, 0); }
.nxo-ed-meta { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; padding: 0; list-style: none; font: 400 13px/1.4 var(--mono, monospace); color: var(--t3); font-variant-numeric: tabular-nums; }
.nxo-ed-meta b { font-weight: 500; color: var(--t1); }
.nxo-ed-meta span::after { content: " ·"; }
.nxo-ed-byline { margin: 12px 0 0; font: 400 13px/1.4 var(--mono, monospace); color: var(--t3); }

/* Figures: a wide CAD stage, its caption and the text version beneath, set to the reading column. */
.nxo-ed-page .nxo-ed-figure { display: block; padding: 0; border: 0; border-radius: 0; background: none; margin-block: clamp(32px, 5vw, 56px); }
.nxo-ed-page .nxo-ed-figure .nxo-ed-stage { position: relative; aspect-ratio: 16 / 9; min-height: 280px; margin: 0; border: 1px solid var(--hair, rgba(127,127,127,.2)); border-radius: var(--r, 5px); background: var(--surface, transparent); overflow: hidden; }
.nxo-ed-page .nxo-ed-figure--hero { margin-block: 0 clamp(32px, 5vw, 64px); }
.nxo-ed-page .nxo-ed-figure--hero .nxo-ed-stage { aspect-ratio: 21 / 9; min-height: 340px; }
.nxo-ed-page .nxo-ed-figure figcaption, .nxo-ed-page .nxo-ed-fig-text { max-width: var(--ed-col); margin-inline: auto; }
.nxo-ed-page .nxo-ed-figure figcaption { display: flex; gap: 12px; align-items: baseline; padding: 14px 0 0; font-size: 15px; line-height: 1.45; color: var(--t1); }
.nxo-ed-page .nxo-ed-fig-n { flex: none; font: 500 11px/1.4 var(--mono, monospace); letter-spacing: .12em; text-transform: uppercase; color: var(--accent, #FF1F1F); }
.nxo-ed-page .nxo-ed-fig-text { padding: 6px 0 0; }
.nxo-ed-page .nxo-ed-fig-text p { margin: 0 0 .4em; font-size: 14px; line-height: 1.55; color: var(--t3); }
/* With the figure drawn, its text version stays for screen readers and search; sighted readers get the caption. */
.nxo-ed-page .nxo-ed-figure[data-live] .nxo-ed-fig-text { position: absolute !important; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.nxo-ed-page .nxo-ed-figure:not([data-live]) .nxo-ed-stage[hidden] { display: none; }

/* Reading bar */
.nxo-ed-bar { position: fixed; z-index: var(--z-sticky, 10); inset-inline: 0; inset-block-start: var(--space-nav-h, 64px); display: flex; align-items: center; gap: 12px; block-size: 40px; padding-inline: var(--ed-pad); border-block-end: 1px solid var(--hair, rgba(127,127,127,.2)); background: var(--bg, Canvas); font: 500 12px/1 var(--mono, monospace); color: var(--t2); transform: translateY(-110%); transition: transform var(--dur-base, .25s) var(--ease-standard, ease); }
body.admin-bar .nxo-ed-bar { inset-block-start: calc(var(--space-nav-h, 64px) + 32px); }
.nxo-ed-bar.on { transform: none; }
.nxo-ed-bar[hidden] { display: none; }
.nxo-ed-bar-n { color: var(--accent, #FF1F1F); letter-spacing: .12em; }
.nxo-ed-bar-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--t1); font-family: var(--sans, sans-serif); font-size: 14px; }
.nxo-ed-bar i { position: absolute; inset-inline-start: 0; inset-block-end: -1px; block-size: 2px; inline-size: 0; background: var(--accent, #FF1F1F); }

/* Body */
.nxo-ed-main { padding-block: 8px 96px; }
.nxo-ed-main > section, .nxo-ed-main > nav { margin-block-start: clamp(48px, 6vw, 80px); }
.nxo-ed-page :is(.nxo-ed-chapter, .nxo-ed-takeaways, .nxo-ed-faq, .nxo-ed-glossary, .nxo-ed-references) { scroll-margin-top: calc(var(--ed-top) + 48px); }
.nxo-ed-page :is(.nxo-ed-takeaways, .nxo-ed-toc, .nxo-ed-faq, .nxo-ed-glossary, .nxo-ed-references, .nxo-ed-related) > h2 { margin: 0 0 20px; font: 500 12px/1.4 var(--mono, monospace); letter-spacing: var(--track-eyebrow, .16em); text-transform: uppercase; color: var(--t3); }

/* Key points */
.nxo-ed-page .nxo-ed-takeaways { margin-block-end: 0; border: 0; padding: 0; }
.nxo-ed-page .nxo-ed-takeaways ol { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; counter-reset: kp; background: var(--hair, rgba(127,127,127,.2)); border: 1px solid var(--hair, rgba(127,127,127,.2)); border-radius: var(--r, 5px); overflow: hidden; }
.nxo-ed-page .nxo-ed-takeaways li { counter-increment: kp; display: grid; grid-template-columns: 2.4em 1fr; padding: 16px 20px; background: var(--bg, Canvas); line-height: 1.5; }
.nxo-ed-page .nxo-ed-takeaways li::before { content: counter(kp, decimal-leading-zero); font: 500 12px/2 var(--mono, monospace); color: var(--t3); }
.nxo-ed-page .nxo-ed-takeaways li:first-child::before { color: var(--accent, #FF1F1F); }

/* Contents */
.nxo-ed-toc ol { columns: 2 260px; column-gap: 32px; margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.nxo-ed-toc li { counter-increment: toc; break-inside: avoid; }
.nxo-ed-toc a { display: grid; grid-template-columns: 2.4em 1fr; padding-block: 7px; border-block-end: 1px solid var(--hair, rgba(127,127,127,.2)); font-size: 15px; line-height: 1.4; color: var(--t2); text-decoration: none; }
.nxo-ed-toc a::before { content: counter(toc, decimal-leading-zero); font: 400 11px/2 var(--mono, monospace); color: var(--t3); }
.nxo-ed-toc a:hover, .nxo-ed-toc a:focus-visible { color: var(--t1); }

/* Chapters */
.nxo-ed-page .nxo-ed-chapter h2 { margin: 0 0 20px; font-size: clamp(1.5rem, 1.2rem + 1.1vw, 2.1rem); line-height: 1.15; font-weight: 600; letter-spacing: var(--track-title, -.012em); text-wrap: balance; }
.nxo-ed-chn { display: flex; align-items: center; gap: 8px; margin-block-end: 10px; font: 500 12px/1 var(--mono, monospace); letter-spacing: .12em; color: var(--accent, #FF1F1F); }
.nxo-ed-chn::before { content: ""; inline-size: 11px; block-size: 12px; background: currentColor; -webkit-mask: var(--ed-hex-line) center / contain no-repeat; mask: var(--ed-hex-line) center / contain no-repeat; }
.nxo-ed-page .nxo-ed-chapter > p { margin: 0 0 1.1em; font-size: 1.0625rem; color: var(--t2); }
.nxo-ed-page .nxo-ed-chapter > p.nxo-ed-lead { font-size: 1.2rem; line-height: 1.55; color: var(--t1); }
.nxo-ed-page .nxo-ed-cite { font: 500 .68em/0 var(--mono, monospace); vertical-align: super; }

/* Questions and answers */
.nxo-ed-page .nxo-ed-qa { border-block-start: 1px solid var(--hair, rgba(127,127,127,.2)); }
.nxo-ed-page .nxo-ed-qa:last-child { border-block-end: 1px solid var(--hair, rgba(127,127,127,.2)); }
.nxo-ed-page .nxo-ed-qa summary { display: flex; gap: 16px; justify-content: space-between; align-items: baseline; padding-block: 18px; cursor: pointer; list-style: none; }
.nxo-ed-page .nxo-ed-qa summary::-webkit-details-marker { display: none; }
.nxo-ed-page .nxo-ed-qa summary::after { content: "+"; font: 400 20px/1 var(--mono, monospace); color: var(--t3); }
.nxo-ed-page .nxo-ed-qa[open] summary::after { content: "\2212"; color: var(--accent, #FF1F1F); }
.nxo-ed-page .nxo-ed-qa summary:focus-visible { outline: 2px solid var(--accent, Highlight); outline-offset: 2px; }
.nxo-ed-page .nxo-ed-qa h3 { margin: 0; font-size: 1.1rem; line-height: 1.4; font-weight: 600; }
.nxo-ed-page .nxo-ed-qa p { margin: 0 0 18px; color: var(--t2); }

/* Glossary */
.nxo-ed-page .nxo-ed-glossary dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1px; margin: 0; background: var(--hair, rgba(127,127,127,.2)); border: 1px solid var(--hair, rgba(127,127,127,.2)); border-radius: var(--r, 5px); overflow: hidden; }
.nxo-ed-page .nxo-ed-glossary dl > div { padding: 16px 18px; background: var(--bg, Canvas); }
.nxo-ed-page .nxo-ed-glossary dt { margin: 0 0 6px; font-weight: 600; }
.nxo-ed-page .nxo-ed-glossary dfn { font-style: normal; }
.nxo-ed-page .nxo-ed-glossary dd { margin: 0; font-size: 14px; line-height: 1.55; color: var(--t2); }

/* References */
.nxo-ed-page .nxo-ed-references ol { margin: 0; padding-inline-start: 2.2em; font-size: 14px; line-height: 1.55; color: var(--t2); }
.nxo-ed-page .nxo-ed-references li { padding-block: 6px; scroll-margin-top: calc(var(--ed-top) + 48px); }
.nxo-ed-page .nxo-ed-references li::marker { font: 400 12px var(--mono, monospace); color: var(--t3); }
.nxo-ed-page .nxo-ed-references li:target { outline: 1px solid var(--accent, #FF1F1F); outline-offset: 4px; border-radius: var(--rc, 4px); }
.nxo-ed-page .nxo-ed-references cite { font-style: normal; color: var(--t1); }
.nxo-ed-page .nxo-ed-references a { color: var(--t2); }
.nxo-ed-tier { display: inline-block; margin-inline-end: 6px; padding: 1px 5px; border: 1px solid var(--hair2, rgba(127,127,127,.4)); border-radius: var(--rc, 4px); font: 500 10px/1.5 var(--mono, monospace); color: var(--t3); vertical-align: 1px; }
.nxo-ed-tier[data-tier="T1"] { border-color: var(--accent, #FF1F1F); color: var(--t1); }
.nxo-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Related */
.nxo-ed-related ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.nxo-ed-related a { display: grid; gap: 8px; padding: 18px; border: 1px solid var(--hair, rgba(127,127,127,.2)); border-radius: var(--r, 5px); color: var(--t1); text-decoration: none; }
.nxo-ed-related a:hover, .nxo-ed-related a:focus-visible { border-color: var(--accent, #FF1F1F); }
.nxo-ed-related span { font: 500 11px/1 var(--mono, monospace); letter-spacing: .12em; text-transform: uppercase; color: var(--t3); }
.nxo-ed-page .nxo-ed-asof { font: 400 13px/1.4 var(--mono, monospace); color: var(--t3); }

@media (max-width: 700px) {
  .nxo-ed-page .nxo-ed-figure .nxo-ed-stage, .nxo-ed-page .nxo-ed-figure--hero .nxo-ed-stage { aspect-ratio: 4 / 3.4; min-height: 0; }
}
/* Briefs and news: smaller figures, no hero figure at full width. */
.nxo-ed--brief .nxo-ed-figure--hero .nxo-ed-stage, .nxo-ed--news .nxo-ed-figure--hero .nxo-ed-stage { aspect-ratio: 16 / 9; }
@media (prefers-reduced-motion: reduce) { .nxo-ed-bar { transition: none; } }

/* Owner rule: no CAD corner ticks. Engine releases that still draw a frame of corner marks are hidden here. */
.nxo-ed-page .st-frame { display: none; }
