Lay the Almanacka design foundation: tokens, type, shell

New token system in global.css (near-white surfaces, one ink-blue
accent, no sub-12px type), self-hosted Schibsted Grotesk, rewritten
primitives (buttons, fields, modal shell, segmented, disclosure,
skeleton), a borderless 56px header with an SV | EN language toggle,
an Icon component replacing glyphs, page skeletons that keep the
layout during loading, and leave-type colours moved out of TS into
CSS variables. Feature blocks keep their structure for later phases.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

frontend/src/components/common/page-skeleton.css

@@ -0,0 +1,36 @@
+/* Page skeleton — sized like a page title, a lede and a few text rows. */
+.page-skeleton {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sp-3);
+  padding-top: var(--sp-2);
+}
+
+.page-skeleton__title {
+  width: 40%;
+  max-width: 320px;
+  height: 28px;
+  margin-bottom: var(--sp-2);
+}
+
+.page-skeleton__lede {
+  width: 70%;
+  height: 16px;
+  margin-bottom: var(--sp-4);
+}
+
+.page-skeleton__rows {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sp-3);
+}
+
+.page-skeleton__row {
+  width: 100%;
+  height: 48px;
+  border-radius: var(--radius);
+}
+
+.page-skeleton__row:nth-child(2n) {
+  width: 92%;
+}