diff --git a/.gitignore b/.gitignore
index d7b039c..65f6bf0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -174,3 +174,6 @@ $RECYCLE.BIN/
 
 # Windows shortcuts
 *.lnk
+
+# CSS
+/src/css/
diff --git a/netlify.toml b/netlify.toml
new file mode 100644
index 0000000..6004c62
--- /dev/null
+++ b/netlify.toml
@@ -0,0 +1,2 @@
+[build]
+    command = "npm run prod"
diff --git a/src/css/main.css b/src/css/main.css
deleted file mode 100644
index 8a9b765..0000000
--- a/src/css/main.css
+++ /dev/null
@@ -1,3894 +0,0 @@
-@font-face {
-  font-display: swap;
-  font-family: "Inter";
-  font-style: normal;
-  font-weight: 400;
-  src: url("../../font/inter-v13-latin-regular.woff2") format("woff2");
-}
-@font-face {
-  font-display: swap;
-  font-family: "Inter";
-  font-style: normal;
-  font-weight: 500;
-  src: url("../../font/inter-v13-latin-500.woff2") format("woff2");
-}
-@font-face {
-  font-display: swap;
-  font-family: "Inter";
-  font-style: normal;
-  font-weight: 700;
-  src: url("../../font/inter-v13-latin-700.woff2") format("woff2");
-}
-@font-face {
-  font-display: swap;
-  font-family: "Figtree";
-  font-style: normal;
-  font-weight: 400;
-  src: url("../../font/figtree-v5-latin-regular.woff2") format("woff2");
-}
-@font-face {
-  font-display: swap;
-  font-family: "Figtree";
-  font-style: normal;
-  font-weight: 500;
-  src: url("../../font/figtree-v5-latin-500.woff2") format("woff2");
-}
-@font-face {
-  font-display: swap;
-  font-family: "Figtree";
-  font-style: normal;
-  font-weight: 700;
-  src: url("../../font/figtree-v5-latin-700.woff2") format("woff2");
-}
-/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
-/* Document
-  ========================================================================== */
-/**
-* 1. Correct the line height in all browsers.
-* 2. Prevent adjustments of font size after orientation changes in iOS.
-*/
-html {
-  line-height: 1.15; /* 1 */
-  -webkit-text-size-adjust: 100%; /* 2 */
-}
-
-/* Sections
-  ========================================================================== */
-/**
-* Remove the margin in all browsers.
-*/
-body {
-  margin: 0;
-}
-
-/**
-* Render the `main` element consistently in IE.
-*/
-main {
-  display: block;
-}
-
-/**
-* Correct the font size and margin on `h1` elements within `section` and
-* `article` contexts in Chrome, Firefox, and Safari.
-*/
-h1 {
-  font-size: 2em;
-  margin: 0.67em 0;
-}
-
-/* Grouping content
-  ========================================================================== */
-/**
-* 1. Add the correct box sizing in Firefox.
-* 2. Show the overflow in Edge and IE.
-*/
-hr {
-  box-sizing: content-box; /* 1 */
-  block-size: 0; /* 1 */
-  overflow: visible; /* 2 */
-}
-
-/**
-* 1. Correct the inheritance and scaling of font size in all browsers.
-* 2. Correct the odd `em` font sizing in all browsers.
-*/
-pre {
-  font-family: monospace, monospace; /* 1 */
-  font-size: 1em; /* 2 */
-}
-
-/* Text-level semantics
-  ========================================================================== */
-/**
-* Remove the gray background on active links in IE 10.
-*/
-a {
-  background-color: transparent;
-}
-
-/**
-* 1. Remove the bottom border in Chrome 57-
-* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
-*/
-abbr[title] {
-  border-bottom: none; /* 1 */
-  text-decoration: underline; /* 2 */
-  text-decoration: underline dotted; /* 2 */
-}
-
-/**
-* Add the correct font weight in Chrome, Edge, and Safari.
-*/
-b,
-strong {
-  font-weight: bolder;
-}
-
-/**
-* 1. Correct the inheritance and scaling of font size in all browsers.
-* 2. Correct the odd `em` font sizing in all browsers.
-*/
-code,
-kbd,
-samp {
-  font-family: monospace, monospace; /* 1 */
-  font-size: 1em; /* 2 */
-}
-
-/**
-* Add the correct font size in all browsers.
-*/
-small {
-  font-size: 80%;
-}
-
-/**
-* Prevent `sub` and `sup` elements from affecting the line height in
-* all browsers.
-*/
-sub,
-sup {
-  font-size: 75%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
-}
-
-sub {
-  bottom: -0.25em;
-}
-
-sup {
-  top: -0.5em;
-}
-
-/* Embedded content
-  ========================================================================== */
-/**
-* Remove the border on images inside links in IE 10.
-*/
-img {
-  border-style: none;
-}
-
-/* Forms
-  ========================================================================== */
-/**
-* 1. Change the font styles in all browsers.
-* 2. Remove the margin in Firefox and Safari.
-*/
-button,
-input,
-optgroup,
-select,
-textarea {
-  font-family: inherit; /* 1 */
-  font-size: 100%; /* 1 */
-  line-height: 1.15; /* 1 */
-  margin: 0; /* 2 */
-}
-
-/**
-* Show the overflow in IE.
-* 1. Show the overflow in Edge.
-*/
-button,
-input { /* 1 */
-  overflow: visible;
-}
-
-/**
-* Remove the inheritance of text transform in Edge, Firefox, and IE.
-* 1. Remove the inheritance of text transform in Firefox.
-*/
-button,
-select { /* 1 */
-  text-transform: none;
-}
-
-/**
-* Correct the inability to style clickable types in iOS and Safari.
-*/
-button,
-[type=button],
-[type=reset],
-[type=submit] {
-  -webkit-appearance: button;
-}
-
-/**
-* Remove the inner border and padding in Firefox.
-*/
-button::-moz-focus-inner,
-[type=button]::-moz-focus-inner,
-[type=reset]::-moz-focus-inner,
-[type=submit]::-moz-focus-inner {
-  border-style: none;
-  padding: 0;
-}
-
-/**
-* Restore the focus styles unset by the previous rule.
-*/
-button:-moz-focusring,
-[type=button]:-moz-focusring,
-[type=reset]:-moz-focusring,
-[type=submit]:-moz-focusring {
-  outline: 1px dotted ButtonText;
-}
-
-/**
-* Correct the padding in Firefox.
-*/
-fieldset {
-  padding: 0.35em 0.75em 0.625em;
-}
-
-/**
-* 1. Correct the text wrapping in Edge and IE.
-* 2. Correct the color inheritance from `fieldset` elements in IE.
-* 3. Remove the padding so developers are not caught out when they zero out
-*    `fieldset` elements in all browsers.
-*/
-legend {
-  box-sizing: border-box; /* 1 */
-  color: inherit; /* 2 */
-  display: table; /* 1 */
-  max-inline-size: 100%; /* 1 */
-  padding: 0; /* 3 */
-  white-space: normal; /* 1 */
-}
-
-/**
-* Add the correct vertical alignment in Chrome, Firefox, and Opera.
-*/
-progress {
-  vertical-align: baseline;
-}
-
-/**
-* Remove the default vertical scrollbar in IE 10+.
-*/
-textarea {
-  overflow: auto;
-}
-
-/**
-* 1. Add the correct box sizing in IE 10.
-* 2. Remove the padding in IE 10.
-*/
-[type=checkbox],
-[type=radio] {
-  box-sizing: border-box; /* 1 */
-  padding: 0; /* 2 */
-}
-
-/**
-* Correct the cursor style of increment and decrement buttons in Chrome.
-*/
-[type=number]::-webkit-inner-spin-button,
-[type=number]::-webkit-outer-spin-button {
-  block-size: auto;
-}
-
-/**
-* 1. Correct the odd appearance in Chrome and Safari.
-* 2. Correct the outline style in Safari.
-*/
-[type=search] {
-  -webkit-appearance: textfield; /* 1 */
-  outline-offset: -2px; /* 2 */
-}
-
-/**
-* Remove the inner padding in Chrome and Safari on macOS.
-*/
-[type=search]::-webkit-search-decoration {
-  -webkit-appearance: none;
-}
-
-/**
-* 1. Correct the inability to style clickable types in iOS and Safari.
-* 2. Change font properties to `inherit` in Safari.
-*/
-::-webkit-file-upload-button {
-  -webkit-appearance: button; /* 1 */
-  font: inherit; /* 2 */
-}
-
-/* Interactive
-  ========================================================================== */
-/*
-* Add the correct display in Edge, IE 10+, and Firefox.
-*/
-details {
-  display: block;
-}
-
-/*
-* Add the correct display in all browsers.
-*/
-summary {
-  display: list-item;
-}
-
-/* Misc
-  ========================================================================== */
-/**
-* Add the correct display in IE 10+.
-*/
-template {
-  display: none;
-}
-
-/**
-* Add the correct display in IE 10.
-*/
-[hidden] {
-  display: none;
-}
-
-:root {
-  --spruce-alert-color-danger: hsl(0, 71%, 51%);
-  --spruce-alert-color-info: hsl(195, 100%, 42%);
-  --spruce-alert-color-success: hsl(150, 100%, 33%);
-  --spruce-alert-color-warning: hsl(48, 89%, 55%);
-}
-
-:root {
-  --spruce-base-color-background: hsl(0, 0%, 100%);
-  --spruce-base-color-blockquote-border: hsl(262, 71%, 49%);
-  --spruce-base-color-border: hsl(215, 63%, 93%);
-  --spruce-base-color-code-background: #f6f2fd;
-  --spruce-base-color-code-foreground: hsl(260, 70%, 6%);
-  --spruce-base-color-heading: hsl(260, 70%, 6%);
-  --spruce-base-color-link: hsl(262, 71%, 49%);
-  --spruce-base-color-link-hover: #511dab;
-  --spruce-base-color-mark-background: hsl(50, 100%, 80%);
-  --spruce-base-color-mark-foreground: hsl(260, 70%, 6%);
-  --spruce-base-color-marker: hsl(262, 71%, 49%);
-  --spruce-base-color-primary: hsl(262, 71%, 49%);
-  --spruce-base-color-secondary: hsl(227, 92%, 55%);
-  --spruce-base-color-strong: hsl(260, 70%, 6%);
-  --spruce-base-color-text: hsl(208, 9%, 42%);
-  --spruce-base-color-code-tab-background: hsl(222, 100%, 98%);
-  --spruce-base-color-primary-dark: hsl(261, 52%, 35%);
-  --spruce-base-color-primary-darkest: hsl(272, 100%, 9%);
-  --spruce-base-color-primary-lightest: hsl(259, 53%, 94%);
-}
-
-:root {
-  --spruce-btn-color-primary-background: hsl(262, 71%, 49%);
-  --spruce-btn-color-primary-background-hover: #511daa;
-  --spruce-btn-color-primary-foreground: hsl(0, 0%, 100%);
-  --spruce-btn-color-primary-shadow: #ceb9f3;
-  --spruce-btn-color-secondary-background: hsl(227, 92%, 55%);
-  --spruce-btn-color-secondary-background-hover: #0937dc;
-  --spruce-btn-color-secondary-foreground: hsl(0, 0%, 100%);
-  --spruce-btn-color-secondary-shadow: #ced8fd;
-  --spruce-btn-color-dark-background: hsl(260, 70%, 6%);
-  --spruce-btn-color-dark-background-hover: hsl(260, 70%, 12%);
-  --spruce-btn-color-dark-foreground: hsl(0, 0%, 100%);
-  --spruce-btn-color-decline-background: hsl(207, 39%, 17%);
-  --spruce-btn-color-decline-foreground: hsl(0, 0%, 100%);
-  --spruce-btn-color-discrete-background: hsla(206, 40%, 17%, 0.1);
-  --spruce-btn-color-discrete-background-hover: hsl(262, 71%, 49%);
-  --spruce-btn-color-discrete-foreground: hsl(0, 0%, 10%);
-  --spruce-btn-color-discrete-foreground-hover: hsl(0, 0%, 100%);
-  --spruce-btn-color-install-background: hsl(0, 0%, 95%);
-  --spruce-btn-color-install-background-hover: hsl(0, 0%, 90%);
-  --spruce-btn-color-install-foreground: hsl(0, 0%, 10%);
-  --spruce-btn-color-pagination-background: hsl(263, 40%, 96%);
-  --spruce-btn-color-pagination-background-hover: hsl(262, 71%, 49%);
-  --spruce-btn-color-pagination-focus-ring: hsl(262, 71%, 49%);
-  --spruce-btn-color-pagination-foreground: hsl(262, 71%, 49%);
-  --spruce-btn-color-pagination-foreground-hover: hsl(0, 0%, 100%);
-}
-
-:root {
-  --spruce-form-color-background: hsl(0, 0%, 100%);
-  --spruce-form-color-background-disabled: hsl(0, 0%, 95%);
-  --spruce-form-color-border: hsl(260, 4%, 70%);
-  --spruce-form-color-border-disabled: hsl(215, 63%, 93%);
-  --spruce-form-color-border-focus: hsl(262, 71%, 49%);
-  --spruce-form-color-check-background: hsl(262, 71%, 49%);
-  --spruce-form-color-check-focus-ring: hsl(262, 71%, 49%);
-  --spruce-form-color-check-foreground: hsl(0, 0%, 100%);
-  --spruce-form-color-group-label-background: hsl(210, 60%, 98%);
-  --spruce-form-color-group-label-foreground: hsl(208, 9%, 42%);
-  --spruce-form-color-invalid: hsl(0, 71%, 51%);
-  --spruce-form-color-invalid-focus-ring: rgba(219, 41, 41, 0.25);
-  --spruce-form-color-label: hsl(260, 70%, 6%);
-  --spruce-form-color-legend: hsl(260, 70%, 6%);
-  --spruce-form-color-placeholder: hsl(208, 7%, 40%);
-  --spruce-form-color-range-thumb-background: hsl(262, 71%, 49%);
-  --spruce-form-color-range-thumb-focus-ring: hsl(262, 71%, 49%);
-  --spruce-form-color-range-track-background: hsl(215, 63%, 93%);
-  --spruce-form-color-ring-focus: rgba(101, 36, 214, 0.25);
-  --spruce-form-color-select-foreground: hsl(260, 70%, 6%);
-  --spruce-form-color-text: hsl(208, 9%, 42%);
-  --spruce-form-color-valid: hsl(150, 100%, 33%);
-  --spruce-form-color-valid-focus-ring: rgba(0, 168, 84, 0.25);
-}
-
-:root {
-  --spruce-selection-color-foreground: hsl(0, 0%, 100%);
-  --spruce-selection-color-background: hsl(262, 71%, 49%);
-}
-
-:root {
-  --spruce-scrollbar-color-thumb-background: hsla(0, 0%, 0%, 0.15);
-  --spruce-scrollbar-color-thumb-background-hover: hsla(0, 0%, 0%, 0.25);
-  --spruce-scrollbar-color-track-background: hsla(0, 0%, 0%, 0.05);
-}
-
-:root {
-  --spruce-table-color-border: hsl(215, 63%, 93%);
-  --spruce-table-color-caption: hsl(208, 9%, 42%);
-  --spruce-table-color-heading: hsl(260, 70%, 6%);
-  --spruce-table-color-hover: hsla(0, 0%, 0%, 0.05);
-  --spruce-table-color-stripe: hsla(0, 0%, 0%, 0.025);
-  --spruce-table-color-text: hsl(208, 9%, 42%);
-}
-
-:root {
-  --spruce-breadcrumb-color-separator: hsla(0, 0%, 0%, 0.1);
-}
-
-:root {
-  --spruce-cookie-color-background: hsl(207, 95%, 8%);
-  --spruce-cookie-color-foreground: hsl(0, 0%, 100%);
-}
-
-:root {
-  --spruce-footer-color-background: hsl(260, 70%, 6%);
-}
-
-:root {
-  --spruce-ide-color-header-background: hsl(0, 0%, 100%);
-}
-
-:root {
-  --spruce-hero-color-gradient-end: hsl(0, 0%, 100%);
-  --spruce-hero-color-gradient-start: hsl(210, 100%, 98%);
-  --spruce-hero-color-note-background: hsl(210, 100%, 97%);
-  --spruce-hero-color-note-color: hsl(216, 50%, 44%);
-}
-
-:root {
-  --spruce-navigation-color-icon-background: hsl(259, 53%, 94%);
-  --spruce-navigation-color-icon-background-hover: hsl(262, 71%, 49%);
-  --spruce-navigation-color-icon-foreground: hsl(262, 71%, 49%);
-  --spruce-navigation-color-icon-foreground-hover: hsl(0, 0%, 100%);
-}
-
-:root {
-  --spruce-prism-color-background: hsl(0, 0%, 98%);
-  --spruce-prism-color-boolean: hsl(0, 44%, 53%);
-  --spruce-prism-color-class-name: hsl(0, 0%, 7%);
-  --spruce-prism-color-color: hsl(243, 14%, 29%);
-  --spruce-prism-color-comment: hsl(225, 14%, 46%);
-  --spruce-prism-color-constant: hsl(221, 57%, 52%);
-  --spruce-prism-color-deleted: hsla(1, 83%, 63%, 0.56);
-  --spruce-prism-color-namespace: hsl(173, 100%, 24%);
-  --spruce-prism-color-number: hsl(315, 90%, 35%);
-  --spruce-prism-color-punctuation: hsl(279, 50%, 53%);
-  --spruce-prism-color-regex: hsl(1, 66%, 47%);
-}
-
-:root {
-  --spruce-border-radius: 0.425rem;
-  --spruce-font-family-base: Seravek, Gill Sans Nova, Ubuntu, Calibri, DejaVu Sans, source-sans-pro, sans-serif;
-  --spruce-font-family-cursive: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;
-  --spruce-font-family-heading: Avenir, Avenir Next LT Pro, Montserrat, Corbel, URW Gothic, source-sans-pro, sans-serif;
-  --spruce-font-size-base: 1rem;
-  --spruce-font-size-lead: clamp(1.15rem, 2vw, 1.35rem);
-  --spruce-font-size-lg: 1.125rem;
-  --spruce-font-size-ratio: 1.25;
-  --spruce-font-size-sm: 0.875rem;
-  --spruce-font-weight-heading: 700;
-  --spruce-inline-padding: 0.1em 0.3em;
-  --spruce-line-height-base: 1.8;
-  --spruce-line-height-heading: calc(2px + 2ex + 2px);
-  --spruce-line-height-lg: 1.8;
-  --spruce-line-height-md: 1.5;
-  --spruce-line-height-sm: 1.2;
-  --spruce-border-radius-lg: 0.925rem;
-  --spruce-border-radius-sm: 0.425rem;
-  --spruce-container-inline-size: 94rem;
-  --spruce-page-margin: 2cm;
-  --spruce-hidden-elements: header, footer, aside, nav, form, iframe, [class^="aspect-ratio"];
-}
-@media (prefers-reduced-motion: no-preference) {
-  :root {
-    --spruce-duration: 0.15s;
-    --spruce-timing-function: ease-in-out;
-  }
-}
-
-.sr-only {
-  block-size: 1px !important;
-  border: 0 !important;
-  clip: rect(0, 0, 0, 0) !important;
-  inline-size: 1px !important;
-  margin: -1px !important;
-  overflow: hidden !important;
-  padding: 0 !important;
-  position: absolute !important;
-  white-space: nowrap !important;
-}
-
-[tabindex="-1"]:focus {
-  outline: none !important;
-}
-
-::selection {
-  background-color: var(--spruce-selection-color-background);
-  color: var(--spruce-selection-color-foreground);
-  text-shadow: none;
-}
-
-html {
-  box-sizing: border-box;
-}
-@media (prefers-reduced-motion: no-preference) {
-  html {
-    scroll-behavior: smooth;
-  }
-}
-
-*,
-::before,
-::after {
-  box-sizing: inherit;
-}
-
-body {
-  background: var(--spruce-base-color-background);
-  color: var(--spruce-base-color-text);
-}
-
-a {
-  color: var(--spruce-base-color-link);
-  text-decoration: underline;
-  transition-duration: var(--spruce-duration);
-  transition-property: color;
-  transition-timing-function: var(--spruce-timing-function);
-}
-a:hover {
-  color: var(--spruce-base-color-link-hover);
-}
-
-button {
-  color: inherit;
-}
-
-a,
-button {
-  touch-action: manipulation;
-}
-
-hr {
-  border: 0;
-  border-block-start: 1px solid var(--spruce-base-color-border);
-}
-
-img {
-  block-size: auto;
-  display: block;
-  max-inline-size: 100%;
-  user-select: none;
-}
-
-iframe {
-  block-size: 100%;
-  display: block;
-  inline-size: 100%;
-}
-
-figure {
-  margin-inline: 0;
-}
-figure figcaption {
-  margin-block-start: 0.5rem;
-  text-align: center;
-}
-
-.table-responsive {
-  --inline-size: 40rem;
-  -webkit-overflow-scrolling: touch;
-  overflow-x: auto;
-}
-.table-responsive table {
-  min-inline-size: var(--inline-size);
-}
-
-.table {
-  --spruce-line-height: 1.5;
-  --spruce-padding: 1rem;
-  --spruce-responsive-inline-size: 40rem;
-  border-collapse: collapse;
-  color: var(--spruce-table-color-text);
-  inline-size: 100%;
-}
-.table caption {
-  color: var(--spruce-table-color-caption);
-  margin-block-end: 1rem;
-}
-.table th,
-.table td {
-  border-block-end: 1px solid var(--spruce-table-color-border);
-  line-height: var(--spruce-line-height);
-  padding: var(--spruce-padding);
-}
-.table th {
-  color: var(--spruce-table-color-heading);
-  text-align: inherit;
-  text-align: -webkit-match-parent;
-}
-.table--striped > tbody > tr:nth-child(odd) {
-  background-color: var(--spruce-table-color-stripe);
-}
-.table--hover > tbody > tr:hover {
-  background: var(--spruce-table-color-hover);
-}
-.table--clear-border th,
-.table--clear-border td {
-  border: 0;
-}
-.table--in-line th:first-child,
-.table--in-line td:first-child {
-  padding-inline-start: 0;
-}
-.table--in-line th:last-child,
-.table--in-line td:last-child {
-  padding-inline-end: 0;
-}
-.table--sm {
-  --spruce-padding: 0.5rem;
-}
-.table--sm th,
-.table--sm td {
-  padding: var(--spruce-padding);
-}
-.table--rounded th:first-child,
-.table--rounded td:first-child {
-  border-end-start-radius: var(--spruce-border-radius-sm);
-  border-start-start-radius: var(--spruce-border-radius-sm);
-}
-.table--rounded th:last-child,
-.table--rounded td:last-child {
-  border-end-end-radius: var(--spruce-border-radius-sm);
-  border-start-end-radius: var(--spruce-border-radius-sm);
-}
-
-html {
-  -webkit-tap-highlight-color: hsla(0, 0%, 0%, 0);
-}
-
-body {
-  font-family: var(--spruce-font-family-base);
-  font-size: var(--spruce-font-size-base);
-  line-height: var(--spruce-line-height-base);
-}
-
-p,
-li,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  hyphens: auto;
-  overflow-wrap: break-word;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  color: var(--spruce-base-color-heading);
-  font-family: var(--spruce-font-family-heading);
-  font-weight: var(--spruce-font-weight-heading);
-  line-height: var(--spruce-line-height-heading);
-}
-
-h1 {
-  font-size: clamp(2.0751953125rem, 2vw + 1rem, 2.44140625rem);
-}
-
-h2 {
-  font-size: clamp(1.66015625rem, 2vw + 1rem, 1.953125rem);
-}
-
-h3 {
-  font-size: clamp(1.328125rem, 2vw + 1rem, 1.5625rem);
-}
-
-h4 {
-  font-size: clamp(1.0625rem, 2vw + 1rem, 1.25rem);
-}
-
-h5 {
-  font-size: 1rem;
-}
-
-h6 {
-  font-size: 1rem;
-}
-
-ul,
-ol {
-  list-style-position: inside;
-}
-ul > *,
-ol > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-ul > * + *,
-ol > * + * {
-  margin-block-start: 0.25rem;
-}
-ul li,
-ol li {
-  list-style-position: outside;
-}
-ul li::marker,
-ol li::marker {
-  color: var(--spruce-base-color-marker);
-}
-
-li > ul,
-li > ol {
-  margin-block-start: 0.25rem;
-}
-
-dl dt {
-  color: var(--spruce-base-color-heading);
-  font-weight: bold;
-}
-dl dd {
-  margin: 0;
-}
-dl dd + dt {
-  margin-block-start: 1rem;
-}
-
-.quote {
-  border-inline-start: 0.5rem solid var(--spruce-base-color-blockquote-border);
-  padding-inline-start: 1.5rem;
-}
-.quote > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.quote > * + * {
-  margin-block-start: 0.5rem;
-}
-.quote blockquote {
-  border-inline-start: 0;
-  padding-inline-start: 0;
-}
-.quote figcaption {
-  text-align: start;
-}
-
-blockquote {
-  border-inline-start: 0.5rem solid var(--spruce-base-color-blockquote-border);
-  margin-inline-start: 0;
-  padding-inline-start: 1.5rem;
-}
-blockquote > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-blockquote > * + * {
-  margin-block-start: 0.5rem;
-}
-
-abbr[title] {
-  border-block-end: 1px dotted;
-  cursor: help;
-  text-decoration: none;
-}
-
-mark {
-  background-color: var(--spruce-base-color-mark-background);
-  border-radius: var(--spruce-border-radius);
-  color: var(--spruce-base-color-mark-foreground);
-  padding: var(--spruce-inline-padding);
-}
-
-code,
-kbd,
-samp {
-  background-color: var(--spruce-base-color-code-background);
-  border-radius: var(--spruce-border-radius);
-  color: var(--spruce-base-color-code-foreground);
-  padding: var(--spruce-inline-padding);
-}
-
-strong {
-  color: var(--spruce-base-color-strong);
-}
-
-.lead {
-  font-size: var(--spruce-font-size-lead);
-}
-
-.hidden,
-[hidden] {
-  display: none !important;
-}
-
-.h1 {
-  font-size: clamp(2.0751953125rem, 2vw + 1rem, 2.44140625rem);
-}
-
-.h2 {
-  font-size: clamp(1.66015625rem, 2vw + 1rem, 1.953125rem);
-}
-
-.h3 {
-  font-size: clamp(1.328125rem, 2vw + 1rem, 1.5625rem);
-}
-
-.h4 {
-  font-size: clamp(1.0625rem, 2vw + 1rem, 1.25rem);
-}
-
-.h5 {
-  font-size: 1rem;
-}
-
-.h6 {
-  font-size: 1rem;
-}
-
-.btn {
-  --spruce-border-radius: 0.425rem;
-  --spruce-border-width: 1px;
-  --spruce-font-size: 1rem;
-  --spruce-font-weight: 500;
-  --spruce-gap: 0.5rem;
-  --spruce-icon-padding: 0.75em;
-  --spruce-icon-size: 1em;
-  --spruce-padding: 0.75em 1em;
-  --spruce-shadow-size: 0.25rem;
-  align-items: center;
-  border-radius: var(--spruce-border-radius);
-  border-style: solid;
-  border-width: var(--spruce-border-width);
-  cursor: pointer;
-  display: inline-flex;
-  font-size: var(--spruce-font-size);
-  font-weight: var(--spruce-font-weight);
-  gap: var(--spruce-gap);
-  justify-content: center;
-  line-height: 1;
-  padding: var(--spruce-padding);
-  text-align: start;
-  text-decoration: none;
-  transition-duration: var(--spruce-duration);
-  transition-property: background-color, border-color, box-shadow, color;
-  transition-timing-function: var(--spruce-timing-function);
-}
-
-.btn:focus {
-  outline-color: transparent;
-  outline-style: solid;
-}
-
-.btn:disabled {
-  opacity: 0.5;
-  pointer-events: none;
-}
-
-.btn--icon {
-  padding: var(--spruce-icon-padding);
-}
-.btn--icon.btn--sm {
-  padding: var(--spruce-icon-padding);
-}
-.btn--icon.btn--lg {
-  padding: var(--spruce-icon-padding);
-}
-
-.btn__icon {
-  block-size: var(--spruce-icon-size);
-  flex-shrink: 0;
-  inline-size: var(--spruce-icon-size);
-  pointer-events: none;
-}
-.btn__icon--sm {
-  block-size: var(--spruce-icon-size);
-  inline-size: var(--spruce-icon-size);
-}
-
-.btn--sm {
-  --spruce-font-size: 0.8rem;
-  --spruce-gap: 0.25rem;
-  --spruce-icon-padding: 0.5em;
-  --spruce-icon-size: 0.8rem;
-  --spruce-padding: 0.5em 0.75em;
-  font-size: var(--spruce-font-size);
-  gap: var(--spruce-gap);
-  padding: var(--spruce-padding);
-}
-
-.btn--lg {
-  --spruce-font-size: 1.15rem;
-  --spruce-gap: 0.5rem;
-  --spruce-icon-padding: 0.9em;
-  --spruce-padding: 0.9em 1.15em;
-}
-
-.btn--block {
-  inline-size: 100%;
-}
-
-.btn--primary {
-  background-color: var(--spruce-btn-color-primary-background);
-  border-color: var(--spruce-btn-color-primary-background);
-  color: var(--spruce-btn-color-primary-foreground);
-}
-.btn--primary:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-primary-background);
-  outline-offset: 2px;
-}
-.btn--primary:hover {
-  background-color: var(--spruce-btn-color-primary-background-hover);
-  border-color: var(--spruce-btn-color-primary-background-hover);
-  color: var(--spruce-btn-color-primary-foreground);
-}
-.btn--primary-shadow {
-  box-shadow: 0 0.55em 1em -0.2em var(--spruce-btn-color-primary-shadow), 0 0.15em 0.35em -0.185em var(--spruce-btn-color-primary-shadow);
-}
-
-.btn--secondary {
-  background-color: var(--spruce-btn-color-secondary-background);
-  border-color: var(--spruce-btn-color-secondary-background);
-  color: var(--spruce-btn-color-secondary-foreground);
-}
-.btn--secondary:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-secondary-background);
-  outline-offset: 2px;
-}
-.btn--secondary:hover {
-  background-color: var(--spruce-btn-color-secondary-background-hover);
-  border-color: var(--spruce-btn-color-secondary-background-hover);
-  color: var(--spruce-btn-color-secondary-foreground);
-}
-.btn--secondary-shadow {
-  box-shadow: 0 0.55em 1em -0.2em var(--spruce-btn-color-secondary-shadow), 0 0.15em 0.35em -0.185em var(--spruce-btn-color-secondary-shadow);
-}
-
-.btn--outline-primary {
-  background-color: transparent;
-  border-color: var(--spruce-btn-color-primary-background);
-  color: var(--spruce-btn-color-primary-background);
-}
-.btn--outline-primary:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-primary-background);
-  outline-offset: 2px;
-}
-.btn--outline-primary:hover {
-  background-color: var(--spruce-btn-color-primary-background);
-  border-color: var(--spruce-btn-color-primary-background);
-  color: var(--spruce-btn-color-primary-foreground);
-}
-
-.btn--outline-secondary {
-  background-color: transparent;
-  border-color: var(--spruce-btn-color-secondary-background);
-  color: var(--spruce-btn-color-secondary-background);
-}
-.btn--outline-secondary:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-secondary-background);
-  outline-offset: 2px;
-}
-.btn--outline-secondary:hover {
-  background-color: var(--spruce-btn-color-secondary-background);
-  border-color: var(--spruce-btn-color-secondary-background);
-  color: var(--spruce-btn-color-secondary-foreground);
-}
-
-.form-file::file-selector-button {
-  --spruce-border-radius: 0.425rem;
-  --spruce-border-width: 1px;
-  --spruce-font-size: 1rem;
-  --spruce-font-weight: 500;
-  --spruce-gap: 0.5rem;
-  --spruce-icon-padding: 0.75em;
-  --spruce-icon-size: 1em;
-  --spruce-padding: 0.75em 1em;
-  --spruce-shadow-size: 0.25rem;
-  align-items: center;
-  border-radius: var(--spruce-border-radius);
-  border-style: solid;
-  border-width: var(--spruce-border-width);
-  cursor: pointer;
-  display: inline-flex;
-  font-size: var(--spruce-font-size);
-  font-weight: var(--spruce-font-weight);
-  gap: var(--spruce-gap);
-  justify-content: center;
-  line-height: 1;
-  padding: var(--spruce-padding);
-  text-align: start;
-  text-decoration: none;
-  transition-duration: var(--spruce-duration);
-  transition-property: background-color, border-color, box-shadow, color;
-  transition-timing-function: var(--spruce-timing-function);
-}
-
-.form-file:focus {
-  outline-color: transparent;
-  outline-style: solid;
-}
-
-.form-file:disabled {
-  opacity: 0.5;
-  pointer-events: none;
-}
-
-.form-file--sm::file-selector-button {
-  --spruce-font-size: 0.8rem;
-  --spruce-gap: 0.25rem;
-  --spruce-icon-padding: 0.5em;
-  --spruce-icon-size: 0.8rem;
-  --spruce-padding: 0.5em 0.75em;
-  font-size: var(--spruce-font-size);
-  gap: var(--spruce-gap);
-  padding: var(--spruce-padding);
-}
-
-.form-file--lg::file-selector-button {
-  --spruce-font-size: 1.15rem;
-  --spruce-gap: 0.5rem;
-  --spruce-icon-padding: 0.9em;
-  --spruce-padding: 0.9em 1.15em;
-}
-
-.form-file--block::file-selector-button {
-  inline-size: 100%;
-}
-
-.form-file {
-  display: block;
-}
-.form-file:focus {
-  outline: revert;
-}
-.form-file:focus-within::file-selector-button {
-  background-color: var(--spruce-btn-color-primary-background-hover);
-}
-.form-file::file-selector-button {
-  background-color: var(--spruce-btn-color-primary-background);
-  border-color: var(--spruce-btn-color-primary-background);
-  color: var(--spruce-btn-color-primary-foreground);
-  margin-inline-end: 1rem;
-}
-.form-file::file-selector-button:hover {
-  background-color: var(--spruce-btn-color-primary-background-hover);
-  border-color: var(--spruce-btn-color-primary-background-hover);
-  color: var(--spruce-btn-color-primary-foreground);
-}
-.form-file::file-selector-button-shadow {
-  box-shadow: 0 0.55em 1em -0.2em var(--spruce-btn-color-primary-shadow), 0 0.15em 0.35em -0.185em var(--spruce-btn-color-primary-shadow);
-}
-
-.form-label {
-  color: var(--spruce-form-color-label);
-  line-height: 1.5;
-  text-align: start;
-}
-
-.form-control {
-  --webkit-date-line-height: 1.375;
-  --spruce-border-radius: 0.425rem;
-  --spruce-border-width: 1px;
-  --spruce-font-size: 1rem;
-  --spruce-line-height: 1.5;
-  --spruce-padding: 0.5em 0.75em;
-  --spruce-textarea-block-size: 6rem;
-  appearance: none;
-  background-color: var(--spruce-form-color-background);
-  border: var(--spruce-border-width) solid var(--spruce-form-color-border);
-  border-radius: var(--spruce-border-radius);
-  box-sizing: border-box;
-  color: var(--spruce-form-color-text);
-  display: block;
-  font-size: var(--spruce-font-size);
-  inline-size: 100%;
-  line-height: var(--spruce-line-height);
-  padding: var(--spruce-padding);
-  transition-duration: var(--spruce-duration);
-  transition-property: border, box-shadow;
-  transition-timing-function: var(--spruce-timing-function);
-}
-.form-control::placeholder {
-  color: var(--spruce-form-color-placeholder);
-}
-.form-control::-webkit-datetime-edit {
-  line-height: var(--webkit-date-line-height);
-}
-.form-control:focus {
-  border-color: var(--spruce-form-color-border-focus);
-  box-shadow: 0 0 0 0.25rem var(--spruce-form-color-ring-focus);
-  outline: 2px solid transparent;
-}
-.form-control[type=color] {
-  --spruce-aspect-ratio: 1;
-  --spruce-block-size: 100%;
-  --spruce-inline-size: 2.625rem;
-  --spruce-padding: 0.5em;
-  aspect-ratio: var(--spruce-aspect-ratio);
-  block-size: var(--spruce-block-size);
-  inline-size: var(--spruce-inline-size);
-  padding: var(--spruce-padding);
-}
-.form-control[type=color]::-webkit-color-swatch-wrapper {
-  padding: 0;
-}
-.form-control[type=color]::-moz-color-swatch {
-  border: 0;
-  border-radius: var(--spruce-border-radius);
-}
-.form-control[type=color]::-webkit-color-swatch {
-  border: 0;
-  border-radius: var(--spruce-border-radius);
-}
-.form-control[disabled], .form-control[disabled=true] {
-  background-color: var(--spruce-form-color-background-disabled);
-  border-color: var(--spruce-form-color-border-disabled);
-  cursor: not-allowed;
-}
-textarea.form-control {
-  block-size: var(--spruce-textarea-block-size);
-  min-block-size: var(--spruce-textarea-block-size);
-  resize: vertical;
-}
-
-.form-control--valid, .form-control--invalid {
-  background-position: center right 0.5em;
-  background-repeat: no-repeat;
-  background-size: 1.25em auto;
-  padding-inline-end: 2em;
-}
-html[dir=rtl] .form-control--valid, html[dir=rtl] .form-control--invalid {
-  background-position: center left 0.5em;
-}
-.form-control--valid {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"%3e%3cpath d="M12,2c5.519,0 10,4.481 10,10c0,5.519 -4.481,10 -10,10c-5.519,0 -10,-4.481 -10,-10c0,-5.519 4.481,-10 10,-10Zm0,1.667c4.599,-0 8.333,3.734 8.333,8.333c0,4.599 -3.734,8.333 -8.333,8.333c-4.599,0 -8.333,-3.734 -8.333,-8.333c-0,-4.599 3.734,-8.333 8.333,-8.333Zm-1.476,10.182l-2.984,-2.984c-0.065,-0.065 -0.17,-0.065 -0.235,0l-0.943,0.943c-0.065,0.065 -0.065,0.171 -0,0.236l4.043,4.042c0.033,0.033 0.076,0.05 0.119,0.049c0.044,0.001 0.087,-0.016 0.12,-0.049l6.994,-6.994c0.065,-0.065 0.065,-0.17 0,-0.235l-0.943,-0.943c-0.065,-0.065 -0.17,-0.065 -0.235,-0l-5.936,5.935Z" style="fill:hsl%28150, 100%, 33%%29;"/%3e%3c/svg%3e');
-  border-color: var(--spruce-alert-color-success);
-}
-.form-control--valid:focus {
-  border-color: var(--spruce-form-color-valid);
-  box-shadow: 0 0 0 0.25rem var(--spruce-form-color-valid-focus-ring);
-  outline: 2px solid transparent;
-}
-.form-control--invalid {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"%3e%3cpath d="M12,2c5.519,0 10,4.481 10,10c0,5.519 -4.481,10 -10,10c-5.519,0 -10,-4.481 -10,-10c0,-5.519 4.481,-10 10,-10Zm0,1.667c4.599,-0 8.333,3.734 8.333,8.333c0,4.599 -3.734,8.333 -8.333,8.333c-4.599,0 -8.333,-3.734 -8.333,-8.333c-0,-4.599 3.734,-8.333 8.333,-8.333Zm0.813,11.649c-0,-0.081 -0.065,-0.146 -0.146,-0.146l-1.334,0c-0.081,0 -0.146,0.065 -0.146,0.146l0,1.169c0,0.08 0.065,0.146 0.146,0.146l1.334,-0c0.081,-0 0.146,-0.066 0.146,-0.146l-0,-1.169Zm-0,-7.784c-0,-0.09 -0.073,-0.163 -0.163,-0.163l-1.3,0c-0.09,0 -0.163,0.073 -0.163,0.163l0,6.351c0,0.09 0.073,0.163 0.163,0.163l1.3,-0c0.09,-0 0.163,-0.073 0.163,-0.163l-0,-6.351Z" style="fill:hsl%280, 71%, 51%%29;"/%3e%3c/svg%3e');
-  border-color: var(--spruce-alert-color-danger);
-}
-.form-control--invalid:focus {
-  border-color: var(--spruce-form-color-invalid);
-  box-shadow: 0 0 0 0.25rem var(--spruce-form-color-invalid-focus-ring);
-  outline: 2px solid transparent;
-}
-.form-control--sm {
-  --webkit-date-line-height: 1.36;
-  --spruce-border-radius: 0.35em;
-  --spruce-padding: 0.25em 0.75em;
-}
-.form-control--sm[type=color] {
-  --spruce-aspect-ratio: 1;
-  --spruce-block-size: 100%;
-  --spruce-inline-size: 1.925rem;
-  --spruce-padding: 0.25em;
-}
-.form-control--lg {
-  --webkit-date-line-height: 1.387;
-  --spruce-padding: 0.65em 1em;
-}
-.form-control--lg[type=color] {
-  --spruce-aspect-ratio: 1;
-  --spruce-block-size: 100%;
-  --spruce-inline-size: 3.204rem;
-  --spruce-padding: 0.5em;
-}
-
-select.form-control:not([multiple]):not([size]) {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M12,12.507l-3.816,-3.815c-0.171,-0.172 -0.45,-0.172 -0.622,-0l-0.933,0.933c-0.172,0.172 -0.172,0.451 0,0.623l5.06,5.06c0.172,0.172 0.45,0.172 0.622,0l5.06,-5.06c0.172,-0.172 0.172,-0.451 -0,-0.623l-0.933,-0.933c-0.172,-0.172 -0.451,-0.172 -0.622,-0l-3.816,3.815Z" style="fill:hsl%28260, 70%, 6%%29;"/%3e%3c/svg%3e');
-  background-position: center right 0.5em;
-  background-repeat: no-repeat;
-  background-size: 1.25em auto;
-  padding-inline-end: 2em;
-}
-html[dir=rtl] select.form-control:not([multiple]):not([size]) {
-  background-position: center left 0.5em;
-}
-
-.form-check {
-  --spruce-border-radius: 0.425rem;
-  --spruce-border-width: 1px;
-  --spruce-font-size: 1.125rem;
-  --spruce-line-height: 1.5;
-  --spruce-margin-block: 0.1em;
-  --spruce-vertical-alignment: center;
-  align-items: var(--spruce-vertical-alignment);
-  display: inline-flex;
-  gap: 0.5rem;
-}
-
-.form-check--vertical-center {
-  align-items: center;
-}
-
-.form-check--vertical-start {
-  align-items: flex-start;
-}
-
-.form-check--sm {
-  --spruce-border-radius: 0.35em;
-  --spruce-padding: 0.25em 0.75em;
-}
-.form-check--sm .form-check__control {
-  font-size: var(--spruce-font-size);
-}
-
-.form-check--lg {
-  --spruce-padding: 0.65em 1em;
-}
-.form-check__control {
-  appearance: none;
-  background-color: var(--spruce-form-color-background);
-  background-position: center;
-  background-repeat: no-repeat;
-  background-size: contain;
-  block-size: 1em;
-  border: var(--spruce-border-width) solid var(--spruce-form-color-border);
-  flex-shrink: 0;
-  font-size: var(--spruce-font-size);
-  inline-size: 1em;
-  line-height: 1;
-  margin-block: var(--spruce-margin-block);
-  transition-duration: var(--spruce-duration);
-  transition-property: border, box-shadow;
-  transition-timing-function: var(--spruce-timing-function);
-}
-.form-check__control[type=radio] {
-  border-radius: 50%;
-}
-.form-check__control[type=checkbox] {
-  border-radius: var(--spruce-border-radius);
-}
-.form-check__control:focus-visible {
-  outline: 2px solid var(--spruce-form-color-check-focus-ring);
-  outline-offset: 2px;
-}
-.form-check__control:checked {
-  background-color: var(--spruce-form-color-check-background);
-  border-color: var(--spruce-form-color-check-background);
-}
-.form-check__control:checked[type=radio] {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3ccircle cx="12" cy="12" r="6" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
-}
-.form-check__control:checked[type=checkbox] {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M9.525,13.777l-2.411,-2.412c-0.234,-0.233 -0.613,-0.233 -0.846,0l-1.27,1.27c-0.233,0.233 -0.233,0.612 0,0.846l4.104,4.103c0.116,0.117 0.269,0.175 0.422,0.175l0.003,0c0.152,0 0.305,-0.058 0.421,-0.175l9.054,-9.053c0.233,-0.234 0.233,-0.613 -0,-0.846l-1.27,-1.269c-0.233,-0.234 -0.612,-0.234 -0.846,-0l-7.361,7.361Z" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
-}
-.form-check__control:indeterminate[type=checkbox] {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M19.5,11.1c-0,-0.331 -0.269,-0.6 -0.6,-0.6l-13.8,0c-0.331,0 -0.6,0.269 -0.6,0.6l0,1.8c0,0.331 0.269,0.6 0.6,0.6l13.8,0c0.331,0 0.6,-0.269 0.6,-0.6l-0,-1.8Z" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
-  background-color: var(--spruce-form-color-check-background);
-  border-color: var(--spruce-form-color-check-background);
-}
-.form-check__control:disabled, .form-check__control.disabled {
-  background-color: var(--spruce-form-color-background-disabled);
-  border-color: var(--spruce-form-color-border-disabled);
-  cursor: not-allowed;
-}
-.form-check__control:disabled + .form-check__label, .form-check__control.disabled + .form-check__label {
-  opacity: 0.5;
-}
-
-.form-check__label {
-  line-height: var(--spruce-line-height);
-}
-
-.form-switch {
-  --spruce-border-width: 1px;
-  --spruce-font-size: 1.125rem;
-  --spruce-line-height: 1.5;
-  --spruce-margin-block: 0.15em;
-  --spruce-vertical-alignment: center;
-  align-items: var(--spruce-vertical-alignment);
-  display: inline-flex;
-  gap: 0.5rem;
-}
-.form-switch--block {
-  inline-size: 100%;
-  justify-content: space-between;
-}
-
-.form-switch--vertical-center {
-  align-items: center;
-}
-
-.form-switch--vertical-start {
-  align-items: flex-start;
-}
-
-.form-switch--sm {
-  --spruce-font-size: 1rem;
-}
-
-.form-switch--lg {
-  --spruce-font-size: clamp(1.15rem, 2vw, 1.35rem);
-}
-
-.form-switch__control {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3ccircle cx="12" cy="12" r="8.5" style="fill:hsl%28260, 4%, 70%%29;"/%3e%3c/svg%3e');
-  appearance: none;
-  background-color: var(--spruce-form-color-background);
-  background-position: left center;
-  background-repeat: no-repeat;
-  background-size: contain;
-  block-size: 1em;
-  border: var(--spruce-border-width) solid var(--spruce-form-color-border);
-  border-radius: 2em;
-  flex-shrink: 0;
-  font-size: var(--spruce-font-size);
-  inline-size: 2em;
-  line-height: 1;
-  margin-block: var(--spruce-margin-block);
-  transition-duration: var(--spruce-duration);
-  transition-property: background-position, border, box-shadow;
-  transition-timing-function: var(--spruce-timing-function);
-}
-.form-switch__control:checked {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3ccircle cx="12" cy="12" r="8.5" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
-  background-color: var(--spruce-form-color-check-background);
-  background-position: right center;
-  border-color: var(--spruce-form-color-check-background);
-}
-.form-switch__control:disabled {
-  background-color: var(--spruce-form-color-background-disabled);
-  border-color: var(--spruce-form-color-border-disabled);
-  cursor: not-allowed;
-}
-.form-switch__control:disabled + .form-switch__label {
-  opacity: 0.5;
-}
-
-[dir=rtl] .form-switch__control {
-  background-position: right center;
-}
-[dir=rtl] .form-switch__control:checked {
-  background-position: left center;
-}
-
-.form-switch__label {
-  line-height: var(--spruce-line-height);
-}
-
-fieldset {
-  --spruce-layout-gap: 1rem;
-  --spruce-legend-font-size: clamp(1rem, 5vw, 1.25rem);
-  --spruce-legend-font-weight: 700;
-  border: 0;
-  margin: 0;
-  padding: 0;
-}
-fieldset > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-fieldset > * + * {
-  margin-block-start: var(--spruce-layout-gap);
-}
-fieldset + fieldset {
-  margin-block-start: 3rem;
-}
-
-legend {
-  color: var(--spruce-form-color-legend);
-  font-size: var(--spruce-legend-font-size);
-  font-weight: var(--spruce-legend-font-weight);
-}
-
-.form-group-label {
-  --spruce-border-radius: 0.425rem;
-  --spruce-border-width: 1px;
-  align-items: center;
-  background-color: var(--spruce-form-color-group-label-background);
-  border: var(--spruce-border-width) solid var(--spruce-form-color-border);
-  border-radius: var(--spruce-border-radius);
-  color: var(--spruce-form-color-group-label-foreground);
-  display: flex;
-  padding-inline: 1rem;
-}
-
-.form-group {
-  --spruce-gap: 0.5rem;
-  display: flex;
-  flex-direction: column;
-  gap: var(--spruce-gap);
-}
-.form-group--horizontal-check {
-  --spruce-gap: 1rem;
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  gap: var(--spruce-gap);
-}
-.form-group--vertical-check {
-  --spruce-gap: 1rem;
-  align-items: start;
-  flex-direction: column;
-  gap: var(--spruce-gap);
-}
-.form-group--row {
-  --spruce-container-inline-size: 38rem;
-  --spruce-gap: 0.25rem 1rem;
-  --spruce-label-inline-size: 10rem;
-  --spruce-vertical-alignment: center;
-  align-items: var(--spruce-vertical-alignment);
-  display: grid;
-  gap: var(--spruce-gap);
-  grid-template-columns: minmax(0, 1fr);
-}
-.form-group--row\:vertical-center {
-  align-items: center;
-}
-.form-group--row\:vertical-start {
-  align-items: flex-start;
-}
-@container form-group-container (inline-size > 38rem) {
-  .form-group--row {
-    grid-template-columns: minmax(0, var(--spruce-label-inline-size)) minmax(0, 1fr);
-  }
-}
-@container form-group-container (inline-size > 38rem) {
-  .form-group--row .form-description,
-  .form-group--row .field-feedback {
-    grid-column-start: 2;
-  }
-}
-.form-group--stacked {
-  display: flex;
-}
-.form-group--stacked > * + * {
-  border-radius: 0;
-  margin-inline-start: -1px;
-}
-.form-group--stacked > *:first-child {
-  border-start-end-radius: 0;
-  border-start-start-radius: var(--spruce-border-radius);
-  border-end-end-radius: 0;
-  border-end-start-radius: var(--spruce-border-radius);
-}
-.form-group--stacked > *:last-child {
-  border-start-end-radius: var(--spruce-border-radius);
-  border-start-start-radius: 0;
-  border-end-end-radius: var(--spruce-border-radius);
-  border-end-start-radius: 0;
-}
-.form-group--stacked > *:only-child {
-  border-radius: var(--spruce-border-radius);
-}
-.form-group--stacked > *:focus {
-  z-index: 2;
-}
-.form-group-container {
-  container: form-group-container/inline-size;
-}
-
-.form-row--mixed {
-  --inline-size: 20ch;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1rem;
-}
-.form-row--mixed > * {
-  flex: 1 1 var(--inline-size);
-}
-
-.field-feedback {
-  display: block;
-  line-height: 1.5;
-}
-.field-feedback--valid {
-  color: var(--spruce-alert-color-success);
-}
-.field-feedback--invalid {
-  color: var(--spruce-alert-color-danger);
-}
-
-.form-range {
-  --spruce-focus-ring-box-shadow-type: outside;
-  --spruce-focus-ring-offset: 2px;
-  --spruce-focus-ring-size: 2px;
-  --spruce-focus-ring-type: outline;
-  --spruce-thumb-block-size: 1rem;
-  --spruce-thumb-border-radius: 0.5rem;
-  --spruce-thumb-inline-size: 1rem;
-  --spruce-track-block-size: 0.25rem;
-  --spruce-track-border-radius: 0.15rem;
-  appearance: none;
-  margin-block-start: calc(var(--spruce-thumb-block-size) / 2 - var(--spruce-track-block-size) / 2);
-}
-.form-range:focus-visible {
-  outline: none;
-}
-.form-range:focus-visible::-webkit-slider-thumb {
-  outline: 2px solid var(--spruce-form-color-range-thumb-focus-ring);
-  outline-offset: 2px;
-}
-.form-range:focus-visible::-moz-range-thumb {
-  outline: 2px solid var(--spruce-form-color-range-thumb-focus-ring);
-  outline-offset: 2px;
-}
-.form-range::-webkit-slider-runnable-track {
-  background-color: var(--spruce-form-color-range-track-background);
-  block-size: var(--spruce-track-block-size);
-  border-radius: var(--spruce-track-border-radius);
-}
-.form-range::-moz-range-track {
-  background-color: var(--spruce-form-color-range-track-background);
-  block-size: var(--spruce-track-block-size);
-  border-radius: var(--spruce-track-border-radius);
-}
-.form-range::-webkit-slider-thumb {
-  appearance: none;
-  background-color: var(--spruce-form-color-range-thumb-background);
-  block-size: var(--spruce-thumb-block-size);
-  border-radius: var(--spruce-thumb-border-radius);
-  inline-size: var(--spruce-thumb-inline-size);
-  margin-block-start: calc(var(--spruce-track-block-size) / 2 - var(--spruce-thumb-block-size) / 2);
-}
-.form-range::-moz-range-thumb {
-  background-color: var(--spruce-form-color-range-thumb-background);
-  block-size: var(--spruce-thumb-block-size);
-  border: 0; /*Removes extra border that FF applies*/
-  border-radius: var(--spruce-thumb-border-radius);
-  inline-size: var(--spruce-thumb-inline-size);
-}
-.form-range:disabled {
-  cursor: not-allowed;
-  opacity: 0.5;
-}
-
-.form-description {
-  --spruce-font-size: 1em;
-  --spruce-font-weight: 400;
-  color: var(--spruce-form-color-text);
-  display: block;
-  font-size: var(--spruce-font-size);
-  font-weight: var(--spruce-font-weight);
-  line-height: var(--spruce-line-height-md);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-base-color-background: hsl(206, 100%, 7%);
-  --spruce-base-color-blockquote-border: hsl(261, 54%, 70%);
-  --spruce-base-color-border: hsla(0, 0%, 100%, 0.08);
-  --spruce-base-color-code-background: hsl(207, 64%, 18%);
-  --spruce-base-color-code-foreground: hsl(0, 0%, 95%);
-  --spruce-base-color-code-tab-background: hsla(0, 0%, 0%, 0.15);
-  --spruce-base-color-heading: hsl(0, 0%, 95%);
-  --spruce-base-color-link: hsl(261, 54%, 70%);
-  --spruce-base-color-link-hover: #b8a1e3;
-  --spruce-base-color-mark-background: hsl(50, 100%, 80%);
-  --spruce-base-color-mark-foreground: hsl(206, 100%, 7%);
-  --spruce-base-color-marker: hsl(261, 54%, 70%);
-  --spruce-base-color-primary: hsl(261, 54%, 70%);
-  --spruce-base-color-secondary: hsl(227, 92%, 55%);
-  --spruce-base-color-strong: hsl(0, 0%, 97%);
-  --spruce-base-color-text: hsl(0, 0%, 97%);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-breadcrumb-color-separator: hsla(0, 0%, 100%, 0.1);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-btn-color-discrete-background-hover: hsl(261, 52%, 59%);
-  --spruce-btn-color-discrete-foreground: hsl(0, 0%, 100%);
-  --spruce-btn-color-discrete-foreground-hover: hsl(0, 0%, 100%);
-  --spruce-btn-color-install-background: hsl(207, 39%, 17%);
-  --spruce-btn-color-install-background-hover: hsl(207, 23%, 26%);
-  --spruce-btn-color-install-foreground: hsl(0, 0%, 100%);
-  --spruce-btn-color-discrete-background: hsla(0, 0%, 96%, 0.1);
-  --spruce-btn-color-primary-background: hsl(261, 52%, 59%);
-  --spruce-btn-color-primary-background-hover: hsl(261, 52%, 65%);
-  --spruce-btn-color-primary-foreground: hsl(0, 0%, 95%);
-  --spruce-btn-color-primary-shadow: #6035b1;
-  --spruce-btn-color-secondary-background: hsl(227, 92%, 55%);
-  --spruce-btn-color-secondary-background-hover: #3b64f7;
-  --spruce-btn-color-secondary-foreground: hsl(0, 0%, 95%);
-  --spruce-btn-color-secondary-shadow: #072bab;
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-form-color-background: #00223b;
-  --spruce-form-color-background-disabled: hsl(206, 100%, 7%);
-  --spruce-form-color-border: hsla(0, 0%, 100%, 0.08);
-  --spruce-form-color-border-disabled: hsla(0, 0%, 100%, 0.08);
-  --spruce-form-color-border-focus: hsl(261, 54%, 70%);
-  --spruce-form-color-check-background: hsl(261, 54%, 70%);
-  --spruce-form-color-check-focus-ring: hsl(261, 54%, 70%);
-  --spruce-form-color-check-foreground: hsl(206, 100%, 7%);
-  --spruce-form-color-invalid: hsl(0, 71%, 51%);
-  --spruce-form-color-invalid-focus-ring: rgba(219, 41, 41, 0.25);
-  --spruce-form-color-label: hsl(0, 0%, 95%);
-  --spruce-form-color-legend: hsl(0, 0%, 95%);
-  --spruce-form-color-placeholder: hsl(0, 0%, 60%);
-  --spruce-form-color-range-thumb-background: hsl(261, 54%, 70%);
-  --spruce-form-color-range-thumb-focus-ring: hsl(261, 54%, 70%);
-  --spruce-form-color-range-track-background: hsla(0, 0%, 100%, 0.08);
-  --spruce-form-color-ring-focus: rgba(166, 137, 220, 0.25);
-  --spruce-form-color-select-foreground: hsl(0, 0%, 100%);
-  --spruce-form-color-text: hsl(0, 0%, 97%);
-  --spruce-form-color-valid: hsl(150, 100%, 33%);
-  --spruce-form-color-valid-focus-ring: rgba(0, 168, 84, 0.25);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-hero-color-note-color: hsl(0, 0%, 100%);
-  --spruce-hero-color-note-background: hsl(207, 64%, 16%);
-  --spruce-hero-color-gradient-start: hsl(206, 100%, 6%);
-  --spruce-hero-color-gradient-end: hsl(206, 100%, 7%);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-ide-color-header-background: hsl(0, 0%, 0%);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-navigation-color-icon-background: hsl(207, 23%, 26%);
-  --spruce-navigation-color-icon-background-hover: hsl(207, 39%, 17%);
-  --spruce-navigation-color-icon-foreground: hsl(0, 0%, 100%);
-  --spruce-navigation-color-icon-foreground-hover: hsl(0, 0%, 100%);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-prism-color-color: hsl(217, 34%, 88%);
-  --spruce-prism-color-background: hsl(207, 83%, 10%);
-  --spruce-prism-color-comment: hsl(180, 9%, 55%);
-  --spruce-prism-color-punctuation: hsl(276, 68%, 75%);
-  --spruce-prism-color-namespace: hsl(197, 31%, 77%);
-  --spruce-prism-color-deleted: hsla(1, 83%, 63%, 0.56);
-  --spruce-prism-color-boolean: hsl(350, 100%, 67%);
-  --spruce-prism-color-number: hsl(14, 90%, 70%);
-  --spruce-prism-color-constant: hsl(221, 100%, 75%);
-  --spruce-prism-color-class-name: hsl(33, 100%, 77%);
-  --spruce-prism-color-regex: hsl(217, 34%, 88%);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-selection-color-background: hsl(261, 54%, 70%);
-  --spruce-selection-color-foreground: hsl(0, 0%, 95%);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-scrollbar-color-thumb-background: hsla(0, 0%, 100%, 0.15);
-  --spruce-scrollbar-color-thumb-background-hover: hsla(0, 0%, 100%, 0.25);
-  --spruce-scrollbar-color-track-background: hsla(0, 0%, 100%, 0.05);
-}
-
-:root[data-theme-mode=dark] {
-  --spruce-table-color-border: hsla(0, 0%, 100%, 0.08);
-  --spruce-table-color-caption: hsl(0, 0%, 97%);
-  --spruce-table-color-heading: hsl(0, 0%, 95%);
-  --spruce-table-color-hover: hsla(0, 0%, 100%, 0.05);
-  --spruce-table-color-text: hsl(0, 0%, 97%);
-  --spruce-table-color-stripe: hsla(0, 0%, 100%, 0.025);
-}
-
-[data-theme-mode=dark] {
-  color-scheme: dark;
-  /* stylelint-disable-next-line selector-no-qualifying-type */
-}
-[data-theme-mode=dark] select.form-control:not([multiple]):not([size]) {
-  background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M12,12.507l-3.816,-3.815c-0.171,-0.172 -0.45,-0.172 -0.622,-0l-0.933,0.933c-0.172,0.172 -0.172,0.451 0,0.623l5.06,5.06c0.172,0.172 0.45,0.172 0.622,0l5.06,-5.06c0.172,-0.172 0.172,-0.451 -0,-0.623l-0.933,-0.933c-0.172,-0.172 -0.451,-0.172 -0.622,-0l-3.816,3.815Z" style="fill:hsl%280, 0%, 100%%29;"/%3e%3c/svg%3e');
-}
-
-.skip-link {
-  inset: -50vh auto auto 1.5rem;
-  position: fixed;
-}
-.skip-link:focus {
-  inset-block-start: 1.5rem;
-}
-
-.site-navigation {
-  font-family: var(--doc-body-font-family);
-}
-@media (min-width: 64em) {
-  .site-navigation__btn {
-    display: none;
-  }
-}
-.site-navigation__btn[aria-expanded=true] + ul {
-  display: flex;
-}
-.site-navigation ul {
-  background-color: var(--spruce-base-color-background);
-  display: none;
-  flex-direction: column;
-  gap: 1rem;
-  inset: 100% 0 auto;
-  list-style: none;
-  margin: 0;
-  padding-block: 1.5rem;
-  padding-inline: clamp(1.5rem, 5vw, 3rem);
-  position: absolute;
-}
-@media (min-width: 64em) {
-  .site-navigation ul {
-    align-items: center;
-    background-color: transparent;
-    display: flex !important;
-    flex-direction: row;
-    flex-wrap: wrap;
-    gap: clamp(1.5rem, 5vw, 3rem);
-    inset: auto;
-    padding: 0;
-    position: relative;
-  }
-}
-.site-navigation li {
-  margin-block: 0;
-}
-.site-navigation a {
-  align-items: center;
-  color: var(--spruce-base-color-heading);
-  display: flex;
-  gap: 0.5rem;
-  text-decoration: none;
-}
-.site-navigation a:hover {
-  color: var(--spruce-base-color-primary);
-}
-.site-navigation a[aria-current=page] {
-  color: var(--spruce-base-color-primary);
-  font-weight: 700;
-}
-
-.cookie-consent-helper {
-  display: flex;
-  inset: auto 1.5rem 1.5rem 1.5rem;
-  justify-content: center;
-  pointer-events: none;
-  position: fixed;
-  z-index: 25;
-}
-
-.cookie-consent {
-  --spruce-base-color-text: hsl(0, 0%, 97%);
-  --spruce-base-color-link: hsl(261, 54%, 70%);
-  --spruce-base-color-link-hover: #b8a1e3;
-  align-items: center;
-  background-color: hsl(260, 70%, 6%);
-  border-radius: var(--spruce-border-radius-lg);
-  box-shadow: 0 0 3rem hsla(0, 0%, 0%, 0.1);
-  color: var(--spruce-base-color-text);
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  gap: 1rem 1.5rem;
-  justify-content: center;
-  padding: 1rem;
-  pointer-events: all;
-  text-align: center;
-  transform: translateY(200%);
-}
-.cookie-consent--slidein {
-  animation: slidein var(--spruce-duration) forwards;
-}
-.cookie-consent--slideout {
-  animation: slideout var(--spruce-duration) forwards;
-}
-.cookie-consent__caption > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.cookie-consent__caption > * + * {
-  margin-block-start: 0.5rem;
-}
-.cookie-consent__btns {
-  display: flex;
-  gap: 1rem;
-}
-
-@keyframes slidein {
-  from {
-    transform: translateY(200%);
-  }
-  to {
-    transform: translateY(0);
-  }
-}
-@keyframes slideout {
-  from {
-    transform: translateY(0);
-  }
-  to {
-    transform: translateY(200%);
-  }
-}
-.theme-switcher {
-  color: var(--spruce-base-color-text);
-  display: inline-flex;
-  position: relative;
-}
-.theme-switcher[data-theme-mode=system] .theme-switcher__system-mode {
-  display: flex;
-}
-.theme-switcher[data-theme-mode=light] .theme-switcher__light-mode {
-  display: flex;
-}
-.theme-switcher[data-theme-mode=dark] .theme-switcher__dark-mode {
-  display: flex;
-}
-.theme-switcher button {
-  display: none;
-}
-.theme-switcher button > * {
-  pointer-events: none;
-}
-
-.heading {
-  margin-block-end: 3rem;
-}
-.heading > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.heading > * + * {
-  margin-block-start: 0.5rem;
-}
-.heading--center {
-  text-align: center;
-}
-.heading--center .heading__description {
-  margin-inline: auto;
-}
-.heading__title {
-  font-size: clamp(2.1rem, 2vw + 1rem, 3rem);
-}
-.heading__description {
-  font-size: clamp(1rem, 0.5rem + 1vw, 1.25rem);
-  line-height: var(--spruce-line-height-md);
-  max-inline-size: 50ch;
-}
-
-.breadcrumb-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  align-items: center;
-  display: flex;
-  max-inline-size: 100%;
-  overflow-x: auto;
-  white-space: nowrap;
-}
-.breadcrumb-list > li {
-  align-items: center;
-  display: inline-flex;
-  margin-block: 0;
-}
-.breadcrumb-list > li + li::before {
-  block-size: 0.4em;
-  border-block-end: 2px solid var(--spruce-breadcrumb-color-separator);
-  border-inline-end: 2px solid var(--spruce-breadcrumb-color-separator);
-  content: "";
-  display: inline-flex;
-  inline-size: 0.4em;
-  margin-inline: 0.75em;
-  transform: rotate(-45deg);
-}
-[dir=rtl] .breadcrumb-list > li + li::before {
-  transform: rotate(45deg);
-}
-
-.breadcrumb-list [aria-current=page] {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  display: inline-block;
-  max-inline-size: 20ch;
-  text-align: start;
-}
-
-.accordion-list > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.accordion-list > * + * {
-  margin-block-start: 1rem;
-}
-
-.getting-started-card {
-  position: relative;
-  align-items: flex-start;
-  background-color: var(--spruce-base-color-background);
-  border-radius: var(--spruce-border-radius-lg);
-  display: flex;
-  gap: 1.5rem;
-}
-.getting-started-card__link::before {
-  content: "";
-  inset: 0;
-  position: absolute;
-}
-
-.getting-started-card__caption > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.getting-started-card__caption > * + * {
-  margin-block-start: 0.5rem;
-}
-.getting-started-card picture {
-  --size: 5rem;
-  block-size: var(--size);
-  flex-shrink: 0;
-  inline-size: var(--size);
-}
-.getting-started-card__link {
-  font-size: var(--spruce-font-size-sm);
-  font-weight: 700;
-  text-decoration: none;
-  text-transform: uppercase;
-}
-
-.accordion-card {
-  background-color: var(--spruce-base-color-background);
-  border: 1px solid var(--spruce-base-color-border);
-  border-radius: var(--spruce-border-radius-lg);
-}
-.accordion-card__title {
-  font-size: clamp(1.0625rem, 2vw + 1rem, 1.25rem);
-  margin-block: 0;
-  padding: 1.5rem;
-}
-.accordion-card__title:has(.accordion-card__toggle) {
-  padding: 0;
-}
-.accordion-card__toggle {
-  background: none;
-  border: 0;
-  color: inherit;
-  cursor: pointer;
-  font: inherit;
-  outline: inherit;
-  padding: 0;
-  align-items: center;
-  display: flex;
-  gap: 1.5rem;
-  inline-size: 100%;
-  justify-content: space-between;
-  padding: 1.5rem;
-  text-align: start;
-}
-.accordion-card__toggle:focus-visible .accordion-card__icon {
-  outline: 2px solid var(--spruce-btn-color-primary-background);
-  outline-offset: 2px;
-}
-.accordion-card__toggle[aria-expanded=true] svg {
-  rotate: 90deg;
-}
-.accordion-card__toggle[aria-expanded=true] .horizontal-line {
-  opacity: 0;
-}
-.accordion-card__icon {
-  --size: 1.75rem;
-  align-items: center;
-  background-color: var(--spruce-btn-color-primary-background);
-  block-size: var(--size);
-  border-radius: var(--spruce-border-radius-sm);
-  color: var(--spruce-btn-color-primary-foreground);
-  display: flex;
-  flex-shrink: 0;
-  inline-size: var(--size);
-  justify-content: center;
-}
-.accordion-card__icon svg {
-  --size: 1.25rem;
-  transition-duration: var(--spruce-duration);
-  transition-property: all;
-  transition-timing-function: var(--spruce-timing-function);
-  block-size: var(--size);
-  inline-size: var(--size);
-}
-.accordion-card__icon .horizontal-line {
-  transition-duration: var(--spruce-duration);
-  transition-property: all;
-  transition-timing-function: var(--spruce-timing-function);
-}
-.accordion-card__content {
-  transition-duration: var(--spruce-duration);
-  transition-property: grid-template-rows;
-  transition-timing-function: var(--spruce-timing-function);
-  display: grid;
-  padding-inline: 1.5rem;
-}
-.accordion-card__content[aria-hidden=true] {
-  grid-template-rows: 0fr;
-}
-.accordion-card__content[aria-hidden=false] {
-  grid-template-rows: 1fr;
-  padding-block-end: 1.5rem;
-}
-.accordion-card__content > div {
-  overflow: hidden;
-}
-.accordion-card__content > div > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.accordion-card__content > div > * + * {
-  margin-block-start: 0.5rem;
-}
-.accordion-card__content > div * + h2,
-.accordion-card__content > div * + h3,
-.accordion-card__content > div * + h4,
-.accordion-card__content > div * + h5 {
-  margin-block-start: 1rem;
-}
-
-.blog-card {
-  position: relative;
-}
-.blog-card__link::before {
-  content: "";
-  inset: 0;
-  position: absolute;
-}
-
-.blog-card > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.blog-card > * + * {
-  margin-block-start: 1rem;
-}
-.blog-card picture,
-.blog-card img {
-  border-radius: var(--doc-border-radius-sm);
-}
-.blog-card__meta {
-  column-gap: 1.5rem;
-  display: flex;
-  flex-wrap: wrap;
-  row-gap: 0.5rem;
-}
-.blog-card__meta a {
-  position: relative;
-  z-index: 10;
-}
-.blog-card__title {
-  font-size: clamp(1.328125rem, 2vw + 1rem, 1.5625rem);
-  margin-block-start: 0.5rem;
-}
-.blog-card__link {
-  color: var(--spruce-base-color-heading);
-  text-decoration: none;
-}
-.blog-card__link:hover, .blog-card__link:focus {
-  color: var(--spruce-base-color-heading);
-}
-.blog-card .tags__title {
-  block-size: 1px !important;
-  border: 0 !important;
-  clip: rect(0, 0, 0, 0) !important;
-  inline-size: 1px !important;
-  margin: -1px !important;
-  overflow: hidden !important;
-  padding: 0 !important;
-  position: absolute !important;
-  white-space: nowrap !important;
-}
-
-.template-card {
-  position: relative;
-}
-.template-card__link::before {
-  content: "";
-  inset: 0;
-  position: absolute;
-}
-
-.template-card > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.template-card > * + * {
-  margin-block-start: 0.5rem;
-}
-.template-card__title {
-  font-size: clamp(1.875rem, 2vw + 1rem, 2.5rem);
-  margin-block-start: 2rem;
-}
-.template-card__link {
-  color: var(--spruce-base-color-heading);
-  text-decoration: none;
-}
-.template-card__link:hover, .template-card__link:focus {
-  color: var(--spruce-base-color-heading);
-}
-.template-card__description {
-  font-size: clamp(0.99rem, 1vw + 0.55rem, 1.2rem);
-}
-.template-card__meta {
-  column-gap: 1.5rem;
-  display: flex;
-  flex-wrap: wrap;
-  margin-block-start: 1rem;
-  row-gap: 0.5rem;
-}
-.template-card__tags {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1rem;
-}
-
-.color-card {
-  align-items: start;
-  display: flex;
-  gap: 1.5rem;
-}
-.color-card--bordered .color-card__color {
-  box-shadow: 0 0 0 1px var(--spruce-base-color-border) inset;
-}
-.color-card__color {
-  block-size: 3rem;
-  border-radius: var(--spruce-border-radius-lg);
-  flex-shrink: 0;
-  inline-size: 3rem;
-}
-.color-card__caption {
-  display: flex;
-  flex-direction: column;
-  line-height: var(--spruce-line-height-md);
-}
-.color-card__name {
-  color: var(--spruce-base-color-heading);
-  font-weight: 700;
-}
-.color-card__value {
-  font-weight: 300;
-}
-
-.post-author {
-  --avatar-size: 2.5rem;
-  align-items: center;
-  display: flex;
-  gap: 0.5rem;
-  text-decoration: none;
-}
-.post-author__avatar {
-  block-size: var(--avatar-size);
-  border-radius: calc(var(--avatar-size) / 2);
-  inline-size: var(--avatar-size);
-}
-.post-author__name {
-  color: var(--spruce-base-color-text);
-}
-
-.text-btn {
-  align-items: center;
-  display: inline-flex;
-  gap: 0.25rem;
-  line-height: 1;
-}
-.text-btn__icon {
-  --dimension: 0.65em;
-  block-size: var(--dimension);
-  inline-size: var(--dimension);
-}
-
-.form-group-wrapper > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.form-group-wrapper > * + * {
-  margin-block-start: 1rem;
-}
-
-.pagination a {
-  --spruce-border-radius: 0.425rem;
-  --spruce-border-width: 1px;
-  --spruce-font-size: 1rem;
-  --spruce-font-weight: 500;
-  --spruce-gap: 0.5rem;
-  --spruce-icon-padding: 0.75em;
-  --spruce-icon-size: 1em;
-  --spruce-padding: 0.75em 1em;
-  --spruce-shadow-size: 0.25rem;
-  align-items: center;
-  border-radius: var(--spruce-border-radius);
-  border-style: solid;
-  border-width: var(--spruce-border-width);
-  cursor: pointer;
-  display: inline-flex;
-  font-size: var(--spruce-font-size);
-  font-weight: var(--spruce-font-weight);
-  gap: var(--spruce-gap);
-  justify-content: center;
-  line-height: 1;
-  padding: var(--spruce-padding);
-  text-align: start;
-  text-decoration: none;
-  transition-duration: var(--spruce-duration);
-  transition-property: background-color, border-color, box-shadow, color;
-  transition-timing-function: var(--spruce-timing-function);
-}
-
-.pagination a:focus {
-  outline-color: transparent;
-  outline-style: solid;
-}
-
-.pagination a:disabled {
-  opacity: 0.5;
-  pointer-events: none;
-}
-
-.pagination a--sm {
-  --spruce-font-size: 0.8rem;
-  --spruce-gap: 0.25rem;
-  --spruce-icon-padding: 0.5em;
-  --spruce-icon-size: 0.8rem;
-  --spruce-padding: 0.5em 0.75em;
-  font-size: var(--spruce-font-size);
-  gap: var(--spruce-gap);
-  padding: var(--spruce-padding);
-}
-
-.pagination a--lg {
-  --spruce-font-size: 1.15rem;
-  --spruce-gap: 0.5rem;
-  --spruce-icon-padding: 0.9em;
-  --spruce-padding: 0.9em 1.15em;
-}
-
-.pagination a--block {
-  inline-size: 100%;
-}
-
-.pagination {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1rem;
-  justify-content: center;
-  margin-block-start: 3rem;
-}
-.pagination > * + * {
-  margin-block-start: 0;
-}
-.pagination a {
-  background-color: var(--spruce-btn-color-pagination-background);
-  border-color: var(--spruce-btn-color-pagination-background);
-  color: var(--spruce-btn-color-pagination-foreground);
-  --spruce-padding: 1em 1.25em;
-  border-radius: var(--doc-border-radius-md);
-  font-size: 0.91375rem;
-  font-weight: 700;
-  text-transform: uppercase;
-}
-.pagination a:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-pagination-focus-ring);
-  outline-offset: 2px;
-}
-.pagination a:hover {
-  background-color: var(--spruce-btn-color-pagination-background-hover);
-  border-color: var(--spruce-btn-color-pagination-background-hover);
-  color: var(--spruce-btn-color-pagination-foreground-hover);
-}
-.pagination a[aria-current=page] {
-  background: var(--spruce-btn-color-pagination-background-hover);
-  border-color: var(--spruce-btn-color-pagination-background-hover);
-  color: var(--spruce-btn-color-pagination-foreground-hover);
-}
-.pagination a--sm {
-  min-inline-size: 1.75rem;
-}
-
-.template-preview {
-  background-color: hsl(0, 0%, 97%);
-  border-radius: var(--doc-border-radius-sm);
-  display: flex;
-  padding: clamp(1rem, 5vw, 2rem);
-}
-.template-preview img {
-  border-radius: var(--doc-border-radius-sm);
-  box-shadow: 0 0 1.25rem hsla(0, 0%, 0%, 0.05);
-}
-
-.template-tag {
-  background-color: var(--spruce-btn-color-dark-background);
-  border-radius: var(--spruce-border-radius-sm);
-  color: var(--spruce-btn-color-dark-foreground);
-  font-size: var(--spruce-font-size-sm);
-  font-weight: 700;
-  padding: 0.25rem 1rem;
-  text-transform: uppercase;
-}
-.template-tag--free {
-  background-color: #dbffed;
-  color: #005c2e;
-}
-
-.template-actions {
-  --columns: 1;
-  display: grid;
-  gap: 1.5rem;
-  grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
-}
-@media (min-width: 64em) {
-  .template-actions {
-    --columns: 2;
-  }
-}
-
-.template-meta {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  border: 1px solid var(--spruce-base-color-border);
-  border-radius: var(--spruce-border-radius-sm);
-  padding: 1.5rem;
-}
-.template-meta > * + * {
-  border-block-start: 1px dashed var(--spruce-base-color-border);
-  margin-block-start: 1rem;
-  padding-block-start: 1rem;
-}
-.template-meta__item {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1.5rem;
-  justify-content: space-between;
-}
-.template-meta__item--tags {
-  justify-content: end;
-}
-.template-meta__item strong {
-  color: var(--spruce-base-color-heading);
-}
-
-.notification {
-  border-radius: var(--spruce-border-radius-sm);
-  display: block;
-  font-size: 1rem;
-  padding: 1rem 1.5rem;
-  position: relative;
-}
-.notification code,
-.notification kbd,
-.notification samp {
-  border: 1px solid;
-}
-.notification--info {
-  background-color: rgba(0, 161, 214, 0.1);
-  border-block-start: 0.5rem solid var(--spruce-alert-color-info);
-}
-.notification--info .notification__icon {
-  color: var(--spruce-alert-color-info);
-}
-.notification--info code,
-.notification--info kbd,
-.notification--info samp {
-  border-color: rgba(0, 161, 214, 0.5);
-}
-.notification--good {
-  background-color: rgba(0, 168, 84, 0.1);
-  border-block-start: 0.5rem solid var(--spruce-alert-color-success);
-}
-.notification--good .notification__icon {
-  color: var(--spruce-alert-color-success);
-}
-.notification--good code,
-.notification--good kbd,
-.notification--good samp {
-  border-color: rgba(0, 168, 84, 0.5);
-}
-.notification--bad {
-  background-color: rgba(219, 41, 41, 0.1);
-  border-block-start: 0.5rem solid var(--spruce-alert-color-danger);
-}
-.notification--bad .notification__icon {
-  color: var(--spruce-alert-color-danger);
-}
-.notification--bad code,
-.notification--bad kbd,
-.notification--bad samp {
-  border-color: rgba(219, 41, 41, 0.5);
-}
-.notification__content > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.notification__content > * + * {
-  margin-block-start: 0.25rem;
-}
-.notification__icon {
-  background-color: var(--spruce-base-color-background);
-  block-size: 2rem;
-  border: 4px solid var(--spruce-base-color-background);
-  border-radius: 1rem;
-  inline-size: 2rem;
-  inset: calc(-1rem - 4px) -1rem auto auto;
-  position: absolute;
-}
-
-.tags {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem;
-}
-.tags__title {
-  margin-block: 0;
-}
-.tags__list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem;
-}
-.tags__list > * + * {
-  margin-block-start: 0;
-}
-
-.ide-wrapper {
-  margin-inline: auto;
-  max-inline-size: 74rem;
-  padding-block-end: var(--spruce-section-gap);
-}
-
-.ide {
-  background-color: var(--spruce-base-color-background);
-  border: 1px solid var(--spruce-base-color-border);
-  border-radius: var(--doc-border-radius-md);
-  box-shadow: 0 0 3rem hsla(0, 0%, 0%, 0.1);
-  font-size: 0.9375rem;
-  margin-inline: auto;
-}
-.ide__header {
-  align-items: center;
-  background-color: var(--spruce-ide-color-header-background);
-  border-block-end: 1px solid var(--spruce-base-color-border);
-  border-radius: var(--doc-border-radius-md) var(--doc-border-radius-md) 0 0;
-  display: flex;
-  gap: 1rem;
-  padding: 0.45rem 1.25rem;
-}
-.ide__controls {
-  display: flex;
-  gap: 0.5rem;
-}
-.ide__control {
-  --dimension: 0.75rem;
-  block-size: var(--dimension);
-  border-radius: 50%;
-  inline-size: var(--dimension);
-}
-.ide__inner {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr);
-  overflow: hidden;
-  position: relative;
-}
-@media (min-width: 64em) {
-  .ide__inner {
-    grid-template-columns: minmax(0, 16.5rem) minmax(0, 1fr);
-  }
-}
-.ide__toggle {
-  border-end-start-radius: 0 !important;
-  border-start-end-radius: 0 !important;
-  inset: auto 0 0 auto;
-  position: absolute;
-}
-@media (min-width: 64em) {
-  .ide__toggle {
-    display: none;
-    position: relative;
-  }
-}
-.ide__sidebar {
-  background-color: var(--spruce-base-color-background);
-  border-end-end-radius: var(--doc-border-radius-md);
-  border-end-start-radius: var(--doc-border-radius-md);
-  inset: 0 0 0 auto;
-  position: absolute;
-  z-index: 2;
-}
-@media (min-width: 64em) {
-  .ide__sidebar {
-    border-end-end-radius: 0;
-    position: relative;
-  }
-}
-.ide__sidebar-helper {
-  block-size: 100%;
-  overflow-y: auto;
-  padding: 2rem;
-}
-.ide__sidebar-helper > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.ide__sidebar-helper > * + * {
-  margin-block-start: 1rem;
-}
-@media (min-width: 64em) {
-  .ide__sidebar-helper {
-    display: block !important;
-  }
-}
-.ide__editor, .ide__editor > pre, .ide__editor > pre > code {
-  block-size: 100%;
-  border-end-start-radius: var(--doc-border-radius-md);
-  margin-block: 0;
-  max-block-size: 28rem;
-}
-@media (min-width: 64em) {
-  .ide__editor, .ide__editor > pre, .ide__editor > pre > code {
-    border-end-start-radius: 0;
-  }
-}
-.ide pre[class*=language-] {
-  border-radius: 0 0 var(--doc-border-radius-md);
-  padding: 2rem 2.25rem;
-}
-
-.ide-section {
-  display: flex;
-  flex-direction: column;
-  gap: 0.85em;
-}
-.ide-section__title {
-  align-items: center;
-  display: flex;
-  font-size: 0.9375rem;
-  font-weight: 700;
-  gap: 0.5rem;
-  line-height: 1;
-  margin-block: 0;
-}
-.ide-section__title svg {
-  --dimension: 0.9rem;
-  block-size: var(--dimension);
-  color: hsl(207, 90%, 61%);
-  flex-shrink: 0;
-  inline-size: var(--dimension);
-}
-.ide-section__list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-.ide-section__list > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.ide-section__list > * + * {
-  margin-block-start: 0.85em;
-}
-.ide-section__list--border {
-  border-inline-start: 1px solid var(--spruce-base-color-border);
-  margin-inline-start: 0.5rem;
-  padding-inline-start: 1rem;
-}
-.ide-section button {
-  align-items: center;
-  background: none;
-  border: 0;
-  cursor: pointer;
-  display: flex;
-  font-family: var(--doc-heading-font-family);
-  gap: 0.5rem;
-  line-height: 1;
-  padding: 0;
-  text-align: start;
-}
-.ide-section button svg {
-  --dimension: 0.85rem;
-  block-size: var(--dimension);
-  color: hsl(330, 53%, 60%);
-  flex-shrink: 0;
-  inline-size: var(--dimension);
-}
-.ide-section .active {
-  color: var(--spruce-base-color-heading);
-  font-weight: 700;
-}
-
-.code-tab {
-  border: 1px solid var(--spruce-base-color-border);
-  border-radius: var(--spruce-border-radius-sm);
-  overflow: hidden;
-}
-.code-tab__header {
-  align-items: center;
-  background-color: var(--spruce-base-color-code-tab-background);
-  border-block-end: 1px solid var(--spruce-base-color-border);
-  border-start-end-radius: var(--spruce-border-radius-sm);
-  border-start-start-radius: var(--spruce-border-radius-sm);
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.5rem 1.5rem;
-  justify-content: space-between;
-  padding: 1rem;
-}
-.code-tab__title {
-  color: var(--spruce-base-color-heading);
-  font-family: var(--spruce-font-family-heading);
-  font-size: 1rem;
-  font-weight: var(--spruce-font-weight-heading);
-  line-height: var(--spruce-line-height-heading);
-  margin-block: 0;
-}
-.code-tab__open-new {
-  align-items: center;
-  display: flex;
-  font-size: var(--spruce-font-size-sm);
-  gap: 0.5rem;
-  line-height: 1;
-}
-.code-tab__open-new svg {
-  block-size: 0.85em;
-  inline-size: 0.85em;
-}
-.code-tab__group {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.25rem 0.5rem;
-}
-.code-tab__group > * + * {
-  margin-block-start: 0;
-}
-.code-tab__group--title {
-  gap: 0.25rem 1rem;
-}
-@media (min-width: 48em) {
-  .code-tab__group--tabs {
-    margin-inline-start: auto;
-  }
-}
-.code-tab__group--tabs li {
-  display: inline-flex;
-}
-.code-tab__body [class^=language-] {
-  margin-block: 0;
-  max-block-size: 40rem;
-}
-.code-tab__body iframe {
-  border: 0;
-}
-
-.preview {
-  border: 1px solid var(--spruce-base-color-border);
-  border-radius: var(--spruce-border-radius-sm);
-  font-size: 1rem;
-  padding: 1.5rem;
-}
-.preview > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.preview > * + * {
-  margin-block-start: 1.5rem !important;
-}
-.preview > * {
-  font-family: var(--spruce-font-family-base);
-}
-.preview ul > li > p {
-  margin-block: 0;
-}
-
-.button-grid {
-  align-items: flex-start;
-  display: flex;
-  gap: 1.5rem;
-}
-.button-grid--stacked {
-  flex-wrap: wrap;
-}
-
-.inline-text-element-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-.inline-text-element-list > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.inline-text-element-list > * + * {
-  margin-block-start: 1rem;
-}
-@media (min-width: 48em) {
-  .inline-text-element-list {
-    column-gap: 3rem;
-    columns: 2 auto;
-  }
-}
-
-.sidebar-section__title {
-  color: var(--spruce-base-color-heading);
-  font-size: var(--spruce-font-size-base);
-  margin-block: 0;
-}
-.sidebar-section__navigation {
-  border-inline-start: 1px solid var(--spruce-base-color-border);
-  font-size: 1rem;
-  margin-block-start: 1rem;
-  padding-inline-start: 1rem;
-}
-.sidebar-section__navigation ul {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-.sidebar-section__navigation ul > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.sidebar-section__navigation ul > * + * {
-  margin-block-start: 0.65rem;
-}
-.sidebar-section__navigation li {
-  line-height: var(--spruce-line-height-md);
-}
-.sidebar-section__navigation a {
-  color: var(--spruce-base-color-text);
-  text-decoration: none;
-}
-.sidebar-section__navigation a[data-state=active] {
-  color: var(--spruce-base-color-heading);
-  font-weight: 700;
-  position: relative;
-}
-.sidebar-section__navigation a[data-state=active]::before {
-  background-color: var(--spruce-base-color-primary);
-  border-radius: 0 var(--spruce-border-radius-sm) var(--spruce-border-radius-sm) 0;
-  content: "";
-  inline-size: 0.3rem;
-  inset-block: 0;
-  inset-inline-start: -1rem;
-  position: absolute;
-}
-
-@media (min-width: 80em) {
-  .toc {
-    max-block-size: calc(100vh - 4rem);
-    overflow-x: hidden;
-    overflow-y: auto;
-  }
-  .toc::-webkit-scrollbar {
-    block-size: 0.5rem;
-    inline-size: 0.5rem;
-  }
-  .toc::-webkit-scrollbar-thumb {
-    background: var(--spruce-scrollbar-color-thumb-background);
-    border-radius: var(--spruce-border-radius-sm);
-  }
-  .toc::-webkit-scrollbar-thumb:hover {
-    background: var(--spruce-scrollbar-color-thumb-background-hover);
-  }
-  .toc::-webkit-scrollbar-track {
-    background: var(--spruce-scrollbar-color-track-background);
-    border-radius: var(--spruce-border-radius-sm);
-  }
-}
-.toc__title {
-  color: var(--spruce-base-color-heading);
-  font-size: var(--spruce-font-size-base);
-  margin-block: 0;
-}
-.toc__navigation {
-  border-inline-start: 1px solid var(--spruce-base-color-border);
-  margin-block-start: 1rem;
-  padding-inline-start: 1rem;
-}
-.toc__navigation ol {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  max-inline-size: 95%;
-}
-.toc__navigation ol > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.toc__navigation ol > * + * {
-  margin-block-start: 0.5rem;
-}
-.toc__navigation .toc-level-h3 a {
-  padding-inline-start: 1rem;
-}
-.toc__navigation a {
-  color: var(--spruce-base-color-text);
-  display: inline-flex;
-  line-height: var(--spruce-line-height-md);
-  text-decoration: none;
-}
-.toc__navigation a:hover {
-  color: var(--spruce-base-color-primary);
-}
-.toc__navigation .active {
-  color: var(--spruce-base-color-heading);
-  font-weight: 700;
-  position: relative;
-}
-.toc__navigation .active::before {
-  background-color: var(--spruce-base-color-primary);
-  border-radius: 0 var(--spruce-border-radius-sm) var(--spruce-border-radius-sm) 0;
-  content: "";
-  inline-size: 0.3rem;
-  inset-block: 0;
-  inset-inline-start: -1rem;
-  position: absolute;
-}
-
-.post-navigation {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1.5rem;
-  justify-content: space-between;
-}
-
-.post-navigation-item {
-  align-items: center;
-  display: flex;
-  gap: 1rem;
-  text-decoration: none;
-}
-.post-navigation-item:hover .post-navigation-item__icon {
-  background-color: var(--spruce-navigation-color-icon-background-hover);
-  color: var(--spruce-navigation-color-icon-foreground-hover);
-}
-.post-navigation-item--next {
-  margin-inline-start: auto;
-  text-align: end;
-}
-.post-navigation-item__icon {
-  transition-duration: var(--spruce-duration);
-  transition-property: all;
-  transition-timing-function: var(--spruce-timing-function);
-  align-items: center;
-  background-color: var(--spruce-navigation-color-icon-background);
-  block-size: 3rem;
-  border-radius: var(--doc-border-radius-md);
-  color: var(--spruce-navigation-color-icon-foreground);
-  display: flex;
-  flex-shrink: 0;
-  inline-size: 3rem;
-  justify-content: center;
-}
-.post-navigation-item__icon svg {
-  --size: 1.15rem;
-  block-size: var(--size);
-  inline-size: var(--size);
-}
-[dir=rtl] .post-navigation-item__icon svg {
-  transform: rotate(180deg);
-}
-
-.post-navigation-item__caption {
-  color: var(--spruce-base-color-text);
-  line-height: var(--spruce-line-height-md);
-}
-.post-navigation-item__title {
-  color: var(--spruce-base-color-primary);
-  display: flex;
-  font-weight: 700;
-}
-
-code[class*=language-],
-pre[class*=language-] {
-  border-radius: var(--spruce-border-radius-sm);
-  color: var(--spruce-prism-color-color);
-  font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
-  font-size: 0.9375rem;
-  hyphens: none;
-  line-height: 1.5;
-  tab-size: 4;
-  text-align: left;
-  white-space: pre;
-  word-break: normal;
-  word-spacing: normal;
-  word-wrap: normal;
-}
-
-@media print {
-  code[class*=language-],
-  pre[class*=language-] {
-    text-shadow: none;
-  }
-}
-/* Code blocks */
-pre[class*=language-] {
-  display: grid;
-  overflow: auto;
-  padding: 1.5rem;
-}
-
-pre[class*=language-] code {
-  background-color: transparent;
-  padding: 0;
-}
-
-:not(pre) > code[class*=language-],
-pre[class*=language-] {
-  background: var(--spruce-prism-color-background);
-  overflow-x: auto;
-}
-
-.token.comment,
-.token.prolog,
-.token.cdata {
-  color: var(--spruce-prism-color-comment);
-  font-style: italic;
-}
-
-.token.punctuation {
-  color: var(--spruce-prism-color-punctuation);
-}
-
-.namespace {
-  color: var(--spruce-prism-color-namespace);
-}
-
-.token.deleted {
-  color: var(--spruce-prism-color-deleted);
-  font-style: italic;
-}
-
-.token.symbol,
-.token.operator,
-.token.keyword,
-.token.property {
-  color: var(--spruce-prism-color-namespace);
-}
-
-.token.tag {
-  color: var(--spruce-prism-color-punctuation);
-}
-
-.token.boolean {
-  color: var(--spruce-prism-color-boolean);
-}
-
-.token.number {
-  color: var(--spruce-prism-color-number);
-}
-
-.token.constant,
-.token.builtin,
-.token.string,
-.token.url,
-.token.entity,
-.language-css .token.string,
-.style .token.string,
-.token.char {
-  color: var(--spruce-prism-color-constant);
-}
-
-.token.selector,
-.token.function,
-.token.doctype {
-  color: var(--spruce-prism-color-punctuation);
-  font-style: italic;
-}
-
-.token.attr-name,
-.token.inserted {
-  color: var(--spruce-prism-color-constant);
-  font-style: italic;
-}
-
-.token.class-name,
-.token.atrule {
-  color: var(--spruce-prism-color-class-name);
-}
-
-.token.regex,
-.token.important,
-.token.variable {
-  color: var(--spruce-prism-color-regex);
-}
-
-.token.important,
-.token.bold {
-  font-weight: bold;
-}
-
-.token.italic {
-  font-style: italic;
-}
-
-.anchor-heading {
-  align-items: center;
-  display: flex;
-  gap: 1rem;
-  justify-content: space-between;
-  position: relative;
-}
-.anchor-heading:hover .anchor-heading__link, .anchor-heading:focus-within .anchor-heading__link {
-  opacity: 1;
-}
-.anchor-heading h2,
-.anchor-heading h3 {
-  margin-block: 0;
-}
-.anchor-heading__link {
-  transition-duration: var(--spruce-duration);
-  transition-property: all;
-  transition-timing-function: var(--spruce-timing-function);
-  display: inline-flex;
-  flex-shrink: 0;
-  opacity: 0;
-}
-.anchor-heading__link svg {
-  --size: 0.65em;
-  block-size: var(--size);
-  inline-size: var(--size);
-}
-
-.site-header {
-  position: relative;
-  z-index: 10;
-}
-.site-header__inner {
-  --block-size: 5rem;
-  align-items: center;
-  block-size: var(--block-size);
-  display: flex;
-  flex-wrap: wrap;
-  gap: clamp(0.5rem, 3vw, 3rem);
-  justify-content: space-between;
-}
-@media (min-width: 64em) {
-  .site-header__inner {
-    --block-size: 6rem;
-  }
-}
-.site-header__logo {
-  align-items: center;
-  display: flex;
-}
-.site-header__logo a {
-  display: inline-flex;
-}
-.site-header__logo svg {
-  block-size: 1.725rem;
-  bottom: -0.1em;
-  inline-size: auto;
-  position: relative;
-}
-.site-header__logo--ui svg {
-  block-size: 2.1rem;
-}
-.site-header__column {
-  align-items: center;
-  display: flex;
-  flex-grow: 1;
-  gap: clamp(1rem, 5vw, 3rem);
-}
-.site-header__actions {
-  display: flex;
-  gap: 1rem;
-}
-.site-header__actions .btn:last-child {
-  display: none;
-}
-@media (min-width: 64em) {
-  .site-header__actions .btn:last-child {
-    display: inline-flex;
-  }
-}
-.site-header__navigation {
-  margin-inline-start: auto;
-}
-@media (min-width: 64em) {
-  .site-header__navigation {
-    margin-inline-start: 0;
-  }
-}
-.site-header__navigation ul {
-  border-block-start: 1px solid var(--spruce-base-color-border);
-}
-@media (min-width: 64em) {
-  .site-header__navigation ul {
-    border-block-start: none;
-  }
-}
-
-.hero-wrapper {
-  background: linear-gradient(0deg, var(--spruce-hero-color-gradient-start) 0%, var(--spruce-hero-color-gradient-end) 100%);
-}
-
-.hero__caption {
-  margin-inline: auto;
-  max-inline-size: 52rem;
-  padding-block: var(--spruce-section-gap-half);
-  text-align: center;
-}
-@media (min-width: 64em) {
-  .hero__caption {
-    padding-block: calc(var(--spruce-section-gap-half) / 1.25) var(--spruce-section-gap-half);
-  }
-}
-.hero__note {
-  background-color: var(--spruce-hero-color-note-background);
-  border-radius: var(--spruce-border-radius-sm);
-  -webkit-box-decoration-break: clone;
-  box-decoration-break: clone;
-  color: var(--spruce-hero-color-note-color);
-  display: inline;
-  font-size: 1rem;
-  isolation: isolate;
-  line-height: var(--spruce-line-height-md);
-  padding: 0.5em 0.8em 0.5em 0.65em;
-  text-decoration: none;
-}
-.hero__note:hover, .hero__note:focus {
-  color: var(--spruce-hero-color-note-color);
-}
-.hero__note svg {
-  --size: 1em;
-  block-size: var(--size);
-  color: hsl(45, 100%, 50%);
-  inline-size: var(--size);
-  inset-block-end: -0.15em;
-  position: relative;
-}
-.hero__note + * {
-  margin-block-start: 1.5rem !important;
-}
-.hero__title {
-  font-size: clamp(2.75rem, 4vw + 1rem, 5rem);
-  font-weight: 400;
-  letter-spacing: -0.035em;
-  margin-block: 0;
-  margin-inline: auto;
-  max-inline-size: 15ch;
-  text-wrap: balance;
-}
-.hero__title span {
-  font-weight: 700;
-}
-.hero__description {
-  font-size: clamp(0.945rem, 1vw + 0.85rem, 1.35rem);
-  margin-block: 1.25rem 0;
-  margin-inline: auto;
-  max-inline-size: 45ch;
-}
-.hero__btns {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1.5rem;
-  justify-content: center;
-  margin-top: 2.15rem;
-}
-
-.post-heading {
-  align-items: center;
-  display: grid;
-  gap: 1rem;
-  grid-template-columns: minmax(0, 1fr);
-  justify-content: center;
-  padding-block: clamp(3rem, 10vw, 5rem) clamp(4.5rem, 10vw, 7rem);
-  text-align: center;
-}
-@media (min-width: 64em) {
-  .post-heading {
-    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
-    justify-content: flex-start;
-    text-align: start;
-  }
-}
-.post-heading--center {
-  grid-template-columns: minmax(0, 1fr);
-  justify-content: center;
-  padding-block: clamp(5rem, 10vw + 1rem, 7rem) 4.5rem;
-  text-align: center;
-}
-.post-heading--center .breadcrumb-list {
-  margin-inline: auto;
-}
-.post-heading--center .post-heading__title {
-  font-size: clamp(2.55rem, 4vw + 1rem, 4.25rem);
-  margin-inline: auto;
-}
-.post-heading--center .post-heading__description {
-  margin-inline: auto;
-}
-.post-heading__title {
-  font-size: clamp(2.4rem, 4vw + 1rem, 4rem);
-  letter-spacing: -2px;
-  line-height: 1;
-  margin-block: 0;
-  max-inline-size: 20ch;
-  text-wrap: balance;
-}
-.post-heading__breadcrumb {
-  display: flex;
-  margin-block-start: 1rem;
-}
-.post-heading__description {
-  font-size: clamp(0.875rem, 1vw + 0.75rem, 1.25rem);
-  margin: 1.5rem 0 0;
-  margin-block: 0;
-  max-inline-size: 50ch;
-  text-wrap: balance;
-}
-.post-heading__meta {
-  align-items: center;
-  column-gap: 1.5rem;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  margin-block-start: 3rem;
-  row-gap: 0.5rem;
-}
-
-.post-content > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.post-content > * + * {
-  margin-block-start: 1.5rem;
-}
-@media (min-width: 64em) {
-  .post-content {
-    font-size: 1.0375rem;
-  }
-}
-.post-content--blog :is(dd, dl, dl, h1, h2, h3, h4, h5, h6, hr, ul, ol, p:not(p:has(img)), blockquote, form, pre, [class*=language-], .notification, .anchor-heading) {
-  inline-size: 100%;
-  margin-inline: auto;
-  max-inline-size: 45rem;
-}
-.post-content * + h2,
-.post-content * + h3,
-.post-content * + .anchor-heading {
-  margin-block-start: 3rem;
-}
-.post-content img,
-.post-content iframe {
-  border-radius: var(--doc-border-radius-sm);
-}
-.post-content iframe {
-  aspect-ratio: 16/10;
-  block-size: auto;
-  inline-size: 100;
-}
-.post-content > picture:first-child + * {
-  margin-block-start: 3rem;
-}
-.post-content .anchor-heading h2,
-.post-content .anchor-heading h3 {
-  scroll-margin-top: 1.5rem;
-}
-.post-content pre[class*=language-] {
-  position: relative;
-}
-.post-content pre[class*=language-]::before {
-  border-radius: 0 0 var(--spruce-border-radius-sm) var(--spruce-border-radius-sm);
-  color: var(--spruce-prism-color-comment);
-  content: attr(data-language);
-  display: inline-block;
-  font-family: var(--doc-heading-font-family);
-  font-size: 0.6rem;
-  font-weight: 500;
-  inset: 1rem 1rem auto auto;
-  line-height: 1;
-  pointer-events: none;
-  position: absolute;
-  text-transform: uppercase;
-}
-.post-content a[href*=youtube] img {
-  aspect-ratio: 16/9;
-  inline-size: 100%;
-  object-fit: cover;
-  object-position: center;
-}
-
-.cta {
-  background-color: var(--spruce-footer-color-background);
-  border-block-end: 1px solid hsla(0, 0%, 100%, 0.08);
-  padding-block: var(--spruce-section-gap-half);
-}
-.cta__inner {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 1.5rem 3rem;
-  justify-content: space-between;
-}
-.cta__caption > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.cta__caption > * + * {
-  margin-block-start: 1rem;
-}
-.cta .heading {
-  margin-block-end: 0;
-}
-.cta * {
-  color: hsl(0, 0%, 100%);
-}
-.cta p {
-  font-size: clamp(1.02rem, 2vw + 1rem, 1.2rem);
-  max-inline-size: 55ch;
-}
-
-.site-footer {
-  background-color: var(--spruce-footer-color-background);
-  color: hsla(0, 0%, 100%, 0.85);
-  font-size: 1rem;
-}
-.site-footer a {
-  color: hsl(261, 54%, 70%);
-}
-.site-footer a:hover, .site-footer a:focus {
-  color: #b8a1e3;
-}
-.site-footer__slogen {
-  color: hsl(0, 0%, 100%);
-  font-family: var(--doc-heading-font-family);
-  font-size: clamp(2.1rem, 4vw + 1rem, 3rem);
-  font-weight: 700;
-  grid-auto-rows: auto;
-  line-height: calc(var(--spruce-line-height-heading) * 1.15);
-  margin-block: 0 2rem;
-}
-.site-footer__top {
-  --gtc: minmax(0, 1fr);
-  display: grid;
-  gap: 3rem;
-  grid-template-columns: var(--gtc);
-  padding-block: var(--spruce-section-gap);
-}
-@media (min-width: 64em) {
-  .site-footer__top {
-    --gtc: minmax(0, 2.5fr) repeat(3, minmax(0, 1fr));
-  }
-}
-.site-footer__logo {
-  display: inline-flex;
-  opacity: 0.15;
-}
-.site-footer__logo svg {
-  block-size: auto;
-  inline-size: 2.5rem;
-}
-.site-footer__title {
-  color: hsl(0, 0%, 100%);
-  font-size: clamp(1.0625rem, 2vw + 1rem, 1.25rem);
-  margin-block: 0 1.5rem;
-}
-.site-footer strong {
-  color: hsl(0, 0%, 100%);
-}
-.site-footer__navigation {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-  font-size: 1rem;
-}
-.site-footer__navigation > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.site-footer__navigation > * + * {
-  margin-block-start: 0.5rem;
-}
-.site-footer__navigation a {
-  color: hsla(0, 0%, 100%, 0.85);
-  text-decoration: none;
-}
-.site-footer__navigation a:hover, .site-footer__navigation a:focus, .site-footer__navigation a:active, .site-footer__navigation a[aria-current=page] {
-  color: #b8a1e3;
-}
-.site-footer__navigation a[aria-current=page] {
-  font-weight: 700;
-}
-.site-footer__navigation a span {
-  margin-inline-end: 0.5rem;
-}
-.site-footer__bottom {
-  border-block-start: 1px solid hsla(0, 0%, 100%, 0.08);
-  display: flex;
-  flex-direction: column;
-  gap: 1rem 1.5rem;
-  padding-block: clamp(1.5rem, 5vw, 3rem);
-}
-@media (min-width: 64em) {
-  .site-footer__bottom {
-    align-items: center;
-    flex-direction: row;
-    justify-content: space-between;
-  }
-}
-.site-footer__cone-logo {
-  align-items: center;
-  display: inline-flex;
-  margin-inline-end: 0.5rem;
-}
-.site-footer__cone-logo svg {
-  --size: 1.5rem;
-  block-size: var(--size);
-  inline-size: var(--size);
-}
-.site-footer__copyright {
-  margin-block: 0;
-}
-
-.container {
-  --inline-size: var(--spruce-container-inline-size);
-  --gap: clamp(1.5rem, 5vw, 3rem);
-  inline-size: 100%;
-  margin-inline: auto;
-  max-inline-size: var(--inline-size);
-  padding-inline: var(--gap);
-}
-.container--narrow {
-  --inline-size: 60rem;
-}
-.container--narrower {
-  --inline-size: 50rem;
-}
-
-.l-documentation {
-  padding-block: clamp(1.5rem, 5vw, 3rem) clamp(3rem, 5vw, 4.5rem);
-}
-.l-documentation--code {
-  padding-block: 0 clamp(3rem, 5vw, 4.5rem);
-}
-.l-documentation__inner {
-  display: grid;
-  gap: 4.5rem;
-  grid-template-columns: minmax(0, 1fr);
-}
-@media (min-width: 48em) {
-  .l-documentation__inner {
-    grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
-  }
-}
-@media (min-width: 64em) {
-  .l-documentation__inner {
-    grid-template-columns: minmax(0, 16.5rem) minmax(0, 1fr);
-  }
-}
-.l-documentation__sidebar {
-  inset-block-start: 2rem;
-  overflow-y: auto;
-  padding-inline-end: 1.5rem;
-}
-.l-documentation__sidebar > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.l-documentation__sidebar > * + * {
-  margin-block-start: 1.5rem;
-}
-.l-documentation__sidebar::-webkit-scrollbar {
-  block-size: 0.5rem;
-  inline-size: 0.5rem;
-}
-.l-documentation__sidebar::-webkit-scrollbar-thumb {
-  background: var(--spruce-scrollbar-color-thumb-background);
-  border-radius: 0.15rem;
-}
-.l-documentation__sidebar::-webkit-scrollbar-thumb:hover {
-  background: var(--spruce-scrollbar-color-thumb-background-hover);
-}
-.l-documentation__sidebar::-webkit-scrollbar-track {
-  background: var(--spruce-scrollbar-color-track-background);
-  border-radius: 0.15rem;
-}
-@media (min-width: 48em) {
-  .l-documentation__sidebar {
-    max-block-size: calc(100vh - 4rem);
-    position: sticky;
-  }
-}
-.l-documentation__body-helper {
-  order: -1;
-}
-@media (min-width: 48em) {
-  .l-documentation__body-helper {
-    order: 2;
-  }
-}
-.l-documentation__body {
-  column-gap: 4.5rem;
-  display: grid;
-  grid-auto-rows: min-content;
-  grid-template-columns: minmax(0, 1fr);
-  row-gap: 1.5rem;
-}
-@media (min-width: 80em) {
-  .l-documentation__body {
-    grid-template-columns: minmax(0, 1fr) minmax(0, 15rem);
-  }
-}
-.l-documentation__table-of-content {
-  inset-block-start: 2rem;
-  margin-inline: auto;
-  max-inline-size: 45rem;
-  position: sticky;
-}
-@media (min-width: 80em) {
-  .l-documentation__table-of-content-helper {
-    grid-column: 2/3;
-    order: 2;
-  }
-}
-@media (min-width: 80em) {
-  .l-documentation__content {
-    grid-column: 1/2;
-  }
-}
-.l-documentation__content .post-content {
-  margin-inline: auto;
-  max-inline-size: 45rem;
-}
-.l-documentation__title {
-  font-size: clamp(2.3925rem, 3vw + 1rem, 3.3rem);
-  margin-block: 0;
-  margin-inline: auto;
-  max-inline-size: 45rem;
-}
-@media (min-width: 80em) {
-  .l-documentation__title {
-    grid-column: 1/2;
-  }
-}
-.l-documentation__navigation-top {
-  border-block-end: 1px solid var(--spruce-base-color-border);
-  margin-block-end: clamp(3rem, 5vw, 4.5rem);
-  padding-block: 1.5rem;
-}
-.l-documentation__navigation-bottom {
-  border-block-start: 1px solid var(--spruce-base-color-border);
-  margin-block-start: 4.5rem;
-  padding-block-start: 1.5rem;
-}
-
-.l-post__inner {
-  display: flex;
-  flex-direction: column;
-  padding-block-end: var(--spruce-section-gap);
-}
-
-.l-faq {
-  padding-block: var(--spruce-section-gap-half) var(--spruce-section-gap);
-}
-
-.l-getting-started {
-  padding-block: 3rem;
-}
-.l-getting-started--border-block-end {
-  border-block-end: 1px solid var(--spruce-base-color-border);
-}
-.l-getting-started--border-block-start {
-  border-block-start: 1px solid var(--spruce-base-color-border);
-}
-.l-getting-started__inner {
-  align-items: flex-start;
-  display: grid;
-  gap: 3rem;
-}
-@supports (inline-size: min(20rem, 100%)) {
-  .l-getting-started__inner {
-    grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
-  }
-}
-
-.l-blog {
-  padding-block: 0 clamp(4.5rem, 8vw, 7rem);
-}
-.l-blog__inner {
-  --column: 1;
-  display: grid;
-  gap: 3rem;
-  grid-template-columns: repeat(var(--column), minmax(0, 2fr));
-}
-@media (min-width: 48em) {
-  .l-blog__inner {
-    --column: 2;
-  }
-}
-@media (min-width: 80em) {
-  .l-blog__inner {
-    --column: 3;
-  }
-}
-
-.l-template {
-  padding-block: 0 clamp(4.5rem, 8vw, 7rem);
-}
-.l-template__inner {
-  display: grid;
-  gap: clamp(3rem, 5vw, 4.5rem);
-  grid-template-columns: minmax(0, 2fr);
-  margin-block-start: clamp(4.5rem, 5vw, 7rem);
-}
-@media (min-width: 64em) {
-  .l-template__inner {
-    grid-template-columns: minmax(0, 2fr) 28rem;
-  }
-}
-@media (min-width: 80em) {
-  .l-template__inner {
-    grid-template-columns: minmax(0, 2fr) 32rem;
-  }
-}
-.l-template__sidebar {
-  order: -1;
-}
-.l-template__sidebar > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.l-template__sidebar > * + * {
-  margin-block-start: 3rem;
-}
-@media (min-width: 64em) {
-  .l-template__sidebar {
-    order: 0;
-  }
-}
-.l-template__previews {
-  display: flex;
-  flex-direction: column;
-  gap: 3rem;
-}
-@media (min-width: 64em) {
-  .l-template__previews {
-    flex-direction: row;
-  }
-}
-.l-template__preview {
-  background-color: hsl(0, 0%, 97%);
-  border-radius: var(--spruce-border-radius-sm);
-  padding: 2rem;
-}
-.l-template__preview img {
-  border-radius: var(--spruce-border-radius-sm);
-  box-shadow: 0 0 1.25rem hsla(0, 0%, 0%, 0.05);
-}
-
-.l-color > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.l-color > * + * {
-  margin-block-start: 1.5rem;
-}
-.l-color__inner {
-  display: grid;
-  gap: 1.5rem;
-}
-@supports (inline-size: min(15rem, 100%)) {
-  .l-color__inner {
-    grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
-  }
-}
-.l-color + .l-color {
-  margin-block-start: 3rem;
-}
-
-.l-templates {
-  padding-block: 0 clamp(4.5rem, 8vw, 7rem);
-}
-.l-templates__inner {
-  --columns: 1;
-  display: grid;
-  gap: 3rem;
-  grid-template-columns: repeat(var(--columns), minmax(0, 2fr));
-}
-@media (min-width: 48em) {
-  .l-templates__inner {
-    --columns: 2;
-  }
-}
-
-.l-404 {
-  border-block-end: 1px solid var(--spruce-base-color-border);
-  padding-block: var(--spruce-section-gap);
-}
-.l-404__inner {
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-  text-align: center;
-}
-.l-404__image {
-  margin-inline: auto;
-  max-inline-size: 12rem;
-}
-.l-404__caption {
-  margin-inline: auto;
-  max-inline-size: 40rem;
-  text-align: center;
-  text-wrap: balance;
-}
-.l-404__caption > * {
-  margin-block-end: 0;
-  margin-block-start: 0;
-}
-.l-404__caption > * + * {
-  margin-block-start: 1.5rem;
-}
-.l-404__title {
-  font-size: clamp(2.275rem, 5vw + 1rem, 3.5rem);
-}
-
-.btn--rounded {
-  border-radius: var(--doc-border-radius-md);
-}
-
-.btn--rounded:not(.btn--icon) {
-  font-size: 0.91375rem;
-  font-weight: 700;
-  text-transform: uppercase;
-}
-
-.btn--rounded.btn--lg {
-  padding: 1.05em 1.25em;
-}
-@media (min-width: 64em) {
-  .btn--rounded.btn--lg {
-    padding: 1.25em 1.5em;
-  }
-}
-
-.btn--install {
-  background-color: var(--spruce-btn-color-install-background);
-  border-color: var(--spruce-btn-color-install-background);
-  color: var(--spruce-btn-color-install-foreground);
-}
-.btn--install:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-install-background);
-  outline-offset: 2px;
-}
-.btn--install:hover {
-  background-color: var(--spruce-btn-color-install-background-hover);
-  border-color: var(--spruce-btn-color-install-background-hover);
-  color: var(--spruce-btn-color-install-foreground);
-}
-
-.btn--decline {
-  background-color: var(--spruce-btn-color-decline-background);
-  border-color: var(--spruce-btn-color-decline-background);
-  color: var(--spruce-btn-color-decline-foreground);
-}
-.btn--decline:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-decline-background);
-  outline-offset: 2px;
-}
-.btn--decline:hover {
-  background-color: #0b1319;
-  border-color: #0b1319;
-  color: var(--spruce-btn-color-decline-foreground);
-}
-
-.btn--discrete {
-  background-color: var(--spruce-btn-color-discrete-background);
-  border-color: var(--spruce-btn-color-discrete-background);
-  color: var(--spruce-btn-color-discrete-foreground);
-}
-.btn--discrete:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-discrete-background);
-  outline-offset: 2px;
-}
-.btn--discrete:hover {
-  background-color: var(--spruce-btn-color-discrete-background-hover);
-  border-color: var(--spruce-btn-color-discrete-background-hover);
-  color: var(--spruce-btn-color-discrete-foreground-hover);
-}
-
-.btn--dark {
-  background-color: var(--spruce-btn-color-dark-background);
-  border-color: var(--spruce-btn-color-dark-background);
-  color: var(--spruce-btn-color-dark-foreground);
-}
-.btn--dark:focus-visible {
-  outline: 2px solid var(--spruce-btn-color-dark-background);
-  outline-offset: 2px;
-}
-.btn--dark:hover {
-  background-color: var(--spruce-btn-color-dark-background-hover);
-  border-color: var(--spruce-btn-color-dark-background-hover);
-  color: var(--spruce-btn-color-dark-foreground);
-}
-
-.table--font-size-reset {
-  font-size: 1rem;
-}
-.table th,
-.table td {
-  min-inline-size: 10rem;
-}
-
-.m-block\:0 {
-  margin-block: 0 !important;
-}
-
-:root {
-  --spruce-section-gap: clamp(5rem, 8vw, 9rem);
-  --spruce-section-gap-half: clamp(3.5rem, 8vw, 6rem);
-}
-
-body {
-  --doc-heading-font-family: "Figtree", sans-serif;
-  --doc-body-font-family: "Inter", sans-serif;
-  --doc-border-radius-sm: 0.5rem;
-  --doc-border-radius-md: 0.925rem;
-  --doc-border-radius-lg: 2rem;
-  font-family: var(--doc-body-font-family);
-  overflow-x: hidden;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-family: var(--doc-heading-font-family);
-}
-
-[x-cloak] {
-  display: none !important;
-}