@r1z4x/tezgah 1.0.0

package/skills/design-library/SKILL.md

@@ -0,0 +1,58 @@
+---
+name: design-library
+description: >
+  The vendored MC Dean design/UX library - cognitive accessibility, adaptive
+  interfaces, visual-critique vocabulary and behavioural analytics - read one
+  entry at a time from its own index. Use when a UI or product turn needs a
+  cognitive-load, inclusive-interaction or visual-critique method tezgah has no
+  counterpart for.
+---
+
+# design-library
+
+Thirty-nine `SKILL.md` from two Owl-Listener repositories, vendored into this
+repository at pinned revisions (both MIT, `9a6930c` and `6e0740f`) and kept at
+the upstream path, so a path here is the path there. `SOURCE` records the
+revisions, the per-file sha256 and the two bodies this copy adapted; `NOTICE`
+records the licence.
+
+Tezgah owns the design floor: `design-contract` is the artifact shape a
+repository's tokens and states are read into, and `bin/tezgah-design` is the
+check that fails on them. This library owns the methods that sit on top of that
+floor - what to do about cognitive load, motion, target size, focus and
+comprehension, and how to critique a rendered screen dimension by dimension.
+
+## Read path - two steps, and only the second costs anything
+
+1. **`INDEX.md`** - one line per entry: `name - what it makes - path`. Read the
+   line that matches the work in hand.
+2. **the entry's `SKILL.md`** - the file the line names, e.g.
+   `inclusive-interaction/skills/touch-target-design/SKILL.md`. That is the
+   upstream body.
+
+`EVALS.md` holds the three trap cases this library is scored against.
+
+## What is in it
+
+| plugin | entries | for |
+|---|---|---|
+| `cognitive-accessibility` | 11 | cognitive load, memory load, focus, plain language, wayfinding, error recovery, help and personalisation |
+| `adaptive-interfaces` | 9 | information density, flexible typography, colour independence, user preferences, responsive and simplified views |
+| `inclusive-interaction` | 10 | keyboard navigation, focus management, gesture alternatives, motion sensitivity, target size, multi-modal input, voice |
+| `visual-critique` | 7 | one critique per dimension - hierarchy, composition, colour, typography, density, affordance, brand - each with a pass/minor/major rating |
+| `design-research` | 2 | funnel and retention reading, and qualitative/quantitative triangulation |
+
+## Where tezgah's own rules still win
+
+1. **The corrected floor.** `inclusive-interaction/skills/touch-target-design`
+   was adapted: WCAG 2.2 SC 2.5.8 (Level AA) is 24x24 CSS px, SC 2.5.5 (Level AAA)
+   is 44x44, and this repository enforces 24 (`bin/tezgah-design`'s
+   `TAP_TARGET`). Where an entry and the checker disagree, the checker is right.
+2. **The contract.** A vendored body never overrides `design-contract`'s token,
+   state or component rules, and a finding still carries one named evidence class.
+3. **Nothing executes.** These are read as instructions; no script here runs
+   against a user's repository.
+
+Neither the library nor an entry in it is a tezgah file: file an upstream bug
+upstream, and record a correction as an adaptation in `SOURCE` and `NOTICE` the
+way the touch floor is recorded.

package/skills/design-library/SOURCE

