:root {
  --mk-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mk-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --mk-font-size-base: 16px;
  --mk-line-height-base: 24px;
  --mk-font-size-sm: 14px;
  --mk-font-size-xs: 12px;
  --mk-font-size-md: 24px;
  --mk-motion-fast: .22s ease;

  --mk-color-accent: #0145db;
  --mk-color-accent-dark: #0136ad;
  --mk-color-accent-on-dark: #9cbbff;

  --mk-color-bg-public: #f5f6fa;
  --mk-color-bg-public-soft: #eef3ff;
  --mk-color-surface: #fff;
  --mk-color-surface-soft: #f8faff;
  --mk-color-surface-muted: #f5f6fa;

  --mk-color-text: #181827;
  --mk-color-muted: #5d6275;
  --mk-color-muted-soft: #6d7283;
  --mk-color-muted-strong: #8f92a3;

  --mk-color-line: #e6e8f0;
  --mk-color-line-strong: #dfe2ec;

  --mk-color-dark: #101827;
  --mk-color-dark-soft: #181827;
  --mk-color-dark-deep: #071124;
  --mk-color-light: #fff;
  --mk-color-light-soft: #f8f9ff;

  --mk-color-success: #1f7a3f;
  --mk-color-success-bg: #eefaf1;
  --mk-color-success-line: #9ad3aa;
  --mk-color-warning: #8a6500;
  --mk-color-warning-bg: #fff8e6;
  --mk-color-warning-line: #f1d897;
  --mk-color-danger: #c83131;
  --mk-color-danger-bg: #fff0f0;
  --mk-color-danger-line: #e59a9a;

  --mk-accent-rgb: 1 69 219;
  --mk-bg-public-rgb: 245 246 250;
  --mk-dark-rgb: 24 24 39;
  --mk-dark-deep-rgb: 7 17 36;
  --mk-light-rgb: 255 255 255;
  --mk-black-rgb: 0 0 0;

  --mk-public-width: 1180px;
  --mk-hero-width: 1240px;
  --mk-public-gutter: 56px;
  --mk-section-y: 80px;
  --mk-bar-height: 64px;
  --mk-logo-width: 100px;
  --mk-logo-width-lg: 116px;
  --mk-logo-width-sm: 86px;
  --mk-brand-min-width: 220px;
  --mk-brand-copy-width: 560px;
  --mk-button-height: 42px;
  --mk-button-height-public: 44px;
  --mk-button-height-sm: 38px;
  --mk-button-max-width-sm: 180px;
  --mk-button-icon-size: 40px;
  --mk-button-icon-size-sm: 34px;
  --mk-prompt-width: 860px;
  --mk-prompt-height: 74px;
  --mk-prompt-height-sm: 66px;
  --mk-prompt-column: 42px;
  --mk-prompt-column-sm: 36px;
  --mk-prompt-input-height: 52px;
  --mk-prompt-input-height-sm: 44px;
  --mk-space-1: 8px;
  --mk-space-0-5: 4px;
  --mk-space-2: 10px;
  --mk-space-3: 12px;
  --mk-space-4: 13px;
  --mk-space-5: 14px;
  --mk-space-6: 16px;
  --mk-space-7: 18px;
  --mk-space-8: 22px;
  --mk-space-8-5: 20px;
  --mk-space-9: 28px;
  --mk-space-10: 30px;
  --mk-space-11: 32px;
  --mk-space-12: 34px;
  --mk-space-13: 36px;
  --mk-space-14: 44px;
  --mk-space-15: 46px;
  --mk-space-16: 56px;
  --mk-blur-header: 18px;
  --mk-card-radius: 18px;
  --mk-card-gap: 14px;
  --mk-card-padding: 22px;
  --mk-panel-padding: clamp(32px, 5vw, 72px);
  --mk-radius-panel: 28px;
  --mk-radius-control: 999px;
  --mk-radius-sm: 6px;
  --mk-radius-md: 8px;
  --mk-radius-round: 999px;

  --mk-icon-size-sm: 1rem;
  --mk-icon-size-md: 1.5rem;

  --mk-shadow-soft: 0 24px 80px rgb(var(--mk-accent-rgb) / .14);
  --mk-shadow-window: 0 34px 120px rgb(var(--mk-accent-rgb) / .14);
  --mk-shadow-dark-window: 0 34px 110px rgb(var(--mk-dark-rgb) / .20);
  --mk-shadow-button: 0 12px 28px rgb(var(--mk-dark-rgb) / .16);
  --mk-shadow-button-hover: 0 0 0 1px rgb(var(--mk-accent-rgb) / .22) inset, 0 0 22px rgb(var(--mk-accent-rgb) / .22), 0 0 44px rgb(var(--mk-accent-rgb) / .16);
  --mk-shadow-prompt: 0 28px 80px rgb(var(--mk-black-rgb) / .28), 0 0 0 8px rgb(var(--mk-accent-rgb) / .08);
  --mk-shadow-feature-tile: 0 18px 54px rgb(var(--mk-dark-rgb) / .05);

  --mk-layout-gap-wide: 54px;
  --mk-hero-min-height: 760px;
  --mk-hero-padding-top: 58px;
  --mk-hero-padding-bottom: 78px;
  --mk-hero-media-min-width: 520px;
  --mk-hero-title-width-sm: 320px;
  --mk-media-preview-ratio: 605 / 571;
  --mk-step-label-width: 110px;
  --mk-feature-icon-size: 38px;
  --mk-feature-icon-glyph-size: 18px;
  --mk-feature-icon-radius: 14px;
  --mk-cta-copy-min-width: 420px;
  --mk-form-label-size: var(--mk-font-size-xs);
  --mk-form-control-height: 52px;
  --mk-form-control-radius: 18px;
  --mk-form-control-padding-x: 18px;
  --mk-form-control-padding-y: 14px;
}

@media (max-width: 700px) {
  :root {
    --mk-public-gutter: 32px;
    --mk-section-y: 54px;
    --mk-panel-padding: 32px;
  }
}