/* Shared reading layout for migrated technical articles. */
.wd-article-container { max-width: 1040px; padding-block: 24px 56px; }
.wd-article-breadcrumb { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 18px; font-size: 14px; color: var(--wd-muted); }
.wd-article { color: #354461; font-size: 17px; line-height: 1.65; overflow-wrap: anywhere; }
.wd-article h1, .wd-article h2 { color: var(--wd-ink); }
.wd-article h1 { font-size: clamp(29px, 3.1vw, 40px); letter-spacing: -1.2px; font-weight: 800; line-height: 1.15; }
.wd-article-intro > p { margin-top: 18px; font-size: 19px; line-height: 1.6; }
.wd-article-text-controls { display: flex; justify-content: flex-end; align-items: center; gap: 6px; margin: 18px 0 8px; }
.wd-article-text-controls[hidden] { display: none; }
.wd-article-text-controls-label { margin-right: 4px; color: var(--wd-muted); font-size: 14px; }
.wd-article-text-controls button { min-height: 36px; padding: 5px 12px; border: 1px solid #b8c7d9; border-radius: 5px; color: var(--wd-blue); background: #fff; font: inherit; font-size: 14px; cursor: pointer; }
.wd-article-text-controls button:hover { background: #edf8ff; }
.wd-article-text-controls button[aria-pressed="true"] { border-color: var(--wd-navy); color: #fff; background: var(--wd-navy); }
.wd-article-text-controls button:focus-visible { outline: 3px solid #0081ec; outline-offset: 2px; }
.wd-article a { text-decoration: underline; text-underline-offset: .18em; }
.wd-article-toc { margin-block: 26px 24px; }
.wd-article-toc h2 { font-size: 23px; letter-spacing: -.5px; }
.wd-article-toc ol { columns: 2; column-gap: 52px; column-rule: 1px solid var(--wd-line); margin: 14px 0 0; padding-left: 0; list-style: none; counter-reset: wd-article-index; }
.wd-article-toc li { position: relative; break-inside: avoid; counter-increment: wd-article-index; min-height: 26px; padding: 3px 0 3px 36px; font-size: 15px; line-height: 1.6; }
.wd-article-toc li::before { content: counter(wd-article-index); position: absolute; left: 0; top: .3em; display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 26px; padding-inline: 3px; box-sizing: border-box; border-radius: 6px; background: #dce8f2; color: #405d78; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.wd-article-toc a { display: block; text-decoration: none; }
.wd-article-toc a:hover { text-decoration: underline; }
.wd-article-toc a span { margin-left: 6px; white-space: nowrap; }
.wd-article-section { border-top: 1px solid var(--wd-line); padding-top: 22px; margin-top: 24px; }
.wd-article-section h2 { font-size: clamp(23px, 2.3vw, 29px); font-weight: 800; letter-spacing: -.65px; line-height: 1.25; scroll-margin-top: 24px; }
.wd-article-section h2:focus { outline: 2px solid var(--wd-blue); outline-offset: 5px; }
.wd-article-section p { margin-top: 14px; }
.wd-article-section ol, .wd-article-section ul { margin: 14px 0; padding-left: 28px; }
.wd-article-section li { padding-left: 4px; }
.wd-article-section li p { margin-top: 8px; }
.wd-article p.wd-article-callout { padding: 18px 22px; margin-block: 20px; border-left: 4px solid var(--wd-cyan); border-radius: 0 8px 8px 0; background: #edf8ff; color: var(--wd-ink); }
.wd-article code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .88em; background: #f0f5fa; border-radius: 3px; padding: .1em .2em; white-space: normal; overflow-wrap: anywhere; }
.wd-article-figure { margin: 24px auto; text-align: center; max-width: 100%; }
.wd-article-figure > a { display: inline-block; max-width: 100%; line-height: 0; }
.wd-article-figure img { display: block; max-width: 100%; height: auto; border: 1px solid #c8d6e5; border-radius: 3px; }
.wd-article-figure figcaption { margin: 9px auto 0; color: var(--wd-muted); font-size: 14px; line-height: 1.45; }
.wd-article--zoomed { font-size: 20px; line-height: 1.75; }
.wd-article--zoomed .wd-article-intro > p { font-size: 23px; line-height: 1.65; }
.wd-article--zoomed .wd-article-toc li { font-size: 17px; }
.wd-article--zoomed .wd-article-figure figcaption { font-size: 16px; }
@media (max-width: 640px) {
  .wd-article-container { padding-block: 20px 36px; }
  .wd-article { font-size: 16px; }
  .wd-article h1 { letter-spacing: -.8px; }
  .wd-article-intro > p { font-size: 17px; }
  .wd-article-text-controls { justify-content: flex-start; }
  .wd-article-toc ol { columns: 1; }
  .wd-article-toc li { padding-block: 5px; }
  .wd-article-section { padding-top: 20px; margin-top: 22px; }
  .wd-article p.wd-article-callout { padding: 15px 16px; }
  .wd-article-figure { margin-block: 20px; }
  .wd-article--zoomed { font-size: 19px; line-height: 1.75; }
  .wd-article--zoomed .wd-article-intro > p { font-size: 20px; }
}


/* Generic article content; opt in to overflow wrappers where needed. */
.wd-article h3, .wd-article h4 { color: var(--wd-ink); line-height: 1.35; }
.wd-article h3 { font-size: 1.18em; margin-block: 22px 12px; }
.wd-article h4 { font-size: 1em; margin-block: 18px 10px; }
.wd-article img { max-width: 100%; height: auto; }
.wd-article [id] { scroll-margin-top: 24px; }
.wd-article-table-scroll { max-width: 100%; overflow-x: auto; margin-block: 22px; }
.wd-article-table-scroll:focus-visible, .wd-article pre:focus-visible { outline: 3px solid var(--wd-blue); outline-offset: 3px; }
.wd-article table { width: 100%; border-collapse: collapse; font-size: .94em; line-height: 1.5; }
.wd-article caption { padding-bottom: 10px; text-align: left; font-weight: 700; color: var(--wd-ink); }
.wd-article th, .wd-article td { padding: 10px 12px; border: 1px solid var(--wd-line); text-align: left; vertical-align: top; }
.wd-article th { background: #edf3fa; color: var(--wd-ink); font-weight: 700; }
.wd-article pre { max-width: 100%; overflow-x: auto; padding: 18px; margin-block: 22px; border: 1px solid var(--wd-line); border-radius: 6px; background: #f0f5fa; font: .88em/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre; overflow-wrap: normal; tab-size: 4; }
.wd-article pre code { padding: 0; background: transparent; border-radius: 0; font: inherit; white-space: inherit; overflow-wrap: normal; }
.wd-article blockquote { margin: 22px 0; padding: 16px 22px; border-left: 4px solid var(--wd-cyan); background: #edf8ff; }
.wd-article blockquote > :first-child { margin-top: 0; }
.wd-article blockquote > :last-child { margin-bottom: 0; }
.wd-article-media { width: 100%; aspect-ratio: 16 / 9; margin-block: 24px; }
.wd-article-media iframe, .wd-article-media video { display: block; width: 100%; height: 100%; border: 0; }

/* Short articles can have ordinary body paragraphs without artificial sections. */
.wd-article > p { margin-top: 14px; }
.wd-article > ul, .wd-article > ol { margin-block: 14px; padding-left: 28px; }
/* Opt in for dense multi-column data tables; the surrounding region scrolls. */
.wd-article-table--wide { min-width: 42rem; }
