@dstally/tokens 1.0.0

package/README.md

@@ -0,0 +1,28 @@
+# @dstally/tokens
+
+```ts
+import '@dstally/tokens/styles.css'
+```
+
+That one import gives you every `--*` variable, the element baseline (`body`, headings, links, focus rings), the `.tally-num` / `.tally-overline` / `.tally-container` helpers, and the webfonts.
+
+Dark is `:root`. Light is `[data-theme="light"]` on any ancestor.
+
+## Files
+
+- `tokens/colors.css` — indigo / amber / blue / neutral ramps, Okabe-Ito chart palette, semantic aliases for both themes.
+- `tokens/typography.css` — scale, weights, timer sizes.
+- `tokens/spacing.css` — 4px grid, layout widths, control heights.
+- `tokens/elevation.css` — radii, shadows, blur, scrim.
+- `tokens/motion.css` — durations, easings, reduced-motion.
+- `tokens/fonts.css` — font stacks. Currently loads Instrument Sans + JetBrains Mono from Google Fonts; swap for local `@font-face` when licensed files exist.
+- `tokens/base.css` — element defaults.
+- `assets/` — `logo.svg` (64px+), `logo-small.svg` (16/32), PNG exports 16→1024.
+
+## Rails
+
+Copy `styles.css` and `tokens/` into `app/assets/stylesheets/tally/` (or vendor the package via importmap/jsbundling) and include it before application styles. Reports and emails then use the same variables as the apps.
+
+## Rules
+
+Use the semantic alias (`--surface-card`, `--text-body`, `--action-primary`), never the base ramp (`--neutral-850`). Charts and project colours use `--chart-1…8` only.

package/assets/icon-README.md

@@ -0,0 +1,32 @@
+# Tally — app icon
+
+Four white uprights and an amber fifth mark drawn as a growth curve, on a deep indigo
+gradient.
+
+## Files
+
+- `tally.svg` — vector master. Use for 64 px and up.
+- `tally-small.svg` — 16 and 32 px artwork. Three uprights instead of four, strokes
+  widened 68 → 104. At 16 px the icon shape is only 12.9 px wide, which fits three
+  strokes with usable gaps but not four; the full mark turns to grey haze.
+- `png/` — flat exports. 16 and 32 come from `tally-small.svg`.
+- `Tally.iconset/` — the same PNGs under Apple's names. Delete it if your build pipeline
+  generates its own.
+
+## Build
+
+```
+iconutil -c icns Tally.iconset -o Tally.icns
+```
+
+## Specs
+
+1024 × 1024 canvas, icon shape 824 wide and centred, corner radius 181.3 (22%),
+transparent outside the shape, no baked shadow.
+
+Background `#4A57D2 → #2C3391 → #151A54`, with a 16% white lift from the top edge.
+Marks `#FFFFFF`. Curve `#F5A524`.
+
+The curve is one cubic Bézier with a round cap. Its control points sit symmetrically about
+the chord, which is what keeps the bend even along the whole stroke — if you edit it, keep
+them mirrored or it develops an elbow.

