.mobile-record-details { display: none; }
@media (max-width: 760px) {
  body.ui-bs.authenticated #metrics:has(> [data-metric="records"]:only-child) { display: none; }
  body.ui-bs.authenticated .metrics.mobile-secondary-metrics { display: none; }
  body.ui-bs.authenticated .workspace { gap: 12px; }
  body.ui-bs.authenticated #content { gap: 12px; }
  body.ui-bs.authenticated .panel > .panel-head { padding: 10px 12px; min-height: 40px; }
  body.ui-bs.authenticated .panel > .panel-head h2 { font-size: 14px; line-height: 20px; }
  body.ui-bs.authenticated .panel > .panel-head .panel-subtitle { display: none; }
  body.ui-bs.authenticated .panel > .panel-body { padding: 12px; }
  body.ui-bs.authenticated .panel-body > .panel-toolbar { margin: 0 0 10px; gap: 8px; }
  body.ui-bs.authenticated .panel-body > .data-toolbar { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 12px; margin: 0 0 10px; }
  body.ui-bs.authenticated .panel-body > .data-toolbar .data-count { white-space: nowrap; font-size: 12px; }
  body.ui-bs.authenticated .panel-body > .data-toolbar .table-search { width: 100%; min-width: 0; max-width: none; margin: 0; }
  body.ui-bs.authenticated .panel-body > .data-toolbar input { min-width: 0; }
  body.ui-bs.authenticated .metrics:not(.system-status-metrics) { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  body.ui-bs.authenticated .metrics:not(.system-status-metrics) > .metric { min-height: 62px; padding: 10px 12px; }
  body.ui-bs.authenticated .metrics:not(.system-status-metrics) .metric strong { font-size: 20px; line-height: 26px; }
  body.ui-bs.authenticated .metrics:not(.system-status-metrics) .metric b { display: none; }
  body.ui-bs.authenticated #content .panel .status-list:not(dialog .status-list) { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 16px; }
  body.ui-bs.authenticated #content .panel .status-list:not(dialog .status-list) > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; min-height: 38px; padding: 8px 0; margin: 0; border: 0; border-bottom: 1px solid #edf0f4; border-radius: 0; background: transparent; }
  body.ui-bs.authenticated #content .panel .status-list:not(dialog .status-list) > .status-item-wide { grid-column: 1 / -1; }
  body.ui-bs.authenticated #content .panel .status-list:not(dialog .status-list) > div > span { font-size: 12px; }
  body.ui-bs.authenticated #content .panel .status-list:not(dialog .status-list) > div > strong { min-width: 0; max-width: 100%; font-size: 13px; line-height: 20px; overflow-wrap: anywhere; }

  body.ui-bs.authenticated .mobile-record-table { display: block; min-width: 0; width: 100%; }
  body.ui-bs.authenticated .mobile-record-table > thead { display: none; }
  body.ui-bs.authenticated .mobile-record-table > tbody { display: grid; gap: 8px; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr { display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto; align-items: center; gap: 6px 12px; padding: 10px 12px; margin: 0; border: 1px solid #e0e6ed; border-radius: 6px; background: #fff; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr[hidden] { display: none; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > td { display: none; grid-area: auto; min-width: 0; max-width: none; min-height: 0; width: auto; padding: 0; margin: 0; border: 0; background: transparent; text-align: left; font-size: 12px; line-height: 18px; overflow-wrap: anywhere; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > td::before,
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > td::after { display: none; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="title"] { display: block; grid-area: 1 / 1; font-size: 14px; font-weight: 600; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="status"] { display: block; grid-area: 1 / 2; justify-self: end; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > td > .stacked-cell > :not(:first-child) { display: none; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > td > .stacked-cell { min-width: 0; gap: 0; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="reference"] { display: block; grid-area: 2 / 1 / 3 / 3; color: #64748b; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="metric"] { display: block; grid-area: 3 / 1; color: #374151; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="meta"] { display: block; grid-area: 3 / 2; color: #64748b; text-align: right; max-width: 145px; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="metric"]::before,
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="meta"]::before { display: block; content: attr(data-label); margin: 0; color: #798596; font-size: 11px; font-weight: 400; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="actions"] { display: block; grid-area: 4 / 1 / 5 / 3; justify-self: end; align-self: start; z-index: 1; padding-left: 38px; }
  body.ui-bs.authenticated .mobile-record-table .row-actions { justify-content: flex-end; flex-wrap: nowrap; gap: 6px; }
  body.ui-bs.authenticated .mobile-record-table .row-actions > button,
  body.ui-bs.authenticated .mobile-record-table .row-action-menu > summary { min-height: 32px; height: 32px; padding: 4px 8px; font-size: 12px; }
  body.ui-bs.authenticated .mobile-record-table .copy-cell { display: flex; gap: 6px; align-items: center; justify-content: flex-start; min-width: 0; max-width: 100%; }
  body.ui-bs.authenticated .mobile-record-table .copy-cell .cell-code { display: block; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
  body.ui-bs.authenticated .mobile-record-table .copy-cell > button { flex: 0 0 28px; min-width: 28px; width: 28px; min-height: 28px; height: 28px; padding: 4px; opacity: 1; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > .mobile-record-details { display: block; grid-area: 4 / 1 / 5 / 3; align-self: start; }
  body.ui-bs.authenticated .mobile-record-details > details > summary { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; list-style: none; cursor: pointer; color: #64748b; border-radius: 4px; }
  .mobile-record-details summary::-webkit-details-marker { display: none; }
  .mobile-record-details summary:focus-visible { outline: 2px solid #2563eb; outline-offset: -2px; }
  .mobile-record-details summary svg { width: 16px; height: 16px; }
  .mobile-record-details details[open] > summary svg { transform: rotate(180deg); }
  .mobile-record-details dl { margin: 8px 0 0; padding: 8px 0 0; border-top: 1px solid #e5e9ef; }
  .mobile-record-details dl > div { display: grid; grid-template-columns: minmax(0,100px) minmax(0,1fr); gap: 10px; padding: 5px 0; }
  .mobile-record-details dt { color: #798596; font-weight: 400; }
  .mobile-record-details dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
  body.ui-bs.authenticated .mobile-record-details .copy-cell .cell-code { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="title"]:not(:has(.copy-cell)),
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="metric"],
  body.ui-bs.authenticated .mobile-record-table > tbody > tr > [data-mobile-slot="meta"] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}