feat(web): let content arrive instead of popping in

Loaded content now settles in: library cards and rows, checker issue rows,
assistant suggestions and past conversations rise in with a short stagger on
first appearance only; new assistant messages and "Thinking…" rise in while
history stays put; a newly made document fades up from 96% with its accent
ring fading in.

Resume thumbnails keep the last drawn page of the same resume up while a new
one renders, so edits and return visits no longer drop to a placeholder. The
builder's first preview render paints hidden under the placeholder pages and
fades in; the PDF viewer reserves an A4 slot and holds its overlay until a
page has painted. The ATS checker ring fills on first reveal, ring colour
blends across the threshold, and report and insights bars grow from their
baseline.

Hand-rolled pulsing placeholders become the static Skeleton, shaped like the
view that is loading (documents grid or list, applications views, insights,
API keys). ENTER_CLASS and stagger() live in libs/motion.ts.

apps/web/src/index.css

@@ -7,9 +7,45 @@
 	initial-value: 0%;
 }
 
+/* Registered so crossing 80 blends accent and warn instead of snapping. */
+@property --ring-color {
+	syntax: "<color>";
+	inherits: false;
+	initial-value: transparent;
+}
+
 @utility score-ring {
 	background: conic-gradient(var(--ring-color) 0 var(--ring-value), var(--sunken) 0);
-	transition: --ring-value var(--d3) var(--ease);
+	transition:
+		--ring-value var(--d3) var(--ease),
+		--ring-color var(--d3) var(--ease);
+}
+
+/*
+ * The free ATS checker's first reveal: the arc fills from 0 once per checked file. 480ms is over the UI budget on
+ * purpose: it happens once per file and the fill is what explains the number. A keyframe (not @starting-style)
+ * because it must run on the element's first style; the reduced-motion rule in globals.css makes it instant.
+ */
+@utility score-ring-reveal {
+	animation: score-ring-reveal 480ms var(--ease) backwards;
+}
+
+@keyframes score-ring-reveal {
+	from {
+		--ring-value: 0%;
+	}
+}
+
+@theme {
+	/* A document made on this device lands on the grid: a fade up from 96%, once per mount. */
+	--animate-arrive: arrive var(--d2) var(--ease) backwards;
+
+	@keyframes arrive {
+		from {
+			opacity: 0;
+			scale: 0.96;
+		}
+	}
 }
 
 /* A wavy warn underline under a line of the page that has a Check issue. */