:root {
  --work-blue: #3454d1;
  --work-blue-dark: #2840a5;
  --work-ink: #172238;
  --work-muted: #718096;
}
.admin-workspace {
  background: #f1f4f9;
  color: var(--work-ink);
  --green: var(--work-blue);
  --green-d: var(--work-blue-dark);
  --green-soft: #eef2ff;
  --green-line: #cbd5ff;
  --line: #dfe5ef;
  --line2: #edf0f6;
  --text: var(--work-ink);
  --text2: #64748b;
  --text3: #8895a7;
}
.workspace-nav {
  width: 100%;
  background: #17263e;
  color: white;
  display: flex;
  align-items: center;
  gap: 48px;
  padding: 0 max(24px, calc((100vw - 1392px) / 2));
  box-sizing: border-box;
  min-height: 74px;
}
.workspace-brand {
  color: #fff;
  text-decoration: none;
  font-size: 19px;
  font-weight: 650;
  letter-spacing: 1px;
  white-space: nowrap;
}
.workspace-links { display: flex; align-self: stretch; gap: 12px; }
.workspace-links a {
  color: #c3cede;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 12px 22px;
  border-bottom: 3px solid transparent;
  font-size: 14px;
  gap: 2px;
}
.workspace-links a span { color: #8fa1ba; font-size: 11px; }
.workspace-links a:hover { color: #fff; background: #203450; }
.workspace-links a[aria-current="page"] { color: #fff; background: #203450; border-bottom-color: #8da8ff; }
.workspace-links a[aria-current="page"] span { color: #bdccf1; }
.admin-workspace .wrap { max-width: 1440px; padding: 26px 24px 48px; box-sizing: border-box; }
.admin-workspace h1 { color: var(--work-ink); font-size: 23px; font-weight: 650; gap: 10px; }
.admin-workspace .sub { margin-top: 7px; font-size: 12px; color: var(--work-muted); }
.admin-workspace .badge, .role-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 500;
  color: var(--work-blue);
  background: #eef2ff;
  border: 1px solid #d9e1ff;
  border-radius: 5px;
  padding: 2px 7px;
}
.admin-workspace button, .admin-workspace input, .admin-workspace textarea, .admin-workspace select { border-radius: 7px; }
.admin-workspace button.primary { background: var(--work-blue); border-color: var(--work-blue); }
.admin-workspace button.primary:hover { background: var(--work-blue-dark); border-color: var(--work-blue-dark); }
.admin-workspace button:focus-visible, .workspace-nav a:focus-visible { outline: 3px solid #8ba6ff; outline-offset: 3px; }
.admin-workspace input:focus, .admin-workspace textarea:focus, .admin-workspace select:focus { border-color: #8ba6ff; }
.admin-workspace .card, .admin-workspace .kcard, .admin-workspace .panel { border-radius: 10px; }
.admin-workspace .cards, .admin-workspace .kpis { gap: 14px; margin-bottom: 20px; }
.admin-workspace .cards > .card, .admin-workspace .kcard { padding: 18px; }
.admin-workspace .card.on, .admin-workspace .kcard.on { border-color: #869cec; box-shadow: inset 0 3px 0 var(--work-blue); }
.admin-workspace .card .v, .admin-workspace .kcard .v { font-size: 28px; font-weight: 650; letter-spacing: -.5px; }
.admin-workspace .c-active .v, .admin-workspace .c-alive .v { color: #0f8b69; }
.admin-workspace .c-active .dot, .admin-workspace .c-alive .dot { background: #0f8b69; }
.admin-workspace th { background: #f7f9fc; color: #617087; }
.admin-workspace tbody tr:hover { background: #f5f7fc; }
.admin-workspace td.link-cell { color: var(--work-blue); }
.admin-workspace .tag.kw { background: #edf2ff; color: #3454d1; }
.admin-workspace .tag.sh { background: #fff4e6; color: #a55f13; }
.admin-workspace .help { background: var(--work-blue); }
.admin-workspace .filters { gap: 9px; }
.admin-workspace .seg { background: #edf1f7; }
.admin-workspace .seg button.on { color: #2840a5; background: #fff; }
.workspace-login { background: #edf1f8; --green: var(--work-blue); --green-d: var(--work-blue-dark); }
.workspace-login .card { border-top: 4px solid var(--work-blue); box-shadow: 0 12px 40px #2034500d; }
.workspace-login button[type="submit"] { background: var(--work-blue); border-color: var(--work-blue); }
.workspace-login button[type="submit"]:hover { background: var(--work-blue-dark); }
@media (max-width: 720px) {
  .workspace-nav { padding: 14px 18px 0; gap: 12px; flex-wrap: wrap; }
  .workspace-brand { width: 100%; font-size: 17px; }
  .workspace-links { gap: 8px; width: 100%; }
  .workspace-links a { flex: 1; padding: 10px 12px; }
  .admin-workspace .wrap { padding: 20px 14px 36px; }
  .admin-workspace h1 { font-size: 21px; }
  .admin-workspace .cards > .card, .admin-workspace .kcard { padding: 14px; }
}