@nurix/etna 0.18.20 → 0.18.21

package/data/harnesses/code/skills/design/data/combinations/Readme.md

@@ -0,0 +1,29 @@
+# Combinations — the consumption contract
+
+Seven curated pick tables — typography pairings, palettes, movement styles, product-router priors, chart choices, icon picks, landing patterns — that ground the skill's picks in vetted combinations instead of free association. Rows carry a tier: **operator-active** rows are consumable; **dormant-marketing** rows are ignored by operator work — no operator run reads them; they await a future marketing pack. Presence on disk is not consumption: every dataset declares its consumer steps below, and the routing path loads the table into context mechanically at each declared step — consulting is not skippable, exactly like the boot prose.
+
+## The contract
+
+| Dataset | create | improve | introspect |
+| --- | --- | --- | --- |
+| `typography.csv` | intake — only when the look resolves to authoring a fresh artifact (not a library copy / default); tokens — loaded before any typography hint is resolved | — (emission is jailed to the lever manifest) | — |
+| `palettes.csv` | intake — fresh-artifact authoring only; tokens — loaded before any color hint is resolved | — | — |
+| `styles.csv` | intake — fresh-artifact authoring only (movement vocabulary for the look) | — | — |
+| `product-router.csv` | intake — always: the front gate's recognition assist and the digest's density/archetype priors | — | — |
+| `charts.csv` | surfaces — loaded at the emission gate of any surface that composes a chart | fix step — when a finding names a chart | diagnosis — when the audited UI renders charts |
+| `icons.csv` | surfaces — loaded once at the first surface-composition gate (icon picks happen throughout) | fix step — when a finding names an icon | — |
+| `landing.csv` | — dormant; no load point anywhere (activation = a future marketing pack) | — | — |
+
+## The deviation rule
+
+A consulted table is a **floor** — going off-table is allowed only against a stated reason recorded into what the run produces:
+
+- **look values** (a pairing, a palette) — the token's `$description`;
+- **surface picks** (a chart type, an icon) — a code comment adjacent to the deviating pick;
+- **improve / introspect** — the finding body.
+
+An unrecorded off-table pick is a violation, the same class as skipping a gate.
+
+## Provenance
+
+Per-dataset provenance lives in [manifest.json](manifest.json); refresh is trigger-based, never calendar-based.

package/data/harnesses/code/skills/design/data/combinations/charts.csv

