/* Stylesheet entry point — base.html links only this file.

   Cascade layers make precedence depend on the layer, not on selector
   specificity or <link> order: anything in `pages` beats anything in
   `components`, which beats `base`, and so on, whatever the selectors.
   Page stylesheets are added from a template's {% block head %} with the
   stylesheet() macro (templates/components/assets.html). Each one wraps
   its rules in `@layer pages { … }`; third-party CSS (MapLibre) is
   imported into `vendor` by a file under vendor/, so it can't out-rank
   our own rules just by being unlayered.

   To add a component: create components/<name>.css and import it below
   (keep the list alphabetical). See docs/frontend-components.md. */

@layer reset, tokens, base, vendor, components, pages;

@import url("reset.css") layer(reset);
@import url("tokens.css") layer(tokens);
@import url("base.css") layer(base);

@import url("components/badge.css") layer(components);
@import url("components/button.css") layer(components);
@import url("components/dialog.css") layer(components);
@import url("components/empty-state.css") layer(components);
@import url("components/field.css") layer(components);
@import url("components/flash.css") layer(components);
@import url("components/inbox-row.css") layer(components);
@import url("components/lightbox.css") layer(components);
@import url("components/listing-card.css") layer(components);
@import url("components/page-header.css") layer(components);
@import url("components/section.css") layer(components);
@import url("components/site-chrome.css") layer(components);
@import url("components/stat.css") layer(components);
@import url("components/state.css") layer(components);