package/assets/logo-small.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024" xmlns:c2pa="http://c2pa.org/manifest"><metadata><c2pa:manifest>AAAWgmp1bWIAAAAeanVtZGMycGEAEQAQgAAAqgA4m3EDYzJwYQAAABZcanVtYgAAAEdqdW1kYzJtYQARABCAAACqADibcQN1cm46YzJwYTpjNjk3NDQ4My0yYTI4LTQ1NjctYjA1Yy0zOWY0NDI3N2Q5Y2UAAAADl2p1bWIAAAApanVtZGMyYXMAEQAQgAAAqgA4m3EDYzJwYS5hc3NlcnRpb25zAAAAALxqdW1iAAAARGp1bWRjYm9yABEAEIAAAKoAOJtxE2MycGEuaW5ncmVkaWVudC52MwAAAAAYYzJzaKxhLNdO+z/3SL5VjI6QiKUAAABwY2JvcqNpZGM6Zm9ybWF0bWltYWdlL3N2Zyt4bWxqaW5zdGFuY2VJRHgseG1wOmlpZDowMzA4ZTU1Mi01MTlkLTQyNzQtYTFmZC05ZTNhZjI2NTY4NTFscmVsYXRpb25zaGlwaHBhcmVudE9mAAAB4mp1bWIAAABBanVtZGNib3IAEQAQgAAAqgA4m3ETYzJwYS5hY3Rpb25zLnYyAAAAABhjMnNo8RlcpgmHCdRmg8pin7mxPwAAAZljYm9yomdhY3Rpb25zgqJmYWN0aW9ua2MycGEub3BlbmVkanBhcmFtZXRlcnOha2luZ3JlZGllbnRzgaJjdXJseC1zZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmluZ3JlZGllbnQudjNkaGFzaFggLQMC+Up3WMiYZeFP+4NkioKnGS4/EcCM9XYlgcwDPGWkZmFjdGlvbngdY29tLmFudGhyb3BpYy5jbGF1ZGUucHJvdmlkZWRqcGFyYW1ldGVyc6F4H2NvbS5hbnRocm9waWMub3JpZ2luLWNvbmZpZGVuY2VndW5rbm93bmtkZXNjcmlwdGlvbnhmQ2xhdWRlIHByb3ZpZGVkIHRoaXMgZmlsZSBhdCB0aGUgcmVxdWVzdCBvZiBhIHVzZXIgYW5kIG1heSBoYXZlIGNyZWF0ZWQgb3IgbW9kaWZpZWQgdGhlIGZpbGUgY29udGVudHMubXNvZnR3YXJlQWdlbnShZG5hbWVmQ2xhdWRlcmFsbEFjdGlvbnNJbmNsdWRlZPUAAADIanVtYgAAAEBqdW1kY2JvcgARABCAAACqADibcRNjMnBhLmhhc2guZGF0YQAAAAAYYzJzaGLd3VB9nz48NWno5vB3yccAAACAY2JvcqVjYWxnZnNoYTI1NmNwYWRNAAAAAAAAAAAAAAAAAGRoYXNoWCClVpTG+J3oHO5viktt28rnxSEmYxBWSirDCi92C/VUR2RuYW1lbmp1bWJmIG1hbmlmZXN0amV4Y2x1c2lvbnOBomVzdGFydBiaZmxlbmd0aBkeBAAAAj5qdW1iAAAAJ2p1bWRjMmNsABEAEIAAAKoAOJtxA2MycGEuY2xhaW0udjIAAAACD2Nib3KlY2FsZ2ZzaGEyNTZpc2lnbmF0dXJleE1zZWxmI2p1bWJmPS9jMnBhL3VybjpjMnBhOmM2OTc0NDgzLTJhMjgtNDU2Ny1iMDVjLTM5ZjQ0Mjc3ZDljZS9jMnBhLnNpZ25hdHVyZWppbnN0YW5jZUlEeCx4bXA6aWlkOjAxNmRlMTM5LTA4MmQtNDBiNS05MzcyLTg3NjZkZTliZWM0NXJjcmVhdGVkX2Fzc2VydGlvbnODomN1cmx4LXNlbGYjanVtYmY9YzJwYS5hc3NlcnRpb25zL2MycGEuaW5ncmVkaWVudC52M2RoYXNoWCAtAwL5SndYyJhl4U/7g2SKgqcZLj8RwIz1diWBzAM8ZaJjdXJseCpzZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmFjdGlvbnMudjJkaGFzaFggfJxdwa97MJ3XPnmID2fk+wKPsIjCk0BGws8iVWdLSCSiY3VybHgpc2VsZiNqdW1iZj1jMnBhLmFzc2VydGlvbnMvYzJwYS5oYXNoLmRhdGFkaGFzaFggDjRexpit+/ZOgcj4M81MSi8D+KYfhrGhsVQ4W8CWqgp0Y2xhaW1fZ2VuZXJhdG9yX2luZm+jZG5hbWVvQW50aHJvcGljIEZpbGVzZ3ZlcnNpb25lMS4wLjBrc3BlY1ZlcnNpb25lMi40LjAAABA4anVtYgAAAChqdW1kYzJjcwARABCAAACqADibcQNjMnBhLnNpZ25hdHVyZQAAABAIY2JvctKEWQISogEmGCFZAgowggIGMIIBjaADAgECAhRA5aAK7sI50L64g/oGQgU9Z1UTADAKBggqhkjOPQQDAzBJMRcwFQYDVQQKEw5BbnRocm9waWMsIFBCQzEuMCwGA1UEAxMlQW50aHJvcGljIENvbnRlbnQgQ3JlZGVudGlhbHMgUm9vdCBDQTAeFw0yNjA4MDcxODQzNTZaFw0yODA4MDYxOTQzNTZaMEQxFzAVBgNVBAoTDkFudGhyb3BpYywgUEJDMSkwJwYDVQQDEyBBbnRocm9waWMgQ2xhdWRlIENvbnRlbnQgU2lnbmluZzBZMBMGByqGSM49AgEGCCqGSM49AwEHA0IABJh6CmvLUBgFFNU0vUKlOVtE6djd17L5SuwX0LemFisBM3dkd/3cyjxFA3Qo5S46fX0/ihY0VZ7mfb9KF703t5OjWDBWMA4GA1UdDwEB/wQEAwIHgDAVBgNVHSUEDjAMBgorBgEEAYPoXgIBMAwGA1UdEwEB/wQCMAAwHwYDVR0jBBgwFoAUzlHiBIFOZFsj+OPEz5o+nMHXXMIwCgYIKoZIzj0EAwMDZwAwZAIwMXMdFJ4BetLLVY7ORuE9noqbbAZOZn/aArXyTwFAZfKrPzxF2vPoJNf1+UCdg1XGAjBwX1zd9WGqYkqmL5SFqw1QySjr1zJfpJM9+1rdDwSPLMOPOjKuiXjoU/pUUeG9RwmhY3BhZFkNngAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPZYQJ/1HIGpfLh9Tv/M39XcWDXgYwig+wqdH3BitHbsSGXhClftsHuJmLNMj9cnzdFfmmy7Omlxi85LsA0xnt9/U+4=</c2pa:manifest></metadata>
+<defs>
+<linearGradient id="bg" x1="0" y1="0" x2="0.35" y2="1"><stop offset="0" stop-color="#4A57D2"></stop><stop offset="0.55" stop-color="#2C3391"></stop><stop offset="1" stop-color="#151A54"></stop></linearGradient>
+<radialGradient id="lift" cx="0.5" cy="0.06" r="0.85"><stop offset="0" stop-color="#FFFFFF" stop-opacity="0.16"></stop><stop offset="1" stop-color="#FFFFFF" stop-opacity="0"></stop></radialGradient>
+<clipPath id="mask"><rect x="100.0" y="100.0" width="824" height="824" rx="181.3" ry="181.3"></rect></clipPath>
+</defs>
+<rect id="icon-shape" x="100.0" y="100.0" width="824" height="824" rx="181.3" ry="181.3" fill="url(#bg)"></rect>
+<rect x="100.0" y="100.0" width="824" height="824" rx="181.3" ry="181.3" fill="url(#lift)"></rect>
+<g clip-path="url(#mask)">
+<line x1="332" y1="300" x2="332" y2="724" stroke="#FFFFFF" stroke-width="104" stroke-linecap="round"></line>
+<line x1="512" y1="300" x2="512" y2="724" stroke="#FFFFFF" stroke-width="104" stroke-linecap="round"></line>
+<line x1="692" y1="300" x2="692" y2="724" stroke="#FFFFFF" stroke-width="104" stroke-linecap="round"></line>
+<path d="M 272 714 C 482.5 611.9, 615.8 497.1, 748 304" fill="none" stroke="#F5A524" stroke-width="110" stroke-linecap="round"></path>
+</g>
+</svg>

