@dataimago/css-neutral 0.1.0-alpha.10

package/README.md

@@ -0,0 +1,85 @@
+# @dataimago/css-neutral
+
+Neutral-identity compiled CSS + Tailwind preset — paired with `@dataimago/tokens-neutral`. Sensible defaults for externally-owned consumers.
+
+**Ships:**
+- `dist/tokens.css` — CSS custom properties (copied from `@dataimago/tokens-neutral`)
+- `dist/tokens.scss` — same, as SCSS
+- `dist/tailwind-preset.js` — Tailwind preset (Noto Sans throughout; neutral palette: ink/stone/paper/functional only)
+
+**Does NOT ship** a compiled `dataimago.css` (component stylesheet). The house package's compiled CSS embeds dataimago-specific component styling (forest interactive primary, copper editorial framing, accent moral-weight beats); shipping that under a "neutral" name would be dishonest. Neutral consumers use tokens + Tailwind preset and author their own component stylesheets.
+
+## Install
+
+```sh
+pnpm add @dataimago/tokens-neutral @dataimago/css-neutral
+```
+
+## Usage
+
+```css
+/* globals.css */
+@import '@dataimago/css-neutral/tokens.css';
+```
+
+```js
+// tailwind.config.js
+module.exports = {
+  presets: [require('@dataimago/css-neutral/tailwind-preset')],
+  content: [/* your app */],
+};
+```
+
+## What's in the Tailwind preset
+
+| Block | Source | Neutral identity |
+|---|---|---|
+| `colors` | `@dataimago/tokens-neutral` | `ink`, `stone`, `paper`, `functional` only — no `forest`, `copper`, `accent`, `presentation-blue` |
+| `fontFamily` | `@dataimago/tokens-neutral` | All families resolve to Noto Sans stacks (`display`, `display-editorial`, `display-documentation`, `brand`) |
+| `fontSize` | `@dataimago/tokens-neutral` | Same scale as `@dataimago/css` (micro → heading-xl) |
+| `spacing`, `borderRadius`, `boxShadow`, `transitionDuration` | `@dataimago/tokens` (shared) | Same as `@dataimago/css` — non-identity tokens are shared between the two packages |
+
+## When to use this vs `@dataimago/css`
+
+| Consumer | Use |
+|---|---|
+| dataimago.ai (Level-1 hub) | `@dataimago/css` |
+| dissertation.ai, sgpc.ai, rpkg.ai (Level-2 hubs — dataimago-owned) | `@dataimago/css` |
+| `apps/template/` per-user Level-3 apps | `@dataimago/css-neutral` |
+| Third-party Level-2 hubs (future) | `@dataimago/css-neutral` as starting point; customize via Tailwind preset extension |
+
+## Quarto, LaTeX and data-viz outputs
+
+`dist/quarto/neutral-{light,dark}.scss` (the neutral Quarto theme pair), `dist/latex/dataimago-tokens.sty` and `dist/dataviz/` (the shared Okabe-Ito palette) ship here too; the house-only `components.scss` and `dataimago.sty` do not.
+
+A consumer that does not install from npm pins a version and syncs files. Commit
+`.dataimago/design.json`:
+
+```json
+{ "package": "@dataimago/css-neutral", "version": "<exact version>",
+  "outputs": { "quarto/neutral-light.scss": "styles/", "quarto/neutral-dark.scss": "styles/",
+               "latex/dataimago-tokens.sty": "latex/", "dataviz/dataimago_dataviz.R": "R/palette.R" } }
+```
+
+then run `npx -p @dataimago/css-neutral@<version> dataimago-sync` and commit the files (each carries a
+provenance stamp; never edit them). Put `npx -p @dataimago/css-neutral@<version> dataimago-sync --check`
+in CI: it fails on any drift. The shipped outputs are listed in `dist/outputs.json`
+(e.g. `https://unpkg.com/@dataimago/css-neutral@<version>/dist/outputs.json`). See
+[`wiki/patterns/new-consumer-checklist.md`](../../wiki/patterns/new-consumer-checklist.md).
+
+## Architectural notes
+
+Variant A of the two-tier identity pattern — see [`wiki/decisions/tokens-neutral-sibling.md`](../../wiki/decisions/tokens-neutral-sibling.md) for the full rationale, including the iteration-4 deprecation target (Variant B: neutral-as-base + `@dataimago/dataimago-theme` overlay).
+
+## Build
+
+```sh
+pnpm --filter @dataimago/css-neutral build
+```
+
+Requires `@dataimago/tokens-neutral` to be built first (Turbo handles the ordering when running `pnpm -r build`).
+
+## Related
+
+- [`@dataimago/tokens-neutral`](../tokens-neutral) — the neutral tokens this preset reads
+- [`@dataimago/css`](../css) — house identity counterpart

