/* The mind map of a role page (build-guide-v3.py). The rest of the drawing is .mm in stone.css. */
.mm-rolepage .mm-wrap > .v5-context { width: 100%; max-width: 1360px; margin: 0 auto 10px; padding-inline: 4px; border-bottom: 0; background: var(--wash); }
#main.v5-home.mm-rolepage { justify-content: flex-start; }
.mm-scope { display: none; }
.mm-root__role { fill: #fff; font: 700 20px/1 var(--font-body); letter-spacing: -.01em; }
.mm-root__scope { font-size: 12.5px; }
.mm-task > rect { fill: var(--c); transition: filter .15s; }
.mm-task text { fill: #fff; font: 650 15px/1 var(--font-body); }
.mm-task:hover > rect { filter: brightness(.88); }
.mm-rolepage .mm-action .mm-s { font-size: 14px; }
@media (max-width: 1199.98px) {
  .mm-rolepage .mm-h1 { margin-bottom: 4px; }
  .mm-scope { display: block; margin: 0 0 18px; color: var(--ink2); font: 500 15px/1.5 var(--font-body); }
  .mm-rolepage .mmo-level h2 a { color: #fff; text-decoration: none; }
  .mm-rolepage .mmo-actions { margin-top: 0; }
}

/* Feedback round 3, row 4: the list under the title of a function page is what to have ready, not steps. It carries a
   visible label, small and in capitals like "Step 1 of 11" (.sl__k). */
.cv-sub .cv-before { margin: 1.6cqw 0 0; color: var(--sl-ink3); font: 800 max(10.5px, .9cqw)/1.5 var(--sl-sans); letter-spacing: .16em; text-transform: uppercase; }
.cv-sub .cv-before + ul { margin-top: .4cqw; }
html:not(.dk-present) .cv-sub .cv-before { margin: 16px 0 0; font: 800 12px/1.5 var(--sl-sans); }
html:not(.dk-present) .cv-sub .cv-before + ul { margin-top: 4px; }

/* Feedback round 3, row 5: a desktop screen is captured 1440 px wide; beside the text it was shown at about a third of
   that and could not be read without Enlarge. Outside Present mode it now takes the whole width of the step and the
   text follows under it. Phone steps and Present mode (a fixed 1280 x 720 slide) keep the screen beside the text. */
html:not(.dk-present) .sl.step:not(.sl--phone) .sl__bd { grid-template-columns: minmax(0, 1fr); }