@font-face {
  font-family: 'Geist Sans';
  src: url('/fonts/geist-sans-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Geist Sans';
  src: url('/fonts/geist-sans-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'Geist Sans';
  src: url('/fonts/geist-sans-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: 'Geist Mono';
  src: url('/fonts/geist-mono-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'Geist Mono';
  src: url('/fonts/geist-mono-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

:root {
  color-scheme: light;
  --ms-font-sans: 'Geist Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --ms-font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --ms-canvas: #FAFAFA;
  --ms-surface: #FFFFFF;
  --ms-surface-subtle: #F5F5F5;
  --ms-glass: rgba(255, 255, 255, 0.8);
  --ms-scrim: rgba(0, 0, 0, 0.45);
  --ms-rail: #FFFFFF;

  --ms-ink: #171717;
  --ms-ink-secondary: #666666;
  --ms-ink-muted: #707070;
  --ms-on-rail: #171717;
  --ms-on-rail-muted: #666666;

  --ms-line: #E8E8E8;
  --ms-line-strong: #888888;

  --ms-primary: #0761D1;
  --ms-primary-strong: #2E2E2E;
  --ms-primary-fill: #171717;
  --ms-on-primary: #FAFAFA;
  --ms-primary-tint: #EDEDED;
  --ms-on-primary-tint: #171717;
  --ms-accent: #0070F3;
  --ms-focus-ring: #0070F3;

  --ms-success: #0E7A3C;
  --ms-success-tint: #E3F9EC;
  --ms-on-success-tint: #0E7A3C;
  --ms-warning: #8F4E00;
  --ms-warning-tint: #FEF4E5;
  --ms-on-warning-tint: #8F4E00;
  --ms-risk: #CD2B31;
  --ms-risk-tint: #FFECED;
  --ms-on-risk-tint: #CD2B31;

  --ms-ring: 0 0 0 1px rgba(0, 0, 0, 0.08);
  --ms-card-shadow:
    0 0 0 1px rgba(0, 0, 0, 0.08), 0 2px 2px rgba(0, 0, 0, 0.04), 0 8px 8px -8px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
  --ms-divider: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
  --ms-sidebar-shadow: inset -1px 0 0 0 rgba(0, 0, 0, 0.08);
  --ms-topbar-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08);
  --ms-footer-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08);
}

.dark {
  color-scheme: dark;

  --ms-canvas: #000000;
  --ms-surface: #0A0A0A;
  --ms-surface-subtle: #111111;
  --ms-glass: rgba(0, 0, 0, 0.7);
  --ms-scrim: rgba(0, 0, 0, 0.6);
  --ms-rail: #0A0A0A;

  --ms-ink: #FAFAFA;
  --ms-ink-secondary: #A1A1A1;
  --ms-ink-muted: #888888;
  --ms-on-rail: #FAFAFA;
  --ms-on-rail-muted: #A1A1A1;

  --ms-line: #1F1F1F;
  --ms-line-strong: #A8A8A8;

  --ms-primary: #3291FF;
  --ms-primary-strong: #E2E2E2;
  --ms-primary-fill: #FAFAFA;
  --ms-on-primary: #171717;
  --ms-primary-tint: #1F1F1F;
  --ms-on-primary-tint: #FAFAFA;
  --ms-accent: #3291FF;
  --ms-focus-ring: #3291FF;

  --ms-success: #3DD68C;
  --ms-success-tint: #0C2718;
  --ms-on-success-tint: #3DD68C;
  --ms-warning: #F5A623;
  --ms-warning-tint: #2D210E;
  --ms-on-warning-tint: #F5A623;
  --ms-risk: #FF6166;
  --ms-risk-tint: #2F1718;
  --ms-on-risk-tint: #FF6166;

  --ms-ring: 0 0 0 1px rgba(255, 255, 255, 0.08);
  --ms-card-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.08), 0 2px 2px rgba(0, 0, 0, 0.04), 0 8px 8px -8px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --ms-divider: inset 0 -1px 0 0 rgba(255, 255, 255, 0.08);
  --ms-sidebar-shadow: inset -1px 0 0 0 rgba(255, 255, 255, 0.08);
  --ms-topbar-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.08);
  --ms-footer-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.08);
}