package/dist/bin/dataimago-sync.mjs

@@ -0,0 +1,342 @@
+#!/usr/bin/env node
+/**
+ * dataimago-sync — pinned design-system sync for non-JS consumers (spec §4).
+ *
+ *   npx -p @dataimago/css@<version> dataimago-sync            write the files
+ *   npx -p @dataimago/css@<version> dataimago-sync --check    exit 1 on any drift
+ *   dataimago-sync --from <dataimago-design checkout>         try an unreleased build
+ *   node tools/formats/dataimago-sync.mjs --self-test         (repo only)
+ *
+ * Reads the consumer's .dataimago/design.json (or --config <path>):
+ *   { "package": "@dataimago/css", "version": "<exact>",
+ *     "outputs": { "<dist path>": "<destination dir/ or file>" } }
+ *
+ * Copies bytes from THIS package's own dist/ — no download, no transformation;
+ * every format decision lives in the dataimago-design build. Exit codes:
+ * 0 ok, 1 check failed, 2 configuration error (nothing written).
+ *
+ * Node built-ins only: this file ships in @dataimago/css and
+ * @dataimago/css-neutral dist/bin/. The stamp grammar it reads is defined in
+ * tools/formats/stamp.mjs — change both together.
+ */
+
+import { spawnSync } from 'node:child_process';
+import fs from 'node:fs';
+import os from 'node:os';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const LOCAL = 'local-unreleased';
+
+class ConfigError extends Error {}
+
+function readJson(file, what) {
+  try {
+    return JSON.parse(fs.readFileSync(file, 'utf8'));
+  } catch (e) {
+    throw new ConfigError(`cannot read ${what} at ${file}: ${e.message}`);
+  }
+}
+
+const USAGE = `dataimago-sync — copy a pinned @dataimago release's design files into this repo
+
+  dataimago-sync                     write the files listed in .dataimago/design.json
+  dataimago-sync --check             exit 1 if any listed file differs from the release
+  dataimago-sync --from <checkout>   write a local, unreleased build (--check then fails)
+  dataimago-sync --config <file>     read design.json from <file>
+  dataimago-sync --help              this text
+
+Run it from the pinned release: npx -p @dataimago/css@<version> dataimago-sync`;
+
+const FLAGS = new Set(['--check', '--help', '--self-test']);
+const VALUE_FLAGS = new Set(['--from', '--config']);
+
+/** Refuse unknown flags before anything runs: a typo'd --check must not silently re-sync. */
+function checkArgs(args) {
+  for (let i = 0; i < args.length; i++) {
+    if (VALUE_FLAGS.has(args[i])) { i += 1; continue; }
+    if (!FLAGS.has(args[i])) throw new ConfigError(`unknown argument ${args[i]} (see --help)`);
+  }
+}
+
+function argValue(args, flag) {
+  const i = args.indexOf(flag);
+  if (i === -1) return null;
+  if (!args[i + 1] || args[i + 1].startsWith('--')) throw new ConfigError(`${flag} needs a path`);
+  return path.resolve(args[i + 1]);
+}
+
+/** The package this bin ships in: dist/bin/dataimago-sync.mjs → ../.. (symlinks resolved). */
+function ownPackageRoot() {
+  return path.resolve(path.dirname(fileURLToPath(import.meta.url)), '..', '..');
+}
+
+/** Rewrite only the stamp's version tokens to mark a copy as local and unreleased. */
+function localize(text, distPath, pkg, version, sha) {
+  const marker = `${LOCAL}(${sha})`;
+  if (distPath.endsWith('.json')) {
+    const parsed = JSON.parse(text);
+    parsed._meta.version = marker;
+    parsed._meta.restore = String(parsed._meta.restore).replace(`${pkg}@${version}`, `${pkg}@${marker}`);
+    return JSON.stringify(parsed, null, 2) + '\n';
+  }
+  const nl = text.indexOf('\n');
+  return text.slice(0, nl).split(`${pkg}@${version}`).join(`${pkg}@${marker}`) + text.slice(nl);
+}
+
+function gitShortSha(dir) {
+  const r = spawnSync('git', ['-C', dir, 'rev-parse', '--short', 'HEAD'], { encoding: 'utf8' });
+  return r.status === 0 ? r.stdout.trim() : 'unknown';
+}
+
+/** Validate everything, return the plan of {key, src, dest}; throws ConfigError before any write. */
+function plan(args) {
+  const configPath = argValue(args, '--config') ?? path.resolve('.dataimago', 'design.json');
+  // The consumer root holds .dataimago/; a --config file elsewhere is its own root.
+  const configDir = path.dirname(configPath);
+  const consumerRoot = path.basename(configDir) === '.dataimago' ? path.dirname(configDir) : configDir;
+  const design = readJson(configPath, 'design.json');
+  if (typeof design.package !== 'string' || typeof design.version !== 'string' || !design.outputs || typeof design.outputs !== 'object') {
+    throw new ConfigError('design.json needs "package", "version" and an "outputs" object');
+  }
+
+  const fromCheckout = argValue(args, '--from');
+  const own = readJson(path.join(ownPackageRoot(), 'package.json'), 'package.json of this bin');
+  if (design.package !== own.name) {
+    throw new ConfigError(`design.json asks for ${design.package}, but this is ${own.name}. Run: npx -p ${design.package}@${design.version} dataimago-sync`);
+  }
+  let pkgRoot = ownPackageRoot();
+  let local = null;
+  if (fromCheckout) {
+    pkgRoot = path.join(fromCheckout, 'packages', design.package.replace(/^@dataimago\//, ''));
+    const built = readJson(path.join(pkgRoot, 'package.json'), `${design.package} in the --from checkout`);
+    local = { version: built.version, sha: gitShortSha(fromCheckout) };
+  } else if (design.version !== own.version) {
+    throw new ConfigError(`design.json pins ${design.package}@${design.version}, but this is ${own.version}. Run: npx -p ${design.package}@${design.version} dataimago-sync`);
+  }
+
+  const manifest = readJson(path.join(pkgRoot, 'dist', 'outputs.json'), 'outputs.json (is the package built?)');
+  const available = Object.keys(manifest.files ?? {});
+  const steps = [];
+  const problems = [];
+  for (const [key, destSpec] of Object.entries(design.outputs)) {
+    if (!available.includes(key)) {
+      problems.push(`${design.package} does not ship "${key}". Available outputs:\n    ${available.join('\n    ')}`);
+      continue;
+    }
+    if (typeof destSpec !== 'string' || destSpec === '' || path.isAbsolute(destSpec)) {
+      problems.push(`destination for "${key}" must be a relative path inside the consumer, got ${JSON.stringify(destSpec)}`);
+      continue;
+    }
+    const dest = path.resolve(consumerRoot, destSpec.endsWith('/') ? path.join(destSpec, path.basename(key)) : destSpec);
+    const rel = path.relative(consumerRoot, dest);
+    if (rel.startsWith('..') || path.isAbsolute(rel)) {
+      problems.push(`destination for "${key}" escapes the consumer root: ${destSpec}`);
+      continue;
+    }
+    if (rel === '' || (fs.existsSync(dest) && fs.statSync(dest).isDirectory())) {
+      problems.push(`destination for "${key}" is a directory: write "${destSpec.replace(/\/?$/, '/')}" to put the file inside it`);
+      continue;
+    }
+    if (steps.some((s) => s.dest === dest)) {
+      problems.push(`two outputs are mapped to the same destination: ${rel}`);
+      continue;
+    }
+    steps.push({ key, src: path.join(pkgRoot, 'dist', key), dest, rel });
+  }
+  if (problems.length) throw new ConfigError(problems.join('\n  '));
+  return { steps, design, local };
+}
+
+function sync(args) {
+  const { steps, design, local } = plan(args);
+  for (const { key, src, dest, rel } of steps) {
+    let bytes = fs.readFileSync(src);
+    if (local) bytes = Buffer.from(localize(bytes.toString('utf8'), key, design.package, local.version, local.sha));
+    fs.mkdirSync(path.dirname(dest), { recursive: true });
+    fs.writeFileSync(dest, bytes);
+    console.log(`  ✓ ${rel}  ← ${design.package}@${local ? `${LOCAL}(${local.sha})` : design.version} dist/${key}`);
+  }
+  if (local) console.log(`\n⚠ local, unreleased design files: \`dataimago-sync --check\` fails until you re-sync from a release.`);
+  return 0;
+}
+
+function check(args) {
+  const { steps, design } = plan(args.filter((a) => a !== '--check'));
+  const failures = [];
+  for (const { src, dest, rel } of steps) {
+    if (!fs.existsSync(dest)) { failures.push(`${rel}: missing`); continue; }
+    const have = fs.readFileSync(dest);
+    // The marker lives in the stamp: line 1, or the leading _meta object of a JSON file.
+    if (have.subarray(0, 1024).includes(LOCAL)) { failures.push(`${rel}: written by --from (local, unreleased); re-sync from a release`); continue; }
+    if (!have.equals(fs.readFileSync(src))) failures.push(`${rel}: differs from ${design.package}@${design.version}`);
+  }
+  for (const f of failures) console.error(`  ✗ ${f}`);
+  if (failures.length) {
+    console.error(`\n✗ dataimago-sync --check: ${failures.length} file(s) out of sync. Run: npx -p ${design.package}@${design.version} dataimago-sync`);
+    return 1;
+  }
+  console.log(`✓ dataimago-sync --check: ${steps.length} file(s) match ${design.package}@${design.version}`);
+  return 0;
+}
+
+function main(args) {
+  try {
+    checkArgs(args);
+    if (args.includes('--help')) {
+      console.log(USAGE);
+      return 0;
+    }
+    if (args.includes('--check')) {
+      if (args.includes('--from')) throw new ConfigError('--check verifies a release; it cannot be combined with --from');
+      return check(args);
+    }
+    return sync(args);
+  } catch (e) {
+    if (e instanceof ConfigError) {
+      console.error(`✗ dataimago-sync: ${e.message}`);
+      return 2;
+    }
+    throw e;
+  }
+}
+
+// ─── Self-test ────────────────────────────────────────────────────────────────
+
+async function selfTest() {
+  const stampUrl = new URL('./stamp.mjs', import.meta.url);
+  if (!fs.existsSync(fileURLToPath(stampUrl))) {
+    console.error('dataimago-sync --self-test runs from the dataimago-design repo (tools/formats/).');
+    process.exit(2);
+  }
+  const { stamp, stampJson } = await import(stampUrl);
+  const assert = (await import('node:assert/strict')).default;
+  const tmp = fs.mkdtempSync(path.join(os.tmpdir(), 'di-sync-'));
+
+  // A fake published package: <tmp>/pkg with dist/{quarto/a.scss, dataviz/p.json, outputs.json, bin/}.
+  function makePackage(root, name, version) {
+    const files = {
+      'quarto/a.scss': stamp({ kind: 'scss', pkg: name, version, distPath: 'quarto/a.scss', body: '$x: 1 !default;\n' }),
+      'dataviz/p.json': stampJson({ pkg: name, version, distPath: 'dataviz/p.json', data: { a: '#E69F00' } }),
+    };
+    fs.mkdirSync(path.join(root, 'dist', 'bin'), { recursive: true });
+    fs.writeFileSync(path.join(root, 'package.json'), JSON.stringify({ name, version }));
+    for (const [p, text] of Object.entries(files)) {
+      fs.mkdirSync(path.dirname(path.join(root, 'dist', p)), { recursive: true });
+      fs.writeFileSync(path.join(root, 'dist', p), text);
+    }
+    fs.writeFileSync(path.join(root, 'dist', 'outputs.json'), JSON.stringify({ package: name, version, files: Object.fromEntries(Object.keys(files).sort().map((k) => [k, 'x'])) }, null, 2));
+    fs.copyFileSync(fileURLToPath(import.meta.url), path.join(root, 'dist', 'bin', 'dataimago-sync.mjs'));
+    return { files, bin: path.join(root, 'dist', 'bin', 'dataimago-sync.mjs') };
+  }
+  const pkg = makePackage(path.join(tmp, 'pkg'), '@dataimago/css', '9.9.9');
+  // A fake dataimago-design checkout for --from: packages/css/{package.json,dist/}.
+  makePackage(path.join(tmp, 'checkout', 'packages', 'css'), '@dataimago/css', '9.9.10');
+
+  const consumer = path.join(tmp, 'consumer');
+  const writeDesign = (design) => {
+    fs.mkdirSync(path.join(consumer, '.dataimago'), { recursive: true });
+    fs.writeFileSync(path.join(consumer, '.dataimago', 'design.json'), JSON.stringify(design));
+  };
+  const base = { package: '@dataimago/css', version: '9.9.9', outputs: { 'quarto/a.scss': 'styles/', 'dataviz/p.json': 'figs/palette.json' } };
+  const run = (...args) => spawnSync(process.execPath, [pkg.bin, ...args], { cwd: consumer, encoding: 'utf8' });
+  const exists = (rel) => fs.existsSync(path.join(consumer, rel));
+
+  // (a) sync writes exact bytes; --check passes.
+  writeDesign(base);
+  let r = run();
+  assert.equal(r.status, 0, r.stderr);
+  assert.equal(fs.readFileSync(path.join(consumer, 'styles/a.scss'), 'utf8'), pkg.files['quarto/a.scss']);
+  assert.equal(fs.readFileSync(path.join(consumer, 'figs/palette.json'), 'utf8'), pkg.files['dataviz/p.json']);
+  assert.equal(run('--check').status, 0);
+
+  // (b) one appended byte fails --check, naming the file.
+  fs.appendFileSync(path.join(consumer, 'styles/a.scss'), ' ');
+  r = run('--check');
+  assert.equal(r.status, 1);
+  assert.match(r.stdout + r.stderr, /styles\/a\.scss/);
+  run();
+
+  // (c) version mismatch: config error with the matching command.
+  writeDesign({ ...base, version: '9.9.8' });
+  r = run();
+  assert.equal(r.status, 2);
+  assert.match(r.stderr, /npx -p @dataimago\/css@9\.9\.8 dataimago-sync/);
+
+  // (d) an output the package does not ship: config error, lists outputs, writes nothing.
+  fs.rmSync(path.join(consumer, 'styles'), { recursive: true });
+  writeDesign({ ...base, outputs: { ...base.outputs, 'quarto/components.scss': 'styles/' } });
+  r = run();
+  assert.equal(r.status, 2);
+  assert.match(r.stderr, /quarto\/components\.scss/);
+  assert.match(r.stderr, /dataviz\/p\.json/);
+  assert.ok(!exists('styles/a.scss'), 'nothing written on a config error');
+
+  // (e) destinations escaping the consumer root are refused before writing.
+  for (const dest of ['../x/', '/abs/']) {
+    writeDesign({ ...base, outputs: { 'quarto/a.scss': 'styles/', 'dataviz/p.json': dest } });
+    r = run();
+    assert.equal(r.status, 2, `destination ${dest} must be refused`);
+    assert.ok(!exists('styles/a.scss'), `nothing written when ${dest} is refused`);
+  }
+  assert.ok(!fs.existsSync(path.join(tmp, 'x')));
+
+  // (f) --from writes local-unreleased stamps that --check always rejects.
+  writeDesign(base);
+  r = run('--from', path.join(tmp, 'checkout'));
+  assert.equal(r.status, 0, r.stderr);
+  assert.match(fs.readFileSync(path.join(consumer, 'styles/a.scss'), 'utf8').split('\n')[0], new RegExp(LOCAL));
+  assert.match(fs.readFileSync(path.join(consumer, 'figs/palette.json'), 'utf8'), new RegExp(LOCAL));
+  r = run('--check');
+  assert.equal(r.status, 1);
+  assert.match(r.stdout + r.stderr, /--from/);
+
+  // (g) a design.json for another package is a config error.
+  writeDesign({ ...base, package: '@dataimago/css-neutral' });
+  assert.equal(run().status, 2);
+
+  // (h) --config outside .dataimago/: the consumer root is the config's own directory.
+  fs.rmSync(path.join(consumer, 'styles'), { recursive: true, force: true });
+  fs.writeFileSync(path.join(consumer, 'design.json'), JSON.stringify(base));
+  r = run('--config', path.join(consumer, 'design.json'));
+  assert.equal(r.status, 0, r.stderr);
+  assert.ok(exists('styles/a.scss'), '--config ./design.json writes inside the consumer');
+  assert.ok(!fs.existsSync(path.join(tmp, 'styles')), 'nothing written above the consumer');
+  fs.rmSync(path.join(consumer, 'design.json'));
+
+  // (i) an unknown flag (a typo'd --check) is a config error and writes nothing; --help writes nothing.
+  writeDesign(base);
+  const before = fs.readFileSync(path.join(consumer, 'styles/a.scss'));
+  fs.appendFileSync(path.join(consumer, 'styles/a.scss'), 'x');
+  r = run('--chek');
+  assert.equal(r.status, 2);
+  assert.match(r.stderr, /--chek/);
+  r = run('--help');
+  assert.equal(r.status, 0);
+  assert.match(r.stdout, /--check/);
+  assert.notDeepEqual(fs.readFileSync(path.join(consumer, 'styles/a.scss')), before, 'neither run re-synced');
+  run();
+
+  // (j) a destination that is the root or an existing directory (no trailing /) is refused up front.
+  fs.rmSync(path.join(consumer, 'figs'), { recursive: true, force: true });
+  fs.mkdirSync(path.join(consumer, 'figs'));
+  for (const dest of ['.', 'figs']) {
+    fs.rmSync(path.join(consumer, 'styles'), { recursive: true, force: true });
+    writeDesign({ ...base, outputs: { 'quarto/a.scss': 'styles/', 'dataviz/p.json': dest } });
+    r = run();
+    assert.equal(r.status, 2, `destination ${dest} must be refused`);
+    assert.ok(!exists('styles/a.scss'), `nothing written when ${dest} is refused`);
+  }
+
+  // (k) two outputs on one destination is a config error.
+  writeDesign({ ...base, outputs: { 'quarto/a.scss': 'same.txt', 'dataviz/p.json': 'same.txt' } });
+  r = run();
+  assert.equal(r.status, 2);
+  assert.ok(!exists('same.txt'));
+
+  fs.rmSync(tmp, { recursive: true, force: true });
+  console.log('dataimago-sync self-test: all checks passed');
+}
+
+if (process.argv.includes('--self-test')) await selfTest();
+else process.exitCode = main(process.argv.slice(2));

package/dist/dataviz/dataimago-dataviz.css

@@ -0,0 +1,42 @@
+/* @dataimago/css-neutral@0.1.0-alpha.10 dist/dataviz/dataimago-dataviz.css · sha256:4fb36e2401c1cd21f57d50c017ac080377c3943362a5b6c5ce2cd658080e4499 · generated from tokens; do not edit · restore: npx -p @dataimago/css-neutral@0.1.0-alpha.10 dataimago-sync */
+/* dataimago data-viz palette (Okabe-Ito). Categorical colour is never the only channel. */
+:root, [data-bs-theme="light"], body.quarto-light {
+  --color-dataviz-okabe-ito-orange: #E69F00;
+  --color-dataviz-okabe-ito-sky-blue: #56B4E9;
+  --color-dataviz-okabe-ito-bluish-green: #009E73;
+  --color-dataviz-okabe-ito-yellow: #F0E442;
+  --color-dataviz-okabe-ito-blue: #0072B2;
+  --color-dataviz-okabe-ito-vermillion: #D55E00;
+  --color-dataviz-okabe-ito-reddish-purple: #CC79A7;
+  --color-dataviz-okabe-ito-black: #000000;
+  --color-dataviz-categorical-1: #E69F00;
+  --color-dataviz-categorical-2: #56B4E9;
+  --color-dataviz-categorical-3: #009E73;
+  --color-dataviz-categorical-4: #F0E442;
+  --color-dataviz-categorical-5: #0072B2;
+  --color-dataviz-categorical-6: #D55E00;
+  --color-dataviz-categorical-7: #CC79A7;
+  --color-dataviz-categorical-8: #000000;
+  --color-dataviz-uncertainty-outer: #D6D6D6;
+  --color-dataviz-uncertainty-union: #9E9E9E;
+  --color-dataviz-uncertainty-inner: #333333;
+}
+
+[data-bs-theme="dark"],
+body.quarto-dark {
+  --color-dataviz-okabe-ito-black: #FDF9F2;
+  --color-dataviz-categorical-8: #FDF9F2;
+  --color-dataviz-uncertainty-outer: #333333;
+  --color-dataviz-uncertainty-union: #6B6B6B;
+  --color-dataviz-uncertainty-inner: #D6D6D6;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:where(:not([data-bs-theme="light"])) {
+    --color-dataviz-okabe-ito-black: #FDF9F2;
+    --color-dataviz-categorical-8: #FDF9F2;
+    --color-dataviz-uncertainty-outer: #333333;
+    --color-dataviz-uncertainty-union: #6B6B6B;
+    --color-dataviz-uncertainty-inner: #D6D6D6;
+  }
+}

package/dist/dataviz/dataimago-dataviz.json

@@ -0,0 +1,42 @@
+{
+  "_meta": {
+    "package": "@dataimago/css-neutral",
+    "version": "0.1.0-alpha.10",
+    "path": "dist/dataviz/dataimago-dataviz.json",
+    "sha256": "28160e151fca196be3e36790d6b67db232d8df060e8d9556b29dfee50f4b278b",
+    "note": "generated from tokens; do not edit",
+    "restore": "npx -p @dataimago/css-neutral@0.1.0-alpha.10 dataimago-sync"
+  },
+  "okabe-ito": {
+    "orange": "#E69F00",
+    "sky-blue": "#56B4E9",
+    "bluish-green": "#009E73",
+    "yellow": "#F0E442",
+    "blue": "#0072B2",
+    "vermillion": "#D55E00",
+    "reddish-purple": "#CC79A7",
+    "black": "#000000"
+  },
+  "categorical": [
+    "#E69F00",
+    "#56B4E9",
+    "#009E73",
+    "#F0E442",
+    "#0072B2",
+    "#D55E00",
+    "#CC79A7",
+    "#000000"
+  ],
+  "uncertainty": {
+    "outer": "#D6D6D6",
+    "union": "#9E9E9E",
+    "inner": "#333333"
+  },
+  "dark": {
+    "okabe-ito.black": "#FDF9F2",
+    "categorical.8": "#FDF9F2",
+    "uncertainty.outer": "#333333",
+    "uncertainty.union": "#6B6B6B",
+    "uncertainty.inner": "#D6D6D6"
+  }
+}

package/dist/dataviz/dataimago-dataviz.tex

@@ -0,0 +1,21 @@
+% @dataimago/css-neutral@0.1.0-alpha.10 dist/dataviz/dataimago-dataviz.tex · sha256:d7be36cb429ce8a1f19c95a7da8f57a7fcfda85fd2b0113e086913d37e9fa645 · generated from tokens; do not edit · restore: npx -p @dataimago/css-neutral@0.1.0-alpha.10 dataimago-sync
+% dataimago data-viz palette (Okabe-Ito), light mode, for PSTricks and TikZ. Requires xcolor.
+\definecolor{di-dataviz-okabe-ito-orange}{HTML}{E69F00}
+\definecolor{di-dataviz-okabe-ito-sky-blue}{HTML}{56B4E9}
+\definecolor{di-dataviz-okabe-ito-bluish-green}{HTML}{009E73}
+\definecolor{di-dataviz-okabe-ito-yellow}{HTML}{F0E442}
+\definecolor{di-dataviz-okabe-ito-blue}{HTML}{0072B2}
+\definecolor{di-dataviz-okabe-ito-vermillion}{HTML}{D55E00}
+\definecolor{di-dataviz-okabe-ito-reddish-purple}{HTML}{CC79A7}
+\definecolor{di-dataviz-okabe-ito-black}{HTML}{000000}
+\colorlet{di-dataviz-categorical-1}{di-dataviz-okabe-ito-orange}
+\colorlet{di-dataviz-categorical-2}{di-dataviz-okabe-ito-sky-blue}
+\colorlet{di-dataviz-categorical-3}{di-dataviz-okabe-ito-bluish-green}
+\colorlet{di-dataviz-categorical-4}{di-dataviz-okabe-ito-yellow}
+\colorlet{di-dataviz-categorical-5}{di-dataviz-okabe-ito-blue}
+\colorlet{di-dataviz-categorical-6}{di-dataviz-okabe-ito-vermillion}
+\colorlet{di-dataviz-categorical-7}{di-dataviz-okabe-ito-reddish-purple}
+\colorlet{di-dataviz-categorical-8}{di-dataviz-okabe-ito-black}
+\definecolor{di-dataviz-uncertainty-outer}{HTML}{D6D6D6}
+\definecolor{di-dataviz-uncertainty-union}{HTML}{9E9E9E}
+\definecolor{di-dataviz-uncertainty-inner}{HTML}{333333}

package/dist/dataviz/dataimago_dataviz.R

@@ -0,0 +1,61 @@
+# @dataimago/css-neutral@0.1.0-alpha.10 dist/dataviz/dataimago_dataviz.R · sha256:6443982f105b0f5e4a9d90ac2d1f6ce9fce2db4e8e8148b47f71bfc438940055 · generated from tokens; do not edit · restore: npx -p @dataimago/css-neutral@0.1.0-alpha.10 dataimago-sync
+# dataimago data-viz palette (Okabe-Ito). Categorical colour is never the only channel:
+# pair it with marker shape, line type or a label.
+
+dataimago_okabe_ito <- c(
+  orange = "#E69F00",
+  sky_blue = "#56B4E9",
+  bluish_green = "#009E73",
+  yellow = "#F0E442",
+  blue = "#0072B2",
+  vermillion = "#D55E00",
+  reddish_purple = "#CC79A7",
+  black = "#000000"
+)
+
+dataimago_categorical <- c(
+  "#E69F00",
+  "#56B4E9",
+  "#009E73",
+  "#F0E442",
+  "#0072B2",
+  "#D55E00",
+  "#CC79A7",
+  "#000000"
+)
+
+dataimago_uncertainty_bands <- c(
+  outer = "#D6D6D6",
+  union = "#9E9E9E",
+  inner = "#333333"
+)
+
+# Dark-mode variants (approved overrides; identical elsewhere).
+
+dataimago_okabe_ito_dark <- c(
+  orange = "#E69F00",
+  sky_blue = "#56B4E9",
+  bluish_green = "#009E73",
+  yellow = "#F0E442",
+  blue = "#0072B2",
+  vermillion = "#D55E00",
+  reddish_purple = "#CC79A7",
+  black = "#FDF9F2"
+)
+
+dataimago_categorical_dark <- c(
+  "#E69F00",
+  "#56B4E9",
+  "#009E73",
+  "#F0E442",
+  "#0072B2",
+  "#D55E00",
+  "#CC79A7",
+  "#FDF9F2"
+)
+
+dataimago_uncertainty_bands_dark <- c(
+  outer = "#333333",
+  union = "#6B6B6B",
+  inner = "#D6D6D6"
+)