package/assets/logo.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024" xmlns:c2pa="http://c2pa.org/manifest"><metadata><c2pa:manifest>AAAWgmp1bWIAAAAeanVtZGMycGEAEQAQgAAAqgA4m3EDYzJwYQAAABZcanVtYgAAAEdqdW1kYzJtYQARABCAAACqADibcQN1cm46YzJwYTowNWViYjU5OC0yMmRiLTQ3N2EtOTllMS1iYmZiZmZhMWY2MzYAAAADl2p1bWIAAAApanVtZGMyYXMAEQAQgAAAqgA4m3EDYzJwYS5hc3NlcnRpb25zAAAAALxqdW1iAAAARGp1bWRjYm9yABEAEIAAAKoAOJtxE2MycGEuaW5ncmVkaWVudC52MwAAAAAYYzJzaPT/BoKeGEBfPoXe9mo1YOEAAABwY2JvcqNpZGM6Zm9ybWF0bWltYWdlL3N2Zyt4bWxqaW5zdGFuY2VJRHgseG1wOmlpZDphMmRmM2U1YS0zYTViLTRiOGUtODQ4OC1hZTgzM2NjOWI1YjFscmVsYXRpb25zaGlwaHBhcmVudE9mAAAB4mp1bWIAAABBanVtZGNib3IAEQAQgAAAqgA4m3ETYzJwYS5hY3Rpb25zLnYyAAAAABhjMnNotYysDq3FO8g1zO6WSn3uZQAAAZljYm9yomdhY3Rpb25zgqJmYWN0aW9ua2MycGEub3BlbmVkanBhcmFtZXRlcnOha2luZ3JlZGllbnRzgaJjdXJseC1zZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmluZ3JlZGllbnQudjNkaGFzaFggUjIPpTTjVa7TlPX4G1JZ+vw8aTlojdFbTCnkOqySpvWkZmFjdGlvbngdY29tLmFudGhyb3BpYy5jbGF1ZGUucHJvdmlkZWRqcGFyYW1ldGVyc6F4H2NvbS5hbnRocm9waWMub3JpZ2luLWNvbmZpZGVuY2VndW5rbm93bmtkZXNjcmlwdGlvbnhmQ2xhdWRlIHByb3ZpZGVkIHRoaXMgZmlsZSBhdCB0aGUgcmVxdWVzdCBvZiBhIHVzZXIgYW5kIG1heSBoYXZlIGNyZWF0ZWQgb3IgbW9kaWZpZWQgdGhlIGZpbGUgY29udGVudHMubXNvZnR3YXJlQWdlbnShZG5hbWVmQ2xhdWRlcmFsbEFjdGlvbnNJbmNsdWRlZPUAAADIanVtYgAAAEBqdW1kY2JvcgARABCAAACqADibcRNjMnBhLmhhc2guZGF0YQAAAAAYYzJzaGLKUChMJy0p4xHd4rRQlmMAAACAY2JvcqVjYWxnZnNoYTI1NmNwYWRNAAAAAAAAAAAAAAAAAGRoYXNoWCDNCxt6mfviPmkodwq+5uqBxQX9yKsVQlogoy8Mgv4KVWRuYW1lbmp1bWJmIG1hbmlmZXN0amV4Y2x1c2lvbnOBomVzdGFydBiaZmxlbmd0aBkeBAAAAj5qdW1iAAAAJ2p1bWRjMmNsABEAEIAAAKoAOJtxA2MycGEuY2xhaW0udjIAAAACD2Nib3KlY2FsZ2ZzaGEyNTZpc2lnbmF0dXJleE1zZWxmI2p1bWJmPS9jMnBhL3VybjpjMnBhOjA1ZWJiNTk4LTIyZGItNDc3YS05OWUxLWJiZmJmZmExZjYzNi9jMnBhLnNpZ25hdHVyZWppbnN0YW5jZUlEeCx4bXA6aWlkOmU2MTc4MDc3LWFlZTYtNDhhZS1hZTI0LTdmOThjY2JmNzliN3JjcmVhdGVkX2Fzc2VydGlvbnODomN1cmx4LXNlbGYjanVtYmY9YzJwYS5hc3NlcnRpb25zL2MycGEuaW5ncmVkaWVudC52M2RoYXNoWCBSMg+lNONVrtOU9fgbUln6/DxpOWiN0VtMKeQ6rJKm9aJjdXJseCpzZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmFjdGlvbnMudjJkaGFzaFggEViiyXc2OxHnP/Z+vYs+okLFDQE+j2UXoZE5XY8gUgeiY3VybHgpc2VsZiNqdW1iZj1jMnBhLmFzc2VydGlvbnMvYzJwYS5oYXNoLmRhdGFkaGFzaFggaG7v43NnVsoAj1pYdSumpuxeLcpyjtVo6c5xvUwwb790Y2xhaW1fZ2VuZXJhdG9yX2luZm+jZG5hbWVvQW50aHJvcGljIEZpbGVzZ3ZlcnNpb25lMS4wLjBrc3BlY1ZlcnNpb25lMi40LjAAABA4anVtYgAAAChqdW1kYzJjcwARABCAAACqADibcQNjMnBhLnNpZ25hdHVyZQAAABAIY2JvctKEWQISogEmGCFZAgowggIGMIIBjaADAgECAhRA5aAK7sI50L64g/oGQgU9Z1UTADAKBggqhkjOPQQDAzBJMRcwFQYDVQQKEw5BbnRocm9waWMsIFBCQzEuMCwGA1UEAxMlQW50aHJvcGljIENvbnRlbnQgQ3JlZGVudGlhbHMgUm9vdCBDQTAeFw0yNjA4MDcxODQzNTZaFw0yODA4MDYxOTQzNTZaMEQxFzAVBgNVBAoTDkFudGhyb3BpYywgUEJDMSkwJwYDVQQDEyBBbnRocm9waWMgQ2xhdWRlIENvbnRlbnQgU2lnbmluZzBZMBMGByqGSM49AgEGCCqGSM49AwEHA0IABJh6CmvLUBgFFNU0vUKlOVtE6djd17L5SuwX0LemFisBM3dkd/3cyjxFA3Qo5S46fX0/ihY0VZ7mfb9KF703t5OjWDBWMA4GA1UdDwEB/wQEAwIHgDAVBgNVHSUEDjAMBgorBgEEAYPoXgIBMAwGA1UdEwEB/wQCMAAwHwYDVR0jBBgwFoAUzlHiBIFOZFsj+OPEz5o+nMHXXMIwCgYIKoZIzj0EAwMDZwAwZAIwMXMdFJ4BetLLVY7ORuE9noqbbAZOZn/aArXyTwFAZfKrPzxF2vPoJNf1+UCdg1XGAjBwX1zd9WGqYkqmL5SFqw1QySjr1zJfpJM9+1rdDwSPLMOPOjKuiXjoU/pUUeG9RwmhY3BhZFkNngAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAPZYQKhzUO/0ELqYYTwk03aTq4qO7liqE5FeQAFVpTfr+aW8NqY861YrBVene3zCw69Y6pn+pCEgS0779TcsFjhN1ts=</c2pa:manifest></metadata>
+<defs>
+<linearGradient id="bg" x1="0" y1="0" x2="0.35" y2="1"><stop offset="0" stop-color="#4A57D2"></stop><stop offset="0.55" stop-color="#2C3391"></stop><stop offset="1" stop-color="#151A54"></stop></linearGradient>
+<radialGradient id="lift" cx="0.5" cy="0.06" r="0.85"><stop offset="0" stop-color="#FFFFFF" stop-opacity="0.16"></stop><stop offset="1" stop-color="#FFFFFF" stop-opacity="0"></stop></radialGradient>
+<clipPath id="mask"><rect x="100.0" y="100.0" width="824" height="824" rx="181.3" ry="181.3"></rect></clipPath>
+</defs>
+<rect id="icon-shape" x="100.0" y="100.0" width="824" height="824" rx="181.3" ry="181.3" fill="url(#bg)"></rect>
+<rect x="100.0" y="100.0" width="824" height="824" rx="181.3" ry="181.3" fill="url(#lift)"></rect>
+<g clip-path="url(#mask)">
+<line x1="308" y1="296" x2="308" y2="728" stroke="#FFFFFF" stroke-width="68" stroke-linecap="round"></line>
+<line x1="444" y1="296" x2="444" y2="728" stroke="#FFFFFF" stroke-width="68" stroke-linecap="round"></line>
+<line x1="580" y1="296" x2="580" y2="728" stroke="#FFFFFF" stroke-width="68" stroke-linecap="round"></line>
+<line x1="716" y1="296" x2="716" y2="728" stroke="#FFFFFF" stroke-width="68" stroke-linecap="round"></line>
+<path d="M 248 716 C 478.0 619.0, 626.4 504.2, 778 306" fill="none" stroke="#F5A524" stroke-width="80" stroke-linecap="round"></path>
+</g>
+</svg>

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@dstally/tokens",
+  "version": "1.0.0",
+  "description": "Tally design tokens: CSS custom properties, base styles, fonts and brand assets.",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "styles.css",
+    "tokens",
+    "assets",
+    "README.md"
+  ],
+  "exports": {
+    ".": "./styles.css",
+    "./styles.css": "./styles.css",
+    "./tokens/*": "./tokens/*",
+    "./assets/*": "./assets/*"
+  },
+  "sideEffects": true,
+  "scripts": {
+    "build": "node -e \"console.log('@dstally/tokens: nothing to build')\"",
+    "typecheck": "node -e \"process.exit(0)\""
+  }
+}

