highlight headings (HTML and ARIA)

headings-highlight

:is(h1,h2,h3,h4,h5,h6)::after,
:is(h1,h2,h3,h4,h5,h6):empty::after,
[role="heading"]::after,
 [role="heading"]:is([aria-level="1"],[aria-level="2"],[aria-level="3"],[aria-level="4"],[aria-level="5"],[aria-level="6"])::after{
   background: #ff8f51;
   border:1px solid #e96115;
   border-radius:4px;
   color:#000;
   display: inline-block;
   margin:0 0.2em;
   padding:0.02em;
 }

:is(h1,h2,h3,h4,h5,h6):empty::after{
 content:" empty ";
}

 [role="heading"]::after{
   content:" h2 (implied) "
 }

 h1::after, [role="heading"][aria-level="1"]::after{
   content:" h1 ";
 }

 h2::after, [role="heading"][aria-level="2"]::after{
   content:" h2 ";
 }

 h3::after, [role="heading"][aria-level="3"]::after{
   content:" h3 ";
 }

 h4::after, [role="heading"][aria-level="4"]::after{
   content:" h4 ";
 }

 h5::after, [role="heading"][aria-level="5"]::after{
   content:" h5 ";
 }

 h6::after, [role="heading"][aria-level="6"]::after{
   content:" h6 ";
 }