refactor(styles): move timetable tokens from .scss to .css for test-time loadability

Per Phase A finding A2 — `_timetable.scss` was functionally pure CSS:
only :root custom properties + @keyframes + one .tt-cascade-pulse class.
The only SCSS-specific syntax was `// line comments`. Zero $vars, @use,
@mixin, @function, nesting, or color functions.

Why move to .css: Vitest+jsdom can `import '@/styles/tokens/_timetable.css'`
directly so getComputedStyle() resolves var(--tt-…) in component tests
(needed for the upcoming PerformanceBlock visual-state assertions). SCSS
imports require Vite's SCSS plugin, which the vitest.config.ts intentionally
skips for unit-test speed.

Changes:
- `_timetable.scss` → `_timetable.css` (line comments converted to /* */
  block comments; everything else byte-identical)
- `assets/styles/styles.scss`: switch from `@use "@/styles/tokens/timetable"`
  to `@import "@/styles/tokens/_timetable.css"`
- Production `npm run build` passes (16s, no asset warnings)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

apps/app/src/assets/styles/styles.scss

@@ -1,4 +1,5 @@
 // Write your overrides
 
 // RFC-TIMETABLE v0.2 D21 — status palette + geometry custom properties.
-@use "@/styles/tokens/timetable";
+// Plain CSS so jsdom/vitest can also load it via `import '@/styles/tokens/_timetable.css'`.
+@import "@/styles/tokens/_timetable.css";

apps/app/src/styles/tokens/_timetable.css

@@ -1,17 +1,22 @@
-// RFC-TIMETABLE v0.2 D21 — status colour tokens for the timetable canvas.
-//
-// Per-status colour pairs (background + border + foreground + dot) live as
-// CSS custom properties so PerformanceBlock + WachtrijCard + popovers all
-// resolve through `var(--tt-status-{status}-*)`.
-//
-// ART-14 (deferred) will let an organisation override the palette by
-// scoping these custom properties on a `[data-org-id="…"]` selector.
-//
-// Geometry tokens (lane height, time-axis spacing, block padding) live
-// next to the colours so any rendering tweak is one stop.
+/* RFC-TIMETABLE v0.2 D21 — status colour tokens for the timetable canvas.
+ *
+ * Per-status colour pairs (background + border + foreground + dot) live as
+ * CSS custom properties so PerformanceBlock + WachtrijCard + popovers all
+ * resolve through `var(--tt-status-{status}-*)`.
+ *
+ * ART-14 (deferred) will let an organisation override the palette by
+ * scoping these custom properties on a `[data-org-id="…"]` selector.
+ *
+ * Geometry tokens (lane height, time-axis spacing, block padding) live
+ * next to the colours so any rendering tweak is one stop.
+ *
+ * NOTE: this file is plain CSS (not SCSS) so that vitest+jsdom can load
+ * it via `import '@/styles/tokens/_timetable.css'` from mountWithVuexy
+ * — getComputedStyle() then resolves var(--tt-…) in component tests.
+ */
 
 :root {
-  // ─── Status palettes (8 visible + cancelled overlay) ─────────────
+  /* ─── Status palettes (8 visible + cancelled overlay) ───────────── */
 
   --tt-status-draft-bg:        #f1efe9;
   --tt-status-draft-border:    #dcd9d1;
@@ -58,7 +63,7 @@
   --tt-status-declined-fg:     #6b3915;
   --tt-status-declined-dot:    #b56331;
 
-  // ─── Cancelled hatch overlay ─────────────────────────────────────
+  /* ─── Cancelled hatch overlay ───────────────────────────────────── */
 
   --tt-cancelled-hatch: repeating-linear-gradient(
     135deg,
@@ -68,7 +73,7 @@
     rgba(0, 0, 0, 0.05) 8px
   );
 
-  // ─── Warnings + B2B ──────────────────────────────────────────────
+  /* ─── Warnings + B2B ────────────────────────────────────────────── */
 
   --tt-conflict-border: #d63d4b;
   --tt-conflict-glow:   rgba(214, 61, 75, 0.25);
@@ -82,7 +87,7 @@
   --tt-trashed-overlay: rgba(0, 0, 0, 0.35);
   --tt-trashed-icon:    #75706a;
 
-  // ─── Geometry ────────────────────────────────────────────────────
+  /* ─── Geometry ──────────────────────────────────────────────────── */
 
   --tt-lane-height:        44px;
   --tt-lane-gap:           4px;
@@ -102,21 +107,21 @@
   --tt-canvas-grid-major:  rgba(0, 0, 0, 0.06);
   --tt-canvas-grid-minor:  rgba(0, 0, 0, 0.025);
 
-  // ─── Drop / drag visuals ─────────────────────────────────────────
+  /* ─── Drop / drag visuals ───────────────────────────────────────── */
 
   --tt-ghost-bg:    rgba(255, 215, 90, 0.18);
   --tt-ghost-border:#f0c45a;
 
   --tt-focus-ring:  #1f7ad1;
 
-  // ─── Day-tab chrome ──────────────────────────────────────────────
+  /* ─── Day-tab chrome ────────────────────────────────────────────── */
 
   --tt-tab-active-bg:      #1f7ad1;
   --tt-tab-active-fg:      #ffffff;
   --tt-tab-hover-bg:       #eef2f7;
 }
 
-// ─── Animations ─────────────────────────────────────────────────────
+/* ─── Animations ─────────────────────────────────────────────────────── */
 
 @keyframes tt-cascade-pulse {
   0% {