package/styles.css

@@ -0,0 +1,7 @@
+@import url("tokens/fonts.css");
+@import url("tokens/colors.css");
+@import url("tokens/typography.css");
+@import url("tokens/spacing.css");
+@import url("tokens/elevation.css");
+@import url("tokens/motion.css");
+@import url("tokens/base.css");

package/tokens/base.css

@@ -0,0 +1,20 @@
+/* Element defaults. Consumers get sane baselines without writing any CSS. */
+*,*::before,*::after{box-sizing:border-box}
+html{-webkit-text-size-adjust:100%}
+body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-sans);font-size:var(--text-body);line-height:var(--leading-body);letter-spacing:var(--tracking-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
+h1,h2,h3,h4{margin:0;color:var(--text-strong);font-weight:var(--weight-semibold);text-wrap:balance}
+h1{font-size:var(--text-display-2);line-height:var(--leading-display-2);letter-spacing:var(--tracking-display-2)}
+h2{font-size:var(--text-title-1);line-height:var(--leading-title-1);letter-spacing:var(--tracking-title-1)}
+h3{font-size:var(--text-title-2);line-height:var(--leading-title-2);letter-spacing:var(--tracking-title-2)}
+h4{font-size:var(--text-title-3);line-height:var(--leading-title-3);letter-spacing:var(--tracking-title-3)}
+p{margin:0 0 var(--space-5);text-wrap:pretty;max-width:var(--container-prose)}
+a{color:var(--text-link);text-decoration:none;transition:color var(--duration-fast) var(--ease-standard)}
+a:hover{color:var(--text-link-hover)}
+a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
+small{font-size:var(--text-caption);line-height:var(--leading-caption)}
+code,kbd,samp,pre{font-family:var(--font-mono);font-size:.92em}
+hr{border:0;border-top:1px solid var(--border-subtle);margin:var(--space-8) 0}
+::selection{background:rgba(245,165,36,.28);color:var(--text-strong)}
+.tally-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-feature-settings:var(--numeric-features)}
+.tally-overline{font-size:var(--text-overline);letter-spacing:var(--tracking-overline);text-transform:uppercase;font-weight:var(--weight-semibold);color:var(--text-muted)}
+.tally-container{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter)}

