chore(ms-ai-architect): re-sync vendored design system with light tokens

plugins/ms-ai-architect/playground/vendor/playground-design-system/MANIFEST.json

@@ -2,8 +2,8 @@
   "generated_by": "scripts/sync-design-system.mjs",
   "do_not_edit": true,
   "source": "shared/playground-design-system/",
-  "source_commit": "f1fecf39b8fc20e86f6ec3c737f0dfda8403712e",
-  "sync_date": "2026-05-03T10:24:01.408Z",
+  "source_commit": "46bce51f443a6cdabdb34314e4ae98e633f752d7",
+  "sync_date": "2026-05-04T01:02:40.211Z",
   "file_count": 25,
   "files": {
     "README.md": "83de0e29b207c979b7b2a3327b7a4ec0c2e1b4d3705ee2677f26c28c3a3ee643",
@@ -30,6 +30,6 @@
     "schemas/finding.schema.json": "0b24797373650582bac232d31a4dd9260593375a0d17259e18f1141a20de8d0c",
     "schemas/okr-set.schema.json": "aa27347fb232a956ec9dcee1775115710e2715a665c8d729ac50b90c6884de26",
     "schemas/ros-threat.schema.json": "e16497c1a6b79d6e78149d6cf1c28ac9df1e93234627a0c546814fb24d6c96d9",
-    "tokens.css": "7598d5eda83e189418125cd73b8646e1b0d15a1c195b6f180fafa7944b5ba328"
+    "tokens.css": "1499bc2eea0178e35935413c79a10bbee7d49fdfa91bd33eeba3bb9e9acab809"
   }
 }

plugins/ms-ai-architect/playground/vendor/playground-design-system/tokens.css

@@ -142,6 +142,8 @@
   --sidebar-width: 280px;
 }
 
+:root { color-scheme: light; }
+
 [data-theme="dark"] {
   --color-bg:             #0F1419;
   --color-bg-soft:        #161B22;
@@ -176,6 +178,50 @@
   --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.4), 0 4px 12px rgba(0, 0, 0, 0.3);
   --shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.5), 0 12px 32px rgba(0, 0, 0, 0.4);
   --shadow-focus: 0 0 0 3px rgba(111, 165, 221, 0.45);
+
+  color-scheme: dark;
+}
+
+/* Light theme overrides — Aksel-aligned, WCAG AA-validated.
+   Full mirror of the dark block (26 vars) so renderers reading any
+   theme-overridable token in dark mode also resolve in light mode.
+   See research/04-wcag-dual-theme-tokens.md for hex sources + AA validation. */
+[data-theme="light"] {
+  --color-bg:             #ffffff;
+  --color-bg-soft:        #ecedef;
+  --color-surface:        #ffffff;
+  --color-surface-raised: #f5f6f7;
+  --color-surface-sunken: #ecedef;
+
+  --color-border-subtle:   #cfd3d8;
+  --color-border-moderate: #6f7785;
+  --color-border-strong:   #5d6573;
+
+  --color-text-primary:    #202733;
+  --color-text-secondary:  #49515e;
+  --color-text-tertiary:   #6f7785;       /* borderline 4.5:1 — reserve for non-body (eyebrows, labels) */
+  --color-text-link:       #1a5f99;
+  --color-text-link-hover: #002459;
+
+  /* Severity soft fills + on-colors tuned for light surfaces (Aksel). */
+  --color-severity-low-soft:      #e2fde8;
+  --color-severity-medium-soft:   #fff5e4;
+  --color-severity-high-soft:     #fff2f0;
+  --color-severity-critical-soft: #fff2f7;
+  --color-severity-extreme-soft:  #fff0f3;
+
+  --color-severity-low-on:      #002e00;
+  --color-severity-medium-on:   #481700;
+  --color-severity-high-on:     #560000;
+  --color-severity-critical-on: #560000;
+  --color-severity-extreme-on:  #ffffff;
+
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04);
+  --shadow-md: 0 2px 4px rgba(0, 0, 0, 0.06), 0 4px 12px rgba(0, 0, 0, 0.05);
+  --shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.08), 0 12px 32px rgba(0, 0, 0, 0.06);
+  --shadow-focus: 0 0 0 3px rgba(26, 95, 153, 0.4);
+
+  color-scheme: light;
 }
 
 /* Auto dark when no override */

shared/playground-design-system/CHANGELOG.md

@@ -0,0 +1,32 @@
+# playground-design-system — CHANGELOG
+
+## 0.2.0 — 2026-05-04
+
+### Added
+- `[data-theme="light"]`-blokk i `tokens.css` (Aksel-aligned, WCAG AA-validert).
+  Full mirror av dark-blokken (26 vars) — alle theme-overridable tokens som
+  finnes i dark-blokken finnes nå også i light-blokken, slik at renderers ikke
+  faller gjennom til udefinerte verdier ved theme-switch.
+- `color-scheme` CSS-property satt eksplisitt på `:root`, `[data-theme="light"]`
+  og `[data-theme="dark"]` for korrekt native form-controls/scrollbar-styling.
+
+### Notes for vendor consumers
+
+Andre plugins som vendrer design-systemet
+(`okr`, `llm-security`, `ultraplan-local`, `config-audit`) får tilgang til
+light-tokens etter neste re-sync. Adopsjon er valgfri — eksisterende dark-only
+oppførsel er bakoverkompatibel siden ingen eksisterende verdi er endret.
+
+For å adoptere light-mode i en konsument:
+1. Re-sync via `node scripts/sync-design-system.mjs <plugin-name>`
+2. Legg til en synkron `<script>`-IIFE i `<head>` før CSS-load som leser
+   `localStorage` og setter `data-theme` + `colorScheme` på `documentElement`.
+3. Eksponere theme-toggle i UI som setter `documentElement.dataset.theme` +
+   persisterer i `localStorage`.
+
+## 0.1.0 — 2026-04 (initial)
+
+- Tier 1+2+3 design-system med Aksel/Digdir-aligned tokens, base, components.
+- Dark mode default + `[data-theme="dark"]`-overrides.
+- Self-hosted Inter, JetBrains Mono, Source Serif 4 fonts.
+- Schemas for renderers + commands.