:root {
  --admin-bg: #f5f5f5;
  --admin-surface: #ffffff;
  --admin-surface-muted: #f3f3f3;
  --admin-sidebar: #f0f0f0;
  --admin-border: #d1d1d1;
  --admin-border-soft: #e4e4e4;
  --admin-text: #1f1f1f;
  --admin-muted: #666666;
  --admin-accent: #0067c0;
  --admin-accent-hover: #005a9e;
  --admin-success: #107c10;
  --admin-danger: #c42b1c;
}

.admin-portal-body,
.admin-portal-body button,
.admin-portal-body input,
.admin-portal-body textarea,
.admin-portal-body select {
  font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

.admin-portal-body {
  margin: 0;
  background: var(--admin-bg);
  color: var(--admin-text);
  font-size: 13px;
}

.admin-portal-body *,
.admin-portal-body *::before,
.admin-portal-body *::after { box-sizing: border-box; }

/* Login and access denied */
.admin-portal-body .login-screen,
.admin-denied {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: #ececec;
}

.admin-portal-body .login-panel,
.admin-denied-card {
  width: min(390px, 100%);
  padding: 24px;
  background: var(--admin-surface);
  border: 1px solid #c8c8c8;
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.admin-portal-body .login-brand { margin-bottom: 24px; gap: 10px; }
.admin-portal-body .login-brand h1 { font-size: 20px; font-weight: 600; }
.admin-portal-body .login-brand p { color: var(--admin-muted); font-size: 12px; }
.admin-portal-body .brand-mark,
.admin-brand-mark {
  width: 34px;
  height: 34px;
  border: 1px solid #b9b9b9;
  border-radius: 2px;
  background: #f2f2f2;
  color: #333;
  font-size: 18px;
  box-shadow: none;
}

.admin-denied-card { max-width: 440px; text-align: left; }
.admin-denied-card .metric-icon { margin: 0 0 14px; }
.admin-denied-card h1 { margin: 0 0 8px; font-size: 20px; }
.admin-denied-card p { margin: 0 0 20px; color: var(--admin-muted); }

/* Main shell */
.admin-portal-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 246px minmax(0, 1fr);
  background: var(--admin-bg);
}

.admin-sidebar {
  position: sticky;
  top: 0;
  z-index: 30;
  height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 12px 10px;
  color: var(--admin-text);
  background: var(--admin-sidebar);
  border-right: 1px solid var(--admin-border);
  box-shadow: none;
}

.admin-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 5px 8px 12px;
  border-bottom: 1px solid var(--admin-border);
}

.admin-brand strong,
.admin-brand span { display: block; }
.admin-brand strong { color: var(--admin-text); font-size: 14px; font-weight: 600; }
.admin-brand span { margin-top: 2px; color: var(--admin-muted); font-size: 11px; letter-spacing: 0; text-transform: none; }

.admin-environment {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  margin: 8px 4px;
  padding: 7px 8px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--admin-border-soft);
  border-radius: 0;
}
.admin-environment strong,
.admin-environment small { display: block; }
.admin-environment strong { color: var(--admin-text); font-size: 12px; font-weight: 500; }
.admin-environment small { margin-top: 1px; color: var(--admin-muted); font-size: 10.5px; }
.admin-pulse {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: var(--admin-success);
  box-shadow: none;
}

.admin-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 2px;
}