package/tokens/colors.css

@@ -0,0 +1,150 @@
+/* Tally colour system. Base ramps first, then semantic aliases.
+   Dark is the canonical theme; :root is dark, [data-theme="light"] overrides. */
+:root{
+  /* Brand indigo — sampled from the app-icon gradient #4A57D2 -> #2C3391 -> #151A54 */
+  --indigo-100:#E4E7FA;
+  --indigo-200:#C3C8F3;
+  --indigo-300:#9AA2EA;
+  --indigo-400:#6C77DE;
+  --indigo-500:#4A57D2;
+  --indigo-600:#3A44AF;
+  --indigo-700:#2C3391;
+  --indigo-800:#1F2470;
+  --indigo-900:#151A54;
+  --indigo-950:#0E1138;
+
+  /* Accent amber — the fifth tally stroke */
+  --amber-200:#FDE3B4;
+  --amber-300:#FBCC7C;
+  --amber-400:#F8B547;
+  --amber-500:#F5A524;
+  --amber-600:#D98C10;
+  --amber-700:#A96A08;
+
+  /* Secondary blue — app UI actions */
+  --blue-300:#7FB4EE;
+  --blue-400:#3D8BDB;
+  --blue-500:#1565C0;
+  --blue-600:#0F4E97;
+  --blue-700:#0B3A70;
+
+  /* Cool neutrals */
+  --neutral-0:#FFFFFF;
+  --neutral-25:#FAFBFD;
+  --neutral-50:#F4F6FA;
+  --neutral-100:#E8EBF2;
+  --neutral-200:#D5DAE6;
+  --neutral-300:#B3BAC9;
+  --neutral-400:#8B93A5;
+  --neutral-500:#697084;
+  --neutral-600:#4C5365;
+  --neutral-650:#3C4356;
+  --neutral-700:#2B3143;
+  --neutral-800:#1D2230;
+  --neutral-850:#161A26;
+  --neutral-900:#10131C;
+  --neutral-950:#0A0C13;
+
+  /* Okabe-Ito — the only palette permitted for charts and parallel-timer tracks */
+  --chart-1:#0072B2; /* blue */
+  --chart-2:#E69F00; /* orange */
+  --chart-3:#009E73; /* bluish green */
+  --chart-4:#CC79A7; /* reddish purple */
+  --chart-5:#56B4E9; /* sky blue */
+  --chart-6:#D55E00; /* vermillion */
+  --chart-7:#F0E442; /* yellow */
+  --chart-8:#4C5566; /* neutral (replaces Okabe-Ito black on dark ground) */
+
+  /* Gradients */
+  --gradient-brand:linear-gradient(160deg,#4A57D2 0%,#2C3391 52%,#151A54 100%); /* @kind other */
+  --gradient-brand-lift:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,0) 46%); /* @kind other */
+  --gradient-page:radial-gradient(120% 80% at 50% -10%,#1F2470 0%,#10131C 62%); /* @kind other */
+
+  /* ---- Semantic: dark (canonical) ---- */
+  --surface-page:var(--neutral-900);
+  --surface-sunken:var(--neutral-950);
+  --surface-card:var(--neutral-850);
+  --surface-raised:var(--neutral-800);
+  --surface-overlay:rgba(16,19,28,.72);
+  --surface-inset:rgba(255,255,255,.04);
+  --surface-hover:rgba(255,255,255,.06);
+  --surface-active:rgba(255,255,255,.1);
+  --surface-brand:var(--indigo-900);
+  --surface-brand-subtle:rgba(74,87,210,.16);
+  --surface-accent-subtle:rgba(245,165,36,.14);
+
+  --text-strong:var(--neutral-0);
+  --text-body:#DCE1EC;
+  --text-muted:var(--neutral-300);
+  --text-subtle:var(--neutral-400);
+  --text-inverse:var(--neutral-900);
+  --text-accent:var(--amber-400);
+  --text-link:var(--blue-300);
+  --text-link-hover:var(--amber-400);
+  --text-on-brand:var(--neutral-0);
+
+  --border-subtle:rgba(255,255,255,.08);
+  --border-default:rgba(255,255,255,.14);
+  --border-strong:rgba(255,255,255,.24);
+  --border-accent:var(--amber-500);
+  --border-focus:var(--amber-400);
+
+  --action-primary:var(--amber-500);
+  --action-primary-hover:var(--amber-400);
+  --action-primary-active:var(--amber-600);
+  --action-primary-text:#20160A;
+  --action-secondary:var(--blue-500);
+  --action-secondary-hover:var(--blue-400);
+  --action-secondary-active:var(--blue-600);
+  --action-secondary-text:var(--neutral-0);
+
+  --status-running:var(--amber-500);
+  --status-paused:var(--neutral-400);
+  --status-success:#00B383;
+  --status-warning:var(--amber-500);
+  --status-danger:#E8663A;
+  --status-info:#3D9BE0;
+  --status-success-surface:rgba(0,158,115,.16);
+  --status-warning-surface:rgba(245,165,36,.16);
+  --status-danger-surface:rgba(213,94,0,.18);
+  --status-info-surface:rgba(0,114,178,.18);
+}
+
+[data-theme="light"]{
+  --surface-page:var(--neutral-25);
+  --surface-sunken:var(--neutral-50);
+  --surface-card:var(--neutral-0);
+  --surface-raised:var(--neutral-0);
+  --surface-overlay:rgba(16,19,28,.4);
+  --surface-inset:var(--neutral-50);
+  --surface-hover:rgba(21,26,84,.05);
+  --surface-active:rgba(21,26,84,.09);
+  --surface-brand:var(--indigo-500);
+  --surface-brand-subtle:rgba(74,87,210,.08);
+  --surface-accent-subtle:rgba(245,165,36,.16);
+
+  --text-strong:var(--neutral-900);
+  --text-body:var(--neutral-800);
+  --text-muted:var(--neutral-500);
+  --text-subtle:var(--neutral-400);
+  --text-inverse:var(--neutral-0);
+  --text-accent:var(--amber-700);
+  --text-link:var(--blue-500);
+  --text-link-hover:var(--indigo-700);
+  --text-on-brand:var(--neutral-0);
+
+  --border-subtle:var(--neutral-100);
+  --border-default:var(--neutral-200);
+  --border-strong:var(--neutral-300);
+
+  --action-primary:var(--amber-500);
+  --action-primary-hover:var(--amber-400);
+  --action-primary-active:var(--amber-600);
+  --action-primary-text:#20160A;
+
+  --status-success:#007A5A;
+  --status-warning:var(--amber-700);
+  --status-danger:#C24A12;
+  --status-info:var(--blue-500);
+  --chart-8:#000000;
+}

