/* design/system/index.css - the single entry point.

   Order is not alphabetical, it is BY LEVEL from the inventory: every atom,
   then every molecule, then every organism, and inside organisms the ones that
   contain no other organism come first. What a thing is made of stands above it
   in the cascade, so a contextual rule (a button inside a dialog) wins without
   !important and without a duplicated class.

   Stage 09 adds patterns/ BELOW components, for the same reason. */

@import 'tokens.css';
@import 'base.css';


/* ---- level 1: atoms ---- */
@import 'components/availability.css';
@import 'components/badge.css';
@import 'components/button.css';
@import 'components/checkbox.css';
@import 'components/chip.css';
@import 'components/counter.css';
@import 'components/discount.css';
@import 'components/favourite.css';
@import 'components/field.css';
@import 'components/icon.css';
@import 'components/link-row.css';
/* 8.57: menu.css moved here from the molecule group, owner's call. Three
   placements gave three answers - file 2, this import 2, stand registry 1 -
   and the ladder is by NESTING: the menu draws its own rows, separator and
   phone handle and reaches for no component of the kit. Atom. */
@import 'components/menu.css';
@import 'components/otp.css';
@import 'components/price.css';
@import 'components/product-thumb.css';
@import 'components/radio.css';
@import 'components/rating.css';
/* 7.39: separator.css deleted. `.sep` had 47 instances and 0 of them outside a
   breadcrumb, so a level-1 file was describing part of a level-2 component. It
   lives in breadcrumb.css now, drawn instead of typed. */
@import 'components/skeleton.css';
@import 'components/stack-action.css';
@import 'components/status-pill.css';
@import 'components/stepper.css';
@import 'components/switch.css';
@import 'components/view-toggle.css';

/* ---- level 2: molecules ---- */
@import 'components/address-card.css';
@import 'components/banner.css';
@import 'components/blog-card.css';
@import 'components/brand-logo.css';
@import 'components/breadcrumb.css';
@import 'components/cart-row.css';
@import 'components/cert-thumb.css';
@import 'components/client-row.css';
@import 'components/desc-block.css';
@import 'components/empty-state.css';
@import 'components/filter-group.css';
@import 'components/gallery.css';
@import 'components/goal-tile.css';
/* 12.4: ONE component on TWO agents' orders. The brand card of node 2.4 and
   the category tile of node 2.0 declare the same shell and differ only in
   what stands inside it; two files here would have been the drift that
   central ordering exists to prevent. Level 2, in the molecules' group. */
@import 'components/nav-tile.css';
@import 'components/loyalty-rung.css';
@import 'components/order-row.css';
@import 'components/pagination.css';
@import 'components/product-card.css';
/* 12.8: node 8.10. The blog card and the promotion card share a shell and are
   still two components - one asks to be read, the other to be bought on these
   terms, and principle 1 puts a wall exactly there. Level 2, beside the card it
   is most often mistaken for. */
@import 'components/promo-card.css';
@import 'components/qa-item.css';
@import 'components/related.css';
@import 'components/restock-note.css';
@import 'components/review-item.css';
@import 'components/section-head.css';
@import 'components/seo-text.css';
@import 'components/spec-table.css';
@import 'components/toast.css';
@import 'components/toolbar.css';
@import 'components/trust-strip.css';

/* ---- level 3: organisms ---- */
@import 'components/account-shell.css';
@import 'components/buy-bar.css';
@import 'components/buy-box.css';
@import 'components/cart-drawer.css';
/* step 7.26: both came out of design/_stand.css, the stand-chrome file, where
   37 lines of the phone's own interface had been filed as part of the frame. */
@import 'components/cat-overlay.css';
@import 'components/checkout-form.css';
@import 'components/filter-rail.css';
@import 'components/filter-sheet.css';
@import 'components/footer.css';
@import 'components/header.css';
@import 'components/hero.css';
@import 'components/mega-menu.css';
@import 'components/nav-drawer.css';
@import 'components/pdp-tabs.css';
@import 'components/product-grid.css';
@import 'components/review-modal.css';
@import 'components/system-page.css';
/* 12.2: ordered before a screen asked, on the owner's decision - six content
   screens of the fan-out share one template. Level 3, beside the system page it
   borrows its card from. */
@import 'components/info-page.css';
/* 12.5: node 8.3 only. The IA node names it a DECLARED VARIANT of the service
   template, and it is the one page of the six with no prose column at all - a
   two-column answer sheet instead. Level 3, beside the template it varies. */
@import 'components/contacts-block.css';
/* 12.8: node 8.1. Prose in a column, and NOT `info-page.css`: that file opens by
   naming its six service pages, and its own `.info-tbl` refused to borrow
   `.ctable` on the same ground one batch ago. Level 3, beside the body it is not. */