@@ -0,0 +1,131 @@
+# Source
+
+The vendored MC Dean design/UX subset, taken from two Owl-Listener repositories
+at a pinned revision, both MIT. The entry point `skills/design-library/SKILL.md`,
+`INDEX.md`, `EVALS.md` and this file are tezgah's own and are not part of the
+manifest; the 39 `SKILL.md` below are.
+
+- `inclusive-design-skills` -
+  https://github.com/Owl-Listener/inclusive-design-skills at revision
+  `6e0740f04b2130af60bc57abe3401b91e460e70d` (2026-06-09), MIT, Copyright (c)
+  2026 MC Dean. Three of its plugins, every skill in them - the
+  cognitive-accessibility, adaptive-interfaces and inclusive-interaction plugin
+  directories, 30 skills in all.
+- `designer-skills` - https://github.com/Owl-Listener/designer-skills at
+  revision `9a6930cf84a822eb458624bd11c61aac5bbdf224` (2026-09-05), MIT,
+  Copyright (c) 2026 MC Dean. Two of its plugins, part of them: the whole
+  visual-critique plugin (7 skills) and two skills of design-research
+  (`behavioural-analytics`, `qual-quant-triangulation`).
+
+Checkout for a re-vendor:
+
+```sh
+git clone https://github.com/Owl-Listener/inclusive-design-skills
+git -C inclusive-design-skills checkout 6e0740f04b2130af60bc57abe3401b91e460e70d
+git clone https://github.com/Owl-Listener/designer-skills
+git -C designer-skills checkout 9a6930cf84a822eb458624bd11c61aac5bbdf224
+```
+
+## What is vendored
+
+39 `SKILL.md` at the upstream path, under the plugin directory they ship in, so a
+path here is the path there and a re-vendor is a file-for-file diff. The manifest
+is this table, and `tests/test_skills.py` holds the tree to it: every listed file
+is hashed, a listed file that is missing fails, a body that no longer matches its
+hash fails, and a directory beside them that the table does not name fails.
+
+| file | upstream repo | sha256 | note |
+|---|---|---|---|
+| `adaptive-interfaces/skills/colour-independence/SKILL.md` | `inclusive-design-skills` | `4a24e41dabfbcdd144514c3894fe14972822974cd799352adb2c0d85f01df6bd` | byte-for-byte |
+| `adaptive-interfaces/skills/flexible-typography/SKILL.md` | `inclusive-design-skills` | `60ed6308b9434bcb50cbe4c4bad17cb6efa8841b14dbbcfb52ba35bd630374fc` | byte-for-byte |
+| `adaptive-interfaces/skills/information-density/SKILL.md` | `inclusive-design-skills` | `31611ebe01db6af2d2673cdd587523dd149ee08c48f4f85ca19653a3539199f8` | byte-for-byte |
+| `adaptive-interfaces/skills/preference-audit/SKILL.md` | `inclusive-design-skills` | `5e91232273076c90671ffdd2d3ecdba165312ad293f5132aa7f0b159d413d630` | byte-for-byte |
+| `adaptive-interfaces/skills/responsive-accessibility/SKILL.md` | `inclusive-design-skills` | `0c233392a42591100a3f85f068cc387a8347e5b7e228ceb646a5f9618892d025` | byte-for-byte |
+| `adaptive-interfaces/skills/responsive-review/SKILL.md` | `inclusive-design-skills` | `3290eb820d790351a19f8642c95d54a367e1bc5ba19a96884981215ff9f12748` | byte-for-byte |
+| `adaptive-interfaces/skills/simplified-views/SKILL.md` | `inclusive-design-skills` | `03b85a7a36f0fbec4c647e38a0c7627ae45949c2cd7898078705ff284dc6918a` | byte-for-byte |
+| `adaptive-interfaces/skills/specify/SKILL.md` | `inclusive-design-skills` | `f2e5e52e8e2c01af686f1ef4bfae64dc3b9d591fcb3ea42218e4ce77c5f55dd1` | byte-for-byte |
+| `adaptive-interfaces/skills/user-preference-respect/SKILL.md` | `inclusive-design-skills` | `003da44c4cd9ed6826657bf2651b7f8adb5961065cec1ed24d1984bd4dded452` | byte-for-byte |
+| `cognitive-accessibility/skills/adaptive-personalisation/SKILL.md` | `inclusive-design-skills` | `b1363f70ed3ecbc2e1a43be0fbc9b8350794472acdd6069b956d3a23b159f6b0` | adapted - `name` matches its directory (upstream shipped the sibling skill's name) |
+| `cognitive-accessibility/skills/assess-load/SKILL.md` | `inclusive-design-skills` | `ffe5cd3891358b729c2298756df8d91dbbfc538ab698e72cce257202c1f17863` | byte-for-byte |
+| `cognitive-accessibility/skills/cognitive-load-assessment/SKILL.md` | `inclusive-design-skills` | `666c74971ba790ec81bb86bdaee8362bed791423386021e90eb1d6fd1c9a56cb` | byte-for-byte |
+| `cognitive-accessibility/skills/contextual-help-design/SKILL.md` | `inclusive-design-skills` | `ca49b0b26c01d58dd80fa841cfcb42a55f431cbe3ea6459183bba9c44d6a4626` | byte-for-byte |
+| `cognitive-accessibility/skills/error-prevention-recovery/SKILL.md` | `inclusive-design-skills` | `34f51f51b2bad8b9ac76e23a66a05c82066bf0225abe951d7fa744797885dfa7` | byte-for-byte |
+| `cognitive-accessibility/skills/focus-attention-design/SKILL.md` | `inclusive-design-skills` | `604c83463a3bcdcd0609f4aa366d421122312d29574db3046672e00d8b955ad5` | byte-for-byte |
+| `cognitive-accessibility/skills/memory-load-reduction/SKILL.md` | `inclusive-design-skills` | `9f44acc844d2cab57d77fa011a3e737b8f53e06aba2b315ed9154ac4ce29d5c3` | byte-for-byte |
+| `cognitive-accessibility/skills/plain-language-design/SKILL.md` | `inclusive-design-skills` | `26564e0c388dcf83dbd0d271edb99dbabbd43d41349d080b190ed4bd94910acd` | byte-for-byte |
+| `cognitive-accessibility/skills/review/SKILL.md` | `inclusive-design-skills` | `dc88c60db982dc46939862e5e913efbf69caafd025457d69c4394fbeaea2b22f` | byte-for-byte |
+| `cognitive-accessibility/skills/simplify/SKILL.md` | `inclusive-design-skills` | `a75b7f6361c23d8720591d12b1c70f10d5c25da7c660e0243b818f7587aea1db` | byte-for-byte |
+| `cognitive-accessibility/skills/wayfinding-navigation/SKILL.md` | `inclusive-design-skills` | `a58fb18487238841e93edee2f2548e5c94e710d7dcf76f1a1797a319725a8892` | byte-for-byte |
+| `design-research/skills/behavioural-analytics/SKILL.md` | `designer-skills` | `fe675689031efec6cdd8ad1c138b869efa703453a248bb3addd5a257eed9dc71` | byte-for-byte |
+| `design-research/skills/qual-quant-triangulation/SKILL.md` | `designer-skills` | `5a46dbc020d25526acc7ad62c300b47fa2f64d83f6efa11281eb1731e892768a` | byte-for-byte |
+| `inclusive-interaction/skills/audit/SKILL.md` | `inclusive-design-skills` | `398f7edade2297ecab75854fa5da1879f3838c42ccf786e490bf7d8e22569d69` | byte-for-byte |
+| `inclusive-interaction/skills/design-flow/SKILL.md` | `inclusive-design-skills` | `47685797189f104d8d7b7daf70456013162582b23ca92556b5e49eb0ca60fa3a` | byte-for-byte |
+| `inclusive-interaction/skills/feedback-and-status/SKILL.md` | `inclusive-design-skills` | `17264f4a3c64f3f92c22fe98d15f9ac2bcd3374b78e0d4b6c40bfe6c83ce193e` | byte-for-byte |
+| `inclusive-interaction/skills/gesture-alternatives/SKILL.md` | `inclusive-design-skills` | `a30ec9e35f143ffa6de5585b985c7683b1e1fc4116c23ff55dacf7ac01430c44` | byte-for-byte |
+| `inclusive-interaction/skills/keyboard-navigation/SKILL.md` | `inclusive-design-skills` | `44ad1cc578cf8ed3287c8dfea1cb91f1fe663480d41afa4b87272c8a28dbc240` | byte-for-byte |
+| `inclusive-interaction/skills/keyboard-review/SKILL.md` | `inclusive-design-skills` | `4dcf4b716523a3a698062242da62aef1c43b6bdd865499be51b9e28fe4634b9e` | byte-for-byte |
+| `inclusive-interaction/skills/motion-sensitivity/SKILL.md` | `inclusive-design-skills` | `5faddb723f51e31f2780320703ec67ba0eb555b633cbdbf3afc702d9df04c7b9` | byte-for-byte |
+| `inclusive-interaction/skills/multi-modal-input/SKILL.md` | `inclusive-design-skills` | `f45997b13701e4d97857ab3768cdbf045ceabab0527959f04fa2d3481d754c1d` | byte-for-byte |
+| `inclusive-interaction/skills/touch-target-design/SKILL.md` | `inclusive-design-skills` | `176d6438b40fa95dcd1fe24f5ec43d6c2a0436f4f5aaa542ec85844366f73ffc` | adapted - the AA touch floor corrected to 24x24 (SC 2.5.8); 44x44 keeps the AAA floor it is (SC 2.5.5) and the platform guidance |
+| `inclusive-interaction/skills/voice-interaction/SKILL.md` | `inclusive-design-skills` | `091bbbaed8dd0ca90a961e9caa78dd0a4da5b233dc2d976164b46f03e92a9a80` | byte-for-byte |
+| `visual-critique/skills/critique-affordance/SKILL.md` | `designer-skills` | `8ba4f17b694eff6f25f0025cf7f75459d4f92e2130d60ffc369cf4a94b6375cb` | byte-for-byte |
+| `visual-critique/skills/critique-brand-consistency/SKILL.md` | `designer-skills` | `3e0babf21656878969d02a3f147d4e958770023e7768ac2084cb4d2b5f1cc7c0` | byte-for-byte |
+| `visual-critique/skills/critique-color/SKILL.md` | `designer-skills` | `ffa4652b75236dd1dced9636e532a102ba416e4253251cb74370c824d540bb88` | byte-for-byte |
+| `visual-critique/skills/critique-composition/SKILL.md` | `designer-skills` | `ab3f4b50153a1e7fe0deebf8e7e68c0643c2fdbaad1c7a0e7b8223e137182b83` | byte-for-byte |
+| `visual-critique/skills/critique-information-density/SKILL.md` | `designer-skills` | `e992bfbdef6a3919a24e5c91d0e9518395d16cabd4b308c3e3bbe34ee3ac0443` | byte-for-byte |
+| `visual-critique/skills/critique-typography/SKILL.md` | `designer-skills` | `eb15ce57ba98186ed30fc3ce8df6167fc73668a24160e4d3e23b9925f7beae63` | byte-for-byte |
+| `visual-critique/skills/critique-visual-hierarchy/SKILL.md` | `designer-skills` | `e9c210156b5cd6c049922c0ca2ab65dbed96bc3c2d2bfaa0b4b1ea47c89ec4b1` | byte-for-byte |
+
+## The two adaptations
+
+Every adopted body is byte-for-byte upstream except these two, and each keeps its
+upstream bytes everywhere else:
+
+1. `inclusive-interaction/skills/touch-target-design/SKILL.md`, in "Minimum
+   Sizes", says the touch floor is `44x44 CSS pixels (WCAG 2.2 Level AA)`. That
+   pairs a size with the wrong level: WCAG 2.2 SC 2.5.8 Target Size (Minimum) is
+   Level AA at 24x24 CSS px, and SC 2.5.5 Target Size (Enhanced) is Level AAA at
+   44x44. The adopted copy states 24x24 as the AA floor with its success
+   criterion and keeps 44x44 as the AAA floor and the common platform guideline.
+   That is the floor tezgah's own `bin/tezgah-design` enforces - `TAP_TARGET =
+   24`, citing SC 2.5.8 - so the vendored copy and the checker now agree. The
+   file's other 44x44 mentions (its touch checklist, the Material
+   recommendation) state no level and are kept as upstream wrote them.
+2. `cognitive-accessibility/skills/adaptive-personalisation/SKILL.md` carries
+   `name: contextual-help-design`, which does not match its directory: it is the
+   duplicate of the sibling `contextual-help-design` skill, body included. A host
+   that loads a skill from its directory skips a name that disagrees with it, so
+   the adopted copy's `name` is `adaptive-personalisation`. The body, its
+   "Contextual Help Design" heading included, is upstream's.
+
+## What is not, and why
+
+- The account's other collections: `ux-pgm-skills` (30) and
+  `design-leadership-skills` (32) are one generator's ~1 KB checklists that cite
+  no external standard anywhere, and `ai-design-skills` (44) is about designing
+  AI products rather than about a tezgah turn. The other three plugins of
+  `inclusive-design-skills` - `accessible-content`, `accessibility-decisions`,
+  `inclusive-personas`, 26 skills - are left out too: `design-contract`,
+  `feature-audit` and the WCAG floor cover that ground, and every one of them is
+  one URL away.
+- `designer-skills`' design-research plugin beyond the two vendored skills, 12
+  more (`affinity-diagram`, `journey-map`, `survey-design`, ...): the funnel and
+  triangulation discipline is what tezgah has no counterpart for; the synthesis
+  workshops are not.
+- Each adopted skill's own `EVALS.md`, upstream's for the two design-research
+  skills: this library ships one `EVALS.md` for the tree instead, in the same
+  shape.
+- The plugin packaging surface of both repositories - `.claude-plugin/*.json`,
+  `commands/`, the READMEs, the marketplace manifest - the same rule
+  `skills/pm-frameworks` states.
+- `habitat` is read for the shape of a checker, never vendored: its component and
+  tokens JSON schemas are the shape `bin/tezgah-design` reads a design contract
+  as. No habitat prose or code is copied.
+
+## Re-vendoring
+
+Copy the two pinned checkouts' files over the tree, re-apply the two adaptations
+above, replace every sha256 in the table, and update the revisions in this file -
+all in one commit. `tests/test_skills.py` fails on a body that no longer matches
+its hash, on a listed file that is missing, and on a directory beside them the
+table does not list, so a re-vendor that moves only the files is caught.

package/skills/design-library/adaptive-interfaces/skills/colour-independence/SKILL.md

@@ -0,0 +1,90 @@
+---
+name: colour-independence
+description: "Design interfaces where colour is never the only way information is communicated. Use when designing status indicators, data visualisations, form validation, alerts, maps, or any content that uses colour to convey meaning. Triggers on: colour blind, color blind, colour alone, color alone, colour vision, color vision, red green, deuteranopia, protanopia, tritanopia, colour coding, status colour, chart colours, accessible colours."
+---
+
+# Colour Independence
+
+Design so that every piece of information conveyed by colour is also
+conveyed by something else — shape, text, pattern, position, or icon.
+8% of men and 0.5% of women have colour vision deficiency. That's
+roughly 1 in 12 of your male users.
+
+## Core Principle
+
+Colour can enhance meaning. Colour must never be the only carrier
+of meaning.
+
+## Common Failures
+
+### Status Indicators
+- Bad: green dot = online, red dot = offline (colour only)
+- Good: green dot + "Online" label, red dot + "Offline" label
+- Better: green dot with tick + "Online", grey dot with x + "Offline"
+
+### Form Validation
+- Bad: red border on invalid fields (colour only)
+- Good: red border + error icon + error text message
+- The error message does the real work — the colour is reinforcement
+
+### Data Visualisation
+- Bad: line chart with 5 coloured lines, legend uses colour swatches
+- Good: different line styles (solid, dashed, dotted) + labels +
+  distinct colours that work in greyscale
+- Good: bar chart with patterns (stripes, dots, solid) alongside colour
+- Always test charts in greyscale — can you still read them?
+
+### Links
+- Bad: links distinguished from body text only by colour
+- Good: links are coloured AND underlined
+- The underline is the accessible indicator — colour is the enhancement
+
+### Alerts and Badges
+- Bad: red badge = urgent, yellow = warning, green = ok
+- Good: red badge + "Urgent" label, yellow + "Warning" label,
+  green + "OK" label
+- Icons reinforce: ⚠ for warning, ✓ for success, ✕ for error
+
+### Maps and Diagrams
+- Bad: regions coloured to show data (choropleth with no labels)
+- Good: colours + patterns + values displayed on each region
+- Good: interactive with values on hover/focus AND a data table
+  alternative
+
+## Design Patterns
+
+### Double Encoding
+Every colour meaning gets a second encoding:
+- Colour + icon
+- Colour + text label
+- Colour + pattern or texture
+- Colour + shape
+- Colour + position
+
+### Accessible Colour Palettes
+- Choose colours that are distinguishable in all types of
+  colour vision deficiency (not just red-green)
+- Use a colour blindness simulator to test your palette
+- Blue and orange are generally safe for most types
+- Avoid red/green as the only pair distinguishing two states
+- Ensure sufficient contrast between adjacent colours in charts
+
+### Greyscale Test
+Quick check: convert your interface to greyscale.
+- Can you still use it?
+- Can you distinguish all status states?
+- Can you read the chart?
+- Can you tell which fields have errors?
+
+If any answer is no, colour is carrying meaning alone.
+
+## Assessment Checklist
+
+- [ ] No information is conveyed by colour alone
+- [ ] Status indicators use colour + icon + text
+- [ ] Form errors use colour + icon + message
+- [ ] Charts are readable in greyscale
+- [ ] Links are distinguishable by more than colour
+- [ ] Alert levels use colour + label + icon
+- [ ] Data visualisations have patterns or labels alongside colour
+- [ ] Interface passes the greyscale test

package/skills/design-library/adaptive-interfaces/skills/flexible-typography/SKILL.md

@@ -0,0 +1,83 @@
+---
+name: flexible-typography
+description: "Design typography systems that adapt to user needs — scaling, spacing, and font preferences. Use when designing type systems, setting font sizes, defining line heights, or reviewing text readability across conditions. Triggers on: typography, font size, line height, letter spacing, word spacing, text scaling, dyslexia font, readable font, type scale, font units, rem, em, px, reading difficulty."
+---
+
+# Flexible Typography
+
+Design type systems that flex with the user — scaling smoothly,
+spacing generously, and never breaking when someone needs text
+larger, more spaced, or in a different font.
+
+## Core Requirements
+
+### Relative Units Always
+- Use rem for font sizes (relative to root, user-controllable)
+- Use em for spacing that should scale with text
+- Never use px for font size — it overrides user preferences
+- Base font size: let the browser default (usually 16px) be your
+  starting point, don't override it
+
+### Minimum Sizes
+- Body text: 1rem minimum (never smaller)
+- Small text / captions: 0.875rem minimum
+- Labels and UI text: 0.875rem minimum
+- If text is essential, it should be readable without zooming
+
+### Line Height
+- Body text: 1.5 minimum (WCAG requirement)
+- Headings: 1.2–1.3 (tighter is acceptable for large text)
+- Line height should scale with font size — use unitless values
+  (1.5 not 24px)
+
+### Spacing
+- Paragraph spacing: at least 1.5× the font size
+- Letter spacing: don't compress below browser default
+- Word spacing: don't compress below browser default
+- Users must be able to override spacing without breaking layout
+  (WCAG 2.1 Level AA, Success Criterion 1.4.12)
+
+## Design Patterns
+
+### Scalable Type Scale
+- Define a type scale using relative ratios (1.25, 1.333, 1.5)
+- Each step should be perceptibly different
+- 4–6 sizes is enough for most interfaces
+- Example: 0.875rem, 1rem, 1.25rem, 1.5rem, 2rem, 2.5rem
+
+### User-Override Safe
+- Don't set fixed heights on text containers
+- Use min-height instead of height for elements containing text
+- Let containers grow when text grows
+- Test with: 200% text size, 200% zoom, extra letter and word spacing
+- If layout breaks at any of these, the CSS needs fixing
+
+### Font Selection
+- Prioritise readability over aesthetics
+- Sans-serif fonts are generally easier for screen reading
+  (but this is preference, not rule — test with your audience)
+- Ensure the chosen font has:
+  - Clear distinction between similar characters (Il1, 0Oo, rn/m)
+  - Consistent x-height
+  - Adequate character spacing at default settings
+- Provide a font-family stack that degrades gracefully
+- Never prevent users from overriding with their preferred font
+
+### Dark Mode Typography
+- Reduce font weight slightly in dark mode (light text on dark
+  backgrounds appears heavier than dark text on light)
+- Ensure contrast meets 4.5:1 minimum in both modes
+- Avoid pure white (#fff) on pure black (#000) — the extreme
+  contrast causes halation for some users. Use off-white on
+  dark grey instead
+
+## Assessment Checklist
+
+- [ ] All font sizes use rem or em, never px
+- [ ] Body text is at least 1rem
+- [ ] Line height is at least 1.5 for body text
+- [ ] Layout survives 200% text scaling without breaking
+- [ ] Layout survives user-applied letter and word spacing overrides
+- [ ] Text containers use min-height, not fixed height
+- [ ] Font has clear character distinction (Il1, 0Oo)
+- [ ] Both light and dark modes meet contrast requirements

package/skills/design-library/adaptive-interfaces/skills/information-density/SKILL.md

@@ -0,0 +1,87 @@
+---
+name: information-density
+description: "Design interfaces where information density can be adjusted to suit different cognitive needs and preferences. Use when designing dashboards, data tables, feeds, inboxes, settings panels, or any interface with variable amounts of content. Triggers on: information density, too dense, too sparse, compact view, comfortable view, spacing, whitespace, data density, content density, crowded, breathing room."
+---
+
+# Information Density
+
+Design interfaces that let users control how much information they
+see at once — because the right density for a power user scanning
+200 rows is the wrong density for someone who needs space to process
+each item.
+
+## The Density Spectrum
+
+### Compact
+- Minimal spacing, smaller text, more items visible
+- Suits: power users, data-heavy tasks, large screens
+- Risks: overwhelming for cognitive disabilities, hard to tap on
+  touch devices, hard to scan for low vision
+
+### Comfortable (Default)
+- Moderate spacing, standard text size, balanced visibility
+- Suits: most users in most contexts
+- This should be the default — optimise for this first
+
+### Spacious
+- Generous spacing, larger text, fewer items visible
+- Suits: cognitive disabilities, low vision, touch devices,
+  new users, stressful contexts
+- Risks: requires more scrolling for experienced users
+
+## Design Patterns
+
+### Density Controls
+- Offer 2–3 density options (compact, comfortable, spacious)
+- Use clear labels — not just icon toggles
+- Apply density change immediately (no page reload)
+- Remember the preference across sessions
+- Place the control near the content it affects
+
+### What Changes With Density
+- Vertical spacing between items
+- Horizontal padding within items
+- Font size (within accessible range — never below 0.875rem)
+- Line height (within accessible range — never below 1.5 for body)
+- Amount of metadata shown per item
+- Thumbnail or preview sizes
+- Number of columns in grid layouts
+
+### What Should NOT Change With Density
+- Content meaning — no information should be lost at any density
+- Accessibility — every density level must meet WCAG requirements
+- Interaction targets — minimum 44×44px on touch regardless of density
+- Heading structure — structure stays consistent
+- Keyboard navigation — tab order stays logical
+
+### Density by Context
+- **Lists and feeds:** control row height and visible metadata
+- **Data tables:** control row padding and visible columns
+- **Dashboards:** control card size and spacing
+- **Inboxes:** control preview length and row height
+- **Calendars:** control event detail visibility
+
+## Defaults That Adapt
+
+### Viewport-Based Defaults
+- Large screens (1440px+): comfortable or compact
+- Medium screens (768–1439px): comfortable
+- Small screens (below 768px): comfortable or spacious
+- Touch devices: never default to compact
+
+### Preference-Based Defaults
+- If system text size is increased: default to spacious
+- If prefers-contrast is active: increase spacing slightly
+- New users: default to comfortable
+- Let users override all defaults
+
+## Assessment Checklist
+
+- [ ] At least two density options are available
+- [ ] Default density is comfortable, not compact
+- [ ] No information is lost at any density level
+- [ ] Minimum touch targets (44×44px) are maintained at all densities
+- [ ] Minimum text size (0.875rem) is maintained at all densities
+- [ ] Minimum line height (1.5) is maintained at all densities
+- [ ] Density preference is remembered across sessions
+- [ ] Density adapts to viewport and system preferences

package/skills/design-library/adaptive-interfaces/skills/preference-audit/SKILL.md

@@ -0,0 +1,70 @@
+---
+name: preference-audit
+description: "Audit an existing interface for respect of user preferences including motion, contrast, colour scheme, and text scaling. Chains: user-preference-respect, responsive-accessibility, colour-independence. Use when reviewing an existing product for adaptive behaviour."
+---
+
+# User Preference Audit
+
+Test whether an existing interface correctly detects and responds to
+user preferences — the accessibility settings people have deliberately
+chosen.
+
+## Process
+
+### Step 1: Test Motion Preferences
+Using **user-preference-respect**, enable prefers-reduced-motion and
+navigate the entire interface. Document:
+- Animations that continue playing
+- Transitions that still slide or fade
+- Parallax effects that remain active
+- Autoplay video or carousels that don't stop
+- Any motion that serves no functional purpose
+
+### Step 2: Test Contrast and Colour Preferences
+Enable prefers-contrast (more) and forced-colors mode. Using
+**user-preference-respect** and **colour-independence**, document:
+- Elements that become invisible or indistinguishable
+- Focus indicators that disappear
+- Interactive elements that lose their borders
+- Colour-only status indicators that become meaningless
+- Charts or visualisations that become unreadable
+
+### Step 3: Test Colour Scheme
+Switch between light and dark modes. Document:
+- Content that becomes illegible in one mode
+- Images or icons that don't adapt
+- Hardcoded colours that clash with the theme
+- Contrast failures specific to one mode
+
+### Step 4: Test Text Scaling and Zoom
+Using **responsive-accessibility**, test at 200% browser zoom
+and with system font size at maximum. Document:
+- Text that overflows or gets clipped
+- Layouts that break or overlap
+- Horizontal scrolling that appears
+- Fixed-height containers that truncate content
+- Interactive elements that become unreachable
+
+### Step 5: Test Combinations
+Test realistic combinations:
+- Dark mode + high contrast + reduced motion
+- 200% zoom + large system font
+- Forced colours + reduced motion
+
+Document any failures that only appear in combination.
+
+## Output
+
+Deliver an audit report:
+
+1. **Summary** — which preferences are respected, which are ignored
+2. **Preference-by-preference findings** — specific failures for each
+3. **Combination failures** — issues that appear only when multiple
+   preferences are active
+4. **Fix list** — prioritised by severity and number of users affected
+
+Severity definitions:
+- **Critical** — preference is completely ignored, causing harm or
+  blocking access
+- **Major** — preference is partially respected, significant gaps remain
+- **Minor** — preference is mostly respected, edge cases need fixing

package/skills/design-library/adaptive-interfaces/skills/responsive-accessibility/SKILL.md

@@ -0,0 +1,86 @@
+---
+name: responsive-accessibility
+description: "Design responsive layouts that maintain accessibility across screen sizes, zoom levels, and orientations. Use when designing responsive interfaces, testing zoom behaviour, or reviewing layouts across devices. Triggers on: responsive, zoom, reflow, breakpoint, mobile accessibility, screen size, orientation, viewport, 200% zoom, text scaling, layout shift, horizontal scroll."
+---
+
+# Responsive Accessibility
+
+Responsive design isn't just about screen size — it's about ensuring
+accessibility holds at every viewport, zoom level, and orientation.
+A layout that works at 1440px but breaks at 200% zoom has failed
+the users who need zoom most.
+
+## Core Requirements
+
+### Text Reflow at 200% Zoom
+- All content must reflow into a single column at 200% zoom
+  with no horizontal scrolling
+- This is WCAG 2.1 Level AA (Success Criterion 1.4.10)
+- Test by setting browser zoom to 200% at 1280px viewport —
+  the result must be usable without horizontal scroll
+- Exceptions: data tables, maps, and diagrams may scroll
+  horizontally if no information is lost
+
+### Text Scaling to 200%
+- All text must remain readable when scaled to 200%
+- Text must not be clipped, truncated, or overlap other elements
+- Use relative units (rem, em, %) not fixed pixels for text
+- Line height and spacing should scale proportionally
+
+### Orientation Freedom
+- Content must work in both portrait and landscape orientation
+- Never lock orientation unless essential to function
+  (a piano app may need landscape; a form never does)
+- Some users mount devices in fixed orientations due to
+  physical setup — locking orientation can block access entirely
+
+## Design Patterns
+
+### Fluid Layout
+- Use flexible grids that adapt rather than fixed breakpoints
+  that snap
+- Set max-width on content containers for readability
+  (45–75 characters per line)
+- Let whitespace compress before content reflows
+- Avoid fixed-width elements that force horizontal scroll
+
+### Content Priority
+- Define what's essential at each breakpoint
+- On small screens: show core content, provide access to rest
+- Don't hide critical functionality behind "desktop only" features
+- Navigation should adapt (hamburger menu is fine) but all
+  destinations must remain accessible
+
+### Touch and Pointer Adaptation
+- At small viewports: increase touch targets to 48px minimum
+- At large viewports: pointer-friendly sizes are acceptable
+  (24px minimum)
+- Detect pointer type with `@media (pointer: coarse)` for
+  touch-first sizing
+- Spacing between targets should increase on touch devices
+
+### Zoom-Safe Patterns
+- Sticky headers must not consume excessive vertical space at zoom
+  (a header that takes 30% of the viewport at 200% zoom is a barrier)
+- Fixed-position elements must be tested at 200% zoom
+- Tooltips and popovers must remain visible and reachable at zoom
+- Modal dialogs must be scrollable if content exceeds viewport at zoom
+
+## Testing Protocol
+
+1. Test at 100%, 150%, and 200% browser zoom on a 1280px viewport
+2. Test at 320px viewport width (mobile equivalent)
+3. Test in both portrait and landscape orientation
+4. Test with system font size set to largest option
+5. At each test point verify: no horizontal scroll, no clipped text,
+   no overlapping elements, all interactions functional
+
+## Assessment Checklist
+
+- [ ] Content reflows at 200% zoom without horizontal scrolling
+- [ ] Text remains readable at 200% scaling
+- [ ] Both orientations are supported
+- [ ] Touch targets increase at small viewports
+- [ ] Sticky/fixed elements don't dominate the viewport at zoom
+- [ ] No functionality is lost at any supported viewport size
+- [ ] All text uses relative units