@layer pages {
  .prose { --art: 46rem; display: grid; grid-template-columns: [full-start] minmax(var(--gutter), 1fr) [c-start] minmax(0, var(--art)) [c-end] minmax(var(--gutter), 1fr) [full-end]; padding-block: var(--s-8) var(--sec-y); }
  .prose > * { grid-column: c; min-inline-size: 0; }
  .prose > .ux-cta, .prose > .post-more { grid-column: full; }
  .tldr { margin-block-end: var(--s-7); padding-block: var(--s-6); border-block: 1px solid var(--line-gold); font-size: var(--t-lg); line-height: 1.55; color: var(--white); font-weight: 300; }
  .tldr b { display: block; font: 400 var(--t-xs)/1 var(--f-mono); letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-block-end: var(--s-4); }
  .ux-toc { margin-block-end: var(--s-7); }
  .ux-toc[hidden] { display: none; }
  .ux-toc summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; min-block-size: 2.75rem; align-items: center; font: 400 var(--t-xs)/1 var(--f-mono); letter-spacing: .22em; text-transform: uppercase; color: var(--gold); border-block-end: 1px solid var(--line); }
  .ux-toc summary::-webkit-details-marker { display: none; }
  .ux-toc summary::after { content: "+"; font-size: 1.4rem; transition: transform .4s var(--ease); }
  .ux-toc[open] summary::after { transform: rotate(45deg); }
  .ux-toc ol { margin: var(--s-4) 0 0; padding-inline-start: var(--s-6); display: grid; gap: var(--s-2); color: var(--gray-3); }
  .ux-toc a { color: var(--gray-1); text-decoration: none; display: inline-block; padding-block: var(--s-1); }
  .ux-toc a:hover, .ux-toc a.is-current { color: var(--gold-hi); }

  .article { font-size: clamp(1.0625rem, 1rem + .3vw, 1.25rem); line-height: 1.8; color: var(--gray-1); }
  .article > * + * { margin-block-start: 1.4em; }
  .article h2 { font-size: var(--t-xl); font-weight: 500; line-height: 1.1; margin-block-start: 2.6em; scroll-margin-block-start: calc(var(--header-h) + var(--s-5)); }
  .article h3 { font-size: var(--t-lg); margin-block-start: 2em; }
  .article p, .article li { color: var(--gray-1); }
  .article a { color: var(--gold-hi); }
  .article ul, .article ol { padding-inline-start: 0; list-style: none; display: grid; gap: var(--s-3); }
  .article ul li { position: relative; padding-inline-start: var(--s-6); }
  .article ul li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .95em; inline-size: var(--s-5); block-size: 1px; background: var(--gold); }
  .article ol { counter-reset: o; } .article ol li { counter-increment: o; position: relative; padding-inline-start: var(--s-7); }
  .article ol li::before { content: counter(o, decimal-leading-zero); position: absolute; inset-inline-start: 0; font: 400 var(--t-xs)/2.6 var(--f-mono); color: var(--gold); }
  .article sup a { font-size: .75em; text-decoration: none; padding-inline: .1em; }
  .article blockquote { margin-block: 2.4em; font-size: var(--t-xl); line-height: 1.25; font-weight: 300; letter-spacing: -.03em; color: var(--gold-hi); padding-inline-start: var(--s-6); border-inline-start: 1px solid var(--gold); }
  .article table { inline-size: 100%; } .article th, .article td { padding: var(--s-4) var(--s-4) var(--s-4) 0; border-block-end: 1px solid var(--line); text-align: start; vertical-align: top; }
  .article-fig { display: none; }

  .ux-cta { margin-block: var(--s-8); margin-inline: var(--s-4); padding: var(--s-8) var(--gutter); background: var(--ink-2); border-radius: var(--r-lg); display: grid; justify-items: start; gap: var(--s-5); }
  .ux-cta > * { max-inline-size: 46rem; }
  .ux-cta h3 { font-size: var(--t-2xl); font-weight: 700; letter-spacing: -.03em; line-height: 1.05; }
  .ux-cta p { color: var(--gray-2); font-size: var(--t-lg); }
  .ux-share { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-5); margin-block: var(--s-6); padding-block: var(--s-5); border-block: 1px solid var(--line); }
  .ux-share > span { font: 400 var(--t-xs)/1 var(--f-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-inline-end: var(--s-4); }
  .ux-share a, .ux-share button { min-block-size: 2.75rem; display: inline-flex; align-items: center; background: none; border: 0; border-block-end: 1px solid var(--line); color: var(--gray-1); font: 500 var(--t-xs)/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; cursor: pointer; }
  .ux-share a:hover, .ux-share button:hover { color: var(--gold-hi); border-color: var(--gold); }
  .post-faq { margin-block-start: var(--s-7); }
  .post-faq > h2 { font-size: var(--t-xl); font-weight: 500; margin-block-end: var(--s-5); }
  .post-faq__ask { margin-block-start: var(--s-5); color: var(--gray-2); }
  .post-faq__ask a { color: var(--gold-hi); }
  .refs { margin-block-start: var(--s-8); font-size: var(--t-sm); color: var(--gray-2); }
  .refs h2 { font: 400 var(--t-xs)/1 var(--f-mono); letter-spacing: .22em; text-transform: uppercase; color: var(--gold); margin-block-end: var(--s-5); }
  .refs ol { display: grid; gap: var(--s-4); padding-inline-start: var(--s-6); }
  .refs a { color: var(--gold-hi); } .refs .back { margin-inline-start: var(--s-3); text-decoration: none; }
  .refs li:target { color: var(--white); }
  .author { display: flex; gap: var(--s-5); align-items: center; margin-block-start: var(--s-8); padding-block-start: var(--s-6); border-block-start: 1px solid var(--line); }
  .author img { inline-size: 5.5rem; block-size: 5.5rem; border-radius: var(--r-lg); object-fit: cover; object-position: 50% 12%; flex: none; }
  .author .name { font-size: var(--t-lg); font-weight: 500; color: var(--white); text-decoration: none; }
  .author span { font-size: var(--t-sm); color: var(--gray-2); }
  .author .acts { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); margin-block-start: var(--s-3); }
  .author .acts a { font: 500 var(--t-xs)/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-hi); padding-block: var(--s-2); }
  .trustband--mini { margin-block-start: var(--s-6); grid-template-columns: 1fr; }
  .post-trilha { margin-block-start: var(--s-5); } .post-trilha a { color: var(--gold-hi); font-size: var(--t-sm); }
  .note { margin-block-start: var(--s-6); font-size: var(--t-sm); color: var(--gray-3); }
  .post-more { padding: var(--sec-y) var(--gutter) 0; margin-block-start: var(--s-8); border-block-start: 1px solid var(--line); }
  .post-more > h2 { font-size: var(--t-2xl); margin-block-end: var(--s-6); }
  .post-more__guide { margin-block-start: var(--s-6); } .post-more__guide a { color: var(--gold-hi); }
  @media (max-width: 36rem) { .author { align-items: flex-start; } .author img { inline-size: 4rem; block-size: 4rem; } }
}
