/* Mobile presentation uses the same authorized data, forms and navigation. */
.mobile-bottom-nav,.mobile-filter-toggle,.mobile-record-toggle,.mobile-device-toggle { display:none !important; }
#refresh>svg { display:none; }
@media(max-width:1024px) {
  :root { --ui-text-size:15px; }
  .app .workspace { padding:12px 12px calc(92px + env(safe-area-inset-bottom)); }
  .app .workspace>.workspace-header { position:sticky; top:0; z-index:20; margin:-12px -12px 18px; padding:14px 16px 12px; gap:12px; background:var(--ui-bg); border-bottom:1px solid var(--ui-border); }
  .app .page-heading { flex:1; gap:10px; }
  .app .workspace #page-title { font-size:21px; line-height:1.4; margin:0; }
  .app #context-label { display:none; }
  .app #open-navigation { width:44px; height:44px; min-height:44px; border-radius:12px; background:var(--ui-surface); border:1px solid var(--ui-border); }
  .app .header-actions { display:block; width:100%; }
  .app .header-tools { display:grid; grid-template-columns:minmax(0,1fr) 44px; gap:8px; }
  .app .workspace .header-tools #global-search { grid-column:1; grid-row:1; width:100%; min-width:0; min-height:44px; padding:10px 14px; font-size:16px; background:var(--ui-surface); border-radius:12px; }
  .app #refresh { grid-column:2; grid-row:1; width:44px; min-height:44px; padding:9px; display:grid; place-items:center; border-radius:12px; }
  .app #refresh>svg { display:block; width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
  .app .mobile-refresh-label { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  .app .workspace .header-tools #status-filter { grid-column:1/-1; grid-row:2; max-width:none; width:100%; min-height:44px; font-size:16px; }
  .app #app-message:empty { display:none; }
  .app .mobile-bottom-nav {
    display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)); position:fixed; inset-inline:0; bottom:0; z-index:30;
    padding:7px 8px calc(7px + env(safe-area-inset-bottom)); margin:0; gap:4px; background:var(--ui-surface);
    border-top:1px solid var(--ui-border); box-shadow:0 -4px 24px rgb(20 36 59 / 5%);
  }
  .app .mobile-bottom-nav button { display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; min-width:0; min-height:54px; gap:4px; padding:6px 2px; border-radius:12px; background:transparent; color:var(--ui-muted); font-size:11px; line-height:1.3; }
  .app .mobile-bottom-nav button svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
  .app .workspace .mobile-bottom-nav button span { font-size:11px; }
  html[dir] .app .mobile-bottom-nav button.active,html[dir] .app .mobile-bottom-nav button:hover { background:var(--ui-accent-soft); color:var(--ui-accent); box-shadow:none; }
  .app #navigation { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding-bottom:8px; }
  .app #navigation button { min-height:44px; }
  .app aside>.header-preferences { display:grid; flex-shrink:0; grid-template-columns:1fr 1fr; gap:8px; padding:12px 16px; border-top:1px solid var(--ui-nav-border); }
  .app aside>.header-preferences>* { width:100%; min-width:0; min-height:44px; margin:0; font-size:13px; }
  .app aside>.header-preferences .app-download { grid-column:1/-1; justify-content:center; }
  .app aside .aside-footer { padding:12px 16px; gap:7px; }
  .app .workspace #content .stats { gap:8px; margin-bottom:14px; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .app .workspace #content .stats article { border-radius:13px; padding:12px 13px; box-shadow:none; }
  .app .workspace #content .stats :is(span,small) { font-size:12px; line-height:1.5; }
  .app .workspace #content .stats strong { font-size:23px; line-height:1.3; margin:5px 0 0; }
  .app .device-summary article { gap:4px; }
  .app .device-summary article>span:first-child { min-height:0; }
  .app .workspace #content .message-summary article:nth-last-child(-n+2) { background:var(--ui-soft); }
  .app .workspace #content .message-scope-description { display:none; }
  .app .workspace #content .message-scope-counts { display:block; font-size:12px; color:var(--ui-muted); line-height:1.9; }
  .app .record-limit-note { margin:0 0 12px; padding:0 4px; font-size:12px; }
  .app .panel { border-radius:16px; margin-bottom:16px; box-shadow:none; }
  .app .panel-head { padding:15px 16px; align-items:center; }
  .app .panel-head h3 { font-size:16px; }
  .app .daily-message-report .panel-head p,.app .panel:has(#message-filters)>.panel-head p { display:none; }
  .app .mobile-filter-toggle { display:inline-flex !important; align-items:center; justify-content:center; min-height:44px; border-radius:11px; font-size:13px; }
  .app .message-filters { grid-template-columns:repeat(2,minmax(0,1fr)); margin:12px; padding:12px; gap:12px; }
  .app .message-filters[hidden] { display:none !important; }
  .app .message-filters label { font-size:12px; }
  .app .message-filters :is(input:not([type="checkbox"]),select),.app :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea),dialog :is(input:not([type="checkbox"]),select,textarea) { font-size:16px; min-height:44px; }
  .app .workspace #content :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) { font-size:16px; }
  .app .message-filters .message-id-filter,.app .message-filters .message-source-filter { grid-column:1/-1; }
  .app .message-filters .form-actions { display:flex; grid-column:1/-1; gap:8px; }
  .app .message-filters .form-actions>* { flex:1; }
  .app .mobile-filter-note { padding:12px 16px 0; }
  /* Every daily value stays visible; day and user rows share the same six metrics. */
  .app .daily-message-report .table-view-tools,.app .mobile-simple-list .table-view-tools { display:none; }
  .app .daily-message-report .table-wrap { overflow:visible; }
  .app .daily-message-report :is(table,tbody,tfoot) { display:block; width:100%; min-width:0; }
  .app .daily-message-report .table-wrap thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .app .daily-message-report tbody>tr,.app .daily-message-report tfoot>tr { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px 10px; margin:10px; padding:12px; border:1px solid var(--ui-border); border-radius:13px; background:var(--ui-surface); }
  .app .daily-message-report .table-wrap :is(td,th) { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:0; min-width:0; border:0; white-space:normal; font-variant-numeric:tabular-nums; box-shadow:none; background:transparent; }
  .app .daily-message-report .table-wrap :is(td,th):first-child { grid-column:1/3; justify-content:center; }
  .app .daily-message-report .table-wrap :is(td,th):not(:first-child)::before { content:attr(data-mobile-label); font-size:11px; line-height:1.5; color:var(--ui-muted); }
  .app .workspace #content .daily-message-report .table-wrap :is(td,th)::before { font-size:11px; }
  .app .workspace #content .daily-message-report :is(td,th) span { font-size:14px; }
  .app .daily-users-toggle { min-height:40px; padding:0; gap:8px; font-size:14px; }
  .app .daily-message-report tr.daily-report-day.is-expanded { background:var(--ui-accent-soft); border-color:var(--ui-accent); }
  .app .daily-message-report tr.daily-users-detail[data-daily-user-row] { margin:0 16px 8px; border-inline-start:3px solid var(--ui-accent); border-radius:11px; background:var(--ui-soft); }
  .app .daily-users-detail .daily-user-name { padding:0; font-weight:650; }
  .app .daily-message-report tr.daily-users-detail:not([data-daily-user-row]):not([hidden]) { display:block; }
  .app .daily-message-report tr.daily-users-detail:not([data-daily-user-row]) td { display:block; }
  .app .daily-message-report tr.daily-users-detail:not([data-daily-user-row]) td::before { content:none; }
  .app .daily-message-report tfoot>tr,.app .daily-message-report .table-total th { background:var(--ui-accent-soft); }
  /* SMS cards reveal optional fields without replacing or duplicating records. */
  .app .mobile-sms-list .table-wrap { overflow:visible; }
  .app .mobile-sms-list :is(table,tbody) { display:block; width:100%; min-width:0; }
  .app .mobile-sms-list .table-wrap tbody tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px 14px; margin:12px; padding:14px; border-radius:13px; background:var(--ui-surface); }
  .app .mobile-sms-list .table-wrap tbody td { display:flex; flex-direction:column; gap:4px; padding:0; min-width:0; border:0; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
  .app .mobile-sms-list .table-wrap tbody td::before { content:attr(data-label); color:var(--ui-muted); font-size:11px; line-height:1.4; }
  .app .mobile-sms-list .table-wrap tbody td:first-child { grid-column:1/-1; display:flex; flex-direction:row; align-items:center; justify-content:space-between; padding-bottom:10px; border-bottom:1px solid var(--ui-border); }
  .app .mobile-sms-list .table-wrap tbody td:first-child::before { content:none; }
  .app .mobile-sms-list .table-wrap tbody td:first-child>code { max-width:60%; padding:0; border:0; background:transparent; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
  .app .mobile-sms-list .table-wrap tr.mobile-record-expanded td:first-child>code { white-space:normal; }
  .app .mobile-record-toggle { display:inline-flex !important; align-items:center; justify-content:center; min-width:70px; min-height:44px; padding:6px 9px; border:0; border-radius:10px; background:var(--ui-accent-soft); color:var(--ui-accent); font-size:12px; }
  .app .mobile-sms-list .table-wrap tr:not(.mobile-record-expanded) td[data-mobile-record-detail="true"] { display:none; }
  .app .mobile-sms-list .table-wrap tr:not(.mobile-record-expanded) .message-device-id { display:none; }
  .app .mobile-sms-list .table-wrap td.mobile-record-body { grid-column:1/-1; }
  .app .mobile-sms-list .table-wrap tr:not(.mobile-record-expanded) .message-body { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
  .app .mobile-sms-list .table-wrap td :is(span,small,code) { font-size:14px; }
  .app .mobile-simple-list :is(table,tbody) { display:block; width:100%; min-width:0; }
  .app .mobile-simple-list .table-wrap thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .app .mobile-simple-list tbody tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:12px; padding:14px; border:1px solid var(--ui-border); border-radius:13px; }
  .app .mobile-simple-list .table-wrap tbody td { display:flex; flex-direction:column; gap:4px; padding:0; min-width:0; border:0; white-space:normal; overflow-wrap:anywhere; }
  .app .mobile-simple-list tbody td::before { content:attr(data-mobile-label); font-size:11px; color:var(--ui-muted); }
  .app .table-pagination { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:10px; padding:12px; }
  .app .table-pagination>span { font-size:11px; }
  .app .table-page-size { gap:6px; font-size:11px; }
  .app .table-page-size select { min-height:44px; max-width:76px; padding:7px; font-size:14px; }
  .app .table-pagination-controls { width:100%; flex-wrap:nowrap; gap:4px; justify-content:center; }
  .app .table-pagination-controls button { min-height:44px; padding:7px 10px; }
  .app .table-pagination:not(:has(.table-pagination-controls button:not(:disabled))) .table-pagination-controls { display:none; }
  /* Device status and quota stay visible; identifiers and controls are a tap away. */
  .app .device-groups { padding:12px; gap:14px; }
  .app .device-group { padding:0; overflow:hidden; border-radius:13px; }
  .app .device-group-head { padding:13px; gap:12px; }
  .app .device-group-owner>span { font-size:11px; }
  .app .device-user-summary { width:100%; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px; }
  .app .device-user-metric { grid-column:span 2; padding:8px; }
  .app .device-user-metric:nth-child(n+4) { grid-column:span 3; }
  .app .workspace #content .device-user-metric dt { min-height:0; font-size:12px; }
  .app .workspace #content .device-user-metric dd { font-size:14px; }
  .app .device-grid { gap:10px; padding:10px; }
  .app .device { padding:14px; border-radius:12px; }
  .app .device-identity { flex-basis:150px; }
  .app .device:not(.mobile-device-expanded) :is(.device-network,.device-app-version,.device-id,.sim-identifiers),.app .device:not(.mobile-device-expanded)>:is(p,small) { display:none; }
  .app .device:not(.mobile-device-expanded) .sim-limit-card>[data-limits-device-id],.app .device:not(.mobile-device-expanded) .device-actions>button:not(.mobile-device-toggle) { display:none; }
  .app .sim-limit-grid { gap:8px; margin-top:12px; }
  .app .sim-limit-card { padding:12px; border-radius:10px; }
  .app .sim-limit-values { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .app .sim-quota-item { min-width:0; padding:7px; }
  .app .workspace #content .sim-quota-item>small { font-size:12px; }
  .app .sim-limit-values .sim-quota-number { gap:4px; }
  .app .workspace #content .sim-limit-values .sim-quota-number :is(strong,span) { font-size:13px; }
  .app .device-actions { margin-top:12px; }
  .app .mobile-device-toggle { display:flex !important; align-items:center; justify-content:center; width:100%; min-height:44px; border-radius:10px; }
  .app .live-summary-note,.app .device-quota-note { font-size:12px; padding:10px 14px; }
  dialog { width:calc(100% - 20px); max-height:calc(100dvh - 32px); padding:18px; border-radius:18px; }
  dialog .dialog-actions { position:sticky; bottom:-18px; padding:12px 0; margin-top:14px; background:var(--ui-surface); }
  dialog .dialog-actions button { min-height:44px; }
}
@media(min-width:701px) and (max-width:1024px) {
  .app .workspace #content .stats { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:360px) {
  .app .workspace { padding-inline:8px; }.app .workspace>.workspace-header { margin-inline:-8px; padding-inline:12px; }
  .app .workspace .mobile-bottom-nav button span { font-size:10px; }
  .app .daily-message-report tbody>tr { margin:8px; gap:8px; padding:10px; }
  .app .mobile-sms-list .table-wrap tbody tr { margin:8px; padding:12px; }
}
@media(prefers-reduced-motion:reduce) { .app .mobile-bottom-nav * { transition:none; } }
@media print { .mobile-bottom-nav,.mobile-filter-toggle,.mobile-record-toggle,.mobile-device-toggle { display:none !important; } }