/* Jam Marker landing — After Design tokens (web scale) */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Source+Code+Pro:wght@400;500&display=swap');

:root {
  --gray-50:  #1b1b1b;
  --gray-75:  #232323;
  --gray-100: #2d2d2d;
  --gray-200: #333333;
  --gray-300: #383838;
  --gray-400: #424242;
  --gray-800: #8c8c8c;
  --gray-900: #b3b3b3;
  --gray-950: #cfcfcf;
  --white:    #f2f2f2;

  --blue-100: #0d2a47;
  --blue-500: #2d8ceb;
  --blue-600: #1f7ad4;

  --amber-400: #e8a84a;
  --amber-500: #f0b860;
  --amber-600: #d2933a;
  --amber-ink: #2a1d06;

  --green-400: #2d9d78;

  --surface-app:     var(--gray-100);
  --surface-sunken:  var(--gray-50);
  --surface-raised:  var(--gray-300);
  --surface-overlay: #343434;

  --text-primary:   var(--gray-950);
  --text-secondary: var(--gray-900);
  --text-muted:     var(--gray-800);
  --text-on-amber:  var(--amber-ink);
  --text-link:      var(--blue-500);

  --cta:        var(--amber-400);
  --cta-hover:  var(--amber-500);
  --cta-active: var(--amber-600);
  --accent:     var(--blue-500);

  --border-strong: #1a1a1a;
  --border-subtle: #383838;

  --font-ui:   'Source Sans 3', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'Source Code Pro', ui-monospace, Menlo, monospace;

  --sp-4:  8px;
  --sp-6:  12px;
  --sp-8:  16px;
  --sp-10: 20px;
  --sp-12: 24px;
  --sp-16: 32px;
  --sp-20: 40px;
  --sp-24: 48px;
  --sp-32: 64px;

  --radius-xs: 2px;
  --radius-sm: 3px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-pill: 999px;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --fs-micro: 10px;
  --fs-tiny: 11px;
  --fs-base: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;

  --control-h-sm: 26px;
  --row-h-loose: 32px;

  --text-label: var(--fw-regular) var(--fs-base)/1.35 var(--font-ui);
  --text-body: var(--fw-regular) var(--fs-sm)/1.5 var(--font-ui);

  --ls-wide: 0.04em;
  --focus-ring: 0 0 0 2px rgba(45, 140, 235, 0.55);
  --bevel-top: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --inset-well: inset 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-modal: 0 12px 40px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(0, 0, 0, 0.5);

  --ease-out: cubic-bezier(0.2, 0, 0, 1);
  --dur-base: 140ms;

  --max-w: 1080px;
  --header-h: 56px;
}