@@ -0,0 +1,33 @@
+id,data_shape,tier,keywords,best_chart,alternatives,when,when_not,volume_guidance,series_tokens,a11y_notes,fallback,interaction
+1,trend over time,operator-active,"trend, time series, over time, growth, traffic, history, rate",line,"area, sparkline","A continuous time axis where the question is direction or rate of change. Two to five series compare cleanly when each line is labeled at its endpoint.","Fewer than 4 points on the axis (state the number in a stat card) or more than 5 concurrent series, which turns to spaghetti - facet or aggregate instead.","Up to ~300 rendered points per series reads cleanly; past that downsample to display resolution or aggregate to coarser intervals; past ~10k raw points aggregate server-side before charting.","Single series: --chart-1. Comparisons assign --chart-1..--chart-5 in series order; past 5 series aggregate the remainder or facet - never invent a hue beyond --chart-5.","Differentiate concurrent lines by dash pattern and direct end-of-line labels, not hue alone; enable the substrate's accessibilityLayer for keyboard and screen-reader traversal.","Toggleable data table of timestamp/value pairs plus CSV export.","Hover tooltip synced across series; brush to zoom a time window; a preset range picker (1h/24h/7d/30d) beats freeform zoom for operators."
+2,trend at a glance (inline),operator-active,"sparkline, inline trend, table cell, compact, glance, row-level",sparkline,"sparkline area, mini bar","A trend needs to ride inside a table row, stat card, or list item where the shape matters but axes would be noise. Ideal for scanning many entities at once.","When the reader must read values off the chart - a sparkline has no scale. Not for comparing magnitudes across rows unless every sparkline shares one y-domain.","20-50 points per sparkline; resample anything longer. Dozens per screen are fine since each renders as a single path.","One series per sparkline, always --chart-1 (or the row's established status token from --chart-1..--chart-5); never multi-hue inside a sparkline.","Pair every sparkline with the current value and a signed delta as text; the sparkline is decoration, the text is the record.","Current value plus signed delta as plain text; full-size chart on click.","No hover affordances inline; click or expand opens the full line chart with axes."
+3,single KPI snapshot,operator-active,"kpi, big number, stat card, metric, headline, snapshot, count",stat card,"stat card with sparkline, stat card with delta","One number answers the question: current error rate, open tickets, requests per second. The most legible chart is no chart - fewer than 4 historical points always lands here.","When the trend or distribution behind the number is the actual question, or when a wall of stat cards (more than ~6 in a row) hides the one that matters.","One value per card, optionally a 20-50 point sparkline behind it; cap a dashboard header at 4-6 cards.","An embedded sparkline uses --chart-1; the number itself is foreground text, not a chart token.","The value is real text at a large size with unit and comparison period spelled out; deltas carry a +/- sign and a direction word, not color alone.","It already is the fallback: text. Add the comparison value ('vs 4.1% last week') inline.","Click drills into the full chart or filtered table behind the metric; no hover state needed."
+4,KPI vs target,operator-active,"target, threshold, goal, slo, quota, attainment, benchmark",bar with reference line (bullet style),"stat card with target delta, radial progress","A measure has a defined target or limit and the question is distance to it - SLO attainment, quota consumption. A horizontal bar with the target as a reference line stacks well for 3-10 KPIs in a grid.","No real target exists (a decorative gauge invents one), or a single KPI where a stat card with 'x of y' text is simpler.","One measure per bar; grids of 3-10 bullet-style bars compare well; past 10 move to a sortable table with inline bars.","Measure bar: --chart-1; the target marker uses neutral border/foreground tokens, not a second chart hue; a breach state may switch the bar to --chart-5 if that slot is the dashboard's alert hue.","Always print the value and percent-of-target as text beside the bar; the reference marker gets a text label, never position alone.","Table of metric / current / target / attainment percent.","Hover reveals exact values; click filters the dashboard to that KPI's detail view."
+5,part-to-whole snapshot,operator-active,"share, proportion, percentage, composition, breakdown, split",stacked bar (100%),"donut, bar","Composition of one total at one moment - traffic by source, storage by tenant. A single 100% stacked bar reads precisely and labels every segment. A donut is defensible only with 4 or fewer segments, values near quarter marks, and a center KPI worth the space.","Segments differ by less than ~5 points (readers cannot rank them - use a sorted bar of raw values) or more than 6 segments (aggregate the tail into Other).","3-6 segments; collapse everything past the top 5 into an Other segment; more than 6 shares belongs in a sorted bar or table.","Segments take --chart-1..--chart-5 in descending-size order; the Other bucket reuses the last assigned token at reduced emphasis - the surface never exceeds five hues.","Label each segment directly with name and percent; adjacent segments must also differ by a separator border, not hue alone; donuts additionally repeat all values in a legend list.","List of segment / value / percent rows summing to the labeled total.","Hover isolates a segment and shows value plus percent; click cross-filters the rest of the dashboard to that segment."
+6,composition over time,operator-active,"stacked area, share over time, composition trend, mix shift, by component",stacked area,"100% stacked area, small-multiple lines","How a total and its parts move together across time - request volume by service, cost by team. Use the 100% variant when the mix, not the total, is the story.","When individual component trends are the question - middle layers of a stack are unreadable for that; switch to small-multiple lines. Also wrong for series that cross zero.","3-5 layers maximum, largest or steadiest layer at the bottom; more components means grouping into Other or faceting.","Layers map --chart-1..--chart-5 bottom-up in stack order; over 5 components aggregate into the existing tokens rather than adding hues.","Direct-label layers at the right edge where each band is widest; order the legend to match stack order - hue plus adjacency is not enough.","Pivot table of period x component with row totals.","Hover shows the full component breakdown at that timestamp; toggle between absolute and 100% modes; legend click isolates a layer."
+7,category comparison,operator-active,"compare, categories, magnitude, count by type, by service, by queue",bar,"horizontal bar, lollipop-style bar","Discrete categories compared by size with no time axis - errors by service, jobs by queue. Vertical bars suit up to ~8 short labels; go horizontal when labels are long.","A time dimension exists (line) or the point is share of a total (100% stacked bar). Never truncate the value axis - bars encode length from zero.","Up to ~12 vertical or ~20 horizontal bars; beyond that filter to top N with an Other bar, paginate, or drop to a sortable table.","Uniform bars in --chart-1 with one highlighted bar allowed in --chart-2; per-bar rainbow coloring wastes the surface unless bars map to an established category coloring within --chart-1..--chart-5.","Value labels on or beside each bar by default; sorting by value is itself an accessibility feature - it removes the visual estimation step.","The same data as a sorted two-column table with CSV export.","Hover for exact value; toggle sort (value vs alphabetical); click a bar to drill into that category."
+8,ranking,operator-active,"ranking, top n, leaderboard, worst, slowest, sorted, offenders",horizontal bar (sorted),"lollipop-style bar, slope (rank change)","Order is the insight - top 10 noisiest endpoints, slowest queries. Sort descending and keep ranks visible as row numbers.","When every entity matters equally (that is comparison, not ranking) or the list exceeds ~20 - operators want the head of the distribution, not all of it.","Show top 10-20 and fold the remainder into a labeled 'Other (n)' entry or a view-all table link.","All bars --chart-1; the focal entity under investigation may take --chart-2; do not encode rank position as a hue ramp across --chart-1..--chart-5.","Rank number and value as text on every row; announce the sort direction; direct labels beat a shared axis at this density.","Numbered table with rank, name, value, and change-in-rank columns.","Sort toggle (value / delta); search-to-highlight an entity; click drills into the entity's detail."
+9,grouped comparison,operator-active,"grouped bar, side by side, versus, before after, a/b, per category pairs",grouped bar,"slope, small-multiple bars","Two or three series compared within each category - this week vs last week per service. The within-category gap must be the question.","More than 3 series per group turns into a picket fence - facet or use small multiples. If the across-category trend matters more than the within-group gap, use lines or a slope chart.","Up to ~8 categories x 2-3 series; beyond that, small multiples (one panel per series) scale further than wider groups.","Series take --chart-1..--chart-3 consistently across every group; keep the same series-to-token mapping on every panel of the dashboard.","A legend is mandatory and must match within-group ordering; add per-bar value labels when groups are few; two series close in luminance need a texture or border difference.","Category x series pivot table with a difference column.","Hover shows all series for that category together; legend click toggles a series; sort by any series."
+10,distribution (single variable),operator-active,"distribution, histogram, spread, frequency, buckets, shape, skew",histogram (bar),"cumulative curve (line), strip plot (scatter)","The shape of one variable matters - normal, bimodal, or skewed? Pre-bucket the values and render counts as near-touching bars; 15-40 buckets usually reveal the shape.","Under ~30 observations (show the points or a table - shape is noise at that size) or when the comparison is across groups (box plots or overlaid cumulative curves).","Bucket server-side past ~5k raw values; the chart should receive bucket counts, never raw observations.","Single distribution: --chart-1; overlaying a second period or cohort takes --chart-2 at reduced fill opacity; more than 2 overlays means small multiples.","State the summary stats (median, p95, count) as text above the chart; the histogram illustrates, the numbers testify.","Bucket table (range, count, percent) plus the summary-statistics line.","Hover per bucket for range and count; brush to select a range and filter the dashboard to those entities."
+11,distribution across groups,operator-active,"box plot, compare distributions, spread by group, quartiles, variance by cohort",box plot (bar + error-bar composition),"small-multiple histograms, overlaid cumulative curves","Comparing spread and central tendency across 3-10 groups - latency per region, job duration per queue. Boxes summarize median, quartiles, and outliers in one row per group.","Audience unfamiliar with quartile notation (small-multiple histograms are self-evident) or under ~20 observations per group where quartiles are unstable.","3-10 groups per panel; compute the five-number summary server-side - the chart draws summaries, not raw points.","All boxes in --chart-1 unless groups carry an established categorical mapping across the dashboard; a single comparison baseline group may take --chart-2.","Annotate median values as text per box; explain the box encoding once in a caption; outlier dots need a marker shape distinct from data points elsewhere.","Table of group / min / p25 / median / p75 / p95 / max.","Hover a box for the five-number summary; click a group to open its full histogram."
+12,correlation,operator-active,"correlation, scatter, relationship, x vs y, drivers, cluster, outliers",scatter,"bubble scatter, binned heatmap","Two continuous variables and the question is whether they move together - payload size vs latency, retries vs errors. Clusters and outliers are the payoff.","Either variable is categorical (grouped bar) or under ~20 points, where a pattern claim is not supportable.","Up to ~2k points at 0.5-0.7 fill opacity; beyond that bin into a density grid server-side rather than drawing every point.","One population: --chart-1. Cohorts split across --chart-1..--chart-5 with distinct marker shapes doubling the hue; more than 5 cohorts must be re-grouped.","Pair hue with marker shape per cohort; annotate named outliers directly; report the relationship's direction in the caption as text.","Sortable table of the plotted pairs with flagged outliers on top.","Hover identifies the entity behind a point; brush selects a cluster to filter the dashboard; zoom for dense regions."
+13,three-variable magnitude,operator-active,"bubble, size encoding, third variable, impact vs volume, weight",scatter with sized points (bubble),"scatter (drop the third variable), faceted scatter","A scatter relationship where a third magnitude (volume, spend) deserves emphasis - area-scale the points and the big movers surface.","The third variable is the primary question (readers cannot rank areas - use a sorted bar) or point counts past a few hundred where overlap hides the sizes.","Under ~200 bubbles; scale radius by the square root of the value so area, not radius, carries it.","Same rules as scatter: --chart-1 for one population, --chart-1..--chart-5 for cohorts; size is the third encoding, never a sixth hue.","Size differences below ~2x are invisible - print the sized value in the tooltip and label the largest bubbles directly.","Table sorted by the size variable with both axis values as columns.","Hover for all three values; a size legend with 2-3 reference bubbles; click to drill into the entity."
+14,deviation from reference,operator-active,"deviation, above below, delta, variance from plan, plus minus, baseline",diverging bar,"line against a zero baseline, sign-split area","Values carry sign relative to a reference - capacity delta per node, budget variance per team. Bars growing left/right of a shared zero make the split legible instantly.","The reference itself shifts over time (plot both series as lines instead) or nearly all values share one sign - that is just a bar chart.","Up to ~20 entities; sort by signed value so the extremes bracket the chart.","Positive side --chart-2, negative side --chart-5 (or the dashboard's two most luminance-separated slots among --chart-1..--chart-5), applied identically everywhere sign appears.","Sign must survive grayscale: keep the zero axis prominent and add signed value labels; direction words (over/under) in the tooltip.","Table with signed deltas and a direction column.","Hover for value and percent deviation; toggle absolute vs percent; click through to the entity."
+15,additive breakdown to a total,operator-active,"waterfall, bridge, contribution, cost walk, increase decrease, net change",waterfall (stacked bar with transparent base),"diverging bar, table with running total","Explaining how signed components sum to a net change - the cost walk from last month to this month. Build it as a stacked bar whose invisible base positions each floating segment.","Components are not additive, or more than ~10 steps - the running-total thread gets lost; aggregate small contributors.","4-10 steps plus start and end anchors; fold minor contributors into one Other step.","Increases --chart-2, decreases --chart-5, start/end anchor totals --chart-1 - three slots of the surface, fixed across all waterfall panels.","Every step carries a signed label; connect steps with faint leader lines so the sequence survives without color; state the net change in the title.","Ordered table of step / signed change / running total.","Hover shows the step's contribution and the running total at that point; click expands an aggregated step."
+16,cumulative flow of work states,operator-active,"cumulative flow, backlog, wip, queue states, ticket states, pipeline health",stacked area (cumulative flow),"line per state, stacked bar per day","Items moving through states over time - open/in-progress/done tickets, queued/running/completed jobs. Band width is queue depth; a widening band is a growing bottleneck, visible before any threshold trips.","States are not sequential or items skip freely between them - the bands stop meaning anything; chart per-state counts as lines instead.","3-5 states at daily or hourly snapshots; a 30-90 day window keeps band slopes readable.","States take --chart-1..--chart-5 in pipeline order with the terminal state at the bottom; the mapping stays fixed across every board the product shows.","Label bands directly at the right edge; call out the widest band's depth as text; stack order must match legend order.","Per-snapshot table of counts per state, with arrival and completion rates.","Hover shows per-state counts at a date; brush a period to inspect a slowdown."
+17,sequential stage drop-off,operator-active,"funnel, pipeline, conversion, drop-off, stages, onboarding steps",funnel,"ordered bar with conversion labels, waterfall","A strictly ordered pipeline where each stage can only shrink - signup steps, job pipeline stages. The between-stage conversion percentages are the actual content; print them.","Entities can re-enter or skip stages (that is a flow - use a sankey) or only 2 stages exist (a stat card with one conversion rate).","3-7 stages; merge micro-steps until each transition carries a decision-worthy percentage.","Single-hue funnel in --chart-1 with stage depth shown by geometry; reserve --chart-5 (or the designated alert slot) to flag the worst drop-off stage.","Stage name, absolute count, and conversion-from-previous as text at every stage - the shape alone understates late-stage losses.","Ordered table: stage, count, percent of start, percent of previous.","Hover a stage for counts in and out; click to see the cohort that dropped at that stage."
+18,flow between states,operator-active,"sankey, flow, source to target, migration, traffic routing, transitions",sankey,"grouped bar of top transitions, transition-matrix heatmap","Quantities moving between named nodes - traffic from origin to destination, plan upgrades and downgrades. Link thickness carries volume; a handful of dominant links is the story.","Flows loop back on themselves, more than ~15 links matter, or precise link values must be compared - a transition-matrix heatmap or table wins there.","Up to ~12 nodes and ~20 links; aggregate minor links into an Other flow before rendering.","Color links by source node using --chart-1..--chart-5; when sources exceed 5, group them - a link gradient stays within its assigned pair of tokens.","Node labels with totals always visible; link values in tooltips and the fallback table - ribbon widths are not precisely readable by anyone.","Source / target / volume table sorted by volume.","Hover highlights a full path end to end; click a node isolates its inbound and outbound flows."
+19,latency percentiles over time,operator-active,"latency, percentiles, p50 p95 p99, tail, response time, slo latency",multi-line (percentile set),"line + band between percentiles, latency heatmap over time","Service latency where the tail is the story. Plot p50, p95, and p99 on one time axis: the gap between median and tail is the signal - a diverging gap means tail degradation even while the median looks healthy.","Averages stand in for percentiles (an average hides the tail entirely) or a single snapshot is the question (histogram of the distribution instead).","Compute percentiles server-side from histogram buckets; cap at 3 percentile series - p50/p95/p99 is the operator convention; consider a log y-axis when p99 dwarfs p50 by 10x or more.","Fixed mapping across the whole product: p50 --chart-1, p95 --chart-2, p99 --chart-3 - an operator should never have to re-read a latency legend.","Distinct dash patterns per percentile plus end-of-line labels; the caption names which line the SLO binds.","Table of time buckets x p50/p95/p99 with an SLO-threshold column.","Hover shows all three percentiles at once; SLO threshold as a reference line; brush-zoom into an incident window."
+20,long-tail magnitude distribution,operator-active,"log scale, heavy tail, orders of magnitude, skew, duration spread",histogram with log-scale buckets,"cumulative curve (line), top-N bar plus summary stats","Values spanning several orders of magnitude - request durations, payload sizes, queue waits. Log-spaced buckets (1-10ms, 10-100ms, ...) keep the tail visible instead of crushing 99% of the data into one bar.","Values sit within one order of magnitude (linear buckets are more honest) or the audience will misread a log axis without labels at every decade.","10-20 log-spaced buckets, bucketed server-side; label every decade tick explicitly.","Single distribution --chart-1; a second overlay (previous deploy, other region) takes --chart-2 at reduced fill opacity.","Say 'log scale' in the axis label itself, not just the ticks; report p50 and p99 as text so the compression cannot mislead.","Bucket table with range, count, and cumulative-percent columns.","Hover per bucket; toggle linear/log axis; brush a bucket range to list the entities inside it."
+21,count and rate on one timeline,operator-active,"composed, volume and rate, bars and line, throughput and errors, overlay",composed bar + line,"two stacked panels sharing an x-axis, two lines (same unit)","An amount and a rate that explain each other over time - deploys (bars) against error rate (line). Bars carry the count, the line carries the rate, and the shared time axis carries the causality question.","The measures do not share a time grain or have no causal reading together; if both are rates in one unit, two plain lines are clearer. Treat a second y-axis with suspicion - aligned stacked panels avoid implying false correlation.","Same budgets as line and bar individually; prefer aligned panels over dual axes when scales differ by more than ~10x.","Bars --chart-1, line --chart-2; an essential second line takes --chart-3 - three encodings is the ceiling for one panel.","Each axis labeled with its unit and matched to its series in the legend; the line already differs from bars by geometry, keep it that way.","One table with a timestamp column and one column per measure.","Shared hover across both encodings at a timestamp; brush zoom moves both together."
+22,intensity across two dimensions,operator-active,"heatmap, hour by day, matrix, density grid, cadence, when does it happen",heatmap,"small-multiple bars, calendar heatmap","A metric across two categorical or binned axes - errors by hour x weekday, load by node x hour. Cyclical patterns (the 3am cron spike, the Monday surge) pop out at a glance.","Exact values must be read (heatmaps rank, they do not measure - pair with a table) or fewer than ~20 cells, where bars say it better.","Up to ~1-2k visible cells; aggregate beyond that; a year-long calendar heatmap is ~370 cells and fine.","A single-hue ramp built from --chart-1 via lightness/opacity steps - never a hue ramp across --chart-1..--chart-5, which misorders intensity; a diverging scale anchors its ends on --chart-2 and --chart-5 through a neutral midpoint.","Show the numeric value in-cell when the grid is small enough, always in tooltips otherwise; include a labeled color-scale legend with tick values.","The same matrix as a table, or the top-N hottest cells as a ranked list.","Hover for cell value; click a cell to filter the dashboard to that slice; a control for the time-bucket size."
+23,state over time per entity,operator-active,"status timeline, uptime, availability, incident history, up down, per host",status strip (segmented horizontal bar),"heatmap (entity x time), event markers","Discrete states per entity across time - up/degraded/down per service, job success history. One horizontal strip per entity, colored segments per state, stacked into a fleet overview.","Continuous measures (that is a line) or state changes so frequent that segments fall under a pixel - aggregate to percent-uptime per bucket and use a heatmap.","Up to ~30 entity rows per screen with 100-300 time segments each; past that paginate or group entities by team or tier.","States get a fixed mapping from --chart-1..--chart-5 (e.g. healthy --chart-2, degraded --chart-4, down --chart-5) used identically on every strip and legend in the product.","States must differ by more than hue - add a pattern or icon in the legend key; announce current state and last transition as text per row.","Per-entity table: current state, uptime percent, last incident timestamp.","Hover a segment for state, start, and duration; click opens the incident or run detail; time-range picker shared with the page."
+24,error-budget burn,operator-active,"error budget, slo burn, budget remaining, burn rate, reliability target",line vs threshold reference,"area (budget consumed), stat card with burn multiple","Consumption of an SLO error budget across a window - the line is budget remaining (or burn rate), the reference line is the exhaustion bound. The slope tells the operator whether the month survives.","No SLO is defined (define it first - a budget chart without a bound is just a line) or the audience only needs the current number (stat card with the burn multiple).","One series per SLO over a 28-30 day rolling window; multiple SLOs get one panel each, never overlaid.","Budget line --chart-1; the exhaustion threshold is a neutral reference line; the segment past a breach may re-color to --chart-5 where the line crosses it.","Annotate the crossing point ('budget exhausted Jun 24') as text on the chart; show remaining budget and burn multiple as a text pair beside it.","Stat pair (remaining percent, burn multiple) plus a daily consumption table.","Hover for remaining budget at a date; window toggle (7d/28d); click a burn spike to jump to that incident window."
+25,anomaly surveillance,operator-active,"anomaly, outlier detection, spike, expected range, deviation band, triage",line with reference band + highlighted points,"line with threshold reference lines, event-marked line","A live metric watched against an expected envelope - the normal band as a soft area, the actual as a line, flagged anomalies as marked, annotated points. The chart's job is triage: when, how far out, recovered or not.","Anomalies are already classified events (a table of incidents outranks dots on a line) or the expected band is invented rather than computed from history.","Same budgets as a line chart; keep anomaly markers a separate small series so hundreds of raw points never become hundreds of alerts.","Actual line --chart-1; expected band --chart-1 at low fill opacity; anomaly markers --chart-5 (the designated alert slot) with a distinct marker shape.","Every anomaly gets a text annotation or a numbered reference into a side list; marker shape distinguishes anomalies before color does.","Anomaly list (timestamp, metric, deviation magnitude, duration) beside the raw series table.","Hover an anomaly for deviation details; click jumps to logs or traces for that window; pause/resume live updates and honor reduced-motion preferences."
+26,forecast with uncertainty,operator-active,"forecast, projection, confidence interval, capacity planning, expected range",line + confidence area band,"fan of percentile lines, table of projected dates","History plus a projection - disk-full forecasting, traffic growth. Solid line for actuals, dashed continuation for the forecast, a widening band for the interval; the seam between observed and predicted must be unmistakable.","No stated confidence interval (a bare forecast line overstates certainty) or a forecast horizon longer than roughly half the visible history, which reads as fiction.","Keep the forecast to at most ~30% of the x-axis; one forecast per panel - competing forecasts get small multiples.","Actuals --chart-1 solid; forecast --chart-2 dashed; band --chart-2 at low fill opacity - never the same treatment for observed and predicted.","The actual/forecast split is carried by line style and a labeled vertical seam, not hue; name the interval ('80% band') in the legend text.","Table of projected values with lower and upper bounds, plus the headline date ('capacity reached ~Aug 12').","Hover shows point estimate and bounds; toggle the band; drag the horizon control to extend or shorten the projection."
+27,utilization against capacity,operator-active,"capacity, utilization, saturation, headroom, limit, disk, memory, pool",area with capacity reference line,"line with threshold, bullet-style bar (current snapshot)","A consumable resource against a hard limit over time - memory vs allocation, connections vs pool size. The filled area makes consumed-vs-headroom spatial; the reference line is the wall.","The limit is soft or autoscaling moves it constantly - plot the limit as its own step line instead of a fixed reference; snapshots without history belong in bullet-style bars.","Standard line-chart budgets; one resource per panel - a wall of small multiples beats six areas in one frame.","Consumption area --chart-1; the capacity bound is a neutral reference line, not a chart hue; crossing the warning threshold may flip the fill to --chart-4 or --chart-5 per the dashboard's alert convention.","Print current utilization percent and absolute headroom as text; threshold lines get labels ('80% warn'), not just position.","Stat card (current percent, headroom) with a history table.","Hover for value and percent-of-limit; brush to inspect a saturation event; click through to the per-instance breakdown."
+28,two-point change,operator-active,"slope, before after, two periods, rank shift, regression check, deploy delta",slope (two-point line),"grouped bar, diverging bar of deltas","Many entities measured at exactly two moments - latency per endpoint before and after a deploy. One line per entity between two vertical axes; crossings and steep slopes are the story.","More than 2 time points (a full line chart) or more than ~20 entities without highlighting - a muted field with 3-5 highlighted entities is the readable version.","Label up to ~12 entities directly; beyond that render the field muted and highlight only the largest movers.","The muted field uses a neutral low-emphasis stroke; highlighted movers take --chart-1..--chart-3; improvement/regression coloring reuses the deviation pair (--chart-2 / --chart-5).","Direct labels at both endpoints for highlighted entities; the delta as signed text in the tooltip and the fallback.","Table of entity, before, after, signed delta, percent change.","Hover isolates one entity's line; search-to-highlight; sort control on the fallback table."
+29,single proportion progress,operator-active,"progress, percent complete, radial, completion, rollout, migration status",radial progress (radial bar),"linear progress bar, stat card with fraction","One bounded percentage with a natural end state - rollout 68% complete, backfill progress. A radial or linear progress indicator plus the number reads instantly on a stat card.","The value is unbounded or can meaningfully regress (use a line so history shows) or several proportions need comparing (bars compare, rings do not).","One value per indicator; a grid of many progress indicators should become a sorted horizontal bar list.","Filled arc --chart-1 on the neutral track; a stalled or failing state borrows the alert slot --chart-5, never a new hue.","The percentage as large text in the center or beside the bar - the geometry is redundant to it; include the fraction ('682 of 1000 shards').","Text fraction and percent; nothing else needed.","Click drills into the remaining items; no hover needed beyond the exact fraction."
+30,multi-attribute profile,operator-active,"radar, profile, dimensions, scorecard, capability, shape comparison",radar,"grouped bar, small-multiple bars, scored table","1-3 entities compared across 4-6 shared, equally scaled attributes where the overall shape ('strong on reliability, weak on cost') matters more than exact reads.","Attributes on different scales or more than 6 axes (normalize or switch to grouped bars), any need for precise values, or more than 3 overlaid entities.","4-6 axes and 1-3 series; anything larger goes to a grouped bar or a scored table.","Entities take --chart-1..--chart-3 with translucent fills and full-opacity strokes; needing more than 3 means the radar was the wrong call.","Radar is a recognition chart, not a reading chart - the scored-table fallback is mandatory, and axis labels must be full words, not abbreviations.","Entity x attribute table with the same normalized scores.","Hover an axis for exact scores of all series; legend toggle per entity."
+31,discrete events on a timeline,operator-active,"events, deploys, incidents, annotations, markers, releases, audit points",event markers on a time axis,"bar of event counts per bucket, status strip","Point-in-time events that give context to trends - deploy markers over an error-rate line, incident flags on a latency panel. Events render as vertical reference lines or a marker lane under the main chart.","Events are the metric itself at high frequency (aggregate to counts per interval and use bars) or the descriptions matter more than the timing (a log table).","Up to ~30 visible markers per window; beyond that cluster into count badges that expand on zoom.","Markers use --chart-3 (or any slot not taken by the series they annotate); event categories cap at the surface's five slots - vary the marker glyph before the hue.","Each marker needs an accessible label (event type plus timestamp); a marker legend maps glyph to event type; the event list is keyboard-reachable.","Chronological event table alongside the metric table.","Hover a marker for the event summary; click opens the deploy or incident record; toggle event lanes on and off."
+32,geographic distribution,operator-active,"geo, region, country, datacenter, by location, spatial",horizontal bar by region (sorted),"heatmap (region x metric), table with inline bars","A metric broken down by region or datacenter where the values, not the geography, answer the question - a sorted bar of regions is more precise than any map and needs no map dependency.","A true spatial pattern (adjacency, routing paths) is the insight - that needs a real map layer, which sits outside the substrate's chart family; flag it as a bespoke component rather than forcing a chart.","Up to ~20 regions as bars; more than that, group by continent or tier first.","Same as ranked bars: --chart-1 uniform with --chart-2 for the focal region; per-region rainbow coloring communicates nothing.","Region names as full text labels with values printed; sorting by value replaces spatial scanning.","Region / value / share table with CSV export.","Hover for exact values; click a region to filter the dashboard; sort toggle."

