/* ============================================================ * member-management.css — app component styles * ============================================================ * Colours, spacing, radii, and type all come from the design system's --ds-* * tokens (generated from the token pipeline; the "members" brand is activated * by ). Components use the design system's * class-marker convention, ds-c-{name}, styled from the matching * --ds-{name}-* component tokens. * * The only literals left are values the token set does not model: unitless * line-height ratios, 50%/full-round shapes, the 1px hairline border the * card/table tokens already carry as widths, optical letter-spacing, and the * ch-based reading measure. Everything dimensional resolves from a token. * ============================================================ */ /* ── Utilities ── */ /* Tabular lining numerals — aligns columns of figures (amounts, counts, prices) so digits line up vertically and don't jitter as values change. Backed by the design-system token; the DS emits --ds-typography-numeric-tabular but ships the matching .ds-u-tabular-nums class only in the RCL, so a tokens-first consumer defines it locally (still no hardcoded values). */ .ds-u-tabular-nums { font-feature-settings: var(--ds-typography-numeric-tabular); } /* ── DS-003: adjustments for the design-system RCL components we consume ── Layout/usage fixes for our app (not token overrides): - DsButton's icon slot expects a DS icon-font glyph we don't ship (we use our own SVG in the button content instead), so collapse the empty slot to keep the label optically centered. - DsPageHeader centers its title row; we bottom-align the title with its subtitle so the heading and lead sit on the same baseline. */ .ds-c-btn__icon:empty { display: none; } .ds-c-pageHeader__titleGroup { align-items: flex-end; } /* Stat-filter cards become