.admin-nav-item {
  position: relative;
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: transparent;
  color: #303030;
  text-align: left;
  cursor: pointer;
  font: inherit;
  transition: background-color .08s linear, border-color .08s linear;
}
.admin-nav-item i { width: 18px; font-size: 18px; color: #4f4f4f; }
.admin-nav-item:hover { background: #e7e7e7; color: var(--admin-text); }
.admin-nav-item.active {
  background: #e1e1e1;
  border-color: #d4d4d4;
  color: #111;
  box-shadow: none;
}
.admin-nav-item.active::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 2px;
  background: var(--admin-accent);
}
.admin-nav-item.active i { color: var(--admin-accent); }

.admin-sidebar-footer {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px solid var(--admin-border);
  display: grid;
  gap: 6px;
}
.admin-profile {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 6px 10px;
}
.admin-profile strong,
.admin-profile span { display: block; }
.admin-profile strong { color: var(--admin-text); font-size: 12px; font-weight: 600; }
.admin-profile span { margin-top: 1px; color: var(--admin-muted); font-size: 10.5px; }
.admin-profile .profile-avatar {
  width: 30px;
  height: 30px;
  background: #e5e5e5;
  border: 1px solid #cfcfcf;
  border-radius: 2px;
  color: #444;
}
.admin-sidebar .button.secondary,
.admin-sidebar .button.ghost {
  min-height: 32px;
  justify-content: flex-start;
  background: transparent;
  border-color: transparent;
  color: #333;
}
.admin-sidebar .button.secondary:hover,
.admin-sidebar .button.ghost:hover { background: #e3e3e3; border-color: #d6d6d6; }

/* Content */
.admin-content {
  min-width: 0;
  padding: 0 24px 32px;
  background: var(--admin-bg);
  background-image: none;
}

.admin-header {
  position: sticky;
  top: 0;
  z-index: 20;
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background: rgba(245, 245, 245, .98);
  border-bottom: 1px solid var(--admin-border);
  backdrop-filter: none;
}
.admin-header h1 { margin: 2px 0 3px; font-size: 22px; line-height: 1.2; font-weight: 600; }
.admin-header p { margin: 0; color: var(--admin-muted); font-size: 12px; }
.admin-header-kicker { color: #616161; font-size: 10.5px; font-weight: 400; letter-spacing: 0; }
.admin-header-actions { display: flex; align-items: center; gap: 8px; }
.admin-header .status-chip {
  min-height: 30px;
  padding: 0 9px;
  border-color: #c9c9c9;
  border-radius: 2px;
  background: #fff;
  color: #444;
}
.admin-header .status-chip.online { color: #1b5e20; background: #fff; border-color: #bcbcbc; }
.admin-header .status-chip.online .status-dot { background: var(--admin-success); }

.admin-page { display: none; padding-top: 20px; }
.admin-page.active { display: block; }

.admin-command-strip {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 8px 12px;
  margin-bottom: 12px;
  border: 1px solid var(--admin-border);
  border-radius: 2px;
  background: #fff;
  color: #333;
}
.admin-command-strip > div { display: flex; align-items: center; gap: 9px; }
.admin-command-strip > div > i { font-size: 18px; color: #555; }
.admin-command-strip strong,
.admin-command-strip small { display: block; }
.admin-command-strip strong { font-size: 12px; font-weight: 600; }
.admin-command-strip small { margin-top: 1px; color: var(--admin-muted); font-size: 10.5px; }
.admin-command-strip time { color: #555; font: 11px Consolas, "Cascadia Mono", monospace; }

.section-intro {
  min-height: 46px;
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.section-intro h2 { font-size: 17px; font-weight: 600; }
.section-intro p { color: var(--admin-muted); font-size: 11.5px; }

/* Flat Windows-like surfaces */
.admin-portal-body .panel,
.admin-panel-card,
.admin-portal-body .metric-card {
  border: 1px solid var(--admin-border);
  border-radius: 2px;
  background: var(--admin-surface);
  box-shadow: none;
}

.admin-portal-body .metric-grid { gap: 10px; margin-bottom: 12px; }
.admin-portal-body .metric-card {
  min-height: 92px;
  gap: 11px;
  padding: 13px 14px;
}
.admin-portal-body .metric-icon {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #555;
  font-size: 20px;
}
.admin-portal-body .metric-card span { color: var(--admin-muted); font-size: 11px; }
.admin-portal-body .metric-card strong { margin: 2px 0; font-size: 22px; font-weight: 600; }
.admin-portal-body .metric-card small { color: #707070; font-size: 10.5px; }
.admin-metric { position: static; overflow: visible; }
.admin-metric::after { display: none; }

.admin-portal-body .panel-header {
  min-height: 54px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--admin-border-soft);
  background: #fafafa;
}
.admin-portal-body .panel-header h2 { font-size: 13px; font-weight: 600; }
.admin-portal-body .panel-header p { color: var(--admin-muted); font-size: 10.5px; }

.admin-live-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #555;
  font: 10.5px "Segoe UI", sans-serif;
  letter-spacing: 0;
  text-transform: none;
}
.admin-live-label i { width: 7px; height: 7px; border-radius: 50%; background: var(--admin-success); box-shadow: none; }

/* Controls */
.admin-portal-body .button,
.admin-portal-body .icon-button {
  border-radius: 2px;
  box-shadow: none;
  font-weight: 400;
  transition: background-color .08s linear, border-color .08s linear;
}
.admin-portal-body .button { min-height: 32px; padding: 0 11px; font-size: 12px; }
.admin-portal-body .button.primary { background: var(--admin-accent); border-color: var(--admin-accent); color: #fff; }
.admin-portal-body .button.primary:hover { background: var(--admin-accent-hover); border-color: var(--admin-accent-hover); }
.admin-portal-body .button.secondary { background: #fff; border-color: #c7c7c7; color: #222; }
.admin-portal-body .button.secondary:hover,
.admin-portal-body .button.tertiary:hover,
.admin-portal-body .button.ghost:hover { background: #ededed; }
.admin-portal-body .button.tertiary,
.admin-portal-body .button.ghost { color: #222; background: transparent; border-color: transparent; }
.admin-portal-body .button.danger { background: #fff; border-color: var(--admin-danger); color: var(--admin-danger); }
.admin-portal-body .button.danger:hover { background: #fde7e5; }
.admin-portal-body .icon-button { background: #fff; border-color: #c7c7c7; }

.admin-portal-body input,
.admin-portal-body textarea,
.admin-portal-body select {
  min-height: 34px;
  border: 1px solid #b8b8b8;
  border-radius: 2px;
  background: #fff;
  color: #222;
  box-shadow: none;
}
.admin-portal-body input:focus,
.admin-portal-body textarea:focus,
.admin-portal-body select:focus {
  outline: 1px solid var(--admin-accent);
  outline-offset: -1px;
  border-color: var(--admin-accent);
}
.admin-portal-body .field { color: #333; font-size: 11px; }
.admin-portal-body .field small { color: var(--admin-muted); }
.admin-portal-body .form-stack { padding: 14px; gap: 12px; }

.admin-portal-body .switch-field { color: #333; }
.admin-portal-body .switch { border-radius: 10px; background: #b8b8b8; }
.admin-portal-body .switch::after { box-shadow: none; }
.admin-portal-body .switch-field input:checked + .switch { background: var(--admin-accent); }

.admin-portal-body .notice {
  border: 0;
  border-left: 3px solid #8a8a8a;
  border-radius: 0;
  background: #f7f7f7;
  color: #444;
}
.admin-portal-body .notice.neutral { background: #f7f7f7; }

/* Tables */
.admin-portal-body .table-scroll { scrollbar-color: #b5b5b5 #f2f2f2; }
.admin-portal-body .data-table th,
.admin-portal-body .data-table td {
  padding: 9px 11px;
  border-bottom: 1px solid var(--admin-border-soft);
  font-size: 11.5px;
}
.admin-portal-body .data-table th {
  background: #f3f3f3;
  color: #444;
  font-weight: 600;
}
.admin-portal-body .data-table tbody tr:hover { background: #f7f7f7; }
.admin-portal-body .status-badge {
  min-height: 22px;
  padding: 0 6px;
  border-radius: 2px;
  background: #f4f4f4;
}
.admin-portal-body .status-badge.success { color: #0b6a0b; background: #f3faf3; border-color: #a9cfa9; }
.admin-portal-body .status-badge.warning { color: #7a5b00; background: #fffaf0; border-color: #d8c68a; }
.admin-portal-body .status-badge.danger { color: #a4262c; background: #fff5f5; border-color: #d9aaaa; }

/* Chart and summaries */
.admin-portal-body .system-chart-wrap { min-height: 300px; padding: 8px 12px 0; background: #fff; }
.admin-portal-body .system-chart-surface { position: relative; width: 100%; height: 300px; }
.admin-portal-body .system-chart-legend { padding: 4px 14px 12px; gap: 16px; color: var(--admin-muted); }
.admin-portal-body .system-chart-legend i { border-radius: 0; }
.admin-portal-body .storage-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  padding: 0 14px;
}
.admin-portal-body .storage-summary div {
  min-height: 72px;
  padding: 13px 4px;
  border: 0;
  border-bottom: 1px solid var(--admin-border-soft);
  border-radius: 0;
  background: transparent;
}
.admin-portal-body .storage-summary div:nth-last-child(-n+2) { border-bottom: 0; }
.admin-portal-body .storage-summary strong { font-size: 17px; font-weight: 600; }
.admin-portal-body .server-control-body,
.admin-portal-body .release-upload-grid { padding: 14px; }

.admin-portal-body .recording-apps-list { gap: 0; }
.admin-portal-body .recording-app-row,
.admin-portal-body .recording-apps-unknown { border-radius: 0; }

.admin-portal-body .toast {
  border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .14);
}

.admin-mobile-only { display: none; }

@media (max-width: 1100px) {
  .admin-portal-body .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-portal-body .layout-two { grid-template-columns: 1fr; }
}

@media (max-width: 920px) {
  .admin-portal-shell { grid-template-columns: 1fr; }
  .admin-sidebar {
    position: fixed;
    left: -260px;
    width: 246px;
    transition: left .16s ease;
    box-shadow: 4px 0 12px rgba(0, 0, 0, .16);
  }
  .admin-portal-shell.menu-open .admin-sidebar { left: 0; }
  .admin-content { padding: 0 16px 28px; }
  .admin-header { min-height: 72px; }
  .admin-header-actions .status-chip,
  .admin-header-actions .button.secondary { display: none; }
  .admin-mobile-only { display: inline-grid; }
  .admin-portal-shell.menu-open #adminSidebarBackdrop { display: block; }
}

@media (max-width: 620px) {
  .admin-content { padding-left: 10px; padding-right: 10px; }
  .admin-header h1 { font-size: 19px; }
  .admin-header p { display: none; }
  .admin-command-strip { align-items: flex-start; flex-direction: column; }
  .admin-portal-body .metric-grid { grid-template-columns: 1fr; }
  .admin-portal-body .storage-summary { grid-template-columns: 1fr; }
  .admin-portal-body .storage-summary div:nth-last-child(-n+2) { border-bottom: 1px solid var(--admin-border-soft); }
  .admin-portal-body .storage-summary div:last-child { border-bottom: 0; }
}

/* Titan Audio 2.0.2 — спокойная единая админ-панель */
.admin-portal-body,
.admin-portal-body button,
.admin-portal-body input,
.admin-portal-body textarea,
.admin-portal-body select {
  font-family: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  font-weight: 400;
}
.admin-portal-body * { font-weight: 400 !important; }
.admin-portal-body h1,
.admin-portal-body h2,
.admin-portal-body h3,
.admin-portal-body h4,
.admin-portal-body strong,
.admin-portal-body b,
.admin-portal-body th,
.admin-portal-body .button,
.admin-portal-body .admin-nav-item { font-weight: 400 !important; }
.admin-portal-shell { grid-template-columns: 204px minmax(0, 1fr); }
.admin-sidebar { padding: 9px 7px; }
.admin-brand { min-height: 50px; padding: 4px 6px 10px; gap: 8px; }
.admin-brand-mark { width: 30px; height: 30px; }
.admin-brand span { display: none; }
.admin-environment { min-height: 40px; margin: 6px 3px; padding: 6px; }
.admin-nav-item { min-height: 35px; padding: 7px 8px; gap: 8px; border-radius: 3px; font-size: 12px; }
.admin-nav-item i { width: 17px; font-size: 16px; }
.admin-content { padding-inline: 22px; }
.admin-header { min-height: 70px; }
.admin-header h1 { font-size: 20px; }
.admin-page { padding-top: 16px; }
.admin-portal-body .panel,
.admin-panel-card,
.admin-portal-body .metric-card { border-radius: 4px; }
.admin-portal-body .panel-header { min-height: 52px; background: #fff; }
.admin-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.admin-chart-grid .panel { margin-bottom: 0; min-width: 0; }
.admin-portal-body .system-chart-wrap.compact { min-height: 224px; padding: 4px 8px 0; }
.admin-portal-body .system-chart-wrap.compact .system-chart-surface { width: 100%; height: 220px; display: block; }
.system-chart-legend { display: flex; flex-wrap: wrap; }
.system-chart-svg { display: block; overflow: visible; }
.chart-grid-line { stroke: #e2e2e2; stroke-width: 1; vector-effect: non-scaling-stroke; }
.chart-axis-label, .chart-time-label { fill: #666; font: 10px "IBM Plex Sans", "Segoe UI", sans-serif; }
.chart-series-line { fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.chart-series-point, .chart-hover-point { stroke: #fff; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.chart-hover-guide { stroke: #8b8b8b; stroke-width: 1; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke; }
.system-chart-empty { position: absolute; left: 60px; top: 54px; color: #777; font-size: 11px; }
.system-chart-tooltip {
  position: absolute; z-index: 3; width: 190px; padding: 8px 9px; pointer-events: none;
  border: 1px solid #cfcfcf; border-radius: 2px; background: rgba(255,255,255,.97);
  box-shadow: 0 4px 14px rgba(0,0,0,.1); color: #222; font-size: 10.5px;
}
.system-chart-tooltip time { display: block; margin-bottom: 5px; color: #666; }
.system-chart-tooltip span { display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 6px; min-height: 20px; }
.system-chart-tooltip span i { width: 7px; height: 7px; border-radius: 50%; }
.system-chart-tooltip strong { font-weight: 600; }
.legend-spike { background: #8a4b08 !important; }
.legend-errors { background: #c42b1c !important; }
.legend-desktops { background: #0067c0 !important; }
.legend-calls { background: #107c10 !important; }
.legend-archive { background: #666 !important; }
.console-filter-grid { display: grid; grid-template-columns: 180px minmax(260px, 1fr) auto; gap: 10px; align-items: end; padding: 14px; border-bottom: 1px solid var(--admin-border-soft); }
.console-table-scroll { max-height: calc(100vh - 275px); }
.console-table td { vertical-align: top; }
.console-message { display: block; max-width: 760px; white-space: pre-wrap; overflow-wrap: anywhere; color: #222; font: 11px/1.5 "Cascadia Mono", Consolas, monospace; }
.compact-detail { display: block; max-width: 420px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nowrap-cell { white-space: nowrap; }
.admin-portal-body .pagination { padding: 10px 12px; }
@media (max-width: 1100px) {
  .admin-chart-grid { grid-template-columns: 1fr; }
}
@media (max-width: 920px) {
  .admin-portal-shell { grid-template-columns: 1fr; }
  .admin-sidebar { width: 220px; left: -235px; }
}
@media (max-width: 620px) {
  .console-filter-grid { grid-template-columns: 1fr; }
}

/* Titan Audio 2.0.2 polish — все разделы админ-панели в одном ритме */
.admin-page > .section-intro,
.admin-command-strip,
.admin-portal-body .panel,
.admin-portal-body .metric-card {
  border-color: var(--admin-border);
  border-radius: 4px;
  box-shadow: none;
}
.admin-page > .section-intro {
  min-height: 52px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--admin-border);
  background: #fff;
}
.admin-page > .section-intro h2,
.admin-portal-body .panel-header h2 {
  font-size: 14px;
  line-height: 1.25;
}
.admin-page > .section-intro p,
.admin-portal-body .panel-header p {
  color: var(--admin-muted);
  font-size: 11px;
  line-height: 1.45;
}
.admin-portal-body .panel-header {
  min-height: 52px;
  padding: 11px 13px;
  background: #fff;
}
.admin-portal-body .metric-card {
  min-height: 96px;
  padding: 13px;
}
.admin-portal-body .metric-card strong {
  font-size: 20px;
}
.admin-page .layout-two,
.admin-page .metric-grid,
.admin-chart-grid {
  gap: 12px;
}
.admin-portal-body .data-table th,
.admin-portal-body .data-table td,
.admin-portal-body .button,
.admin-nav-item,
.admin-profile,
.admin-environment {
  letter-spacing: 0;
}
@media (max-width: 620px) {
  .admin-page > .section-intro {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
}

/* 2.0.2 final polish: compact charts must fit two columns without inner scrollbars. */
.admin-portal-body .system-chart-wrap.compact { overflow: hidden; }
.admin-portal-body .system-chart-wrap.compact .system-chart-surface { min-width: 0; max-width: 100%; }
.admin-portal-body .admin-brand strong { white-space: nowrap; }

/* v2.0.3: server maintenance controls and paged operational history. */
.server-actions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}
.server-actions-grid .server-control-panel { margin: 0; min-width: 0; }
.server-actions-grid .server-control-body { height: 100%; align-content: start; }
.server-actions-grid .form-message { min-height: 18px; }
@media (max-width: 820px) {
  .server-actions-grid { grid-template-columns: 1fr; }
}

/* Chunked EXE upload progress. */
.release-upload-progress { grid-column: 1 / -1; max-width: 680px; padding: 10px 12px; border: 1px solid var(--border-soft); background: #fafafa; }
.release-upload-progress[hidden] { display: none !important; }
.release-upload-progress-head { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 7px; font-size: 11px; }
.release-upload-progress-head strong { font-weight: 500; color: var(--text); }
.release-upload-progress-head span { color: var(--muted); text-align: right; }

/* Detailed live-network diagnostics. */
.realtime-intro { align-items: end; }
.realtime-toolbar { display: flex; align-items: end; gap: 10px; }
.compact-field { min-width: 140px; }
.compact-field select { min-height: 34px; }
.realtime-command-strip { margin-bottom: 14px; }
.realtime-health-grid { margin-bottom: 14px; }
.realtime-chart-grid { margin-bottom: 14px; }
.realtime-issues-panel { margin-bottom: 14px; }
.realtime-issue-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid var(--admin-border-soft);
}
.realtime-issue-item {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-right: 1px solid var(--admin-border-soft);
  border-bottom: 1px solid var(--admin-border-soft);
}
.realtime-issue-item:nth-child(3n) { border-right: 0; }
.realtime-issue-item > div { min-width: 0; }
.realtime-issue-item strong,
.realtime-issue-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.realtime-issue-item strong { font-size: 12px; font-weight: 400; color: var(--admin-text); }
.realtime-issue-item small { margin-top: 2px; font-size: 10px; color: var(--admin-muted); }
.realtime-issue-item > b { font-size: 18px; font-weight: 400; font-variant-numeric: tabular-nums; }
.realtime-session-scroll { max-height: 420px; }
.realtime-session-table td { vertical-align: top; }
.realtime-events-panel { margin-top: 14px; }
.realtime-events-scroll { max-height: calc(100vh - 350px); min-height: 250px; }
.realtime-filter-grid { grid-template-columns: 180px minmax(280px, 1fr) auto; }
.legend-realtime-websocket { background: #0067c0; }
.legend-realtime-polling { background: #8a4b08; }
.legend-realtime-calls { background: #107c10; }
.legend-realtime-sessions { background: #0067c0; }
.legend-realtime-noaudio { background: #c42b1c; }
.legend-realtime-in { background: #0067c0; }
.legend-realtime-out { background: #107c10; }
.legend-realtime-drop { background: #c42b1c; }
.legend-realtime-reconnect { background: #0067c0; }
.legend-realtime-fallback { background: #8a4b08; }
.legend-realtime-auth { background: #c42b1c; }
.status-badge.success { background: #dff6dd; color: #0b6a0b; border-color: #a9d9a7; }
@media (max-width: 1100px) {
  .realtime-issue-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .realtime-issue-item:nth-child(3n) { border-right: 1px solid var(--admin-border-soft); }
  .realtime-issue-item:nth-child(2n) { border-right: 0; }
}
@media (max-width: 720px) {
  .realtime-toolbar { width: 100%; align-items: stretch; }
  .compact-field { flex: 1; }
  .realtime-issue-list { grid-template-columns: 1fr; }
  .realtime-issue-item,
  .realtime-issue-item:nth-child(2n),
  .realtime-issue-item:nth-child(3n) { border-right: 0; }
  .realtime-filter-grid { grid-template-columns: 1fr; }
}