@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-MediumItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 650;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 650;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 750;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 750;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 760;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 760;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BoldItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 800;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-Black.ttf") format("truetype");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: "HXS Roboto";
  src: url("Roboto-BlackItalic.ttf") format("truetype");
  font-style: italic;
  font-weight: 900;
  font-display: swap;
}

.mcp-app {
  color-scheme: light;
  font-synthesis: none;

  --mcp-color-bg-canvas: #edf2f7;
  --mcp-color-bg-surface: #ffffff;
  --mcp-color-bg-subtle: #f4f7fb;
  --mcp-color-bg-hover: #e7edf5;
  --mcp-color-bg-selected: #dbeafe;
  --mcp-color-overlay: rgb(7 20 37 / 70%);

  --mcp-color-text: #17263a;
  --mcp-color-text-strong: #071426;
  --mcp-color-text-muted: #46566c;
  --mcp-color-text-disabled: #68778a;
  --mcp-color-text-on-action: #ffffff;

  --mcp-color-border: #aebccc;
  --mcp-color-border-subtle: #ced8e4;
  --mcp-color-border-strong: #71839a;

  --mcp-color-action-primary: #0759c7;
  --mcp-color-action-primary-hover: #06499f;
  --mcp-color-link: #064fa8;
  --mcp-color-data-accent: #0759c7;
  --mcp-color-focus-ring: #0759c7;
  --mcp-color-focus-offset: #ffffff;

  --mcp-color-success-text: #0e6336;
  --mcp-color-success-bg: #e9f8ef;
  --mcp-color-success-border: #70b98d;
  --mcp-color-warning-text: #764100;
  --mcp-color-warning-bg: #fff4d6;
  --mcp-color-warning-border: #d59b26;
  --mcp-color-danger-text: #9f1d24;
  --mcp-color-danger-action: #b4232c;
  --mcp-color-danger-action-hover: #8f1921;
  --mcp-color-danger-bg: #fff0f1;
  --mcp-color-danger-border: #d9878c;
  --mcp-color-info-text: #064b91;
  --mcp-color-info-bg: #e9f3ff;
  --mcp-color-info-border: #75a8df;
  --mcp-color-attention-action: #b75a00;

  --mcp-status-online: #0e6336;
  --mcp-status-warning: #8a4b00;
  --mcp-status-offline: #9f1d24;
  --mcp-chart-zone-good: #16834b;
  --mcp-chart-zone-warning: #a86100;
  --mcp-chart-zone-critical: #bd2832;
  --mcp-chart-latency-ping: #0759c7;
  --mcp-chart-latency-https: #6941c6;

  --mcp-font-sans: "HXS Roboto", Roboto, "Segoe UI", Arial, sans-serif;
  --mcp-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --mcp-font-rich: "HXS Roboto", Roboto, "Segoe UI", Arial, sans-serif;
  --mcp-font-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;

  --mcp-font-size-xs: 0.75rem;
  --mcp-font-size-sm: 0.8125rem;
  --mcp-font-size-md: 0.875rem;
  --mcp-font-size-base: 0.9375rem;
  --mcp-font-size-lg: 1.0625rem;
  --mcp-font-size-xl: 1.25rem;
  --mcp-font-size-2xl: 1.5rem;
  --mcp-font-size-3xl: 1.875rem;
  --mcp-line-height-tight: 1.22;
  --mcp-line-height-base: 1.5;
  --mcp-font-weight-heading: 700;
  --mcp-font-weight-control: 700;

  --mcp-space-1: 0.125rem;
  --mcp-space-2: 0.25rem;
  --mcp-space-3: 0.5rem;
  --mcp-space-4: 0.75rem;
  --mcp-space-5: 1rem;
  --mcp-space-6: 1.25rem;
  --mcp-space-7: 1.5rem;
  --mcp-space-8: 1.75rem;
  --mcp-space-9: 2rem;
  --mcp-space-10: 2.5rem;
  --mcp-space-11: 3rem;
  --mcp-space-12: 4rem;

  --mcp-radius-sm: 0.3125rem;
  --mcp-radius-md: 0.4375rem;
  --mcp-radius-lg: 0.5625rem;
  --mcp-radius-xl: 0.6875rem;
  --mcp-radius-2xl: 0.8125rem;
  --mcp-radius-card: 0.875rem;
  --mcp-radius-dialog: 1rem;
  --mcp-radius-pill: 999px;

  --mcp-shadow-xs: 0 1px 2px rgb(7 20 38 / 10%);
  --mcp-shadow-sm: 0 4px 12px rgb(7 20 38 / 10%);
  --mcp-shadow-md: 0 8px 24px rgb(7 20 38 / 12%);
  --mcp-shadow-lg: 0 18px 42px rgb(7 20 38 / 16%);
  --mcp-shadow-dialog: 0 28px 80px rgb(3 12 26 / 38%);

  --mcp-control-height-sm: 1.75rem;
  --mcp-control-height-nav: 2.125rem;
  --mcp-control-height-md: 2.375rem;
  --mcp-control-height-lg: 2.75rem;
  --mcp-table-row-height: 2.75rem;
  --mcp-brand-logo-height: 1.875rem;
  --mcp-header-identity-size: 2.75rem;

  --mcp-shell-width: 96vw;
  --mcp-shell-max-width: 96rem;
  --mcp-shell-padding-x: 1rem;
  --mcp-header-min-height: 3.5rem;
  --mcp-header-fixed-offset: 4rem;
  --mcp-nav-item-min-width: 0;
  --mcp-mobile-nav-height: 4.125rem;

  --mcp-motion-fast: 110ms;
  --mcp-motion-base: 170ms;
  --mcp-motion-slow: 240ms;
}

