:root {
  --ar-ds-color-brand: #003986;
  --ar-ds-color-brand-strong: #002056;
  --ar-ds-color-brand-soft: #eef5ff;
  --ar-ds-color-brand-border: #c9dcf5;
  --ar-ds-color-surface: #ffffff;
  --ar-ds-color-surface-soft: #f8fafd;
  --ar-ds-color-ink: #16244a;
  --ar-ds-color-text: #26344f;
  --ar-ds-color-muted: #667794;
  --ar-ds-color-muted-soft: #8d9bb3;
  --ar-ds-color-border: #e5ebf3;
  --ar-ds-color-border-strong: #dde6f1;
  --ar-ds-color-action: #1f59cf;
  --ar-ds-color-action-strong: #173f97;
  --ar-ds-color-action-soft: #e8effb;
  --ar-ds-color-success: #17613d;
  --ar-ds-color-success-soft: #eefaf2;
  --ar-ds-color-warning: #8a5a0a;
  --ar-ds-color-warning-soft: #fff7e8;
  --ar-ds-color-danger: #8a2020;
  --ar-ds-color-danger-soft: #fff4f4;
  --ar-page-bg-control-room: #eef2f8;
  --ar-page-bg-commerce: #eef2f8;

  --ar-ds-shadow-card: 0 18px 42px rgba(18, 51, 88, 0.08);
  --ar-ds-radius-xs: 6px;
  --ar-ds-radius-sm: 8px;
  --ar-ds-radius-md: 12px;
  --ar-ds-radius-lg: 18px;
  --ar-ds-radius-pill: 999px;


  --ar-ds-space-3: 12px;
  --ar-ds-space-4: 16px;
  --ar-ds-space-5: 20px;



  --ar-ds-record-list-gap: var(--ar-ds-space-3);
  --ar-ds-record-card-surface: #fcfdff;
  --ar-ds-record-card-border: var(--ar-ds-color-border);
  --ar-ds-record-card-accent: var(--ar-ds-color-action);
  --ar-ds-record-card-radius: 13px;
  --ar-ds-record-card-padding: var(--ar-ds-space-4);
  --ar-ds-record-card-column-gap: var(--ar-ds-space-3);
  --ar-ds-record-card-row-gap: 14px;
  --ar-ds-record-card-shadow: 0 1px 2px rgba(16, 40, 80, 0.04), 0 1px 3px rgba(16, 40, 80, 0.05);
  --ar-ds-record-card-action-size: 40px;
  --ar-ds-font-sans: var(--platform-font-sans, Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);

  --ar-ds-type-body: 14px;
  --ar-ds-type-body-line: 1.45;


  --ar-ds-type-section-title: 18px;
  --ar-ds-type-page-title: 27px;
  --ar-ds-type-page-title-line: 1.08;

  --ar-ds-focus-ring: 0 0 0 3px rgba(0, 57, 134, 0.14);
}

.site-shell {
  display: flow-root;
}

.site-shell--page-soft {
  --ar-page-bg: var(--ar-page-bg-control-room);
}

.site-shell--commerce-soft {
  --ar-page-bg: var(--ar-page-bg-commerce);
}

.ar-ds-container {
  margin-inline: auto;
  max-width: 1180px;
  padding-inline: var(--ar-ds-space-5);
  width: 100%;
}

@media (max-width: 640px) {
.ar-ds-container { padding-inline: var(--ar-ds-space-4);
}
}