/* Карточки и сетки: .card, .card-head, .grid (+ kpi/two/three/table-side), .stack, .kpi-card */
.card {
  --card-bg: var(--surface-1); --card-border: var(--border); --card-radius: var(--r-lg);
  --card-pad: var(--s4); --card-shadow: var(--shadow);
  background: var(--card-bg); border: var(--border-w) solid var(--card-border); border-radius: var(--card-radius);
  padding: var(--card-pad); box-shadow: var(--card-shadow);
}
.card + .card { margin-top: var(--s4); }
.grid > .card + .card { margin-top: 0; }   /* в сетке отступ даёт gap */
.card + .notice, .notice + .card { margin-top: var(--s4); }
.card-head { display: flex; justify-content: space-between; align-items: center; gap: var(--s3);
  margin-bottom: var(--s3); flex-wrap: wrap; }
.card-meta { display: inline-flex; align-items: center; gap: var(--s2); flex-wrap: wrap; justify-content: flex-end; color: var(--fg-muted); font-size: var(--fs-sm); }
.grid { display: grid; gap: var(--s4); }
.grid.kpi { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.grid.two { grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); }
/* таблица слева + форма справа (проекты): форма — фиксированной ширины, таблице остальное */
.grid.table-side { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
.grid.three { grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); }
@media (max-width: 900px) { .grid.two, .grid.table-side { grid-template-columns: minmax(0, 1fr); } }
.stack { display: flex; flex-direction: column; gap: var(--s3); }

.kpi-card .value { font: var(--fw-semibold) var(--fs-3xl)/1.1 var(--font-data); font-variant-numeric: tabular-nums; margin-top: var(--s2); }
.kpi-card .label { color: var(--fg-muted); font-size: var(--fs-sm); }