?theme=dark&state=hover&density=compact`. | Each section and template opens directly, which makes screenshots scriptable. | ### Phase 1: tokens and ThemeData | # | Task | Acceptance criteria | |---|---|---| | 1.1 | Copy `talaria_tokens.dart` into `new_talaria_ui/lib/src/theme/`. Remove its duplicate class names from the v1 file, and keep v1 field names as `@Deprecated` getters (already provided for `bg`, `elevated`, `muted`, `onAccent`, `onDanger`). | `flutter analyze` is clean, apart from deprecation infos. | | 1.2 | Update `buildTheme(Brightness, ColorScheme? custom, TalariaColors tokens)`: `extensions: talariaExtensions(b, custom: custom, reduceMotion: …)`; `colorScheme: custom ?? talariaColorScheme(b)`; `scaffoldBackgroundColor: c.bgCanvas`; `textTheme` mapped from `TalariaTextStyles` (displaySmall=headline, titleLarge=heading, titleMedium=title, bodyMedium=body, labelLarge=label, bodySmall=caption, labelSmall=captionStrong). | Stock Material widgets (DatePicker, Dialog, Menu) match Talaria widgets in both themes. | | 1.3 | Component themes: Input (bgMuted fill, border 1px, hover borderStrong, focus focusRing, error dangerFg message + danger border), Card (bgSurface, e0, md, border), Dialog (bgRaised, e3, md), Menu/Popover (bgRaised, e2), Tooltip (bgInverse/fgInverse, xs, caption, `tooltipWait` 400ms), SnackBar (bgInverse, e4, sm), Divider (border), Scrollbar (scrollbar, r full), TextSelection (selection, cursor accent), NavigationBar indicator (accentSoft). Overlays use `overlayColor: TalariaStates.overlay(c)`, which is a ready-made `WidgetStateProperty`. | Matches the "Overlays" and "Inputs" sections. | | 1.4 | Replace every hex listed in §3.2. Replace SeverityTones and StatusTones values with v2, and register `EnvironmentTones` and `ChartPalette`. | The `rg` in §3.2 returns no hits in `lib/`. | | 1.5 | Type: map `AppTextVariant` per §3.3. Remove the badge `uppercase` flag. | No `toUpperCase()` in badge, label or tab code (`rg -n "toUpperCase" lib`). | | 1.6 | **Custom seed mapping.** `TalariaColors.fromColorScheme(cs)` (provided) starts from the v2 light or dark base and overrides only the neutrals and accent. Light: bgCanvas = surfaceContainerLow, bgSurface and bgRaised = surfaceContainerLowest. Dark: bgCanvas = surfaceContainerLowest, bgSurface = surfaceContainerLow, bgRaised = surfaceContainer. Both: bgMuted = surfaceContainerHigh, bgEmphasis = surfaceContainerHighest, border = outlineVariant, borderStrong = outline blended 55% over outlineVariant, fg = onSurface, fgMuted = onSurfaceVariant, fgSubtle = onSurfaceVariant lerped 18% toward surface, fgDisabled = onSurface @38%, accent and focusRing = primary, accentFg = primary (dark) or primary lerped 20% toward onPrimaryContainer (light), accentSoft = primaryContainer @60% / @35%, inverse = inverseSurface. **danger, warning, success, fatal, ai, code and all severity, status, environment and chart tones stay fixed**, so meaning doesn't drift with a seed. | The 0.7 contrast test passes for seeds `#0070F3`, `#E5484D` and `#2E7D32` at contrast 0 and 1. If `fgSubtle` fails for a seed, fall back to `fgMuted`. | | 1.7 | **Fonts.** Keep `google_fonts`, but pin `GoogleFonts.inter`/`jetBrainsMono` through `TalariaTextStyles.withGoogleFonts()`. Consider bundling the two font files (weights 400/500/600) as assets and setting `allowRuntimeFetching=false` in release, to remove the font swap flash and the dependency on fonts.gstatic.com. Use `fontFeatures: [FontFeature.tabularFigures()]` on metric and number styles. | No layout shift after first paint (Lighthouse CLS < 0.02 on /issues). | ### Phase 2: core widgets | # | Widget | Acceptance criteria | |---|---|---| | 2.1 | `AppButton`: primary, secondary, ghost, danger, **ai** × sm/md/lg; leading and trailing icon; split button; `loading` keeps width (spinner replaces the leading icon, label stays, `onPressed` ignored, `Semantics(liveRegion)` "Loading"). | State matrix (0.2) complete. Focus ring visible only for keyboard focus. Disabled uses `fgDisabled` on `bgMuted`. | | 2.2 | `AppIconButton`: 32 visual / 44 hit. A tooltip is **required** (assert). | Assert fires without a tooltip. | | 2.3 | `AppBadge(label, tone, size: sm/lg, quiet)`: glyph + Sentence-case text, captionStrong, 20px high (lg 24). Solid when `tone.solid`. Dashed border when `tone.dashed`. `SeverityBadge`, `StatusBadge`, `EnvironmentBadge` (mono), `HealthBadge`, `LivePill`. | The 4 sections in "Badges & chips" match. Semantics label "Severity: Fatal". | | 2.4 | Inputs: text, search (⌘K hint), select, multiselect, date range, number, textarea, with helper, error and counter states. | Error message uses dangerFg plus an icon, and is announced. | | 2.5 | Selection: checkbox, radio, switch, segmented (no overflow; disable options rather than hide), tabs with counts, filter chip. | Keyboard: arrows move within groups, Space toggles. | | 2.6 | `MetricTile(label, value, delta, polarity, comparison)` with a fixed height; use `deltaColor(c, change:, polarity:, baseline:)`. Show "—" when there's no baseline, and the absolute change when the baseline is below 20. | BUG-004: 0 sessions shows "—", not "0.0%" in red. | | 2.7 | `Skeleton` primitives (line, block, circle, row). Shimmer at `shimmerPeriod` (1.2s) from skeletonBase to skeletonHighlight, with no shimmer under reduced motion. Show skeletons only after `skeletonDelay` (150ms), and keep them for at least `skeletonMinShow` (300ms) so they don't flicker. | Each page skeleton matches its loaded layout box-for-box, so nothing fills in piecemeal. | | 2.8 | Charts: apply `ChartPalette`, gridlines from `grid`, max 6 ticks, de-duplicated dates, "View as table" toggle, empty state inside the chart frame. | Severity chart colours match the HTML guide. | | 2.9 | `BladeLoader` (AI only): 6 blades fade in sequence, 1.2s, static under reduced motion. | Only used in AI surfaces. | ### Phase 3: patterns | # | Pattern | Acceptance criteria | |---|---|---| | 3.1 | **App shell + labelled sidebar** (56/240, `[` toggles, state persisted). Groups and icon map: Use the `_outlined` variants. **Observe**: Overview `home`, Dashboards `space_dashboard`, Issues `bug_report`, Events `bolt`, Replays `play_circle_outline`, Whiteboards `draw`. **Analyse**: Performance `speed`, Analytics `bar_chart`, Releases `rocket_launch`, Runtime `memory`. **Configure**: Alerts `notifications_active`, Monitors `monitor_heart`, Flags `flag`, Settings `settings`. **Workspace**: Projects `folder`, Groups `folder_copy`, Team `group`, Billing `credit_card`, Integrations `power`, AI chat `auto_awesome`, Account `account_circle`. The plain bell is only the top-bar inbox. Tag is reserved for tags, and sparkle for AI. **No icon is used twice.** Collapsed mode shows tooltips with the name and shortcut. | Unique-icon test over the nav config. Tooltips present when collapsed. The full map, with what each destination used before, is in the guide's "Iconography" section (`?solo=icons`). | | 3.2 | **Top bar:** named breadcrumbs (`Org / Project / Section / Item`; never raw IDs; truncate the middle segments), global environment switcher, ⌘K search, notifications, avatar. | BUG-003 fixed on releases, alerts, monitors, whiteboards, runtime and dashboards. | | 3.3 | **One page header:** optional back link ("← Issues", restores the previous list URL including filters), title (headline), subtitle, meta badges, actions on the right (max 1 primary), optional tabs. The duplicate crumb and the close X are removed on detail pages. | One `AppPageHeader` widget used by every route (`rg "AppPageHeader" lib/features | wc -l` ≈ number of pages). | | 3.4 | **One filter bar:** search, then chips (Level, Status, Environment, Assignee, Tag, +Filter), date range, sort, and "Clear all". It reads and writes **query parameters** with `router.replace` (not push). Mobile uses ListFilterChrome with the same model. | BUG-009, BUG-011, BUG-012 and BUG-016 fixed: reload keeps filters, Back leaves the page in one step, search text survives reload, defaults aren't written to the URL. | | 3.5 | **Content widths:** wrap page bodies in `TalariaContentLayout(width: TalariaContentWidth.x)`. Settings = narrow, lists = standard, overview and detail = wide, tables, traces and replays = fluid. | No page stacks gutters (one gutter owned by scroll constraints). | | 3.6 | **Settings save bar and danger zone:** a sticky bottom bar appears when the form is dirty ("You have unsaved changes · Discard · Save changes"), with ⌘S, a route-leave guard, and inline validation. The danger zone is a red-bordered card at the end, with typed-name confirmation for delete. | Leaving with unsaved changes prompts. Delete requires typing the project slug. | | 3.7 | **Empty, error and 404:** icon/motif, a heading that says *why* (filter vs time range, BUG-015), and 1 primary + 1 secondary action (e.g. "Clear filters", "Widen to 30 days"). Error states show human copy, a code-styled detail toggle, Retry, and "Copy error". Invalid IDs (BUG-008) show "We couldn't find that issue" + "Back to issues". | No raw exception text by default. Retry is offered only when retrying can help (network or 5xx). | | 3.8 | **Focus trail:** after closing a drawer, dialog or detail page, focus returns to the invoking row, and the row shows a 2px accent left trail for 2s ("you were here"). Keyboard `j/k` moves between rows, `Enter` opens, `Esc` closes. | Integration test: open issue, Esc, and focus is back on the same row. | | 3.9 | **Drawers:** right side, 480 default / 720 wide, e3, scrim, Esc closes, focus trapped, URL reflects `?panel=…`. The AI drawer goes fullscreen below 720. | Deep link opens the drawer. Browser Back closes it. | | 3.10 | **Density:** a `TalariaDensity` provider (compact, standard, comfortable), set per surface, with a user preference only for tables. | Row heights per §2.5. | ### Phase 4: page fixes | # | Fix | Acceptance criteria | |---|---|---| | 4.1 | **Triage-first Issues list:** the list starts above the fold. Insights fold into a single strip (New · Regressed · Unassigned · Escalating, each a filter link). Default sort is Last seen, with bulk actions. | At 1440×900 at least 8 rows are visible without scrolling. | | 4.2 | **Environment defaulting:** the global env switcher defaults to **All environments** (or the last value remembered per project). Project cards link with the same env used for their counts. Unknown `env` values show a warning chip "Unknown environment 'x'" with a reset action. | BUG-001 and BUG-010: a card's count matches the destination page's count. | | 4.3 | **Named breadcrumbs** everywhere (see 3.2). | No 8-hex IDs in crumbs. | | 4.4 | **Filters in the URL** on Issues, Events, Performance, Replays and Releases (see 3.4). | Copying the URL into a new tab reproduces the view. | | 4.5 | **Honest metrics:** polarity-based deltas, "—" for N/A, no "0.0% crash-free" with 0 sessions (BUG-004), and insight counts that respect the active filters and range (BUG-012, BUG-014). | Unit tests for `deltaColor` and the N/A rules. | | 4.6 | **404 inside the shell:** unknown routes and unknown sub-pages (BUG-005, BUG-007) render the shell, "Page not found", the path in mono, "Go to overview" + "Search Talaria". | `/nonsense` and `/projects/{id}/doesnotexist` keep the sidebar. | | 4.7 | **index.html background respects the saved theme.** Add an inline script in `` that, before Flutter boots, reads the saved appearance from `localStorage` and sets `document.documentElement.style.background` and ``. shared_preferences on web uses keys prefixed `flutter.`. Find the real key, e.g. `rg -n "appearance|themeMode|TalariaAppearanceKind" lib` and then `flutter.`. Values: light `#FAFAFA`, dark `#0A0A0A`, system → `matchMedia`, custom → the persisted seed's surface (store a precomputed `bg` hex alongside the seed JSON to keep this trivial). | Hard reload with a saved Dark theme on an OS in Light mode shows no white flash (record at 60fps). | Sketch for 4.7: ```html ``` --- ### Phase 5: responsive (v2.1) **5.1 Size class plumbing.** - Add `TalariaBreakpoints.standard` to `talariaExtensions()` (done in the generated file). - Use `context.sizeClass` / `context.tLayout` for **window-level** decisions: the shell, navigation, overlays and dialogs. It reads `MediaQuery.sizeOf(context)`, which only rebuilds on size changes, so never use `MediaQuery.of`. - Use `TalariaAdaptiveBuilder` (a `LayoutBuilder`) for **pane-level** decisions such as tables in a split view, the issue rail or cards inside a drawer, because the pane can be compact while the window is expanded. - Never branch on `Platform.isIOS` for layout. Use `context.isTouchPlatform` only for sizing and hover rules. **5.2 Adaptive shell** (`TalariaAdaptiveShell`). - Expanded and large: the existing sidebar (240 / 56; `[` toggles) plus the 48 top bar. - Medium: `NavigationRail(labelType: NavigationRailLabelType.all, minWidth: 72)` with the project avatar at the top and More plus Settings pinned at the bottom. The top bar is 56 and drops the org crumb. - Compact: `NavigationBar` (height 64 + bottom inset) with 4 destinations plus More, which opens a modal `Drawer` holding every group. The `AppBar` is 56 with back (or the project avatar), the title with the project as subtitle, the env chip and search. - Keep the selected index in the router (go_router `StatefulShellRoute`) so switching class keeps state. - Preserve scroll position per destination. **5.3 Overlays.** - `showTalariaPicker` gives a modal bottom sheet (drag handle, `showDragHandle: true`, `useSafeArea: true`, max width 640) below 900, and a menu or dialog above. - `showTalariaFormDialog` gives `Dialog.fullscreen` on compact. - Confirms are bottom sheets on compact with the primary button on top. - The AI and event drawers are full screen below 720. - Toasts: a `SnackBar` with `behavior: floating` and a margin that clears the `NavigationBar`. **5.4 Table → list.** One `IssueRow` widget, three layouts chosen by `TalariaAdaptiveBuilder`: - full grid; - no sparkline; - a 2-line card with the counts kept and labelled ("412 events"). Selection checkboxes move to long-press plus a contextual action bar on touch. Swipe actions (resolve or ignore) are optional, and the overflow menu remains. **5.5 Filters and pagination.** - Below 900 the chip row becomes a `Filters (n)` button opening a sheet that edits the same URL-backed filter state, with "Show 41 issues" applying it. - Status segments scroll horizontally on compact. - Below 900, swap the pager for `Load 25 more` with cursor pagination. Keep `page=` in the URL on desktop only. **5.6 Safe areas and touch.** - `SafeArea` around the compact app bar and bottom bar. - `MediaQuery.paddingOf(context).bottom` for sheets, the floating save bar and the AI composer. - Set `materialTapTargetSize: MaterialTapTargetSize.padded` and `visualDensity: VisualDensity.standard` when `isTouchPlatform`, and use `TalariaLayout.controlHeight(size, touch:)` for custom controls. - Input text is 16 on touch. - Gate hover-only affordances behind a `MouseRegion` check, and give every icon button a tooltip with a long-press equivalent. **5.7 Charts on compact.** - Use the tick counts from `TalariaLayout` (`chartXTicks` and `chartYTicks`). - Wrap the plot in a horizontal `SingleChildScrollView(reverse: true)` with a minimum width of 560, so the newest day is pinned right. Keep the y-axis fixed outside the scroller. - Tap shows the tooltip; there is no hover. **5.8 Testing.** - Golden tests per size class at **390×844, 820×1180, 1280×800 and 1440×900**, for every page template and the key components (filter bar, issue list, page header with tabs, detail rail, chart, plans, confirm, toast, AI drawer), in light and dark. - Use `tester.view.physicalSize` and `devicePixelRatio = 1`, plus a 3x phone variant to catch hairlines. - Add widget tests asserting: - no `RenderFlex` overflow at each size; - every tappable element is ≥ 48×48 on touch (`meetsGuideline(androidTapTargetGuideline)`, `iOSTapTargetGuideline`); - text contrast passes (`textContrastGuideline`). - Run the web build at 200% zoom at 1280. It must behave like the medium layout, not overflow. **Acceptance.** - Every page matches the guide's 390, 820 and 1280 frames. - There is no horizontal scroll at any width from 320 to 2560, apart from the intentional scrollers: tabs, status segments, chart and code. - The bottom bar never covers content (the scroll view gets the bottom padding). - Rotating a tablet keeps state. --- ## 5. Flutter notes - **ThemeExtension wiring.** `ThemeData(extensions: talariaExtensions(brightness, custom: customScheme, reduceMotion: …))`. Read with `context.tColors`, `context.tText`, `context.tSpace`, `context.tRadii`, `context.tSeverity`, `context.tStatus`, `context.tEnv`, `context.tChart`, `context.tElevation`, `context.tMotion`. Alias these to the existing helpers (v1 compiled as `A.a0/A.ag/A.bn/A.cg/A.wL/A.d1h`), or keep the old names as thin wrappers. All extensions implement `lerp`, so `AnimatedTheme` crossfades work, and tones now interpolate too. - **Custom seed.** `ColorScheme.fromSeed(seedColor, brightness, dynamicSchemeVariant, contrastLevel)`, then `TalariaColors.fromColorScheme`. Keep semantic tones fixed. Persist `{seed, brightness, variant, contrast, bg}` so index.html can paint the right background (4.7). - **google_fonts.** `TalariaTextStyles.light/dark` are const, with `fontFamily: 'Inter'` / `'JetBrains Mono'`. `withGoogleFonts()` swaps in `GoogleFonts.inter(...)` at runtime. In tests, bundle fonts and disable runtime fetching. - **State layers.** Use `overlayColor: TalariaStates.overlay(colors)` (a `WidgetStateProperty` covering hover, pressed, dragged and selected), and `boxShadow: TalariaStates.focusRing(colors)` for the 2px ring with a 2px gap. Disabled opacity is `TalariaStates.disabledOpacity` (0.48), for icons only; text uses `fgDisabled`. Draw the focus ring only when `FocusManager.instance.highlightMode == FocusHighlightMode.traditional`. - **Semantics.** Badges: `Semantics(label: '${kind}: $label', excludeSemantics: true)`. Icon buttons: tooltip = label. Charts: `Semantics(label: summary)` plus a table toggle. Live regions for toasts, loading and the save bar. `ensureSemantics()` per 0.8. - **Reduced motion.** `context.tMotion` already returns `TalariaMotion.reduced` when `MediaQuery.disableAnimationsOf(context)` is true. - **Responsive helpers (v2.1).** - `context.sizeClass` returns a `TalariaSizeClass` (`isCompact`, `isMedium`, `isDesktop`, `atLeast(c)`, `below(c)`). - `context.tLayout` returns a `TalariaLayout` with columns, margin, nav kind and widths, density, `touchFirst`, table, detail-rail and overlay modes, and tick counts. `TalariaLayout.columnWidth(width)` and `controlHeight(size)` are on it too. - `context.responsive(compact: …, medium: …, expanded: …, large: …)` falls back to the next smaller value. - `context.tTextAdaptive` applies the adaptive type scale. - Prefer `TalariaAdaptiveBuilder` inside panes. - The generated `TalariaAdaptiveShell`, `showTalariaPicker` and `showTalariaFormDialog` are reference implementations. Adapt them to the real router and sidebar widget rather than shipping them unchanged. - **Deltas.** `deltaColor(colors, change: d, polarity: p, baseline: b)` returns `deltaGood`, `deltaBad` or `deltaNeutral` (`successFg` / `dangerFg` / `fgMuted`). `MetricPolarity { higherIsBetter, lowerIsBetter, neutral }`. When `baseline < minBaseline` (20), the caller renders the absolute change ("↑ 5 from 3") instead of a percentage. --- ## 6. Testing checklist - [ ] `flutter analyze` is clean. `dart format` has been applied. - [ ] The `rg` in §3.2 returns 0 hits in `lib/`. There is no `toUpperCase()` in badge, label or tab code. - [ ] Contrast test (0.7) passes for light, dark and 3 custom seeds. - [ ] Goldens (0.5) pass for every style-guide section and page template, light and dark, desktop and mobile. - [ ] State matrix: every interactive widget has hover, pressed, focus, selected, disabled and loading (where relevant) and an error state. - [ ] Keyboard only: Tab order, visible focus ring, Esc closes overlays, focus returns to the invoker (focus trail). - [ ] Screen reader (VoiceOver + Chrome): nav items, icon buttons, badges and charts are all named. - [ ] Reduced motion: no shimmer, no slide animations, and the blade loader is static. - [ ] 200% browser zoom: no clipped text. The segmented control and filter bar wrap rather than overflow. - [ ] Theme: no white flash on reload with Dark saved (4.7). The System theme follows OS changes live. - [ ] Environment: All by default, the count on a project card matches the destination, and an unknown env shows a warning. - [ ] URL: filters round-trip, Back leaves the page in one step, and drawers are deep-linkable. - [ ] 404 and invalid IDs render inside the shell with actions. - [ ] Metrics: "—" for N/A, polarity-correct colours. - [ ] All copy is NZ English and Sentence case. - [ ] All fixtures use fictional data. - [ ] Responsive goldens at 390 / 820 / 1280 / 1440, light and dark, for every page template and the components listed in 5.8. - [ ] No `RenderFlex` overflow and no unintended horizontal scroll from 320 to 2560 wide; tap targets ≥ 48 (44 iOS) on touch. - [ ] Rail on tablet, bottom bar + More on phone, sheets for env/project/filters, full-screen forms on compact, safe-area insets respected (notch, home indicator, landscape). --- ## 7. Things that would make the designer's job easier 1. **Live token tables** in the style guide, reading from the ThemeExtensions with hex and contrast values, copyable. These are the source of truth during review. 2. **State matrices** for every interactive widget, with forced states, so hover, pressed, focus and disabled can be reviewed without a mouse. 3. **Theme toggles everywhere:** a global switcher in the style guide, plus per-section light/dark side by side, plus a custom seed picker with contrast slider. 4. **Screenshot and golden export:** a script (`tool/export_previews.dart` or the provided `source/shot.js`) that writes PNGs per section and theme to a known folder, and CI artefacts with golden diffs attached to PRs. 5. **Isolated widget routes:** `/_dev/style-guide/