package/tokens/elevation.css

@@ -0,0 +1,27 @@
+/* Radii, shadows, blur. Shadows are near-black and low-spread; nothing floats far. */
+:root{
+  --radius-xs:4px;
+  --radius-sm:6px;
+  --radius-md:9px;
+  --radius-lg:12px;
+  --radius-xl:16px;
+  --radius-2xl:22px;
+  --radius-pill:999px;
+  --radius-icon-ratio:22%; /* app-icon squircle: radius = 22% of side */
+
+  --shadow-none:none;
+  --shadow-xs:0 1px 2px rgba(6,8,16,.32);
+  --shadow-sm:0 1px 3px rgba(6,8,16,.36),0 1px 1px rgba(6,8,16,.24);
+  --shadow-md:0 6px 16px -4px rgba(6,8,16,.44),0 2px 4px rgba(6,8,16,.28);
+  --shadow-lg:0 18px 40px -12px rgba(6,8,16,.55),0 4px 10px rgba(6,8,16,.3);
+  --shadow-pill:0 10px 30px -8px rgba(6,8,16,.6),0 0 0 1px rgba(255,255,255,.08) inset;
+  --shadow-focus:0 0 0 3px rgba(245,165,36,.34);
+  --shadow-inset-hairline:inset 0 1px 0 rgba(255,255,255,.06);
+  --glow-amber:0 0 0 1px rgba(245,165,36,.5),0 0 24px -6px rgba(245,165,36,.45);
+
+  --blur-panel:saturate(140%) blur(20px); /* @kind other */
+  --blur-scrim:blur(6px); /* @kind other */
+
+  /* Protection gradient for text over imagery / gradient */
+  --scrim-bottom:linear-gradient(180deg,rgba(10,12,19,0) 0%,rgba(10,12,19,.82) 100%); /* @kind other */
+}

