feat(operator): design system port + persistent shell (O.4)

Operator portal now wears its real chrome instead of placeholder spans.
Sidebar + topbar + page header all rendered against the carbon palette
from tokens.css.

Components ported from the source design (operator-app.jsx,
platform-ui.jsx, operator-screens.jsx) as Vue 3 SFCs in
apps/operator/components/:

  Foundation: NodeMark (copied from portal), UiIcon (expanded to 31 icons
  covering sidebar/topbar/sort/arrows)

  Primitives: Card (3 surface variants), UiButton (primary / secondary /
  ghost / dark / danger × sm / md / lg), DataTable (header + rows),
  Badge (7 tones), Avatar (deterministic palette by name hash), Mono,
  Eyebrow, StatusDot, PageHeader (with actions slot)

  Shell: OpSidebar (collapsible 232<->56px, 12 nav items in 4 sections,
  active-row highlight from route, badge slot, brand + user footer);
  OpTopbar (env badge with prod/staging/dev variants, palette trigger
  stub for the ⌘K work in O.8, on-call pill, bell, avatar)

Layouts: layouts/default.vue wires sidebar + topbar + slot; layouts/blank.vue
is used by the login page (definePageMeta layout:'blank'). app.vue now
wraps NuxtPage in NuxtLayout (the missing piece — without it Nuxt warns
"Your project has layouts but the <NuxtLayout /> component has not been
used" and renders nothing chrome-wise).

Composable composables/useSidebar.ts holds the collapsed state shared
between OpSidebar's toggle button and layouts/default.vue's ⌘[ keyboard
shortcut.

Verified in the browser:
  - Sidebar renders all 12 nav links with section dividers, env badge shows
    PROD, PageHeader resolves to the user's display name from
    useOidcAuth().user
  - Collapse toggle flips sidebar width 232↔56; nav rows become icon-only
  - Smoke test on the placeholder home still returns 409 for the seeded
    test-partner (token forwarding survives the layout refactor)

Gotcha documented in the plan: Vite 7.3 added a strict
server.allowedHosts check that returns plaintext 403 for any host header
that isn't the dev origin. The customer portal pre-dates this Vite
version; operator needs allowedHosts: ['operator.dezky.local'] in
nuxt.config.ts under vite.server.

Pages/index.vue replaces the bare HTML placeholder from O.3 with the
new PageHeader + Card primitives — same smoke-test functionality, much
better visual fidelity.

Real screen content (Tenants, Partners, Infrastructure, etc.) lands in
O.5+. This commit is the chrome, the smoke test, and the verification
that the design system primitives compose correctly.

apps/operator/components/NodeMark.vue

@@ -0,0 +1,93 @@
+<script setup lang="ts">
+// Brand mark — a stylized "d" inside a squircle. Ported from project/logos.jsx.
+// The geometry is computed so the letterform sits ~16u inside the 100x100 viewBox.
+
+const props = withDefaults(
+  defineProps<{
+    size?: number
+    fg?: string
+    accent?: string
+    bowlR?: number
+    stemW?: number
+    contR?: number
+    dStyle?: 'donut' | 'solid' | 'outline'
+    dotPos?: 'corner' | 'tittle' | 'orbit' | 'none'
+    dotR?: number
+  }>(),
+  {
+    size: 22,
+    fg: '#0a0a0a',
+    accent: '#d4ff3a',
+    bowlR: 14,
+    stemW: 7,
+    contR: 22,
+    dStyle: 'donut',
+    dotPos: 'corner',
+    dotR: 4,
+  },
+)
+
+const geometry = computed(() => {
+  const overlap = props.stemW * 0.55
+  const cy = 52
+  const cx = 50 - props.stemW / 2 + overlap / 2
+  const stemX = cx + props.bowlR - overlap
+  const stemRight = stemX + props.stemW
+  const capR = props.stemW / 2
+  const stemTop = 26
+  const stemBottom = cy + props.bowlR
+  const holeR = Math.max(2.5, props.bowlR - props.stemW - 0.5)
+
+  const bowlPath =
+    `M ${cx - props.bowlR} ${cy} ` +
+    `a ${props.bowlR} ${props.bowlR} 0 1 0 ${props.bowlR * 2} 0 ` +
+    `a ${props.bowlR} ${props.bowlR} 0 1 0 ${-props.bowlR * 2} 0 Z`
+
+  const counterPath =
+    `M ${cx - holeR} ${cy} ` +
+    `a ${holeR} ${holeR} 0 1 0 ${holeR * 2} 0 ` +
+    `a ${holeR} ${holeR} 0 1 0 ${-holeR * 2} 0 Z`
+
+  const stemPath =
+    `M ${stemX} ${stemTop + capR} ` +
+    `a ${capR} ${capR} 0 0 1 ${props.stemW} 0 ` +
+    `L ${stemRight} ${stemBottom} ` +
+    `L ${stemX} ${stemBottom} Z`
+
+  const dotByPos = {
+    corner: { x: 74, y: 26 },
+    tittle: { x: stemX + props.stemW / 2, y: stemTop - props.dotR - 3 },
+    orbit: { x: cx - props.bowlR - props.dotR - 2, y: cy - props.bowlR - props.dotR - 2 },
+    none: null,
+  } as const
+
+  return { bowlPath, counterPath, stemPath, dot: dotByPos[props.dotPos] }
+})
+</script>
+
+<template>
+  <svg
+    :width="size"
+    :height="size"
+    viewBox="0 0 100 100"
+    aria-label="Dezky"
+    role="img"
+  >
+    <rect x="8" y="8" width="84" height="84" :rx="contR" :fill="fg" />
+    <g v-if="dStyle === 'donut'" fill="#0a0a0a">
+      <path :d="geometry.bowlPath + ' ' + geometry.counterPath" fill-rule="evenodd" />
+      <path :d="geometry.stemPath" />
+    </g>
+    <g v-else-if="dStyle === 'solid'" fill="#0a0a0a">
+      <path :d="geometry.bowlPath" />
+      <path :d="geometry.stemPath" />
+    </g>
+    <circle
+      v-if="geometry.dot"
+      :cx="geometry.dot.x"
+      :cy="geometry.dot.y"
+      :r="dotR"
+      :fill="accent"
+    />
+  </svg>
+</template>