/* T06 download pages (remaining-168, 2026-09-15): /dc/icd-extractor and
 * /dc/open-pii-extractor. Scoped under body.dl-page. A left-aligned product
 * opening with the real download and its version, size and checksum above
 * everything else, then the explanatory material beside a compact
 * "On this page" rail on wide screens (a wrapped link row on phones).
 * No screenshots: the apps have no published screenshot to reuse.
 */
body.dl-page main .container { max-width: 1180px; }
body.dl-page .dc-hero { text-align: left; margin: .25rem 0 1.25rem; }
body.dl-page .dc-hero h1 { margin-bottom: .6rem; }
body.dl-page .dc-hero p { max-width: 75ch; margin: 0; text-align: left; }
body.dl-page .guide-section h2 { text-align: left; }
body.dl-page .guide-section p,
body.dl-page .guide-section ul,
body.dl-page .guide-section ol { max-width: 75ch; margin-left: 0; margin-right: 0; }

/* The download block sits directly under the opening. */
body.dl-page .dl-top { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: start; margin-bottom: 1.5rem; }
body.dl-page .dl-top .dl-panel { margin: 0; max-width: none; }
@media (min-width: 1024px) {
  body.dl-page .dl-top--split { grid-template-columns: minmax(0, 1fr) 420px; gap: 2rem; }
  body.dl-page .dl-top--split .dc-hero { margin: 0; }
}

/* Reading area: rail + sections. */
body.dl-page .dl-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem 2.5rem; align-items: start; margin-top: 1rem; border-top: 1px solid var(--color-border); padding-top: 1.5rem; }
body.dl-page .dl-body { min-width: 0; }
body.dl-page .dl-toc { font-family: var(--font-sans); }
body.dl-page .dl-toc-title { display: block; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); margin: 0 0 .5rem; }
body.dl-page .dl-toc ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem .9rem; max-width: none; }
body.dl-page .dl-toc li { margin: 0; font-size: .9rem; line-height: 1.4; }
body.dl-page .dl-toc a { display: inline-block; padding: .3rem 0; color: var(--color-primary); text-decoration: none; }
body.dl-page .dl-toc a:hover, body.dl-page .dl-toc a:focus-visible { text-decoration: underline; }
body.dl-page .dl-body .guide-section { scroll-margin-top: 90px; }
@media (min-width: 1024px) {
  body.dl-page .dl-layout { grid-template-columns: 220px minmax(0, 1fr); }
  body.dl-page .dl-toc { position: sticky; top: 84px; }
  body.dl-page .dl-toc ol { display: block; border-left: 2px solid var(--color-border); }
  body.dl-page .dl-toc li { padding-left: .85rem; }
  body.dl-page .dl-toc a { padding: .35rem 0; }
}

/* ICD: panel and Windows note as an even pair; steps two across in the reading column. */
body.dl-page .dl-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; align-items: stretch; }
body.dl-page .dl-pair > .dl-panel, body.dl-page .dl-pair > .dl-note { margin: 0; max-width: none; }
@media (min-width: 900px) { body.dl-page .dl-pair { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
@media (min-width: 641px) { body.dl-page .dl-body .step-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
body.dl-page #ask-guide-mount { margin: 0 0 1.25rem; }

/* Opening illustration, top right (owner request 2026-09-15). */
body.dl-page .dl-hero { display: grid; grid-template-columns: minmax(0, 1fr) 140px; gap: 28px; align-items: start; }
body.dl-page .dl-hero-art { margin: 0; }
body.dl-page .dl-hero-art img { display: block; width: 140px; height: auto; border: 1px solid var(--color-border); border-radius: 10px; }
@media (max-width: 480px) { body.dl-page .dl-hero { grid-template-columns: minmax(0, 1fr) 80px; gap: 14px; } body.dl-page .dl-hero-art img { width: 80px; } }