package/tokens/fonts.css

@@ -0,0 +1,12 @@
+@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=JetBrains+Mono:wght@400;500;700&display=swap');
+
+/* Tally webfonts are served from Google Fonts (see readme.md — SUBSTITUTION note).
+   If licensed brand binaries arrive, replace this @import with local @font-face rules
+   pointing at assets/fonts/*.woff2 and keep the family names below unchanged. */
+:root{
+  --font-sans:"Instrument Sans","Helvetica Neue",-apple-system,BlinkMacSystemFont,sans-serif;
+  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
+  --font-display:var(--font-sans);
+  --font-ui:var(--font-sans);
+  --font-numeric:var(--font-mono);
+}

package/tokens/motion.css

@@ -0,0 +1,25 @@
+/* Motion. Short, damped, never bouncy. Time is the subject; nothing should feel slow. */
+:root{
+  --duration-instant:80ms; /* @kind other */
+  --duration-fast:140ms; /* @kind other */
+  --duration-base:200ms; /* @kind other */
+  --duration-slow:320ms; /* @kind other */
+  --duration-enter:420ms; /* @kind other */
+
+  --ease-standard:cubic-bezier(.2,0,.2,1); /* @kind other */
+  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
+  --ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
+  --ease-tick:steps(1,end); /* @kind other */ /* second-by-second timer digits never tween */
+
+  --transition-control:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard); /* @kind other */
+  --press-scale:.985; /* @kind other */
+}
+@media (prefers-reduced-motion:reduce){
+  :root{
+    --duration-fast:0ms; /* @kind other */
+    --duration-base:0ms; /* @kind other */
+    --duration-slow:0ms; /* @kind other */
+    --duration-enter:0ms; /* @kind other */
+    --press-scale:1; /* @kind other */
+  }
+}

