/* =============================================================
   index.css — the order the stylesheet is assembled in.

   Nothing is declared here. This file exists to say what loads and
   in what order, because the order is the whole of how the design
   composes:

     base        the tokens, the reset, and the blocks every page
                 shares -- .button, .chip, .tag, .notice, .panel,
                 .page-head, .prose, .figures, .rule-list.
     components  a block two or more pages draw: the header, a
                 booking, a game somebody played.
     pages       one page's own rules.

   Later wins at equal specificity, so a page can refine a shared
   block by naming it -- .map-page__join adds a gap to .button, and
   .venue__join-dot sits inside one -- and the tweak actually
   lands. When these imports sat above the blocks they were meant to
   refine, none of those overrides applied and the pages that wrote
   them looked wrong in ways nobody could find in the file that was
   wrong.

   @import has to come before every other rule in a file, which is
   the reason the tokens moved out to base.css rather than staying
   here above the list.
   ============================================================= */

@import url('./styles/base.css');

@import url('./styles/components/navbar.css');
@import url('./styles/components/map-controls.css');
@import url('./styles/components/booking-row.css');
@import url('./styles/components/game-row.css');
@import url('./styles/components/back-link.css');
@import url('./styles/components/toast.css');
@import url('./styles/components/dialog.css');
@import url('./styles/components/country.css');
@import url('./styles/components/select.css');
@import url('./styles/components/pagination.css');
@import url('./styles/pages/home.css');
@import url('./styles/pages/map.css');
@import url('./styles/pages/venue.css');
@import url('./styles/pages/place.css');
@import url('./styles/pages/reserve.css');
@import url('./styles/pages/auth.css');
@import url('./styles/pages/bookings.css');
@import url('./styles/pages/match.css');
@import url('./styles/pages/profile.css');
@import url('./styles/pages/player.css');
@import url('./styles/pages/leaderboard.css');
@import url('./styles/pages/news.css');
@import url('./styles/pages/about.css');
@import url('./styles/pages/legal.css');
@import url('./styles/pages/design.css');

/* The back office. Eighteen pages in one file, which is the
   opposite of the rule above and is argued for at the top of it:
   the CMS is one shape repeated, not eighteen designed pages, and
   eighteen stylesheets would be eighteen copies of the same ruled
   list drifting apart. Last, so it can refine the shared blocks it
   leans on. */
@import url('./styles/pages/admin.css');