nimiq-branding-cli 1.0.0

package/LICENSE

@@ -0,0 +1,25 @@
+MIT License
+
+Copyright (c) 2026 Andrew Lattner
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+NOTE: This license covers the CLI code, scripts, and original work in this
+repository. Nimiq brand assets, component designs, and vendored files remain
+the property of their respective owners — see NOTICE.md.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/NOTICE.md

@@ -0,0 +1,32 @@
+# Notice — Nimiq brand assets & upstream sources
+
+**This is an unofficial community project.** It is not affiliated with, endorsed by,
+or sponsored by the Nimiq Foundation / Nimiq team. It exists to help builders create
+Nimiq-ecosystem apps that look right.
+
+## Whose work is in here
+
+The Nimiq name, logo, hexagon mark, identicons, and all visual designs reproduced by
+this tool are the work and property of the **Nimiq team and its contributors**.
+This repo vendors their real shipped files rather than imitating them:
+
+| What | Origin | Upstream license |
+|---|---|---|
+| `nq-*` CSS framework | [nimiq/nimiq-style](https://github.com/nimiq/nimiq-style) | Apache-2.0 |
+| Modern nimiq-css + nimiq-icons + flags | [onmax/nimiq-ui](https://github.com/onmax/nimiq-ui) | MIT |
+| Vue component designs (ported) | [nimiq/vue-components](https://github.com/nimiq/vue-components), [nimiq/wallet](https://github.com/nimiq/wallet), [nimiq/hub](https://github.com/nimiq/hub) | Apache-2.0 |
+| Identicon sprite + parts | [nimiq/identicons](https://github.com/nimiq/identicons) | MIT |
+| Official logo pack | [nimiq/designs](https://github.com/nimiq/designs) | see repo |
+| App/ecosystem icons | [nimiq/awesome](https://github.com/nimiq/awesome) | see repo |
+| Marketing imagery (hero sky, world map, product previews) | [nimiq.com](https://nimiq.com) (publicly served assets) | © Nimiq |
+
+Per-file provenance for everything under `references/assets/` is recorded in
+`references/assets/ASSETS.md` and the `SOURCES.txt` files alongside the assets.
+
+If you are from the Nimiq team and want anything removed or credited differently,
+open an issue — it will be handled promptly.
+
+## What the MIT license here covers
+
+Only the original work in this repo: the `nq` CLI, the verification harness
+(snap/verify/pixelmatch pipeline), build scripts, registry structure, and docs.

package/README.md

@@ -0,0 +1,73 @@
+# nimiq-branding-cli
+
+Scaffold **pixel-accurate Nimiq-branded UI components** into any project — Vue 3 SFCs or plain
+HTML/CSS — from a registry of 39 components where every one is pixel-diffed against the real
+Nimiq apps before it ships, plus the team's real asset library (logos, icons, flags, imagery).
+
+> Unofficial community project — see [NOTICE.md](NOTICE.md). All visuals are the Nimiq team's
+> real shipped files or faithful ports of their open-source components, never hand-drawn
+> approximations.
+
+## Install
+
+```bash
+git clone https://github.com/Andjroo111/nimiq-branding-cli
+cd nimiq-branding-cli && npm install     # dev deps only needed for `nq verify`
+ln -s "$PWD/bin/nq.js" ~/.local/bin/nq   # or: npm link
+```
+
+## Use
+
+```
+nq list                     # browse the 39-component registry
+nq init --style modern      # drop Nimiq design tokens into your project
+nq add amount-input         # copy a component (+ deps + CSS + real assets) into src/components
+nq add account-header --html   # plain HTML/CSS variant instead of Vue
+nq assets search wallet     # search 182 vendored files + 323 nimiq-icons + 422 hexagon flags
+nq assets add icon:logos-nimiq-horizontal flag:cr-hexagon world-map
+nq verify all               # (repo dev) re-run pixel verification against references
+```
+
+Open `showcase.html` for the full component gallery and `supporting-elements.html` for the
+wallet + marketing element demos.
+
+## How pixel accuracy is enforced
+
+Every registry component carries:
+
+- `meta.json` — purpose, props, category, CSS deps, verify config (viewport, selector, max diff %)
+- `vue/` and/or `html/` — the scaffolded source
+- `html/demo.html` — a self-contained render of the component
+- `reference.png` — a screenshot of the REAL component (live site, upstream demo, or storybook)
+
+`nq verify` renders `demo.html` headlessly (Playwright, 2× scale, fonts settled, animations
+disabled) and diffs it against `reference.png` with pixelmatch. Components whose diff exceeds
+`maxDiffPct` fail CI and are marked `· unverified` in `nq list`.
+
+## Sources of truth
+
+| Source | What it provides |
+|---|---|
+| `nimiq/vue-components` | canonical Vue component library (SmallPage, PageHeader, AmountInput, Identicon, …) |
+| `nimiq/wallet` | production wallet components (FeeSelector, TransactionList, BalanceDistribution, …) |
+| `nimiq/hub` | checkout / account-management flows |
+| `nimiq/nimiq-style` | legacy `nq-*` CSS framework + demo.html |
+| `onmax/nimiq-ui` | modern `nimiq-css` (oklch tokens, auto dark mode) |
+| `references/screenshots/` | captured reference screenshots of live Nimiq properties |
+
+Upstream clones live in `upstream/` (gitignored — re-clone with `git clone --depth 1`).
+
+## Repo layout
+
+```
+bin/nq.js              CLI entry (zero runtime deps, node >= 18)
+registry/
+  index.json           component index (nq list reads this)
+  components/<name>/   meta.json, vue/, html/, reference.png
+assets/
+  css/modern/          vendored nimiq-css layers (oklch + light-dark)
+  css/legacy/          vendored @nimiq/style (nq-* classes)
+  tokens.md            design-token quick reference
+scripts/verify.mjs     pixel-diff harness (playwright + pixelmatch)
+references/screenshots side-by-side reference captures of live Nimiq UIs
+```

package/assets/css/legacy/nimiq-style.icons.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs/><symbol id="nq-alert-circle" viewBox="0 0 16 16"><path fill="currentColor" fill-rule="evenodd" d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-9.14 2.71a1 1 0 0 1 1-1h.29a1 1 0 0 1 1 1v.3a1 1 0 0 1-1 1h-.3a1 1 0 0 1-1-1v-.3zm1-6.71a1 1 0 0 0-1 1v2.57a1 1 0 0 0 1 1h.29a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1h-.3z"/></symbol><symbol id="nq-alert-triangle" viewBox="0 0 17 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M15.913 13.333L9.68 1.433a1.333 1.333 0 0 0-2.362 0l-6.232 11.9a1.333 1.333 0 0 0 1.182 1.952H14.73a1.333 1.333 0 0 0 1.182-1.952zm-8.08-7.718a.667.667 0 0 1 1.334 0v4a.667.667 0 1 1-1.334 0v-4zm.682 7.674h.018a.983.983 0 0 0 .967-1.022 1.018 1.018 0 0 0-1.016-.978h-.019a.984.984 0 0 0-.965 1.02c.02.546.468.978 1.015.98z" fill="currentColor"/></symbol><symbol id="nq-arrow-left-small" viewBox="0 0 11 9"><path d="M4.25,7.75.75,4.25,4.25.75" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" fill="none"/><line x1="1" y1="4.25" x2="10.25" y2="4.25" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" fill="none"/></symbol><symbol id="nq-arrow-left" viewBox="0 0 23 18"><path d="M22 9L3 9" stroke="currentColor" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M9 16L2 9L9 2" stroke="currentColor" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-arrow-right-small" viewBox="0 0 16 12"><path d="M10,1l5,5l-5,5" stroke="currentColor" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><line x1="14" y1="6" x2="1" y2="6" stroke="currentColor" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-arrow-right" viewBox="0 0 23 18"><path d="M13.9995 1.99902L20.999 9.00049L13.9995 16" stroke="currentColor" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><line x1="18.999" y1="9" x2="0.999023" y2="9" stroke="currentColor" fill="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-caret-right-small" viewBox="0 0 10 11"><path d="M5.00098 2L8.53602 5.53603L5.00098 9.07107" stroke="currentColor" fill="none" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-cashlink-small" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.5px" stroke-linejoin="round"><path d="M15.25,8.25h0a2.5,2.5,0,0,0-2.5-2.5h-1.5a2.5,2.5,0,0,0-2.5,2.5v3a2.5,2.5,0,0,0,2.5,2.5h.5"/><path d="M8.75,15.75h0a2.5,2.5,0,0,0,2.5,2.5h1.5a2.5,2.5,0,0,0,2.5-2.5v-3a2.5,2.5,0,0,0-2.5-2.5h-.5"/><line x1="12" y1="3.75" x2="12" y2="5.25"/><line x1="12" y1="18.75" x2="12" y2="20.25"/></g></symbol><symbol id="nq-cashlink" viewBox="0 0 64 64"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2.5px" stroke-linejoin="round"><path d="M40.25,23.25v-.5a6.5,6.5,0,0,0-6.5-6.5h-3.5a6.5,6.5,0,0,0-6.5,6.5v6.5a6.5,6.5,0,0,0,6.5,6.5h2"/><path d="M23.75,40.75v.5a6.5,6.5,0,0,0,6.5,6.5h3.5a6.5,6.5,0,0,0,6.5-6.5v-6.5a6.5,6.5,0,0,0-6.5-6.5h-2"/><line x1="32" y1="11.25" x2="32" y2="15.25"/><line x1="32" y1="48.75" x2="32" y2="52.75"/></g></symbol><symbol id="nq-cashlink-xsmall" viewBox="0 0 16 16"><g fill="none" stroke="currentColor" stroke-linecap="round"><path d="M10.5,5.5h0a2,2,0,0,0-2-2h-1a2,2,0,0,0-2,2V7a2,2,0,0,0,2,2H8"/><path d="M5.5,10.5h0a2,2,0,0,0,2,2h1a2,2,0,0,0,2-2V9a2,2,0,0,0-2-2H8"/></g></symbol><symbol id="nq-checkmark-small" viewBox="0 0 12 12"><path d="M11,1,4,11,1,8" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></symbol><symbol id="nq-checkmark" viewBox="0 0 74 74"><path d="M71.12 1.84a4.5 4.5 0 0 0-6.28 1.04l-42.1 58.74L8.68 47.54a4.5 4.5 0 1 0-6.36 6.37l17.8 17.81a4.57 4.57 0 0 0 6.84-.56l45.2-63.03a4.5 4.5 0 0 0-1.04-6.29z" fill="currentColor" stroke="currentColor" stroke-width=".8"/></symbol><symbol id="nq-close" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M3.528 3.52c4.683-4.684 12.275-4.686 16.96-.005 4.678 4.69 4.678 12.28 0 16.97-4.685 4.68-12.277 4.678-16.96-.005-4.682-4.684-4.682-12.276 0-16.96zm13.145 13.133a1 1 0 0 0 .036-1.374l-3.11-3.11a.25.25 0 0 1 0-.352l3.11-3.11a1 1 0 1 0-1.414-1.415l-3.11 3.11a.25.25 0 0 1-.354 0l-3.11-3.11a1 1 0 0 0-1.41 1.415l3.11 3.11a.249.249 0 0 1 0 .353l-3.11 3.109a1 1 0 0 0 0 1.415c.396.38 1.021.38 1.416 0l3.109-3.11a.252.252 0 0 1 .354 0l3.11 3.11a1 1 0 0 0 1.373-.041z" fill="currentColor"/></symbol><symbol id="nq-contacts" viewBox="0 0 40 49"><path fill-rule="evenodd" clip-rule="evenodd" d="M35.73 7.25c0 .48.34.9.82 1a4.08 4.08 0 0 1 3.26 4v32.67A4.08 4.08 0 0 1 35.73 49H6.13A6.13 6.13 0 0 1 0 42.87V6.13A6.13 6.13 0 0 1 6.13 0h25.52a4.08 4.08 0 0 1 4.08 4.08v3.17zm-5.1 31.88A10.23 10.23 0 0 0 20.4 29.6c-5.21 0-9.6 3.9-10.19 9.08a1.02 1.02 0 0 0 1.02 1.13h18.75a.64.64 0 0 0 .64-.68zm-16.38-17.7a6.15 6.15 0 1 1 12.3-.04 6.15 6.15 0 0 1-12.3.05zM6.12 4.09a2.04 2.04 0 0 0 0 4.09h25.01c.29 0 .51-.23.51-.51V4.59a.51.51 0 0 0-.5-.5H6.11z" fill="currentColor"/></symbol><symbol id="nq-copy" viewBox="0 0 35 40"><path fill-rule="evenodd" clip-rule="evenodd" d="M34.07 6.01L28.95.92c-.6-.59-1.4-.92-2.24-.92H12.33a3.17 3.17 0 0 0-3.16 3.17v5.16h-6A3.17 3.17 0 0 0 0 11.5v25.35A3.17 3.17 0 0 0 3.17 40h19.5a3.17 3.17 0 0 0 3.16-3.16v-5.17h6A3.17 3.17 0 0 0 35 28.5V8.25c0-.84-.33-1.65-.93-2.24zM22.5 35.83c0 .46-.37.84-.83.84H4.17a.83.83 0 0 1-.84-.84V12.5c0-.46.38-.83.84-.83h12.97c.22 0 .43.08.58.23l4.53 4.43c.16.16.25.37.25.6v18.9zm3.75-7.5h4.58c.46 0 .84-.37.84-.83V8.6a.83.83 0 0 0-.25-.6l-4.58-4.47a.83.83 0 0 0-.58-.24l-12.93.04a.83.83 0 0 0-.83.84v3.75c0 .23.19.41.42.41h4.63c.84 0 1.64.33 2.23.93l5.12 5.09c.6.59.93 1.4.93 2.23v11.34c0 .23.19.41.42.41z" fill="currentColor"/></symbol><symbol id="nq-cross" viewBox="0 0 15 15"><path d="M2 13L13 2" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 2L13 13" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-download" viewBox="0 0 20 20"><path d="M15.36 11.38a.83.83 0 0 0-.59-1.42h-3.31a.2.2 0 0 1-.2-.2V1.24a1.25 1.25 0 1 0-2.5 0v8.5c0 .12-.1.2-.22.2H5.23a.83.83 0 0 0-.59 1.43l4.77 4.77c.33.33.86.33 1.18 0l4.77-4.77zM16.02 18.75c0-.69-.55-1.25-1.25-1.25H5.23a1.25 1.25 0 1 0 0 2.5h9.54c.7 0 1.25-.56 1.25-1.25z" fill="currentColor"/></symbol><symbol id="nq-face-neutral" viewBox="0 0 102 102"><circle cx="51" cy="51" r="48" stroke="currentColor" fill="none" stroke-width="6"/><circle cx="35.1485" cy="40.6627" r="4.82432" fill="currentColor"/><circle cx="66.8514" cy="40.6622" r="4.82432" fill="currentColor"/><path d="M39 68.9863C39 68.9863 44.8244 68.9863 51.0271 68.9863C57.2298 68.9863 63.0541 68.9863 63.0541 68.9863" stroke="currentColor" fill="none" stroke-width="6" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-face-sad" viewBox="0 0 102 102"><circle cx="51" cy="51" r="48" stroke="currentColor" fill="none" stroke-width="6"/><circle cx="35.1485" cy="40.6627" r="4.82432" fill="currentColor"/><circle cx="66.8514" cy="40.6622" r="4.82432" fill="currentColor"/><path d="M39.9729 70.9867C39.9729 70.9867 44.7972 68.23 50.9999 68.23C57.2026 68.23 62.027 70.9867 62.027 70.9867" stroke="currentColor" fill="none" stroke-width="6" stroke-linecap="round" stroke-linejoin="round"/></symbol><symbol id="nq-gear" viewBox="0 0 25 24"><path d="M21.66 9.31l1.26.45a2.37 2.37 0 0 1 0 4.48l-1.27.45a1.37 1.37 0 0 0-.77 1.88l.57 1.22a2.38 2.38 0 0 1-3.16 3.16l-1.22-.57a1.37 1.37 0 0 0-1.88.78l-.45 1.26a2.38 2.38 0 0 1-4.48 0l-.45-1.26a1.37 1.37 0 0 0-1.88-.78l-1.22.57a2.38 2.38 0 0 1-3.16-3.16l.57-1.22a1.37 1.37 0 0 0-.78-1.88l-1.26-.45a2.38 2.38 0 0 1 0-4.48l1.26-.45a1.38 1.38 0 0 0 .78-1.88l-.57-1.21A2.38 2.38 0 0 1 6.7 3.04l1.22.58a1.38 1.38 0 0 0 1.88-.78l.45-1.27a2.38 2.38 0 0 1 4.48 0l.45 1.27a1.37 1.37 0 0 0 1.88.78l1.22-.58a2.38 2.38 0 0 1 3.16 3.17l-.57 1.2a1.37 1.37 0 0 0 .78 1.9zm-13.6 4.53a4.93 4.93 0 0 0 6.28 2.6 4.81 4.81 0 0 0 2.6-6.28 4.87 4.87 0 0 0-6.28-2.6 4.81 4.81 0 0 0-2.6 6.28z" fill="currentColor"/></symbol><symbol id="nq-hexagon" viewBox="0 0 27 24"><path d="M26.6991 10.875L21.0741 1.125C20.6691 0.4275 19.9266 0 19.1241 0H7.87414C7.07164 0 6.32914 0.4275 5.92789 1.125L0.302891 10.875C-0.0983594 11.5725 -0.0983594 12.4275 0.302891 13.125L5.92789 22.875C6.32914 23.5725 7.07164 24 7.87414 24H19.1241C19.9266 24 20.6691 23.5725 21.0704 22.875L26.6954 13.125C27.1004 12.4275 27.1004 11.5725 26.6991 10.875Z" fill="currentColor"/></symbol><symbol id="nq-info-circle-small" viewBox="0 0 16 16"><line x1="8" y1="7.83301" x2="8" y2="11.333" stroke="currentColor" fill="none" stroke-linecap="round" stroke-width="1.5"/><circle cx="8" cy="4.75" r="0.5" fill="currentColor" stroke="currentColor" stroke-width="1"/><circle cx="8" cy="8" r="7.25" stroke="currentColor" stroke-width="1.5" fill="none"/></symbol><symbol id="nq-info-circle" viewBox="0 0 16 16"><line x1="8" y1="7.83301" x2="8" y2="11.333" stroke="currentColor" fill="none" stroke-linecap="round"/><circle cx="8" cy="4.75" r="0.5" fill="currentColor" stroke="currentColor" stroke-width="0.5"/><circle cx="8" cy="8" r="7.5" stroke="currentColor" fill="none"/></symbol><symbol id="nq-keys" viewBox="0 0 39 39"><g fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M21.94 14.04a9.1 9.1 0 0 0-2.44-6.18V3.9c0-2.15-1.82-3.9-4.06-3.9a3.98 3.98 0 0 0-4.07 3.9v.81a9.58 9.58 0 0 0-8.83 8.13 9.34 9.34 0 0 0 6.4 10.02v1l-1.39 1.33a.76.76 0 0 0 0 1.1l1.39 1.33v.92l-1.39 1.33c-.32.3-.32.8 0 1.1l1.39 1.33v2.02c0 .2.08.4.23.55l2.44 2.34a.83.83 0 0 0 1.15 0l2.44-2.34a.76.76 0 0 0 .24-.55V22.86a9.42 9.42 0 0 0 6.5-8.82zm-9.75-4.68c.9 0 1.62.7 1.62 1.56a1.6 1.6 0 0 1-1.62 1.56c-.9 0-1.63-.7-1.63-1.56 0-.86.73-1.56 1.63-1.56zm5.69-5.46c0-1.3-1.1-2.34-2.44-2.34A2.39 2.39 0 0 0 13 3.9v3.9h1.63V4.98c1.16.29 2.27.79 3.24 1.46V3.9z"/><path d="M36.33 28.12l-8.45-8.11a9.07 9.07 0 0 0-3.45-11.85.84.84 0 0 0-.98.07.76.76 0 0 0-.2.91 11.4 11.4 0 0 1-4.52 14.75.77.77 0 0 0-.34.87c.1.33.42.56.78.56h.01c1.43-.01 2.84-.32 4.13-.92l1.06.9v2c0 .43.36.78.8.78h2.1l.35.35v1.99c0 .43.36.78.8.78h1.83l1.49 1.35c.15.13.35.21.56.21h3.45a.8.8 0 0 0 .81-.78v-3.3c0-.22-.08-.41-.23-.56z"/></g></symbol><symbol id="nq-ledger" viewBox="0 0 290 61"><path d="M145.5,46C137,46,130,39,130,30.5S137,15,145.5,15S161,22,161,30.5S154,46,145.5,46z M145.5,17 c-7.4,0-13.5,6.1-13.5,13.5S138.1,44,145.5,44S159,37.9,159,30.5S152.9,17,145.5,17z" fill="currentColor"/><path d="M285.5,3H107V2c0-1.1-0.9-2-2-2H89c-1.1,0-2,0.9-2,2v1H41V2c0-1.1-0.9-2-2-2H23c-1.1,0-2,0.9-2,2v1H4 C1.8,3,0,4.8,0,7v47c0,2.2,1.8,4,4,4h281.5c2.5,0,4.5-2,4.5-4.5v-46C290,5,288,3,285.5,3z M102,40.9c0,1.1-0.9,2.1-2,2.1H28 c-1.1,0-2-0.9-2-2.1V20.1c0-1.1,0.9-2.1,2-2.1h72c1.1,0,2,0.9,2,2.1V40.9z M288,53.5c0,1.4-1.1,2.5-2.5,2.5h-140 C131.4,56,120,44.6,120,30.5C120,16.4,131.4,5,145.5,5h140c1.4,0,2.5,1.1,2.5,2.5V53.5z" fill="currentColor"/></symbol><symbol id="nq-lock-locked" viewBox="0 0 32 47"><path fill-rule="evenodd" clip-rule="evenodd" d="M29.5 22.512V12.96C29.5 5.802 23.456 0 16 0S2.5 5.802 2.5 12.96v9.552c-4.26 6.43-2.966 14.887 3.041 19.868 6.007 4.982 14.911 4.982 20.918 0 6.008-4.981 7.302-13.438 3.041-19.868zM16 34.56c-2.209 0-4-1.72-4-3.84s1.791-3.84 4-3.84c2.21 0 4 1.72 4 3.84s-1.79 3.84-4 3.84zm8.027-17.653a.952.952 0 0 0 .473-.816V12.96c0-4.507-3.805-8.16-8.5-8.16-4.694 0-8.5 3.653-8.5 8.16v3.131c0 .332.179.641.473.816.294.175.661.192.971.045a16.437 16.437 0 0 1 14.112 0c.31.147.677.13.971-.045z" fill="currentColor"/></symbol><symbol id="nq-lock-unlocked" viewBox="0 0 32 47"><path fill-rule="evenodd" clip-rule="evenodd" d="M30.5 12.96v9.552c3.93 5.944 3.165 13.69-1.859 18.818-5.024 5.129-13.03 6.337-19.451 2.935-6.421-3.401-9.625-10.548-7.783-17.363C3.248 20.087 9.667 15.336 17 15.36c2.449 0 4.864.545 7.056 1.592.31.147.677.13.971-.045a.952.952 0 0 0 .473-.816V12.96c0-4.507-3.805-8.16-8.5-8.16-4.694 0-8.5 3.653-8.5 8.16 0 1.325-1.12 2.4-2.5 2.4s-2.5-1.074-2.5-2.4C3.5 5.802 9.544 0 17 0s13.5 5.802 13.5 12.96zM13 30.72c0 2.12 1.79 3.84 4 3.84s4-1.72 4-3.84-1.79-3.84-4-3.84-4 1.72-4 3.84z" fill="currentColor"/></symbol><symbol id="nq-login" viewBox="0 0 54 54"><path d="M26.95 0A27.05 27.05 0 0 0 .21 22.32a1.12 1.12 0 0 0 1.13 1.3h18.72c.62 0 1.12-.5 1.12-1.12v-8.1a2.25 2.25 0 0 1 3.66-1.76l15.75 12.6a2.25 2.25 0 0 1 0 3.52l-15.75 12.6a2.25 2.25 0 0 1-3.66-1.76v-8.1c0-.62-.5-1.12-1.12-1.12H1.35a1.14 1.14 0 0 0-1.13 1.3 27 27 0 0 0 53.55-5.78A27.25 27.25 0 0 0 26.95 0z" fill="currentColor"/></symbol><symbol id="nq-menu-dots" viewBox="0 0 7 30"><g fill="currentColor"><circle cx="3.5" cy="3" r="3"/><circle cx="3.5" cy="15" r="3"/><circle cx="3.5" cy="27" r="3"/></g></symbol><symbol id="nq-plus-circle" viewBox="0 0 54 54"><path fill-rule="evenodd" clip-rule="evenodd" d="M27 54a27 27 0 1 0 0-54 27 27 0 0 0 0 54zm2.5-40c.6 0 1 .4 1 1v8.5H39c.6 0 1 .4 1 1v5c0 .6-.4 1-1 1h-8.5V39c0 .6-.4 1-1 1h-5a1 1 0 0 1-1-1v-8.5H15a1 1 0 0 1-1-1v-5c0-.6.4-1 1-1h8.5V15c0-.6.4-1 1-1h5z" fill="currentColor"/></symbol><symbol id="nq-qr-code" viewBox="0 0 99 99"><g fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M28.9 33H4A4.1 4.1 0 0 1 0 28.9V4A4.1 4.1 0 0 1 4.1 0H29A4.1 4.1 0 0 1 33 4.1V29a4.1 4.1 0 0 1-4.1 4.1zM9.3 8.2a1 1 0 0 0-1 1v14.5c0 .6.4 1 1 1h14.4c.6 0 1-.4 1-1V9.3c0-.6-.4-1-1-1H9.3zM4 66H29a4.1 4.1 0 0 1 4.1 4.1V95a4.1 4.1 0 0 1-4.1 4.1H4A4.1 4.1 0 0 1 0 94.9V70A4.1 4.1 0 0 1 4.1 66zm19.6 24.8c.6 0 1-.5 1-1V75.2c0-.6-.4-1-1-1H9.3a1 1 0 0 0-1 1v14.4c0 .6.4 1 1 1h14.4zM70.1 0H95A4.1 4.1 0 0 1 99 4.1V29a4.1 4.1 0 0 1-4.1 4.1H70a4.1 4.1 0 0 1-4.1-4.1V4A4.1 4.1 0 0 1 70.1 0zm19.6 24.8c.6 0 1-.5 1-1V9.2c0-.6-.4-1-1-1H75.3a1 1 0 0 0-1 1v14.4c0 .6.4 1 1 1h14.4z"/><path d="M41.3 17.5h4a3 3 0 1 0 0-6.2 1 1 0 0 1-1-1V4.1a3 3 0 0 0-6.1 0v10.3a3 3 0 0 0 3 3.1zM53.5 7.2c.6 0 1 .5 1 1V31a3 3 0 0 0 6.2 0V4.1a3 3 0 0 0-3-3h-4.2a3 3 0 0 0 0 6.1zM23.7 43.3a3 3 0 0 0 3.1 3.1h14.4a3 3 0 0 0 3.1-3V26.7a3 3 0 0 0-6.1 0v12.4c0 .6-.5 1-1 1H26.7a3 3 0 0 0-3 3.1z"/><path d="M12.4 40.2a3 3 0 0 0-3.1 3.1v10.3c0 .6-.5 1-1 1H4a3 3 0 0 0 0 6.2h53.6a3 3 0 0 0 3.1-3V45.4a3 3 0 0 0-6.1 0v8.2c0 .6-.5 1-1 1H16.4a1 1 0 0 1-1-1V43.3a3 3 0 0 0-3.1-3zm44.3 30a3 3 0 0 0-3-3.2H41.1a3 3 0 0 0-3 3.1v16.5a3 3 0 0 0 6.1 0V74.3c0-.6.5-1 1-1h8.3a3 3 0 0 0 3.1-3.2zM95 91.7h-35a1 1 0 0 1-1.1-1v-8.3a3 3 0 1 0-6.2 0v12.4a3 3 0 0 0 3 3H95a3 3 0 0 0 0-6.1z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M80.4 83.5H68.1a3 3 0 0 1-3.1-3V68a3 3 0 0 1 3-3.1h12.4a3 3 0 0 1 3.1 3v12.4a3 3 0 0 1-3 3.1zm-8.2-12.3a1 1 0 0 0-1 1v4.1c0 .6.4 1 1 1h4.1c.6 0 1-.4 1-1v-4.1c0-.6-.4-1-1-1h-4.1z"/><path d="M92.8 52.6a3 3 0 0 0-3 3v26.9a3 3 0 0 0 6.1 0V55.7a3 3 0 0 0-3-3.1zM96 41.2a3 3 0 0 0-3-3H70a3 3 0 0 0-3 3v12.4a3 3 0 0 0 6.1 0v-8.2c0-.6.5-1 1-1h18.6a3 3 0 0 0 3.1-3.1z"/></g></symbol><symbol id="nq-questionmark" viewBox="0 0 16 26"><path d="M7.98 25a2.62 2.62 0 1 1 0-5.24 2.62 2.62 0 0 1 0 5.24zM10.78 14.38c-.64.28-1.05.91-1.05 1.6a1.75 1.75 0 0 1-3.5 0 5.24 5.24 0 0 1 3.15-4.8 3.5 3.5 0 1 0-4.89-3.2 1.75 1.75 0 0 1-3.49 0 6.98 6.98 0 1 1 9.78 6.4z" fill="currentColor"/></symbol><symbol id="nq-scan-qr-code" viewBox="0 0 40 40"><g fill="currentColor"><path d="M1.21 7.06c.67 0 1.21-.54 1.21-1.21l-.04-3.12a.3.3 0 0 1 .3-.3H5.7a1.21 1.21 0 1 0 0-2.43H2.37A2.4 2.4 0 0 0 0 2.42v3.43c0 .67.54 1.21 1.21 1.21zM5.69 37.58H2.73a.3.3 0 0 1-.3-.3v-3.13a1.21 1.21 0 1 0-2.43 0v3.43A2.4 2.4 0 0 0 2.37 40H5.7a1.21 1.21 0 0 0 0-2.42zM38.79 32.94c-.67 0-1.21.54-1.21 1.21l.04 3.12a.3.3 0 0 1-.3.3H34.3a1.21 1.21 0 1 0 0 2.43h3.32A2.4 2.4 0 0 0 40 37.58v-3.43c0-.67-.54-1.21-1.21-1.21zM37.63 0H34.3a1.21 1.21 0 1 0 0 2.42h2.96c.17 0 .3.14.3.3v3.13a1.21 1.21 0 0 0 2.43 0V2.42A2.4 2.4 0 0 0 37.63 0z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M13.94 15.15H6.67c-.67 0-1.22-.54-1.22-1.21V6.67c0-.67.55-1.21 1.22-1.21h7.27c.67 0 1.21.54 1.21 1.2v7.28c0 .67-.54 1.21-1.21 1.21zM8.18 7.88a.3.3 0 0 0-.3.3v4.24c0 .17.13.3.3.3h4.24a.3.3 0 0 0 .3-.3V8.18a.3.3 0 0 0-.3-.3H8.18zM6.67 24.85h7.27c.67 0 1.21.54 1.21 1.21v7.27c0 .67-.54 1.22-1.21 1.22H6.67c-.67 0-1.22-.55-1.22-1.22v-7.27c0-.67.55-1.21 1.22-1.21zm5.75 7.27a.3.3 0 0 0 .3-.3v-4.24a.3.3 0 0 0-.3-.3H8.18a.3.3 0 0 0-.3.3v4.24c0 .17.13.3.3.3h4.24zM26.06 5.45h7.27c.67 0 1.21.55 1.21 1.22v7.27c0 .67-.54 1.21-1.2 1.21h-7.28c-.67 0-1.21-.54-1.21-1.21V6.67c0-.67.54-1.22 1.21-1.22zm5.76 7.28a.3.3 0 0 0 .3-.3V8.17a.3.3 0 0 0-.3-.3h-4.24a.3.3 0 0 0-.3.3v4.24c0 .17.13.3.3.3h4.24z"/><path d="M17.58 10.6h1.2a.9.9 0 1 0 0-1.81.3.3 0 0 1-.3-.3V6.66a.9.9 0 1 0-1.81 0V9.7c0 .5.4.9.9.9zM21.21 7.58c.17 0 .3.13.3.3v6.66a.9.9 0 1 0 1.82 0V6.67c0-.5-.4-.91-.9-.91H21.2a.9.9 0 1 0 0 1.82zM12.42 18.18c0 .5.41.91.91.91h4.25c.5 0 .9-.4.9-.9v-4.86a.9.9 0 1 0-1.81 0v3.64a.3.3 0 0 1-.3.3h-3.04c-.5 0-.9.4-.9.91z"/><path d="M9.09 17.27c-.5 0-.9.4-.9.91v3.03a.3.3 0 0 1-.31.3H6.67a.9.9 0 1 0 0 1.82h15.75c.5 0 .91-.4.91-.9v-3.64a.9.9 0 0 0-1.82 0v2.42a.3.3 0 0 1-.3.3h-10.9a.3.3 0 0 1-.31-.3v-3.03c0-.5-.4-.9-.91-.9zM22.12 26.06c0-.5-.4-.9-.9-.9h-3.64c-.5 0-.91.4-.91.9v4.85a.9.9 0 1 0 1.81 0v-3.64c0-.16.14-.3.3-.3h2.43c.5 0 .91-.4.91-.9zM33.33 32.42h-10.3a.3.3 0 0 1-.3-.3V29.7a.9.9 0 1 0-1.82 0v3.63c0 .5.4.91.9.91h11.52a.9.9 0 0 0 0-1.82z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M29.1 30h-3.65a.9.9 0 0 1-.9-.91v-3.64c0-.5.4-.9.9-.9h3.64c.5 0 .91.4.91.9v3.64c0 .5-.4.91-.9.91zm-2.43-3.64a.3.3 0 0 0-.3.3v1.22c0 .17.13.3.3.3h1.2a.3.3 0 0 0 .31-.3v-1.21a.3.3 0 0 0-.3-.3h-1.21z"/><path d="M32.73 20.9c-.5 0-.91.42-.91.92v7.88a.9.9 0 0 0 1.82 0v-7.88c0-.5-.41-.91-.91-.91zM33.64 17.58c0-.5-.41-.91-.91-.91h-6.67c-.5 0-.9.4-.9.9v3.64a.9.9 0 0 0 1.8 0V18.8c0-.17.15-.3.31-.3h5.46c.5 0 .9-.41.9-.91z"/></g></symbol><symbol id="nq-settings" viewBox="0 0 30 28"><path d="M27.634 15.68H9.544a1.428 1.428 0 0 1 0-2.856h18.09a1.428 1.428 0 0 1 0 2.857zM29.064 25.676c0 .789-.639 1.428-1.428 1.428h-8.569a1.428 1.428 0 0 1 0-2.856h8.57a1.428 1.428 0 0 1 1.427 1.43v-.002zM13.482 27.996a2.856 2.856 0 1 1-.282-5.705 2.856 2.856 0 0 1 .283 5.705zM1.922 24.248h4.76a1.428 1.428 0 0 1 0 2.856h-4.76a1.428 1.428 0 1 1 0-2.856zM.004 13.776a2.856 2.856 0 1 1 5.705.285 2.856 2.856 0 0 1-5.705-.285zM6.691 3.778H1.455a1.428 1.428 0 0 1 0-2.856H6.69a1.428 1.428 0 0 1 0 2.856zM13.177.004a2.856 2.856 0 1 1 .283 5.705 2.856 2.856 0 0 1-.283-5.705zM27.63 4.25h-7.616a1.428 1.428 0 0 1 0-2.855h7.617a1.428 1.428 0 0 1 0 2.856z" fill="currentColor"/></symbol><symbol id="nq-stopwatch" viewBox="0 0 98 123"><path d="M85.7 42.3l8-8a5.1 5.1 0 1 0-7.3-7.2l-8.2 8.2c-7-5.2-15.4-8.5-24-9.4V10.3h10.2a5.1 5.1 0 0 0 0-10.3H33.6a5.1 5.1 0 0 0 0 10.3H44v15.6a48.7 48.7 0 1 0 41.8 16.4zM49 112.8a38.4 38.4 0 1 1 0-77 38.4 38.4 0 0 1 0 77z M54.2 48.6a5.1 5.1 0 0 0-10.3 0V74a5.2 5.2 0 0 0 5.2 5.1 5.1 5.1 0 0 0 5-5V48.5z" fill="currentColor"/></symbol><symbol id="nq-transfer" viewBox="0 0 20 20"><path d="M10.01 14.82a1 1 0 0 0 1.37-.37l3.37-5.83a.17.17 0 0 1 .22-.06l.73.41a.67.67 0 0 0 1-.58l-.07-3.89a.67.67 0 0 0-.99-.57l-3.4 1.89a.67.67 0 0 0 0 1.15l.71.42c.08.05.11.15.06.23l-3.37 5.83a1 1 0 0 0 .37 1.37zM8.23 5.19l-3.55 5.76a.17.17 0 0 1-.23.06l-.55-.32a.67.67 0 0 0-1 .59l.07 3.89a.67.67 0 0 0 .99.57l3.4-1.89a.67.67 0 0 0 0-1.16l-.89-.51a.17.17 0 0 1-.07-.1.16.16 0 0 1 .02-.13l3.52-5.72a1 1 0 1 0-1.7-1.05z" fill="currentColor"/></symbol><symbol id="nq-under-payment" viewBox="0 0 150 149"><path d="M81 103a26 26 0 100-52 26 26 0 000 52zM3 97h15c1 0 2 1 2 3v35c0 2-1 3-2 3H3c-2 0-3-1-3-3v-35c0-2 1-3 3-3zm60 17h-1c-5-7-13-11-21-11H28l-2 1v30l1 1c26 9 37 14 47 14 11 0 21-7 54-24 3-1 4-5 2-8-1-2-3-3-6-3l-5 1-19 6-1 1c-1 6-6 10-12 10H64c-2 0-3-1-3-3s1-3 3-3h23c3 0 6-3 6-6s-3-6-6-6H63zm61-61.8h-.3a24 24 0 01-6.4-1c-1.6-.3-2.5-2-2-3.5.3-1.5 2-2.4 3.5-2 1.6.5 3.3.6 5 .7h.2a22 22 0 005-.6c1.6-.5 3.2.5 3.6 2a3 3 0 01-2.1 3.6 31 31 0 01-6.5.8zm15.8-6.3a3 3 0 01-2-5 21 21 0 003.2-4 3 3 0 014-.9 3 3 0 01.9 4 23 23 0 01-4.2 5c-.5.6-1.2.9-2 .9zm-31.9-.2c-.7 0-1.4-.3-2-.8a28 28 0 01-4.1-5 3 3 0 011-4 3 3 0 014 .8c.8 1.5 2 2.8 3.1 4a3 3 0 01.2 4.1 3 3 0 01-2.2.9zM147 30.5h-.2a2.9 2.9 0 01-2.7-3.1V26c0-1.3 0-2.6-.3-3.8a2.9 2.9 0 015.7-1c.3 1.5.5 3.2.5 4.8v1.7a3 3 0 01-3 2.7zm-46.2-.3a3 3 0 01-2.9-2.7V26c0-1.7.1-3.4.4-5a3 3 0 013.4-2.3 3 3 0 012.4 3.4c-.3 1.3-.4 2.6-.4 4v1a3 3 0 01-2.8 3.1zm41-16a3 3 0 01-2.3-1 20.7 20.7 0 00-3.6-3.5 3 3 0 01-.7-4 3 3 0 014.1-.7c1.7 1.3 3.3 2.8 4.7 4.5 1 1.2.9 3-.4 4-.5.6-1.1.7-1.8.7zm-35.6-.1c-.7 0-1.4-.3-1.9-.7a2.9 2.9 0 01-.3-4.1c1.3-1.7 3-3.1 4.7-4.4a3 3 0 014 .6 3 3 0 01-.5 4 21 21 0 00-3.8 3.5 3 3 0 01-2.2 1zM126.9 6h-.4c-1.7-.2-3.4-.2-5 0a3 3 0 11-.7-5.8c2.1-.3 4.3-.3 6.5 0a3 3 0 012.5 3.2 2.8 2.8 0 01-2.9 2.6z" fill="currentColor"/></symbol><symbol id="nq-view-off" viewBox="0 0 24 24"><g fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M18.9 6.95c1.59 1 3.03 2.21 4.3 3.6.74.82.74 2.07 0 2.9-2.56 2.81-6.79 5.8-11.04 5.8h-.3a11.26 11.26 0 0 1-4.31-.94L3.4 22.45a1 1 0 0 1-1.63-1.08l.01-.01.01-.01 19.5-19.5a.74.74 0 0 0 .18-.3l.02-.01a1 1 0 1 1 1.41 1.41l-4 4zm-5.59 9.35a4.58 4.58 0 0 0 3-3.03 4.3 4.3 0 0 0-.2-3.06.25.25 0 0 0-.4-.07l-5.57 5.56a.25.25 0 0 0 .07.4 4.3 4.3 0 0 0 3.1.2z"/><path d="M7.62 13.4a.24.24 0 0 0 .06-.24A4.32 4.32 0 0 1 7.5 12a4.5 4.5 0 0 1 5.66-4.33c.09.03.18 0 .24-.06l1.94-1.94a.25.25 0 0 0-.1-.42c-1.05-.34-2.14-.5-3.24-.5C7.7 4.69 3.4 7.7.81 10.55a2.15 2.15 0 0 0 0 2.9 21.21 21.21 0 0 0 3.43 3.03c.1.07.24.06.33-.03l3.05-3.05z"/></g></symbol><symbol id="nq-view" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 4.6c4.4-.06 8.79 3.01 11.43 5.92.75.84.75 2.11 0 2.95-2.61 2.88-6.94 5.93-11.28 5.93h-.31c-4.33 0-8.66-3.05-11.27-5.93a2.21 2.21 0 0 1 0-2.95C3.2 7.62 7.6 4.54 12 4.6zm0 2.8a4.6 4.6 0 1 0 0 9.2 4.6 4.6 0 0 0 0-9.2z" fill="currentColor"/><path d="M12 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4z" fill="currentColor"/></symbol></svg>

package/assets/css/legacy/nimiq-style.min.css

@@ -0,0 +1,5 @@
+/*!
+Nimiq Style CSS Framework v0.8.5
+URL: https://github.com/nimiq/nimiq-style
+Styleguide: https://nimiq.com/styleguide
+*/html{font-size:8px;--nimiq-size:8px;font-family:Muli,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-size:2.25rem}.nq-h1,.nq-style h1{font-size:3rem;line-height:1.2;font-weight:700;margin:3rem 0}.nq-h2,.nq-style h2{font-size:2.5rem;line-height:1.2;font-weight:700;margin:2.5rem 0}.nq-h3,.nq-style h3{font-size:2rem;line-height:1.2;font-weight:700;margin:2rem 0}.nq-style p,.nq-text{font-size:2rem;line-height:1.3125;color:rgba(31,35,72,.7);margin:2rem 0}.nq-text-s{font-size:1.75rem;line-height:1.2;font-weight:600;margin:1rem 0}.nq-label{font-size:1.75rem;line-height:.857;font-weight:600;text-transform:uppercase;letter-spacing:.107em;margin:1rem 0;color:rgba(31,35,72,.7)}.nq-notice{font-weight:600;font-size:2rem}.nq-notice.info{color:var(--nimiq-light-blue)}.nq-notice.success{color:var(--nimiq-green)}.nq-notice.warning{color:var(--nimiq-orange)}.nq-notice.error{color:var(--nimiq-red)}.nq-link,.nq-style a,.nq-text a{color:var(--nimiq-light-blue);text-decoration:none;cursor:pointer}.nq-link:active,.nq-link:hover{text-decoration:underline}.nq-list,.nq-style ol,.nq-style ul{font-size:2rem;margin:2rem 0}.nq-list li,.nq-style li{margin:.5rem 0}.nq-button-s::-moz-focus-inner,.nq-button::-moz-focus-inner{border:0}.nq-button{position:relative;height:7.5rem;line-height:2.5rem;background-image:var(--nimiq-blue-bg);color:var(--nimiq-white);font-size:2rem;font-weight:700;text-transform:uppercase;letter-spacing:.094em;border:none;padding:0 4rem;border-radius:500px;min-width:25rem;margin:2rem auto;box-shadow:0 .5rem 1.5rem rgba(0,0,0,.15);cursor:pointer;transition:transform 450ms var(--nimiq-ease),box-shadow 450ms var(--nimiq-ease);will-change:box-shadow;text-decoration:none;display:block;text-align:center;font-family:inherit}a.nq-button{display:inline-flex;color:var(--nimiq-white);justify-content:center;align-items:center}.nq-button:not([disabled])::before{content:"";position:absolute;left:0;top:0;right:0;bottom:0;border-radius:500px;background-image:var(--nimiq-blue-bg-darkened);opacity:0;transition:opacity .3s var(--nimiq-ease);z-index:-1}.nq-button:focus,.nq-button:hover{box-shadow:0 1rem 2.5rem rgba(0,0,0,.2);transform:translate3D(0,-2px,0)}.nq-button:active::before,.nq-button:focus::before,.nq-button:hover::before{opacity:1}.nq-button:active{outline:0;box-shadow:0 .2rem .3rem rgba(0,0,0,.2);transform:translate3D(0,1px,0);transition:transform .2s cubic-bezier(.41,.34,.26,1.55),box-shadow .2s cubic-bezier(.41,.34,.26,1.55)!important}.nq-button-pill,.nq-button-s{display:inline-block;font-size:1.75rem;line-height:3.375rem;height:3.375rem;text-decoration:none;font-weight:700;padding:0 1.5rem;background-color:rgba(31,35,72,.07);color:var(--nimiq-blue);border-radius:1.6875rem;transition:color .3s var(--nimiq-ease),background-color .3s var(--nimiq-ease);will-change:color,background-color;border:none;cursor:pointer;position:relative;font-family:inherit}.nq-button-s[disabled]{opacity:.4;cursor:not-allowed}.nq-button-pill::before,.nq-button-s::before{content:'';display:block;position:absolute;left:-1.5rem;top:-1.5rem;right:-1.5rem;bottom:-1.5rem}.nq-button-s:active,.nq-button-s:focus,.nq-button-s:hover{color:var(--nimiq-blue-darkened);background:rgba(31,35,72,.12)}.nq-button-s[disabled]:hover{background:rgba(31,35,72,.07)}.nq-button-pill{color:var(--nimiq-white);background:var(--nimiq-blue);background-image:var(--nimiq-blue-bg)}.nq-button-pill:active,.nq-button-pill:focus,.nq-button-pill:hover{background:var(--nimiq-blue-darkened);background-image:var(--nimiq-blue-bg-darkened)}.nq-button.light-blue{background:var(--nimiq-light-blue);background-image:var(--nimiq-light-blue-bg)}.nq-button.light-blue::before{background-image:var(--nimiq-light-blue-bg-darkened)}.nq-button.light-blue.inverse{color:var(--nimiq-light-blue)}.nq-button.light-blue.inverse:active,.nq-button.light-blue.inverse:focus,.nq-button.light-blue.inverse:hover{color:var(--nimiq-light-blue-darkened)}.nq-button-s.light-blue{color:var(--nimiq-light-blue);background:rgba(5,130,202,.1)}.nq-button-s.light-blue:active,.nq-button-s.light-blue:focus,.nq-button-s.light-blue:hover{color:var(--nimiq-light-blue-darkened);background:rgba(5,130,202,.2)}.nq-button-s.light-blue[disabled]:hover{color:var(--nimiq-light-blue);background:rgba(5,130,202,.1)}.nq-button-pill.light-blue{background:var(--nimiq-light-blue);background-image:var(--nimiq-light-blue-bg)}.nq-button-pill.light-blue:active,.nq-button-pill.light-blue:focus,.nq-button-pill.light-blue:hover{background:var(--nimiq-light-blue-darkened);background-image:var(--nimiq-light-blue-bg-darkened)}.nq-button.green{background:var(--nimiq-green);background-image:var(--nimiq-green-bg)}.nq-button.green::before{background-image:var(--nimiq-green-bg-darkened)}.nq-button.green.inverse{color:var(--nimiq-green)}.nq-button.green.inverse:active,.nq-button.green.inverse:focus,.nq-button.green.inverse:hover{color:var(--nimiq-green-darkened)}.nq-button-s.green{color:var(--nimiq-green);background:rgba(33,188,165,.1)}.nq-button-s.green:active,.nq-button-s.green:focus,.nq-button-s.green:hover{color:var(--nimiq-green-darkened);background:rgba(33,188,165,.2)}.nq-button-s.green[disabled]:hover{color:var(--nimiq-green);background:rgba(33,188,165,.1)}.nq-button-pill.green{background:var(--nimiq-green);background-image:var(--nimiq-green-bg)}.nq-button-pill.green:active,.nq-button-pill.green:focus,.nq-button-pill.green:hover{background:var(--nimiq-green-darkened);background-image:var(--nimiq-green-bg-darkened)}.nq-button.orange{background:var(--nimiq-orange);background-image:var(--nimiq-orange-bg)}.nq-button.orange::before{background-image:var(--nimiq-orange-bg-darkened)}.nq-button.orange.inverse{color:var(--nimiq-orange)}.nq-button.orange.inverse:active,.nq-button.orange.inverse:focus,.nq-button.orange.inverse:hover{color:var(--nimiq-orange-darkened)}.nq-button-s.orange{color:var(--nimiq-orange);background:rgba(252,135,2,.1)}.nq-button-s.orange:active,.nq-button-s.orange:focus,.nq-button-s.orange:hover{color:var(--nimiq-orange-darkened);background:rgba(252,135,2,.2)}.nq-button-s.orange[disabled]:hover{color:var(--nimiq-orange);background:rgba(252,135,2,.1)}.nq-button-pill.orange{background:var(--nimiq-orange);background-image:var(--nimiq-orange-bg)}.nq-button-pill.orange:active,.nq-button-pill.orange:focus,.nq-button-pill.orange:hover{background:var(--nimiq-orange-darkened);background-image:var(--nimiq-orange-bg-darkened)}.nq-button.red{background:var(--nimiq-red);background-image:var(--nimiq-red-bg)}.nq-button.red::before{background:var(--nimiq-red-bg-darkened)}.nq-button.red.inverse{color:var(--nimiq-red)}.nq-button.red.inverse:active,.nq-button.red.inverse:focus,.nq-button.red.inverse:hover{color:var(--nimiq-red-darkened)}.nq-button-s.red{color:var(--nimiq-red);background:rgba(216,65,51,.1)}.nq-button-s.red:active,.nq-button-s.red:focus,.nq-button-s.red:hover{color:var(--nimiq-red-darkened);background:rgba(216,65,51,.2)}.nq-button-s.red[disabled]:hover{color:var(--nimiq-red);background:rgba(216,65,51,.1)}.nq-button-pill.red{background:var(--nimiq-red);background-image:var(--nimiq-red-bg)}.nq-button-pill.red:active,.nq-button-pill.red:focus,.nq-button-pill.red:hover{background:var(--nimiq-red-darkened);background-image:var(--nimiq-red-bg-darkened)}.nq-button.gold{background:var(--nimiq-gold);background-image:var(--nimiq-gold-bg)}.nq-button.gold:before{background:var(--nimiq-gold-bg-darkened)}.nq-button.gold.inverse{color:var(--nimiq-gold)}.nq-button.gold.inverse:active,.nq-button.gold.inverse:focus,.nq-button.gold.inverse:hover{color:var(--nimiq-gold-darkened)}.nq-button-pill.gold{background:var(--nimiq-gold);background-image:var(--nimiq-gold-bg)}.nq-button-pill.gold:active,.nq-button-pill.gold:focus,.nq-button-pill.gold:hover{background:var(--nimiq-gold-darkened);background-image:var(--nimiq-gold-bg-darkened)}.nq-button.inverse{background:var(--nimiq-white);color:var(--nimiq-blue);transition:transform 450ms var(--nimiq-ease),box-shadow 450ms var(--nimiq-ease),color .3s var(--nimiq-ease)}.nq-button.inverse::before{background:#eff0f2}.nq-button-s.inverse{background:rgba(255,255,255,.2);color:var(--nimiq-white)}.nq-button-s.inverse:active,.nq-button-s.inverse:focus,.nq-button-s.inverse:hover{background:rgba(255,255,255,.25)}.nq-button[disabled]{background:rgba(31,35,72,.07);color:rgba(31,35,72,.3);box-shadow:none!important;transform:none;cursor:not-allowed}.nq-button[disabled]:active,.nq-button[disabled]:hover{transform:none}.nq-button.inverse[disabled],.nq-button.inverse[disabled]:active,.nq-button.inverse[disabled]:hover{background:rgba(255,255,255,.2);color:rgba(255,255,255,.5)}.nq-button-pill::after,.nq-button-s::after,.nq-button::after{content:"";position:absolute;left:-5px;top:-5px;right:-5px;bottom:-5px;border:2px solid rgba(5,130,202,.5);border-radius:500px;opacity:0}.nq-button-pill.inverse::after,.nq-button-s.inverse::after,.nq-button.inverse::after{border-color:rgba(255,255,255,.4)}.nq-button-pill:focus,.nq-button-s:focus,.nq-button:focus{outline:0}.nq-button-pill:focus::after,.nq-button-s:focus::after,.nq-button:focus::after{opacity:1}.nq-input,.nq-input-s{font-family:inherit;font-size:inherit;font-weight:inherit;padding:1.25rem 2.25rem;border:none;--border-color:rgba(31, 35, 72, 0.1);box-shadow:inset 0 0 0 .25rem var(--border-color);color:var(--nimiq-blue);background:0 0;border-radius:.5rem;outline:0;transition:color .2s ease,box-shadow .2s ease;background-clip:padding-box}.nq-input-s{padding:.6875rem 1.4375rem;box-shadow:inset 0 0 0 .1875rem var(--border-color)}.nq-input-s.vanishing,.nq-input.vanishing{--border-color:rgba(31, 35, 72, 0)}.nq-input-s::placeholder,.nq-input::placeholder{color:rgba(31,35,72,.5);transition:color .2s ease}.nq-input-s:hover,.nq-input:hover{--border-color:rgba(31, 35, 72, 0.14)}.nq-input-s:focus::placeholder,.nq-input-s:hover::placeholder,.nq-input:focus::placeholder,.nq-input:hover::placeholder{color:rgba(5,130,202,.7)}.nq-input-s.vanishing:focus,.nq-input-s:focus,.nq-input.vanishing:focus,.nq-input:focus{--border-color:rgba(5, 130, 202, 0.2);color:var(--nimiq-light-blue)}body,html{box-sizing:border-box;-webkit-overflow-scrolling:touch;min-width:300px}*,:after,:before{box-sizing:inherit}.flex-grow{flex-grow:1}.flex-grow-half{flex-grow:.5}.flex-grow-double{flex-grow:2}.hidden{visibility:hidden}.display-none{display:none!important}.nq-card{max-width:75rem;background:var(--nimiq-card-bg);border-radius:1.25rem;box-shadow:0 .5rem 3.5rem rgba(0,0,0,.111158);margin:2rem;color:var(--nimiq-blue)}@media (max-width:450px){.nq-card{margin:2rem 1rem}}.nq-card-header{padding:4rem;text-align:center;border-top-left-radius:1rem;border-top-right-radius:1rem}@media (max-width:450px){.nq-card-header{padding:3rem}}.nq-card-header .nq-h1,.nq-card-header .nq-h2{margin:0}.nq-card-header .nq-notice{margin:3rem 0 0;text-align:center}.nq-card-body{padding:4rem}@media (max-width:450px){.nq-card-body{padding:3rem}}.nq-card-header+.nq-card-body{padding-top:1rem}.nq-card-body>:first-child{margin-top:0}.nq-card-body>:last-child{margin-bottom:0}.nq-card-footer{padding:1rem;border-bottom-left-radius:1rem;border-bottom-right-radius:1rem}.nq-card-body+.nq-card-footer{padding-top:0}.margin-top-5{margin-top:5rem}.margin-top-4{margin-top:4rem}.margin-top-3{margin-top:3rem}.margin-top-2{margin-top:2rem}.margin-top-1{margin-top:1rem}.nq-shadow{box-shadow:0 .5rem 1.5rem rgba(0,0,0,.15)}.nq-shadow-l{box-shadow:0 .5rem 2.5rem rgba(0,0,0,.15)}html{--nimiq-blue:#1F2348;--nimiq-light-blue:#0582CA;--nimiq-gold:#E9B213;--nimiq-green:#21BCA5;--nimiq-orange:#FC8702;--nimiq-red:#D94432;--nimiq-purple:#5F4B8B;--nimiq-pink:#FA7268;--nimiq-light-green:#88B04B;--nimiq-brown:#795548;--nimiq-gray:#F4F4F4;--nimiq-light-gray:#FAFAFA;--nimiq-white:#FFF;--nimiq-light-blue-on-dark:#0CA6FE;--nimiq-red-on-dark:#FF5C48;--nimiq-blue-darkened:#151833;--nimiq-light-blue-darkened:#0071C3;--nimiq-gold-darkened:#E5A212;--nimiq-green-darkened:#20B29E;--nimiq-orange-darkened:#FC7500;--nimiq-red-darkened:#D13030;--nimiq-blue-bg:radial-gradient(100% 100% at bottom right, #260133, var(--nimiq-blue));--nimiq-light-blue-bg:radial-gradient(100% 100% at bottom right, #265DD7, var(--nimiq-light-blue));--nimiq-gold-bg:radial-gradient(100% 100% at bottom right, #EC991C, var(--nimiq-gold));--nimiq-green-bg:radial-gradient(100% 100% at bottom right, #41A38E, var(--nimiq-green));--nimiq-orange-bg:radial-gradient(100% 100% at bottom right, #FD6216, var(--nimiq-orange));--nimiq-red-bg:radial-gradient(100% 100% at bottom right, #CC3047, var(--nimiq-red));--nimiq-purple-bg:radial-gradient(100% 100% at bottom right, #4D4C96, var(--nimiq-purple));--nimiq-pink-bg:radial-gradient(100% 100% at bottom right, #E0516B, var(--nimiq-pink));--nimiq-light-green-bg:radial-gradient(100% 100% at bottom right, #70B069, var(--nimiq-light-green));--nimiq-brown-bg:radial-gradient(100% 100% at bottom right, #724147, var(--nimiq-brown));--nimiq-blue-bg-darkened:radial-gradient(100% 100% at bottom right, #180021, var(--nimiq-blue-darkened));--nimiq-light-blue-bg-darkened:radial-gradient(100% 100% at bottom right, #2355C4, var(--nimiq-light-blue-darkened));--nimiq-gold-bg-darkened:radial-gradient(100% 100% at bottom right, #E58A1B, var(--nimiq-gold-darkened));--nimiq-green-bg-darkened:radial-gradient(100% 100% at bottom right, #3D9988, var(--nimiq-green-darkened));--nimiq-orange-bg-darkened:radial-gradient(100% 100% at bottom right, #EA5200, var(--nimiq-orange-darkened));--nimiq-red-bg-darkened:radial-gradient(100% 100% at bottom right, #BF2D46, var(--nimiq-red-darkened));--nimiq-highlight-bg:rgba(31, 35, 72, 0.06);--nimiq-card-bg:white}body{color:var(--nimiq-blue);background:var(--nimiq-gray);margin:0}.nq-blue{color:var(--nimiq-blue)!important}.nq-light-blue{color:var(--nimiq-light-blue)!important}.nq-gold{color:var(--nimiq-gold)!important}.nq-green{color:var(--nimiq-green)!important}.nq-orange{color:var(--nimiq-orange)!important}.nq-red{color:var(--nimiq-red)!important}.nq-purple{color:var(--nimiq-purple)!important}.nq-pink{color:var(--nimiq-pink)!important}.nq-light-green{color:var(--nimiq-light-green)!important}.nq-brown{color:var(--nimiq-brown)!important}.nq-blue-bg{background:var(--nimiq-blue);background-image:var(--nimiq-blue-bg)}.nq-light-blue-bg{background:var(--nimiq-light-blue);background-image:var(--nimiq-light-blue-bg)}.nq-gold-bg{background:var(--nimiq-gold);background-image:var(--nimiq-gold-bg)}.nq-green-bg{background:var(--nimiq-green);background-image:var(--nimiq-green-bg)}.nq-orange-bg{background:var(--nimiq-orange);background-image:var(--nimiq-orange-bg)}.nq-red-bg{background:var(--nimiq-red);background-image:var(--nimiq-red-bg)}.nq-purple-bg{background:var(--nimiq-purple);background-image:var(--nimiq-purple-bg)}.nq-pink-bg{background:var(--nimiq-pink);background-image:var(--nimiq-pink-bg)}.nq-light-green-bg{background:var(--nimiq-light-green);background-image:var(--nimiq-light-green-bg)}.nq-brown-bg{background:var(--nimiq-brown);background-image:var(--nimiq-brown-bg)}.nq-gray-bg{background:var(--nimiq-gray)}.nq-blue-bg,.nq-blue-bg .nq-link,.nq-gold-bg,.nq-gold-bg .nq-link,.nq-green-bg,.nq-green-bg .nq-link,.nq-light-blue-bg,.nq-light-blue-bg .nq-link,.nq-orange-bg,.nq-orange-bg .nq-link,.nq-red-bg,.nq-red-bg .nq-link{color:var(--nimiq-white)}.nq-blue-bg .nq-label,.nq-blue-bg .nq-text,.nq-gold-bg .nq-label,.nq-gold-bg .nq-text,.nq-green-bg .nq-label,.nq-green-bg .nq-text,.nq-light-blue-bg .nq-label,.nq-light-blue-bg .nq-text,.nq-orange-bg .nq-label,.nq-orange-bg .nq-text,.nq-red-bg .nq-label,.nq-red-bg .nq-text{color:rgba(255,255,255,.7)}.nq-blue-bg,.nq-blue-bg .nq-card .nq-blue-bg{--nimiq-light-blue:var(--nimiq-light-blue-on-dark);--nimiq-red:var(--nimiq-red-on-dark)}.nq-blue-bg .nq-button.inverse,.nq-blue-bg .nq-card{--nimiq-light-blue:#0582CA;--nimiq-red:#D94432}.nq-blue-bg .nq-input,.nq-blue-bg .nq-input-s{--border-color:rgba(255, 255, 255, 0.2);color:var(--nimiq-white)}.nq-blue-bg .nq-input-s.vanishing,.nq-blue-bg .nq-input.vanishing{--border-color:rgba(255, 255, 255, 0)}.nq-blue-bg .nq-input-s::placeholder,.nq-blue-bg .nq-input::placeholder{color:rgba(255,255,255,.3)}.nq-blue-bg .nq-input-s:focus,.nq-blue-bg .nq-input-s:hover,.nq-blue-bg .nq-input:focus,.nq-blue-bg .nq-input:hover{--border-color:rgba(255, 255, 255, 0.3);color:var(--nimiq-white)}.nq-icon{width:1em;height:1em}html{--nimiq-ease:cubic-bezier(0.25, 0, 0, 1);--attr-duration:.2s;--movement-duration:.4s}

package/assets/css/modern/animations.css

@@ -0,0 +1,179 @@
+@keyframes spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes shake {
+  from {
+    transform: none;
+  }
+
+  15% {
+    transform: translate3d(-21%, 0, 0) rotate(-5deg);
+  }
+
+  30% {
+    transform: translate3d(13%, 0, 0) rotate(3deg);
+  }
+
+  45% {
+    transform: translate3d(-8%, 0, 0) rotate(-3deg);
+  }
+
+  60% {
+    transform: translate3d(5%, 0, 0) rotate(2deg);
+  }
+
+  75% {
+    transform: translate3d(-3%, 0, 0) rotate(-1deg);
+  }
+
+  to {
+    transform: none;
+  }
+}
+
+@keyframes fade {
+  from {
+    opacity: 0;
+  }
+}
+
+@keyframes move-left {
+  from {
+    transform: translateX(-100%);
+  }
+}
+
+@keyframes move-right {
+  from {
+    transform: translateX(100%);
+  }
+}
+
+@keyframes shrink {
+  from {
+    transform: scale(1.1);
+  }
+}
+
+@keyframes grow {
+  from {
+    transform: scale(0.9);
+  }
+}
+
+@keyframes from-left {
+  from {
+    transform: scale(0.8) translateX(-50%);
+    opacity: 0;
+  }
+  25% {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes from-right {
+  from {
+    transform: scale(0.8) translateX(50%);
+    opacity: 0;
+  }
+  25% {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes from-bottom {
+  from {
+    opacity: 0;
+    transform: translateY(50px);
+  }
+  25% {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+.shake {
+  animation-name: shake;
+}
+
+.fade-in,
+.fade-out {
+  animation-name: fade;
+}
+
+.move-left-in,
+.move-left-out {
+  animation-name: move-left;
+}
+
+.move-right-in,
+.move-right-out {
+  animation-name: move-right;
+}
+
+.shrink-in,
+.shrink-out {
+  animation-name: shrink;
+}
+
+.grow-in,
+.grow-out {
+  animation-name: grow;
+}
+
+.from-left-in,
+.from-left-out {
+  animation-name: from-left;
+}
+
+.from-right-in,
+.from-right-out {
+  animation-name: from-bottom;
+}
+
+.from-bottom-in,
+.from-bottom-out {
+  animation-name: from-bottom;
+}
+
+.fade-out,
+.move-left-out,
+.move-right-out,
+.shrink-out,
+.grow-out,
+.from-left-out,
+.from-right-out,
+.from-bottom-out {
+  animation-direction: reverse;
+}
+
+.shake,
+.fade-in,
+.fade-out,
+.move-left-in,
+.move-left-out,
+.move-right-in,
+.move-right-out,
+.shrink-in,
+.shrink-out,
+.grow-in,
+.grow-out,
+.from-left-in,
+.from-left-out,
+.from-right-in,
+.from-right-out,
+.from-bottom-in,
+.from-bottom-out {
+  animation-duration: 400ms;
+}

package/assets/css/modern/atomic.css

@@ -0,0 +1,148 @@
+/*
+This file contains atomic CSS classes for styling elements. These classes are very powerful for applying styles, but are only available when using CSS directly. If you're using a library with plugin integration, such as TailwindCSS or UnoCSS, you'll need to use the classes provided by those libraries.
+*/
+
+.flex-grow {
+  flex-grow: 1;
+}
+
+.flex-grow-half {
+  flex-grow: 0.5;
+}
+
+.flex-grow-double {
+  flex-grow: 2;
+}
+
+.hidden {
+  visibility: hidden;
+}
+
+.display-none {
+  display: none;
+}
+
+.margin-top-5 {
+  margin-top: 2.5rem;
+}
+
+.margin-top-4 {
+  margin-top: 2rem;
+}
+
+.margin-top-3 {
+  margin-top: 1.5rem;
+}
+
+.margin-top-2 {
+  margin-top: 1rem;
+}
+
+.margin-top-1 {
+  margin-top: 0.5rem;
+}
+
+.text-green {
+  color: var(--colors-green);
+}
+
+.text-orange {
+  color: var(--colors-orange);
+}
+
+.text-red {
+  color: var(--colors-red);
+}
+
+.text-blue {
+  color: var(--colors-blue);
+}
+
+.text-gold {
+  color: var(--colors-gold);
+}
+
+.text-neutral {
+  color: var(--colors-neutral);
+}
+
+.bg-neutral-gradient {
+  background: var(--colors-neutral);
+  background-image: var(--colors-gradient-neutral);
+}
+
+.bg-neutral-50 {
+  background: var(--colors-neutral-50);
+}
+
+.bg-neutral-100 {
+  background: var(--colors-neutral-100);
+}
+
+.bg-neutral-200 {
+  background: var(--colors-neutral-200);
+}
+
+.bg-neutral-300 {
+  background: var(--colors-neutral-300);
+}
+
+.bg-neutral-400 {
+  background: var(--colors-neutral-400);
+}
+
+.bg-neutral-500 {
+  background: var(--colors-neutral-500);
+}
+
+.bg-neutral-600 {
+  background: var(--colors-neutral-600);
+}
+
+.bg-neutral-700 {
+  background: var(--colors-neutral-700);
+}
+
+.bg-neutral-800 {
+  background: var(--colors-neutral-800);
+}
+
+.bg-neutral-900 {
+  background: var(--colors-neutral-900);
+}
+
+.bg-neutral-1100 {
+  background: var(--colors-neutral-1100);
+}
+
+.bg-green {
+  background: var(--colors-green);
+}
+
+.bg-gold {
+  background: var(--colors-gold);
+}
+
+.bg-blue {
+  background: var(--colors-blue);
+}
+
+.bg-red {
+  background: var(--colors-red);
+}
+
+.bg-purple {
+  background: var(--colors-purple);
+}
+
+.bg-orange {
+  background: var(--colors-orange);
+}
+
+.nq-shadow {
+  box-shadow: var(--colors-shadow);
+}
+
+.nq-shadow-lg {
+  box-shadow: var(--colors-shadow-lg);
+}

package/assets/css/modern/colors.css

@@ -0,0 +1,82 @@
+/*Auto-generated*/
+:root {
+  --colors-white: oklch(1 0 90);
+  --colors-darkblue: oklch(0.2737 0.068 276.29);
+  --colors-darkerblue: oklch(0.2182 0.0371 280.55);
+  --colors-neutral-0: light-dark(oklch(1 0 90), oklch(0.2737 0.068 276.29));
+  --colors-neutral-50: light-dark(oklch(0.9881 0 89.88), oklch(0.2388 0.0344 281));
+  --colors-neutral-100: light-dark(oklch(0.9791 0 89.88), oklch(0.2472 0.0341 281.14));
+  --colors-neutral-200: light-dark(oklch(0.9677 0.0027 286.35), oklch(0.2679 0.0334 281.42));
+  --colors-neutral-300: light-dark(oklch(0.95 0.004 286.32), oklch(0.2842 0.033 281.61));
+  --colors-neutral-400: light-dark(oklch(0.9203 0.0067 286.27), oklch(0.3117 0.0304 281.85));
+  --colors-neutral-500: light-dark(oklch(0.8681 0.0096 279.67), oklch(0.3991 0.0252 282.18));
+  --colors-neutral-600: light-dark(oklch(0.8347 0.0125 281.04), oklch(0.4429 0.0229 282.19));
+  --colors-neutral-700: light-dark(oklch(0.6613 0.0281 280.83), oklch(0.64 0.0148 285.97));
+  --colors-neutral-800: light-dark(oklch(0.5889 0.0335 281.21), oklch(0.7168 0.0101 279.62));
+  --colors-neutral-900: light-dark(oklch(0.4374 0.0495 279.71), oklch(0.8619 0.0055 286.28));
+  --colors-neutral-1100: light-dark(oklch(1 0 90), oklch(0.2185 0.0213 246.2deg));
+  --colors-neutral: light-dark(oklch(0.2737 0.068 276.29), oklch(1 0 90));
+  --colors-blue-400: light-dark(oklch(0.9545 0.0167 236.69), oklch(0.2716 0.0521 257.92));
+  --colors-blue-500: light-dark(oklch(0.9109 0.0327 232.24), oklch(0.3193 0.0701 251.54));
+  --colors-blue-600: light-dark(oklch(0.8885 0.0428 231.75), oklch(0.3477 0.0771 249.07));
+  --colors-blue-1100: light-dark(oklch(0.481 0.1164 243.72), oklch(0.6982 0.1694 243.83));
+  --colors-blue: light-dark(oklch(0.5849 0.1438 244.29), oklch(0.6982 0.1694 243.83));
+  --colors-green-400: light-dark(oklch(0.9637 0.017 187.9), oklch(0.2764 0.0331 242.34));
+  --colors-green-500: light-dark(oklch(0.9307 0.034 185.2), oklch(0.333 0.0416 210.14));
+  --colors-green-600: light-dark(oklch(0.9154 0.0432 185.62), oklch(0.3622 0.0475 203.62));
+  --colors-green-1100: light-dark(oklch(0.5564 0.0992 178.59), oklch(0.755 0.1426 170.23));
+  --colors-green: light-dark(oklch(0.6932 0.1245 178.48), oklch(0.755 0.1426 170.23));
+  --colors-orange-400: light-dark(oklch(0.951 0.0221 74.1), oklch(0.2755 0.014 3.07));
+  --colors-orange-500: light-dark(oklch(0.9396 0.0436 71.7), oklch(0.3344 0.0381 61.07));
+  --colors-orange-600: light-dark(oklch(0.9251 0.0549 71.49), oklch(0.3634 0.0513 63.86));
+  --colors-orange-1100: light-dark(oklch(0.6769 0.1633 57), oklch(0.772 0.1738 64.55));
+  --colors-orange: light-dark(oklch(0.7387 0.179 56.67), oklch(0.772 0.1738 64.55));
+  --colors-red-400: light-dark(oklch(0.9544 0.0166 26.65), oklch(0.2655 0.0357 328.64));
+  --colors-red-500: light-dark(oklch(0.9112 0.0328 27.11), oklch(0.3103 0.0508 358.44));
+  --colors-red-600: light-dark(oklch(0.8878 0.0422 25.25), oklch(0.3368 0.0603 6.45));
+  --colors-red-1100: light-dark(oklch(0.515 0.1713 30.54), oklch(0.6881 0.2018 30.03));
+  --colors-red: light-dark(oklch(0.598 0.1886 30.3), oklch(0.6881 0.2018 30.03));
+  --colors-gold-400: light-dark(oklch(0.9765 0.022 89.79), oklch(0.2916 0.009 340.92));
+  --colors-gold-500: light-dark(oklch(0.9556 0.0434 91.27), oklch(0.3564 0.0252 69.32));
+  --colors-gold-600: light-dark(oklch(0.9434 0.0539 92.15), oklch(0.3918 0.0369 76.19));
+  --colors-gold-1100: light-dark(oklch(0.6642 0.1329 85.55), oklch(0.8517 0.1579 83.77));
+  --colors-gold: light-dark(oklch(0.7924 0.1593 85.61), oklch(0.8517 0.1579 83.77));
+  --colors-purple-400: light-dark(oklch(0.9494 0.0083 301.35), oklch(0.2524 0.0591 291.66));
+  --colors-purple-500: light-dark(oklch(0.8984 0.0181 300.04), oklch(0.2869 0.0801 296.38));
+  --colors-purple-600: light-dark(oklch(0.8725 0.0224 300.16), oklch(0.3037 0.0894 298.08));
+  --colors-purple-1100: light-dark(oklch(0.3841 0.0825 296.42), oklch(0.5483 0.2189 304.41));
+  --colors-purple: light-dark(oklch(0.4629 0.1027 296.59), oklch(0.5483 0.2189 304.41));
+  --colors-neutral-gradient-from: light-dark(oklab(0.2737 0.0075 -0.0676), oklab(0.1553 0.0542 -0.0519));
+  --colors-neutral-gradient-to: light-dark(oklab(0.2018 0.0685 -0.0675), oklab(0.2221 0.0059 -0.0521));
+  --colors-neutral-gradient: radial-gradient(at 100% 100% in oklab, var(--colors-neutral-gradient-from), var(--colors-neutral-gradient-to));
+  --colors-blue-gradient-from: light-dark(oklab(0.5849 -0.0624 -0.1296), oklab(0.6982 -0.0747 -0.1520));
+  --colors-blue-gradient-to: light-dark(oklab(0.5849 -0.0624 -0.1296), oklab(0.6982 -0.0747 -0.1520));
+  --colors-blue-gradient: radial-gradient(at 100% 100% in oklab, var(--colors-blue-gradient-from), var(--colors-blue-gradient-to));
+  --colors-blue-gradient-darkened-from: light-dark(oklab(0.4857 -0.0220 -0.1807), oklab(0.5755 -0.0480 -0.1764));
+  --colors-blue-gradient-darkened-to: light-dark(oklab(0.5404 -0.0523 -0.1438), oklab(0.6546 -0.0695 -0.1422));
+  --colors-blue-gradient-darkened: radial-gradient(at 100% 100% in oklab, var(--colors-blue-gradient-darkened-from), var(--colors-blue-gradient-darkened-to));
+  --colors-green-gradient-from: light-dark(oklab(0.6000 -0.1198 0.0072), oklab(0.6500 -0.1659 0.0372));
+  --colors-green-gradient-to: light-dark(oklab(0.6932 -0.1245 0.0033), oklab(0.7550 -0.1405 0.0242));
+  --colors-green-gradient: radial-gradient(at 100% 100% in oklab, var(--colors-green-gradient-from), var(--colors-green-gradient-to));
+  --colors-green-gradient-darkened-from: light-dark(oklab(0.6231 -0.0909 0.0017), oklab(0.7142 -0.1422 0.0319));
+  --colors-green-gradient-darkened-to: light-dark(oklab(0.6873 -0.1184 -0.0011), oklab(0.6971 -0.1282 0.0212));
+  --colors-green-gradient-darkened: radial-gradient(at 100% 100% in oklab, var(--colors-green-gradient-darkened-from), var(--colors-green-gradient-darkened-to));
+  --colors-orange-gradient-from: light-dark(oklab(0.6500 0.1657 0.1447), oklab(0.7000 0.1105 0.1667));
+  --colors-orange-gradient-to: light-dark(oklab(0.7387 0.0984 0.1496), oklab(0.7720 0.0747 0.1569));
+  --colors-orange-gradient: radial-gradient(at 100% 100% in oklab, var(--colors-orange-gradient-from), var(--colors-orange-gradient-to));
+  --colors-orange-gradient-darkened-from: light-dark(oklab(0.6387 0.1530 0.1288), oklab(0.7442 0.1001 0.1509));
+  --colors-orange-gradient-darkened-to: light-dark(oklab(0.7115 0.1244 0.1440), oklab(0.7438 0.0703 0.1509));
+  --colors-orange-gradient-darkened: radial-gradient(at 100% 100% in oklab, var(--colors-orange-gradient-darkened-from), var(--colors-orange-gradient-darkened-to));
+  --colors-red-gradient-from: light-dark(oklab(0.5000 0.2088 0.0692), oklab(0.6000 0.2142 0.1288));
+  --colors-red-gradient-to: light-dark(oklab(0.5980 0.1628 0.0952), oklab(0.6881 0.1747 0.1010));
+  --colors-red-gradient: radial-gradient(at 100% 100% in oklab, var(--colors-red-gradient-from), var(--colors-red-gradient-to));
+  --colors-red-gradient-darkened-from: light-dark(oklab(0.5344 0.1734 0.0523), oklab(0.6515 0.2016 0.1213));
+  --colors-red-gradient-darkened-to: light-dark(oklab(0.5653 0.1770 0.0874), oklab(0.6633 0.1597 0.0937));
+  --colors-red-gradient-darkened: radial-gradient(at 100% 100% in oklab, var(--colors-red-gradient-darkened-from), var(--colors-red-gradient-darkened-to));
+  --colors-gold-gradient-from: light-dark(oklab(0.7000 0.0595 0.1592), oklab(0.7800 0.0503 0.1624));
+  --colors-gold-gradient-to: light-dark(oklab(0.7924 0.0122 0.1588), oklab(0.8517 0.0171 0.1570));
+  --colors-gold-gradient: radial-gradient(at 100% 100% in oklab, var(--colors-gold-gradient-from), var(--colors-gold-gradient-to));
+  --colors-gold-gradient-darkened-from: light-dark(oklab(0.7143 0.0695 0.1390), oklab(0.8163 0.0458 0.1479));
+  --colors-gold-gradient-darkened-to: light-dark(oklab(0.7575 0.0315 0.1515), oklab(0.8221 0.0167 0.1498));
+  --colors-gold-gradient-darkened: radial-gradient(at 100% 100% in oklab, var(--colors-gold-gradient-darkened-from), var(--colors-gold-gradient-darkened-to));
+}

package/assets/css/modern/fonts.css

@@ -0,0 +1,17 @@
+@font-face {
+  font-family: 'Fira Mono';
+  src: url('/assets/fonts/FiraMono-400.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Mulish';
+  font-style: normal;
+  font-weight: 200 1000;
+  src: url('/assets/fonts/Mulish-VariableFont_wght.ttf') format('woff2');
+  font-display: swap;
+  unicode-range:
+    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
+    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}