One palette, one type scale, one set of components across every KSF site. Everything on this page is rendered by ksf.css — if it looks right here, it looks right in the apps.
Four background levels. The page sits lowest; each step reads as slightly nearer the viewer. Never stack more than three in one view.
Four tiers, dimmest last. Primary ink is #e6e4db, not white — the low-contrast pairing is deliberate and must not be "fixed". Below --faint, use an icon rather than text.
One blue, and it always means "interactive". The three status colours carry meaning — good, warning, critical — and are never used decoratively. Each has a -wash variant for fills behind text.
Inter where it loads, the system stack where it doesn't. Seven sizes — anything else is a bug.
Five radii, six spacing steps on a 4px rhythm. A new magic number is a bug, not a design decision.
Secondary is the default. Exactly one .primary per view — the action you actually want taken.
One focus treatment across the estate: accent border plus a soft ring.
Cards carry a hairline border, not a shadow — shadow is reserved for things that genuinely float. Meter fill follows status.
Transient confirmation, bottom centre, gone in 2.5s. Never for anything the user must act on.