/* Shared partials. Domain layouts keep their own composition and density. */
.ui-card, .ui-dialog { padding: var(--space-section); border: 1px solid var(--border); border-radius: var(--radius); background: var(--canvas); color: var(--ink); box-shadow: var(--shadow); }
.ui-card__description, .empty-state p { color: var(--muted); }
.empty-state { padding: var(--space-heading); border: 1px dashed var(--border); border-radius: var(--radius); text-align: center; }
.empty-state h2, .ui-card h2 { font-size: var(--text-heading-medium); }
.ui-dialog { width: min(520px, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); overflow: auto; overscroll-behavior: contain; }
.ui-dialog::backdrop { background: rgba(2, 8, 91, 0.6); }
.field-error { margin: 0; color: var(--danger); font-size: var(--text-label); }
.form-field :is(input, select, textarea)[aria-invalid="true"] { border-color: var(--danger); }
.form-errors :is(h2, h3, h4) { color: var(--danger); font-family: var(--brand-body-font-family); font-size: 1rem; font-style: normal; font-weight: 700; }

/* The reference page uses the same primitives and has no persisted sample data. */
.ui-kit__nav, .ui-kit__examples { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-inline); }
.ui-kit__nav { margin-bottom: var(--space-section); }
.ui-kit__section { margin-block: var(--space-heading); scroll-margin-top: 6rem; }
.ui-kit__section > h2 { margin-bottom: var(--space-control); }
.ui-kit__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-section); }
.ui-kit__grid > *, .ui-kit__section { min-width: 0; }
.ui-kit__swatches { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--space-control); }
.ui-kit__swatch { margin: 0; }
.ui-kit__swatch::before { display: block; height: 4rem; border: 1px solid var(--border); border-radius: var(--radius-control); content: ""; }
.ui-kit__swatch--brand::before { background: var(--brand-blue); }
.ui-kit__swatch--accent::before { background: var(--brand-gold); }
.ui-kit__swatch--surface::before { background: var(--surface); }
.ui-kit__swatch--text::before { background: var(--ink); }
.ui-kit__table caption { padding: var(--space-control); text-align: left; }
.ui-kit__feedback { display: grid; gap: var(--space-control); }
@media (max-width: 720px) {
  .ui-kit__grid { grid-template-columns: minmax(0, 1fr); }
  .ui-card, .ui-dialog { padding: var(--space-control); }
  .ui-kit__table caption { display: block; }
}