package/data/harnesses/code/skills/design/data/combinations/fonts-known.json

@@ -0,0 +1,437 @@
+{
+  "fetched": "2026-07-06",
+  "source": "ui-ux-pro-max google-fonts.csv (canonical submodule copy)",
+  "families": {
+    "Abril Fatface": [
+      400
+    ],
+    "Amatic SC": [
+      700
+    ],
+    "Anton": [
+      400
+    ],
+    "Archivo": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Atkinson Hyperlegible": [
+      400,
+      700
+    ],
+    "Baloo 2": [
+      500,
+      600,
+      700
+    ],
+    "Barlow": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Barlow Condensed": [
+      500,
+      600,
+      700
+    ],
+    "Be Vietnam Pro": [
+      500,
+      600,
+      700
+    ],
+    "Bebas Neue": [
+      400
+    ],
+    "Bodoni Moda": [
+      500,
+      600,
+      700
+    ],
+    "Cabin": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Calistoga": [
+      400
+    ],
+    "Caveat": [
+      500,
+      600,
+      700
+    ],
+    "Chakra Petch": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Cinzel": [
+      500,
+      600,
+      700
+    ],
+    "Cormorant": [
+      500,
+      600,
+      700
+    ],
+    "Cormorant Garamond": [
+      500,
+      600,
+      700
+    ],
+    "Crimson Pro": [
+      500,
+      600,
+      700
+    ],
+    "DM Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Didact Gothic": [
+      400
+    ],
+    "EB Garamond": [
+      500,
+      600,
+      700
+    ],
+    "Epilogue": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Exo": [
+      500,
+      600,
+      700
+    ],
+    "Exo 2": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Figtree": [
+      500,
+      600,
+      700
+    ],
+    "Fira Code": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Fira Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Fredoka": [
+      500,
+      600,
+      700
+    ],
+    "IBM Plex Mono": [
+      400,
+      500,
+      700
+    ],
+    "IBM Plex Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Inter": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "JetBrains Mono": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Josefin Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Jost": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Karla": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Lato": [
+      400,
+      700
+    ],
+    "Lexend": [
+      500,
+      600,
+      700
+    ],
+    "Lexend Mega": [
+      500,
+      600,
+      700
+    ],
+    "Libre Baskerville": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Libre Bodoni": [
+      500,
+      600,
+      700
+    ],
+    "Lora": [
+      500,
+      600,
+      700
+    ],
+    "Manrope": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Merriweather": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Montserrat": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Newsreader": [
+      500,
+      600,
+      700
+    ],
+    "Noto Naskh Arabic": [
+      500,
+      600,
+      700
+    ],
+    "Noto Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans Arabic": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans Hebrew": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans JP": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans KR": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans SC": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans TC": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Sans Thai": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Noto Serif JP": [
+      500,
+      600,
+      700
+    ],
+    "Noto Serif TC": [
+      500,
+      600,
+      700
+    ],
+    "Nunito": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Nunito Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Open Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Orbitron": [
+      500,
+      600,
+      700
+    ],
+    "Outfit": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Playfair Display": [
+      500,
+      600,
+      700
+    ],
+    "Playfair Display SC": [
+      700
+    ],
+    "Plus Jakarta Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Poiret One": [
+      400
+    ],
+    "Poppins": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Public Sans": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Quicksand": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Raleway": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Righteous": [
+      400
+    ],
+    "Roboto": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Roboto Mono": [
+      400,
+      500,
+      700
+    ],
+    "Rubik": [
+      500,
+      600,
+      700
+    ],
+    "Russo One": [
+      400
+    ],
+    "Source Code Pro": [
+      400,
+      500,
+      700
+    ],
+    "Source Sans 3": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Source Serif 4": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Space Grotesk": [
+      400,
+      500,
+      600,
+      700
+    ],
+    "Space Mono": [
+      400,
+      700
+    ],
+    "Syne": [
+      500,
+      600,
+      700
+    ],
+    "Varela Round": [
+      400
+    ],
+    "Work Sans": [
+      400,
+      500,
+      600,
+      700
+    ]
+  }
+}