diff --git a/.changeset/curly-zoos-thank.md b/.changeset/curly-zoos-thank.md
new file mode 100644
index 0000000000..ec55b2abb9
--- /dev/null
+++ b/.changeset/curly-zoos-thank.md
@@ -0,0 +1,5 @@
+---
+'@backstage/canon': patch
+---
+
+We are consolidating all css files into a single styles.css in Canon.
diff --git a/.changeset/empty-poets-give.md b/.changeset/empty-poets-give.md
new file mode 100644
index 0000000000..2eb63c2ed5
--- /dev/null
+++ b/.changeset/empty-poets-give.md
@@ -0,0 +1,5 @@
+---
+'@backstage/canon': patch
+---
+
+Add new `RadioGroup` + `Radio` component to Canon
diff --git a/.changeset/gentle-llamas-press.md b/.changeset/gentle-llamas-press.md
new file mode 100644
index 0000000000..9c922d396f
--- /dev/null
+++ b/.changeset/gentle-llamas-press.md
@@ -0,0 +1,6 @@
+---
+'@backstage/backend-defaults': patch
+'@backstage/backend-test-utils': minor
+---
+
+Add a standard `toString` on credentials objects
diff --git a/.changeset/sharp-stars-report.md b/.changeset/sharp-stars-report.md
new file mode 100644
index 0000000000..c37e0e39ea
--- /dev/null
+++ b/.changeset/sharp-stars-report.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-scaffolder-backend': patch
+---
+
+Replaced deprecated uses of `@backstage/backend-common` with the equivalents in `@backstage/backend-defaults` and `@backstage/backend-plugin-api`.
diff --git a/.changeset/silent-vans-tie.md b/.changeset/silent-vans-tie.md
new file mode 100644
index 0000000000..b81564be7e
--- /dev/null
+++ b/.changeset/silent-vans-tie.md
@@ -0,0 +1,5 @@
+---
+'@backstage/canon': patch
+---
+
+Added placeholder prop to TextField component.
diff --git a/.changeset/tired-bats-attend.md b/.changeset/tired-bats-attend.md
new file mode 100644
index 0000000000..cfe01f14fe
--- /dev/null
+++ b/.changeset/tired-bats-attend.md
@@ -0,0 +1,5 @@
+---
+'@backstage/integration-react': patch
+---
+
+Separated gitlab `write_repository` and `api` scope to pass checks in `RefreshingAuthSessionManager`
diff --git a/canon-docs/public/styles.css b/canon-docs/public/styles.css
new file mode 100644
index 0000000000..c4c9ca5566
--- /dev/null
+++ b/canon-docs/public/styles.css
@@ -0,0 +1,2 @@
+/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
+@layer base{*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;tab-size:4;font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;line-height:1.15}body{margin:0}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{border-color:currentColor}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}}.cu-p{padding:var(--p)}.cu-p-0\.5{padding:var(--canon-space-0_5)}.cu-p-1{padding:var(--canon-space-1)}.cu-p-1\.5{padding:var(--canon-space-1_5)}.cu-p-2{padding:var(--canon-space-2)}.cu-p-3{padding:var(--canon-space-3)}.cu-p-4{padding:var(--canon-space-4)}.cu-p-5{padding:var(--canon-space-5)}.cu-p-6{padding:var(--canon-space-6)}.cu-p-7{padding:var(--canon-space-7)}.cu-p-8{padding:var(--canon-space-8)}.cu-p-9{padding:var(--canon-space-9)}.cu-p-10{padding:var(--canon-space-10)}.cu-p-11{padding:var(--canon-space-11)}.cu-p-12{padding:var(--canon-space-12)}.cu-p-13{padding:var(--canon-space-13)}.cu-p-14{padding:var(--canon-space-14)}@media (width>=640px){.xs\:cu-p{padding:var(--p-xs)}.xs\:cu-p-0\.5{padding:var(--canon-space-0_5)}.xs\:cu-p-1{padding:var(--canon-space-1)}.xs\:cu-p-1\.5{padding:var(--canon-space-1_5)}.xs\:cu-p-2{padding:var(--canon-space-2)}.xs\:cu-p-3{padding:var(--canon-space-3)}.xs\:cu-p-4{padding:var(--canon-space-4)}.xs\:cu-p-5{padding:var(--canon-space-5)}.xs\:cu-p-6{padding:var(--canon-space-6)}.xs\:cu-p-7{padding:var(--canon-space-7)}.xs\:cu-p-8{padding:var(--canon-space-8)}.xs\:cu-p-9{padding:var(--canon-space-9)}.xs\:cu-p-10{padding:var(--canon-space-10)}.xs\:cu-p-11{padding:var(--canon-space-11)}.xs\:cu-p-12{padding:var(--canon-space-12)}.xs\:cu-p-13{padding:var(--canon-space-13)}.xs\:cu-p-14{padding:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-p{padding:var(--p-sm)}.sm\:cu-p-0\.5{padding:var(--canon-space-0_5)}.sm\:cu-p-1{padding:var(--canon-space-1)}.sm\:cu-p-1\.5{padding:var(--canon-space-1_5)}.sm\:cu-p-2{padding:var(--canon-space-2)}.sm\:cu-p-3{padding:var(--canon-space-3)}.sm\:cu-p-4{padding:var(--canon-space-4)}.sm\:cu-p-5{padding:var(--canon-space-5)}.sm\:cu-p-6{padding:var(--canon-space-6)}.sm\:cu-p-7{padding:var(--canon-space-7)}.sm\:cu-p-8{padding:var(--canon-space-8)}.sm\:cu-p-9{padding:var(--canon-space-9)}.sm\:cu-p-10{padding:var(--canon-space-10)}.sm\:cu-p-11{padding:var(--canon-space-11)}.sm\:cu-p-12{padding:var(--canon-space-12)}.sm\:cu-p-13{padding:var(--canon-space-13)}.sm\:cu-p-14{padding:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-p{padding:var(--p-md)}.md\:cu-p-0\.5{padding:var(--canon-space-0_5)}.md\:cu-p-1{padding:var(--canon-space-1)}.md\:cu-p-1\.5{padding:var(--canon-space-1_5)}.md\:cu-p-2{padding:var(--canon-space-2)}.md\:cu-p-3{padding:var(--canon-space-3)}.md\:cu-p-4{padding:var(--canon-space-4)}.md\:cu-p-5{padding:var(--canon-space-5)}.md\:cu-p-6{padding:var(--canon-space-6)}.md\:cu-p-7{padding:var(--canon-space-7)}.md\:cu-p-8{padding:var(--canon-space-8)}.md\:cu-p-9{padding:var(--canon-space-9)}.md\:cu-p-10{padding:var(--canon-space-10)}.md\:cu-p-11{padding:var(--canon-space-11)}.md\:cu-p-12{padding:var(--canon-space-12)}.md\:cu-p-13{padding:var(--canon-space-13)}.md\:cu-p-14{padding:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-p{padding:var(--p-lg)}.lg\:cu-p-0\.5{padding:var(--canon-space-0_5)}.lg\:cu-p-1{padding:var(--canon-space-1)}.lg\:cu-p-1\.5{padding:var(--canon-space-1_5)}.lg\:cu-p-2{padding:var(--canon-space-2)}.lg\:cu-p-3{padding:var(--canon-space-3)}.lg\:cu-p-4{padding:var(--canon-space-4)}.lg\:cu-p-5{padding:var(--canon-space-5)}.lg\:cu-p-6{padding:var(--canon-space-6)}.lg\:cu-p-7{padding:var(--canon-space-7)}.lg\:cu-p-8{padding:var(--canon-space-8)}.lg\:cu-p-9{padding:var(--canon-space-9)}.lg\:cu-p-10{padding:var(--canon-space-10)}.lg\:cu-p-11{padding:var(--canon-space-11)}.lg\:cu-p-12{padding:var(--canon-space-12)}.lg\:cu-p-13{padding:var(--canon-space-13)}.lg\:cu-p-14{padding:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-p{padding:var(--p-xl)}.xl\:cu-p-0\.5{padding:var(--canon-space-0_5)}.xl\:cu-p-1{padding:var(--canon-space-1)}.xl\:cu-p-1\.5{padding:var(--canon-space-1_5)}.xl\:cu-p-2{padding:var(--canon-space-2)}.xl\:cu-p-3{padding:var(--canon-space-3)}.xl\:cu-p-4{padding:var(--canon-space-4)}.xl\:cu-p-5{padding:var(--canon-space-5)}.xl\:cu-p-6{padding:var(--canon-space-6)}.xl\:cu-p-7{padding:var(--canon-space-7)}.xl\:cu-p-8{padding:var(--canon-space-8)}.xl\:cu-p-9{padding:var(--canon-space-9)}.xl\:cu-p-10{padding:var(--canon-space-10)}.xl\:cu-p-11{padding:var(--canon-space-11)}.xl\:cu-p-12{padding:var(--canon-space-12)}.xl\:cu-p-13{padding:var(--canon-space-13)}.xl\:cu-p-14{padding:var(--canon-space-14)}}.cu-pl{padding-left:var(--pl)}.cu-pl-0\.5{padding-left:var(--canon-space-0_5)}.cu-pl-1{padding-left:var(--canon-space-1)}.cu-pl-1\.5{padding-left:var(--canon-space-1_5)}.cu-pl-2{padding-left:var(--canon-space-2)}.cu-pl-3{padding-left:var(--canon-space-3)}.cu-pl-4{padding-left:var(--canon-space-4)}.cu-pl-5{padding-left:var(--canon-space-5)}.cu-pl-6{padding-left:var(--canon-space-6)}.cu-pl-7{padding-left:var(--canon-space-7)}.cu-pl-8{padding-left:var(--canon-space-8)}.cu-pl-9{padding-left:var(--canon-space-9)}.cu-pl-10{padding-left:var(--canon-space-10)}.cu-pl-11{padding-left:var(--canon-space-11)}.cu-pl-12{padding-left:var(--canon-space-12)}.cu-pl-13{padding-left:var(--canon-space-13)}.cu-pl-14{padding-left:var(--canon-space-14)}@media (width>=640px){.xs\:cu-pl{padding-left:var(--pl-xs)}.xs\:cu-pl-0\.5{padding-left:var(--canon-space-0_5)}.xs\:cu-pl-1{padding-left:var(--canon-space-1)}.xs\:cu-pl-1\.5{padding-left:var(--canon-space-1_5)}.xs\:cu-pl-2{padding-left:var(--canon-space-2)}.xs\:cu-pl-3{padding-left:var(--canon-space-3)}.xs\:cu-pl-4{padding-left:var(--canon-space-4)}.xs\:cu-pl-5{padding-left:var(--canon-space-5)}.xs\:cu-pl-6{padding-left:var(--canon-space-6)}.xs\:cu-pl-7{padding-left:var(--canon-space-7)}.xs\:cu-pl-8{padding-left:var(--canon-space-8)}.xs\:cu-pl-9{padding-left:var(--canon-space-9)}.xs\:cu-pl-10{padding-left:var(--canon-space-10)}.xs\:cu-pl-11{padding-left:var(--canon-space-11)}.xs\:cu-pl-12{padding-left:var(--canon-space-12)}.xs\:cu-pl-13{padding-left:var(--canon-space-13)}.xs\:cu-pl-14{padding-left:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-pl{padding-left:var(--pl-sm)}.sm\:cu-pl-0\.5{padding-left:var(--canon-space-0_5)}.sm\:cu-pl-1{padding-left:var(--canon-space-1)}.sm\:cu-pl-1\.5{padding-left:var(--canon-space-1_5)}.sm\:cu-pl-2{padding-left:var(--canon-space-2)}.sm\:cu-pl-3{padding-left:var(--canon-space-3)}.sm\:cu-pl-4{padding-left:var(--canon-space-4)}.sm\:cu-pl-5{padding-left:var(--canon-space-5)}.sm\:cu-pl-6{padding-left:var(--canon-space-6)}.sm\:cu-pl-7{padding-left:var(--canon-space-7)}.sm\:cu-pl-8{padding-left:var(--canon-space-8)}.sm\:cu-pl-9{padding-left:var(--canon-space-9)}.sm\:cu-pl-10{padding-left:var(--canon-space-10)}.sm\:cu-pl-11{padding-left:var(--canon-space-11)}.sm\:cu-pl-12{padding-left:var(--canon-space-12)}.sm\:cu-pl-13{padding-left:var(--canon-space-13)}.sm\:cu-pl-14{padding-left:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-pl{padding-left:var(--pl-md)}.md\:cu-pl-0\.5{padding-left:var(--canon-space-0_5)}.md\:cu-pl-1{padding-left:var(--canon-space-1)}.md\:cu-pl-1\.5{padding-left:var(--canon-space-1_5)}.md\:cu-pl-2{padding-left:var(--canon-space-2)}.md\:cu-pl-3{padding-left:var(--canon-space-3)}.md\:cu-pl-4{padding-left:var(--canon-space-4)}.md\:cu-pl-5{padding-left:var(--canon-space-5)}.md\:cu-pl-6{padding-left:var(--canon-space-6)}.md\:cu-pl-7{padding-left:var(--canon-space-7)}.md\:cu-pl-8{padding-left:var(--canon-space-8)}.md\:cu-pl-9{padding-left:var(--canon-space-9)}.md\:cu-pl-10{padding-left:var(--canon-space-10)}.md\:cu-pl-11{padding-left:var(--canon-space-11)}.md\:cu-pl-12{padding-left:var(--canon-space-12)}.md\:cu-pl-13{padding-left:var(--canon-space-13)}.md\:cu-pl-14{padding-left:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-pl{padding-left:var(--pl-lg)}.lg\:cu-pl-0\.5{padding-left:var(--canon-space-0_5)}.lg\:cu-pl-1{padding-left:var(--canon-space-1)}.lg\:cu-pl-1\.5{padding-left:var(--canon-space-1_5)}.lg\:cu-pl-2{padding-left:var(--canon-space-2)}.lg\:cu-pl-3{padding-left:var(--canon-space-3)}.lg\:cu-pl-4{padding-left:var(--canon-space-4)}.lg\:cu-pl-5{padding-left:var(--canon-space-5)}.lg\:cu-pl-6{padding-left:var(--canon-space-6)}.lg\:cu-pl-7{padding-left:var(--canon-space-7)}.lg\:cu-pl-8{padding-left:var(--canon-space-8)}.lg\:cu-pl-9{padding-left:var(--canon-space-9)}.lg\:cu-pl-10{padding-left:var(--canon-space-10)}.lg\:cu-pl-11{padding-left:var(--canon-space-11)}.lg\:cu-pl-12{padding-left:var(--canon-space-12)}.lg\:cu-pl-13{padding-left:var(--canon-space-13)}.lg\:cu-pl-14{padding-left:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-pl{padding-left:var(--pl-xl)}.xl\:cu-pl-0\.5{padding-left:var(--canon-space-0_5)}.xl\:cu-pl-1{padding-left:var(--canon-space-1)}.xl\:cu-pl-1\.5{padding-left:var(--canon-space-1_5)}.xl\:cu-pl-2{padding-left:var(--canon-space-2)}.xl\:cu-pl-3{padding-left:var(--canon-space-3)}.xl\:cu-pl-4{padding-left:var(--canon-space-4)}.xl\:cu-pl-5{padding-left:var(--canon-space-5)}.xl\:cu-pl-6{padding-left:var(--canon-space-6)}.xl\:cu-pl-7{padding-left:var(--canon-space-7)}.xl\:cu-pl-8{padding-left:var(--canon-space-8)}.xl\:cu-pl-9{padding-left:var(--canon-space-9)}.xl\:cu-pl-10{padding-left:var(--canon-space-10)}.xl\:cu-pl-11{padding-left:var(--canon-space-11)}.xl\:cu-pl-12{padding-left:var(--canon-space-12)}.xl\:cu-pl-13{padding-left:var(--canon-space-13)}.xl\:cu-pl-14{padding-left:var(--canon-space-14)}}.cu-pr{padding-right:var(--pr)}.cu-pr-0\.5{padding-right:var(--canon-space-0_5)}.cu-pr-1{padding-right:var(--canon-space-1)}.cu-pr-1\.5{padding-right:var(--canon-space-1_5)}.cu-pr-2{padding-right:var(--canon-space-2)}.cu-pr-3{padding-right:var(--canon-space-3)}.cu-pr-4{padding-right:var(--canon-space-4)}.cu-pr-5{padding-right:var(--canon-space-5)}.cu-pr-6{padding-right:var(--canon-space-6)}.cu-pr-7{padding-right:var(--canon-space-7)}.cu-pr-8{padding-right:var(--canon-space-8)}.cu-pr-9{padding-right:var(--canon-space-9)}.cu-pr-10{padding-right:var(--canon-space-10)}.cu-pr-11{padding-right:var(--canon-space-11)}.cu-pr-12{padding-right:var(--canon-space-12)}.cu-pr-13{padding-right:var(--canon-space-13)}.cu-pr-14{padding-right:var(--canon-space-14)}@media (width>=640px){.xs\:cu-pr{padding-right:var(--pr-xs)}.xs\:cu-pr-0\.5{padding-right:var(--canon-space-0_5)}.xs\:cu-pr-1{padding-right:var(--canon-space-1)}.xs\:cu-pr-1\.5{padding-right:var(--canon-space-1_5)}.xs\:cu-pr-2{padding-right:var(--canon-space-2)}.xs\:cu-pr-3{padding-right:var(--canon-space-3)}.xs\:cu-pr-4{padding-right:var(--canon-space-4)}.xs\:cu-pr-5{padding-right:var(--canon-space-5)}.xs\:cu-pr-6{padding-right:var(--canon-space-6)}.xs\:cu-pr-7{padding-right:var(--canon-space-7)}.xs\:cu-pr-8{padding-right:var(--canon-space-8)}.xs\:cu-pr-9{padding-right:var(--canon-space-9)}.xs\:cu-pr-10{padding-right:var(--canon-space-10)}.xs\:cu-pr-11{padding-right:var(--canon-space-11)}.xs\:cu-pr-12{padding-right:var(--canon-space-12)}.xs\:cu-pr-13{padding-right:var(--canon-space-13)}.xs\:cu-pr-14{padding-right:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-pr{padding-right:var(--pr-sm)}.sm\:cu-pr-0\.5{padding-right:var(--canon-space-0_5)}.sm\:cu-pr-1{padding-right:var(--canon-space-1)}.sm\:cu-pr-1\.5{padding-right:var(--canon-space-1_5)}.sm\:cu-pr-2{padding-right:var(--canon-space-2)}.sm\:cu-pr-3{padding-right:var(--canon-space-3)}.sm\:cu-pr-4{padding-right:var(--canon-space-4)}.sm\:cu-pr-5{padding-right:var(--canon-space-5)}.sm\:cu-pr-6{padding-right:var(--canon-space-6)}.sm\:cu-pr-7{padding-right:var(--canon-space-7)}.sm\:cu-pr-8{padding-right:var(--canon-space-8)}.sm\:cu-pr-9{padding-right:var(--canon-space-9)}.sm\:cu-pr-10{padding-right:var(--canon-space-10)}.sm\:cu-pr-11{padding-right:var(--canon-space-11)}.sm\:cu-pr-12{padding-right:var(--canon-space-12)}.sm\:cu-pr-13{padding-right:var(--canon-space-13)}.sm\:cu-pr-14{padding-right:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-pr{padding-right:var(--pr-md)}.md\:cu-pr-0\.5{padding-right:var(--canon-space-0_5)}.md\:cu-pr-1{padding-right:var(--canon-space-1)}.md\:cu-pr-1\.5{padding-right:var(--canon-space-1_5)}.md\:cu-pr-2{padding-right:var(--canon-space-2)}.md\:cu-pr-3{padding-right:var(--canon-space-3)}.md\:cu-pr-4{padding-right:var(--canon-space-4)}.md\:cu-pr-5{padding-right:var(--canon-space-5)}.md\:cu-pr-6{padding-right:var(--canon-space-6)}.md\:cu-pr-7{padding-right:var(--canon-space-7)}.md\:cu-pr-8{padding-right:var(--canon-space-8)}.md\:cu-pr-9{padding-right:var(--canon-space-9)}.md\:cu-pr-10{padding-right:var(--canon-space-10)}.md\:cu-pr-11{padding-right:var(--canon-space-11)}.md\:cu-pr-12{padding-right:var(--canon-space-12)}.md\:cu-pr-13{padding-right:var(--canon-space-13)}.md\:cu-pr-14{padding-right:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-pr{padding-right:var(--pr-lg)}.lg\:cu-pr-0\.5{padding-right:var(--canon-space-0_5)}.lg\:cu-pr-1{padding-right:var(--canon-space-1)}.lg\:cu-pr-1\.5{padding-right:var(--canon-space-1_5)}.lg\:cu-pr-2{padding-right:var(--canon-space-2)}.lg\:cu-pr-3{padding-right:var(--canon-space-3)}.lg\:cu-pr-4{padding-right:var(--canon-space-4)}.lg\:cu-pr-5{padding-right:var(--canon-space-5)}.lg\:cu-pr-6{padding-right:var(--canon-space-6)}.lg\:cu-pr-7{padding-right:var(--canon-space-7)}.lg\:cu-pr-8{padding-right:var(--canon-space-8)}.lg\:cu-pr-9{padding-right:var(--canon-space-9)}.lg\:cu-pr-10{padding-right:var(--canon-space-10)}.lg\:cu-pr-11{padding-right:var(--canon-space-11)}.lg\:cu-pr-12{padding-right:var(--canon-space-12)}.lg\:cu-pr-13{padding-right:var(--canon-space-13)}.lg\:cu-pr-14{padding-right:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-pr{padding-right:var(--pr-xl)}.xl\:cu-pr-0\.5{padding-right:var(--canon-space-0_5)}.xl\:cu-pr-1{padding-right:var(--canon-space-1)}.xl\:cu-pr-1\.5{padding-right:var(--canon-space-1_5)}.xl\:cu-pr-2{padding-right:var(--canon-space-2)}.xl\:cu-pr-3{padding-right:var(--canon-space-3)}.xl\:cu-pr-4{padding-right:var(--canon-space-4)}.xl\:cu-pr-5{padding-right:var(--canon-space-5)}.xl\:cu-pr-6{padding-right:var(--canon-space-6)}.xl\:cu-pr-7{padding-right:var(--canon-space-7)}.xl\:cu-pr-8{padding-right:var(--canon-space-8)}.xl\:cu-pr-9{padding-right:var(--canon-space-9)}.xl\:cu-pr-10{padding-right:var(--canon-space-10)}.xl\:cu-pr-11{padding-right:var(--canon-space-11)}.xl\:cu-pr-12{padding-right:var(--canon-space-12)}.xl\:cu-pr-13{padding-right:var(--canon-space-13)}.xl\:cu-pr-14{padding-right:var(--canon-space-14)}}.cu-pt{padding-top:var(--pt)}.cu-pt-0\.5{padding-top:var(--canon-space-0_5)}.cu-pt-1{padding-top:var(--canon-space-1)}.cu-pt-1\.5{padding-top:var(--canon-space-1_5)}.cu-pt-2{padding-top:var(--canon-space-2)}.cu-pt-3{padding-top:var(--canon-space-3)}.cu-pt-4{padding-top:var(--canon-space-4)}.cu-pt-5{padding-top:var(--canon-space-5)}.cu-pt-6{padding-top:var(--canon-space-6)}.cu-pt-7{padding-top:var(--canon-space-7)}.cu-pt-8{padding-top:var(--canon-space-8)}.cu-pt-9{padding-top:var(--canon-space-9)}.cu-pt-10{padding-top:var(--canon-space-10)}.cu-pt-11{padding-top:var(--canon-space-11)}.cu-pt-12{padding-top:var(--canon-space-12)}.cu-pt-13{padding-top:var(--canon-space-13)}.cu-pt-14{padding-top:var(--canon-space-14)}@media (width>=640px){.xs\:cu-pt{padding-top:var(--pt-xs)}.xs\:cu-pt-0\.5{padding-top:var(--canon-space-0_5)}.xs\:cu-pt-1{padding-top:var(--canon-space-1)}.xs\:cu-pt-1\.5{padding-top:var(--canon-space-1_5)}.xs\:cu-pt-2{padding-top:var(--canon-space-2)}.xs\:cu-pt-3{padding-top:var(--canon-space-3)}.xs\:cu-pt-4{padding-top:var(--canon-space-4)}.xs\:cu-pt-5{padding-top:var(--canon-space-5)}.xs\:cu-pt-6{padding-top:var(--canon-space-6)}.xs\:cu-pt-7{padding-top:var(--canon-space-7)}.xs\:cu-pt-8{padding-top:var(--canon-space-8)}.xs\:cu-pt-9{padding-top:var(--canon-space-9)}.xs\:cu-pt-10{padding-top:var(--canon-space-10)}.xs\:cu-pt-11{padding-top:var(--canon-space-11)}.xs\:cu-pt-12{padding-top:var(--canon-space-12)}.xs\:cu-pt-13{padding-top:var(--canon-space-13)}.xs\:cu-pt-14{padding-top:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-pt{padding-top:var(--pt-sm)}.sm\:cu-pt-0\.5{padding-top:var(--canon-space-0_5)}.sm\:cu-pt-1{padding-top:var(--canon-space-1)}.sm\:cu-pt-1\.5{padding-top:var(--canon-space-1_5)}.sm\:cu-pt-2{padding-top:var(--canon-space-2)}.sm\:cu-pt-3{padding-top:var(--canon-space-3)}.sm\:cu-pt-4{padding-top:var(--canon-space-4)}.sm\:cu-pt-5{padding-top:var(--canon-space-5)}.sm\:cu-pt-6{padding-top:var(--canon-space-6)}.sm\:cu-pt-7{padding-top:var(--canon-space-7)}.sm\:cu-pt-8{padding-top:var(--canon-space-8)}.sm\:cu-pt-9{padding-top:var(--canon-space-9)}.sm\:cu-pt-10{padding-top:var(--canon-space-10)}.sm\:cu-pt-11{padding-top:var(--canon-space-11)}.sm\:cu-pt-12{padding-top:var(--canon-space-12)}.sm\:cu-pt-13{padding-top:var(--canon-space-13)}.sm\:cu-pt-14{padding-top:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-pt{padding-top:var(--pt-md)}.md\:cu-pt-0\.5{padding-top:var(--canon-space-0_5)}.md\:cu-pt-1{padding-top:var(--canon-space-1)}.md\:cu-pt-1\.5{padding-top:var(--canon-space-1_5)}.md\:cu-pt-2{padding-top:var(--canon-space-2)}.md\:cu-pt-3{padding-top:var(--canon-space-3)}.md\:cu-pt-4{padding-top:var(--canon-space-4)}.md\:cu-pt-5{padding-top:var(--canon-space-5)}.md\:cu-pt-6{padding-top:var(--canon-space-6)}.md\:cu-pt-7{padding-top:var(--canon-space-7)}.md\:cu-pt-8{padding-top:var(--canon-space-8)}.md\:cu-pt-9{padding-top:var(--canon-space-9)}.md\:cu-pt-10{padding-top:var(--canon-space-10)}.md\:cu-pt-11{padding-top:var(--canon-space-11)}.md\:cu-pt-12{padding-top:var(--canon-space-12)}.md\:cu-pt-13{padding-top:var(--canon-space-13)}.md\:cu-pt-14{padding-top:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-pt{padding-top:var(--pt-lg)}.lg\:cu-pt-0\.5{padding-top:var(--canon-space-0_5)}.lg\:cu-pt-1{padding-top:var(--canon-space-1)}.lg\:cu-pt-1\.5{padding-top:var(--canon-space-1_5)}.lg\:cu-pt-2{padding-top:var(--canon-space-2)}.lg\:cu-pt-3{padding-top:var(--canon-space-3)}.lg\:cu-pt-4{padding-top:var(--canon-space-4)}.lg\:cu-pt-5{padding-top:var(--canon-space-5)}.lg\:cu-pt-6{padding-top:var(--canon-space-6)}.lg\:cu-pt-7{padding-top:var(--canon-space-7)}.lg\:cu-pt-8{padding-top:var(--canon-space-8)}.lg\:cu-pt-9{padding-top:var(--canon-space-9)}.lg\:cu-pt-10{padding-top:var(--canon-space-10)}.lg\:cu-pt-11{padding-top:var(--canon-space-11)}.lg\:cu-pt-12{padding-top:var(--canon-space-12)}.lg\:cu-pt-13{padding-top:var(--canon-space-13)}.lg\:cu-pt-14{padding-top:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-pt{padding-top:var(--pt-xl)}.xl\:cu-pt-0\.5{padding-top:var(--canon-space-0_5)}.xl\:cu-pt-1{padding-top:var(--canon-space-1)}.xl\:cu-pt-1\.5{padding-top:var(--canon-space-1_5)}.xl\:cu-pt-2{padding-top:var(--canon-space-2)}.xl\:cu-pt-3{padding-top:var(--canon-space-3)}.xl\:cu-pt-4{padding-top:var(--canon-space-4)}.xl\:cu-pt-5{padding-top:var(--canon-space-5)}.xl\:cu-pt-6{padding-top:var(--canon-space-6)}.xl\:cu-pt-7{padding-top:var(--canon-space-7)}.xl\:cu-pt-8{padding-top:var(--canon-space-8)}.xl\:cu-pt-9{padding-top:var(--canon-space-9)}.xl\:cu-pt-10{padding-top:var(--canon-space-10)}.xl\:cu-pt-11{padding-top:var(--canon-space-11)}.xl\:cu-pt-12{padding-top:var(--canon-space-12)}.xl\:cu-pt-13{padding-top:var(--canon-space-13)}.xl\:cu-pt-14{padding-top:var(--canon-space-14)}}.cu-pb{padding-bottom:var(--pb)}.cu-pb-0\.5{padding-bottom:var(--canon-space-0_5)}.cu-pb-1{padding-bottom:var(--canon-space-1)}.cu-pb-1\.5{padding-bottom:var(--canon-space-1_5)}.cu-pb-2{padding-bottom:var(--canon-space-2)}.cu-pb-3{padding-bottom:var(--canon-space-3)}.cu-pb-4{padding-bottom:var(--canon-space-4)}.cu-pb-5{padding-bottom:var(--canon-space-5)}.cu-pb-6{padding-bottom:var(--canon-space-6)}.cu-pb-7{padding-bottom:var(--canon-space-7)}.cu-pb-8{padding-bottom:var(--canon-space-8)}.cu-pb-9{padding-bottom:var(--canon-space-9)}.cu-pb-10{padding-bottom:var(--canon-space-10)}.cu-pb-11{padding-bottom:var(--canon-space-11)}.cu-pb-12{padding-bottom:var(--canon-space-12)}.cu-pb-13{padding-bottom:var(--canon-space-13)}.cu-pb-14{padding-bottom:var(--canon-space-14)}@media (width>=640px){.xs\:cu-pb{padding-bottom:var(--pb-xs)}.xs\:cu-pb-0\.5{padding-bottom:var(--canon-space-0_5)}.xs\:cu-pb-1{padding-bottom:var(--canon-space-1)}.xs\:cu-pb-1\.5{padding-bottom:var(--canon-space-1_5)}.xs\:cu-pb-2{padding-bottom:var(--canon-space-2)}.xs\:cu-pb-3{padding-bottom:var(--canon-space-3)}.xs\:cu-pb-4{padding-bottom:var(--canon-space-4)}.xs\:cu-pb-5{padding-bottom:var(--canon-space-5)}.xs\:cu-pb-6{padding-bottom:var(--canon-space-6)}.xs\:cu-pb-7{padding-bottom:var(--canon-space-7)}.xs\:cu-pb-8{padding-bottom:var(--canon-space-8)}.xs\:cu-pb-9{padding-bottom:var(--canon-space-9)}.xs\:cu-pb-10{padding-bottom:var(--canon-space-10)}.xs\:cu-pb-11{padding-bottom:var(--canon-space-11)}.xs\:cu-pb-12{padding-bottom:var(--canon-space-12)}.xs\:cu-pb-13{padding-bottom:var(--canon-space-13)}.xs\:cu-pb-14{padding-bottom:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-pb{padding-bottom:var(--pb-sm)}.sm\:cu-pb-0\.5{padding-bottom:var(--canon-space-0_5)}.sm\:cu-pb-1{padding-bottom:var(--canon-space-1)}.sm\:cu-pb-1\.5{padding-bottom:var(--canon-space-1_5)}.sm\:cu-pb-2{padding-bottom:var(--canon-space-2)}.sm\:cu-pb-3{padding-bottom:var(--canon-space-3)}.sm\:cu-pb-4{padding-bottom:var(--canon-space-4)}.sm\:cu-pb-5{padding-bottom:var(--canon-space-5)}.sm\:cu-pb-6{padding-bottom:var(--canon-space-6)}.sm\:cu-pb-7{padding-bottom:var(--canon-space-7)}.sm\:cu-pb-8{padding-bottom:var(--canon-space-8)}.sm\:cu-pb-9{padding-bottom:var(--canon-space-9)}.sm\:cu-pb-10{padding-bottom:var(--canon-space-10)}.sm\:cu-pb-11{padding-bottom:var(--canon-space-11)}.sm\:cu-pb-12{padding-bottom:var(--canon-space-12)}.sm\:cu-pb-13{padding-bottom:var(--canon-space-13)}.sm\:cu-pb-14{padding-bottom:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-pb{padding-bottom:var(--pb-md)}.md\:cu-pb-0\.5{padding-bottom:var(--canon-space-0_5)}.md\:cu-pb-1{padding-bottom:var(--canon-space-1)}.md\:cu-pb-1\.5{padding-bottom:var(--canon-space-1_5)}.md\:cu-pb-2{padding-bottom:var(--canon-space-2)}.md\:cu-pb-3{padding-bottom:var(--canon-space-3)}.md\:cu-pb-4{padding-bottom:var(--canon-space-4)}.md\:cu-pb-5{padding-bottom:var(--canon-space-5)}.md\:cu-pb-6{padding-bottom:var(--canon-space-6)}.md\:cu-pb-7{padding-bottom:var(--canon-space-7)}.md\:cu-pb-8{padding-bottom:var(--canon-space-8)}.md\:cu-pb-9{padding-bottom:var(--canon-space-9)}.md\:cu-pb-10{padding-bottom:var(--canon-space-10)}.md\:cu-pb-11{padding-bottom:var(--canon-space-11)}.md\:cu-pb-12{padding-bottom:var(--canon-space-12)}.md\:cu-pb-13{padding-bottom:var(--canon-space-13)}.md\:cu-pb-14{padding-bottom:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-pb{padding-bottom:var(--pb-lg)}.lg\:cu-pb-0\.5{padding-bottom:var(--canon-space-0_5)}.lg\:cu-pb-1{padding-bottom:var(--canon-space-1)}.lg\:cu-pb-1\.5{padding-bottom:var(--canon-space-1_5)}.lg\:cu-pb-2{padding-bottom:var(--canon-space-2)}.lg\:cu-pb-3{padding-bottom:var(--canon-space-3)}.lg\:cu-pb-4{padding-bottom:var(--canon-space-4)}.lg\:cu-pb-5{padding-bottom:var(--canon-space-5)}.lg\:cu-pb-6{padding-bottom:var(--canon-space-6)}.lg\:cu-pb-7{padding-bottom:var(--canon-space-7)}.lg\:cu-pb-8{padding-bottom:var(--canon-space-8)}.lg\:cu-pb-9{padding-bottom:var(--canon-space-9)}.lg\:cu-pb-10{padding-bottom:var(--canon-space-10)}.lg\:cu-pb-11{padding-bottom:var(--canon-space-11)}.lg\:cu-pb-12{padding-bottom:var(--canon-space-12)}.lg\:cu-pb-13{padding-bottom:var(--canon-space-13)}.lg\:cu-pb-14{padding-bottom:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-pb{padding-bottom:var(--pb-xl)}.xl\:cu-pb-0\.5{padding-bottom:var(--canon-space-0_5)}.xl\:cu-pb-1{padding-bottom:var(--canon-space-1)}.xl\:cu-pb-1\.5{padding-bottom:var(--canon-space-1_5)}.xl\:cu-pb-2{padding-bottom:var(--canon-space-2)}.xl\:cu-pb-3{padding-bottom:var(--canon-space-3)}.xl\:cu-pb-4{padding-bottom:var(--canon-space-4)}.xl\:cu-pb-5{padding-bottom:var(--canon-space-5)}.xl\:cu-pb-6{padding-bottom:var(--canon-space-6)}.xl\:cu-pb-7{padding-bottom:var(--canon-space-7)}.xl\:cu-pb-8{padding-bottom:var(--canon-space-8)}.xl\:cu-pb-9{padding-bottom:var(--canon-space-9)}.xl\:cu-pb-10{padding-bottom:var(--canon-space-10)}.xl\:cu-pb-11{padding-bottom:var(--canon-space-11)}.xl\:cu-pb-12{padding-bottom:var(--canon-space-12)}.xl\:cu-pb-13{padding-bottom:var(--canon-space-13)}.xl\:cu-pb-14{padding-bottom:var(--canon-space-14)}}.cu-py{padding-top:var(--py);padding-bottom:var(--py)}.cu-py-0\.5{padding-top:var(--canon-space-0_5);padding-bottom:var(--canon-space-0_5)}.cu-py-1{padding-top:var(--canon-space-1);padding-bottom:var(--canon-space-1)}.cu-py-1\.5{padding-top:var(--canon-space-1_5);padding-bottom:var(--canon-space-1_5)}.cu-py-2{padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-2)}.cu-py-3{padding-top:var(--canon-space-3);padding-bottom:var(--canon-space-3)}.cu-py-4{padding-top:var(--canon-space-4);padding-bottom:var(--canon-space-4)}.cu-py-5{padding-top:var(--canon-space-5);padding-bottom:var(--canon-space-5)}.cu-py-6{padding-top:var(--canon-space-6);padding-bottom:var(--canon-space-6)}.cu-py-7{padding-top:var(--canon-space-7);padding-bottom:var(--canon-space-7)}.cu-py-8{padding-top:var(--canon-space-8);padding-bottom:var(--canon-space-8)}.cu-py-9{padding-top:var(--canon-space-9);padding-bottom:var(--canon-space-9)}.cu-py-10{padding-top:var(--canon-space-10);padding-bottom:var(--canon-space-10)}.cu-py-11{padding-top:var(--canon-space-11);padding-bottom:var(--canon-space-11)}.cu-py-12{padding-top:var(--canon-space-12);padding-bottom:var(--canon-space-12)}.cu-py-13{padding-top:var(--canon-space-13);padding-bottom:var(--canon-space-13)}.cu-py-14{padding-top:var(--canon-space-14);padding-bottom:var(--canon-space-14)}@media (width>=640px){.xs\:cu-py{padding-top:var(--py-xs);padding-bottom:var(--py-xs)}.xs\:cu-py-0\.5{padding-top:var(--canon-space-0_5);padding-bottom:var(--canon-space-0_5)}.xs\:cu-py-1{padding-top:var(--canon-space-1);padding-bottom:var(--canon-space-1)}.xs\:cu-py-1\.5{padding-top:var(--canon-space-1_5);padding-bottom:var(--canon-space-1_5)}.xs\:cu-py-2{padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-2)}.xs\:cu-py-3{padding-top:var(--canon-space-3);padding-bottom:var(--canon-space-3)}.xs\:cu-py-4{padding-top:var(--canon-space-4);padding-bottom:var(--canon-space-4)}.xs\:cu-py-5{padding-top:var(--canon-space-5);padding-bottom:var(--canon-space-5)}.xs\:cu-py-6{padding-top:var(--canon-space-6);padding-bottom:var(--canon-space-6)}.xs\:cu-py-7{padding-top:var(--canon-space-7);padding-bottom:var(--canon-space-7)}.xs\:cu-py-8{padding-top:var(--canon-space-8);padding-bottom:var(--canon-space-8)}.xs\:cu-py-9{padding-top:var(--canon-space-9);padding-bottom:var(--canon-space-9)}.xs\:cu-py-10{padding-top:var(--canon-space-10);padding-bottom:var(--canon-space-10)}.xs\:cu-py-11{padding-top:var(--canon-space-11);padding-bottom:var(--canon-space-11)}.xs\:cu-py-12{padding-top:var(--canon-space-12);padding-bottom:var(--canon-space-12)}.xs\:cu-py-13{padding-top:var(--canon-space-13);padding-bottom:var(--canon-space-13)}.xs\:cu-py-14{padding-top:var(--canon-space-14);padding-bottom:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-py{padding-top:var(--py-sm);padding-bottom:var(--py-sm)}.sm\:cu-py-0\.5{padding-top:var(--canon-space-0_5);padding-bottom:var(--canon-space-0_5)}.sm\:cu-py-1{padding-top:var(--canon-space-1);padding-bottom:var(--canon-space-1)}.sm\:cu-py-1\.5{padding-top:var(--canon-space-1_5);padding-bottom:var(--canon-space-1_5)}.sm\:cu-py-2{padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-2)}.sm\:cu-py-3{padding-top:var(--canon-space-3);padding-bottom:var(--canon-space-3)}.sm\:cu-py-4{padding-top:var(--canon-space-4);padding-bottom:var(--canon-space-4)}.sm\:cu-py-5{padding-top:var(--canon-space-5);padding-bottom:var(--canon-space-5)}.sm\:cu-py-6{padding-top:var(--canon-space-6);padding-bottom:var(--canon-space-6)}.sm\:cu-py-7{padding-top:var(--canon-space-7);padding-bottom:var(--canon-space-7)}.sm\:cu-py-8{padding-top:var(--canon-space-8);padding-bottom:var(--canon-space-8)}.sm\:cu-py-9{padding-top:var(--canon-space-9);padding-bottom:var(--canon-space-9)}.sm\:cu-py-10{padding-top:var(--canon-space-10);padding-bottom:var(--canon-space-10)}.sm\:cu-py-11{padding-top:var(--canon-space-11);padding-bottom:var(--canon-space-11)}.sm\:cu-py-12{padding-top:var(--canon-space-12);padding-bottom:var(--canon-space-12)}.sm\:cu-py-13{padding-top:var(--canon-space-13);padding-bottom:var(--canon-space-13)}.sm\:cu-py-14{padding-top:var(--canon-space-14);padding-bottom:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-py{padding-top:var(--py-md);padding-bottom:var(--py-md)}.md\:cu-py-0\.5{padding-top:var(--canon-space-0_5);padding-bottom:var(--canon-space-0_5)}.md\:cu-py-1{padding-top:var(--canon-space-1);padding-bottom:var(--canon-space-1)}.md\:cu-py-1\.5{padding-top:var(--canon-space-1_5);padding-bottom:var(--canon-space-1_5)}.md\:cu-py-2{padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-2)}.md\:cu-py-3{padding-top:var(--canon-space-3);padding-bottom:var(--canon-space-3)}.md\:cu-py-4{padding-top:var(--canon-space-4);padding-bottom:var(--canon-space-4)}.md\:cu-py-5{padding-top:var(--canon-space-5);padding-bottom:var(--canon-space-5)}.md\:cu-py-6{padding-top:var(--canon-space-6);padding-bottom:var(--canon-space-6)}.md\:cu-py-7{padding-top:var(--canon-space-7);padding-bottom:var(--canon-space-7)}.md\:cu-py-8{padding-top:var(--canon-space-8);padding-bottom:var(--canon-space-8)}.md\:cu-py-9{padding-top:var(--canon-space-9);padding-bottom:var(--canon-space-9)}.md\:cu-py-10{padding-top:var(--canon-space-10);padding-bottom:var(--canon-space-10)}.md\:cu-py-11{padding-top:var(--canon-space-11);padding-bottom:var(--canon-space-11)}.md\:cu-py-12{padding-top:var(--canon-space-12);padding-bottom:var(--canon-space-12)}.md\:cu-py-13{padding-top:var(--canon-space-13);padding-bottom:var(--canon-space-13)}.md\:cu-py-14{padding-top:var(--canon-space-14);padding-bottom:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-py{padding-top:var(--py-lg);padding-bottom:var(--py-lg)}.lg\:cu-py-0\.5{padding-top:var(--canon-space-0_5);padding-bottom:var(--canon-space-0_5)}.lg\:cu-py-1{padding-top:var(--canon-space-1);padding-bottom:var(--canon-space-1)}.lg\:cu-py-1\.5{padding-top:var(--canon-space-1_5);padding-bottom:var(--canon-space-1_5)}.lg\:cu-py-2{padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-2)}.lg\:cu-py-3{padding-top:var(--canon-space-3);padding-bottom:var(--canon-space-3)}.lg\:cu-py-4{padding-top:var(--canon-space-4);padding-bottom:var(--canon-space-4)}.lg\:cu-py-5{padding-top:var(--canon-space-5);padding-bottom:var(--canon-space-5)}.lg\:cu-py-6{padding-top:var(--canon-space-6);padding-bottom:var(--canon-space-6)}.lg\:cu-py-7{padding-top:var(--canon-space-7);padding-bottom:var(--canon-space-7)}.lg\:cu-py-8{padding-top:var(--canon-space-8);padding-bottom:var(--canon-space-8)}.lg\:cu-py-9{padding-top:var(--canon-space-9);padding-bottom:var(--canon-space-9)}.lg\:cu-py-10{padding-top:var(--canon-space-10);padding-bottom:var(--canon-space-10)}.lg\:cu-py-11{padding-top:var(--canon-space-11);padding-bottom:var(--canon-space-11)}.lg\:cu-py-12{padding-top:var(--canon-space-12);padding-bottom:var(--canon-space-12)}.lg\:cu-py-13{padding-top:var(--canon-space-13);padding-bottom:var(--canon-space-13)}.lg\:cu-py-14{padding-top:var(--canon-space-14);padding-bottom:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-py{padding-top:var(--py-xl);padding-bottom:var(--py-xl)}.xl\:cu-py-0\.5{padding-top:var(--canon-space-0_5);padding-bottom:var(--canon-space-0_5)}.xl\:cu-py-1{padding-top:var(--canon-space-1);padding-bottom:var(--canon-space-1)}.xl\:cu-py-1\.5{padding-top:var(--canon-space-1_5);padding-bottom:var(--canon-space-1_5)}.xl\:cu-py-2{padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-2)}.xl\:cu-py-3{padding-top:var(--canon-space-3);padding-bottom:var(--canon-space-3)}.xl\:cu-py-4{padding-top:var(--canon-space-4);padding-bottom:var(--canon-space-4)}.xl\:cu-py-5{padding-top:var(--canon-space-5);padding-bottom:var(--canon-space-5)}.xl\:cu-py-6{padding-top:var(--canon-space-6);padding-bottom:var(--canon-space-6)}.xl\:cu-py-7{padding-top:var(--canon-space-7);padding-bottom:var(--canon-space-7)}.xl\:cu-py-8{padding-top:var(--canon-space-8);padding-bottom:var(--canon-space-8)}.xl\:cu-py-9{padding-top:var(--canon-space-9);padding-bottom:var(--canon-space-9)}.xl\:cu-py-10{padding-top:var(--canon-space-10);padding-bottom:var(--canon-space-10)}.xl\:cu-py-11{padding-top:var(--canon-space-11);padding-bottom:var(--canon-space-11)}.xl\:cu-py-12{padding-top:var(--canon-space-12);padding-bottom:var(--canon-space-12)}.xl\:cu-py-13{padding-top:var(--canon-space-13);padding-bottom:var(--canon-space-13)}.xl\:cu-py-14{padding-top:var(--canon-space-14);padding-bottom:var(--canon-space-14)}}.cu-px{padding-left:var(--px);padding-right:var(--px)}.cu-px-0\.5{padding-left:var(--canon-space-0_5);padding-right:var(--canon-space-0_5)}.cu-px-1{padding-left:var(--canon-space-1);padding-right:var(--canon-space-1)}.cu-px-1\.5{padding-left:var(--canon-space-1_5);padding-right:var(--canon-space-1_5)}.cu-px-2{padding-left:var(--canon-space-2);padding-right:var(--canon-space-2)}.cu-px-3{padding-left:var(--canon-space-3);padding-right:var(--canon-space-3)}.cu-px-4{padding-left:var(--canon-space-4);padding-right:var(--canon-space-4)}.cu-px-5{padding-left:var(--canon-space-5);padding-right:var(--canon-space-5)}.cu-px-6{padding-left:var(--canon-space-6);padding-right:var(--canon-space-6)}.cu-px-7{padding-left:var(--canon-space-7);padding-right:var(--canon-space-7)}.cu-px-8{padding-left:var(--canon-space-8);padding-right:var(--canon-space-8)}.cu-px-9{padding-left:var(--canon-space-9);padding-right:var(--canon-space-9)}.cu-px-10{padding-left:var(--canon-space-10);padding-right:var(--canon-space-10)}.cu-px-11{padding-left:var(--canon-space-11);padding-right:var(--canon-space-11)}.cu-px-12{padding-left:var(--canon-space-12);padding-right:var(--canon-space-12)}.cu-px-13{padding-left:var(--canon-space-13);padding-right:var(--canon-space-13)}.cu-px-14{padding-left:var(--canon-space-14);padding-right:var(--canon-space-14)}@media (width>=640px){.xs\:cu-px{padding-left:var(--px-xs);padding-right:var(--px-xs)}.xs\:cu-px-0\.5{padding-left:var(--canon-space-0_5);padding-right:var(--canon-space-0_5)}.xs\:cu-px-1{padding-left:var(--canon-space-1);padding-right:var(--canon-space-1)}.xs\:cu-px-1\.5{padding-left:var(--canon-space-1_5);padding-right:var(--canon-space-1_5)}.xs\:cu-px-2{padding-left:var(--canon-space-2);padding-right:var(--canon-space-2)}.xs\:cu-px-3{padding-left:var(--canon-space-3);padding-right:var(--canon-space-3)}.xs\:cu-px-4{padding-left:var(--canon-space-4);padding-right:var(--canon-space-4)}.xs\:cu-px-5{padding-left:var(--canon-space-5);padding-right:var(--canon-space-5)}.xs\:cu-px-6{padding-left:var(--canon-space-6);padding-right:var(--canon-space-6)}.xs\:cu-px-7{padding-left:var(--canon-space-7);padding-right:var(--canon-space-7)}.xs\:cu-px-8{padding-left:var(--canon-space-8);padding-right:var(--canon-space-8)}.xs\:cu-px-9{padding-left:var(--canon-space-9);padding-right:var(--canon-space-9)}.xs\:cu-px-10{padding-left:var(--canon-space-10);padding-right:var(--canon-space-10)}.xs\:cu-px-11{padding-left:var(--canon-space-11);padding-right:var(--canon-space-11)}.xs\:cu-px-12{padding-left:var(--canon-space-12);padding-right:var(--canon-space-12)}.xs\:cu-px-13{padding-left:var(--canon-space-13);padding-right:var(--canon-space-13)}.xs\:cu-px-14{padding-left:var(--canon-space-14);padding-right:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-px{padding-left:var(--px-sm);padding-right:var(--px-sm)}.sm\:cu-px-0\.5{padding-left:var(--canon-space-0_5);padding-right:var(--canon-space-0_5)}.sm\:cu-px-1{padding-left:var(--canon-space-1);padding-right:var(--canon-space-1)}.sm\:cu-px-1\.5{padding-left:var(--canon-space-1_5);padding-right:var(--canon-space-1_5)}.sm\:cu-px-2{padding-left:var(--canon-space-2);padding-right:var(--canon-space-2)}.sm\:cu-px-3{padding-left:var(--canon-space-3);padding-right:var(--canon-space-3)}.sm\:cu-px-4{padding-left:var(--canon-space-4);padding-right:var(--canon-space-4)}.sm\:cu-px-5{padding-left:var(--canon-space-5);padding-right:var(--canon-space-5)}.sm\:cu-px-6{padding-left:var(--canon-space-6);padding-right:var(--canon-space-6)}.sm\:cu-px-7{padding-left:var(--canon-space-7);padding-right:var(--canon-space-7)}.sm\:cu-px-8{padding-left:var(--canon-space-8);padding-right:var(--canon-space-8)}.sm\:cu-px-9{padding-left:var(--canon-space-9);padding-right:var(--canon-space-9)}.sm\:cu-px-10{padding-left:var(--canon-space-10);padding-right:var(--canon-space-10)}.sm\:cu-px-11{padding-left:var(--canon-space-11);padding-right:var(--canon-space-11)}.sm\:cu-px-12{padding-left:var(--canon-space-12);padding-right:var(--canon-space-12)}.sm\:cu-px-13{padding-left:var(--canon-space-13);padding-right:var(--canon-space-13)}.sm\:cu-px-14{padding-left:var(--canon-space-14);padding-right:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-px{padding-left:var(--px-md);padding-right:var(--px-md)}.md\:cu-px-0\.5{padding-left:var(--canon-space-0_5);padding-right:var(--canon-space-0_5)}.md\:cu-px-1{padding-left:var(--canon-space-1);padding-right:var(--canon-space-1)}.md\:cu-px-1\.5{padding-left:var(--canon-space-1_5);padding-right:var(--canon-space-1_5)}.md\:cu-px-2{padding-left:var(--canon-space-2);padding-right:var(--canon-space-2)}.md\:cu-px-3{padding-left:var(--canon-space-3);padding-right:var(--canon-space-3)}.md\:cu-px-4{padding-left:var(--canon-space-4);padding-right:var(--canon-space-4)}.md\:cu-px-5{padding-left:var(--canon-space-5);padding-right:var(--canon-space-5)}.md\:cu-px-6{padding-left:var(--canon-space-6);padding-right:var(--canon-space-6)}.md\:cu-px-7{padding-left:var(--canon-space-7);padding-right:var(--canon-space-7)}.md\:cu-px-8{padding-left:var(--canon-space-8);padding-right:var(--canon-space-8)}.md\:cu-px-9{padding-left:var(--canon-space-9);padding-right:var(--canon-space-9)}.md\:cu-px-10{padding-left:var(--canon-space-10);padding-right:var(--canon-space-10)}.md\:cu-px-11{padding-left:var(--canon-space-11);padding-right:var(--canon-space-11)}.md\:cu-px-12{padding-left:var(--canon-space-12);padding-right:var(--canon-space-12)}.md\:cu-px-13{padding-left:var(--canon-space-13);padding-right:var(--canon-space-13)}.md\:cu-px-14{padding-left:var(--canon-space-14);padding-right:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-px{padding-left:var(--px-lg);padding-right:var(--px-lg)}.lg\:cu-px-0\.5{padding-left:var(--canon-space-0_5);padding-right:var(--canon-space-0_5)}.lg\:cu-px-1{padding-left:var(--canon-space-1);padding-right:var(--canon-space-1)}.lg\:cu-px-1\.5{padding-left:var(--canon-space-1_5);padding-right:var(--canon-space-1_5)}.lg\:cu-px-2{padding-left:var(--canon-space-2);padding-right:var(--canon-space-2)}.lg\:cu-px-3{padding-left:var(--canon-space-3);padding-right:var(--canon-space-3)}.lg\:cu-px-4{padding-left:var(--canon-space-4);padding-right:var(--canon-space-4)}.lg\:cu-px-5{padding-left:var(--canon-space-5);padding-right:var(--canon-space-5)}.lg\:cu-px-6{padding-left:var(--canon-space-6);padding-right:var(--canon-space-6)}.lg\:cu-px-7{padding-left:var(--canon-space-7);padding-right:var(--canon-space-7)}.lg\:cu-px-8{padding-left:var(--canon-space-8);padding-right:var(--canon-space-8)}.lg\:cu-px-9{padding-left:var(--canon-space-9);padding-right:var(--canon-space-9)}.lg\:cu-px-10{padding-left:var(--canon-space-10);padding-right:var(--canon-space-10)}.lg\:cu-px-11{padding-left:var(--canon-space-11);padding-right:var(--canon-space-11)}.lg\:cu-px-12{padding-left:var(--canon-space-12);padding-right:var(--canon-space-12)}.lg\:cu-px-13{padding-left:var(--canon-space-13);padding-right:var(--canon-space-13)}.lg\:cu-px-14{padding-left:var(--canon-space-14);padding-right:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-px{padding-left:var(--px-xl);padding-right:var(--px-xl)}.xl\:cu-px-0\.5{padding-left:var(--canon-space-0_5);padding-right:var(--canon-space-0_5)}.xl\:cu-px-1{padding-left:var(--canon-space-1);padding-right:var(--canon-space-1)}.xl\:cu-px-1\.5{padding-left:var(--canon-space-1_5);padding-right:var(--canon-space-1_5)}.xl\:cu-px-2{padding-left:var(--canon-space-2);padding-right:var(--canon-space-2)}.xl\:cu-px-3{padding-left:var(--canon-space-3);padding-right:var(--canon-space-3)}.xl\:cu-px-4{padding-left:var(--canon-space-4);padding-right:var(--canon-space-4)}.xl\:cu-px-5{padding-left:var(--canon-space-5);padding-right:var(--canon-space-5)}.xl\:cu-px-6{padding-left:var(--canon-space-6);padding-right:var(--canon-space-6)}.xl\:cu-px-7{padding-left:var(--canon-space-7);padding-right:var(--canon-space-7)}.xl\:cu-px-8{padding-left:var(--canon-space-8);padding-right:var(--canon-space-8)}.xl\:cu-px-9{padding-left:var(--canon-space-9);padding-right:var(--canon-space-9)}.xl\:cu-px-10{padding-left:var(--canon-space-10);padding-right:var(--canon-space-10)}.xl\:cu-px-11{padding-left:var(--canon-space-11);padding-right:var(--canon-space-11)}.xl\:cu-px-12{padding-left:var(--canon-space-12);padding-right:var(--canon-space-12)}.xl\:cu-px-13{padding-left:var(--canon-space-13);padding-right:var(--canon-space-13)}.xl\:cu-px-14{padding-left:var(--canon-space-14);padding-right:var(--canon-space-14)}}.cu-m{margin:var(--m)}.cu-m-0\.5{margin:var(--canon-space-0_5)}.cu-m-1{margin:var(--canon-space-1)}.cu-m-1\.5{margin:var(--canon-space-1_5)}.cu-m-2{margin:var(--canon-space-2)}.cu-m-3{margin:var(--canon-space-3)}.cu-m-4{margin:var(--canon-space-4)}.cu-m-5{margin:var(--canon-space-5)}.cu-m-6{margin:var(--canon-space-6)}.cu-m-7{margin:var(--canon-space-7)}.cu-m-8{margin:var(--canon-space-8)}.cu-m-9{margin:var(--canon-space-9)}.cu-m-10{margin:var(--canon-space-10)}.cu-m-11{margin:var(--canon-space-11)}.cu-m-12{margin:var(--canon-space-12)}.cu-m-13{margin:var(--canon-space-13)}.cu-m-14{margin:var(--canon-space-14)}@media (width>=640px){.xs\:cu-m{margin:var(--p-xs)}.xs\:cu-m-0\.5{margin:var(--canon-space-0_5)}.xs\:cu-m-1{margin:var(--canon-space-1)}.xs\:cu-m-1\.5{margin:var(--canon-space-1_5)}.xs\:cu-m-2{margin:var(--canon-space-2)}.xs\:cu-m-3{margin:var(--canon-space-3)}.xs\:cu-m-4{margin:var(--canon-space-4)}.xs\:cu-m-5{margin:var(--canon-space-5)}.xs\:cu-m-6{margin:var(--canon-space-6)}.xs\:cu-m-7{margin:var(--canon-space-7)}.xs\:cu-m-8{margin:var(--canon-space-8)}.xs\:cu-m-9{margin:var(--canon-space-9)}.xs\:cu-m-10{margin:var(--canon-space-10)}.xs\:cu-m-11{margin:var(--canon-space-11)}.xs\:cu-m-12{margin:var(--canon-space-12)}.xs\:cu-m-13{margin:var(--canon-space-13)}.xs\:cu-m-14{margin:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-m{margin:var(--p-sm)}.sm\:cu-m-0\.5{margin:var(--canon-space-0_5)}.sm\:cu-m-1{margin:var(--canon-space-1)}.sm\:cu-m-1\.5{margin:var(--canon-space-1_5)}.sm\:cu-m-2{margin:var(--canon-space-2)}.sm\:cu-m-3{margin:var(--canon-space-3)}.sm\:cu-m-4{margin:var(--canon-space-4)}.sm\:cu-m-5{margin:var(--canon-space-5)}.sm\:cu-m-6{margin:var(--canon-space-6)}.sm\:cu-m-7{margin:var(--canon-space-7)}.sm\:cu-m-8{margin:var(--canon-space-8)}.sm\:cu-m-9{margin:var(--canon-space-9)}.sm\:cu-m-10{margin:var(--canon-space-10)}.sm\:cu-m-11{margin:var(--canon-space-11)}.sm\:cu-m-12{margin:var(--canon-space-12)}.sm\:cu-m-13{margin:var(--canon-space-13)}.sm\:cu-m-14{margin:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-m{margin:var(--p-md)}.md\:cu-m-0\.5{margin:var(--canon-space-0_5)}.md\:cu-m-1{margin:var(--canon-space-1)}.md\:cu-m-1\.5{margin:var(--canon-space-1_5)}.md\:cu-m-2{margin:var(--canon-space-2)}.md\:cu-m-3{margin:var(--canon-space-3)}.md\:cu-m-4{margin:var(--canon-space-4)}.md\:cu-m-5{margin:var(--canon-space-5)}.md\:cu-m-6{margin:var(--canon-space-6)}.md\:cu-m-7{margin:var(--canon-space-7)}.md\:cu-m-8{margin:var(--canon-space-8)}.md\:cu-m-9{margin:var(--canon-space-9)}.md\:cu-m-10{margin:var(--canon-space-10)}.md\:cu-m-11{margin:var(--canon-space-11)}.md\:cu-m-12{margin:var(--canon-space-12)}.md\:cu-m-13{margin:var(--canon-space-13)}.md\:cu-m-14{margin:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-m{margin:var(--p-lg)}.lg\:cu-m-0\.5{margin:var(--canon-space-0_5)}.lg\:cu-m-1{margin:var(--canon-space-1)}.lg\:cu-m-1\.5{margin:var(--canon-space-1_5)}.lg\:cu-m-2{margin:var(--canon-space-2)}.lg\:cu-m-3{margin:var(--canon-space-3)}.lg\:cu-m-4{margin:var(--canon-space-4)}.lg\:cu-m-5{margin:var(--canon-space-5)}.lg\:cu-m-6{margin:var(--canon-space-6)}.lg\:cu-m-7{margin:var(--canon-space-7)}.lg\:cu-m-8{margin:var(--canon-space-8)}.lg\:cu-m-9{margin:var(--canon-space-9)}.lg\:cu-m-10{margin:var(--canon-space-10)}.lg\:cu-m-11{margin:var(--canon-space-11)}.lg\:cu-m-12{margin:var(--canon-space-12)}.lg\:cu-m-13{margin:var(--canon-space-13)}.lg\:cu-m-14{margin:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-m{margin:var(--p-xl)}.xl\:cu-m-0\.5{margin:var(--canon-space-0_5)}.xl\:cu-m-1{margin:var(--canon-space-1)}.xl\:cu-m-1\.5{margin:var(--canon-space-1_5)}.xl\:cu-m-2{margin:var(--canon-space-2)}.xl\:cu-m-3{margin:var(--canon-space-3)}.xl\:cu-m-4{margin:var(--canon-space-4)}.xl\:cu-m-5{margin:var(--canon-space-5)}.xl\:cu-m-6{margin:var(--canon-space-6)}.xl\:cu-m-7{margin:var(--canon-space-7)}.xl\:cu-m-8{margin:var(--canon-space-8)}.xl\:cu-m-9{margin:var(--canon-space-9)}.xl\:cu-m-10{margin:var(--canon-space-10)}.xl\:cu-m-11{margin:var(--canon-space-11)}.xl\:cu-m-12{margin:var(--canon-space-12)}.xl\:cu-m-13{margin:var(--canon-space-13)}.xl\:cu-m-14{margin:var(--canon-space-14)}}.cu-ml{margin-left:var(--ml)}.cu-ml-0\.5{margin-left:var(--canon-space-0_5)}.cu-ml-1{margin-left:var(--canon-space-1)}.cu-ml-1\.5{margin-left:var(--canon-space-1_5)}.cu-ml-2{margin-left:var(--canon-space-2)}.cu-ml-3{margin-left:var(--canon-space-3)}.cu-ml-4{margin-left:var(--canon-space-4)}.cu-ml-5{margin-left:var(--canon-space-5)}.cu-ml-6{margin-left:var(--canon-space-6)}.cu-ml-7{margin-left:var(--canon-space-7)}.cu-ml-8{margin-left:var(--canon-space-8)}.cu-ml-9{margin-left:var(--canon-space-9)}.cu-ml-10{margin-left:var(--canon-space-10)}.cu-ml-11{margin-left:var(--canon-space-11)}.cu-ml-12{margin-left:var(--canon-space-12)}.cu-ml-13{margin-left:var(--canon-space-13)}.cu-ml-14{margin-left:var(--canon-space-14)}@media (width>=640px){.xs\:cu-ml{margin-left:var(--pl-xs)}.xs\:cu-ml-0\.5{margin-left:var(--canon-space-0_5)}.xs\:cu-ml-1{margin-left:var(--canon-space-1)}.xs\:cu-ml-1\.5{margin-left:var(--canon-space-1_5)}.xs\:cu-ml-2{margin-left:var(--canon-space-2)}.xs\:cu-ml-3{margin-left:var(--canon-space-3)}.xs\:cu-ml-4{margin-left:var(--canon-space-4)}.xs\:cu-ml-5{margin-left:var(--canon-space-5)}.xs\:cu-ml-6{margin-left:var(--canon-space-6)}.xs\:cu-ml-7{margin-left:var(--canon-space-7)}.xs\:cu-ml-8{margin-left:var(--canon-space-8)}.xs\:cu-ml-9{margin-left:var(--canon-space-9)}.xs\:cu-ml-10{margin-left:var(--canon-space-10)}.xs\:cu-ml-11{margin-left:var(--canon-space-11)}.xs\:cu-ml-12{margin-left:var(--canon-space-12)}.xs\:cu-ml-13{margin-left:var(--canon-space-13)}.xs\:cu-ml-14{margin-left:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-ml{margin-left:var(--pl-sm)}.sm\:cu-ml-0\.5{margin-left:var(--canon-space-0_5)}.sm\:cu-ml-1{margin-left:var(--canon-space-1)}.sm\:cu-ml-1\.5{margin-left:var(--canon-space-1_5)}.sm\:cu-ml-2{margin-left:var(--canon-space-2)}.sm\:cu-ml-3{margin-left:var(--canon-space-3)}.sm\:cu-ml-4{margin-left:var(--canon-space-4)}.sm\:cu-ml-5{margin-left:var(--canon-space-5)}.sm\:cu-ml-6{margin-left:var(--canon-space-6)}.sm\:cu-ml-7{margin-left:var(--canon-space-7)}.sm\:cu-ml-8{margin-left:var(--canon-space-8)}.sm\:cu-ml-9{margin-left:var(--canon-space-9)}.sm\:cu-ml-10{margin-left:var(--canon-space-10)}.sm\:cu-ml-11{margin-left:var(--canon-space-11)}.sm\:cu-ml-12{margin-left:var(--canon-space-12)}.sm\:cu-ml-13{margin-left:var(--canon-space-13)}.sm\:cu-ml-14{margin-left:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-ml{margin-left:var(--pl-md)}.md\:cu-ml-0\.5{margin-left:var(--canon-space-0_5)}.md\:cu-ml-1{margin-left:var(--canon-space-1)}.md\:cu-ml-1\.5{margin-left:var(--canon-space-1_5)}.md\:cu-ml-2{margin-left:var(--canon-space-2)}.md\:cu-ml-3{margin-left:var(--canon-space-3)}.md\:cu-ml-4{margin-left:var(--canon-space-4)}.md\:cu-ml-5{margin-left:var(--canon-space-5)}.md\:cu-ml-6{margin-left:var(--canon-space-6)}.md\:cu-ml-7{margin-left:var(--canon-space-7)}.md\:cu-ml-8{margin-left:var(--canon-space-8)}.md\:cu-ml-9{margin-left:var(--canon-space-9)}.md\:cu-ml-10{margin-left:var(--canon-space-10)}.md\:cu-ml-11{margin-left:var(--canon-space-11)}.md\:cu-ml-12{margin-left:var(--canon-space-12)}.md\:cu-ml-13{margin-left:var(--canon-space-13)}.md\:cu-ml-14{margin-left:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-ml{margin-left:var(--pl-lg)}.lg\:cu-ml-0\.5{margin-left:var(--canon-space-0_5)}.lg\:cu-ml-1{margin-left:var(--canon-space-1)}.lg\:cu-ml-1\.5{margin-left:var(--canon-space-1_5)}.lg\:cu-ml-2{margin-left:var(--canon-space-2)}.lg\:cu-ml-3{margin-left:var(--canon-space-3)}.lg\:cu-ml-4{margin-left:var(--canon-space-4)}.lg\:cu-ml-5{margin-left:var(--canon-space-5)}.lg\:cu-ml-6{margin-left:var(--canon-space-6)}.lg\:cu-ml-7{margin-left:var(--canon-space-7)}.lg\:cu-ml-8{margin-left:var(--canon-space-8)}.lg\:cu-ml-9{margin-left:var(--canon-space-9)}.lg\:cu-ml-10{margin-left:var(--canon-space-10)}.lg\:cu-ml-11{margin-left:var(--canon-space-11)}.lg\:cu-ml-12{margin-left:var(--canon-space-12)}.lg\:cu-ml-13{margin-left:var(--canon-space-13)}.lg\:cu-ml-14{margin-left:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-ml{margin-left:var(--pl-xl)}.xl\:cu-ml-0\.5{margin-left:var(--canon-space-0_5)}.xl\:cu-ml-1{margin-left:var(--canon-space-1)}.xl\:cu-ml-1\.5{margin-left:var(--canon-space-1_5)}.xl\:cu-ml-2{margin-left:var(--canon-space-2)}.xl\:cu-ml-3{margin-left:var(--canon-space-3)}.xl\:cu-ml-4{margin-left:var(--canon-space-4)}.xl\:cu-ml-5{margin-left:var(--canon-space-5)}.xl\:cu-ml-6{margin-left:var(--canon-space-6)}.xl\:cu-ml-7{margin-left:var(--canon-space-7)}.xl\:cu-ml-8{margin-left:var(--canon-space-8)}.xl\:cu-ml-9{margin-left:var(--canon-space-9)}.xl\:cu-ml-10{margin-left:var(--canon-space-10)}.xl\:cu-ml-11{margin-left:var(--canon-space-11)}.xl\:cu-ml-12{margin-left:var(--canon-space-12)}.xl\:cu-ml-13{margin-left:var(--canon-space-13)}.xl\:cu-ml-14{margin-left:var(--canon-space-14)}}.cu-mr{margin-right:var(--mr)}.cu-mr-0\.5{margin-right:var(--canon-space-0_5)}.cu-mr-1{margin-right:var(--canon-space-1)}.cu-mr-1\.5{margin-right:var(--canon-space-1_5)}.cu-mr-2{margin-right:var(--canon-space-2)}.cu-mr-3{margin-right:var(--canon-space-3)}.cu-mr-4{margin-right:var(--canon-space-4)}.cu-mr-5{margin-right:var(--canon-space-5)}.cu-mr-6{margin-right:var(--canon-space-6)}.cu-mr-7{margin-right:var(--canon-space-7)}.cu-mr-8{margin-right:var(--canon-space-8)}.cu-mr-9{margin-right:var(--canon-space-9)}.cu-mr-10{margin-right:var(--canon-space-10)}.cu-mr-11{margin-right:var(--canon-space-11)}.cu-mr-12{margin-right:var(--canon-space-12)}.cu-mr-13{margin-right:var(--canon-space-13)}.cu-mr-14{margin-right:var(--canon-space-14)}@media (width>=640px){.xs\:cu-mr{margin-right:var(--pr-xs)}.xs\:cu-mr-0\.5{margin-right:var(--canon-space-0_5)}.xs\:cu-mr-1{margin-right:var(--canon-space-1)}.xs\:cu-mr-1\.5{margin-right:var(--canon-space-1_5)}.xs\:cu-mr-2{margin-right:var(--canon-space-2)}.xs\:cu-mr-3{margin-right:var(--canon-space-3)}.xs\:cu-mr-4{margin-right:var(--canon-space-4)}.xs\:cu-mr-5{margin-right:var(--canon-space-5)}.xs\:cu-mr-6{margin-right:var(--canon-space-6)}.xs\:cu-mr-7{margin-right:var(--canon-space-7)}.xs\:cu-mr-8{margin-right:var(--canon-space-8)}.xs\:cu-mr-9{margin-right:var(--canon-space-9)}.xs\:cu-mr-10{margin-right:var(--canon-space-10)}.xs\:cu-mr-11{margin-right:var(--canon-space-11)}.xs\:cu-mr-12{margin-right:var(--canon-space-12)}.xs\:cu-mr-13{margin-right:var(--canon-space-13)}.xs\:cu-mr-14{margin-right:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-mr{margin-right:var(--pr-sm)}.sm\:cu-mr-0\.5{margin-right:var(--canon-space-0_5)}.sm\:cu-mr-1{margin-right:var(--canon-space-1)}.sm\:cu-mr-1\.5{margin-right:var(--canon-space-1_5)}.sm\:cu-mr-2{margin-right:var(--canon-space-2)}.sm\:cu-mr-3{margin-right:var(--canon-space-3)}.sm\:cu-mr-4{margin-right:var(--canon-space-4)}.sm\:cu-mr-5{margin-right:var(--canon-space-5)}.sm\:cu-mr-6{margin-right:var(--canon-space-6)}.sm\:cu-mr-7{margin-right:var(--canon-space-7)}.sm\:cu-mr-8{margin-right:var(--canon-space-8)}.sm\:cu-mr-9{margin-right:var(--canon-space-9)}.sm\:cu-mr-10{margin-right:var(--canon-space-10)}.sm\:cu-mr-11{margin-right:var(--canon-space-11)}.sm\:cu-mr-12{margin-right:var(--canon-space-12)}.sm\:cu-mr-13{margin-right:var(--canon-space-13)}.sm\:cu-mr-14{margin-right:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-mr{margin-right:var(--pr-md)}.md\:cu-mr-0\.5{margin-right:var(--canon-space-0_5)}.md\:cu-mr-1{margin-right:var(--canon-space-1)}.md\:cu-mr-1\.5{margin-right:var(--canon-space-1_5)}.md\:cu-mr-2{margin-right:var(--canon-space-2)}.md\:cu-mr-3{margin-right:var(--canon-space-3)}.md\:cu-mr-4{margin-right:var(--canon-space-4)}.md\:cu-mr-5{margin-right:var(--canon-space-5)}.md\:cu-mr-6{margin-right:var(--canon-space-6)}.md\:cu-mr-7{margin-right:var(--canon-space-7)}.md\:cu-mr-8{margin-right:var(--canon-space-8)}.md\:cu-mr-9{margin-right:var(--canon-space-9)}.md\:cu-mr-10{margin-right:var(--canon-space-10)}.md\:cu-mr-11{margin-right:var(--canon-space-11)}.md\:cu-mr-12{margin-right:var(--canon-space-12)}.md\:cu-mr-13{margin-right:var(--canon-space-13)}.md\:cu-mr-14{margin-right:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-mr{margin-right:var(--pr-lg)}.lg\:cu-mr-0\.5{margin-right:var(--canon-space-0_5)}.lg\:cu-mr-1{margin-right:var(--canon-space-1)}.lg\:cu-mr-1\.5{margin-right:var(--canon-space-1_5)}.lg\:cu-mr-2{margin-right:var(--canon-space-2)}.lg\:cu-mr-3{margin-right:var(--canon-space-3)}.lg\:cu-mr-4{margin-right:var(--canon-space-4)}.lg\:cu-mr-5{margin-right:var(--canon-space-5)}.lg\:cu-mr-6{margin-right:var(--canon-space-6)}.lg\:cu-mr-7{margin-right:var(--canon-space-7)}.lg\:cu-mr-8{margin-right:var(--canon-space-8)}.lg\:cu-mr-9{margin-right:var(--canon-space-9)}.lg\:cu-mr-10{margin-right:var(--canon-space-10)}.lg\:cu-mr-11{margin-right:var(--canon-space-11)}.lg\:cu-mr-12{margin-right:var(--canon-space-12)}.lg\:cu-mr-13{margin-right:var(--canon-space-13)}.lg\:cu-mr-14{margin-right:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-mr{margin-right:var(--pr-xl)}.xl\:cu-mr-0\.5{margin-right:var(--canon-space-0_5)}.xl\:cu-mr-1{margin-right:var(--canon-space-1)}.xl\:cu-mr-1\.5{margin-right:var(--canon-space-1_5)}.xl\:cu-mr-2{margin-right:var(--canon-space-2)}.xl\:cu-mr-3{margin-right:var(--canon-space-3)}.xl\:cu-mr-4{margin-right:var(--canon-space-4)}.xl\:cu-mr-5{margin-right:var(--canon-space-5)}.xl\:cu-mr-6{margin-right:var(--canon-space-6)}.xl\:cu-mr-7{margin-right:var(--canon-space-7)}.xl\:cu-mr-8{margin-right:var(--canon-space-8)}.xl\:cu-mr-9{margin-right:var(--canon-space-9)}.xl\:cu-mr-10{margin-right:var(--canon-space-10)}.xl\:cu-mr-11{margin-right:var(--canon-space-11)}.xl\:cu-mr-12{margin-right:var(--canon-space-12)}.xl\:cu-mr-13{margin-right:var(--canon-space-13)}.xl\:cu-mr-14{margin-right:var(--canon-space-14)}}.cu-mt{margin-top:var(--mt)}.cu-mt-0\.5{margin-top:var(--canon-space-0_5)}.cu-mt-1{margin-top:var(--canon-space-1)}.cu-mt-1\.5{margin-top:var(--canon-space-1_5)}.cu-mt-2{margin-top:var(--canon-space-2)}.cu-mt-3{margin-top:var(--canon-space-3)}.cu-mt-4{margin-top:var(--canon-space-4)}.cu-mt-5{margin-top:var(--canon-space-5)}.cu-mt-6{margin-top:var(--canon-space-6)}.cu-mt-7{margin-top:var(--canon-space-7)}.cu-mt-8{margin-top:var(--canon-space-8)}.cu-mt-9{margin-top:var(--canon-space-9)}.cu-mt-10{margin-top:var(--canon-space-10)}.cu-mt-11{margin-top:var(--canon-space-11)}.cu-mt-12{margin-top:var(--canon-space-12)}.cu-mt-13{margin-top:var(--canon-space-13)}.cu-mt-14{margin-top:var(--canon-space-14)}@media (width>=640px){.xs\:cu-mt{margin-top:var(--pt-xs)}.xs\:cu-mt-0\.5{margin-top:var(--canon-space-0_5)}.xs\:cu-mt-1{margin-top:var(--canon-space-1)}.xs\:cu-mt-1\.5{margin-top:var(--canon-space-1_5)}.xs\:cu-mt-2{margin-top:var(--canon-space-2)}.xs\:cu-mt-3{margin-top:var(--canon-space-3)}.xs\:cu-mt-4{margin-top:var(--canon-space-4)}.xs\:cu-mt-5{margin-top:var(--canon-space-5)}.xs\:cu-mt-6{margin-top:var(--canon-space-6)}.xs\:cu-mt-7{margin-top:var(--canon-space-7)}.xs\:cu-mt-8{margin-top:var(--canon-space-8)}.xs\:cu-mt-9{margin-top:var(--canon-space-9)}.xs\:cu-mt-10{margin-top:var(--canon-space-10)}.xs\:cu-mt-11{margin-top:var(--canon-space-11)}.xs\:cu-mt-12{margin-top:var(--canon-space-12)}.xs\:cu-mt-13{margin-top:var(--canon-space-13)}.xs\:cu-mt-14{margin-top:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-mt{margin-top:var(--pt-sm)}.sm\:cu-mt-0\.5{margin-top:var(--canon-space-0_5)}.sm\:cu-mt-1{margin-top:var(--canon-space-1)}.sm\:cu-mt-1\.5{margin-top:var(--canon-space-1_5)}.sm\:cu-mt-2{margin-top:var(--canon-space-2)}.sm\:cu-mt-3{margin-top:var(--canon-space-3)}.sm\:cu-mt-4{margin-top:var(--canon-space-4)}.sm\:cu-mt-5{margin-top:var(--canon-space-5)}.sm\:cu-mt-6{margin-top:var(--canon-space-6)}.sm\:cu-mt-7{margin-top:var(--canon-space-7)}.sm\:cu-mt-8{margin-top:var(--canon-space-8)}.sm\:cu-mt-9{margin-top:var(--canon-space-9)}.sm\:cu-mt-10{margin-top:var(--canon-space-10)}.sm\:cu-mt-11{margin-top:var(--canon-space-11)}.sm\:cu-mt-12{margin-top:var(--canon-space-12)}.sm\:cu-mt-13{margin-top:var(--canon-space-13)}.sm\:cu-mt-14{margin-top:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-mt{margin-top:var(--pt-md)}.md\:cu-mt-0\.5{margin-top:var(--canon-space-0_5)}.md\:cu-mt-1{margin-top:var(--canon-space-1)}.md\:cu-mt-1\.5{margin-top:var(--canon-space-1_5)}.md\:cu-mt-2{margin-top:var(--canon-space-2)}.md\:cu-mt-3{margin-top:var(--canon-space-3)}.md\:cu-mt-4{margin-top:var(--canon-space-4)}.md\:cu-mt-5{margin-top:var(--canon-space-5)}.md\:cu-mt-6{margin-top:var(--canon-space-6)}.md\:cu-mt-7{margin-top:var(--canon-space-7)}.md\:cu-mt-8{margin-top:var(--canon-space-8)}.md\:cu-mt-9{margin-top:var(--canon-space-9)}.md\:cu-mt-10{margin-top:var(--canon-space-10)}.md\:cu-mt-11{margin-top:var(--canon-space-11)}.md\:cu-mt-12{margin-top:var(--canon-space-12)}.md\:cu-mt-13{margin-top:var(--canon-space-13)}.md\:cu-mt-14{margin-top:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-mt{margin-top:var(--pt-lg)}.lg\:cu-mt-0\.5{margin-top:var(--canon-space-0_5)}.lg\:cu-mt-1{margin-top:var(--canon-space-1)}.lg\:cu-mt-1\.5{margin-top:var(--canon-space-1_5)}.lg\:cu-mt-2{margin-top:var(--canon-space-2)}.lg\:cu-mt-3{margin-top:var(--canon-space-3)}.lg\:cu-mt-4{margin-top:var(--canon-space-4)}.lg\:cu-mt-5{margin-top:var(--canon-space-5)}.lg\:cu-mt-6{margin-top:var(--canon-space-6)}.lg\:cu-mt-7{margin-top:var(--canon-space-7)}.lg\:cu-mt-8{margin-top:var(--canon-space-8)}.lg\:cu-mt-9{margin-top:var(--canon-space-9)}.lg\:cu-mt-10{margin-top:var(--canon-space-10)}.lg\:cu-mt-11{margin-top:var(--canon-space-11)}.lg\:cu-mt-12{margin-top:var(--canon-space-12)}.lg\:cu-mt-13{margin-top:var(--canon-space-13)}.lg\:cu-mt-14{margin-top:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-mt{margin-top:var(--pt-xl)}.xl\:cu-mt-0\.5{margin-top:var(--canon-space-0_5)}.xl\:cu-mt-1{margin-top:var(--canon-space-1)}.xl\:cu-mt-1\.5{margin-top:var(--canon-space-1_5)}.xl\:cu-mt-2{margin-top:var(--canon-space-2)}.xl\:cu-mt-3{margin-top:var(--canon-space-3)}.xl\:cu-mt-4{margin-top:var(--canon-space-4)}.xl\:cu-mt-5{margin-top:var(--canon-space-5)}.xl\:cu-mt-6{margin-top:var(--canon-space-6)}.xl\:cu-mt-7{margin-top:var(--canon-space-7)}.xl\:cu-mt-8{margin-top:var(--canon-space-8)}.xl\:cu-mt-9{margin-top:var(--canon-space-9)}.xl\:cu-mt-10{margin-top:var(--canon-space-10)}.xl\:cu-mt-11{margin-top:var(--canon-space-11)}.xl\:cu-mt-12{margin-top:var(--canon-space-12)}.xl\:cu-mt-13{margin-top:var(--canon-space-13)}.xl\:cu-mt-14{margin-top:var(--canon-space-14)}}.cu-mb{margin-bottom:var(--mb)}.cu-mb-0\.5{margin-bottom:var(--canon-space-0_5)}.cu-mb-1{margin-bottom:var(--canon-space-1)}.cu-mb-1\.5{margin-bottom:var(--canon-space-1_5)}.cu-mb-2{margin-bottom:var(--canon-space-2)}.cu-mb-3{margin-bottom:var(--canon-space-3)}.cu-mb-4{margin-bottom:var(--canon-space-4)}.cu-mb-5{margin-bottom:var(--canon-space-5)}.cu-mb-6{margin-bottom:var(--canon-space-6)}.cu-mb-7{margin-bottom:var(--canon-space-7)}.cu-mb-8{margin-bottom:var(--canon-space-8)}.cu-mb-9{margin-bottom:var(--canon-space-9)}.cu-mb-10{margin-bottom:var(--canon-space-10)}.cu-mb-11{margin-bottom:var(--canon-space-11)}.cu-mb-12{margin-bottom:var(--canon-space-12)}.cu-mb-13{margin-bottom:var(--canon-space-13)}.cu-mb-14{margin-bottom:var(--canon-space-14)}@media (width>=640px){.xs\:cu-mb{margin-bottom:var(--pb-xs)}.xs\:cu-mb-0\.5{margin-bottom:var(--canon-space-0_5)}.xs\:cu-mb-1{margin-bottom:var(--canon-space-1)}.xs\:cu-mb-1\.5{margin-bottom:var(--canon-space-1_5)}.xs\:cu-mb-2{margin-bottom:var(--canon-space-2)}.xs\:cu-mb-3{margin-bottom:var(--canon-space-3)}.xs\:cu-mb-4{margin-bottom:var(--canon-space-4)}.xs\:cu-mb-5{margin-bottom:var(--canon-space-5)}.xs\:cu-mb-6{margin-bottom:var(--canon-space-6)}.xs\:cu-mb-7{margin-bottom:var(--canon-space-7)}.xs\:cu-mb-8{margin-bottom:var(--canon-space-8)}.xs\:cu-mb-9{margin-bottom:var(--canon-space-9)}.xs\:cu-mb-10{margin-bottom:var(--canon-space-10)}.xs\:cu-mb-11{margin-bottom:var(--canon-space-11)}.xs\:cu-mb-12{margin-bottom:var(--canon-space-12)}.xs\:cu-mb-13{margin-bottom:var(--canon-space-13)}.xs\:cu-mb-14{margin-bottom:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-mb{margin-bottom:var(--pb-sm)}.sm\:cu-mb-0\.5{margin-bottom:var(--canon-space-0_5)}.sm\:cu-mb-1{margin-bottom:var(--canon-space-1)}.sm\:cu-mb-1\.5{margin-bottom:var(--canon-space-1_5)}.sm\:cu-mb-2{margin-bottom:var(--canon-space-2)}.sm\:cu-mb-3{margin-bottom:var(--canon-space-3)}.sm\:cu-mb-4{margin-bottom:var(--canon-space-4)}.sm\:cu-mb-5{margin-bottom:var(--canon-space-5)}.sm\:cu-mb-6{margin-bottom:var(--canon-space-6)}.sm\:cu-mb-7{margin-bottom:var(--canon-space-7)}.sm\:cu-mb-8{margin-bottom:var(--canon-space-8)}.sm\:cu-mb-9{margin-bottom:var(--canon-space-9)}.sm\:cu-mb-10{margin-bottom:var(--canon-space-10)}.sm\:cu-mb-11{margin-bottom:var(--canon-space-11)}.sm\:cu-mb-12{margin-bottom:var(--canon-space-12)}.sm\:cu-mb-13{margin-bottom:var(--canon-space-13)}.sm\:cu-mb-14{margin-bottom:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-mb{margin-bottom:var(--pb-md)}.md\:cu-mb-0\.5{margin-bottom:var(--canon-space-0_5)}.md\:cu-mb-1{margin-bottom:var(--canon-space-1)}.md\:cu-mb-1\.5{margin-bottom:var(--canon-space-1_5)}.md\:cu-mb-2{margin-bottom:var(--canon-space-2)}.md\:cu-mb-3{margin-bottom:var(--canon-space-3)}.md\:cu-mb-4{margin-bottom:var(--canon-space-4)}.md\:cu-mb-5{margin-bottom:var(--canon-space-5)}.md\:cu-mb-6{margin-bottom:var(--canon-space-6)}.md\:cu-mb-7{margin-bottom:var(--canon-space-7)}.md\:cu-mb-8{margin-bottom:var(--canon-space-8)}.md\:cu-mb-9{margin-bottom:var(--canon-space-9)}.md\:cu-mb-10{margin-bottom:var(--canon-space-10)}.md\:cu-mb-11{margin-bottom:var(--canon-space-11)}.md\:cu-mb-12{margin-bottom:var(--canon-space-12)}.md\:cu-mb-13{margin-bottom:var(--canon-space-13)}.md\:cu-mb-14{margin-bottom:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-mb{margin-bottom:var(--pb-lg)}.lg\:cu-mb-0\.5{margin-bottom:var(--canon-space-0_5)}.lg\:cu-mb-1{margin-bottom:var(--canon-space-1)}.lg\:cu-mb-1\.5{margin-bottom:var(--canon-space-1_5)}.lg\:cu-mb-2{margin-bottom:var(--canon-space-2)}.lg\:cu-mb-3{margin-bottom:var(--canon-space-3)}.lg\:cu-mb-4{margin-bottom:var(--canon-space-4)}.lg\:cu-mb-5{margin-bottom:var(--canon-space-5)}.lg\:cu-mb-6{margin-bottom:var(--canon-space-6)}.lg\:cu-mb-7{margin-bottom:var(--canon-space-7)}.lg\:cu-mb-8{margin-bottom:var(--canon-space-8)}.lg\:cu-mb-9{margin-bottom:var(--canon-space-9)}.lg\:cu-mb-10{margin-bottom:var(--canon-space-10)}.lg\:cu-mb-11{margin-bottom:var(--canon-space-11)}.lg\:cu-mb-12{margin-bottom:var(--canon-space-12)}.lg\:cu-mb-13{margin-bottom:var(--canon-space-13)}.lg\:cu-mb-14{margin-bottom:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-mb{margin-bottom:var(--pb-xl)}.xl\:cu-mb-0\.5{margin-bottom:var(--canon-space-0_5)}.xl\:cu-mb-1{margin-bottom:var(--canon-space-1)}.xl\:cu-mb-1\.5{margin-bottom:var(--canon-space-1_5)}.xl\:cu-mb-2{margin-bottom:var(--canon-space-2)}.xl\:cu-mb-3{margin-bottom:var(--canon-space-3)}.xl\:cu-mb-4{margin-bottom:var(--canon-space-4)}.xl\:cu-mb-5{margin-bottom:var(--canon-space-5)}.xl\:cu-mb-6{margin-bottom:var(--canon-space-6)}.xl\:cu-mb-7{margin-bottom:var(--canon-space-7)}.xl\:cu-mb-8{margin-bottom:var(--canon-space-8)}.xl\:cu-mb-9{margin-bottom:var(--canon-space-9)}.xl\:cu-mb-10{margin-bottom:var(--canon-space-10)}.xl\:cu-mb-11{margin-bottom:var(--canon-space-11)}.xl\:cu-mb-12{margin-bottom:var(--canon-space-12)}.xl\:cu-mb-13{margin-bottom:var(--canon-space-13)}.xl\:cu-mb-14{margin-bottom:var(--canon-space-14)}}.cu-my{margin-top:var(--my);margin-bottom:var(--my)}.cu-my-0\.5{margin-top:var(--canon-space-0_5);margin-bottom:var(--canon-space-0_5)}.cu-my-1{margin-top:var(--canon-space-1);margin-bottom:var(--canon-space-1)}.cu-my-1\.5{margin-top:var(--canon-space-1_5);margin-bottom:var(--canon-space-1_5)}.cu-my-2{margin-top:var(--canon-space-2);margin-bottom:var(--canon-space-2)}.cu-my-3{margin-top:var(--canon-space-3);margin-bottom:var(--canon-space-3)}.cu-my-4{margin-top:var(--canon-space-4);margin-bottom:var(--canon-space-4)}.cu-my-5{margin-top:var(--canon-space-5);margin-bottom:var(--canon-space-5)}.cu-my-6{margin-top:var(--canon-space-6);margin-bottom:var(--canon-space-6)}.cu-my-7{margin-top:var(--canon-space-7);margin-bottom:var(--canon-space-7)}.cu-my-8{margin-top:var(--canon-space-8);margin-bottom:var(--canon-space-8)}.cu-my-9{margin-top:var(--canon-space-9);margin-bottom:var(--canon-space-9)}.cu-my-10{margin-top:var(--canon-space-10);margin-bottom:var(--canon-space-10)}.cu-my-11{margin-top:var(--canon-space-11);margin-bottom:var(--canon-space-11)}.cu-my-12{margin-top:var(--canon-space-12);margin-bottom:var(--canon-space-12)}.cu-my-13{margin-top:var(--canon-space-13);margin-bottom:var(--canon-space-13)}.cu-my-14{margin-top:var(--canon-space-14);margin-bottom:var(--canon-space-14)}@media (width>=640px){.xs\:cu-my{margin-top:var(--py-xs);margin-bottom:var(--py-xs)}.xs\:cu-my-0\.5{margin-top:var(--canon-space-0_5);margin-bottom:var(--canon-space-0_5)}.xs\:cu-my-1{margin-top:var(--canon-space-1);margin-bottom:var(--canon-space-1)}.xs\:cu-my-1\.5{margin-top:var(--canon-space-1_5);margin-bottom:var(--canon-space-1_5)}.xs\:cu-my-2{margin-top:var(--canon-space-2);margin-bottom:var(--canon-space-2)}.xs\:cu-my-3{margin-top:var(--canon-space-3);margin-bottom:var(--canon-space-3)}.xs\:cu-my-4{margin-top:var(--canon-space-4);margin-bottom:var(--canon-space-4)}.xs\:cu-my-5{margin-top:var(--canon-space-5);margin-bottom:var(--canon-space-5)}.xs\:cu-my-6{margin-top:var(--canon-space-6);margin-bottom:var(--canon-space-6)}.xs\:cu-my-7{margin-top:var(--canon-space-7);margin-bottom:var(--canon-space-7)}.xs\:cu-my-8{margin-top:var(--canon-space-8);margin-bottom:var(--canon-space-8)}.xs\:cu-my-9{margin-top:var(--canon-space-9);margin-bottom:var(--canon-space-9)}.xs\:cu-my-10{margin-top:var(--canon-space-10);margin-bottom:var(--canon-space-10)}.xs\:cu-my-11{margin-top:var(--canon-space-11);margin-bottom:var(--canon-space-11)}.xs\:cu-my-12{margin-top:var(--canon-space-12);margin-bottom:var(--canon-space-12)}.xs\:cu-my-13{margin-top:var(--canon-space-13);margin-bottom:var(--canon-space-13)}.xs\:cu-my-14{margin-top:var(--canon-space-14);margin-bottom:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-my{margin-top:var(--py-sm);margin-bottom:var(--py-sm)}.sm\:cu-my-0\.5{margin-top:var(--canon-space-0_5);margin-bottom:var(--canon-space-0_5)}.sm\:cu-my-1{margin-top:var(--canon-space-1);margin-bottom:var(--canon-space-1)}.sm\:cu-my-1\.5{margin-top:var(--canon-space-1_5);margin-bottom:var(--canon-space-1_5)}.sm\:cu-my-2{margin-top:var(--canon-space-2);margin-bottom:var(--canon-space-2)}.sm\:cu-my-3{margin-top:var(--canon-space-3);margin-bottom:var(--canon-space-3)}.sm\:cu-my-4{margin-top:var(--canon-space-4);margin-bottom:var(--canon-space-4)}.sm\:cu-my-5{margin-top:var(--canon-space-5);margin-bottom:var(--canon-space-5)}.sm\:cu-my-6{margin-top:var(--canon-space-6);margin-bottom:var(--canon-space-6)}.sm\:cu-my-7{margin-top:var(--canon-space-7);margin-bottom:var(--canon-space-7)}.sm\:cu-my-8{margin-top:var(--canon-space-8);margin-bottom:var(--canon-space-8)}.sm\:cu-my-9{margin-top:var(--canon-space-9);margin-bottom:var(--canon-space-9)}.sm\:cu-my-10{margin-top:var(--canon-space-10);margin-bottom:var(--canon-space-10)}.sm\:cu-my-11{margin-top:var(--canon-space-11);margin-bottom:var(--canon-space-11)}.sm\:cu-my-12{margin-top:var(--canon-space-12);margin-bottom:var(--canon-space-12)}.sm\:cu-my-13{margin-top:var(--canon-space-13);margin-bottom:var(--canon-space-13)}.sm\:cu-my-14{margin-top:var(--canon-space-14);margin-bottom:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-my{margin-top:var(--py-md);margin-bottom:var(--py-md)}.md\:cu-my-0\.5{margin-top:var(--canon-space-0_5);margin-bottom:var(--canon-space-0_5)}.md\:cu-my-1{margin-top:var(--canon-space-1);margin-bottom:var(--canon-space-1)}.md\:cu-my-1\.5{margin-top:var(--canon-space-1_5);margin-bottom:var(--canon-space-1_5)}.md\:cu-my-2{margin-top:var(--canon-space-2);margin-bottom:var(--canon-space-2)}.md\:cu-my-3{margin-top:var(--canon-space-3);margin-bottom:var(--canon-space-3)}.md\:cu-my-4{margin-top:var(--canon-space-4);margin-bottom:var(--canon-space-4)}.md\:cu-my-5{margin-top:var(--canon-space-5);margin-bottom:var(--canon-space-5)}.md\:cu-my-6{margin-top:var(--canon-space-6);margin-bottom:var(--canon-space-6)}.md\:cu-my-7{margin-top:var(--canon-space-7);margin-bottom:var(--canon-space-7)}.md\:cu-my-8{margin-top:var(--canon-space-8);margin-bottom:var(--canon-space-8)}.md\:cu-my-9{margin-top:var(--canon-space-9);margin-bottom:var(--canon-space-9)}.md\:cu-my-10{margin-top:var(--canon-space-10);margin-bottom:var(--canon-space-10)}.md\:cu-my-11{margin-top:var(--canon-space-11);margin-bottom:var(--canon-space-11)}.md\:cu-my-12{margin-top:var(--canon-space-12);margin-bottom:var(--canon-space-12)}.md\:cu-my-13{margin-top:var(--canon-space-13);margin-bottom:var(--canon-space-13)}.md\:cu-my-14{margin-top:var(--canon-space-14);margin-bottom:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-my{margin-top:var(--py-lg);margin-bottom:var(--py-lg)}.lg\:cu-my-0\.5{margin-top:var(--canon-space-0_5);margin-bottom:var(--canon-space-0_5)}.lg\:cu-my-1{margin-top:var(--canon-space-1);margin-bottom:var(--canon-space-1)}.lg\:cu-my-1\.5{margin-top:var(--canon-space-1_5);margin-bottom:var(--canon-space-1_5)}.lg\:cu-my-2{margin-top:var(--canon-space-2);margin-bottom:var(--canon-space-2)}.lg\:cu-my-3{margin-top:var(--canon-space-3);margin-bottom:var(--canon-space-3)}.lg\:cu-my-4{margin-top:var(--canon-space-4);margin-bottom:var(--canon-space-4)}.lg\:cu-my-5{margin-top:var(--canon-space-5);margin-bottom:var(--canon-space-5)}.lg\:cu-my-6{margin-top:var(--canon-space-6);margin-bottom:var(--canon-space-6)}.lg\:cu-my-7{margin-top:var(--canon-space-7);margin-bottom:var(--canon-space-7)}.lg\:cu-my-8{margin-top:var(--canon-space-8);margin-bottom:var(--canon-space-8)}.lg\:cu-my-9{margin-top:var(--canon-space-9);margin-bottom:var(--canon-space-9)}.lg\:cu-my-10{margin-top:var(--canon-space-10);margin-bottom:var(--canon-space-10)}.lg\:cu-my-11{margin-top:var(--canon-space-11);margin-bottom:var(--canon-space-11)}.lg\:cu-my-12{margin-top:var(--canon-space-12);margin-bottom:var(--canon-space-12)}.lg\:cu-my-13{margin-top:var(--canon-space-13);margin-bottom:var(--canon-space-13)}.lg\:cu-my-14{margin-top:var(--canon-space-14);margin-bottom:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-my{margin-top:var(--py-xl);margin-bottom:var(--py-xl)}.xl\:cu-my-0\.5{margin-top:var(--canon-space-0_5);margin-bottom:var(--canon-space-0_5)}.xl\:cu-my-1{margin-top:var(--canon-space-1);margin-bottom:var(--canon-space-1)}.xl\:cu-my-1\.5{margin-top:var(--canon-space-1_5);margin-bottom:var(--canon-space-1_5)}.xl\:cu-my-2{margin-top:var(--canon-space-2);margin-bottom:var(--canon-space-2)}.xl\:cu-my-3{margin-top:var(--canon-space-3);margin-bottom:var(--canon-space-3)}.xl\:cu-my-4{margin-top:var(--canon-space-4);margin-bottom:var(--canon-space-4)}.xl\:cu-my-5{margin-top:var(--canon-space-5);margin-bottom:var(--canon-space-5)}.xl\:cu-my-6{margin-top:var(--canon-space-6);margin-bottom:var(--canon-space-6)}.xl\:cu-my-7{margin-top:var(--canon-space-7);margin-bottom:var(--canon-space-7)}.xl\:cu-my-8{margin-top:var(--canon-space-8);margin-bottom:var(--canon-space-8)}.xl\:cu-my-9{margin-top:var(--canon-space-9);margin-bottom:var(--canon-space-9)}.xl\:cu-my-10{margin-top:var(--canon-space-10);margin-bottom:var(--canon-space-10)}.xl\:cu-my-11{margin-top:var(--canon-space-11);margin-bottom:var(--canon-space-11)}.xl\:cu-my-12{margin-top:var(--canon-space-12);margin-bottom:var(--canon-space-12)}.xl\:cu-my-13{margin-top:var(--canon-space-13);margin-bottom:var(--canon-space-13)}.xl\:cu-my-14{margin-top:var(--canon-space-14);margin-bottom:var(--canon-space-14)}}.cu-mx{margin-left:var(--mx);margin-right:var(--mx)}.cu-mx-0\.5{margin-left:var(--canon-space-0_5);margin-right:var(--canon-space-0_5)}.cu-mx-1{margin-left:var(--canon-space-1);margin-right:var(--canon-space-1)}.cu-mx-1\.5{margin-left:var(--canon-space-1_5);margin-right:var(--canon-space-1_5)}.cu-mx-2{margin-left:var(--canon-space-2);margin-right:var(--canon-space-2)}.cu-mx-3{margin-left:var(--canon-space-3);margin-right:var(--canon-space-3)}.cu-mx-4{margin-left:var(--canon-space-4);margin-right:var(--canon-space-4)}.cu-mx-5{margin-left:var(--canon-space-5);margin-right:var(--canon-space-5)}.cu-mx-6{margin-left:var(--canon-space-6);margin-right:var(--canon-space-6)}.cu-mx-7{margin-left:var(--canon-space-7);margin-right:var(--canon-space-7)}.cu-mx-8{margin-left:var(--canon-space-8);margin-right:var(--canon-space-8)}.cu-mx-9{margin-left:var(--canon-space-9);margin-right:var(--canon-space-9)}.cu-mx-10{margin-left:var(--canon-space-10);margin-right:var(--canon-space-10)}.cu-mx-11{margin-left:var(--canon-space-11);margin-right:var(--canon-space-11)}.cu-mx-12{margin-left:var(--canon-space-12);margin-right:var(--canon-space-12)}.cu-mx-13{margin-left:var(--canon-space-13);margin-right:var(--canon-space-13)}.cu-mx-14{margin-left:var(--canon-space-14);margin-right:var(--canon-space-14)}@media (width>=640px){.xs\:cu-mx{margin-left:var(--px-xs);margin-right:var(--px-xs)}.xs\:cu-mx-0\.5{margin-left:var(--canon-space-0_5);margin-right:var(--canon-space-0_5)}.xs\:cu-mx-1{margin-left:var(--canon-space-1);margin-right:var(--canon-space-1)}.xs\:cu-mx-1\.5{margin-left:var(--canon-space-1_5);margin-right:var(--canon-space-1_5)}.xs\:cu-mx-2{margin-left:var(--canon-space-2);margin-right:var(--canon-space-2)}.xs\:cu-mx-3{margin-left:var(--canon-space-3);margin-right:var(--canon-space-3)}.xs\:cu-mx-4{margin-left:var(--canon-space-4);margin-right:var(--canon-space-4)}.xs\:cu-mx-5{margin-left:var(--canon-space-5);margin-right:var(--canon-space-5)}.xs\:cu-mx-6{margin-left:var(--canon-space-6);margin-right:var(--canon-space-6)}.xs\:cu-mx-7{margin-left:var(--canon-space-7);margin-right:var(--canon-space-7)}.xs\:cu-mx-8{margin-left:var(--canon-space-8);margin-right:var(--canon-space-8)}.xs\:cu-mx-9{margin-left:var(--canon-space-9);margin-right:var(--canon-space-9)}.xs\:cu-mx-10{margin-left:var(--canon-space-10);margin-right:var(--canon-space-10)}.xs\:cu-mx-11{margin-left:var(--canon-space-11);margin-right:var(--canon-space-11)}.xs\:cu-mx-12{margin-left:var(--canon-space-12);margin-right:var(--canon-space-12)}.xs\:cu-mx-13{margin-left:var(--canon-space-13);margin-right:var(--canon-space-13)}.xs\:cu-mx-14{margin-left:var(--canon-space-14);margin-right:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-mx{margin-left:var(--px-sm);margin-right:var(--px-sm)}.sm\:cu-mx-0\.5{margin-left:var(--canon-space-0_5);margin-right:var(--canon-space-0_5)}.sm\:cu-mx-1{margin-left:var(--canon-space-1);margin-right:var(--canon-space-1)}.sm\:cu-mx-1\.5{margin-left:var(--canon-space-1_5);margin-right:var(--canon-space-1_5)}.sm\:cu-mx-2{margin-left:var(--canon-space-2);margin-right:var(--canon-space-2)}.sm\:cu-mx-3{margin-left:var(--canon-space-3);margin-right:var(--canon-space-3)}.sm\:cu-mx-4{margin-left:var(--canon-space-4);margin-right:var(--canon-space-4)}.sm\:cu-mx-5{margin-left:var(--canon-space-5);margin-right:var(--canon-space-5)}.sm\:cu-mx-6{margin-left:var(--canon-space-6);margin-right:var(--canon-space-6)}.sm\:cu-mx-7{margin-left:var(--canon-space-7);margin-right:var(--canon-space-7)}.sm\:cu-mx-8{margin-left:var(--canon-space-8);margin-right:var(--canon-space-8)}.sm\:cu-mx-9{margin-left:var(--canon-space-9);margin-right:var(--canon-space-9)}.sm\:cu-mx-10{margin-left:var(--canon-space-10);margin-right:var(--canon-space-10)}.sm\:cu-mx-11{margin-left:var(--canon-space-11);margin-right:var(--canon-space-11)}.sm\:cu-mx-12{margin-left:var(--canon-space-12);margin-right:var(--canon-space-12)}.sm\:cu-mx-13{margin-left:var(--canon-space-13);margin-right:var(--canon-space-13)}.sm\:cu-mx-14{margin-left:var(--canon-space-14);margin-right:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-mx{margin-left:var(--px-md);margin-right:var(--px-md)}.md\:cu-mx-0\.5{margin-left:var(--canon-space-0_5);margin-right:var(--canon-space-0_5)}.md\:cu-mx-1{margin-left:var(--canon-space-1);margin-right:var(--canon-space-1)}.md\:cu-mx-1\.5{margin-left:var(--canon-space-1_5);margin-right:var(--canon-space-1_5)}.md\:cu-mx-2{margin-left:var(--canon-space-2);margin-right:var(--canon-space-2)}.md\:cu-mx-3{margin-left:var(--canon-space-3);margin-right:var(--canon-space-3)}.md\:cu-mx-4{margin-left:var(--canon-space-4);margin-right:var(--canon-space-4)}.md\:cu-mx-5{margin-left:var(--canon-space-5);margin-right:var(--canon-space-5)}.md\:cu-mx-6{margin-left:var(--canon-space-6);margin-right:var(--canon-space-6)}.md\:cu-mx-7{margin-left:var(--canon-space-7);margin-right:var(--canon-space-7)}.md\:cu-mx-8{margin-left:var(--canon-space-8);margin-right:var(--canon-space-8)}.md\:cu-mx-9{margin-left:var(--canon-space-9);margin-right:var(--canon-space-9)}.md\:cu-mx-10{margin-left:var(--canon-space-10);margin-right:var(--canon-space-10)}.md\:cu-mx-11{margin-left:var(--canon-space-11);margin-right:var(--canon-space-11)}.md\:cu-mx-12{margin-left:var(--canon-space-12);margin-right:var(--canon-space-12)}.md\:cu-mx-13{margin-left:var(--canon-space-13);margin-right:var(--canon-space-13)}.md\:cu-mx-14{margin-left:var(--canon-space-14);margin-right:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-mx{margin-left:var(--px-lg);margin-right:var(--px-lg)}.lg\:cu-mx-0\.5{margin-left:var(--canon-space-0_5);margin-right:var(--canon-space-0_5)}.lg\:cu-mx-1{margin-left:var(--canon-space-1);margin-right:var(--canon-space-1)}.lg\:cu-mx-1\.5{margin-left:var(--canon-space-1_5);margin-right:var(--canon-space-1_5)}.lg\:cu-mx-2{margin-left:var(--canon-space-2);margin-right:var(--canon-space-2)}.lg\:cu-mx-3{margin-left:var(--canon-space-3);margin-right:var(--canon-space-3)}.lg\:cu-mx-4{margin-left:var(--canon-space-4);margin-right:var(--canon-space-4)}.lg\:cu-mx-5{margin-left:var(--canon-space-5);margin-right:var(--canon-space-5)}.lg\:cu-mx-6{margin-left:var(--canon-space-6);margin-right:var(--canon-space-6)}.lg\:cu-mx-7{margin-left:var(--canon-space-7);margin-right:var(--canon-space-7)}.lg\:cu-mx-8{margin-left:var(--canon-space-8);margin-right:var(--canon-space-8)}.lg\:cu-mx-9{margin-left:var(--canon-space-9);margin-right:var(--canon-space-9)}.lg\:cu-mx-10{margin-left:var(--canon-space-10);margin-right:var(--canon-space-10)}.lg\:cu-mx-11{margin-left:var(--canon-space-11);margin-right:var(--canon-space-11)}.lg\:cu-mx-12{margin-left:var(--canon-space-12);margin-right:var(--canon-space-12)}.lg\:cu-mx-13{margin-left:var(--canon-space-13);margin-right:var(--canon-space-13)}.lg\:cu-mx-14{margin-left:var(--canon-space-14);margin-right:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-mx{margin-left:var(--px-xl);margin-right:var(--px-xl)}.xl\:cu-mx-0\.5{margin-left:var(--canon-space-0_5);margin-right:var(--canon-space-0_5)}.xl\:cu-mx-1{margin-left:var(--canon-space-1);margin-right:var(--canon-space-1)}.xl\:cu-mx-1\.5{margin-left:var(--canon-space-1_5);margin-right:var(--canon-space-1_5)}.xl\:cu-mx-2{margin-left:var(--canon-space-2);margin-right:var(--canon-space-2)}.xl\:cu-mx-3{margin-left:var(--canon-space-3);margin-right:var(--canon-space-3)}.xl\:cu-mx-4{margin-left:var(--canon-space-4);margin-right:var(--canon-space-4)}.xl\:cu-mx-5{margin-left:var(--canon-space-5);margin-right:var(--canon-space-5)}.xl\:cu-mx-6{margin-left:var(--canon-space-6);margin-right:var(--canon-space-6)}.xl\:cu-mx-7{margin-left:var(--canon-space-7);margin-right:var(--canon-space-7)}.xl\:cu-mx-8{margin-left:var(--canon-space-8);margin-right:var(--canon-space-8)}.xl\:cu-mx-9{margin-left:var(--canon-space-9);margin-right:var(--canon-space-9)}.xl\:cu-mx-10{margin-left:var(--canon-space-10);margin-right:var(--canon-space-10)}.xl\:cu-mx-11{margin-left:var(--canon-space-11);margin-right:var(--canon-space-11)}.xl\:cu-mx-12{margin-left:var(--canon-space-12);margin-right:var(--canon-space-12)}.xl\:cu-mx-13{margin-left:var(--canon-space-13);margin-right:var(--canon-space-13)}.xl\:cu-mx-14{margin-left:var(--canon-space-14);margin-right:var(--canon-space-14)}}.cu-display-none{display:none}.cu-display-inline{display:inline}.cu-display-inline-block{display:inline-block}.cu-display-block{display:block}@media (width>=640px){.xs\:cu-display-none{display:none}.xs\:cu-display-inline{display:inline}.xs\:cu-display-inline-block{display:inline-block}.xs\:cu-display-block{display:block}}@media (width>=768px){.sm\:cu-display-none{display:none}.sm\:cu-display-inline{display:inline}.sm\:cu-display-inline-block{display:inline-block}.sm\:cu-display-block{display:block}}@media (width>=1024px){.md\:cu-display-none{display:none}.md\:cu-display-inline{display:inline}.md\:cu-display-inline-block{display:inline-block}.md\:cu-display-block{display:block}}@media (width>=1280px){.lg\:cu-display-none{display:none}.lg\:cu-display-inline{display:inline}.lg\:cu-display-inline-block{display:inline-block}.lg\:cu-display-block{display:block}}@media (width>=1536px){.xl\:cu-display-none{display:none}.xl\:cu-display-inline{display:inline}.xl\:cu-display-inline-block{display:inline-block}.xl\:cu-display-block{display:block}}.cu-w{width:var(--width)}.cu-min-w{min-width:var(--min-width)}.cu-max-w{max-width:var(--max-width)}@media (width>=640px){.xs\:cu-w{width:var(--width)}.xs\:cu-min-w{min-width:var(--min-width)}.xs\:cu-max-w{max-width:var(--max-width)}}@media (width>=768px){.sm\:cu-w{width:var(--width)}.sm\:cu-min-w{min-width:var(--min-width)}.sm\:cu-max-w{max-width:var(--max-width)}}@media (width>=1024px){.md\:cu-w{width:var(--width)}.md\:cu-min-w{min-width:var(--min-width)}.md\:cu-max-w{max-width:var(--max-width)}}@media (width>=1280px){.lg\:cu-w{width:var(--width)}.lg\:cu-min-w{min-width:var(--min-width)}.lg\:cu-max-w{max-width:var(--max-width)}}@media (width>=1536px){.xl\:cu-w{width:var(--width)}.xl\:cu-min-w{min-width:var(--min-width)}.xl\:cu-max-w{max-width:var(--max-width)}}.cu-h{height:var(--height)}.cu-min-h{min-height:var(--min-height)}.cu-max-h{max-height:var(--max-height)}@media (width>=640px){.xs\:cu-h{height:var(--height)}.xs\:cu-min-h{min-height:var(--min-height)}.xs\:cu-max-h{max-height:var(--max-height)}}@media (width>=768px){.sm\:cu-h{height:var(--height)}.sm\:cu-min-h{min-height:var(--min-height)}.sm\:cu-max-h{max-height:var(--max-height)}}@media (width>=1024px){.md\:cu-h{height:var(--height)}.md\:cu-min-h{min-height:var(--min-height)}.md\:cu-max-h{max-height:var(--max-height)}}@media (width>=1280px){.lg\:cu-h{height:var(--height)}.lg\:cu-min-h{min-height:var(--min-height)}.lg\:cu-max-h{max-height:var(--max-height)}}@media (width>=1536px){.xl\:cu-h{height:var(--height)}.xl\:cu-min-h{min-height:var(--min-height)}.xl\:cu-max-h{max-height:var(--max-height)}}.cu-position-absolute{position:absolute}.cu-position-fixed{position:fixed}.cu-position-sticky{position:sticky}.cu-position-relative{position:relative}.cu-position-static{position:static}@media (width>=640px){.xs\:cu-position-absolute{position:absolute}.xs\:cu-position-fixed{position:fixed}.xs\:cu-position-sticky{position:sticky}.xs\:cu-position-relative{position:relative}.xs\:cu-position-static{position:static}}@media (width>=768px){.sm\:cu-position-absolute{position:absolute}.sm\:cu-position-fixed{position:fixed}.sm\:cu-position-sticky{position:sticky}.sm\:cu-position-relative{position:relative}.sm\:cu-position-static{position:static}}@media (width>=1024px){.md\:cu-position-absolute{position:absolute}.md\:cu-position-fixed{position:fixed}.md\:cu-position-sticky{position:sticky}.md\:cu-position-relative{position:relative}.md\:cu-position-static{position:static}}@media (width>=1280px){.lg\:cu-position-absolute{position:absolute}.lg\:cu-position-fixed{position:fixed}.lg\:cu-position-sticky{position:sticky}.lg\:cu-position-relative{position:relative}.lg\:cu-position-static{position:static}}@media (width>=1536px){.xl\:cu-position-absolute{position:absolute}.xl\:cu-position-fixed{position:fixed}.xl\:cu-position-sticky{position:sticky}.xl\:cu-position-relative{position:relative}.xl\:cu-position-static{position:static}}.cu-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}.cu-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.cu-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.cu-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.cu-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}.cu-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}.cu-columns-7{grid-template-columns:repeat(7,minmax(0,1fr))}.cu-columns-8{grid-template-columns:repeat(8,minmax(0,1fr))}.cu-columns-9{grid-template-columns:repeat(9,minmax(0,1fr))}.cu-columns-10{grid-template-columns:repeat(10,minmax(0,1fr))}.cu-columns-11{grid-template-columns:repeat(11,minmax(0,1fr))}.cu-columns-12{grid-template-columns:repeat(12,minmax(0,1fr))}.cu-columns-auto{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.cu-col-span-1{grid-column:span 1/span 1}.cu-col-span-2{grid-column:span 2/span 2}.cu-col-span-3{grid-column:span 3/span 3}.cu-col-span-4{grid-column:span 4/span 4}.cu-col-span-5{grid-column:span 5/span 5}.cu-col-span-6{grid-column:span 6/span 6}.cu-col-span-7{grid-column:span 7/span 7}.cu-col-span-8{grid-column:span 8/span 8}.cu-col-span-9{grid-column:span 9/span 9}.cu-col-span-10{grid-column:span 10/span 10}.cu-col-span-11{grid-column:span 11/span 11}.cu-col-span-12{grid-column:span 12/span 12}.cu-col-span-auto{grid-column:span auto/span auto}.cu-col-start-1{grid-column-start:1}.cu-col-start-2{grid-column-start:2}.cu-col-start-3{grid-column-start:3}.cu-col-start-4{grid-column-start:4}.cu-col-start-5{grid-column-start:5}.cu-col-start-6{grid-column-start:6}.cu-col-start-7{grid-column-start:7}.cu-col-start-8{grid-column-start:8}.cu-col-start-9{grid-column-start:9}.cu-col-start-10{grid-column-start:10}.cu-col-start-11{grid-column-start:11}.cu-col-start-12{grid-column-start:12}.cu-col-start-13{grid-column-start:13}.cu-col-start-auto{grid-column-start:auto}.cu-col-end-1{grid-column-end:1}.cu-col-end-2{grid-column-end:2}.cu-col-end-3{grid-column-end:3}.cu-col-end-4{grid-column-end:4}.cu-col-end-5{grid-column-end:5}.cu-col-end-6{grid-column-end:6}.cu-col-end-7{grid-column-end:7}.cu-col-end-8{grid-column-end:8}.cu-col-end-9{grid-column-end:9}.cu-col-end-10{grid-column-end:10}.cu-col-end-11{grid-column-end:11}.cu-col-end-12{grid-column-end:12}.cu-col-end-13{grid-column-end:13}.cu-col-end-auto{grid-column-end:auto}.cu-row-span-1{grid-row:span 1/span 1}.cu-row-span-2{grid-row:span 2/span 2}.cu-row-span-3{grid-row:span 3/span 3}.cu-row-span-4{grid-row:span 4/span 4}.cu-row-span-5{grid-row:span 5/span 5}.cu-row-span-6{grid-row:span 6/span 6}.cu-row-span-7{grid-row:span 7/span 7}.cu-row-span-8{grid-row:span 8/span 8}.cu-row-span-9{grid-row:span 9/span 9}.cu-row-span-10{grid-row:span 10/span 10}.cu-row-span-11{grid-row:span 11/span 11}.cu-row-span-12{grid-row:span 12/span 12}.cu-row-span-auto{grid-row:span auto/span auto}@media (width>=640px){.xs\:cu-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}.xs\:cu-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.xs\:cu-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xs\:cu-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xs\:cu-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xs\:cu-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xs\:cu-columns-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xs\:cu-columns-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xs\:cu-columns-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xs\:cu-columns-10{grid-template-columns:repeat(10,minmax(0,1fr))}.xs\:cu-columns-11{grid-template-columns:repeat(11,minmax(0,1fr))}.xs\:cu-columns-12{grid-template-columns:repeat(12,minmax(0,1fr))}.xs\:cu-columns-auto{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.xs\:cu-col-span-1{grid-column:span 1/span 1}.xs\:cu-col-span-2{grid-column:span 2/span 2}.xs\:cu-col-span-3{grid-column:span 3/span 3}.xs\:cu-col-span-4{grid-column:span 4/span 4}.xs\:cu-col-span-5{grid-column:span 5/span 5}.xs\:cu-col-span-6{grid-column:span 6/span 6}.xs\:cu-col-span-7{grid-column:span 7/span 7}.xs\:cu-col-span-8{grid-column:span 8/span 8}.xs\:cu-col-span-9{grid-column:span 9/span 9}.xs\:cu-col-span-10{grid-column:span 10/span 10}.xs\:cu-col-span-11{grid-column:span 11/span 11}.xs\:cu-col-span-12{grid-column:span 12/span 12}.xs\:cu-col-span-auto{grid-column:span auto/span auto}.xs\:cu-col-start-1{grid-column-start:1}.xs\:cu-col-start-2{grid-column-start:2}.xs\:cu-col-start-3{grid-column-start:3}.xs\:cu-col-start-4{grid-column-start:4}.xs\:cu-col-start-5{grid-column-start:5}.xs\:cu-col-start-6{grid-column-start:6}.xs\:cu-col-start-7{grid-column-start:7}.xs\:cu-col-start-8{grid-column-start:8}.xs\:cu-col-start-9{grid-column-start:9}.xs\:cu-col-start-10{grid-column-start:10}.xs\:cu-col-start-11{grid-column-start:11}.xs\:cu-col-start-12{grid-column-start:12}.xs\:cu-col-start-13{grid-column-start:13}.xs\:cu-col-start-auto{grid-column-start:auto}.xs\:cu-col-end-1{grid-column-end:1}.xs\:cu-col-end-2{grid-column-end:2}.xs\:cu-col-end-3{grid-column-end:3}.xs\:cu-col-end-4{grid-column-end:4}.xs\:cu-col-end-5{grid-column-end:5}.xs\:cu-col-end-6{grid-column-end:6}.xs\:cu-col-end-7{grid-column-end:7}.xs\:cu-col-end-8{grid-column-end:8}.xs\:cu-col-end-9{grid-column-end:9}.xs\:cu-col-end-10{grid-column-end:10}.xs\:cu-col-end-11{grid-column-end:11}.xs\:cu-col-end-12{grid-column-end:12}.xs\:cu-col-end-13{grid-column-end:13}.xs\:cu-col-end-auto{grid-column-end:auto}.xs\:cu-row-span-1{grid-row:span 1/span 1}.xs\:cu-row-span-2{grid-row:span 2/span 2}.xs\:cu-row-span-3{grid-row:span 3/span 3}.xs\:cu-row-span-4{grid-row:span 4/span 4}.xs\:cu-row-span-5{grid-row:span 5/span 5}.xs\:cu-row-span-6{grid-row:span 6/span 6}.xs\:cu-row-span-7{grid-row:span 7/span 7}.xs\:cu-row-span-8{grid-row:span 8/span 8}.xs\:cu-row-span-9{grid-row:span 9/span 9}.xs\:cu-row-span-10{grid-row:span 10/span 10}.xs\:cu-row-span-11{grid-row:span 11/span 11}.xs\:cu-row-span-12{grid-row:span 12/span 12}.xs\:cu-row-span-auto{grid-row:span auto/span auto}}@media (width>=768px){.sm\:cu-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}.sm\:cu-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:cu-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:cu-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:cu-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}.sm\:cu-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}.sm\:cu-columns-7{grid-template-columns:repeat(7,minmax(0,1fr))}.sm\:cu-columns-8{grid-template-columns:repeat(8,minmax(0,1fr))}.sm\:cu-columns-9{grid-template-columns:repeat(9,minmax(0,1fr))}.sm\:cu-columns-10{grid-template-columns:repeat(10,minmax(0,1fr))}.sm\:cu-columns-11{grid-template-columns:repeat(11,minmax(0,1fr))}.sm\:cu-columns-12{grid-template-columns:repeat(12,minmax(0,1fr))}.sm\:cu-columns-auto{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.sm\:cu-col-span-1{grid-column:span 1/span 1}.sm\:cu-col-span-2{grid-column:span 2/span 2}.sm\:cu-col-span-3{grid-column:span 3/span 3}.sm\:cu-col-span-4{grid-column:span 4/span 4}.sm\:cu-col-span-5{grid-column:span 5/span 5}.sm\:cu-col-span-6{grid-column:span 6/span 6}.sm\:cu-col-span-7{grid-column:span 7/span 7}.sm\:cu-col-span-8{grid-column:span 8/span 8}.sm\:cu-col-span-9{grid-column:span 9/span 9}.sm\:cu-col-span-10{grid-column:span 10/span 10}.sm\:cu-col-span-11{grid-column:span 11/span 11}.sm\:cu-col-span-12{grid-column:span 12/span 12}.sm\:cu-col-span-auto{grid-column:span auto/span auto}.sm\:cu-col-start-1{grid-column-start:1}.sm\:cu-col-start-2{grid-column-start:2}.sm\:cu-col-start-3{grid-column-start:3}.sm\:cu-col-start-4{grid-column-start:4}.sm\:cu-col-start-5{grid-column-start:5}.sm\:cu-col-start-6{grid-column-start:6}.sm\:cu-col-start-7{grid-column-start:7}.sm\:cu-col-start-8{grid-column-start:8}.sm\:cu-col-start-9{grid-column-start:9}.sm\:cu-col-start-10{grid-column-start:10}.sm\:cu-col-start-11{grid-column-start:11}.sm\:cu-col-start-12{grid-column-start:12}.sm\:cu-col-start-13{grid-column-start:13}.sm\:cu-col-start-auto{grid-column-start:auto}.sm\:cu-col-end-1{grid-column-end:1}.sm\:cu-col-end-2{grid-column-end:2}.sm\:cu-col-end-3{grid-column-end:3}.sm\:cu-col-end-4{grid-column-end:4}.sm\:cu-col-end-5{grid-column-end:5}.sm\:cu-col-end-6{grid-column-end:6}.sm\:cu-col-end-7{grid-column-end:7}.sm\:cu-col-end-8{grid-column-end:8}.sm\:cu-col-end-9{grid-column-end:9}.sm\:cu-col-end-10{grid-column-end:10}.sm\:cu-col-end-11{grid-column-end:11}.sm\:cu-col-end-12{grid-column-end:12}.sm\:cu-col-end-13{grid-column-end:13}.sm\:cu-col-end-auto{grid-column-end:auto}.sm\:cu-row-span-1{grid-row:span 1/span 1}.sm\:cu-row-span-2{grid-row:span 2/span 2}.sm\:cu-row-span-3{grid-row:span 3/span 3}.sm\:cu-row-span-4{grid-row:span 4/span 4}.sm\:cu-row-span-5{grid-row:span 5/span 5}.sm\:cu-row-span-6{grid-row:span 6/span 6}.sm\:cu-row-span-7{grid-row:span 7/span 7}.sm\:cu-row-span-8{grid-row:span 8/span 8}.sm\:cu-row-span-9{grid-row:span 9/span 9}.sm\:cu-row-span-10{grid-row:span 10/span 10}.sm\:cu-row-span-11{grid-row:span 11/span 11}.sm\:cu-row-span-12{grid-row:span 12/span 12}.sm\:cu-row-span-auto{grid-row:span auto/span auto}}@media (width>=1024px){.md\:cu-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}.md\:cu-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:cu-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:cu-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:cu-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:cu-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}.md\:cu-columns-7{grid-template-columns:repeat(7,minmax(0,1fr))}.md\:cu-columns-8{grid-template-columns:repeat(8,minmax(0,1fr))}.md\:cu-columns-9{grid-template-columns:repeat(9,minmax(0,1fr))}.md\:cu-columns-10{grid-template-columns:repeat(10,minmax(0,1fr))}.md\:cu-columns-11{grid-template-columns:repeat(11,minmax(0,1fr))}.md\:cu-columns-12{grid-template-columns:repeat(12,minmax(0,1fr))}.md\:cu-columns-auto{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.md\:cu-col-span-1{grid-column:span 1/span 1}.md\:cu-col-span-2{grid-column:span 2/span 2}.md\:cu-col-span-3{grid-column:span 3/span 3}.md\:cu-col-span-4{grid-column:span 4/span 4}.md\:cu-col-span-5{grid-column:span 5/span 5}.md\:cu-col-span-6{grid-column:span 6/span 6}.md\:cu-col-span-7{grid-column:span 7/span 7}.md\:cu-col-span-8{grid-column:span 8/span 8}.md\:cu-col-span-9{grid-column:span 9/span 9}.md\:cu-col-span-10{grid-column:span 10/span 10}.md\:cu-col-span-11{grid-column:span 11/span 11}.md\:cu-col-span-12{grid-column:span 12/span 12}.md\:cu-col-span-auto{grid-column:span auto/span auto}.md\:cu-col-start-1{grid-column-start:1}.md\:cu-col-start-2{grid-column-start:2}.md\:cu-col-start-3{grid-column-start:3}.md\:cu-col-start-4{grid-column-start:4}.md\:cu-col-start-5{grid-column-start:5}.md\:cu-col-start-6{grid-column-start:6}.md\:cu-col-start-7{grid-column-start:7}.md\:cu-col-start-8{grid-column-start:8}.md\:cu-col-start-9{grid-column-start:9}.md\:cu-col-start-10{grid-column-start:10}.md\:cu-col-start-11{grid-column-start:11}.md\:cu-col-start-12{grid-column-start:12}.md\:cu-col-start-13{grid-column-start:13}.md\:cu-col-start-auto{grid-column-start:auto}.md\:cu-col-end-1{grid-column-end:1}.md\:cu-col-end-2{grid-column-end:2}.md\:cu-col-end-3{grid-column-end:3}.md\:cu-col-end-4{grid-column-end:4}.md\:cu-col-end-5{grid-column-end:5}.md\:cu-col-end-6{grid-column-end:6}.md\:cu-col-end-7{grid-column-end:7}.md\:cu-col-end-8{grid-column-end:8}.md\:cu-col-end-9{grid-column-end:9}.md\:cu-col-end-10{grid-column-end:10}.md\:cu-col-end-11{grid-column-end:11}.md\:cu-col-end-12{grid-column-end:12}.md\:cu-col-end-13{grid-column-end:13}.md\:cu-col-end-auto{grid-column-end:auto}.md\:cu-row-span-1{grid-row:span 1/span 1}.md\:cu-row-span-2{grid-row:span 2/span 2}.md\:cu-row-span-3{grid-row:span 3/span 3}.md\:cu-row-span-4{grid-row:span 4/span 4}.md\:cu-row-span-5{grid-row:span 5/span 5}.md\:cu-row-span-6{grid-row:span 6/span 6}.md\:cu-row-span-7{grid-row:span 7/span 7}.md\:cu-row-span-8{grid-row:span 8/span 8}.md\:cu-row-span-9{grid-row:span 9/span 9}.md\:cu-row-span-10{grid-row:span 10/span 10}.md\:cu-row-span-11{grid-row:span 11/span 11}.md\:cu-row-span-12{grid-row:span 12/span 12}.md\:cu-row-span-auto{grid-row:span auto/span auto}}@media (width>=1280px){.lg\:cu-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}.lg\:cu-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:cu-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:cu-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:cu-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:cu-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}.lg\:cu-columns-7{grid-template-columns:repeat(7,minmax(0,1fr))}.lg\:cu-columns-8{grid-template-columns:repeat(8,minmax(0,1fr))}.lg\:cu-columns-9{grid-template-columns:repeat(9,minmax(0,1fr))}.lg\:cu-columns-10{grid-template-columns:repeat(10,minmax(0,1fr))}.lg\:cu-columns-11{grid-template-columns:repeat(11,minmax(0,1fr))}.lg\:cu-columns-12{grid-template-columns:repeat(12,minmax(0,1fr))}.lg\:cu-columns-auto{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.lg\:cu-col-span-1{grid-column:span 1/span 1}.lg\:cu-col-span-2{grid-column:span 2/span 2}.lg\:cu-col-span-3{grid-column:span 3/span 3}.lg\:cu-col-span-4{grid-column:span 4/span 4}.lg\:cu-col-span-5{grid-column:span 5/span 5}.lg\:cu-col-span-6{grid-column:span 6/span 6}.lg\:cu-col-span-7{grid-column:span 7/span 7}.lg\:cu-col-span-8{grid-column:span 8/span 8}.lg\:cu-col-span-9{grid-column:span 9/span 9}.lg\:cu-col-span-10{grid-column:span 10/span 10}.lg\:cu-col-span-11{grid-column:span 11/span 11}.lg\:cu-col-span-12{grid-column:span 12/span 12}.lg\:cu-col-span-auto{grid-column:span auto/span auto}.lg\:cu-col-start-1{grid-column-start:1}.lg\:cu-col-start-2{grid-column-start:2}.lg\:cu-col-start-3{grid-column-start:3}.lg\:cu-col-start-4{grid-column-start:4}.lg\:cu-col-start-5{grid-column-start:5}.lg\:cu-col-start-6{grid-column-start:6}.lg\:cu-col-start-7{grid-column-start:7}.lg\:cu-col-start-8{grid-column-start:8}.lg\:cu-col-start-9{grid-column-start:9}.lg\:cu-col-start-10{grid-column-start:10}.lg\:cu-col-start-11{grid-column-start:11}.lg\:cu-col-start-12{grid-column-start:12}.lg\:cu-col-start-13{grid-column-start:13}.lg\:cu-col-start-auto{grid-column-start:auto}.lg\:cu-col-end-1{grid-column-end:1}.lg\:cu-col-end-2{grid-column-end:2}.lg\:cu-col-end-3{grid-column-end:3}.lg\:cu-col-end-4{grid-column-end:4}.lg\:cu-col-end-5{grid-column-end:5}.lg\:cu-col-end-6{grid-column-end:6}.lg\:cu-col-end-7{grid-column-end:7}.lg\:cu-col-end-8{grid-column-end:8}.lg\:cu-col-end-9{grid-column-end:9}.lg\:cu-col-end-10{grid-column-end:10}.lg\:cu-col-end-11{grid-column-end:11}.lg\:cu-col-end-12{grid-column-end:12}.lg\:cu-col-end-13{grid-column-end:13}.lg\:cu-col-end-auto{grid-column-end:auto}.lg\:cu-row-span-1{grid-row:span 1/span 1}.lg\:cu-row-span-2{grid-row:span 2/span 2}.lg\:cu-row-span-3{grid-row:span 3/span 3}.lg\:cu-row-span-4{grid-row:span 4/span 4}.lg\:cu-row-span-5{grid-row:span 5/span 5}.lg\:cu-row-span-6{grid-row:span 6/span 6}.lg\:cu-row-span-7{grid-row:span 7/span 7}.lg\:cu-row-span-8{grid-row:span 8/span 8}.lg\:cu-row-span-9{grid-row:span 9/span 9}.lg\:cu-row-span-10{grid-row:span 10/span 10}.lg\:cu-row-span-11{grid-row:span 11/span 11}.lg\:cu-row-span-12{grid-row:span 12/span 12}.lg\:cu-row-span-auto{grid-row:span auto/span auto}}@media (width>=1536px){.xl\:cu-columns-1{grid-template-columns:repeat(1,minmax(0,1fr))}.xl\:cu-columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}.xl\:cu-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}.xl\:cu-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.xl\:cu-columns-5{grid-template-columns:repeat(5,minmax(0,1fr))}.xl\:cu-columns-6{grid-template-columns:repeat(6,minmax(0,1fr))}.xl\:cu-columns-7{grid-template-columns:repeat(7,minmax(0,1fr))}.xl\:cu-columns-8{grid-template-columns:repeat(8,minmax(0,1fr))}.xl\:cu-columns-9{grid-template-columns:repeat(9,minmax(0,1fr))}.xl\:cu-columns-10{grid-template-columns:repeat(10,minmax(0,1fr))}.xl\:cu-columns-11{grid-template-columns:repeat(11,minmax(0,1fr))}.xl\:cu-columns-12{grid-template-columns:repeat(12,minmax(0,1fr))}.xl\:cu-columns-auto{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}.xl\:cu-col-span-1{grid-column:span 1/span 1}.xl\:cu-col-span-2{grid-column:span 2/span 2}.xl\:cu-col-span-3{grid-column:span 3/span 3}.xl\:cu-col-span-4{grid-column:span 4/span 4}.xl\:cu-col-span-5{grid-column:span 5/span 5}.xl\:cu-col-span-6{grid-column:span 6/span 6}.xl\:cu-col-span-7{grid-column:span 7/span 7}.xl\:cu-col-span-8{grid-column:span 8/span 8}.xl\:cu-col-span-9{grid-column:span 9/span 9}.xl\:cu-col-span-10{grid-column:span 10/span 10}.xl\:cu-col-span-11{grid-column:span 11/span 11}.xl\:cu-col-span-12{grid-column:span 12/span 12}.xl\:cu-col-span-auto{grid-column:span auto/span auto}.xl\:cu-col-start-1{grid-column-start:1}.xl\:cu-col-start-2{grid-column-start:2}.xl\:cu-col-start-3{grid-column-start:3}.xl\:cu-col-start-4{grid-column-start:4}.xl\:cu-col-start-5{grid-column-start:5}.xl\:cu-col-start-6{grid-column-start:6}.xl\:cu-col-start-7{grid-column-start:7}.xl\:cu-col-start-8{grid-column-start:8}.xl\:cu-col-start-9{grid-column-start:9}.xl\:cu-col-start-10{grid-column-start:10}.xl\:cu-col-start-11{grid-column-start:11}.xl\:cu-col-start-12{grid-column-start:12}.xl\:cu-col-start-13{grid-column-start:13}.xl\:cu-col-start-auto{grid-column-start:auto}.xl\:cu-col-end-1{grid-column-end:1}.xl\:cu-col-end-2{grid-column-end:2}.xl\:cu-col-end-3{grid-column-end:3}.xl\:cu-col-end-4{grid-column-end:4}.xl\:cu-col-end-5{grid-column-end:5}.xl\:cu-col-end-6{grid-column-end:6}.xl\:cu-col-end-7{grid-column-end:7}.xl\:cu-col-end-8{grid-column-end:8}.xl\:cu-col-end-9{grid-column-end:9}.xl\:cu-col-end-10{grid-column-end:10}.xl\:cu-col-end-11{grid-column-end:11}.xl\:cu-col-end-12{grid-column-end:12}.xl\:cu-col-end-13{grid-column-end:13}.xl\:cu-col-end-auto{grid-column-end:auto}.xl\:cu-row-span-1{grid-row:span 1/span 1}.xl\:cu-row-span-2{grid-row:span 2/span 2}.xl\:cu-row-span-3{grid-row:span 3/span 3}.xl\:cu-row-span-4{grid-row:span 4/span 4}.xl\:cu-row-span-5{grid-row:span 5/span 5}.xl\:cu-row-span-6{grid-row:span 6/span 6}.xl\:cu-row-span-7{grid-row:span 7/span 7}.xl\:cu-row-span-8{grid-row:span 8/span 8}.xl\:cu-row-span-9{grid-row:span 9/span 9}.xl\:cu-row-span-10{grid-row:span 10/span 10}.xl\:cu-row-span-11{grid-row:span 11/span 11}.xl\:cu-row-span-12{grid-row:span 12/span 12}.xl\:cu-row-span-auto{grid-row:span auto/span auto}}.cu-gap{gap:var(--gap)}.cu-gap-0\.5{gap:var(--canon-space-0_5)}.cu-gap-1{gap:var(--canon-space-1)}.cu-gap-1\.5{gap:var(--canon-space-1_5)}.cu-gap-2{gap:var(--canon-space-2)}.cu-gap-3{gap:var(--canon-space-3)}.cu-gap-4{gap:var(--canon-space-4)}.cu-gap-5{gap:var(--canon-space-5)}.cu-gap-6{gap:var(--canon-space-6)}.cu-gap-7{gap:var(--canon-space-7)}.cu-gap-8{gap:var(--canon-space-8)}.cu-gap-9{gap:var(--canon-space-9)}.cu-gap-10{gap:var(--canon-space-10)}.cu-gap-11{gap:var(--canon-space-11)}.cu-gap-12{gap:var(--canon-space-12)}.cu-gap-13{gap:var(--canon-space-13)}.cu-gap-14{gap:var(--canon-space-14)}@media (width>=640px){.xs\:cu-gap{gap:var(--gap-xs)}.xs\:cu-gap-0\.5{gap:var(--canon-space-0_5)}.xs\:cu-gap-1{gap:var(--canon-space-1)}.xs\:cu-gap-1\.5{gap:var(--canon-space-1_5)}.xs\:cu-gap-2{gap:var(--canon-space-2)}.xs\:cu-gap-3{gap:var(--canon-space-3)}.xs\:cu-gap-4{gap:var(--canon-space-4)}.xs\:cu-gap-5{gap:var(--canon-space-5)}.xs\:cu-gap-6{gap:var(--canon-space-6)}.xs\:cu-gap-7{gap:var(--canon-space-7)}.xs\:cu-gap-8{gap:var(--canon-space-8)}.xs\:cu-gap-9{gap:var(--canon-space-9)}.xs\:cu-gap-10{gap:var(--canon-space-10)}.xs\:cu-gap-11{gap:var(--canon-space-11)}.xs\:cu-gap-12{gap:var(--canon-space-12)}.xs\:cu-gap-13{gap:var(--canon-space-13)}.xs\:cu-gap-14{gap:var(--canon-space-14)}}@media (width>=768px){.sm\:cu-gap{gap:var(--gap-sm)}.sm\:cu-gap-0\.5{gap:var(--canon-space-0_5)}.sm\:cu-gap-1{gap:var(--canon-space-1)}.sm\:cu-gap-1\.5{gap:var(--canon-space-1_5)}.sm\:cu-gap-2{gap:var(--canon-space-2)}.sm\:cu-gap-3{gap:var(--canon-space-3)}.sm\:cu-gap-4{gap:var(--canon-space-4)}.sm\:cu-gap-5{gap:var(--canon-space-5)}.sm\:cu-gap-6{gap:var(--canon-space-6)}.sm\:cu-gap-7{gap:var(--canon-space-7)}.sm\:cu-gap-8{gap:var(--canon-space-8)}.sm\:cu-gap-9{gap:var(--canon-space-9)}.sm\:cu-gap-10{gap:var(--canon-space-10)}.sm\:cu-gap-11{gap:var(--canon-space-11)}.sm\:cu-gap-12{gap:var(--canon-space-12)}.sm\:cu-gap-13{gap:var(--canon-space-13)}.sm\:cu-gap-14{gap:var(--canon-space-14)}}@media (width>=1024px){.md\:cu-gap{gap:var(--gap-md)}.md\:cu-gap-0\.5{gap:var(--canon-space-0_5)}.md\:cu-gap-1{gap:var(--canon-space-1)}.md\:cu-gap-1\.5{gap:var(--canon-space-1_5)}.md\:cu-gap-2{gap:var(--canon-space-2)}.md\:cu-gap-3{gap:var(--canon-space-3)}.md\:cu-gap-4{gap:var(--canon-space-4)}.md\:cu-gap-5{gap:var(--canon-space-5)}.md\:cu-gap-6{gap:var(--canon-space-6)}.md\:cu-gap-7{gap:var(--canon-space-7)}.md\:cu-gap-8{gap:var(--canon-space-8)}.md\:cu-gap-9{gap:var(--canon-space-9)}.md\:cu-gap-10{gap:var(--canon-space-10)}.md\:cu-gap-11{gap:var(--canon-space-11)}.md\:cu-gap-12{gap:var(--canon-space-12)}.md\:cu-gap-13{gap:var(--canon-space-13)}.md\:cu-gap-14{gap:var(--canon-space-14)}}@media (width>=1280px){.lg\:cu-gap{gap:var(--gap-lg)}.lg\:cu-gap-0\.5{gap:var(--canon-space-0_5)}.lg\:cu-gap-1{gap:var(--canon-space-1)}.lg\:cu-gap-1\.5{gap:var(--canon-space-1_5)}.lg\:cu-gap-2{gap:var(--canon-space-2)}.lg\:cu-gap-3{gap:var(--canon-space-3)}.lg\:cu-gap-4{gap:var(--canon-space-4)}.lg\:cu-gap-5{gap:var(--canon-space-5)}.lg\:cu-gap-6{gap:var(--canon-space-6)}.lg\:cu-gap-7{gap:var(--canon-space-7)}.lg\:cu-gap-8{gap:var(--canon-space-8)}.lg\:cu-gap-9{gap:var(--canon-space-9)}.lg\:cu-gap-10{gap:var(--canon-space-10)}.lg\:cu-gap-11{gap:var(--canon-space-11)}.lg\:cu-gap-12{gap:var(--canon-space-12)}.lg\:cu-gap-13{gap:var(--canon-space-13)}.lg\:cu-gap-14{gap:var(--canon-space-14)}}@media (width>=1536px){.xl\:cu-gap{gap:var(--gap-xl)}.xl\:cu-gap-0\.5{gap:var(--canon-space-0_5)}.xl\:cu-gap-1{gap:var(--canon-space-1)}.xl\:cu-gap-1\.5{gap:var(--canon-space-1_5)}.xl\:cu-gap-2{gap:var(--canon-space-2)}.xl\:cu-gap-3{gap:var(--canon-space-3)}.xl\:cu-gap-4{gap:var(--canon-space-4)}.xl\:cu-gap-5{gap:var(--canon-space-5)}.xl\:cu-gap-6{gap:var(--canon-space-6)}.xl\:cu-gap-7{gap:var(--canon-space-7)}.xl\:cu-gap-8{gap:var(--canon-space-8)}.xl\:cu-gap-9{gap:var(--canon-space-9)}.xl\:cu-gap-10{gap:var(--canon-space-10)}.xl\:cu-gap-11{gap:var(--canon-space-11)}.xl\:cu-gap-12{gap:var(--canon-space-12)}.xl\:cu-gap-13{gap:var(--canon-space-13)}.xl\:cu-gap-14{gap:var(--canon-space-14)}}.cu-align-start{align-items:start}.cu-align-center{align-items:center}.cu-align-end{align-items:end}.cu-align-stretch{align-items:stretch}.cu-jc-start{justify-content:start}.cu-jc-center{justify-content:center}.cu-jc-end{justify-content:end}.cu-jc-between{justify-content:space-between}.cu-fd-row{flex-direction:row}.cu-fd-column{flex-direction:column}.cu-fd-row-reverse{flex-direction:row-reverse}.cu-fd-column-reverse{flex-direction:column-reverse}@media (width>=640px){.xs\:cu-align-start{align-items:start}.xs\:cu-align-center{align-items:center}.xs\:cu-align-end{align-items:end}.xs\:cu-align-stretch{align-items:stretch}.xs\:cu-jc-start{justify-content:start}.xs\:cu-jc-center{justify-content:center}.xs\:cu-jc-end{justify-content:end}.xs\:cu-jc-between{justify-content:space-between}.xs\:cu-fd-row{flex-direction:row}.xs\:cu-fd-column{flex-direction:column}.xs\:cu-fd-row-reverse{flex-direction:row-reverse}.xs\:cu-fd-column-reverse{flex-direction:column-reverse}}@media (width>=768px){.sm\:cu-align-start{align-items:start}.sm\:cu-align-center{align-items:center}.sm\:cu-align-end{align-items:end}.sm\:cu-align-stretch{align-items:stretch}.sm\:cu-jc-start{justify-content:start}.sm\:cu-jc-center{justify-content:center}.sm\:cu-jc-end{justify-content:end}.sm\:cu-jc-between{justify-content:space-between}.sm\:cu-fd-row{flex-direction:row}.sm\:cu-fd-column{flex-direction:column}.sm\:cu-fd-row-reverse{flex-direction:row-reverse}.sm\:cu-fd-column-reverse{flex-direction:column-reverse}}@media (width>=1024px){.md\:cu-align-start{align-items:start}.md\:cu-align-center{align-items:center}.md\:cu-align-end{align-items:end}.md\:cu-align-stretch{align-items:stretch}.md\:cu-jc-start{justify-content:start}.md\:cu-jc-center{justify-content:center}.md\:cu-jc-end{justify-content:end}.md\:cu-jc-between{justify-content:space-between}.md\:cu-fd-row{flex-direction:row}.md\:cu-fd-column{flex-direction:column}.md\:cu-fd-row-reverse{flex-direction:row-reverse}.md\:cu-fd-column-reverse{flex-direction:column-reverse}}@media (width>=1280px){.lg\:cu-align-start{align-items:start}.lg\:cu-align-center{align-items:center}.lg\:cu-align-end{align-items:end}.lg\:cu-align-stretch{align-items:stretch}.lg\:cu-jc-start{justify-content:start}.lg\:cu-jc-center{justify-content:center}.lg\:cu-jc-end{justify-content:end}.lg\:cu-jc-between{justify-content:space-between}.lg\:cu-fd-row{flex-direction:row}.lg\:cu-fd-column{flex-direction:column}.lg\:cu-fd-row-reverse{flex-direction:row-reverse}.lg\:cu-fd-column-reverse{flex-direction:column-reverse}}@media (width>=1536px){.xl\:cu-align-start{align-items:start}.xl\:cu-align-center{align-items:center}.xl\:cu-align-end{align-items:end}.xl\:cu-align-stretch{align-items:stretch}.xl\:cu-jc-start{justify-content:start}.xl\:cu-jc-center{justify-content:center}.xl\:cu-jc-end{justify-content:end}.xl\:cu-jc-between{justify-content:space-between}.xl\:cu-fd-row{flex-direction:row}.xl\:cu-fd-column{flex-direction:column}.xl\:cu-fd-row-reverse{flex-direction:row-reverse}.xl\:cu-fd-column-reverse{flex-direction:column-reverse}}:where(a){color:inherit;text-decoration:none}:root{--canon-font-regular:system-ui;--canon-font-monospace:ui-monospace,"Menlo","Monaco","Consolas","Liberation Mono","Courier New",monospace;--canon-font-weight-regular:400;--canon-font-weight-bold:600;--canon-font-size-1:.625rem;--canon-font-size-2:.75rem;--canon-font-size-3:.875rem;--canon-font-size-4:1rem;--canon-font-size-5:1.25rem;--canon-font-size-6:1.5rem;--canon-font-size-7:2rem;--canon-font-size-8:3rem;--canon-font-size-9:4rem;--canon-font-size-10:5.75rem;--canon-space:.25rem;--canon-space-0_5:calc(var(--canon-space)*.5);--canon-space-1:var(--canon-space);--canon-space-1_5:calc(var(--canon-space)*1.5);--canon-space-2:calc(var(--canon-space)*2);--canon-space-3:calc(var(--canon-space)*3);--canon-space-4:calc(var(--canon-space)*4);--canon-space-5:calc(var(--canon-space)*5);--canon-space-6:calc(var(--canon-space)*6);--canon-space-7:calc(var(--canon-space)*7);--canon-space-8:calc(var(--canon-space)*8);--canon-space-9:calc(var(--canon-space)*9);--canon-space-10:calc(var(--canon-space)*10);--canon-space-11:calc(var(--canon-space)*11);--canon-space-12:calc(var(--canon-space)*12);--canon-space-13:calc(var(--canon-space)*13);--canon-space-14:calc(var(--canon-space)*14);--canon-radius-1:calc(.125rem);--canon-radius-2:calc(.25rem);--canon-radius-3:calc(.5rem);--canon-radius-4:calc(.75rem);--canon-radius-5:calc(1rem);--canon-radius-6:calc(1.25rem);--canon-radius-full:9999px;--canon-black:#000;--canon-white:#fff;--canon-gray-1:#f8f8f8;--canon-gray-2:#ececec;--canon-gray-3:#d9d9d9;--canon-gray-4:#c1c1c1;--canon-gray-5:#9e9e9e;--canon-gray-6:#8c8c8c;--canon-gray-7:#757575;--canon-gray-8:#595959;--canon-bg:var(--canon-gray-1);--canon-bg-surface-1:var(--canon-white);--canon-bg-surface-2:var(--canon-gray-2);--canon-bg-solid:#1f5493;--canon-bg-solid-hover:#163a66;--canon-bg-solid-pressed:#0f2b4e;--canon-bg-solid-disabled:#ebebeb;--canon-bg-tint:transparent;--canon-bg-tint-hover:#1f549366;--canon-bg-tint-pressed:#1f549399;--canon-bg-tint-disabled:#ebebeb;--canon-bg-danger:#feebe7;--canon-bg-warning:#fff2b2;--canon-bg-success:#e6f6eb;--canon-fg-primary:var(--canon-black);--canon-fg-secondary:var(--canon-gray-7);--canon-fg-link:#1f5493;--canon-fg-link-hover:#1f2d5c;--canon-fg-disabled:#9e9e9e;--canon-fg-solid:var(--canon-white);--canon-fg-solid-disabled:#9c9c9c;--canon-fg-tint:#1f5493;--canon-fg-tint-disabled:var(--canon-gray-5);--canon-fg-danger:#e22b2b;--canon-fg-warning:#e36d05;--canon-fg-success:#1db954;--canon-border:#0000001a;--canon-border-hover:#0003;--canon-border-pressed:#0006;--canon-border-disabled:#0000001a;--canon-border-danger:#f87a7a;--canon-border-warning:#e36d05;--canon-border-success:#53db83;--canon-ring:#1f5493;--canon-scrollbar:#a0a0a03b;--canon-scrollbar-thumb:#a0a0a0}[data-theme=dark]{--canon-gray-1:#191919;--canon-gray-2:#242424;--canon-gray-3:#373737;--canon-gray-4:#464646;--canon-gray-5:#575757;--canon-gray-6:#7b7b7b;--canon-gray-7:#9e9e9e;--canon-gray-8:#b4b4b4;--canon-bg:var(--canon-black);--canon-bg-surface-1:var(--canon-gray-1);--canon-bg-surface-2:var(--canon-gray-2);--canon-bg-solid:#9cc9ff;--canon-bg-solid-hover:#83b9fd;--canon-bg-solid-pressed:#83b9fd;--canon-bg-solid-disabled:#222;--canon-bg-tint:transparent;--canon-bg-tint-hover:#9cc9ff1f;--canon-bg-tint-pressed:#9cc9ff29;--canon-bg-tint-disabled:transparent;--canon-bg-danger:#3b1219;--canon-bg-warning:#302008;--canon-bg-success:#132d21;--canon-fg-primary:var(--canon-white);--canon-fg-secondary:var(--canon-gray-7);--canon-fg-link:#9cc9ff;--canon-fg-link-hover:#7eb5f7;--canon-fg-disabled:var(--canon-gray-7);--canon-fg-solid:#101821;--canon-fg-solid-disabled:var(--canon-gray-5);--canon-fg-tint:#9cc9ff;--canon-fg-tint-disabled:var(--canon-gray-5);--canon-fg-danger:#e22b2b;--canon-fg-warning:#e36d05;--canon-fg-success:#1db954;--canon-border:#fff3;--canon-border-hover:#fff6;--canon-border-pressed:#ffffff80;--canon-border-disabled:#fff3;--canon-border-danger:#f87a7a;--canon-border-warning:#e36d05;--canon-border-success:#53db83;--canon-ring:#1f5493;--canon-scrollbar:#3636363a;--canon-scrollbar-thumb:#575757}.canon-AvatarRoot{vertical-align:middle;user-select:none;color:var(--canon-fg-primary);background-color:var(--canon-bg-surface-2);border-radius:100%;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:1rem;font-weight:500;line-height:1;display:inline-flex;overflow:hidden}.canon-AvatarRoot[data-size=small]{width:1.5rem;height:1.5rem}.canon-AvatarRoot[data-size=medium]{width:2rem;height:2rem}.canon-AvatarRoot[data-size=large]{width:3rem;height:3rem}.canon-AvatarImage{object-fit:cover;width:100%;height:100%}.canon-AvatarFallback{width:100%;height:100%;font-size:var(--canon-font-size-3);font-weight:var(--canon-font-weight-regular);box-shadow:inset 0 0 0 1px var(--canon-border);border-radius:var(--canon-radius-full);justify-content:center;align-items:center;display:flex}.canon-Box{font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary)}.canon-Button{user-select:none;font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-bold);cursor:pointer;border-radius:var(--canon-radius-2);justify-content:center;align-items:center;gap:var(--canon-space-1_5);border:none;padding:0;display:inline-flex;&:disabled{cursor:not-allowed}}.canon-Button[data-variant=primary]{background-color:var(--canon-bg-solid);color:var(--canon-fg-solid);transition:background-color .15s,box-shadow .15s;&:hover{background-color:var(--canon-bg-solid-hover)}&:active{background-color:var(--canon-bg-solid-pressed)}&:focus-visible{outline:2px solid var(--canon-ring);outline-offset:2px}&:disabled{background-color:var(--canon-bg-solid-disabled);color:var(--canon-fg-solid-disabled)}}.canon-Button[data-variant=secondary]{background-color:var(--canon-bg-surface-1);box-shadow:inset 0 0 0 1px var(--canon-border);color:var(--canon-fg-primary);transition:box-shadow .15s;&:hover{box-shadow:inset 0 0 0 1px var(--canon-border-hover)}&:active{box-shadow:inset 0 0 0 1px var(--canon-border-pressed)}&:focus-visible{box-shadow:inset 0 0 0 2px var(--canon-ring);outline:none;transition:none}&:disabled{box-shadow:inset 0 0 0 1px var(--canon-border-disabled);color:var(--canon-fg-disabled)}}.canon-Button[data-size=medium]{font-size:var(--canon-font-size-4);padding:0 var(--canon-space-3);height:2.5rem}.canon-Button[data-size=small]{font-size:var(--canon-font-size-3);padding:0 var(--canon-space-2);height:2rem}.canon-Button[data-size=small] svg{width:1rem;height:1rem}.canon-Button[data-size=medium] svg{width:1.25rem;height:1.25rem}.canon-ButtonIcon{justify-content:center;align-items:center}.canon-ButtonIcon[data-size=small]{width:2rem;padding:0}.canon-ButtonIcon[data-size=medium]{width:2.5rem;padding:0}.canon-CheckboxRoot{width:1rem;height:1rem;box-shadow:inset 0 0 0 1px var(--canon-border);cursor:pointer;background-color:var(--canon-bg-surface-1);border:none;border-radius:2px;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background-color .2s ease-in-out;display:flex}.canon-CheckboxRoot:focus-visible{outline:2px solid var(--canon-ring);outline-offset:2px;transition:none}.canon-CheckboxRoot[data-checked]{background-color:var(--canon-bg-solid);box-shadow:none;color:var(--canon-fg-solid)}.canon-CheckboxLabel{align-items:center;gap:var(--canon-space-2);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary);user-select:none;flex-direction:row;display:flex;&:hover{& .canon-CheckboxRoot:not([data-checked]){box-shadow:inset 0 0 0 1px var(--canon-border-hover)}}}.canon-CheckboxIndicator{color:var(--canon-fg-solid);justify-content:center;align-items:center;display:flex}.canon-CollapsiblePanel{height:var(--collapsible-panel-height);transition:all .15s ease-out;display:flex;overflow:hidden;&[data-starting-style],&[data-ending-style]{height:0}}.canon-Container{max-width:120rem;padding-inline:var(--canon-space-4);margin-inline:auto;transition:padding .2s ease-in-out}@media (width>=640px){.canon-Container{padding-inline:var(--canon-space-8)}}@media (width>=1024px){.canon-Container{padding-inline:var(--canon-space-12)}}.canon-DataTableRoot{gap:var(--canon-space-3);flex-direction:column;display:flex}.canon-DataTablePagination{padding-top:var(--canon-space-5);justify-content:space-between;align-items:center;display:flex}.canon-DataTablePagination--left{justify-content:space-between;align-items:center;display:flex}.canon-DataTablePagination--right{justify-content:space-between;align-items:center;gap:var(--canon-space-2);display:flex}.canon-DataTablePagination--select{min-width:10.5rem}.canon-FieldLabel{margin-bottom:var(--canon-space-3);gap:var(--canon-space-1);flex-direction:column;display:flex}.canon-FieldLabelLabel{color:var(--canon-fg-primary);cursor:pointer;font-weight:var(--canon-font-weight-regular);font-size:var(--canon-font-size-2);margin-right:auto}.canon-FieldLabelSecondaryLabel{color:var(--canon-fg-secondary);font-weight:var(--canon-font-weight-regular);margin-left:var(--canon-space-1)}.canon-FieldLabelDescription{font-weight:var(--canon-font-weight-regular);font-size:var(--canon-font-size-2);color:var(--canon-fg-secondary);margin:0}.canon-Flex{min-width:0;display:flex}.canon-Grid{display:grid}.canon-Heading{font-family:var(--canon-font-regular);color:var(--canon-fg-primary);margin:0;padding:0;line-height:100%}.canon-Heading[data-variant=display]{font-size:var(--canon-font-size-10);font-weight:var(--canon-font-weight-bold)}.canon-Heading[data-variant=title1]{font-size:var(--canon-font-size-9);font-weight:var(--canon-font-weight-bold)}.canon-Heading[data-variant=title2]{font-size:var(--canon-font-size-8);font-weight:var(--canon-font-weight-bold)}.canon-Heading[data-variant=title3]{font-size:var(--canon-font-size-7);font-weight:var(--canon-font-weight-bold)}.canon-Heading[data-variant=title4]{font-size:var(--canon-font-size-6);font-weight:var(--canon-font-weight-bold)}.canon-Heading[data-variant=title5]{font-size:var(--canon-font-size-5);font-weight:var(--canon-font-weight-bold)}.canon-Heading[data-color=primary]{color:var(--canon-fg-primary)}.canon-Heading[data-color=secondary]{color:var(--canon-fg-secondary)}.canon-Heading[data-truncate]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.canon-Icon{width:1rem;height:1rem}.canon-Link{font-family:var(--canon-font-regular);color:var(--canon-fg-link);cursor:pointer;margin:0;padding:0;text-decoration-line:none;&:hover{color:var(--canon-fg-link-hover);text-underline-offset:calc(.025em + 2px);text-decoration-line:underline;text-decoration-style:solid;text-decoration-thickness:min(2px,max(1px,.05em));text-decoration-color:color-mix(in srgb,var(--canon-fg-link-hover)30%,transparent)}}.canon-Link[data-variant=body]{font-size:var(--canon-font-size-3);line-height:140%}.canon-Link[data-variant=subtitle]{font-size:var(--canon-font-size-4);line-height:140%}.canon-Link[data-variant=caption]{font-size:var(--canon-font-size-2);line-height:140%}.canon-Link[data-variant=label]{font-size:var(--canon-font-size-1);line-height:140%}.canon-Link[data-weight=regular]{font-weight:var(--canon-font-weight-regular)}.canon-Link[data-weight=bold]{font-weight:var(--canon-font-weight-bold)}.canon-MenuPositioner{outline:0}.canon-MenuPopup{background-color:var(--canon-bg-surface-1);border:1px solid var(--canon-border);color:var(--canon-fg-primary);transform-origin:var(--transform-origin);max-width:min(var(--available-width),340px);max-height:min(var(--available-height),500px);padding-bottom:var(--canon-space-1);border-radius:.375rem;outline:none;flex-direction:column;transition:transform .15s,opacity .15s;display:flex;position:relative;overflow:auto;&[data-starting-style],&[data-ending-style]{opacity:0;transform:scale(.9)}}.canon-MenuItem{user-select:none;align-items:center;gap:var(--canon-space-2);height:32px;color:var(--canon-fg-primary);border-radius:var(--canon-radius-2);margin-inline:var(--canon-space-1);padding-inline:var(--canon-space-2);font-size:var(--canon-font-size-3);cursor:pointer;outline:0;flex-shrink:0;text-decoration:none;display:flex;&:first-child{margin-top:var(--canon-space-1)}&[data-highlighted]{background-color:var(--canon-gray-3)}}.canon-MenuSubmenuTrigger{user-select:none;justify-content:space-between;align-items:center;gap:var(--canon-space-2);height:32px;color:var(--canon-fg-primary);border-radius:var(--canon-radius-2);margin-inline:var(--canon-space-1);padding-inline:var(--canon-space-2);font-size:var(--canon-font-size-3);cursor:pointer;outline:0;flex-shrink:0;text-decoration:none;display:flex;& .canon-Icon{color:var(--canon-fg-secondary)}&:first-child{margin-top:var(--canon-space-1)}&[data-popup-open],&[data-highlighted]{background-color:var(--canon-gray-3);& .canon-Icon{color:var(--canon-fg-primary)}}}.canon-MenuSeparator{background-color:var(--color-gray-200);height:1px;margin:.375rem 1rem}.canon-SubmenuComboboxSearch{padding-inline:var(--canon-space-3);border:none;border-bottom:1px solid var(--canon-border);background-color:var(--canon-bg-surface-1);width:100%;height:32px;color:var(--canon-fg-primary);line-height:140%;font-size:var(--canon-font-size-3);z-index:1;outline:none;position:sticky;top:0;&::placeholder{color:var(--canon-fg-secondary)}&:disabled{opacity:.6;cursor:not-allowed}}.canon-SubmenuComboboxItems{padding-top:var(--canon-space-2);outline:none;flex-direction:column;display:flex;overflow-y:auto}.canon-SubmenuComboboxNoResults{padding-inline:var(--canon-space-3);padding-top:var(--canon-space-2);padding-bottom:var(--canon-space-4);color:var(--canon-fg-secondary);font-size:var(--canon-font-size-3)}.canon-SubmenuComboboxItem{user-select:none;justify-content:space-between;align-items:center;gap:var(--canon-space-2);height:32px;color:var(--canon-fg-primary);border-radius:var(--canon-radius-2);margin-inline:var(--canon-space-1);padding-inline:var(--canon-space-2);font-size:var(--canon-font-size-3);cursor:pointer;outline:0;flex-shrink:0;text-decoration:none;display:flex;&[data-highlighted]{background-color:var(--canon-gray-3)}&[data-disabled]{opacity:.5;cursor:not-allowed}}.canon-SubmenuComboboxItemCheckbox{width:16px;height:16px;color:var(--canon-fg-primary);border-radius:var(--canon-radius-2);border:1px solid var(--canon-border);background:var(--canon-bg-surface-1);flex-shrink:0;justify-content:center;align-items:center;display:flex}.canon-SubmenuComboboxItemLabel{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.canon-TableRoot{caption-side:bottom;border-collapse:collapse;width:100%}.canon-TableHead{text-align:left;padding:var(--canon-space-3);font-size:var(--canon-font-size-3);color:var(--canon-fg-primary)}.canon-TableBody{color:var(--canon-fg-primary)}.canon-TableRow{border-bottom:1px solid var(--canon-border);transition:color .2s ease-in-out}.canon-TableBody .canon-TableRow:hover{background-color:var(--canon-gray-2)}.canon-TableCell{padding:var(--canon-space-3);font-size:var(--canon-font-size-3)}.canon-TableCellText,.canon-TableCellLink{gap:var(--canon-space-0_5);flex-direction:column;display:flex}.canon-TableCellProfile{gap:var(--canon-space-2);flex-direction:row;align-items:center;display:flex}.canon-TableCellProfileAvatar{vertical-align:middle;user-select:none;color:var(--canon-fg-primary);background-color:var(--canon-bg-surface-2);border-radius:100%;justify-content:center;align-items:center;width:1.25rem;height:1.25rem;font-size:1rem;font-weight:500;line-height:1;display:inline-flex;overflow:hidden}.canon-TableCellProfileAvatarImage{object-fit:cover;width:100%;height:100%}.canon-TableCellProfileAvatarFallback{width:100%;height:100%;font-size:var(--canon-font-size-2);font-weight:var(--canon-font-weight-regular);box-shadow:inset 0 0 0 1px var(--canon-border);border-radius:var(--canon-radius-full);justify-content:center;align-items:center;display:flex}.canon-TabsRoot{border:1px solid var(--color-gray-200);border-radius:.375rem}.canon-TabsList{z-index:0;display:flex;position:relative}.canon-TabsTab{appearance:none;color:var(--canon-fg-secondary);user-select:none;padding-inline:var(--canon-space-3);height:2rem;font-family:inherit;font-size:.875rem;font-weight:500;line-height:1.25rem;font-size:var(--canon-font-size-2);cursor:pointer;background:0 0;border:0;outline:0;justify-content:center;align-items:center;margin:0;padding-block:0;transition:color .2s ease-in-out;display:flex;&[data-selected]{color:var(--canon-fg-primary)}@media (hover:hover){&:hover{color:var(--canon-fg-primary)}}&:focus-visible{position:relative;&:before{content:"";outline:1px solid var(--canon-ring);outline-offset:-1px;border-radius:.25rem;position:absolute;inset:.25rem 0}}}.canon-TabsIndicator{z-index:-1;translate:var(--active-tab-left)-50%;width:var(--active-tab-width);background-color:var(--canon-bg-solid);height:1px;transition-property:translate,width;transition-duration:.2s;transition-timing-function:ease-in-out;position:absolute;bottom:0;left:0}.canon-TabsPanel{&[hidden]{display:none}}.canon-Text{font-family:var(--canon-font-regular);margin:0;padding:0}.canon-Text[data-variant=body]{font-size:var(--canon-font-size-3);line-height:140%}.canon-Text[data-variant=subtitle]{font-size:var(--canon-font-size-4);line-height:140%}.canon-Text[data-variant=caption]{font-size:var(--canon-font-size-2);line-height:140%}.canon-Text[data-variant=label]{font-size:var(--canon-font-size-1);line-height:140%}.canon-Text[data-weight=regular]{font-weight:var(--canon-font-weight-regular)}.canon-Text[data-weight=bold]{font-weight:var(--canon-font-weight-bold)}.canon-Text[data-color=primary]{color:var(--canon-fg-primary)}.canon-Text[data-color=secondary]{color:var(--canon-fg-secondary)}.canon-Text[data-color=danger]{color:var(--canon-fg-danger)}.canon-Text[data-color=warning]{color:var(--canon-fg-warning)}.canon-Text[data-color=success]{color:var(--canon-fg-success)}.canon-Text[data-truncate]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.canon-TextField{font-family:var(--canon-font-regular);flex-direction:column;width:100%;display:flex}.canon-TextFieldInputWrapper{position:relative}.canon-TextFieldInputWrapper[data-size=small]{height:2rem}.canon-TextFieldInputWrapper[data-size=medium]{height:2.5rem}.canon-TextFieldIcon{left:var(--canon-space-3);margin-right:var(--canon-space-1);color:var(--canon-fg-primary);flex-shrink:0;position:absolute;top:50%;transform:translateY(-50%)}.canon-TextFieldIcon[data-size=small],.canon-TextFieldIcon[data-size=small] svg{width:1rem;height:1rem}.canon-TextFieldIcon[data-size=medium],.canon-TextFieldIcon[data-size=medium] svg{width:1.25rem;height:1.25rem}.canon-TextFieldInput{padding:0 var(--canon-space-3);border-radius:var(--canon-radius-3);border:1px solid var(--canon-border);background-color:var(--canon-bg-surface-1);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary);width:100%;height:100%;cursor:inherit;align-items:center;transition:border-color .2s ease-in-out,outline-color .2s ease-in-out;display:flex}.canon-TextFieldInput::placeholder{color:var(--canon-fg-secondary)}.canon-TextFieldInput[data-icon]{padding-left:var(--canon-space-8)}.canon-TextFieldInput[data-focused]{outline-color:var(--canon-border-pressed);outline-width:0}.canon-TextFieldInput[data-hovered]{border-color:var(--canon-border-hover)}.canon-TextFieldInput[data-focused]{border-color:var(--canon-border-pressed);outline-width:0}.canon-TextFieldInput[data-invalid]{border-color:var(--canon-fg-danger)}.canon-TextFieldInput[data-disabled]{opacity:.5;cursor:not-allowed;border:1px solid var(--canon-border-disabled)}.canon-TextFieldError{color:var(--canon-fg-danger);font-size:var(--canon-font-size-2);font-weight:var(--canon-font-weight-regular);margin-top:var(--canon-space-2)}.canon-TooltipPopup{box-sizing:border-box;transform-origin:var(--transform-origin);background-color:canvas;background-color:var(--canon-bg-surface-1);color:var(--canon-fg-primary);outline:1px solid var(--canon-border);box-shadow:0 10px 15px -3px var(--canon-border),0 4px 6px -4px var(--canon-border);border-radius:.375rem;flex-direction:column;padding:.25rem .5rem;font-size:.875rem;line-height:1.25rem;transition:transform .15s,opacity .15s;display:flex;&[data-starting-style],&[data-ending-style]{opacity:0;transform:scale(.9)}&[data-instant]{transition-duration:0s}}.canon-TooltipArrow{display:flex;&[data-side=top]{bottom:-8px;rotate:180deg}&[data-side=bottom]{top:-8px;rotate:none}&[data-side=left]{right:-13px;rotate:90deg}&[data-side=right]{left:-13px;rotate:-90deg}}.canon-TooltipArrow-fill{fill:var(--canon-bg-surface-1)}.canon-TooltipArrow-outer-stroke{@media (prefers-color-scheme:light){fill:var(--canon-border)}}.canon-ScrollAreaRoot{box-sizing:border-box;width:24rem;max-width:calc(100vw - 8rem);height:8.5rem}.canon-ScrollAreaViewport{overscroll-behavior:contain;height:100%}.canon-ScrollAreaContent{padding-block:.75rem;flex-direction:column;gap:1rem;padding-left:1rem;padding-right:1.5rem;display:flex}.canon-ScrollAreaScrollbar{background-color:var(--canon-scrollbar);opacity:0;border-radius:.375rem;justify-content:center;width:.25rem;margin:.5rem;transition:opacity .15s .3s;display:flex;&[data-hovering],&[data-scrolling]{opacity:1;transition-duration:75ms;transition-delay:0s}&:before{content:"";width:1.25rem;height:100%;position:absolute}}.canon-ScrollAreaThumb{border-radius:inherit;background-color:var(--canon-scrollbar-thumb);width:100%}.canon-Select{font-family:var(--canon-font-regular);flex-direction:column;width:100%;display:flex}.canon-SelectLabel{font-size:var(--canon-font-size-2);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary);margin-bottom:var(--canon-space-1_5);cursor:pointer}.canon-SelectLabel[data-disabled]{cursor:default}.canon-SelectDescription{font-size:var(--canon-font-size-2);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-secondary);padding-top:var(--canon-space-1_5);margin:0}.canon-SelectError{font-size:var(--canon-font-size-2);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-danger);padding-top:var(--canon-space-1_5);margin:0}.canon-SelectTrigger{box-sizing:border-box;border-radius:var(--canon-radius-3);border:1px solid var(--canon-border);padding:0 var(--canon-space-4);background-color:var(--canon-bg-surface-1);font-size:var(--canon-font-size-3);font-family:var(--canon-font-regular);font-weight:var(--canon-font-weight-regular);color:var(--canon-fg-primary);cursor:pointer;justify-content:space-between;align-items:center;gap:var(--canon-space-2);width:100%;transition:border-color .2s ease-in-out,outline-color .2s ease-in-out;display:flex}.canon-SelectTrigger::placeholder{color:var(--canon-fg-secondary)}.canon-SelectTrigger:hover{border-color:var(--canon-border-hover)}.canon-SelectTrigger:focus-visible{border-color:var(--canon-border-pressed);outline:0}.canon-SelectTrigger[data-invalid]{border-color:var(--canon-fg-danger)}.canon-SelectTrigger[data-invalid]:hover,.canon-SelectTrigger[data-invalid]:focus-visible{border-width:2px}.canon-SelectTrigger[data-disabled]{cursor:not-allowed;border-color:var(--canon-border-disabled);color:var(--canon-fg-disabled)}.canon-SelectTrigger[data-size=small]{height:2rem}.canon-SelectTrigger[data-size=medium]{height:3rem}.canon-SelectIcon{margin-left:var(--canon-space-5);transition:transform .2s}.canon-SelectTrigger[data-popup-open] .canon-SelectIcon{transform:rotate(180deg)}.canon-SelectPopup{box-sizing:border-box;max-height:var(--available-height);background-color:var(--canon-bg-surface-1);border:1px solid var(--canon-border);border-radius:var(--canon-radius-3);padding-block:var(--canon-space-1);z-index:1;transform-origin:var(--transform-origin);outline:0;transition:transform .15s,opacity .15s;overflow-y:auto;box-shadow:0 4px 12px #0003}.canon-SelectPopup[data-starting-style],.canon-SelectPopup[data-ending-style]{opacity:0;transform:scale(.9)}.canon-SelectItem{width:var(--anchor-width);padding-block:var(--canon-space-2);padding-inline:var(--canon-space-4);color:var(--canon-fg-primary);border-radius:var(--canon-radius-3);cursor:pointer;user-select:none;font-size:var(--canon-font-size-3);align-items:center;gap:var(--canon-space-2);outline:none;grid-template-columns:1rem 1fr;grid-template-areas:"icon text";display:grid;position:relative}.canon-SelectItem[data-highlighted]{z-index:0;color:var(--canon-fg-primary);position:relative}.canon-SelectItem[data-highlighted]:before{content:"";z-index:-1;background-color:var(--canon-bg-tint-hover);border-radius:.25rem;position:absolute;inset-block:0;inset-inline:.25rem}.canon-SelectItem[data-disabled]{cursor:not-allowed;color:var(--canon-fg-disabled)}.canon-SelectItemIndicator{grid-area:icon;justify-content:center;align-items:center;display:flex}.canon-SelectItemText{flex:1;grid-area:text}.canon-SelectRequired{color:var(--canon-fg-secondary);font-size:var(--canon-font-size-2);font-weight:var(--canon-font-weight-regular);margin-left:var(--canon-space-1)}.canon-SelectIcon{justify-content:center;align-items:center;display:flex}.canon-SelectValue{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}.canon-Switch{align-items:center;gap:var(--canon-space-3);font-size:var(--canon-font-size-3);color:var(--canon-fg-primary);cursor:pointer;display:flex;position:relative;&[data-pressed] .canon-SwitchIndicator{&:before{background:var(--canon-fg-solid)}}&[data-selected]{& .canon-SwitchIndicator{background:var(--canon-bg-solid);&:before{background:var(--canon-fg-solid);transform:translate(100%)}}&[data-pressed]{& .indicator{background:var(--canon-gray-3)}}}&[data-focus-visible] .canon-SwitchIndicator{outline-offset:2px;outline:2px solid}}.canon-SwitchIndicator{background:var(--canon-gray-3);border:2px;border-radius:1.143rem;width:2rem;height:1.143rem;transition:all .2s;&:before{content:"";background:var(--canon-fg-solid);border-radius:16px;width:.857rem;height:.857rem;margin:.143rem;transition:all .2s;display:block}}
\ No newline at end of file
diff --git a/canon-docs/scripts/build-css.js b/canon-docs/scripts/build-css.js
index dd9775150f..edd80add51 100644
--- a/canon-docs/scripts/build-css.js
+++ b/canon-docs/scripts/build-css.js
@@ -5,10 +5,8 @@ const { bundle } = require('lightningcss');
const source = '../../packages/canon/src/css';
const destination = '../public';
-const source1 = path.join(__dirname, `${source}/core.css`);
-const destination1 = path.join(__dirname, `${destination}/core.css`);
-const source2 = path.join(__dirname, `${source}/components.css`);
-const destination2 = path.join(__dirname, `${destination}/components.css`);
+const source1 = path.join(__dirname, `${source}/styles.css`);
+const destination1 = path.join(__dirname, `${destination}/styles.css`);
// Function to bundle and copy the CSS file
const bundleAndCopyFile = async (source, destination) => {
@@ -26,10 +24,7 @@ const bundleAndCopyFile = async (source, destination) => {
};
// Initial bundle and copy
-Promise.all([
- bundleAndCopyFile(source1, destination1),
- bundleAndCopyFile(source2, destination2),
-])
+Promise.all([bundleAndCopyFile(source1, destination1)])
.then(() => {
// Add an empty line after all operations are complete - It looks better in the terminal :)
console.log('');
diff --git a/canon-docs/src/content/components/radio-group.mdx b/canon-docs/src/content/components/radio-group.mdx
new file mode 100644
index 0000000000..703ac6b8dd
--- /dev/null
+++ b/canon-docs/src/content/components/radio-group.mdx
@@ -0,0 +1,98 @@
+import { PropsTable } from '@/components/PropsTable';
+import { Snippet } from '@/components/Snippet';
+import { RadioGroupSnippet } from '@/snippets/stories-snippets';
+import {
+ radioGroupPropDefs,
+ radioGroupUsageSnippet,
+ radioGroupDefaultSnippet,
+ radioGroupDescriptionSnippet,
+ radioGroupHorizontalSnippet,
+ radioGroupDisabledSnippet,
+ radioGroupDisabledSingleSnippet,
+ radioGroupValidationSnippet,
+ radioGroupReadOnlySnippet,
+} from './radio-group.props';
+import { ComponentInfos } from '@/components/ComponentInfos';
+
+# RadioGroup
+
+A radio group allows a user to select a single item from a list of mutually exclusive options.
+
+}
+ code={radioGroupDefaultSnippet}
+/>
+
+
+
+## API reference
+
+
+
+## Examples
+
+### Horizontal
+
+Here's a simple TextField with a description.
+
+}
+ code={radioGroupHorizontalSnippet}
+/>
+
+### Disabled
+
+You can disable the entire radio group by adding the `isDisabled` prop to the `RadioGroup` component.
+
+}
+ code={radioGroupDisabledSnippet}
+/>
+
+### Disabled Single radio
+
+You can disable a single radio by adding the `isDisabled` prop to the `Radio` component.
+
+}
+ code={radioGroupDisabledSingleSnippet}
+/>
+
+### Validation
+
+Here's an example of a radio group with errors.
+
+}
+ code={radioGroupValidationSnippet}
+/>
+
+### Read only
+
+You can make the radio group read only by adding the `isReadOnly` prop to the `RadioGroup` component.
+
+}
+ code={radioGroupReadOnlySnippet}
+/>
diff --git a/canon-docs/src/content/components/radio-group.props.ts b/canon-docs/src/content/components/radio-group.props.ts
new file mode 100644
index 0000000000..c016be5ac6
--- /dev/null
+++ b/canon-docs/src/content/components/radio-group.props.ts
@@ -0,0 +1,64 @@
+import {
+ classNamePropDefs,
+ stylePropDefs,
+ type PropDef,
+} from '@/utils/propDefs';
+
+export const radioGroupPropDefs: Record = {
+ size: {
+ type: 'enum',
+ values: ['small', 'medium'],
+ default: 'small',
+ responsive: true,
+ },
+ label: {
+ type: 'string',
+ },
+ icon: {
+ type: 'enum',
+ values: ['ReactNode'],
+ },
+ description: {
+ type: 'string',
+ },
+ name: {
+ type: 'string',
+ required: true,
+ },
+ ...classNamePropDefs,
+ ...stylePropDefs,
+};
+
+export const radioGroupUsageSnippet = `import { RadioGroup } from '@backstage/canon';
+
+`;
+
+export const radioGroupDefaultSnippet = ``;
+
+export const radioGroupDescriptionSnippet = ``;
+
+export const radioGroupHorizontalSnippet = ``;
+
+export const radioGroupDisabledSnippet = `
+ Bulbasaur
+ Charmander
+ Squirtle
+`;
+
+export const radioGroupDisabledSingleSnippet = `
+ Bulbasaur
+ Charmander
+ Squirtle
+`;
+
+export const radioGroupValidationSnippet = ` (value === \'charmander\' ? \'Nice try!\' : null)>
+ Bulbasaur
+ Charmander
+ Squirtle
+`;
+
+export const radioGroupReadOnlySnippet = `
+ Bulbasaur
+ Charmander
+ Squirtle
+`;
diff --git a/canon-docs/src/snippets/stories-snippets.tsx b/canon-docs/src/snippets/stories-snippets.tsx
index e5a7464b43..ef25a37900 100644
--- a/canon-docs/src/snippets/stories-snippets.tsx
+++ b/canon-docs/src/snippets/stories-snippets.tsx
@@ -18,6 +18,7 @@ import * as MenuStories from '../../../packages/canon/src/components/Menu/Menu.s
import * as LinkStories from '../../../packages/canon/src/components/Link/Link.stories';
import * as AvatarStories from '../../../packages/canon/src/components/Avatar/Avatar.stories';
import * as CollapsibleStories from '../../../packages/canon/src/components/Collapsible/Collapsible.stories';
+import * as RadioGroupStories from '../../../packages/canon/src/components/RadioGroup/RadioGroup.stories';
import * as TabsStories from '../../../packages/canon/src/components/Tabs/Tabs.stories';
import * as SwitchStories from '../../../packages/canon/src/components/Switch/Switch.stories';
@@ -197,3 +198,14 @@ export const SwitchSnippet = ({
return StoryComponent ? : null;
};
+
+export const RadioGroupSnippet = ({
+ story,
+}: {
+ story: keyof typeof RadioGroupStories;
+}) => {
+ const stories = composeStories(RadioGroupStories);
+ const StoryComponent = stories[story as keyof typeof stories];
+
+ return StoryComponent ? : null;
+};
diff --git a/canon-docs/src/utils/data.ts b/canon-docs/src/utils/data.ts
index a741ad5160..92f0fdbf87 100644
--- a/canon-docs/src/utils/data.ts
+++ b/canon-docs/src/utils/data.ts
@@ -116,6 +116,11 @@ export const components: Page[] = [
slug: 'menu',
status: 'alpha',
},
+ {
+ title: 'RadioGroup',
+ slug: 'radio-group',
+ status: 'alpha',
+ },
{
title: 'Select',
slug: 'select',
diff --git a/docs/features/software-templates/writing-custom-actions.md b/docs/features/software-templates/writing-custom-actions.md
index 26773c15c6..1a64406b04 100644
--- a/docs/features/software-templates/writing-custom-actions.md
+++ b/docs/features/software-templates/writing-custom-actions.md
@@ -12,7 +12,7 @@ by writing custom actions which can be used alongside our
When adding custom actions, the actions array will **replace the
built-in actions too**. Meaning, you will no longer be able to use them.
-If you want to continue using the builtin actions, include them in the actions
+If you want to continue using the builtin actions, include them in the `actions`
array when registering your custom actions, as seen below.
:::
@@ -52,19 +52,20 @@ its generated unit test. We will replace the existing placeholder code with our
import { resolveSafeChildPath } from '@backstage/backend-plugin-api';
import { createTemplateAction } from '@backstage/plugin-scaffolder-node';
import fs from 'fs-extra';
-import { z } from 'zod';
+import { type z } from 'zod';
export const createNewFileAction = () => {
return createTemplateAction({
id: 'acme:file:create',
description: 'Create an Acme file.',
schema: {
- input: z.object({
- contents: z.string().describe('The contents of the file'),
- filename: z
- .string()
- .describe('The filename of the file that will be created'),
- }),
+ input: {
+ contents: z => z.string({ description: 'The contents of the file' }),
+ filename: z =>
+ z.string({
+ description: 'The filename of the file that will be created',
+ }),
+ },
},
async handler(ctx) {
@@ -95,53 +96,11 @@ The `createTemplateAction` takes an object which specifies the following:
function using `ctx.output`
- `handler` - the actual code which is run as part of the action, with a context
-You can also choose to define your custom action using JSON schema instead of `zod`:
-
-```ts title="With JSON Schema"
-import { resolveSafeChildPath } from '@backstage/backend-plugin-api';
-import { createTemplateAction } from '@backstage/plugin-scaffolder-node';
-import { writeFile } from 'fs';
-
-export const createNewFileAction = () => {
- return createTemplateAction<{ contents: string; filename: string }>({
- id: 'acme:file:create',
- description: 'Create an Acme file.',
- schema: {
- input: {
- required: ['contents', 'filename'],
- type: 'object',
- properties: {
- contents: {
- type: 'string',
- title: 'Contents',
- description: 'The contents of the file',
- },
- filename: {
- type: 'string',
- title: 'Filename',
- description: 'The filename of the file that will be created',
- },
- },
- },
- },
- async handler(ctx) {
- const { signal } = ctx;
- await writeFile(
- resolveSafeChildPath(ctx.workspacePath, ctx.input.filename),
- ctx.input.contents,
- { signal },
- _ => {},
- );
- },
- });
-};
-```
-
### Naming Conventions
Try to keep names consistent for both your own custom actions, and any actions contributed to open source. We've found
that a separation of `:` and using a verb as the last part of the name works well.
-We follow `provider:entity:verb` or as close to this as possible for our built in actions. For example,
+We follow `provider:entity:verb` or as close to this as possible for our built-in actions. For example,
`github:actions:create` or `github:repo:create`.
Also feel free to use your company name to namespace them if you prefer too, for example `acme:file:create` like above.
@@ -151,14 +110,14 @@ and writing of template entity definitions.
### Adding a TemplateExample
-A TemplateExample is a way to document different ways that your custom action can be used. Once added it will be visible
+A TemplateExample is a way to document different ways that your custom action can be used. Once added, it will be visible
in your Backstage instance under the [/create/actions](https://demo.backstage.io/create/actions) path. You can have multiple
examples for one action that can demonstrate different combinations of inputs and how to use them.
#### Define TemplateExamples
Below is a sample TemplateExample that is used for `publish:github`. The source code is available
-on [github](https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend-module-github/src/actions/github.examples.ts)
+on [GitHub](https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend-module-github/src/actions/github.examples.ts)
and preview on [demo.backstage.io/create/actions](https://demo.backstage.io/create/actions#publish-github)
```ts title="With JSON Schema"
@@ -222,7 +181,7 @@ return createTemplateAction({
#### Test TemplateAction examples
It is also possible to test your example TemplateActions. You can see a sample test
-on [github](https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend-module-github/src/actions/github.examples.test.ts)
+on [GitHub](https://github.com/backstage/backstage/blob/master/plugins/scaffolder-backend-module-github/src/actions/github.examples.test.ts)
### The context object
@@ -234,13 +193,12 @@ argument. It looks like the following:
implement [idempotency of the actions](https://github.com/backstage/backstage/tree/master/beps/0004-scaffolder-task-idempotency)
by not re-running the same function again if it was
executed successfully on the previous run.
-- `ctx.logger` - a Winston logger for additional logging inside your action
-- `ctx.logStream` - a stream version of the logger if needed
+- `ctx.logger` - a [LoggerService](../../backend-system/core-services/logger.md) instance for additional logging inside your action
- `ctx.workspacePath` - a string of the working directory of the template run
- `ctx.input` - an object which should match the `zod` or JSON schema provided in the
`schema.input` part of the action definition
- `ctx.output` - a function which you can call to set outputs that match the
- JSON schema or `zod` in `schema.output` for ex. `ctx.output('downloadUrl', myDownloadUrl)`
+ `zod` schema in `schema.output` for ex. `ctx.output('downloadUrl', myDownloadUrl)`
- `createTemporaryDirectory` a function to call to give you a temporary
directory somewhere on the runner, so you can store some files there rather
than polluting the `workspacePath`
@@ -249,7 +207,7 @@ argument. It looks like the following:
## Registering Custom Actions
-To register your new custom action in the Backend System you will need to create a backend module. Here is a very
+To register your new custom action in the Backend System, you will need to create a backend module. Here is a very
simplified example of how to do that:
```ts title="packages/backend/src/index.ts"
@@ -327,8 +285,8 @@ const res = await ctx.checkpoint?.({
});
```
-You have to define the unique key in scope of the scaffolder task for your checkpoint. During the execution task engine
-will check if the checkpoint with such key was already executed or not, if yes, and the run was successful, the callback
+You have to define the unique key in the scope of the scaffolder task for your checkpoint. During the execution task engine
+will check if the checkpoint with such a key was already executed or not, if yes, and the run was successful, the callback
will be skipped and instead the stored value will be returned.
Whenever you change the return type of the checkpoint, we encourage you to change the ID.
diff --git a/package.json b/package.json
index 4e20ea9d63..d926639622 100644
--- a/package.json
+++ b/package.json
@@ -108,7 +108,8 @@
"csstype@npm:^3.0.2": "3.0.9",
"csstype@npm:^3.1.2": "3.0.9",
"csstype@npm:^3.1.3": "3.0.9",
- "jest-haste-map@^29.7.0": "patch:jest-haste-map@npm%3A29.7.0#./.yarn/patches/jest-haste-map-npm-29.7.0-e3be419eff.patch"
+ "jest-haste-map@^29.7.0": "patch:jest-haste-map@npm%3A29.7.0#./.yarn/patches/jest-haste-map-npm-29.7.0-e3be419eff.patch",
+ "GendocuPublicApis": "npm:gendocu-public-apis@^1.0.0"
},
"dependencies": {
"@backstage/errors": "workspace:^",
diff --git a/packages/backend-defaults/src/entrypoints/auth/helpers.test.ts b/packages/backend-defaults/src/entrypoints/auth/helpers.test.ts
index 8454aa3ecc..fdc6e26c3a 100644
--- a/packages/backend-defaults/src/entrypoints/auth/helpers.test.ts
+++ b/packages/backend-defaults/src/entrypoints/auth/helpers.test.ts
@@ -42,6 +42,23 @@ describe('credentials', () => {
},
});
+ expect(
+ createCredentialsWithUserPrincipal(
+ 'user:default/mock',
+ 'my-token',
+ undefined,
+ 'my-actor',
+ ),
+ ).toEqual({
+ $$type: '@backstage/BackstageCredentials',
+ version: 'v1',
+ principal: {
+ type: 'user',
+ userEntityRef: 'user:default/mock',
+ actor: { type: 'service', subject: 'my-actor' },
+ },
+ });
+
expect(createCredentialsWithNonePrincipal()).toEqual({
$$type: '@backstage/BackstageCredentials',
version: 'v1',
@@ -64,4 +81,63 @@ describe('credentials', () => {
),
).not.toMatch(/my-token/);
});
+
+ it('should have a serializable form both as strings and as JSON', () => {
+ const simpleService = createCredentialsWithServicePrincipal('my-service');
+ expect(String(simpleService)).toMatchInlineSnapshot(
+ `"backstageCredentials{servicePrincipal{my-service}}"`,
+ );
+ expect(JSON.stringify(simpleService)).toMatchInlineSnapshot(
+ `"{"$$type":"@backstage/BackstageCredentials","version":"v1","principal":{"type":"service","subject":"my-service"}}"`,
+ );
+
+ const serviceWithAccessRestrictions = createCredentialsWithServicePrincipal(
+ 'my-service',
+ undefined,
+ {
+ permissionNames: ['perm'],
+ permissionAttributes: {
+ action: ['read'],
+ },
+ },
+ );
+ expect(String(serviceWithAccessRestrictions)).toMatchInlineSnapshot(
+ `"backstageCredentials{servicePrincipal{my-service,accessRestrictions=cXWOJgUirHkHNZIowUi/YO5nwEwhTicC38iXi2XTYCk}}"`,
+ );
+ expect(JSON.stringify(serviceWithAccessRestrictions)).toMatchInlineSnapshot(
+ `"{"$$type":"@backstage/BackstageCredentials","version":"v1","principal":{"type":"service","subject":"my-service","accessRestrictions":{"permissionNames":["perm"],"permissionAttributes":{"action":["read"]}}}}"`,
+ );
+
+ const simpleUser = createCredentialsWithUserPrincipal(
+ 'user:default/mock',
+ 'my-token',
+ );
+ expect(String(simpleUser)).toMatchInlineSnapshot(
+ `"backstageCredentials{userPrincipal{user:default/mock}}"`,
+ );
+ expect(JSON.stringify(simpleUser)).toMatchInlineSnapshot(
+ `"{"$$type":"@backstage/BackstageCredentials","version":"v1","principal":{"type":"user","userEntityRef":"user:default/mock"}}"`,
+ );
+
+ const userWithActor = createCredentialsWithUserPrincipal(
+ 'user:default/mock',
+ 'my-token',
+ undefined,
+ 'my-actor',
+ );
+ expect(String(userWithActor)).toMatchInlineSnapshot(
+ `"backstageCredentials{userPrincipal{user:default/mock,actor={servicePrincipal{my-actor}}}}"`,
+ );
+ expect(JSON.stringify(userWithActor)).toMatchInlineSnapshot(
+ `"{"$$type":"@backstage/BackstageCredentials","version":"v1","principal":{"type":"user","userEntityRef":"user:default/mock","actor":{"type":"service","subject":"my-actor"}}}"`,
+ );
+
+ const none = createCredentialsWithNonePrincipal();
+ expect(String(none)).toMatchInlineSnapshot(
+ `"backstageCredentials{nonePrincipal}"`,
+ );
+ expect(JSON.stringify(none)).toMatchInlineSnapshot(
+ `"{"$$type":"@backstage/BackstageCredentials","version":"v1","principal":{"type":"none"}}"`,
+ );
+ });
});
diff --git a/packages/backend-defaults/src/entrypoints/auth/helpers.ts b/packages/backend-defaults/src/entrypoints/auth/helpers.ts
index 58e2bcff74..02840112a9 100644
--- a/packages/backend-defaults/src/entrypoints/auth/helpers.ts
+++ b/packages/backend-defaults/src/entrypoints/auth/helpers.ts
@@ -22,29 +22,34 @@ import {
BackstageUserPrincipal,
} from '@backstage/backend-plugin-api';
import { InternalBackstageCredentials } from './types';
+import { createHash } from 'crypto';
export function createCredentialsWithServicePrincipal(
sub: string,
token?: string,
accessRestrictions?: BackstagePrincipalAccessRestrictions,
): InternalBackstageCredentials {
- return Object.defineProperty(
- {
- $$type: '@backstage/BackstageCredentials',
- version: 'v1',
- principal: {
- type: 'service',
- subject: sub,
- accessRestrictions,
- },
- },
- 'token',
- {
+ const principal = createServicePrincipal(sub, accessRestrictions);
+ const result = {
+ $$type: '@backstage/BackstageCredentials',
+ version: 'v1',
+ principal,
+ } as const;
+ Object.defineProperties(result, {
+ token: {
enumerable: false,
configurable: true,
+ writable: true,
value: token,
},
- );
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => `backstageCredentials{${principal}}`,
+ },
+ });
+ return result;
}
export function createCredentialsWithUserPrincipal(
@@ -53,36 +58,49 @@ export function createCredentialsWithUserPrincipal(
expiresAt?: Date,
actor?: string,
): InternalBackstageCredentials {
- return Object.defineProperty(
- {
- $$type: '@backstage/BackstageCredentials',
- version: 'v1',
- expiresAt,
- principal: {
- type: 'user',
- userEntityRef: sub,
- ...(actor && {
- actor: { type: 'service', subject: actor },
- }),
- },
- },
- 'token',
- {
+ const principal = createUserPrincipal(
+ sub,
+ actor ? createServicePrincipal(actor) : undefined,
+ );
+ const result = {
+ $$type: '@backstage/BackstageCredentials',
+ version: 'v1',
+ expiresAt,
+ principal,
+ } as const;
+ Object.defineProperties(result, {
+ token: {
enumerable: false,
configurable: true,
+ writable: true,
value: token,
},
- );
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => `backstageCredentials{${principal}}`,
+ },
+ });
+ return result;
}
export function createCredentialsWithNonePrincipal(): InternalBackstageCredentials {
- return {
+ const principal = createNonePrincipal();
+ const result = {
$$type: '@backstage/BackstageCredentials',
version: 'v1',
- principal: {
- type: 'none',
+ principal,
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => `backstageCredentials{${principal}}`,
},
- };
+ });
+ return result;
}
export function toInternalBackstageCredentials(
@@ -106,3 +124,74 @@ export function toInternalBackstageCredentials(
return internalCredentials;
}
+
+function createServicePrincipal(
+ sub: string,
+ accessRestrictions?: BackstagePrincipalAccessRestrictions,
+): BackstageServicePrincipal {
+ const result = {
+ type: 'service',
+ subject: sub,
+ accessRestrictions,
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => {
+ let parts = sub;
+ if (accessRestrictions) {
+ const hash = createHash('sha256')
+ .update(JSON.stringify(accessRestrictions))
+ .digest('base64')
+ .replace(/=+$/, '');
+ parts += `,accessRestrictions=${hash}`;
+ }
+ return `servicePrincipal{${parts}}`;
+ },
+ },
+ });
+ return result;
+}
+
+function createUserPrincipal(
+ userEntityRef: string,
+ actor?: BackstageServicePrincipal,
+): BackstageUserPrincipal {
+ const result = {
+ type: 'user',
+ userEntityRef,
+ actor,
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => {
+ let parts = userEntityRef;
+ if (actor) {
+ parts += `,actor={${actor}}`;
+ }
+ return `userPrincipal{${parts}}`;
+ },
+ },
+ });
+ return result;
+}
+
+function createNonePrincipal(): BackstageNonePrincipal {
+ const result = {
+ type: 'none',
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => 'nonePrincipal',
+ },
+ });
+ return result;
+}
diff --git a/packages/backend-test-utils/src/services/mockCredentials.test.ts b/packages/backend-test-utils/src/services/mockCredentials.test.ts
index 343d6d6d20..9248e3bde0 100644
--- a/packages/backend-test-utils/src/services/mockCredentials.test.ts
+++ b/packages/backend-test-utils/src/services/mockCredentials.test.ts
@@ -170,4 +170,27 @@ describe('mockCredentials', () => {
"Invalid user entity reference 'wrong', expected :/",
);
});
+
+ it('should have a serializable form', () => {
+ expect(String(mockCredentials.service('my-service'))).toMatchInlineSnapshot(
+ `"mockCredentials{servicePrincipal{my-service}}"`,
+ );
+ expect(
+ String(mockCredentials.user('user:default/mock')),
+ ).toMatchInlineSnapshot(
+ `"mockCredentials{userPrincipal{user:default/mock}}"`,
+ );
+ expect(
+ String(
+ mockCredentials.user('user:default/mock', {
+ actor: { subject: 'my-actor' },
+ }),
+ ),
+ ).toMatchInlineSnapshot(
+ `"mockCredentials{userPrincipal{user:default/mock,actor={my-actor}}}"`,
+ );
+ expect(String(mockCredentials.none())).toMatchInlineSnapshot(
+ `"mockCredentials{nonePrincipal}"`,
+ );
+ });
});
diff --git a/packages/backend-test-utils/src/services/mockCredentials.ts b/packages/backend-test-utils/src/services/mockCredentials.ts
index 617ffdb240..d749f7edb1 100644
--- a/packages/backend-test-utils/src/services/mockCredentials.ts
+++ b/packages/backend-test-utils/src/services/mockCredentials.ts
@@ -76,10 +76,19 @@ export namespace mockCredentials {
* Creates a mocked credentials object for a unauthenticated principal.
*/
export function none(): BackstageCredentials {
- return {
+ const result = {
$$type: '@backstage/BackstageCredentials',
principal: { type: 'none' },
- };
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ writable: true,
+ value: () => `mockCredentials{nonePrincipal}`,
+ },
+ });
+ return result;
}
/**
@@ -111,24 +120,32 @@ export namespace mockCredentials {
options?: { actor?: { subject: string } },
): BackstageCredentials {
validateUserEntityRef(userEntityRef);
- return Object.defineProperty(
- {
- $$type: '@backstage/BackstageCredentials',
- principal: {
- type: 'user',
- userEntityRef,
- ...(options?.actor && {
- actor: { type: 'service', subject: options.actor.subject },
- }),
- },
+ const result = {
+ $$type: '@backstage/BackstageCredentials',
+ principal: {
+ type: 'user',
+ userEntityRef,
+ ...(options?.actor && {
+ actor: { type: 'service', subject: options.actor.subject } as const,
+ }),
},
- 'token',
- {
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ value: () =>
+ `mockCredentials{userPrincipal{${userEntityRef}${
+ options?.actor ? `,actor={${options.actor.subject}}` : ''
+ }}}`,
+ },
+ token: {
enumerable: false,
configurable: true,
value: user.token(),
},
- );
+ });
+ return result;
}
/**
@@ -231,14 +248,27 @@ export namespace mockCredentials {
subject: string = DEFAULT_MOCK_SERVICE_SUBJECT,
accessRestrictions?: BackstagePrincipalAccessRestrictions,
): BackstageCredentials {
- return {
+ const result = {
$$type: '@backstage/BackstageCredentials',
principal: {
type: 'service',
subject,
...(accessRestrictions ? { accessRestrictions } : {}),
},
- };
+ } as const;
+ Object.defineProperties(result, {
+ toString: {
+ enumerable: false,
+ configurable: true,
+ value: () =>
+ `mockCredentials{servicePrincipal{${subject}${
+ accessRestrictions
+ ? `,accessRestrictions=${JSON.stringify(accessRestrictions)}`
+ : ''
+ }}}`,
+ },
+ });
+ return result;
}
/**
diff --git a/packages/canon/css/avatar.css b/packages/canon/css/avatar.css
deleted file mode 100644
index c1f4cca59e..0000000000
--- a/packages/canon/css/avatar.css
+++ /dev/null
@@ -1,49 +0,0 @@
-.canon-AvatarRoot {
- vertical-align: middle;
- user-select: none;
- color: var(--canon-fg-primary);
- background-color: var(--canon-bg-surface-2);
- border-radius: 100%;
- justify-content: center;
- align-items: center;
- width: 2rem;
- height: 2rem;
- font-size: 1rem;
- font-weight: 500;
- line-height: 1;
- display: inline-flex;
- overflow: hidden;
-}
-
-.canon-AvatarRoot[data-size="small"] {
- width: 1.5rem;
- height: 1.5rem;
-}
-
-.canon-AvatarRoot[data-size="medium"] {
- width: 2rem;
- height: 2rem;
-}
-
-.canon-AvatarRoot[data-size="large"] {
- width: 3rem;
- height: 3rem;
-}
-
-.canon-AvatarImage {
- object-fit: cover;
- width: 100%;
- height: 100%;
-}
-
-.canon-AvatarFallback {
- width: 100%;
- height: 100%;
- font-size: var(--canon-font-size-3);
- font-weight: var(--canon-font-weight-regular);
- box-shadow: inset 0 0 0 1px var(--canon-border);
- border-radius: var(--canon-radius-full);
- justify-content: center;
- align-items: center;
- display: flex;
-}
diff --git a/packages/canon/css/box.css b/packages/canon/css/box.css
deleted file mode 100644
index 7a01d5aa3a..0000000000
--- a/packages/canon/css/box.css
+++ /dev/null
@@ -1,5 +0,0 @@
-.canon-Box {
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
-}
diff --git a/packages/canon/css/button.css b/packages/canon/css/button.css
deleted file mode 100644
index 7f15f4a541..0000000000
--- a/packages/canon/css/button.css
+++ /dev/null
@@ -1,89 +0,0 @@
-.canon-Button {
- user-select: none;
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-bold);
- cursor: pointer;
- border-radius: var(--canon-radius-2);
- justify-content: center;
- align-items: center;
- gap: var(--canon-space-1_5);
- border: none;
- padding: 0;
- display: inline-flex;
-
- &:disabled {
- cursor: not-allowed;
- }
-}
-
-.canon-Button[data-variant="primary"] {
- background-color: var(--canon-bg-solid);
- color: var(--canon-fg-solid);
- transition: background-color .15s, box-shadow .15s;
-
- &:hover {
- background-color: var(--canon-bg-solid-hover);
- }
-
- &:active {
- background-color: var(--canon-bg-solid-pressed);
- }
-
- &:focus-visible {
- outline: 2px solid var(--canon-ring);
- outline-offset: 2px;
- }
-
- &:disabled {
- background-color: var(--canon-bg-solid-disabled);
- color: var(--canon-fg-solid-disabled);
- }
-}
-
-.canon-Button[data-variant="secondary"] {
- background-color: var(--canon-bg-surface-1);
- box-shadow: inset 0 0 0 1px var(--canon-border);
- color: var(--canon-fg-primary);
- transition: box-shadow .15s;
-
- &:hover {
- box-shadow: inset 0 0 0 1px var(--canon-border-hover);
- }
-
- &:active {
- box-shadow: inset 0 0 0 1px var(--canon-border-pressed);
- }
-
- &:focus-visible {
- box-shadow: inset 0 0 0 2px var(--canon-ring);
- outline: none;
- transition: none;
- }
-
- &:disabled {
- box-shadow: inset 0 0 0 1px var(--canon-border-disabled);
- color: var(--canon-fg-disabled);
- }
-}
-
-.canon-Button[data-size="medium"] {
- font-size: var(--canon-font-size-4);
- padding: 0 var(--canon-space-3);
- height: 2.5rem;
-}
-
-.canon-Button[data-size="small"] {
- font-size: var(--canon-font-size-3);
- padding: 0 var(--canon-space-2);
- height: 2rem;
-}
-
-.canon-Button[data-size="small"] svg {
- width: 1rem;
- height: 1rem;
-}
-
-.canon-Button[data-size="medium"] svg {
- width: 1.25rem;
- height: 1.25rem;
-}
diff --git a/packages/canon/css/buttonicon.css b/packages/canon/css/buttonicon.css
deleted file mode 100644
index 1a791b481f..0000000000
--- a/packages/canon/css/buttonicon.css
+++ /dev/null
@@ -1,14 +0,0 @@
-.canon-ButtonIcon {
- justify-content: center;
- align-items: center;
-}
-
-.canon-ButtonIcon[data-size="small"] {
- width: 2rem;
- padding: 0;
-}
-
-.canon-ButtonIcon[data-size="medium"] {
- width: 2.5rem;
- padding: 0;
-}
diff --git a/packages/canon/css/checkbox.css b/packages/canon/css/checkbox.css
deleted file mode 100644
index f8a2cc32d5..0000000000
--- a/packages/canon/css/checkbox.css
+++ /dev/null
@@ -1,52 +0,0 @@
-.canon-CheckboxRoot {
- width: 1rem;
- height: 1rem;
- box-shadow: inset 0 0 0 1px var(--canon-border);
- cursor: pointer;
- background-color: var(--canon-bg-surface-1);
- border: none;
- border-radius: 2px;
- flex-shrink: 0;
- justify-content: center;
- align-items: center;
- padding: 0;
- transition: background-color .2s ease-in-out;
- display: flex;
-}
-
-.canon-CheckboxRoot:focus-visible {
- outline: 2px solid var(--canon-ring);
- outline-offset: 2px;
- transition: none;
-}
-
-.canon-CheckboxRoot[data-checked] {
- background-color: var(--canon-bg-solid);
- box-shadow: none;
- color: var(--canon-fg-solid);
-}
-
-.canon-CheckboxLabel {
- align-items: center;
- gap: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- user-select: none;
- flex-direction: row;
- display: flex;
-
- &:hover {
- & .canon-CheckboxRoot:not([data-checked]) {
- box-shadow: inset 0 0 0 1px var(--canon-border-hover);
- }
- }
-}
-
-.canon-CheckboxIndicator {
- color: var(--canon-fg-solid);
- justify-content: center;
- align-items: center;
- display: flex;
-}
diff --git a/packages/canon/css/collapsible.css b/packages/canon/css/collapsible.css
deleted file mode 100644
index e5508f1ecb..0000000000
--- a/packages/canon/css/collapsible.css
+++ /dev/null
@@ -1,10 +0,0 @@
-.canon-CollapsiblePanel {
- height: var(--collapsible-panel-height);
- transition: all .15s ease-out;
- display: flex;
- overflow: hidden;
-
- &[data-starting-style], &[data-ending-style] {
- height: 0;
- }
-}
diff --git a/packages/canon/css/components.css b/packages/canon/css/components.css
deleted file mode 100644
index 327f168696..0000000000
--- a/packages/canon/css/components.css
+++ /dev/null
@@ -1,1263 +0,0 @@
-.canon-AvatarRoot {
- vertical-align: middle;
- user-select: none;
- color: var(--canon-fg-primary);
- background-color: var(--canon-bg-surface-2);
- border-radius: 100%;
- justify-content: center;
- align-items: center;
- width: 2rem;
- height: 2rem;
- font-size: 1rem;
- font-weight: 500;
- line-height: 1;
- display: inline-flex;
- overflow: hidden;
-}
-
-.canon-AvatarRoot[data-size="small"] {
- width: 1.5rem;
- height: 1.5rem;
-}
-
-.canon-AvatarRoot[data-size="medium"] {
- width: 2rem;
- height: 2rem;
-}
-
-.canon-AvatarRoot[data-size="large"] {
- width: 3rem;
- height: 3rem;
-}
-
-.canon-AvatarImage {
- object-fit: cover;
- width: 100%;
- height: 100%;
-}
-
-.canon-AvatarFallback {
- width: 100%;
- height: 100%;
- font-size: var(--canon-font-size-3);
- font-weight: var(--canon-font-weight-regular);
- box-shadow: inset 0 0 0 1px var(--canon-border);
- border-radius: var(--canon-radius-full);
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-Box {
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
-}
-
-.canon-Button {
- user-select: none;
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-bold);
- cursor: pointer;
- border-radius: var(--canon-radius-2);
- justify-content: center;
- align-items: center;
- gap: var(--canon-space-1_5);
- border: none;
- padding: 0;
- display: inline-flex;
-
- &:disabled {
- cursor: not-allowed;
- }
-}
-
-.canon-Button[data-variant="primary"] {
- background-color: var(--canon-bg-solid);
- color: var(--canon-fg-solid);
- transition: background-color .15s, box-shadow .15s;
-
- &:hover {
- background-color: var(--canon-bg-solid-hover);
- }
-
- &:active {
- background-color: var(--canon-bg-solid-pressed);
- }
-
- &:focus-visible {
- outline: 2px solid var(--canon-ring);
- outline-offset: 2px;
- }
-
- &:disabled {
- background-color: var(--canon-bg-solid-disabled);
- color: var(--canon-fg-solid-disabled);
- }
-}
-
-.canon-Button[data-variant="secondary"] {
- background-color: var(--canon-bg-surface-1);
- box-shadow: inset 0 0 0 1px var(--canon-border);
- color: var(--canon-fg-primary);
- transition: box-shadow .15s;
-
- &:hover {
- box-shadow: inset 0 0 0 1px var(--canon-border-hover);
- }
-
- &:active {
- box-shadow: inset 0 0 0 1px var(--canon-border-pressed);
- }
-
- &:focus-visible {
- box-shadow: inset 0 0 0 2px var(--canon-ring);
- outline: none;
- transition: none;
- }
-
- &:disabled {
- box-shadow: inset 0 0 0 1px var(--canon-border-disabled);
- color: var(--canon-fg-disabled);
- }
-}
-
-.canon-Button[data-size="medium"] {
- font-size: var(--canon-font-size-4);
- padding: 0 var(--canon-space-3);
- height: 2.5rem;
-}
-
-.canon-Button[data-size="small"] {
- font-size: var(--canon-font-size-3);
- padding: 0 var(--canon-space-2);
- height: 2rem;
-}
-
-.canon-Button[data-size="small"] svg {
- width: 1rem;
- height: 1rem;
-}
-
-.canon-Button[data-size="medium"] svg {
- width: 1.25rem;
- height: 1.25rem;
-}
-
-.canon-ButtonIcon {
- justify-content: center;
- align-items: center;
-}
-
-.canon-ButtonIcon[data-size="small"] {
- width: 2rem;
- padding: 0;
-}
-
-.canon-ButtonIcon[data-size="medium"] {
- width: 2.5rem;
- padding: 0;
-}
-
-.canon-CheckboxRoot {
- width: 1rem;
- height: 1rem;
- box-shadow: inset 0 0 0 1px var(--canon-border);
- cursor: pointer;
- background-color: var(--canon-bg-surface-1);
- border: none;
- border-radius: 2px;
- flex-shrink: 0;
- justify-content: center;
- align-items: center;
- padding: 0;
- transition: background-color .2s ease-in-out;
- display: flex;
-}
-
-.canon-CheckboxRoot:focus-visible {
- outline: 2px solid var(--canon-ring);
- outline-offset: 2px;
- transition: none;
-}
-
-.canon-CheckboxRoot[data-checked] {
- background-color: var(--canon-bg-solid);
- box-shadow: none;
- color: var(--canon-fg-solid);
-}
-
-.canon-CheckboxLabel {
- align-items: center;
- gap: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- user-select: none;
- flex-direction: row;
- display: flex;
-
- &:hover {
- & .canon-CheckboxRoot:not([data-checked]) {
- box-shadow: inset 0 0 0 1px var(--canon-border-hover);
- }
- }
-}
-
-.canon-CheckboxIndicator {
- color: var(--canon-fg-solid);
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-CollapsiblePanel {
- height: var(--collapsible-panel-height);
- transition: all .15s ease-out;
- display: flex;
- overflow: hidden;
-
- &[data-starting-style], &[data-ending-style] {
- height: 0;
- }
-}
-
-.canon-Container {
- max-width: 120rem;
- padding-inline: var(--canon-space-4);
- margin-inline: auto;
- transition: padding .2s ease-in-out;
-}
-
-@media (width >= 640px) {
- .canon-Container {
- padding-inline: var(--canon-space-8);
- }
-}
-
-@media (width >= 1024px) {
- .canon-Container {
- padding-inline: var(--canon-space-12);
- }
-}
-
-.canon-DataTableRoot {
- gap: var(--canon-space-3);
- flex-direction: column;
- display: flex;
-}
-
-.canon-DataTablePagination {
- padding-top: var(--canon-space-5);
- justify-content: space-between;
- align-items: center;
- display: flex;
-}
-
-.canon-DataTablePagination--left {
- justify-content: space-between;
- align-items: center;
- display: flex;
-}
-
-.canon-DataTablePagination--right {
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- display: flex;
-}
-
-.canon-DataTablePagination--select {
- min-width: 10.5rem;
-}
-
-.canon-FieldLabel {
- margin-bottom: var(--canon-space-3);
- gap: var(--canon-space-1);
- flex-direction: column;
- display: flex;
-}
-
-.canon-FieldLabelLabel {
- color: var(--canon-fg-primary);
- cursor: pointer;
- font-weight: var(--canon-font-weight-regular);
- font-size: var(--canon-font-size-2);
- margin-right: auto;
-}
-
-.canon-FieldLabelSecondaryLabel {
- color: var(--canon-fg-secondary);
- font-weight: var(--canon-font-weight-regular);
- margin-left: var(--canon-space-1);
-}
-
-.canon-FieldLabelDescription {
- font-weight: var(--canon-font-weight-regular);
- font-size: var(--canon-font-size-2);
- color: var(--canon-fg-secondary);
- margin: 0;
-}
-
-.canon-Flex {
- min-width: 0;
- display: flex;
-}
-
-.canon-Grid {
- display: grid;
-}
-
-.canon-Heading {
- font-family: var(--canon-font-regular);
- color: var(--canon-fg-primary);
- margin: 0;
- padding: 0;
- line-height: 100%;
-}
-
-.canon-Heading[data-variant="display"] {
- font-size: var(--canon-font-size-10);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title1"] {
- font-size: var(--canon-font-size-9);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title2"] {
- font-size: var(--canon-font-size-8);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title3"] {
- font-size: var(--canon-font-size-7);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title4"] {
- font-size: var(--canon-font-size-6);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title5"] {
- font-size: var(--canon-font-size-5);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-color="primary"] {
- color: var(--canon-fg-primary);
-}
-
-.canon-Heading[data-color="secondary"] {
- color: var(--canon-fg-secondary);
-}
-
-.canon-Heading[data-truncate] {
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
-}
-
-.canon-Icon {
- width: 1rem;
- height: 1rem;
-}
-
-.canon-Link {
- font-family: var(--canon-font-regular);
- color: var(--canon-fg-link);
- cursor: pointer;
- margin: 0;
- padding: 0;
- text-decoration-line: none;
-
- &:hover {
- color: var(--canon-fg-link-hover);
- text-underline-offset: calc(.025em + 2px);
- text-decoration-line: underline;
- text-decoration-style: solid;
- text-decoration-thickness: min(2px, max(1px, .05em));
- text-decoration-color: color-mix(in srgb, var(--canon-fg-link-hover) 30%, transparent);
- }
-}
-
-.canon-Link[data-variant="body"] {
- font-size: var(--canon-font-size-3);
- line-height: 140%;
-}
-
-.canon-Link[data-variant="subtitle"] {
- font-size: var(--canon-font-size-4);
- line-height: 140%;
-}
-
-.canon-Link[data-variant="caption"] {
- font-size: var(--canon-font-size-2);
- line-height: 140%;
-}
-
-.canon-Link[data-variant="label"] {
- font-size: var(--canon-font-size-1);
- line-height: 140%;
-}
-
-.canon-Link[data-weight="regular"] {
- font-weight: var(--canon-font-weight-regular);
-}
-
-.canon-Link[data-weight="bold"] {
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-MenuPositioner {
- outline: 0;
-}
-
-.canon-MenuPopup {
- background-color: var(--canon-bg-surface-1);
- border: 1px solid var(--canon-border);
- color: var(--canon-fg-primary);
- transform-origin: var(--transform-origin);
- max-width: min(var(--available-width), 340px);
- max-height: min(var(--available-height), 500px);
- padding-bottom: var(--canon-space-1);
- border-radius: .375rem;
- outline: none;
- flex-direction: column;
- transition: transform .15s, opacity .15s;
- display: flex;
- position: relative;
- overflow: auto;
-
- &[data-starting-style], &[data-ending-style] {
- opacity: 0;
- transform: scale(.9);
- }
-}
-
-.canon-MenuItem {
- user-select: none;
- align-items: center;
- gap: var(--canon-space-2);
- height: 32px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- margin-inline: var(--canon-space-1);
- padding-inline: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- cursor: pointer;
- outline: 0;
- flex-shrink: 0;
- text-decoration: none;
- display: flex;
-
- &:first-child {
- margin-top: var(--canon-space-1);
- }
-
- &[data-highlighted] {
- background-color: var(--canon-gray-3);
- }
-}
-
-.canon-MenuSubmenuTrigger {
- user-select: none;
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- height: 32px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- margin-inline: var(--canon-space-1);
- padding-inline: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- cursor: pointer;
- outline: 0;
- flex-shrink: 0;
- text-decoration: none;
- display: flex;
-
- & .canon-Icon {
- color: var(--canon-fg-secondary);
- }
-
- &:first-child {
- margin-top: var(--canon-space-1);
- }
-
- &[data-popup-open], &[data-highlighted] {
- background-color: var(--canon-gray-3);
-
- & .canon-Icon {
- color: var(--canon-fg-primary);
- }
- }
-}
-
-.canon-MenuSeparator {
- background-color: var(--color-gray-200);
- height: 1px;
- margin: .375rem 1rem;
-}
-
-.canon-SubmenuComboboxSearch {
- padding-inline: var(--canon-space-3);
- border: none;
- border-bottom: 1px solid var(--canon-border);
- background-color: var(--canon-bg-surface-1);
- width: 100%;
- height: 32px;
- color: var(--canon-fg-primary);
- line-height: 140%;
- font-size: var(--canon-font-size-3);
- z-index: 1;
- outline: none;
- position: sticky;
- top: 0;
-
- &::placeholder {
- color: var(--canon-fg-secondary);
- }
-
- &:disabled {
- opacity: .6;
- cursor: not-allowed;
- }
-}
-
-.canon-SubmenuComboboxItems {
- padding-top: var(--canon-space-2);
- outline: none;
- flex-direction: column;
- display: flex;
- overflow-y: auto;
-}
-
-.canon-SubmenuComboboxNoResults {
- padding-inline: var(--canon-space-3);
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-4);
- color: var(--canon-fg-secondary);
- font-size: var(--canon-font-size-3);
-}
-
-.canon-SubmenuComboboxItem {
- user-select: none;
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- height: 32px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- margin-inline: var(--canon-space-1);
- padding-inline: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- cursor: pointer;
- outline: 0;
- flex-shrink: 0;
- text-decoration: none;
- display: flex;
-
- &[data-highlighted] {
- background-color: var(--canon-gray-3);
- }
-
- &[data-disabled] {
- opacity: .5;
- cursor: not-allowed;
- }
-}
-
-.canon-SubmenuComboboxItemCheckbox {
- width: 16px;
- height: 16px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- border: 1px solid var(--canon-border);
- background: var(--canon-bg-surface-1);
- flex-shrink: 0;
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-SubmenuComboboxItemLabel {
- text-overflow: ellipsis;
- white-space: nowrap;
- flex: 1;
- overflow: hidden;
-}
-
-.canon-TableRoot {
- caption-side: bottom;
- border-collapse: collapse;
- width: 100%;
-}
-
-.canon-TableHead {
- text-align: left;
- padding: var(--canon-space-3);
- font-size: var(--canon-font-size-3);
- color: var(--canon-fg-primary);
-}
-
-.canon-TableBody {
- color: var(--canon-fg-primary);
-}
-
-.canon-TableRow {
- border-bottom: 1px solid var(--canon-border);
- transition: color .2s ease-in-out;
-}
-
-.canon-TableBody .canon-TableRow:hover {
- background-color: var(--canon-gray-2);
-}
-
-.canon-TableCell {
- padding: var(--canon-space-3);
- font-size: var(--canon-font-size-3);
-}
-
-.canon-TableCellText, .canon-TableCellLink {
- gap: var(--canon-space-0_5);
- flex-direction: column;
- display: flex;
-}
-
-.canon-TableCellProfile {
- gap: var(--canon-space-2);
- flex-direction: row;
- align-items: center;
- display: flex;
-}
-
-.canon-TableCellProfileAvatar {
- vertical-align: middle;
- user-select: none;
- color: var(--canon-fg-primary);
- background-color: var(--canon-bg-surface-2);
- border-radius: 100%;
- justify-content: center;
- align-items: center;
- width: 1.25rem;
- height: 1.25rem;
- font-size: 1rem;
- font-weight: 500;
- line-height: 1;
- display: inline-flex;
- overflow: hidden;
-}
-
-.canon-TableCellProfileAvatarImage {
- object-fit: cover;
- width: 100%;
- height: 100%;
-}
-
-.canon-TableCellProfileAvatarFallback {
- width: 100%;
- height: 100%;
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- box-shadow: inset 0 0 0 1px var(--canon-border);
- border-radius: var(--canon-radius-full);
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-TabsRoot {
- border: 1px solid var(--color-gray-200);
- border-radius: .375rem;
-}
-
-.canon-TabsList {
- z-index: 0;
- display: flex;
- position: relative;
-}
-
-.canon-TabsTab {
- appearance: none;
- color: var(--canon-fg-secondary);
- user-select: none;
- padding-inline: var(--canon-space-3);
- height: 2rem;
- font-family: inherit;
- font-size: .875rem;
- font-weight: 500;
- line-height: 1.25rem;
- font-size: var(--canon-font-size-2);
- cursor: pointer;
- background: none;
- border: 0;
- outline: 0;
- justify-content: center;
- align-items: center;
- margin: 0;
- padding-block: 0;
- transition: color .2s ease-in-out;
- display: flex;
-
- &[data-selected] {
- color: var(--canon-fg-primary);
- }
-
- @media (hover: hover) {
- &:hover {
- color: var(--canon-fg-primary);
- }
- }
-
- &:focus-visible {
- position: relative;
-
- &:before {
- content: "";
- outline: 1px solid var(--canon-ring);
- outline-offset: -1px;
- border-radius: .25rem;
- position: absolute;
- inset: .25rem 0;
- }
- }
-}
-
-.canon-TabsIndicator {
- z-index: -1;
- translate: var(--active-tab-left) -50%;
- width: var(--active-tab-width);
- background-color: var(--canon-bg-solid);
- height: 1px;
- transition-property: translate, width;
- transition-duration: .2s;
- transition-timing-function: ease-in-out;
- position: absolute;
- bottom: 0;
- left: 0;
-}
-
-.canon-TabsPanel {
- &[hidden] {
- display: none;
- }
-}
-
-.canon-Text {
- font-family: var(--canon-font-regular);
- margin: 0;
- padding: 0;
-}
-
-.canon-Text[data-variant="body"] {
- font-size: var(--canon-font-size-3);
- line-height: 140%;
-}
-
-.canon-Text[data-variant="subtitle"] {
- font-size: var(--canon-font-size-4);
- line-height: 140%;
-}
-
-.canon-Text[data-variant="caption"] {
- font-size: var(--canon-font-size-2);
- line-height: 140%;
-}
-
-.canon-Text[data-variant="label"] {
- font-size: var(--canon-font-size-1);
- line-height: 140%;
-}
-
-.canon-Text[data-weight="regular"] {
- font-weight: var(--canon-font-weight-regular);
-}
-
-.canon-Text[data-weight="bold"] {
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Text[data-color="primary"] {
- color: var(--canon-fg-primary);
-}
-
-.canon-Text[data-color="secondary"] {
- color: var(--canon-fg-secondary);
-}
-
-.canon-Text[data-color="danger"] {
- color: var(--canon-fg-danger);
-}
-
-.canon-Text[data-color="warning"] {
- color: var(--canon-fg-warning);
-}
-
-.canon-Text[data-color="success"] {
- color: var(--canon-fg-success);
-}
-
-.canon-Text[data-truncate] {
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
-}
-
-.canon-TextField {
- font-family: var(--canon-font-regular);
- flex-direction: column;
- width: 100%;
- display: flex;
-}
-
-.canon-TextFieldInputWrapper {
- position: relative;
-}
-
-.canon-TextFieldInputWrapper[data-size="small"] {
- height: 2rem;
-}
-
-.canon-TextFieldInputWrapper[data-size="medium"] {
- height: 2.5rem;
-}
-
-.canon-TextFieldIcon {
- left: var(--canon-space-3);
- margin-right: var(--canon-space-1);
- color: var(--canon-fg-primary);
- flex-shrink: 0;
- position: absolute;
- top: 50%;
- transform: translateY(-50%);
-}
-
-.canon-TextFieldIcon[data-size="small"], .canon-TextFieldIcon[data-size="small"] svg {
- width: 1rem;
- height: 1rem;
-}
-
-.canon-TextFieldIcon[data-size="medium"], .canon-TextFieldIcon[data-size="medium"] svg {
- width: 1.25rem;
- height: 1.25rem;
-}
-
-.canon-TextFieldInput {
- padding: 0 var(--canon-space-3);
- border-radius: var(--canon-radius-3);
- border: 1px solid var(--canon-border);
- background-color: var(--canon-bg-surface-1);
- font-size: var(--canon-font-size-3);
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- width: 100%;
- height: 100%;
- cursor: inherit;
- align-items: center;
- transition: border-color .2s ease-in-out, outline-color .2s ease-in-out;
- display: flex;
-}
-
-.canon-TextFieldInput::placeholder {
- color: var(--canon-fg-secondary);
-}
-
-.canon-TextFieldInput[data-icon] {
- padding-left: var(--canon-space-8);
-}
-
-.canon-TextFieldInput[data-focused] {
- outline-color: var(--canon-border-pressed);
- outline-width: 0;
-}
-
-.canon-TextFieldInput[data-hovered] {
- border-color: var(--canon-border-hover);
-}
-
-.canon-TextFieldInput[data-focused] {
- border-color: var(--canon-border-pressed);
- outline-width: 0;
-}
-
-.canon-TextFieldInput[data-invalid] {
- border-color: var(--canon-fg-danger);
-}
-
-.canon-TextFieldInput[data-disabled] {
- opacity: .5;
- cursor: not-allowed;
- border: 1px solid var(--canon-border-disabled);
-}
-
-.canon-TextFieldError {
- color: var(--canon-fg-danger);
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- margin-top: var(--canon-space-2);
-}
-
-.canon-TooltipPopup {
- box-sizing: border-box;
- transform-origin: var(--transform-origin);
- background-color: canvas;
- background-color: var(--canon-bg-surface-1);
- color: var(--canon-fg-primary);
- outline: 1px solid var(--canon-border);
- box-shadow: 0 10px 15px -3px var(--canon-border), 0 4px 6px -4px var(--canon-border);
- border-radius: .375rem;
- flex-direction: column;
- padding: .25rem .5rem;
- font-size: .875rem;
- line-height: 1.25rem;
- transition: transform .15s, opacity .15s;
- display: flex;
-
- &[data-starting-style], &[data-ending-style] {
- opacity: 0;
- transform: scale(.9);
- }
-
- &[data-instant] {
- transition-duration: 0s;
- }
-}
-
-.canon-TooltipArrow {
- display: flex;
-
- &[data-side="top"] {
- bottom: -8px;
- rotate: 180deg;
- }
-
- &[data-side="bottom"] {
- top: -8px;
- rotate: none;
- }
-
- &[data-side="left"] {
- right: -13px;
- rotate: 90deg;
- }
-
- &[data-side="right"] {
- left: -13px;
- rotate: -90deg;
- }
-}
-
-.canon-TooltipArrow-fill {
- fill: var(--canon-bg-surface-1);
-}
-
-.canon-TooltipArrow-outer-stroke {
- @media (prefers-color-scheme: light) {
- & {
- fill: var(--canon-border);
- }
- }
-}
-
-.canon-ScrollAreaRoot {
- box-sizing: border-box;
- width: 24rem;
- max-width: calc(100vw - 8rem);
- height: 8.5rem;
-}
-
-.canon-ScrollAreaViewport {
- overscroll-behavior: contain;
- height: 100%;
-}
-
-.canon-ScrollAreaContent {
- padding-block: .75rem;
- flex-direction: column;
- gap: 1rem;
- padding-left: 1rem;
- padding-right: 1.5rem;
- display: flex;
-}
-
-.canon-ScrollAreaScrollbar {
- background-color: var(--canon-scrollbar);
- opacity: 0;
- border-radius: .375rem;
- justify-content: center;
- width: .25rem;
- margin: .5rem;
- transition: opacity .15s .3s;
- display: flex;
-
- &[data-hovering], &[data-scrolling] {
- opacity: 1;
- transition-duration: 75ms;
- transition-delay: 0s;
- }
-
- &:before {
- content: "";
- width: 1.25rem;
- height: 100%;
- position: absolute;
- }
-}
-
-.canon-ScrollAreaThumb {
- border-radius: inherit;
- background-color: var(--canon-scrollbar-thumb);
- width: 100%;
-}
-
-.canon-Select {
- font-family: var(--canon-font-regular);
- flex-direction: column;
- width: 100%;
- display: flex;
-}
-
-.canon-SelectLabel {
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- margin-bottom: var(--canon-space-1_5);
- cursor: pointer;
-}
-
-.canon-SelectLabel[data-disabled] {
- cursor: default;
-}
-
-.canon-SelectDescription {
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-secondary);
- padding-top: var(--canon-space-1_5);
- margin: 0;
-}
-
-.canon-SelectError {
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-danger);
- padding-top: var(--canon-space-1_5);
- margin: 0;
-}
-
-.canon-SelectTrigger {
- box-sizing: border-box;
- border-radius: var(--canon-radius-3);
- border: 1px solid var(--canon-border);
- padding: 0 var(--canon-space-4);
- background-color: var(--canon-bg-surface-1);
- font-size: var(--canon-font-size-3);
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- cursor: pointer;
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- width: 100%;
- transition: border-color .2s ease-in-out, outline-color .2s ease-in-out;
- display: flex;
-}
-
-.canon-SelectTrigger::placeholder {
- color: var(--canon-fg-secondary);
-}
-
-.canon-SelectTrigger:hover {
- border-color: var(--canon-border-hover);
-}
-
-.canon-SelectTrigger:focus-visible {
- border-color: var(--canon-border-pressed);
- outline: 0;
-}
-
-.canon-SelectTrigger[data-invalid] {
- border-color: var(--canon-fg-danger);
-}
-
-.canon-SelectTrigger[data-invalid]:hover, .canon-SelectTrigger[data-invalid]:focus-visible {
- border-width: 2px;
-}
-
-.canon-SelectTrigger[data-disabled] {
- cursor: not-allowed;
- border-color: var(--canon-border-disabled);
- color: var(--canon-fg-disabled);
-}
-
-.canon-SelectTrigger[data-size="small"] {
- height: 2rem;
-}
-
-.canon-SelectTrigger[data-size="medium"] {
- height: 3rem;
-}
-
-.canon-SelectIcon {
- margin-left: var(--canon-space-5);
- transition: transform .2s;
-}
-
-.canon-SelectTrigger[data-popup-open] .canon-SelectIcon {
- transform: rotate(180deg);
-}
-
-.canon-SelectPopup {
- box-sizing: border-box;
- max-height: var(--available-height);
- background-color: var(--canon-bg-surface-1);
- border: 1px solid var(--canon-border);
- border-radius: var(--canon-radius-3);
- padding-block: var(--canon-space-1);
- z-index: 1;
- transform-origin: var(--transform-origin);
- outline: 0;
- transition: transform .15s, opacity .15s;
- overflow-y: auto;
- box-shadow: 0 4px 12px #0003;
-}
-
-.canon-SelectPopup[data-starting-style], .canon-SelectPopup[data-ending-style] {
- opacity: 0;
- transform: scale(.9);
-}
-
-.canon-SelectItem {
- width: var(--anchor-width);
- padding-block: var(--canon-space-2);
- padding-inline: var(--canon-space-4);
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-3);
- cursor: pointer;
- user-select: none;
- font-size: var(--canon-font-size-3);
- align-items: center;
- gap: var(--canon-space-2);
- outline: none;
- grid-template-columns: 1rem 1fr;
- grid-template-areas: "icon text";
- display: grid;
- position: relative;
-}
-
-.canon-SelectItem[data-highlighted] {
- z-index: 0;
- color: var(--canon-fg-primary);
- position: relative;
-}
-
-.canon-SelectItem[data-highlighted]:before {
- content: "";
- z-index: -1;
- background-color: var(--canon-bg-tint-hover);
- border-radius: .25rem;
- position: absolute;
- inset-block: 0;
- inset-inline: .25rem;
-}
-
-.canon-SelectItem[data-disabled] {
- cursor: not-allowed;
- color: var(--canon-fg-disabled);
-}
-
-.canon-SelectItemIndicator {
- grid-area: icon;
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-SelectItemText {
- flex: 1;
- grid-area: text;
-}
-
-.canon-SelectRequired {
- color: var(--canon-fg-secondary);
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- margin-left: var(--canon-space-1);
-}
-
-.canon-SelectIcon {
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-SelectValue {
- text-overflow: ellipsis;
- white-space: nowrap;
- width: 100%;
- overflow: hidden;
-}
-
-.canon-Switch {
- align-items: center;
- gap: var(--canon-space-3);
- font-size: var(--canon-font-size-3);
- color: var(--canon-fg-primary);
- cursor: pointer;
- display: flex;
- position: relative;
-
- &[data-pressed] .canon-SwitchIndicator {
- &:before {
- background: var(--canon-fg-solid);
- }
- }
-
- &[data-selected] {
- & .canon-SwitchIndicator {
- background: var(--canon-bg-solid);
-
- &:before {
- background: var(--canon-fg-solid);
- transform: translateX(100%);
- }
- }
-
- &[data-pressed] {
- & .indicator {
- background: var(--canon-gray-3);
- }
- }
- }
-
- &[data-focus-visible] .canon-SwitchIndicator {
- outline-offset: 2px;
- outline: 2px solid;
- }
-}
-
-.canon-SwitchIndicator {
- background: var(--canon-gray-3);
- border: 2px;
- border-radius: 1.143rem;
- width: 2rem;
- height: 1.143rem;
- transition: all .2s;
-
- &:before {
- content: "";
- background: var(--canon-fg-solid);
- border-radius: 16px;
- width: .857rem;
- height: .857rem;
- margin: .143rem;
- transition: all .2s;
- display: block;
- }
-}
diff --git a/packages/canon/css/container.css b/packages/canon/css/container.css
deleted file mode 100644
index 47744cce1e..0000000000
--- a/packages/canon/css/container.css
+++ /dev/null
@@ -1,18 +0,0 @@
-.canon-Container {
- max-width: 120rem;
- padding-inline: var(--canon-space-4);
- margin-inline: auto;
- transition: padding .2s ease-in-out;
-}
-
-@media (width >= 640px) {
- .canon-Container {
- padding-inline: var(--canon-space-8);
- }
-}
-
-@media (width >= 1024px) {
- .canon-Container {
- padding-inline: var(--canon-space-12);
- }
-}
diff --git a/packages/canon/css/core.css b/packages/canon/css/core.css
deleted file mode 100644
index ffdde83d72..0000000000
--- a/packages/canon/css/core.css
+++ /dev/null
@@ -1,9223 +0,0 @@
-/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
-@layer base {
- *, :before, :after {
- box-sizing: border-box;
- }
-
- html {
- -webkit-text-size-adjust: 100%;
- tab-size: 4;
- font-family: system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
- line-height: 1.15;
- }
-
- body {
- margin: 0;
- }
-
- b, strong {
- font-weight: bolder;
- }
-
- code, kbd, samp, pre {
- font-family: ui-monospace, SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
- font-size: 1em;
- }
-
- small {
- font-size: 80%;
- }
-
- sub, sup {
- vertical-align: baseline;
- font-size: 75%;
- line-height: 0;
- position: relative;
- }
-
- sub {
- bottom: -.25em;
- }
-
- sup {
- top: -.5em;
- }
-
- table {
- border-color: currentColor;
- }
-
- button, input, optgroup, select, textarea {
- margin: 0;
- font-family: inherit;
- font-size: 100%;
- line-height: 1.15;
- }
-
- button, [type="button"], [type="reset"], [type="submit"] {
- -webkit-appearance: button;
- }
-
- legend {
- padding: 0;
- }
-
- progress {
- vertical-align: baseline;
- }
-
- ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
- height: auto;
- }
-
- [type="search"] {
- -webkit-appearance: textfield;
- outline-offset: -2px;
- }
-
- ::-webkit-search-decoration {
- -webkit-appearance: none;
- }
-
- ::-webkit-file-upload-button {
- -webkit-appearance: button;
- font: inherit;
- }
-
- summary {
- display: list-item;
- }
-}
-
-.cu-p {
- padding: var(--p);
-}
-
-.cu-p-0\.5 {
- padding: var(--canon-space-0_5);
-}
-
-.cu-p-1 {
- padding: var(--canon-space-1);
-}
-
-.cu-p-1\.5 {
- padding: var(--canon-space-1_5);
-}
-
-.cu-p-2 {
- padding: var(--canon-space-2);
-}
-
-.cu-p-3 {
- padding: var(--canon-space-3);
-}
-
-.cu-p-4 {
- padding: var(--canon-space-4);
-}
-
-.cu-p-5 {
- padding: var(--canon-space-5);
-}
-
-.cu-p-6 {
- padding: var(--canon-space-6);
-}
-
-.cu-p-7 {
- padding: var(--canon-space-7);
-}
-
-.cu-p-8 {
- padding: var(--canon-space-8);
-}
-
-.cu-p-9 {
- padding: var(--canon-space-9);
-}
-
-.cu-p-10 {
- padding: var(--canon-space-10);
-}
-
-.cu-p-11 {
- padding: var(--canon-space-11);
-}
-
-.cu-p-12 {
- padding: var(--canon-space-12);
-}
-
-.cu-p-13 {
- padding: var(--canon-space-13);
-}
-
-.cu-p-14 {
- padding: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-p {
- padding: var(--p-xs);
- }
-
- .xs\:cu-p-0\.5 {
- padding: var(--canon-space-0_5);
- }
-
- .xs\:cu-p-1 {
- padding: var(--canon-space-1);
- }
-
- .xs\:cu-p-1\.5 {
- padding: var(--canon-space-1_5);
- }
-
- .xs\:cu-p-2 {
- padding: var(--canon-space-2);
- }
-
- .xs\:cu-p-3 {
- padding: var(--canon-space-3);
- }
-
- .xs\:cu-p-4 {
- padding: var(--canon-space-4);
- }
-
- .xs\:cu-p-5 {
- padding: var(--canon-space-5);
- }
-
- .xs\:cu-p-6 {
- padding: var(--canon-space-6);
- }
-
- .xs\:cu-p-7 {
- padding: var(--canon-space-7);
- }
-
- .xs\:cu-p-8 {
- padding: var(--canon-space-8);
- }
-
- .xs\:cu-p-9 {
- padding: var(--canon-space-9);
- }
-
- .xs\:cu-p-10 {
- padding: var(--canon-space-10);
- }
-
- .xs\:cu-p-11 {
- padding: var(--canon-space-11);
- }
-
- .xs\:cu-p-12 {
- padding: var(--canon-space-12);
- }
-
- .xs\:cu-p-13 {
- padding: var(--canon-space-13);
- }
-
- .xs\:cu-p-14 {
- padding: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-p {
- padding: var(--p-sm);
- }
-
- .sm\:cu-p-0\.5 {
- padding: var(--canon-space-0_5);
- }
-
- .sm\:cu-p-1 {
- padding: var(--canon-space-1);
- }
-
- .sm\:cu-p-1\.5 {
- padding: var(--canon-space-1_5);
- }
-
- .sm\:cu-p-2 {
- padding: var(--canon-space-2);
- }
-
- .sm\:cu-p-3 {
- padding: var(--canon-space-3);
- }
-
- .sm\:cu-p-4 {
- padding: var(--canon-space-4);
- }
-
- .sm\:cu-p-5 {
- padding: var(--canon-space-5);
- }
-
- .sm\:cu-p-6 {
- padding: var(--canon-space-6);
- }
-
- .sm\:cu-p-7 {
- padding: var(--canon-space-7);
- }
-
- .sm\:cu-p-8 {
- padding: var(--canon-space-8);
- }
-
- .sm\:cu-p-9 {
- padding: var(--canon-space-9);
- }
-
- .sm\:cu-p-10 {
- padding: var(--canon-space-10);
- }
-
- .sm\:cu-p-11 {
- padding: var(--canon-space-11);
- }
-
- .sm\:cu-p-12 {
- padding: var(--canon-space-12);
- }
-
- .sm\:cu-p-13 {
- padding: var(--canon-space-13);
- }
-
- .sm\:cu-p-14 {
- padding: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-p {
- padding: var(--p-md);
- }
-
- .md\:cu-p-0\.5 {
- padding: var(--canon-space-0_5);
- }
-
- .md\:cu-p-1 {
- padding: var(--canon-space-1);
- }
-
- .md\:cu-p-1\.5 {
- padding: var(--canon-space-1_5);
- }
-
- .md\:cu-p-2 {
- padding: var(--canon-space-2);
- }
-
- .md\:cu-p-3 {
- padding: var(--canon-space-3);
- }
-
- .md\:cu-p-4 {
- padding: var(--canon-space-4);
- }
-
- .md\:cu-p-5 {
- padding: var(--canon-space-5);
- }
-
- .md\:cu-p-6 {
- padding: var(--canon-space-6);
- }
-
- .md\:cu-p-7 {
- padding: var(--canon-space-7);
- }
-
- .md\:cu-p-8 {
- padding: var(--canon-space-8);
- }
-
- .md\:cu-p-9 {
- padding: var(--canon-space-9);
- }
-
- .md\:cu-p-10 {
- padding: var(--canon-space-10);
- }
-
- .md\:cu-p-11 {
- padding: var(--canon-space-11);
- }
-
- .md\:cu-p-12 {
- padding: var(--canon-space-12);
- }
-
- .md\:cu-p-13 {
- padding: var(--canon-space-13);
- }
-
- .md\:cu-p-14 {
- padding: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-p {
- padding: var(--p-lg);
- }
-
- .lg\:cu-p-0\.5 {
- padding: var(--canon-space-0_5);
- }
-
- .lg\:cu-p-1 {
- padding: var(--canon-space-1);
- }
-
- .lg\:cu-p-1\.5 {
- padding: var(--canon-space-1_5);
- }
-
- .lg\:cu-p-2 {
- padding: var(--canon-space-2);
- }
-
- .lg\:cu-p-3 {
- padding: var(--canon-space-3);
- }
-
- .lg\:cu-p-4 {
- padding: var(--canon-space-4);
- }
-
- .lg\:cu-p-5 {
- padding: var(--canon-space-5);
- }
-
- .lg\:cu-p-6 {
- padding: var(--canon-space-6);
- }
-
- .lg\:cu-p-7 {
- padding: var(--canon-space-7);
- }
-
- .lg\:cu-p-8 {
- padding: var(--canon-space-8);
- }
-
- .lg\:cu-p-9 {
- padding: var(--canon-space-9);
- }
-
- .lg\:cu-p-10 {
- padding: var(--canon-space-10);
- }
-
- .lg\:cu-p-11 {
- padding: var(--canon-space-11);
- }
-
- .lg\:cu-p-12 {
- padding: var(--canon-space-12);
- }
-
- .lg\:cu-p-13 {
- padding: var(--canon-space-13);
- }
-
- .lg\:cu-p-14 {
- padding: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-p {
- padding: var(--p-xl);
- }
-
- .xl\:cu-p-0\.5 {
- padding: var(--canon-space-0_5);
- }
-
- .xl\:cu-p-1 {
- padding: var(--canon-space-1);
- }
-
- .xl\:cu-p-1\.5 {
- padding: var(--canon-space-1_5);
- }
-
- .xl\:cu-p-2 {
- padding: var(--canon-space-2);
- }
-
- .xl\:cu-p-3 {
- padding: var(--canon-space-3);
- }
-
- .xl\:cu-p-4 {
- padding: var(--canon-space-4);
- }
-
- .xl\:cu-p-5 {
- padding: var(--canon-space-5);
- }
-
- .xl\:cu-p-6 {
- padding: var(--canon-space-6);
- }
-
- .xl\:cu-p-7 {
- padding: var(--canon-space-7);
- }
-
- .xl\:cu-p-8 {
- padding: var(--canon-space-8);
- }
-
- .xl\:cu-p-9 {
- padding: var(--canon-space-9);
- }
-
- .xl\:cu-p-10 {
- padding: var(--canon-space-10);
- }
-
- .xl\:cu-p-11 {
- padding: var(--canon-space-11);
- }
-
- .xl\:cu-p-12 {
- padding: var(--canon-space-12);
- }
-
- .xl\:cu-p-13 {
- padding: var(--canon-space-13);
- }
-
- .xl\:cu-p-14 {
- padding: var(--canon-space-14);
- }
-}
-
-.cu-pl {
- padding-left: var(--pl);
-}
-
-.cu-pl-0\.5 {
- padding-left: var(--canon-space-0_5);
-}
-
-.cu-pl-1 {
- padding-left: var(--canon-space-1);
-}
-
-.cu-pl-1\.5 {
- padding-left: var(--canon-space-1_5);
-}
-
-.cu-pl-2 {
- padding-left: var(--canon-space-2);
-}
-
-.cu-pl-3 {
- padding-left: var(--canon-space-3);
-}
-
-.cu-pl-4 {
- padding-left: var(--canon-space-4);
-}
-
-.cu-pl-5 {
- padding-left: var(--canon-space-5);
-}
-
-.cu-pl-6 {
- padding-left: var(--canon-space-6);
-}
-
-.cu-pl-7 {
- padding-left: var(--canon-space-7);
-}
-
-.cu-pl-8 {
- padding-left: var(--canon-space-8);
-}
-
-.cu-pl-9 {
- padding-left: var(--canon-space-9);
-}
-
-.cu-pl-10 {
- padding-left: var(--canon-space-10);
-}
-
-.cu-pl-11 {
- padding-left: var(--canon-space-11);
-}
-
-.cu-pl-12 {
- padding-left: var(--canon-space-12);
-}
-
-.cu-pl-13 {
- padding-left: var(--canon-space-13);
-}
-
-.cu-pl-14 {
- padding-left: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-pl {
- padding-left: var(--pl-xs);
- }
-
- .xs\:cu-pl-0\.5 {
- padding-left: var(--canon-space-0_5);
- }
-
- .xs\:cu-pl-1 {
- padding-left: var(--canon-space-1);
- }
-
- .xs\:cu-pl-1\.5 {
- padding-left: var(--canon-space-1_5);
- }
-
- .xs\:cu-pl-2 {
- padding-left: var(--canon-space-2);
- }
-
- .xs\:cu-pl-3 {
- padding-left: var(--canon-space-3);
- }
-
- .xs\:cu-pl-4 {
- padding-left: var(--canon-space-4);
- }
-
- .xs\:cu-pl-5 {
- padding-left: var(--canon-space-5);
- }
-
- .xs\:cu-pl-6 {
- padding-left: var(--canon-space-6);
- }
-
- .xs\:cu-pl-7 {
- padding-left: var(--canon-space-7);
- }
-
- .xs\:cu-pl-8 {
- padding-left: var(--canon-space-8);
- }
-
- .xs\:cu-pl-9 {
- padding-left: var(--canon-space-9);
- }
-
- .xs\:cu-pl-10 {
- padding-left: var(--canon-space-10);
- }
-
- .xs\:cu-pl-11 {
- padding-left: var(--canon-space-11);
- }
-
- .xs\:cu-pl-12 {
- padding-left: var(--canon-space-12);
- }
-
- .xs\:cu-pl-13 {
- padding-left: var(--canon-space-13);
- }
-
- .xs\:cu-pl-14 {
- padding-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-pl {
- padding-left: var(--pl-sm);
- }
-
- .sm\:cu-pl-0\.5 {
- padding-left: var(--canon-space-0_5);
- }
-
- .sm\:cu-pl-1 {
- padding-left: var(--canon-space-1);
- }
-
- .sm\:cu-pl-1\.5 {
- padding-left: var(--canon-space-1_5);
- }
-
- .sm\:cu-pl-2 {
- padding-left: var(--canon-space-2);
- }
-
- .sm\:cu-pl-3 {
- padding-left: var(--canon-space-3);
- }
-
- .sm\:cu-pl-4 {
- padding-left: var(--canon-space-4);
- }
-
- .sm\:cu-pl-5 {
- padding-left: var(--canon-space-5);
- }
-
- .sm\:cu-pl-6 {
- padding-left: var(--canon-space-6);
- }
-
- .sm\:cu-pl-7 {
- padding-left: var(--canon-space-7);
- }
-
- .sm\:cu-pl-8 {
- padding-left: var(--canon-space-8);
- }
-
- .sm\:cu-pl-9 {
- padding-left: var(--canon-space-9);
- }
-
- .sm\:cu-pl-10 {
- padding-left: var(--canon-space-10);
- }
-
- .sm\:cu-pl-11 {
- padding-left: var(--canon-space-11);
- }
-
- .sm\:cu-pl-12 {
- padding-left: var(--canon-space-12);
- }
-
- .sm\:cu-pl-13 {
- padding-left: var(--canon-space-13);
- }
-
- .sm\:cu-pl-14 {
- padding-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-pl {
- padding-left: var(--pl-md);
- }
-
- .md\:cu-pl-0\.5 {
- padding-left: var(--canon-space-0_5);
- }
-
- .md\:cu-pl-1 {
- padding-left: var(--canon-space-1);
- }
-
- .md\:cu-pl-1\.5 {
- padding-left: var(--canon-space-1_5);
- }
-
- .md\:cu-pl-2 {
- padding-left: var(--canon-space-2);
- }
-
- .md\:cu-pl-3 {
- padding-left: var(--canon-space-3);
- }
-
- .md\:cu-pl-4 {
- padding-left: var(--canon-space-4);
- }
-
- .md\:cu-pl-5 {
- padding-left: var(--canon-space-5);
- }
-
- .md\:cu-pl-6 {
- padding-left: var(--canon-space-6);
- }
-
- .md\:cu-pl-7 {
- padding-left: var(--canon-space-7);
- }
-
- .md\:cu-pl-8 {
- padding-left: var(--canon-space-8);
- }
-
- .md\:cu-pl-9 {
- padding-left: var(--canon-space-9);
- }
-
- .md\:cu-pl-10 {
- padding-left: var(--canon-space-10);
- }
-
- .md\:cu-pl-11 {
- padding-left: var(--canon-space-11);
- }
-
- .md\:cu-pl-12 {
- padding-left: var(--canon-space-12);
- }
-
- .md\:cu-pl-13 {
- padding-left: var(--canon-space-13);
- }
-
- .md\:cu-pl-14 {
- padding-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-pl {
- padding-left: var(--pl-lg);
- }
-
- .lg\:cu-pl-0\.5 {
- padding-left: var(--canon-space-0_5);
- }
-
- .lg\:cu-pl-1 {
- padding-left: var(--canon-space-1);
- }
-
- .lg\:cu-pl-1\.5 {
- padding-left: var(--canon-space-1_5);
- }
-
- .lg\:cu-pl-2 {
- padding-left: var(--canon-space-2);
- }
-
- .lg\:cu-pl-3 {
- padding-left: var(--canon-space-3);
- }
-
- .lg\:cu-pl-4 {
- padding-left: var(--canon-space-4);
- }
-
- .lg\:cu-pl-5 {
- padding-left: var(--canon-space-5);
- }
-
- .lg\:cu-pl-6 {
- padding-left: var(--canon-space-6);
- }
-
- .lg\:cu-pl-7 {
- padding-left: var(--canon-space-7);
- }
-
- .lg\:cu-pl-8 {
- padding-left: var(--canon-space-8);
- }
-
- .lg\:cu-pl-9 {
- padding-left: var(--canon-space-9);
- }
-
- .lg\:cu-pl-10 {
- padding-left: var(--canon-space-10);
- }
-
- .lg\:cu-pl-11 {
- padding-left: var(--canon-space-11);
- }
-
- .lg\:cu-pl-12 {
- padding-left: var(--canon-space-12);
- }
-
- .lg\:cu-pl-13 {
- padding-left: var(--canon-space-13);
- }
-
- .lg\:cu-pl-14 {
- padding-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-pl {
- padding-left: var(--pl-xl);
- }
-
- .xl\:cu-pl-0\.5 {
- padding-left: var(--canon-space-0_5);
- }
-
- .xl\:cu-pl-1 {
- padding-left: var(--canon-space-1);
- }
-
- .xl\:cu-pl-1\.5 {
- padding-left: var(--canon-space-1_5);
- }
-
- .xl\:cu-pl-2 {
- padding-left: var(--canon-space-2);
- }
-
- .xl\:cu-pl-3 {
- padding-left: var(--canon-space-3);
- }
-
- .xl\:cu-pl-4 {
- padding-left: var(--canon-space-4);
- }
-
- .xl\:cu-pl-5 {
- padding-left: var(--canon-space-5);
- }
-
- .xl\:cu-pl-6 {
- padding-left: var(--canon-space-6);
- }
-
- .xl\:cu-pl-7 {
- padding-left: var(--canon-space-7);
- }
-
- .xl\:cu-pl-8 {
- padding-left: var(--canon-space-8);
- }
-
- .xl\:cu-pl-9 {
- padding-left: var(--canon-space-9);
- }
-
- .xl\:cu-pl-10 {
- padding-left: var(--canon-space-10);
- }
-
- .xl\:cu-pl-11 {
- padding-left: var(--canon-space-11);
- }
-
- .xl\:cu-pl-12 {
- padding-left: var(--canon-space-12);
- }
-
- .xl\:cu-pl-13 {
- padding-left: var(--canon-space-13);
- }
-
- .xl\:cu-pl-14 {
- padding-left: var(--canon-space-14);
- }
-}
-
-.cu-pr {
- padding-right: var(--pr);
-}
-
-.cu-pr-0\.5 {
- padding-right: var(--canon-space-0_5);
-}
-
-.cu-pr-1 {
- padding-right: var(--canon-space-1);
-}
-
-.cu-pr-1\.5 {
- padding-right: var(--canon-space-1_5);
-}
-
-.cu-pr-2 {
- padding-right: var(--canon-space-2);
-}
-
-.cu-pr-3 {
- padding-right: var(--canon-space-3);
-}
-
-.cu-pr-4 {
- padding-right: var(--canon-space-4);
-}
-
-.cu-pr-5 {
- padding-right: var(--canon-space-5);
-}
-
-.cu-pr-6 {
- padding-right: var(--canon-space-6);
-}
-
-.cu-pr-7 {
- padding-right: var(--canon-space-7);
-}
-
-.cu-pr-8 {
- padding-right: var(--canon-space-8);
-}
-
-.cu-pr-9 {
- padding-right: var(--canon-space-9);
-}
-
-.cu-pr-10 {
- padding-right: var(--canon-space-10);
-}
-
-.cu-pr-11 {
- padding-right: var(--canon-space-11);
-}
-
-.cu-pr-12 {
- padding-right: var(--canon-space-12);
-}
-
-.cu-pr-13 {
- padding-right: var(--canon-space-13);
-}
-
-.cu-pr-14 {
- padding-right: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-pr {
- padding-right: var(--pr-xs);
- }
-
- .xs\:cu-pr-0\.5 {
- padding-right: var(--canon-space-0_5);
- }
-
- .xs\:cu-pr-1 {
- padding-right: var(--canon-space-1);
- }
-
- .xs\:cu-pr-1\.5 {
- padding-right: var(--canon-space-1_5);
- }
-
- .xs\:cu-pr-2 {
- padding-right: var(--canon-space-2);
- }
-
- .xs\:cu-pr-3 {
- padding-right: var(--canon-space-3);
- }
-
- .xs\:cu-pr-4 {
- padding-right: var(--canon-space-4);
- }
-
- .xs\:cu-pr-5 {
- padding-right: var(--canon-space-5);
- }
-
- .xs\:cu-pr-6 {
- padding-right: var(--canon-space-6);
- }
-
- .xs\:cu-pr-7 {
- padding-right: var(--canon-space-7);
- }
-
- .xs\:cu-pr-8 {
- padding-right: var(--canon-space-8);
- }
-
- .xs\:cu-pr-9 {
- padding-right: var(--canon-space-9);
- }
-
- .xs\:cu-pr-10 {
- padding-right: var(--canon-space-10);
- }
-
- .xs\:cu-pr-11 {
- padding-right: var(--canon-space-11);
- }
-
- .xs\:cu-pr-12 {
- padding-right: var(--canon-space-12);
- }
-
- .xs\:cu-pr-13 {
- padding-right: var(--canon-space-13);
- }
-
- .xs\:cu-pr-14 {
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-pr {
- padding-right: var(--pr-sm);
- }
-
- .sm\:cu-pr-0\.5 {
- padding-right: var(--canon-space-0_5);
- }
-
- .sm\:cu-pr-1 {
- padding-right: var(--canon-space-1);
- }
-
- .sm\:cu-pr-1\.5 {
- padding-right: var(--canon-space-1_5);
- }
-
- .sm\:cu-pr-2 {
- padding-right: var(--canon-space-2);
- }
-
- .sm\:cu-pr-3 {
- padding-right: var(--canon-space-3);
- }
-
- .sm\:cu-pr-4 {
- padding-right: var(--canon-space-4);
- }
-
- .sm\:cu-pr-5 {
- padding-right: var(--canon-space-5);
- }
-
- .sm\:cu-pr-6 {
- padding-right: var(--canon-space-6);
- }
-
- .sm\:cu-pr-7 {
- padding-right: var(--canon-space-7);
- }
-
- .sm\:cu-pr-8 {
- padding-right: var(--canon-space-8);
- }
-
- .sm\:cu-pr-9 {
- padding-right: var(--canon-space-9);
- }
-
- .sm\:cu-pr-10 {
- padding-right: var(--canon-space-10);
- }
-
- .sm\:cu-pr-11 {
- padding-right: var(--canon-space-11);
- }
-
- .sm\:cu-pr-12 {
- padding-right: var(--canon-space-12);
- }
-
- .sm\:cu-pr-13 {
- padding-right: var(--canon-space-13);
- }
-
- .sm\:cu-pr-14 {
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-pr {
- padding-right: var(--pr-md);
- }
-
- .md\:cu-pr-0\.5 {
- padding-right: var(--canon-space-0_5);
- }
-
- .md\:cu-pr-1 {
- padding-right: var(--canon-space-1);
- }
-
- .md\:cu-pr-1\.5 {
- padding-right: var(--canon-space-1_5);
- }
-
- .md\:cu-pr-2 {
- padding-right: var(--canon-space-2);
- }
-
- .md\:cu-pr-3 {
- padding-right: var(--canon-space-3);
- }
-
- .md\:cu-pr-4 {
- padding-right: var(--canon-space-4);
- }
-
- .md\:cu-pr-5 {
- padding-right: var(--canon-space-5);
- }
-
- .md\:cu-pr-6 {
- padding-right: var(--canon-space-6);
- }
-
- .md\:cu-pr-7 {
- padding-right: var(--canon-space-7);
- }
-
- .md\:cu-pr-8 {
- padding-right: var(--canon-space-8);
- }
-
- .md\:cu-pr-9 {
- padding-right: var(--canon-space-9);
- }
-
- .md\:cu-pr-10 {
- padding-right: var(--canon-space-10);
- }
-
- .md\:cu-pr-11 {
- padding-right: var(--canon-space-11);
- }
-
- .md\:cu-pr-12 {
- padding-right: var(--canon-space-12);
- }
-
- .md\:cu-pr-13 {
- padding-right: var(--canon-space-13);
- }
-
- .md\:cu-pr-14 {
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-pr {
- padding-right: var(--pr-lg);
- }
-
- .lg\:cu-pr-0\.5 {
- padding-right: var(--canon-space-0_5);
- }
-
- .lg\:cu-pr-1 {
- padding-right: var(--canon-space-1);
- }
-
- .lg\:cu-pr-1\.5 {
- padding-right: var(--canon-space-1_5);
- }
-
- .lg\:cu-pr-2 {
- padding-right: var(--canon-space-2);
- }
-
- .lg\:cu-pr-3 {
- padding-right: var(--canon-space-3);
- }
-
- .lg\:cu-pr-4 {
- padding-right: var(--canon-space-4);
- }
-
- .lg\:cu-pr-5 {
- padding-right: var(--canon-space-5);
- }
-
- .lg\:cu-pr-6 {
- padding-right: var(--canon-space-6);
- }
-
- .lg\:cu-pr-7 {
- padding-right: var(--canon-space-7);
- }
-
- .lg\:cu-pr-8 {
- padding-right: var(--canon-space-8);
- }
-
- .lg\:cu-pr-9 {
- padding-right: var(--canon-space-9);
- }
-
- .lg\:cu-pr-10 {
- padding-right: var(--canon-space-10);
- }
-
- .lg\:cu-pr-11 {
- padding-right: var(--canon-space-11);
- }
-
- .lg\:cu-pr-12 {
- padding-right: var(--canon-space-12);
- }
-
- .lg\:cu-pr-13 {
- padding-right: var(--canon-space-13);
- }
-
- .lg\:cu-pr-14 {
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-pr {
- padding-right: var(--pr-xl);
- }
-
- .xl\:cu-pr-0\.5 {
- padding-right: var(--canon-space-0_5);
- }
-
- .xl\:cu-pr-1 {
- padding-right: var(--canon-space-1);
- }
-
- .xl\:cu-pr-1\.5 {
- padding-right: var(--canon-space-1_5);
- }
-
- .xl\:cu-pr-2 {
- padding-right: var(--canon-space-2);
- }
-
- .xl\:cu-pr-3 {
- padding-right: var(--canon-space-3);
- }
-
- .xl\:cu-pr-4 {
- padding-right: var(--canon-space-4);
- }
-
- .xl\:cu-pr-5 {
- padding-right: var(--canon-space-5);
- }
-
- .xl\:cu-pr-6 {
- padding-right: var(--canon-space-6);
- }
-
- .xl\:cu-pr-7 {
- padding-right: var(--canon-space-7);
- }
-
- .xl\:cu-pr-8 {
- padding-right: var(--canon-space-8);
- }
-
- .xl\:cu-pr-9 {
- padding-right: var(--canon-space-9);
- }
-
- .xl\:cu-pr-10 {
- padding-right: var(--canon-space-10);
- }
-
- .xl\:cu-pr-11 {
- padding-right: var(--canon-space-11);
- }
-
- .xl\:cu-pr-12 {
- padding-right: var(--canon-space-12);
- }
-
- .xl\:cu-pr-13 {
- padding-right: var(--canon-space-13);
- }
-
- .xl\:cu-pr-14 {
- padding-right: var(--canon-space-14);
- }
-}
-
-.cu-pt {
- padding-top: var(--pt);
-}
-
-.cu-pt-0\.5 {
- padding-top: var(--canon-space-0_5);
-}
-
-.cu-pt-1 {
- padding-top: var(--canon-space-1);
-}
-
-.cu-pt-1\.5 {
- padding-top: var(--canon-space-1_5);
-}
-
-.cu-pt-2 {
- padding-top: var(--canon-space-2);
-}
-
-.cu-pt-3 {
- padding-top: var(--canon-space-3);
-}
-
-.cu-pt-4 {
- padding-top: var(--canon-space-4);
-}
-
-.cu-pt-5 {
- padding-top: var(--canon-space-5);
-}
-
-.cu-pt-6 {
- padding-top: var(--canon-space-6);
-}
-
-.cu-pt-7 {
- padding-top: var(--canon-space-7);
-}
-
-.cu-pt-8 {
- padding-top: var(--canon-space-8);
-}
-
-.cu-pt-9 {
- padding-top: var(--canon-space-9);
-}
-
-.cu-pt-10 {
- padding-top: var(--canon-space-10);
-}
-
-.cu-pt-11 {
- padding-top: var(--canon-space-11);
-}
-
-.cu-pt-12 {
- padding-top: var(--canon-space-12);
-}
-
-.cu-pt-13 {
- padding-top: var(--canon-space-13);
-}
-
-.cu-pt-14 {
- padding-top: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-pt {
- padding-top: var(--pt-xs);
- }
-
- .xs\:cu-pt-0\.5 {
- padding-top: var(--canon-space-0_5);
- }
-
- .xs\:cu-pt-1 {
- padding-top: var(--canon-space-1);
- }
-
- .xs\:cu-pt-1\.5 {
- padding-top: var(--canon-space-1_5);
- }
-
- .xs\:cu-pt-2 {
- padding-top: var(--canon-space-2);
- }
-
- .xs\:cu-pt-3 {
- padding-top: var(--canon-space-3);
- }
-
- .xs\:cu-pt-4 {
- padding-top: var(--canon-space-4);
- }
-
- .xs\:cu-pt-5 {
- padding-top: var(--canon-space-5);
- }
-
- .xs\:cu-pt-6 {
- padding-top: var(--canon-space-6);
- }
-
- .xs\:cu-pt-7 {
- padding-top: var(--canon-space-7);
- }
-
- .xs\:cu-pt-8 {
- padding-top: var(--canon-space-8);
- }
-
- .xs\:cu-pt-9 {
- padding-top: var(--canon-space-9);
- }
-
- .xs\:cu-pt-10 {
- padding-top: var(--canon-space-10);
- }
-
- .xs\:cu-pt-11 {
- padding-top: var(--canon-space-11);
- }
-
- .xs\:cu-pt-12 {
- padding-top: var(--canon-space-12);
- }
-
- .xs\:cu-pt-13 {
- padding-top: var(--canon-space-13);
- }
-
- .xs\:cu-pt-14 {
- padding-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-pt {
- padding-top: var(--pt-sm);
- }
-
- .sm\:cu-pt-0\.5 {
- padding-top: var(--canon-space-0_5);
- }
-
- .sm\:cu-pt-1 {
- padding-top: var(--canon-space-1);
- }
-
- .sm\:cu-pt-1\.5 {
- padding-top: var(--canon-space-1_5);
- }
-
- .sm\:cu-pt-2 {
- padding-top: var(--canon-space-2);
- }
-
- .sm\:cu-pt-3 {
- padding-top: var(--canon-space-3);
- }
-
- .sm\:cu-pt-4 {
- padding-top: var(--canon-space-4);
- }
-
- .sm\:cu-pt-5 {
- padding-top: var(--canon-space-5);
- }
-
- .sm\:cu-pt-6 {
- padding-top: var(--canon-space-6);
- }
-
- .sm\:cu-pt-7 {
- padding-top: var(--canon-space-7);
- }
-
- .sm\:cu-pt-8 {
- padding-top: var(--canon-space-8);
- }
-
- .sm\:cu-pt-9 {
- padding-top: var(--canon-space-9);
- }
-
- .sm\:cu-pt-10 {
- padding-top: var(--canon-space-10);
- }
-
- .sm\:cu-pt-11 {
- padding-top: var(--canon-space-11);
- }
-
- .sm\:cu-pt-12 {
- padding-top: var(--canon-space-12);
- }
-
- .sm\:cu-pt-13 {
- padding-top: var(--canon-space-13);
- }
-
- .sm\:cu-pt-14 {
- padding-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-pt {
- padding-top: var(--pt-md);
- }
-
- .md\:cu-pt-0\.5 {
- padding-top: var(--canon-space-0_5);
- }
-
- .md\:cu-pt-1 {
- padding-top: var(--canon-space-1);
- }
-
- .md\:cu-pt-1\.5 {
- padding-top: var(--canon-space-1_5);
- }
-
- .md\:cu-pt-2 {
- padding-top: var(--canon-space-2);
- }
-
- .md\:cu-pt-3 {
- padding-top: var(--canon-space-3);
- }
-
- .md\:cu-pt-4 {
- padding-top: var(--canon-space-4);
- }
-
- .md\:cu-pt-5 {
- padding-top: var(--canon-space-5);
- }
-
- .md\:cu-pt-6 {
- padding-top: var(--canon-space-6);
- }
-
- .md\:cu-pt-7 {
- padding-top: var(--canon-space-7);
- }
-
- .md\:cu-pt-8 {
- padding-top: var(--canon-space-8);
- }
-
- .md\:cu-pt-9 {
- padding-top: var(--canon-space-9);
- }
-
- .md\:cu-pt-10 {
- padding-top: var(--canon-space-10);
- }
-
- .md\:cu-pt-11 {
- padding-top: var(--canon-space-11);
- }
-
- .md\:cu-pt-12 {
- padding-top: var(--canon-space-12);
- }
-
- .md\:cu-pt-13 {
- padding-top: var(--canon-space-13);
- }
-
- .md\:cu-pt-14 {
- padding-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-pt {
- padding-top: var(--pt-lg);
- }
-
- .lg\:cu-pt-0\.5 {
- padding-top: var(--canon-space-0_5);
- }
-
- .lg\:cu-pt-1 {
- padding-top: var(--canon-space-1);
- }
-
- .lg\:cu-pt-1\.5 {
- padding-top: var(--canon-space-1_5);
- }
-
- .lg\:cu-pt-2 {
- padding-top: var(--canon-space-2);
- }
-
- .lg\:cu-pt-3 {
- padding-top: var(--canon-space-3);
- }
-
- .lg\:cu-pt-4 {
- padding-top: var(--canon-space-4);
- }
-
- .lg\:cu-pt-5 {
- padding-top: var(--canon-space-5);
- }
-
- .lg\:cu-pt-6 {
- padding-top: var(--canon-space-6);
- }
-
- .lg\:cu-pt-7 {
- padding-top: var(--canon-space-7);
- }
-
- .lg\:cu-pt-8 {
- padding-top: var(--canon-space-8);
- }
-
- .lg\:cu-pt-9 {
- padding-top: var(--canon-space-9);
- }
-
- .lg\:cu-pt-10 {
- padding-top: var(--canon-space-10);
- }
-
- .lg\:cu-pt-11 {
- padding-top: var(--canon-space-11);
- }
-
- .lg\:cu-pt-12 {
- padding-top: var(--canon-space-12);
- }
-
- .lg\:cu-pt-13 {
- padding-top: var(--canon-space-13);
- }
-
- .lg\:cu-pt-14 {
- padding-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-pt {
- padding-top: var(--pt-xl);
- }
-
- .xl\:cu-pt-0\.5 {
- padding-top: var(--canon-space-0_5);
- }
-
- .xl\:cu-pt-1 {
- padding-top: var(--canon-space-1);
- }
-
- .xl\:cu-pt-1\.5 {
- padding-top: var(--canon-space-1_5);
- }
-
- .xl\:cu-pt-2 {
- padding-top: var(--canon-space-2);
- }
-
- .xl\:cu-pt-3 {
- padding-top: var(--canon-space-3);
- }
-
- .xl\:cu-pt-4 {
- padding-top: var(--canon-space-4);
- }
-
- .xl\:cu-pt-5 {
- padding-top: var(--canon-space-5);
- }
-
- .xl\:cu-pt-6 {
- padding-top: var(--canon-space-6);
- }
-
- .xl\:cu-pt-7 {
- padding-top: var(--canon-space-7);
- }
-
- .xl\:cu-pt-8 {
- padding-top: var(--canon-space-8);
- }
-
- .xl\:cu-pt-9 {
- padding-top: var(--canon-space-9);
- }
-
- .xl\:cu-pt-10 {
- padding-top: var(--canon-space-10);
- }
-
- .xl\:cu-pt-11 {
- padding-top: var(--canon-space-11);
- }
-
- .xl\:cu-pt-12 {
- padding-top: var(--canon-space-12);
- }
-
- .xl\:cu-pt-13 {
- padding-top: var(--canon-space-13);
- }
-
- .xl\:cu-pt-14 {
- padding-top: var(--canon-space-14);
- }
-}
-
-.cu-pb {
- padding-bottom: var(--pb);
-}
-
-.cu-pb-0\.5 {
- padding-bottom: var(--canon-space-0_5);
-}
-
-.cu-pb-1 {
- padding-bottom: var(--canon-space-1);
-}
-
-.cu-pb-1\.5 {
- padding-bottom: var(--canon-space-1_5);
-}
-
-.cu-pb-2 {
- padding-bottom: var(--canon-space-2);
-}
-
-.cu-pb-3 {
- padding-bottom: var(--canon-space-3);
-}
-
-.cu-pb-4 {
- padding-bottom: var(--canon-space-4);
-}
-
-.cu-pb-5 {
- padding-bottom: var(--canon-space-5);
-}
-
-.cu-pb-6 {
- padding-bottom: var(--canon-space-6);
-}
-
-.cu-pb-7 {
- padding-bottom: var(--canon-space-7);
-}
-
-.cu-pb-8 {
- padding-bottom: var(--canon-space-8);
-}
-
-.cu-pb-9 {
- padding-bottom: var(--canon-space-9);
-}
-
-.cu-pb-10 {
- padding-bottom: var(--canon-space-10);
-}
-
-.cu-pb-11 {
- padding-bottom: var(--canon-space-11);
-}
-
-.cu-pb-12 {
- padding-bottom: var(--canon-space-12);
-}
-
-.cu-pb-13 {
- padding-bottom: var(--canon-space-13);
-}
-
-.cu-pb-14 {
- padding-bottom: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-pb {
- padding-bottom: var(--pb-xs);
- }
-
- .xs\:cu-pb-0\.5 {
- padding-bottom: var(--canon-space-0_5);
- }
-
- .xs\:cu-pb-1 {
- padding-bottom: var(--canon-space-1);
- }
-
- .xs\:cu-pb-1\.5 {
- padding-bottom: var(--canon-space-1_5);
- }
-
- .xs\:cu-pb-2 {
- padding-bottom: var(--canon-space-2);
- }
-
- .xs\:cu-pb-3 {
- padding-bottom: var(--canon-space-3);
- }
-
- .xs\:cu-pb-4 {
- padding-bottom: var(--canon-space-4);
- }
-
- .xs\:cu-pb-5 {
- padding-bottom: var(--canon-space-5);
- }
-
- .xs\:cu-pb-6 {
- padding-bottom: var(--canon-space-6);
- }
-
- .xs\:cu-pb-7 {
- padding-bottom: var(--canon-space-7);
- }
-
- .xs\:cu-pb-8 {
- padding-bottom: var(--canon-space-8);
- }
-
- .xs\:cu-pb-9 {
- padding-bottom: var(--canon-space-9);
- }
-
- .xs\:cu-pb-10 {
- padding-bottom: var(--canon-space-10);
- }
-
- .xs\:cu-pb-11 {
- padding-bottom: var(--canon-space-11);
- }
-
- .xs\:cu-pb-12 {
- padding-bottom: var(--canon-space-12);
- }
-
- .xs\:cu-pb-13 {
- padding-bottom: var(--canon-space-13);
- }
-
- .xs\:cu-pb-14 {
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-pb {
- padding-bottom: var(--pb-sm);
- }
-
- .sm\:cu-pb-0\.5 {
- padding-bottom: var(--canon-space-0_5);
- }
-
- .sm\:cu-pb-1 {
- padding-bottom: var(--canon-space-1);
- }
-
- .sm\:cu-pb-1\.5 {
- padding-bottom: var(--canon-space-1_5);
- }
-
- .sm\:cu-pb-2 {
- padding-bottom: var(--canon-space-2);
- }
-
- .sm\:cu-pb-3 {
- padding-bottom: var(--canon-space-3);
- }
-
- .sm\:cu-pb-4 {
- padding-bottom: var(--canon-space-4);
- }
-
- .sm\:cu-pb-5 {
- padding-bottom: var(--canon-space-5);
- }
-
- .sm\:cu-pb-6 {
- padding-bottom: var(--canon-space-6);
- }
-
- .sm\:cu-pb-7 {
- padding-bottom: var(--canon-space-7);
- }
-
- .sm\:cu-pb-8 {
- padding-bottom: var(--canon-space-8);
- }
-
- .sm\:cu-pb-9 {
- padding-bottom: var(--canon-space-9);
- }
-
- .sm\:cu-pb-10 {
- padding-bottom: var(--canon-space-10);
- }
-
- .sm\:cu-pb-11 {
- padding-bottom: var(--canon-space-11);
- }
-
- .sm\:cu-pb-12 {
- padding-bottom: var(--canon-space-12);
- }
-
- .sm\:cu-pb-13 {
- padding-bottom: var(--canon-space-13);
- }
-
- .sm\:cu-pb-14 {
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-pb {
- padding-bottom: var(--pb-md);
- }
-
- .md\:cu-pb-0\.5 {
- padding-bottom: var(--canon-space-0_5);
- }
-
- .md\:cu-pb-1 {
- padding-bottom: var(--canon-space-1);
- }
-
- .md\:cu-pb-1\.5 {
- padding-bottom: var(--canon-space-1_5);
- }
-
- .md\:cu-pb-2 {
- padding-bottom: var(--canon-space-2);
- }
-
- .md\:cu-pb-3 {
- padding-bottom: var(--canon-space-3);
- }
-
- .md\:cu-pb-4 {
- padding-bottom: var(--canon-space-4);
- }
-
- .md\:cu-pb-5 {
- padding-bottom: var(--canon-space-5);
- }
-
- .md\:cu-pb-6 {
- padding-bottom: var(--canon-space-6);
- }
-
- .md\:cu-pb-7 {
- padding-bottom: var(--canon-space-7);
- }
-
- .md\:cu-pb-8 {
- padding-bottom: var(--canon-space-8);
- }
-
- .md\:cu-pb-9 {
- padding-bottom: var(--canon-space-9);
- }
-
- .md\:cu-pb-10 {
- padding-bottom: var(--canon-space-10);
- }
-
- .md\:cu-pb-11 {
- padding-bottom: var(--canon-space-11);
- }
-
- .md\:cu-pb-12 {
- padding-bottom: var(--canon-space-12);
- }
-
- .md\:cu-pb-13 {
- padding-bottom: var(--canon-space-13);
- }
-
- .md\:cu-pb-14 {
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-pb {
- padding-bottom: var(--pb-lg);
- }
-
- .lg\:cu-pb-0\.5 {
- padding-bottom: var(--canon-space-0_5);
- }
-
- .lg\:cu-pb-1 {
- padding-bottom: var(--canon-space-1);
- }
-
- .lg\:cu-pb-1\.5 {
- padding-bottom: var(--canon-space-1_5);
- }
-
- .lg\:cu-pb-2 {
- padding-bottom: var(--canon-space-2);
- }
-
- .lg\:cu-pb-3 {
- padding-bottom: var(--canon-space-3);
- }
-
- .lg\:cu-pb-4 {
- padding-bottom: var(--canon-space-4);
- }
-
- .lg\:cu-pb-5 {
- padding-bottom: var(--canon-space-5);
- }
-
- .lg\:cu-pb-6 {
- padding-bottom: var(--canon-space-6);
- }
-
- .lg\:cu-pb-7 {
- padding-bottom: var(--canon-space-7);
- }
-
- .lg\:cu-pb-8 {
- padding-bottom: var(--canon-space-8);
- }
-
- .lg\:cu-pb-9 {
- padding-bottom: var(--canon-space-9);
- }
-
- .lg\:cu-pb-10 {
- padding-bottom: var(--canon-space-10);
- }
-
- .lg\:cu-pb-11 {
- padding-bottom: var(--canon-space-11);
- }
-
- .lg\:cu-pb-12 {
- padding-bottom: var(--canon-space-12);
- }
-
- .lg\:cu-pb-13 {
- padding-bottom: var(--canon-space-13);
- }
-
- .lg\:cu-pb-14 {
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-pb {
- padding-bottom: var(--pb-xl);
- }
-
- .xl\:cu-pb-0\.5 {
- padding-bottom: var(--canon-space-0_5);
- }
-
- .xl\:cu-pb-1 {
- padding-bottom: var(--canon-space-1);
- }
-
- .xl\:cu-pb-1\.5 {
- padding-bottom: var(--canon-space-1_5);
- }
-
- .xl\:cu-pb-2 {
- padding-bottom: var(--canon-space-2);
- }
-
- .xl\:cu-pb-3 {
- padding-bottom: var(--canon-space-3);
- }
-
- .xl\:cu-pb-4 {
- padding-bottom: var(--canon-space-4);
- }
-
- .xl\:cu-pb-5 {
- padding-bottom: var(--canon-space-5);
- }
-
- .xl\:cu-pb-6 {
- padding-bottom: var(--canon-space-6);
- }
-
- .xl\:cu-pb-7 {
- padding-bottom: var(--canon-space-7);
- }
-
- .xl\:cu-pb-8 {
- padding-bottom: var(--canon-space-8);
- }
-
- .xl\:cu-pb-9 {
- padding-bottom: var(--canon-space-9);
- }
-
- .xl\:cu-pb-10 {
- padding-bottom: var(--canon-space-10);
- }
-
- .xl\:cu-pb-11 {
- padding-bottom: var(--canon-space-11);
- }
-
- .xl\:cu-pb-12 {
- padding-bottom: var(--canon-space-12);
- }
-
- .xl\:cu-pb-13 {
- padding-bottom: var(--canon-space-13);
- }
-
- .xl\:cu-pb-14 {
- padding-bottom: var(--canon-space-14);
- }
-}
-
-.cu-py {
- padding-top: var(--py);
- padding-bottom: var(--py);
-}
-
-.cu-py-0\.5 {
- padding-top: var(--canon-space-0_5);
- padding-bottom: var(--canon-space-0_5);
-}
-
-.cu-py-1 {
- padding-top: var(--canon-space-1);
- padding-bottom: var(--canon-space-1);
-}
-
-.cu-py-1\.5 {
- padding-top: var(--canon-space-1_5);
- padding-bottom: var(--canon-space-1_5);
-}
-
-.cu-py-2 {
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-2);
-}
-
-.cu-py-3 {
- padding-top: var(--canon-space-3);
- padding-bottom: var(--canon-space-3);
-}
-
-.cu-py-4 {
- padding-top: var(--canon-space-4);
- padding-bottom: var(--canon-space-4);
-}
-
-.cu-py-5 {
- padding-top: var(--canon-space-5);
- padding-bottom: var(--canon-space-5);
-}
-
-.cu-py-6 {
- padding-top: var(--canon-space-6);
- padding-bottom: var(--canon-space-6);
-}
-
-.cu-py-7 {
- padding-top: var(--canon-space-7);
- padding-bottom: var(--canon-space-7);
-}
-
-.cu-py-8 {
- padding-top: var(--canon-space-8);
- padding-bottom: var(--canon-space-8);
-}
-
-.cu-py-9 {
- padding-top: var(--canon-space-9);
- padding-bottom: var(--canon-space-9);
-}
-
-.cu-py-10 {
- padding-top: var(--canon-space-10);
- padding-bottom: var(--canon-space-10);
-}
-
-.cu-py-11 {
- padding-top: var(--canon-space-11);
- padding-bottom: var(--canon-space-11);
-}
-
-.cu-py-12 {
- padding-top: var(--canon-space-12);
- padding-bottom: var(--canon-space-12);
-}
-
-.cu-py-13 {
- padding-top: var(--canon-space-13);
- padding-bottom: var(--canon-space-13);
-}
-
-.cu-py-14 {
- padding-top: var(--canon-space-14);
- padding-bottom: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-py {
- padding-top: var(--py-xs);
- padding-bottom: var(--py-xs);
- }
-
- .xs\:cu-py-0\.5 {
- padding-top: var(--canon-space-0_5);
- padding-bottom: var(--canon-space-0_5);
- }
-
- .xs\:cu-py-1 {
- padding-top: var(--canon-space-1);
- padding-bottom: var(--canon-space-1);
- }
-
- .xs\:cu-py-1\.5 {
- padding-top: var(--canon-space-1_5);
- padding-bottom: var(--canon-space-1_5);
- }
-
- .xs\:cu-py-2 {
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-2);
- }
-
- .xs\:cu-py-3 {
- padding-top: var(--canon-space-3);
- padding-bottom: var(--canon-space-3);
- }
-
- .xs\:cu-py-4 {
- padding-top: var(--canon-space-4);
- padding-bottom: var(--canon-space-4);
- }
-
- .xs\:cu-py-5 {
- padding-top: var(--canon-space-5);
- padding-bottom: var(--canon-space-5);
- }
-
- .xs\:cu-py-6 {
- padding-top: var(--canon-space-6);
- padding-bottom: var(--canon-space-6);
- }
-
- .xs\:cu-py-7 {
- padding-top: var(--canon-space-7);
- padding-bottom: var(--canon-space-7);
- }
-
- .xs\:cu-py-8 {
- padding-top: var(--canon-space-8);
- padding-bottom: var(--canon-space-8);
- }
-
- .xs\:cu-py-9 {
- padding-top: var(--canon-space-9);
- padding-bottom: var(--canon-space-9);
- }
-
- .xs\:cu-py-10 {
- padding-top: var(--canon-space-10);
- padding-bottom: var(--canon-space-10);
- }
-
- .xs\:cu-py-11 {
- padding-top: var(--canon-space-11);
- padding-bottom: var(--canon-space-11);
- }
-
- .xs\:cu-py-12 {
- padding-top: var(--canon-space-12);
- padding-bottom: var(--canon-space-12);
- }
-
- .xs\:cu-py-13 {
- padding-top: var(--canon-space-13);
- padding-bottom: var(--canon-space-13);
- }
-
- .xs\:cu-py-14 {
- padding-top: var(--canon-space-14);
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-py {
- padding-top: var(--py-sm);
- padding-bottom: var(--py-sm);
- }
-
- .sm\:cu-py-0\.5 {
- padding-top: var(--canon-space-0_5);
- padding-bottom: var(--canon-space-0_5);
- }
-
- .sm\:cu-py-1 {
- padding-top: var(--canon-space-1);
- padding-bottom: var(--canon-space-1);
- }
-
- .sm\:cu-py-1\.5 {
- padding-top: var(--canon-space-1_5);
- padding-bottom: var(--canon-space-1_5);
- }
-
- .sm\:cu-py-2 {
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-2);
- }
-
- .sm\:cu-py-3 {
- padding-top: var(--canon-space-3);
- padding-bottom: var(--canon-space-3);
- }
-
- .sm\:cu-py-4 {
- padding-top: var(--canon-space-4);
- padding-bottom: var(--canon-space-4);
- }
-
- .sm\:cu-py-5 {
- padding-top: var(--canon-space-5);
- padding-bottom: var(--canon-space-5);
- }
-
- .sm\:cu-py-6 {
- padding-top: var(--canon-space-6);
- padding-bottom: var(--canon-space-6);
- }
-
- .sm\:cu-py-7 {
- padding-top: var(--canon-space-7);
- padding-bottom: var(--canon-space-7);
- }
-
- .sm\:cu-py-8 {
- padding-top: var(--canon-space-8);
- padding-bottom: var(--canon-space-8);
- }
-
- .sm\:cu-py-9 {
- padding-top: var(--canon-space-9);
- padding-bottom: var(--canon-space-9);
- }
-
- .sm\:cu-py-10 {
- padding-top: var(--canon-space-10);
- padding-bottom: var(--canon-space-10);
- }
-
- .sm\:cu-py-11 {
- padding-top: var(--canon-space-11);
- padding-bottom: var(--canon-space-11);
- }
-
- .sm\:cu-py-12 {
- padding-top: var(--canon-space-12);
- padding-bottom: var(--canon-space-12);
- }
-
- .sm\:cu-py-13 {
- padding-top: var(--canon-space-13);
- padding-bottom: var(--canon-space-13);
- }
-
- .sm\:cu-py-14 {
- padding-top: var(--canon-space-14);
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-py {
- padding-top: var(--py-md);
- padding-bottom: var(--py-md);
- }
-
- .md\:cu-py-0\.5 {
- padding-top: var(--canon-space-0_5);
- padding-bottom: var(--canon-space-0_5);
- }
-
- .md\:cu-py-1 {
- padding-top: var(--canon-space-1);
- padding-bottom: var(--canon-space-1);
- }
-
- .md\:cu-py-1\.5 {
- padding-top: var(--canon-space-1_5);
- padding-bottom: var(--canon-space-1_5);
- }
-
- .md\:cu-py-2 {
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-2);
- }
-
- .md\:cu-py-3 {
- padding-top: var(--canon-space-3);
- padding-bottom: var(--canon-space-3);
- }
-
- .md\:cu-py-4 {
- padding-top: var(--canon-space-4);
- padding-bottom: var(--canon-space-4);
- }
-
- .md\:cu-py-5 {
- padding-top: var(--canon-space-5);
- padding-bottom: var(--canon-space-5);
- }
-
- .md\:cu-py-6 {
- padding-top: var(--canon-space-6);
- padding-bottom: var(--canon-space-6);
- }
-
- .md\:cu-py-7 {
- padding-top: var(--canon-space-7);
- padding-bottom: var(--canon-space-7);
- }
-
- .md\:cu-py-8 {
- padding-top: var(--canon-space-8);
- padding-bottom: var(--canon-space-8);
- }
-
- .md\:cu-py-9 {
- padding-top: var(--canon-space-9);
- padding-bottom: var(--canon-space-9);
- }
-
- .md\:cu-py-10 {
- padding-top: var(--canon-space-10);
- padding-bottom: var(--canon-space-10);
- }
-
- .md\:cu-py-11 {
- padding-top: var(--canon-space-11);
- padding-bottom: var(--canon-space-11);
- }
-
- .md\:cu-py-12 {
- padding-top: var(--canon-space-12);
- padding-bottom: var(--canon-space-12);
- }
-
- .md\:cu-py-13 {
- padding-top: var(--canon-space-13);
- padding-bottom: var(--canon-space-13);
- }
-
- .md\:cu-py-14 {
- padding-top: var(--canon-space-14);
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-py {
- padding-top: var(--py-lg);
- padding-bottom: var(--py-lg);
- }
-
- .lg\:cu-py-0\.5 {
- padding-top: var(--canon-space-0_5);
- padding-bottom: var(--canon-space-0_5);
- }
-
- .lg\:cu-py-1 {
- padding-top: var(--canon-space-1);
- padding-bottom: var(--canon-space-1);
- }
-
- .lg\:cu-py-1\.5 {
- padding-top: var(--canon-space-1_5);
- padding-bottom: var(--canon-space-1_5);
- }
-
- .lg\:cu-py-2 {
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-2);
- }
-
- .lg\:cu-py-3 {
- padding-top: var(--canon-space-3);
- padding-bottom: var(--canon-space-3);
- }
-
- .lg\:cu-py-4 {
- padding-top: var(--canon-space-4);
- padding-bottom: var(--canon-space-4);
- }
-
- .lg\:cu-py-5 {
- padding-top: var(--canon-space-5);
- padding-bottom: var(--canon-space-5);
- }
-
- .lg\:cu-py-6 {
- padding-top: var(--canon-space-6);
- padding-bottom: var(--canon-space-6);
- }
-
- .lg\:cu-py-7 {
- padding-top: var(--canon-space-7);
- padding-bottom: var(--canon-space-7);
- }
-
- .lg\:cu-py-8 {
- padding-top: var(--canon-space-8);
- padding-bottom: var(--canon-space-8);
- }
-
- .lg\:cu-py-9 {
- padding-top: var(--canon-space-9);
- padding-bottom: var(--canon-space-9);
- }
-
- .lg\:cu-py-10 {
- padding-top: var(--canon-space-10);
- padding-bottom: var(--canon-space-10);
- }
-
- .lg\:cu-py-11 {
- padding-top: var(--canon-space-11);
- padding-bottom: var(--canon-space-11);
- }
-
- .lg\:cu-py-12 {
- padding-top: var(--canon-space-12);
- padding-bottom: var(--canon-space-12);
- }
-
- .lg\:cu-py-13 {
- padding-top: var(--canon-space-13);
- padding-bottom: var(--canon-space-13);
- }
-
- .lg\:cu-py-14 {
- padding-top: var(--canon-space-14);
- padding-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-py {
- padding-top: var(--py-xl);
- padding-bottom: var(--py-xl);
- }
-
- .xl\:cu-py-0\.5 {
- padding-top: var(--canon-space-0_5);
- padding-bottom: var(--canon-space-0_5);
- }
-
- .xl\:cu-py-1 {
- padding-top: var(--canon-space-1);
- padding-bottom: var(--canon-space-1);
- }
-
- .xl\:cu-py-1\.5 {
- padding-top: var(--canon-space-1_5);
- padding-bottom: var(--canon-space-1_5);
- }
-
- .xl\:cu-py-2 {
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-2);
- }
-
- .xl\:cu-py-3 {
- padding-top: var(--canon-space-3);
- padding-bottom: var(--canon-space-3);
- }
-
- .xl\:cu-py-4 {
- padding-top: var(--canon-space-4);
- padding-bottom: var(--canon-space-4);
- }
-
- .xl\:cu-py-5 {
- padding-top: var(--canon-space-5);
- padding-bottom: var(--canon-space-5);
- }
-
- .xl\:cu-py-6 {
- padding-top: var(--canon-space-6);
- padding-bottom: var(--canon-space-6);
- }
-
- .xl\:cu-py-7 {
- padding-top: var(--canon-space-7);
- padding-bottom: var(--canon-space-7);
- }
-
- .xl\:cu-py-8 {
- padding-top: var(--canon-space-8);
- padding-bottom: var(--canon-space-8);
- }
-
- .xl\:cu-py-9 {
- padding-top: var(--canon-space-9);
- padding-bottom: var(--canon-space-9);
- }
-
- .xl\:cu-py-10 {
- padding-top: var(--canon-space-10);
- padding-bottom: var(--canon-space-10);
- }
-
- .xl\:cu-py-11 {
- padding-top: var(--canon-space-11);
- padding-bottom: var(--canon-space-11);
- }
-
- .xl\:cu-py-12 {
- padding-top: var(--canon-space-12);
- padding-bottom: var(--canon-space-12);
- }
-
- .xl\:cu-py-13 {
- padding-top: var(--canon-space-13);
- padding-bottom: var(--canon-space-13);
- }
-
- .xl\:cu-py-14 {
- padding-top: var(--canon-space-14);
- padding-bottom: var(--canon-space-14);
- }
-}
-
-.cu-px {
- padding-left: var(--px);
- padding-right: var(--px);
-}
-
-.cu-px-0\.5 {
- padding-left: var(--canon-space-0_5);
- padding-right: var(--canon-space-0_5);
-}
-
-.cu-px-1 {
- padding-left: var(--canon-space-1);
- padding-right: var(--canon-space-1);
-}
-
-.cu-px-1\.5 {
- padding-left: var(--canon-space-1_5);
- padding-right: var(--canon-space-1_5);
-}
-
-.cu-px-2 {
- padding-left: var(--canon-space-2);
- padding-right: var(--canon-space-2);
-}
-
-.cu-px-3 {
- padding-left: var(--canon-space-3);
- padding-right: var(--canon-space-3);
-}
-
-.cu-px-4 {
- padding-left: var(--canon-space-4);
- padding-right: var(--canon-space-4);
-}
-
-.cu-px-5 {
- padding-left: var(--canon-space-5);
- padding-right: var(--canon-space-5);
-}
-
-.cu-px-6 {
- padding-left: var(--canon-space-6);
- padding-right: var(--canon-space-6);
-}
-
-.cu-px-7 {
- padding-left: var(--canon-space-7);
- padding-right: var(--canon-space-7);
-}
-
-.cu-px-8 {
- padding-left: var(--canon-space-8);
- padding-right: var(--canon-space-8);
-}
-
-.cu-px-9 {
- padding-left: var(--canon-space-9);
- padding-right: var(--canon-space-9);
-}
-
-.cu-px-10 {
- padding-left: var(--canon-space-10);
- padding-right: var(--canon-space-10);
-}
-
-.cu-px-11 {
- padding-left: var(--canon-space-11);
- padding-right: var(--canon-space-11);
-}
-
-.cu-px-12 {
- padding-left: var(--canon-space-12);
- padding-right: var(--canon-space-12);
-}
-
-.cu-px-13 {
- padding-left: var(--canon-space-13);
- padding-right: var(--canon-space-13);
-}
-
-.cu-px-14 {
- padding-left: var(--canon-space-14);
- padding-right: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-px {
- padding-left: var(--px-xs);
- padding-right: var(--px-xs);
- }
-
- .xs\:cu-px-0\.5 {
- padding-left: var(--canon-space-0_5);
- padding-right: var(--canon-space-0_5);
- }
-
- .xs\:cu-px-1 {
- padding-left: var(--canon-space-1);
- padding-right: var(--canon-space-1);
- }
-
- .xs\:cu-px-1\.5 {
- padding-left: var(--canon-space-1_5);
- padding-right: var(--canon-space-1_5);
- }
-
- .xs\:cu-px-2 {
- padding-left: var(--canon-space-2);
- padding-right: var(--canon-space-2);
- }
-
- .xs\:cu-px-3 {
- padding-left: var(--canon-space-3);
- padding-right: var(--canon-space-3);
- }
-
- .xs\:cu-px-4 {
- padding-left: var(--canon-space-4);
- padding-right: var(--canon-space-4);
- }
-
- .xs\:cu-px-5 {
- padding-left: var(--canon-space-5);
- padding-right: var(--canon-space-5);
- }
-
- .xs\:cu-px-6 {
- padding-left: var(--canon-space-6);
- padding-right: var(--canon-space-6);
- }
-
- .xs\:cu-px-7 {
- padding-left: var(--canon-space-7);
- padding-right: var(--canon-space-7);
- }
-
- .xs\:cu-px-8 {
- padding-left: var(--canon-space-8);
- padding-right: var(--canon-space-8);
- }
-
- .xs\:cu-px-9 {
- padding-left: var(--canon-space-9);
- padding-right: var(--canon-space-9);
- }
-
- .xs\:cu-px-10 {
- padding-left: var(--canon-space-10);
- padding-right: var(--canon-space-10);
- }
-
- .xs\:cu-px-11 {
- padding-left: var(--canon-space-11);
- padding-right: var(--canon-space-11);
- }
-
- .xs\:cu-px-12 {
- padding-left: var(--canon-space-12);
- padding-right: var(--canon-space-12);
- }
-
- .xs\:cu-px-13 {
- padding-left: var(--canon-space-13);
- padding-right: var(--canon-space-13);
- }
-
- .xs\:cu-px-14 {
- padding-left: var(--canon-space-14);
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-px {
- padding-left: var(--px-sm);
- padding-right: var(--px-sm);
- }
-
- .sm\:cu-px-0\.5 {
- padding-left: var(--canon-space-0_5);
- padding-right: var(--canon-space-0_5);
- }
-
- .sm\:cu-px-1 {
- padding-left: var(--canon-space-1);
- padding-right: var(--canon-space-1);
- }
-
- .sm\:cu-px-1\.5 {
- padding-left: var(--canon-space-1_5);
- padding-right: var(--canon-space-1_5);
- }
-
- .sm\:cu-px-2 {
- padding-left: var(--canon-space-2);
- padding-right: var(--canon-space-2);
- }
-
- .sm\:cu-px-3 {
- padding-left: var(--canon-space-3);
- padding-right: var(--canon-space-3);
- }
-
- .sm\:cu-px-4 {
- padding-left: var(--canon-space-4);
- padding-right: var(--canon-space-4);
- }
-
- .sm\:cu-px-5 {
- padding-left: var(--canon-space-5);
- padding-right: var(--canon-space-5);
- }
-
- .sm\:cu-px-6 {
- padding-left: var(--canon-space-6);
- padding-right: var(--canon-space-6);
- }
-
- .sm\:cu-px-7 {
- padding-left: var(--canon-space-7);
- padding-right: var(--canon-space-7);
- }
-
- .sm\:cu-px-8 {
- padding-left: var(--canon-space-8);
- padding-right: var(--canon-space-8);
- }
-
- .sm\:cu-px-9 {
- padding-left: var(--canon-space-9);
- padding-right: var(--canon-space-9);
- }
-
- .sm\:cu-px-10 {
- padding-left: var(--canon-space-10);
- padding-right: var(--canon-space-10);
- }
-
- .sm\:cu-px-11 {
- padding-left: var(--canon-space-11);
- padding-right: var(--canon-space-11);
- }
-
- .sm\:cu-px-12 {
- padding-left: var(--canon-space-12);
- padding-right: var(--canon-space-12);
- }
-
- .sm\:cu-px-13 {
- padding-left: var(--canon-space-13);
- padding-right: var(--canon-space-13);
- }
-
- .sm\:cu-px-14 {
- padding-left: var(--canon-space-14);
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-px {
- padding-left: var(--px-md);
- padding-right: var(--px-md);
- }
-
- .md\:cu-px-0\.5 {
- padding-left: var(--canon-space-0_5);
- padding-right: var(--canon-space-0_5);
- }
-
- .md\:cu-px-1 {
- padding-left: var(--canon-space-1);
- padding-right: var(--canon-space-1);
- }
-
- .md\:cu-px-1\.5 {
- padding-left: var(--canon-space-1_5);
- padding-right: var(--canon-space-1_5);
- }
-
- .md\:cu-px-2 {
- padding-left: var(--canon-space-2);
- padding-right: var(--canon-space-2);
- }
-
- .md\:cu-px-3 {
- padding-left: var(--canon-space-3);
- padding-right: var(--canon-space-3);
- }
-
- .md\:cu-px-4 {
- padding-left: var(--canon-space-4);
- padding-right: var(--canon-space-4);
- }
-
- .md\:cu-px-5 {
- padding-left: var(--canon-space-5);
- padding-right: var(--canon-space-5);
- }
-
- .md\:cu-px-6 {
- padding-left: var(--canon-space-6);
- padding-right: var(--canon-space-6);
- }
-
- .md\:cu-px-7 {
- padding-left: var(--canon-space-7);
- padding-right: var(--canon-space-7);
- }
-
- .md\:cu-px-8 {
- padding-left: var(--canon-space-8);
- padding-right: var(--canon-space-8);
- }
-
- .md\:cu-px-9 {
- padding-left: var(--canon-space-9);
- padding-right: var(--canon-space-9);
- }
-
- .md\:cu-px-10 {
- padding-left: var(--canon-space-10);
- padding-right: var(--canon-space-10);
- }
-
- .md\:cu-px-11 {
- padding-left: var(--canon-space-11);
- padding-right: var(--canon-space-11);
- }
-
- .md\:cu-px-12 {
- padding-left: var(--canon-space-12);
- padding-right: var(--canon-space-12);
- }
-
- .md\:cu-px-13 {
- padding-left: var(--canon-space-13);
- padding-right: var(--canon-space-13);
- }
-
- .md\:cu-px-14 {
- padding-left: var(--canon-space-14);
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-px {
- padding-left: var(--px-lg);
- padding-right: var(--px-lg);
- }
-
- .lg\:cu-px-0\.5 {
- padding-left: var(--canon-space-0_5);
- padding-right: var(--canon-space-0_5);
- }
-
- .lg\:cu-px-1 {
- padding-left: var(--canon-space-1);
- padding-right: var(--canon-space-1);
- }
-
- .lg\:cu-px-1\.5 {
- padding-left: var(--canon-space-1_5);
- padding-right: var(--canon-space-1_5);
- }
-
- .lg\:cu-px-2 {
- padding-left: var(--canon-space-2);
- padding-right: var(--canon-space-2);
- }
-
- .lg\:cu-px-3 {
- padding-left: var(--canon-space-3);
- padding-right: var(--canon-space-3);
- }
-
- .lg\:cu-px-4 {
- padding-left: var(--canon-space-4);
- padding-right: var(--canon-space-4);
- }
-
- .lg\:cu-px-5 {
- padding-left: var(--canon-space-5);
- padding-right: var(--canon-space-5);
- }
-
- .lg\:cu-px-6 {
- padding-left: var(--canon-space-6);
- padding-right: var(--canon-space-6);
- }
-
- .lg\:cu-px-7 {
- padding-left: var(--canon-space-7);
- padding-right: var(--canon-space-7);
- }
-
- .lg\:cu-px-8 {
- padding-left: var(--canon-space-8);
- padding-right: var(--canon-space-8);
- }
-
- .lg\:cu-px-9 {
- padding-left: var(--canon-space-9);
- padding-right: var(--canon-space-9);
- }
-
- .lg\:cu-px-10 {
- padding-left: var(--canon-space-10);
- padding-right: var(--canon-space-10);
- }
-
- .lg\:cu-px-11 {
- padding-left: var(--canon-space-11);
- padding-right: var(--canon-space-11);
- }
-
- .lg\:cu-px-12 {
- padding-left: var(--canon-space-12);
- padding-right: var(--canon-space-12);
- }
-
- .lg\:cu-px-13 {
- padding-left: var(--canon-space-13);
- padding-right: var(--canon-space-13);
- }
-
- .lg\:cu-px-14 {
- padding-left: var(--canon-space-14);
- padding-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-px {
- padding-left: var(--px-xl);
- padding-right: var(--px-xl);
- }
-
- .xl\:cu-px-0\.5 {
- padding-left: var(--canon-space-0_5);
- padding-right: var(--canon-space-0_5);
- }
-
- .xl\:cu-px-1 {
- padding-left: var(--canon-space-1);
- padding-right: var(--canon-space-1);
- }
-
- .xl\:cu-px-1\.5 {
- padding-left: var(--canon-space-1_5);
- padding-right: var(--canon-space-1_5);
- }
-
- .xl\:cu-px-2 {
- padding-left: var(--canon-space-2);
- padding-right: var(--canon-space-2);
- }
-
- .xl\:cu-px-3 {
- padding-left: var(--canon-space-3);
- padding-right: var(--canon-space-3);
- }
-
- .xl\:cu-px-4 {
- padding-left: var(--canon-space-4);
- padding-right: var(--canon-space-4);
- }
-
- .xl\:cu-px-5 {
- padding-left: var(--canon-space-5);
- padding-right: var(--canon-space-5);
- }
-
- .xl\:cu-px-6 {
- padding-left: var(--canon-space-6);
- padding-right: var(--canon-space-6);
- }
-
- .xl\:cu-px-7 {
- padding-left: var(--canon-space-7);
- padding-right: var(--canon-space-7);
- }
-
- .xl\:cu-px-8 {
- padding-left: var(--canon-space-8);
- padding-right: var(--canon-space-8);
- }
-
- .xl\:cu-px-9 {
- padding-left: var(--canon-space-9);
- padding-right: var(--canon-space-9);
- }
-
- .xl\:cu-px-10 {
- padding-left: var(--canon-space-10);
- padding-right: var(--canon-space-10);
- }
-
- .xl\:cu-px-11 {
- padding-left: var(--canon-space-11);
- padding-right: var(--canon-space-11);
- }
-
- .xl\:cu-px-12 {
- padding-left: var(--canon-space-12);
- padding-right: var(--canon-space-12);
- }
-
- .xl\:cu-px-13 {
- padding-left: var(--canon-space-13);
- padding-right: var(--canon-space-13);
- }
-
- .xl\:cu-px-14 {
- padding-left: var(--canon-space-14);
- padding-right: var(--canon-space-14);
- }
-}
-
-.cu-m {
- margin: var(--m);
-}
-
-.cu-m-0\.5 {
- margin: var(--canon-space-0_5);
-}
-
-.cu-m-1 {
- margin: var(--canon-space-1);
-}
-
-.cu-m-1\.5 {
- margin: var(--canon-space-1_5);
-}
-
-.cu-m-2 {
- margin: var(--canon-space-2);
-}
-
-.cu-m-3 {
- margin: var(--canon-space-3);
-}
-
-.cu-m-4 {
- margin: var(--canon-space-4);
-}
-
-.cu-m-5 {
- margin: var(--canon-space-5);
-}
-
-.cu-m-6 {
- margin: var(--canon-space-6);
-}
-
-.cu-m-7 {
- margin: var(--canon-space-7);
-}
-
-.cu-m-8 {
- margin: var(--canon-space-8);
-}
-
-.cu-m-9 {
- margin: var(--canon-space-9);
-}
-
-.cu-m-10 {
- margin: var(--canon-space-10);
-}
-
-.cu-m-11 {
- margin: var(--canon-space-11);
-}
-
-.cu-m-12 {
- margin: var(--canon-space-12);
-}
-
-.cu-m-13 {
- margin: var(--canon-space-13);
-}
-
-.cu-m-14 {
- margin: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-m {
- margin: var(--p-xs);
- }
-
- .xs\:cu-m-0\.5 {
- margin: var(--canon-space-0_5);
- }
-
- .xs\:cu-m-1 {
- margin: var(--canon-space-1);
- }
-
- .xs\:cu-m-1\.5 {
- margin: var(--canon-space-1_5);
- }
-
- .xs\:cu-m-2 {
- margin: var(--canon-space-2);
- }
-
- .xs\:cu-m-3 {
- margin: var(--canon-space-3);
- }
-
- .xs\:cu-m-4 {
- margin: var(--canon-space-4);
- }
-
- .xs\:cu-m-5 {
- margin: var(--canon-space-5);
- }
-
- .xs\:cu-m-6 {
- margin: var(--canon-space-6);
- }
-
- .xs\:cu-m-7 {
- margin: var(--canon-space-7);
- }
-
- .xs\:cu-m-8 {
- margin: var(--canon-space-8);
- }
-
- .xs\:cu-m-9 {
- margin: var(--canon-space-9);
- }
-
- .xs\:cu-m-10 {
- margin: var(--canon-space-10);
- }
-
- .xs\:cu-m-11 {
- margin: var(--canon-space-11);
- }
-
- .xs\:cu-m-12 {
- margin: var(--canon-space-12);
- }
-
- .xs\:cu-m-13 {
- margin: var(--canon-space-13);
- }
-
- .xs\:cu-m-14 {
- margin: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-m {
- margin: var(--p-sm);
- }
-
- .sm\:cu-m-0\.5 {
- margin: var(--canon-space-0_5);
- }
-
- .sm\:cu-m-1 {
- margin: var(--canon-space-1);
- }
-
- .sm\:cu-m-1\.5 {
- margin: var(--canon-space-1_5);
- }
-
- .sm\:cu-m-2 {
- margin: var(--canon-space-2);
- }
-
- .sm\:cu-m-3 {
- margin: var(--canon-space-3);
- }
-
- .sm\:cu-m-4 {
- margin: var(--canon-space-4);
- }
-
- .sm\:cu-m-5 {
- margin: var(--canon-space-5);
- }
-
- .sm\:cu-m-6 {
- margin: var(--canon-space-6);
- }
-
- .sm\:cu-m-7 {
- margin: var(--canon-space-7);
- }
-
- .sm\:cu-m-8 {
- margin: var(--canon-space-8);
- }
-
- .sm\:cu-m-9 {
- margin: var(--canon-space-9);
- }
-
- .sm\:cu-m-10 {
- margin: var(--canon-space-10);
- }
-
- .sm\:cu-m-11 {
- margin: var(--canon-space-11);
- }
-
- .sm\:cu-m-12 {
- margin: var(--canon-space-12);
- }
-
- .sm\:cu-m-13 {
- margin: var(--canon-space-13);
- }
-
- .sm\:cu-m-14 {
- margin: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-m {
- margin: var(--p-md);
- }
-
- .md\:cu-m-0\.5 {
- margin: var(--canon-space-0_5);
- }
-
- .md\:cu-m-1 {
- margin: var(--canon-space-1);
- }
-
- .md\:cu-m-1\.5 {
- margin: var(--canon-space-1_5);
- }
-
- .md\:cu-m-2 {
- margin: var(--canon-space-2);
- }
-
- .md\:cu-m-3 {
- margin: var(--canon-space-3);
- }
-
- .md\:cu-m-4 {
- margin: var(--canon-space-4);
- }
-
- .md\:cu-m-5 {
- margin: var(--canon-space-5);
- }
-
- .md\:cu-m-6 {
- margin: var(--canon-space-6);
- }
-
- .md\:cu-m-7 {
- margin: var(--canon-space-7);
- }
-
- .md\:cu-m-8 {
- margin: var(--canon-space-8);
- }
-
- .md\:cu-m-9 {
- margin: var(--canon-space-9);
- }
-
- .md\:cu-m-10 {
- margin: var(--canon-space-10);
- }
-
- .md\:cu-m-11 {
- margin: var(--canon-space-11);
- }
-
- .md\:cu-m-12 {
- margin: var(--canon-space-12);
- }
-
- .md\:cu-m-13 {
- margin: var(--canon-space-13);
- }
-
- .md\:cu-m-14 {
- margin: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-m {
- margin: var(--p-lg);
- }
-
- .lg\:cu-m-0\.5 {
- margin: var(--canon-space-0_5);
- }
-
- .lg\:cu-m-1 {
- margin: var(--canon-space-1);
- }
-
- .lg\:cu-m-1\.5 {
- margin: var(--canon-space-1_5);
- }
-
- .lg\:cu-m-2 {
- margin: var(--canon-space-2);
- }
-
- .lg\:cu-m-3 {
- margin: var(--canon-space-3);
- }
-
- .lg\:cu-m-4 {
- margin: var(--canon-space-4);
- }
-
- .lg\:cu-m-5 {
- margin: var(--canon-space-5);
- }
-
- .lg\:cu-m-6 {
- margin: var(--canon-space-6);
- }
-
- .lg\:cu-m-7 {
- margin: var(--canon-space-7);
- }
-
- .lg\:cu-m-8 {
- margin: var(--canon-space-8);
- }
-
- .lg\:cu-m-9 {
- margin: var(--canon-space-9);
- }
-
- .lg\:cu-m-10 {
- margin: var(--canon-space-10);
- }
-
- .lg\:cu-m-11 {
- margin: var(--canon-space-11);
- }
-
- .lg\:cu-m-12 {
- margin: var(--canon-space-12);
- }
-
- .lg\:cu-m-13 {
- margin: var(--canon-space-13);
- }
-
- .lg\:cu-m-14 {
- margin: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-m {
- margin: var(--p-xl);
- }
-
- .xl\:cu-m-0\.5 {
- margin: var(--canon-space-0_5);
- }
-
- .xl\:cu-m-1 {
- margin: var(--canon-space-1);
- }
-
- .xl\:cu-m-1\.5 {
- margin: var(--canon-space-1_5);
- }
-
- .xl\:cu-m-2 {
- margin: var(--canon-space-2);
- }
-
- .xl\:cu-m-3 {
- margin: var(--canon-space-3);
- }
-
- .xl\:cu-m-4 {
- margin: var(--canon-space-4);
- }
-
- .xl\:cu-m-5 {
- margin: var(--canon-space-5);
- }
-
- .xl\:cu-m-6 {
- margin: var(--canon-space-6);
- }
-
- .xl\:cu-m-7 {
- margin: var(--canon-space-7);
- }
-
- .xl\:cu-m-8 {
- margin: var(--canon-space-8);
- }
-
- .xl\:cu-m-9 {
- margin: var(--canon-space-9);
- }
-
- .xl\:cu-m-10 {
- margin: var(--canon-space-10);
- }
-
- .xl\:cu-m-11 {
- margin: var(--canon-space-11);
- }
-
- .xl\:cu-m-12 {
- margin: var(--canon-space-12);
- }
-
- .xl\:cu-m-13 {
- margin: var(--canon-space-13);
- }
-
- .xl\:cu-m-14 {
- margin: var(--canon-space-14);
- }
-}
-
-.cu-ml {
- margin-left: var(--ml);
-}
-
-.cu-ml-0\.5 {
- margin-left: var(--canon-space-0_5);
-}
-
-.cu-ml-1 {
- margin-left: var(--canon-space-1);
-}
-
-.cu-ml-1\.5 {
- margin-left: var(--canon-space-1_5);
-}
-
-.cu-ml-2 {
- margin-left: var(--canon-space-2);
-}
-
-.cu-ml-3 {
- margin-left: var(--canon-space-3);
-}
-
-.cu-ml-4 {
- margin-left: var(--canon-space-4);
-}
-
-.cu-ml-5 {
- margin-left: var(--canon-space-5);
-}
-
-.cu-ml-6 {
- margin-left: var(--canon-space-6);
-}
-
-.cu-ml-7 {
- margin-left: var(--canon-space-7);
-}
-
-.cu-ml-8 {
- margin-left: var(--canon-space-8);
-}
-
-.cu-ml-9 {
- margin-left: var(--canon-space-9);
-}
-
-.cu-ml-10 {
- margin-left: var(--canon-space-10);
-}
-
-.cu-ml-11 {
- margin-left: var(--canon-space-11);
-}
-
-.cu-ml-12 {
- margin-left: var(--canon-space-12);
-}
-
-.cu-ml-13 {
- margin-left: var(--canon-space-13);
-}
-
-.cu-ml-14 {
- margin-left: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-ml {
- margin-left: var(--pl-xs);
- }
-
- .xs\:cu-ml-0\.5 {
- margin-left: var(--canon-space-0_5);
- }
-
- .xs\:cu-ml-1 {
- margin-left: var(--canon-space-1);
- }
-
- .xs\:cu-ml-1\.5 {
- margin-left: var(--canon-space-1_5);
- }
-
- .xs\:cu-ml-2 {
- margin-left: var(--canon-space-2);
- }
-
- .xs\:cu-ml-3 {
- margin-left: var(--canon-space-3);
- }
-
- .xs\:cu-ml-4 {
- margin-left: var(--canon-space-4);
- }
-
- .xs\:cu-ml-5 {
- margin-left: var(--canon-space-5);
- }
-
- .xs\:cu-ml-6 {
- margin-left: var(--canon-space-6);
- }
-
- .xs\:cu-ml-7 {
- margin-left: var(--canon-space-7);
- }
-
- .xs\:cu-ml-8 {
- margin-left: var(--canon-space-8);
- }
-
- .xs\:cu-ml-9 {
- margin-left: var(--canon-space-9);
- }
-
- .xs\:cu-ml-10 {
- margin-left: var(--canon-space-10);
- }
-
- .xs\:cu-ml-11 {
- margin-left: var(--canon-space-11);
- }
-
- .xs\:cu-ml-12 {
- margin-left: var(--canon-space-12);
- }
-
- .xs\:cu-ml-13 {
- margin-left: var(--canon-space-13);
- }
-
- .xs\:cu-ml-14 {
- margin-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-ml {
- margin-left: var(--pl-sm);
- }
-
- .sm\:cu-ml-0\.5 {
- margin-left: var(--canon-space-0_5);
- }
-
- .sm\:cu-ml-1 {
- margin-left: var(--canon-space-1);
- }
-
- .sm\:cu-ml-1\.5 {
- margin-left: var(--canon-space-1_5);
- }
-
- .sm\:cu-ml-2 {
- margin-left: var(--canon-space-2);
- }
-
- .sm\:cu-ml-3 {
- margin-left: var(--canon-space-3);
- }
-
- .sm\:cu-ml-4 {
- margin-left: var(--canon-space-4);
- }
-
- .sm\:cu-ml-5 {
- margin-left: var(--canon-space-5);
- }
-
- .sm\:cu-ml-6 {
- margin-left: var(--canon-space-6);
- }
-
- .sm\:cu-ml-7 {
- margin-left: var(--canon-space-7);
- }
-
- .sm\:cu-ml-8 {
- margin-left: var(--canon-space-8);
- }
-
- .sm\:cu-ml-9 {
- margin-left: var(--canon-space-9);
- }
-
- .sm\:cu-ml-10 {
- margin-left: var(--canon-space-10);
- }
-
- .sm\:cu-ml-11 {
- margin-left: var(--canon-space-11);
- }
-
- .sm\:cu-ml-12 {
- margin-left: var(--canon-space-12);
- }
-
- .sm\:cu-ml-13 {
- margin-left: var(--canon-space-13);
- }
-
- .sm\:cu-ml-14 {
- margin-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-ml {
- margin-left: var(--pl-md);
- }
-
- .md\:cu-ml-0\.5 {
- margin-left: var(--canon-space-0_5);
- }
-
- .md\:cu-ml-1 {
- margin-left: var(--canon-space-1);
- }
-
- .md\:cu-ml-1\.5 {
- margin-left: var(--canon-space-1_5);
- }
-
- .md\:cu-ml-2 {
- margin-left: var(--canon-space-2);
- }
-
- .md\:cu-ml-3 {
- margin-left: var(--canon-space-3);
- }
-
- .md\:cu-ml-4 {
- margin-left: var(--canon-space-4);
- }
-
- .md\:cu-ml-5 {
- margin-left: var(--canon-space-5);
- }
-
- .md\:cu-ml-6 {
- margin-left: var(--canon-space-6);
- }
-
- .md\:cu-ml-7 {
- margin-left: var(--canon-space-7);
- }
-
- .md\:cu-ml-8 {
- margin-left: var(--canon-space-8);
- }
-
- .md\:cu-ml-9 {
- margin-left: var(--canon-space-9);
- }
-
- .md\:cu-ml-10 {
- margin-left: var(--canon-space-10);
- }
-
- .md\:cu-ml-11 {
- margin-left: var(--canon-space-11);
- }
-
- .md\:cu-ml-12 {
- margin-left: var(--canon-space-12);
- }
-
- .md\:cu-ml-13 {
- margin-left: var(--canon-space-13);
- }
-
- .md\:cu-ml-14 {
- margin-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-ml {
- margin-left: var(--pl-lg);
- }
-
- .lg\:cu-ml-0\.5 {
- margin-left: var(--canon-space-0_5);
- }
-
- .lg\:cu-ml-1 {
- margin-left: var(--canon-space-1);
- }
-
- .lg\:cu-ml-1\.5 {
- margin-left: var(--canon-space-1_5);
- }
-
- .lg\:cu-ml-2 {
- margin-left: var(--canon-space-2);
- }
-
- .lg\:cu-ml-3 {
- margin-left: var(--canon-space-3);
- }
-
- .lg\:cu-ml-4 {
- margin-left: var(--canon-space-4);
- }
-
- .lg\:cu-ml-5 {
- margin-left: var(--canon-space-5);
- }
-
- .lg\:cu-ml-6 {
- margin-left: var(--canon-space-6);
- }
-
- .lg\:cu-ml-7 {
- margin-left: var(--canon-space-7);
- }
-
- .lg\:cu-ml-8 {
- margin-left: var(--canon-space-8);
- }
-
- .lg\:cu-ml-9 {
- margin-left: var(--canon-space-9);
- }
-
- .lg\:cu-ml-10 {
- margin-left: var(--canon-space-10);
- }
-
- .lg\:cu-ml-11 {
- margin-left: var(--canon-space-11);
- }
-
- .lg\:cu-ml-12 {
- margin-left: var(--canon-space-12);
- }
-
- .lg\:cu-ml-13 {
- margin-left: var(--canon-space-13);
- }
-
- .lg\:cu-ml-14 {
- margin-left: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-ml {
- margin-left: var(--pl-xl);
- }
-
- .xl\:cu-ml-0\.5 {
- margin-left: var(--canon-space-0_5);
- }
-
- .xl\:cu-ml-1 {
- margin-left: var(--canon-space-1);
- }
-
- .xl\:cu-ml-1\.5 {
- margin-left: var(--canon-space-1_5);
- }
-
- .xl\:cu-ml-2 {
- margin-left: var(--canon-space-2);
- }
-
- .xl\:cu-ml-3 {
- margin-left: var(--canon-space-3);
- }
-
- .xl\:cu-ml-4 {
- margin-left: var(--canon-space-4);
- }
-
- .xl\:cu-ml-5 {
- margin-left: var(--canon-space-5);
- }
-
- .xl\:cu-ml-6 {
- margin-left: var(--canon-space-6);
- }
-
- .xl\:cu-ml-7 {
- margin-left: var(--canon-space-7);
- }
-
- .xl\:cu-ml-8 {
- margin-left: var(--canon-space-8);
- }
-
- .xl\:cu-ml-9 {
- margin-left: var(--canon-space-9);
- }
-
- .xl\:cu-ml-10 {
- margin-left: var(--canon-space-10);
- }
-
- .xl\:cu-ml-11 {
- margin-left: var(--canon-space-11);
- }
-
- .xl\:cu-ml-12 {
- margin-left: var(--canon-space-12);
- }
-
- .xl\:cu-ml-13 {
- margin-left: var(--canon-space-13);
- }
-
- .xl\:cu-ml-14 {
- margin-left: var(--canon-space-14);
- }
-}
-
-.cu-mr {
- margin-right: var(--mr);
-}
-
-.cu-mr-0\.5 {
- margin-right: var(--canon-space-0_5);
-}
-
-.cu-mr-1 {
- margin-right: var(--canon-space-1);
-}
-
-.cu-mr-1\.5 {
- margin-right: var(--canon-space-1_5);
-}
-
-.cu-mr-2 {
- margin-right: var(--canon-space-2);
-}
-
-.cu-mr-3 {
- margin-right: var(--canon-space-3);
-}
-
-.cu-mr-4 {
- margin-right: var(--canon-space-4);
-}
-
-.cu-mr-5 {
- margin-right: var(--canon-space-5);
-}
-
-.cu-mr-6 {
- margin-right: var(--canon-space-6);
-}
-
-.cu-mr-7 {
- margin-right: var(--canon-space-7);
-}
-
-.cu-mr-8 {
- margin-right: var(--canon-space-8);
-}
-
-.cu-mr-9 {
- margin-right: var(--canon-space-9);
-}
-
-.cu-mr-10 {
- margin-right: var(--canon-space-10);
-}
-
-.cu-mr-11 {
- margin-right: var(--canon-space-11);
-}
-
-.cu-mr-12 {
- margin-right: var(--canon-space-12);
-}
-
-.cu-mr-13 {
- margin-right: var(--canon-space-13);
-}
-
-.cu-mr-14 {
- margin-right: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-mr {
- margin-right: var(--pr-xs);
- }
-
- .xs\:cu-mr-0\.5 {
- margin-right: var(--canon-space-0_5);
- }
-
- .xs\:cu-mr-1 {
- margin-right: var(--canon-space-1);
- }
-
- .xs\:cu-mr-1\.5 {
- margin-right: var(--canon-space-1_5);
- }
-
- .xs\:cu-mr-2 {
- margin-right: var(--canon-space-2);
- }
-
- .xs\:cu-mr-3 {
- margin-right: var(--canon-space-3);
- }
-
- .xs\:cu-mr-4 {
- margin-right: var(--canon-space-4);
- }
-
- .xs\:cu-mr-5 {
- margin-right: var(--canon-space-5);
- }
-
- .xs\:cu-mr-6 {
- margin-right: var(--canon-space-6);
- }
-
- .xs\:cu-mr-7 {
- margin-right: var(--canon-space-7);
- }
-
- .xs\:cu-mr-8 {
- margin-right: var(--canon-space-8);
- }
-
- .xs\:cu-mr-9 {
- margin-right: var(--canon-space-9);
- }
-
- .xs\:cu-mr-10 {
- margin-right: var(--canon-space-10);
- }
-
- .xs\:cu-mr-11 {
- margin-right: var(--canon-space-11);
- }
-
- .xs\:cu-mr-12 {
- margin-right: var(--canon-space-12);
- }
-
- .xs\:cu-mr-13 {
- margin-right: var(--canon-space-13);
- }
-
- .xs\:cu-mr-14 {
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-mr {
- margin-right: var(--pr-sm);
- }
-
- .sm\:cu-mr-0\.5 {
- margin-right: var(--canon-space-0_5);
- }
-
- .sm\:cu-mr-1 {
- margin-right: var(--canon-space-1);
- }
-
- .sm\:cu-mr-1\.5 {
- margin-right: var(--canon-space-1_5);
- }
-
- .sm\:cu-mr-2 {
- margin-right: var(--canon-space-2);
- }
-
- .sm\:cu-mr-3 {
- margin-right: var(--canon-space-3);
- }
-
- .sm\:cu-mr-4 {
- margin-right: var(--canon-space-4);
- }
-
- .sm\:cu-mr-5 {
- margin-right: var(--canon-space-5);
- }
-
- .sm\:cu-mr-6 {
- margin-right: var(--canon-space-6);
- }
-
- .sm\:cu-mr-7 {
- margin-right: var(--canon-space-7);
- }
-
- .sm\:cu-mr-8 {
- margin-right: var(--canon-space-8);
- }
-
- .sm\:cu-mr-9 {
- margin-right: var(--canon-space-9);
- }
-
- .sm\:cu-mr-10 {
- margin-right: var(--canon-space-10);
- }
-
- .sm\:cu-mr-11 {
- margin-right: var(--canon-space-11);
- }
-
- .sm\:cu-mr-12 {
- margin-right: var(--canon-space-12);
- }
-
- .sm\:cu-mr-13 {
- margin-right: var(--canon-space-13);
- }
-
- .sm\:cu-mr-14 {
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-mr {
- margin-right: var(--pr-md);
- }
-
- .md\:cu-mr-0\.5 {
- margin-right: var(--canon-space-0_5);
- }
-
- .md\:cu-mr-1 {
- margin-right: var(--canon-space-1);
- }
-
- .md\:cu-mr-1\.5 {
- margin-right: var(--canon-space-1_5);
- }
-
- .md\:cu-mr-2 {
- margin-right: var(--canon-space-2);
- }
-
- .md\:cu-mr-3 {
- margin-right: var(--canon-space-3);
- }
-
- .md\:cu-mr-4 {
- margin-right: var(--canon-space-4);
- }
-
- .md\:cu-mr-5 {
- margin-right: var(--canon-space-5);
- }
-
- .md\:cu-mr-6 {
- margin-right: var(--canon-space-6);
- }
-
- .md\:cu-mr-7 {
- margin-right: var(--canon-space-7);
- }
-
- .md\:cu-mr-8 {
- margin-right: var(--canon-space-8);
- }
-
- .md\:cu-mr-9 {
- margin-right: var(--canon-space-9);
- }
-
- .md\:cu-mr-10 {
- margin-right: var(--canon-space-10);
- }
-
- .md\:cu-mr-11 {
- margin-right: var(--canon-space-11);
- }
-
- .md\:cu-mr-12 {
- margin-right: var(--canon-space-12);
- }
-
- .md\:cu-mr-13 {
- margin-right: var(--canon-space-13);
- }
-
- .md\:cu-mr-14 {
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-mr {
- margin-right: var(--pr-lg);
- }
-
- .lg\:cu-mr-0\.5 {
- margin-right: var(--canon-space-0_5);
- }
-
- .lg\:cu-mr-1 {
- margin-right: var(--canon-space-1);
- }
-
- .lg\:cu-mr-1\.5 {
- margin-right: var(--canon-space-1_5);
- }
-
- .lg\:cu-mr-2 {
- margin-right: var(--canon-space-2);
- }
-
- .lg\:cu-mr-3 {
- margin-right: var(--canon-space-3);
- }
-
- .lg\:cu-mr-4 {
- margin-right: var(--canon-space-4);
- }
-
- .lg\:cu-mr-5 {
- margin-right: var(--canon-space-5);
- }
-
- .lg\:cu-mr-6 {
- margin-right: var(--canon-space-6);
- }
-
- .lg\:cu-mr-7 {
- margin-right: var(--canon-space-7);
- }
-
- .lg\:cu-mr-8 {
- margin-right: var(--canon-space-8);
- }
-
- .lg\:cu-mr-9 {
- margin-right: var(--canon-space-9);
- }
-
- .lg\:cu-mr-10 {
- margin-right: var(--canon-space-10);
- }
-
- .lg\:cu-mr-11 {
- margin-right: var(--canon-space-11);
- }
-
- .lg\:cu-mr-12 {
- margin-right: var(--canon-space-12);
- }
-
- .lg\:cu-mr-13 {
- margin-right: var(--canon-space-13);
- }
-
- .lg\:cu-mr-14 {
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-mr {
- margin-right: var(--pr-xl);
- }
-
- .xl\:cu-mr-0\.5 {
- margin-right: var(--canon-space-0_5);
- }
-
- .xl\:cu-mr-1 {
- margin-right: var(--canon-space-1);
- }
-
- .xl\:cu-mr-1\.5 {
- margin-right: var(--canon-space-1_5);
- }
-
- .xl\:cu-mr-2 {
- margin-right: var(--canon-space-2);
- }
-
- .xl\:cu-mr-3 {
- margin-right: var(--canon-space-3);
- }
-
- .xl\:cu-mr-4 {
- margin-right: var(--canon-space-4);
- }
-
- .xl\:cu-mr-5 {
- margin-right: var(--canon-space-5);
- }
-
- .xl\:cu-mr-6 {
- margin-right: var(--canon-space-6);
- }
-
- .xl\:cu-mr-7 {
- margin-right: var(--canon-space-7);
- }
-
- .xl\:cu-mr-8 {
- margin-right: var(--canon-space-8);
- }
-
- .xl\:cu-mr-9 {
- margin-right: var(--canon-space-9);
- }
-
- .xl\:cu-mr-10 {
- margin-right: var(--canon-space-10);
- }
-
- .xl\:cu-mr-11 {
- margin-right: var(--canon-space-11);
- }
-
- .xl\:cu-mr-12 {
- margin-right: var(--canon-space-12);
- }
-
- .xl\:cu-mr-13 {
- margin-right: var(--canon-space-13);
- }
-
- .xl\:cu-mr-14 {
- margin-right: var(--canon-space-14);
- }
-}
-
-.cu-mt {
- margin-top: var(--mt);
-}
-
-.cu-mt-0\.5 {
- margin-top: var(--canon-space-0_5);
-}
-
-.cu-mt-1 {
- margin-top: var(--canon-space-1);
-}
-
-.cu-mt-1\.5 {
- margin-top: var(--canon-space-1_5);
-}
-
-.cu-mt-2 {
- margin-top: var(--canon-space-2);
-}
-
-.cu-mt-3 {
- margin-top: var(--canon-space-3);
-}
-
-.cu-mt-4 {
- margin-top: var(--canon-space-4);
-}
-
-.cu-mt-5 {
- margin-top: var(--canon-space-5);
-}
-
-.cu-mt-6 {
- margin-top: var(--canon-space-6);
-}
-
-.cu-mt-7 {
- margin-top: var(--canon-space-7);
-}
-
-.cu-mt-8 {
- margin-top: var(--canon-space-8);
-}
-
-.cu-mt-9 {
- margin-top: var(--canon-space-9);
-}
-
-.cu-mt-10 {
- margin-top: var(--canon-space-10);
-}
-
-.cu-mt-11 {
- margin-top: var(--canon-space-11);
-}
-
-.cu-mt-12 {
- margin-top: var(--canon-space-12);
-}
-
-.cu-mt-13 {
- margin-top: var(--canon-space-13);
-}
-
-.cu-mt-14 {
- margin-top: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-mt {
- margin-top: var(--pt-xs);
- }
-
- .xs\:cu-mt-0\.5 {
- margin-top: var(--canon-space-0_5);
- }
-
- .xs\:cu-mt-1 {
- margin-top: var(--canon-space-1);
- }
-
- .xs\:cu-mt-1\.5 {
- margin-top: var(--canon-space-1_5);
- }
-
- .xs\:cu-mt-2 {
- margin-top: var(--canon-space-2);
- }
-
- .xs\:cu-mt-3 {
- margin-top: var(--canon-space-3);
- }
-
- .xs\:cu-mt-4 {
- margin-top: var(--canon-space-4);
- }
-
- .xs\:cu-mt-5 {
- margin-top: var(--canon-space-5);
- }
-
- .xs\:cu-mt-6 {
- margin-top: var(--canon-space-6);
- }
-
- .xs\:cu-mt-7 {
- margin-top: var(--canon-space-7);
- }
-
- .xs\:cu-mt-8 {
- margin-top: var(--canon-space-8);
- }
-
- .xs\:cu-mt-9 {
- margin-top: var(--canon-space-9);
- }
-
- .xs\:cu-mt-10 {
- margin-top: var(--canon-space-10);
- }
-
- .xs\:cu-mt-11 {
- margin-top: var(--canon-space-11);
- }
-
- .xs\:cu-mt-12 {
- margin-top: var(--canon-space-12);
- }
-
- .xs\:cu-mt-13 {
- margin-top: var(--canon-space-13);
- }
-
- .xs\:cu-mt-14 {
- margin-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-mt {
- margin-top: var(--pt-sm);
- }
-
- .sm\:cu-mt-0\.5 {
- margin-top: var(--canon-space-0_5);
- }
-
- .sm\:cu-mt-1 {
- margin-top: var(--canon-space-1);
- }
-
- .sm\:cu-mt-1\.5 {
- margin-top: var(--canon-space-1_5);
- }
-
- .sm\:cu-mt-2 {
- margin-top: var(--canon-space-2);
- }
-
- .sm\:cu-mt-3 {
- margin-top: var(--canon-space-3);
- }
-
- .sm\:cu-mt-4 {
- margin-top: var(--canon-space-4);
- }
-
- .sm\:cu-mt-5 {
- margin-top: var(--canon-space-5);
- }
-
- .sm\:cu-mt-6 {
- margin-top: var(--canon-space-6);
- }
-
- .sm\:cu-mt-7 {
- margin-top: var(--canon-space-7);
- }
-
- .sm\:cu-mt-8 {
- margin-top: var(--canon-space-8);
- }
-
- .sm\:cu-mt-9 {
- margin-top: var(--canon-space-9);
- }
-
- .sm\:cu-mt-10 {
- margin-top: var(--canon-space-10);
- }
-
- .sm\:cu-mt-11 {
- margin-top: var(--canon-space-11);
- }
-
- .sm\:cu-mt-12 {
- margin-top: var(--canon-space-12);
- }
-
- .sm\:cu-mt-13 {
- margin-top: var(--canon-space-13);
- }
-
- .sm\:cu-mt-14 {
- margin-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-mt {
- margin-top: var(--pt-md);
- }
-
- .md\:cu-mt-0\.5 {
- margin-top: var(--canon-space-0_5);
- }
-
- .md\:cu-mt-1 {
- margin-top: var(--canon-space-1);
- }
-
- .md\:cu-mt-1\.5 {
- margin-top: var(--canon-space-1_5);
- }
-
- .md\:cu-mt-2 {
- margin-top: var(--canon-space-2);
- }
-
- .md\:cu-mt-3 {
- margin-top: var(--canon-space-3);
- }
-
- .md\:cu-mt-4 {
- margin-top: var(--canon-space-4);
- }
-
- .md\:cu-mt-5 {
- margin-top: var(--canon-space-5);
- }
-
- .md\:cu-mt-6 {
- margin-top: var(--canon-space-6);
- }
-
- .md\:cu-mt-7 {
- margin-top: var(--canon-space-7);
- }
-
- .md\:cu-mt-8 {
- margin-top: var(--canon-space-8);
- }
-
- .md\:cu-mt-9 {
- margin-top: var(--canon-space-9);
- }
-
- .md\:cu-mt-10 {
- margin-top: var(--canon-space-10);
- }
-
- .md\:cu-mt-11 {
- margin-top: var(--canon-space-11);
- }
-
- .md\:cu-mt-12 {
- margin-top: var(--canon-space-12);
- }
-
- .md\:cu-mt-13 {
- margin-top: var(--canon-space-13);
- }
-
- .md\:cu-mt-14 {
- margin-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-mt {
- margin-top: var(--pt-lg);
- }
-
- .lg\:cu-mt-0\.5 {
- margin-top: var(--canon-space-0_5);
- }
-
- .lg\:cu-mt-1 {
- margin-top: var(--canon-space-1);
- }
-
- .lg\:cu-mt-1\.5 {
- margin-top: var(--canon-space-1_5);
- }
-
- .lg\:cu-mt-2 {
- margin-top: var(--canon-space-2);
- }
-
- .lg\:cu-mt-3 {
- margin-top: var(--canon-space-3);
- }
-
- .lg\:cu-mt-4 {
- margin-top: var(--canon-space-4);
- }
-
- .lg\:cu-mt-5 {
- margin-top: var(--canon-space-5);
- }
-
- .lg\:cu-mt-6 {
- margin-top: var(--canon-space-6);
- }
-
- .lg\:cu-mt-7 {
- margin-top: var(--canon-space-7);
- }
-
- .lg\:cu-mt-8 {
- margin-top: var(--canon-space-8);
- }
-
- .lg\:cu-mt-9 {
- margin-top: var(--canon-space-9);
- }
-
- .lg\:cu-mt-10 {
- margin-top: var(--canon-space-10);
- }
-
- .lg\:cu-mt-11 {
- margin-top: var(--canon-space-11);
- }
-
- .lg\:cu-mt-12 {
- margin-top: var(--canon-space-12);
- }
-
- .lg\:cu-mt-13 {
- margin-top: var(--canon-space-13);
- }
-
- .lg\:cu-mt-14 {
- margin-top: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-mt {
- margin-top: var(--pt-xl);
- }
-
- .xl\:cu-mt-0\.5 {
- margin-top: var(--canon-space-0_5);
- }
-
- .xl\:cu-mt-1 {
- margin-top: var(--canon-space-1);
- }
-
- .xl\:cu-mt-1\.5 {
- margin-top: var(--canon-space-1_5);
- }
-
- .xl\:cu-mt-2 {
- margin-top: var(--canon-space-2);
- }
-
- .xl\:cu-mt-3 {
- margin-top: var(--canon-space-3);
- }
-
- .xl\:cu-mt-4 {
- margin-top: var(--canon-space-4);
- }
-
- .xl\:cu-mt-5 {
- margin-top: var(--canon-space-5);
- }
-
- .xl\:cu-mt-6 {
- margin-top: var(--canon-space-6);
- }
-
- .xl\:cu-mt-7 {
- margin-top: var(--canon-space-7);
- }
-
- .xl\:cu-mt-8 {
- margin-top: var(--canon-space-8);
- }
-
- .xl\:cu-mt-9 {
- margin-top: var(--canon-space-9);
- }
-
- .xl\:cu-mt-10 {
- margin-top: var(--canon-space-10);
- }
-
- .xl\:cu-mt-11 {
- margin-top: var(--canon-space-11);
- }
-
- .xl\:cu-mt-12 {
- margin-top: var(--canon-space-12);
- }
-
- .xl\:cu-mt-13 {
- margin-top: var(--canon-space-13);
- }
-
- .xl\:cu-mt-14 {
- margin-top: var(--canon-space-14);
- }
-}
-
-.cu-mb {
- margin-bottom: var(--mb);
-}
-
-.cu-mb-0\.5 {
- margin-bottom: var(--canon-space-0_5);
-}
-
-.cu-mb-1 {
- margin-bottom: var(--canon-space-1);
-}
-
-.cu-mb-1\.5 {
- margin-bottom: var(--canon-space-1_5);
-}
-
-.cu-mb-2 {
- margin-bottom: var(--canon-space-2);
-}
-
-.cu-mb-3 {
- margin-bottom: var(--canon-space-3);
-}
-
-.cu-mb-4 {
- margin-bottom: var(--canon-space-4);
-}
-
-.cu-mb-5 {
- margin-bottom: var(--canon-space-5);
-}
-
-.cu-mb-6 {
- margin-bottom: var(--canon-space-6);
-}
-
-.cu-mb-7 {
- margin-bottom: var(--canon-space-7);
-}
-
-.cu-mb-8 {
- margin-bottom: var(--canon-space-8);
-}
-
-.cu-mb-9 {
- margin-bottom: var(--canon-space-9);
-}
-
-.cu-mb-10 {
- margin-bottom: var(--canon-space-10);
-}
-
-.cu-mb-11 {
- margin-bottom: var(--canon-space-11);
-}
-
-.cu-mb-12 {
- margin-bottom: var(--canon-space-12);
-}
-
-.cu-mb-13 {
- margin-bottom: var(--canon-space-13);
-}
-
-.cu-mb-14 {
- margin-bottom: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-mb {
- margin-bottom: var(--pb-xs);
- }
-
- .xs\:cu-mb-0\.5 {
- margin-bottom: var(--canon-space-0_5);
- }
-
- .xs\:cu-mb-1 {
- margin-bottom: var(--canon-space-1);
- }
-
- .xs\:cu-mb-1\.5 {
- margin-bottom: var(--canon-space-1_5);
- }
-
- .xs\:cu-mb-2 {
- margin-bottom: var(--canon-space-2);
- }
-
- .xs\:cu-mb-3 {
- margin-bottom: var(--canon-space-3);
- }
-
- .xs\:cu-mb-4 {
- margin-bottom: var(--canon-space-4);
- }
-
- .xs\:cu-mb-5 {
- margin-bottom: var(--canon-space-5);
- }
-
- .xs\:cu-mb-6 {
- margin-bottom: var(--canon-space-6);
- }
-
- .xs\:cu-mb-7 {
- margin-bottom: var(--canon-space-7);
- }
-
- .xs\:cu-mb-8 {
- margin-bottom: var(--canon-space-8);
- }
-
- .xs\:cu-mb-9 {
- margin-bottom: var(--canon-space-9);
- }
-
- .xs\:cu-mb-10 {
- margin-bottom: var(--canon-space-10);
- }
-
- .xs\:cu-mb-11 {
- margin-bottom: var(--canon-space-11);
- }
-
- .xs\:cu-mb-12 {
- margin-bottom: var(--canon-space-12);
- }
-
- .xs\:cu-mb-13 {
- margin-bottom: var(--canon-space-13);
- }
-
- .xs\:cu-mb-14 {
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-mb {
- margin-bottom: var(--pb-sm);
- }
-
- .sm\:cu-mb-0\.5 {
- margin-bottom: var(--canon-space-0_5);
- }
-
- .sm\:cu-mb-1 {
- margin-bottom: var(--canon-space-1);
- }
-
- .sm\:cu-mb-1\.5 {
- margin-bottom: var(--canon-space-1_5);
- }
-
- .sm\:cu-mb-2 {
- margin-bottom: var(--canon-space-2);
- }
-
- .sm\:cu-mb-3 {
- margin-bottom: var(--canon-space-3);
- }
-
- .sm\:cu-mb-4 {
- margin-bottom: var(--canon-space-4);
- }
-
- .sm\:cu-mb-5 {
- margin-bottom: var(--canon-space-5);
- }
-
- .sm\:cu-mb-6 {
- margin-bottom: var(--canon-space-6);
- }
-
- .sm\:cu-mb-7 {
- margin-bottom: var(--canon-space-7);
- }
-
- .sm\:cu-mb-8 {
- margin-bottom: var(--canon-space-8);
- }
-
- .sm\:cu-mb-9 {
- margin-bottom: var(--canon-space-9);
- }
-
- .sm\:cu-mb-10 {
- margin-bottom: var(--canon-space-10);
- }
-
- .sm\:cu-mb-11 {
- margin-bottom: var(--canon-space-11);
- }
-
- .sm\:cu-mb-12 {
- margin-bottom: var(--canon-space-12);
- }
-
- .sm\:cu-mb-13 {
- margin-bottom: var(--canon-space-13);
- }
-
- .sm\:cu-mb-14 {
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-mb {
- margin-bottom: var(--pb-md);
- }
-
- .md\:cu-mb-0\.5 {
- margin-bottom: var(--canon-space-0_5);
- }
-
- .md\:cu-mb-1 {
- margin-bottom: var(--canon-space-1);
- }
-
- .md\:cu-mb-1\.5 {
- margin-bottom: var(--canon-space-1_5);
- }
-
- .md\:cu-mb-2 {
- margin-bottom: var(--canon-space-2);
- }
-
- .md\:cu-mb-3 {
- margin-bottom: var(--canon-space-3);
- }
-
- .md\:cu-mb-4 {
- margin-bottom: var(--canon-space-4);
- }
-
- .md\:cu-mb-5 {
- margin-bottom: var(--canon-space-5);
- }
-
- .md\:cu-mb-6 {
- margin-bottom: var(--canon-space-6);
- }
-
- .md\:cu-mb-7 {
- margin-bottom: var(--canon-space-7);
- }
-
- .md\:cu-mb-8 {
- margin-bottom: var(--canon-space-8);
- }
-
- .md\:cu-mb-9 {
- margin-bottom: var(--canon-space-9);
- }
-
- .md\:cu-mb-10 {
- margin-bottom: var(--canon-space-10);
- }
-
- .md\:cu-mb-11 {
- margin-bottom: var(--canon-space-11);
- }
-
- .md\:cu-mb-12 {
- margin-bottom: var(--canon-space-12);
- }
-
- .md\:cu-mb-13 {
- margin-bottom: var(--canon-space-13);
- }
-
- .md\:cu-mb-14 {
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-mb {
- margin-bottom: var(--pb-lg);
- }
-
- .lg\:cu-mb-0\.5 {
- margin-bottom: var(--canon-space-0_5);
- }
-
- .lg\:cu-mb-1 {
- margin-bottom: var(--canon-space-1);
- }
-
- .lg\:cu-mb-1\.5 {
- margin-bottom: var(--canon-space-1_5);
- }
-
- .lg\:cu-mb-2 {
- margin-bottom: var(--canon-space-2);
- }
-
- .lg\:cu-mb-3 {
- margin-bottom: var(--canon-space-3);
- }
-
- .lg\:cu-mb-4 {
- margin-bottom: var(--canon-space-4);
- }
-
- .lg\:cu-mb-5 {
- margin-bottom: var(--canon-space-5);
- }
-
- .lg\:cu-mb-6 {
- margin-bottom: var(--canon-space-6);
- }
-
- .lg\:cu-mb-7 {
- margin-bottom: var(--canon-space-7);
- }
-
- .lg\:cu-mb-8 {
- margin-bottom: var(--canon-space-8);
- }
-
- .lg\:cu-mb-9 {
- margin-bottom: var(--canon-space-9);
- }
-
- .lg\:cu-mb-10 {
- margin-bottom: var(--canon-space-10);
- }
-
- .lg\:cu-mb-11 {
- margin-bottom: var(--canon-space-11);
- }
-
- .lg\:cu-mb-12 {
- margin-bottom: var(--canon-space-12);
- }
-
- .lg\:cu-mb-13 {
- margin-bottom: var(--canon-space-13);
- }
-
- .lg\:cu-mb-14 {
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-mb {
- margin-bottom: var(--pb-xl);
- }
-
- .xl\:cu-mb-0\.5 {
- margin-bottom: var(--canon-space-0_5);
- }
-
- .xl\:cu-mb-1 {
- margin-bottom: var(--canon-space-1);
- }
-
- .xl\:cu-mb-1\.5 {
- margin-bottom: var(--canon-space-1_5);
- }
-
- .xl\:cu-mb-2 {
- margin-bottom: var(--canon-space-2);
- }
-
- .xl\:cu-mb-3 {
- margin-bottom: var(--canon-space-3);
- }
-
- .xl\:cu-mb-4 {
- margin-bottom: var(--canon-space-4);
- }
-
- .xl\:cu-mb-5 {
- margin-bottom: var(--canon-space-5);
- }
-
- .xl\:cu-mb-6 {
- margin-bottom: var(--canon-space-6);
- }
-
- .xl\:cu-mb-7 {
- margin-bottom: var(--canon-space-7);
- }
-
- .xl\:cu-mb-8 {
- margin-bottom: var(--canon-space-8);
- }
-
- .xl\:cu-mb-9 {
- margin-bottom: var(--canon-space-9);
- }
-
- .xl\:cu-mb-10 {
- margin-bottom: var(--canon-space-10);
- }
-
- .xl\:cu-mb-11 {
- margin-bottom: var(--canon-space-11);
- }
-
- .xl\:cu-mb-12 {
- margin-bottom: var(--canon-space-12);
- }
-
- .xl\:cu-mb-13 {
- margin-bottom: var(--canon-space-13);
- }
-
- .xl\:cu-mb-14 {
- margin-bottom: var(--canon-space-14);
- }
-}
-
-.cu-my {
- margin-top: var(--my);
- margin-bottom: var(--my);
-}
-
-.cu-my-0\.5 {
- margin-top: var(--canon-space-0_5);
- margin-bottom: var(--canon-space-0_5);
-}
-
-.cu-my-1 {
- margin-top: var(--canon-space-1);
- margin-bottom: var(--canon-space-1);
-}
-
-.cu-my-1\.5 {
- margin-top: var(--canon-space-1_5);
- margin-bottom: var(--canon-space-1_5);
-}
-
-.cu-my-2 {
- margin-top: var(--canon-space-2);
- margin-bottom: var(--canon-space-2);
-}
-
-.cu-my-3 {
- margin-top: var(--canon-space-3);
- margin-bottom: var(--canon-space-3);
-}
-
-.cu-my-4 {
- margin-top: var(--canon-space-4);
- margin-bottom: var(--canon-space-4);
-}
-
-.cu-my-5 {
- margin-top: var(--canon-space-5);
- margin-bottom: var(--canon-space-5);
-}
-
-.cu-my-6 {
- margin-top: var(--canon-space-6);
- margin-bottom: var(--canon-space-6);
-}
-
-.cu-my-7 {
- margin-top: var(--canon-space-7);
- margin-bottom: var(--canon-space-7);
-}
-
-.cu-my-8 {
- margin-top: var(--canon-space-8);
- margin-bottom: var(--canon-space-8);
-}
-
-.cu-my-9 {
- margin-top: var(--canon-space-9);
- margin-bottom: var(--canon-space-9);
-}
-
-.cu-my-10 {
- margin-top: var(--canon-space-10);
- margin-bottom: var(--canon-space-10);
-}
-
-.cu-my-11 {
- margin-top: var(--canon-space-11);
- margin-bottom: var(--canon-space-11);
-}
-
-.cu-my-12 {
- margin-top: var(--canon-space-12);
- margin-bottom: var(--canon-space-12);
-}
-
-.cu-my-13 {
- margin-top: var(--canon-space-13);
- margin-bottom: var(--canon-space-13);
-}
-
-.cu-my-14 {
- margin-top: var(--canon-space-14);
- margin-bottom: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-my {
- margin-top: var(--py-xs);
- margin-bottom: var(--py-xs);
- }
-
- .xs\:cu-my-0\.5 {
- margin-top: var(--canon-space-0_5);
- margin-bottom: var(--canon-space-0_5);
- }
-
- .xs\:cu-my-1 {
- margin-top: var(--canon-space-1);
- margin-bottom: var(--canon-space-1);
- }
-
- .xs\:cu-my-1\.5 {
- margin-top: var(--canon-space-1_5);
- margin-bottom: var(--canon-space-1_5);
- }
-
- .xs\:cu-my-2 {
- margin-top: var(--canon-space-2);
- margin-bottom: var(--canon-space-2);
- }
-
- .xs\:cu-my-3 {
- margin-top: var(--canon-space-3);
- margin-bottom: var(--canon-space-3);
- }
-
- .xs\:cu-my-4 {
- margin-top: var(--canon-space-4);
- margin-bottom: var(--canon-space-4);
- }
-
- .xs\:cu-my-5 {
- margin-top: var(--canon-space-5);
- margin-bottom: var(--canon-space-5);
- }
-
- .xs\:cu-my-6 {
- margin-top: var(--canon-space-6);
- margin-bottom: var(--canon-space-6);
- }
-
- .xs\:cu-my-7 {
- margin-top: var(--canon-space-7);
- margin-bottom: var(--canon-space-7);
- }
-
- .xs\:cu-my-8 {
- margin-top: var(--canon-space-8);
- margin-bottom: var(--canon-space-8);
- }
-
- .xs\:cu-my-9 {
- margin-top: var(--canon-space-9);
- margin-bottom: var(--canon-space-9);
- }
-
- .xs\:cu-my-10 {
- margin-top: var(--canon-space-10);
- margin-bottom: var(--canon-space-10);
- }
-
- .xs\:cu-my-11 {
- margin-top: var(--canon-space-11);
- margin-bottom: var(--canon-space-11);
- }
-
- .xs\:cu-my-12 {
- margin-top: var(--canon-space-12);
- margin-bottom: var(--canon-space-12);
- }
-
- .xs\:cu-my-13 {
- margin-top: var(--canon-space-13);
- margin-bottom: var(--canon-space-13);
- }
-
- .xs\:cu-my-14 {
- margin-top: var(--canon-space-14);
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-my {
- margin-top: var(--py-sm);
- margin-bottom: var(--py-sm);
- }
-
- .sm\:cu-my-0\.5 {
- margin-top: var(--canon-space-0_5);
- margin-bottom: var(--canon-space-0_5);
- }
-
- .sm\:cu-my-1 {
- margin-top: var(--canon-space-1);
- margin-bottom: var(--canon-space-1);
- }
-
- .sm\:cu-my-1\.5 {
- margin-top: var(--canon-space-1_5);
- margin-bottom: var(--canon-space-1_5);
- }
-
- .sm\:cu-my-2 {
- margin-top: var(--canon-space-2);
- margin-bottom: var(--canon-space-2);
- }
-
- .sm\:cu-my-3 {
- margin-top: var(--canon-space-3);
- margin-bottom: var(--canon-space-3);
- }
-
- .sm\:cu-my-4 {
- margin-top: var(--canon-space-4);
- margin-bottom: var(--canon-space-4);
- }
-
- .sm\:cu-my-5 {
- margin-top: var(--canon-space-5);
- margin-bottom: var(--canon-space-5);
- }
-
- .sm\:cu-my-6 {
- margin-top: var(--canon-space-6);
- margin-bottom: var(--canon-space-6);
- }
-
- .sm\:cu-my-7 {
- margin-top: var(--canon-space-7);
- margin-bottom: var(--canon-space-7);
- }
-
- .sm\:cu-my-8 {
- margin-top: var(--canon-space-8);
- margin-bottom: var(--canon-space-8);
- }
-
- .sm\:cu-my-9 {
- margin-top: var(--canon-space-9);
- margin-bottom: var(--canon-space-9);
- }
-
- .sm\:cu-my-10 {
- margin-top: var(--canon-space-10);
- margin-bottom: var(--canon-space-10);
- }
-
- .sm\:cu-my-11 {
- margin-top: var(--canon-space-11);
- margin-bottom: var(--canon-space-11);
- }
-
- .sm\:cu-my-12 {
- margin-top: var(--canon-space-12);
- margin-bottom: var(--canon-space-12);
- }
-
- .sm\:cu-my-13 {
- margin-top: var(--canon-space-13);
- margin-bottom: var(--canon-space-13);
- }
-
- .sm\:cu-my-14 {
- margin-top: var(--canon-space-14);
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-my {
- margin-top: var(--py-md);
- margin-bottom: var(--py-md);
- }
-
- .md\:cu-my-0\.5 {
- margin-top: var(--canon-space-0_5);
- margin-bottom: var(--canon-space-0_5);
- }
-
- .md\:cu-my-1 {
- margin-top: var(--canon-space-1);
- margin-bottom: var(--canon-space-1);
- }
-
- .md\:cu-my-1\.5 {
- margin-top: var(--canon-space-1_5);
- margin-bottom: var(--canon-space-1_5);
- }
-
- .md\:cu-my-2 {
- margin-top: var(--canon-space-2);
- margin-bottom: var(--canon-space-2);
- }
-
- .md\:cu-my-3 {
- margin-top: var(--canon-space-3);
- margin-bottom: var(--canon-space-3);
- }
-
- .md\:cu-my-4 {
- margin-top: var(--canon-space-4);
- margin-bottom: var(--canon-space-4);
- }
-
- .md\:cu-my-5 {
- margin-top: var(--canon-space-5);
- margin-bottom: var(--canon-space-5);
- }
-
- .md\:cu-my-6 {
- margin-top: var(--canon-space-6);
- margin-bottom: var(--canon-space-6);
- }
-
- .md\:cu-my-7 {
- margin-top: var(--canon-space-7);
- margin-bottom: var(--canon-space-7);
- }
-
- .md\:cu-my-8 {
- margin-top: var(--canon-space-8);
- margin-bottom: var(--canon-space-8);
- }
-
- .md\:cu-my-9 {
- margin-top: var(--canon-space-9);
- margin-bottom: var(--canon-space-9);
- }
-
- .md\:cu-my-10 {
- margin-top: var(--canon-space-10);
- margin-bottom: var(--canon-space-10);
- }
-
- .md\:cu-my-11 {
- margin-top: var(--canon-space-11);
- margin-bottom: var(--canon-space-11);
- }
-
- .md\:cu-my-12 {
- margin-top: var(--canon-space-12);
- margin-bottom: var(--canon-space-12);
- }
-
- .md\:cu-my-13 {
- margin-top: var(--canon-space-13);
- margin-bottom: var(--canon-space-13);
- }
-
- .md\:cu-my-14 {
- margin-top: var(--canon-space-14);
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-my {
- margin-top: var(--py-lg);
- margin-bottom: var(--py-lg);
- }
-
- .lg\:cu-my-0\.5 {
- margin-top: var(--canon-space-0_5);
- margin-bottom: var(--canon-space-0_5);
- }
-
- .lg\:cu-my-1 {
- margin-top: var(--canon-space-1);
- margin-bottom: var(--canon-space-1);
- }
-
- .lg\:cu-my-1\.5 {
- margin-top: var(--canon-space-1_5);
- margin-bottom: var(--canon-space-1_5);
- }
-
- .lg\:cu-my-2 {
- margin-top: var(--canon-space-2);
- margin-bottom: var(--canon-space-2);
- }
-
- .lg\:cu-my-3 {
- margin-top: var(--canon-space-3);
- margin-bottom: var(--canon-space-3);
- }
-
- .lg\:cu-my-4 {
- margin-top: var(--canon-space-4);
- margin-bottom: var(--canon-space-4);
- }
-
- .lg\:cu-my-5 {
- margin-top: var(--canon-space-5);
- margin-bottom: var(--canon-space-5);
- }
-
- .lg\:cu-my-6 {
- margin-top: var(--canon-space-6);
- margin-bottom: var(--canon-space-6);
- }
-
- .lg\:cu-my-7 {
- margin-top: var(--canon-space-7);
- margin-bottom: var(--canon-space-7);
- }
-
- .lg\:cu-my-8 {
- margin-top: var(--canon-space-8);
- margin-bottom: var(--canon-space-8);
- }
-
- .lg\:cu-my-9 {
- margin-top: var(--canon-space-9);
- margin-bottom: var(--canon-space-9);
- }
-
- .lg\:cu-my-10 {
- margin-top: var(--canon-space-10);
- margin-bottom: var(--canon-space-10);
- }
-
- .lg\:cu-my-11 {
- margin-top: var(--canon-space-11);
- margin-bottom: var(--canon-space-11);
- }
-
- .lg\:cu-my-12 {
- margin-top: var(--canon-space-12);
- margin-bottom: var(--canon-space-12);
- }
-
- .lg\:cu-my-13 {
- margin-top: var(--canon-space-13);
- margin-bottom: var(--canon-space-13);
- }
-
- .lg\:cu-my-14 {
- margin-top: var(--canon-space-14);
- margin-bottom: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-my {
- margin-top: var(--py-xl);
- margin-bottom: var(--py-xl);
- }
-
- .xl\:cu-my-0\.5 {
- margin-top: var(--canon-space-0_5);
- margin-bottom: var(--canon-space-0_5);
- }
-
- .xl\:cu-my-1 {
- margin-top: var(--canon-space-1);
- margin-bottom: var(--canon-space-1);
- }
-
- .xl\:cu-my-1\.5 {
- margin-top: var(--canon-space-1_5);
- margin-bottom: var(--canon-space-1_5);
- }
-
- .xl\:cu-my-2 {
- margin-top: var(--canon-space-2);
- margin-bottom: var(--canon-space-2);
- }
-
- .xl\:cu-my-3 {
- margin-top: var(--canon-space-3);
- margin-bottom: var(--canon-space-3);
- }
-
- .xl\:cu-my-4 {
- margin-top: var(--canon-space-4);
- margin-bottom: var(--canon-space-4);
- }
-
- .xl\:cu-my-5 {
- margin-top: var(--canon-space-5);
- margin-bottom: var(--canon-space-5);
- }
-
- .xl\:cu-my-6 {
- margin-top: var(--canon-space-6);
- margin-bottom: var(--canon-space-6);
- }
-
- .xl\:cu-my-7 {
- margin-top: var(--canon-space-7);
- margin-bottom: var(--canon-space-7);
- }
-
- .xl\:cu-my-8 {
- margin-top: var(--canon-space-8);
- margin-bottom: var(--canon-space-8);
- }
-
- .xl\:cu-my-9 {
- margin-top: var(--canon-space-9);
- margin-bottom: var(--canon-space-9);
- }
-
- .xl\:cu-my-10 {
- margin-top: var(--canon-space-10);
- margin-bottom: var(--canon-space-10);
- }
-
- .xl\:cu-my-11 {
- margin-top: var(--canon-space-11);
- margin-bottom: var(--canon-space-11);
- }
-
- .xl\:cu-my-12 {
- margin-top: var(--canon-space-12);
- margin-bottom: var(--canon-space-12);
- }
-
- .xl\:cu-my-13 {
- margin-top: var(--canon-space-13);
- margin-bottom: var(--canon-space-13);
- }
-
- .xl\:cu-my-14 {
- margin-top: var(--canon-space-14);
- margin-bottom: var(--canon-space-14);
- }
-}
-
-.cu-mx {
- margin-left: var(--mx);
- margin-right: var(--mx);
-}
-
-.cu-mx-0\.5 {
- margin-left: var(--canon-space-0_5);
- margin-right: var(--canon-space-0_5);
-}
-
-.cu-mx-1 {
- margin-left: var(--canon-space-1);
- margin-right: var(--canon-space-1);
-}
-
-.cu-mx-1\.5 {
- margin-left: var(--canon-space-1_5);
- margin-right: var(--canon-space-1_5);
-}
-
-.cu-mx-2 {
- margin-left: var(--canon-space-2);
- margin-right: var(--canon-space-2);
-}
-
-.cu-mx-3 {
- margin-left: var(--canon-space-3);
- margin-right: var(--canon-space-3);
-}
-
-.cu-mx-4 {
- margin-left: var(--canon-space-4);
- margin-right: var(--canon-space-4);
-}
-
-.cu-mx-5 {
- margin-left: var(--canon-space-5);
- margin-right: var(--canon-space-5);
-}
-
-.cu-mx-6 {
- margin-left: var(--canon-space-6);
- margin-right: var(--canon-space-6);
-}
-
-.cu-mx-7 {
- margin-left: var(--canon-space-7);
- margin-right: var(--canon-space-7);
-}
-
-.cu-mx-8 {
- margin-left: var(--canon-space-8);
- margin-right: var(--canon-space-8);
-}
-
-.cu-mx-9 {
- margin-left: var(--canon-space-9);
- margin-right: var(--canon-space-9);
-}
-
-.cu-mx-10 {
- margin-left: var(--canon-space-10);
- margin-right: var(--canon-space-10);
-}
-
-.cu-mx-11 {
- margin-left: var(--canon-space-11);
- margin-right: var(--canon-space-11);
-}
-
-.cu-mx-12 {
- margin-left: var(--canon-space-12);
- margin-right: var(--canon-space-12);
-}
-
-.cu-mx-13 {
- margin-left: var(--canon-space-13);
- margin-right: var(--canon-space-13);
-}
-
-.cu-mx-14 {
- margin-left: var(--canon-space-14);
- margin-right: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-mx {
- margin-left: var(--px-xs);
- margin-right: var(--px-xs);
- }
-
- .xs\:cu-mx-0\.5 {
- margin-left: var(--canon-space-0_5);
- margin-right: var(--canon-space-0_5);
- }
-
- .xs\:cu-mx-1 {
- margin-left: var(--canon-space-1);
- margin-right: var(--canon-space-1);
- }
-
- .xs\:cu-mx-1\.5 {
- margin-left: var(--canon-space-1_5);
- margin-right: var(--canon-space-1_5);
- }
-
- .xs\:cu-mx-2 {
- margin-left: var(--canon-space-2);
- margin-right: var(--canon-space-2);
- }
-
- .xs\:cu-mx-3 {
- margin-left: var(--canon-space-3);
- margin-right: var(--canon-space-3);
- }
-
- .xs\:cu-mx-4 {
- margin-left: var(--canon-space-4);
- margin-right: var(--canon-space-4);
- }
-
- .xs\:cu-mx-5 {
- margin-left: var(--canon-space-5);
- margin-right: var(--canon-space-5);
- }
-
- .xs\:cu-mx-6 {
- margin-left: var(--canon-space-6);
- margin-right: var(--canon-space-6);
- }
-
- .xs\:cu-mx-7 {
- margin-left: var(--canon-space-7);
- margin-right: var(--canon-space-7);
- }
-
- .xs\:cu-mx-8 {
- margin-left: var(--canon-space-8);
- margin-right: var(--canon-space-8);
- }
-
- .xs\:cu-mx-9 {
- margin-left: var(--canon-space-9);
- margin-right: var(--canon-space-9);
- }
-
- .xs\:cu-mx-10 {
- margin-left: var(--canon-space-10);
- margin-right: var(--canon-space-10);
- }
-
- .xs\:cu-mx-11 {
- margin-left: var(--canon-space-11);
- margin-right: var(--canon-space-11);
- }
-
- .xs\:cu-mx-12 {
- margin-left: var(--canon-space-12);
- margin-right: var(--canon-space-12);
- }
-
- .xs\:cu-mx-13 {
- margin-left: var(--canon-space-13);
- margin-right: var(--canon-space-13);
- }
-
- .xs\:cu-mx-14 {
- margin-left: var(--canon-space-14);
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-mx {
- margin-left: var(--px-sm);
- margin-right: var(--px-sm);
- }
-
- .sm\:cu-mx-0\.5 {
- margin-left: var(--canon-space-0_5);
- margin-right: var(--canon-space-0_5);
- }
-
- .sm\:cu-mx-1 {
- margin-left: var(--canon-space-1);
- margin-right: var(--canon-space-1);
- }
-
- .sm\:cu-mx-1\.5 {
- margin-left: var(--canon-space-1_5);
- margin-right: var(--canon-space-1_5);
- }
-
- .sm\:cu-mx-2 {
- margin-left: var(--canon-space-2);
- margin-right: var(--canon-space-2);
- }
-
- .sm\:cu-mx-3 {
- margin-left: var(--canon-space-3);
- margin-right: var(--canon-space-3);
- }
-
- .sm\:cu-mx-4 {
- margin-left: var(--canon-space-4);
- margin-right: var(--canon-space-4);
- }
-
- .sm\:cu-mx-5 {
- margin-left: var(--canon-space-5);
- margin-right: var(--canon-space-5);
- }
-
- .sm\:cu-mx-6 {
- margin-left: var(--canon-space-6);
- margin-right: var(--canon-space-6);
- }
-
- .sm\:cu-mx-7 {
- margin-left: var(--canon-space-7);
- margin-right: var(--canon-space-7);
- }
-
- .sm\:cu-mx-8 {
- margin-left: var(--canon-space-8);
- margin-right: var(--canon-space-8);
- }
-
- .sm\:cu-mx-9 {
- margin-left: var(--canon-space-9);
- margin-right: var(--canon-space-9);
- }
-
- .sm\:cu-mx-10 {
- margin-left: var(--canon-space-10);
- margin-right: var(--canon-space-10);
- }
-
- .sm\:cu-mx-11 {
- margin-left: var(--canon-space-11);
- margin-right: var(--canon-space-11);
- }
-
- .sm\:cu-mx-12 {
- margin-left: var(--canon-space-12);
- margin-right: var(--canon-space-12);
- }
-
- .sm\:cu-mx-13 {
- margin-left: var(--canon-space-13);
- margin-right: var(--canon-space-13);
- }
-
- .sm\:cu-mx-14 {
- margin-left: var(--canon-space-14);
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-mx {
- margin-left: var(--px-md);
- margin-right: var(--px-md);
- }
-
- .md\:cu-mx-0\.5 {
- margin-left: var(--canon-space-0_5);
- margin-right: var(--canon-space-0_5);
- }
-
- .md\:cu-mx-1 {
- margin-left: var(--canon-space-1);
- margin-right: var(--canon-space-1);
- }
-
- .md\:cu-mx-1\.5 {
- margin-left: var(--canon-space-1_5);
- margin-right: var(--canon-space-1_5);
- }
-
- .md\:cu-mx-2 {
- margin-left: var(--canon-space-2);
- margin-right: var(--canon-space-2);
- }
-
- .md\:cu-mx-3 {
- margin-left: var(--canon-space-3);
- margin-right: var(--canon-space-3);
- }
-
- .md\:cu-mx-4 {
- margin-left: var(--canon-space-4);
- margin-right: var(--canon-space-4);
- }
-
- .md\:cu-mx-5 {
- margin-left: var(--canon-space-5);
- margin-right: var(--canon-space-5);
- }
-
- .md\:cu-mx-6 {
- margin-left: var(--canon-space-6);
- margin-right: var(--canon-space-6);
- }
-
- .md\:cu-mx-7 {
- margin-left: var(--canon-space-7);
- margin-right: var(--canon-space-7);
- }
-
- .md\:cu-mx-8 {
- margin-left: var(--canon-space-8);
- margin-right: var(--canon-space-8);
- }
-
- .md\:cu-mx-9 {
- margin-left: var(--canon-space-9);
- margin-right: var(--canon-space-9);
- }
-
- .md\:cu-mx-10 {
- margin-left: var(--canon-space-10);
- margin-right: var(--canon-space-10);
- }
-
- .md\:cu-mx-11 {
- margin-left: var(--canon-space-11);
- margin-right: var(--canon-space-11);
- }
-
- .md\:cu-mx-12 {
- margin-left: var(--canon-space-12);
- margin-right: var(--canon-space-12);
- }
-
- .md\:cu-mx-13 {
- margin-left: var(--canon-space-13);
- margin-right: var(--canon-space-13);
- }
-
- .md\:cu-mx-14 {
- margin-left: var(--canon-space-14);
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-mx {
- margin-left: var(--px-lg);
- margin-right: var(--px-lg);
- }
-
- .lg\:cu-mx-0\.5 {
- margin-left: var(--canon-space-0_5);
- margin-right: var(--canon-space-0_5);
- }
-
- .lg\:cu-mx-1 {
- margin-left: var(--canon-space-1);
- margin-right: var(--canon-space-1);
- }
-
- .lg\:cu-mx-1\.5 {
- margin-left: var(--canon-space-1_5);
- margin-right: var(--canon-space-1_5);
- }
-
- .lg\:cu-mx-2 {
- margin-left: var(--canon-space-2);
- margin-right: var(--canon-space-2);
- }
-
- .lg\:cu-mx-3 {
- margin-left: var(--canon-space-3);
- margin-right: var(--canon-space-3);
- }
-
- .lg\:cu-mx-4 {
- margin-left: var(--canon-space-4);
- margin-right: var(--canon-space-4);
- }
-
- .lg\:cu-mx-5 {
- margin-left: var(--canon-space-5);
- margin-right: var(--canon-space-5);
- }
-
- .lg\:cu-mx-6 {
- margin-left: var(--canon-space-6);
- margin-right: var(--canon-space-6);
- }
-
- .lg\:cu-mx-7 {
- margin-left: var(--canon-space-7);
- margin-right: var(--canon-space-7);
- }
-
- .lg\:cu-mx-8 {
- margin-left: var(--canon-space-8);
- margin-right: var(--canon-space-8);
- }
-
- .lg\:cu-mx-9 {
- margin-left: var(--canon-space-9);
- margin-right: var(--canon-space-9);
- }
-
- .lg\:cu-mx-10 {
- margin-left: var(--canon-space-10);
- margin-right: var(--canon-space-10);
- }
-
- .lg\:cu-mx-11 {
- margin-left: var(--canon-space-11);
- margin-right: var(--canon-space-11);
- }
-
- .lg\:cu-mx-12 {
- margin-left: var(--canon-space-12);
- margin-right: var(--canon-space-12);
- }
-
- .lg\:cu-mx-13 {
- margin-left: var(--canon-space-13);
- margin-right: var(--canon-space-13);
- }
-
- .lg\:cu-mx-14 {
- margin-left: var(--canon-space-14);
- margin-right: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-mx {
- margin-left: var(--px-xl);
- margin-right: var(--px-xl);
- }
-
- .xl\:cu-mx-0\.5 {
- margin-left: var(--canon-space-0_5);
- margin-right: var(--canon-space-0_5);
- }
-
- .xl\:cu-mx-1 {
- margin-left: var(--canon-space-1);
- margin-right: var(--canon-space-1);
- }
-
- .xl\:cu-mx-1\.5 {
- margin-left: var(--canon-space-1_5);
- margin-right: var(--canon-space-1_5);
- }
-
- .xl\:cu-mx-2 {
- margin-left: var(--canon-space-2);
- margin-right: var(--canon-space-2);
- }
-
- .xl\:cu-mx-3 {
- margin-left: var(--canon-space-3);
- margin-right: var(--canon-space-3);
- }
-
- .xl\:cu-mx-4 {
- margin-left: var(--canon-space-4);
- margin-right: var(--canon-space-4);
- }
-
- .xl\:cu-mx-5 {
- margin-left: var(--canon-space-5);
- margin-right: var(--canon-space-5);
- }
-
- .xl\:cu-mx-6 {
- margin-left: var(--canon-space-6);
- margin-right: var(--canon-space-6);
- }
-
- .xl\:cu-mx-7 {
- margin-left: var(--canon-space-7);
- margin-right: var(--canon-space-7);
- }
-
- .xl\:cu-mx-8 {
- margin-left: var(--canon-space-8);
- margin-right: var(--canon-space-8);
- }
-
- .xl\:cu-mx-9 {
- margin-left: var(--canon-space-9);
- margin-right: var(--canon-space-9);
- }
-
- .xl\:cu-mx-10 {
- margin-left: var(--canon-space-10);
- margin-right: var(--canon-space-10);
- }
-
- .xl\:cu-mx-11 {
- margin-left: var(--canon-space-11);
- margin-right: var(--canon-space-11);
- }
-
- .xl\:cu-mx-12 {
- margin-left: var(--canon-space-12);
- margin-right: var(--canon-space-12);
- }
-
- .xl\:cu-mx-13 {
- margin-left: var(--canon-space-13);
- margin-right: var(--canon-space-13);
- }
-
- .xl\:cu-mx-14 {
- margin-left: var(--canon-space-14);
- margin-right: var(--canon-space-14);
- }
-}
-
-.cu-display-none {
- display: none;
-}
-
-.cu-display-inline {
- display: inline;
-}
-
-.cu-display-inline-block {
- display: inline-block;
-}
-
-.cu-display-block {
- display: block;
-}
-
-@media (width >= 640px) {
- .xs\:cu-display-none {
- display: none;
- }
-
- .xs\:cu-display-inline {
- display: inline;
- }
-
- .xs\:cu-display-inline-block {
- display: inline-block;
- }
-
- .xs\:cu-display-block {
- display: block;
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-display-none {
- display: none;
- }
-
- .sm\:cu-display-inline {
- display: inline;
- }
-
- .sm\:cu-display-inline-block {
- display: inline-block;
- }
-
- .sm\:cu-display-block {
- display: block;
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-display-none {
- display: none;
- }
-
- .md\:cu-display-inline {
- display: inline;
- }
-
- .md\:cu-display-inline-block {
- display: inline-block;
- }
-
- .md\:cu-display-block {
- display: block;
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-display-none {
- display: none;
- }
-
- .lg\:cu-display-inline {
- display: inline;
- }
-
- .lg\:cu-display-inline-block {
- display: inline-block;
- }
-
- .lg\:cu-display-block {
- display: block;
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-display-none {
- display: none;
- }
-
- .xl\:cu-display-inline {
- display: inline;
- }
-
- .xl\:cu-display-inline-block {
- display: inline-block;
- }
-
- .xl\:cu-display-block {
- display: block;
- }
-}
-
-.cu-w {
- width: var(--width);
-}
-
-.cu-min-w {
- min-width: var(--min-width);
-}
-
-.cu-max-w {
- max-width: var(--max-width);
-}
-
-@media (width >= 640px) {
- .xs\:cu-w {
- width: var(--width);
- }
-
- .xs\:cu-min-w {
- min-width: var(--min-width);
- }
-
- .xs\:cu-max-w {
- max-width: var(--max-width);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-w {
- width: var(--width);
- }
-
- .sm\:cu-min-w {
- min-width: var(--min-width);
- }
-
- .sm\:cu-max-w {
- max-width: var(--max-width);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-w {
- width: var(--width);
- }
-
- .md\:cu-min-w {
- min-width: var(--min-width);
- }
-
- .md\:cu-max-w {
- max-width: var(--max-width);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-w {
- width: var(--width);
- }
-
- .lg\:cu-min-w {
- min-width: var(--min-width);
- }
-
- .lg\:cu-max-w {
- max-width: var(--max-width);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-w {
- width: var(--width);
- }
-
- .xl\:cu-min-w {
- min-width: var(--min-width);
- }
-
- .xl\:cu-max-w {
- max-width: var(--max-width);
- }
-}
-
-.cu-h {
- height: var(--height);
-}
-
-.cu-min-h {
- min-height: var(--min-height);
-}
-
-.cu-max-h {
- max-height: var(--max-height);
-}
-
-@media (width >= 640px) {
- .xs\:cu-h {
- height: var(--height);
- }
-
- .xs\:cu-min-h {
- min-height: var(--min-height);
- }
-
- .xs\:cu-max-h {
- max-height: var(--max-height);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-h {
- height: var(--height);
- }
-
- .sm\:cu-min-h {
- min-height: var(--min-height);
- }
-
- .sm\:cu-max-h {
- max-height: var(--max-height);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-h {
- height: var(--height);
- }
-
- .md\:cu-min-h {
- min-height: var(--min-height);
- }
-
- .md\:cu-max-h {
- max-height: var(--max-height);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-h {
- height: var(--height);
- }
-
- .lg\:cu-min-h {
- min-height: var(--min-height);
- }
-
- .lg\:cu-max-h {
- max-height: var(--max-height);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-h {
- height: var(--height);
- }
-
- .xl\:cu-min-h {
- min-height: var(--min-height);
- }
-
- .xl\:cu-max-h {
- max-height: var(--max-height);
- }
-}
-
-.cu-position-absolute {
- position: absolute;
-}
-
-.cu-position-fixed {
- position: fixed;
-}
-
-.cu-position-sticky {
- position: sticky;
-}
-
-.cu-position-relative {
- position: relative;
-}
-
-.cu-position-static {
- position: static;
-}
-
-@media (width >= 640px) {
- .xs\:cu-position-absolute {
- position: absolute;
- }
-
- .xs\:cu-position-fixed {
- position: fixed;
- }
-
- .xs\:cu-position-sticky {
- position: sticky;
- }
-
- .xs\:cu-position-relative {
- position: relative;
- }
-
- .xs\:cu-position-static {
- position: static;
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-position-absolute {
- position: absolute;
- }
-
- .sm\:cu-position-fixed {
- position: fixed;
- }
-
- .sm\:cu-position-sticky {
- position: sticky;
- }
-
- .sm\:cu-position-relative {
- position: relative;
- }
-
- .sm\:cu-position-static {
- position: static;
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-position-absolute {
- position: absolute;
- }
-
- .md\:cu-position-fixed {
- position: fixed;
- }
-
- .md\:cu-position-sticky {
- position: sticky;
- }
-
- .md\:cu-position-relative {
- position: relative;
- }
-
- .md\:cu-position-static {
- position: static;
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-position-absolute {
- position: absolute;
- }
-
- .lg\:cu-position-fixed {
- position: fixed;
- }
-
- .lg\:cu-position-sticky {
- position: sticky;
- }
-
- .lg\:cu-position-relative {
- position: relative;
- }
-
- .lg\:cu-position-static {
- position: static;
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-position-absolute {
- position: absolute;
- }
-
- .xl\:cu-position-fixed {
- position: fixed;
- }
-
- .xl\:cu-position-sticky {
- position: sticky;
- }
-
- .xl\:cu-position-relative {
- position: relative;
- }
-
- .xl\:cu-position-static {
- position: static;
- }
-}
-
-.cu-columns-1 {
- grid-template-columns: repeat(1, minmax(0, 1fr));
-}
-
-.cu-columns-2 {
- grid-template-columns: repeat(2, minmax(0, 1fr));
-}
-
-.cu-columns-3 {
- grid-template-columns: repeat(3, minmax(0, 1fr));
-}
-
-.cu-columns-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
-}
-
-.cu-columns-5 {
- grid-template-columns: repeat(5, minmax(0, 1fr));
-}
-
-.cu-columns-6 {
- grid-template-columns: repeat(6, minmax(0, 1fr));
-}
-
-.cu-columns-7 {
- grid-template-columns: repeat(7, minmax(0, 1fr));
-}
-
-.cu-columns-8 {
- grid-template-columns: repeat(8, minmax(0, 1fr));
-}
-
-.cu-columns-9 {
- grid-template-columns: repeat(9, minmax(0, 1fr));
-}
-
-.cu-columns-10 {
- grid-template-columns: repeat(10, minmax(0, 1fr));
-}
-
-.cu-columns-11 {
- grid-template-columns: repeat(11, minmax(0, 1fr));
-}
-
-.cu-columns-12 {
- grid-template-columns: repeat(12, minmax(0, 1fr));
-}
-
-.cu-columns-auto {
- grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
-}
-
-.cu-col-span-1 {
- grid-column: span 1 / span 1;
-}
-
-.cu-col-span-2 {
- grid-column: span 2 / span 2;
-}
-
-.cu-col-span-3 {
- grid-column: span 3 / span 3;
-}
-
-.cu-col-span-4 {
- grid-column: span 4 / span 4;
-}
-
-.cu-col-span-5 {
- grid-column: span 5 / span 5;
-}
-
-.cu-col-span-6 {
- grid-column: span 6 / span 6;
-}
-
-.cu-col-span-7 {
- grid-column: span 7 / span 7;
-}
-
-.cu-col-span-8 {
- grid-column: span 8 / span 8;
-}
-
-.cu-col-span-9 {
- grid-column: span 9 / span 9;
-}
-
-.cu-col-span-10 {
- grid-column: span 10 / span 10;
-}
-
-.cu-col-span-11 {
- grid-column: span 11 / span 11;
-}
-
-.cu-col-span-12 {
- grid-column: span 12 / span 12;
-}
-
-.cu-col-span-auto {
- grid-column: span auto / span auto;
-}
-
-.cu-col-start-1 {
- grid-column-start: 1;
-}
-
-.cu-col-start-2 {
- grid-column-start: 2;
-}
-
-.cu-col-start-3 {
- grid-column-start: 3;
-}
-
-.cu-col-start-4 {
- grid-column-start: 4;
-}
-
-.cu-col-start-5 {
- grid-column-start: 5;
-}
-
-.cu-col-start-6 {
- grid-column-start: 6;
-}
-
-.cu-col-start-7 {
- grid-column-start: 7;
-}
-
-.cu-col-start-8 {
- grid-column-start: 8;
-}
-
-.cu-col-start-9 {
- grid-column-start: 9;
-}
-
-.cu-col-start-10 {
- grid-column-start: 10;
-}
-
-.cu-col-start-11 {
- grid-column-start: 11;
-}
-
-.cu-col-start-12 {
- grid-column-start: 12;
-}
-
-.cu-col-start-13 {
- grid-column-start: 13;
-}
-
-.cu-col-start-auto {
- grid-column-start: auto;
-}
-
-.cu-col-end-1 {
- grid-column-end: 1;
-}
-
-.cu-col-end-2 {
- grid-column-end: 2;
-}
-
-.cu-col-end-3 {
- grid-column-end: 3;
-}
-
-.cu-col-end-4 {
- grid-column-end: 4;
-}
-
-.cu-col-end-5 {
- grid-column-end: 5;
-}
-
-.cu-col-end-6 {
- grid-column-end: 6;
-}
-
-.cu-col-end-7 {
- grid-column-end: 7;
-}
-
-.cu-col-end-8 {
- grid-column-end: 8;
-}
-
-.cu-col-end-9 {
- grid-column-end: 9;
-}
-
-.cu-col-end-10 {
- grid-column-end: 10;
-}
-
-.cu-col-end-11 {
- grid-column-end: 11;
-}
-
-.cu-col-end-12 {
- grid-column-end: 12;
-}
-
-.cu-col-end-13 {
- grid-column-end: 13;
-}
-
-.cu-col-end-auto {
- grid-column-end: auto;
-}
-
-.cu-row-span-1 {
- grid-row: span 1 / span 1;
-}
-
-.cu-row-span-2 {
- grid-row: span 2 / span 2;
-}
-
-.cu-row-span-3 {
- grid-row: span 3 / span 3;
-}
-
-.cu-row-span-4 {
- grid-row: span 4 / span 4;
-}
-
-.cu-row-span-5 {
- grid-row: span 5 / span 5;
-}
-
-.cu-row-span-6 {
- grid-row: span 6 / span 6;
-}
-
-.cu-row-span-7 {
- grid-row: span 7 / span 7;
-}
-
-.cu-row-span-8 {
- grid-row: span 8 / span 8;
-}
-
-.cu-row-span-9 {
- grid-row: span 9 / span 9;
-}
-
-.cu-row-span-10 {
- grid-row: span 10 / span 10;
-}
-
-.cu-row-span-11 {
- grid-row: span 11 / span 11;
-}
-
-.cu-row-span-12 {
- grid-row: span 12 / span 12;
-}
-
-.cu-row-span-auto {
- grid-row: span auto / span auto;
-}
-
-@media (width >= 640px) {
- .xs\:cu-columns-1 {
- grid-template-columns: repeat(1, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-2 {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-3 {
- grid-template-columns: repeat(3, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-5 {
- grid-template-columns: repeat(5, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-6 {
- grid-template-columns: repeat(6, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-7 {
- grid-template-columns: repeat(7, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-8 {
- grid-template-columns: repeat(8, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-9 {
- grid-template-columns: repeat(9, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-10 {
- grid-template-columns: repeat(10, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-11 {
- grid-template-columns: repeat(11, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-12 {
- grid-template-columns: repeat(12, minmax(0, 1fr));
- }
-
- .xs\:cu-columns-auto {
- grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
- }
-
- .xs\:cu-col-span-1 {
- grid-column: span 1 / span 1;
- }
-
- .xs\:cu-col-span-2 {
- grid-column: span 2 / span 2;
- }
-
- .xs\:cu-col-span-3 {
- grid-column: span 3 / span 3;
- }
-
- .xs\:cu-col-span-4 {
- grid-column: span 4 / span 4;
- }
-
- .xs\:cu-col-span-5 {
- grid-column: span 5 / span 5;
- }
-
- .xs\:cu-col-span-6 {
- grid-column: span 6 / span 6;
- }
-
- .xs\:cu-col-span-7 {
- grid-column: span 7 / span 7;
- }
-
- .xs\:cu-col-span-8 {
- grid-column: span 8 / span 8;
- }
-
- .xs\:cu-col-span-9 {
- grid-column: span 9 / span 9;
- }
-
- .xs\:cu-col-span-10 {
- grid-column: span 10 / span 10;
- }
-
- .xs\:cu-col-span-11 {
- grid-column: span 11 / span 11;
- }
-
- .xs\:cu-col-span-12 {
- grid-column: span 12 / span 12;
- }
-
- .xs\:cu-col-span-auto {
- grid-column: span auto / span auto;
- }
-
- .xs\:cu-col-start-1 {
- grid-column-start: 1;
- }
-
- .xs\:cu-col-start-2 {
- grid-column-start: 2;
- }
-
- .xs\:cu-col-start-3 {
- grid-column-start: 3;
- }
-
- .xs\:cu-col-start-4 {
- grid-column-start: 4;
- }
-
- .xs\:cu-col-start-5 {
- grid-column-start: 5;
- }
-
- .xs\:cu-col-start-6 {
- grid-column-start: 6;
- }
-
- .xs\:cu-col-start-7 {
- grid-column-start: 7;
- }
-
- .xs\:cu-col-start-8 {
- grid-column-start: 8;
- }
-
- .xs\:cu-col-start-9 {
- grid-column-start: 9;
- }
-
- .xs\:cu-col-start-10 {
- grid-column-start: 10;
- }
-
- .xs\:cu-col-start-11 {
- grid-column-start: 11;
- }
-
- .xs\:cu-col-start-12 {
- grid-column-start: 12;
- }
-
- .xs\:cu-col-start-13 {
- grid-column-start: 13;
- }
-
- .xs\:cu-col-start-auto {
- grid-column-start: auto;
- }
-
- .xs\:cu-col-end-1 {
- grid-column-end: 1;
- }
-
- .xs\:cu-col-end-2 {
- grid-column-end: 2;
- }
-
- .xs\:cu-col-end-3 {
- grid-column-end: 3;
- }
-
- .xs\:cu-col-end-4 {
- grid-column-end: 4;
- }
-
- .xs\:cu-col-end-5 {
- grid-column-end: 5;
- }
-
- .xs\:cu-col-end-6 {
- grid-column-end: 6;
- }
-
- .xs\:cu-col-end-7 {
- grid-column-end: 7;
- }
-
- .xs\:cu-col-end-8 {
- grid-column-end: 8;
- }
-
- .xs\:cu-col-end-9 {
- grid-column-end: 9;
- }
-
- .xs\:cu-col-end-10 {
- grid-column-end: 10;
- }
-
- .xs\:cu-col-end-11 {
- grid-column-end: 11;
- }
-
- .xs\:cu-col-end-12 {
- grid-column-end: 12;
- }
-
- .xs\:cu-col-end-13 {
- grid-column-end: 13;
- }
-
- .xs\:cu-col-end-auto {
- grid-column-end: auto;
- }
-
- .xs\:cu-row-span-1 {
- grid-row: span 1 / span 1;
- }
-
- .xs\:cu-row-span-2 {
- grid-row: span 2 / span 2;
- }
-
- .xs\:cu-row-span-3 {
- grid-row: span 3 / span 3;
- }
-
- .xs\:cu-row-span-4 {
- grid-row: span 4 / span 4;
- }
-
- .xs\:cu-row-span-5 {
- grid-row: span 5 / span 5;
- }
-
- .xs\:cu-row-span-6 {
- grid-row: span 6 / span 6;
- }
-
- .xs\:cu-row-span-7 {
- grid-row: span 7 / span 7;
- }
-
- .xs\:cu-row-span-8 {
- grid-row: span 8 / span 8;
- }
-
- .xs\:cu-row-span-9 {
- grid-row: span 9 / span 9;
- }
-
- .xs\:cu-row-span-10 {
- grid-row: span 10 / span 10;
- }
-
- .xs\:cu-row-span-11 {
- grid-row: span 11 / span 11;
- }
-
- .xs\:cu-row-span-12 {
- grid-row: span 12 / span 12;
- }
-
- .xs\:cu-row-span-auto {
- grid-row: span auto / span auto;
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-columns-1 {
- grid-template-columns: repeat(1, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-2 {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-3 {
- grid-template-columns: repeat(3, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-5 {
- grid-template-columns: repeat(5, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-6 {
- grid-template-columns: repeat(6, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-7 {
- grid-template-columns: repeat(7, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-8 {
- grid-template-columns: repeat(8, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-9 {
- grid-template-columns: repeat(9, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-10 {
- grid-template-columns: repeat(10, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-11 {
- grid-template-columns: repeat(11, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-12 {
- grid-template-columns: repeat(12, minmax(0, 1fr));
- }
-
- .sm\:cu-columns-auto {
- grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
- }
-
- .sm\:cu-col-span-1 {
- grid-column: span 1 / span 1;
- }
-
- .sm\:cu-col-span-2 {
- grid-column: span 2 / span 2;
- }
-
- .sm\:cu-col-span-3 {
- grid-column: span 3 / span 3;
- }
-
- .sm\:cu-col-span-4 {
- grid-column: span 4 / span 4;
- }
-
- .sm\:cu-col-span-5 {
- grid-column: span 5 / span 5;
- }
-
- .sm\:cu-col-span-6 {
- grid-column: span 6 / span 6;
- }
-
- .sm\:cu-col-span-7 {
- grid-column: span 7 / span 7;
- }
-
- .sm\:cu-col-span-8 {
- grid-column: span 8 / span 8;
- }
-
- .sm\:cu-col-span-9 {
- grid-column: span 9 / span 9;
- }
-
- .sm\:cu-col-span-10 {
- grid-column: span 10 / span 10;
- }
-
- .sm\:cu-col-span-11 {
- grid-column: span 11 / span 11;
- }
-
- .sm\:cu-col-span-12 {
- grid-column: span 12 / span 12;
- }
-
- .sm\:cu-col-span-auto {
- grid-column: span auto / span auto;
- }
-
- .sm\:cu-col-start-1 {
- grid-column-start: 1;
- }
-
- .sm\:cu-col-start-2 {
- grid-column-start: 2;
- }
-
- .sm\:cu-col-start-3 {
- grid-column-start: 3;
- }
-
- .sm\:cu-col-start-4 {
- grid-column-start: 4;
- }
-
- .sm\:cu-col-start-5 {
- grid-column-start: 5;
- }
-
- .sm\:cu-col-start-6 {
- grid-column-start: 6;
- }
-
- .sm\:cu-col-start-7 {
- grid-column-start: 7;
- }
-
- .sm\:cu-col-start-8 {
- grid-column-start: 8;
- }
-
- .sm\:cu-col-start-9 {
- grid-column-start: 9;
- }
-
- .sm\:cu-col-start-10 {
- grid-column-start: 10;
- }
-
- .sm\:cu-col-start-11 {
- grid-column-start: 11;
- }
-
- .sm\:cu-col-start-12 {
- grid-column-start: 12;
- }
-
- .sm\:cu-col-start-13 {
- grid-column-start: 13;
- }
-
- .sm\:cu-col-start-auto {
- grid-column-start: auto;
- }
-
- .sm\:cu-col-end-1 {
- grid-column-end: 1;
- }
-
- .sm\:cu-col-end-2 {
- grid-column-end: 2;
- }
-
- .sm\:cu-col-end-3 {
- grid-column-end: 3;
- }
-
- .sm\:cu-col-end-4 {
- grid-column-end: 4;
- }
-
- .sm\:cu-col-end-5 {
- grid-column-end: 5;
- }
-
- .sm\:cu-col-end-6 {
- grid-column-end: 6;
- }
-
- .sm\:cu-col-end-7 {
- grid-column-end: 7;
- }
-
- .sm\:cu-col-end-8 {
- grid-column-end: 8;
- }
-
- .sm\:cu-col-end-9 {
- grid-column-end: 9;
- }
-
- .sm\:cu-col-end-10 {
- grid-column-end: 10;
- }
-
- .sm\:cu-col-end-11 {
- grid-column-end: 11;
- }
-
- .sm\:cu-col-end-12 {
- grid-column-end: 12;
- }
-
- .sm\:cu-col-end-13 {
- grid-column-end: 13;
- }
-
- .sm\:cu-col-end-auto {
- grid-column-end: auto;
- }
-
- .sm\:cu-row-span-1 {
- grid-row: span 1 / span 1;
- }
-
- .sm\:cu-row-span-2 {
- grid-row: span 2 / span 2;
- }
-
- .sm\:cu-row-span-3 {
- grid-row: span 3 / span 3;
- }
-
- .sm\:cu-row-span-4 {
- grid-row: span 4 / span 4;
- }
-
- .sm\:cu-row-span-5 {
- grid-row: span 5 / span 5;
- }
-
- .sm\:cu-row-span-6 {
- grid-row: span 6 / span 6;
- }
-
- .sm\:cu-row-span-7 {
- grid-row: span 7 / span 7;
- }
-
- .sm\:cu-row-span-8 {
- grid-row: span 8 / span 8;
- }
-
- .sm\:cu-row-span-9 {
- grid-row: span 9 / span 9;
- }
-
- .sm\:cu-row-span-10 {
- grid-row: span 10 / span 10;
- }
-
- .sm\:cu-row-span-11 {
- grid-row: span 11 / span 11;
- }
-
- .sm\:cu-row-span-12 {
- grid-row: span 12 / span 12;
- }
-
- .sm\:cu-row-span-auto {
- grid-row: span auto / span auto;
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-columns-1 {
- grid-template-columns: repeat(1, minmax(0, 1fr));
- }
-
- .md\:cu-columns-2 {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- }
-
- .md\:cu-columns-3 {
- grid-template-columns: repeat(3, minmax(0, 1fr));
- }
-
- .md\:cu-columns-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
- }
-
- .md\:cu-columns-5 {
- grid-template-columns: repeat(5, minmax(0, 1fr));
- }
-
- .md\:cu-columns-6 {
- grid-template-columns: repeat(6, minmax(0, 1fr));
- }
-
- .md\:cu-columns-7 {
- grid-template-columns: repeat(7, minmax(0, 1fr));
- }
-
- .md\:cu-columns-8 {
- grid-template-columns: repeat(8, minmax(0, 1fr));
- }
-
- .md\:cu-columns-9 {
- grid-template-columns: repeat(9, minmax(0, 1fr));
- }
-
- .md\:cu-columns-10 {
- grid-template-columns: repeat(10, minmax(0, 1fr));
- }
-
- .md\:cu-columns-11 {
- grid-template-columns: repeat(11, minmax(0, 1fr));
- }
-
- .md\:cu-columns-12 {
- grid-template-columns: repeat(12, minmax(0, 1fr));
- }
-
- .md\:cu-columns-auto {
- grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
- }
-
- .md\:cu-col-span-1 {
- grid-column: span 1 / span 1;
- }
-
- .md\:cu-col-span-2 {
- grid-column: span 2 / span 2;
- }
-
- .md\:cu-col-span-3 {
- grid-column: span 3 / span 3;
- }
-
- .md\:cu-col-span-4 {
- grid-column: span 4 / span 4;
- }
-
- .md\:cu-col-span-5 {
- grid-column: span 5 / span 5;
- }
-
- .md\:cu-col-span-6 {
- grid-column: span 6 / span 6;
- }
-
- .md\:cu-col-span-7 {
- grid-column: span 7 / span 7;
- }
-
- .md\:cu-col-span-8 {
- grid-column: span 8 / span 8;
- }
-
- .md\:cu-col-span-9 {
- grid-column: span 9 / span 9;
- }
-
- .md\:cu-col-span-10 {
- grid-column: span 10 / span 10;
- }
-
- .md\:cu-col-span-11 {
- grid-column: span 11 / span 11;
- }
-
- .md\:cu-col-span-12 {
- grid-column: span 12 / span 12;
- }
-
- .md\:cu-col-span-auto {
- grid-column: span auto / span auto;
- }
-
- .md\:cu-col-start-1 {
- grid-column-start: 1;
- }
-
- .md\:cu-col-start-2 {
- grid-column-start: 2;
- }
-
- .md\:cu-col-start-3 {
- grid-column-start: 3;
- }
-
- .md\:cu-col-start-4 {
- grid-column-start: 4;
- }
-
- .md\:cu-col-start-5 {
- grid-column-start: 5;
- }
-
- .md\:cu-col-start-6 {
- grid-column-start: 6;
- }
-
- .md\:cu-col-start-7 {
- grid-column-start: 7;
- }
-
- .md\:cu-col-start-8 {
- grid-column-start: 8;
- }
-
- .md\:cu-col-start-9 {
- grid-column-start: 9;
- }
-
- .md\:cu-col-start-10 {
- grid-column-start: 10;
- }
-
- .md\:cu-col-start-11 {
- grid-column-start: 11;
- }
-
- .md\:cu-col-start-12 {
- grid-column-start: 12;
- }
-
- .md\:cu-col-start-13 {
- grid-column-start: 13;
- }
-
- .md\:cu-col-start-auto {
- grid-column-start: auto;
- }
-
- .md\:cu-col-end-1 {
- grid-column-end: 1;
- }
-
- .md\:cu-col-end-2 {
- grid-column-end: 2;
- }
-
- .md\:cu-col-end-3 {
- grid-column-end: 3;
- }
-
- .md\:cu-col-end-4 {
- grid-column-end: 4;
- }
-
- .md\:cu-col-end-5 {
- grid-column-end: 5;
- }
-
- .md\:cu-col-end-6 {
- grid-column-end: 6;
- }
-
- .md\:cu-col-end-7 {
- grid-column-end: 7;
- }
-
- .md\:cu-col-end-8 {
- grid-column-end: 8;
- }
-
- .md\:cu-col-end-9 {
- grid-column-end: 9;
- }
-
- .md\:cu-col-end-10 {
- grid-column-end: 10;
- }
-
- .md\:cu-col-end-11 {
- grid-column-end: 11;
- }
-
- .md\:cu-col-end-12 {
- grid-column-end: 12;
- }
-
- .md\:cu-col-end-13 {
- grid-column-end: 13;
- }
-
- .md\:cu-col-end-auto {
- grid-column-end: auto;
- }
-
- .md\:cu-row-span-1 {
- grid-row: span 1 / span 1;
- }
-
- .md\:cu-row-span-2 {
- grid-row: span 2 / span 2;
- }
-
- .md\:cu-row-span-3 {
- grid-row: span 3 / span 3;
- }
-
- .md\:cu-row-span-4 {
- grid-row: span 4 / span 4;
- }
-
- .md\:cu-row-span-5 {
- grid-row: span 5 / span 5;
- }
-
- .md\:cu-row-span-6 {
- grid-row: span 6 / span 6;
- }
-
- .md\:cu-row-span-7 {
- grid-row: span 7 / span 7;
- }
-
- .md\:cu-row-span-8 {
- grid-row: span 8 / span 8;
- }
-
- .md\:cu-row-span-9 {
- grid-row: span 9 / span 9;
- }
-
- .md\:cu-row-span-10 {
- grid-row: span 10 / span 10;
- }
-
- .md\:cu-row-span-11 {
- grid-row: span 11 / span 11;
- }
-
- .md\:cu-row-span-12 {
- grid-row: span 12 / span 12;
- }
-
- .md\:cu-row-span-auto {
- grid-row: span auto / span auto;
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-columns-1 {
- grid-template-columns: repeat(1, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-2 {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-3 {
- grid-template-columns: repeat(3, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-5 {
- grid-template-columns: repeat(5, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-6 {
- grid-template-columns: repeat(6, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-7 {
- grid-template-columns: repeat(7, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-8 {
- grid-template-columns: repeat(8, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-9 {
- grid-template-columns: repeat(9, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-10 {
- grid-template-columns: repeat(10, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-11 {
- grid-template-columns: repeat(11, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-12 {
- grid-template-columns: repeat(12, minmax(0, 1fr));
- }
-
- .lg\:cu-columns-auto {
- grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
- }
-
- .lg\:cu-col-span-1 {
- grid-column: span 1 / span 1;
- }
-
- .lg\:cu-col-span-2 {
- grid-column: span 2 / span 2;
- }
-
- .lg\:cu-col-span-3 {
- grid-column: span 3 / span 3;
- }
-
- .lg\:cu-col-span-4 {
- grid-column: span 4 / span 4;
- }
-
- .lg\:cu-col-span-5 {
- grid-column: span 5 / span 5;
- }
-
- .lg\:cu-col-span-6 {
- grid-column: span 6 / span 6;
- }
-
- .lg\:cu-col-span-7 {
- grid-column: span 7 / span 7;
- }
-
- .lg\:cu-col-span-8 {
- grid-column: span 8 / span 8;
- }
-
- .lg\:cu-col-span-9 {
- grid-column: span 9 / span 9;
- }
-
- .lg\:cu-col-span-10 {
- grid-column: span 10 / span 10;
- }
-
- .lg\:cu-col-span-11 {
- grid-column: span 11 / span 11;
- }
-
- .lg\:cu-col-span-12 {
- grid-column: span 12 / span 12;
- }
-
- .lg\:cu-col-span-auto {
- grid-column: span auto / span auto;
- }
-
- .lg\:cu-col-start-1 {
- grid-column-start: 1;
- }
-
- .lg\:cu-col-start-2 {
- grid-column-start: 2;
- }
-
- .lg\:cu-col-start-3 {
- grid-column-start: 3;
- }
-
- .lg\:cu-col-start-4 {
- grid-column-start: 4;
- }
-
- .lg\:cu-col-start-5 {
- grid-column-start: 5;
- }
-
- .lg\:cu-col-start-6 {
- grid-column-start: 6;
- }
-
- .lg\:cu-col-start-7 {
- grid-column-start: 7;
- }
-
- .lg\:cu-col-start-8 {
- grid-column-start: 8;
- }
-
- .lg\:cu-col-start-9 {
- grid-column-start: 9;
- }
-
- .lg\:cu-col-start-10 {
- grid-column-start: 10;
- }
-
- .lg\:cu-col-start-11 {
- grid-column-start: 11;
- }
-
- .lg\:cu-col-start-12 {
- grid-column-start: 12;
- }
-
- .lg\:cu-col-start-13 {
- grid-column-start: 13;
- }
-
- .lg\:cu-col-start-auto {
- grid-column-start: auto;
- }
-
- .lg\:cu-col-end-1 {
- grid-column-end: 1;
- }
-
- .lg\:cu-col-end-2 {
- grid-column-end: 2;
- }
-
- .lg\:cu-col-end-3 {
- grid-column-end: 3;
- }
-
- .lg\:cu-col-end-4 {
- grid-column-end: 4;
- }
-
- .lg\:cu-col-end-5 {
- grid-column-end: 5;
- }
-
- .lg\:cu-col-end-6 {
- grid-column-end: 6;
- }
-
- .lg\:cu-col-end-7 {
- grid-column-end: 7;
- }
-
- .lg\:cu-col-end-8 {
- grid-column-end: 8;
- }
-
- .lg\:cu-col-end-9 {
- grid-column-end: 9;
- }
-
- .lg\:cu-col-end-10 {
- grid-column-end: 10;
- }
-
- .lg\:cu-col-end-11 {
- grid-column-end: 11;
- }
-
- .lg\:cu-col-end-12 {
- grid-column-end: 12;
- }
-
- .lg\:cu-col-end-13 {
- grid-column-end: 13;
- }
-
- .lg\:cu-col-end-auto {
- grid-column-end: auto;
- }
-
- .lg\:cu-row-span-1 {
- grid-row: span 1 / span 1;
- }
-
- .lg\:cu-row-span-2 {
- grid-row: span 2 / span 2;
- }
-
- .lg\:cu-row-span-3 {
- grid-row: span 3 / span 3;
- }
-
- .lg\:cu-row-span-4 {
- grid-row: span 4 / span 4;
- }
-
- .lg\:cu-row-span-5 {
- grid-row: span 5 / span 5;
- }
-
- .lg\:cu-row-span-6 {
- grid-row: span 6 / span 6;
- }
-
- .lg\:cu-row-span-7 {
- grid-row: span 7 / span 7;
- }
-
- .lg\:cu-row-span-8 {
- grid-row: span 8 / span 8;
- }
-
- .lg\:cu-row-span-9 {
- grid-row: span 9 / span 9;
- }
-
- .lg\:cu-row-span-10 {
- grid-row: span 10 / span 10;
- }
-
- .lg\:cu-row-span-11 {
- grid-row: span 11 / span 11;
- }
-
- .lg\:cu-row-span-12 {
- grid-row: span 12 / span 12;
- }
-
- .lg\:cu-row-span-auto {
- grid-row: span auto / span auto;
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-columns-1 {
- grid-template-columns: repeat(1, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-2 {
- grid-template-columns: repeat(2, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-3 {
- grid-template-columns: repeat(3, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-4 {
- grid-template-columns: repeat(4, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-5 {
- grid-template-columns: repeat(5, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-6 {
- grid-template-columns: repeat(6, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-7 {
- grid-template-columns: repeat(7, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-8 {
- grid-template-columns: repeat(8, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-9 {
- grid-template-columns: repeat(9, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-10 {
- grid-template-columns: repeat(10, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-11 {
- grid-template-columns: repeat(11, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-12 {
- grid-template-columns: repeat(12, minmax(0, 1fr));
- }
-
- .xl\:cu-columns-auto {
- grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
- }
-
- .xl\:cu-col-span-1 {
- grid-column: span 1 / span 1;
- }
-
- .xl\:cu-col-span-2 {
- grid-column: span 2 / span 2;
- }
-
- .xl\:cu-col-span-3 {
- grid-column: span 3 / span 3;
- }
-
- .xl\:cu-col-span-4 {
- grid-column: span 4 / span 4;
- }
-
- .xl\:cu-col-span-5 {
- grid-column: span 5 / span 5;
- }
-
- .xl\:cu-col-span-6 {
- grid-column: span 6 / span 6;
- }
-
- .xl\:cu-col-span-7 {
- grid-column: span 7 / span 7;
- }
-
- .xl\:cu-col-span-8 {
- grid-column: span 8 / span 8;
- }
-
- .xl\:cu-col-span-9 {
- grid-column: span 9 / span 9;
- }
-
- .xl\:cu-col-span-10 {
- grid-column: span 10 / span 10;
- }
-
- .xl\:cu-col-span-11 {
- grid-column: span 11 / span 11;
- }
-
- .xl\:cu-col-span-12 {
- grid-column: span 12 / span 12;
- }
-
- .xl\:cu-col-span-auto {
- grid-column: span auto / span auto;
- }
-
- .xl\:cu-col-start-1 {
- grid-column-start: 1;
- }
-
- .xl\:cu-col-start-2 {
- grid-column-start: 2;
- }
-
- .xl\:cu-col-start-3 {
- grid-column-start: 3;
- }
-
- .xl\:cu-col-start-4 {
- grid-column-start: 4;
- }
-
- .xl\:cu-col-start-5 {
- grid-column-start: 5;
- }
-
- .xl\:cu-col-start-6 {
- grid-column-start: 6;
- }
-
- .xl\:cu-col-start-7 {
- grid-column-start: 7;
- }
-
- .xl\:cu-col-start-8 {
- grid-column-start: 8;
- }
-
- .xl\:cu-col-start-9 {
- grid-column-start: 9;
- }
-
- .xl\:cu-col-start-10 {
- grid-column-start: 10;
- }
-
- .xl\:cu-col-start-11 {
- grid-column-start: 11;
- }
-
- .xl\:cu-col-start-12 {
- grid-column-start: 12;
- }
-
- .xl\:cu-col-start-13 {
- grid-column-start: 13;
- }
-
- .xl\:cu-col-start-auto {
- grid-column-start: auto;
- }
-
- .xl\:cu-col-end-1 {
- grid-column-end: 1;
- }
-
- .xl\:cu-col-end-2 {
- grid-column-end: 2;
- }
-
- .xl\:cu-col-end-3 {
- grid-column-end: 3;
- }
-
- .xl\:cu-col-end-4 {
- grid-column-end: 4;
- }
-
- .xl\:cu-col-end-5 {
- grid-column-end: 5;
- }
-
- .xl\:cu-col-end-6 {
- grid-column-end: 6;
- }
-
- .xl\:cu-col-end-7 {
- grid-column-end: 7;
- }
-
- .xl\:cu-col-end-8 {
- grid-column-end: 8;
- }
-
- .xl\:cu-col-end-9 {
- grid-column-end: 9;
- }
-
- .xl\:cu-col-end-10 {
- grid-column-end: 10;
- }
-
- .xl\:cu-col-end-11 {
- grid-column-end: 11;
- }
-
- .xl\:cu-col-end-12 {
- grid-column-end: 12;
- }
-
- .xl\:cu-col-end-13 {
- grid-column-end: 13;
- }
-
- .xl\:cu-col-end-auto {
- grid-column-end: auto;
- }
-
- .xl\:cu-row-span-1 {
- grid-row: span 1 / span 1;
- }
-
- .xl\:cu-row-span-2 {
- grid-row: span 2 / span 2;
- }
-
- .xl\:cu-row-span-3 {
- grid-row: span 3 / span 3;
- }
-
- .xl\:cu-row-span-4 {
- grid-row: span 4 / span 4;
- }
-
- .xl\:cu-row-span-5 {
- grid-row: span 5 / span 5;
- }
-
- .xl\:cu-row-span-6 {
- grid-row: span 6 / span 6;
- }
-
- .xl\:cu-row-span-7 {
- grid-row: span 7 / span 7;
- }
-
- .xl\:cu-row-span-8 {
- grid-row: span 8 / span 8;
- }
-
- .xl\:cu-row-span-9 {
- grid-row: span 9 / span 9;
- }
-
- .xl\:cu-row-span-10 {
- grid-row: span 10 / span 10;
- }
-
- .xl\:cu-row-span-11 {
- grid-row: span 11 / span 11;
- }
-
- .xl\:cu-row-span-12 {
- grid-row: span 12 / span 12;
- }
-
- .xl\:cu-row-span-auto {
- grid-row: span auto / span auto;
- }
-}
-
-.cu-gap {
- gap: var(--gap);
-}
-
-.cu-gap-0\.5 {
- gap: var(--canon-space-0_5);
-}
-
-.cu-gap-1 {
- gap: var(--canon-space-1);
-}
-
-.cu-gap-1\.5 {
- gap: var(--canon-space-1_5);
-}
-
-.cu-gap-2 {
- gap: var(--canon-space-2);
-}
-
-.cu-gap-3 {
- gap: var(--canon-space-3);
-}
-
-.cu-gap-4 {
- gap: var(--canon-space-4);
-}
-
-.cu-gap-5 {
- gap: var(--canon-space-5);
-}
-
-.cu-gap-6 {
- gap: var(--canon-space-6);
-}
-
-.cu-gap-7 {
- gap: var(--canon-space-7);
-}
-
-.cu-gap-8 {
- gap: var(--canon-space-8);
-}
-
-.cu-gap-9 {
- gap: var(--canon-space-9);
-}
-
-.cu-gap-10 {
- gap: var(--canon-space-10);
-}
-
-.cu-gap-11 {
- gap: var(--canon-space-11);
-}
-
-.cu-gap-12 {
- gap: var(--canon-space-12);
-}
-
-.cu-gap-13 {
- gap: var(--canon-space-13);
-}
-
-.cu-gap-14 {
- gap: var(--canon-space-14);
-}
-
-@media (width >= 640px) {
- .xs\:cu-gap {
- gap: var(--gap-xs);
- }
-
- .xs\:cu-gap-0\.5 {
- gap: var(--canon-space-0_5);
- }
-
- .xs\:cu-gap-1 {
- gap: var(--canon-space-1);
- }
-
- .xs\:cu-gap-1\.5 {
- gap: var(--canon-space-1_5);
- }
-
- .xs\:cu-gap-2 {
- gap: var(--canon-space-2);
- }
-
- .xs\:cu-gap-3 {
- gap: var(--canon-space-3);
- }
-
- .xs\:cu-gap-4 {
- gap: var(--canon-space-4);
- }
-
- .xs\:cu-gap-5 {
- gap: var(--canon-space-5);
- }
-
- .xs\:cu-gap-6 {
- gap: var(--canon-space-6);
- }
-
- .xs\:cu-gap-7 {
- gap: var(--canon-space-7);
- }
-
- .xs\:cu-gap-8 {
- gap: var(--canon-space-8);
- }
-
- .xs\:cu-gap-9 {
- gap: var(--canon-space-9);
- }
-
- .xs\:cu-gap-10 {
- gap: var(--canon-space-10);
- }
-
- .xs\:cu-gap-11 {
- gap: var(--canon-space-11);
- }
-
- .xs\:cu-gap-12 {
- gap: var(--canon-space-12);
- }
-
- .xs\:cu-gap-13 {
- gap: var(--canon-space-13);
- }
-
- .xs\:cu-gap-14 {
- gap: var(--canon-space-14);
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-gap {
- gap: var(--gap-sm);
- }
-
- .sm\:cu-gap-0\.5 {
- gap: var(--canon-space-0_5);
- }
-
- .sm\:cu-gap-1 {
- gap: var(--canon-space-1);
- }
-
- .sm\:cu-gap-1\.5 {
- gap: var(--canon-space-1_5);
- }
-
- .sm\:cu-gap-2 {
- gap: var(--canon-space-2);
- }
-
- .sm\:cu-gap-3 {
- gap: var(--canon-space-3);
- }
-
- .sm\:cu-gap-4 {
- gap: var(--canon-space-4);
- }
-
- .sm\:cu-gap-5 {
- gap: var(--canon-space-5);
- }
-
- .sm\:cu-gap-6 {
- gap: var(--canon-space-6);
- }
-
- .sm\:cu-gap-7 {
- gap: var(--canon-space-7);
- }
-
- .sm\:cu-gap-8 {
- gap: var(--canon-space-8);
- }
-
- .sm\:cu-gap-9 {
- gap: var(--canon-space-9);
- }
-
- .sm\:cu-gap-10 {
- gap: var(--canon-space-10);
- }
-
- .sm\:cu-gap-11 {
- gap: var(--canon-space-11);
- }
-
- .sm\:cu-gap-12 {
- gap: var(--canon-space-12);
- }
-
- .sm\:cu-gap-13 {
- gap: var(--canon-space-13);
- }
-
- .sm\:cu-gap-14 {
- gap: var(--canon-space-14);
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-gap {
- gap: var(--gap-md);
- }
-
- .md\:cu-gap-0\.5 {
- gap: var(--canon-space-0_5);
- }
-
- .md\:cu-gap-1 {
- gap: var(--canon-space-1);
- }
-
- .md\:cu-gap-1\.5 {
- gap: var(--canon-space-1_5);
- }
-
- .md\:cu-gap-2 {
- gap: var(--canon-space-2);
- }
-
- .md\:cu-gap-3 {
- gap: var(--canon-space-3);
- }
-
- .md\:cu-gap-4 {
- gap: var(--canon-space-4);
- }
-
- .md\:cu-gap-5 {
- gap: var(--canon-space-5);
- }
-
- .md\:cu-gap-6 {
- gap: var(--canon-space-6);
- }
-
- .md\:cu-gap-7 {
- gap: var(--canon-space-7);
- }
-
- .md\:cu-gap-8 {
- gap: var(--canon-space-8);
- }
-
- .md\:cu-gap-9 {
- gap: var(--canon-space-9);
- }
-
- .md\:cu-gap-10 {
- gap: var(--canon-space-10);
- }
-
- .md\:cu-gap-11 {
- gap: var(--canon-space-11);
- }
-
- .md\:cu-gap-12 {
- gap: var(--canon-space-12);
- }
-
- .md\:cu-gap-13 {
- gap: var(--canon-space-13);
- }
-
- .md\:cu-gap-14 {
- gap: var(--canon-space-14);
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-gap {
- gap: var(--gap-lg);
- }
-
- .lg\:cu-gap-0\.5 {
- gap: var(--canon-space-0_5);
- }
-
- .lg\:cu-gap-1 {
- gap: var(--canon-space-1);
- }
-
- .lg\:cu-gap-1\.5 {
- gap: var(--canon-space-1_5);
- }
-
- .lg\:cu-gap-2 {
- gap: var(--canon-space-2);
- }
-
- .lg\:cu-gap-3 {
- gap: var(--canon-space-3);
- }
-
- .lg\:cu-gap-4 {
- gap: var(--canon-space-4);
- }
-
- .lg\:cu-gap-5 {
- gap: var(--canon-space-5);
- }
-
- .lg\:cu-gap-6 {
- gap: var(--canon-space-6);
- }
-
- .lg\:cu-gap-7 {
- gap: var(--canon-space-7);
- }
-
- .lg\:cu-gap-8 {
- gap: var(--canon-space-8);
- }
-
- .lg\:cu-gap-9 {
- gap: var(--canon-space-9);
- }
-
- .lg\:cu-gap-10 {
- gap: var(--canon-space-10);
- }
-
- .lg\:cu-gap-11 {
- gap: var(--canon-space-11);
- }
-
- .lg\:cu-gap-12 {
- gap: var(--canon-space-12);
- }
-
- .lg\:cu-gap-13 {
- gap: var(--canon-space-13);
- }
-
- .lg\:cu-gap-14 {
- gap: var(--canon-space-14);
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-gap {
- gap: var(--gap-xl);
- }
-
- .xl\:cu-gap-0\.5 {
- gap: var(--canon-space-0_5);
- }
-
- .xl\:cu-gap-1 {
- gap: var(--canon-space-1);
- }
-
- .xl\:cu-gap-1\.5 {
- gap: var(--canon-space-1_5);
- }
-
- .xl\:cu-gap-2 {
- gap: var(--canon-space-2);
- }
-
- .xl\:cu-gap-3 {
- gap: var(--canon-space-3);
- }
-
- .xl\:cu-gap-4 {
- gap: var(--canon-space-4);
- }
-
- .xl\:cu-gap-5 {
- gap: var(--canon-space-5);
- }
-
- .xl\:cu-gap-6 {
- gap: var(--canon-space-6);
- }
-
- .xl\:cu-gap-7 {
- gap: var(--canon-space-7);
- }
-
- .xl\:cu-gap-8 {
- gap: var(--canon-space-8);
- }
-
- .xl\:cu-gap-9 {
- gap: var(--canon-space-9);
- }
-
- .xl\:cu-gap-10 {
- gap: var(--canon-space-10);
- }
-
- .xl\:cu-gap-11 {
- gap: var(--canon-space-11);
- }
-
- .xl\:cu-gap-12 {
- gap: var(--canon-space-12);
- }
-
- .xl\:cu-gap-13 {
- gap: var(--canon-space-13);
- }
-
- .xl\:cu-gap-14 {
- gap: var(--canon-space-14);
- }
-}
-
-.cu-align-start {
- align-items: start;
-}
-
-.cu-align-center {
- align-items: center;
-}
-
-.cu-align-end {
- align-items: end;
-}
-
-.cu-align-stretch {
- align-items: stretch;
-}
-
-.cu-jc-start {
- justify-content: start;
-}
-
-.cu-jc-center {
- justify-content: center;
-}
-
-.cu-jc-end {
- justify-content: end;
-}
-
-.cu-jc-between {
- justify-content: space-between;
-}
-
-.cu-fd-row {
- flex-direction: row;
-}
-
-.cu-fd-column {
- flex-direction: column;
-}
-
-.cu-fd-row-reverse {
- flex-direction: row-reverse;
-}
-
-.cu-fd-column-reverse {
- flex-direction: column-reverse;
-}
-
-@media (width >= 640px) {
- .xs\:cu-align-start {
- align-items: start;
- }
-
- .xs\:cu-align-center {
- align-items: center;
- }
-
- .xs\:cu-align-end {
- align-items: end;
- }
-
- .xs\:cu-align-stretch {
- align-items: stretch;
- }
-
- .xs\:cu-jc-start {
- justify-content: start;
- }
-
- .xs\:cu-jc-center {
- justify-content: center;
- }
-
- .xs\:cu-jc-end {
- justify-content: end;
- }
-
- .xs\:cu-jc-between {
- justify-content: space-between;
- }
-
- .xs\:cu-fd-row {
- flex-direction: row;
- }
-
- .xs\:cu-fd-column {
- flex-direction: column;
- }
-
- .xs\:cu-fd-row-reverse {
- flex-direction: row-reverse;
- }
-
- .xs\:cu-fd-column-reverse {
- flex-direction: column-reverse;
- }
-}
-
-@media (width >= 768px) {
- .sm\:cu-align-start {
- align-items: start;
- }
-
- .sm\:cu-align-center {
- align-items: center;
- }
-
- .sm\:cu-align-end {
- align-items: end;
- }
-
- .sm\:cu-align-stretch {
- align-items: stretch;
- }
-
- .sm\:cu-jc-start {
- justify-content: start;
- }
-
- .sm\:cu-jc-center {
- justify-content: center;
- }
-
- .sm\:cu-jc-end {
- justify-content: end;
- }
-
- .sm\:cu-jc-between {
- justify-content: space-between;
- }
-
- .sm\:cu-fd-row {
- flex-direction: row;
- }
-
- .sm\:cu-fd-column {
- flex-direction: column;
- }
-
- .sm\:cu-fd-row-reverse {
- flex-direction: row-reverse;
- }
-
- .sm\:cu-fd-column-reverse {
- flex-direction: column-reverse;
- }
-}
-
-@media (width >= 1024px) {
- .md\:cu-align-start {
- align-items: start;
- }
-
- .md\:cu-align-center {
- align-items: center;
- }
-
- .md\:cu-align-end {
- align-items: end;
- }
-
- .md\:cu-align-stretch {
- align-items: stretch;
- }
-
- .md\:cu-jc-start {
- justify-content: start;
- }
-
- .md\:cu-jc-center {
- justify-content: center;
- }
-
- .md\:cu-jc-end {
- justify-content: end;
- }
-
- .md\:cu-jc-between {
- justify-content: space-between;
- }
-
- .md\:cu-fd-row {
- flex-direction: row;
- }
-
- .md\:cu-fd-column {
- flex-direction: column;
- }
-
- .md\:cu-fd-row-reverse {
- flex-direction: row-reverse;
- }
-
- .md\:cu-fd-column-reverse {
- flex-direction: column-reverse;
- }
-}
-
-@media (width >= 1280px) {
- .lg\:cu-align-start {
- align-items: start;
- }
-
- .lg\:cu-align-center {
- align-items: center;
- }
-
- .lg\:cu-align-end {
- align-items: end;
- }
-
- .lg\:cu-align-stretch {
- align-items: stretch;
- }
-
- .lg\:cu-jc-start {
- justify-content: start;
- }
-
- .lg\:cu-jc-center {
- justify-content: center;
- }
-
- .lg\:cu-jc-end {
- justify-content: end;
- }
-
- .lg\:cu-jc-between {
- justify-content: space-between;
- }
-
- .lg\:cu-fd-row {
- flex-direction: row;
- }
-
- .lg\:cu-fd-column {
- flex-direction: column;
- }
-
- .lg\:cu-fd-row-reverse {
- flex-direction: row-reverse;
- }
-
- .lg\:cu-fd-column-reverse {
- flex-direction: column-reverse;
- }
-}
-
-@media (width >= 1536px) {
- .xl\:cu-align-start {
- align-items: start;
- }
-
- .xl\:cu-align-center {
- align-items: center;
- }
-
- .xl\:cu-align-end {
- align-items: end;
- }
-
- .xl\:cu-align-stretch {
- align-items: stretch;
- }
-
- .xl\:cu-jc-start {
- justify-content: start;
- }
-
- .xl\:cu-jc-center {
- justify-content: center;
- }
-
- .xl\:cu-jc-end {
- justify-content: end;
- }
-
- .xl\:cu-jc-between {
- justify-content: space-between;
- }
-
- .xl\:cu-fd-row {
- flex-direction: row;
- }
-
- .xl\:cu-fd-column {
- flex-direction: column;
- }
-
- .xl\:cu-fd-row-reverse {
- flex-direction: row-reverse;
- }
-
- .xl\:cu-fd-column-reverse {
- flex-direction: column-reverse;
- }
-}
-
-:where(a) {
- color: inherit;
- text-decoration: none;
-}
-
-:root {
- --canon-font-regular: system-ui;
- --canon-font-monospace: ui-monospace, "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;
- --canon-font-weight-regular: 400;
- --canon-font-weight-bold: 600;
- --canon-font-size-1: .625rem;
- --canon-font-size-2: .75rem;
- --canon-font-size-3: .875rem;
- --canon-font-size-4: 1rem;
- --canon-font-size-5: 1.25rem;
- --canon-font-size-6: 1.5rem;
- --canon-font-size-7: 2rem;
- --canon-font-size-8: 3rem;
- --canon-font-size-9: 4rem;
- --canon-font-size-10: 5.75rem;
- --canon-space: .25rem;
- --canon-space-0_5: calc(var(--canon-space) * .5);
- --canon-space-1: var(--canon-space);
- --canon-space-1_5: calc(var(--canon-space) * 1.5);
- --canon-space-2: calc(var(--canon-space) * 2);
- --canon-space-3: calc(var(--canon-space) * 3);
- --canon-space-4: calc(var(--canon-space) * 4);
- --canon-space-5: calc(var(--canon-space) * 5);
- --canon-space-6: calc(var(--canon-space) * 6);
- --canon-space-7: calc(var(--canon-space) * 7);
- --canon-space-8: calc(var(--canon-space) * 8);
- --canon-space-9: calc(var(--canon-space) * 9);
- --canon-space-10: calc(var(--canon-space) * 10);
- --canon-space-11: calc(var(--canon-space) * 11);
- --canon-space-12: calc(var(--canon-space) * 12);
- --canon-space-13: calc(var(--canon-space) * 13);
- --canon-space-14: calc(var(--canon-space) * 14);
- --canon-radius-1: calc(.125rem);
- --canon-radius-2: calc(.25rem);
- --canon-radius-3: calc(.5rem);
- --canon-radius-4: calc(.75rem);
- --canon-radius-5: calc(1rem);
- --canon-radius-6: calc(1.25rem);
- --canon-radius-full: 9999px;
- --canon-black: #000;
- --canon-white: #fff;
- --canon-gray-1: #f8f8f8;
- --canon-gray-2: #ececec;
- --canon-gray-3: #d9d9d9;
- --canon-gray-4: #c1c1c1;
- --canon-gray-5: #9e9e9e;
- --canon-gray-6: #8c8c8c;
- --canon-gray-7: #757575;
- --canon-gray-8: #595959;
- --canon-bg: var(--canon-gray-1);
- --canon-bg-surface-1: var(--canon-white);
- --canon-bg-surface-2: var(--canon-gray-2);
- --canon-bg-solid: #1f5493;
- --canon-bg-solid-hover: #163a66;
- --canon-bg-solid-pressed: #0f2b4e;
- --canon-bg-solid-disabled: #ebebeb;
- --canon-bg-tint: transparent;
- --canon-bg-tint-hover: #1f549366;
- --canon-bg-tint-pressed: #1f549399;
- --canon-bg-tint-disabled: #ebebeb;
- --canon-bg-danger: #feebe7;
- --canon-bg-warning: #fff2b2;
- --canon-bg-success: #e6f6eb;
- --canon-fg-primary: var(--canon-black);
- --canon-fg-secondary: var(--canon-gray-7);
- --canon-fg-link: #1f5493;
- --canon-fg-link-hover: #1f2d5c;
- --canon-fg-disabled: #9e9e9e;
- --canon-fg-solid: var(--canon-white);
- --canon-fg-solid-disabled: #9c9c9c;
- --canon-fg-tint: #1f5493;
- --canon-fg-tint-disabled: var(--canon-gray-5);
- --canon-fg-danger: #e22b2b;
- --canon-fg-warning: #e36d05;
- --canon-fg-success: #1db954;
- --canon-border: #0000001a;
- --canon-border-hover: #0003;
- --canon-border-pressed: #0006;
- --canon-border-disabled: #0000001a;
- --canon-border-danger: #f87a7a;
- --canon-border-warning: #e36d05;
- --canon-border-success: #53db83;
- --canon-ring: #1f5493;
- --canon-scrollbar: #a0a0a03b;
- --canon-scrollbar-thumb: #a0a0a0;
-}
-
-[data-theme="dark"] {
- --canon-gray-1: #191919;
- --canon-gray-2: #242424;
- --canon-gray-3: #373737;
- --canon-gray-4: #464646;
- --canon-gray-5: #575757;
- --canon-gray-6: #7b7b7b;
- --canon-gray-7: #9e9e9e;
- --canon-gray-8: #b4b4b4;
- --canon-bg: var(--canon-black);
- --canon-bg-surface-1: var(--canon-gray-1);
- --canon-bg-surface-2: var(--canon-gray-2);
- --canon-bg-solid: #9cc9ff;
- --canon-bg-solid-hover: #83b9fd;
- --canon-bg-solid-pressed: #83b9fd;
- --canon-bg-solid-disabled: #222;
- --canon-bg-tint: transparent;
- --canon-bg-tint-hover: #9cc9ff1f;
- --canon-bg-tint-pressed: #9cc9ff29;
- --canon-bg-tint-disabled: transparent;
- --canon-bg-danger: #3b1219;
- --canon-bg-warning: #302008;
- --canon-bg-success: #132d21;
- --canon-fg-primary: var(--canon-white);
- --canon-fg-secondary: var(--canon-gray-7);
- --canon-fg-link: #9cc9ff;
- --canon-fg-link-hover: #7eb5f7;
- --canon-fg-disabled: var(--canon-gray-7);
- --canon-fg-solid: #101821;
- --canon-fg-solid-disabled: var(--canon-gray-5);
- --canon-fg-tint: #9cc9ff;
- --canon-fg-tint-disabled: var(--canon-gray-5);
- --canon-fg-danger: #e22b2b;
- --canon-fg-warning: #e36d05;
- --canon-fg-success: #1db954;
- --canon-border: #fff3;
- --canon-border-hover: #fff6;
- --canon-border-pressed: #ffffff80;
- --canon-border-disabled: #fff3;
- --canon-border-danger: #f87a7a;
- --canon-border-warning: #e36d05;
- --canon-border-success: #53db83;
- --canon-ring: #1f5493;
- --canon-scrollbar: #3636363a;
- --canon-scrollbar-thumb: #575757;
-}
diff --git a/packages/canon/css/datatable.css b/packages/canon/css/datatable.css
deleted file mode 100644
index edef29f500..0000000000
--- a/packages/canon/css/datatable.css
+++ /dev/null
@@ -1,23 +0,0 @@
-.canon-DataTablePagination {
- padding-top: var(--canon-space-5);
- justify-content: space-between;
- align-items: center;
- display: flex;
-}
-
-.canon-DataTablePagination--left {
- justify-content: space-between;
- align-items: center;
- display: flex;
-}
-
-.canon-DataTablePagination--right {
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- display: flex;
-}
-
-.canon-DataTablePagination--select {
- min-width: 10.5rem;
-}
diff --git a/packages/canon/css/fieldlabel.css b/packages/canon/css/fieldlabel.css
deleted file mode 100644
index 1b708ed580..0000000000
--- a/packages/canon/css/fieldlabel.css
+++ /dev/null
@@ -1,27 +0,0 @@
-.canon-FieldLabel {
- margin-bottom: var(--canon-space-3);
- gap: var(--canon-space-1);
- flex-direction: column;
- display: flex;
-}
-
-.canon-FieldLabelLabel {
- color: var(--canon-fg-primary);
- cursor: pointer;
- font-weight: var(--canon-font-weight-regular);
- font-size: var(--canon-font-size-2);
- margin-right: auto;
-}
-
-.canon-FieldLabelSecondaryLabel {
- color: var(--canon-fg-secondary);
- font-weight: var(--canon-font-weight-regular);
- margin-left: var(--canon-space-1);
-}
-
-.canon-FieldLabelDescription {
- font-weight: var(--canon-font-weight-regular);
- font-size: var(--canon-font-size-2);
- color: var(--canon-fg-secondary);
- margin: 0;
-}
diff --git a/packages/canon/css/flex.css b/packages/canon/css/flex.css
deleted file mode 100644
index 5c6108eee7..0000000000
--- a/packages/canon/css/flex.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.canon-Flex {
- min-width: 0;
- display: flex;
-}
diff --git a/packages/canon/css/grid.css b/packages/canon/css/grid.css
deleted file mode 100644
index 0bb9267795..0000000000
--- a/packages/canon/css/grid.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.canon-Grid {
- display: grid;
-}
diff --git a/packages/canon/css/heading.css b/packages/canon/css/heading.css
deleted file mode 100644
index e5645e14a9..0000000000
--- a/packages/canon/css/heading.css
+++ /dev/null
@@ -1,51 +0,0 @@
-.canon-Heading {
- font-family: var(--canon-font-regular);
- color: var(--canon-fg-primary);
- margin: 0;
- padding: 0;
- line-height: 100%;
-}
-
-.canon-Heading[data-variant="display"] {
- font-size: var(--canon-font-size-10);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title1"] {
- font-size: var(--canon-font-size-9);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title2"] {
- font-size: var(--canon-font-size-8);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title3"] {
- font-size: var(--canon-font-size-7);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title4"] {
- font-size: var(--canon-font-size-6);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-variant="title5"] {
- font-size: var(--canon-font-size-5);
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Heading[data-color="primary"] {
- color: var(--canon-fg-primary);
-}
-
-.canon-Heading[data-color="secondary"] {
- color: var(--canon-fg-secondary);
-}
-
-.canon-Heading[data-truncate] {
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
-}
diff --git a/packages/canon/css/icon.css b/packages/canon/css/icon.css
deleted file mode 100644
index 35b453cb3f..0000000000
--- a/packages/canon/css/icon.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.canon-Icon {
- width: 1rem;
- height: 1rem;
-}
diff --git a/packages/canon/css/iconbutton.css b/packages/canon/css/iconbutton.css
deleted file mode 100644
index dc3f9d94c5..0000000000
--- a/packages/canon/css/iconbutton.css
+++ /dev/null
@@ -1,89 +0,0 @@
-.canon-IconButton {
- user-select: none;
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-bold);
- cursor: pointer;
- border-radius: var(--canon-radius-2);
- justify-content: center;
- align-items: center;
- gap: var(--canon-space-1_5);
- border: none;
- padding: 0;
- display: inline-flex;
-
- &:disabled {
- cursor: not-allowed;
- }
-}
-
-.canon-IconButton[data-variant="primary"] {
- background-color: var(--canon-bg-solid);
- color: var(--canon-fg-solid);
- transition: background-color .15s, box-shadow .15s;
-
- &:hover {
- background-color: var(--canon-bg-solid-hover);
- }
-
- &:active {
- background-color: var(--canon-bg-solid-pressed);
- }
-
- &:focus-visible {
- outline: 2px solid var(--canon-ring);
- outline-offset: 2px;
- }
-
- &:disabled {
- background-color: var(--canon-bg-solid-disabled);
- color: var(--canon-fg-solid-disabled);
- }
-}
-
-.canon-IconButton[data-variant="secondary"] {
- background-color: var(--canon-bg-surface-1);
- box-shadow: inset 0 0 0 1px var(--canon-border);
- color: var(--canon-fg-primary);
- transition: box-shadow .15s;
-
- &:hover {
- box-shadow: inset 0 0 0 1px var(--canon-border-hover);
- }
-
- &:active {
- box-shadow: inset 0 0 0 1px var(--canon-border-pressed);
- }
-
- &:focus-visible {
- box-shadow: inset 0 0 0 2px var(--canon-ring);
- outline: none;
- transition: none;
- }
-
- &:disabled {
- box-shadow: inset 0 0 0 1px var(--canon-border-disabled);
- color: var(--canon-fg-disabled);
- }
-}
-
-.canon-IconButton[data-size="medium"] {
- font-size: var(--canon-font-size-4);
- width: 40px;
- height: 40px;
-}
-
-.canon-IconButton[data-size="small"] {
- font-size: var(--canon-font-size-3);
- width: 32px;
- height: 32px;
-}
-
-.canon-IconButtonIcon[data-size="small"], .canon-IconButtonIcon[data-size="small"] svg {
- width: 1rem;
- height: 1rem;
-}
-
-.canon-IconButtonIcon[data-size="medium"], .canon-IconButtonIcon[data-size="medium"] svg {
- width: 1.25rem;
- height: 1.25rem;
-}
diff --git a/packages/canon/css/link.css b/packages/canon/css/link.css
deleted file mode 100644
index 535beb3d9f..0000000000
--- a/packages/canon/css/link.css
+++ /dev/null
@@ -1,45 +0,0 @@
-.canon-Link {
- font-family: var(--canon-font-regular);
- color: var(--canon-fg-link);
- cursor: pointer;
- margin: 0;
- padding: 0;
- text-decoration-line: none;
-
- &:hover {
- color: var(--canon-fg-link-hover);
- text-underline-offset: calc(.025em + 2px);
- text-decoration-line: underline;
- text-decoration-style: solid;
- text-decoration-thickness: min(2px, max(1px, .05em));
- text-decoration-color: color-mix(in srgb, var(--canon-fg-link-hover) 30%, transparent);
- }
-}
-
-.canon-Link[data-variant="body"] {
- font-size: var(--canon-font-size-3);
- line-height: 140%;
-}
-
-.canon-Link[data-variant="subtitle"] {
- font-size: var(--canon-font-size-4);
- line-height: 140%;
-}
-
-.canon-Link[data-variant="caption"] {
- font-size: var(--canon-font-size-2);
- line-height: 140%;
-}
-
-.canon-Link[data-variant="label"] {
- font-size: var(--canon-font-size-1);
- line-height: 140%;
-}
-
-.canon-Link[data-weight="regular"] {
- font-weight: var(--canon-font-weight-regular);
-}
-
-.canon-Link[data-weight="bold"] {
- font-weight: var(--canon-font-weight-bold);
-}
diff --git a/packages/canon/css/menu.css b/packages/canon/css/menu.css
deleted file mode 100644
index 7035fab12b..0000000000
--- a/packages/canon/css/menu.css
+++ /dev/null
@@ -1,178 +0,0 @@
-.canon-MenuPositioner {
- outline: 0;
-}
-
-.canon-MenuPopup {
- background-color: var(--canon-bg-surface-1);
- border: 1px solid var(--canon-border);
- color: var(--canon-fg-primary);
- transform-origin: var(--transform-origin);
- max-width: min(var(--available-width), 340px);
- max-height: min(var(--available-height), 500px);
- padding-bottom: var(--canon-space-1);
- border-radius: .375rem;
- outline: none;
- flex-direction: column;
- transition: transform .15s, opacity .15s;
- display: flex;
- position: relative;
- overflow: auto;
-
- &[data-starting-style], &[data-ending-style] {
- opacity: 0;
- transform: scale(.9);
- }
-}
-
-.canon-MenuItem {
- user-select: none;
- align-items: center;
- gap: var(--canon-space-2);
- height: 32px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- margin-inline: var(--canon-space-1);
- padding-inline: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- cursor: pointer;
- outline: 0;
- flex-shrink: 0;
- text-decoration: none;
- display: flex;
-
- &:first-child {
- margin-top: var(--canon-space-1);
- }
-
- &[data-highlighted] {
- background-color: var(--canon-gray-3);
- }
-}
-
-.canon-MenuSubmenuTrigger {
- user-select: none;
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- height: 32px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- margin-inline: var(--canon-space-1);
- padding-inline: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- cursor: pointer;
- outline: 0;
- flex-shrink: 0;
- text-decoration: none;
- display: flex;
-
- & .canon-Icon {
- color: var(--canon-fg-secondary);
- }
-
- &:first-child {
- margin-top: var(--canon-space-1);
- }
-
- &[data-popup-open], &[data-highlighted] {
- background-color: var(--canon-gray-3);
-
- & .canon-Icon {
- color: var(--canon-fg-primary);
- }
- }
-}
-
-.canon-MenuSeparator {
- background-color: var(--color-gray-200);
- height: 1px;
- margin: .375rem 1rem;
-}
-
-.canon-SubmenuComboboxSearch {
- padding-inline: var(--canon-space-3);
- border: none;
- border-bottom: 1px solid var(--canon-border);
- background-color: var(--canon-bg-surface-1);
- width: 100%;
- height: 32px;
- color: var(--canon-fg-primary);
- line-height: 140%;
- font-size: var(--canon-font-size-3);
- z-index: 1;
- outline: none;
- position: sticky;
- top: 0;
-
- &::placeholder {
- color: var(--canon-fg-secondary);
- }
-
- &:disabled {
- opacity: .6;
- cursor: not-allowed;
- }
-}
-
-.canon-SubmenuComboboxItems {
- padding-top: var(--canon-space-2);
- outline: none;
- flex-direction: column;
- display: flex;
- overflow-y: auto;
-}
-
-.canon-SubmenuComboboxNoResults {
- padding-inline: var(--canon-space-3);
- padding-top: var(--canon-space-2);
- padding-bottom: var(--canon-space-4);
- color: var(--canon-fg-secondary);
- font-size: var(--canon-font-size-3);
-}
-
-.canon-SubmenuComboboxItem {
- user-select: none;
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- height: 32px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- margin-inline: var(--canon-space-1);
- padding-inline: var(--canon-space-2);
- font-size: var(--canon-font-size-3);
- cursor: pointer;
- outline: 0;
- flex-shrink: 0;
- text-decoration: none;
- display: flex;
-
- &[data-highlighted] {
- background-color: var(--canon-gray-3);
- }
-
- &[data-disabled] {
- opacity: .5;
- cursor: not-allowed;
- }
-}
-
-.canon-SubmenuComboboxItemCheckbox {
- width: 16px;
- height: 16px;
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-2);
- border: 1px solid var(--canon-border);
- background: var(--canon-bg-surface-1);
- flex-shrink: 0;
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-SubmenuComboboxItemLabel {
- text-overflow: ellipsis;
- white-space: nowrap;
- flex: 1;
- overflow: hidden;
-}
diff --git a/packages/canon/css/scrollarea.css b/packages/canon/css/scrollarea.css
deleted file mode 100644
index d5809f2d88..0000000000
--- a/packages/canon/css/scrollarea.css
+++ /dev/null
@@ -1,50 +0,0 @@
-.canon-ScrollAreaRoot {
- box-sizing: border-box;
- width: 24rem;
- max-width: calc(100vw - 8rem);
- height: 8.5rem;
-}
-
-.canon-ScrollAreaViewport {
- overscroll-behavior: contain;
- height: 100%;
-}
-
-.canon-ScrollAreaContent {
- padding-block: .75rem;
- flex-direction: column;
- gap: 1rem;
- padding-left: 1rem;
- padding-right: 1.5rem;
- display: flex;
-}
-
-.canon-ScrollAreaScrollbar {
- background-color: var(--canon-scrollbar);
- opacity: 0;
- border-radius: .375rem;
- justify-content: center;
- width: .25rem;
- margin: .5rem;
- transition: opacity .15s .3s;
- display: flex;
-
- &[data-hovering], &[data-scrolling] {
- opacity: 1;
- transition-duration: 75ms;
- transition-delay: 0s;
- }
-
- &:before {
- content: "";
- width: 1.25rem;
- height: 100%;
- position: absolute;
- }
-}
-
-.canon-ScrollAreaThumb {
- border-radius: inherit;
- background-color: var(--canon-scrollbar-thumb);
- width: 100%;
-}
diff --git a/packages/canon/css/select.css b/packages/canon/css/select.css
deleted file mode 100644
index 1c23f39201..0000000000
--- a/packages/canon/css/select.css
+++ /dev/null
@@ -1,188 +0,0 @@
-.canon-Select {
- font-family: var(--canon-font-regular);
- flex-direction: column;
- width: 100%;
- display: flex;
-}
-
-.canon-SelectLabel {
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- margin-bottom: var(--canon-space-1_5);
- cursor: pointer;
-}
-
-.canon-SelectLabel[data-disabled] {
- cursor: default;
-}
-
-.canon-SelectDescription {
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-secondary);
- padding-top: var(--canon-space-1_5);
- margin: 0;
-}
-
-.canon-SelectError {
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-danger);
- padding-top: var(--canon-space-1_5);
- margin: 0;
-}
-
-.canon-SelectTrigger {
- box-sizing: border-box;
- border-radius: var(--canon-radius-3);
- border: 1px solid var(--canon-border);
- padding: 0 var(--canon-space-4);
- background-color: var(--canon-bg-surface-1);
- font-size: var(--canon-font-size-3);
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- cursor: pointer;
- justify-content: space-between;
- align-items: center;
- gap: var(--canon-space-2);
- width: 100%;
- transition: border-color .2s ease-in-out, outline-color .2s ease-in-out;
- display: flex;
-}
-
-.canon-SelectTrigger::placeholder {
- color: var(--canon-fg-secondary);
-}
-
-.canon-SelectTrigger:hover {
- border-color: var(--canon-border-hover);
-}
-
-.canon-SelectTrigger:focus-visible {
- border-color: var(--canon-border-pressed);
- outline: 0;
-}
-
-.canon-SelectTrigger[data-invalid] {
- border-color: var(--canon-fg-danger);
-}
-
-.canon-SelectTrigger[data-invalid]:hover, .canon-SelectTrigger[data-invalid]:focus-visible {
- border-width: 2px;
-}
-
-.canon-SelectTrigger[data-disabled] {
- cursor: not-allowed;
- border-color: var(--canon-border-disabled);
- color: var(--canon-fg-disabled);
-}
-
-.canon-SelectTrigger[data-size="small"] {
- height: 2rem;
-}
-
-.canon-SelectTrigger[data-size="medium"] {
- height: 3rem;
-}
-
-.canon-SelectIcon {
- margin-left: var(--canon-space-5);
- transition: transform .2s;
-}
-
-.canon-SelectTrigger[data-popup-open] .canon-SelectIcon {
- transform: rotate(180deg);
-}
-
-.canon-SelectPopup {
- box-sizing: border-box;
- max-height: var(--available-height);
- background-color: var(--canon-bg-surface-1);
- border: 1px solid var(--canon-border);
- border-radius: var(--canon-radius-3);
- padding-block: var(--canon-space-1);
- z-index: 1;
- transform-origin: var(--transform-origin);
- outline: 0;
- transition: transform .15s, opacity .15s;
- overflow-y: auto;
- box-shadow: 0 4px 12px #0003;
-}
-
-.canon-SelectPopup[data-starting-style], .canon-SelectPopup[data-ending-style] {
- opacity: 0;
- transform: scale(.9);
-}
-
-.canon-SelectItem {
- width: var(--anchor-width);
- padding-block: var(--canon-space-2);
- padding-inline: var(--canon-space-4);
- color: var(--canon-fg-primary);
- border-radius: var(--canon-radius-3);
- cursor: pointer;
- user-select: none;
- font-size: var(--canon-font-size-3);
- align-items: center;
- gap: var(--canon-space-2);
- outline: none;
- grid-template-columns: 1rem 1fr;
- grid-template-areas: "icon text";
- display: grid;
- position: relative;
-}
-
-.canon-SelectItem[data-highlighted] {
- z-index: 0;
- color: var(--canon-fg-primary);
- position: relative;
-}
-
-.canon-SelectItem[data-highlighted]:before {
- content: "";
- z-index: -1;
- background-color: var(--canon-bg-tint-hover);
- border-radius: .25rem;
- position: absolute;
- inset-block: 0;
- inset-inline: .25rem;
-}
-
-.canon-SelectItem[data-disabled] {
- cursor: not-allowed;
- color: var(--canon-fg-disabled);
-}
-
-.canon-SelectItemIndicator {
- grid-area: icon;
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-SelectItemText {
- flex: 1;
- grid-area: text;
-}
-
-.canon-SelectRequired {
- color: var(--canon-fg-secondary);
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- margin-left: var(--canon-space-1);
-}
-
-.canon-SelectIcon {
- justify-content: center;
- align-items: center;
- display: flex;
-}
-
-.canon-SelectValue {
- text-overflow: ellipsis;
- white-space: nowrap;
- width: 100%;
- overflow: hidden;
-}
diff --git a/packages/canon/css/styles.css b/packages/canon/css/styles.css
index 9f32da5d66..806ee771d2 100644
--- a/packages/canon/css/styles.css
+++ b/packages/canon/css/styles.css
@@ -9496,6 +9496,13 @@
min-width: 10.5rem;
}
+.canon-FieldError {
+ color: var(--canon-fg-danger);
+ font-size: var(--canon-font-size-2);
+ font-weight: var(--canon-font-weight-regular);
+ margin-top: var(--canon-space-2);
+}
+
.canon-FieldLabel {
margin-bottom: var(--canon-space-3);
gap: var(--canon-space-1);
@@ -9815,6 +9822,96 @@
overflow: hidden;
}
+.canon-RadioGroup {
+ color: var(--canon-fg-primary);
+ flex-direction: column;
+ display: flex;
+}
+
+.canon-RadioGroup[data-orientation="horizontal"] .canon-RadioGroupContent {
+ gap: var(--canon-space-4);
+ flex-direction: row;
+}
+
+.canon-RadioGroupContent {
+ gap: var(--canon-space-2);
+ flex-direction: column;
+ display: flex;
+}
+
+.canon-Radio {
+ align-items: center;
+ gap: var(--canon-space-2);
+ font-size: var(--canon-font-size-2);
+ color: var(--canon-fg-primary);
+ forced-color-adjust: none;
+ display: flex;
+ position: relative;
+
+ &:before {
+ content: "";
+ box-sizing: border-box;
+ border: .125rem solid var(--canon-border);
+ background: var(--canon-gray-1);
+ border-radius: var(--canon-radius-full);
+ width: 1rem;
+ height: 1rem;
+ transition: all .2s;
+ display: block;
+ }
+
+ &[data-pressed]:before {
+ border-color: var(--canon-border);
+ }
+
+ &[data-selected] {
+ &:before {
+ border-color: var(--canon-bg-solid);
+ border-width: .25rem;
+ }
+
+ &[data-pressed]:before {
+ border-color: var(--canon-bg-solid);
+ }
+ }
+
+ &[data-focus-visible]:before {
+ outline: 2px solid var(--canon-ring);
+ outline-offset: 2px;
+ }
+
+ &[data-disabled] {
+ cursor: not-allowed;
+ color: var(--canon-fg-disabled);
+
+ &:before {
+ border-color: var(--canon-border-disabled);
+ background: var(--canon-bg-disabled);
+ }
+
+ &[data-selected]:before {
+ border-color: var(--canon-border-disabled);
+ }
+ }
+
+ &[data-invalid]:before, &[data-invalid][data-selected]:before {
+ border-color: var(--canon-border-danger);
+ }
+
+ &[data-disabled][data-invalid] {
+ color: var(--canon-fg-disabled);
+
+ &:before {
+ border-color: var(--canon-border-disabled);
+ background: var(--canon-bg-disabled);
+ }
+
+ &[data-selected]:before {
+ border-color: var(--canon-border-disabled);
+ }
+ }
+}
+
.canon-TableRoot {
caption-side: bottom;
border-collapse: collapse;
@@ -10119,13 +10216,6 @@
border: 1px solid var(--canon-border-disabled);
}
-.canon-TextFieldError {
- color: var(--canon-fg-danger);
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- margin-top: var(--canon-space-2);
-}
-
.canon-TooltipPopup {
box-sizing: border-box;
transform-origin: var(--transform-origin);
diff --git a/packages/canon/css/switch.css b/packages/canon/css/switch.css
deleted file mode 100644
index ee517543d7..0000000000
--- a/packages/canon/css/switch.css
+++ /dev/null
@@ -1,57 +0,0 @@
-.canon-Switch {
- align-items: center;
- gap: var(--canon-space-3);
- font-size: var(--canon-font-size-3);
- color: var(--canon-fg-primary);
- cursor: pointer;
- display: flex;
- position: relative;
-
- &[data-pressed] .canon-SwitchIndicator {
- &:before {
- background: var(--canon-fg-solid);
- }
- }
-
- &[data-selected] {
- & .canon-SwitchIndicator {
- background: var(--canon-bg-solid);
-
- &:before {
- background: var(--canon-fg-solid);
- transform: translateX(100%);
- }
- }
-
- &[data-pressed] {
- & .indicator {
- background: var(--canon-gray-3);
- }
- }
- }
-
- &[data-focus-visible] .canon-SwitchIndicator {
- outline-offset: 2px;
- outline: 2px solid;
- }
-}
-
-.canon-SwitchIndicator {
- background: var(--canon-gray-3);
- border: 2px;
- border-radius: 1.143rem;
- width: 2rem;
- height: 1.143rem;
- transition: all .2s;
-
- &:before {
- content: "";
- background: var(--canon-fg-solid);
- border-radius: 16px;
- width: .857rem;
- height: .857rem;
- margin: .143rem;
- transition: all .2s;
- display: block;
- }
-}
diff --git a/packages/canon/css/table.css b/packages/canon/css/table.css
deleted file mode 100644
index f14ee3759e..0000000000
--- a/packages/canon/css/table.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.canon-TableCell {
- padding: var(--canon-space-3);
- font-size: var(--canon-font-size-3);
-}
diff --git a/packages/canon/css/tabs.css b/packages/canon/css/tabs.css
deleted file mode 100644
index a9bf036c3e..0000000000
--- a/packages/canon/css/tabs.css
+++ /dev/null
@@ -1,76 +0,0 @@
-.canon-TabsRoot {
- border: 1px solid var(--color-gray-200);
- border-radius: .375rem;
-}
-
-.canon-TabsList {
- z-index: 0;
- display: flex;
- position: relative;
-}
-
-.canon-TabsTab {
- appearance: none;
- color: var(--canon-fg-secondary);
- user-select: none;
- padding-inline: var(--canon-space-3);
- height: 2rem;
- font-family: inherit;
- font-size: .875rem;
- font-weight: 500;
- line-height: 1.25rem;
- font-size: var(--canon-font-size-2);
- cursor: pointer;
- background: none;
- border: 0;
- outline: 0;
- justify-content: center;
- align-items: center;
- margin: 0;
- padding-block: 0;
- transition: color .2s ease-in-out;
- display: flex;
-
- &[data-selected] {
- color: var(--canon-fg-primary);
- }
-
- @media (hover: hover) {
- &:hover {
- color: var(--canon-fg-primary);
- }
- }
-
- &:focus-visible {
- position: relative;
-
- &:before {
- content: "";
- outline: 1px solid var(--canon-ring);
- outline-offset: -1px;
- border-radius: .25rem;
- position: absolute;
- inset: .25rem 0;
- }
- }
-}
-
-.canon-TabsIndicator {
- z-index: -1;
- translate: var(--active-tab-left) -50%;
- width: var(--active-tab-width);
- background-color: var(--canon-bg-solid);
- height: 1px;
- transition-property: translate, width;
- transition-duration: .2s;
- transition-timing-function: ease-in-out;
- position: absolute;
- bottom: 0;
- left: 0;
-}
-
-.canon-TabsPanel {
- &[hidden] {
- display: none;
- }
-}
diff --git a/packages/canon/css/text.css b/packages/canon/css/text.css
deleted file mode 100644
index c4f9671816..0000000000
--- a/packages/canon/css/text.css
+++ /dev/null
@@ -1,59 +0,0 @@
-.canon-Text {
- font-family: var(--canon-font-regular);
- margin: 0;
- padding: 0;
-}
-
-.canon-Text[data-variant="body"] {
- font-size: var(--canon-font-size-3);
- line-height: 140%;
-}
-
-.canon-Text[data-variant="subtitle"] {
- font-size: var(--canon-font-size-4);
- line-height: 140%;
-}
-
-.canon-Text[data-variant="caption"] {
- font-size: var(--canon-font-size-2);
- line-height: 140%;
-}
-
-.canon-Text[data-variant="label"] {
- font-size: var(--canon-font-size-1);
- line-height: 140%;
-}
-
-.canon-Text[data-weight="regular"] {
- font-weight: var(--canon-font-weight-regular);
-}
-
-.canon-Text[data-weight="bold"] {
- font-weight: var(--canon-font-weight-bold);
-}
-
-.canon-Text[data-color="primary"] {
- color: var(--canon-fg-primary);
-}
-
-.canon-Text[data-color="secondary"] {
- color: var(--canon-fg-secondary);
-}
-
-.canon-Text[data-color="danger"] {
- color: var(--canon-fg-danger);
-}
-
-.canon-Text[data-color="warning"] {
- color: var(--canon-fg-warning);
-}
-
-.canon-Text[data-color="success"] {
- color: var(--canon-fg-success);
-}
-
-.canon-Text[data-truncate] {
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
-}
diff --git a/packages/canon/css/textfield.css b/packages/canon/css/textfield.css
deleted file mode 100644
index fdb3621016..0000000000
--- a/packages/canon/css/textfield.css
+++ /dev/null
@@ -1,94 +0,0 @@
-.canon-TextField {
- font-family: var(--canon-font-regular);
- flex-direction: column;
- width: 100%;
- display: flex;
-}
-
-.canon-TextFieldInputWrapper {
- position: relative;
-}
-
-.canon-TextFieldInputWrapper[data-size="small"] {
- height: 2rem;
-}
-
-.canon-TextFieldInputWrapper[data-size="medium"] {
- height: 2.5rem;
-}
-
-.canon-TextFieldIcon {
- left: var(--canon-space-3);
- margin-right: var(--canon-space-1);
- color: var(--canon-fg-primary);
- flex-shrink: 0;
- position: absolute;
- top: 50%;
- transform: translateY(-50%);
-}
-
-.canon-TextFieldIcon[data-size="small"], .canon-TextFieldIcon[data-size="small"] svg {
- width: 1rem;
- height: 1rem;
-}
-
-.canon-TextFieldIcon[data-size="medium"], .canon-TextFieldIcon[data-size="medium"] svg {
- width: 1.25rem;
- height: 1.25rem;
-}
-
-.canon-TextFieldInput {
- padding: 0 var(--canon-space-3);
- border-radius: var(--canon-radius-3);
- border: 1px solid var(--canon-border);
- background-color: var(--canon-bg-surface-1);
- font-size: var(--canon-font-size-3);
- font-family: var(--canon-font-regular);
- font-weight: var(--canon-font-weight-regular);
- color: var(--canon-fg-primary);
- width: 100%;
- height: 100%;
- cursor: inherit;
- align-items: center;
- transition: border-color .2s ease-in-out, outline-color .2s ease-in-out;
- display: flex;
-}
-
-.canon-TextFieldInput::placeholder {
- color: var(--canon-fg-secondary);
-}
-
-.canon-TextFieldInput[data-icon] {
- padding-left: var(--canon-space-8);
-}
-
-.canon-TextFieldInput[data-focused] {
- outline-color: var(--canon-border-pressed);
- outline-width: 0;
-}
-
-.canon-TextFieldInput[data-hovered] {
- border-color: var(--canon-border-hover);
-}
-
-.canon-TextFieldInput[data-focused] {
- border-color: var(--canon-border-pressed);
- outline-width: 0;
-}
-
-.canon-TextFieldInput[data-invalid] {
- border-color: var(--canon-fg-danger);
-}
-
-.canon-TextFieldInput[data-disabled] {
- opacity: .5;
- cursor: not-allowed;
- border: 1px solid var(--canon-border-disabled);
-}
-
-.canon-TextFieldError {
- color: var(--canon-fg-danger);
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- margin-top: var(--canon-space-2);
-}
diff --git a/packages/canon/css/tooltip.css b/packages/canon/css/tooltip.css
deleted file mode 100644
index 05f2bab79f..0000000000
--- a/packages/canon/css/tooltip.css
+++ /dev/null
@@ -1,61 +0,0 @@
-.canon-TooltipPopup {
- box-sizing: border-box;
- transform-origin: var(--transform-origin);
- background-color: canvas;
- background-color: var(--canon-bg-surface-1);
- color: var(--canon-fg-primary);
- outline: 1px solid var(--canon-border);
- box-shadow: 0 10px 15px -3px var(--canon-border), 0 4px 6px -4px var(--canon-border);
- border-radius: .375rem;
- flex-direction: column;
- padding: .25rem .5rem;
- font-size: .875rem;
- line-height: 1.25rem;
- transition: transform .15s, opacity .15s;
- display: flex;
-
- &[data-starting-style], &[data-ending-style] {
- opacity: 0;
- transform: scale(.9);
- }
-
- &[data-instant] {
- transition-duration: 0s;
- }
-}
-
-.canon-TooltipArrow {
- display: flex;
-
- &[data-side="top"] {
- bottom: -8px;
- rotate: 180deg;
- }
-
- &[data-side="bottom"] {
- top: -8px;
- rotate: none;
- }
-
- &[data-side="left"] {
- right: -13px;
- rotate: 90deg;
- }
-
- &[data-side="right"] {
- left: -13px;
- rotate: -90deg;
- }
-}
-
-.canon-TooltipArrow-fill {
- fill: var(--canon-bg-surface-1);
-}
-
-.canon-TooltipArrow-outer-stroke {
- @media (prefers-color-scheme: light) {
- & {
- fill: var(--canon-border);
- }
- }
-}
diff --git a/packages/canon/report.api.md b/packages/canon/report.api.md
index e382eb1cc7..749b639005 100644
--- a/packages/canon/report.api.md
+++ b/packages/canon/report.api.md
@@ -20,6 +20,8 @@ import { HTMLAttributes } from 'react';
import { JSX as JSX_2 } from 'react/jsx-runtime';
import { LinkProps as LinkProps_2 } from 'react-aria-components';
import { Menu as Menu_2 } from '@base-ui-components/react/menu';
+import type { RadioGroupProps as RadioGroupProps_2 } from 'react-aria-components';
+import type { RadioProps as RadioProps_2 } from 'react-aria-components';
import { ReactElement } from 'react';
import { ReactNode } from 'react';
import { RefAttributes } from 'react';
@@ -1285,6 +1287,27 @@ export type PositionProps = GetPropDefTypes;
// @public (undocumented)
export type PropDef = RegularPropDef | ResponsivePropDef;
+// @public (undocumented)
+export const Radio: ForwardRefExoticComponent<
+ RadioProps & RefAttributes
+>;
+
+// @public (undocumented)
+export const RadioGroup: ForwardRefExoticComponent<
+ RadioGroupProps & RefAttributes
+>;
+
+// @public (undocumented)
+export interface RadioGroupProps
+ extends Omit,
+ Omit {
+ // (undocumented)
+ children?: ReactNode;
+}
+
+// @public (undocumented)
+export interface RadioProps extends RadioProps_2 {}
+
// @public (undocumented)
export type ReactNodePropDef = {
type: 'ReactNode';
@@ -1552,6 +1575,7 @@ export interface TextFieldProps
extends TextFieldProps_2,
Omit {
icon?: ReactNode;
+ placeholder?: string;
size?: 'small' | 'medium' | Partial>;
}
diff --git a/packages/canon/scripts/build-css.mjs b/packages/canon/scripts/build-css.mjs
index e76f5138ba..245b3cf282 100644
--- a/packages/canon/scripts/build-css.mjs
+++ b/packages/canon/scripts/build-css.mjs
@@ -17,89 +17,55 @@
/* eslint-disable no-restricted-imports */
import { transform, bundle } from 'lightningcss';
import fs from 'fs';
-import path from 'path';
import chalk from 'chalk';
-import { glob } from 'glob';
/* eslint-enable no-restricted-imports */
-// Check if core.css and components.css exist
-const cssDir = 'src/css';
+const srcFile = 'src/css/styles.css';
const distDir = 'css';
-const componentsDir = 'src/components';
+const distFile = `${distDir}/styles.css`;
-// Core files
-const cssFiles = [
- { path: `${cssDir}/core.css`, newName: 'core.css' },
- { path: `${cssDir}/components.css`, newName: 'components.css' },
- { path: `${cssDir}/styles.css`, newName: 'styles.css' },
-];
-
-// Components files
-const componentsFiles = glob
- .sync('**/*.css', { cwd: componentsDir })
- .map(file => {
- const folderName = file.split('/')[0].toLocaleLowerCase('en-US');
- return { path: `${componentsDir}/${file}`, newName: `${folderName}.css` };
- });
-
-// Combine core and components files
-cssFiles.push(...componentsFiles);
-
-// Check if files exist
-cssFiles.forEach(file => {
- if (!fs.existsSync(file.path)) {
- console.error(`${file.originalName} does not exist`);
- process.exit(1);
- }
-});
+// Check if styles.css exists
+if (!fs.existsSync(srcFile)) {
+ console.error(`${srcFile} does not exist`);
+ process.exit(1);
+}
// Ensure the dist/css directory exists
if (!fs.existsSync(distDir)) {
fs.mkdirSync(distDir, { recursive: true });
}
-// Add watch mode support
const args = process.argv.slice(2);
const watchMode = args.includes('--watch');
async function buildCSS(logs = true) {
- // Bundle and transform files
- cssFiles.forEach(file => {
- let { code: bundleCode } = bundle({
- filename: file.path,
- });
+ const css = fs.readFileSync(srcFile);
- let { code } = transform({
- filename: `${distDir}/${file.newName}`,
- code: bundleCode,
- });
-
- fs.writeFileSync(`${distDir}/${file.newName}`, code);
-
- if (logs) {
- console.log(chalk.blue('CSS bundled: ') + file.newName);
- }
+ let { code: bundleCode } = bundle({
+ filename: srcFile,
});
+ const { code } = transform({
+ filename: distFile,
+ code: bundleCode,
+ minify: false,
+ });
+ fs.writeFileSync(distFile, code);
if (logs) {
- console.log(chalk.green('CSS files bundled successfully!'));
+ console.log(chalk.blue('CSS transformed and minified: ') + 'styles.css');
+ console.log(chalk.green('CSS file built successfully!'));
}
}
if (watchMode) {
- // Watch both directories for changes
- [cssDir, componentsDir].forEach(dir => {
- fs.watch(dir, { recursive: true }, (eventType, filename) => {
- if (filename?.endsWith('.css')) {
- console.log(
- chalk.yellow(`Changes detected in ${filename}, rebuilding...`),
- );
- buildCSS(false).catch(console.error);
- }
- });
+ fs.watch('src/css', { recursive: true }, (eventType, filename) => {
+ if (filename === 'styles.css') {
+ console.log(
+ chalk.yellow(`Changes detected in ${filename}, rebuilding...`),
+ );
+ buildCSS(false).catch(console.error);
+ }
});
-
- // Initial build
buildCSS().catch(console.error);
console.log(chalk.yellow('Watching for CSS changes...'));
} else {
diff --git a/packages/canon/src/components/FieldError/FieldError.stories.tsx b/packages/canon/src/components/FieldError/FieldError.stories.tsx
new file mode 100644
index 0000000000..39714d16d2
--- /dev/null
+++ b/packages/canon/src/components/FieldError/FieldError.stories.tsx
@@ -0,0 +1,87 @@
+/*
+ * Copyright 2024 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Meta, StoryObj } from '@storybook/react';
+import { TextField, Input, Form } from 'react-aria-components';
+import { FieldError } from './FieldError';
+
+const meta = {
+ title: 'Forms/FieldError',
+ component: FieldError,
+} satisfies Meta;
+
+export default meta;
+type Story = StoryObj;
+
+// Show error with server validation using Form component
+export const WithServerValidation: Story = {
+ render: () => (
+
+ ),
+};
+
+// Show error using children
+export const WithCustomMessage: Story = {
+ render: () => (
+
+
+ This is a custom error message.
+
+ ),
+};
+
+// Show error with render prop function
+export const WithRenderProp: Story = {
+ render: () => (
+ 'This field is invalid'}
+ style={{
+ display: 'flex',
+ flexDirection: 'column',
+ alignItems: 'flex-start',
+ }}
+ >
+
+
+ {({ validationErrors }) =>
+ validationErrors.length > 0 ? validationErrors[0] : 'Field is invalid'
+ }
+
+
+ ),
+};
diff --git a/packages/canon/src/components/FieldError/FieldError.styles.css b/packages/canon/src/components/FieldError/FieldError.styles.css
new file mode 100644
index 0000000000..816eb3c35e
--- /dev/null
+++ b/packages/canon/src/components/FieldError/FieldError.styles.css
@@ -0,0 +1,6 @@
+.canon-FieldError {
+ color: var(--canon-fg-danger);
+ font-size: var(--canon-font-size-2);
+ font-weight: var(--canon-font-weight-regular);
+ margin-top: var(--canon-space-2);
+}
diff --git a/packages/canon/src/components/FieldError/FieldError.tsx b/packages/canon/src/components/FieldError/FieldError.tsx
new file mode 100644
index 0000000000..b90d7b3bd3
--- /dev/null
+++ b/packages/canon/src/components/FieldError/FieldError.tsx
@@ -0,0 +1,39 @@
+/*
+ * Copyright 2025 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { forwardRef } from 'react';
+import {
+ FieldError as AriaFieldError,
+ type FieldErrorProps,
+} from 'react-aria-components';
+import clsx from 'clsx';
+
+/** @public */
+export const FieldError = forwardRef(
+ (props: FieldErrorProps, ref) => {
+ const { className, ...rest } = props;
+
+ return (
+
+ );
+ },
+);
+
+FieldError.displayName = 'FieldError';
diff --git a/packages/canon/src/components/FieldError/index.ts b/packages/canon/src/components/FieldError/index.ts
new file mode 100644
index 0000000000..5b61f83ace
--- /dev/null
+++ b/packages/canon/src/components/FieldError/index.ts
@@ -0,0 +1,17 @@
+/*
+ * Copyright 2024 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './FieldError';
diff --git a/packages/canon/src/components/RadioGroup/RadioGroup.stories.tsx b/packages/canon/src/components/RadioGroup/RadioGroup.stories.tsx
new file mode 100644
index 0000000000..4f28e04bfc
--- /dev/null
+++ b/packages/canon/src/components/RadioGroup/RadioGroup.stories.tsx
@@ -0,0 +1,147 @@
+/*
+ * Copyright 2024 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { Meta, StoryObj } from '@storybook/react';
+import { RadioGroup, Radio } from './RadioGroup';
+
+const meta = {
+ title: 'Forms/RadioGroup',
+ component: RadioGroup,
+} satisfies Meta;
+
+export default meta;
+type Story = StoryObj;
+
+export const Default: Story = {
+ args: {
+ label: 'What is your favorite pokemon?',
+ },
+ render: args => (
+
+ Bulbasaur
+ Charmander
+ Squirtle
+
+ ),
+};
+
+export const Horizontal: Story = {
+ args: {
+ ...Default.args,
+ orientation: 'horizontal',
+ },
+ render: args => (
+
+ Bulbasaur
+ Charmander
+ Squirtle
+
+ ),
+};
+
+export const Disabled: Story = {
+ args: {
+ ...Default.args,
+ isDisabled: true,
+ },
+ render: args => (
+
+ Bulbasaur
+ Charmander
+ Squirtle
+
+ ),
+};
+
+export const DisabledSingle: Story = {
+ args: {
+ ...Default.args,
+ },
+ render: args => (
+
+ Bulbasaur
+
+ Charmander
+
+ Squirtle
+
+ ),
+};
+
+export const DisabledAndSelected: Story = {
+ args: {
+ ...Default.args,
+ value: 'charmander',
+ },
+ render: args => (
+
+ Bulbasaur
+
+ Charmander
+
+ Squirtle
+
+ ),
+};
+
+export const Invalid: Story = {
+ args: {
+ ...Default.args,
+ name: 'pokemon',
+ isInvalid: true,
+ },
+ render: args => (
+
+ Bulbasaur
+
+ Charmander
+
+ Squirtle
+
+ ),
+};
+
+export const Validation: Story = {
+ args: {
+ ...Default.args,
+ name: 'pokemon',
+ defaultValue: 'charmander',
+ validationBehavior: 'aria',
+ validate: value => (value === 'charmander' ? 'Nice try!' : null),
+ },
+ render: args => (
+
+ Bulbasaur
+ Charmander
+ Squirtle
+
+ ),
+};
+
+export const ReadOnly: Story = {
+ args: {
+ ...Default.args,
+ isReadOnly: true,
+ defaultValue: 'charmander',
+ },
+ render: args => (
+
+ Bulbasaur
+ Charmander
+ Squirtle
+
+ ),
+};
diff --git a/packages/canon/src/components/RadioGroup/RadioGroup.styles.css b/packages/canon/src/components/RadioGroup/RadioGroup.styles.css
new file mode 100644
index 0000000000..a712f9031f
--- /dev/null
+++ b/packages/canon/src/components/RadioGroup/RadioGroup.styles.css
@@ -0,0 +1,95 @@
+.canon-RadioGroup {
+ display: flex;
+ flex-direction: column;
+ color: var(--canon-fg-primary);
+}
+
+.canon-RadioGroup[data-orientation='horizontal'] .canon-RadioGroupContent {
+ flex-direction: row;
+ gap: var(--canon-space-4);
+}
+
+.canon-RadioGroupContent {
+ display: flex;
+ flex-direction: column;
+ gap: var(--canon-space-2);
+}
+
+.canon-Radio {
+ display: flex;
+ /* This is needed so the HiddenInput is positioned correctly */
+ position: relative;
+ align-items: center;
+ gap: var(--canon-space-2);
+ font-size: var(--canon-font-size-2);
+ color: var(--canon-fg-primary);
+ forced-color-adjust: none;
+
+ &:before {
+ content: '';
+ display: block;
+ width: 1rem;
+ height: 1rem;
+ box-sizing: border-box;
+ border: 0.125rem solid var(--canon-border);
+ background: var(--canon-gray-1);
+ border-radius: var(--canon-radius-full);
+ transition: all 200ms;
+ }
+
+ &[data-pressed]:before {
+ border-color: var(--canon-border);
+ }
+
+ &[data-selected] {
+ &:before {
+ border-color: var(--canon-bg-solid);
+ border-width: 0.25rem;
+ }
+
+ &[data-pressed]:before {
+ border-color: var(--canon-bg-solid);
+ }
+ }
+
+ &[data-focus-visible]:before {
+ outline: 2px solid var(--canon-ring);
+ outline-offset: 2px;
+ }
+
+ &[data-disabled] {
+ cursor: not-allowed;
+ color: var(--canon-fg-disabled);
+
+ &:before {
+ border-color: var(--canon-border-disabled);
+ background: var(--canon-bg-disabled);
+ }
+
+ &[data-selected]:before {
+ border-color: var(--canon-border-disabled);
+ }
+ }
+
+ &[data-invalid]:before {
+ border-color: var(--canon-border-danger);
+ }
+
+ &[data-invalid][data-selected]:before {
+ border-color: var(--canon-border-danger);
+ }
+
+ /* Ensure disabled state prevails over invalid state */
+ &[data-disabled][data-invalid] {
+ color: var(--canon-fg-disabled);
+
+ &:before {
+ border-color: var(--canon-border-disabled);
+ background: var(--canon-bg-disabled);
+ }
+
+ &[data-selected]:before {
+ border-color: var(--canon-border-disabled);
+ }
+ }
+}
diff --git a/packages/canon/src/components/RadioGroup/RadioGroup.tsx b/packages/canon/src/components/RadioGroup/RadioGroup.tsx
new file mode 100644
index 0000000000..d1d7451a92
--- /dev/null
+++ b/packages/canon/src/components/RadioGroup/RadioGroup.tsx
@@ -0,0 +1,86 @@
+/*
+ * Copyright 2024 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { forwardRef, useEffect } from 'react';
+import {
+ RadioGroup as AriaRadioGroup,
+ Radio as AriaRadio,
+} from 'react-aria-components';
+import clsx from 'clsx';
+import { FieldLabel } from '../FieldLabel';
+import { FieldError } from '../FieldError';
+
+import type { RadioGroupProps, RadioProps } from './types';
+
+/** @public */
+export const RadioGroup = forwardRef(
+ (props, ref) => {
+ const {
+ className,
+ label,
+ secondaryLabel,
+ description,
+ isRequired,
+ 'aria-label': ariaLabel,
+ 'aria-labelledby': ariaLabelledBy,
+ children,
+ ...rest
+ } = props;
+
+ useEffect(() => {
+ if (!label && !ariaLabel && !ariaLabelledBy) {
+ console.warn(
+ 'RadioGroup requires either a visible label, aria-label, or aria-labelledby for accessibility',
+ );
+ }
+ }, [label, ariaLabel, ariaLabelledBy]);
+
+ // If a secondary label is provided, use it. Otherwise, use 'Required' if the field is required.
+ const secondaryLabelText =
+ secondaryLabel || (isRequired ? 'Required' : null);
+
+ return (
+
+
+ {children}
+
+
+ );
+ },
+);
+
+RadioGroup.displayName = 'RadioGroup';
+
+/** @public */
+export const Radio = forwardRef((props, ref) => {
+ const { className, ...rest } = props;
+
+ return (
+
+ );
+});
+
+RadioGroup.displayName = 'RadioGroup';
diff --git a/packages/canon/src/components/RadioGroup/index.ts b/packages/canon/src/components/RadioGroup/index.ts
new file mode 100644
index 0000000000..fd9572f667
--- /dev/null
+++ b/packages/canon/src/components/RadioGroup/index.ts
@@ -0,0 +1,18 @@
+/*
+ * Copyright 2024 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export * from './RadioGroup';
+export * from './types';
diff --git a/packages/canon/src/components/RadioGroup/types.ts b/packages/canon/src/components/RadioGroup/types.ts
new file mode 100644
index 0000000000..029ef4baf9
--- /dev/null
+++ b/packages/canon/src/components/RadioGroup/types.ts
@@ -0,0 +1,32 @@
+/*
+ * Copyright 2025 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type {
+ RadioGroupProps as AriaRadioGroupProps,
+ RadioProps as AriaRadioProps,
+} from 'react-aria-components';
+import type { FieldLabelProps } from '../FieldLabel/types';
+import { ReactNode } from 'react';
+
+/** @public */
+export interface RadioGroupProps
+ extends Omit,
+ Omit {
+ children?: ReactNode;
+}
+
+/** @public */
+export interface RadioProps extends AriaRadioProps {}
diff --git a/packages/canon/src/components/TextField/TextField.stories.tsx b/packages/canon/src/components/TextField/TextField.stories.tsx
index e07aa6ea05..157590ae11 100644
--- a/packages/canon/src/components/TextField/TextField.stories.tsx
+++ b/packages/canon/src/components/TextField/TextField.stories.tsx
@@ -40,7 +40,7 @@ type Story = StoryObj;
export const Default: Story = {
args: {
name: 'url',
- defaultValue: 'Enter a URL',
+ placeholder: 'Enter a URL',
style: {
maxWidth: '300px',
},
@@ -97,7 +97,7 @@ export const Disabled: Story = {
export const WithIcon: Story = {
args: {
...Default.args,
- defaultValue: 'Search...',
+ placeholder: 'Search...',
icon: ,
},
};
diff --git a/packages/canon/src/components/TextField/TextField.styles.css b/packages/canon/src/components/TextField/TextField.styles.css
index 9f2039b3af..c0432d88aa 100644
--- a/packages/canon/src/components/TextField/TextField.styles.css
+++ b/packages/canon/src/components/TextField/TextField.styles.css
@@ -104,10 +104,3 @@
cursor: not-allowed;
border: 1px solid var(--canon-border-disabled);
}
-
-.canon-TextFieldError {
- color: var(--canon-fg-danger);
- font-size: var(--canon-font-size-2);
- font-weight: var(--canon-font-weight-regular);
- margin-top: var(--canon-space-2);
-}
diff --git a/packages/canon/src/components/TextField/TextField.tsx b/packages/canon/src/components/TextField/TextField.tsx
index 444e76e983..8c8471b0ef 100644
--- a/packages/canon/src/components/TextField/TextField.tsx
+++ b/packages/canon/src/components/TextField/TextField.tsx
@@ -15,14 +15,11 @@
*/
import { forwardRef, useEffect } from 'react';
-import {
- Input,
- TextField as AriaTextField,
- FieldError,
-} from 'react-aria-components';
+import { Input, TextField as AriaTextField } from 'react-aria-components';
import { useResponsiveValue } from '../../hooks/useResponsiveValue';
import clsx from 'clsx';
import { FieldLabel } from '../FieldLabel';
+import { FieldError } from '../FieldError';
import type { TextFieldProps } from './types';
@@ -39,6 +36,7 @@ export const TextField = forwardRef(
isRequired,
'aria-label': ariaLabel,
'aria-labelledby': ariaLabelledBy,
+ placeholder,
...rest
} = props;
@@ -84,9 +82,10 @@ export const TextField = forwardRef(
-
+
);
},
diff --git a/packages/canon/src/components/TextField/types.ts b/packages/canon/src/components/TextField/types.ts
index 92fa077389..75a5c68aaa 100644
--- a/packages/canon/src/components/TextField/types.ts
+++ b/packages/canon/src/components/TextField/types.ts
@@ -33,4 +33,9 @@ export interface TextFieldProps
* @defaultValue 'medium'
*/
size?: 'small' | 'medium' | Partial>;
+
+ /**
+ * Text to display in the input when it has no value
+ */
+ placeholder?: string;
}
diff --git a/packages/canon/src/css/components.css b/packages/canon/src/css/components.css
index aa453f7314..407723fcc9 100644
--- a/packages/canon/src/css/components.css
+++ b/packages/canon/src/css/components.css
@@ -23,6 +23,7 @@
@import '../components/Container/styles.css';
@import '../components/DataTable/Root/DataTableRoot.styles.css';
@import '../components/DataTable/Pagination/DataTablePagination.styles.css';
+@import '../components/FieldError/FieldError.styles.css';
@import '../components/FieldLabel/FieldLabel.styles.css';
@import '../components/Flex/styles.css';
@import '../components/Grid/styles.css';
@@ -30,6 +31,7 @@
@import '../components/Icon/styles.css';
@import '../components/Link/styles.css';
@import '../components/Menu/Menu.styles.css';
+@import '../components/RadioGroup/RadioGroup.styles.css';
@import '../components/Table/styles.css';
@import '../components/Table/TableCell/TableCell.styles.css';
@import '../components/Table/TableCellText/TableCellText.styles.css';
diff --git a/packages/canon/src/index.ts b/packages/canon/src/index.ts
index 4da616638c..3ad2181d6f 100644
--- a/packages/canon/src/index.ts
+++ b/packages/canon/src/index.ts
@@ -41,6 +41,7 @@ export * from './components/Icon';
export * from './components/ButtonIcon';
export * from './components/ButtonLink';
export * from './components/Checkbox';
+export * from './components/RadioGroup';
export * from './components/Table';
export * from './components/Tabs';
export * from './components/TextField';
diff --git a/packages/integration-react/src/api/ScmAuth.ts b/packages/integration-react/src/api/ScmAuth.ts
index 011422d4cf..823937ac28 100644
--- a/packages/integration-react/src/api/ScmAuth.ts
+++ b/packages/integration-react/src/api/ScmAuth.ts
@@ -173,7 +173,7 @@ export class ScmAuth implements ScmAuthApi {
const host = options?.host ?? 'gitlab.com';
return new ScmAuth('gitlab', gitlabAuthApi, host, {
default: ['read_user', 'read_api', 'read_repository'],
- repoWrite: ['write_repository api'],
+ repoWrite: ['write_repository', 'api'],
});
}
diff --git a/plugins/scaffolder-backend/.eslintrc.js b/plugins/scaffolder-backend/.eslintrc.js
index 953af54f90..3c5416068f 100644
--- a/plugins/scaffolder-backend/.eslintrc.js
+++ b/plugins/scaffolder-backend/.eslintrc.js
@@ -5,13 +5,13 @@ module.exports = require('@backstage/cli/config/eslint-factory')(__dirname, {
name: 'path',
importNames: ['resolve'],
message:
- 'Do not use path.resolve, use `resolveSafeChildPath` from `@backstage/backend-common` instead as it prevents security issues',
+ 'Do not use path.resolve, use `resolveSafeChildPath` from `@backstage/backend-plugin-api` instead as it prevents security issues',
},
],
restrictedSrcSyntax: [
{
message:
- 'Do not use path.resolve, use `resolveSafeChildPath` from `@backstage/backend-common` instead as it prevents security issues',
+ 'Do not use path.resolve, use `resolveSafeChildPath` from `@backstage/backend-plugin-api` instead as it prevents security issues',
selector: 'MemberExpression[object.name="path"][property.name="resolve"]',
},
],
diff --git a/plugins/scaffolder-backend/package.json b/plugins/scaffolder-backend/package.json
index d3fb0fa81b..91e669c4f5 100644
--- a/plugins/scaffolder-backend/package.json
+++ b/plugins/scaffolder-backend/package.json
@@ -61,7 +61,6 @@
"test": "backstage-cli package test"
},
"dependencies": {
- "@backstage/backend-common": "^0.25.0",
"@backstage/backend-defaults": "workspace:^",
"@backstage/backend-plugin-api": "workspace:^",
"@backstage/catalog-model": "workspace:^",
diff --git a/plugins/scaffolder-backend/src/scaffolder/tasks/DatabaseTaskStore.test.ts b/plugins/scaffolder-backend/src/scaffolder/tasks/DatabaseTaskStore.test.ts
index eb0418b5ed..f95381e0ed 100644
--- a/plugins/scaffolder-backend/src/scaffolder/tasks/DatabaseTaskStore.test.ts
+++ b/plugins/scaffolder-backend/src/scaffolder/tasks/DatabaseTaskStore.test.ts
@@ -14,12 +14,15 @@
* limitations under the License.
*/
-import { DatabaseManager } from '@backstage/backend-common';
+import { DatabaseManager } from '@backstage/backend-defaults/database';
import { ConfigReader } from '@backstage/config';
import { DatabaseTaskStore, RawDbTaskEventRow } from './DatabaseTaskStore';
import { TaskSpec } from '@backstage/plugin-scaffolder-common';
import { ConflictError } from '@backstage/errors';
-import { createMockDirectory } from '@backstage/backend-test-utils';
+import {
+ mockServices,
+ createMockDirectory,
+} from '@backstage/backend-test-utils';
import fs from 'fs-extra';
import { EventsService } from '@backstage/plugin-events-node';
@@ -33,7 +36,10 @@ const createStore = async (events?: EventsService) => {
},
},
}),
- ).forPlugin('scaffolder');
+ ).forPlugin('scaffolder', {
+ logger: mockServices.logger.mock(),
+ lifecycle: mockServices.lifecycle.mock(),
+ });
const store = await DatabaseTaskStore.create({
database: manager,
events,
diff --git a/plugins/scaffolder-backend/src/scaffolder/tasks/StorageTaskBroker.test.ts b/plugins/scaffolder-backend/src/scaffolder/tasks/StorageTaskBroker.test.ts
index dc89100b95..2b13130908 100644
--- a/plugins/scaffolder-backend/src/scaffolder/tasks/StorageTaskBroker.test.ts
+++ b/plugins/scaffolder-backend/src/scaffolder/tasks/StorageTaskBroker.test.ts
@@ -14,7 +14,7 @@
* limitations under the License.
*/
-import { DatabaseManager } from '@backstage/backend-common';
+import { DatabaseManager } from '@backstage/backend-defaults/database';
import { ConfigReader } from '@backstage/config';
import { TaskSpec } from '@backstage/plugin-scaffolder-common';
import {
@@ -36,7 +36,10 @@ async function createStore(): Promise {
},
},
}),
- ).forPlugin('scaffolder');
+ ).forPlugin('scaffolder', {
+ logger: mockServices.logger.mock(),
+ lifecycle: mockServices.lifecycle.mock(),
+ });
return await DatabaseTaskStore.create({
database: manager,
diff --git a/plugins/scaffolder-backend/src/scaffolder/tasks/TaskWorker.test.ts b/plugins/scaffolder-backend/src/scaffolder/tasks/TaskWorker.test.ts
index dd9233a5ee..6fedc4df40 100644
--- a/plugins/scaffolder-backend/src/scaffolder/tasks/TaskWorker.test.ts
+++ b/plugins/scaffolder-backend/src/scaffolder/tasks/TaskWorker.test.ts
@@ -15,7 +15,7 @@
*/
import os from 'os';
-import { DatabaseManager } from '@backstage/backend-common';
+import { DatabaseManager } from '@backstage/backend-defaults/database';
import { ConfigReader } from '@backstage/config';
import { DatabaseTaskStore } from './DatabaseTaskStore';
import { StorageTaskBroker } from './StorageTaskBroker';
@@ -49,7 +49,10 @@ async function createStore(): Promise {
},
},
}),
- ).forPlugin('scaffolder');
+ ).forPlugin('scaffolder', {
+ logger: mockServices.logger.mock(),
+ lifecycle: mockServices.lifecycle.mock(),
+ });
return await DatabaseTaskStore.create({
database: manager,
});
diff --git a/plugins/scaffolder-backend/src/service/router.test.ts b/plugins/scaffolder-backend/src/service/router.test.ts
index 679ac44640..2820c8b8dc 100644
--- a/plugins/scaffolder-backend/src/service/router.test.ts
+++ b/plugins/scaffolder-backend/src/service/router.test.ts
@@ -14,7 +14,7 @@
* limitations under the License.
*/
-import { DatabaseManager } from '@backstage/backend-common';
+import { DatabaseManager } from '@backstage/backend-defaults/database';
import { ConfigReader } from '@backstage/config';
import request from 'supertest';
import ObservableImpl from 'zen-observable';
@@ -77,7 +77,10 @@ function createDatabase(): DatabaseService {
},
},
}),
- ).forPlugin('scaffolder');
+ ).forPlugin('scaffolder', {
+ logger: mockServices.logger.mock(),
+ lifecycle: mockServices.lifecycle.mock(),
+ });
}
const config = new ConfigReader({});
diff --git a/yarn.lock b/yarn.lock
index da694cf51f..c162b71503 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7499,7 +7499,6 @@ __metadata:
resolution: "@backstage/plugin-scaffolder-backend@workspace:plugins/scaffolder-backend"
dependencies:
"@backstage/backend-app-api": "workspace:^"
- "@backstage/backend-common": "npm:^0.25.0"
"@backstage/backend-defaults": "workspace:^"
"@backstage/backend-plugin-api": "workspace:^"
"@backstage/backend-test-utils": "workspace:^"
@@ -8757,9 +8756,9 @@ __metadata:
languageName: node
linkType: hard
-"@changesets/assemble-release-plan@npm:^6.0.8":
- version: 6.0.8
- resolution: "@changesets/assemble-release-plan@npm:6.0.8"
+"@changesets/assemble-release-plan@npm:^6.0.9":
+ version: 6.0.9
+ resolution: "@changesets/assemble-release-plan@npm:6.0.9"
dependencies:
"@changesets/errors": "npm:^0.2.0"
"@changesets/get-dependents-graph": "npm:^2.1.3"
@@ -8767,7 +8766,7 @@ __metadata:
"@changesets/types": "npm:^6.1.0"
"@manypkg/get-packages": "npm:^1.1.3"
semver: "npm:^7.5.3"
- checksum: 10/5d01fc42c67229874cc70b93fbdc971e11909aa7a72f1909c585ecb3fdc69f3ac105d243e1341cd5b07c02dee133be461fa48138125f00d137e71f8b7e8f428e
+ checksum: 10/f84656eabb700ed77f97751b282e1701636ed45a44b443abd9af0291870495cc046fee301478010f39a1dc455799065ae007b9d7d2bb5ae8b793b65bbb8e052a
languageName: node
linkType: hard
@@ -8781,16 +8780,16 @@ __metadata:
linkType: hard
"@changesets/cli@npm:^2.14.0":
- version: 2.29.4
- resolution: "@changesets/cli@npm:2.29.4"
+ version: 2.29.5
+ resolution: "@changesets/cli@npm:2.29.5"
dependencies:
"@changesets/apply-release-plan": "npm:^7.0.12"
- "@changesets/assemble-release-plan": "npm:^6.0.8"
+ "@changesets/assemble-release-plan": "npm:^6.0.9"
"@changesets/changelog-git": "npm:^0.2.1"
"@changesets/config": "npm:^3.1.1"
"@changesets/errors": "npm:^0.2.0"
"@changesets/get-dependents-graph": "npm:^2.1.3"
- "@changesets/get-release-plan": "npm:^4.0.12"
+ "@changesets/get-release-plan": "npm:^4.0.13"
"@changesets/git": "npm:^3.0.4"
"@changesets/logger": "npm:^0.1.1"
"@changesets/pre": "npm:^2.0.2"
@@ -8814,7 +8813,7 @@ __metadata:
term-size: "npm:^2.1.0"
bin:
changeset: bin.js
- checksum: 10/fc325447b81a811464107e72a687f6c0414c5f928e518cb122d1efde1d71c205b1972464795ab97fb26087900ea55b99a551e9a010c9681def3d7561fd1c3f0b
+ checksum: 10/f401da29025d7bcc07b732bb09a9627f785bfc21c7c2005861d11ffea732bc14d33394fc2fcae50cc5f2b710f6080c5babe2fa90d432de5fdb47ae6afc147936
languageName: node
linkType: hard
@@ -8854,17 +8853,17 @@ __metadata:
languageName: node
linkType: hard
-"@changesets/get-release-plan@npm:^4.0.12":
- version: 4.0.12
- resolution: "@changesets/get-release-plan@npm:4.0.12"
+"@changesets/get-release-plan@npm:^4.0.13":
+ version: 4.0.13
+ resolution: "@changesets/get-release-plan@npm:4.0.13"
dependencies:
- "@changesets/assemble-release-plan": "npm:^6.0.8"
+ "@changesets/assemble-release-plan": "npm:^6.0.9"
"@changesets/config": "npm:^3.1.1"
"@changesets/pre": "npm:^2.0.2"
"@changesets/read": "npm:^0.6.5"
"@changesets/types": "npm:^6.1.0"
"@manypkg/get-packages": "npm:^1.1.3"
- checksum: 10/d6482ecb6f1c2c47266493a36d05b484f0950d0a4472820649e953d073e3fdd612cdd8a4df9e3d7e00756d4e446dae639f9d6e0dab8a25f76bb6df77cd91c21c
+ checksum: 10/9983fae5a68012c4c418ddd62f2fb3d325363f21160252ff7b868503a1a2effb8fdd32e4a0289b72653afc3605ce19d163ff69205c942a0004efb571a5f78fd0
languageName: node
linkType: hard
@@ -9105,11 +9104,11 @@ __metadata:
linkType: hard
"@dagrejs/dagre@npm:^1.1.4":
- version: 1.1.4
- resolution: "@dagrejs/dagre@npm:1.1.4"
+ version: 1.1.5
+ resolution: "@dagrejs/dagre@npm:1.1.5"
dependencies:
"@dagrejs/graphlib": "npm:2.2.4"
- checksum: 10/0b3744b170c68ae0666e03aca19c3100d5131feafeb54b3ea096b749a9f0fe5385b8bd8889c11a49493cfab945b2486b9e30bc41b321755ed718e9f5cb4b74f1
+ checksum: 10/c00abd1e04d19f90ad8dfa0a4e16365371bc4309affead3827a1b39f6b0b946643b8af0b1e5519011deca3fda4c7471b27e9ebb03423309a94f95ac0b881ac4f
languageName: node
linkType: hard
@@ -14865,13 +14864,13 @@ __metadata:
linkType: hard
"@playwright/test@npm:^1.32.3":
- version: 1.53.0
- resolution: "@playwright/test@npm:1.53.0"
+ version: 1.53.1
+ resolution: "@playwright/test@npm:1.53.1"
dependencies:
- playwright: "npm:1.53.0"
+ playwright: "npm:1.53.1"
bin:
playwright: cli.js
- checksum: 10/968df4fba133dd18b8c65504c3cc5a3a6071e49f0706c6524711cdfab321a51debfeb506b9ff0a8f7dd8ce3015921d82fa51429d8f11d392cc68de1938703c33
+ checksum: 10/98fb9b962710183d465b695daab2006296fd9a703ecb1b763a38cd12a39f7d6066f9539d1758e54313d393353fafb16b90fb31e4add1ca99ffec99b8b1b40fb9
languageName: node
linkType: hard
@@ -21782,9 +21781,9 @@ __metadata:
linkType: hard
"@types/lodash@npm:^4.14.151":
- version: 4.17.17
- resolution: "@types/lodash@npm:4.17.17"
- checksum: 10/496459a3cb1a0733bb60532de3899ad6297717af0b9b26ad6821154b2005fec86f29ccd47a2e6f4da4a8c7c818bb8ae73901144e8057ea86b7b02a3d7bb9d13f
+ version: 4.17.18
+ resolution: "@types/lodash@npm:4.17.18"
+ checksum: 10/54ebb15b29925112dbe9da3abd99fb80d7202bc5ba20fc1b4fc8ea835d0012f00cbd9a3e7f367b70e7c3f2d5ee635964e3920a489625647b558f02994b3dd381
languageName: node
linkType: hard
@@ -24385,13 +24384,13 @@ __metadata:
languageName: node
linkType: hard
-"GendocuPublicApis@https://git.gendocu.com/gendocu/GendocuPublicApis.git#master":
- version: 1.0.0
- resolution: "GendocuPublicApis@https://git.gendocu.com/gendocu/GendocuPublicApis.git#commit=6e8d4c1d2342556a2e8e719f19385b266001ebae"
+"GendocuPublicApis@npm:gendocu-public-apis@^1.0.0":
+ version: 1.0.3
+ resolution: "gendocu-public-apis@npm:1.0.3"
dependencies:
"@improbable-eng/grpc-web": "npm:^0.14.0"
google-protobuf: "npm:^3.15.8"
- checksum: 10/a34386a6137d92f392121305fb899f63ba1631a1b60c80781f6e56e160c1d462a8ce4b3ee93cb67c73c079b53c6de57ba19f514f29dd11c9783cd0d8227c6968
+ checksum: 10/261a5cc97b599a7dfb492ac048e6bfce3f3bf64627f2b80ef195d5b6cefdbd4668d2b2ccd10676f01eb4f7862a5d19da567dd6ade9fc39a15268e81862308f7c
languageName: node
linkType: hard
@@ -42032,27 +42031,27 @@ __metadata:
languageName: node
linkType: hard
-"playwright-core@npm:1.53.0":
- version: 1.53.0
- resolution: "playwright-core@npm:1.53.0"
+"playwright-core@npm:1.53.1":
+ version: 1.53.1
+ resolution: "playwright-core@npm:1.53.1"
bin:
playwright-core: cli.js
- checksum: 10/881f27a9b7edd9954700489a5a4212cb91bcada226fd1d79a239b2eab0f333df1e2e41e275e6fa846d7f57c6a92afe14dca33ca7a2ce303dfb687d02511b7c69
+ checksum: 10/d0ea8674c3abb76069255ca81bc0dfdef3f9548207f1404eec036bb8724135710f25ee791bfd7c043d5b9c2ccfa42288b0308d61dc5efc60a13b18811a15c4cd
languageName: node
linkType: hard
-"playwright@npm:1.53.0":
- version: 1.53.0
- resolution: "playwright@npm:1.53.0"
+"playwright@npm:1.53.1":
+ version: 1.53.1
+ resolution: "playwright@npm:1.53.1"
dependencies:
fsevents: "npm:2.3.2"
- playwright-core: "npm:1.53.0"
+ playwright-core: "npm:1.53.1"
dependenciesMeta:
fsevents:
optional: true
bin:
playwright: cli.js
- checksum: 10/0b0258630f39b4d6ff1555d008ee4d591fe45cbe1e0f643a612397e3e6b1f7a99a2037a957eaa7351edd907ba10966ba105b2d244eafd1b247378910b660f086
+ checksum: 10/74b3178d5ae3fde8de08fe6c221578530368f1abb8794fce234d06e0043178201eb3b7410354418517f23c105bd54ac1432da5f46c50353a5e6a80198a95f2cf
languageName: node
linkType: hard