:root {
  
  --c-bg: #f4f7fb;
  --c-surface: #ffffff;
  --c-panel: #f2f7fc;

  
  --c-border: #e2ebf4;
  --c-border-strong: #cbd9e8;

  
  --c-ink: #2d3e50;
  --c-ink-soft: #33475b;
  --c-ink-mute: #7c98b6;

  
  --c-navy: #2a5f8d;
  --c-navy-deep: #2d3e50;
  --c-navy-soft: #e6eff8;

  
  --c-orange: #2a8d8a;
  --c-orange-deep: #1f6f6c;
  --c-orange-soft: #e2f1f0;

  
  --c-ok: #2f8f63;
  --c-ok-soft: #e1f0e8;
  --c-ok-border: #b7e4c7;
  --c-ok-deep: #1a6e38;
  --c-warn: #b8761e;
  --c-warn-soft: #f7ebd2;
  --c-err: #c8443a;
  --c-err-soft: #fbe7e1;

  
  --c-mapi: #5a7b9a;
  --c-napi: #516e9a;

  
  --c-method-get: #0e2a4d;
  --c-method-post: #3d8b5e;
  --c-method-put: #b8761e;
  --c-method-delete: #b43a3a;
  --c-method-patch: #7a6ccc;

  
  --font: var(--font-rubik, "Rubik", Helvetica, Arial, sans-serif);
  --mono: "JetBrains Mono", "Fira Code", ui-monospace, "SF Mono", monospace;

  
  --topnav-h: 60px;
  --nav-rail-w: 380px;
  --sidebar-w: 236px;
  --radius-sm: 4px;
  --radius: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;

  
  
  --c-supply: #2a8d8a;
  --c-supply-deep: #1f6f6c;
  --c-supply-soft: #e2f1f0;
  --c-distribution: #b8761e;
  --c-distribution-deep: #8f5c14;
  --c-distribution-soft: #f7ebd2;

  
  --text-strong: var(--c-ink);
  --text-body: var(--c-ink-soft);
  --text-muted: var(--c-ink-mute);
  --text-link: var(--c-navy);
  --surface-page: var(--c-bg);
  --surface-card: var(--c-surface);
  --surface-sunken: var(--c-panel);
  --border-default: var(--c-border);
  --border-strong: var(--c-border-strong);
  --border-focus: var(--c-navy);
  --action-primary: var(--c-navy);
  --action-primary-hover: #224e75;
  --action-on-primary: #ffffff;
  --status-success: var(--c-ok);
  --status-danger: var(--c-err);
  --status-warning: var(--c-warn);
  --status-info: var(--c-navy);

  
  --shadow-xs: 0 1px 2px rgba(45, 62, 80, 0.06);
  --shadow-sm: 0 1px 3px rgba(45, 62, 80, 0.08), 0 1px 2px rgba(45, 62, 80, 0.04);
  --shadow-md: 0 4px 12px rgba(45, 62, 80, 0.08);
  --shadow-lg: 0 12px 28px rgba(45, 62, 80, 0.12);
  --shadow-focus: 0 0 0 3px rgba(42, 95, 141, 0.18);

  
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --dur-fast: 120ms;
  --dur-base: 180ms;
  --dur-slow: 260ms;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}