/* data tables stack as cards below 430px (labels come from /tblcards.js) */
@media (max-width:429px){
 .tblw{overflow:visible}
 .tbl,.tbl tbody,.tbl tfoot,.tbl tr,.tbl td,.tbl th[scope=row]{display:block;width:auto;min-width:0}
 .tbl thead{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
 .tbl tr{margin:0 0 .7rem;padding:.5rem .8rem;border:1px solid #D8D3C6;border-radius:6px}
 .tbl tr,.tbl td{background:none!important}
 .tbl td{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.25rem 0;border:0;text-align:right;white-space:normal}
 .tbl td::before{content:attr(data-label);flex:0 0 auto;max-width:55%;text-align:left;font-weight:800;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;opacity:.75}
 .tbl td:first-child,.tbl th[scope=row]{font-weight:800}
}