@import 'components/article.css';
/* 12.8: node 8.9. A disclosure that stands CLOSED, which is why it is not
   `.trustsec` - a trust block that opened on a click would break principle 1.
   The mechanics are taken from that file verbatim rather than re-derived. */
@import 'components/faq-page.css';
/* 12.8: node 8.12. The success state of a footer component. Not `order-placed`,
   whose plate is drawn in the SUCCESS family because money changed hands, and
   not `system-page`, whose job is to report a fault. Level 3. */
@import 'components/newsletter.css';
/* 12.3: node 6.2, ordered by a subagent that stopped rather than drew. Level 3,
   beside the two pages it borrows its plate and its card from. */
@import 'components/order-placed.css';
/* 12.4: node 2.5, ordered by the agent that stopped rather than drew. Level 3:
   a surface the system had never had - a dropdown that is a full-screen sheet
   on a phone and holds five kinds of row. menu.css, overlay.css and
   cat-overlay.css were each read and each declines the job in its own words. */
@import 'components/search-overlay.css';
/* 12.11: node 4.x, the last grey screen of the product and the only ПОТІМ one -
   built on the owner's separate word, after the stage had closed at 140 of 141.
   Level 3, in the dialogs' company: it is a surface that takes the screen and
   asks one question at a time. It imports after `search-overlay.css` for no
   reason of cascade - both are level 3 and share nothing - and before the
   dialogs proper, which is where the group reads it. */
@import 'components/quiz.css';
@import 'components/tabbar.css';
@import 'components/auth-dialog.css';
@import 'components/city-dialog.css';
@import 'components/client-dialog.css';
@import 'components/cookie-banner.css';
@import 'components/overlay.css';
@import 'components/price-slider.css';

/* ---------- level 3, the coach flow - step 7.95 ------------------------------
   The owner's A13 decision brought eight coach screens into colour. Each of them
   carried its own `<style>` block - a private stylesheet 13 to 76 rules long that
   no other screen could read and no design system knew about - and these five
   files are those blocks, moved.

   EVERY SELECTOR IN THEM IS SCOPED TO `.coach` on the body, and that is a
   decision rather than a habit: sixteen of their class names are already
   declared by an existing component, and two of them - `.ord` and `.ord-h` -
   name a different component in each layer. Renaming is Крок 6; scoping is what
   can be done today without a shipped screen regressing.

   They import LAST on purpose. A scoped rule already outranks the component it
   sits beside, so order decides nothing here - but if one of these files ever
   loses its scope, importing last is the difference between a visible mistake
   and a silent one. */
@import 'components/coach-landing.css';
/* 12.20: the scroll story of node 5.0. It sits in the coach group and not in a
   patterns/ file because a pattern exists only from THREE named screens, and
   this is one screen's organism - the same argument that filed coach-landing.css
   at level 3 in the first place. It is imported AFTER coach-landing.css because
   the story took `.clv`'s five claims over and the two must not both be live. */
@import 'components/scrollstory.css';
@import 'components/coach-cabinet.css';
@import 'components/coach-clients.css';
@import 'components/coach-session.css';
@import 'components/coach-verify.css';
/* step 8.7 - the three destinations the coach rail names and the colour layer did
   not have. Same rule as the five above: every selector scoped to `.coach`. */
@import 'components/coach-wishlist.css';
@import 'components/coach-tariff.css';
@import 'components/coach-order.css';
/* step 8.28 - the Pro upsell panel, which two screens had been drawing under two
   names. Same group and same scope; it imports after coach-tariff.css because
   `coach-tariff-free` carries both, and the panel's frame should not be able to
   lose to the tariff file's own rules on a name they might ever share. */
@import 'components/upsell.css';
/* step 8.29 - the Free / Pro plan card, which three screens had been drawing
   under two name sets, both of them hand copies of `.acard`. It imports LAST in
   the group for one reason: it is the only file here that shares selectors with
   coach-tariff.css's own names (`.tf-col*`, `.tf-mini`, `.tf-price2` all still
   appear in that file's comments and one of them in a live rule), so the
   component must not be able to lose a tie to the screen file it came out of. */
@import 'components/plan-card.css';

/* ---------- patterns, and they import LAST -----------------------------------
   A pattern is assembled from the components above it, so in the cascade it has
   to stand below them. It also owns nothing they own: `action-row.css` declares
   composition only - display, gap, wrap, justification - and every container it
   replaced keeps its own deviations in its own component file, where a higher
   specificity settles them without either side guessing. Stage 09, step 1. */
@import 'patterns/action-row.css';