/* website/docs/docs.css: the guides under /docs/, loaded after /styles.css. They wear the site's own components (.legal
   for the text, .tour-page and .toc for the side index, .grid-2 and .panel on the index, .x-scroll and .cmp-sc for a
   table), so this file only adds what those lack: numbered steps, a command block, and code and tables that stay
   readable on a phone. No colour is written here, only the tokens styles.css declares (tests/unit/website-docs.test.js
   holds it to that). */

.doc{padding-block:32px 0}
/* Link lists that stand alone (the index's panels, its questions, the side index on a touch screen): 44px targets. */
.panel h3 a,.panel li>a,#questions+ul a{display:inline-flex;align-items:center;min-height:44px}
.panel ul{gap:0} .panel li{margin-bottom:0}
@media (min-width:1024px) and (pointer:coarse){.toc a{display:flex;align-items:center;min-height:44px;padding:0}}
.doc ol{margin-bottom:14px;padding-left:20px;color:var(--muted)}
.doc code{white-space:normal;overflow-wrap:anywhere}
.doc pre{margin:0 0 14px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--deep);overflow-x:auto}
.doc pre code{white-space:pre;overflow-wrap:normal}
/* The table of what we keep: it scrolls sideways inside its frame on a phone instead of squeezing three columns. */
.doc .cmp-sc{min-width:640px}
.doc .cmp-sc td{color:var(--muted)} .doc .cmp-sc tbody th{color:var(--text)}
/* Seven guides in the top nav: the Spanish labels only fit between 1024 and 1199px with a tighter gap. */
@media (min-width:1024px) and (max-width:1199px){.nav-links{gap:10px}}