I'm experimenting with hiding parts of a page using aria-hidden="true" and tabindex="-1" upon a user action (clicking a button).

I have set up the following codepen to show a behaviour of NVDA that seems quirky. When you click the button and press down arrow, I would expect the cursor to be on "This is readable after the button is pressed" (the first accessible item), but it's on the link below this item.

• To test with screenreader: http://s.codepen.io/jmuheim/debug/MymBXm
• To inspect code: http://s.codepen.io/jmuheim/pen/MymBXm

So here's my question: how does NVDA handle focus internally? Is it confused when elements are set to aria-hidden="true"? How can I prevent this problem?