/* Phase 2 list presentations: tables remain unchanged at 768px and above. */
.app-mobile-list { display: none; }
/* Keep absolutely positioned screen-reader labels inside their table scroll region. */
.app-list-page :is(.app-desktop-table, .app-table-scroll) { position: relative; }
.app-list-filter-disclosure { display: contents; }
.app-list-filter-disclosure > summary { display: none; }
@media (max-width: 767.98px) {
    .app-desktop-table { display: none !important; }
    .app-mobile-list { display: grid; gap: .75rem; min-width: 0; margin: 0; padding: 0; list-style: none; }
    .app-mobile-card { min-width: 0; padding: .875rem; background: var(--store-surface); color: var(--store-text); border: 1px solid var(--store-border); border-radius: .5rem; overflow-wrap: anywhere; }
    .app-mobile-card__header { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; }
    .app-mobile-card h2 { flex: 1 1 10rem; min-width: 0; margin: 0; font-size: 1rem; font-weight: 600; line-height: 1.4; }
    .app-mobile-card__meta { margin: .25rem 0; color: var(--store-text-muted); font-size: .875rem; white-space: pre-line; }
    /* Long notes are previewed here; Details exposes the full record. */
    .app-mobile-card__preview { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
    .app-mobile-card :is(dd, .app-mobile-card__balance) { font-variant-numeric: tabular-nums; }
    .app-mobile-card__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin: .75rem 0; }
    .app-mobile-card__grid > div { min-width: 0; }
    .app-mobile-card dt { font-size: .8125rem; font-weight: 400; color: var(--store-text-muted); }
    .app-mobile-card dd { margin: .15rem 0 0; font-size: .9375rem; font-weight: 600; }
    .app-mobile-card__balance { font-size: 1.25rem; font-weight: 700; margin: .5rem 0; }
    .app-mobile-card__actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
    .app-mobile-card__actions .btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; flex: 1 1 7rem; min-width: 0; min-height: 44px; white-space: normal; }
    .app-mobile-card .badge { max-width: 100%; white-space: normal; font-size: .8125rem !important; line-height: 1.4; letter-spacing: 0; }
    .app-mobile-card__product { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: .75rem; }
    .app-mobile-card__image { width: 64px; height: 64px; object-fit: contain; border-radius: .375rem; background: var(--store-hover); display: flex; align-items: center; justify-content: center; font-size: .75rem; text-align: center; color: var(--store-text-muted); }
    .app-mobile-card__product h2 { margin-bottom: .25rem; }
    .app-list-page > :has(> .app-mobile-list), .app-list-page .app-table-card:has(.app-mobile-list),
    .app-list-page :is(.users-card, .distributors-card):has(.app-mobile-list) { border: 0 !important; background: transparent !important; overflow: visible !important; box-shadow: none; }
    .app-list-page .app-filter-bar { padding: .75rem !important; margin-bottom: .75rem; }
    .app-list-page .app-filter-intro { display: none; }
    .app-list-page .app-filter-search { flex: 1 1 100%; min-width: 0 !important; }
    .app-content .app-list-page > :is(.app-metric-grid, .user-summary, .distributor-summary) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem !important; margin-bottom: 1rem !important; }
    .app-content .app-list-page > :is(.app-metric-grid, .user-summary, .distributor-summary) > * { min-width: 0; min-height: 0; padding: .65rem .75rem !important; border-radius: .5rem !important; overflow-wrap: anywhere; }
    .app-content .app-list-page > :is(.app-metric-grid, .user-summary, .distributor-summary) > :last-child:nth-child(odd) { grid-column: 1 / -1; }
    .app-content .app-list-page > .app-metric-grid > * :is(strong, .text-lg) { font-size: 1.05rem !important; letter-spacing: 0; }
    .app-content .app-list-page > .app-filter-bar { margin-bottom: 1rem !important; }
    .app-content .app-list-page .app-filter-bar { border-radius: .5rem !important; box-shadow: none; }
    .app-content .app-list-page :has(> .app-mobile-list) { border: 0 !important; background: transparent !important; border-radius: 0 !important; box-shadow: none; }
    .app-list-page .app-filter-bar > .row { width: 100%; margin-inline: 0; }
    .app-list-filter-disclosure { display: block; flex: 1 1 8rem; min-width: 0; }
    .app-list-filter-disclosure > summary { display: flex; align-items: center; justify-content: center; gap: .5rem; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--store-border); border-radius: .375rem; cursor: pointer; }
    .app-list-filter-disclosure > summary::marker { content: ""; }
    .app-list-filter-disclosure > summary::after { content: "+"; }
    .app-list-filter-disclosure[open] > summary { color: var(--app-accent); border-color: var(--app-accent); }
    .app-list-filter-disclosure[open] > summary::after { content: "-"; }
    .app-list-filter-disclosure > :not(summary) { width: 100% !important; min-width: 0 !important; margin-top: .5rem; }
    .app-list-filter-disclosure:not([open]) > :not(summary) { display: none; }
    .app-list-filter-disclosure > summary:focus-visible { outline: 2px solid var(--app-accent); outline-offset: 2px; }
    .app-content .app-list-page .app-compact-table { min-width: 32rem; }
    .app-content .app-list-page .app-compact-table :is(th, td) { padding: .65rem !important; }
}
@media (min-width: 768px) {
    /* A closed native disclosure must not hide desktop controls. */
    .app-list-filter-disclosure > :not(summary) { display: block; }
    .app-list-filter-disclosure::details-content { display: contents; }
}