/* ============================================================
   xSuite Design System — single entry point
   ------------------------------------------------------------
   Link this ONE file. Nothing else. No build step, no
   preprocessor, no npm package.

     <link rel="stylesheet" href="/assets/xsuite/xsuite.css">

   Order matters: fonts and tokens must be parsed before any
   rule that reads var(--*).
   ============================================================ */

/* 1 — Foundations: fonts + tokens (values only, no selectors) */
@import url('tokens/fonts.css');
@import url('tokens/colors.css');
@import url('tokens/typography.css');
@import url('tokens/spacing.css');
@import url('tokens/elevation.css');

/* 2 — Element defaults (reset + brand typography on bare HTML) */
@import url('tokens/base.css');

/* 3 — Component classes (.xs-btn, .xs-card, .xs-badge, …) */
@import url('components.css');

/* 4 — Application shell (sidebar, topbar, table, drawer) */
@import url('shell.css');

/* 5 — Product patterns (auth, onboarding, course, billing, …) */
@import url('patterns.css');

/* ------------------------------------------------------------
   PRODUCTION NOTE — @import costs one round trip per file.
   For the training sidecar (single-threaded Node, gzip above
   1 KB) concatenate the seven files in this order into one
   xsuite.css at build time. build.mjs is the right place;
   see docs/integration.md.
   ------------------------------------------------------------ */