div.dt-container{font-size:.86rem;margin:1rem 0}div.dt-container .dt-input,table.dataTable tfoot input{border:1px solid var(--line);border-radius:var(--radius-sm);padding:.5rem;background:var(--field);font:inherit;max-width:100%}table.dataTable tfoot input{width:100%;min-width:0}table.dataTable td{vertical-align:top}div.dt-container .dt-paging button.dt-paging-button.current{background:var(--accent)!important;color:white!important;border-color:var(--accent)!important;border-radius:var(--radius-sm)}div.dt-container .dt-layout-row{gap:.7rem;flex-wrap:wrap}.dt-scroll{border:1px solid var(--line);border-radius:var(--radius)}table.dataTable{margin:0!important}.dt-column-title{white-space:normal}
/* Wide data pages, compact reading/forms elsewhere. No columns are hidden. */
.app-main:has(table){max-width:none;width:100%}
.app-main section,.dt-container,.dt-layout-cell{min-width:0}
.app-main table{width:100%;max-width:100%}
.app-main table th,.app-main table td{white-space:normal;overflow-wrap:anywhere}
.app-main td .inline-form{display:flex;flex-wrap:wrap;max-width:100%;gap:.5rem}
.app-main td .inline-form label{min-width:0;max-width:100%}
.app-main td select,.app-main td input:not([type=checkbox]):not([type=radio]){max-width:100%;min-width:0;width:min(100%,20rem)}
.app-main td button{white-space:normal;overflow-wrap:normal;min-width:max-content}
/* On narrow screens a table may still need scrolling, but never the whole page. */
.dt-layout-table{overflow-x:auto}
@media(max-width:700px){.app-main:has(table){padding:.75rem}.app-main table th,.app-main table td{padding:.5rem}.admin-section{padding:1rem}}