.mcp-app[data-mcp-theme="dark"] {
  color-scheme: dark;
  --mcp-color-bg-canvas: #07111f;
  --mcp-color-bg-surface: #101c2c;
  --mcp-color-bg-subtle: #17263a;
  --mcp-color-bg-hover: #21344c;
  --mcp-color-bg-selected: #153b68;
  --mcp-color-overlay: rgb(1 7 16 / 82%);
  --mcp-color-text: #e9f1fa;
  --mcp-color-text-strong: #ffffff;
  --mcp-color-text-muted: #b8c5d6;
  --mcp-color-text-disabled: #8c9cb0;
  --mcp-color-border: #53677f;
  --mcp-color-border-subtle: #34475e;
  --mcp-color-border-strong: #8ba0b8;
  --mcp-color-action-primary: #1263b8;
  --mcp-color-action-primary-hover: #0d529a;
  --mcp-color-link: #9bd0ff;
  --mcp-color-data-accent: #76b8ff;
  --mcp-color-focus-ring: #ffd166;
  --mcp-color-focus-offset: #07111f;
  --mcp-color-success-text: #8be0ae;
  --mcp-color-success-bg: #123625;
  --mcp-color-success-border: #4c9e6b;
  --mcp-color-warning-text: #ffd078;
  --mcp-color-warning-bg: #412d0d;
  --mcp-color-warning-border: #b77c18;
  --mcp-color-danger-text: #ffb3b7;
  --mcp-color-danger-action: #a92530;
  --mcp-color-danger-action-hover: #861c25;
  --mcp-color-danger-bg: #421b22;
  --mcp-color-danger-border: #b65f66;
  --mcp-color-info-text: #a7d5ff;
  --mcp-color-info-bg: #123354;
  --mcp-color-info-border: #548fc7;
  --mcp-color-attention-action: #ffad4a;
}

@media (prefers-color-scheme: dark) {
  .mcp-app:not([data-mcp-theme="light"]) {
    color-scheme: dark;
    --mcp-color-bg-canvas: #07111f;
    --mcp-color-bg-surface: #101c2c;
    --mcp-color-bg-subtle: #17263a;
    --mcp-color-bg-hover: #21344c;
    --mcp-color-bg-selected: #153b68;
    --mcp-color-overlay: rgb(1 7 16 / 82%);
    --mcp-color-text: #e9f1fa;
    --mcp-color-text-strong: #ffffff;
    --mcp-color-text-muted: #b8c5d6;
    --mcp-color-text-disabled: #8c9cb0;
    --mcp-color-border: #53677f;
    --mcp-color-border-subtle: #34475e;
    --mcp-color-border-strong: #8ba0b8;
    --mcp-color-action-primary: #1263b8;
    --mcp-color-action-primary-hover: #0d529a;
    --mcp-color-link: #9bd0ff;
    --mcp-color-data-accent: #76b8ff;
    --mcp-color-focus-ring: #ffd166;
    --mcp-color-focus-offset: #07111f;
    --mcp-color-success-text: #8be0ae;
    --mcp-color-success-bg: #123625;
    --mcp-color-success-border: #4c9e6b;
    --mcp-color-warning-text: #ffd078;
    --mcp-color-warning-bg: #412d0d;
    --mcp-color-warning-border: #b77c18;
    --mcp-color-danger-text: #ffb3b7;
    --mcp-color-danger-action: #a92530;
    --mcp-color-danger-action-hover: #861c25;
    --mcp-color-danger-bg: #421b22;
    --mcp-color-danger-border: #b65f66;
    --mcp-color-info-text: #a7d5ff;
    --mcp-color-info-bg: #123354;
    --mcp-color-info-border: #548fc7;
    --mcp-color-attention-action: #ffad4a;
  }
}

@media (prefers-contrast: more) {
  .mcp-app {
    --mcp-color-border: currentColor;
    --mcp-color-border-strong: currentColor;
    --mcp-color-focus-ring: #ffbf47;
  }
}