package/tokens/spacing.css

@@ -0,0 +1,30 @@
+/* 4px base grid. Section rhythm on the marketing site uses the -section tokens. */
+:root{
+  --space-0:0px;
+  --space-1:2px;
+  --space-2:4px;
+  --space-3:8px;
+  --space-4:12px;
+  --space-5:16px;
+  --space-6:20px;
+  --space-7:24px;
+  --space-8:32px;
+  --space-9:40px;
+  --space-10:48px;
+  --space-11:64px;
+  --space-12:80px;
+  --space-13:112px;
+  --space-14:160px;
+
+  --section-y:112px;
+  --section-y-tight:72px;
+  --container-max:1160px;
+  --container-prose:660px;
+  --gutter:24px;
+
+  --control-h-sm:26px;
+  --control-h-md:32px;
+  --control-h-lg:40px;
+  --control-h-xl:48px;
+  --row-h:38px;
+}

package/tokens/typography.css

@@ -0,0 +1,25 @@
+/* Type scale. Display and UI share one family; numerals are always mono + tabular. */
+:root{
+  --text-display-1:64px;   --leading-display-1:1.02; --tracking-display-1:-.03em;
+  --text-display-2:48px;   --leading-display-2:1.06; --tracking-display-2:-.025em;
+  --text-title-1:34px;     --leading-title-1:1.14;   --tracking-title-1:-.02em;
+  --text-title-2:26px;     --leading-title-2:1.2;    --tracking-title-2:-.015em;
+  --text-title-3:20px;     --leading-title-3:1.3;    --tracking-title-3:-.01em;
+  --text-body-lg:18px;     --leading-body-lg:1.6;    --tracking-body-lg:-.005em;
+  --text-body:16px;        --leading-body:1.6;       --tracking-body:0em;
+  --text-body-sm:14px;     --leading-body-sm:1.55;   --tracking-body-sm:0em;
+  --text-caption:12px;     --leading-caption:1.4;    --tracking-caption:.005em;
+  --text-overline:11px;    --leading-overline:1.2;   --tracking-overline:.12em;
+
+  --weight-regular:400;
+  --weight-medium:500;
+  --weight-semibold:600;
+  --weight-bold:700;
+
+  /* Timer / duration readouts */
+  --text-timer-xl:44px;
+  --text-timer-lg:28px;
+  --text-timer-md:18px;
+  --text-timer-sm:13px;
+  --numeric-features:"tnum" 1,"cv01" 1; /* @kind other */
+}