add a small CSS snippet to make the `title` attribute easily viewable on mobile

[cyrneko]

elements with the title attribute, i.e when using <abbr> aren't usually viewable on mobile browsers, or with touch in general. There is a neat CSS snippet that I use on my website that can work around this issue by using hover/focus states and some ::after, and the often forgotten attr() CSS function

@media (pointer: coarse),                                                                                                                  
(hover: none) {                                                                                                                            
  [title] {                                                                                                                                
    position: relative;                                                                                                                    
    display: inline-flex;                                                                                                                  
    justify-content: center;                                                                                                               
  }                                                                                                                                        
                                                                                                                                           
  [title]:focus::after,                                                                                                                    
  [title]:hover::after {                                                                                                                   
    content: attr(title);                                                                                                                  
    position: absolute;                                                                                                                    
    top: 120%;                                                                                                                             
    color: black;                                                                                                                          
    background-color: white;                                                                                                               
    width: max-content;                                                                                                                    
    padding: var(--padding);                                                                                                               
    z-index: 10;                                                                                                                           
    animation: 0.3s slidein;                                                                                                               
  }                                                                                                                                        
}                                                                                                                                          
                                                                                                                                           
@keyframes slidein {                                                                                                                       
  from {                                                                                                                                   
    opacity: 0;                                                                                                                            
    top: 100%;                                                                                                                             
  }                                                                                                                                        
                                                                                                                                           
  to {                                                                                                                                     
    opacity: 1;                                                                                                                            
    top: 120;                                                                                                                              
  }                                                                                                                                        
}  

The keyframe and animation: is entirely optional, I just like to have it
this is of course customizable, but the first block should stay roughly the same and the 2nd block's width should be set appropriately

I feel this is a nice thing to add, although it is like 3 times the length of the default CSS without comments, purely because it serves as a solution to show title contents without javascript