/* StreamCore Dashboard Rework R1
   Visual baseado na referência operacional fornecida pelo usuário.
   Mantém temas, rotas e fontes reais; remove apenas glow de hover no Dashboard. */

/* ===== Header principal ===== */
.xui-shell .xui-topbar.header-main {
  min-height: 58px !important;
  height: 58px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 22px !important;
  padding: 0 clamp(18px,5.5vw,92px) !important;
  border-bottom: 1px solid rgba(var(--theme-accent-rgb,47,130,255),.20) !important;
  background:
    linear-gradient(115deg, rgba(var(--theme-accent-rgb,47,130,255),.17), transparent 42%),
    linear-gradient(90deg, #081329 0%, #0d2450 48%, #083a75 100%) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.18) !important;
}
.xui-shell.theme-light .xui-topbar.header-main {
  background:
    linear-gradient(115deg, rgba(var(--theme-accent-rgb,47,130,255),.13), transparent 42%),
    linear-gradient(90deg, #f8fbff 0%, #eef5ff 52%, #e8f2ff 100%) !important;
  border-bottom-color: rgba(var(--theme-accent-rgb,47,130,255),.22) !important;
  box-shadow: 0 8px 22px rgba(30,64,175,.08) !important;
}
.xui-shell .xui-brand { min-width: 52px !important; transform: none !important; }
.xui-shell .xui-brand strong,.xui-shell .xui-brand span { font-size: 27px !important; letter-spacing: -1.6px !important; }
.xui-shell .header-stats {
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  overflow: visible !important;
}
.xui-shell .header-stats .top-counter {
  min-height: 34px !important;
  height: 34px !important;
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(148,163,184,.18) !important;
  border-radius: 4px !important;
  background: rgba(7,17,37,.46) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  color: #dbeafe !important;
  white-space: nowrap !important;
}
.xui-shell.theme-light .header-stats .top-counter { background: rgba(255,255,255,.78) !important; color: #27415f !important; border-color: rgba(100,116,139,.19) !important; }
.xui-shell .header-stats .top-counter::before { order: 1; font-size: 11px; font-weight: 650; color: inherit; opacity: .78; }
.xui-shell .header-stats .top-counter:nth-child(1)::before { content: "Online"; }
.xui-shell .header-stats .top-counter:nth-child(2)::before { content: "Users"; }
.xui-shell .header-stats .top-counter:nth-child(3)::before { content: "Live"; }
.xui-shell .header-stats .top-counter:nth-child(4)::before { content: "Net"; }
.xui-shell .header-stats .top-fa { order: 0; font-size: 11px !important; opacity: .85; }
.xui-shell .header-stats b { order: 2; font-size: 12px !important; font-weight: 800 !important; color: #f8fafc !important; }
.xui-shell.theme-light .header-stats b { color: #102a43 !important; }
.xui-shell .header-stats small { order: 3; font-size: 10px !important; color: #9fb1c8 !important; }
.xui-shell .header-stats .top-counter:first-child .top-fa,
.xui-shell .header-stats .stream-state .top-fa {
  width: 7px !important; height: 7px !important; min-width: 7px !important; border-radius: 50% !important;
  background: #22c55e !important; color: transparent !important; font-size: 0 !important;
  box-shadow: 0 0 0 0 rgba(34,197,94,.55); animation: sc-dashboard-pulse 1.8s ease-out infinite !important;
}
.xui-shell .header-stats .top-counter:first-child .top-fa::before,
.xui-shell .header-stats .stream-state .top-fa::before { display:none !important; content:none !important; }
.xui-shell .header-actions { justify-self: end !important; gap: 8px !important; }
.xui-shell .top-search-button,.xui-shell .clean-user-button,.xui-shell .alert-bell-button {
  min-height: 34px !important; height: 34px !important; border-radius: 4px !important;
  border: 1px solid rgba(148,163,184,.18) !important; background: rgba(7,17,37,.38) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.xui-shell.theme-light .top-search-button,.xui-shell.theme-light .clean-user-button,.xui-shell.theme-light .alert-bell-button { background: rgba(255,255,255,.75) !important; border-color: rgba(100,116,139,.18) !important; }

/* Segunda faixa: navegação + relógio live */
.xui-shell .xui-nav.nav-rework,
.xui-shell #xui-main-nav:not(.nav-rework-original-hidden) {
  min-height: 38px !important;
  padding: 0 clamp(18px,5.5vw,92px) !important;
  display: flex !important;
  align-items: center !important;
  gap: 3px !important;
  background: #0c1526 !important;
  border-bottom: 1px solid rgba(148,163,184,.12) !important;
  box-shadow: none !important;
}
.xui-shell.theme-light .xui-nav.nav-rework,
.xui-shell.theme-light #xui-main-nav:not(.nav-rework-original-hidden) { background: #f8fbff !important; border-bottom-color: #dce8f5 !important; }
.xui-shell .xui-nav.nav-rework > .nav-item > button { min-height: 36px !important; padding: 0 11px !important; font-size: 11px !important; }
.sc-nav-live-clock {
  margin-left: auto; min-height: 28px; display: flex; align-items: center; gap: 8px; padding: 0 11px;
  border: 1px solid rgba(148,163,184,.12); border-radius: 4px; background: rgba(4,13,29,.38); color: #94a3b8;
  font-size: 10px; white-space: nowrap;
}
.theme-light .sc-nav-live-clock { background:#fff; border-color:#dde6f1; color:#64748b; }
.sc-nav-live-clock i,.sc-live-dot { width: 6px; height: 6px; display:inline-block; border-radius:50%; background:#22c55e; box-shadow:0 0 0 0 rgba(34,197,94,.55); animation:sc-dashboard-pulse 1.8s ease-out infinite; }
.sc-nav-live-clock b { color:#e5eefc; font-size:11px; letter-spacing:.05em; }
.theme-light .sc-nav-live-clock b { color:#1e334d; }

/* ===== Dashboard principal ===== */
html.sc-dashboard-route .xui-workspace { padding-top: 12px !important; }
html.sc-dashboard-route .xui-workspace > .page-title-row { display:none !important; }
.sc-dashboard-v2 { display:grid; gap:14px; margin-bottom:14px; }
.sc-overview-grid { display:grid; grid-template-columns: 1fr 1fr 1.15fr 1.65fr; gap:10px; }
.sc-overview-card,.sc-realtime-panel,.sc-location-panel {
  position:relative; overflow:hidden; background:#111a2c; border:1px solid #263750; border-radius:4px;
  box-shadow:none; transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.theme-light .sc-overview-card,.theme-light .sc-realtime-panel,.theme-light .sc-location-panel { background:#fff; border-color:#d9e5f2; }
.sc-overview-card:hover,.sc-realtime-panel:hover,.sc-location-panel:hover,
html.sc-dashboard-route .service-status:hover,html.sc-dashboard-route .main-server-card:hover {
  transform:translateY(-2px) !important; border-color:rgba(var(--theme-accent-rgb,47,130,255),.42) !important;
  box-shadow:0 9px 18px rgba(8,20,42,.16) !important;
}
.theme-light .sc-overview-card:hover,.theme-light .sc-realtime-panel:hover,.theme-light .sc-location-panel:hover,
html.sc-dashboard-route .theme-light .service-status:hover,html.sc-dashboard-route .theme-light .main-server-card:hover { box-shadow:0 9px 18px rgba(43,78,120,.10) !important; }
/* remove glow/reflexo mantendo apenas flutuação */
html.sc-dashboard-route .dashboard-board > .stat-card::before,
html.sc-dashboard-route .dashboard-board > .stat-card::after,
html.sc-dashboard-route .xui-panel::before,
html.sc-dashboard-route .main-server-card::before { display:none !important; opacity:0 !important; content:none !important; background:none !important; }

.sc-overview-card { min-height:116px; padding:13px 14px; }
.sc-overview-card > header { display:flex; align-items:center; gap:8px; min-height:22px; color:#879bb5; font-size:10px; letter-spacing:.035em; }
.sc-overview-card > header b { font-size:10px; }
.sc-overview-card > header em { margin-left:auto; display:flex; align-items:center; gap:5px; padding:3px 6px; border-radius:3px; background:rgba(34,197,94,.10); color:#45d97c; font-size:8px; font-style:normal; }
.sc-card-symbol { width:21px;height:21px;display:grid;place-items:center;border-radius:4px;background:rgba(var(--theme-accent-rgb,47,130,255),.12);color:var(--theme-accent,#4aa3ff); }
.sc-dual-metric { display:grid; grid-template-columns:1fr 1fr; gap:0; margin-top:16px; }
.sc-dual-metric > div { min-width:0; }
.sc-dual-metric > div + div { border-left:1px solid rgba(148,163,184,.12); padding-left:15px; }
.sc-dual-metric strong { display:block; color:#f5f8ff; font-size:22px; font-weight:850; line-height:1; }
.theme-light .sc-dual-metric strong,.theme-light .sc-library-grid strong { color:#142a45; }
.sc-dual-metric small { display:flex;align-items:center;gap:6px;margin-top:9px;color:#71859f;font-size:9px; }
.sc-card-streams .sc-dual-metric > div:first-child strong { color:#22c55e; }
.sc-card-streams .sc-dual-metric > div:last-child strong { color:#e3eaf5; }
.theme-light .sc-card-streams .sc-dual-metric > div:last-child strong { color:#20364f; }
.sc-card-bandwidth .sc-dual-metric strong { color:#22d3ee; font-size:19px; }
.sc-card-bandwidth .sc-dual-metric > div:last-child strong { color:#e5e7eb; }
.theme-light .sc-card-bandwidth .sc-dual-metric > div:last-child strong { color:#334155; }
#sc-network-interface { max-width:90px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; opacity:.65; }
.sc-library-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px 14px;margin-top:13px; }
.sc-library-grid div { min-width:0; }
.sc-library-grid strong { display:block;font-size:15px;line-height:1;color:#eef4ff; }
.sc-library-grid small { display:block;margin-top:5px;font-size:8px;color:#71859f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }

.sc-chart-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px; }
.sc-realtime-panel { min-height:252px; padding:0; }
.sc-realtime-panel > header { height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid rgba(148,163,184,.10); }
.sc-realtime-panel > header div { display:flex;align-items:center;gap:8px;color:#e5edf8;font-size:11px; }
.theme-light .sc-realtime-panel > header div { color:#21374f; }
.sc-realtime-panel > header i { color:var(--theme-accent,#4aa3ff); }
.sc-realtime-panel > header span { font-size:8px;padding:4px 7px;border-radius:4px;background:rgba(var(--theme-accent-rgb,47,130,255),.18);color:var(--theme-accent,#4aa3ff);font-weight:800; }
.sc-chart { height:174px; padding:6px 9px 0; }
.sc-chart svg { width:100%;height:100%;overflow:visible; }
.sc-grid-line { stroke:rgba(148,163,184,.14);stroke-width:1;vector-effect:non-scaling-stroke; }
.sc-axis-line { stroke:rgba(148,163,184,.22);stroke-width:1;vector-effect:non-scaling-stroke; }
.sc-grid-label,.sc-time-label { fill:#6f8199;font-size:9px;font-family:inherit; }
.sc-chart-line { fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke; }
.sc-chart-area { opacity:.08; }
.sc-chart-line.cpu,.sc-chart-area.cpu { stroke:#3b82f6;fill:#3b82f6; }
.sc-chart-line.memory,.sc-chart-area.memory { stroke:#a78bfa;fill:#a78bfa; }
.sc-chart-line.io,.sc-chart-area.io { stroke:#22d3ee;fill:#22d3ee; }
.sc-chart-line.net-in,.sc-chart-area.net-in { stroke:#22d3ee;fill:#22d3ee; }
.sc-chart-line.net-out,.sc-chart-area.net-out { stroke:#3b82f6;fill:#3b82f6; }
.sc-chart-line.connections,.sc-chart-area.connections { stroke:#22c55e;fill:#22c55e; }
.sc-chart-line.users,.sc-chart-area.users { stroke:#3b82f6;fill:#3b82f6; }
.sc-chart-line.content,.sc-chart-area.content { stroke:#a78bfa;fill:#a78bfa; }
.sc-realtime-panel > footer { display:flex;gap:13px;justify-content:center;align-items:center;height:30px;color:#8192a8;font-size:9px; }
.sc-realtime-panel > footer span::before { content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:-1px;background:currentColor; }
.sc-realtime-panel footer .cpu,.sc-realtime-panel footer .net-out,.sc-realtime-panel footer .users { color:#3b82f6; }
.sc-realtime-panel footer .memory,.sc-realtime-panel footer .content { color:#a78bfa; }
.sc-realtime-panel footer .io,.sc-realtime-panel footer .net-in { color:#22d3ee; }
.sc-realtime-panel footer .connections { color:#22c55e; }

/* Mantém dados reais do Service Status/servidores Vue e só remodela a apresentação */
html.sc-dashboard-route .dashboard-board.sc-dashboard-legacy-grid {
  display:grid !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important;gap:10px !important;
}
html.sc-dashboard-route .dashboard-board > .stat-card,
html.sc-dashboard-route .dashboard-board > .dashboard-ops-panel,
html.sc-dashboard-route .dashboard-board > .hot-panel,
html.sc-dashboard-route .dashboard-board > .dashboard-imports-panel { display:none !important; }
html.sc-dashboard-route .dashboard-board > .service-status { grid-column:span 2 !important; min-height:330px !important; height:330px !important; display:block !important; place-items:initial !important; width:auto !important; text-shadow:none !important; box-shadow:none !important; }
html.sc-dashboard-route .dashboard-board > .main-server-card { grid-column:span 2 !important; min-width:0 !important; }
html.sc-dashboard-route .service-status .panel-head { min-height:43px !important;padding:0 14px !important; }
html.sc-dashboard-route .service-status .panel-head h2 { font-size:11px !important; }
html.sc-dashboard-route .service-scroll { max-height:285px !important; overflow:auto !important; padding:8px !important; }
html.sc-dashboard-route .service-list { display:grid !important; gap:7px !important; }
html.sc-dashboard-route .service-status-row { min-height:48px !important;padding:8px 10px !important;border:1px solid rgba(148,163,184,.09) !important;border-radius:3px !important;background:rgba(4,13,29,.35) !important; }
html.sc-dashboard-route .theme-light .service-status-row { background:#f8fbff !important;border-color:#e3ebf5 !important; }
html.sc-dashboard-route .service-status-row > i { width:7px !important;height:7px !important;min-width:7px !important;box-shadow:0 0 8px currentColor !important; }
html.sc-dashboard-route .service-status-row strong { font-size:10px !important; }
html.sc-dashboard-route .service-status-row p { font-size:8px !important;margin-top:4px !important;line-height:1.35 !important; }
html.sc-dashboard-route .service-metric-line { font-size:7px !important;gap:5px 8px !important; }
html.sc-dashboard-route .mini-tag { font-size:7px !important;padding:2px 5px !important; }

/* Locations */
.sc-location-panel { grid-column:span 4 !important; min-height:330px; height:330px; }
.sc-location-head { height:43px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid rgba(148,163,184,.10); }
.sc-location-head > div { display:flex;align-items:center;gap:8px; }
.sc-location-head h2 { margin:0;font-size:11px;color:#eef4ff; }
.theme-light .sc-location-head h2 { color:#21374f; }
.sc-location-head > div > i { color:var(--theme-accent,#4aa3ff); }
.sc-location-head > div > span { color:#8da0b8;font-size:9px; }
.sc-location-live { display:flex;align-items:center;gap:6px;font-size:8px;font-weight:800;color:#22c55e; }
.sc-location-body { height:287px;display:grid;grid-template-columns:minmax(0,1.8fr) minmax(180px,.9fr);gap:0; }
.sc-world-map { position:relative;min-width:0;margin:10px 0 10px 12px;border-radius:3px;background:#091424;overflow:hidden; }
.theme-light .sc-world-map { background:#f5f9ff; }
.sc-world-map-mask { position:absolute;inset:8% 4%;background:#53647b;opacity:.38;mask:url('/assets/world-map-dots-r1.svg') center/contain no-repeat;-webkit-mask:url('/assets/world-map-dots-r1.svg') center/contain no-repeat; }
.theme-light .sc-world-map-mask { background:#9db0c6;opacity:.52; }
.sc-map-markers { position:absolute;inset:8% 4%; }
.sc-map-marker { position:absolute;width:12px;height:12px;transform:translate(-50%,-50%);border:0;padding:0;background:transparent;cursor:help;z-index:3; }
.sc-map-marker i { position:absolute;inset:3px;border-radius:50%;background:#22d3ee;box-shadow:0 0 0 4px rgba(34,211,238,.14),0 0 12px rgba(34,211,238,.75);animation:sc-map-pulse 1.8s ease-in-out infinite; }
.sc-map-marker.sc-marker-1 i,.sc-country-index.sc-marker-1 { background:#22c55e; }
.sc-map-marker.sc-marker-2 i,.sc-country-index.sc-marker-2 { background:#3b82f6; }
.sc-map-marker.sc-marker-3 i,.sc-country-index.sc-marker-3 { background:#a78bfa; }
.sc-map-marker.sc-marker-4 i,.sc-country-index.sc-marker-4 { background:#f59e0b; }
.sc-country-list { padding:9px 9px 9px 12px;overflow:auto;border-left:1px solid rgba(148,163,184,.08); }
.sc-country-row { position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:3px 7px;align-items:center;min-height:33px;padding:5px 4px 7px;border-bottom:1px solid rgba(148,163,184,.08); }
.sc-country-row b { font-size:9px;color:#d9e5f5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.theme-light .sc-country-row b { color:#27415f; }
.sc-country-row small { grid-column:2;color:#71859f;font-size:7px; }
.sc-country-row em { grid-row:1/3;grid-column:3;font-style:normal;color:#b7c5d7;font-size:8px;white-space:nowrap; }
.theme-light .sc-country-row em { color:#4f647c; }
.sc-country-index { width:6px;height:6px;border-radius:50%;background:#22d3ee;grid-row:1/3; }
.sc-country-row > i { position:absolute;left:17px;bottom:2px;width:var(--country-width);max-width:calc(100% - 22px);height:2px;border-radius:99px;background:var(--theme-accent,#4aa3ff);opacity:.75; }
.sc-country-empty { padding:24px;color:#71859f;font-size:10px;text-align:center; }

/* Server cards: mesma identidade estrutural da referência, dados Vue preservados */
html.sc-dashboard-route .main-server-card { border-radius:4px !important;background:#111a2c !important; }
html.sc-dashboard-route .theme-light .main-server-card { background:#fff !important; }
html.sc-dashboard-route .main-server-head { min-height:48px !important; }
html.sc-dashboard-route .moving-lines { display:none !important; }
html.sc-dashboard-route .server-title strong { font-size:12px !important; }
html.sc-dashboard-route .server-small-cards { grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:0 !important; }
html.sc-dashboard-route .server-small-cards > div { border:0 !important;background:transparent !important; }
html.sc-dashboard-route .server-small-cards b { font-size:15px !important; }
html.sc-dashboard-route .resource-track { height:5px !important; }
html.sc-dashboard-route .server-bottom-metrics { border-top:1px solid rgba(148,163,184,.10) !important; }
html.sc-dashboard-route .server-pulse-line { display:none !important; }

/* Hot content guardado no submenu Conteúdos > Importador */
.sc-hot-content-page { margin-bottom:14px; }
.sc-hot-content-body { padding:12px;overflow:auto; }
.sc-hot-content-body table { width:100%;border-collapse:collapse; }
.sc-hot-content-body th,.sc-hot-content-body td { padding:9px 10px;text-align:left;border-bottom:1px solid rgba(148,163,184,.10);font-size:11px; }

@keyframes sc-dashboard-pulse { 0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)} 70%{box-shadow:0 0 0 7px rgba(34,197,94,0)} 100%{box-shadow:0 0 0 0 rgba(34,197,94,0)} }
@keyframes sc-map-pulse { 0%,100%{transform:scale(.86);opacity:.82} 50%{transform:scale(1.32);opacity:1} }

@media (max-width:1280px) {
  .xui-shell .xui-topbar.header-main { padding-inline:22px !important; }
  .xui-shell .xui-nav.nav-rework,.xui-shell #xui-main-nav:not(.nav-rework-original-hidden){padding-inline:22px !important;}
  .sc-overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sc-chart-grid { grid-template-columns:1fr 1fr; }
  .sc-chart-grid .sc-realtime-panel:last-child { grid-column:1/-1; }
}
@media (max-width:980px) {
  .xui-shell .xui-topbar.header-main { height:auto !important;min-height:58px !important;grid-template-columns:auto 1fr auto !important;gap:10px !important;padding:9px 14px !important; }
  .xui-shell .header-stats { grid-column:1/-1;grid-row:2;max-width:100%;overflow-x:auto !important;padding-bottom:2px; }
  .xui-shell .header-actions { grid-column:2/4;grid-row:1; }
  .sc-nav-live-clock { display:none; }
  .sc-chart-grid { grid-template-columns:1fr; }
  .sc-chart-grid .sc-realtime-panel:last-child { grid-column:auto; }
  html.sc-dashboard-route .dashboard-board > .service-status,.sc-location-panel { grid-column:1/-1 !important; }
  html.sc-dashboard-route .dashboard-board > .main-server-card { grid-column:span 3 !important; }
}
@media (max-width:680px) {
  .sc-overview-grid { grid-template-columns:1fr; }
  .sc-overview-card { min-height:108px; }
  .sc-location-body { grid-template-columns:1fr; }
  .sc-location-panel { height:auto;min-height:520px; }
  .sc-world-map { min-height:260px;margin:10px; }
  .sc-country-list { max-height:210px;border-left:0;border-top:1px solid rgba(148,163,184,.08);padding:8px 10px; }
  html.sc-dashboard-route .dashboard-board > .main-server-card { grid-column:1/-1 !important; }
  .xui-shell .header-stats .top-counter { flex:0 0 auto; }
  .xui-shell .top-search { display:none !important; }
}


/* =====================================================================
   StreamCore Dashboard Rework R2 - responsive fidelity / ultrawide
   Camada final autoritativa. Preserva theme variables, rotas e dados Vue.
   ===================================================================== */

/* Header fiel à referência: marca + counters + busca/bell/usuário na mesma barra. */
.xui-shell .xui-topbar.header-main {
  min-height:60px !important;height:60px !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  gap:12px !important;padding:0 16px !important;
  background:linear-gradient(90deg,rgba(5,15,34,.96) 0%,rgba(var(--theme-accent-rgb,47,130,255),.22) 62%,rgba(var(--theme-accent-rgb,47,130,255),.34) 100%) !important;
  border-top:1px solid rgba(var(--theme-accent-rgb,47,130,255),.42) !important;
  border-bottom:1px solid rgba(148,163,184,.18) !important;
  box-shadow:none !important;
}
.xui-shell.theme-light .xui-topbar.header-main {
  background:linear-gradient(90deg,#fbfdff 0%,rgba(var(--theme-accent-rgb,47,130,255),.10) 62%,rgba(var(--theme-accent-rgb,47,130,255),.16) 100%) !important;
  border-top-color:rgba(var(--theme-accent-rgb,47,130,255),.34) !important;
}
.xui-shell .xui-brand { min-width:62px !important;margin-right:2px !important; }
.xui-shell .xui-brand strong,.xui-shell .xui-brand span { font-size:30px !important;line-height:1 !important; }
.xui-shell .header-stats { gap:8px !important;justify-self:start !important; }
.xui-shell .header-stats .top-counter {
  min-height:36px !important;height:36px !important;padding:0 12px !important;gap:8px !important;
  border-radius:5px !important;background:rgba(4,13,29,.58) !important;border-color:rgba(148,163,184,.23) !important;
}
.xui-shell.theme-light .header-stats .top-counter { background:rgba(255,255,255,.82) !important; }
.xui-shell .header-stats .top-counter:nth-child(1){min-width:108px !important;}
.xui-shell .header-stats .top-counter:nth-child(2){min-width:106px !important;}
.xui-shell .header-stats .top-counter:nth-child(3){min-width:126px !important;}
.xui-shell .header-stats .top-counter:nth-child(4){min-width:210px !important;}
.xui-shell .header-stats .top-counter::before { font-size:12px !important;font-weight:650 !important;opacity:.84 !important; }
.xui-shell .header-stats b { font-size:13.5px !important;letter-spacing:.01em !important; }
.xui-shell .header-stats small { font-size:11.5px !important; }
.xui-shell .header-stats .top-fa { font-size:12px !important; }
.xui-shell .header-actions { gap:8px !important;display:flex !important;align-items:center !important; }
.xui-shell .header-actions .top-search{order:1 !important;}
.xui-shell .header-actions .alert-center{order:2 !important;}
.xui-shell .header-actions .user-menu{order:3 !important;}
.xui-shell .top-search-button { width:clamp(230px,15vw,300px) !important;justify-content:space-between !important;padding:0 12px !important; }
.xui-shell .clean-user-button { min-width:122px !important;justify-content:space-between !important;padding:0 12px !important; }
.xui-shell .alert-bell-button { width:38px !important;min-width:38px !important;padding:0 !important; }
.xui-shell .top-search-button,.xui-shell .clean-user-button,.xui-shell .alert-bell-button { height:36px !important;min-height:36px !important; }

/* Navegação ocupa toda a largura inclusive 2560x1080. */
.xui-shell .xui-nav.nav-rework,.xui-shell #xui-main-nav:not(.nav-rework-original-hidden){
  min-height:42px !important;padding:0 16px !important;gap:5px !important;
}
.xui-shell .xui-nav.nav-rework > .nav-item > button { min-height:40px !important;padding:0 13px !important;font-size:12.5px !important;gap:8px !important; }
.sc-nav-live-clock { min-height:30px !important;padding:0 12px !important;font-size:11px !important; }
.sc-nav-live-clock b { font-size:12px !important; }

/* Dashboard aproveita ultrawide sem diminuir tipografia. */
html.sc-dashboard-route .xui-workspace { padding:14px 16px 44px !important;max-width:none !important;width:100% !important; }
.sc-dashboard-v2 { gap:13px !important;margin-bottom:13px !important; }
.sc-overview-grid { grid-template-columns:1fr 1fr 1.12fr 1.55fr !important;gap:12px !important; }
.sc-overview-card { min-height:126px !important;padding:14px 16px !important; }
.sc-overview-card > header { min-height:24px !important;font-size:11.5px !important;gap:9px !important; }
.sc-overview-card > header b { font-size:11.5px !important;letter-spacing:.09em !important; }
.sc-overview-card > header em { font-size:9.5px !important;padding:4px 7px !important; }
.sc-card-symbol { width:23px !important;height:23px !important; }
.sc-dual-metric { margin-top:17px !important; }
.sc-dual-metric strong { font-size:28px !important; }
.sc-card-bandwidth .sc-dual-metric strong { font-size:24px !important; }
.sc-dual-metric small { font-size:10.5px !important;margin-top:8px !important; }
.sc-library-grid { gap:10px 16px !important;margin-top:14px !important; }
.sc-library-grid strong { font-size:18px !important; }
.sc-library-grid small { font-size:9.5px !important;margin-top:5px !important; }

/* Três gráficos: maiores, curvas suaves, área e eixos legíveis. */
.sc-chart-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:12px !important; }
.sc-realtime-panel { min-height:334px !important;height:334px !important; }
.sc-realtime-panel > header { height:48px !important;padding:0 16px !important; }
.sc-realtime-panel > header div { gap:9px !important;font-size:13px !important; }
.sc-realtime-panel > header b { font-size:13px !important; }
.sc-realtime-panel > header span { font-size:9.5px !important;padding:5px 8px !important; }
.sc-chart { height:238px !important;padding:8px 12px 0 !important; }
.sc-grid-label,.sc-time-label { font-size:10.5px !important; }
.sc-chart-line { stroke-width:2.35 !important; }
.sc-chart-area { opacity:.14 !important; }
.sc-chart-last { stroke-width:1.3;stroke:#111a2c;vector-effect:non-scaling-stroke; }
.theme-light .sc-chart-last { stroke:#fff; }
.sc-chart-last.cpu,.sc-chart-last.net-out,.sc-chart-last.users { fill:#3b82f6; }
.sc-chart-last.memory,.sc-chart-last.content { fill:#a78bfa; }
.sc-chart-last.io,.sc-chart-last.net-in { fill:#22d3ee; }
.sc-chart-last.connections { fill:#22c55e; }
.sc-realtime-panel > footer { height:40px !important;gap:18px !important;font-size:10.5px !important; }
.sc-realtime-panel > footer span::before { width:8px !important;height:8px !important;margin-right:6px !important; }

/* Service Status: informação intacta; apenas proporção e indicadores. */
html.sc-dashboard-route .dashboard-board.sc-dashboard-legacy-grid { gap:12px !important; }
html.sc-dashboard-route .dashboard-board > .service-status { min-height:390px !important;height:390px !important; }
html.sc-dashboard-route .service-status .panel-head { min-height:48px !important;padding:0 15px !important; }
html.sc-dashboard-route .service-status .panel-head h2 { font-size:12.5px !important; }
html.sc-dashboard-route .service-monitor-head-actions { font-size:10.5px !important; }
html.sc-dashboard-route .service-scroll { max-height:340px !important;padding:9px !important; }
html.sc-dashboard-route .service-list { gap:8px !important; }
html.sc-dashboard-route .service-status-row { min-height:57px !important;padding:9px 11px !important;border-radius:4px !important; }
html.sc-dashboard-route .service-status-row > i {
  display:block !important;width:9px !important;height:9px !important;min-width:9px !important;min-height:9px !important;
  flex:0 0 9px !important;border-radius:50% !important;font-size:0 !important;line-height:0 !important;
  background:currentColor !important;box-shadow:0 0 9px currentColor !important;transform:none !important;
}
html.sc-dashboard-route .service-status-row > i::before,html.sc-dashboard-route .service-status-row > i::after{display:none !important;content:none !important;}
html.sc-dashboard-route .service-status-row > i.ok,html.sc-dashboard-route .service-status-row > i.online {
  color:#22c55e !important;animation:sc-service-dot-pulse 1.65s ease-out infinite !important;
}
html.sc-dashboard-route .service-status-row > i.warn,html.sc-dashboard-route .service-status-row > i.warning { color:#f59e0b !important; }
html.sc-dashboard-route .service-status-row > i.danger,html.sc-dashboard-route .service-status-row > i.error,html.sc-dashboard-route .service-status-row > i.offline { color:#ef4444 !important; }
html.sc-dashboard-route .service-status-row strong { font-size:11.5px !important;line-height:1.35 !important; }
html.sc-dashboard-route .service-status-row p { font-size:9.5px !important;line-height:1.45 !important;margin-top:5px !important; }
html.sc-dashboard-route .service-metric-line { font-size:8.8px !important;gap:6px 9px !important; }
html.sc-dashboard-route .mini-tag { font-size:8px !important;padding:2px 6px !important;border-radius:3px !important; }

/* Locations igual à referência: mapa amplo + ranking lateral. */
.sc-location-panel { min-height:390px !important;height:390px !important; }
.sc-location-head { height:48px !important;padding:0 15px !important; }
.sc-location-head > div { gap:9px !important;min-width:0 !important; }
.sc-location-head h2 { font-size:13px !important;white-space:nowrap !important; }
.sc-location-head > div > span { font-size:10.5px !important;white-space:nowrap !important; }
.sc-location-head > div > small { color:#71859f;font-size:9.5px !important;white-space:nowrap !important; }
.sc-location-live { font-size:9.5px !important; }
.sc-location-body { height:342px !important;grid-template-columns:minmax(0,1.72fr) minmax(250px,.88fr) !important; }
.sc-world-map { margin:12px 0 12px 12px !important;border-radius:5px !important; }
.sc-world-map-mask { inset:7% 3% !important;opacity:.50 !important; }
.theme-light .sc-world-map-mask { opacity:.58 !important; }
.sc-map-markers { inset:7% 3% !important; }
.sc-map-marker { width:20px !important;height:20px !important;transform:translate(-50%,-50%) scale(var(--marker-scale,1)) !important;overflow:visible !important; }
.sc-map-marker i { inset:6px !important;box-shadow:0 0 0 5px rgba(34,211,238,.14),0 0 15px rgba(34,211,238,.78) !important; }
.sc-map-marker::after {
  content:attr(data-tooltip);position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);
  transform-origin:center bottom;padding:7px 9px;border:1px solid rgba(148,163,184,.24);border-radius:4px;background:#071327;color:#eef5ff;
  font-size:10px;line-height:1.2;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .14s ease;z-index:20;box-shadow:0 8px 18px rgba(0,0,0,.28);
}
.sc-map-marker:hover::after,.sc-map-marker:focus-visible::after { opacity:1; }
.theme-light .sc-map-marker::after { background:#fff;color:#20364f;border-color:#d8e3ef; }
.sc-country-list { padding:10px 10px 10px 14px !important; }
.sc-country-row { min-height:40px !important;gap:4px 8px !important;padding:6px 5px 9px !important; }
.sc-country-row b { font-size:11px !important; }
.sc-country-row small { font-size:9px !important; }
.sc-country-row em { font-size:9.5px !important; }
.sc-country-row em strong { color:#e6eef9;font-size:11px !important; }
.theme-light .sc-country-row em strong { color:#263f5b; }
.sc-country-index { width:8px !important;height:8px !important; }
.sc-country-row > i { left:21px !important;height:3px !important; }
.sc-country-empty { min-height:100%;display:grid;place-content:center;gap:7px;padding:24px !important;font-size:10.5px !important;text-align:center; }
.sc-country-empty strong { color:#d7e3f2;font-size:12px; }
.theme-light .sc-country-empty strong { color:#29445f; }
.sc-country-empty span { max-width:260px;line-height:1.45; }

/* Main/LB cards também ganham leitura maior sem mexer nos dados/ações. */
html.sc-dashboard-route .server-title strong { font-size:13px !important; }
html.sc-dashboard-route .server-small-cards b { font-size:17px !important; }
html.sc-dashboard-route .server-small-cards span,html.sc-dashboard-route .server-bottom-metrics { font-size:9.5px !important; }

@keyframes sc-service-dot-pulse {
  0%{box-shadow:0 0 0 0 rgba(34,197,94,.62),0 0 9px currentColor;opacity:.92}
  70%{box-shadow:0 0 0 7px rgba(34,197,94,0),0 0 11px currentColor;opacity:1}
  100%{box-shadow:0 0 0 0 rgba(34,197,94,0),0 0 9px currentColor;opacity:.92}
}

/* Ultrawide 2560x1080 / 21:9 */
@media (min-width:2000px) {
  .xui-shell .xui-topbar.header-main { padding-inline:18px !important; }
  .xui-shell .xui-nav.nav-rework,.xui-shell #xui-main-nav:not(.nav-rework-original-hidden){padding-inline:18px !important;}
  html.sc-dashboard-route .xui-workspace { padding-inline:18px !important; }
  .sc-overview-card { min-height:132px !important; }
  .sc-dual-metric strong { font-size:30px !important; }
  .sc-library-grid strong { font-size:19px !important; }
  .sc-realtime-panel { height:356px !important;min-height:356px !important; }
  .sc-chart { height:260px !important; }
  html.sc-dashboard-route .dashboard-board > .service-status,.sc-location-panel { height:410px !important;min-height:410px !important; }
  html.sc-dashboard-route .service-scroll { max-height:360px !important; }
  .sc-location-body { height:362px !important;grid-template-columns:minmax(0,1.8fr) minmax(300px,.82fr) !important; }
}

@media (max-width:1500px) {
  .xui-shell .header-stats .top-counter:nth-child(4){min-width:178px !important;}
  .xui-shell .top-search-button{width:220px !important;}
  .sc-realtime-panel{min-height:310px !important;height:310px !important;}
  .sc-chart{height:214px !important;}
}
@media (max-width:1280px) {
  .xui-shell .xui-topbar.header-main{padding-inline:14px !important;gap:9px !important;}
  .xui-shell .header-stats{gap:6px !important;overflow-x:auto !important;}
  .xui-shell .header-stats .top-counter{min-width:max-content !important;padding-inline:9px !important;}
  .xui-shell .top-search-button{width:180px !important;}
  .sc-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .sc-chart-grid{grid-template-columns:1fr 1fr !important;}
  .sc-chart-grid .sc-realtime-panel:last-child{grid-column:1/-1 !important;}
}
@media (max-width:980px) {
  .xui-shell .xui-topbar.header-main{height:auto !important;min-height:60px !important;grid-template-columns:auto 1fr auto !important;padding:9px 14px !important;}
  .xui-shell .header-stats{grid-column:1/-1 !important;grid-row:2 !important;width:100% !important;padding-bottom:2px !important;}
  .xui-shell .header-actions{grid-column:2/4 !important;grid-row:1 !important;}
  .xui-shell .top-search-button{width:160px !important;}
  .sc-chart-grid{grid-template-columns:1fr !important;}
  .sc-chart-grid .sc-realtime-panel:last-child{grid-column:auto !important;}
  .sc-realtime-panel{height:326px !important;min-height:326px !important;}
  .sc-chart{height:230px !important;}
  html.sc-dashboard-route .dashboard-board > .service-status,.sc-location-panel{grid-column:1/-1 !important;}
}
@media (max-width:680px) {
  html.sc-dashboard-route .xui-workspace{padding-inline:10px !important;}
  .sc-overview-grid{grid-template-columns:1fr !important;}
  .sc-overview-card{min-height:122px !important;}
  .sc-location-panel{height:auto !important;min-height:580px !important;}
  .sc-location-body{height:auto !important;grid-template-columns:1fr !important;}
  .sc-world-map{min-height:290px !important;margin:10px !important;}
  .sc-country-list{max-height:230px !important;border-left:0 !important;border-top:1px solid rgba(148,163,184,.08) !important;padding:8px 10px !important;}
  .sc-location-head > div > small{display:none !important;}
  .xui-shell .top-search{display:none !important;}
}


/* ========================================================================== */
/* Dashboard R3 / DATA-VISUAL-FIX3                                           */
/* ========================================================================== */

/* Reference topbar: one calm strip, compact counters, search/bell/user right. */
.xui-shell .xui-topbar.header-main,
.xui-shell.theme-light .xui-topbar.header-main {
  height: 58px !important;
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  grid-template-columns: none !important;
  gap: 12px !important;
  padding: 0 14px !important;
  overflow: visible !important;
  border-bottom: 1px solid color-mix(in srgb, var(--theme-accent,#3b82f6) 26%, rgba(255,255,255,.12) 74%) !important;
  box-shadow: none !important;
}
.xui-shell .xui-topbar.header-main::before,
.xui-shell .xui-topbar.header-main::after { content:none !important; display:none !important; }
.xui-shell .xui-topbar.header-main > * { position:relative !important; z-index:1 !important; }
.xui-shell .xui-brand { flex:0 0 auto !important; min-width:68px !important; width:auto !important; margin:0 2px 0 0 !important; padding:0 !important; }
.xui-shell .xui-brand strong { font-size:38px !important; line-height:1 !important; letter-spacing:-3px !important; }
.xui-shell .xui-brand span { font-size:27px !important; line-height:1 !important; letter-spacing:-2px !important; }
.xui-shell .header-stats.xui-live-counters { flex:0 1 auto !important; margin:0 auto 0 0 !important; gap:7px !important; overflow:visible !important; }
.xui-shell .xui-live-counters .top-counter {
  min-height:34px !important;
  height:34px !important;
  padding:0 10px !important;
  border-radius:6px !important;
  background:rgba(5,17,44,.48) !important;
  border:1px solid rgba(148,163,184,.18) !important;
  box-shadow:none !important;
  gap:6px !important;
  color:#dce7f7 !important;
}
.xui-shell .xui-live-counters .top-counter .top-fa { margin:0 1px 0 0 !important; font-size:12px !important; color:var(--theme-accent,#4aa3ff) !important; }
.xui-shell .xui-live-counters .top-counter b,
.xui-shell .xui-live-counters .top-counter small,
.xui-shell .xui-live-counters .top-counter.compact b,
.xui-shell .xui-live-counters .top-counter.stream-state b,
.xui-shell .xui-live-counters .top-counter.stream-state small,
.xui-shell .xui-live-counters .top-counter.bandwidth-state b,
.xui-shell .xui-live-counters .top-counter.bandwidth-state small {
  min-width:0 !important; min-height:0 !important; height:auto !important;
  padding:0 !important; margin:0 !important; border:0 !important; border-radius:0 !important;
  background:transparent !important; box-shadow:none !important; font-size:12px !important;
  font-weight:750 !important; color:#eaf1fb !important;
}
.xui-shell .xui-live-counters .top-counter small { color:#a9b9ce !important; font-size:10px !important; }
.xui-shell .sc-top-counter-label { font-size:12px !important; font-weight:650 !important; color:#aebed2 !important; line-height:1 !important; }
.xui-shell .sc-top-label-0::before,
.xui-shell .sc-top-label-2::before { content:""; display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:7px; background:#20c997; box-shadow:0 0 0 4px rgba(32,201,151,.08); vertical-align:1px; animation:sc-live-pulse 1.65s ease-in-out infinite; }
.xui-shell .xui-live-counters .top-counter.stream-state,
.xui-shell .xui-live-counters .top-counter.bandwidth-state { background:rgba(5,17,44,.48) !important; border:1px solid rgba(148,163,184,.18) !important; }
.xui-shell.theme-light .xui-live-counters .top-counter { background:rgba(255,255,255,.72) !important; border-color:rgba(71,85,105,.18) !important; }
.xui-shell.theme-light .xui-live-counters .top-counter b { color:#21374f !important; }
.xui-shell.theme-light .xui-live-counters .top-counter small,
.xui-shell.theme-light .sc-top-counter-label { color:#667b94 !important; }
.xui-shell .header-actions.top-actions { margin-left:auto !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; gap:9px !important; min-width:0 !important; }
.xui-shell .header-actions .top-search { order:1 !important; }
.xui-shell .header-actions .alert-center { order:2 !important; }
.xui-shell .header-actions .user-menu { order:3 !important; }
.xui-shell .top-search-button { width:190px !important; height:32px !important; min-height:32px !important; border-radius:6px !important; padding:0 11px !important; background:rgba(5,17,44,.48) !important; border:1px solid rgba(148,163,184,.18) !important; color:#97aac2 !important; box-shadow:none !important; }
.xui-shell.theme-light .top-search-button { background:rgba(255,255,255,.72) !important; color:#61758d !important; border-color:rgba(71,85,105,.18) !important; }
.xui-shell .alert-bell-button { width:34px !important; height:34px !important; min-width:34px !important; min-height:34px !important; border:0 !important; background:transparent !important; box-shadow:none !important; }
.xui-shell .user-button.clean-user-button { min-height:36px !important; height:36px !important; padding:0 5px 0 10px !important; border:0 !important; background:transparent !important; box-shadow:none !important; font-size:13px !important; font-weight:700 !important; }

/* Thin theme-aware realtime charts with distinct series semantics. */
.sc-realtime-panel { --sc-chart-a:var(--theme-accent,#22d3ee); --sc-chart-b:color-mix(in srgb,var(--theme-accent,#22d3ee) 35%,#9f8cff 65%); --sc-chart-c:color-mix(in srgb,var(--theme-accent,#22d3ee) 70%,#38bdf8 30%); --sc-chart-green:color-mix(in srgb,var(--theme-accent,#22d3ee) 20%,#2ed6a1 80%); }
.sc-chart { position:relative !important; cursor:crosshair !important; }
.sc-chart-line { stroke-width:1.35 !important; opacity:.98 !important; }
.sc-chart-line.cpu { stroke:var(--sc-chart-a) !important; }
.sc-chart-line.memory { stroke:var(--sc-chart-b) !important; stroke-dasharray:3.5 3.5 !important; }
.sc-chart-line.io { stroke:var(--sc-chart-c) !important; stroke-dasharray:1.8 3.2 !important; opacity:.85 !important; }
.sc-chart-line.net-in { stroke:var(--sc-chart-a) !important; }
.sc-chart-line.net-out { stroke:var(--sc-chart-b) !important; }
.sc-chart-line.connections { stroke:var(--sc-chart-green) !important; stroke-width:1.7 !important; }
.sc-chart-line.users { stroke:var(--sc-chart-b) !important; opacity:.78 !important; }
.sc-chart-line.content { stroke:var(--sc-chart-c) !important; opacity:.82 !important; }
.sc-chart-area.connections { fill:var(--sc-chart-green) !important; opacity:.10 !important; }
.sc-chart-area.cpu,.sc-chart-area.memory,.sc-chart-area.io,.sc-chart-area.net-in,.sc-chart-area.net-out,.sc-chart-area.users,.sc-chart-area.content { display:none !important; }
.sc-realtime-panel footer .cpu,.sc-realtime-panel footer .net-in,.sc-realtime-panel footer .content { color:var(--sc-chart-a) !important; }
.sc-realtime-panel footer .memory,.sc-realtime-panel footer .net-out,.sc-realtime-panel footer .users { color:var(--sc-chart-b) !important; }
.sc-realtime-panel footer .io { color:var(--sc-chart-c) !important; }
.sc-realtime-panel footer .connections { color:var(--sc-chart-green) !important; }
.sc-chart-hover-line { display:none; position:absolute; top:13px; bottom:34px; width:1px; border-left:1px dashed rgba(203,213,225,.58); pointer-events:none; z-index:4; }
.sc-chart-hover-line.show { display:block; }
.sc-chart-tooltip { display:none; position:absolute; z-index:8; min-width:176px; max-width:235px; padding:9px 10px; border-radius:7px; background:rgba(245,247,250,.97); color:#5d6d82; border:1px solid rgba(148,163,184,.28); box-shadow:0 14px 32px rgba(0,0,0,.23); pointer-events:none; font-size:10px; }
.sc-chart-tooltip.show { display:block; }
.sc-chart-tooltip > b { display:block; color:#8998aa; font-size:10px; font-weight:500; padding-bottom:7px; margin-bottom:5px; border-bottom:1px solid rgba(148,163,184,.18); }
.sc-chart-tooltip > span { display:grid; grid-template-columns:9px minmax(0,1fr) auto; gap:7px; align-items:center; min-height:24px; }
.sc-chart-tooltip > span > i { width:8px; height:8px; border-radius:50%; background:var(--sc-chart-a); }
.sc-chart-tooltip > span > i.cpu,.sc-chart-tooltip > span > i.net-in,.sc-chart-tooltip > span > i.content { background:var(--sc-chart-a); }
.sc-chart-tooltip > span > i.memory,.sc-chart-tooltip > span > i.net-out,.sc-chart-tooltip > span > i.users { background:var(--sc-chart-b); }
.sc-chart-tooltip > span > i.io { background:var(--sc-chart-c); }
.sc-chart-tooltip > span > i.connections { background:var(--sc-chart-green); }
.sc-chart-tooltip em { font-style:normal; color:#8a99ab; }
.sc-chart-tooltip strong { color:#6d7e92; font-weight:700; white-space:nowrap; }
.theme-light .sc-chart-tooltip { background:rgba(255,255,255,.98); color:#4d6077; }

/* Reference proportions: larger plotting area, calmer grid, full ultrawide use. */
.sc-realtime-panel { height:350px !important; min-height:350px !important; }
.sc-chart { height:253px !important; padding:8px 12px 0 !important; }
.sc-grid-line { stroke:rgba(148,163,184,.12) !important; stroke-width:.75 !important; }
.sc-grid-label,.sc-time-label { font-size:10px !important; fill:#7f91a8 !important; }
.sc-axis-line { stroke:rgba(148,163,184,.26) !important; stroke-width:.8 !important; }

/* Location fidelity: list and map fill the panel, marker pulse is clearly visible. */
.sc-map-marker i { width:11px !important; height:11px !important; border:2px solid rgba(255,255,255,.62) !important; box-shadow:0 0 0 5px rgba(var(--theme-accent-rgb,47,130,255),.11),0 0 18px rgba(var(--theme-accent-rgb,47,130,255),.48) !important; }
.sc-map-marker::after { width:25px !important; height:25px !important; }
.sc-country-row b { font-size:12px !important; }
.sc-country-row small { font-size:9.5px !important; }
.sc-country-row em { font-size:10px !important; }

@media (min-width:2000px) {
  .xui-shell .xui-topbar.header-main { padding-inline:20px !important; gap:14px !important; }
  .xui-shell .top-search-button { width:220px !important; }
  .xui-shell .header-stats.xui-live-counters { gap:8px !important; }
  .xui-shell .xui-live-counters .top-counter { padding-inline:11px !important; }
  .sc-realtime-panel { height:386px !important; min-height:386px !important; }
  .sc-chart { height:286px !important; }
  .sc-location-panel { height:440px !important; min-height:440px !important; }
  .sc-location-body { height:392px !important; grid-template-columns:minmax(0,1.9fr) minmax(320px,.75fr) !important; }
  .sc-country-row { min-height:43px !important; }
}
@media (max-width:1280px) and (min-width:981px) {
  .xui-shell .xui-topbar.header-main { gap:8px !important; padding-inline:10px !important; }
  .xui-shell .xui-brand { min-width:60px !important; }
  .xui-shell .xui-brand strong { font-size:33px !important; }
  .xui-shell .xui-brand span { font-size:23px !important; }
  .xui-shell .xui-live-counters .top-counter { padding-inline:7px !important; gap:4px !important; }
  .xui-shell .sc-top-counter-label { font-size:10px !important; }
  .xui-shell .xui-live-counters .top-counter b,.xui-shell .xui-live-counters .top-counter small { font-size:10px !important; }
  .xui-shell .top-search-button { width:145px !important; }
}
@media (max-width:980px) {
  .xui-shell .xui-topbar.header-main { height:auto !important; min-height:58px !important; display:grid !important; grid-template-columns:auto 1fr auto !important; padding:8px 12px !important; }
  .xui-shell .header-stats.xui-live-counters { grid-column:1/-1 !important; width:100% !important; overflow-x:auto !important; }
  .xui-shell .header-actions.top-actions { margin-left:auto !important; }
  .xui-shell .top-search-button { width:42px !important; }
  .xui-shell .top-search-button span { display:none !important; }
  .sc-realtime-panel { height:330px !important; min-height:330px !important; }
  .sc-chart { height:235px !important; }
}

/* ========================================================================
   Dashboard R4 / Connection Geo FIX4
   - one pulse dot in topbar (remove duplicate label pseudo-dot)
   - force SVG line paths to remain unfilled
   - Network Traffic thin input/output; Connections primary green curve
   ======================================================================== */
.xui-shell .sc-top-label-0::before,
.xui-shell .sc-top-label-2::before { content:none !important; display:none !important; }

/* Keep the original top-fa pulse as the single status indicator. */
.xui-shell .header-stats .top-counter:first-child .top-fa,
.xui-shell .header-stats .stream-state .top-fa {
  display:inline-block !important;
  width:7px !important;
  height:7px !important;
  min-width:7px !important;
  border-radius:50% !important;
  background:#22c55e !important;
  animation:sc-dashboard-pulse 1.8s ease-out infinite !important;
}

/* Earlier specific selectors set fill on the line path itself. Override that
   explicitly: only .sc-chart-area is allowed to paint an area. */
.sc-chart-line,
.sc-chart-line.cpu,
.sc-chart-line.memory,
.sc-chart-line.io,
.sc-chart-line.net-in,
.sc-chart-line.net-out,
.sc-chart-line.connections,
.sc-chart-line.users,
.sc-chart-line.content { fill:none !important; }

.sc-chart-line.net-in,
.sc-chart-line.net-out { stroke-width:1.15 !important; }
.sc-chart-line.net-out { stroke-dasharray:4 3 !important; opacity:.92 !important; }
.sc-chart-line.connections { stroke-width:1.9 !important; }
.sc-chart-line.users { stroke-width:1.05 !important; stroke-dasharray:4 3 !important; opacity:.76 !important; }
.sc-chart-line.content { stroke-width:1.05 !important; opacity:.72 !important; }

/* R35: dynamic per-LB series keep the approved chart geometry and use a fixed,
   readable palette. Legends scroll instead of hiding servers. */
.sc-chart-line[style*="--series-color"] { stroke:var(--series-color) !important; }
.sc-chart-line.net-total-in,.sc-chart-line.net-total-out { stroke-width:1.7 !important; stroke-dasharray:5 3 !important; }
.sc-dynamic-legend { max-height:58px; padding:7px 12px !important; display:flex !important; align-content:flex-start; align-items:center; flex-wrap:wrap; gap:5px 14px !important; overflow:auto; scrollbar-width:thin; }
.sc-dynamic-legend span { display:inline-flex; align-items:center; gap:6px; color:#8fa4bc !important; white-space:nowrap; }
.sc-dynamic-legend span i { width:7px; height:7px; flex:0 0 7px; border-radius:50%; }
.sc-chart-tooltip { min-width:210px; max-width:300px; max-height:245px; overflow:auto; }
.sc-tooltip-server { padding:4px 0 5px; border-bottom:1px solid rgba(148,163,184,.16); }
.sc-tooltip-server:last-child { border-bottom:0; }
.sc-tooltip-server>strong { display:block; padding:2px 0 3px; color:#53677e; font-size:10px; }
.sc-tooltip-server>span { display:grid; grid-template-columns:9px minmax(0,1fr) auto; gap:7px; align-items:center; min-height:20px; }
.sc-tooltip-server>span>i { width:7px; height:7px; border-radius:50%; }
.sc-tooltip-server em { font-style:normal; }
@media(max-width:640px){.sc-dynamic-legend{max-height:76px}.sc-chart-tooltip{max-width:min(280px,82vw)}}
.sc-chart-area.connections { display:block !important; opacity:.075 !important; }

.sc-country-row small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sc-map-marker::after {
  content:attr(data-tooltip);
  position:absolute;
  left:50%; bottom:calc(100% + 9px);
  transform:translateX(-50%);
  min-width:150px; max-width:270px;
  padding:7px 9px; border-radius:6px;
  background:rgba(5,15,30,.96); color:#e8f1ff;
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 10px 26px rgba(0,0,0,.28);
  font:600 9px/1.35 system-ui,sans-serif;
  white-space:normal; text-align:left;
  opacity:0; pointer-events:none;
  transition:opacity .14s ease, transform .14s ease;
  z-index:10;
}
.sc-map-marker:hover::after { opacity:1; transform:translateX(-50%) translateY(-2px); }


/* ========================================================================
   Dashboard R5 / Country UI + Topbar FIX5
   - map keeps pulsing point, now colored deterministically by country
   - side ranking shows flag + matching country progress bar
   - search sits next to alert bell
   - alert panel is viewport-safe and cannot be clipped by the topbar
   ======================================================================== */
.sc-map-marker i {
  background: var(--country-color, var(--theme-accent,#22c55e)) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--country-color, #22c55e) 18%, transparent),
              0 0 14px color-mix(in srgb, var(--country-color, #22c55e) 58%, transparent) !important;
}
.sc-map-marker::before {
  border-color: color-mix(in srgb, var(--country-color, #22c55e) 70%, transparent) !important;
}
.sc-country-row {
  --country-color: var(--theme-accent,#22c55e);
  grid-template-columns: 27px minmax(0,1fr) auto !important;
  align-items:center !important;
  column-gap:8px !important;
}
.sc-country-flag {
  grid-column:1 !important;
  grid-row:1 / span 2 !important;
  width:25px !important;
  height:25px !important;
  display:grid !important;
  place-items:center !important;
  font-size:19px !important;
  line-height:1 !important;
  border-radius:5px !important;
  background:rgba(255,255,255,.045) !important;
  border:1px solid color-mix(in srgb,var(--country-color) 38%,rgba(148,163,184,.18)) !important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--country-color) 8%,transparent) !important;
}
.theme-light .sc-country-flag { background:rgba(255,255,255,.9) !important; }
.sc-country-row b { grid-column:2 !important; grid-row:1 !important; min-width:0 !important; }
.sc-country-row small { grid-column:2 !important; grid-row:2 !important; min-width:0 !important; }
.sc-country-row em { grid-column:3 !important; grid-row:1 / span 2 !important; align-self:center !important; }
.sc-country-index { display:none !important; }
.sc-country-row > i {
  position:absolute !important;
  left:40px !important;
  right:5px !important;
  bottom:3px !important;
  width:auto !important;
  height:4px !important;
  border-radius:999px !important;
  overflow:hidden !important;
  background:rgba(148,163,184,.13) !important;
}
.sc-country-row > i::after {
  content:"" !important;
  display:block !important;
  height:100% !important;
  width:var(--country-width,4%) !important;
  border-radius:inherit !important;
  background:var(--country-color) !important;
  box-shadow:0 0 8px color-mix(in srgb,var(--country-color) 46%,transparent) !important;
  transition:width .28s ease !important;
}

/* Topbar right controls: search and bell form one compact cluster. */
.xui-shell .header-actions.top-actions {
  gap:4px !important;
  column-gap:4px !important;
}
.xui-shell .header-actions .top-search,
.xui-shell .header-actions .top-search.open { margin-right:0 !important; }
.xui-shell .header-actions .alert-center { margin-left:0 !important; margin-right:6px !important; }
.xui-shell .top-search-button { width:184px !important; }

/* The alert center must be viewport-bound, not topbar-bound. This prevents
   parent overflow/edge clipping on 1366, 1920 and ultrawide displays. */
.xui-shell .alert-center-panel {
  position:fixed !important;
  top:58px !important;
  right:12px !important;
  left:auto !important;
  transform:none !important;
  width:min(420px,calc(100vw - 24px)) !important;
  max-width:calc(100vw - 24px) !important;
  max-height:calc(100dvh - 72px) !important;
  overflow:hidden !important;
  z-index:3000 !important;
  box-sizing:border-box !important;
}
.xui-shell .alert-center-panel .alert-list {
  max-height:calc(100dvh - 190px) !important;
  overflow:auto !important;
  overscroll-behavior:contain !important;
}
@media (min-width:2000px) {
  .xui-shell .top-search-button { width:210px !important; }
  .xui-shell .header-actions.top-actions { gap:5px !important; }
  .xui-shell .alert-center-panel { right:20px !important; }
}
@media (max-width:1100px) {
  .xui-shell .top-search-button { width:160px !important; }
  .xui-shell .alert-center-panel { top:64px !important; right:10px !important; width:min(400px,calc(100vw - 20px)) !important; }
}
@media (max-width:980px) {
  .xui-shell .alert-center-panel { top:112px !important; right:10px !important; }
}
@media (max-width:760px) {
  .xui-shell .header-actions.top-actions { gap:3px !important; }
  .xui-shell .alert-center { display:block !important; }
  .xui-shell .alert-center-panel {
    top:112px !important;
    right:8px !important;
    left:8px !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100dvh - 124px) !important;
  }
  .xui-shell .alert-center-panel .alert-list { max-height:calc(100dvh - 242px) !important; }
}
@media (max-width:520px) {
  .xui-shell .alert-center-panel { top:118px !important; }
  .sc-country-row { grid-template-columns:25px minmax(0,1fr) auto !important; }
  .sc-country-flag { width:23px !important;height:23px !important;font-size:17px !important; }
  .sc-country-row > i { left:38px !important; }
}


/* R6 dashboard file: R5 visual/data baseline preserved; final cross-route/theme overrides live in ui-theme-route-isolation-fix6.css. */