/* =============================================================================
 * styles.css — Stylesheet entry point
 * ----------------------------------------------------------------------------
 * What it does:
 *   Imports every numbered stylesheet file in order. Pages link only this
 *   file; the import order here is the cascade order.
 *
 *   Tokens load first so every later sheet can consume var(--*).
 *   Base/reset/typography load second.
 *   Layout, components, then page-specific styles in numeric order.
 *
 * Depends on:
 *   Every file in styles/01-*.css through styles/19-*.css.
 *
 * Used by:
 *   Every HTML page in the project.
 *
 * Phase: 1 entry point + 3 (every numbered file populated). 19 modules in
 *        cascade order: tokens → base → layout → nav → buttons → forms →
 *        panels → states → profile-header → profile-body → rail → drawer →
 *        slideover → wizard → list-pages → documents → photo-lightbox →
 *        compliance → system-site.
 *
 * Note on @import:
 *   @import is sequential and slower than separate <link> tags. Acceptable on
 *   localhost; revisit for production hosting (Phase 10) if it matters.
 * ============================================================================= */

@import url('01-tokens.css');
@import url('02-base.css');
@import url('03-layout.css');
@import url('04-nav.css');
@import url('05-buttons.css');
@import url('06-forms.css');
@import url('07-panels.css');
@import url('08-states.css');
@import url('09-profile-header.css');
@import url('10-profile-body.css');
@import url('11-rail.css');
@import url('12-drawer.css');
@import url('13-slideover.css');
@import url('14-wizard.css');
@import url('15-list-pages.css');
@import url('16-documents.css');
@import url('17-photo-lightbox.css');
@import url('18-compliance.css');
@import url('19-system-site.css');