/* Add EatMDN to your home screen (rep-20261102): step pictures are inline SVG drawn with the site's colors. */
.hs-steps{list-style:none;counter-reset:hs;margin:0;padding:0;display:grid;gap:1.25rem}
@media (min-width:720px){.hs-steps{grid-template-columns:repeat(4,1fr)}}
.hs-step{counter-increment:hs;display:grid;justify-items:center;align-content:start;gap:.5rem}
.hs-step p{margin:0;font-size:1.125rem}
.hs-step p::before{content:"Step " counter(hs) ". ";font-weight:700}
.hs-art{width:min(100%,11rem);height:auto;display:block;font-family:inherit}
.hs-frame{fill:var(--c-surface);stroke:var(--c-text);stroke-width:3}
.hs-screen{fill:var(--c-bg);stroke:var(--c-border);stroke-width:1.5}
.hs-bar{fill:var(--c-surface-alt)}
.hs-sheet{fill:var(--c-surface);stroke:var(--c-border);stroke-width:1.5}
.hs-ui{fill:none;stroke:var(--c-border);stroke-width:1.5}
.hs-icon{fill:none;stroke:var(--c-text);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hs-icon-fill{fill:var(--c-text)}
.hs-hi{fill:none;stroke:var(--c-accent-text);stroke-width:3.5}
.hs-hi-row{fill:var(--c-surface-alt);stroke:var(--c-accent-text);stroke-width:3}
.hs-hi-fill{fill:var(--c-accent-text)}
.hs-txt{fill:var(--c-text);font-size:9px}
.hs-small{font-size:8.5px}
.hs-tiny{font-size:7.5px}
.hs-bold{font-weight:700;font-size:10px}
@media (forced-colors:active){.hs-frame,.hs-screen,.hs-sheet,.hs-ui,.hs-icon{stroke:CanvasText}.hs-hi,.hs-hi-row{stroke:Highlight}.hs-txt,.hs-icon-fill,.hs-hi-fill{fill:CanvasText}}
