diff --git a/.vscode/settings.json b/.vscode/settings.json
index a156c6e1..66152ddb 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -5,5 +5,8 @@
     "mcss",
     "tera"
   ],
-  "workbench.preferredDarkColorTheme": "GitHub Dark"
+  "workbench.preferredDarkColorTheme": "GitHub Dark",
+  "search.exclude": {
+    "**/dist": true
+  }
 }
diff --git a/dist/css/elements.form.css b/dist/css/elements.form.css
index 8cb1ca16..bc91b889 100644
--- a/dist/css/elements.form.css
+++ b/dist/css/elements.form.css
@@ -48,9 +48,9 @@ datalist {
 }
 
 fieldset {
-  border: 1px solid var(--ui-border-color);
-  border-radius: var(--radius-lg);
-  padding: var(--sm3);
+  border: var(--fieldset-border-width) solid var(--fieldset-border-color);
+  border-radius: var(--fieldset-border-radius);
+  padding: var(--fieldset-padding);
 
   ul:has([type="checkbox"], [type="radio"]) {
     padding-inline-start: 0;
@@ -82,7 +82,7 @@ input {
     border-radius: var(--input-border-radius);
   }
   &:where(:not([type="file"])) {
-    border: 1px solid var(--ui-border-color);
+    border: var(--input-border-width) solid var(--input-border-color);
   }
   &[type="file"] {
     width: 100%;
@@ -96,7 +96,7 @@ input {
 label {
   display: block;
   &:has(+ :is(input, select, textarea)) {
-    margin-bottom: var(--xs1);
+    margin-bottom: var(--label-spacing);
   }
 }
 
@@ -113,19 +113,13 @@ legend {
 }
 
 meter {
-  --meter-height: var(--sm1);
-  --meter-radius: var(--radius-md);
-  --meter-color-track: var(--primary-100);
-  --meter-color-low: var(--no-400);
-  --meter-color-med: var(--maybe-400);
-  --meter-color-high: var(--yes-400);
   width: 100%;
-  background: var(--meter-color-track);
-  border-radius: var(--meter-radius);
+  background: var(--meter-track-color);
+  border-radius: var(--meter-border-radius);
   height: var(--meter-height);
   /* webkit */
   &::-webkit-meter-bar {
-    background: var(--meter-color-track);
+    background: var(--meter-track-color);
   }
   &::-webkit-meter-bar,
   &::-webkit-meter-optimum-value,
@@ -133,26 +127,26 @@ meter {
   &::-webkit-meter-even-less-good-value {
     height: var(--meter-height);
     border: none;
-    border-radius: var(--meter-radius);
+    border-radius: var(--meter-border-radius);
   }
   &::-webkit-meter-even-less-good-value {
-    background: var(--meter-color-low);
+    background: var(--meter-low-color);
   }
   &::-webkit-meter-suboptimum-value {
-    background: var(--meter-color-med);
+    background: var(--meter-medium-color);
   }
   &::-webkit-meter-optimum-value {
-    background: var(--meter-color-high);
+    background: var(--meter-high-color);
   }
   /* mozilla */
   &:-moz-meter-sub-sub-optimum::-moz-meter-bar {
-    background: var(--meter-color-low);
+    background: var(--meter-low-color);
   }
   &:-moz-meter-sub-optimum::-moz-meter-bar {
-    background: var(--meter-color-med);
+    background: var(--meter-medium-color);
   }
   &:-moz-meter-optimum::-moz-meter-bar {
-    background: var(--meter-color-high);
+    background: var(--meter-high-color);
   }
 }
 
@@ -166,43 +160,39 @@ output {
 }
 
 progress {
-  --progress-height: var(--sm1);
-  --progress-color: var(--primary-500);
-  --progress-track-color: var(--primary-100);
-  --progress-radius: var(--radius-md);
   appearance: none;
   width: 100%;
   /* mozilla */
   height: var(--progress-height);
   background: var(--progress-track-color);
-  border-radius: var(--progress-radius);
+  border-radius: var(--progress-border-radius);
   border: none;
   &::-moz-progress-bar {
     background: var(--progress-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
   }
   /* webkit */
   &::-webkit-progress-bar {
     width: 100%;
     background: var(--progress-track-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
     height: var(--progress-height);
   }
   &::-webkit-progress-value {
     background: var(--progress-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
   }
 }
 
 select {
-  --icon-size: 24px;
-  --split: calc(100% - var(--icon-size));
+  /* derived, stays local */
+  --split: calc(100% - var(--select-icon-size));
   display: flex;
   appearance: none;
   height: var(--input-height);
   padding: var(--xs1) calc(var(--input-padding) + var(--md1)) var(--xs1)
     var(--input-padding);
-  border: 1px solid var(--ui-border-color);
+  border: var(--input-border-width) solid var(--input-border-color);
   border-radius: var(--input-border-radius);
   background: linear-gradient(
     to right,
@@ -210,10 +200,10 @@ select {
     var(--text-color) var(--split) 100%
   );
   mask-image:
-    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E"),
+    var(--select-icon),
     linear-gradient(to right, transparent calc(var(--split) - 1px), red 0),
     linear-gradient(red 0 0);
-  mask-size: var(--icon-size), auto, auto;
+  mask-size: var(--select-icon-size), auto, auto;
   mask-position:
     calc(100% - var(--xs1)) center,
     0 0,
@@ -249,9 +239,9 @@ select {
 
 textarea {
   width: 100%;
-  padding: var(--xs3);
+  padding: var(--input-padding);
   border-radius: var(--input-border-radius);
-  border: 1px solid var(--ui-border-color);
+  border: var(--input-border-width) solid var(--input-border-color);
   resize: vertical;
   &:not([rows]) {
     min-height: 6em;
diff --git a/dist/css/elements.interactive.css b/dist/css/elements.interactive.css
index 69eb3aa3..556b63c0 100644
--- a/dist/css/elements.interactive.css
+++ b/dist/css/elements.interactive.css
@@ -30,12 +30,12 @@ xxl: 1920px
 dialog {
   /* body scrolling is stopped by adding .body-is-locked on <dialog> */
   /* But it can be added to any element. See elements.sectioning.css > body { … }  */
-  min-width: var(--tera1);
-  max-width: var(--tera3);
-  padding: var(--lg1) var(--md1);
-  border: 1px solid light-dark(var(--base-200), var(--base-800));
-  background-color: light-dark(var(--base-50), var(--base-900));
-  border-radius: var(--radius-lg);
+  min-width: var(--dialog-min-width);
+  max-width: var(--dialog-max-width);
+  padding: var(--dialog-padding);
+  border: var(--dialog-border-width) solid var(--dialog-border-color);
+  background-color: var(--dialog-background-color);
+  border-radius: var(--dialog-border-radius);
 
   &::backdrop {
     background: var(--dialog-backdrop-color);
@@ -45,7 +45,9 @@ dialog {
   [aria-label="close pop-up"] {
     position: absolute;
     top: var(--xs3);
-    right: var(--xs3); /* deliberately physical: close button pinned to a visual corner */
+    right: var(
+      --xs3
+    ); /* deliberately physical: close button pinned to a visual corner */
     background: transparent;
     border: none;
     outline: none;
@@ -59,10 +61,10 @@ dialog {
 }
 
 details {
-  padding: var(--sm1) var(--sm1);
-  border: 1px solid light-dark(var(--base-200), var(--base-800));
-  background-color: light-dark(var(--base-50), var(--base-900));
-  border-radius: var(--radius-lg);
+  padding: var(--details-padding);
+  border: var(--details-border-width) solid var(--details-border-color);
+  background-color: var(--details-background-color);
+  border-radius: var(--details-border-radius);
   cursor: pointer;
 
   summary {
@@ -74,15 +76,21 @@ details {
     }
     &::after {
       content: "";
-      width: 24px;
-      height: 24px;
-      background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E") no-repeat;
-      transition: var(--transition);
+      width: var(--details-icon-size);
+      height: var(--details-icon-size);
+      /* icon as a mask painted with the text color, so it follows the
+         color scheme (an SVG in background-image can't see currentColor
+         and always renders black) */
+      background-color: currentColor;
+      mask-image: var(--details-icon);
+      mask-size: contain;
+      mask-repeat: no-repeat;
+      transition: transform var(--transition);
     }
   }
 
   &[open] > summary {
-    margin-bottom: var(--xs3);
+    margin-bottom: var(--details-spacing);
     &::after {
       transform: rotate(180deg);
     }
diff --git a/dist/css/elements.media.css b/dist/css/elements.media.css
index 103e5098..f9538b04 100644
--- a/dist/css/elements.media.css
+++ b/dist/css/elements.media.css
@@ -70,18 +70,18 @@ figure {
   /* caption at bottom or top */
   &:has(* + figcaption) {
     figcaption {
-      margin-top: var(--xs2);
+      margin-top: var(--figcaption-spacing);
     }
   }
   &:has(figcaption + *) {
     figcaption {
-      margin-bottom: var(--xs2);
+      margin-bottom: var(--figcaption-spacing);
     }
   }
 }
 
 iframe {
-  border: 1px solid var(--ui-border-color);
+  border: var(--border-sm) solid var(--ui-border-color);
 }
 
 img {
diff --git a/dist/css/elements.sectioning.css b/dist/css/elements.sectioning.css
index 3307445b..c79973f6 100644
--- a/dist/css/elements.sectioning.css
+++ b/dist/css/elements.sectioning.css
@@ -38,7 +38,7 @@ body {
   background-color: var(--body-background-color);
   color: var(--text-color);
   font-family: var(--text);
-  line-height: 1.5;
+  line-height: var(--body-line-height);
 
   /* for elements like dialog etc. that require scrolling turned off */
   &:has(.body-is-locked) {
diff --git a/dist/css/elements.table.css b/dist/css/elements.table.css
index b540e4ea..9374349a 100644
--- a/dist/css/elements.table.css
+++ b/dist/css/elements.table.css
@@ -29,7 +29,7 @@ xxl: 1920px
 
 caption {
   caption-side: bottom;
-  margin-top: var(--xs3);
+  margin-top: var(--table-caption-spacing);
   font-size: var(--text-sm);
 }
 
@@ -38,7 +38,7 @@ colgroup {
 
 table {
   border-spacing: 0;
-  border: 1px solid var(--table-border-color);
+  border: var(--table-border-width) solid var(--table-border-color);
   border-radius: var(--table-border-radius);
   background-color: var(--table-background-color);
 }
@@ -47,8 +47,8 @@ th,
 td {
   text-align: start;
   padding: var(--table-padding);
-  border-bottom: 1px solid var(--table-border-color);
-  border-inline-start: 1px solid var(--table-border-color);
+  border-bottom: var(--table-border-width) solid var(--table-border-color);
+  border-inline-start: var(--table-border-width) solid var(--table-border-color);
 }
 
 tr {
@@ -73,7 +73,7 @@ tbody {
 tfoot {
   th,
   td {
-    border-top: 1px solid var(--table-border-color);
+    border-top: var(--table-border-width) solid var(--table-border-color);
     border-bottom-width: 0;
   }
 }
diff --git a/dist/css/elements.text.css b/dist/css/elements.text.css
index a7052b90..1e9e09ff 100644
--- a/dist/css/elements.text.css
+++ b/dist/css/elements.text.css
@@ -37,7 +37,7 @@ xxl: 1920px
 }
 
 a {
-  font-weight: var(--semi-bold);
+  font-weight: var(--link-font-weight);
   color: var(--link-color);
   &:where(:hover) {
     color: var(--link-color-hover);
@@ -76,8 +76,8 @@ abbr {
     width: var(--sm1);
     height: var(--sm1);
     display: inline-block;
-    content: '';
-    background:  url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
+    content: "";
+    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
     background-size: contain;
   }
   &:hover:before {
@@ -101,22 +101,22 @@ b {
 blockquote {
   position: relative;
   margin-bottom: var(--prose-spacing);
-  padding-block: var(--sm1);
+  padding-block: var(--blockquote-padding-block);
   /* extra inline-start room for the accent bar */
-  padding-inline: var(--md1) var(--sm3);
+  padding-inline: var(--blockquote-padding-inline);
   font-style: italic;
-  background-color: light-dark(var(--primary-50), var(--primary-900));
-  border-radius: var(--radius-md);
+  background-color: var(--blockquote-background-color);
+  border-radius: var(--blockquote-border-radius);
   &::before {
-    content: '';
+    content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;
-    width: var(--xs2);
+    width: var(--blockquote-accent-width);
     height: 100%;
-    border-start-start-radius: var(--radius-md);
-    border-end-start-radius: var(--radius-md);
-    background-image: linear-gradient(var(--primary-800), var(--primary-500));
+    border-start-start-radius: var(--blockquote-border-radius);
+    border-end-start-radius: var(--blockquote-border-radius);
+    background: var(--blockquote-accent-color);
   }
 
   p {
@@ -139,17 +139,19 @@ cite {
   font-style: italic;
 }
 
-code, var, kbd {
+code,
+var,
+kbd {
   font-family: var(--mono);
   font-size: 0.9em;
   font-style: normal;
-  color: light-dark(var(--base-500), var(--base-300));
+  color: var(--text-code-muted-color);
 }
 
 :is(code, var, kbd):not(h1 *, h2 *, h3 *, h4 *, h5 *, h6 *, pre *) {
   padding: 0.15em 0.3em;
   color: var(--text-code-color);
-  background-color:  var(--text-code-background-color);
+  background-color: var(--text-code-background-color);
   border-radius: var(--radius-sm);
 }
 
@@ -167,11 +169,11 @@ dd {
 }
 
 dd + dt {
-  margin-top: .5em;
+  margin-top: 0.5em;
 }
 
 del {
-  text-decoration-color: var(--no-500);
+  text-decoration-color: var(--danger-500);
   text-decoration-style: wavy;
 }
 
@@ -184,81 +186,95 @@ em {
 /* figcaption and figure are in elements.media.css */
 
 /* Technically, headings should be in elements.sectioning but I'm guessing that's where most people would expect this to be */
-h1, .h1,
-h2, .h2,
-h3, .h3,
-h4, .h4,
-h5, .h5,
-h6, .h6 {
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3,
+h4,
+.h4,
+h5,
+.h5,
+h6,
+.h6 {
   overflow-wrap: break-word; /* Avoid text overflows */
   text-wrap: balance;
 }
 
-h1, .h1,
-h2, .h2,
-h3, .h3,
-h4, .h4 {
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3,
+h4,
+.h4 {
   font-family: var(--heading-font);
   font-weight: var(--heading-weight);
-  line-height: var(--heading-line-height);
+  letter-spacing: var(--heading-letter-spacing);
 }
 
-h1, .h1,
-h2, .h2,
-h3, .h3 {
-  margin-bottom: var(--sm1);
+h1,
+.h1 {
+  margin-bottom: var(--heading-spacing-h1);
+  font-size: var(--heading-font-size-h1);
+  line-height: var(--heading-line-height-h1);
 }
 
-h4, .h4 {
-  margin-bottom: var(--sm2);
+h2,
+.h2 {
+  margin-bottom: var(--heading-spacing-h2);
+  font-size: var(--heading-font-size-h2);
+  line-height: var(--heading-line-height-h2);
 }
 
-h5, .h5,
-h6, .h6 {
-  margin-bottom: var(--xs2);
+h3,
+.h3 {
+  margin-bottom: var(--heading-spacing-h3);
+  font-size: var(--heading-font-size-h3);
+  line-height: var(--heading-line-height-h3);
 }
 
-/* h1—h3 that has h2—h4 right after gets a smaller margin bottom */
-:where(h1, h2, h3):has(+ :is(h2, h3, h4)) {
-  margin-bottom: var(--sm2);
-}
-
-h1, .h1 {
-  font-size: var(--heading-1);
-}
-
-h2, .h2 {
-  font-size: var(--heading-2);
+h4,
+.h4 {
+  margin-bottom: var(--heading-spacing-h4);
+  font-size: var(--heading-font-size-h4);
+  line-height: var(--heading-line-height-h4);
 }
 
-h3, .h3 {
-  font-size: var(--heading-3);
+h5,
+.h5 {
+  margin-bottom: var(--heading-spacing-h5);
+  font-size: var(--heading-font-size-h5);
+  line-height: var(--heading-line-height-h5);
 }
 
-h4, .h4 {
-  font-size: var(--heading-4);
+h6,
+.h6 {
+  margin-bottom: var(--heading-spacing-h6);
+  font-size: var(--heading-font-size-h6);
+  line-height: var(--heading-line-height-h6);
 }
 
-h5, .h5 {
-  font-size: var(--heading-5);
-}
-
-h6, .h6 {
-  font-size: var(--heading-6);
+/* h1—h3 with a h2—h4 subheading right after gets the consecutive margin
+   (must come after the per-level rules: it ties them on specificity, so
+   source order decides) */
+:where(h1, h2, h3):has(+ :is(h2, h3, h4)) {
+  margin-bottom: var(--heading-spacing-consecutive);
 }
 
 hr {
-  --content: "";
   display: flex;
   justify-content: center;
   align-items: center;
   height: 0;
   border-style: solid;
-  border-width: 1px 0 0;
+  border-width: var(--border-sm) 0 0;
   color: var(--ui-border-color);
   overflow: visible;
   &::after {
-    content: var(--content);
+    content: var(--hr-content);
     padding: 0 var(--xs1);
     line-height: 1;
     letter-spacing: var(--tracking-sm);
@@ -270,15 +286,13 @@ hr {
   margin-bottom: var(--prose-spacing);
 }
 
-
 i {
 }
 
 ins {
   padding: 0.15em 0.3em;
-  /* pastel bg stays light in both modes, so pin a dark text color */
-  color: var(--base-950);
-  background-color: var(--yes-200);
+  color: var(--ins-color);
+  background-color: var(--ins-background-color);
   border-radius: var(--radius-sm);
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -309,7 +323,7 @@ p {
 
 pre {
   font-family: var(--mono);
-  font-size: 0.9rem;
+  font-size: var(--pre-font-size);
   white-space: pre-wrap; /* override overflow default */
   border-radius: var(--pre-border-radius);
 }
diff --git a/dist/css/help.devtools.css b/dist/css/help.devtools.css
index dc6ed300..fb0a305f 100644
--- a/dist/css/help.devtools.css
+++ b/dist/css/help.devtools.css
@@ -27,13 +27,11 @@ xxl: 1920px
 @layer helpers {
 /* DEV TOOLS */
 
-/* Debug-only helpers, inert unless you add the classes yourself.
-   !important is intentional and required in the helpers layer: a debug
-   overlay must win over every other style, including unlayered CSS. */
+/* Debug-only helpers. You have to add the classes yourself. */
 
-/* Baseline grid overlay: add .dev to <body> while checking vertical
-   rhythm (line spacing comes from --baseline in settings.tokens.css). */
+/* Baseline grid overlay: add .dev to <body> while checking vertical rhythm. */
 body.dev {
+  --baseline: 8;
   background-size: 100% calc(var(--baseline) * 1px) !important;
   background-image: linear-gradient(
     to bottom,
@@ -47,7 +45,7 @@ body.dev {
 .dev-error {
   position: fixed !important;
   top: var(--md1) !important;
-  left: var(--md1) !important; /* deliberately physical: debug toast pinned to a visual corner */
+  left: var(--md1) !important;
   z-index: var(--z-top) !important;
   padding: var(--sm1) !important;
   font-size: 1rem !important;
diff --git a/dist/css/settings.tokens.css b/dist/css/settings.tokens.css
index cde3c1dd..efb95a49 100644
--- a/dist/css/settings.tokens.css
+++ b/dist/css/settings.tokens.css
@@ -28,29 +28,23 @@ xxl: 1920px
 /* SETTINGS TOKENS */
 
 /*
-Can't use var() inside media queries, so breakpoints are hard coded in settings.media-queries.css
+Can't use var() inside media queries, so breakpoints are hard coded in
+settings.media-queries.css
 
-xxs: 240px
-xs: 360px
-sm: 480px
-md: 768px
-lg: 1024px
-xl: 1440px
-xxl: 1920px
+xxs: 240px xs: 360px sm: 480px md: 768px lg: 1024px xl: 1440px xxl: 1920px
 */
 
 /*
 
-• Globals
+• Dimensions (Margin, Padding, Width, Height)
+• Aspect Ratios
 
-• Margin
-• Padding
-• Width
-• Height
+• Font Families
+• Font Size
+• Font Weight
 
-• Font size
-• Font weight
-• Line height
+• Letter Spacing
+• Line Height
 
 • Colors
 
@@ -62,7 +56,6 @@ xxl: 1920px
 
 :root {
   /* GLOBALS */
-  --baseline: 8;
 
   /* DIMENSIONS */
 
@@ -135,19 +128,13 @@ xxl: 1920px
   --display-sm: 1.728rem;
   --display-md: 2.074rem;
   --display-lg: 2.488rem;
-  --display-xl: 2.986rem;
+  --display-xl: 2.986rem; /* h1 */
   --display-mega: 3.583rem;
   --display-giga: 4.299rem;
 
-  /* Heading Sizes */
-  /* Fluid: interpolate from a min size (at 480px) to a max size (at 1024px). */
-  /* clamp(MIN, INTERCEPT + SLOPEvw, MAX) — the rem term keeps text zoom working. */
-  --heading-1: clamp(var(--display-md), 1.269rem + 2.682vw, var(--display-xl)); /* 2.074rem → 2.986rem */
-  --heading-2: clamp(var(--display-sm), 1.057rem + 2.235vw, var(--display-lg)); /* 1.728rem → 2.488rem */
-  --heading-3: clamp(var(--text-xl), 0.881rem + 1.865vw, var(--display-md)); /* 1.44rem → 2.074rem */
-  --heading-4: clamp(var(--text-lg), 0.734rem + 1.553vw, var(--display-sm)); /* 1.2rem → 1.728rem */
-  --heading-5: clamp(var(--text-lg), 0.988rem + 0.706vw, var(--text-xl)); /* 1.2rem → 1.44rem */
-  --heading-6: clamp(var(--text-md), 0.824rem + 0.588vw, var(--text-lg)); /* 1rem → 1.2rem */
+  /* Heading font sizes are decisions, not scale steps: they map each
+     heading level onto this scale. See --heading-font-size-* in
+     settings.ui.css. */
 
   /* Font Weights */
   --extra-light: 200;
@@ -164,10 +151,6 @@ xxl: 1920px
   --tracking-xl: 0.075em;
   --tracking-xxl: 0.15em;
 
-  /* TODO add display tracking */
-  --tracking-display-md: 0.5em;
-  --tracking-display-lg: 0.75em;
-
   /* Line Height */
   --leading-xs: 1;
   --leading-sm: 1.15;
@@ -260,11 +243,9 @@ xxl: 1920px
   /* DROP SHADOWS  */
 
   --shadow-sm:
-    0 1px 3px 0 var(--ui-shadow-color),
-    0 1px 2px -1px var(--ui-shadow-color);
+    0 1px 3px 0 var(--ui-shadow-color), 0 1px 2px -1px var(--ui-shadow-color);
   --shadow-md:
-    0 4px 6px -1px var(--ui-shadow-color),
-    0 2px 4px -2px var(--ui-shadow-color);
+    0 4px 6px -1px var(--ui-shadow-color), 0 2px 4px -2px var(--ui-shadow-color);
   --shadow-lg:
     0 8px 13px -3px var(--ui-shadow-color),
     0 4px 6px -4px var(--ui-shadow-color);
diff --git a/dist/css/settings.ui.css b/dist/css/settings.ui.css
index 28f460a1..08a2191b 100644
--- a/dist/css/settings.ui.css
+++ b/dist/css/settings.ui.css
@@ -28,11 +28,26 @@ xxl: 1920px
 /* INTERFACE TOKENS */
 
 /*
-  The abstraction tier between raw tokens (settings.tokens.css) and the
-  framework's rules: semantic aliases plus every component's token defaults.
-  Interface tokens only ever take another token for value; raw values live
-  in settings.tokens.css, and deliberate deviations from these defaults
-  live in a theme file (see theme.default.css).
+  The decisions layer. Every token here is named for what it's FOR (an
+  element, a component, or a shared meaning) and answers "what does this
+  thing use by default". Tokens named for what they ARE (--sm1, --base-500,
+  --bold) are scale tokens and live in settings.tokens.css. That's the
+  whole split: a name that mentions a UI thing belongs here; a name that
+  labels a step on a scale belongs there.
+
+  Values, in order of preference:
+  1. Another interface token, when the meaning is shared
+     (--input-border-color: var(--ui-border-color)).
+  2. A scale token, when the value should follow the system scales
+     (--fieldset-padding: var(--sm3)).
+  3. A raw value, only where following the scales would be wrong:
+     content (separator strings, icon URLs), geometry tuned to one
+     control (--toggle-width), or element-relative measures that track
+     the element's own type instead of the page (em heading spacing).
+     The test: "if a theme retuned the scales, should this follow?"
+
+  Deliberate deviations from these defaults live in a theme file
+  (see theme.default.css).
 */
 
 :root {
@@ -41,9 +56,15 @@ xxl: 1920px
   color-scheme: light dark;
 
   --ui-border-color: light-dark(var(--base-200), var(--base-500));
+  /* Also consumed by the --shadow-* scale in settings.tokens.css: the one
+     reference between the files that runs upward, so shadows can switch
+     with the color scheme. Raw alpha colors: the palettes have no alpha
+     steps. */
   --ui-shadow-color: light-dark(rgb(0 0 0 / 0.1), rgb(0 0 0 / 0.6));
 
-  /* Keyboard focus ring (consumed by :focus-visible in global.a11y.css) */
+  /* Keyboard focus ring (consumed by :focus-visible in global.a11y.css).
+     Raw 2px on purpose: an accessibility affordance that shouldn't move
+     when a theme retunes the decorative border scale. */
   --focus-ring-color: light-dark(var(--primary-500), var(--primary-400));
   --focus-ring-width: 2px;
   --focus-ring-offset: 2px;
@@ -82,27 +103,136 @@ xxl: 1920px
   accent-color: var(--primary-500);
 
   --body-background-color: light-dark(var(--base-0), var(--base-950));
+  --body-line-height: var(--leading-lg);
 
   --input-height: var(--md3);
   --input-padding: var(--xs3);
+  --input-border-width: var(--border-sm);
+  --input-border-color: var(--ui-border-color);
   --input-border-radius: var(--radius-md);
-  --input-border-color-invalid: light-dark(var(--danger-500), var(--danger-400));
+  --input-border-color-invalid: light-dark(
+    var(--danger-500),
+    var(--danger-400)
+  );
 
+  /* Gap under a label that precedes its control */
+  --label-spacing: var(--xs1);
+
+  --fieldset-padding: var(--sm3);
+  --fieldset-border-width: var(--border-sm);
+  --fieldset-border-color: var(--ui-border-color);
+  --fieldset-border-radius: var(--radius-lg);
+
+  /* meter: low/medium/high map to the even-less-good, suboptimum, and
+     optimum pseudo-elements */
+  --meter-height: var(--sm1);
+  --meter-border-radius: var(--radius-md);
+  --meter-track-color: var(--primary-100);
+  --meter-low-color: var(--danger-400);
+  --meter-medium-color: var(--warning-400);
+  --meter-high-color: var(--success-400);
+
+  --progress-height: var(--sm1);
+  --progress-color: var(--primary-500);
+  --progress-track-color: var(--primary-100);
+  --progress-border-radius: var(--radius-md);
+
+  /* select's chevron, applied as a mask painted with the text color;
+     any url() works here, data URL or file */
+  --select-icon-size: var(--sm3);
+  --select-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
+
+  --dialog-min-width: var(--tera1);
+  --dialog-max-width: var(--tera3);
+  --dialog-padding: var(--lg1) var(--md1);
+  --dialog-border-width: var(--border-sm);
+  --dialog-border-color: light-dark(var(--base-200), var(--base-800));
+  --dialog-background-color: light-dark(var(--base-50), var(--base-900));
+  --dialog-border-radius: var(--radius-lg);
   --dialog-backdrop-color: var(--base-950);
   --dialog-backdrop-opacity: var(--o-4);
 
+  /* details: same surface as dialog by default, on purpose but
+     independently overridable. Spacing is the gap between an open
+     summary and its content. */
+  --details-padding: var(--sm1);
+  --details-spacing: var(--xs3);
+  --details-border-width: var(--border-sm);
+  --details-border-color: light-dark(var(--base-200), var(--base-800));
+  --details-background-color: light-dark(var(--base-50), var(--base-900));
+  --details-border-radius: var(--radius-lg);
+  --details-icon-size: var(--sm3);
+  /* Marker icon, applied as a mask painted with the text color; any
+     url() works here, data URL or file */
+  --details-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
+
   --table-padding: var(--xs2) var(--sm1);
+  --table-border-width: var(--border-sm);
   --table-border-color: light-dark(var(--base-100), var(--base-700));
   --table-border-radius: var(--radius-md);
   --table-background-color: none;
+  /* Gap between the table and its caption */
+  --table-caption-spacing: var(--xs3);
+  /* Gap between a figure's content and caption on either side */
+  --figcaption-spacing: var(--xs2);
 
   /* Text */
 
   --heading-font: var(--display);
   --heading-weight: var(--black);
+  --heading-letter-spacing: normal; /* (e.g. -0.02em or var(--tracking-sm)) */
+
+  --heading-font-size-h1: clamp(
+    var(--display-md),
+    1.269rem + 2.682vw,
+    var(--display-xl)
+  ); /* 2.074rem → 2.986rem */
+  --heading-font-size-h2: clamp(
+    var(--display-sm),
+    1.057rem + 2.235vw,
+    var(--display-lg)
+  ); /* 1.728rem → 2.488rem */
+  --heading-font-size-h3: clamp(
+    var(--text-xl),
+    0.881rem + 1.865vw,
+    var(--display-md)
+  ); /* 1.44rem → 2.074rem */
+  --heading-font-size-h4: clamp(
+    var(--text-lg),
+    0.734rem + 1.553vw,
+    var(--display-sm)
+  ); /* 1.2rem → 1.728rem */
+  --heading-font-size-h5: clamp(
+    var(--text-lg),
+    0.988rem + 0.706vw,
+    var(--text-xl)
+  ); /* 1.2rem → 1.44rem */
+  --heading-font-size-h6: clamp(
+    var(--text-md),
+    0.824rem + 0.588vw,
+    var(--text-lg)
+  ); /* 1rem → 1.2rem */
+
   --heading-line-height: var(--leading-sm);
+  --heading-line-height-h1: var(--heading-line-height);
+  --heading-line-height-h2: var(--heading-line-height);
+  --heading-line-height-h3: var(--heading-line-height);
+  --heading-line-height-h4: var(--leading-md);
+  --heading-line-height-h5: var(--leading-md);
+  --heading-line-height-h6: var(--leading-md);
+
+  /* Headings bottom margin  */
+  --heading-spacing-h1: 0.4em;
+  --heading-spacing-h2: 0.4em;
+  --heading-spacing-h3: 0.4em;
+  --heading-spacing-h4: 0.4em;
+  --heading-spacing-h5: 0.4em;
+  --heading-spacing-h6: 0.4em;
+  /* Any h1 before h2, h2 before h3, h3 before h4.  */
+  --heading-spacing-consecutive: 0.3em;
 
   --text-color: light-dark(var(--base-950), var(--base-200));
+  --link-font-weight: var(--semi-bold);
   --link-color: light-dark(var(--primary-600), var(--primary-400));
   --link-color-hover: var(--primary-500);
 
@@ -111,17 +241,42 @@ xxl: 1920px
     var(--primary-100),
     var(--primary-900)
   );
+  /* when code inline styling doesn't apply (inside headings and pre) */
+  --text-code-muted-color: light-dark(var(--base-500), var(--base-300));
 
-  /* Code blocks (bare pre, astro-code, and the site's expressive-code
-     frames all consume this) */
   --pre-border-radius: var(--radius-md);
+  /* matching the 0.9em of inline code */
+  --pre-font-size: 0.9rem;
+
+  --blockquote-padding-block: var(--sm1);
+  --blockquote-padding-inline: var(--md1) var(--sm3);
+  --blockquote-background-color: light-dark(
+    var(--primary-50),
+    var(--primary-900)
+  );
+  --blockquote-border-radius: var(--radius-md);
+  --blockquote-accent-width: var(--xs2);
+  --blockquote-accent-color: linear-gradient(
+    var(--primary-800),
+    var(--primary-500)
+  );
 
   /* .prose related stuff in GLOBAL */
 
+  /* Optional centered label on <hr>, e.g. "***" or a dingbat */
+  --hr-content: "";
+
+  /* ins: background stays light in both light/dark modes */
+  --ins-color: var(--base-950);
+  --ins-background-color: var(--success-200);
+
   --marker-color: var(--highlight-500);
 
   --selection-color: light-dark(var(--base-950), var(--base-0));
-  --selection-background-color: light-dark(var(--primary-200), var(--primary-700));
+  --selection-background-color: light-dark(
+    var(--primary-200),
+    var(--primary-700)
+  );
 }
 
 /* GLOBAL */
@@ -130,19 +285,20 @@ xxl: 1920px
   /* Mobile-first: tighter gutters on small screens, 24px from --md up */
   --grid-column-gap: var(--sm1);
   --grid-row-gap: var(--sm1);
+  @media (width >= 768px) {
+    --grid-column-gap: var(--sm3);
+    --grid-row-gap: var(--sm3);
+  }
 
   --wrap-spacing: var(--sm1);
   --wrap-md-spacing: var(--sm3);
   --wrap-lg-spacing: 0;
-  --wrap-width-sm: minmax(200px, 55ch);
-  --wrap-width-md: minmax(200px, 70ch);
-  --wrap-width-lg: minmax(200px, 900px);
+  /* Widths are measures: ch tracks the text size, so raw on purpose. */
+  --wrap-width-sm: minmax(0, 55ch);
+  --wrap-width-md: minmax(0, 70ch);
+  --wrap-width-lg: minmax(0, 900px);
   --wrap-width: var(--wrap-width-md);
 
-  /* Layout scaffolds (global.layout.css): main column cap for
-     .layout-centered and .layout-docs, aside and TOC column widths.
-     --layout-toc-width takes any grid track size; the 1fr default lets
-     the TOC absorb the leftover space. */
   --layout-content-width: 70ch;
   --layout-aside-width: 245px;
   --layout-toc-width: 1fr;
@@ -150,13 +306,6 @@ xxl: 1920px
   --prose-spacing: var(--sm1);
 }
 
-@media (width >= 768px) {
-  :root {
-    --grid-column-gap: var(--sm3);
-    --grid-row-gap: var(--sm3);
-  }
-}
-
 /* COMPONENTS */
 
 /* Badge */
@@ -193,16 +342,21 @@ xxl: 1920px
 /* (Button defaults and primary button colors) */
 
 :root {
+  /* Optical minimums, deliberately off the spacing scale */
   --bt-min-width: 101px;
   --bt-min-width-md: 123px;
   --bt-min-width-lg: 133px;
+
   --bt-font-size: var(--text-sm);
   --bt-font-size-lg: var(--text-md);
   --bt-font-weight: var(--semi-bold);
+
   --bt-color: var(--text-color);
   --bt-color-hover: light-dark(var(--text-color), var(--base-0));
+
   --bt-background-color: light-dark(var(--base-0), var(--base-800));
   --bt-background-color-hover: light-dark(var(--base-50), var(--base-900));
+
   --bt-border-color: var(--ui-border-color);
   --bt-border-width: var(--border-sm);
   --bt-border-radius: var(--radius-lg);
@@ -265,14 +419,15 @@ xxl: 1920px
   --card-shadow: var(--shadow-md);
   --card-shadow-hover: var(--shadow-xl);
   --card-loading-bg: light-dark(var(--base-200), var(--base-900));
-  /* Default media aspect ratio; the Card component sets it inline from its
-     aspectRatio prop */
+  /* Default media aspect ratio; the Card component pins it inline only
+     when its aspectRatio prop is passed */
   --card-aspect-ratio: var(--ar-golden);
 }
 
 /* Toggle */
 
 :root {
+  /* Drawn-control geometry, deliberately off the scales */
   --toggle-width: 50px;
   --toggle-height: 28px;
   --toggle-border-width: 2px;
@@ -293,8 +448,8 @@ xxl: 1920px
   --field-spacing: var(--xs1);
   --field-hint-color: light-dark(var(--base-400), var(--base-500));
   --field-error-color: light-dark(var(--danger-500), var(--danger-300));
-  /* static = messages in flow under the control; absolute = overlaid below
-     the field (row compositions set this so messages can't move siblings) */
+  /*Field's hint/error position. Use `static` to reflow under, use `absolute`
+  (and leave enough space below) if you don't want any shift on errors */
   --field-message-position: static;
 }
 
@@ -333,8 +488,7 @@ xxl: 1920px
   }
   --header-background-color: light-dark(var(--base-0), var(--base-950));
 
-  /* The mobile menu is an always-dark surface by design, so these are raw
-     palette values on purpose; override them to retheme the menu. */
+  /* The mobile menu is an always-dark  by design */
   --header-menu-background-color: var(--base-950);
   --header-menu-color: var(--base-0);
   --header-menu-color-current: var(--primary-400);
@@ -419,7 +573,10 @@ xxl: 1920px
   --section-header-spacing: var(--lg3);
   --section-eyebrow-color: light-dark(var(--primary-600), var(--primary-400));
   --section-lede-color: light-dark(var(--base-500), var(--base-400));
-  --section-filled-background-color: light-dark(var(--base-50), var(--base-900));
+  --section-filled-background-color: light-dark(
+    var(--base-50),
+    var(--base-900)
+  );
   --section-primary-background-color: light-dark(
     var(--primary-600),
     var(--primary-900)
@@ -448,9 +605,9 @@ xxl: 1920px
   --tags-radius: var(--radius-md);
 }
 
-/* Tiles: no tokens. The container thresholds live in component.tiles.css
-   (container queries can't read custom properties), and --tiles-columns
-   is set there; pin it on a hook class of your own to opt out. */
+/* Tiles has no tokens here: its column count is set by container queries in
+   component.tiles.css since custom properties don't work inside @container.
+*/
 
 /* TOC */
 
@@ -459,7 +616,7 @@ xxl: 1920px
   --toc-color-hover: var(--link-color-hover);
   --toc-spacing: var(--xs1);
   --toc-indentation: var(--xs3);
-  --toc-icon-size: 16px;
+  --toc-icon-size: var(--sm1);
 }
 
 }
diff --git a/dist/mcss.css b/dist/mcss.css
index 250d5821..40ca879c 100644
--- a/dist/mcss.css
+++ b/dist/mcss.css
@@ -44,29 +44,23 @@ xxl: 1920px
 /* SETTINGS TOKENS */
 
 /*
-Can't use var() inside media queries, so breakpoints are hard coded in settings.media-queries.css
+Can't use var() inside media queries, so breakpoints are hard coded in
+settings.media-queries.css
 
-xxs: 240px
-xs: 360px
-sm: 480px
-md: 768px
-lg: 1024px
-xl: 1440px
-xxl: 1920px
+xxs: 240px xs: 360px sm: 480px md: 768px lg: 1024px xl: 1440px xxl: 1920px
 */
 
 /*
 
-• Globals
+• Dimensions (Margin, Padding, Width, Height)
+• Aspect Ratios
 
-• Margin
-• Padding
-• Width
-• Height
+• Font Families
+• Font Size
+• Font Weight
 
-• Font size
-• Font weight
-• Line height
+• Letter Spacing
+• Line Height
 
 • Colors
 
@@ -78,7 +72,6 @@ xxl: 1920px
 
 :root {
   /* GLOBALS */
-  --baseline: 8;
 
   /* DIMENSIONS */
 
@@ -151,19 +144,13 @@ xxl: 1920px
   --display-sm: 1.728rem;
   --display-md: 2.074rem;
   --display-lg: 2.488rem;
-  --display-xl: 2.986rem;
+  --display-xl: 2.986rem; /* h1 */
   --display-mega: 3.583rem;
   --display-giga: 4.299rem;
 
-  /* Heading Sizes */
-  /* Fluid: interpolate from a min size (at 480px) to a max size (at 1024px). */
-  /* clamp(MIN, INTERCEPT + SLOPEvw, MAX) — the rem term keeps text zoom working. */
-  --heading-1: clamp(var(--display-md), 1.269rem + 2.682vw, var(--display-xl)); /* 2.074rem → 2.986rem */
-  --heading-2: clamp(var(--display-sm), 1.057rem + 2.235vw, var(--display-lg)); /* 1.728rem → 2.488rem */
-  --heading-3: clamp(var(--text-xl), 0.881rem + 1.865vw, var(--display-md)); /* 1.44rem → 2.074rem */
-  --heading-4: clamp(var(--text-lg), 0.734rem + 1.553vw, var(--display-sm)); /* 1.2rem → 1.728rem */
-  --heading-5: clamp(var(--text-lg), 0.988rem + 0.706vw, var(--text-xl)); /* 1.2rem → 1.44rem */
-  --heading-6: clamp(var(--text-md), 0.824rem + 0.588vw, var(--text-lg)); /* 1rem → 1.2rem */
+  /* Heading font sizes are decisions, not scale steps: they map each
+     heading level onto this scale. See --heading-font-size-* in
+     settings.ui.css. */
 
   /* Font Weights */
   --extra-light: 200;
@@ -180,10 +167,6 @@ xxl: 1920px
   --tracking-xl: 0.075em;
   --tracking-xxl: 0.15em;
 
-  /* TODO add display tracking */
-  --tracking-display-md: 0.5em;
-  --tracking-display-lg: 0.75em;
-
   /* Line Height */
   --leading-xs: 1;
   --leading-sm: 1.15;
@@ -276,11 +259,9 @@ xxl: 1920px
   /* DROP SHADOWS  */
 
   --shadow-sm:
-    0 1px 3px 0 var(--ui-shadow-color),
-    0 1px 2px -1px var(--ui-shadow-color);
+    0 1px 3px 0 var(--ui-shadow-color), 0 1px 2px -1px var(--ui-shadow-color);
   --shadow-md:
-    0 4px 6px -1px var(--ui-shadow-color),
-    0 2px 4px -2px var(--ui-shadow-color);
+    0 4px 6px -1px var(--ui-shadow-color), 0 2px 4px -2px var(--ui-shadow-color);
   --shadow-lg:
     0 8px 13px -3px var(--ui-shadow-color),
     0 4px 6px -4px var(--ui-shadow-color);
@@ -323,11 +304,26 @@ xxl: 1920px
 /* INTERFACE TOKENS */
 
 /*
-  The abstraction tier between raw tokens (settings.tokens.css) and the
-  framework's rules: semantic aliases plus every component's token defaults.
-  Interface tokens only ever take another token for value; raw values live
-  in settings.tokens.css, and deliberate deviations from these defaults
-  live in a theme file (see theme.default.css).
+  The decisions layer. Every token here is named for what it's FOR (an
+  element, a component, or a shared meaning) and answers "what does this
+  thing use by default". Tokens named for what they ARE (--sm1, --base-500,
+  --bold) are scale tokens and live in settings.tokens.css. That's the
+  whole split: a name that mentions a UI thing belongs here; a name that
+  labels a step on a scale belongs there.
+
+  Values, in order of preference:
+  1. Another interface token, when the meaning is shared
+     (--input-border-color: var(--ui-border-color)).
+  2. A scale token, when the value should follow the system scales
+     (--fieldset-padding: var(--sm3)).
+  3. A raw value, only where following the scales would be wrong:
+     content (separator strings, icon URLs), geometry tuned to one
+     control (--toggle-width), or element-relative measures that track
+     the element's own type instead of the page (em heading spacing).
+     The test: "if a theme retuned the scales, should this follow?"
+
+  Deliberate deviations from these defaults live in a theme file
+  (see theme.default.css).
 */
 
 :root {
@@ -336,9 +332,15 @@ xxl: 1920px
   color-scheme: light dark;
 
   --ui-border-color: light-dark(var(--base-200), var(--base-500));
+  /* Also consumed by the --shadow-* scale in settings.tokens.css: the one
+     reference between the files that runs upward, so shadows can switch
+     with the color scheme. Raw alpha colors: the palettes have no alpha
+     steps. */
   --ui-shadow-color: light-dark(rgb(0 0 0 / 0.1), rgb(0 0 0 / 0.6));
 
-  /* Keyboard focus ring (consumed by :focus-visible in global.a11y.css) */
+  /* Keyboard focus ring (consumed by :focus-visible in global.a11y.css).
+     Raw 2px on purpose: an accessibility affordance that shouldn't move
+     when a theme retunes the decorative border scale. */
   --focus-ring-color: light-dark(var(--primary-500), var(--primary-400));
   --focus-ring-width: 2px;
   --focus-ring-offset: 2px;
@@ -377,27 +379,136 @@ xxl: 1920px
   accent-color: var(--primary-500);
 
   --body-background-color: light-dark(var(--base-0), var(--base-950));
+  --body-line-height: var(--leading-lg);
 
   --input-height: var(--md3);
   --input-padding: var(--xs3);
+  --input-border-width: var(--border-sm);
+  --input-border-color: var(--ui-border-color);
   --input-border-radius: var(--radius-md);
-  --input-border-color-invalid: light-dark(var(--danger-500), var(--danger-400));
+  --input-border-color-invalid: light-dark(
+    var(--danger-500),
+    var(--danger-400)
+  );
+
+  /* Gap under a label that precedes its control */
+  --label-spacing: var(--xs1);
+
+  --fieldset-padding: var(--sm3);
+  --fieldset-border-width: var(--border-sm);
+  --fieldset-border-color: var(--ui-border-color);
+  --fieldset-border-radius: var(--radius-lg);
 
+  /* meter: low/medium/high map to the even-less-good, suboptimum, and
+     optimum pseudo-elements */
+  --meter-height: var(--sm1);
+  --meter-border-radius: var(--radius-md);
+  --meter-track-color: var(--primary-100);
+  --meter-low-color: var(--danger-400);
+  --meter-medium-color: var(--warning-400);
+  --meter-high-color: var(--success-400);
+
+  --progress-height: var(--sm1);
+  --progress-color: var(--primary-500);
+  --progress-track-color: var(--primary-100);
+  --progress-border-radius: var(--radius-md);
+
+  /* select's chevron, applied as a mask painted with the text color;
+     any url() works here, data URL or file */
+  --select-icon-size: var(--sm3);
+  --select-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
+
+  --dialog-min-width: var(--tera1);
+  --dialog-max-width: var(--tera3);
+  --dialog-padding: var(--lg1) var(--md1);
+  --dialog-border-width: var(--border-sm);
+  --dialog-border-color: light-dark(var(--base-200), var(--base-800));
+  --dialog-background-color: light-dark(var(--base-50), var(--base-900));
+  --dialog-border-radius: var(--radius-lg);
   --dialog-backdrop-color: var(--base-950);
   --dialog-backdrop-opacity: var(--o-4);
 
+  /* details: same surface as dialog by default, on purpose but
+     independently overridable. Spacing is the gap between an open
+     summary and its content. */
+  --details-padding: var(--sm1);
+  --details-spacing: var(--xs3);
+  --details-border-width: var(--border-sm);
+  --details-border-color: light-dark(var(--base-200), var(--base-800));
+  --details-background-color: light-dark(var(--base-50), var(--base-900));
+  --details-border-radius: var(--radius-lg);
+  --details-icon-size: var(--sm3);
+  /* Marker icon, applied as a mask painted with the text color; any
+     url() works here, data URL or file */
+  --details-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
+
   --table-padding: var(--xs2) var(--sm1);
+  --table-border-width: var(--border-sm);
   --table-border-color: light-dark(var(--base-100), var(--base-700));
   --table-border-radius: var(--radius-md);
   --table-background-color: none;
+  /* Gap between the table and its caption */
+  --table-caption-spacing: var(--xs3);
+  /* Gap between a figure's content and caption on either side */
+  --figcaption-spacing: var(--xs2);
 
   /* Text */
 
   --heading-font: var(--display);
   --heading-weight: var(--black);
+  --heading-letter-spacing: normal; /* (e.g. -0.02em or var(--tracking-sm)) */
+
+  --heading-font-size-h1: clamp(
+    var(--display-md),
+    1.269rem + 2.682vw,
+    var(--display-xl)
+  ); /* 2.074rem → 2.986rem */
+  --heading-font-size-h2: clamp(
+    var(--display-sm),
+    1.057rem + 2.235vw,
+    var(--display-lg)
+  ); /* 1.728rem → 2.488rem */
+  --heading-font-size-h3: clamp(
+    var(--text-xl),
+    0.881rem + 1.865vw,
+    var(--display-md)
+  ); /* 1.44rem → 2.074rem */
+  --heading-font-size-h4: clamp(
+    var(--text-lg),
+    0.734rem + 1.553vw,
+    var(--display-sm)
+  ); /* 1.2rem → 1.728rem */
+  --heading-font-size-h5: clamp(
+    var(--text-lg),
+    0.988rem + 0.706vw,
+    var(--text-xl)
+  ); /* 1.2rem → 1.44rem */
+  --heading-font-size-h6: clamp(
+    var(--text-md),
+    0.824rem + 0.588vw,
+    var(--text-lg)
+  ); /* 1rem → 1.2rem */
+
   --heading-line-height: var(--leading-sm);
+  --heading-line-height-h1: var(--heading-line-height);
+  --heading-line-height-h2: var(--heading-line-height);
+  --heading-line-height-h3: var(--heading-line-height);
+  --heading-line-height-h4: var(--leading-md);
+  --heading-line-height-h5: var(--leading-md);
+  --heading-line-height-h6: var(--leading-md);
+
+  /* Headings bottom margin  */
+  --heading-spacing-h1: 0.4em;
+  --heading-spacing-h2: 0.4em;
+  --heading-spacing-h3: 0.4em;
+  --heading-spacing-h4: 0.4em;
+  --heading-spacing-h5: 0.4em;
+  --heading-spacing-h6: 0.4em;
+  /* Any h1 before h2, h2 before h3, h3 before h4.  */
+  --heading-spacing-consecutive: 0.3em;
 
   --text-color: light-dark(var(--base-950), var(--base-200));
+  --link-font-weight: var(--semi-bold);
   --link-color: light-dark(var(--primary-600), var(--primary-400));
   --link-color-hover: var(--primary-500);
 
@@ -406,17 +517,42 @@ xxl: 1920px
     var(--primary-100),
     var(--primary-900)
   );
+  /* when code inline styling doesn't apply (inside headings and pre) */
+  --text-code-muted-color: light-dark(var(--base-500), var(--base-300));
 
-  /* Code blocks (bare pre, astro-code, and the site's expressive-code
-     frames all consume this) */
   --pre-border-radius: var(--radius-md);
+  /* matching the 0.9em of inline code */
+  --pre-font-size: 0.9rem;
+
+  --blockquote-padding-block: var(--sm1);
+  --blockquote-padding-inline: var(--md1) var(--sm3);
+  --blockquote-background-color: light-dark(
+    var(--primary-50),
+    var(--primary-900)
+  );
+  --blockquote-border-radius: var(--radius-md);
+  --blockquote-accent-width: var(--xs2);
+  --blockquote-accent-color: linear-gradient(
+    var(--primary-800),
+    var(--primary-500)
+  );
 
   /* .prose related stuff in GLOBAL */
 
+  /* Optional centered label on <hr>, e.g. "***" or a dingbat */
+  --hr-content: "";
+
+  /* ins: background stays light in both light/dark modes */
+  --ins-color: var(--base-950);
+  --ins-background-color: var(--success-200);
+
   --marker-color: var(--highlight-500);
 
   --selection-color: light-dark(var(--base-950), var(--base-0));
-  --selection-background-color: light-dark(var(--primary-200), var(--primary-700));
+  --selection-background-color: light-dark(
+    var(--primary-200),
+    var(--primary-700)
+  );
 }
 
 /* GLOBAL */
@@ -425,19 +561,20 @@ xxl: 1920px
   /* Mobile-first: tighter gutters on small screens, 24px from --md up */
   --grid-column-gap: var(--sm1);
   --grid-row-gap: var(--sm1);
+  @media (width >= 768px) {
+    --grid-column-gap: var(--sm3);
+    --grid-row-gap: var(--sm3);
+  }
 
   --wrap-spacing: var(--sm1);
   --wrap-md-spacing: var(--sm3);
   --wrap-lg-spacing: 0;
-  --wrap-width-sm: minmax(200px, 55ch);
-  --wrap-width-md: minmax(200px, 70ch);
-  --wrap-width-lg: minmax(200px, 900px);
+  /* Widths are measures: ch tracks the text size, so raw on purpose. */
+  --wrap-width-sm: minmax(0, 55ch);
+  --wrap-width-md: minmax(0, 70ch);
+  --wrap-width-lg: minmax(0, 900px);
   --wrap-width: var(--wrap-width-md);
 
-  /* Layout scaffolds (global.layout.css): main column cap for
-     .layout-centered and .layout-docs, aside and TOC column widths.
-     --layout-toc-width takes any grid track size; the 1fr default lets
-     the TOC absorb the leftover space. */
   --layout-content-width: 70ch;
   --layout-aside-width: 245px;
   --layout-toc-width: 1fr;
@@ -445,13 +582,6 @@ xxl: 1920px
   --prose-spacing: var(--sm1);
 }
 
-@media (width >= 768px) {
-  :root {
-    --grid-column-gap: var(--sm3);
-    --grid-row-gap: var(--sm3);
-  }
-}
-
 /* COMPONENTS */
 
 /* Badge */
@@ -488,16 +618,21 @@ xxl: 1920px
 /* (Button defaults and primary button colors) */
 
 :root {
+  /* Optical minimums, deliberately off the spacing scale */
   --bt-min-width: 101px;
   --bt-min-width-md: 123px;
   --bt-min-width-lg: 133px;
+
   --bt-font-size: var(--text-sm);
   --bt-font-size-lg: var(--text-md);
   --bt-font-weight: var(--semi-bold);
+
   --bt-color: var(--text-color);
   --bt-color-hover: light-dark(var(--text-color), var(--base-0));
+
   --bt-background-color: light-dark(var(--base-0), var(--base-800));
   --bt-background-color-hover: light-dark(var(--base-50), var(--base-900));
+
   --bt-border-color: var(--ui-border-color);
   --bt-border-width: var(--border-sm);
   --bt-border-radius: var(--radius-lg);
@@ -560,14 +695,15 @@ xxl: 1920px
   --card-shadow: var(--shadow-md);
   --card-shadow-hover: var(--shadow-xl);
   --card-loading-bg: light-dark(var(--base-200), var(--base-900));
-  /* Default media aspect ratio; the Card component sets it inline from its
-     aspectRatio prop */
+  /* Default media aspect ratio; the Card component pins it inline only
+     when its aspectRatio prop is passed */
   --card-aspect-ratio: var(--ar-golden);
 }
 
 /* Toggle */
 
 :root {
+  /* Drawn-control geometry, deliberately off the scales */
   --toggle-width: 50px;
   --toggle-height: 28px;
   --toggle-border-width: 2px;
@@ -588,8 +724,8 @@ xxl: 1920px
   --field-spacing: var(--xs1);
   --field-hint-color: light-dark(var(--base-400), var(--base-500));
   --field-error-color: light-dark(var(--danger-500), var(--danger-300));
-  /* static = messages in flow under the control; absolute = overlaid below
-     the field (row compositions set this so messages can't move siblings) */
+  /*Field's hint/error position. Use `static` to reflow under, use `absolute`
+  (and leave enough space below) if you don't want any shift on errors */
   --field-message-position: static;
 }
 
@@ -628,8 +764,7 @@ xxl: 1920px
   }
   --header-background-color: light-dark(var(--base-0), var(--base-950));
 
-  /* The mobile menu is an always-dark surface by design, so these are raw
-     palette values on purpose; override them to retheme the menu. */
+  /* The mobile menu is an always-dark  by design */
   --header-menu-background-color: var(--base-950);
   --header-menu-color: var(--base-0);
   --header-menu-color-current: var(--primary-400);
@@ -714,7 +849,10 @@ xxl: 1920px
   --section-header-spacing: var(--lg3);
   --section-eyebrow-color: light-dark(var(--primary-600), var(--primary-400));
   --section-lede-color: light-dark(var(--base-500), var(--base-400));
-  --section-filled-background-color: light-dark(var(--base-50), var(--base-900));
+  --section-filled-background-color: light-dark(
+    var(--base-50),
+    var(--base-900)
+  );
   --section-primary-background-color: light-dark(
     var(--primary-600),
     var(--primary-900)
@@ -743,9 +881,9 @@ xxl: 1920px
   --tags-radius: var(--radius-md);
 }
 
-/* Tiles: no tokens. The container thresholds live in component.tiles.css
-   (container queries can't read custom properties), and --tiles-columns
-   is set there; pin it on a hook class of your own to opt out. */
+/* Tiles has no tokens here: its column count is set by container queries in
+   component.tiles.css since custom properties don't work inside @container.
+*/
 
 /* TOC */
 
@@ -754,7 +892,7 @@ xxl: 1920px
   --toc-color-hover: var(--link-color-hover);
   --toc-spacing: var(--xs1);
   --toc-indentation: var(--xs3);
-  --toc-icon-size: 16px;
+  --toc-icon-size: var(--sm1);
 }
 }
 
@@ -827,7 +965,7 @@ body {
   background-color: var(--body-background-color);
   color: var(--text-color);
   font-family: var(--text);
-  line-height: 1.5;
+  line-height: var(--body-line-height);
 
   /* for elements like dialog etc. that require scrolling turned off */
   &:has(.body-is-locked) {
@@ -884,7 +1022,7 @@ search {
 }
 
 a {
-  font-weight: var(--semi-bold);
+  font-weight: var(--link-font-weight);
   color: var(--link-color);
   &:where(:hover) {
     color: var(--link-color-hover);
@@ -923,8 +1061,8 @@ abbr {
     width: var(--sm1);
     height: var(--sm1);
     display: inline-block;
-    content: '';
-    background:  url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
+    content: "";
+    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
     background-size: contain;
   }
   &:hover:before {
@@ -948,22 +1086,22 @@ b {
 blockquote {
   position: relative;
   margin-bottom: var(--prose-spacing);
-  padding-block: var(--sm1);
+  padding-block: var(--blockquote-padding-block);
   /* extra inline-start room for the accent bar */
-  padding-inline: var(--md1) var(--sm3);
+  padding-inline: var(--blockquote-padding-inline);
   font-style: italic;
-  background-color: light-dark(var(--primary-50), var(--primary-900));
-  border-radius: var(--radius-md);
+  background-color: var(--blockquote-background-color);
+  border-radius: var(--blockquote-border-radius);
   &::before {
-    content: '';
+    content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;
-    width: var(--xs2);
+    width: var(--blockquote-accent-width);
     height: 100%;
-    border-start-start-radius: var(--radius-md);
-    border-end-start-radius: var(--radius-md);
-    background-image: linear-gradient(var(--primary-800), var(--primary-500));
+    border-start-start-radius: var(--blockquote-border-radius);
+    border-end-start-radius: var(--blockquote-border-radius);
+    background: var(--blockquote-accent-color);
   }
 
   p {
@@ -986,17 +1124,19 @@ cite {
   font-style: italic;
 }
 
-code, var, kbd {
+code,
+var,
+kbd {
   font-family: var(--mono);
   font-size: 0.9em;
   font-style: normal;
-  color: light-dark(var(--base-500), var(--base-300));
+  color: var(--text-code-muted-color);
 }
 
 :is(code, var, kbd):not(h1 *, h2 *, h3 *, h4 *, h5 *, h6 *, pre *) {
   padding: 0.15em 0.3em;
   color: var(--text-code-color);
-  background-color:  var(--text-code-background-color);
+  background-color: var(--text-code-background-color);
   border-radius: var(--radius-sm);
 }
 
@@ -1014,11 +1154,11 @@ dd {
 }
 
 dd + dt {
-  margin-top: .5em;
+  margin-top: 0.5em;
 }
 
 del {
-  text-decoration-color: var(--no-500);
+  text-decoration-color: var(--danger-500);
   text-decoration-style: wavy;
 }
 
@@ -1031,81 +1171,95 @@ em {
 /* figcaption and figure are in elements.media.css */
 
 /* Technically, headings should be in elements.sectioning but I'm guessing that's where most people would expect this to be */
-h1, .h1,
-h2, .h2,
-h3, .h3,
-h4, .h4,
-h5, .h5,
-h6, .h6 {
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3,
+h4,
+.h4,
+h5,
+.h5,
+h6,
+.h6 {
   overflow-wrap: break-word; /* Avoid text overflows */
   text-wrap: balance;
 }
 
-h1, .h1,
-h2, .h2,
-h3, .h3,
-h4, .h4 {
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3,
+h4,
+.h4 {
   font-family: var(--heading-font);
   font-weight: var(--heading-weight);
-  line-height: var(--heading-line-height);
+  letter-spacing: var(--heading-letter-spacing);
 }
 
-h1, .h1,
-h2, .h2,
-h3, .h3 {
-  margin-bottom: var(--sm1);
+h1,
+.h1 {
+  margin-bottom: var(--heading-spacing-h1);
+  font-size: var(--heading-font-size-h1);
+  line-height: var(--heading-line-height-h1);
 }
 
-h4, .h4 {
-  margin-bottom: var(--sm2);
+h2,
+.h2 {
+  margin-bottom: var(--heading-spacing-h2);
+  font-size: var(--heading-font-size-h2);
+  line-height: var(--heading-line-height-h2);
 }
 
-h5, .h5,
-h6, .h6 {
-  margin-bottom: var(--xs2);
+h3,
+.h3 {
+  margin-bottom: var(--heading-spacing-h3);
+  font-size: var(--heading-font-size-h3);
+  line-height: var(--heading-line-height-h3);
 }
 
-/* h1—h3 that has h2—h4 right after gets a smaller margin bottom */
-:where(h1, h2, h3):has(+ :is(h2, h3, h4)) {
-  margin-bottom: var(--sm2);
+h4,
+.h4 {
+  margin-bottom: var(--heading-spacing-h4);
+  font-size: var(--heading-font-size-h4);
+  line-height: var(--heading-line-height-h4);
 }
 
-h1, .h1 {
-  font-size: var(--heading-1);
+h5,
+.h5 {
+  margin-bottom: var(--heading-spacing-h5);
+  font-size: var(--heading-font-size-h5);
+  line-height: var(--heading-line-height-h5);
 }
 
-h2, .h2 {
-  font-size: var(--heading-2);
+h6,
+.h6 {
+  margin-bottom: var(--heading-spacing-h6);
+  font-size: var(--heading-font-size-h6);
+  line-height: var(--heading-line-height-h6);
 }
 
-h3, .h3 {
-  font-size: var(--heading-3);
-}
-
-h4, .h4 {
-  font-size: var(--heading-4);
-}
-
-h5, .h5 {
-  font-size: var(--heading-5);
-}
-
-h6, .h6 {
-  font-size: var(--heading-6);
+/* h1—h3 with a h2—h4 subheading right after gets the consecutive margin
+   (must come after the per-level rules: it ties them on specificity, so
+   source order decides) */
+:where(h1, h2, h3):has(+ :is(h2, h3, h4)) {
+  margin-bottom: var(--heading-spacing-consecutive);
 }
 
 hr {
-  --content: "";
   display: flex;
   justify-content: center;
   align-items: center;
   height: 0;
   border-style: solid;
-  border-width: 1px 0 0;
+  border-width: var(--border-sm) 0 0;
   color: var(--ui-border-color);
   overflow: visible;
   &::after {
-    content: var(--content);
+    content: var(--hr-content);
     padding: 0 var(--xs1);
     line-height: 1;
     letter-spacing: var(--tracking-sm);
@@ -1117,15 +1271,13 @@ hr {
   margin-bottom: var(--prose-spacing);
 }
 
-
 i {
 }
 
 ins {
   padding: 0.15em 0.3em;
-  /* pastel bg stays light in both modes, so pin a dark text color */
-  color: var(--base-950);
-  background-color: var(--yes-200);
+  color: var(--ins-color);
+  background-color: var(--ins-background-color);
   border-radius: var(--radius-sm);
   -webkit-text-decoration: none;
   text-decoration: none;
@@ -1156,7 +1308,7 @@ p {
 
 pre {
   font-family: var(--mono);
-  font-size: 0.9rem;
+  font-size: var(--pre-font-size);
   white-space: pre-wrap; /* override overflow default */
   border-radius: var(--pre-border-radius);
 }
@@ -1464,18 +1616,18 @@ figure {
   /* caption at bottom or top */
   &:has(* + figcaption) {
     figcaption {
-      margin-top: var(--xs2);
+      margin-top: var(--figcaption-spacing);
     }
   }
   &:has(figcaption + *) {
     figcaption {
-      margin-bottom: var(--xs2);
+      margin-bottom: var(--figcaption-spacing);
     }
   }
 }
 
 iframe {
-  border: 1px solid var(--ui-border-color);
+  border: var(--border-sm) solid var(--ui-border-color);
 }
 
 img {
@@ -1496,7 +1648,7 @@ video {
 
 caption {
   caption-side: bottom;
-  margin-top: var(--xs3);
+  margin-top: var(--table-caption-spacing);
   font-size: var(--text-sm);
 }
 
@@ -1505,7 +1657,7 @@ colgroup {
 
 table {
   border-spacing: 0;
-  border: 1px solid var(--table-border-color);
+  border: var(--table-border-width) solid var(--table-border-color);
   border-radius: var(--table-border-radius);
   background-color: var(--table-background-color);
 }
@@ -1514,8 +1666,8 @@ th,
 td {
   text-align: start;
   padding: var(--table-padding);
-  border-bottom: 1px solid var(--table-border-color);
-  border-inline-start: 1px solid var(--table-border-color);
+  border-bottom: var(--table-border-width) solid var(--table-border-color);
+  border-inline-start: var(--table-border-width) solid var(--table-border-color);
 }
 
 tr {
@@ -1540,7 +1692,7 @@ tbody {
 tfoot {
   th,
   td {
-    border-top: 1px solid var(--table-border-color);
+    border-top: var(--table-border-width) solid var(--table-border-color);
     border-bottom-width: 0;
   }
 }
@@ -1570,9 +1722,9 @@ datalist {
 }
 
 fieldset {
-  border: 1px solid var(--ui-border-color);
-  border-radius: var(--radius-lg);
-  padding: var(--sm3);
+  border: var(--fieldset-border-width) solid var(--fieldset-border-color);
+  border-radius: var(--fieldset-border-radius);
+  padding: var(--fieldset-padding);
 
   ul:has([type="checkbox"], [type="radio"]) {
     padding-inline-start: 0;
@@ -1604,7 +1756,7 @@ input {
     border-radius: var(--input-border-radius);
   }
   &:where(:not([type="file"])) {
-    border: 1px solid var(--ui-border-color);
+    border: var(--input-border-width) solid var(--input-border-color);
   }
   &[type="file"] {
     width: 100%;
@@ -1618,7 +1770,7 @@ input {
 label {
   display: block;
   &:has(+ :is(input, select, textarea)) {
-    margin-bottom: var(--xs1);
+    margin-bottom: var(--label-spacing);
   }
 }
 
@@ -1635,19 +1787,13 @@ legend {
 }
 
 meter {
-  --meter-height: var(--sm1);
-  --meter-radius: var(--radius-md);
-  --meter-color-track: var(--primary-100);
-  --meter-color-low: var(--no-400);
-  --meter-color-med: var(--maybe-400);
-  --meter-color-high: var(--yes-400);
   width: 100%;
-  background: var(--meter-color-track);
-  border-radius: var(--meter-radius);
+  background: var(--meter-track-color);
+  border-radius: var(--meter-border-radius);
   height: var(--meter-height);
   /* webkit */
   &::-webkit-meter-bar {
-    background: var(--meter-color-track);
+    background: var(--meter-track-color);
   }
   &::-webkit-meter-bar,
   &::-webkit-meter-optimum-value,
@@ -1655,26 +1801,26 @@ meter {
   &::-webkit-meter-even-less-good-value {
     height: var(--meter-height);
     border: none;
-    border-radius: var(--meter-radius);
+    border-radius: var(--meter-border-radius);
   }
   &::-webkit-meter-even-less-good-value {
-    background: var(--meter-color-low);
+    background: var(--meter-low-color);
   }
   &::-webkit-meter-suboptimum-value {
-    background: var(--meter-color-med);
+    background: var(--meter-medium-color);
   }
   &::-webkit-meter-optimum-value {
-    background: var(--meter-color-high);
+    background: var(--meter-high-color);
   }
   /* mozilla */
   &:-moz-meter-sub-sub-optimum::-moz-meter-bar {
-    background: var(--meter-color-low);
+    background: var(--meter-low-color);
   }
   &:-moz-meter-sub-optimum::-moz-meter-bar {
-    background: var(--meter-color-med);
+    background: var(--meter-medium-color);
   }
   &:-moz-meter-optimum::-moz-meter-bar {
-    background: var(--meter-color-high);
+    background: var(--meter-high-color);
   }
 }
 
@@ -1688,43 +1834,39 @@ output {
 }
 
 progress {
-  --progress-height: var(--sm1);
-  --progress-color: var(--primary-500);
-  --progress-track-color: var(--primary-100);
-  --progress-radius: var(--radius-md);
   appearance: none;
   width: 100%;
   /* mozilla */
   height: var(--progress-height);
   background: var(--progress-track-color);
-  border-radius: var(--progress-radius);
+  border-radius: var(--progress-border-radius);
   border: none;
   &::-moz-progress-bar {
     background: var(--progress-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
   }
   /* webkit */
   &::-webkit-progress-bar {
     width: 100%;
     background: var(--progress-track-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
     height: var(--progress-height);
   }
   &::-webkit-progress-value {
     background: var(--progress-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
   }
 }
 
 select {
-  --icon-size: 24px;
-  --split: calc(100% - var(--icon-size));
+  /* derived, stays local */
+  --split: calc(100% - var(--select-icon-size));
   display: flex;
   appearance: none;
   height: var(--input-height);
   padding: var(--xs1) calc(var(--input-padding) + var(--md1)) var(--xs1)
     var(--input-padding);
-  border: 1px solid var(--ui-border-color);
+  border: var(--input-border-width) solid var(--input-border-color);
   border-radius: var(--input-border-radius);
   background: linear-gradient(
     to right,
@@ -1732,10 +1874,10 @@ select {
     var(--text-color) var(--split) 100%
   );
   mask-image:
-    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E"),
+    var(--select-icon),
     linear-gradient(to right, transparent calc(var(--split) - 1px), red 0),
     linear-gradient(red 0 0);
-  mask-size: var(--icon-size), auto, auto;
+  mask-size: var(--select-icon-size), auto, auto;
   mask-position:
     calc(100% - var(--xs1)) center,
     0 0,
@@ -1771,9 +1913,9 @@ select {
 
 textarea {
   width: 100%;
-  padding: var(--xs3);
+  padding: var(--input-padding);
   border-radius: var(--input-border-radius);
-  border: 1px solid var(--ui-border-color);
+  border: var(--input-border-width) solid var(--input-border-color);
   resize: vertical;
   &:not([rows]) {
     min-height: 6em;
@@ -1787,12 +1929,12 @@ textarea {
 dialog {
   /* body scrolling is stopped by adding .body-is-locked on <dialog> */
   /* But it can be added to any element. See elements.sectioning.css > body { … }  */
-  min-width: var(--tera1);
-  max-width: var(--tera3);
-  padding: var(--lg1) var(--md1);
-  border: 1px solid light-dark(var(--base-200), var(--base-800));
-  background-color: light-dark(var(--base-50), var(--base-900));
-  border-radius: var(--radius-lg);
+  min-width: var(--dialog-min-width);
+  max-width: var(--dialog-max-width);
+  padding: var(--dialog-padding);
+  border: var(--dialog-border-width) solid var(--dialog-border-color);
+  background-color: var(--dialog-background-color);
+  border-radius: var(--dialog-border-radius);
 
   &::backdrop {
     background: var(--dialog-backdrop-color);
@@ -1802,7 +1944,9 @@ dialog {
   [aria-label="close pop-up"] {
     position: absolute;
     top: var(--xs3);
-    right: var(--xs3); /* deliberately physical: close button pinned to a visual corner */
+    right: var(
+      --xs3
+    ); /* deliberately physical: close button pinned to a visual corner */
     background: transparent;
     border: none;
     outline: none;
@@ -1816,10 +1960,10 @@ dialog {
 }
 
 details {
-  padding: var(--sm1) var(--sm1);
-  border: 1px solid light-dark(var(--base-200), var(--base-800));
-  background-color: light-dark(var(--base-50), var(--base-900));
-  border-radius: var(--radius-lg);
+  padding: var(--details-padding);
+  border: var(--details-border-width) solid var(--details-border-color);
+  background-color: var(--details-background-color);
+  border-radius: var(--details-border-radius);
   cursor: pointer;
 
   summary {
@@ -1831,15 +1975,21 @@ details {
     }
     &::after {
       content: "";
-      width: 24px;
-      height: 24px;
-      background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E") no-repeat;
-      transition: var(--transition);
+      width: var(--details-icon-size);
+      height: var(--details-icon-size);
+      /* icon as a mask painted with the text color, so it follows the
+         color scheme (an SVG in background-image can't see currentColor
+         and always renders black) */
+      background-color: currentColor;
+      mask-image: var(--details-icon);
+      mask-size: contain;
+      mask-repeat: no-repeat;
+      transition: transform var(--transition);
     }
   }
 
   &[open] > summary {
-    margin-bottom: var(--xs3);
+    margin-bottom: var(--details-spacing);
     &::after {
       transform: rotate(180deg);
     }
@@ -3056,13 +3206,11 @@ details {
 
 /* DEV TOOLS */
 
-/* Debug-only helpers, inert unless you add the classes yourself.
-   !important is intentional and required in the helpers layer: a debug
-   overlay must win over every other style, including unlayered CSS. */
+/* Debug-only helpers. You have to add the classes yourself. */
 
-/* Baseline grid overlay: add .dev to <body> while checking vertical
-   rhythm (line spacing comes from --baseline in settings.tokens.css). */
+/* Baseline grid overlay: add .dev to <body> while checking vertical rhythm. */
 body.dev {
+  --baseline: 8;
   background-size: 100% calc(var(--baseline) * 1px) !important;
   background-image: linear-gradient(
     to bottom,
@@ -3076,7 +3224,7 @@ body.dev {
 .dev-error {
   position: fixed !important;
   top: var(--md1) !important;
-  left: var(--md1) !important; /* deliberately physical: debug toast pinned to a visual corner */
+  left: var(--md1) !important;
   z-index: var(--z-top) !important;
   padding: var(--sm1) !important;
   font-size: 1rem !important;
diff --git a/dist/mcss.min.css b/dist/mcss.min.css
index 854735b5..2f957b90 100644
--- a/dist/mcss.min.css
+++ b/dist/mcss.min.css
@@ -1,2 +1,2 @@
 /*! mCSS v1.3.0 | MIT | https://mcss.dev */
-@layer settings,base,elements,global,components,theme,helpers;@layer settings{:root{--baseline: 8;--xs1: 4px;--xs2: 8px;--xs3: 12px;--sm1: 16px;--sm2: 20px;--sm3: 24px;--md1: 28px;--md2: 32px;--md3: 36px;--lg1: 40px;--lg2: 44px;--lg3: 48px;--xl1: 56px;--xl2: 64px;--xl3: 80px;--xxl1: 96px;--xxl2: 112px;--xxl3: 128px;--mega1: 160px;--mega2: 192px;--mega3: 224px;--giga1: 256px;--giga2: 288px;--giga3: 320px;--tera1: 384px;--tera2: 480px;--tera3: 520px;--ar-square: 1;--ar-landscape: 4/3;--ar-portrait: 3/4;--ar-widescreen: 16/9;--ar-golden: 1.618/1;--display: Avenir, Montserrat, Corbel, URW Gothic, source-sans-pro, ui-sans-serif, sans-serif;--text: ui-sans-serif, system-ui, sans-serif;--mono: Dank Mono, Inconsolata, Fira Mono, SF Mono, Monaco, Droid Sans Mono, Source Code Pro, Cascadia Code, Menlo, Consolas, DejaVu Sans Mono, ui-monospace, monospace;--text-xs: .694rem;--text-sm: .833rem;--text-md: 1rem;--text-lg: 1.2rem;--text-xl: 1.44rem;--display-sm: 1.728rem;--display-md: 2.074rem;--display-lg: 2.488rem;--display-xl: 2.986rem;--display-mega: 3.583rem;--display-giga: 4.299rem;--heading-1: clamp(var(--display-md), 1.269rem + 2.682vw, var(--display-xl));--heading-2: clamp(var(--display-sm), 1.057rem + 2.235vw, var(--display-lg));--heading-3: clamp(var(--text-xl), .881rem + 1.865vw, var(--display-md));--heading-4: clamp(var(--text-lg), .734rem + 1.553vw, var(--display-sm));--heading-5: clamp(var(--text-lg), .988rem + .706vw, var(--text-xl));--heading-6: clamp(var(--text-md), .824rem + .588vw, var(--text-lg));--extra-light: 200;--light: 300;--book: 400;--semi-bold: 600;--bold: 700;--black: 900;--tracking-sm: -.05em;--tracking-md: .025em;--tracking-lg: .05em;--tracking-xl: .075em;--tracking-xxl: .15em;--tracking-display-md: .5em;--tracking-display-lg: .75em;--leading-xs: 1;--leading-sm: 1.15;--leading-md: 1.375;--leading-lg: 1.5;--leading-xl: 1.75;--leading-xxl: 2;--base-0: #fff;--base-50: #f6f7f9;--base-100: #edeef1;--base-200: #d6dbe1;--base-300: #b2bbc7;--base-400: #8897a8;--base-500: #697a8e;--base-600: #546375;--base-700: #4a5666;--base-800: #3c4550;--base-900: #353c45;--base-950: #23282e;--primary-50: #f0f9ff;--primary-100: #e0f2fe;--primary-200: #bae6fd;--primary-300: #7dd3fc;--primary-400: #38bdf8;--primary-500: #0ea5e9;--primary-600: #0284c7;--primary-700: #0369a1;--primary-800: #075985;--primary-900: #0c4a6e;--primary-950: #082f49;--yes-100: #d5f6e8;--yes-200: #afebd4;--yes-300: #7adbbd;--yes-400: #46c4a0;--yes-500: #13886d;--no-100: #ffe4e6;--no-200: #fecdd3;--no-300: #fda4af;--no-400: #fb7185;--no-500: #e11d48;--maybe-100: #fff7d6;--maybe-200: #fff0b3;--maybe-300: #ffd64a;--maybe-400: #ffc220;--maybe-500: #f9a007;--highlight-500: #ffee00;--gradient-primary: linear-gradient( 90deg, var(--primary-950) 0%, var(--primary-400) 100% );--border-sm: 1px;--border-md: 2px;--border-lg: 4px;--border-xl: 8px;--border-xxl: 12px;--radius-sm: 3px;--radius-md: 5px;--radius-lg: 8px;--radius-xl: 12px;--radius-xxl: 16px;--radius-round: 1e5px;--shadow-sm: 0 1px 3px 0 var(--ui-shadow-color), 0 1px 2px -1px var(--ui-shadow-color);--shadow-md: 0 4px 6px -1px var(--ui-shadow-color), 0 2px 4px -2px var(--ui-shadow-color);--shadow-lg: 0 8px 13px -3px var(--ui-shadow-color), 0 4px 6px -4px var(--ui-shadow-color);--shadow-xl: 0 20px 20px -5px var(--ui-shadow-color), 0 8px 10px -6px var(--ui-shadow-color);--shadow-xxl: 0px 11px 8px -6px var(--ui-shadow-color), 0 10px 15px 2px var(--ui-shadow-color);--o-0: 0;--o-1: .2;--o-2: .4;--o-3: .6;--o-4: .8;--o-5: 1;--z-bottom: -1000000000;--z-0: 0;--z-1: 10;--z-2: 20;--z-3: 30;--z-4: 40;--z-5: 50;--z-top: 1000000000;--transition: .22s ease-in-out;--transition-fast: .1s ease-in-out}}@layer settings{:root{color-scheme:light dark;--ui-border-color: light-dark(var(--base-200), var(--base-500));--ui-shadow-color: light-dark(rgb(0 0 0 / .1), rgb(0 0 0 / .6));--focus-ring-color: light-dark(var(--primary-500), var(--primary-400));--focus-ring-width: 2px;--focus-ring-offset: 2px;--success-100: var(--yes-100);--success-200: var(--yes-200);--success-300: var(--yes-300);--success-400: var(--yes-400);--success-500: var(--yes-500);--danger-100: var(--no-100);--danger-200: var(--no-200);--danger-300: var(--no-300);--danger-400: var(--no-400);--danger-500: var(--no-500);--warning-100: var(--maybe-100);--warning-200: var(--maybe-200);--warning-300: var(--maybe-300);--warning-400: var(--maybe-400);--warning-500: var(--maybe-500)}:root.theme-light{color-scheme:light}:root.theme-dark{color-scheme:dark}:root{accent-color:var(--primary-500);--body-background-color: light-dark(var(--base-0), var(--base-950));--input-height: var(--md3);--input-padding: var(--xs3);--input-border-radius: var(--radius-md);--input-border-color-invalid: light-dark(var(--danger-500), var(--danger-400));--dialog-backdrop-color: var(--base-950);--dialog-backdrop-opacity: var(--o-4);--table-padding: var(--xs2) var(--sm1);--table-border-color: light-dark(var(--base-100), var(--base-700));--table-border-radius: var(--radius-md);--table-background-color: none;--heading-font: var(--display);--heading-weight: var(--black);--heading-line-height: var(--leading-sm);--text-color: light-dark(var(--base-950), var(--base-200));--link-color: light-dark(var(--primary-600), var(--primary-400));--link-color-hover: var(--primary-500);--text-code-color: light-dark(var(--primary-600), var(--primary-400));--text-code-background-color: light-dark( var(--primary-100), var(--primary-900) );--pre-border-radius: var(--radius-md);--marker-color: var(--highlight-500);--selection-color: light-dark(var(--base-950), var(--base-0));--selection-background-color: light-dark(var(--primary-200), var(--primary-700))}:root{--grid-column-gap: var(--sm1);--grid-row-gap: var(--sm1);--wrap-spacing: var(--sm1);--wrap-md-spacing: var(--sm3);--wrap-lg-spacing: 0;--wrap-width-sm: minmax(200px, 55ch);--wrap-width-md: minmax(200px, 70ch);--wrap-width-lg: minmax(200px, 900px);--wrap-width: var(--wrap-width-md);--layout-content-width: 70ch;--layout-aside-width: 245px;--layout-toc-width: 1fr;--prose-spacing: var(--sm1)}@media(width>=768px){:root{--grid-column-gap: var(--sm3);--grid-row-gap: var(--sm3)}}:root{--badge-font-size: var(--text-sm);--badge-border-radius: var(--radius-md);--badge-color: var(--base-0);--badge-background-color: light-dark(var(--base-700), var(--base-600));--badge-primary-color: var(--base-0);--badge-primary-background-color: light-dark( var(--primary-600), var(--primary-500) );--badge-success-color: light-dark(var(--success-500), var(--base-0));--badge-success-background-color: light-dark( var(--success-100), var(--success-500) );--badge-danger-color: light-dark(var(--danger-500), var(--base-0));--badge-danger-background-color: light-dark( var(--danger-100), var(--danger-500) );--badge-warning-color: light-dark(var(--warning-500), var(--base-950));--badge-warning-background-color: light-dark( var(--warning-100), var(--warning-500) )}:root{--bt-min-width: 101px;--bt-min-width-md: 123px;--bt-min-width-lg: 133px;--bt-font-size: var(--text-sm);--bt-font-size-lg: var(--text-md);--bt-font-weight: var(--semi-bold);--bt-color: var(--text-color);--bt-color-hover: light-dark(var(--text-color), var(--base-0));--bt-background-color: light-dark(var(--base-0), var(--base-800));--bt-background-color-hover: light-dark(var(--base-50), var(--base-900));--bt-border-color: var(--ui-border-color);--bt-border-width: var(--border-sm);--bt-border-radius: var(--radius-lg);--bt-border-radius-lg: var(--radius-xl);--bt-outline-color-hover: light-dark(var(--base-950), var(--base-0));--bt-outline-background-color-hover: light-dark( rgb(0 0 0 / .1), rgb(255 255 255 / .1) );--bt-outline-border-color: light-dark(var(--base-950), var(--base-0));--bt-outline-border-color-hover: light-dark(var(--base-950), var(--base-0));--bt-primary-color: var(--base-0);--bt-primary-color-hover: var(--base-0);--bt-primary-background-color: var(--primary-600);--bt-primary-background-color-hover: var(--primary-500);--bt-primary-border-color: var(--primary-600);--bt-primary-border-color-hover: var(--primary-600)}:root{--avatar-color: var(--base-0);--avatar-background-color: var(--base-400);--avatar-border-color: light-dark(var(--base-0), var(--base-500));--avatar-border-width: var(--border-sm);--avatar-radius: var(--radius-round);--avatar-status-dot-color-offline: var(--base-300);--avatar-status-dot-color-online: var(--yes-400)}:root{--banner-color: var(--base-0);--banner-background-color: light-dark(var(--primary-600), var(--primary-800))}:root{--breadcrumbs-separator: "/";--breadcrumbs-separator-color: light-dark(var(--base-300), var(--base-600));--breadcrumbs-color: light-dark(var(--base-500), var(--base-400));--breadcrumbs-color-current: var(--text-color)}:root{--card-spacing: var(--sm3);--card-color: var(--text-color);--card-secondary-text-color: light-dark(var(--base-400), var(--base-500));--card-bg-color: light-dark(var(--base-100), var(--base-900));--card-border-radius: var(--radius-lg);--card-border-color: var(--ui-border-color);--card-border-width: var(--border-sm);--card-shadow: var(--shadow-md);--card-shadow-hover: var(--shadow-xl);--card-loading-bg: light-dark(var(--base-200), var(--base-900));--card-aspect-ratio: var(--ar-golden)}:root{--toggle-width: 50px;--toggle-height: 28px;--toggle-border-width: 2px;--toggle-track-color: light-dark(var(--base-300), var(--base-700));--toggle-track-color-checked: var(--yes-400);--toggle-thumb-color: var(--body-background-color)}:root{--faq-spacing: var(--xs3)}:root{--field-spacing: var(--xs1);--field-hint-color: light-dark(var(--base-400), var(--base-500));--field-error-color: light-dark(var(--danger-500), var(--danger-300));--field-message-position: static}:root{--featureItem-icon-box-size: var(--lg3);--featureItem-icon-size: var(--sm3);--featureItem-icon-color: light-dark(var(--primary-600), var(--primary-300));--featureItem-icon-background-color: light-dark( var(--primary-100), var(--primary-900) );--featureItem-icon-border-radius: var(--radius-lg)}:root{--footer-background-color: light-dark(var(--primary-950), var(--base-950));--footer-text-color: light-dark(var(--base-0), var(--base-200));--footer-border-width: var(--border-md);--footer-border-color: light-dark(transparent, var(--base-700));--footer-link-color: light-dark(var(--base-0), var(--base-200));--footer-link-color-hover: light-dark(var(--primary-200), var(--base-0))}:root{--header-height: var(--xl1);--header-padding: var(--sm1);@media(width>=768px){--header-height: var(--xl2);--header-padding: var(--sm3)}--header-background-color: light-dark(var(--base-0), var(--base-950));--header-menu-background-color: var(--base-950);--header-menu-color: var(--base-0);--header-menu-color-current: var(--primary-400);--header-menu-secondary-color: var(--base-300);--header-menu-border-color: var(--base-500)}:root{--hero-radius: var(--radius-xl);--hero-content-padding: var(--md3);--hero-actions-spacing: var(--lg3);--hero-pagination-dot: var(--sm1);--hero-pagination-dot-color: var(--base-0);--hero-pagination-dot-active-color: var(--primary-600);--hero-pagination-opacity: var(--o-4)}:root{--pagination-size: var(--md3);--pagination-border-radius: var(--radius-md);--pagination-color: var(--text-color);--pagination-color-current: var(--base-0);--pagination-background-color-current: light-dark( var(--primary-600), var(--primary-500) );--pagination-background-color-hover: light-dark( var(--base-100), var(--base-800) )}:root{--prevNext-border-color: var(--ui-border-color);--prevNext-border-radius: var(--radius-lg);--prevNext-border-color-hover: var(--link-color);--prevNext-label-color: light-dark(var(--base-400), var(--base-500))}:root{--notice-spacing: var(--sm1);--notice-text-color: light-dark(var(--base-950), var(--base-0));--notice-background-color: light-dark(var(--base-50), var(--base-800));--notice-border-color: light-dark(var(--base-200), var(--base-500));--notice-border-width: var(--border-sm);--notice-border-radius: var(--radius-lg)}:root{--pricingCard-highlight-border-color: light-dark( var(--primary-600), var(--primary-400) );--pricingCard-check-color: light-dark(var(--success-500), var(--success-400))}:root{--readProgressBar-height: var(--xs1);--readProgressBar-color: linear-gradient( 90deg, var(--primary-600) 0%, var(--primary-400) 100% )}:root{--section-spacing: var(--xl3);--section-header-spacing: var(--lg3);--section-eyebrow-color: light-dark(var(--primary-600), var(--primary-400));--section-lede-color: light-dark(var(--base-500), var(--base-400));--section-filled-background-color: light-dark(var(--base-50), var(--base-900));--section-primary-background-color: light-dark( var(--primary-600), var(--primary-900) );--section-primary-text-color: var(--base-0);--section-primary-link-color: var(--primary-100);--section-primary-link-color-hover: var(--base-0);--section-primary-eyebrow-color: var(--primary-200);--section-primary-lede-color: var(--primary-100)}:root{--testimonial-role-color: light-dark(var(--base-400), var(--base-500))}:root{--tags-padding: var(--xs2);--tags-font-size: var(--text-sm);--tags-color: light-dark(var(--base-500), var(--base-400));--tags-background-color: light-dark(var(--base-100), var(--base-800));--tags-background-color-hover: light-dark(var(--base-200), var(--base-950));--tags-radius: var(--radius-md)}:root{--toc-color: var(--link-color);--toc-color-hover: var(--link-color-hover);--toc-spacing: var(--xs1);--toc-indentation: var(--xs3);--toc-icon-size: 16px}}@layer base{*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion:reduce){*,:before,:after{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}:where(:not(dialog)){margin:0}html,body{min-height:100%}}@layer elements{body{line-sizing:normal;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;background-color:var(--body-background-color);color:var(--text-color);font-family:var(--text);line-height:1.5;&:has(.body-is-locked){overflow:hidden}}}@layer elements{::selection{color:var(--selection-color);background-color:var(--selection-background-color)}:where(a,u,ins,abbr){text-underline-offset:2px}a{font-weight:var(--semi-bold);color:var(--link-color);&:where(:hover){color:var(--link-color-hover);-webkit-text-decoration:none;text-decoration:none}}address{width:max-content;max-width:100%;padding:var(--sm1) var(--sm3);font-style:normal;background-color:light-dark(var(--base-50),var(--base-900));border:var(--xs2) solid transparent;border-image:8 repeating-linear-gradient(-45deg,var(--no-500) 0,var(--no-500) var(--xs2),transparent 0,transparent calc(var(--xs2) * 2),var(--primary-500) 0,var(--primary-500) calc(var(--xs2) * 3),transparent 0,transparent calc(var(--xs2) * 4))}abbr{position:relative;cursor:help;&:after{position:relative;top:calc(var(--xs1) * -1);width:var(--sm1);height:var(--sm1);display:inline-block;content:"";background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");background-size:contain}&:hover:before{width:max-content;max-width:400px;position:absolute;left:50%;padding:var(--xs1) var(--xs3);content:attr(title);color:var(--base-0);background-color:var(--base-900);opacity:var(--o-4);border-radius:var(--radius-sm);transform:translate(-50%,-2em)}}blockquote{position:relative;margin-bottom:var(--prose-spacing);padding-block:var(--sm1);padding-inline:var(--md1) var(--sm3);font-style:italic;background-color:light-dark(var(--primary-50),var(--primary-900));border-radius:var(--radius-md);&:before{content:"";position:absolute;top:0;inset-inline-start:0;width:var(--xs2);height:100%;border-start-start-radius:var(--radius-md);border-end-start-radius:var(--radius-md);background-image:linear-gradient(var(--primary-800),var(--primary-500))}p{&:first-child:before{content:open-quote}&:last-child{margin-bottom:0;&:after{content:close-quote}}}}cite{font-style:italic}code,var,kbd{font-family:var(--mono);font-size:.9em;font-style:normal;color:light-dark(var(--base-500),var(--base-300))}:is(code,var,kbd):not(h1 *,h2 *,h3 *,h4 *,h5 *,h6 *,pre *){padding:.15em .3em;color:var(--text-code-color);background-color:var(--text-code-background-color);border-radius:var(--radius-sm)}dt{font-weight:var(--bold)}dd+dt{margin-top:.5em}del{text-decoration-color:var(--no-500);text-decoration-style:wavy}h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{overflow-wrap:break-word;text-wrap:balance}h1,.h1,h2,.h2,h3,.h3,h4,.h4{font-family:var(--heading-font);font-weight:var(--heading-weight);line-height:var(--heading-line-height)}h1,.h1,h2,.h2,h3,.h3{margin-bottom:var(--sm1)}h4,.h4{margin-bottom:var(--sm2)}h5,.h5,h6,.h6{margin-bottom:var(--xs2)}:where(h1,h2,h3):has(+:is(h2,h3,h4)){margin-bottom:var(--sm2)}h1,.h1{font-size:var(--heading-1)}h2,.h2{font-size:var(--heading-2)}h3,.h3{font-size:var(--heading-3)}h4,.h4{font-size:var(--heading-4)}h5,.h5{font-size:var(--heading-5)}h6,.h6{font-size:var(--heading-6)}hr{--content: "";display:flex;justify-content:center;align-items:center;height:0;border-style:solid;border-width:1px 0 0;color:var(--ui-border-color);overflow:visible;&:after{content:var(--content);padding:0 var(--xs1);line-height:1;letter-spacing:var(--tracking-sm);background-color:var(--body-background-color)}}:where(hr):has(+:is(p)){margin-bottom:var(--prose-spacing)}ins{padding:.15em .3em;color:var(--base-950);background-color:var(--yes-200);border-radius:var(--radius-sm);-webkit-text-decoration:none;text-decoration:none;&:before{content:"+ "}}mark{padding:.15em .5em;background:var(--marker-color);border-radius:1em 0}:where(ol,ul){list-style-type:none;padding:0}pre{font-family:var(--mono);font-size:.9rem;white-space:pre-wrap;border-radius:var(--pre-border-radius)}q{font-style:italic}s{text-decoration-color:light-dark(var(--base-950),var(--base-50));text-decoration-style:wavy}sub,sup{line-height:1}}@layer elements{:root{quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(af),:not(:lang(af))>:lang(af){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ak),:not(:lang(ak))>:lang(ak){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(asa),:not(:lang(asa))>:lang(asa){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(az),:not(:lang(az))>:lang(az){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(bem),:not(:lang(bem))>:lang(bem){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(bez),:not(:lang(bez))>:lang(bez){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(bn),:not(:lang(bn))>:lang(bn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(brx),:not(:lang(brx))>:lang(brx){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(cgg),:not(:lang(cgg))>:lang(cgg){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(chr),:not(:lang(chr))>:lang(chr){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(cy),:not(:lang(cy))>:lang(cy){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(da),:not(:lang(da))>:lang(da){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(dav),:not(:lang(dav))>:lang(dav){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(dje),:not(:lang(dje))>:lang(dje){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(dz),:not(:lang(dz))>:lang(dz){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ebu),:not(:lang(ebu))>:lang(ebu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ee),:not(:lang(ee))>:lang(ee){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(en),:not(:lang(en))>:lang(en){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(fil),:not(:lang(fil))>:lang(fil){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(fo),:not(:lang(fo))>:lang(fo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ga),:not(:lang(ga))>:lang(ga){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(gd),:not(:lang(gd))>:lang(gd){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(gl),:not(:lang(gl))>:lang(gl){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(gu),:not(:lang(gu))>:lang(gu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(guz),:not(:lang(guz))>:lang(guz){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ha),:not(:lang(ha))>:lang(ha){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(hi),:not(:lang(hi))>:lang(hi){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(id),:not(:lang(id))>:lang(id){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ig),:not(:lang(ig))>:lang(ig){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(jmc),:not(:lang(jmc))>:lang(jmc){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kam),:not(:lang(kam))>:lang(kam){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kde),:not(:lang(kde))>:lang(kde){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kea),:not(:lang(kea))>:lang(kea){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(khq),:not(:lang(khq))>:lang(khq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ki),:not(:lang(ki))>:lang(ki){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kln),:not(:lang(kln))>:lang(kln){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(km),:not(:lang(km))>:lang(km){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kn),:not(:lang(kn))>:lang(kn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ko),:not(:lang(ko))>:lang(ko){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ksb),:not(:lang(ksb))>:lang(ksb){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lg),:not(:lang(lg))>:lang(lg){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ln),:not(:lang(ln))>:lang(ln){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lo),:not(:lang(lo))>:lang(lo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lrc),:not(:lang(lrc))>:lang(lrc){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lu),:not(:lang(lu))>:lang(lu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(luo),:not(:lang(luo))>:lang(luo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lv),:not(:lang(lv))>:lang(lv){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mas),:not(:lang(mas))>:lang(mas){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mer),:not(:lang(mer))>:lang(mer){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mfe),:not(:lang(mfe))>:lang(mfe){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mgo),:not(:lang(mgo))>:lang(mgo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ml),:not(:lang(ml))>:lang(ml){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mn),:not(:lang(mn))>:lang(mn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mr),:not(:lang(mr))>:lang(mr){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ms),:not(:lang(ms))>:lang(ms){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mt),:not(:lang(mt))>:lang(mt){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(my),:not(:lang(my))>:lang(my){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(naq),:not(:lang(naq))>:lang(naq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(nd),:not(:lang(nd))>:lang(nd){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ne),:not(:lang(ne))>:lang(ne){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(nus),:not(:lang(nus))>:lang(nus){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(nyn),:not(:lang(nyn))>:lang(nyn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(pa),:not(:lang(pa))>:lang(pa){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(pt),:not(:lang(pt))>:lang(pt){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(rof),:not(:lang(rof))>:lang(rof){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(rwk),:not(:lang(rwk))>:lang(rwk){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(saq),:not(:lang(saq))>:lang(saq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(sbp),:not(:lang(sbp))>:lang(sbp){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(seh),:not(:lang(seh))>:lang(seh){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ses),:not(:lang(ses))>:lang(ses){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(si),:not(:lang(si))>:lang(si){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(so),:not(:lang(so))>:lang(so){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(sw),:not(:lang(sw))>:lang(sw){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ta),:not(:lang(ta))>:lang(ta){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(te),:not(:lang(te))>:lang(te){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(teo),:not(:lang(teo))>:lang(teo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(th),:not(:lang(th))>:lang(th){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(to),:not(:lang(to))>:lang(to){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(tr),:not(:lang(tr))>:lang(tr){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(twq),:not(:lang(twq))>:lang(twq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(tzm),:not(:lang(tzm))>:lang(tzm){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(uz-Cyrl),:not(:lang(uz-Cyrl))>:lang(uz-Cyrl){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vai),:not(:lang(vai))>:lang(vai){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vai-Latn),:not(:lang(vai-Latn))>:lang(vai-Latn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vi),:not(:lang(vi))>:lang(vi){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vun),:not(:lang(vun))>:lang(vun){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(xog),:not(:lang(xog))>:lang(xog){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(yo),:not(:lang(yo))>:lang(yo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(yue-Hans),:not(:lang(yue-Hans))>:lang(yue-Hans){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(zh),:not(:lang(zh))>:lang(zh){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(zu),:not(:lang(zu))>:lang(zu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(uz),:not(:lang(uz))>:lang(uz){quotes:"\201c" "\201d" "\2019" "\2018"}:root:lang(eu),:not(:lang(eu))>:lang(eu){quotes:"\201c" "\201d" "\201c" "\201d"}:root:lang(tk),:not(:lang(tk))>:lang(tk){quotes:"\201c" "\201d" "\201c" "\201d"}:root:lang(ar),:not(:lang(ar))>:lang(ar){quotes:"\201d" "\201c" "\2019" "\2018"}:root:lang(ur),:not(:lang(ur))>:lang(ur){quotes:"\201d" "\201c" "\2019" "\2018"}:root:lang(fi),:not(:lang(fi))>:lang(fi){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(he),:not(:lang(he))>:lang(he){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(lag),:not(:lang(lag))>:lang(lag){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(rn),:not(:lang(rn))>:lang(rn){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(sn),:not(:lang(sn))>:lang(sn){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(sv),:not(:lang(sv))>:lang(sv){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(sr),:not(:lang(sr))>:lang(sr){quotes:"\201e" "\201c" "\2018" "\2018"}:root:lang(sr-Latn),:not(:lang(sr-Latn))>:lang(sr-Latn){quotes:"\201e" "\201c" "\2018" "\2018"}:root:lang(bg),:not(:lang(bg))>:lang(bg){quotes:"\201e" "\201c" "\201e" "\201c"}:root:lang(lt),:not(:lang(lt))>:lang(lt){quotes:"\201e" "\201c" "\201e" "\201c"}:root:lang(bs-Cyrl),:not(:lang(bs-Cyrl))>:lang(bs-Cyrl){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(cs),:not(:lang(cs))>:lang(cs){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(de),:not(:lang(de))>:lang(de){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(dsb),:not(:lang(dsb))>:lang(dsb){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(et),:not(:lang(et))>:lang(et){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(hr),:not(:lang(hr))>:lang(hr){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(hsb),:not(:lang(hsb))>:lang(hsb){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(is),:not(:lang(is))>:lang(is){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(lb),:not(:lang(lb))>:lang(lb){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(luy),:not(:lang(luy))>:lang(luy){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(mk),:not(:lang(mk))>:lang(mk){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(sk),:not(:lang(sk))>:lang(sk){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(sl),:not(:lang(sl))>:lang(sl){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(ka),:not(:lang(ka))>:lang(ka){quotes:"\201e" "\201c" "\ab" "\bb"}:root:lang(bs),:not(:lang(bs))>:lang(bs){quotes:"\201e" "\201d" "\2018" "\2019"}:root:lang(agq),:not(:lang(agq))>:lang(agq){quotes:"\201e" "\201d" "\201a" "\2019"}:root:lang(ff),:not(:lang(ff))>:lang(ff){quotes:"\201e" "\201d" "\201a" "\2019"}:root:lang(nmg),:not(:lang(nmg))>:lang(nmg){quotes:"\201e" "\201d" "\ab" "\bb"}:root:lang(ro),:not(:lang(ro))>:lang(ro){quotes:"\201e" "\201d" "\ab" "\bb"}:root:lang(pl),:not(:lang(pl))>:lang(pl){quotes:"\201e" "\201d" "\ab" "\bb"}:root:lang(hu),:not(:lang(hu))>:lang(hu){quotes:"\201e" "\201d" "\bb" "\ab"}:root:lang(nl),:not(:lang(nl))>:lang(nl){quotes:"\2018" "\2019" "\201c" "\201d"}:root:lang(ti-ER),:not(:lang(ti-ER))>:lang(ti-ER){quotes:"\2018" "\2019" "\201c" "\201d"}:root:lang(dua),:not(:lang(dua))>:lang(dua){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(ksf),:not(:lang(ksf))>:lang(ksf){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(rw),:not(:lang(rw))>:lang(rw){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(nn),:not(:lang(nn))>:lang(nn){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(nb),:not(:lang(nb))>:lang(nb){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(ast),:not(:lang(ast))>:lang(ast){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(bm),:not(:lang(bm))>:lang(bm){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(br),:not(:lang(br))>:lang(br){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(ca),:not(:lang(ca))>:lang(ca){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(dyo),:not(:lang(dyo))>:lang(dyo){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(el),:not(:lang(el))>:lang(el){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(es),:not(:lang(es))>:lang(es){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(ewo),:not(:lang(ewo))>:lang(ewo){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(mg),:not(:lang(mg))>:lang(mg){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(mua),:not(:lang(mua))>:lang(mua){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(sg),:not(:lang(sg))>:lang(sg){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(it),:not(:lang(it))>:lang(it){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(kab),:not(:lang(kab))>:lang(kab){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(kk),:not(:lang(kk))>:lang(kk){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(pt-PT),:not(:lang(pt-PT))>:lang(pt-PT){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(nnh),:not(:lang(nnh))>:lang(nnh){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(sq),:not(:lang(sq))>:lang(sq){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(bas),:not(:lang(bas))>:lang(bas){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(be),:not(:lang(be))>:lang(be){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(ky),:not(:lang(ky))>:lang(ky){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(sah),:not(:lang(sah))>:lang(sah){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(ru),:not(:lang(ru))>:lang(ru){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(uk),:not(:lang(uk))>:lang(uk){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(zgh),:not(:lang(zgh))>:lang(zgh){quotes:"\ab" "\bb" "\201e" "\201d"}:root:lang(shi),:not(:lang(shi))>:lang(shi){quotes:"\ab" "\bb" "\201e" "\201d"}:root:lang(shi-Latn),:not(:lang(shi-Latn))>:lang(shi-Latn){quotes:"\ab" "\bb" "\201e" "\201d"}:root:lang(am),:not(:lang(am))>:lang(am){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(az-Cyrl),:not(:lang(az-Cyrl))>:lang(az-Cyrl){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(fa),:not(:lang(fa))>:lang(fa){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(fr-CH),:not(:lang(fr-CH))>:lang(fr-CH){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(gsw),:not(:lang(gsw))>:lang(gsw){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(jgo),:not(:lang(jgo))>:lang(jgo){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(kkj),:not(:lang(kkj))>:lang(kkj){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(mzn),:not(:lang(mzn))>:lang(mzn){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(fr),:not(:lang(fr))>:lang(fr){quotes:"\ab" "\bb" "\ab" "\bb"}:root:lang(hy),:not(:lang(hy))>:lang(hy){quotes:"\ab" "\bb" "\ab" "\bb"}:root:lang(yav),:not(:lang(yav))>:lang(yav){quotes:"\ab" "\bb" "\ab" "\bb"}:root:lang(ja),:not(:lang(ja))>:lang(ja){quotes:"\300c" "\300d" "\300e" "\300f"}:root:lang(yue),:not(:lang(yue))>:lang(yue){quotes:"\300c" "\300d" "\300e" "\300f"}:root:lang(zh-Hant),:not(:lang(zh-Hant))>:lang(zh-Hant){quotes:"\300c" "\300d" "\300e" "\300f"}}@layer elements{audio,canvas,embed,iframe,img,object,picture,svg,video{display:block;vertical-align:middle;max-width:100%}img,svg,video,canvas{height:auto}audio{width:100%;max-width:var(--tera1)}audio:not([controls]){display:none}figcaption{font-style:italic;font-size:var(--text-sm)}figure{&:has(*+figcaption){figcaption{margin-top:var(--xs2)}}&:has(figcaption+*){figcaption{margin-bottom:var(--xs2)}}}iframe{border:1px solid var(--ui-border-color)}}@layer elements{caption{caption-side:bottom;margin-top:var(--xs3);font-size:var(--text-sm)}table{border-spacing:0;border:1px solid var(--table-border-color);border-radius:var(--table-border-radius);background-color:var(--table-background-color)}th,td{text-align:start;padding:var(--table-padding);border-bottom:1px solid var(--table-border-color);border-inline-start:1px solid var(--table-border-color)}tr{th:first-child,td:first-child{border-inline-start-width:0}}tbody{tr:last-child{th,td{border-bottom-width:0}}}tfoot{th,td{border-top:1px solid var(--table-border-color);border-bottom-width:0}}}@layer elements{::placeholder{opacity:var(--o-4)}input,button,textarea,select{font:inherit;color:var(--text-color)}button{color:var(--text-color)}fieldset{border:1px solid var(--ui-border-color);border-radius:var(--radius-lg);padding:var(--sm3);ul:has([type=checkbox],[type=radio]){padding-inline-start:0}>[aria-hidden]{margin-bottom:var(--sm3);font-size:var(--text-lg);grid-column:1 / -1}}:is(input,select,textarea):user-invalid{border-color:var(--input-border-color-invalid)}input{&:where(:not([type=checkbox],[type=radio])){height:var(--input-height)}&:where(:not([type=color],[type=file],[type=reset],[type=submit])){padding:var(--input-padding)}&:where(:not([type=color])){border-radius:var(--input-border-radius)}&:where(:not([type=file])){border:1px solid var(--ui-border-color)}&[type=file]{width:100%;accent-color:var(--text-color)}&[type=number]{padding-inline-end:var(--xs1)}}label{display:block;&:has(+:is(input,select,textarea)){margin-bottom:var(--xs1)}}legend{position:absolute;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);width:1px;height:1px;white-space:nowrap}meter{--meter-height: var(--sm1);--meter-radius: var(--radius-md);--meter-color-track: var(--primary-100);--meter-color-low: var(--no-400);--meter-color-med: var(--maybe-400);--meter-color-high: var(--yes-400);width:100%;background:var(--meter-color-track);border-radius:var(--meter-radius);height:var(--meter-height);&::-webkit-meter-bar{background:var(--meter-color-track)}&::-webkit-meter-bar,&::-webkit-meter-optimum-value,&::-webkit-meter-suboptimum-value,&::-webkit-meter-even-less-good-value{height:var(--meter-height);border:none;border-radius:var(--meter-radius)}&::-webkit-meter-even-less-good-value{background:var(--meter-color-low)}&::-webkit-meter-suboptimum-value{background:var(--meter-color-med)}&::-webkit-meter-optimum-value{background:var(--meter-color-high)}&:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:var(--meter-color-low)}&:-moz-meter-sub-optimum::-moz-meter-bar{background:var(--meter-color-med)}&:-moz-meter-optimum::-moz-meter-bar{background:var(--meter-color-high)}}progress{--progress-height: var(--sm1);--progress-color: var(--primary-500);--progress-track-color: var(--primary-100);--progress-radius: var(--radius-md);appearance:none;width:100%;height:var(--progress-height);background:var(--progress-track-color);border-radius:var(--progress-radius);border:none;&::-moz-progress-bar{background:var(--progress-color);border-radius:var(--progress-radius)}&::-webkit-progress-bar{width:100%;background:var(--progress-track-color);border-radius:var(--progress-radius);height:var(--progress-height)}&::-webkit-progress-value{background:var(--progress-color);border-radius:var(--progress-radius)}}select{--icon-size: 24px;--split: calc(100% - var(--icon-size));display:flex;appearance:none;height:var(--input-height);padding:var(--xs1) calc(var(--input-padding) + var(--md1)) var(--xs1) var(--input-padding);border:1px solid var(--ui-border-color);border-radius:var(--input-border-radius);background:linear-gradient(to right,var(--body-background-color) 0 var(--split),var(--text-color) var(--split) 100%);mask-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E"),linear-gradient(to right,transparent calc(var(--split) - 1px),red 0),linear-gradient(red 0 0);mask-size:var(--icon-size),auto,auto;mask-position:calc(100% - var(--xs1)) center,0 0,0 0;mask-repeat:no-repeat;mask-clip:padding-box,padding-box,border-box;mask-origin:padding-box,padding-box,border-box;mask-composite:add,exclude;&:disabled{--disabled-color: light-dark( hsl(from var(--text-color) h s 70%), hsl(from var(--text-color) h s 40%) );cursor:not-allowed;color:var(--disabled-color);background:linear-gradient(to right,var(--body-background-color) 0 var(--split),var(--disabled-color) var(--split) 100%)}&[multiple]{height:auto;padding:var(--input-padding);background:var(--body-background-color);mask-image:none}}textarea{width:100%;padding:var(--xs3);border-radius:var(--input-border-radius);border:1px solid var(--ui-border-color);resize:vertical;&:not([rows]){min-height:6em}}}@layer elements{dialog{min-width:var(--tera1);max-width:var(--tera3);padding:var(--lg1) var(--md1);border:1px solid light-dark(var(--base-200),var(--base-800));background-color:light-dark(var(--base-50),var(--base-900));border-radius:var(--radius-lg);&::backdrop{background:var(--dialog-backdrop-color);opacity:var(--dialog-backdrop-opacity)}[aria-label="close pop-up"]{position:absolute;top:var(--xs3);right:var(--xs3);background:transparent;border:none;outline:none;cursor:pointer}p:last-of-type{margin-bottom:0}}details{padding:var(--sm1) var(--sm1);border:1px solid light-dark(var(--base-200),var(--base-800));background-color:light-dark(var(--base-50),var(--base-900));border-radius:var(--radius-lg);cursor:pointer;summary{display:flex;justify-content:space-between;font-weight:var(--bold);&::-webkit-details-marker{display:none}&:after{content:"";width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E") no-repeat;transition:var(--transition)}}&[open]>summary{margin-bottom:var(--xs3);&:after{transform:rotate(180deg)}}p:last-of-type{margin-bottom:0}}}@layer global{:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.a11y-skipLink{position:fixed;z-index:var(--z-top);inset-block-start:-100vb;inset-inline-start:0;padding:.75em 1.25em;background-color:var(--body-background-color);color:var(--text-color)}.a11y-skipLink:focus{inset-block-start:0}.a11y-srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}@layer global{@keyframes fadeFromOpaque{0%{opacity:1}}@keyframes fadeToOpaque{to{opacity:1}}@keyframes fadeFromTransparent{0%{opacity:0}}@keyframes fadeToTransparent{to{opacity:0}}}@layer global{.grid{display:grid;--grid-tc: repeat(4, 1fr);--grid-cs: 1;--grid-ce: -1;grid-template-columns:var(--grid-tc);grid-column-gap:var(--grid-column-gap);grid-row-gap:var(--grid-row-gap)}.grid-flush{grid-column-gap:0;grid-row-gap:0}.grid>.grid_item{display:block;appearance:none;-webkit-appearance:none}.grid[col="1"]{--grid-tc: repeat(1, 1fr) }.grid[col="2"]{--grid-tc: repeat(2, 1fr) }.grid[col="3"]{--grid-tc: repeat(3, 1fr) }.grid[col="4"]{--grid-tc: repeat(4, 1fr) }.grid[col="5"]{--grid-tc: repeat(5, 1fr) }.grid[col="6"]{--grid-tc: repeat(6, 1fr) }.grid[col="7"]{--grid-tc: repeat(7, 1fr) }.grid[col="8"]{--grid-tc: repeat(8, 1fr) }.grid[col="9"]{--grid-tc: repeat(9, 1fr) }.grid[col="10"]{--grid-tc: repeat(10, 1fr) }.grid[col="11"]{--grid-tc: repeat(11, 1fr) }.grid[col="12"]{--grid-tc: repeat(12, 1fr) }.grid[col="13"]{--grid-tc: repeat(13, 1fr) }.grid[col="14"]{--grid-tc: repeat(14, 1fr) }.grid[col="15"]{--grid-tc: repeat(15, 1fr) }.grid[col="16"]{--grid-tc: repeat(16, 1fr) }.grid[col="17"]{--grid-tc: repeat(17, 1fr) }.grid[col="18"]{--grid-tc: repeat(18, 1fr) }.grid[col="19"]{--grid-tc: repeat(19, 1fr) }.grid[col="20"]{--grid-tc: repeat(20, 1fr) }.grid[col="21"]{--grid-tc: repeat(21, 1fr) }.grid[col="22"]{--grid-tc: repeat(22, 1fr) }.grid[col="23"]{--grid-tc: repeat(23, 1fr) }.grid[col="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span^="1"]{--grid-cs: 1 }.grid>.grid_item[span^="2"]{--grid-cs: 2 }.grid>.grid_item[span^="3"]{--grid-cs: 3 }.grid>.grid_item[span^="4"]{--grid-cs: 4 }.grid>.grid_item[span^="5"]{--grid-cs: 5 }.grid>.grid_item[span^="6"]{--grid-cs: 6 }.grid>.grid_item[span^="7"]{--grid-cs: 7 }.grid>.grid_item[span^="8"]{--grid-cs: 8 }.grid>.grid_item[span^="9"]{--grid-cs: 9 }.grid>.grid_item[span^="10"]{--grid-cs: 10 }.grid>.grid_item[span^="11"]{--grid-cs: 11 }.grid>.grid_item[span^="12"]{--grid-cs: 12 }.grid>.grid_item[span^="13"]{--grid-cs: 13 }.grid>.grid_item[span^="14"]{--grid-cs: 14 }.grid>.grid_item[span^="15"]{--grid-cs: 15 }.grid>.grid_item[span^="16"]{--grid-cs: 16 }.grid>.grid_item[span^="17"]{--grid-cs: 17 }.grid>.grid_item[span^="18"]{--grid-cs: 18 }.grid>.grid_item[span^="19"]{--grid-cs: 19 }.grid>.grid_item[span^="20"]{--grid-cs: 20 }.grid>.grid_item[span^="21"]{--grid-cs: 21 }.grid>.grid_item[span^="22"]{--grid-cs: 22 }.grid>.grid_item[span^="23"]{--grid-cs: 23 }.grid>.grid_item[span^="24"]{--grid-cs: 24 }.grid>.grid_item[span$="+1"],.grid>.grid_item[span="1"]{--grid-ce: 1 }.grid>.grid_item[span$="+2"],.grid>.grid_item[span$="-1"],.grid>.grid_item[span="2"]{--grid-ce: 2 }.grid>.grid_item[span$="+3"],.grid>.grid_item[span$="-2"],.grid>.grid_item[span="3"]{--grid-ce: 3 }.grid>.grid_item[span$="+4"],.grid>.grid_item[span$="-3"],.grid>.grid_item[span="4"]{--grid-ce: 4 }.grid>.grid_item[span$="+5"],.grid>.grid_item[span$="-4"],.grid>.grid_item[span="5"]{--grid-ce: 5 }.grid>.grid_item[span$="+6"],.grid>.grid_item[span$="-5"],.grid>.grid_item[span="6"]{--grid-ce: 6 }.grid>.grid_item[span$="+7"],.grid>.grid_item[span$="-6"],.grid>.grid_item[span="7"]{--grid-ce: 7 }.grid>.grid_item[span$="+8"],.grid>.grid_item[span$="-7"],.grid>.grid_item[span="8"]{--grid-ce: 8 }.grid>.grid_item[span$="+9"],.grid>.grid_item[span$="-8"],.grid>.grid_item[span="9"]{--grid-ce: 9 }.grid>.grid_item[span$="+10"],.grid>.grid_item[span$="-9"],.grid>.grid_item[span="10"]{--grid-ce: 10 }.grid>.grid_item[span$="+11"],.grid>.grid_item[span$="-10"],.grid>.grid_item[span="11"]{--grid-ce: 11 }.grid>.grid_item[span$="+12"],.grid>.grid_item[span$="-11"],.grid>.grid_item[span="12"]{--grid-ce: 12 }.grid>.grid_item[span$="+13"],.grid>.grid_item[span$="-12"],.grid>.grid_item[span="13"]{--grid-ce: 13 }.grid>.grid_item[span$="+14"],.grid>.grid_item[span$="-13"],.grid>.grid_item[span="14"]{--grid-ce: 14 }.grid>.grid_item[span$="+15"],.grid>.grid_item[span$="-14"],.grid>.grid_item[span="15"]{--grid-ce: 15 }.grid>.grid_item[span$="+16"],.grid>.grid_item[span$="-15"],.grid>.grid_item[span="16"]{--grid-ce: 16 }.grid>.grid_item[span$="+17"],.grid>.grid_item[span$="-16"],.grid>.grid_item[span="17"]{--grid-ce: 17 }.grid>.grid_item[span$="+18"],.grid>.grid_item[span$="-17"],.grid>.grid_item[span="18"]{--grid-ce: 18 }.grid>.grid_item[span$="+19"],.grid>.grid_item[span$="-18"],.grid>.grid_item[span="19"]{--grid-ce: 19 }.grid>.grid_item[span$="+20"],.grid>.grid_item[span$="-19"],.grid>.grid_item[span="20"]{--grid-ce: 20 }.grid>.grid_item[span$="+21"],.grid>.grid_item[span$="-20"],.grid>.grid_item[span="21"]{--grid-ce: 21 }.grid>.grid_item[span$="+22"],.grid>.grid_item[span$="-21"],.grid>.grid_item[span="22"]{--grid-ce: 22 }.grid>.grid_item[span$="+23"],.grid>.grid_item[span$="-22"],.grid>.grid_item[span="23"]{--grid-ce: 23 }.grid>.grid_item[span$="+24"],.grid>.grid_item[span$="-23"],.grid>.grid_item[span="24"]{--grid-ce: 24 }.grid>.grid_item[span$="-24"]{--grid-ce: 25 }.grid>.grid_item[span]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span*="+"],.grid>.grid_item[span*="-"],.grid>.grid_item[span*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span*="-"],.grid>.grid_item[span*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span=row]{grid-column:1 / -1}@media only screen and (width>=768px){.grid[col-md="1"]{--grid-tc: repeat(1, 1fr) }.grid[col-md="2"]{--grid-tc: repeat(2, 1fr) }.grid[col-md="3"]{--grid-tc: repeat(3, 1fr) }.grid[col-md="4"]{--grid-tc: repeat(4, 1fr) }.grid[col-md="5"]{--grid-tc: repeat(5, 1fr) }.grid[col-md="6"]{--grid-tc: repeat(6, 1fr) }.grid[col-md="7"]{--grid-tc: repeat(7, 1fr) }.grid[col-md="8"]{--grid-tc: repeat(8, 1fr) }.grid[col-md="9"]{--grid-tc: repeat(9, 1fr) }.grid[col-md="10"]{--grid-tc: repeat(10, 1fr) }.grid[col-md="11"]{--grid-tc: repeat(11, 1fr) }.grid[col-md="12"]{--grid-tc: repeat(12, 1fr) }.grid[col-md="13"]{--grid-tc: repeat(13, 1fr) }.grid[col-md="14"]{--grid-tc: repeat(14, 1fr) }.grid[col-md="15"]{--grid-tc: repeat(15, 1fr) }.grid[col-md="16"]{--grid-tc: repeat(16, 1fr) }.grid[col-md="17"]{--grid-tc: repeat(17, 1fr) }.grid[col-md="18"]{--grid-tc: repeat(18, 1fr) }.grid[col-md="19"]{--grid-tc: repeat(19, 1fr) }.grid[col-md="20"]{--grid-tc: repeat(20, 1fr) }.grid[col-md="21"]{--grid-tc: repeat(21, 1fr) }.grid[col-md="22"]{--grid-tc: repeat(22, 1fr) }.grid[col-md="23"]{--grid-tc: repeat(23, 1fr) }.grid[col-md="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span-md^="1"]{--grid-cs: 1 }.grid>.grid_item[span-md^="2"]{--grid-cs: 2 }.grid>.grid_item[span-md^="3"]{--grid-cs: 3 }.grid>.grid_item[span-md^="4"]{--grid-cs: 4 }.grid>.grid_item[span-md^="5"]{--grid-cs: 5 }.grid>.grid_item[span-md^="6"]{--grid-cs: 6 }.grid>.grid_item[span-md^="7"]{--grid-cs: 7 }.grid>.grid_item[span-md^="8"]{--grid-cs: 8 }.grid>.grid_item[span-md^="9"]{--grid-cs: 9 }.grid>.grid_item[span-md^="10"]{--grid-cs: 10 }.grid>.grid_item[span-md^="11"]{--grid-cs: 11 }.grid>.grid_item[span-md^="12"]{--grid-cs: 12 }.grid>.grid_item[span-md^="13"]{--grid-cs: 13 }.grid>.grid_item[span-md^="14"]{--grid-cs: 14 }.grid>.grid_item[span-md^="15"]{--grid-cs: 15 }.grid>.grid_item[span-md^="16"]{--grid-cs: 16 }.grid>.grid_item[span-md^="17"]{--grid-cs: 17 }.grid>.grid_item[span-md^="18"]{--grid-cs: 18 }.grid>.grid_item[span-md^="19"]{--grid-cs: 19 }.grid>.grid_item[span-md^="20"]{--grid-cs: 20 }.grid>.grid_item[span-md^="21"]{--grid-cs: 21 }.grid>.grid_item[span-md^="22"]{--grid-cs: 22 }.grid>.grid_item[span-md^="23"]{--grid-cs: 23 }.grid>.grid_item[span-md^="24"]{--grid-cs: 24 }.grid>.grid_item[span-md$="+1"],.grid>.grid_item[span-md="1"]{--grid-ce: 1 }.grid>.grid_item[span-md$="+2"],.grid>.grid_item[span-md$="-1"],.grid>.grid_item[span-md="2"]{--grid-ce: 2 }.grid>.grid_item[span-md$="+3"],.grid>.grid_item[span-md$="-2"],.grid>.grid_item[span-md="3"]{--grid-ce: 3 }.grid>.grid_item[span-md$="+4"],.grid>.grid_item[span-md$="-3"],.grid>.grid_item[span-md="4"]{--grid-ce: 4 }.grid>.grid_item[span-md$="+5"],.grid>.grid_item[span-md$="-4"],.grid>.grid_item[span-md="5"]{--grid-ce: 5 }.grid>.grid_item[span-md$="+6"],.grid>.grid_item[span-md$="-5"],.grid>.grid_item[span-md="6"]{--grid-ce: 6 }.grid>.grid_item[span-md$="+7"],.grid>.grid_item[span-md$="-6"],.grid>.grid_item[span-md="7"]{--grid-ce: 7 }.grid>.grid_item[span-md$="+8"],.grid>.grid_item[span-md$="-7"],.grid>.grid_item[span-md="8"]{--grid-ce: 8 }.grid>.grid_item[span-md$="+9"],.grid>.grid_item[span-md$="-8"],.grid>.grid_item[span-md="9"]{--grid-ce: 9 }.grid>.grid_item[span-md$="+10"],.grid>.grid_item[span-md$="-9"],.grid>.grid_item[span-md="10"]{--grid-ce: 10 }.grid>.grid_item[span-md$="+11"],.grid>.grid_item[span-md$="-10"],.grid>.grid_item[span-md="11"]{--grid-ce: 11 }.grid>.grid_item[span-md$="+12"],.grid>.grid_item[span-md$="-11"],.grid>.grid_item[span-md="12"]{--grid-ce: 12 }.grid>.grid_item[span-md$="+13"],.grid>.grid_item[span-md$="-12"],.grid>.grid_item[span-md="13"]{--grid-ce: 13 }.grid>.grid_item[span-md$="+14"],.grid>.grid_item[span-md$="-13"],.grid>.grid_item[span-md="14"]{--grid-ce: 14 }.grid>.grid_item[span-md$="+15"],.grid>.grid_item[span-md$="-14"],.grid>.grid_item[span-md="15"]{--grid-ce: 15 }.grid>.grid_item[span-md$="+16"],.grid>.grid_item[span-md$="-15"],.grid>.grid_item[span-md="16"]{--grid-ce: 16 }.grid>.grid_item[span-md$="+17"],.grid>.grid_item[span-md$="-16"],.grid>.grid_item[span-md="17"]{--grid-ce: 17 }.grid>.grid_item[span-md$="+18"],.grid>.grid_item[span-md$="-17"],.grid>.grid_item[span-md="18"]{--grid-ce: 18 }.grid>.grid_item[span-md$="+19"],.grid>.grid_item[span-md$="-18"],.grid>.grid_item[span-md="19"]{--grid-ce: 19 }.grid>.grid_item[span-md$="+20"],.grid>.grid_item[span-md$="-19"],.grid>.grid_item[span-md="20"]{--grid-ce: 20 }.grid>.grid_item[span-md$="+21"],.grid>.grid_item[span-md$="-20"],.grid>.grid_item[span-md="21"]{--grid-ce: 21 }.grid>.grid_item[span-md$="+22"],.grid>.grid_item[span-md$="-21"],.grid>.grid_item[span-md="22"]{--grid-ce: 22 }.grid>.grid_item[span-md$="+23"],.grid>.grid_item[span-md$="-22"],.grid>.grid_item[span-md="23"]{--grid-ce: 23 }.grid>.grid_item[span-md$="+24"],.grid>.grid_item[span-md$="-23"],.grid>.grid_item[span-md="24"]{--grid-ce: 24 }.grid>.grid_item[span-md$="-24"]{--grid-ce: 25 }.grid>.grid_item[span-md]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span-md*="+"],.grid>.grid_item[span-md*="-"],.grid>.grid_item[span-md*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span-md*="-"],.grid>.grid_item[span-md*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span-md=row]{grid-column:1 / -1}}@media only screen and (width>=1024px){.grid[col-lg="1"]{--grid-tc: repeat(1, 1fr) }.grid[col-lg="2"]{--grid-tc: repeat(2, 1fr) }.grid[col-lg="3"]{--grid-tc: repeat(3, 1fr) }.grid[col-lg="4"]{--grid-tc: repeat(4, 1fr) }.grid[col-lg="5"]{--grid-tc: repeat(5, 1fr) }.grid[col-lg="6"]{--grid-tc: repeat(6, 1fr) }.grid[col-lg="7"]{--grid-tc: repeat(7, 1fr) }.grid[col-lg="8"]{--grid-tc: repeat(8, 1fr) }.grid[col-lg="9"]{--grid-tc: repeat(9, 1fr) }.grid[col-lg="10"]{--grid-tc: repeat(10, 1fr) }.grid[col-lg="11"]{--grid-tc: repeat(11, 1fr) }.grid[col-lg="12"]{--grid-tc: repeat(12, 1fr) }.grid[col-lg="13"]{--grid-tc: repeat(13, 1fr) }.grid[col-lg="14"]{--grid-tc: repeat(14, 1fr) }.grid[col-lg="15"]{--grid-tc: repeat(15, 1fr) }.grid[col-lg="16"]{--grid-tc: repeat(16, 1fr) }.grid[col-lg="17"]{--grid-tc: repeat(17, 1fr) }.grid[col-lg="18"]{--grid-tc: repeat(18, 1fr) }.grid[col-lg="19"]{--grid-tc: repeat(19, 1fr) }.grid[col-lg="20"]{--grid-tc: repeat(20, 1fr) }.grid[col-lg="21"]{--grid-tc: repeat(21, 1fr) }.grid[col-lg="22"]{--grid-tc: repeat(22, 1fr) }.grid[col-lg="23"]{--grid-tc: repeat(23, 1fr) }.grid[col-lg="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span-lg^="1"]{--grid-cs: 1 }.grid>.grid_item[span-lg^="2"]{--grid-cs: 2 }.grid>.grid_item[span-lg^="3"]{--grid-cs: 3 }.grid>.grid_item[span-lg^="4"]{--grid-cs: 4 }.grid>.grid_item[span-lg^="5"]{--grid-cs: 5 }.grid>.grid_item[span-lg^="6"]{--grid-cs: 6 }.grid>.grid_item[span-lg^="7"]{--grid-cs: 7 }.grid>.grid_item[span-lg^="8"]{--grid-cs: 8 }.grid>.grid_item[span-lg^="9"]{--grid-cs: 9 }.grid>.grid_item[span-lg^="10"]{--grid-cs: 10 }.grid>.grid_item[span-lg^="11"]{--grid-cs: 11 }.grid>.grid_item[span-lg^="12"]{--grid-cs: 12 }.grid>.grid_item[span-lg^="13"]{--grid-cs: 13 }.grid>.grid_item[span-lg^="14"]{--grid-cs: 14 }.grid>.grid_item[span-lg^="15"]{--grid-cs: 15 }.grid>.grid_item[span-lg^="16"]{--grid-cs: 16 }.grid>.grid_item[span-lg^="17"]{--grid-cs: 17 }.grid>.grid_item[span-lg^="18"]{--grid-cs: 18 }.grid>.grid_item[span-lg^="19"]{--grid-cs: 19 }.grid>.grid_item[span-lg^="20"]{--grid-cs: 20 }.grid>.grid_item[span-lg^="21"]{--grid-cs: 21 }.grid>.grid_item[span-lg^="22"]{--grid-cs: 22 }.grid>.grid_item[span-lg^="23"]{--grid-cs: 23 }.grid>.grid_item[span-lg^="24"]{--grid-cs: 24 }.grid>.grid_item[span-lg$="+1"],.grid>.grid_item[span-lg="1"]{--grid-ce: 1 }.grid>.grid_item[span-lg$="+2"],.grid>.grid_item[span-lg$="-1"],.grid>.grid_item[span-lg="2"]{--grid-ce: 2 }.grid>.grid_item[span-lg$="+3"],.grid>.grid_item[span-lg$="-2"],.grid>.grid_item[span-lg="3"]{--grid-ce: 3 }.grid>.grid_item[span-lg$="+4"],.grid>.grid_item[span-lg$="-3"],.grid>.grid_item[span-lg="4"]{--grid-ce: 4 }.grid>.grid_item[span-lg$="+5"],.grid>.grid_item[span-lg$="-4"],.grid>.grid_item[span-lg="5"]{--grid-ce: 5 }.grid>.grid_item[span-lg$="+6"],.grid>.grid_item[span-lg$="-5"],.grid>.grid_item[span-lg="6"]{--grid-ce: 6 }.grid>.grid_item[span-lg$="+7"],.grid>.grid_item[span-lg$="-6"],.grid>.grid_item[span-lg="7"]{--grid-ce: 7 }.grid>.grid_item[span-lg$="+8"],.grid>.grid_item[span-lg$="-7"],.grid>.grid_item[span-lg="8"]{--grid-ce: 8 }.grid>.grid_item[span-lg$="+9"],.grid>.grid_item[span-lg$="-8"],.grid>.grid_item[span-lg="9"]{--grid-ce: 9 }.grid>.grid_item[span-lg$="+10"],.grid>.grid_item[span-lg$="-9"],.grid>.grid_item[span-lg="10"]{--grid-ce: 10 }.grid>.grid_item[span-lg$="+11"],.grid>.grid_item[span-lg$="-10"],.grid>.grid_item[span-lg="11"]{--grid-ce: 11 }.grid>.grid_item[span-lg$="+12"],.grid>.grid_item[span-lg$="-11"],.grid>.grid_item[span-lg="12"]{--grid-ce: 12 }.grid>.grid_item[span-lg$="+13"],.grid>.grid_item[span-lg$="-12"],.grid>.grid_item[span-lg="13"]{--grid-ce: 13 }.grid>.grid_item[span-lg$="+14"],.grid>.grid_item[span-lg$="-13"],.grid>.grid_item[span-lg="14"]{--grid-ce: 14 }.grid>.grid_item[span-lg$="+15"],.grid>.grid_item[span-lg$="-14"],.grid>.grid_item[span-lg="15"]{--grid-ce: 15 }.grid>.grid_item[span-lg$="+16"],.grid>.grid_item[span-lg$="-15"],.grid>.grid_item[span-lg="16"]{--grid-ce: 16 }.grid>.grid_item[span-lg$="+17"],.grid>.grid_item[span-lg$="-16"],.grid>.grid_item[span-lg="17"]{--grid-ce: 17 }.grid>.grid_item[span-lg$="+18"],.grid>.grid_item[span-lg$="-17"],.grid>.grid_item[span-lg="18"]{--grid-ce: 18 }.grid>.grid_item[span-lg$="+19"],.grid>.grid_item[span-lg$="-18"],.grid>.grid_item[span-lg="19"]{--grid-ce: 19 }.grid>.grid_item[span-lg$="+20"],.grid>.grid_item[span-lg$="-19"],.grid>.grid_item[span-lg="20"]{--grid-ce: 20 }.grid>.grid_item[span-lg$="+21"],.grid>.grid_item[span-lg$="-20"],.grid>.grid_item[span-lg="21"]{--grid-ce: 21 }.grid>.grid_item[span-lg$="+22"],.grid>.grid_item[span-lg$="-21"],.grid>.grid_item[span-lg="22"]{--grid-ce: 22 }.grid>.grid_item[span-lg$="+23"],.grid>.grid_item[span-lg$="-22"],.grid>.grid_item[span-lg="23"]{--grid-ce: 23 }.grid>.grid_item[span-lg$="+24"],.grid>.grid_item[span-lg$="-23"],.grid>.grid_item[span-lg="24"]{--grid-ce: 24 }.grid>.grid_item[span-lg$="-24"]{--grid-ce: 25 }.grid>.grid_item[span-lg]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span-lg*="+"],.grid>.grid_item[span-lg*="-"],.grid>.grid_item[span-lg*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span-lg*="-"],.grid>.grid_item[span-lg*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span-lg=row]{grid-column:1 / -1}}@media only screen and (width>=1440px){.grid[col-xl="1"]{--grid-tc: repeat(1, 1fr) }.grid[col-xl="2"]{--grid-tc: repeat(2, 1fr) }.grid[col-xl="3"]{--grid-tc: repeat(3, 1fr) }.grid[col-xl="4"]{--grid-tc: repeat(4, 1fr) }.grid[col-xl="5"]{--grid-tc: repeat(5, 1fr) }.grid[col-xl="6"]{--grid-tc: repeat(6, 1fr) }.grid[col-xl="7"]{--grid-tc: repeat(7, 1fr) }.grid[col-xl="8"]{--grid-tc: repeat(8, 1fr) }.grid[col-xl="9"]{--grid-tc: repeat(9, 1fr) }.grid[col-xl="10"]{--grid-tc: repeat(10, 1fr) }.grid[col-xl="11"]{--grid-tc: repeat(11, 1fr) }.grid[col-xl="12"]{--grid-tc: repeat(12, 1fr) }.grid[col-xl="13"]{--grid-tc: repeat(13, 1fr) }.grid[col-xl="14"]{--grid-tc: repeat(14, 1fr) }.grid[col-xl="15"]{--grid-tc: repeat(15, 1fr) }.grid[col-xl="16"]{--grid-tc: repeat(16, 1fr) }.grid[col-xl="17"]{--grid-tc: repeat(17, 1fr) }.grid[col-xl="18"]{--grid-tc: repeat(18, 1fr) }.grid[col-xl="19"]{--grid-tc: repeat(19, 1fr) }.grid[col-xl="20"]{--grid-tc: repeat(20, 1fr) }.grid[col-xl="21"]{--grid-tc: repeat(21, 1fr) }.grid[col-xl="22"]{--grid-tc: repeat(22, 1fr) }.grid[col-xl="23"]{--grid-tc: repeat(23, 1fr) }.grid[col-xl="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span-xl^="1"]{--grid-cs: 1 }.grid>.grid_item[span-xl^="2"]{--grid-cs: 2 }.grid>.grid_item[span-xl^="3"]{--grid-cs: 3 }.grid>.grid_item[span-xl^="4"]{--grid-cs: 4 }.grid>.grid_item[span-xl^="5"]{--grid-cs: 5 }.grid>.grid_item[span-xl^="6"]{--grid-cs: 6 }.grid>.grid_item[span-xl^="7"]{--grid-cs: 7 }.grid>.grid_item[span-xl^="8"]{--grid-cs: 8 }.grid>.grid_item[span-xl^="9"]{--grid-cs: 9 }.grid>.grid_item[span-xl^="10"]{--grid-cs: 10 }.grid>.grid_item[span-xl^="11"]{--grid-cs: 11 }.grid>.grid_item[span-xl^="12"]{--grid-cs: 12 }.grid>.grid_item[span-xl^="13"]{--grid-cs: 13 }.grid>.grid_item[span-xl^="14"]{--grid-cs: 14 }.grid>.grid_item[span-xl^="15"]{--grid-cs: 15 }.grid>.grid_item[span-xl^="16"]{--grid-cs: 16 }.grid>.grid_item[span-xl^="17"]{--grid-cs: 17 }.grid>.grid_item[span-xl^="18"]{--grid-cs: 18 }.grid>.grid_item[span-xl^="19"]{--grid-cs: 19 }.grid>.grid_item[span-xl^="20"]{--grid-cs: 20 }.grid>.grid_item[span-xl^="21"]{--grid-cs: 21 }.grid>.grid_item[span-xl^="22"]{--grid-cs: 22 }.grid>.grid_item[span-xl^="23"]{--grid-cs: 23 }.grid>.grid_item[span-xl^="24"]{--grid-cs: 24 }.grid>.grid_item[span-xl$="+1"],.grid>.grid_item[span-xl="1"]{--grid-ce: 1 }.grid>.grid_item[span-xl$="+2"],.grid>.grid_item[span-xl$="-1"],.grid>.grid_item[span-xl="2"]{--grid-ce: 2 }.grid>.grid_item[span-xl$="+3"],.grid>.grid_item[span-xl$="-2"],.grid>.grid_item[span-xl="3"]{--grid-ce: 3 }.grid>.grid_item[span-xl$="+4"],.grid>.grid_item[span-xl$="-3"],.grid>.grid_item[span-xl="4"]{--grid-ce: 4 }.grid>.grid_item[span-xl$="+5"],.grid>.grid_item[span-xl$="-4"],.grid>.grid_item[span-xl="5"]{--grid-ce: 5 }.grid>.grid_item[span-xl$="+6"],.grid>.grid_item[span-xl$="-5"],.grid>.grid_item[span-xl="6"]{--grid-ce: 6 }.grid>.grid_item[span-xl$="+7"],.grid>.grid_item[span-xl$="-6"],.grid>.grid_item[span-xl="7"]{--grid-ce: 7 }.grid>.grid_item[span-xl$="+8"],.grid>.grid_item[span-xl$="-7"],.grid>.grid_item[span-xl="8"]{--grid-ce: 8 }.grid>.grid_item[span-xl$="+9"],.grid>.grid_item[span-xl$="-8"],.grid>.grid_item[span-xl="9"]{--grid-ce: 9 }.grid>.grid_item[span-xl$="+10"],.grid>.grid_item[span-xl$="-9"],.grid>.grid_item[span-xl="10"]{--grid-ce: 10 }.grid>.grid_item[span-xl$="+11"],.grid>.grid_item[span-xl$="-10"],.grid>.grid_item[span-xl="11"]{--grid-ce: 11 }.grid>.grid_item[span-xl$="+12"],.grid>.grid_item[span-xl$="-11"],.grid>.grid_item[span-xl="12"]{--grid-ce: 12 }.grid>.grid_item[span-xl$="+13"],.grid>.grid_item[span-xl$="-12"],.grid>.grid_item[span-xl="13"]{--grid-ce: 13 }.grid>.grid_item[span-xl$="+14"],.grid>.grid_item[span-xl$="-13"],.grid>.grid_item[span-xl="14"]{--grid-ce: 14 }.grid>.grid_item[span-xl$="+15"],.grid>.grid_item[span-xl$="-14"],.grid>.grid_item[span-xl="15"]{--grid-ce: 15 }.grid>.grid_item[span-xl$="+16"],.grid>.grid_item[span-xl$="-15"],.grid>.grid_item[span-xl="16"]{--grid-ce: 16 }.grid>.grid_item[span-xl$="+17"],.grid>.grid_item[span-xl$="-16"],.grid>.grid_item[span-xl="17"]{--grid-ce: 17 }.grid>.grid_item[span-xl$="+18"],.grid>.grid_item[span-xl$="-17"],.grid>.grid_item[span-xl="18"]{--grid-ce: 18 }.grid>.grid_item[span-xl$="+19"],.grid>.grid_item[span-xl$="-18"],.grid>.grid_item[span-xl="19"]{--grid-ce: 19 }.grid>.grid_item[span-xl$="+20"],.grid>.grid_item[span-xl$="-19"],.grid>.grid_item[span-xl="20"]{--grid-ce: 20 }.grid>.grid_item[span-xl$="+21"],.grid>.grid_item[span-xl$="-20"],.grid>.grid_item[span-xl="21"]{--grid-ce: 21 }.grid>.grid_item[span-xl$="+22"],.grid>.grid_item[span-xl$="-21"],.grid>.grid_item[span-xl="22"]{--grid-ce: 22 }.grid>.grid_item[span-xl$="+23"],.grid>.grid_item[span-xl$="-22"],.grid>.grid_item[span-xl="23"]{--grid-ce: 23 }.grid>.grid_item[span-xl$="+24"],.grid>.grid_item[span-xl$="-23"],.grid>.grid_item[span-xl="24"]{--grid-ce: 24 }.grid>.grid_item[span-xl$="-24"]{--grid-ce: 25 }.grid>.grid_item[span-xl]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span-xl*="+"],.grid>.grid_item[span-xl*="-"],.grid>.grid_item[span-xl*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span-xl*="-"],.grid>.grid_item[span-xl*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span-xl=row]{grid-column:1 / -1}}}@layer global{.layout{display:flex;flex-direction:column;width:100vw;min-height:100vh;.layout_content{flex:1}}.layout_content_main{container:main / inline-size}.layout-centered{.layout_content{display:grid;gap:var(--sm3);grid-template-columns:1fr minmax(0,var(--layout-content-width)) 1fr;margin-top:var(--lg1);margin-bottom:var(--sm1);@media(width>=768px){margin-top:var(--xl3);margin-bottom:var(--md3);gap:var(--md3)}}.layout_content_main{grid-column:2}}.layout-sidebar{.layout_content{@media(width>=768px){display:grid;grid-template-columns:var(--layout-aside-width) minmax(0,1fr)}}.layout_content_main{padding:var(--sm2);@media(width>=768px){grid-row:1;grid-column:2;padding:var(--lg1) var(--md2)}}.layout_content_aside{@media(width>=768px){grid-row:1;grid-column:1;padding:var(--lg1) var(--md3)}}}.layout-sidebar-end{.layout_content{@media(width>=768px){grid-template-columns:minmax(0,1fr) var(--layout-aside-width)}}.layout_content_main{@media(width>=768px){grid-column:1}}.layout_content_aside{@media(width>=768px){grid-column:2}}}.layout-docs{.layout_content{@media(width>=768px){display:grid;grid-template-columns:var(--layout-aside-width) minmax(0,1fr)}@media(width>=1024px){grid-template-columns:var(--layout-aside-width) minmax(0,var(--layout-content-width)) var(--layout-toc-width)}}.layout_content_main{padding:var(--sm2);@media(width>=768px){grid-row:1;grid-column:2;padding:var(--lg1) var(--md2)}}.layout_content_aside{display:none;@media(width>=768px){display:block;grid-row:1;grid-column:1;padding:var(--lg1) var(--md3)}}.layout_content_aside-toc{@media(width>=768px){display:none}@media(width>=1024px){display:block;grid-row:1;grid-column:3;padding:var(--lg1) var(--md3)}}}.layout-split{.layout_content{display:grid;@media(width>=768px){grid-template-columns:1fr 1fr}}}.layout-cover{min-height:100dvh;.layout_content{display:grid;place-items:center}}}@layer global{@scope(.prose)to (.not-prose){:is(p,ul,ol,blockquote,table):has(+:is(h1,h2,h3,h4)){margin-bottom:calc(var(--prose-spacing) * 2)}p,ul,ol,dl{margin-bottom:var(--prose-spacing);p,ul,ol,dl{margin-bottom:0}}ul,ol{ul,ol{margin-inline-start:0;padding-inline-start:var(--sm2)}li{margin-bottom:.5em;&::marker{color:light-dark(var(--base-300),var(--base-600))}}}ul{margin-inline-start:var(--sm2);list-style-type:"\2192  "}ol{margin-inline-start:var(--md2);list-style-type:decimal-leading-zero;li::marker{font-size:var(--text-sm)}}table{margin-top:var(--md1);margin-bottom:var(--md1)}}}@layer global{.wrap{display:grid;grid-template-columns:1fr var(--wrap-width) 1fr;>*,>astro-island>*,>astro-slot>*,>astro-static-slot>*{grid-column:2;padding-inline:var(--wrap-spacing);@media(width>=768px){padding-inline:var(--wrap-md-spacing)}@media(width>=1024px){padding-inline:var(--wrap-lg-spacing)}}}.wrap-sm{--wrap-width: var(--wrap-width-sm)}.wrap-md{--wrap-width: var(--wrap-width-md)}.wrap-lg{--wrap-width: var(--wrap-width-lg)}.wrap_content-fullBleed{grid-column:1 / -1;width:100%;object-fit:cover}}@layer helpers{.c-base-0{color:var(--base-0)!important}.bdc-base-0{border-color:var(--base-0)!important}.bgc-base-0{background-color:var(--base-0)!important}.c-base-50{color:var(--base-50)!important}.bdc-base-50{border-color:var(--base-50)!important}.bgc-base-50{background-color:var(--base-50)!important}.c-base-100{color:var(--base-100)!important}.bdc-base-100{border-color:var(--base-100)!important}.bgc-base-100{background-color:var(--base-100)!important}.c-base-200{color:var(--base-200)!important}.bdc-base-200{border-color:var(--base-200)!important}.bgc-base-200{background-color:var(--base-200)!important}.c-base-300{color:var(--base-300)!important}.bdc-base-300{border-color:var(--base-300)!important}.bgc-base-300{background-color:var(--base-300)!important}.c-base-400{color:var(--base-400)!important}.bdc-base-400{border-color:var(--base-400)!important}.bgc-base-400{background-color:var(--base-400)!important}.c-base-500{color:var(--base-500)!important}.bdc-base-500{border-color:var(--base-500)!important}.bgc-base-500{background-color:var(--base-500)!important}.c-base-600{color:var(--base-600)!important}.bdc-base-600{border-color:var(--base-600)!important}.bgc-base-600{background-color:var(--base-600)!important}.c-base-700{color:var(--base-700)!important}.bdc-base-700{border-color:var(--base-700)!important}.bgc-base-700{background-color:var(--base-700)!important}.c-base-800{color:var(--base-800)!important}.bdc-base-800{border-color:var(--base-800)!important}.bgc-base-800{background-color:var(--base-800)!important}.c-base-900{color:var(--base-900)!important}.bdc-base-900{border-color:var(--base-900)!important}.bgc-base-900{background-color:var(--base-900)!important}.c-base-950{color:var(--base-950)!important}.bdc-base-950{border-color:var(--base-950)!important}.bgc-base-950{background-color:var(--base-950)!important}.c-primary-50{color:var(--primary-50)!important}.bdc-primary-50{border-color:var(--primary-50)!important}.bgc-primary-50{background-color:var(--primary-50)!important}.c-primary-100{color:var(--primary-100)!important}.bdc-primary-100{border-color:var(--primary-100)!important}.bgc-primary-100{background-color:var(--primary-100)!important}.c-primary-200{color:var(--primary-200)!important}.bdc-primary-200{border-color:var(--primary-200)!important}.bgc-primary-200{background-color:var(--primary-200)!important}.c-primary-300{color:var(--primary-300)!important}.bdc-primary-300{border-color:var(--primary-300)!important}.bgc-primary-300{background-color:var(--primary-300)!important}.c-primary-400{color:var(--primary-400)!important}.bdc-primary-400{border-color:var(--primary-400)!important}.bgc-primary-400{background-color:var(--primary-400)!important}.c-primary-500{color:var(--primary-500)!important}.bdc-primary-500{border-color:var(--primary-500)!important}.bgc-primary-500{background-color:var(--primary-500)!important}.c-primary-600{color:var(--primary-600)!important}.bdc-primary-600{border-color:var(--primary-600)!important}.bgc-primary-600{background-color:var(--primary-600)!important}.c-primary-700{color:var(--primary-700)!important}.bdc-primary-700{border-color:var(--primary-700)!important}.bgc-primary-700{background-color:var(--primary-700)!important}.c-primary-800{color:var(--primary-800)!important}.bdc-primary-800{border-color:var(--primary-800)!important}.bgc-primary-800{background-color:var(--primary-800)!important}.c-primary-900{color:var(--primary-900)!important}.bdc-primary-900{border-color:var(--primary-900)!important}.bgc-primary-900{background-color:var(--primary-900)!important}.c-primary-950{color:var(--primary-950)!important}.bdc-primary-950{border-color:var(--primary-950)!important}.bgc-primary-950{background-color:var(--primary-950)!important}.c-yes-100{color:var(--yes-100)!important}.bdc-yes-100{border-color:var(--yes-100)!important}.bgc-yes-100{background-color:var(--yes-100)!important}.c-yes-200{color:var(--yes-200)!important}.bdc-yes-200{border-color:var(--yes-200)!important}.bgc-yes-200{background-color:var(--yes-200)!important}.c-yes-300{color:var(--yes-300)!important}.bdc-yes-300{border-color:var(--yes-300)!important}.bgc-yes-300{background-color:var(--yes-300)!important}.c-yes-400{color:var(--yes-400)!important}.bdc-yes-400{border-color:var(--yes-400)!important}.bgc-yes-400{background-color:var(--yes-400)!important}.c-yes-500{color:var(--yes-500)!important}.bdc-yes-500{border-color:var(--yes-500)!important}.bgc-yes-500{background-color:var(--yes-500)!important}.c-no-100{color:var(--no-100)!important}.bdc-no-100{border-color:var(--no-100)!important}.bgc-no-100{background-color:var(--no-100)!important}.c-no-200{color:var(--no-200)!important}.bdc-no-200{border-color:var(--no-200)!important}.bgc-no-200{background-color:var(--no-200)!important}.c-no-300{color:var(--no-300)!important}.bdc-no-300{border-color:var(--no-300)!important}.bgc-no-300{background-color:var(--no-300)!important}.c-no-400{color:var(--no-400)!important}.bdc-no-400{border-color:var(--no-400)!important}.bgc-no-400{background-color:var(--no-400)!important}.c-no-500{color:var(--no-500)!important}.bdc-no-500{border-color:var(--no-500)!important}.bgc-no-500{background-color:var(--no-500)!important}.c-maybe-100{color:var(--maybe-100)!important}.bdc-maybe-100{border-color:var(--maybe-100)!important}.bgc-maybe-100{background-color:var(--maybe-100)!important}.c-maybe-200{color:var(--maybe-200)!important}.bdc-maybe-200{border-color:var(--maybe-200)!important}.bgc-maybe-200{background-color:var(--maybe-200)!important}.c-maybe-300{color:var(--maybe-300)!important}.bdc-maybe-300{border-color:var(--maybe-300)!important}.bgc-maybe-300{background-color:var(--maybe-300)!important}.c-maybe-400{color:var(--maybe-400)!important}.bdc-maybe-400{border-color:var(--maybe-400)!important}.bgc-maybe-400{background-color:var(--maybe-400)!important}.c-maybe-500{color:var(--maybe-500)!important}.bdc-maybe-500{border-color:var(--maybe-500)!important}.bgc-maybe-500{background-color:var(--maybe-500)!important}}@layer helpers{body.dev{background-size:100% calc(var(--baseline) * 1px)!important;background-image:linear-gradient(to bottom,#0000 calc((var(--baseline) - 1) * 1px),#ff69b4 calc(var(--baseline) * 1px))!important}.dev-error{position:fixed!important;top:var(--md1)!important;left:var(--md1)!important;z-index:var(--z-top)!important;padding:var(--sm1)!important;font-size:1rem!important;color:var(--danger-500)!important;background:var(--danger-100)!important;border:1px solid var(--danger-500)!important;border-radius:var(--radius-md)!important}}@layer helpers{.of-auto,.overflow-auto{overflow:auto!important}.of-hidden,.overflow-hidden{overflow:hidden!important}.of-clip,.overflow-clip{overflow:clip!important}.of-visible,.overflow-visible{overflow:visible!important}.of-scroll,.overflow-scroll{overflow:scroll!important}.of-x-auto,.overflow-x-auto{overflow-x:auto!important}.of-y-auto,.overflow-y-auto{overflow-y:auto!important}.of-x-hidden,.overflow-x-hidden{overflow-x:hidden!important}.of-y-hidden,.overflow-y-hidden{overflow-y:hidden!important}.of-x-clip,.overflow-x-clip{overflow-x:clip!important}.of-y-clip,.overflow-y-clip{overflow-y:clip!important}.of-x-visible,.overflow-x-visible{overflow-x:visible!important}.of-y-visible,.overflow-y-visible{overflow-y:visible!important}.of-x-scroll,.overflow-x-scroll{overflow-x:scroll!important}.of-y-scroll,.overflow-y-scroll{overflow-y:scroll!important}.position-static{position:static!important}.position-fixed{position:fixed!important}.position-absolute{position:absolute!important}.position-relative{position:relative!important}.position-sticky{position:sticky!important}.visibility-visible{visibility:visible!important}.visibility-hidden{visibility:hidden!important}.visibility-collapse{visibility:collapse!important}.z-auto{z-index:auto!important}.z-bottom{z-index:var(--z-bottom)!important}.z-0{z-index:var(--z-0)!important}.z-1{z-index:var(--z-1)!important}.z-2{z-index:var(--z-2)!important}.z-3{z-index:var(--z-3)!important}.z-4{z-index:var(--z-4)!important}.z-5{z-index:var(--z-5)!important}.z-top{z-index:var(--z-top)!important}}@layer helpers{.o-0{opacity:var(--o-0)!important}.o-1{opacity:var(--o-1)!important}.o-2{opacity:var(--o-2)!important}.o-3{opacity:var(--o-3)!important}.o-4{opacity:var(--o-4)!important}.o-5{opacity:var(--o-5)!important}}@layer helpers{.ar-square{aspect-ratio:var(--ar-square)!important}.ar-landscape{aspect-ratio:var(--ar-landscape)!important}.ar-portrait{aspect-ratio:var(--ar-portrait)!important}.ar-widescreen{aspect-ratio:var(--ar-widescreen)!important}.ar-golden{aspect-ratio:var(--ar-golden)!important}}@layer helpers{.w-0{width:0!important}.h-0{height:0!important}.m-0{margin:0!important}.mt-0{margin-top:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mis-0{margin-inline-start:0!important}.mie-0{margin-inline-end:0!important}.p-0{padding:0!important}.pt-0{padding-top:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pis-0{padding-inline-start:0!important}.pie-0{padding-inline-end:0!important}.w-xs1{width:var(--xs1)!important}.h-xs1{height:var(--xs1)!important}.m-xs1{margin:var(--xs1)!important}.mt-xs1{margin-top:var(--xs1)!important}.mb-xs1{margin-bottom:var(--xs1)!important}.ml-xs1{margin-left:var(--xs1)!important}.mr-xs1{margin-right:var(--xs1)!important}.mis-xs1{margin-inline-start:var(--xs1)!important}.mie-xs1{margin-inline-end:var(--xs1)!important}.p-xs1{padding:var(--xs1)!important}.pt-xs1{padding-top:var(--xs1)!important}.pb-xs1{padding-bottom:var(--xs1)!important}.pl-xs1{padding-left:var(--xs1)!important}.pr-xs1{padding-right:var(--xs1)!important}.pis-xs1{padding-inline-start:var(--xs1)!important}.pie-xs1{padding-inline-end:var(--xs1)!important}.w-xs2{width:var(--xs2)!important}.h-xs2{height:var(--xs2)!important}.m-xs2{margin:var(--xs2)!important}.mt-xs2{margin-top:var(--xs2)!important}.mb-xs2{margin-bottom:var(--xs2)!important}.ml-xs2{margin-left:var(--xs2)!important}.mr-xs2{margin-right:var(--xs2)!important}.mis-xs2{margin-inline-start:var(--xs2)!important}.mie-xs2{margin-inline-end:var(--xs2)!important}.p-xs2{padding:var(--xs2)!important}.pt-xs2{padding-top:var(--xs2)!important}.pb-xs2{padding-bottom:var(--xs2)!important}.pl-xs2{padding-left:var(--xs2)!important}.pr-xs2{padding-right:var(--xs2)!important}.pis-xs2{padding-inline-start:var(--xs2)!important}.pie-xs2{padding-inline-end:var(--xs2)!important}.w-xs3{width:var(--xs3)!important}.h-xs3{height:var(--xs3)!important}.m-xs3{margin:var(--xs3)!important}.mt-xs3{margin-top:var(--xs3)!important}.mb-xs3{margin-bottom:var(--xs3)!important}.ml-xs3{margin-left:var(--xs3)!important}.mr-xs3{margin-right:var(--xs3)!important}.mis-xs3{margin-inline-start:var(--xs3)!important}.mie-xs3{margin-inline-end:var(--xs3)!important}.p-xs3{padding:var(--xs3)!important}.pt-xs3{padding-top:var(--xs3)!important}.pb-xs3{padding-bottom:var(--xs3)!important}.pl-xs3{padding-left:var(--xs3)!important}.pr-xs3{padding-right:var(--xs3)!important}.pis-xs3{padding-inline-start:var(--xs3)!important}.pie-xs3{padding-inline-end:var(--xs3)!important}.w-sm1{width:var(--sm1)!important}.h-sm1{height:var(--sm1)!important}.m-sm1{margin:var(--sm1)!important}.mt-sm1{margin-top:var(--sm1)!important}.mb-sm1{margin-bottom:var(--sm1)!important}.ml-sm1{margin-left:var(--sm1)!important}.mr-sm1{margin-right:var(--sm1)!important}.mis-sm1{margin-inline-start:var(--sm1)!important}.mie-sm1{margin-inline-end:var(--sm1)!important}.p-sm1{padding:var(--sm1)!important}.pt-sm1{padding-top:var(--sm1)!important}.pb-sm1{padding-bottom:var(--sm1)!important}.pl-sm1{padding-left:var(--sm1)!important}.pr-sm1{padding-right:var(--sm1)!important}.pis-sm1{padding-inline-start:var(--sm1)!important}.pie-sm1{padding-inline-end:var(--sm1)!important}.w-sm2{width:var(--sm2)!important}.h-sm2{height:var(--sm2)!important}.m-sm2{margin:var(--sm2)!important}.mt-sm2{margin-top:var(--sm2)!important}.mb-sm2{margin-bottom:var(--sm2)!important}.ml-sm2{margin-left:var(--sm2)!important}.mr-sm2{margin-right:var(--sm2)!important}.mis-sm2{margin-inline-start:var(--sm2)!important}.mie-sm2{margin-inline-end:var(--sm2)!important}.p-sm2{padding:var(--sm2)!important}.pt-sm2{padding-top:var(--sm2)!important}.pb-sm2{padding-bottom:var(--sm2)!important}.pl-sm2{padding-left:var(--sm2)!important}.pr-sm2{padding-right:var(--sm2)!important}.pis-sm2{padding-inline-start:var(--sm2)!important}.pie-sm2{padding-inline-end:var(--sm2)!important}.w-sm3{width:var(--sm3)!important}.h-sm3{height:var(--sm3)!important}.m-sm3{margin:var(--sm3)!important}.mt-sm3{margin-top:var(--sm3)!important}.mb-sm3{margin-bottom:var(--sm3)!important}.ml-sm3{margin-left:var(--sm3)!important}.mr-sm3{margin-right:var(--sm3)!important}.mis-sm3{margin-inline-start:var(--sm3)!important}.mie-sm3{margin-inline-end:var(--sm3)!important}.p-sm3{padding:var(--sm3)!important}.pt-sm3{padding-top:var(--sm3)!important}.pb-sm3{padding-bottom:var(--sm3)!important}.pl-sm3{padding-left:var(--sm3)!important}.pr-sm3{padding-right:var(--sm3)!important}.pis-sm3{padding-inline-start:var(--sm3)!important}.pie-sm3{padding-inline-end:var(--sm3)!important}.w-md1{width:var(--md1)!important}.h-md1{height:var(--md1)!important}.m-md1{margin:var(--md1)!important}.mt-md1{margin-top:var(--md1)!important}.mb-md1{margin-bottom:var(--md1)!important}.ml-md1{margin-left:var(--md1)!important}.mr-md1{margin-right:var(--md1)!important}.mis-md1{margin-inline-start:var(--md1)!important}.mie-md1{margin-inline-end:var(--md1)!important}.p-md1{padding:var(--md1)!important}.pt-md1{padding-top:var(--md1)!important}.pb-md1{padding-bottom:var(--md1)!important}.pl-md1{padding-left:var(--md1)!important}.pr-md1{padding-right:var(--md1)!important}.pis-md1{padding-inline-start:var(--md1)!important}.pie-md1{padding-inline-end:var(--md1)!important}.w-md2{width:var(--md2)!important}.h-md2{height:var(--md2)!important}.m-md2{margin:var(--md2)!important}.mt-md2{margin-top:var(--md2)!important}.mb-md2{margin-bottom:var(--md2)!important}.ml-md2{margin-left:var(--md2)!important}.mr-md2{margin-right:var(--md2)!important}.mis-md2{margin-inline-start:var(--md2)!important}.mie-md2{margin-inline-end:var(--md2)!important}.p-md2{padding:var(--md2)!important}.pt-md2{padding-top:var(--md2)!important}.pb-md2{padding-bottom:var(--md2)!important}.pl-md2{padding-left:var(--md2)!important}.pr-md2{padding-right:var(--md2)!important}.pis-md2{padding-inline-start:var(--md2)!important}.pie-md2{padding-inline-end:var(--md2)!important}.w-md3{width:var(--md3)!important}.h-md3{height:var(--md3)!important}.m-md3{margin:var(--md3)!important}.mt-md3{margin-top:var(--md3)!important}.mb-md3{margin-bottom:var(--md3)!important}.ml-md3{margin-left:var(--md3)!important}.mr-md3{margin-right:var(--md3)!important}.mis-md3{margin-inline-start:var(--md3)!important}.mie-md3{margin-inline-end:var(--md3)!important}.p-md3{padding:var(--md3)!important}.pt-md3{padding-top:var(--md3)!important}.pb-md3{padding-bottom:var(--md3)!important}.pl-md3{padding-left:var(--md3)!important}.pr-md3{padding-right:var(--md3)!important}.pis-md3{padding-inline-start:var(--md3)!important}.pie-md3{padding-inline-end:var(--md3)!important}.w-lg1{width:var(--lg1)!important}.h-lg1{height:var(--lg1)!important}.m-lg1{margin:var(--lg1)!important}.mt-lg1{margin-top:var(--lg1)!important}.mb-lg1{margin-bottom:var(--lg1)!important}.ml-lg1{margin-left:var(--lg1)!important}.mr-lg1{margin-right:var(--lg1)!important}.mis-lg1{margin-inline-start:var(--lg1)!important}.mie-lg1{margin-inline-end:var(--lg1)!important}.p-lg1{padding:var(--lg1)!important}.pt-lg1{padding-top:var(--lg1)!important}.pb-lg1{padding-bottom:var(--lg1)!important}.pl-lg1{padding-left:var(--lg1)!important}.pr-lg1{padding-right:var(--lg1)!important}.pis-lg1{padding-inline-start:var(--lg1)!important}.pie-lg1{padding-inline-end:var(--lg1)!important}.w-lg2{width:var(--lg2)!important}.h-lg2{height:var(--lg2)!important}.m-lg2{margin:var(--lg2)!important}.mt-lg2{margin-top:var(--lg2)!important}.mb-lg2{margin-bottom:var(--lg2)!important}.ml-lg2{margin-left:var(--lg2)!important}.mr-lg2{margin-right:var(--lg2)!important}.mis-lg2{margin-inline-start:var(--lg2)!important}.mie-lg2{margin-inline-end:var(--lg2)!important}.p-lg2{padding:var(--lg2)!important}.pt-lg2{padding-top:var(--lg2)!important}.pb-lg2{padding-bottom:var(--lg2)!important}.pl-lg2{padding-left:var(--lg2)!important}.pr-lg2{padding-right:var(--lg2)!important}.pis-lg2{padding-inline-start:var(--lg2)!important}.pie-lg2{padding-inline-end:var(--lg2)!important}.w-lg3{width:var(--lg3)!important}.h-lg3{height:var(--lg3)!important}.m-lg3{margin:var(--lg3)!important}.mt-lg3{margin-top:var(--lg3)!important}.mb-lg3{margin-bottom:var(--lg3)!important}.ml-lg3{margin-left:var(--lg3)!important}.mr-lg3{margin-right:var(--lg3)!important}.mis-lg3{margin-inline-start:var(--lg3)!important}.mie-lg3{margin-inline-end:var(--lg3)!important}.p-lg3{padding:var(--lg3)!important}.pt-lg3{padding-top:var(--lg3)!important}.pb-lg3{padding-bottom:var(--lg3)!important}.pl-lg3{padding-left:var(--lg3)!important}.pr-lg3{padding-right:var(--lg3)!important}.pis-lg3{padding-inline-start:var(--lg3)!important}.pie-lg3{padding-inline-end:var(--lg3)!important}.w-xl1{width:var(--xl1)!important}.h-xl1{height:var(--xl1)!important}.m-xl1{margin:var(--xl1)!important}.mt-xl1{margin-top:var(--xl1)!important}.mb-xl1{margin-bottom:var(--xl1)!important}.ml-xl1{margin-left:var(--xl1)!important}.mr-xl1{margin-right:var(--xl1)!important}.mis-xl1{margin-inline-start:var(--xl1)!important}.mie-xl1{margin-inline-end:var(--xl1)!important}.p-xl1{padding:var(--xl1)!important}.pt-xl1{padding-top:var(--xl1)!important}.pb-xl1{padding-bottom:var(--xl1)!important}.pl-xl1{padding-left:var(--xl1)!important}.pr-xl1{padding-right:var(--xl1)!important}.pis-xl1{padding-inline-start:var(--xl1)!important}.pie-xl1{padding-inline-end:var(--xl1)!important}.w-xl2{width:var(--xl2)!important}.h-xl2{height:var(--xl2)!important}.m-xl2{margin:var(--xl2)!important}.mt-xl2{margin-top:var(--xl2)!important}.mb-xl2{margin-bottom:var(--xl2)!important}.ml-xl2{margin-left:var(--xl2)!important}.mr-xl2{margin-right:var(--xl2)!important}.mis-xl2{margin-inline-start:var(--xl2)!important}.mie-xl2{margin-inline-end:var(--xl2)!important}.p-xl2{padding:var(--xl2)!important}.pt-xl2{padding-top:var(--xl2)!important}.pb-xl2{padding-bottom:var(--xl2)!important}.pl-xl2{padding-left:var(--xl2)!important}.pr-xl2{padding-right:var(--xl2)!important}.pis-xl2{padding-inline-start:var(--xl2)!important}.pie-xl2{padding-inline-end:var(--xl2)!important}.w-xl3{width:var(--xl3)!important}.h-xl3{height:var(--xl3)!important}.m-xl3{margin:var(--xl3)!important}.mt-xl3{margin-top:var(--xl3)!important}.mb-xl3{margin-bottom:var(--xl3)!important}.ml-xl3{margin-left:var(--xl3)!important}.mr-xl3{margin-right:var(--xl3)!important}.mis-xl3{margin-inline-start:var(--xl3)!important}.mie-xl3{margin-inline-end:var(--xl3)!important}.p-xl3{padding:var(--xl3)!important}.pt-xl3{padding-top:var(--xl3)!important}.pb-xl3{padding-bottom:var(--xl3)!important}.pl-xl3{padding-left:var(--xl3)!important}.pr-xl3{padding-right:var(--xl3)!important}.pis-xl3{padding-inline-start:var(--xl3)!important}.pie-xl3{padding-inline-end:var(--xl3)!important}.w-xxl1{width:var(--xxl1)!important}.h-xxl1{height:var(--xxl1)!important}.m-xxl1{margin:var(--xxl1)!important}.mt-xxl1{margin-top:var(--xxl1)!important}.mb-xxl1{margin-bottom:var(--xxl1)!important}.ml-xxl1{margin-left:var(--xxl1)!important}.mr-xxl1{margin-right:var(--xxl1)!important}.mis-xxl1{margin-inline-start:var(--xxl1)!important}.mie-xxl1{margin-inline-end:var(--xxl1)!important}.p-xxl1{padding:var(--xxl1)!important}.pt-xxl1{padding-top:var(--xxl1)!important}.pb-xxl1{padding-bottom:var(--xxl1)!important}.pl-xxl1{padding-left:var(--xxl1)!important}.pr-xxl1{padding-right:var(--xxl1)!important}.pis-xxl1{padding-inline-start:var(--xxl1)!important}.pie-xxl1{padding-inline-end:var(--xxl1)!important}.w-xxl2{width:var(--xxl2)!important}.h-xxl2{height:var(--xxl2)!important}.m-xxl2{margin:var(--xxl2)!important}.mt-xxl2{margin-top:var(--xxl2)!important}.mb-xxl2{margin-bottom:var(--xxl2)!important}.ml-xxl2{margin-left:var(--xxl2)!important}.mr-xxl2{margin-right:var(--xxl2)!important}.mis-xxl2{margin-inline-start:var(--xxl2)!important}.mie-xxl2{margin-inline-end:var(--xxl2)!important}.p-xxl2{padding:var(--xxl2)!important}.pt-xxl2{padding-top:var(--xxl2)!important}.pb-xxl2{padding-bottom:var(--xxl2)!important}.pl-xxl2{padding-left:var(--xxl2)!important}.pr-xxl2{padding-right:var(--xxl2)!important}.pis-xxl2{padding-inline-start:var(--xxl2)!important}.pie-xxl2{padding-inline-end:var(--xxl2)!important}.w-xxl3{width:var(--xxl3)!important}.h-xxl3{height:var(--xxl3)!important}.m-xxl3{margin:var(--xxl3)!important}.mt-xxl3{margin-top:var(--xxl3)!important}.mb-xxl3{margin-bottom:var(--xxl3)!important}.ml-xxl3{margin-left:var(--xxl3)!important}.mr-xxl3{margin-right:var(--xxl3)!important}.mis-xxl3{margin-inline-start:var(--xxl3)!important}.mie-xxl3{margin-inline-end:var(--xxl3)!important}.p-xxl3{padding:var(--xxl3)!important}.pt-xxl3{padding-top:var(--xxl3)!important}.pb-xxl3{padding-bottom:var(--xxl3)!important}.pl-xxl3{padding-left:var(--xxl3)!important}.pr-xxl3{padding-right:var(--xxl3)!important}.pis-xxl3{padding-inline-start:var(--xxl3)!important}.pie-xxl3{padding-inline-end:var(--xxl3)!important}.w-mega1{width:var(--mega1)!important}.h-mega1{height:var(--mega1)!important}.m-mega1{margin:var(--mega1)!important}.mt-mega1{margin-top:var(--mega1)!important}.mb-mega1{margin-bottom:var(--mega1)!important}.ml-mega1{margin-left:var(--mega1)!important}.mr-mega1{margin-right:var(--mega1)!important}.mis-mega1{margin-inline-start:var(--mega1)!important}.mie-mega1{margin-inline-end:var(--mega1)!important}.p-mega1{padding:var(--mega1)!important}.pt-mega1{padding-top:var(--mega1)!important}.pb-mega1{padding-bottom:var(--mega1)!important}.pl-mega1{padding-left:var(--mega1)!important}.pr-mega1{padding-right:var(--mega1)!important}.pis-mega1{padding-inline-start:var(--mega1)!important}.pie-mega1{padding-inline-end:var(--mega1)!important}.w-mega2{width:var(--mega2)!important}.h-mega2{height:var(--mega2)!important}.m-mega2{margin:var(--mega2)!important}.mt-mega2{margin-top:var(--mega2)!important}.mb-mega2{margin-bottom:var(--mega2)!important}.ml-mega2{margin-left:var(--mega2)!important}.mr-mega2{margin-right:var(--mega2)!important}.mis-mega2{margin-inline-start:var(--mega2)!important}.mie-mega2{margin-inline-end:var(--mega2)!important}.p-mega2{padding:var(--mega2)!important}.pt-mega2{padding-top:var(--mega2)!important}.pb-mega2{padding-bottom:var(--mega2)!important}.pl-mega2{padding-left:var(--mega2)!important}.pr-mega2{padding-right:var(--mega2)!important}.pis-mega2{padding-inline-start:var(--mega2)!important}.pie-mega2{padding-inline-end:var(--mega2)!important}.w-mega3{width:var(--mega3)!important}.h-mega3{height:var(--mega3)!important}.m-mega3{margin:var(--mega3)!important}.mt-mega3{margin-top:var(--mega3)!important}.mb-mega3{margin-bottom:var(--mega3)!important}.ml-mega3{margin-left:var(--mega3)!important}.mr-mega3{margin-right:var(--mega3)!important}.mis-mega3{margin-inline-start:var(--mega3)!important}.mie-mega3{margin-inline-end:var(--mega3)!important}.p-mega3{padding:var(--mega3)!important}.pt-mega3{padding-top:var(--mega3)!important}.pb-mega3{padding-bottom:var(--mega3)!important}.pl-mega3{padding-left:var(--mega3)!important}.pr-mega3{padding-right:var(--mega3)!important}.pis-mega3{padding-inline-start:var(--mega3)!important}.pie-mega3{padding-inline-end:var(--mega3)!important}.w-giga1{width:var(--giga1)!important}.h-giga1{height:var(--giga1)!important}.m-giga1{margin:var(--giga1)!important}.mt-giga1{margin-top:var(--giga1)!important}.mb-giga1{margin-bottom:var(--giga1)!important}.ml-giga1{margin-left:var(--giga1)!important}.mr-giga1{margin-right:var(--giga1)!important}.mis-giga1{margin-inline-start:var(--giga1)!important}.mie-giga1{margin-inline-end:var(--giga1)!important}.p-giga1{padding:var(--giga1)!important}.pt-giga1{padding-top:var(--giga1)!important}.pb-giga1{padding-bottom:var(--giga1)!important}.pl-giga1{padding-left:var(--giga1)!important}.pr-giga1{padding-right:var(--giga1)!important}.pis-giga1{padding-inline-start:var(--giga1)!important}.pie-giga1{padding-inline-end:var(--giga1)!important}.w-giga2{width:var(--giga2)!important}.h-giga2{height:var(--giga2)!important}.m-giga2{margin:var(--giga2)!important}.mt-giga2{margin-top:var(--giga2)!important}.mb-giga2{margin-bottom:var(--giga2)!important}.ml-giga2{margin-left:var(--giga2)!important}.mr-giga2{margin-right:var(--giga2)!important}.mis-giga2{margin-inline-start:var(--giga2)!important}.mie-giga2{margin-inline-end:var(--giga2)!important}.p-giga2{padding:var(--giga2)!important}.pt-giga2{padding-top:var(--giga2)!important}.pb-giga2{padding-bottom:var(--giga2)!important}.pl-giga2{padding-left:var(--giga2)!important}.pr-giga2{padding-right:var(--giga2)!important}.pis-giga2{padding-inline-start:var(--giga2)!important}.pie-giga2{padding-inline-end:var(--giga2)!important}.w-giga3{width:var(--giga3)!important}.h-giga3{height:var(--giga3)!important}.m-giga3{margin:var(--giga3)!important}.mt-giga3{margin-top:var(--giga3)!important}.mb-giga3{margin-bottom:var(--giga3)!important}.ml-giga3{margin-left:var(--giga3)!important}.mr-giga3{margin-right:var(--giga3)!important}.mis-giga3{margin-inline-start:var(--giga3)!important}.mie-giga3{margin-inline-end:var(--giga3)!important}.p-giga3{padding:var(--giga3)!important}.pt-giga3{padding-top:var(--giga3)!important}.pb-giga3{padding-bottom:var(--giga3)!important}.pl-giga3{padding-left:var(--giga3)!important}.pr-giga3{padding-right:var(--giga3)!important}.pis-giga3{padding-inline-start:var(--giga3)!important}.pie-giga3{padding-inline-end:var(--giga3)!important}.w-tera1{width:var(--tera1)!important}.h-tera1{height:var(--tera1)!important}.m-tera1{margin:var(--tera1)!important}.mt-tera1{margin-top:var(--tera1)!important}.mb-tera1{margin-bottom:var(--tera1)!important}.ml-tera1{margin-left:var(--tera1)!important}.mr-tera1{margin-right:var(--tera1)!important}.mis-tera1{margin-inline-start:var(--tera1)!important}.mie-tera1{margin-inline-end:var(--tera1)!important}.p-tera1{padding:var(--tera1)!important}.pt-tera1{padding-top:var(--tera1)!important}.pb-tera1{padding-bottom:var(--tera1)!important}.pl-tera1{padding-left:var(--tera1)!important}.pr-tera1{padding-right:var(--tera1)!important}.pis-tera1{padding-inline-start:var(--tera1)!important}.pie-tera1{padding-inline-end:var(--tera1)!important}.w-tera2{width:var(--tera2)!important}.h-tera2{height:var(--tera2)!important}.m-tera2{margin:var(--tera2)!important}.mt-tera2{margin-top:var(--tera2)!important}.mb-tera2{margin-bottom:var(--tera2)!important}.ml-tera2{margin-left:var(--tera2)!important}.mr-tera2{margin-right:var(--tera2)!important}.mis-tera2{margin-inline-start:var(--tera2)!important}.mie-tera2{margin-inline-end:var(--tera2)!important}.p-tera2{padding:var(--tera2)!important}.pt-tera2{padding-top:var(--tera2)!important}.pb-tera2{padding-bottom:var(--tera2)!important}.pl-tera2{padding-left:var(--tera2)!important}.pr-tera2{padding-right:var(--tera2)!important}.pis-tera2{padding-inline-start:var(--tera2)!important}.pie-tera2{padding-inline-end:var(--tera2)!important}.w-tera3{width:var(--tera3)!important}.h-tera3{height:var(--tera3)!important}.m-tera3{margin:var(--tera3)!important}.mt-tera3{margin-top:var(--tera3)!important}.mb-tera3{margin-bottom:var(--tera3)!important}.ml-tera3{margin-left:var(--tera3)!important}.mr-tera3{margin-right:var(--tera3)!important}.mis-tera3{margin-inline-start:var(--tera3)!important}.mie-tera3{margin-inline-end:var(--tera3)!important}.p-tera3{padding:var(--tera3)!important}.pt-tera3{padding-top:var(--tera3)!important}.pb-tera3{padding-bottom:var(--tera3)!important}.pl-tera3{padding-left:var(--tera3)!important}.pr-tera3{padding-right:var(--tera3)!important}.pis-tera3{padding-inline-start:var(--tera3)!important}.pie-tera3{padding-inline-end:var(--tera3)!important}}@layer helpers{.font-text{font-family:var(--text)!important}.font-display{font-family:var(--display)!important}.font-mono{font-family:var(--mono)!important}.font-italic{font-style:italic!important}.font-normal{font-style:normal!important}.font-extra-light{font-weight:var(--extra-light)!important}.font-light{font-weight:var(--light)!important}.font-book{font-weight:var(--book)!important}.font-semi-bold{font-weight:var(--semi-bold)!important}.font-bold{font-weight:var(--bold)!important}.font-black{font-weight:var(--black)!important}.text-xs{font-size:var(--text-xs)!important}.text-sm{font-size:var(--text-sm)!important}.text-md{font-size:var(--text-md)!important}.text-lg{font-size:var(--text-lg)!important}.text-xl{font-size:var(--text-xl)!important}.display-sm{font-size:var(--display-sm)!important}.display-md{font-size:var(--display-md)!important}.display-lg{font-size:var(--display-lg)!important}.display-xl{font-size:var(--display-xl)!important}.display-mega{font-size:var(--display-mega)!important}.display-giga{font-size:var(--display-giga)!important}.tracking-sm{letter-spacing:var(--tracking-sm)!important}.tracking-md{letter-spacing:var(--tracking-md)!important}.tracking-lg{letter-spacing:var(--tracking-lg)!important}.tracking-xl{letter-spacing:var(--tracking-xl)!important}.tracking-xxl{letter-spacing:var(--tracking-xxl)!important}.leading-xs{line-height:var(--leading-xs)!important}.leading-sm{line-height:var(--leading-sm)!important}.leading-md{line-height:var(--leading-md)!important}.leading-lg{line-height:var(--leading-lg)!important}.leading-xl{line-height:var(--leading-xl)!important}.leading-xxl{line-height:var(--leading-xxl)!important}.text-left{text-align:left!important}.text-center{text-align:center!important}.text-right{text-align:right!important}.text-justify{text-align:justify!important}.text-start{text-align:start!important}.text-end{text-align:end!important}.text-uppercase{text-transform:uppercase!important}.text-lowercase{text-transform:lowercase!important}.text-capitalize{text-transform:capitalize!important}}
+@layer settings,base,elements,global,components,theme,helpers;@layer settings{:root{--xs1: 4px;--xs2: 8px;--xs3: 12px;--sm1: 16px;--sm2: 20px;--sm3: 24px;--md1: 28px;--md2: 32px;--md3: 36px;--lg1: 40px;--lg2: 44px;--lg3: 48px;--xl1: 56px;--xl2: 64px;--xl3: 80px;--xxl1: 96px;--xxl2: 112px;--xxl3: 128px;--mega1: 160px;--mega2: 192px;--mega3: 224px;--giga1: 256px;--giga2: 288px;--giga3: 320px;--tera1: 384px;--tera2: 480px;--tera3: 520px;--ar-square: 1;--ar-landscape: 4/3;--ar-portrait: 3/4;--ar-widescreen: 16/9;--ar-golden: 1.618/1;--display: Avenir, Montserrat, Corbel, URW Gothic, source-sans-pro, ui-sans-serif, sans-serif;--text: ui-sans-serif, system-ui, sans-serif;--mono: Dank Mono, Inconsolata, Fira Mono, SF Mono, Monaco, Droid Sans Mono, Source Code Pro, Cascadia Code, Menlo, Consolas, DejaVu Sans Mono, ui-monospace, monospace;--text-xs: .694rem;--text-sm: .833rem;--text-md: 1rem;--text-lg: 1.2rem;--text-xl: 1.44rem;--display-sm: 1.728rem;--display-md: 2.074rem;--display-lg: 2.488rem;--display-xl: 2.986rem;--display-mega: 3.583rem;--display-giga: 4.299rem;--extra-light: 200;--light: 300;--book: 400;--semi-bold: 600;--bold: 700;--black: 900;--tracking-sm: -.05em;--tracking-md: .025em;--tracking-lg: .05em;--tracking-xl: .075em;--tracking-xxl: .15em;--leading-xs: 1;--leading-sm: 1.15;--leading-md: 1.375;--leading-lg: 1.5;--leading-xl: 1.75;--leading-xxl: 2;--base-0: #fff;--base-50: #f6f7f9;--base-100: #edeef1;--base-200: #d6dbe1;--base-300: #b2bbc7;--base-400: #8897a8;--base-500: #697a8e;--base-600: #546375;--base-700: #4a5666;--base-800: #3c4550;--base-900: #353c45;--base-950: #23282e;--primary-50: #f0f9ff;--primary-100: #e0f2fe;--primary-200: #bae6fd;--primary-300: #7dd3fc;--primary-400: #38bdf8;--primary-500: #0ea5e9;--primary-600: #0284c7;--primary-700: #0369a1;--primary-800: #075985;--primary-900: #0c4a6e;--primary-950: #082f49;--yes-100: #d5f6e8;--yes-200: #afebd4;--yes-300: #7adbbd;--yes-400: #46c4a0;--yes-500: #13886d;--no-100: #ffe4e6;--no-200: #fecdd3;--no-300: #fda4af;--no-400: #fb7185;--no-500: #e11d48;--maybe-100: #fff7d6;--maybe-200: #fff0b3;--maybe-300: #ffd64a;--maybe-400: #ffc220;--maybe-500: #f9a007;--highlight-500: #ffee00;--gradient-primary: linear-gradient( 90deg, var(--primary-950) 0%, var(--primary-400) 100% );--border-sm: 1px;--border-md: 2px;--border-lg: 4px;--border-xl: 8px;--border-xxl: 12px;--radius-sm: 3px;--radius-md: 5px;--radius-lg: 8px;--radius-xl: 12px;--radius-xxl: 16px;--radius-round: 1e5px;--shadow-sm: 0 1px 3px 0 var(--ui-shadow-color), 0 1px 2px -1px var(--ui-shadow-color);--shadow-md: 0 4px 6px -1px var(--ui-shadow-color), 0 2px 4px -2px var(--ui-shadow-color);--shadow-lg: 0 8px 13px -3px var(--ui-shadow-color), 0 4px 6px -4px var(--ui-shadow-color);--shadow-xl: 0 20px 20px -5px var(--ui-shadow-color), 0 8px 10px -6px var(--ui-shadow-color);--shadow-xxl: 0px 11px 8px -6px var(--ui-shadow-color), 0 10px 15px 2px var(--ui-shadow-color);--o-0: 0;--o-1: .2;--o-2: .4;--o-3: .6;--o-4: .8;--o-5: 1;--z-bottom: -1000000000;--z-0: 0;--z-1: 10;--z-2: 20;--z-3: 30;--z-4: 40;--z-5: 50;--z-top: 1000000000;--transition: .22s ease-in-out;--transition-fast: .1s ease-in-out}}@layer settings{:root{color-scheme:light dark;--ui-border-color: light-dark(var(--base-200), var(--base-500));--ui-shadow-color: light-dark(rgb(0 0 0 / .1), rgb(0 0 0 / .6));--focus-ring-color: light-dark(var(--primary-500), var(--primary-400));--focus-ring-width: 2px;--focus-ring-offset: 2px;--success-100: var(--yes-100);--success-200: var(--yes-200);--success-300: var(--yes-300);--success-400: var(--yes-400);--success-500: var(--yes-500);--danger-100: var(--no-100);--danger-200: var(--no-200);--danger-300: var(--no-300);--danger-400: var(--no-400);--danger-500: var(--no-500);--warning-100: var(--maybe-100);--warning-200: var(--maybe-200);--warning-300: var(--maybe-300);--warning-400: var(--maybe-400);--warning-500: var(--maybe-500)}:root.theme-light{color-scheme:light}:root.theme-dark{color-scheme:dark}:root{accent-color:var(--primary-500);--body-background-color: light-dark(var(--base-0), var(--base-950));--body-line-height: var(--leading-lg);--input-height: var(--md3);--input-padding: var(--xs3);--input-border-width: var(--border-sm);--input-border-color: var(--ui-border-color);--input-border-radius: var(--radius-md);--input-border-color-invalid: light-dark( var(--danger-500), var(--danger-400) );--label-spacing: var(--xs1);--fieldset-padding: var(--sm3);--fieldset-border-width: var(--border-sm);--fieldset-border-color: var(--ui-border-color);--fieldset-border-radius: var(--radius-lg);--meter-height: var(--sm1);--meter-border-radius: var(--radius-md);--meter-track-color: var(--primary-100);--meter-low-color: var(--danger-400);--meter-medium-color: var(--warning-400);--meter-high-color: var(--success-400);--progress-height: var(--sm1);--progress-color: var(--primary-500);--progress-track-color: var(--primary-100);--progress-border-radius: var(--radius-md);--select-icon-size: var(--sm3);--select-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");--dialog-min-width: var(--tera1);--dialog-max-width: var(--tera3);--dialog-padding: var(--lg1) var(--md1);--dialog-border-width: var(--border-sm);--dialog-border-color: light-dark(var(--base-200), var(--base-800));--dialog-background-color: light-dark(var(--base-50), var(--base-900));--dialog-border-radius: var(--radius-lg);--dialog-backdrop-color: var(--base-950);--dialog-backdrop-opacity: var(--o-4);--details-padding: var(--sm1);--details-spacing: var(--xs3);--details-border-width: var(--border-sm);--details-border-color: light-dark(var(--base-200), var(--base-800));--details-background-color: light-dark(var(--base-50), var(--base-900));--details-border-radius: var(--radius-lg);--details-icon-size: var(--sm3);--details-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");--table-padding: var(--xs2) var(--sm1);--table-border-width: var(--border-sm);--table-border-color: light-dark(var(--base-100), var(--base-700));--table-border-radius: var(--radius-md);--table-background-color: none;--table-caption-spacing: var(--xs3);--figcaption-spacing: var(--xs2);--heading-font: var(--display);--heading-weight: var(--black);--heading-letter-spacing: normal;--heading-font-size-h1: clamp( var(--display-md), 1.269rem + 2.682vw, var(--display-xl) );--heading-font-size-h2: clamp( var(--display-sm), 1.057rem + 2.235vw, var(--display-lg) );--heading-font-size-h3: clamp( var(--text-xl), .881rem + 1.865vw, var(--display-md) );--heading-font-size-h4: clamp( var(--text-lg), .734rem + 1.553vw, var(--display-sm) );--heading-font-size-h5: clamp( var(--text-lg), .988rem + .706vw, var(--text-xl) );--heading-font-size-h6: clamp( var(--text-md), .824rem + .588vw, var(--text-lg) );--heading-line-height: var(--leading-sm);--heading-line-height-h1: var(--heading-line-height);--heading-line-height-h2: var(--heading-line-height);--heading-line-height-h3: var(--heading-line-height);--heading-line-height-h4: var(--leading-md);--heading-line-height-h5: var(--leading-md);--heading-line-height-h6: var(--leading-md);--heading-spacing-h1: .4em;--heading-spacing-h2: .4em;--heading-spacing-h3: .4em;--heading-spacing-h4: .4em;--heading-spacing-h5: .4em;--heading-spacing-h6: .4em;--heading-spacing-consecutive: .3em;--text-color: light-dark(var(--base-950), var(--base-200));--link-font-weight: var(--semi-bold);--link-color: light-dark(var(--primary-600), var(--primary-400));--link-color-hover: var(--primary-500);--text-code-color: light-dark(var(--primary-600), var(--primary-400));--text-code-background-color: light-dark( var(--primary-100), var(--primary-900) );--text-code-muted-color: light-dark(var(--base-500), var(--base-300));--pre-border-radius: var(--radius-md);--pre-font-size: .9rem;--blockquote-padding-block: var(--sm1);--blockquote-padding-inline: var(--md1) var(--sm3);--blockquote-background-color: light-dark( var(--primary-50), var(--primary-900) );--blockquote-border-radius: var(--radius-md);--blockquote-accent-width: var(--xs2);--blockquote-accent-color: linear-gradient( var(--primary-800), var(--primary-500) );--hr-content: "";--ins-color: var(--base-950);--ins-background-color: var(--success-200);--marker-color: var(--highlight-500);--selection-color: light-dark(var(--base-950), var(--base-0));--selection-background-color: light-dark( var(--primary-200), var(--primary-700) )}:root{--grid-column-gap: var(--sm1);--grid-row-gap: var(--sm1);@media(width>=768px){--grid-column-gap: var(--sm3);--grid-row-gap: var(--sm3)}--wrap-spacing: var(--sm1);--wrap-md-spacing: var(--sm3);--wrap-lg-spacing: 0;--wrap-width-sm: minmax(0, 55ch);--wrap-width-md: minmax(0, 70ch);--wrap-width-lg: minmax(0, 900px);--wrap-width: var(--wrap-width-md);--layout-content-width: 70ch;--layout-aside-width: 245px;--layout-toc-width: 1fr;--prose-spacing: var(--sm1)}:root{--badge-font-size: var(--text-sm);--badge-border-radius: var(--radius-md);--badge-color: var(--base-0);--badge-background-color: light-dark(var(--base-700), var(--base-600));--badge-primary-color: var(--base-0);--badge-primary-background-color: light-dark( var(--primary-600), var(--primary-500) );--badge-success-color: light-dark(var(--success-500), var(--base-0));--badge-success-background-color: light-dark( var(--success-100), var(--success-500) );--badge-danger-color: light-dark(var(--danger-500), var(--base-0));--badge-danger-background-color: light-dark( var(--danger-100), var(--danger-500) );--badge-warning-color: light-dark(var(--warning-500), var(--base-950));--badge-warning-background-color: light-dark( var(--warning-100), var(--warning-500) )}:root{--bt-min-width: 101px;--bt-min-width-md: 123px;--bt-min-width-lg: 133px;--bt-font-size: var(--text-sm);--bt-font-size-lg: var(--text-md);--bt-font-weight: var(--semi-bold);--bt-color: var(--text-color);--bt-color-hover: light-dark(var(--text-color), var(--base-0));--bt-background-color: light-dark(var(--base-0), var(--base-800));--bt-background-color-hover: light-dark(var(--base-50), var(--base-900));--bt-border-color: var(--ui-border-color);--bt-border-width: var(--border-sm);--bt-border-radius: var(--radius-lg);--bt-border-radius-lg: var(--radius-xl);--bt-outline-color-hover: light-dark(var(--base-950), var(--base-0));--bt-outline-background-color-hover: light-dark( rgb(0 0 0 / .1), rgb(255 255 255 / .1) );--bt-outline-border-color: light-dark(var(--base-950), var(--base-0));--bt-outline-border-color-hover: light-dark(var(--base-950), var(--base-0));--bt-primary-color: var(--base-0);--bt-primary-color-hover: var(--base-0);--bt-primary-background-color: var(--primary-600);--bt-primary-background-color-hover: var(--primary-500);--bt-primary-border-color: var(--primary-600);--bt-primary-border-color-hover: var(--primary-600)}:root{--avatar-color: var(--base-0);--avatar-background-color: var(--base-400);--avatar-border-color: light-dark(var(--base-0), var(--base-500));--avatar-border-width: var(--border-sm);--avatar-radius: var(--radius-round);--avatar-status-dot-color-offline: var(--base-300);--avatar-status-dot-color-online: var(--yes-400)}:root{--banner-color: var(--base-0);--banner-background-color: light-dark(var(--primary-600), var(--primary-800))}:root{--breadcrumbs-separator: "/";--breadcrumbs-separator-color: light-dark(var(--base-300), var(--base-600));--breadcrumbs-color: light-dark(var(--base-500), var(--base-400));--breadcrumbs-color-current: var(--text-color)}:root{--card-spacing: var(--sm3);--card-color: var(--text-color);--card-secondary-text-color: light-dark(var(--base-400), var(--base-500));--card-bg-color: light-dark(var(--base-100), var(--base-900));--card-border-radius: var(--radius-lg);--card-border-color: var(--ui-border-color);--card-border-width: var(--border-sm);--card-shadow: var(--shadow-md);--card-shadow-hover: var(--shadow-xl);--card-loading-bg: light-dark(var(--base-200), var(--base-900));--card-aspect-ratio: var(--ar-golden)}:root{--toggle-width: 50px;--toggle-height: 28px;--toggle-border-width: 2px;--toggle-track-color: light-dark(var(--base-300), var(--base-700));--toggle-track-color-checked: var(--yes-400);--toggle-thumb-color: var(--body-background-color)}:root{--faq-spacing: var(--xs3)}:root{--field-spacing: var(--xs1);--field-hint-color: light-dark(var(--base-400), var(--base-500));--field-error-color: light-dark(var(--danger-500), var(--danger-300));--field-message-position: static}:root{--featureItem-icon-box-size: var(--lg3);--featureItem-icon-size: var(--sm3);--featureItem-icon-color: light-dark(var(--primary-600), var(--primary-300));--featureItem-icon-background-color: light-dark( var(--primary-100), var(--primary-900) );--featureItem-icon-border-radius: var(--radius-lg)}:root{--footer-background-color: light-dark(var(--primary-950), var(--base-950));--footer-text-color: light-dark(var(--base-0), var(--base-200));--footer-border-width: var(--border-md);--footer-border-color: light-dark(transparent, var(--base-700));--footer-link-color: light-dark(var(--base-0), var(--base-200));--footer-link-color-hover: light-dark(var(--primary-200), var(--base-0))}:root{--header-height: var(--xl1);--header-padding: var(--sm1);@media(width>=768px){--header-height: var(--xl2);--header-padding: var(--sm3)}--header-background-color: light-dark(var(--base-0), var(--base-950));--header-menu-background-color: var(--base-950);--header-menu-color: var(--base-0);--header-menu-color-current: var(--primary-400);--header-menu-secondary-color: var(--base-300);--header-menu-border-color: var(--base-500)}:root{--hero-radius: var(--radius-xl);--hero-content-padding: var(--md3);--hero-actions-spacing: var(--lg3);--hero-pagination-dot: var(--sm1);--hero-pagination-dot-color: var(--base-0);--hero-pagination-dot-active-color: var(--primary-600);--hero-pagination-opacity: var(--o-4)}:root{--pagination-size: var(--md3);--pagination-border-radius: var(--radius-md);--pagination-color: var(--text-color);--pagination-color-current: var(--base-0);--pagination-background-color-current: light-dark( var(--primary-600), var(--primary-500) );--pagination-background-color-hover: light-dark( var(--base-100), var(--base-800) )}:root{--prevNext-border-color: var(--ui-border-color);--prevNext-border-radius: var(--radius-lg);--prevNext-border-color-hover: var(--link-color);--prevNext-label-color: light-dark(var(--base-400), var(--base-500))}:root{--notice-spacing: var(--sm1);--notice-text-color: light-dark(var(--base-950), var(--base-0));--notice-background-color: light-dark(var(--base-50), var(--base-800));--notice-border-color: light-dark(var(--base-200), var(--base-500));--notice-border-width: var(--border-sm);--notice-border-radius: var(--radius-lg)}:root{--pricingCard-highlight-border-color: light-dark( var(--primary-600), var(--primary-400) );--pricingCard-check-color: light-dark(var(--success-500), var(--success-400))}:root{--readProgressBar-height: var(--xs1);--readProgressBar-color: linear-gradient( 90deg, var(--primary-600) 0%, var(--primary-400) 100% )}:root{--section-spacing: var(--xl3);--section-header-spacing: var(--lg3);--section-eyebrow-color: light-dark(var(--primary-600), var(--primary-400));--section-lede-color: light-dark(var(--base-500), var(--base-400));--section-filled-background-color: light-dark( var(--base-50), var(--base-900) );--section-primary-background-color: light-dark( var(--primary-600), var(--primary-900) );--section-primary-text-color: var(--base-0);--section-primary-link-color: var(--primary-100);--section-primary-link-color-hover: var(--base-0);--section-primary-eyebrow-color: var(--primary-200);--section-primary-lede-color: var(--primary-100)}:root{--testimonial-role-color: light-dark(var(--base-400), var(--base-500))}:root{--tags-padding: var(--xs2);--tags-font-size: var(--text-sm);--tags-color: light-dark(var(--base-500), var(--base-400));--tags-background-color: light-dark(var(--base-100), var(--base-800));--tags-background-color-hover: light-dark(var(--base-200), var(--base-950));--tags-radius: var(--radius-md)}:root{--toc-color: var(--link-color);--toc-color-hover: var(--link-color-hover);--toc-spacing: var(--xs1);--toc-indentation: var(--xs3);--toc-icon-size: var(--sm1)}}@layer base{*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion:reduce){*,:before,:after{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}:where(:not(dialog)){margin:0}html,body{min-height:100%}}@layer elements{body{line-sizing:normal;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;background-color:var(--body-background-color);color:var(--text-color);font-family:var(--text);line-height:var(--body-line-height);&:has(.body-is-locked){overflow:hidden}}}@layer elements{::selection{color:var(--selection-color);background-color:var(--selection-background-color)}:where(a,u,ins,abbr){text-underline-offset:2px}a{font-weight:var(--link-font-weight);color:var(--link-color);&:where(:hover){color:var(--link-color-hover);-webkit-text-decoration:none;text-decoration:none}}address{width:max-content;max-width:100%;padding:var(--sm1) var(--sm3);font-style:normal;background-color:light-dark(var(--base-50),var(--base-900));border:var(--xs2) solid transparent;border-image:8 repeating-linear-gradient(-45deg,var(--no-500) 0,var(--no-500) var(--xs2),transparent 0,transparent calc(var(--xs2) * 2),var(--primary-500) 0,var(--primary-500) calc(var(--xs2) * 3),transparent 0,transparent calc(var(--xs2) * 4))}abbr{position:relative;cursor:help;&:after{position:relative;top:calc(var(--xs1) * -1);width:var(--sm1);height:var(--sm1);display:inline-block;content:"";background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");background-size:contain}&:hover:before{width:max-content;max-width:400px;position:absolute;left:50%;padding:var(--xs1) var(--xs3);content:attr(title);color:var(--base-0);background-color:var(--base-900);opacity:var(--o-4);border-radius:var(--radius-sm);transform:translate(-50%,-2em)}}blockquote{position:relative;margin-bottom:var(--prose-spacing);padding-block:var(--blockquote-padding-block);padding-inline:var(--blockquote-padding-inline);font-style:italic;background-color:var(--blockquote-background-color);border-radius:var(--blockquote-border-radius);&:before{content:"";position:absolute;top:0;inset-inline-start:0;width:var(--blockquote-accent-width);height:100%;border-start-start-radius:var(--blockquote-border-radius);border-end-start-radius:var(--blockquote-border-radius);background:var(--blockquote-accent-color)}p{&:first-child:before{content:open-quote}&:last-child{margin-bottom:0;&:after{content:close-quote}}}}cite{font-style:italic}code,var,kbd{font-family:var(--mono);font-size:.9em;font-style:normal;color:var(--text-code-muted-color)}:is(code,var,kbd):not(h1 *,h2 *,h3 *,h4 *,h5 *,h6 *,pre *){padding:.15em .3em;color:var(--text-code-color);background-color:var(--text-code-background-color);border-radius:var(--radius-sm)}dt{font-weight:var(--bold)}dd+dt{margin-top:.5em}del{text-decoration-color:var(--danger-500);text-decoration-style:wavy}h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{overflow-wrap:break-word;text-wrap:balance}h1,.h1,h2,.h2,h3,.h3,h4,.h4{font-family:var(--heading-font);font-weight:var(--heading-weight);letter-spacing:var(--heading-letter-spacing)}h1,.h1{margin-bottom:var(--heading-spacing-h1);font-size:var(--heading-font-size-h1);line-height:var(--heading-line-height-h1)}h2,.h2{margin-bottom:var(--heading-spacing-h2);font-size:var(--heading-font-size-h2);line-height:var(--heading-line-height-h2)}h3,.h3{margin-bottom:var(--heading-spacing-h3);font-size:var(--heading-font-size-h3);line-height:var(--heading-line-height-h3)}h4,.h4{margin-bottom:var(--heading-spacing-h4);font-size:var(--heading-font-size-h4);line-height:var(--heading-line-height-h4)}h5,.h5{margin-bottom:var(--heading-spacing-h5);font-size:var(--heading-font-size-h5);line-height:var(--heading-line-height-h5)}h6,.h6{margin-bottom:var(--heading-spacing-h6);font-size:var(--heading-font-size-h6);line-height:var(--heading-line-height-h6)}:where(h1,h2,h3):has(+:is(h2,h3,h4)){margin-bottom:var(--heading-spacing-consecutive)}hr{display:flex;justify-content:center;align-items:center;height:0;border-style:solid;border-width:var(--border-sm) 0 0;color:var(--ui-border-color);overflow:visible;&:after{content:var(--hr-content);padding:0 var(--xs1);line-height:1;letter-spacing:var(--tracking-sm);background-color:var(--body-background-color)}}:where(hr):has(+:is(p)){margin-bottom:var(--prose-spacing)}ins{padding:.15em .3em;color:var(--ins-color);background-color:var(--ins-background-color);border-radius:var(--radius-sm);-webkit-text-decoration:none;text-decoration:none;&:before{content:"+ "}}mark{padding:.15em .5em;background:var(--marker-color);border-radius:1em 0}:where(ol,ul){list-style-type:none;padding:0}pre{font-family:var(--mono);font-size:var(--pre-font-size);white-space:pre-wrap;border-radius:var(--pre-border-radius)}q{font-style:italic}s{text-decoration-color:light-dark(var(--base-950),var(--base-50));text-decoration-style:wavy}sub,sup{line-height:1}}@layer elements{:root{quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(af),:not(:lang(af))>:lang(af){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ak),:not(:lang(ak))>:lang(ak){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(asa),:not(:lang(asa))>:lang(asa){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(az),:not(:lang(az))>:lang(az){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(bem),:not(:lang(bem))>:lang(bem){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(bez),:not(:lang(bez))>:lang(bez){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(bn),:not(:lang(bn))>:lang(bn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(brx),:not(:lang(brx))>:lang(brx){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(cgg),:not(:lang(cgg))>:lang(cgg){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(chr),:not(:lang(chr))>:lang(chr){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(cy),:not(:lang(cy))>:lang(cy){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(da),:not(:lang(da))>:lang(da){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(dav),:not(:lang(dav))>:lang(dav){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(dje),:not(:lang(dje))>:lang(dje){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(dz),:not(:lang(dz))>:lang(dz){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ebu),:not(:lang(ebu))>:lang(ebu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ee),:not(:lang(ee))>:lang(ee){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(en),:not(:lang(en))>:lang(en){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(fil),:not(:lang(fil))>:lang(fil){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(fo),:not(:lang(fo))>:lang(fo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ga),:not(:lang(ga))>:lang(ga){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(gd),:not(:lang(gd))>:lang(gd){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(gl),:not(:lang(gl))>:lang(gl){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(gu),:not(:lang(gu))>:lang(gu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(guz),:not(:lang(guz))>:lang(guz){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ha),:not(:lang(ha))>:lang(ha){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(hi),:not(:lang(hi))>:lang(hi){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(id),:not(:lang(id))>:lang(id){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ig),:not(:lang(ig))>:lang(ig){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(jmc),:not(:lang(jmc))>:lang(jmc){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kam),:not(:lang(kam))>:lang(kam){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kde),:not(:lang(kde))>:lang(kde){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kea),:not(:lang(kea))>:lang(kea){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(khq),:not(:lang(khq))>:lang(khq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ki),:not(:lang(ki))>:lang(ki){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kln),:not(:lang(kln))>:lang(kln){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(km),:not(:lang(km))>:lang(km){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(kn),:not(:lang(kn))>:lang(kn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ko),:not(:lang(ko))>:lang(ko){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ksb),:not(:lang(ksb))>:lang(ksb){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lg),:not(:lang(lg))>:lang(lg){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ln),:not(:lang(ln))>:lang(ln){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lo),:not(:lang(lo))>:lang(lo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lrc),:not(:lang(lrc))>:lang(lrc){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lu),:not(:lang(lu))>:lang(lu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(luo),:not(:lang(luo))>:lang(luo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(lv),:not(:lang(lv))>:lang(lv){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mas),:not(:lang(mas))>:lang(mas){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mer),:not(:lang(mer))>:lang(mer){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mfe),:not(:lang(mfe))>:lang(mfe){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mgo),:not(:lang(mgo))>:lang(mgo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ml),:not(:lang(ml))>:lang(ml){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mn),:not(:lang(mn))>:lang(mn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mr),:not(:lang(mr))>:lang(mr){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ms),:not(:lang(ms))>:lang(ms){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(mt),:not(:lang(mt))>:lang(mt){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(my),:not(:lang(my))>:lang(my){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(naq),:not(:lang(naq))>:lang(naq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(nd),:not(:lang(nd))>:lang(nd){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ne),:not(:lang(ne))>:lang(ne){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(nus),:not(:lang(nus))>:lang(nus){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(nyn),:not(:lang(nyn))>:lang(nyn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(pa),:not(:lang(pa))>:lang(pa){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(pt),:not(:lang(pt))>:lang(pt){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(rof),:not(:lang(rof))>:lang(rof){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(rwk),:not(:lang(rwk))>:lang(rwk){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(saq),:not(:lang(saq))>:lang(saq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(sbp),:not(:lang(sbp))>:lang(sbp){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(seh),:not(:lang(seh))>:lang(seh){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ses),:not(:lang(ses))>:lang(ses){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(si),:not(:lang(si))>:lang(si){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(so),:not(:lang(so))>:lang(so){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(sw),:not(:lang(sw))>:lang(sw){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(ta),:not(:lang(ta))>:lang(ta){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(te),:not(:lang(te))>:lang(te){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(teo),:not(:lang(teo))>:lang(teo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(th),:not(:lang(th))>:lang(th){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(to),:not(:lang(to))>:lang(to){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(tr),:not(:lang(tr))>:lang(tr){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(twq),:not(:lang(twq))>:lang(twq){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(tzm),:not(:lang(tzm))>:lang(tzm){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(uz-Cyrl),:not(:lang(uz-Cyrl))>:lang(uz-Cyrl){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vai),:not(:lang(vai))>:lang(vai){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vai-Latn),:not(:lang(vai-Latn))>:lang(vai-Latn){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vi),:not(:lang(vi))>:lang(vi){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(vun),:not(:lang(vun))>:lang(vun){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(xog),:not(:lang(xog))>:lang(xog){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(yo),:not(:lang(yo))>:lang(yo){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(yue-Hans),:not(:lang(yue-Hans))>:lang(yue-Hans){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(zh),:not(:lang(zh))>:lang(zh){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(zu),:not(:lang(zu))>:lang(zu){quotes:"\201c" "\201d" "\2018" "\2019"}:root:lang(uz),:not(:lang(uz))>:lang(uz){quotes:"\201c" "\201d" "\2019" "\2018"}:root:lang(eu),:not(:lang(eu))>:lang(eu){quotes:"\201c" "\201d" "\201c" "\201d"}:root:lang(tk),:not(:lang(tk))>:lang(tk){quotes:"\201c" "\201d" "\201c" "\201d"}:root:lang(ar),:not(:lang(ar))>:lang(ar){quotes:"\201d" "\201c" "\2019" "\2018"}:root:lang(ur),:not(:lang(ur))>:lang(ur){quotes:"\201d" "\201c" "\2019" "\2018"}:root:lang(fi),:not(:lang(fi))>:lang(fi){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(he),:not(:lang(he))>:lang(he){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(lag),:not(:lang(lag))>:lang(lag){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(rn),:not(:lang(rn))>:lang(rn){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(sn),:not(:lang(sn))>:lang(sn){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(sv),:not(:lang(sv))>:lang(sv){quotes:"\201d" "\201d" "\2019" "\2019"}:root:lang(sr),:not(:lang(sr))>:lang(sr){quotes:"\201e" "\201c" "\2018" "\2018"}:root:lang(sr-Latn),:not(:lang(sr-Latn))>:lang(sr-Latn){quotes:"\201e" "\201c" "\2018" "\2018"}:root:lang(bg),:not(:lang(bg))>:lang(bg){quotes:"\201e" "\201c" "\201e" "\201c"}:root:lang(lt),:not(:lang(lt))>:lang(lt){quotes:"\201e" "\201c" "\201e" "\201c"}:root:lang(bs-Cyrl),:not(:lang(bs-Cyrl))>:lang(bs-Cyrl){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(cs),:not(:lang(cs))>:lang(cs){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(de),:not(:lang(de))>:lang(de){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(dsb),:not(:lang(dsb))>:lang(dsb){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(et),:not(:lang(et))>:lang(et){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(hr),:not(:lang(hr))>:lang(hr){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(hsb),:not(:lang(hsb))>:lang(hsb){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(is),:not(:lang(is))>:lang(is){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(lb),:not(:lang(lb))>:lang(lb){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(luy),:not(:lang(luy))>:lang(luy){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(mk),:not(:lang(mk))>:lang(mk){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(sk),:not(:lang(sk))>:lang(sk){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(sl),:not(:lang(sl))>:lang(sl){quotes:"\201e" "\201c" "\201a" "\2018"}:root:lang(ka),:not(:lang(ka))>:lang(ka){quotes:"\201e" "\201c" "\ab" "\bb"}:root:lang(bs),:not(:lang(bs))>:lang(bs){quotes:"\201e" "\201d" "\2018" "\2019"}:root:lang(agq),:not(:lang(agq))>:lang(agq){quotes:"\201e" "\201d" "\201a" "\2019"}:root:lang(ff),:not(:lang(ff))>:lang(ff){quotes:"\201e" "\201d" "\201a" "\2019"}:root:lang(nmg),:not(:lang(nmg))>:lang(nmg){quotes:"\201e" "\201d" "\ab" "\bb"}:root:lang(ro),:not(:lang(ro))>:lang(ro){quotes:"\201e" "\201d" "\ab" "\bb"}:root:lang(pl),:not(:lang(pl))>:lang(pl){quotes:"\201e" "\201d" "\ab" "\bb"}:root:lang(hu),:not(:lang(hu))>:lang(hu){quotes:"\201e" "\201d" "\bb" "\ab"}:root:lang(nl),:not(:lang(nl))>:lang(nl){quotes:"\2018" "\2019" "\201c" "\201d"}:root:lang(ti-ER),:not(:lang(ti-ER))>:lang(ti-ER){quotes:"\2018" "\2019" "\201c" "\201d"}:root:lang(dua),:not(:lang(dua))>:lang(dua){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(ksf),:not(:lang(ksf))>:lang(ksf){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(rw),:not(:lang(rw))>:lang(rw){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(nn),:not(:lang(nn))>:lang(nn){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(nb),:not(:lang(nb))>:lang(nb){quotes:"\ab" "\bb" "\2018" "\2019"}:root:lang(ast),:not(:lang(ast))>:lang(ast){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(bm),:not(:lang(bm))>:lang(bm){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(br),:not(:lang(br))>:lang(br){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(ca),:not(:lang(ca))>:lang(ca){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(dyo),:not(:lang(dyo))>:lang(dyo){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(el),:not(:lang(el))>:lang(el){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(es),:not(:lang(es))>:lang(es){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(ewo),:not(:lang(ewo))>:lang(ewo){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(mg),:not(:lang(mg))>:lang(mg){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(mua),:not(:lang(mua))>:lang(mua){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(sg),:not(:lang(sg))>:lang(sg){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(it),:not(:lang(it))>:lang(it){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(kab),:not(:lang(kab))>:lang(kab){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(kk),:not(:lang(kk))>:lang(kk){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(pt-PT),:not(:lang(pt-PT))>:lang(pt-PT){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(nnh),:not(:lang(nnh))>:lang(nnh){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(sq),:not(:lang(sq))>:lang(sq){quotes:"\ab" "\bb" "\201c" "\201d"}:root:lang(bas),:not(:lang(bas))>:lang(bas){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(be),:not(:lang(be))>:lang(be){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(ky),:not(:lang(ky))>:lang(ky){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(sah),:not(:lang(sah))>:lang(sah){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(ru),:not(:lang(ru))>:lang(ru){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(uk),:not(:lang(uk))>:lang(uk){quotes:"\ab" "\bb" "\201e" "\201c"}:root:lang(zgh),:not(:lang(zgh))>:lang(zgh){quotes:"\ab" "\bb" "\201e" "\201d"}:root:lang(shi),:not(:lang(shi))>:lang(shi){quotes:"\ab" "\bb" "\201e" "\201d"}:root:lang(shi-Latn),:not(:lang(shi-Latn))>:lang(shi-Latn){quotes:"\ab" "\bb" "\201e" "\201d"}:root:lang(am),:not(:lang(am))>:lang(am){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(az-Cyrl),:not(:lang(az-Cyrl))>:lang(az-Cyrl){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(fa),:not(:lang(fa))>:lang(fa){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(fr-CH),:not(:lang(fr-CH))>:lang(fr-CH){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(gsw),:not(:lang(gsw))>:lang(gsw){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(jgo),:not(:lang(jgo))>:lang(jgo){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(kkj),:not(:lang(kkj))>:lang(kkj){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(mzn),:not(:lang(mzn))>:lang(mzn){quotes:"\ab" "\bb" "\2039" "\203a"}:root:lang(fr),:not(:lang(fr))>:lang(fr){quotes:"\ab" "\bb" "\ab" "\bb"}:root:lang(hy),:not(:lang(hy))>:lang(hy){quotes:"\ab" "\bb" "\ab" "\bb"}:root:lang(yav),:not(:lang(yav))>:lang(yav){quotes:"\ab" "\bb" "\ab" "\bb"}:root:lang(ja),:not(:lang(ja))>:lang(ja){quotes:"\300c" "\300d" "\300e" "\300f"}:root:lang(yue),:not(:lang(yue))>:lang(yue){quotes:"\300c" "\300d" "\300e" "\300f"}:root:lang(zh-Hant),:not(:lang(zh-Hant))>:lang(zh-Hant){quotes:"\300c" "\300d" "\300e" "\300f"}}@layer elements{audio,canvas,embed,iframe,img,object,picture,svg,video{display:block;vertical-align:middle;max-width:100%}img,svg,video,canvas{height:auto}audio{width:100%;max-width:var(--tera1)}audio:not([controls]){display:none}figcaption{font-style:italic;font-size:var(--text-sm)}figure{&:has(*+figcaption){figcaption{margin-top:var(--figcaption-spacing)}}&:has(figcaption+*){figcaption{margin-bottom:var(--figcaption-spacing)}}}iframe{border:var(--border-sm) solid var(--ui-border-color)}}@layer elements{caption{caption-side:bottom;margin-top:var(--table-caption-spacing);font-size:var(--text-sm)}table{border-spacing:0;border:var(--table-border-width) solid var(--table-border-color);border-radius:var(--table-border-radius);background-color:var(--table-background-color)}th,td{text-align:start;padding:var(--table-padding);border-bottom:var(--table-border-width) solid var(--table-border-color);border-inline-start:var(--table-border-width) solid var(--table-border-color)}tr{th:first-child,td:first-child{border-inline-start-width:0}}tbody{tr:last-child{th,td{border-bottom-width:0}}}tfoot{th,td{border-top:var(--table-border-width) solid var(--table-border-color);border-bottom-width:0}}}@layer elements{::placeholder{opacity:var(--o-4)}input,button,textarea,select{font:inherit;color:var(--text-color)}button{color:var(--text-color)}fieldset{border:var(--fieldset-border-width) solid var(--fieldset-border-color);border-radius:var(--fieldset-border-radius);padding:var(--fieldset-padding);ul:has([type=checkbox],[type=radio]){padding-inline-start:0}>[aria-hidden]{margin-bottom:var(--sm3);font-size:var(--text-lg);grid-column:1 / -1}}:is(input,select,textarea):user-invalid{border-color:var(--input-border-color-invalid)}input{&:where(:not([type=checkbox],[type=radio])){height:var(--input-height)}&:where(:not([type=color],[type=file],[type=reset],[type=submit])){padding:var(--input-padding)}&:where(:not([type=color])){border-radius:var(--input-border-radius)}&:where(:not([type=file])){border:var(--input-border-width) solid var(--input-border-color)}&[type=file]{width:100%;accent-color:var(--text-color)}&[type=number]{padding-inline-end:var(--xs1)}}label{display:block;&:has(+:is(input,select,textarea)){margin-bottom:var(--label-spacing)}}legend{position:absolute;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);width:1px;height:1px;white-space:nowrap}meter{width:100%;background:var(--meter-track-color);border-radius:var(--meter-border-radius);height:var(--meter-height);&::-webkit-meter-bar{background:var(--meter-track-color)}&::-webkit-meter-bar,&::-webkit-meter-optimum-value,&::-webkit-meter-suboptimum-value,&::-webkit-meter-even-less-good-value{height:var(--meter-height);border:none;border-radius:var(--meter-border-radius)}&::-webkit-meter-even-less-good-value{background:var(--meter-low-color)}&::-webkit-meter-suboptimum-value{background:var(--meter-medium-color)}&::-webkit-meter-optimum-value{background:var(--meter-high-color)}&:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:var(--meter-low-color)}&:-moz-meter-sub-optimum::-moz-meter-bar{background:var(--meter-medium-color)}&:-moz-meter-optimum::-moz-meter-bar{background:var(--meter-high-color)}}progress{appearance:none;width:100%;height:var(--progress-height);background:var(--progress-track-color);border-radius:var(--progress-border-radius);border:none;&::-moz-progress-bar{background:var(--progress-color);border-radius:var(--progress-border-radius)}&::-webkit-progress-bar{width:100%;background:var(--progress-track-color);border-radius:var(--progress-border-radius);height:var(--progress-height)}&::-webkit-progress-value{background:var(--progress-color);border-radius:var(--progress-border-radius)}}select{--split: calc(100% - var(--select-icon-size));display:flex;appearance:none;height:var(--input-height);padding:var(--xs1) calc(var(--input-padding) + var(--md1)) var(--xs1) var(--input-padding);border:var(--input-border-width) solid var(--input-border-color);border-radius:var(--input-border-radius);background:linear-gradient(to right,var(--body-background-color) 0 var(--split),var(--text-color) var(--split) 100%);mask-image:var(--select-icon),linear-gradient(to right,transparent calc(var(--split) - 1px),red 0),linear-gradient(red 0 0);mask-size:var(--select-icon-size),auto,auto;mask-position:calc(100% - var(--xs1)) center,0 0,0 0;mask-repeat:no-repeat;mask-clip:padding-box,padding-box,border-box;mask-origin:padding-box,padding-box,border-box;mask-composite:add,exclude;&:disabled{--disabled-color: light-dark( hsl(from var(--text-color) h s 70%), hsl(from var(--text-color) h s 40%) );cursor:not-allowed;color:var(--disabled-color);background:linear-gradient(to right,var(--body-background-color) 0 var(--split),var(--disabled-color) var(--split) 100%)}&[multiple]{height:auto;padding:var(--input-padding);background:var(--body-background-color);mask-image:none}}textarea{width:100%;padding:var(--input-padding);border-radius:var(--input-border-radius);border:var(--input-border-width) solid var(--input-border-color);resize:vertical;&:not([rows]){min-height:6em}}}@layer elements{dialog{min-width:var(--dialog-min-width);max-width:var(--dialog-max-width);padding:var(--dialog-padding);border:var(--dialog-border-width) solid var(--dialog-border-color);background-color:var(--dialog-background-color);border-radius:var(--dialog-border-radius);&::backdrop{background:var(--dialog-backdrop-color);opacity:var(--dialog-backdrop-opacity)}[aria-label="close pop-up"]{position:absolute;top:var(--xs3);right:var( --xs3 );background:transparent;border:none;outline:none;cursor:pointer}p:last-of-type{margin-bottom:0}}details{padding:var(--details-padding);border:var(--details-border-width) solid var(--details-border-color);background-color:var(--details-background-color);border-radius:var(--details-border-radius);cursor:pointer;summary{display:flex;justify-content:space-between;font-weight:var(--bold);&::-webkit-details-marker{display:none}&:after{content:"";width:var(--details-icon-size);height:var(--details-icon-size);background-color:currentColor;mask-image:var(--details-icon);mask-size:contain;mask-repeat:no-repeat;transition:transform var(--transition)}}&[open]>summary{margin-bottom:var(--details-spacing);&:after{transform:rotate(180deg)}}p:last-of-type{margin-bottom:0}}}@layer global{:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.a11y-skipLink{position:fixed;z-index:var(--z-top);inset-block-start:-100vb;inset-inline-start:0;padding:.75em 1.25em;background-color:var(--body-background-color);color:var(--text-color)}.a11y-skipLink:focus{inset-block-start:0}.a11y-srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}@layer global{@keyframes fadeFromOpaque{0%{opacity:1}}@keyframes fadeToOpaque{to{opacity:1}}@keyframes fadeFromTransparent{0%{opacity:0}}@keyframes fadeToTransparent{to{opacity:0}}}@layer global{.grid{display:grid;--grid-tc: repeat(4, 1fr);--grid-cs: 1;--grid-ce: -1;grid-template-columns:var(--grid-tc);grid-column-gap:var(--grid-column-gap);grid-row-gap:var(--grid-row-gap)}.grid-flush{grid-column-gap:0;grid-row-gap:0}.grid>.grid_item{display:block;appearance:none;-webkit-appearance:none}.grid[col="1"]{--grid-tc: repeat(1, 1fr) }.grid[col="2"]{--grid-tc: repeat(2, 1fr) }.grid[col="3"]{--grid-tc: repeat(3, 1fr) }.grid[col="4"]{--grid-tc: repeat(4, 1fr) }.grid[col="5"]{--grid-tc: repeat(5, 1fr) }.grid[col="6"]{--grid-tc: repeat(6, 1fr) }.grid[col="7"]{--grid-tc: repeat(7, 1fr) }.grid[col="8"]{--grid-tc: repeat(8, 1fr) }.grid[col="9"]{--grid-tc: repeat(9, 1fr) }.grid[col="10"]{--grid-tc: repeat(10, 1fr) }.grid[col="11"]{--grid-tc: repeat(11, 1fr) }.grid[col="12"]{--grid-tc: repeat(12, 1fr) }.grid[col="13"]{--grid-tc: repeat(13, 1fr) }.grid[col="14"]{--grid-tc: repeat(14, 1fr) }.grid[col="15"]{--grid-tc: repeat(15, 1fr) }.grid[col="16"]{--grid-tc: repeat(16, 1fr) }.grid[col="17"]{--grid-tc: repeat(17, 1fr) }.grid[col="18"]{--grid-tc: repeat(18, 1fr) }.grid[col="19"]{--grid-tc: repeat(19, 1fr) }.grid[col="20"]{--grid-tc: repeat(20, 1fr) }.grid[col="21"]{--grid-tc: repeat(21, 1fr) }.grid[col="22"]{--grid-tc: repeat(22, 1fr) }.grid[col="23"]{--grid-tc: repeat(23, 1fr) }.grid[col="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span^="1"]{--grid-cs: 1 }.grid>.grid_item[span^="2"]{--grid-cs: 2 }.grid>.grid_item[span^="3"]{--grid-cs: 3 }.grid>.grid_item[span^="4"]{--grid-cs: 4 }.grid>.grid_item[span^="5"]{--grid-cs: 5 }.grid>.grid_item[span^="6"]{--grid-cs: 6 }.grid>.grid_item[span^="7"]{--grid-cs: 7 }.grid>.grid_item[span^="8"]{--grid-cs: 8 }.grid>.grid_item[span^="9"]{--grid-cs: 9 }.grid>.grid_item[span^="10"]{--grid-cs: 10 }.grid>.grid_item[span^="11"]{--grid-cs: 11 }.grid>.grid_item[span^="12"]{--grid-cs: 12 }.grid>.grid_item[span^="13"]{--grid-cs: 13 }.grid>.grid_item[span^="14"]{--grid-cs: 14 }.grid>.grid_item[span^="15"]{--grid-cs: 15 }.grid>.grid_item[span^="16"]{--grid-cs: 16 }.grid>.grid_item[span^="17"]{--grid-cs: 17 }.grid>.grid_item[span^="18"]{--grid-cs: 18 }.grid>.grid_item[span^="19"]{--grid-cs: 19 }.grid>.grid_item[span^="20"]{--grid-cs: 20 }.grid>.grid_item[span^="21"]{--grid-cs: 21 }.grid>.grid_item[span^="22"]{--grid-cs: 22 }.grid>.grid_item[span^="23"]{--grid-cs: 23 }.grid>.grid_item[span^="24"]{--grid-cs: 24 }.grid>.grid_item[span$="+1"],.grid>.grid_item[span="1"]{--grid-ce: 1 }.grid>.grid_item[span$="+2"],.grid>.grid_item[span$="-1"],.grid>.grid_item[span="2"]{--grid-ce: 2 }.grid>.grid_item[span$="+3"],.grid>.grid_item[span$="-2"],.grid>.grid_item[span="3"]{--grid-ce: 3 }.grid>.grid_item[span$="+4"],.grid>.grid_item[span$="-3"],.grid>.grid_item[span="4"]{--grid-ce: 4 }.grid>.grid_item[span$="+5"],.grid>.grid_item[span$="-4"],.grid>.grid_item[span="5"]{--grid-ce: 5 }.grid>.grid_item[span$="+6"],.grid>.grid_item[span$="-5"],.grid>.grid_item[span="6"]{--grid-ce: 6 }.grid>.grid_item[span$="+7"],.grid>.grid_item[span$="-6"],.grid>.grid_item[span="7"]{--grid-ce: 7 }.grid>.grid_item[span$="+8"],.grid>.grid_item[span$="-7"],.grid>.grid_item[span="8"]{--grid-ce: 8 }.grid>.grid_item[span$="+9"],.grid>.grid_item[span$="-8"],.grid>.grid_item[span="9"]{--grid-ce: 9 }.grid>.grid_item[span$="+10"],.grid>.grid_item[span$="-9"],.grid>.grid_item[span="10"]{--grid-ce: 10 }.grid>.grid_item[span$="+11"],.grid>.grid_item[span$="-10"],.grid>.grid_item[span="11"]{--grid-ce: 11 }.grid>.grid_item[span$="+12"],.grid>.grid_item[span$="-11"],.grid>.grid_item[span="12"]{--grid-ce: 12 }.grid>.grid_item[span$="+13"],.grid>.grid_item[span$="-12"],.grid>.grid_item[span="13"]{--grid-ce: 13 }.grid>.grid_item[span$="+14"],.grid>.grid_item[span$="-13"],.grid>.grid_item[span="14"]{--grid-ce: 14 }.grid>.grid_item[span$="+15"],.grid>.grid_item[span$="-14"],.grid>.grid_item[span="15"]{--grid-ce: 15 }.grid>.grid_item[span$="+16"],.grid>.grid_item[span$="-15"],.grid>.grid_item[span="16"]{--grid-ce: 16 }.grid>.grid_item[span$="+17"],.grid>.grid_item[span$="-16"],.grid>.grid_item[span="17"]{--grid-ce: 17 }.grid>.grid_item[span$="+18"],.grid>.grid_item[span$="-17"],.grid>.grid_item[span="18"]{--grid-ce: 18 }.grid>.grid_item[span$="+19"],.grid>.grid_item[span$="-18"],.grid>.grid_item[span="19"]{--grid-ce: 19 }.grid>.grid_item[span$="+20"],.grid>.grid_item[span$="-19"],.grid>.grid_item[span="20"]{--grid-ce: 20 }.grid>.grid_item[span$="+21"],.grid>.grid_item[span$="-20"],.grid>.grid_item[span="21"]{--grid-ce: 21 }.grid>.grid_item[span$="+22"],.grid>.grid_item[span$="-21"],.grid>.grid_item[span="22"]{--grid-ce: 22 }.grid>.grid_item[span$="+23"],.grid>.grid_item[span$="-22"],.grid>.grid_item[span="23"]{--grid-ce: 23 }.grid>.grid_item[span$="+24"],.grid>.grid_item[span$="-23"],.grid>.grid_item[span="24"]{--grid-ce: 24 }.grid>.grid_item[span$="-24"]{--grid-ce: 25 }.grid>.grid_item[span]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span*="+"],.grid>.grid_item[span*="-"],.grid>.grid_item[span*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span*="-"],.grid>.grid_item[span*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span=row]{grid-column:1 / -1}@media only screen and (width>=768px){.grid[col-md="1"]{--grid-tc: repeat(1, 1fr) }.grid[col-md="2"]{--grid-tc: repeat(2, 1fr) }.grid[col-md="3"]{--grid-tc: repeat(3, 1fr) }.grid[col-md="4"]{--grid-tc: repeat(4, 1fr) }.grid[col-md="5"]{--grid-tc: repeat(5, 1fr) }.grid[col-md="6"]{--grid-tc: repeat(6, 1fr) }.grid[col-md="7"]{--grid-tc: repeat(7, 1fr) }.grid[col-md="8"]{--grid-tc: repeat(8, 1fr) }.grid[col-md="9"]{--grid-tc: repeat(9, 1fr) }.grid[col-md="10"]{--grid-tc: repeat(10, 1fr) }.grid[col-md="11"]{--grid-tc: repeat(11, 1fr) }.grid[col-md="12"]{--grid-tc: repeat(12, 1fr) }.grid[col-md="13"]{--grid-tc: repeat(13, 1fr) }.grid[col-md="14"]{--grid-tc: repeat(14, 1fr) }.grid[col-md="15"]{--grid-tc: repeat(15, 1fr) }.grid[col-md="16"]{--grid-tc: repeat(16, 1fr) }.grid[col-md="17"]{--grid-tc: repeat(17, 1fr) }.grid[col-md="18"]{--grid-tc: repeat(18, 1fr) }.grid[col-md="19"]{--grid-tc: repeat(19, 1fr) }.grid[col-md="20"]{--grid-tc: repeat(20, 1fr) }.grid[col-md="21"]{--grid-tc: repeat(21, 1fr) }.grid[col-md="22"]{--grid-tc: repeat(22, 1fr) }.grid[col-md="23"]{--grid-tc: repeat(23, 1fr) }.grid[col-md="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span-md^="1"]{--grid-cs: 1 }.grid>.grid_item[span-md^="2"]{--grid-cs: 2 }.grid>.grid_item[span-md^="3"]{--grid-cs: 3 }.grid>.grid_item[span-md^="4"]{--grid-cs: 4 }.grid>.grid_item[span-md^="5"]{--grid-cs: 5 }.grid>.grid_item[span-md^="6"]{--grid-cs: 6 }.grid>.grid_item[span-md^="7"]{--grid-cs: 7 }.grid>.grid_item[span-md^="8"]{--grid-cs: 8 }.grid>.grid_item[span-md^="9"]{--grid-cs: 9 }.grid>.grid_item[span-md^="10"]{--grid-cs: 10 }.grid>.grid_item[span-md^="11"]{--grid-cs: 11 }.grid>.grid_item[span-md^="12"]{--grid-cs: 12 }.grid>.grid_item[span-md^="13"]{--grid-cs: 13 }.grid>.grid_item[span-md^="14"]{--grid-cs: 14 }.grid>.grid_item[span-md^="15"]{--grid-cs: 15 }.grid>.grid_item[span-md^="16"]{--grid-cs: 16 }.grid>.grid_item[span-md^="17"]{--grid-cs: 17 }.grid>.grid_item[span-md^="18"]{--grid-cs: 18 }.grid>.grid_item[span-md^="19"]{--grid-cs: 19 }.grid>.grid_item[span-md^="20"]{--grid-cs: 20 }.grid>.grid_item[span-md^="21"]{--grid-cs: 21 }.grid>.grid_item[span-md^="22"]{--grid-cs: 22 }.grid>.grid_item[span-md^="23"]{--grid-cs: 23 }.grid>.grid_item[span-md^="24"]{--grid-cs: 24 }.grid>.grid_item[span-md$="+1"],.grid>.grid_item[span-md="1"]{--grid-ce: 1 }.grid>.grid_item[span-md$="+2"],.grid>.grid_item[span-md$="-1"],.grid>.grid_item[span-md="2"]{--grid-ce: 2 }.grid>.grid_item[span-md$="+3"],.grid>.grid_item[span-md$="-2"],.grid>.grid_item[span-md="3"]{--grid-ce: 3 }.grid>.grid_item[span-md$="+4"],.grid>.grid_item[span-md$="-3"],.grid>.grid_item[span-md="4"]{--grid-ce: 4 }.grid>.grid_item[span-md$="+5"],.grid>.grid_item[span-md$="-4"],.grid>.grid_item[span-md="5"]{--grid-ce: 5 }.grid>.grid_item[span-md$="+6"],.grid>.grid_item[span-md$="-5"],.grid>.grid_item[span-md="6"]{--grid-ce: 6 }.grid>.grid_item[span-md$="+7"],.grid>.grid_item[span-md$="-6"],.grid>.grid_item[span-md="7"]{--grid-ce: 7 }.grid>.grid_item[span-md$="+8"],.grid>.grid_item[span-md$="-7"],.grid>.grid_item[span-md="8"]{--grid-ce: 8 }.grid>.grid_item[span-md$="+9"],.grid>.grid_item[span-md$="-8"],.grid>.grid_item[span-md="9"]{--grid-ce: 9 }.grid>.grid_item[span-md$="+10"],.grid>.grid_item[span-md$="-9"],.grid>.grid_item[span-md="10"]{--grid-ce: 10 }.grid>.grid_item[span-md$="+11"],.grid>.grid_item[span-md$="-10"],.grid>.grid_item[span-md="11"]{--grid-ce: 11 }.grid>.grid_item[span-md$="+12"],.grid>.grid_item[span-md$="-11"],.grid>.grid_item[span-md="12"]{--grid-ce: 12 }.grid>.grid_item[span-md$="+13"],.grid>.grid_item[span-md$="-12"],.grid>.grid_item[span-md="13"]{--grid-ce: 13 }.grid>.grid_item[span-md$="+14"],.grid>.grid_item[span-md$="-13"],.grid>.grid_item[span-md="14"]{--grid-ce: 14 }.grid>.grid_item[span-md$="+15"],.grid>.grid_item[span-md$="-14"],.grid>.grid_item[span-md="15"]{--grid-ce: 15 }.grid>.grid_item[span-md$="+16"],.grid>.grid_item[span-md$="-15"],.grid>.grid_item[span-md="16"]{--grid-ce: 16 }.grid>.grid_item[span-md$="+17"],.grid>.grid_item[span-md$="-16"],.grid>.grid_item[span-md="17"]{--grid-ce: 17 }.grid>.grid_item[span-md$="+18"],.grid>.grid_item[span-md$="-17"],.grid>.grid_item[span-md="18"]{--grid-ce: 18 }.grid>.grid_item[span-md$="+19"],.grid>.grid_item[span-md$="-18"],.grid>.grid_item[span-md="19"]{--grid-ce: 19 }.grid>.grid_item[span-md$="+20"],.grid>.grid_item[span-md$="-19"],.grid>.grid_item[span-md="20"]{--grid-ce: 20 }.grid>.grid_item[span-md$="+21"],.grid>.grid_item[span-md$="-20"],.grid>.grid_item[span-md="21"]{--grid-ce: 21 }.grid>.grid_item[span-md$="+22"],.grid>.grid_item[span-md$="-21"],.grid>.grid_item[span-md="22"]{--grid-ce: 22 }.grid>.grid_item[span-md$="+23"],.grid>.grid_item[span-md$="-22"],.grid>.grid_item[span-md="23"]{--grid-ce: 23 }.grid>.grid_item[span-md$="+24"],.grid>.grid_item[span-md$="-23"],.grid>.grid_item[span-md="24"]{--grid-ce: 24 }.grid>.grid_item[span-md$="-24"]{--grid-ce: 25 }.grid>.grid_item[span-md]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span-md*="+"],.grid>.grid_item[span-md*="-"],.grid>.grid_item[span-md*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span-md*="-"],.grid>.grid_item[span-md*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span-md=row]{grid-column:1 / -1}}@media only screen and (width>=1024px){.grid[col-lg="1"]{--grid-tc: repeat(1, 1fr) }.grid[col-lg="2"]{--grid-tc: repeat(2, 1fr) }.grid[col-lg="3"]{--grid-tc: repeat(3, 1fr) }.grid[col-lg="4"]{--grid-tc: repeat(4, 1fr) }.grid[col-lg="5"]{--grid-tc: repeat(5, 1fr) }.grid[col-lg="6"]{--grid-tc: repeat(6, 1fr) }.grid[col-lg="7"]{--grid-tc: repeat(7, 1fr) }.grid[col-lg="8"]{--grid-tc: repeat(8, 1fr) }.grid[col-lg="9"]{--grid-tc: repeat(9, 1fr) }.grid[col-lg="10"]{--grid-tc: repeat(10, 1fr) }.grid[col-lg="11"]{--grid-tc: repeat(11, 1fr) }.grid[col-lg="12"]{--grid-tc: repeat(12, 1fr) }.grid[col-lg="13"]{--grid-tc: repeat(13, 1fr) }.grid[col-lg="14"]{--grid-tc: repeat(14, 1fr) }.grid[col-lg="15"]{--grid-tc: repeat(15, 1fr) }.grid[col-lg="16"]{--grid-tc: repeat(16, 1fr) }.grid[col-lg="17"]{--grid-tc: repeat(17, 1fr) }.grid[col-lg="18"]{--grid-tc: repeat(18, 1fr) }.grid[col-lg="19"]{--grid-tc: repeat(19, 1fr) }.grid[col-lg="20"]{--grid-tc: repeat(20, 1fr) }.grid[col-lg="21"]{--grid-tc: repeat(21, 1fr) }.grid[col-lg="22"]{--grid-tc: repeat(22, 1fr) }.grid[col-lg="23"]{--grid-tc: repeat(23, 1fr) }.grid[col-lg="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span-lg^="1"]{--grid-cs: 1 }.grid>.grid_item[span-lg^="2"]{--grid-cs: 2 }.grid>.grid_item[span-lg^="3"]{--grid-cs: 3 }.grid>.grid_item[span-lg^="4"]{--grid-cs: 4 }.grid>.grid_item[span-lg^="5"]{--grid-cs: 5 }.grid>.grid_item[span-lg^="6"]{--grid-cs: 6 }.grid>.grid_item[span-lg^="7"]{--grid-cs: 7 }.grid>.grid_item[span-lg^="8"]{--grid-cs: 8 }.grid>.grid_item[span-lg^="9"]{--grid-cs: 9 }.grid>.grid_item[span-lg^="10"]{--grid-cs: 10 }.grid>.grid_item[span-lg^="11"]{--grid-cs: 11 }.grid>.grid_item[span-lg^="12"]{--grid-cs: 12 }.grid>.grid_item[span-lg^="13"]{--grid-cs: 13 }.grid>.grid_item[span-lg^="14"]{--grid-cs: 14 }.grid>.grid_item[span-lg^="15"]{--grid-cs: 15 }.grid>.grid_item[span-lg^="16"]{--grid-cs: 16 }.grid>.grid_item[span-lg^="17"]{--grid-cs: 17 }.grid>.grid_item[span-lg^="18"]{--grid-cs: 18 }.grid>.grid_item[span-lg^="19"]{--grid-cs: 19 }.grid>.grid_item[span-lg^="20"]{--grid-cs: 20 }.grid>.grid_item[span-lg^="21"]{--grid-cs: 21 }.grid>.grid_item[span-lg^="22"]{--grid-cs: 22 }.grid>.grid_item[span-lg^="23"]{--grid-cs: 23 }.grid>.grid_item[span-lg^="24"]{--grid-cs: 24 }.grid>.grid_item[span-lg$="+1"],.grid>.grid_item[span-lg="1"]{--grid-ce: 1 }.grid>.grid_item[span-lg$="+2"],.grid>.grid_item[span-lg$="-1"],.grid>.grid_item[span-lg="2"]{--grid-ce: 2 }.grid>.grid_item[span-lg$="+3"],.grid>.grid_item[span-lg$="-2"],.grid>.grid_item[span-lg="3"]{--grid-ce: 3 }.grid>.grid_item[span-lg$="+4"],.grid>.grid_item[span-lg$="-3"],.grid>.grid_item[span-lg="4"]{--grid-ce: 4 }.grid>.grid_item[span-lg$="+5"],.grid>.grid_item[span-lg$="-4"],.grid>.grid_item[span-lg="5"]{--grid-ce: 5 }.grid>.grid_item[span-lg$="+6"],.grid>.grid_item[span-lg$="-5"],.grid>.grid_item[span-lg="6"]{--grid-ce: 6 }.grid>.grid_item[span-lg$="+7"],.grid>.grid_item[span-lg$="-6"],.grid>.grid_item[span-lg="7"]{--grid-ce: 7 }.grid>.grid_item[span-lg$="+8"],.grid>.grid_item[span-lg$="-7"],.grid>.grid_item[span-lg="8"]{--grid-ce: 8 }.grid>.grid_item[span-lg$="+9"],.grid>.grid_item[span-lg$="-8"],.grid>.grid_item[span-lg="9"]{--grid-ce: 9 }.grid>.grid_item[span-lg$="+10"],.grid>.grid_item[span-lg$="-9"],.grid>.grid_item[span-lg="10"]{--grid-ce: 10 }.grid>.grid_item[span-lg$="+11"],.grid>.grid_item[span-lg$="-10"],.grid>.grid_item[span-lg="11"]{--grid-ce: 11 }.grid>.grid_item[span-lg$="+12"],.grid>.grid_item[span-lg$="-11"],.grid>.grid_item[span-lg="12"]{--grid-ce: 12 }.grid>.grid_item[span-lg$="+13"],.grid>.grid_item[span-lg$="-12"],.grid>.grid_item[span-lg="13"]{--grid-ce: 13 }.grid>.grid_item[span-lg$="+14"],.grid>.grid_item[span-lg$="-13"],.grid>.grid_item[span-lg="14"]{--grid-ce: 14 }.grid>.grid_item[span-lg$="+15"],.grid>.grid_item[span-lg$="-14"],.grid>.grid_item[span-lg="15"]{--grid-ce: 15 }.grid>.grid_item[span-lg$="+16"],.grid>.grid_item[span-lg$="-15"],.grid>.grid_item[span-lg="16"]{--grid-ce: 16 }.grid>.grid_item[span-lg$="+17"],.grid>.grid_item[span-lg$="-16"],.grid>.grid_item[span-lg="17"]{--grid-ce: 17 }.grid>.grid_item[span-lg$="+18"],.grid>.grid_item[span-lg$="-17"],.grid>.grid_item[span-lg="18"]{--grid-ce: 18 }.grid>.grid_item[span-lg$="+19"],.grid>.grid_item[span-lg$="-18"],.grid>.grid_item[span-lg="19"]{--grid-ce: 19 }.grid>.grid_item[span-lg$="+20"],.grid>.grid_item[span-lg$="-19"],.grid>.grid_item[span-lg="20"]{--grid-ce: 20 }.grid>.grid_item[span-lg$="+21"],.grid>.grid_item[span-lg$="-20"],.grid>.grid_item[span-lg="21"]{--grid-ce: 21 }.grid>.grid_item[span-lg$="+22"],.grid>.grid_item[span-lg$="-21"],.grid>.grid_item[span-lg="22"]{--grid-ce: 22 }.grid>.grid_item[span-lg$="+23"],.grid>.grid_item[span-lg$="-22"],.grid>.grid_item[span-lg="23"]{--grid-ce: 23 }.grid>.grid_item[span-lg$="+24"],.grid>.grid_item[span-lg$="-23"],.grid>.grid_item[span-lg="24"]{--grid-ce: 24 }.grid>.grid_item[span-lg$="-24"]{--grid-ce: 25 }.grid>.grid_item[span-lg]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span-lg*="+"],.grid>.grid_item[span-lg*="-"],.grid>.grid_item[span-lg*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span-lg*="-"],.grid>.grid_item[span-lg*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span-lg=row]{grid-column:1 / -1}}@media only screen and (width>=1440px){.grid[col-xl="1"]{--grid-tc: repeat(1, 1fr) }.grid[col-xl="2"]{--grid-tc: repeat(2, 1fr) }.grid[col-xl="3"]{--grid-tc: repeat(3, 1fr) }.grid[col-xl="4"]{--grid-tc: repeat(4, 1fr) }.grid[col-xl="5"]{--grid-tc: repeat(5, 1fr) }.grid[col-xl="6"]{--grid-tc: repeat(6, 1fr) }.grid[col-xl="7"]{--grid-tc: repeat(7, 1fr) }.grid[col-xl="8"]{--grid-tc: repeat(8, 1fr) }.grid[col-xl="9"]{--grid-tc: repeat(9, 1fr) }.grid[col-xl="10"]{--grid-tc: repeat(10, 1fr) }.grid[col-xl="11"]{--grid-tc: repeat(11, 1fr) }.grid[col-xl="12"]{--grid-tc: repeat(12, 1fr) }.grid[col-xl="13"]{--grid-tc: repeat(13, 1fr) }.grid[col-xl="14"]{--grid-tc: repeat(14, 1fr) }.grid[col-xl="15"]{--grid-tc: repeat(15, 1fr) }.grid[col-xl="16"]{--grid-tc: repeat(16, 1fr) }.grid[col-xl="17"]{--grid-tc: repeat(17, 1fr) }.grid[col-xl="18"]{--grid-tc: repeat(18, 1fr) }.grid[col-xl="19"]{--grid-tc: repeat(19, 1fr) }.grid[col-xl="20"]{--grid-tc: repeat(20, 1fr) }.grid[col-xl="21"]{--grid-tc: repeat(21, 1fr) }.grid[col-xl="22"]{--grid-tc: repeat(22, 1fr) }.grid[col-xl="23"]{--grid-tc: repeat(23, 1fr) }.grid[col-xl="24"]{--grid-tc: repeat(24, 1fr) }.grid>.grid_item[span-xl^="1"]{--grid-cs: 1 }.grid>.grid_item[span-xl^="2"]{--grid-cs: 2 }.grid>.grid_item[span-xl^="3"]{--grid-cs: 3 }.grid>.grid_item[span-xl^="4"]{--grid-cs: 4 }.grid>.grid_item[span-xl^="5"]{--grid-cs: 5 }.grid>.grid_item[span-xl^="6"]{--grid-cs: 6 }.grid>.grid_item[span-xl^="7"]{--grid-cs: 7 }.grid>.grid_item[span-xl^="8"]{--grid-cs: 8 }.grid>.grid_item[span-xl^="9"]{--grid-cs: 9 }.grid>.grid_item[span-xl^="10"]{--grid-cs: 10 }.grid>.grid_item[span-xl^="11"]{--grid-cs: 11 }.grid>.grid_item[span-xl^="12"]{--grid-cs: 12 }.grid>.grid_item[span-xl^="13"]{--grid-cs: 13 }.grid>.grid_item[span-xl^="14"]{--grid-cs: 14 }.grid>.grid_item[span-xl^="15"]{--grid-cs: 15 }.grid>.grid_item[span-xl^="16"]{--grid-cs: 16 }.grid>.grid_item[span-xl^="17"]{--grid-cs: 17 }.grid>.grid_item[span-xl^="18"]{--grid-cs: 18 }.grid>.grid_item[span-xl^="19"]{--grid-cs: 19 }.grid>.grid_item[span-xl^="20"]{--grid-cs: 20 }.grid>.grid_item[span-xl^="21"]{--grid-cs: 21 }.grid>.grid_item[span-xl^="22"]{--grid-cs: 22 }.grid>.grid_item[span-xl^="23"]{--grid-cs: 23 }.grid>.grid_item[span-xl^="24"]{--grid-cs: 24 }.grid>.grid_item[span-xl$="+1"],.grid>.grid_item[span-xl="1"]{--grid-ce: 1 }.grid>.grid_item[span-xl$="+2"],.grid>.grid_item[span-xl$="-1"],.grid>.grid_item[span-xl="2"]{--grid-ce: 2 }.grid>.grid_item[span-xl$="+3"],.grid>.grid_item[span-xl$="-2"],.grid>.grid_item[span-xl="3"]{--grid-ce: 3 }.grid>.grid_item[span-xl$="+4"],.grid>.grid_item[span-xl$="-3"],.grid>.grid_item[span-xl="4"]{--grid-ce: 4 }.grid>.grid_item[span-xl$="+5"],.grid>.grid_item[span-xl$="-4"],.grid>.grid_item[span-xl="5"]{--grid-ce: 5 }.grid>.grid_item[span-xl$="+6"],.grid>.grid_item[span-xl$="-5"],.grid>.grid_item[span-xl="6"]{--grid-ce: 6 }.grid>.grid_item[span-xl$="+7"],.grid>.grid_item[span-xl$="-6"],.grid>.grid_item[span-xl="7"]{--grid-ce: 7 }.grid>.grid_item[span-xl$="+8"],.grid>.grid_item[span-xl$="-7"],.grid>.grid_item[span-xl="8"]{--grid-ce: 8 }.grid>.grid_item[span-xl$="+9"],.grid>.grid_item[span-xl$="-8"],.grid>.grid_item[span-xl="9"]{--grid-ce: 9 }.grid>.grid_item[span-xl$="+10"],.grid>.grid_item[span-xl$="-9"],.grid>.grid_item[span-xl="10"]{--grid-ce: 10 }.grid>.grid_item[span-xl$="+11"],.grid>.grid_item[span-xl$="-10"],.grid>.grid_item[span-xl="11"]{--grid-ce: 11 }.grid>.grid_item[span-xl$="+12"],.grid>.grid_item[span-xl$="-11"],.grid>.grid_item[span-xl="12"]{--grid-ce: 12 }.grid>.grid_item[span-xl$="+13"],.grid>.grid_item[span-xl$="-12"],.grid>.grid_item[span-xl="13"]{--grid-ce: 13 }.grid>.grid_item[span-xl$="+14"],.grid>.grid_item[span-xl$="-13"],.grid>.grid_item[span-xl="14"]{--grid-ce: 14 }.grid>.grid_item[span-xl$="+15"],.grid>.grid_item[span-xl$="-14"],.grid>.grid_item[span-xl="15"]{--grid-ce: 15 }.grid>.grid_item[span-xl$="+16"],.grid>.grid_item[span-xl$="-15"],.grid>.grid_item[span-xl="16"]{--grid-ce: 16 }.grid>.grid_item[span-xl$="+17"],.grid>.grid_item[span-xl$="-16"],.grid>.grid_item[span-xl="17"]{--grid-ce: 17 }.grid>.grid_item[span-xl$="+18"],.grid>.grid_item[span-xl$="-17"],.grid>.grid_item[span-xl="18"]{--grid-ce: 18 }.grid>.grid_item[span-xl$="+19"],.grid>.grid_item[span-xl$="-18"],.grid>.grid_item[span-xl="19"]{--grid-ce: 19 }.grid>.grid_item[span-xl$="+20"],.grid>.grid_item[span-xl$="-19"],.grid>.grid_item[span-xl="20"]{--grid-ce: 20 }.grid>.grid_item[span-xl$="+21"],.grid>.grid_item[span-xl$="-20"],.grid>.grid_item[span-xl="21"]{--grid-ce: 21 }.grid>.grid_item[span-xl$="+22"],.grid>.grid_item[span-xl$="-21"],.grid>.grid_item[span-xl="22"]{--grid-ce: 22 }.grid>.grid_item[span-xl$="+23"],.grid>.grid_item[span-xl$="-22"],.grid>.grid_item[span-xl="23"]{--grid-ce: 23 }.grid>.grid_item[span-xl$="+24"],.grid>.grid_item[span-xl$="-23"],.grid>.grid_item[span-xl="24"]{--grid-ce: 24 }.grid>.grid_item[span-xl$="-24"]{--grid-ce: 25 }.grid>.grid_item[span-xl]{grid-column-end:span var(--grid-ce)}.grid>.grid_item[span-xl*="+"],.grid>.grid_item[span-xl*="-"],.grid>.grid_item[span-xl*=".."]{grid-column-start:var(--grid-cs)}.grid>.grid_item[span-xl*="-"],.grid>.grid_item[span-xl*=".."]{grid-column-end:var(--grid-ce)}.grid>.grid_item[span-xl=row]{grid-column:1 / -1}}}@layer global{.layout{display:flex;flex-direction:column;width:100vw;min-height:100vh;.layout_content{flex:1}}.layout_content_main{container:main / inline-size}.layout-centered{.layout_content{display:grid;gap:var(--sm3);grid-template-columns:1fr minmax(0,var(--layout-content-width)) 1fr;margin-top:var(--lg1);margin-bottom:var(--sm1);@media(width>=768px){margin-top:var(--xl3);margin-bottom:var(--md3);gap:var(--md3)}}.layout_content_main{grid-column:2}}.layout-sidebar{.layout_content{@media(width>=768px){display:grid;grid-template-columns:var(--layout-aside-width) minmax(0,1fr)}}.layout_content_main{padding:var(--sm2);@media(width>=768px){grid-row:1;grid-column:2;padding:var(--lg1) var(--md2)}}.layout_content_aside{@media(width>=768px){grid-row:1;grid-column:1;padding:var(--lg1) var(--md3)}}}.layout-sidebar-end{.layout_content{@media(width>=768px){grid-template-columns:minmax(0,1fr) var(--layout-aside-width)}}.layout_content_main{@media(width>=768px){grid-column:1}}.layout_content_aside{@media(width>=768px){grid-column:2}}}.layout-docs{.layout_content{@media(width>=768px){display:grid;grid-template-columns:var(--layout-aside-width) minmax(0,1fr)}@media(width>=1024px){grid-template-columns:var(--layout-aside-width) minmax(0,var(--layout-content-width)) var(--layout-toc-width)}}.layout_content_main{padding:var(--sm2);@media(width>=768px){grid-row:1;grid-column:2;padding:var(--lg1) var(--md2)}}.layout_content_aside{display:none;@media(width>=768px){display:block;grid-row:1;grid-column:1;padding:var(--lg1) var(--md3)}}.layout_content_aside-toc{@media(width>=768px){display:none}@media(width>=1024px){display:block;grid-row:1;grid-column:3;padding:var(--lg1) var(--md3)}}}.layout-split{.layout_content{display:grid;@media(width>=768px){grid-template-columns:1fr 1fr}}}.layout-cover{min-height:100dvh;.layout_content{display:grid;place-items:center}}}@layer global{@scope(.prose)to (.not-prose){:is(p,ul,ol,blockquote,table):has(+:is(h1,h2,h3,h4)){margin-bottom:calc(var(--prose-spacing) * 2)}p,ul,ol,dl{margin-bottom:var(--prose-spacing);p,ul,ol,dl{margin-bottom:0}}ul,ol{ul,ol{margin-inline-start:0;padding-inline-start:var(--sm2)}li{margin-bottom:.5em;&::marker{color:light-dark(var(--base-300),var(--base-600))}}}ul{margin-inline-start:var(--sm2);list-style-type:"\2192  "}ol{margin-inline-start:var(--md2);list-style-type:decimal-leading-zero;li::marker{font-size:var(--text-sm)}}table{margin-top:var(--md1);margin-bottom:var(--md1)}}}@layer global{.wrap{display:grid;grid-template-columns:1fr var(--wrap-width) 1fr;>*,>astro-island>*,>astro-slot>*,>astro-static-slot>*{grid-column:2;padding-inline:var(--wrap-spacing);@media(width>=768px){padding-inline:var(--wrap-md-spacing)}@media(width>=1024px){padding-inline:var(--wrap-lg-spacing)}}}.wrap-sm{--wrap-width: var(--wrap-width-sm)}.wrap-md{--wrap-width: var(--wrap-width-md)}.wrap-lg{--wrap-width: var(--wrap-width-lg)}.wrap_content-fullBleed{grid-column:1 / -1;width:100%;object-fit:cover}}@layer helpers{.c-base-0{color:var(--base-0)!important}.bdc-base-0{border-color:var(--base-0)!important}.bgc-base-0{background-color:var(--base-0)!important}.c-base-50{color:var(--base-50)!important}.bdc-base-50{border-color:var(--base-50)!important}.bgc-base-50{background-color:var(--base-50)!important}.c-base-100{color:var(--base-100)!important}.bdc-base-100{border-color:var(--base-100)!important}.bgc-base-100{background-color:var(--base-100)!important}.c-base-200{color:var(--base-200)!important}.bdc-base-200{border-color:var(--base-200)!important}.bgc-base-200{background-color:var(--base-200)!important}.c-base-300{color:var(--base-300)!important}.bdc-base-300{border-color:var(--base-300)!important}.bgc-base-300{background-color:var(--base-300)!important}.c-base-400{color:var(--base-400)!important}.bdc-base-400{border-color:var(--base-400)!important}.bgc-base-400{background-color:var(--base-400)!important}.c-base-500{color:var(--base-500)!important}.bdc-base-500{border-color:var(--base-500)!important}.bgc-base-500{background-color:var(--base-500)!important}.c-base-600{color:var(--base-600)!important}.bdc-base-600{border-color:var(--base-600)!important}.bgc-base-600{background-color:var(--base-600)!important}.c-base-700{color:var(--base-700)!important}.bdc-base-700{border-color:var(--base-700)!important}.bgc-base-700{background-color:var(--base-700)!important}.c-base-800{color:var(--base-800)!important}.bdc-base-800{border-color:var(--base-800)!important}.bgc-base-800{background-color:var(--base-800)!important}.c-base-900{color:var(--base-900)!important}.bdc-base-900{border-color:var(--base-900)!important}.bgc-base-900{background-color:var(--base-900)!important}.c-base-950{color:var(--base-950)!important}.bdc-base-950{border-color:var(--base-950)!important}.bgc-base-950{background-color:var(--base-950)!important}.c-primary-50{color:var(--primary-50)!important}.bdc-primary-50{border-color:var(--primary-50)!important}.bgc-primary-50{background-color:var(--primary-50)!important}.c-primary-100{color:var(--primary-100)!important}.bdc-primary-100{border-color:var(--primary-100)!important}.bgc-primary-100{background-color:var(--primary-100)!important}.c-primary-200{color:var(--primary-200)!important}.bdc-primary-200{border-color:var(--primary-200)!important}.bgc-primary-200{background-color:var(--primary-200)!important}.c-primary-300{color:var(--primary-300)!important}.bdc-primary-300{border-color:var(--primary-300)!important}.bgc-primary-300{background-color:var(--primary-300)!important}.c-primary-400{color:var(--primary-400)!important}.bdc-primary-400{border-color:var(--primary-400)!important}.bgc-primary-400{background-color:var(--primary-400)!important}.c-primary-500{color:var(--primary-500)!important}.bdc-primary-500{border-color:var(--primary-500)!important}.bgc-primary-500{background-color:var(--primary-500)!important}.c-primary-600{color:var(--primary-600)!important}.bdc-primary-600{border-color:var(--primary-600)!important}.bgc-primary-600{background-color:var(--primary-600)!important}.c-primary-700{color:var(--primary-700)!important}.bdc-primary-700{border-color:var(--primary-700)!important}.bgc-primary-700{background-color:var(--primary-700)!important}.c-primary-800{color:var(--primary-800)!important}.bdc-primary-800{border-color:var(--primary-800)!important}.bgc-primary-800{background-color:var(--primary-800)!important}.c-primary-900{color:var(--primary-900)!important}.bdc-primary-900{border-color:var(--primary-900)!important}.bgc-primary-900{background-color:var(--primary-900)!important}.c-primary-950{color:var(--primary-950)!important}.bdc-primary-950{border-color:var(--primary-950)!important}.bgc-primary-950{background-color:var(--primary-950)!important}.c-yes-100{color:var(--yes-100)!important}.bdc-yes-100{border-color:var(--yes-100)!important}.bgc-yes-100{background-color:var(--yes-100)!important}.c-yes-200{color:var(--yes-200)!important}.bdc-yes-200{border-color:var(--yes-200)!important}.bgc-yes-200{background-color:var(--yes-200)!important}.c-yes-300{color:var(--yes-300)!important}.bdc-yes-300{border-color:var(--yes-300)!important}.bgc-yes-300{background-color:var(--yes-300)!important}.c-yes-400{color:var(--yes-400)!important}.bdc-yes-400{border-color:var(--yes-400)!important}.bgc-yes-400{background-color:var(--yes-400)!important}.c-yes-500{color:var(--yes-500)!important}.bdc-yes-500{border-color:var(--yes-500)!important}.bgc-yes-500{background-color:var(--yes-500)!important}.c-no-100{color:var(--no-100)!important}.bdc-no-100{border-color:var(--no-100)!important}.bgc-no-100{background-color:var(--no-100)!important}.c-no-200{color:var(--no-200)!important}.bdc-no-200{border-color:var(--no-200)!important}.bgc-no-200{background-color:var(--no-200)!important}.c-no-300{color:var(--no-300)!important}.bdc-no-300{border-color:var(--no-300)!important}.bgc-no-300{background-color:var(--no-300)!important}.c-no-400{color:var(--no-400)!important}.bdc-no-400{border-color:var(--no-400)!important}.bgc-no-400{background-color:var(--no-400)!important}.c-no-500{color:var(--no-500)!important}.bdc-no-500{border-color:var(--no-500)!important}.bgc-no-500{background-color:var(--no-500)!important}.c-maybe-100{color:var(--maybe-100)!important}.bdc-maybe-100{border-color:var(--maybe-100)!important}.bgc-maybe-100{background-color:var(--maybe-100)!important}.c-maybe-200{color:var(--maybe-200)!important}.bdc-maybe-200{border-color:var(--maybe-200)!important}.bgc-maybe-200{background-color:var(--maybe-200)!important}.c-maybe-300{color:var(--maybe-300)!important}.bdc-maybe-300{border-color:var(--maybe-300)!important}.bgc-maybe-300{background-color:var(--maybe-300)!important}.c-maybe-400{color:var(--maybe-400)!important}.bdc-maybe-400{border-color:var(--maybe-400)!important}.bgc-maybe-400{background-color:var(--maybe-400)!important}.c-maybe-500{color:var(--maybe-500)!important}.bdc-maybe-500{border-color:var(--maybe-500)!important}.bgc-maybe-500{background-color:var(--maybe-500)!important}}@layer helpers{body.dev{--baseline: 8;background-size:100% calc(var(--baseline) * 1px)!important;background-image:linear-gradient(to bottom,#0000 calc((var(--baseline) - 1) * 1px),#ff69b4 calc(var(--baseline) * 1px))!important}.dev-error{position:fixed!important;top:var(--md1)!important;left:var(--md1)!important;z-index:var(--z-top)!important;padding:var(--sm1)!important;font-size:1rem!important;color:var(--danger-500)!important;background:var(--danger-100)!important;border:1px solid var(--danger-500)!important;border-radius:var(--radius-md)!important}}@layer helpers{.of-auto,.overflow-auto{overflow:auto!important}.of-hidden,.overflow-hidden{overflow:hidden!important}.of-clip,.overflow-clip{overflow:clip!important}.of-visible,.overflow-visible{overflow:visible!important}.of-scroll,.overflow-scroll{overflow:scroll!important}.of-x-auto,.overflow-x-auto{overflow-x:auto!important}.of-y-auto,.overflow-y-auto{overflow-y:auto!important}.of-x-hidden,.overflow-x-hidden{overflow-x:hidden!important}.of-y-hidden,.overflow-y-hidden{overflow-y:hidden!important}.of-x-clip,.overflow-x-clip{overflow-x:clip!important}.of-y-clip,.overflow-y-clip{overflow-y:clip!important}.of-x-visible,.overflow-x-visible{overflow-x:visible!important}.of-y-visible,.overflow-y-visible{overflow-y:visible!important}.of-x-scroll,.overflow-x-scroll{overflow-x:scroll!important}.of-y-scroll,.overflow-y-scroll{overflow-y:scroll!important}.position-static{position:static!important}.position-fixed{position:fixed!important}.position-absolute{position:absolute!important}.position-relative{position:relative!important}.position-sticky{position:sticky!important}.visibility-visible{visibility:visible!important}.visibility-hidden{visibility:hidden!important}.visibility-collapse{visibility:collapse!important}.z-auto{z-index:auto!important}.z-bottom{z-index:var(--z-bottom)!important}.z-0{z-index:var(--z-0)!important}.z-1{z-index:var(--z-1)!important}.z-2{z-index:var(--z-2)!important}.z-3{z-index:var(--z-3)!important}.z-4{z-index:var(--z-4)!important}.z-5{z-index:var(--z-5)!important}.z-top{z-index:var(--z-top)!important}}@layer helpers{.o-0{opacity:var(--o-0)!important}.o-1{opacity:var(--o-1)!important}.o-2{opacity:var(--o-2)!important}.o-3{opacity:var(--o-3)!important}.o-4{opacity:var(--o-4)!important}.o-5{opacity:var(--o-5)!important}}@layer helpers{.ar-square{aspect-ratio:var(--ar-square)!important}.ar-landscape{aspect-ratio:var(--ar-landscape)!important}.ar-portrait{aspect-ratio:var(--ar-portrait)!important}.ar-widescreen{aspect-ratio:var(--ar-widescreen)!important}.ar-golden{aspect-ratio:var(--ar-golden)!important}}@layer helpers{.w-0{width:0!important}.h-0{height:0!important}.m-0{margin:0!important}.mt-0{margin-top:0!important}.mb-0{margin-bottom:0!important}.ml-0{margin-left:0!important}.mr-0{margin-right:0!important}.mis-0{margin-inline-start:0!important}.mie-0{margin-inline-end:0!important}.p-0{padding:0!important}.pt-0{padding-top:0!important}.pb-0{padding-bottom:0!important}.pl-0{padding-left:0!important}.pr-0{padding-right:0!important}.pis-0{padding-inline-start:0!important}.pie-0{padding-inline-end:0!important}.w-xs1{width:var(--xs1)!important}.h-xs1{height:var(--xs1)!important}.m-xs1{margin:var(--xs1)!important}.mt-xs1{margin-top:var(--xs1)!important}.mb-xs1{margin-bottom:var(--xs1)!important}.ml-xs1{margin-left:var(--xs1)!important}.mr-xs1{margin-right:var(--xs1)!important}.mis-xs1{margin-inline-start:var(--xs1)!important}.mie-xs1{margin-inline-end:var(--xs1)!important}.p-xs1{padding:var(--xs1)!important}.pt-xs1{padding-top:var(--xs1)!important}.pb-xs1{padding-bottom:var(--xs1)!important}.pl-xs1{padding-left:var(--xs1)!important}.pr-xs1{padding-right:var(--xs1)!important}.pis-xs1{padding-inline-start:var(--xs1)!important}.pie-xs1{padding-inline-end:var(--xs1)!important}.w-xs2{width:var(--xs2)!important}.h-xs2{height:var(--xs2)!important}.m-xs2{margin:var(--xs2)!important}.mt-xs2{margin-top:var(--xs2)!important}.mb-xs2{margin-bottom:var(--xs2)!important}.ml-xs2{margin-left:var(--xs2)!important}.mr-xs2{margin-right:var(--xs2)!important}.mis-xs2{margin-inline-start:var(--xs2)!important}.mie-xs2{margin-inline-end:var(--xs2)!important}.p-xs2{padding:var(--xs2)!important}.pt-xs2{padding-top:var(--xs2)!important}.pb-xs2{padding-bottom:var(--xs2)!important}.pl-xs2{padding-left:var(--xs2)!important}.pr-xs2{padding-right:var(--xs2)!important}.pis-xs2{padding-inline-start:var(--xs2)!important}.pie-xs2{padding-inline-end:var(--xs2)!important}.w-xs3{width:var(--xs3)!important}.h-xs3{height:var(--xs3)!important}.m-xs3{margin:var(--xs3)!important}.mt-xs3{margin-top:var(--xs3)!important}.mb-xs3{margin-bottom:var(--xs3)!important}.ml-xs3{margin-left:var(--xs3)!important}.mr-xs3{margin-right:var(--xs3)!important}.mis-xs3{margin-inline-start:var(--xs3)!important}.mie-xs3{margin-inline-end:var(--xs3)!important}.p-xs3{padding:var(--xs3)!important}.pt-xs3{padding-top:var(--xs3)!important}.pb-xs3{padding-bottom:var(--xs3)!important}.pl-xs3{padding-left:var(--xs3)!important}.pr-xs3{padding-right:var(--xs3)!important}.pis-xs3{padding-inline-start:var(--xs3)!important}.pie-xs3{padding-inline-end:var(--xs3)!important}.w-sm1{width:var(--sm1)!important}.h-sm1{height:var(--sm1)!important}.m-sm1{margin:var(--sm1)!important}.mt-sm1{margin-top:var(--sm1)!important}.mb-sm1{margin-bottom:var(--sm1)!important}.ml-sm1{margin-left:var(--sm1)!important}.mr-sm1{margin-right:var(--sm1)!important}.mis-sm1{margin-inline-start:var(--sm1)!important}.mie-sm1{margin-inline-end:var(--sm1)!important}.p-sm1{padding:var(--sm1)!important}.pt-sm1{padding-top:var(--sm1)!important}.pb-sm1{padding-bottom:var(--sm1)!important}.pl-sm1{padding-left:var(--sm1)!important}.pr-sm1{padding-right:var(--sm1)!important}.pis-sm1{padding-inline-start:var(--sm1)!important}.pie-sm1{padding-inline-end:var(--sm1)!important}.w-sm2{width:var(--sm2)!important}.h-sm2{height:var(--sm2)!important}.m-sm2{margin:var(--sm2)!important}.mt-sm2{margin-top:var(--sm2)!important}.mb-sm2{margin-bottom:var(--sm2)!important}.ml-sm2{margin-left:var(--sm2)!important}.mr-sm2{margin-right:var(--sm2)!important}.mis-sm2{margin-inline-start:var(--sm2)!important}.mie-sm2{margin-inline-end:var(--sm2)!important}.p-sm2{padding:var(--sm2)!important}.pt-sm2{padding-top:var(--sm2)!important}.pb-sm2{padding-bottom:var(--sm2)!important}.pl-sm2{padding-left:var(--sm2)!important}.pr-sm2{padding-right:var(--sm2)!important}.pis-sm2{padding-inline-start:var(--sm2)!important}.pie-sm2{padding-inline-end:var(--sm2)!important}.w-sm3{width:var(--sm3)!important}.h-sm3{height:var(--sm3)!important}.m-sm3{margin:var(--sm3)!important}.mt-sm3{margin-top:var(--sm3)!important}.mb-sm3{margin-bottom:var(--sm3)!important}.ml-sm3{margin-left:var(--sm3)!important}.mr-sm3{margin-right:var(--sm3)!important}.mis-sm3{margin-inline-start:var(--sm3)!important}.mie-sm3{margin-inline-end:var(--sm3)!important}.p-sm3{padding:var(--sm3)!important}.pt-sm3{padding-top:var(--sm3)!important}.pb-sm3{padding-bottom:var(--sm3)!important}.pl-sm3{padding-left:var(--sm3)!important}.pr-sm3{padding-right:var(--sm3)!important}.pis-sm3{padding-inline-start:var(--sm3)!important}.pie-sm3{padding-inline-end:var(--sm3)!important}.w-md1{width:var(--md1)!important}.h-md1{height:var(--md1)!important}.m-md1{margin:var(--md1)!important}.mt-md1{margin-top:var(--md1)!important}.mb-md1{margin-bottom:var(--md1)!important}.ml-md1{margin-left:var(--md1)!important}.mr-md1{margin-right:var(--md1)!important}.mis-md1{margin-inline-start:var(--md1)!important}.mie-md1{margin-inline-end:var(--md1)!important}.p-md1{padding:var(--md1)!important}.pt-md1{padding-top:var(--md1)!important}.pb-md1{padding-bottom:var(--md1)!important}.pl-md1{padding-left:var(--md1)!important}.pr-md1{padding-right:var(--md1)!important}.pis-md1{padding-inline-start:var(--md1)!important}.pie-md1{padding-inline-end:var(--md1)!important}.w-md2{width:var(--md2)!important}.h-md2{height:var(--md2)!important}.m-md2{margin:var(--md2)!important}.mt-md2{margin-top:var(--md2)!important}.mb-md2{margin-bottom:var(--md2)!important}.ml-md2{margin-left:var(--md2)!important}.mr-md2{margin-right:var(--md2)!important}.mis-md2{margin-inline-start:var(--md2)!important}.mie-md2{margin-inline-end:var(--md2)!important}.p-md2{padding:var(--md2)!important}.pt-md2{padding-top:var(--md2)!important}.pb-md2{padding-bottom:var(--md2)!important}.pl-md2{padding-left:var(--md2)!important}.pr-md2{padding-right:var(--md2)!important}.pis-md2{padding-inline-start:var(--md2)!important}.pie-md2{padding-inline-end:var(--md2)!important}.w-md3{width:var(--md3)!important}.h-md3{height:var(--md3)!important}.m-md3{margin:var(--md3)!important}.mt-md3{margin-top:var(--md3)!important}.mb-md3{margin-bottom:var(--md3)!important}.ml-md3{margin-left:var(--md3)!important}.mr-md3{margin-right:var(--md3)!important}.mis-md3{margin-inline-start:var(--md3)!important}.mie-md3{margin-inline-end:var(--md3)!important}.p-md3{padding:var(--md3)!important}.pt-md3{padding-top:var(--md3)!important}.pb-md3{padding-bottom:var(--md3)!important}.pl-md3{padding-left:var(--md3)!important}.pr-md3{padding-right:var(--md3)!important}.pis-md3{padding-inline-start:var(--md3)!important}.pie-md3{padding-inline-end:var(--md3)!important}.w-lg1{width:var(--lg1)!important}.h-lg1{height:var(--lg1)!important}.m-lg1{margin:var(--lg1)!important}.mt-lg1{margin-top:var(--lg1)!important}.mb-lg1{margin-bottom:var(--lg1)!important}.ml-lg1{margin-left:var(--lg1)!important}.mr-lg1{margin-right:var(--lg1)!important}.mis-lg1{margin-inline-start:var(--lg1)!important}.mie-lg1{margin-inline-end:var(--lg1)!important}.p-lg1{padding:var(--lg1)!important}.pt-lg1{padding-top:var(--lg1)!important}.pb-lg1{padding-bottom:var(--lg1)!important}.pl-lg1{padding-left:var(--lg1)!important}.pr-lg1{padding-right:var(--lg1)!important}.pis-lg1{padding-inline-start:var(--lg1)!important}.pie-lg1{padding-inline-end:var(--lg1)!important}.w-lg2{width:var(--lg2)!important}.h-lg2{height:var(--lg2)!important}.m-lg2{margin:var(--lg2)!important}.mt-lg2{margin-top:var(--lg2)!important}.mb-lg2{margin-bottom:var(--lg2)!important}.ml-lg2{margin-left:var(--lg2)!important}.mr-lg2{margin-right:var(--lg2)!important}.mis-lg2{margin-inline-start:var(--lg2)!important}.mie-lg2{margin-inline-end:var(--lg2)!important}.p-lg2{padding:var(--lg2)!important}.pt-lg2{padding-top:var(--lg2)!important}.pb-lg2{padding-bottom:var(--lg2)!important}.pl-lg2{padding-left:var(--lg2)!important}.pr-lg2{padding-right:var(--lg2)!important}.pis-lg2{padding-inline-start:var(--lg2)!important}.pie-lg2{padding-inline-end:var(--lg2)!important}.w-lg3{width:var(--lg3)!important}.h-lg3{height:var(--lg3)!important}.m-lg3{margin:var(--lg3)!important}.mt-lg3{margin-top:var(--lg3)!important}.mb-lg3{margin-bottom:var(--lg3)!important}.ml-lg3{margin-left:var(--lg3)!important}.mr-lg3{margin-right:var(--lg3)!important}.mis-lg3{margin-inline-start:var(--lg3)!important}.mie-lg3{margin-inline-end:var(--lg3)!important}.p-lg3{padding:var(--lg3)!important}.pt-lg3{padding-top:var(--lg3)!important}.pb-lg3{padding-bottom:var(--lg3)!important}.pl-lg3{padding-left:var(--lg3)!important}.pr-lg3{padding-right:var(--lg3)!important}.pis-lg3{padding-inline-start:var(--lg3)!important}.pie-lg3{padding-inline-end:var(--lg3)!important}.w-xl1{width:var(--xl1)!important}.h-xl1{height:var(--xl1)!important}.m-xl1{margin:var(--xl1)!important}.mt-xl1{margin-top:var(--xl1)!important}.mb-xl1{margin-bottom:var(--xl1)!important}.ml-xl1{margin-left:var(--xl1)!important}.mr-xl1{margin-right:var(--xl1)!important}.mis-xl1{margin-inline-start:var(--xl1)!important}.mie-xl1{margin-inline-end:var(--xl1)!important}.p-xl1{padding:var(--xl1)!important}.pt-xl1{padding-top:var(--xl1)!important}.pb-xl1{padding-bottom:var(--xl1)!important}.pl-xl1{padding-left:var(--xl1)!important}.pr-xl1{padding-right:var(--xl1)!important}.pis-xl1{padding-inline-start:var(--xl1)!important}.pie-xl1{padding-inline-end:var(--xl1)!important}.w-xl2{width:var(--xl2)!important}.h-xl2{height:var(--xl2)!important}.m-xl2{margin:var(--xl2)!important}.mt-xl2{margin-top:var(--xl2)!important}.mb-xl2{margin-bottom:var(--xl2)!important}.ml-xl2{margin-left:var(--xl2)!important}.mr-xl2{margin-right:var(--xl2)!important}.mis-xl2{margin-inline-start:var(--xl2)!important}.mie-xl2{margin-inline-end:var(--xl2)!important}.p-xl2{padding:var(--xl2)!important}.pt-xl2{padding-top:var(--xl2)!important}.pb-xl2{padding-bottom:var(--xl2)!important}.pl-xl2{padding-left:var(--xl2)!important}.pr-xl2{padding-right:var(--xl2)!important}.pis-xl2{padding-inline-start:var(--xl2)!important}.pie-xl2{padding-inline-end:var(--xl2)!important}.w-xl3{width:var(--xl3)!important}.h-xl3{height:var(--xl3)!important}.m-xl3{margin:var(--xl3)!important}.mt-xl3{margin-top:var(--xl3)!important}.mb-xl3{margin-bottom:var(--xl3)!important}.ml-xl3{margin-left:var(--xl3)!important}.mr-xl3{margin-right:var(--xl3)!important}.mis-xl3{margin-inline-start:var(--xl3)!important}.mie-xl3{margin-inline-end:var(--xl3)!important}.p-xl3{padding:var(--xl3)!important}.pt-xl3{padding-top:var(--xl3)!important}.pb-xl3{padding-bottom:var(--xl3)!important}.pl-xl3{padding-left:var(--xl3)!important}.pr-xl3{padding-right:var(--xl3)!important}.pis-xl3{padding-inline-start:var(--xl3)!important}.pie-xl3{padding-inline-end:var(--xl3)!important}.w-xxl1{width:var(--xxl1)!important}.h-xxl1{height:var(--xxl1)!important}.m-xxl1{margin:var(--xxl1)!important}.mt-xxl1{margin-top:var(--xxl1)!important}.mb-xxl1{margin-bottom:var(--xxl1)!important}.ml-xxl1{margin-left:var(--xxl1)!important}.mr-xxl1{margin-right:var(--xxl1)!important}.mis-xxl1{margin-inline-start:var(--xxl1)!important}.mie-xxl1{margin-inline-end:var(--xxl1)!important}.p-xxl1{padding:var(--xxl1)!important}.pt-xxl1{padding-top:var(--xxl1)!important}.pb-xxl1{padding-bottom:var(--xxl1)!important}.pl-xxl1{padding-left:var(--xxl1)!important}.pr-xxl1{padding-right:var(--xxl1)!important}.pis-xxl1{padding-inline-start:var(--xxl1)!important}.pie-xxl1{padding-inline-end:var(--xxl1)!important}.w-xxl2{width:var(--xxl2)!important}.h-xxl2{height:var(--xxl2)!important}.m-xxl2{margin:var(--xxl2)!important}.mt-xxl2{margin-top:var(--xxl2)!important}.mb-xxl2{margin-bottom:var(--xxl2)!important}.ml-xxl2{margin-left:var(--xxl2)!important}.mr-xxl2{margin-right:var(--xxl2)!important}.mis-xxl2{margin-inline-start:var(--xxl2)!important}.mie-xxl2{margin-inline-end:var(--xxl2)!important}.p-xxl2{padding:var(--xxl2)!important}.pt-xxl2{padding-top:var(--xxl2)!important}.pb-xxl2{padding-bottom:var(--xxl2)!important}.pl-xxl2{padding-left:var(--xxl2)!important}.pr-xxl2{padding-right:var(--xxl2)!important}.pis-xxl2{padding-inline-start:var(--xxl2)!important}.pie-xxl2{padding-inline-end:var(--xxl2)!important}.w-xxl3{width:var(--xxl3)!important}.h-xxl3{height:var(--xxl3)!important}.m-xxl3{margin:var(--xxl3)!important}.mt-xxl3{margin-top:var(--xxl3)!important}.mb-xxl3{margin-bottom:var(--xxl3)!important}.ml-xxl3{margin-left:var(--xxl3)!important}.mr-xxl3{margin-right:var(--xxl3)!important}.mis-xxl3{margin-inline-start:var(--xxl3)!important}.mie-xxl3{margin-inline-end:var(--xxl3)!important}.p-xxl3{padding:var(--xxl3)!important}.pt-xxl3{padding-top:var(--xxl3)!important}.pb-xxl3{padding-bottom:var(--xxl3)!important}.pl-xxl3{padding-left:var(--xxl3)!important}.pr-xxl3{padding-right:var(--xxl3)!important}.pis-xxl3{padding-inline-start:var(--xxl3)!important}.pie-xxl3{padding-inline-end:var(--xxl3)!important}.w-mega1{width:var(--mega1)!important}.h-mega1{height:var(--mega1)!important}.m-mega1{margin:var(--mega1)!important}.mt-mega1{margin-top:var(--mega1)!important}.mb-mega1{margin-bottom:var(--mega1)!important}.ml-mega1{margin-left:var(--mega1)!important}.mr-mega1{margin-right:var(--mega1)!important}.mis-mega1{margin-inline-start:var(--mega1)!important}.mie-mega1{margin-inline-end:var(--mega1)!important}.p-mega1{padding:var(--mega1)!important}.pt-mega1{padding-top:var(--mega1)!important}.pb-mega1{padding-bottom:var(--mega1)!important}.pl-mega1{padding-left:var(--mega1)!important}.pr-mega1{padding-right:var(--mega1)!important}.pis-mega1{padding-inline-start:var(--mega1)!important}.pie-mega1{padding-inline-end:var(--mega1)!important}.w-mega2{width:var(--mega2)!important}.h-mega2{height:var(--mega2)!important}.m-mega2{margin:var(--mega2)!important}.mt-mega2{margin-top:var(--mega2)!important}.mb-mega2{margin-bottom:var(--mega2)!important}.ml-mega2{margin-left:var(--mega2)!important}.mr-mega2{margin-right:var(--mega2)!important}.mis-mega2{margin-inline-start:var(--mega2)!important}.mie-mega2{margin-inline-end:var(--mega2)!important}.p-mega2{padding:var(--mega2)!important}.pt-mega2{padding-top:var(--mega2)!important}.pb-mega2{padding-bottom:var(--mega2)!important}.pl-mega2{padding-left:var(--mega2)!important}.pr-mega2{padding-right:var(--mega2)!important}.pis-mega2{padding-inline-start:var(--mega2)!important}.pie-mega2{padding-inline-end:var(--mega2)!important}.w-mega3{width:var(--mega3)!important}.h-mega3{height:var(--mega3)!important}.m-mega3{margin:var(--mega3)!important}.mt-mega3{margin-top:var(--mega3)!important}.mb-mega3{margin-bottom:var(--mega3)!important}.ml-mega3{margin-left:var(--mega3)!important}.mr-mega3{margin-right:var(--mega3)!important}.mis-mega3{margin-inline-start:var(--mega3)!important}.mie-mega3{margin-inline-end:var(--mega3)!important}.p-mega3{padding:var(--mega3)!important}.pt-mega3{padding-top:var(--mega3)!important}.pb-mega3{padding-bottom:var(--mega3)!important}.pl-mega3{padding-left:var(--mega3)!important}.pr-mega3{padding-right:var(--mega3)!important}.pis-mega3{padding-inline-start:var(--mega3)!important}.pie-mega3{padding-inline-end:var(--mega3)!important}.w-giga1{width:var(--giga1)!important}.h-giga1{height:var(--giga1)!important}.m-giga1{margin:var(--giga1)!important}.mt-giga1{margin-top:var(--giga1)!important}.mb-giga1{margin-bottom:var(--giga1)!important}.ml-giga1{margin-left:var(--giga1)!important}.mr-giga1{margin-right:var(--giga1)!important}.mis-giga1{margin-inline-start:var(--giga1)!important}.mie-giga1{margin-inline-end:var(--giga1)!important}.p-giga1{padding:var(--giga1)!important}.pt-giga1{padding-top:var(--giga1)!important}.pb-giga1{padding-bottom:var(--giga1)!important}.pl-giga1{padding-left:var(--giga1)!important}.pr-giga1{padding-right:var(--giga1)!important}.pis-giga1{padding-inline-start:var(--giga1)!important}.pie-giga1{padding-inline-end:var(--giga1)!important}.w-giga2{width:var(--giga2)!important}.h-giga2{height:var(--giga2)!important}.m-giga2{margin:var(--giga2)!important}.mt-giga2{margin-top:var(--giga2)!important}.mb-giga2{margin-bottom:var(--giga2)!important}.ml-giga2{margin-left:var(--giga2)!important}.mr-giga2{margin-right:var(--giga2)!important}.mis-giga2{margin-inline-start:var(--giga2)!important}.mie-giga2{margin-inline-end:var(--giga2)!important}.p-giga2{padding:var(--giga2)!important}.pt-giga2{padding-top:var(--giga2)!important}.pb-giga2{padding-bottom:var(--giga2)!important}.pl-giga2{padding-left:var(--giga2)!important}.pr-giga2{padding-right:var(--giga2)!important}.pis-giga2{padding-inline-start:var(--giga2)!important}.pie-giga2{padding-inline-end:var(--giga2)!important}.w-giga3{width:var(--giga3)!important}.h-giga3{height:var(--giga3)!important}.m-giga3{margin:var(--giga3)!important}.mt-giga3{margin-top:var(--giga3)!important}.mb-giga3{margin-bottom:var(--giga3)!important}.ml-giga3{margin-left:var(--giga3)!important}.mr-giga3{margin-right:var(--giga3)!important}.mis-giga3{margin-inline-start:var(--giga3)!important}.mie-giga3{margin-inline-end:var(--giga3)!important}.p-giga3{padding:var(--giga3)!important}.pt-giga3{padding-top:var(--giga3)!important}.pb-giga3{padding-bottom:var(--giga3)!important}.pl-giga3{padding-left:var(--giga3)!important}.pr-giga3{padding-right:var(--giga3)!important}.pis-giga3{padding-inline-start:var(--giga3)!important}.pie-giga3{padding-inline-end:var(--giga3)!important}.w-tera1{width:var(--tera1)!important}.h-tera1{height:var(--tera1)!important}.m-tera1{margin:var(--tera1)!important}.mt-tera1{margin-top:var(--tera1)!important}.mb-tera1{margin-bottom:var(--tera1)!important}.ml-tera1{margin-left:var(--tera1)!important}.mr-tera1{margin-right:var(--tera1)!important}.mis-tera1{margin-inline-start:var(--tera1)!important}.mie-tera1{margin-inline-end:var(--tera1)!important}.p-tera1{padding:var(--tera1)!important}.pt-tera1{padding-top:var(--tera1)!important}.pb-tera1{padding-bottom:var(--tera1)!important}.pl-tera1{padding-left:var(--tera1)!important}.pr-tera1{padding-right:var(--tera1)!important}.pis-tera1{padding-inline-start:var(--tera1)!important}.pie-tera1{padding-inline-end:var(--tera1)!important}.w-tera2{width:var(--tera2)!important}.h-tera2{height:var(--tera2)!important}.m-tera2{margin:var(--tera2)!important}.mt-tera2{margin-top:var(--tera2)!important}.mb-tera2{margin-bottom:var(--tera2)!important}.ml-tera2{margin-left:var(--tera2)!important}.mr-tera2{margin-right:var(--tera2)!important}.mis-tera2{margin-inline-start:var(--tera2)!important}.mie-tera2{margin-inline-end:var(--tera2)!important}.p-tera2{padding:var(--tera2)!important}.pt-tera2{padding-top:var(--tera2)!important}.pb-tera2{padding-bottom:var(--tera2)!important}.pl-tera2{padding-left:var(--tera2)!important}.pr-tera2{padding-right:var(--tera2)!important}.pis-tera2{padding-inline-start:var(--tera2)!important}.pie-tera2{padding-inline-end:var(--tera2)!important}.w-tera3{width:var(--tera3)!important}.h-tera3{height:var(--tera3)!important}.m-tera3{margin:var(--tera3)!important}.mt-tera3{margin-top:var(--tera3)!important}.mb-tera3{margin-bottom:var(--tera3)!important}.ml-tera3{margin-left:var(--tera3)!important}.mr-tera3{margin-right:var(--tera3)!important}.mis-tera3{margin-inline-start:var(--tera3)!important}.mie-tera3{margin-inline-end:var(--tera3)!important}.p-tera3{padding:var(--tera3)!important}.pt-tera3{padding-top:var(--tera3)!important}.pb-tera3{padding-bottom:var(--tera3)!important}.pl-tera3{padding-left:var(--tera3)!important}.pr-tera3{padding-right:var(--tera3)!important}.pis-tera3{padding-inline-start:var(--tera3)!important}.pie-tera3{padding-inline-end:var(--tera3)!important}}@layer helpers{.font-text{font-family:var(--text)!important}.font-display{font-family:var(--display)!important}.font-mono{font-family:var(--mono)!important}.font-italic{font-style:italic!important}.font-normal{font-style:normal!important}.font-extra-light{font-weight:var(--extra-light)!important}.font-light{font-weight:var(--light)!important}.font-book{font-weight:var(--book)!important}.font-semi-bold{font-weight:var(--semi-bold)!important}.font-bold{font-weight:var(--bold)!important}.font-black{font-weight:var(--black)!important}.text-xs{font-size:var(--text-xs)!important}.text-sm{font-size:var(--text-sm)!important}.text-md{font-size:var(--text-md)!important}.text-lg{font-size:var(--text-lg)!important}.text-xl{font-size:var(--text-xl)!important}.display-sm{font-size:var(--display-sm)!important}.display-md{font-size:var(--display-md)!important}.display-lg{font-size:var(--display-lg)!important}.display-xl{font-size:var(--display-xl)!important}.display-mega{font-size:var(--display-mega)!important}.display-giga{font-size:var(--display-giga)!important}.tracking-sm{letter-spacing:var(--tracking-sm)!important}.tracking-md{letter-spacing:var(--tracking-md)!important}.tracking-lg{letter-spacing:var(--tracking-lg)!important}.tracking-xl{letter-spacing:var(--tracking-xl)!important}.tracking-xxl{letter-spacing:var(--tracking-xxl)!important}.leading-xs{line-height:var(--leading-xs)!important}.leading-sm{line-height:var(--leading-sm)!important}.leading-md{line-height:var(--leading-md)!important}.leading-lg{line-height:var(--leading-lg)!important}.leading-xl{line-height:var(--leading-xl)!important}.leading-xxl{line-height:var(--leading-xxl)!important}.text-left{text-align:left!important}.text-center{text-align:center!important}.text-right{text-align:right!important}.text-justify{text-align:justify!important}.text-start{text-align:start!important}.text-end{text-align:end!important}.text-uppercase{text-transform:uppercase!important}.text-lowercase{text-transform:lowercase!important}.text-capitalize{text-transform:capitalize!important}}
diff --git a/src/components/Card.astro b/src/components/Card.astro
index 1c85ef67..b9988071 100644
--- a/src/components/Card.astro
+++ b/src/components/Card.astro
@@ -8,7 +8,7 @@ import Tags from './Tags.astro';
 // Define badge type for multiple badges with customizable colors
 interface Badge {
   label: string;
-  color?: string; // CSS color value ('#fff', 'white') or token name ('--yes-500')
+  color?: string; // '#fff', 'white', or token ('--yes-500')
 }
 
 // Props definitions
@@ -45,7 +45,7 @@ const {
   headingLevel = 2,
   imageSrc,
   imageAlt = '',
-  aspectRatio = 'golden',
+  aspectRatio,
   flushImage = false,
   badges = [],
   tags = [],
@@ -62,7 +62,7 @@ const {
 // Badge colors accept a raw CSS color or a token name ('--yes-500')
 const badgeColor = (color?: string) => (color ? (color.startsWith('--') ? `var(${color})` : color) : undefined);
 
-// Map aspect ratio to CSS value
+// Map aspect ratio to CSS value. Overrides --card-aspect-ratio default
 const aspectRatioMap = {
   widescreen: 'var(--ar-widescreen)',
   landscape: 'var(--ar-landscape)',
@@ -70,13 +70,11 @@ const aspectRatioMap = {
   square: 'var(--ar-square)',
   golden: 'var(--ar-golden)',
 };
-const aspectRatioValue = aspectRatioMap[aspectRatio];
+const aspectRatioValue = aspectRatio && aspectRatioMap[aspectRatio];
 
 const Heading = `h${headingLevel}` as const;
 
-// The whole card is clickable through one stretched .card_link. When there is
-// a title, the title anchor carries it so its text names the link; otherwise
-// an empty labelled anchor takes over.
+// The whole card is clickable through one stretched .card_link.
 const linked = href && !isDisabled;
 const titleLink = linked && title;
 const overlayLink = linked && !title;
@@ -95,7 +93,7 @@ const dateTime = date && date.toISOString().split('T')[0];
     },
     className,
   ]}
-  style={`--card-aspect-ratio: ${aspectRatioValue};`}
+  style={aspectRatioValue ? `--card-aspect-ratio: ${aspectRatioValue};` : undefined}
   data-testid={testId}
   aria-disabled={isDisabled ? 'true' : undefined}
   {...rest}>
diff --git a/src/content/components/card.mdx b/src/content/components/card.mdx
index 363418bc..c5584e44 100644
--- a/src/content/components/card.mdx
+++ b/src/content/components/card.mdx
@@ -301,28 +301,28 @@ Every part is optional; render only what you pass. Badges and tags can coexist,
 
 <div class="docs_oversizedTable prose">
 
-| Prop           | Type                      | Default        | Description                                                         |
-| -------------- | ------------------------- | -------------- | ------------------------------------------------------------------- |
-| `variant`      | `string`                  | undefined      | Card’s visual style: `filled`, `raised`.                            |
-| `isDisabled`   | `boolean`                 | `false`        | Disabled style. Disabled interactions.                              |
-| `isLoading`    | `boolean`                 | `false`        | Loading state with skeleton UI.                                     |
-| `href`         | `string`                  | undefined      | Makes the whole card clickable (through the title link, if any).    |
-| `title`        | `string`                  | undefined      | Header title text.                                                  |
-| `subtitle`     | `string`                  | undefined      | Header subtitle text.                                               |
-| `headingLevel` | `number`                  | `2`            | Heading level of the title: `2`, `3`, or `4`.                       |
-| `imageSrc`     | `ImageMetadata \| string` | undefined      | Add an image to the card (imported asset or URL/path).              |
-| `imageAlt`     | `string`                  | `''`           | Alt text for the image.                                             |
-| `aspectRatio`  | `string`                  | `golden`       | Image aspect ratio (available [aspect ratios][ar]).                 |
-| `flushImage`   | `boolean`                 | `false`        | Edge-to-edge image on top of the card instead of inset.             |
-| `badges`       | `array`                   | `[]`           | Array of objects (see example below).                               |
-| `tags`         | `string[]`                | `[]`           | Tag names, rendered with the Tags component.                        |
-| `tagsUrl`      | `string`                  | `'/blog/tags'` | Base URL for tag links.                                             |
-| `author`       | `string`                  | undefined      | Byline name (also feeds the Avatar initials).                       |
-| `avatarSrc`    | `ImageMetadata \| string` | undefined      | Byline avatar image.                                                |
-| `date`         | `Date`                    | undefined      | Publication date, rendered as a `<time>` in the byline.             |
-| `locale`       | `string`                  | `'en-US'`      | Locale for the formatted date.                                      |
-| `data-testid`  | `string`                  | `'card'`       | Test ID for testing frameworks.                                     |
-| `class`        | `string`                  | undefined      | Additional CSS classes, useful for [helper classes](/docs/helpers). |
+| Prop           | Type                      | Default        | Description                                                                                                         |
+| -------------- | ------------------------- | -------------- | ------------------------------------------------------------------------------------------------------------------- |
+| `variant`      | `string`                  | undefined      | Card’s visual style: `filled`, `raised`.                                                                            |
+| `isDisabled`   | `boolean`                 | `false`        | Disabled style. Disabled interactions.                                                                              |
+| `isLoading`    | `boolean`                 | `false`        | Loading state with skeleton UI.                                                                                     |
+| `href`         | `string`                  | undefined      | Makes the whole card clickable (through the title link, if any).                                                    |
+| `title`        | `string`                  | undefined      | Header title text.                                                                                                  |
+| `subtitle`     | `string`                  | undefined      | Header subtitle text.                                                                                               |
+| `headingLevel` | `number`                  | `2`            | Heading level of the title: `2`, `3`, or `4`.                                                                       |
+| `imageSrc`     | `ImageMetadata \| string` | undefined      | Add an image to the card (imported asset or URL/path).                                                              |
+| `imageAlt`     | `string`                  | `''`           | Alt text for the image.                                                                                             |
+| `aspectRatio`  | `string`                  | undefined      | Image aspect ratio (available [aspect ratios][ar]); unset, the `--card-aspect-ratio` token applies (golden ratio). |
+| `flushImage`   | `boolean`                 | `false`        | Edge-to-edge image on top of the card instead of inset.                                                             |
+| `badges`       | `array`                   | `[]`           | Array of objects (see example below).                                                                               |
+| `tags`         | `string[]`                | `[]`           | Tag names, rendered with the Tags component.                                                                        |
+| `tagsUrl`      | `string`                  | `'/blog/tags'` | Base URL for tag links.                                                                                             |
+| `author`       | `string`                  | undefined      | Byline name (also feeds the Avatar initials).                                                                       |
+| `avatarSrc`    | `ImageMetadata \| string` | undefined      | Byline avatar image.                                                                                                |
+| `date`         | `Date`                    | undefined      | Publication date, rendered as a `<time>` in the byline.                                                             |
+| `locale`       | `string`                  | `'en-US'`      | Locale for the formatted date.                                                                                      |
+| `data-testid`  | `string`                  | `'card'`       | Test ID for testing frameworks.                                                                                     |
+| `class`        | `string`                  | undefined      | Additional CSS classes, useful for [helper classes](/docs/helpers).                                                 |
 
 [ar]: /docs/tokens#aspect-ratio
 
@@ -596,7 +596,7 @@ import Card from '../../components/Card.astro';
 </div>
 
 ```html
-<article class="card card-raised" style="--card-aspect-ratio: var(--ar-golden)">
+<article class="card card-raised">
   <header class="card_header">
     <div class="card_header_text">
       <h2 class="card_title">
diff --git a/src/content/docs/ai.mdx b/src/content/docs/ai.mdx
index d745d525..20a60004 100644
--- a/src/content/docs/ai.mdx
+++ b/src/content/docs/ai.mdx
@@ -64,7 +64,7 @@ Do not edit framework files.
 ### Tokens
 
 - `settings.tokens.css`: raw primitives (palettes, type scale, spacing, radii).
-- `settings.ui.css`: interface tokens, the public API of every component (semantic aliases plus all component defaults). Interface tokens only ever take another token as value; raw values live in `settings.tokens.css`.
+- `settings.ui.css`: interface tokens, the public API of every element and component (semantic aliases plus all defaults). Placement is by name: a token named for what it's for (`--heading-*`, `--bt-*`, `--ui-border-color`) goes here; a token named for what it is (`--sm1`, `--base-500`) is a scale token and goes in `settings.tokens.css`. Values prefer another token (a shared-meaning interface token first, else a scale token); raw values only for content (strings, icon URLs), one-off control geometry, or element-relative `em`/`ch` measures.
 - Grammar: `--component-part-property`, longhand, kebab-case, no abbreviations: `--bt-background-color-hover`, `--notice-border-width`.
 - Feedback colors: use the semantic aliases `--success-*`, `--danger-*`, `--warning-*`, not the raw scales they point at.
 - The same discipline applies to your own CSS: **no raw color and no raw type size in a `component.*.css` file.** If the theme doesn't name the value you need, add a token to the theme and use that. A `#8a5500` or a `1.0625rem` sitting in a component is a design decision nobody can find, and the second use of it will be a slightly different number.
diff --git a/src/content/docs/elements.mdx b/src/content/docs/elements.mdx
index 5486311b..72a8b35e 100644
--- a/src/content/docs/elements.mdx
+++ b/src/content/docs/elements.mdx
@@ -49,7 +49,20 @@ import iconX from '../../assets/icons/x.svg?raw';
 
   ### Headings
 
-  Heading sizes are fluid: they scale smoothly between a mobile minimum and a desktop maximum via the `--heading-1`…`--heading-6` tokens (see [tokens](/docs/tokens)). Resize the viewport to see it in action.
+  Heading sizes are fluid via `clamp()` set on `--heading-font-size-h1`—`--heading-font-size-h6` tokens: each interpolates from a minimum size (at 480px viewports and below) to a maximum (from 1024px up), so the type scale tightens on small screens without media queries. The preferred value mixes `rem` with `vw`, which keeps browser text zoom working. The tokens live in `settings.ui.css` with the rest of the heading family (`--heading-spacing-*`, `--heading-line-height-*`), mapping each level onto the [type scale](/docs/tokens#font-size); override any of them in your theme to change how a heading level scales.
+
+<div class="docs_oversizedTable">
+
+| Token                  | Min (≤480px)            | Max (≥1024px)           |
+| ---------------------- | ----------------------- | ----------------------- |
+| `heading-font-size-h1` | `display-md` (2.074rem) | `display-xl` (2.986rem) |
+| `heading-font-size-h2` | `display-sm` (1.728rem) | `display-lg` (2.488rem) |
+| `heading-font-size-h3` | `text-xl` (1.44rem)     | `display-md` (2.074rem) |
+| `heading-font-size-h4` | `text-lg` (1.2rem)      | `display-sm` (1.728rem) |
+| `heading-font-size-h5` | `text-lg` (1.2rem)      | `text-xl` (1.44rem)     |
+| `heading-font-size-h6` | `text-md` (1rem)        | `text-lg` (1.2rem)      |
+
+</div>
 
   <h1>Heading One</h1>
   <p>A small paragraph of text to show the heading in context.</p>
@@ -65,9 +78,9 @@ import iconX from '../../assets/icons/x.svg?raw';
   <p>A small paragraph of text to show the heading in context.</p>
 
   <h1>Consecutive headings get less margin… H1 followed by a H2</h1>
-  <h2>H2 right aftert a H1</h2>
-  <h3>H3 right aftert a H2</h3>
-  <h4>H4 right aftert a H3</h4>
+  <h2>H2 right after a H1</h2>
+  <h3>H3 right after a H2</h3>
+  <h4 class="mb-lg1">H4 right after a H3</h4>
 
   ### Inline Elements
 
diff --git a/src/content/docs/global.mdx b/src/content/docs/global.mdx
index 5933a055..ff37b87f 100644
--- a/src/content/docs/global.mdx
+++ b/src/content/docs/global.mdx
@@ -144,7 +144,7 @@ The following example goes from 1 → 4 → 9 → 12 columns. (Resize window to
 
 The `.wrap` global class is a simple content wrapper that will center your content on the page and add some left/right padding on small viewports.
 
-The content column comes in three width presets, set with a modifier on the wrapper: `.wrap-sm`, `.wrap-md`, and `.wrap-lg`. A bare `.wrap` uses the `md` width (`minmax(200px, 70ch)`). There is also a `.wrap_content-fullBleed` modifier for children that should extend to the full size of the viewport. See [demo](/demos/wrap).
+The content column comes in three width presets, set with a modifier on the wrapper: `.wrap-sm`, `.wrap-md`, and `.wrap-lg`. A bare `.wrap` uses the `md` width (`minmax(0, 70ch)`). There is also a `.wrap_content-fullBleed` modifier for children that should extend to the full size of the viewport. See [demo](/demos/wrap).
 
 ### Syntax
 
@@ -179,9 +179,9 @@ You can customize 3 diffent sizes of left/right padding for responsive designs a
 | `wrap-spacing`    | `var(--sm1)`           | default left/right padding       |
 | `wrap-md-spacing` | `var(--sm3)`           | left/right padding tablet and up |
 | `wrap-lg-spacing` | `0`                    | left/right padding laptop and up |
-| `wrap-width-sm`   | `minmax(200px, 55ch)`  | narrow column (`.wrap-sm`)       |
-| `wrap-width-md`   | `minmax(200px, 70ch)`  | reading column (`.wrap-md`)      |
-| `wrap-width-lg`   | `minmax(200px, 900px)` | wide column (`.wrap-lg`)         |
+| `wrap-width-sm`   | `minmax(0, 55ch)`      | narrow column (`.wrap-sm`)       |
+| `wrap-width-md`   | `minmax(0, 70ch)`      | reading column (`.wrap-md`)      |
+| `wrap-width-lg`   | `minmax(0, 900px)`     | wide column (`.wrap-lg`)         |
 | `wrap-width`      | `var(--wrap-width-md)` | width of a bare `.wrap`          |
 
 </div>
@@ -227,12 +227,24 @@ The header and footer are optional: a bare `.layout` with only `.layout_content`
 Each thumbnail links to a full-page demo built from labeled color blocks. The demos are the honest version: resize the window to see the breakpoint collapses, sticky footer, and full-viewport behavior that a static diagram can't show.
 
 <div class="grid" col="2" col-lg="3">
-  <div class="grid_item"><LayoutThumb variant="centered" /></div>
-  <div class="grid_item"><LayoutThumb variant="sidebar" /></div>
-  <div class="grid_item"><LayoutThumb variant="sidebar-end" /></div>
-  <div class="grid_item"><LayoutThumb variant="docs" /></div>
-  <div class="grid_item"><LayoutThumb variant="split" /></div>
-  <div class="grid_item"><LayoutThumb variant="cover" /></div>
+  <div class="grid_item">
+    <LayoutThumb variant="centered" />
+  </div>
+  <div class="grid_item">
+    <LayoutThumb variant="sidebar" />
+  </div>
+  <div class="grid_item">
+    <LayoutThumb variant="sidebar-end" />
+  </div>
+  <div class="grid_item">
+    <LayoutThumb variant="docs" />
+  </div>
+  <div class="grid_item">
+    <LayoutThumb variant="split" />
+  </div>
+  <div class="grid_item">
+    <LayoutThumb variant="cover" />
+  </div>
 </div>
 
 <div class="docs_oversizedTable">
@@ -252,8 +264,8 @@ Each thumbnail links to a full-page demo built from labeled color blocks. The de
 <Notice type="info" title="Hidden asides need a menu">
   `.layout-docs` hides both asides below the `--md` breakpoint. That's
   deliberate: docs navigation belongs in your header menu on small screens
-  (that's how mcss.dev does it). If your aside content has no other way in,
-  use `.layout-sidebar`, which stacks instead of hiding.
+  (that's how mcss.dev does it). If your aside content has no other way in, use
+  `.layout-sidebar`, which stacks instead of hiding.
 </Notice>
 
 ### The main column is a container
@@ -266,11 +278,11 @@ Column widths come from three tokens in `settings.ui.css`. `--layout-toc-width`
 
 <div class="docs_oversizedTable">
 
-| token                    | value   | Description                                                |
-| ------------------------ | ------- | ---------------------------------------------------------- |
-| `--layout-content-width` | `70ch`  | main column cap (`.layout-centered`, `.layout-docs`)       |
-| `--layout-aside-width`   | `245px` | aside column (`.layout-sidebar`, `.layout-docs`)           |
-| `--layout-toc-width`     | `1fr`   | TOC column (`.layout-docs`)                                |
+| token                    | value   | Description                                          |
+| ------------------------ | ------- | ---------------------------------------------------- |
+| `--layout-content-width` | `70ch`  | main column cap (`.layout-centered`, `.layout-docs`) |
+| `--layout-aside-width`   | `245px` | aside column (`.layout-sidebar`, `.layout-docs`)     |
+| `--layout-toc-width`     | `1fr`   | TOC column (`.layout-docs`)                          |
 
 </div>
 
diff --git a/src/content/docs/themes.mdx b/src/content/docs/themes.mdx
index 6c2a5bc2..bf2442d0 100644
--- a/src/content/docs/themes.mdx
+++ b/src/content/docs/themes.mdx
@@ -50,7 +50,7 @@ The `theme` layer sits after `components` and before `helpers`, so a theme beats
 Themes work because of the two token tiers below them:
 
 1. **Raw tokens** (`settings.tokens.css`) hold raw values: palettes, type scale, spacing, etc.
-2. **[Interface tokens](/docs/tokens#interface-tokens)** (`settings.ui.css`) map those primitives onto meaning: semantic aliases like `--ui-border-color`, plus every component's token defaults (`--bt-*`, `--card-*`, ...). Interface tokens only ever take another token for value.
+2. **[Interface tokens](/docs/tokens#interface-tokens)** (`settings.ui.css`) map those primitives onto meaning: semantic aliases like `--ui-border-color`, element defaults (`--heading-*`, `--input-*`, ...), plus every component's token defaults (`--bt-*`, `--card-*`, ...). Interface tokens usually take another token for value; raw values appear only where following the scales would be wrong (content, one-off control geometry, `em`-relative measures).
 
 Because components read `var(--ui-border-color)` instead of a raw hex, a theme gets three levels of blast radius from a single override:
 
diff --git a/src/content/docs/tokens.mdx b/src/content/docs/tokens.mdx
index d9a9185b..9d8e2143 100644
--- a/src/content/docs/tokens.mdx
+++ b/src/content/docs/tokens.mdx
@@ -37,15 +37,17 @@ The same discipline applies to the CSS you write on top of the framework: **no r
 
 <div class="docs_oversizedTable">
 
-| File name         | Source            |
-| ----------------- | ----------------- |
-| `settings.ui.css` | [Github][srcUi]   |
+| File name         | Source          |
+| ----------------- | --------------- |
+| `settings.ui.css` | [Github][srcUi] |
 
 </div>
 
 [srcUi]: https://github.com/minimaldesign/mCSS/blob/main/src/styles/framework/settings.ui.css
 
-Interface tokens offer an additional layer of abstraction over the raw tokens. They only ever take another token for value and standardize UI decisions in logical groups: semantic aliases like `--ui-border-color` (with a value of `--base-200`) or `--success-*`, plus every component's token defaults (`--bt-*`, `--card-*`, ...). This gives tokens meaning and context, which makes them more intuitive to use, and it's what makes [themes](/docs/themes) powerful: override one interface token and every rule that consumes it follows.
+Interface tokens are the decisions layer over the raw scales. Every one is named for what it's _for_ (an element, a component, or a shared meaning) and standardizes UI decisions in logical groups: semantic aliases like `--ui-border-color` or `--success-*`, element defaults (`--heading-*`, `--input-*`, ...), plus every component's token defaults (`--bt-*`, `--card-*`, ...). That naming is the whole split between the two files: a token named for what it _is_ (a step on a scale, like `--sm1` or `--base-500`) lives in `settings.tokens.css`; a token named for what it's _for_ lives in `settings.ui.css`. This gives tokens meaning and context, and it's what makes [themes](/docs/themes) powerful: override one interface token and every rule that consumes it follows.
+
+An interface token usually takes another token for value: another interface token when the meaning is shared (`--input-border-color` is `--ui-border-color`), or a scale token when the value should follow the system scales (`--fieldset-padding` is `--sm3`). A raw value is correct only where following the scales would be wrong: content like separator strings and icon URLs, geometry tuned to one control (`--toggle-width`), and element-relative measures like the `em` heading spacing, which tracks each heading's own size instead of the page scale. The test: if a theme retuned the scales, should this value follow?
 
 `elements.*` and `global.*` files tend to use interface tokens, while `component.*` files mix them with low level tokens. There are no hard and fast rules about the type of token you should use in your custom component. Just try to think where else this style is used in the design and if it comes up in many places with the same context, a new interface token is probably the best option.
 
@@ -116,7 +118,7 @@ Check out [tints.dev](https://www.tints.dev) if you want to make your own palett
 | `maybe-400` | #ffc220 | <div class="docs_box bgc-maybe-400"></div> |
 | `maybe-500` | #f9a007 | <div class="docs_box bgc-maybe-500"></div> |
 
-  ### Highlight
+### Highlight
 
 The text marker color, consumed by the `--marker-color` interface token (what `<mark>` uses). Override `--highlight-500` in a theme to restyle every highlight.
 
@@ -193,11 +195,11 @@ Dimension tokens can be used anywhere you need to set `margin`, `padding`, `widt
 
 There are 3 font stacks set up by default for the `font-family` CSS Property.
 
-| Token       | Value                                                                                                                                                           |
-| ----------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `text`      | ui-sans-serif, system-ui, sans-serif                                                                                                                            |
-| `display`   | Avenir, Montserrat, Corbel, URW Gothic, source-sans-pro, ui-sans-serif, sans-serif                                                                              |
-| `mono`      | Dank Mono, Inconsolata, Fira Mono, SF Mono, Monaco, Droid Sans Mono, Source Code Pro, Cascadia Code, Menlo, Consolas, DejaVu Sans Mono, ui-monospace, monospace |
+| Token     | Value                                                                                                                                                           |
+| --------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `text`    | ui-sans-serif, system-ui, sans-serif                                                                                                                            |
+| `display` | Avenir, Montserrat, Corbel, URW Gothic, source-sans-pro, ui-sans-serif, sans-serif                                                                              |
+| `mono`    | Dank Mono, Inconsolata, Fira Mono, SF Mono, Monaco, Droid Sans Mono, Source Code Pro, Cascadia Code, Menlo, Consolas, DejaVu Sans Mono, ui-monospace, monospace |
 
 These stacks are optimized for fonts available on device, to maximize for speed and alleviate any layout shifts or flashes. You can find more stacks at [Modern Font Stacks](https://modernfontstacks.com).
 
@@ -231,27 +233,12 @@ Check out [typescale.com ](https://typescale.com) if you need help creating your
 
 </div>
 
-### Heading sizes
-
-Headings use dedicated fluid tokens: each `--heading-*` interpolates with `clamp()` from a minimum size (at 480px viewports and below) to a maximum size (from 1024px up), so the type scale tightens on small screens without media queries. The preferred value mixes `rem` with `vw`, which keeps browser text zoom working. Override any of these in your own theme to change how a heading level scales.
-
-<div class="docs_oversizedTable">
-
-| Token       | Min (≤480px)         | Max (≥1024px)           |
-| ----------- | -------------------- | ----------------------- |
-| `heading-1` | `display-md` (2.074rem) | `display-xl` (2.986rem) |
-| `heading-2` | `display-sm` (1.728rem) | `display-lg` (2.488rem) |
-| `heading-3` | `text-xl` (1.44rem)     | `display-md` (2.074rem) |
-| `heading-4` | `text-lg` (1.2rem)      | `display-sm` (1.728rem) |
-| `heading-5` | `text-lg` (1.2rem)      | `text-xl` (1.44rem)     |
-| `heading-6` | `text-md` (1rem)        | `text-lg` (1.2rem)      |
-
-</div>
+The heading font sizes (`--heading-font-size-h1`…`-h6`) build on this scale but are [interface tokens](#interface-tokens); they're documented with [the headings themselves](/docs/elements#headings).
 
 ### Font weight
 
-| Token         | Value | Demo                                            |
-| ------------- | ----- | ----------------------------------------------- |
+| Token         | Value | Demo                                                 |
+| ------------- | ----- | ---------------------------------------------------- |
 | `extra-light` | 200   | <div class="font-extra-light">Sample demo text</div> |
 | `light`       | 300   | <div class="font-light">Sample demo text</div>       |
 | `book`        | 400   | <div class="font-book">Sample demo text</div>        |
diff --git a/src/styles/framework/elements.form.css b/src/styles/framework/elements.form.css
index d9ea2112..ead2017d 100644
--- a/src/styles/framework/elements.form.css
+++ b/src/styles/framework/elements.form.css
@@ -21,9 +21,9 @@ datalist {
 }
 
 fieldset {
-  border: 1px solid var(--ui-border-color);
-  border-radius: var(--radius-lg);
-  padding: var(--sm3);
+  border: var(--fieldset-border-width) solid var(--fieldset-border-color);
+  border-radius: var(--fieldset-border-radius);
+  padding: var(--fieldset-padding);
 
   ul:has([type="checkbox"], [type="radio"]) {
     padding-inline-start: 0;
@@ -55,7 +55,7 @@ input {
     border-radius: var(--input-border-radius);
   }
   &:where(:not([type="file"])) {
-    border: 1px solid var(--ui-border-color);
+    border: var(--input-border-width) solid var(--input-border-color);
   }
   &[type="file"] {
     width: 100%;
@@ -69,7 +69,7 @@ input {
 label {
   display: block;
   &:has(+ :is(input, select, textarea)) {
-    margin-bottom: var(--xs1);
+    margin-bottom: var(--label-spacing);
   }
 }
 
@@ -86,19 +86,13 @@ legend {
 }
 
 meter {
-  --meter-height: var(--sm1);
-  --meter-radius: var(--radius-md);
-  --meter-color-track: var(--primary-100);
-  --meter-color-low: var(--no-400);
-  --meter-color-med: var(--maybe-400);
-  --meter-color-high: var(--yes-400);
   width: 100%;
-  background: var(--meter-color-track);
-  border-radius: var(--meter-radius);
+  background: var(--meter-track-color);
+  border-radius: var(--meter-border-radius);
   height: var(--meter-height);
   /* webkit */
   &::-webkit-meter-bar {
-    background: var(--meter-color-track);
+    background: var(--meter-track-color);
   }
   &::-webkit-meter-bar,
   &::-webkit-meter-optimum-value,
@@ -106,26 +100,26 @@ meter {
   &::-webkit-meter-even-less-good-value {
     height: var(--meter-height);
     border: none;
-    border-radius: var(--meter-radius);
+    border-radius: var(--meter-border-radius);
   }
   &::-webkit-meter-even-less-good-value {
-    background: var(--meter-color-low);
+    background: var(--meter-low-color);
   }
   &::-webkit-meter-suboptimum-value {
-    background: var(--meter-color-med);
+    background: var(--meter-medium-color);
   }
   &::-webkit-meter-optimum-value {
-    background: var(--meter-color-high);
+    background: var(--meter-high-color);
   }
   /* mozilla */
   &:-moz-meter-sub-sub-optimum::-moz-meter-bar {
-    background: var(--meter-color-low);
+    background: var(--meter-low-color);
   }
   &:-moz-meter-sub-optimum::-moz-meter-bar {
-    background: var(--meter-color-med);
+    background: var(--meter-medium-color);
   }
   &:-moz-meter-optimum::-moz-meter-bar {
-    background: var(--meter-color-high);
+    background: var(--meter-high-color);
   }
 }
 
@@ -139,43 +133,39 @@ output {
 }
 
 progress {
-  --progress-height: var(--sm1);
-  --progress-color: var(--primary-500);
-  --progress-track-color: var(--primary-100);
-  --progress-radius: var(--radius-md);
   appearance: none;
   width: 100%;
   /* mozilla */
   height: var(--progress-height);
   background: var(--progress-track-color);
-  border-radius: var(--progress-radius);
+  border-radius: var(--progress-border-radius);
   border: none;
   &::-moz-progress-bar {
     background: var(--progress-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
   }
   /* webkit */
   &::-webkit-progress-bar {
     width: 100%;
     background: var(--progress-track-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
     height: var(--progress-height);
   }
   &::-webkit-progress-value {
     background: var(--progress-color);
-    border-radius: var(--progress-radius);
+    border-radius: var(--progress-border-radius);
   }
 }
 
 select {
-  --icon-size: 24px;
-  --split: calc(100% - var(--icon-size));
+  /* derived, stays local */
+  --split: calc(100% - var(--select-icon-size));
   display: flex;
   appearance: none;
   height: var(--input-height);
   padding: var(--xs1) calc(var(--input-padding) + var(--md1)) var(--xs1)
     var(--input-padding);
-  border: 1px solid var(--ui-border-color);
+  border: var(--input-border-width) solid var(--input-border-color);
   border-radius: var(--input-border-radius);
   background: linear-gradient(
     to right,
@@ -183,10 +173,10 @@ select {
     var(--text-color) var(--split) 100%
   );
   mask-image:
-    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E"),
+    var(--select-icon),
     linear-gradient(to right, transparent calc(var(--split) - 1px), red 0),
     linear-gradient(red 0 0);
-  mask-size: var(--icon-size), auto, auto;
+  mask-size: var(--select-icon-size), auto, auto;
   mask-position:
     calc(100% - var(--xs1)) center,
     0 0,
@@ -222,9 +212,9 @@ select {
 
 textarea {
   width: 100%;
-  padding: var(--xs3);
+  padding: var(--input-padding);
   border-radius: var(--input-border-radius);
-  border: 1px solid var(--ui-border-color);
+  border: var(--input-border-width) solid var(--input-border-color);
   resize: block;
   &:not([rows]) {
     min-height: 6em;
diff --git a/src/styles/framework/elements.interactive.css b/src/styles/framework/elements.interactive.css
index e8a40371..d603a344 100644
--- a/src/styles/framework/elements.interactive.css
+++ b/src/styles/framework/elements.interactive.css
@@ -3,12 +3,12 @@
 dialog {
   /* body scrolling is stopped by adding .body-is-locked on <dialog> */
   /* But it can be added to any element. See elements.sectioning.css > body { … }  */
-  min-width: var(--tera1);
-  max-width: var(--tera3);
-  padding: var(--lg1) var(--md1);
-  border: 1px solid light-dark(var(--base-200), var(--base-800));
-  background-color: light-dark(var(--base-50), var(--base-900));
-  border-radius: var(--radius-lg);
+  min-width: var(--dialog-min-width);
+  max-width: var(--dialog-max-width);
+  padding: var(--dialog-padding);
+  border: var(--dialog-border-width) solid var(--dialog-border-color);
+  background-color: var(--dialog-background-color);
+  border-radius: var(--dialog-border-radius);
 
   &::backdrop {
     background: var(--dialog-backdrop-color);
@@ -18,7 +18,9 @@ dialog {
   [aria-label="close pop-up"] {
     position: absolute;
     top: var(--xs3);
-    right: var(--xs3); /* deliberately physical: close button pinned to a visual corner */
+    right: var(
+      --xs3
+    ); /* deliberately physical: close button pinned to a visual corner */
     background: transparent;
     border: none;
     outline: none;
@@ -32,10 +34,10 @@ dialog {
 }
 
 details {
-  padding: var(--sm1) var(--sm1);
-  border: 1px solid light-dark(var(--base-200), var(--base-800));
-  background-color: light-dark(var(--base-50), var(--base-900));
-  border-radius: var(--radius-lg);
+  padding: var(--details-padding);
+  border: var(--details-border-width) solid var(--details-border-color);
+  background-color: var(--details-background-color);
+  border-radius: var(--details-border-radius);
   cursor: pointer;
 
   summary {
@@ -47,15 +49,21 @@ details {
     }
     &::after {
       content: "";
-      width: 24px;
-      height: 24px;
-      background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E") no-repeat;
-      transition: var(--transition);
+      width: var(--details-icon-size);
+      height: var(--details-icon-size);
+      /* icon as a mask painted with the text color, so it follows the
+         color scheme (an SVG in background-image can't see currentColor
+         and always renders black) */
+      background-color: currentColor;
+      mask-image: var(--details-icon);
+      mask-size: contain;
+      mask-repeat: no-repeat;
+      transition: transform var(--transition);
     }
   }
 
   &[open] > summary {
-    margin-bottom: var(--xs3);
+    margin-bottom: var(--details-spacing);
     &::after {
       transform: rotate(180deg);
     }
diff --git a/src/styles/framework/elements.media.css b/src/styles/framework/elements.media.css
index 7f5cad9d..b1a39804 100644
--- a/src/styles/framework/elements.media.css
+++ b/src/styles/framework/elements.media.css
@@ -43,18 +43,18 @@ figure {
   /* caption at bottom or top */
   &:has(* + figcaption) {
     figcaption {
-      margin-top: var(--xs2);
+      margin-top: var(--figcaption-spacing);
     }
   }
   &:has(figcaption + *) {
     figcaption {
-      margin-bottom: var(--xs2);
+      margin-bottom: var(--figcaption-spacing);
     }
   }
 }
 
 iframe {
-  border: 1px solid var(--ui-border-color);
+  border: var(--border-sm) solid var(--ui-border-color);
 }
 
 img {
diff --git a/src/styles/framework/elements.sectioning.css b/src/styles/framework/elements.sectioning.css
index e884f7a1..85b82aee 100644
--- a/src/styles/framework/elements.sectioning.css
+++ b/src/styles/framework/elements.sectioning.css
@@ -9,7 +9,7 @@ body {
   background-color: var(--body-background-color);
   color: var(--text-color);
   font-family: var(--text);
-  line-height: 1.5;
+  line-height: var(--body-line-height);
 
   /* for elements like dialog etc. that require scrolling turned off */
   &:has(.body-is-locked) {
diff --git a/src/styles/framework/elements.table.css b/src/styles/framework/elements.table.css
index 7e59e500..dbcf7016 100644
--- a/src/styles/framework/elements.table.css
+++ b/src/styles/framework/elements.table.css
@@ -2,7 +2,7 @@
 
 caption {
   caption-side: bottom;
-  margin-top: var(--xs3);
+  margin-top: var(--table-caption-spacing);
   font-size: var(--text-sm);
 }
 
@@ -11,7 +11,7 @@ colgroup {
 
 table {
   border-spacing: 0;
-  border: 1px solid var(--table-border-color);
+  border: var(--table-border-width) solid var(--table-border-color);
   border-radius: var(--table-border-radius);
   background-color: var(--table-background-color);
 }
@@ -20,8 +20,8 @@ th,
 td {
   text-align: start;
   padding: var(--table-padding);
-  border-bottom: 1px solid var(--table-border-color);
-  border-inline-start: 1px solid var(--table-border-color);
+  border-bottom: var(--table-border-width) solid var(--table-border-color);
+  border-inline-start: var(--table-border-width) solid var(--table-border-color);
 }
 
 tr {
@@ -46,7 +46,7 @@ tbody {
 tfoot {
   th,
   td {
-    border-top: 1px solid var(--table-border-color);
+    border-top: var(--table-border-width) solid var(--table-border-color);
     border-bottom-width: 0;
   }
 }
diff --git a/src/styles/framework/elements.text.css b/src/styles/framework/elements.text.css
index 7e040dac..f4308d3e 100644
--- a/src/styles/framework/elements.text.css
+++ b/src/styles/framework/elements.text.css
@@ -10,7 +10,7 @@
 }
 
 a {
-  font-weight: var(--semi-bold);
+  font-weight: var(--link-font-weight);
   color: var(--link-color);
   &:where(:hover) {
     color: var(--link-color-hover);
@@ -48,8 +48,8 @@ abbr {
     width: var(--sm1);
     height: var(--sm1);
     display: inline-block;
-    content: '';
-    background:  url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
+    content: "";
+    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='circle-help'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10'/%3E%3Cpath%20d='M9.09%209a3%203%200%200%201%205.83%201c0%202-3%203-3%203'/%3E%3Cpath%20d='M12%2017h.01'/%3E%3C/svg%3E");
     background-size: contain;
   }
   &:hover:before {
@@ -73,22 +73,22 @@ b {
 blockquote {
   position: relative;
   margin-bottom: var(--prose-spacing);
-  padding-block: var(--sm1);
+  padding-block: var(--blockquote-padding-block);
   /* extra inline-start room for the accent bar */
-  padding-inline: var(--md1) var(--sm3);
+  padding-inline: var(--blockquote-padding-inline);
   font-style: italic;
-  background-color: light-dark(var(--primary-50), var(--primary-900));
-  border-radius: var(--radius-md);
+  background-color: var(--blockquote-background-color);
+  border-radius: var(--blockquote-border-radius);
   &::before {
-    content: '';
+    content: "";
     position: absolute;
     top: 0;
     inset-inline-start: 0;
-    width: var(--xs2);
+    width: var(--blockquote-accent-width);
     height: 100%;
-    border-start-start-radius: var(--radius-md);
-    border-end-start-radius: var(--radius-md);
-    background-image: linear-gradient(var(--primary-800), var(--primary-500));
+    border-start-start-radius: var(--blockquote-border-radius);
+    border-end-start-radius: var(--blockquote-border-radius);
+    background: var(--blockquote-accent-color);
   }
 
   p {
@@ -111,17 +111,19 @@ cite {
   font-style: italic;
 }
 
-code, var, kbd {
+code,
+var,
+kbd {
   font-family: var(--mono);
   font-size: 0.9em;
   font-style: normal;
-  color: light-dark(var(--base-500), var(--base-300));
+  color: var(--text-code-muted-color);
 }
 
 :is(code, var, kbd):not(h1 *, h2 *, h3 *, h4 *, h5 *, h6 *, pre *) {
   padding: 0.15em 0.3em;
   color: var(--text-code-color);
-  background-color:  var(--text-code-background-color);
+  background-color: var(--text-code-background-color);
   border-radius: var(--radius-sm);
 }
 
@@ -139,11 +141,11 @@ dd {
 }
 
 dd + dt {
-  margin-top: .5em;
+  margin-top: 0.5em;
 }
 
 del {
-  text-decoration-color: var(--no-500);
+  text-decoration-color: var(--danger-500);
   text-decoration-style: wavy;
 }
 
@@ -156,81 +158,95 @@ em {
 /* figcaption and figure are in elements.media.css */
 
 /* Technically, headings should be in elements.sectioning but I'm guessing that's where most people would expect this to be */
-h1, .h1,
-h2, .h2,
-h3, .h3,
-h4, .h4,
-h5, .h5,
-h6, .h6 {
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3,
+h4,
+.h4,
+h5,
+.h5,
+h6,
+.h6 {
   overflow-wrap: break-word; /* Avoid text overflows */
   text-wrap: balance;
 }
 
-h1, .h1,
-h2, .h2,
-h3, .h3,
-h4, .h4 {
+h1,
+.h1,
+h2,
+.h2,
+h3,
+.h3,
+h4,
+.h4 {
   font-family: var(--heading-font);
   font-weight: var(--heading-weight);
-  line-height: var(--heading-line-height);
+  letter-spacing: var(--heading-letter-spacing);
 }
 
-h1, .h1,
-h2, .h2,
-h3, .h3 {
-  margin-bottom: var(--sm1);
+h1,
+.h1 {
+  margin-bottom: var(--heading-spacing-h1);
+  font-size: var(--heading-font-size-h1);
+  line-height: var(--heading-line-height-h1);
 }
 
-h4, .h4 {
-  margin-bottom: var(--sm2);
+h2,
+.h2 {
+  margin-bottom: var(--heading-spacing-h2);
+  font-size: var(--heading-font-size-h2);
+  line-height: var(--heading-line-height-h2);
 }
 
-h5, .h5,
-h6, .h6 {
-  margin-bottom: var(--xs2);
+h3,
+.h3 {
+  margin-bottom: var(--heading-spacing-h3);
+  font-size: var(--heading-font-size-h3);
+  line-height: var(--heading-line-height-h3);
 }
 
-/* h1—h3 that has h2—h4 right after gets a smaller margin bottom */
-:where(h1, h2, h3):has(+ :is(h2, h3, h4)) {
-  margin-bottom: var(--sm2);
-}
-
-h1, .h1 {
-  font-size: var(--heading-1);
-}
-
-h2, .h2 {
-  font-size: var(--heading-2);
+h4,
+.h4 {
+  margin-bottom: var(--heading-spacing-h4);
+  font-size: var(--heading-font-size-h4);
+  line-height: var(--heading-line-height-h4);
 }
 
-h3, .h3 {
-  font-size: var(--heading-3);
+h5,
+.h5 {
+  margin-bottom: var(--heading-spacing-h5);
+  font-size: var(--heading-font-size-h5);
+  line-height: var(--heading-line-height-h5);
 }
 
-h4, .h4 {
-  font-size: var(--heading-4);
+h6,
+.h6 {
+  margin-bottom: var(--heading-spacing-h6);
+  font-size: var(--heading-font-size-h6);
+  line-height: var(--heading-line-height-h6);
 }
 
-h5, .h5 {
-  font-size: var(--heading-5);
-}
-
-h6, .h6 {
-  font-size: var(--heading-6);
+/* h1—h3 with a h2—h4 subheading right after gets the consecutive margin
+   (must come after the per-level rules: it ties them on specificity, so
+   source order decides) */
+:where(h1, h2, h3):has(+ :is(h2, h3, h4)) {
+  margin-bottom: var(--heading-spacing-consecutive);
 }
 
 hr {
-  --content: "";
   display: flex;
   justify-content: center;
   align-items: center;
   height: 0;
   border-style: solid;
-  border-width: 1px 0 0;
+  border-width: var(--border-sm) 0 0;
   color: var(--ui-border-color);
   overflow: visible;
   &::after {
-    content: var(--content);
+    content: var(--hr-content);
     padding: 0 var(--xs1);
     line-height: 1;
     letter-spacing: var(--tracking-sm);
@@ -242,15 +258,13 @@ hr {
   margin-bottom: var(--prose-spacing);
 }
 
-
 i {
 }
 
 ins {
   padding: 0.15em 0.3em;
-  /* pastel bg stays light in both modes, so pin a dark text color */
-  color: var(--base-950);
-  background-color: var(--yes-200);
+  color: var(--ins-color);
+  background-color: var(--ins-background-color);
   border-radius: var(--radius-sm);
   text-decoration: none;
   &::before {
@@ -280,7 +294,7 @@ p {
 
 pre {
   font-family: var(--mono);
-  font-size: 0.9rem;
+  font-size: var(--pre-font-size);
   white-space: pre-wrap; /* override overflow default */
   border-radius: var(--pre-border-radius);
 }
diff --git a/src/styles/framework/help.devtools.css b/src/styles/framework/help.devtools.css
index 290cdcf1..93915580 100644
--- a/src/styles/framework/help.devtools.css
+++ b/src/styles/framework/help.devtools.css
@@ -1,12 +1,10 @@
 /* DEV TOOLS */
 
-/* Debug-only helpers, inert unless you add the classes yourself.
-   !important is intentional and required in the helpers layer: a debug
-   overlay must win over every other style, including unlayered CSS. */
+/* Debug-only helpers. You have to add the classes yourself. */
 
-/* Baseline grid overlay: add .dev to <body> while checking vertical
-   rhythm (line spacing comes from --baseline in settings.tokens.css). */
+/* Baseline grid overlay: add .dev to <body> while checking vertical rhythm. */
 body.dev {
+  --baseline: 8;
   background-size: 100% calc(var(--baseline) * 1px) !important;
   background-image: linear-gradient(
     to bottom,
@@ -20,7 +18,7 @@ body.dev {
 .dev-error {
   position: fixed !important;
   top: var(--md1) !important;
-  left: var(--md1) !important; /* deliberately physical: debug toast pinned to a visual corner */
+  left: var(--md1) !important;
   z-index: var(--z-top) !important;
   padding: var(--sm1) !important;
   font-size: 1rem !important;
diff --git a/src/styles/framework/settings.tokens.css b/src/styles/framework/settings.tokens.css
index 3b1f4bf3..df7cc22e 100644
--- a/src/styles/framework/settings.tokens.css
+++ b/src/styles/framework/settings.tokens.css
@@ -1,29 +1,23 @@
 /* SETTINGS TOKENS */
 
 /*
-Can't use var() inside media queries, so breakpoints are hard coded in settings.media-queries.css
-
-xxs: 240px
-xs: 360px
-sm: 480px
-md: 768px
-lg: 1024px
-xl: 1440px
-xxl: 1920px
+Can't use var() inside media queries, so breakpoints are hard coded in
+settings.media-queries.css
+
+xxs: 240px xs: 360px sm: 480px md: 768px lg: 1024px xl: 1440px xxl: 1920px
 */
 
 /*
 
-• Globals
+• Dimensions (Margin, Padding, Width, Height)
+• Aspect Ratios
 
-• Margin
-• Padding
-• Width
-• Height
+• Font Families
+• Font Size
+• Font Weight
 
-• Font size
-• Font weight
-• Line height
+• Letter Spacing
+• Line Height
 
 • Colors
 
@@ -35,7 +29,6 @@ xxl: 1920px
 
 :root {
   /* GLOBALS */
-  --baseline: 8;
 
   /* DIMENSIONS */
 
@@ -108,19 +101,13 @@ xxl: 1920px
   --display-sm: 1.728rem;
   --display-md: 2.074rem;
   --display-lg: 2.488rem;
-  --display-xl: 2.986rem;
+  --display-xl: 2.986rem; /* h1 */
   --display-mega: 3.583rem;
   --display-giga: 4.299rem;
 
-  /* Heading Sizes */
-  /* Fluid: interpolate from a min size (at 480px) to a max size (at 1024px). */
-  /* clamp(MIN, INTERCEPT + SLOPEvw, MAX) — the rem term keeps text zoom working. */
-  --heading-1: clamp(var(--display-md), 1.269rem + 2.682vw, var(--display-xl)); /* 2.074rem → 2.986rem */
-  --heading-2: clamp(var(--display-sm), 1.057rem + 2.235vw, var(--display-lg)); /* 1.728rem → 2.488rem */
-  --heading-3: clamp(var(--text-xl), 0.881rem + 1.865vw, var(--display-md)); /* 1.44rem → 2.074rem */
-  --heading-4: clamp(var(--text-lg), 0.734rem + 1.553vw, var(--display-sm)); /* 1.2rem → 1.728rem */
-  --heading-5: clamp(var(--text-lg), 0.988rem + 0.706vw, var(--text-xl)); /* 1.2rem → 1.44rem */
-  --heading-6: clamp(var(--text-md), 0.824rem + 0.588vw, var(--text-lg)); /* 1rem → 1.2rem */
+  /* Heading font sizes are decisions, not scale steps: they map each
+     heading level onto this scale. See --heading-font-size-* in
+     settings.ui.css. */
 
   /* Font Weights */
   --extra-light: 200;
@@ -137,10 +124,6 @@ xxl: 1920px
   --tracking-xl: 0.075em;
   --tracking-xxl: 0.15em;
 
-  /* TODO add display tracking */
-  --tracking-display-md: 0.5em;
-  --tracking-display-lg: 0.75em;
-
   /* Line Height */
   --leading-xs: 1;
   --leading-sm: 1.15;
@@ -233,11 +216,9 @@ xxl: 1920px
   /* DROP SHADOWS  */
 
   --shadow-sm:
-    0 1px 3px 0 var(--ui-shadow-color),
-    0 1px 2px -1px var(--ui-shadow-color);
+    0 1px 3px 0 var(--ui-shadow-color), 0 1px 2px -1px var(--ui-shadow-color);
   --shadow-md:
-    0 4px 6px -1px var(--ui-shadow-color),
-    0 2px 4px -2px var(--ui-shadow-color);
+    0 4px 6px -1px var(--ui-shadow-color), 0 2px 4px -2px var(--ui-shadow-color);
   --shadow-lg:
     0 8px 13px -3px var(--ui-shadow-color),
     0 4px 6px -4px var(--ui-shadow-color);
diff --git a/src/styles/framework/settings.ui.css b/src/styles/framework/settings.ui.css
index 0fa552f7..3a8a3f2d 100644
--- a/src/styles/framework/settings.ui.css
+++ b/src/styles/framework/settings.ui.css
@@ -1,11 +1,26 @@
 /* INTERFACE TOKENS */
 
 /*
-  The abstraction tier between raw tokens (settings.tokens.css) and the
-  framework's rules: semantic aliases plus every component's token defaults.
-  Interface tokens only ever take another token for value; raw values live
-  in settings.tokens.css, and deliberate deviations from these defaults
-  live in a theme file (see theme.default.css).
+  The decisions layer. Every token here is named for what it's FOR (an
+  element, a component, or a shared meaning) and answers "what does this
+  thing use by default". Tokens named for what they ARE (--sm1, --base-500,
+  --bold) are scale tokens and live in settings.tokens.css. That's the
+  whole split: a name that mentions a UI thing belongs here; a name that
+  labels a step on a scale belongs there.
+
+  Values, in order of preference:
+  1. Another interface token, when the meaning is shared
+     (--input-border-color: var(--ui-border-color)).
+  2. A scale token, when the value should follow the system scales
+     (--fieldset-padding: var(--sm3)).
+  3. A raw value, only where following the scales would be wrong:
+     content (separator strings, icon URLs), geometry tuned to one
+     control (--toggle-width), or element-relative measures that track
+     the element's own type instead of the page (em heading spacing).
+     The test: "if a theme retuned the scales, should this follow?"
+
+  Deliberate deviations from these defaults live in a theme file
+  (see theme.default.css).
 */
 
 :root {
@@ -14,9 +29,15 @@
   color-scheme: light dark;
 
   --ui-border-color: light-dark(var(--base-200), var(--base-500));
+  /* Also consumed by the --shadow-* scale in settings.tokens.css: the one
+     reference between the files that runs upward, so shadows can switch
+     with the color scheme. Raw alpha colors: the palettes have no alpha
+     steps. */
   --ui-shadow-color: light-dark(rgb(0 0 0 / 0.1), rgb(0 0 0 / 0.6));
 
-  /* Keyboard focus ring (consumed by :focus-visible in global.a11y.css) */
+  /* Keyboard focus ring (consumed by :focus-visible in global.a11y.css).
+     Raw 2px on purpose: an accessibility affordance that shouldn't move
+     when a theme retunes the decorative border scale. */
   --focus-ring-color: light-dark(var(--primary-500), var(--primary-400));
   --focus-ring-width: 2px;
   --focus-ring-offset: 2px;
@@ -55,27 +76,136 @@
   accent-color: var(--primary-500);
 
   --body-background-color: light-dark(var(--base-0), var(--base-950));
+  --body-line-height: var(--leading-lg);
 
   --input-height: var(--md3);
   --input-padding: var(--xs3);
+  --input-border-width: var(--border-sm);
+  --input-border-color: var(--ui-border-color);
   --input-border-radius: var(--radius-md);
-  --input-border-color-invalid: light-dark(var(--danger-500), var(--danger-400));
+  --input-border-color-invalid: light-dark(
+    var(--danger-500),
+    var(--danger-400)
+  );
 
+  /* Gap under a label that precedes its control */
+  --label-spacing: var(--xs1);
+
+  --fieldset-padding: var(--sm3);
+  --fieldset-border-width: var(--border-sm);
+  --fieldset-border-color: var(--ui-border-color);
+  --fieldset-border-radius: var(--radius-lg);
+
+  /* meter: low/medium/high map to the even-less-good, suboptimum, and
+     optimum pseudo-elements */
+  --meter-height: var(--sm1);
+  --meter-border-radius: var(--radius-md);
+  --meter-track-color: var(--primary-100);
+  --meter-low-color: var(--danger-400);
+  --meter-medium-color: var(--warning-400);
+  --meter-high-color: var(--success-400);
+
+  --progress-height: var(--sm1);
+  --progress-color: var(--primary-500);
+  --progress-track-color: var(--primary-100);
+  --progress-border-radius: var(--radius-md);
+
+  /* select's chevron, applied as a mask painted with the text color;
+     any url() works here, data URL or file */
+  --select-icon-size: var(--sm3);
+  --select-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
+
+  --dialog-min-width: var(--tera1);
+  --dialog-max-width: var(--tera3);
+  --dialog-padding: var(--lg1) var(--md1);
+  --dialog-border-width: var(--border-sm);
+  --dialog-border-color: light-dark(var(--base-200), var(--base-800));
+  --dialog-background-color: light-dark(var(--base-50), var(--base-900));
+  --dialog-border-radius: var(--radius-lg);
   --dialog-backdrop-color: var(--base-950);
   --dialog-backdrop-opacity: var(--o-4);
 
+  /* details: same surface as dialog by default, on purpose but
+     independently overridable. Spacing is the gap between an open
+     summary and its content. */
+  --details-padding: var(--sm1);
+  --details-spacing: var(--xs3);
+  --details-border-width: var(--border-sm);
+  --details-border-color: light-dark(var(--base-200), var(--base-800));
+  --details-background-color: light-dark(var(--base-50), var(--base-900));
+  --details-border-radius: var(--radius-lg);
+  --details-icon-size: var(--sm3);
+  /* Marker icon, applied as a mask painted with the text color; any
+     url() works here, data URL or file */
+  --details-icon: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='currentColor'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%20id='chevron-down'%3E%3Cpath%20d='m6%209%206%206%206-6'/%3E%3C/svg%3E");
+
   --table-padding: var(--xs2) var(--sm1);
+  --table-border-width: var(--border-sm);
   --table-border-color: light-dark(var(--base-100), var(--base-700));
   --table-border-radius: var(--radius-md);
   --table-background-color: none;
+  /* Gap between the table and its caption */
+  --table-caption-spacing: var(--xs3);
+  /* Gap between a figure's content and caption on either side */
+  --figcaption-spacing: var(--xs2);
 
   /* Text */
 
   --heading-font: var(--display);
   --heading-weight: var(--black);
+  --heading-letter-spacing: normal; /* (e.g. -0.02em or var(--tracking-sm)) */
+
+  --heading-font-size-h1: clamp(
+    var(--display-md),
+    1.269rem + 2.682vw,
+    var(--display-xl)
+  ); /* 2.074rem → 2.986rem */
+  --heading-font-size-h2: clamp(
+    var(--display-sm),
+    1.057rem + 2.235vw,
+    var(--display-lg)
+  ); /* 1.728rem → 2.488rem */
+  --heading-font-size-h3: clamp(
+    var(--text-xl),
+    0.881rem + 1.865vw,
+    var(--display-md)
+  ); /* 1.44rem → 2.074rem */
+  --heading-font-size-h4: clamp(
+    var(--text-lg),
+    0.734rem + 1.553vw,
+    var(--display-sm)
+  ); /* 1.2rem → 1.728rem */
+  --heading-font-size-h5: clamp(
+    var(--text-lg),
+    0.988rem + 0.706vw,
+    var(--text-xl)
+  ); /* 1.2rem → 1.44rem */
+  --heading-font-size-h6: clamp(
+    var(--text-md),
+    0.824rem + 0.588vw,
+    var(--text-lg)
+  ); /* 1rem → 1.2rem */
+
   --heading-line-height: var(--leading-sm);
+  --heading-line-height-h1: var(--heading-line-height);
+  --heading-line-height-h2: var(--heading-line-height);
+  --heading-line-height-h3: var(--heading-line-height);
+  --heading-line-height-h4: var(--leading-md);
+  --heading-line-height-h5: var(--leading-md);
+  --heading-line-height-h6: var(--leading-md);
+
+  /* Headings bottom margin  */
+  --heading-spacing-h1: 0.4em;
+  --heading-spacing-h2: 0.4em;
+  --heading-spacing-h3: 0.4em;
+  --heading-spacing-h4: 0.4em;
+  --heading-spacing-h5: 0.4em;
+  --heading-spacing-h6: 0.4em;
+  /* Any h1 before h2, h2 before h3, h3 before h4.  */
+  --heading-spacing-consecutive: 0.3em;
 
   --text-color: light-dark(var(--base-950), var(--base-200));
+  --link-font-weight: var(--semi-bold);
   --link-color: light-dark(var(--primary-600), var(--primary-400));
   --link-color-hover: var(--primary-500);
 
@@ -84,17 +214,42 @@
     var(--primary-100),
     var(--primary-900)
   );
+  /* when code inline styling doesn't apply (inside headings and pre) */
+  --text-code-muted-color: light-dark(var(--base-500), var(--base-300));
 
-  /* Code blocks (bare pre, astro-code, and the site's expressive-code
-     frames all consume this) */
   --pre-border-radius: var(--radius-md);
+  /* matching the 0.9em of inline code */
+  --pre-font-size: 0.9rem;
+
+  --blockquote-padding-block: var(--sm1);
+  --blockquote-padding-inline: var(--md1) var(--sm3);
+  --blockquote-background-color: light-dark(
+    var(--primary-50),
+    var(--primary-900)
+  );
+  --blockquote-border-radius: var(--radius-md);
+  --blockquote-accent-width: var(--xs2);
+  --blockquote-accent-color: linear-gradient(
+    var(--primary-800),
+    var(--primary-500)
+  );
 
   /* .prose related stuff in GLOBAL */
 
+  /* Optional centered label on <hr>, e.g. "***" or a dingbat */
+  --hr-content: "";
+
+  /* ins: background stays light in both light/dark modes */
+  --ins-color: var(--base-950);
+  --ins-background-color: var(--success-200);
+
   --marker-color: var(--highlight-500);
 
   --selection-color: light-dark(var(--base-950), var(--base-0));
-  --selection-background-color: light-dark(var(--primary-200), var(--primary-700));
+  --selection-background-color: light-dark(
+    var(--primary-200),
+    var(--primary-700)
+  );
 }
 
 /* GLOBAL */
@@ -103,19 +258,20 @@
   /* Mobile-first: tighter gutters on small screens, 24px from --md up */
   --grid-column-gap: var(--sm1);
   --grid-row-gap: var(--sm1);
+  @media (--md) {
+    --grid-column-gap: var(--sm3);
+    --grid-row-gap: var(--sm3);
+  }
 
   --wrap-spacing: var(--sm1);
   --wrap-md-spacing: var(--sm3);
   --wrap-lg-spacing: 0;
-  --wrap-width-sm: minmax(200px, 55ch);
-  --wrap-width-md: minmax(200px, 70ch);
-  --wrap-width-lg: minmax(200px, 900px);
+  /* Widths are measures: ch tracks the text size, so raw on purpose. */
+  --wrap-width-sm: minmax(0, 55ch);
+  --wrap-width-md: minmax(0, 70ch);
+  --wrap-width-lg: minmax(0, 900px);
   --wrap-width: var(--wrap-width-md);
 
-  /* Layout scaffolds (global.layout.css): main column cap for
-     .layout-centered and .layout-docs, aside and TOC column widths.
-     --layout-toc-width takes any grid track size; the 1fr default lets
-     the TOC absorb the leftover space. */
   --layout-content-width: 70ch;
   --layout-aside-width: 245px;
   --layout-toc-width: 1fr;
@@ -123,13 +279,6 @@
   --prose-spacing: var(--sm1);
 }
 
-@media (--md) {
-  :root {
-    --grid-column-gap: var(--sm3);
-    --grid-row-gap: var(--sm3);
-  }
-}
-
 /* COMPONENTS */
 
 /* Badge */
@@ -166,16 +315,21 @@
 /* (Button defaults and primary button colors) */
 
 :root {
+  /* Optical minimums, deliberately off the spacing scale */
   --bt-min-width: 101px;
   --bt-min-width-md: 123px;
   --bt-min-width-lg: 133px;
+
   --bt-font-size: var(--text-sm);
   --bt-font-size-lg: var(--text-md);
   --bt-font-weight: var(--semi-bold);
+
   --bt-color: var(--text-color);
   --bt-color-hover: light-dark(var(--text-color), var(--base-0));
+
   --bt-background-color: light-dark(var(--base-0), var(--base-800));
   --bt-background-color-hover: light-dark(var(--base-50), var(--base-900));
+
   --bt-border-color: var(--ui-border-color);
   --bt-border-width: var(--border-sm);
   --bt-border-radius: var(--radius-lg);
@@ -238,14 +392,15 @@
   --card-shadow: var(--shadow-md);
   --card-shadow-hover: var(--shadow-xl);
   --card-loading-bg: light-dark(var(--base-200), var(--base-900));
-  /* Default media aspect ratio; the Card component sets it inline from its
-     aspectRatio prop */
+  /* Default media aspect ratio; the Card component pins it inline only
+     when its aspectRatio prop is passed */
   --card-aspect-ratio: var(--ar-golden);
 }
 
 /* Toggle */
 
 :root {
+  /* Drawn-control geometry, deliberately off the scales */
   --toggle-width: 50px;
   --toggle-height: 28px;
   --toggle-border-width: 2px;
@@ -266,8 +421,8 @@
   --field-spacing: var(--xs1);
   --field-hint-color: light-dark(var(--base-400), var(--base-500));
   --field-error-color: light-dark(var(--danger-500), var(--danger-300));
-  /* static = messages in flow under the control; absolute = overlaid below
-     the field (row compositions set this so messages can't move siblings) */
+  /*Field's hint/error position. Use `static` to reflow under, use `absolute`
+  (and leave enough space below) if you don't want any shift on errors */
   --field-message-position: static;
 }
 
@@ -306,8 +461,7 @@
   }
   --header-background-color: light-dark(var(--base-0), var(--base-950));
 
-  /* The mobile menu is an always-dark surface by design, so these are raw
-     palette values on purpose; override them to retheme the menu. */
+  /* The mobile menu is an always-dark  by design */
   --header-menu-background-color: var(--base-950);
   --header-menu-color: var(--base-0);
   --header-menu-color-current: var(--primary-400);
@@ -392,7 +546,10 @@
   --section-header-spacing: var(--lg3);
   --section-eyebrow-color: light-dark(var(--primary-600), var(--primary-400));
   --section-lede-color: light-dark(var(--base-500), var(--base-400));
-  --section-filled-background-color: light-dark(var(--base-50), var(--base-900));
+  --section-filled-background-color: light-dark(
+    var(--base-50),
+    var(--base-900)
+  );
   --section-primary-background-color: light-dark(
     var(--primary-600),
     var(--primary-900)
@@ -421,9 +578,9 @@
   --tags-radius: var(--radius-md);
 }
 
-/* Tiles: no tokens. The container thresholds live in component.tiles.css
-   (container queries can't read custom properties), and --tiles-columns
-   is set there; pin it on a hook class of your own to opt out. */
+/* Tiles has no tokens here: its column count is set by container queries in
+   component.tiles.css since custom properties don't work inside @container.
+*/
 
 /* TOC */
 
@@ -432,5 +589,5 @@
   --toc-color-hover: var(--link-color-hover);
   --toc-spacing: var(--xs1);
   --toc-indentation: var(--xs3);
-  --toc-icon-size: 16px;
+  --toc-icon-size: var(--sm1);
 }