/* Components of this guide. Colours, surfaces and radii come from the Content UI Kit tokens (--mcui-*, content-ui-kit/README.md);
   each fallback keeps the look on pages without the kit. Tables, lists and anchors use the blog layout. */
.blog-wrapper :is(p, li, td) { text-wrap: pretty; }
.lg-route { margin-block: 1.5rem; padding: 1rem 1.25rem; border: 1px solid var(--mcui-line, oklch(0.8 0.03 275 / 0.12)); border-radius: var(--mcui-radius, 8px); background: var(--mcui-reference, oklch(0.26 0.03 275)); }
.blog-wrapper .lg-route > p { margin: 0; font-weight: 700; color: var(--mcui-ink, oklch(0.96 0.01 275)); }
.blog-layout .blog-wrapper .lg-route ol { display: grid; gap: 0.75rem; margin: 0.85rem 0 0; padding: 0; list-style: none; }
.blog-layout .blog-wrapper .lg-route li { display: grid; grid-template-columns: 4.75rem 1fr; column-gap: 0.85rem; margin: 0; padding: 0; }
.blog-wrapper .lg-route b { font-variant-numeric: tabular-nums; color: var(--mcui-tint, oklch(0.705 0.164 288.2)); white-space: nowrap; }
.blog-wrapper .lg-route a { font-weight: 700; }
.blog-wrapper .lg-ptr { font-size: 0.875rem; color: var(--mcui-muted, oklch(0.77 0.035 275)); }
.blog-wrapper table.lg-table { table-layout: fixed; }
.blog-wrapper .lg-table th:first-child { inline-size: 38%; }