`, with fixture data and no backend, so a single widget can be opened, recorded or compared. 6. **Deep links for everything:** theme, density, state, drawer, tab and filter all in the URL, so a design review comment can be a link. 7. A **page-template gallery** with empty, error, loading and 404 variants, so new pages start from a pattern, not a blank screen. 8. A per-route **document title**, so browser tabs and screen recordings are identifiable. 9. **Fictional fixture data** checked in, safe for screenshots and marketing. 10. **Breakpoint preview for any widget (v2.1).** In `/_dev/style-guide`, a toolbar with Mobile 390 / Tablet 820 / Desktop 1280 / Wide 1440 that renders the selected widget or page inside a `MediaQuery` override (size, padding for safe areas, `platform` for touch) and a device frame, with a "show all four" mode side by side. Deep link with `?vp=390` the way the HTML guide does. 11. **Device-frame screenshot export** per size class and theme from that tool (or CI goldens), so responsive reviews are a folder of PNGs rather than a resize-the-browser session. 12. A **size-class overlay** toggle that draws the 4/8/12 column grid and margins over any route, plus a readout of the current size class and insets. --- ## 8. Where to look in the HTML guide Section ids (open with `talaria-design-system-v2.html?solo=`, or `?split=` for side by side): `overview`, `v21` (what's new), `principles`, `changes` (old vs new), `colour`, `type`, `foundations` (spacing, radii, density, widths, elevation, motion), `icons`, `responsive` (breakpoints, layout table, grid, adaptive type, touch, components at each breakpoint), `rsheet` (one page at four sizes), `buttons`, `inputs`, `selection`, `badges`, `cards`, `rows`, `filters`, `header`, `nav`, `feedback` (alerts, toasts, empty, error, 404), `states` (loading, skeletons, focus trail), `data`, `billing`, `ai`, `overlays` (menus, dialogs, drawers, tooltips), `page-issues`, `page-issue`, `page-overview`, `page-settings`, `page-mobile` (all pages on phone and tablet plus phone flows: events, AI drawer, More drawer, filters/env/project/confirm sheets, full-screen dialog, toast), `a11y`. Page sections have a viewport switcher; `?solo=page-issue&vp=phone` opens Issue detail in the phone frame. Regenerate everything: `cd source && python3 build_tokens.py && python3 build_dart.py && python3 build_html.py`. The scripts write to fixed `/workspace/talaria/deliverables/` paths; adjust these when moving to the repo. Previews: `bash previews.sh`, which needs puppeteer-core and Chrome. Dart check: `DART=/path/to/dart bash source/dart_stubs/check.sh`.