:root {
  --ms-primary: #8e1f2d;
  --ms-primary-hover: #741824;
  --ms-accent-soft: #f6e9eb;
  --ms-accent-info: #2f5f7f;
  --ms-accent-info-soft: #e8f1f5;
  --ms-accent-info-border: #bfd3dd;
  --ms-accent-warning: #9a6a16;
  --ms-accent-warning-soft: #fff4d8;
  --ms-accent-warning-border: #ead08a;
  --ms-surface: #fffdfc;
  --ms-surface-soft: #fafaf9;
  --ms-background: #f8f4f1;
  --ms-text-main: #221c19;
  --ms-text-body: #3f3f46;
  --ms-text-muted: #6b625d;
  --ms-status-pass: #2e6f57;
  --ms-status-fail: #b91c1c;
  --ms-border: #e8dfda;
  --ms-border-strong: #d4c7bf;
  --ms-focus: rgba(142, 31, 45, 0.28);
  --ms-space-1: 0.5rem;
  --ms-space-2: 0.75rem;
  --ms-space-3: 1rem;
  --ms-space-4: 1.5rem;
  --ms-space-5: 2rem;
  --ms-space-6: 3rem;
  --ms-radius-card: 16px;
  --ms-radius-pill: 999px;
  --ms-shadow-card: 0 4px 20px -4px rgba(24, 24, 27, 0.18);

  /* Topbar */
  --ms-topbar-bg: #83191c;

  /* Background patterns (shared SVG decorations — single source for every surface) */
  --ms-pattern-diamonds: url("data:image/svg+xml,%3Csvg width='96' height='96' viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%238e1f2d' stroke-opacity='0.12' stroke-width='1.5'%3E%3Cpath d='M0 24h24V0M24 96V72H0M96 72H72v24M72 0v24h24'/%3E%3Cpath d='M36 12h24v24H36zM36 60h24v24H36zM12 36h24v24H12zM60 36h24v24H60z'/%3E%3C/g%3E%3C/svg%3E");
  --ms-pattern-topbar: url("data:image/svg+xml,%3Csvg width='32' height='64' viewBox='0 0 32 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 28h20V16h-4v8H4V4h28v28h-4V8H8v12h4v-8h12v20H0v-4zm12 8h20v4H16v24H0v-4h12V36zm16 12h-4v12h8v4H20V44h12v12h-4v-8zM0 36h8v20H0v-4h4V40H0v-4z' fill='%23e01942' fill-opacity='0.34' fill-rule='evenodd'/%3E%3C/svg%3E");

  /* Alerts (token page) */
  --ms-alert-bg: #f7f2ee;
  --ms-alert-danger-bg: #fff1ed;
  --ms-alert-danger-text: #7a271a;

  /* Form inputs (radio/checkbox) */
  --ms-input-border: #a8a29e;
  --ms-input-border-hover: #78716c;

  /* Validation errors */
  --ms-validation-error-bg: #fef2f2;
  --ms-validation-error-border: rgba(185, 28, 28, 0.35);

  /* Answer rows */
  --ms-answer-border-hover: #b8a99e;
  --ms-answer-selected-hover-bg: #f9eef0;

  /* Progress bar */
  --ms-progress-bg: #ddd6d1;
  /* Fill = the design system's info blue (steel/petrol). Named separately from
     --ms-primary so the progress colour is its own semantic; references the
     existing accent token rather than re-hardcoding the literal. */
  --ms-progress-fill: var(--ms-accent-info);

  /* List concepts — shared borders */
  --ms-list-item-border: #ece6e1;
  --ms-list-item-border-closed: #f0ebe8;
  --ms-list-divider-border: #e5e0dc;
}
