/* Shared page rules for every screen (house rule: no page ever scrolls sideways, on any
   width). Causes are fixed in the templates — wrapping headers and toolbars, panes that
   stack below 1024 px, tables that turn into cards on phones — this is the safety net.
   clip instead of hidden keeps position: sticky working. */
html, body { overflow-x: clip; }

/* Tables with many columns read as one card per row on phones. Each cell carries its
   column name in data-label. */
@media (max-width: 639px) {
    table.cards-sm, table.cards-sm tbody, table.cards-sm tr, table.cards-sm td { display: block; width: 100%; }
    table.cards-sm thead { display: none; }
    table.cards-sm tr { border-bottom: 1px solid #e2e8f0; padding: .5rem 0; }
    table.cards-sm td { padding: .15rem .75rem !important; text-align: left !important; overflow-wrap: anywhere; }
    table.cards-sm td[data-label]::before {
        content: attr(data-label); display: block; font-size: 10px; font-weight: 600;
        text-transform: uppercase; letter-spacing: .04em; color: #64748b;
    }
}