/* Compact, table-led management UI. Load after the shared/mobile styles. */
main.content[data-role="admin"] {
  min-width: 0;
  max-width: 1504px;
  padding: 20px 24px 28px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.55;
}

main.content[data-role="admin"] .admin-view {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

main.content[data-role="admin"] .admin-view > div[style*="margin-top"],
main.content[data-role="admin"] .admin-view > .grid-2,
main.content[data-role="admin"] .admin-view > .grid-4 {
  margin-top: 0 !important;
}

main.content[data-role="admin"] .page-heading {
  margin: 0 0 2px;
  gap: 14px;
}

main.content[data-role="admin"] .page-heading > div {
  min-width: 0;
}

main.content[data-role="admin"] .page-heading h1 {
  font-size: 24px;
  line-height: 1.4;
  font-weight: 750;
  letter-spacing: -.3px;
}

main.content[data-role="admin"] .page-heading p {
  margin-top: 3px;
  font-size: 13px;
  line-height: 1.55;
  font-weight: 400;
  color: #758399;
}

main.content[data-role="admin"] h2,
main.content[data-role="admin"] .card-head h2 {
  font-size: 17px;
  line-height: 1.5;
  font-weight: 700;
}

main.content[data-role="admin"] h3 {
  font-size: 15px;
  font-weight: 650;
}

main.content[data-role="admin"] p {
  line-height: 1.6;
}

main.content[data-role="admin"] .muted,
main.content[data-role="admin"] .small,
main.content[data-role="admin"] small,
main.content[data-role="admin"] .help {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.55;
  color: #78859a;
}

main.content[data-role="admin"] .card {
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid #e4e9f0;
  border-radius: 6px;
  background: #fff;
  box-shadow: none;
}

main.content[data-role="admin"] .admin-view > .card:first-of-type {
  padding-top: 14px;
  padding-bottom: 14px;
}

main.content[data-role="admin"] .card .card {
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

main.content[data-role="admin"] .card-head {
  gap: 10px;
  margin-bottom: 12px;
  align-items: center;
}

main.content[data-role="admin"] .card-head > div {
  min-width: 0;
}

main.content[data-role="admin"] .card-head p {
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 400;
}

main.content[data-role="admin"] .grid-2,
main.content[data-role="admin"] .grid-3 {
  gap: 12px;
  align-items: start;
}

main.content[data-role="admin"] .mini-grid {
  gap: 12px;
}

main.content[data-role="admin"] .stack {
  gap: 9px;
}

main.content[data-role="admin"] .btn,
main.content[data-role="admin"] .btn.tiny,
main.content[data-role="admin"] .btn.link {
  min-height: 32px;
  border-radius: 5px;
  padding: 4px 10px;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 550;
  box-shadow: none;
}

main.content[data-role="admin"] .btn.link {
  padding-right: 2px;
  padding-left: 2px;
}

main.content[data-role="admin"] .badge {
  padding: 2px 7px;
  border-radius: 4px;
  font-size: 12px;
  line-height: 1.6;
  font-weight: 500;
}

main.content[data-role="admin"] > .demo-banner { display: none; }
main.content[data-role="admin"] .stat-note { margin-top: 6px; color: #748197; font-size: 12px; font-weight: 400; line-height: 1.5; }
main.content[data-role="admin"] .stat-tag { margin-top: 6px; }
main.content[data-role="admin"] .admin-table-note { border-top: 1px solid #e9edf3; color: #7d899c; font-size: 12px; padding: 10px 14px; }
main.content[data-role="admin"] .admin-worklist .list-row small { display: block; color: #7a899c; margin-top: 3px; font-size: 12px; font-weight: 400; }
main.content[data-role="admin"] .admin-service-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; min-height: 34px; }
main.content[data-role="admin"] .admin-service-row .is-good { color: #278d7d; }
main.content[data-role="admin"] .admin-service-row .is-warn { color: #c18424; }
main.content[data-role="admin"] .admin-inline-settings { display: flex; gap: 12px 24px; flex-wrap: wrap; align-items: center; margin-top: 14px; font-size: 13px; }
main.content[data-role="admin"] .admin-secondary-body { padding: 0 14px 14px; }
main.content[data-role="admin"] .admin-notice {
  min-width: 0;
  margin: 0;
  padding: 0 12px;
  border: 1px solid #e8edf4;
  border-radius: 6px;
  background: #f7f9fc;
  color: #758399;
}

main.content[data-role="admin"] .admin-notice > summary {
  min-height: 36px;
  padding: 8px 0;
  font-size: 12px;
  line-height: 1.6;
  font-weight: 500;
  cursor: pointer;
}

main.content[data-role="admin"] .admin-notice > p {
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.65;
  font-weight: 400;
  overflow-wrap: anywhere;
}

/* One summary surface, not four independent presentation cards. */
main.content[data-role="admin"] .admin-view > .grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid #e4e9f0;
  border-radius: 6px;
  background: #fff;
}

main.content[data-role="admin"] .admin-view > .grid-4 > .stat {
  min-width: 0;
  min-height: 102px;
  padding: 13px 18px;
  border: 0;
  border-right: 1px solid #e9edf3;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

main.content[data-role="admin"] .admin-view > .grid-4 > .stat:last-child {
  border-right: 0;
}

main.content[data-role="admin"] .admin-view > .grid-4 > .stat > .muted:first-child {
  font-size: 13px;
  line-height: 1.5;
  color: #617189;
  font-weight: 500;
}

main.content[data-role="admin"] .metric-value,
main.content[data-role="admin"] .grid-4 .metric-value {
  margin-top: 7px;
  font-size: 30px;
  line-height: 1.2;
  font-weight: 750;
  letter-spacing: -.5px;
  font-variant-numeric: tabular-nums;
}

main.content[data-role="admin"] .grid-4 .stat > .muted:last-child {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 400;
}

main.content[data-role="admin"] .grid-4 .stat > div[style*="margin-top"] {
  margin-top: 6px !important;
}

main.content[data-role="admin"] .mini-grid .metric-value {
  margin-top: 6px;
  font-size: 24px;
  line-height: 1.3;
}

main.content[data-role="admin"] .admin-overview-columns {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(230px, 1fr);
  align-items: start;
  gap: 12px;
  min-width: 0;
}

main.content[data-role="admin"] .account-preview,
main.content[data-role="admin"] .admin-worklist {
  min-width: 0;
}

main.content[data-role="admin"] .account-preview.card {
  padding: 0;
}

main.content[data-role="admin"] .account-preview > .card-head {
  margin: 0;
  padding: 13px 14px 11px;
}

main.content[data-role="admin"] .account-preview > .table-footer {
  padding: 9px 14px;
}

main.content[data-role="admin"] .admin-worklist {
  padding: 14px;
  border: 1px solid #e4e9f0;
  border-radius: 6px;
  background: #fff;
}

main.content[data-role="admin"] .admin-worklist h2 {
  margin-bottom: 7px;
  font-size: 16px;
}

main.content[data-role="admin"] .admin-worklist > h2:not(:first-child) {
  margin-top: 16px;
}

main.content[data-role="admin"] .admin-worklist > section + section {
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid #e8edf3;
}

main.content[data-role="admin"] .list-row {
  min-width: 0;
  gap: 10px;
  padding: 10px 0;
  border-color: #ebeff4;
  font-size: 14px;
  line-height: 1.5;
}

main.content[data-role="admin"] .list-row > div {
  min-width: 0;
}

main.content[data-role="admin"] .list-row strong {
  font-size: 14px;
  font-weight: 650;
}

main.content[data-role="admin"] .admin-worklist .list-row {
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 6px 9px;
  padding: 9px 0;
}

main.content[data-role="admin"] .admin-worklist .list-row > div:first-child {
  flex: 1 1 120px;
}

main.content[data-role="admin"] .admin-worklist .muted {
  font-size: 12px;
  line-height: 1.55;
}

main.content[data-role="admin"] .table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}

main.content[data-role="admin"] table {
  width: 100%;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

main.content[data-role="admin"] th {
  height: 38px;
  padding: 8px 12px;
  background: #f7f9fc;
  color: #748197;
  border-color: #e9edf3;
  font-size: 12px;
  font-weight: 550;
  line-height: 1.5;
  letter-spacing: 0;
}

main.content[data-role="admin"] td {
  height: 52px;
  padding: 8px 12px;
  border-color: #edf0f5;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  vertical-align: middle;
}

main.content[data-role="admin"] td strong {
  font-size: 14px;
  font-weight: 650;
}

main.content[data-role="admin"] td .muted {
  margin-top: 2px;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 400;
}

main.content[data-role="admin"] .numeric {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

main.content[data-role="admin"] td.numeric strong {
  font-weight: 750;
}

main.content[data-role="admin"] tbody tr:hover {
  background: #f8fbff;
}

main.content[data-role="admin"] .table-footer {
  font-size: 12px;
  line-height: 1.5;
  padding: 9px 12px;
  color: #7d899c;
}

main.content[data-role="admin"] .admin-filterbar {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) 180px auto;
  align-items: end;
  gap: 10px;
  min-width: 0;
  margin-bottom: 12px;
}

main.content[data-role="admin"] .admin-filterbar > * {
  min-width: 0;
}

main.content[data-role="admin"] .admin-filterbar .field {
  gap: 5px;
}

main.content[data-role="admin"] .field,
main.content[data-role="admin"] .field > span:first-child,
main.content[data-role="admin"] .field > label {
  font-size: 13px;
  line-height: 1.5;
  font-weight: 500;
}

main.content[data-role="admin"] .field input:not([type="checkbox"]),
main.content[data-role="admin"] .field select,
main.content[data-role="admin"] .field textarea,
main.content[data-role="admin"] .admin-filterbar input,
main.content[data-role="admin"] .admin-filterbar select {
  min-width: 0;
  max-width: 100%;
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 400;
}

main.content[data-role="admin"] .admin-filterbar .btn {
  min-height: 34px;
}

main.content[data-role="admin"] .admin-channel-table {
  min-width: 0;
}

main.content[data-role="admin"] .admin-channel-table td {
  height: 54px;
}

main.content[data-role="admin"] .admin-channel-table .btn {
  margin: 0;
}

main.content[data-role="admin"] .admin-secondary {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 1px solid #e4e9f0;
  border-radius: 6px;
  background: #fff;
}

main.content[data-role="admin"] .admin-secondary > summary {
  min-height: 40px;
  padding: 10px 14px;
  color: #657791;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 550;
}

main.content[data-role="admin"] .admin-secondary[open] > summary {
  border-bottom: 1px solid #e9edf3;
}

main.content[data-role="admin"] .admin-secondary > p,
main.content[data-role="admin"] .admin-secondary > .table-wrap,
main.content[data-role="admin"] .admin-secondary > .stack,
main.content[data-role="admin"] .admin-secondary > .grid-2 {
  margin: 0;
  padding: 12px 14px;
}

main.content[data-role="admin"] .admin-secondary > .card,
main.content[data-role="admin"] .admin-secondary .grid-2 > .card {
  border: 0;
  border-radius: 0;
  padding: 12px 14px;
  background: transparent;
  box-shadow: none;
}

main.content[data-role="admin"] .admin-secondary .grid-2 > .card {
  padding: 0;
}

main.content[data-role="admin"] .admin-secondary p {
  font-size: 13px;
  line-height: 1.65;
  font-weight: 400;
}

main.content[data-role="admin"] .admin-view[data-admin-page="health"] .card,
main.content[data-role="admin"] .admin-view[data-admin-page="scripts"] .card,
main.content[data-role="admin"] .admin-view[data-admin-page="roadmap"] .card {
  padding: 13px 15px;
}

main.content[data-role="admin"] .admin-view[data-admin-page="health"] .grid-4 > .stat,
main.content[data-role="admin"] .admin-view[data-admin-page="scripts"] .grid-4 > .stat {
  padding: 13px 18px;
}

main.content[data-role="admin"] .admin-view[data-admin-page="roadmap"] .card > p + p,
main.content[data-role="admin"] .admin-view[data-admin-page="scripts"] .card > p + p {
  margin-top: 6px;
}

@media (min-width: 761px) and (max-width: 1100px) {
  main.content[data-role="admin"] {
    padding-right: 18px;
    padding-left: 18px;
  }

  main.content[data-role="admin"] .admin-overview-columns {
    grid-template-columns: minmax(0, 3fr) minmax(210px, 1fr);
  }

  main.content[data-role="admin"] .admin-view > .grid-4 > .stat {
    padding: 12px 14px;
  }

  main.content[data-role="admin"] .admin-filterbar {
    grid-template-columns: minmax(150px, 1fr) 160px auto;
  }
}

@media (max-width: 760px) {
  main.content[data-role="admin"] {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 16px 14px calc(96px + env(safe-area-inset-bottom));
    overflow-x: clip;
    font-size: 14px;
  }

  main.content[data-role="admin"] .admin-view {
    gap: 12px;
  }

  main.content[data-role="admin"] .page-heading {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 9px;
  }

  main.content[data-role="admin"] .page-heading h1 {
    font-size: 23px;
  }

  main.content[data-role="admin"] .page-heading p {
    font-size: 13px;
    line-height: 1.6;
  }

  main.content[data-role="admin"] .page-heading > div:last-child {
    max-width: 100%;
  }

  main.content[data-role="admin"] .admin-notice > summary,
  main.content[data-role="admin"] .admin-secondary > summary {
    min-height: 44px;
    padding-top: 11px;
    padding-bottom: 11px;
    font-size: 13px;
  }

  main.content[data-role="admin"] .admin-view > .grid-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  main.content[data-role="admin"] .admin-view > .grid-4 > .stat,
  main.content[data-role="admin"] .admin-view[data-admin-page="health"] .grid-4 > .stat,
  main.content[data-role="admin"] .admin-view[data-admin-page="scripts"] .grid-4 > .stat {
    min-height: 105px;
    padding: 12px 14px;
    border-right: 1px solid #e9edf3;
    border-bottom: 1px solid #e9edf3;
  }

  main.content[data-role="admin"] .admin-view > .grid-4 > .stat:nth-child(2n) {
    border-right: 0;
  }

  main.content[data-role="admin"] .admin-view > .grid-4 > .stat:nth-last-child(-n+2) {
    border-bottom: 0;
  }

  main.content[data-role="admin"] .grid-4 .metric-value {
    font-size: 30px;
  }

  main.content[data-role="admin"] .admin-overview-columns {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  main.content[data-role="admin"] .admin-filterbar {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  main.content[data-role="admin"] .admin-filterbar > div:last-child {
    width: 100%;
    flex-wrap: wrap;
  }

  main.content[data-role="admin"] .admin-filterbar > div:last-child > .btn {
    flex: 1;
  }

  main.content[data-role="admin"] .card,
  main.content[data-role="admin"] .admin-view[data-admin-page="health"] .card,
  main.content[data-role="admin"] .admin-view[data-admin-page="scripts"] .card,
  main.content[data-role="admin"] .admin-view[data-admin-page="roadmap"] .card {
    min-width: 0;
    padding: 13px;
  }

  main.content[data-role="admin"] .account-preview.card {
    padding: 0;
  }

  main.content[data-role="admin"] .card-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  main.content[data-role="admin"] .card-head h2,
  main.content[data-role="admin"] h2 {
    font-size: 17px;
  }

  main.content[data-role="admin"] .table-wrap {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  main.content[data-role="admin"] table {
    width: 100%;
    white-space: nowrap;
  }

  main.content[data-role="admin"] th {
    padding: 9px 11px;
    font-size: 12px;
  }

  main.content[data-role="admin"] td,
  main.content[data-role="admin"] .admin-channel-table td {
    height: 56px;
    padding: 7px 11px;
    font-size: 14px;
  }

  main.content[data-role="admin"] .btn,
  main.content[data-role="admin"] .btn.tiny,
  main.content[data-role="admin"] .btn.link,
  main.content[data-role="admin"] .admin-filterbar .btn {
    min-height: 44px;
    font-size: 14px;
    padding: 7px 10px;
  }

  main.content[data-role="admin"] .field input:not([type="checkbox"]),
  main.content[data-role="admin"] .field select,
  main.content[data-role="admin"] .field textarea,
  main.content[data-role="admin"] .admin-filterbar input,
  main.content[data-role="admin"] .admin-filterbar select {
    min-height: 44px;
    font-size: 16px;
  }

  main.content[data-role="admin"] .admin-worklist {
    padding: 13px;
  }

  main.content[data-role="admin"] .admin-worklist .list-row {
    align-items: center;
    padding: 9px 0;
  }

  main.content[data-role="admin"] .list-row > div {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  main.content[data-role="admin"] .grid-2,
  main.content[data-role="admin"] .grid-3 {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
}