.help {
    inline-size: 100%;
    max-inline-size: 60rem;
    overflow: hidden;

    ul {
        display: grid;
        margin: 0;
        padding: 0;
        list-style: none;

        li {
            display: grid;
            min-block-size: 3.5rem;
            border-block-start: 1px solid var(--rule);
            border-inline-start: 0.2rem solid var(--operator-accent);

            a {
                display: grid;
                align-content: center;
                padding-block: 0.5rem;
                padding-inline: 0.75rem;
                color: inherit;
                text-decoration: none;

                &[target] b::after {
                    content: ' \2197';
                    color: var(--ink-muted);
                }

                small {
                    margin-block-start: 0.125rem;
                    color: var(--ink-muted);
                }
            }
        }
    }

    @container (min-width: 40rem) {
        ul {
            li {
                min-block-size: auto;
                border-inline-start-width: 4px;

                a {
                    display: flex;
                    align-items: baseline;
                    gap: 0.5rem;
                    padding: 1rem;

                    b { font-weight: inherit }
                    small { margin-block-start: 0 }
                    &:hover { text-decoration: underline }
                }
            }
        }
    }
}
