/*
! tailwindcss v3.0.24 | MIT License | https://tailwindcss.com
*//*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
*/

html {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: Inter var, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font family by default.
2. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: Fira Code VF, Fira Code, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
[type='button'],
[type='reset'],
[type='submit'] {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/
:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/*
Ensure the default browser behavior of the `hidden` attribute.
*/

[hidden] {
  display: none;
}

*, ::before, ::after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}
.container {
  width: 100%;
}
@media (min-width: 640px) {

  .container {
    max-width: 640px;
  }
}
@media (min-width: 768px) {

  .container {
    max-width: 768px;
  }
}
@media (min-width: 1024px) {

  .container {
    max-width: 1024px;
  }
}
@media (min-width: 1280px) {

  .container {
    max-width: 1280px;
  }
}
@media (min-width: 1536px) {

  .container {
    max-width: 1536px;
  }
}
.prose {
  color: var(--tw-prose-body);
  max-width: 65ch;
}
.prose :where(p):not(:where([class~="not-prose"] *)) {
  margin-top: 1.25em;
  margin-bottom: 1.25em;
}
.prose :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-lead);
  font-size: 1.25em;
  line-height: 1.6;
  margin-top: 1.2em;
  margin-bottom: 1.2em;
}
.prose :where(a):not(:where([class~="not-prose"] *)) {
  color: #6d28d9;
  text-decoration: none;
  font-weight: 500;
  transition: colors;
  transition-duration: 150ms;
  transition-property: border-color, color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  border-bottom-color: #6b7280;
  border-bottom-width: 1px;
}
.prose :where(a):not(:where([class~="not-prose"] *)):hover {
  color: #8b5cf6;
  border-bottom-color: #9ca3af;
}
.prose :where(strong):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-bold);
  font-weight: 600;
}
.prose :where(a strong):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(blockquote strong):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(thead th strong):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(ol):not(:where([class~="not-prose"] *)) {
  list-style-type: decimal;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-left: 1.625em;
}
.prose :where(ol[type="A"]):not(:where([class~="not-prose"] *)) {
  list-style-type: upper-alpha;
}
.prose :where(ol[type="a"]):not(:where([class~="not-prose"] *)) {
  list-style-type: lower-alpha;
}
.prose :where(ol[type="A" s]):not(:where([class~="not-prose"] *)) {
  list-style-type: upper-alpha;
}
.prose :where(ol[type="a" s]):not(:where([class~="not-prose"] *)) {
  list-style-type: lower-alpha;
}
.prose :where(ol[type="I"]):not(:where([class~="not-prose"] *)) {
  list-style-type: upper-roman;
}
.prose :where(ol[type="i"]):not(:where([class~="not-prose"] *)) {
  list-style-type: lower-roman;
}
.prose :where(ol[type="I" s]):not(:where([class~="not-prose"] *)) {
  list-style-type: upper-roman;
}
.prose :where(ol[type="i" s]):not(:where([class~="not-prose"] *)) {
  list-style-type: lower-roman;
}
.prose :where(ol[type="1"]):not(:where([class~="not-prose"] *)) {
  list-style-type: decimal;
}
.prose :where(ul):not(:where([class~="not-prose"] *)) {
  list-style-type: disc;
  margin-top: 1.25em;
  margin-bottom: 1.25em;
  padding-left: 1.625em;
}
.prose :where(ol > li):not(:where([class~="not-prose"] *))::marker {
  font-weight: 400;
  color: var(--tw-prose-counters);
}
.prose :where(ul > li):not(:where([class~="not-prose"] *))::marker {
  color: var(--tw-prose-bullets);
}
.prose :where(hr):not(:where([class~="not-prose"] *)) {
  border-color: var(--tw-prose-hr);
  border-top-width: 1px;
  margin-top: 3em;
  margin-bottom: 3em;
}
.prose :where(blockquote):not(:where([class~="not-prose"] *)) {
  font-weight: 500;
  font-style: italic;
  color: var(--tw-prose-quotes);
  border-left-width: 0.25rem;
  border-left-color: #a855f7;
  quotes: "\201C""\201D""\2018""\2019";
  margin-top: 1.6em;
  margin-bottom: 1.6em;
  padding-left: 1em;
}
.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"] *))::before {
  content: open-quote;
}
.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"] *))::after {
  content: close-quote;
}
.prose :where(h1):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 800;
  font-size: 2.25em;
  margin-top: 0;
  margin-bottom: 0.8888889em;
  line-height: 1.1111111;
}
.prose :where(h1 strong):not(:where([class~="not-prose"] *)) {
  font-weight: 900;
  color: inherit;
}
.prose :where(h2):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 700;
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  line-height: 1.3333333;
}
.prose :where(h2 strong):not(:where([class~="not-prose"] *)) {
  font-weight: 800;
  color: inherit;
}
.prose :where(h3):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  font-size: 1.25em;
  margin-top: 1.6em;
  margin-bottom: 0.6em;
  line-height: 1.6;
}
.prose :where(h3 strong):not(:where([class~="not-prose"] *)) {
  font-weight: 700;
  color: inherit;
}
.prose :where(h4):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  line-height: 1.5;
}
.prose :where(h4 strong):not(:where([class~="not-prose"] *)) {
  font-weight: 700;
  color: inherit;
}
.prose :where(img):not(:where([class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(figure > *):not(:where([class~="not-prose"] *)) {
  margin-top: 0;
  margin-bottom: 0;
}
.prose :where(figcaption):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-captions);
  font-size: 0.875em;
  line-height: 1.4285714;
  margin-top: 0.8571429em;
}
.prose :where(code):not(:where([class~="not-prose"] *)) {
  font-size: 0.875em;
}
.prose :where(code):not(:where([class~="not-prose"] *))::before {}
.prose :where(code):not(:where([class~="not-prose"] *))::after {}
.prose :where(a code):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(h1 code):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(h2 code):not(:where([class~="not-prose"] *)) {
  color: inherit;
  font-size: 0.875em;
}
.prose :where(h3 code):not(:where([class~="not-prose"] *)) {
  color: inherit;
  font-size: 0.9em;
}
.prose :where(h4 code):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(blockquote code):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(thead th code):not(:where([class~="not-prose"] *)) {
  color: inherit;
}
.prose :where(pre):not(:where([class~="not-prose"] *)) {
  overflow-x: auto;
  font-weight: 400;
  font-size: 0.875em;
  line-height: 1.7142857;
  margin-top: 1.7142857em;
  margin-bottom: 1.7142857em;
  border-radius: 0.375rem;
  padding-top: 0.8571429em;
  padding-right: 1.1428571em;
  padding-bottom: 0.8571429em;
  padding-left: 1.1428571em;
}
.prose :where(pre code):not(:where([class~="not-prose"] *)) {
  border-width: 0;
  border-radius: 0;
  padding: 0;
  font-weight: inherit;
}
.prose :where(pre code):not(:where([class~="not-prose"] *))::before {
  content: ;
}
.prose :where(pre code):not(:where([class~="not-prose"] *))::after {
  content: ;
}
.prose :where(table):not(:where([class~="not-prose"] *)) {
  width: 100%;
  table-layout: auto;
  text-align: left;
  margin-top: 2em;
  margin-bottom: 2em;
  font-size: 0.875em;
  line-height: 1.7142857;
}
.prose :where(thead):not(:where([class~="not-prose"] *)) {
  border-bottom-width: 1px;
  border-bottom-color: var(--tw-prose-th-borders);
}
.prose :where(thead th):not(:where([class~="not-prose"] *)) {
  color: var(--tw-prose-headings);
  font-weight: 600;
  vertical-align: bottom;
  padding-right: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-left: 0.5714286em;
}
.prose :where(tbody tr):not(:where([class~="not-prose"] *)) {
  border-bottom-width: 1px;
  border-bottom-color: var(--tw-prose-td-borders);
}
.prose :where(tbody tr:last-child):not(:where([class~="not-prose"] *)) {
  border-bottom-width: 0;
}
.prose :where(tbody td):not(:where([class~="not-prose"] *)) {
  vertical-align: baseline;
}
.prose :where(tfoot):not(:where([class~="not-prose"] *)) {
  border-top-width: 1px;
  border-top-color: var(--tw-prose-th-borders);
}
.prose :where(tfoot td):not(:where([class~="not-prose"] *)) {
  vertical-align: top;
}
.prose {
  --tw-prose-body: #374151;
  --tw-prose-headings: #111827;
  --tw-prose-lead: #4b5563;
  --tw-prose-links: #111827;
  --tw-prose-bold: #111827;
  --tw-prose-counters: #6b7280;
  --tw-prose-bullets: #d1d5db;
  --tw-prose-hr: #e5e7eb;
  --tw-prose-quotes: #111827;
  --tw-prose-quote-borders: #e5e7eb;
  --tw-prose-captions: #6b7280;
  --tw-prose-code: #111827;
  --tw-prose-pre-code: #e5e7eb;
  --tw-prose-pre-bg: #1f2937;
  --tw-prose-th-borders: #d1d5db;
  --tw-prose-td-borders: #e5e7eb;
  --tw-prose-invert-body: #d1d5db;
  --tw-prose-invert-headings: #fff;
  --tw-prose-invert-lead: #9ca3af;
  --tw-prose-invert-links: #fff;
  --tw-prose-invert-bold: #fff;
  --tw-prose-invert-counters: #9ca3af;
  --tw-prose-invert-bullets: #4b5563;
  --tw-prose-invert-hr: #374151;
  --tw-prose-invert-quotes: #f3f4f6;
  --tw-prose-invert-quote-borders: #374151;
  --tw-prose-invert-captions: #9ca3af;
  --tw-prose-invert-code: #fff;
  --tw-prose-invert-pre-code: #d1d5db;
  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
  --tw-prose-invert-th-borders: #4b5563;
  --tw-prose-invert-td-borders: #374151;
  font-size: 1rem;
  line-height: 1.75;
}
.prose :where(video):not(:where([class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(figure):not(:where([class~="not-prose"] *)) {
  margin-top: 2em;
  margin-bottom: 2em;
}
.prose :where(li):not(:where([class~="not-prose"] *)) {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.prose :where(ol > li):not(:where([class~="not-prose"] *)) {
  padding-left: 0.375em;
}
.prose :where(ul > li):not(:where([class~="not-prose"] *)) {
  padding-left: 0.375em;
}
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
  margin-top: 1.25em;
}
.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
  margin-bottom: 1.25em;
}
.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
  margin-top: 0.75em;
  margin-bottom: 0.75em;
}
.prose :where(hr + *):not(:where([class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h2 + *):not(:where([class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h3 + *):not(:where([class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(h4 + *):not(:where([class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
  padding-left: 0;
}
.prose :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
  padding-right: 0;
}
.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
  padding-top: 0.5714286em;
  padding-right: 0.5714286em;
  padding-bottom: 0.5714286em;
  padding-left: 0.5714286em;
}
.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
  padding-left: 0;
}
.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
  padding-right: 0;
}
.prose :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
  margin-top: 0;
}
.prose :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
  margin-bottom: 0;
}
[x-cloak] { display: none }
.link {
  --tw-border-opacity: 1;
  border-color: rgb(107 114 128 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(109 40 217 / var(--tw-text-opacity));
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-duration: 150ms;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.link:hover {
  --tw-border-opacity: 1;
  border-color: rgb(156 163 175 / var(--tw-border-opacity));
  --tw-text-opacity: 1;
  color: rgb(139 92 246 / var(--tw-text-opacity));
}
.link {
  border-bottom-width: 1px;
}
/* Editorial article layout ------------------------------------------------ */
.article-column {
  max-width: 43rem;
}
.article-prose {
  font-family: "Source Serif 4", Charter, Georgia, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}
.article-prose h1, .article-prose h2, .article-prose h3, .article-prose h4, .article-prose h5, .article-prose h6 {
  font-family: Inter var, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  letter-spacing: -0.025em;
}
.article-prose h2,
.article-prose h3 {
  scroll-margin-top: 5rem;
}
/* Mark external links in article prose with a small indicator */
.article-prose a[href^="http"]:not([href*="allanmacgregor.com"])::after {
  content: "\2197";
  font-size: 0.65em;
  margin-left: 0.15em;
  vertical-align: text-top;
  --tw-text-opacity: 1;
  color: rgb(167 139 250 / var(--tw-text-opacity));
}
.article-prose pre a[href^="http"]::after,
.article-prose a[href^="http"]:has(img)::after {
  content: none;
}
/* Forms -------------------------------------------------------------------- */
.form-label {
  margin-bottom: 0.375rem;
  display: block;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity));
}
.dark .form-label {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity));
}
.form-input {
  display: block;
  width: 100%;
  border-radius: 0.125rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity));
}
.dark .form-input {
  --tw-border-opacity: 1;
  border-color: rgb(55 65 81 / var(--tw-border-opacity));
  --tw-bg-opacity: 1;
  background-color: rgb(17 24 39 / var(--tw-bg-opacity));
  --tw-text-opacity: 1;
  color: rgb(243 244 246 / var(--tw-text-opacity));
}
.form-input:focus {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity));
  outline: 2px solid transparent;
  outline-offset: 2px;
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(139 92 246 / var(--tw-ring-opacity));
}
/* Disclosure (expandable details) ------------------------------------------ */
details.disclosure > summary {
  list-style: none;
}
details.disclosure > summary::-webkit-details-marker {
  display: none;
}
/* Dark violet panel -------------------------------------------------------
   Shared by the services page "Why me" callout and the article pull-quote
   (`Amgr.Markdown.Quote`), so the two can't drift apart. Deliberately dark in
   both colour schemes — it's a brand surface, not a themed one. */
.panel-dark {
  position: relative;
  overflow: hidden;
  border-radius: 0.375rem;
  background-color: #16121f;
  background-image: radial-gradient(90% 130% at 90% 8%, rgba(139, 92, 246, 0.3), transparent 55%);
  --tw-text-opacity: 1;
  color: rgb(243 244 246 / var(--tw-text-opacity));
}
.panel-dark-label {
  font-family: Fira Code VF, Fira Code, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity));
}
/* Article pull-quote ------------------------------------------------------
   Emitted by Amgr.Markdown.Quote from a ```quote fenced block. Selectors are
   defensive: this sits inside .prose, whose typography plugin styles figure,
   blockquote and figcaption with borders, italics and curly quotes. */
.article-prose .article-quote {
  position: relative;
  overflow: hidden;
  border-radius: 0.375rem;
  background-color: #16121f;
  background-image: radial-gradient(90% 130% at 90% 8%, rgba(139, 92, 246, 0.3), transparent 55%);
  --tw-text-opacity: 1;
  color: rgb(243 244 246 / var(--tw-text-opacity));
  padding: 2rem 2.5rem;
  margin: 2.25rem 0;
}
.article-prose .article-quote > .article-quote-label {
  font-family: Fira Code VF, Fira Code, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity));
  margin: 0 0 0.875rem;
}
.article-prose .article-quote > .article-quote-body {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: 400;
  quotes: none;
  font-family: "Source Serif 4", Charter, Georgia, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  font-size: 1.25rem;
  line-height: 1.75rem;
  line-height: 1.375;
  --tw-text-opacity: 1;
  color: rgb(243 244 246 / var(--tw-text-opacity));
}
.article-prose .article-quote > .article-quote-body p {
  margin: 0 0 0.75rem;
}
.article-prose .article-quote > .article-quote-body p:last-child {
  margin-bottom: 0;
}
.article-prose .article-quote > .article-quote-body p::before,
.article-prose .article-quote > .article-quote-body p::after {
  content: none;
}
.article-prose .article-quote > .article-quote-body strong {
  font-weight: 500 !important;
  --tw-text-opacity: 1 !important;
  color: rgb(196 181 253 / var(--tw-text-opacity)) !important;
}
.article-prose .article-quote > .article-quote-body a {
  --tw-text-opacity: 1 !important;
  color: rgb(221 214 254 / var(--tw-text-opacity)) !important;
  border-bottom-color: rgba(196, 181, 253, 0.5);
}
.article-prose .article-quote > .article-quote-cite {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 0.625rem;
  margin: 1.125rem 0 0;
  font-family: Inter var, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.875rem;
  line-height: 1.25rem;
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity));
}
.article-prose .article-quote > .article-quote-cite::before {
  content: "—";
  --tw-text-opacity: 1;
  color: rgb(167 139 250 / var(--tw-text-opacity));
}
.article-prose .article-quote > .article-quote-cite a {
  --tw-text-opacity: 1 !important;
  color: rgb(229 231 235 / var(--tw-text-opacity)) !important;
  border-bottom: 1px solid rgba(167, 139, 250, 0.6);
}
.article-prose .article-quote > .article-quote-cite a:hover {
  --tw-text-opacity: 1 !important;
  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
}
/* The external-link arrow is for body prose; the attribution has its own mark */
.article-prose .article-quote a[href^="http"]::after {
  content: none;
}
/* gray-400, not 500: on #16121f the latter measures 3.81:1 and fails AA */
.article-prose .article-quote > .article-quote-cite .article-quote-role {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity));
}
@media (max-width: 640px) {
  .article-prose .article-quote {
    padding: 1.5rem 1.5rem;
  }

  .article-prose .article-quote > .article-quote-body {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}
/* Footnotes & sidenotes --------------------------------------------------- */
.footnote-ref {
  --tw-text-opacity: 1;
  color: rgb(109 40 217 / var(--tw-text-opacity));
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
  font-size: 0.75em;
  vertical-align: super;
  cursor: pointer;
}
.sidenotes {
  position: relative;
  counter-reset: sidenote;
}
.sidenote {
  display: none;
  counter-increment: sidenote;
}
.sidenote::before {
  content: counter(sidenote);
  font-family: Inter var, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(124 58 237 / var(--tw-text-opacity));
  font-size: 0.7rem;
  margin-right: 0.375rem;
  vertical-align: super;
}
.sidenote .footnote-backref {
  display: none;
}
.sidenote.is-active {
  display: block;
  padding: 0.5rem 0.75rem;
  margin: 0.5rem 0;
  border-left: 3px solid #d1d5db;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #4b5563;
}
.sidenote.is-active p {
  margin: 0;
}
@media (min-width: 1280px) {
  .sidenotes.has-sidenotes {
    overflow: visible;
  }

  /* The TOC floats in the same right rail as the sidenote annotations.
     footnotes.js starts laying sidenotes out below it to avoid overlap.
     Rail dimensions are sized so the article column (43rem), this rail,
     and the 16rem promo sidebar all fit inside the max-w-7xl container. */
  .sidenotes .article-toc {
    position: absolute;
    top: 0;
    right: -15rem;
    width: 13.5rem;
    margin-bottom: 0;
    font-size: 0.8rem;
  }

  .sidenote {
    display: block;
    position: absolute;
    right: -15rem;
    width: 13.5rem;
    font-size: 0.8rem;
    line-height: 1.45;
    color: #4b5563;
  }

  .sidenote.is-highlighted {
    background-color: #fef9c3;
    border-radius: 0.25rem;
    padding: 0.25rem 0.375rem;
    transition: background-color 0.6s ease-out;
  }

  .sidenote p {
    margin-top: 0.25rem;
  }
}
@media print {
  .sidenote {
    display: none;
  }
}
/* Masthead cursor blink — toggled by logo-type.js after the typewriter finishes */
@keyframes logo-blink {
  50%, 100% {
    opacity: 0;
  }
}
.logo-cursor-blink {
  animation: logo-blink 1.1s step-end infinite;
}
/* --- Details of care --------------------------------------------------- */
/* Text selection is a brand moment */
::-moz-selection {
  background-color: rgba(139, 92, 246, 0.22);
}
::selection {
  background-color: rgba(139, 92, 246, 0.22);
}
.dark ::-moz-selection {
  background-color: rgba(139, 92, 246, 0.38);
}
.dark ::selection {
  background-color: rgba(139, 92, 246, 0.38);
}
/* Tinted scrollbars in dark mode — the last unthemed surface */
.dark {
  scrollbar-color: #3f3954 #111827;
}
/* Section break inside article prose. divider.js swaps each markdown `---`
   <hr> for the violet-pipe mark — the Elixir pipe operator flanked by rules,
   a violet shimmer flowing through: section |> next_section. */
.article-break {
  display: flex;
  justify-content: center;
  margin: 3em 0;
}
.article-break-mark {
  width: 100%;
  max-width: 22rem;
  aspect-ratio: 640 / 80;
}
/* The mark's violet is tuned to glow against the dark surface; on the light
   surface it washes out, so deepen and saturate it there (dark mode is left
   untouched). */
html:not(.dark) .article-break-mark {
  filter: brightness(0.72) saturate(1.3);
}
/* Editorial end mark at the close of every article — a secret button.
   Injected by endmark.js as a real element so it can take a click and
   type out its reveal. Falls back to a plain ∎ if JS never runs. */
.article-endmark {
  display: flex;
  align-items: baseline;
  gap: 0.75ch;
  margin-top: 2.5rem;
  line-height: 1;
}
.article-endmark-mark {
  flex: none;
  color: #8b5cf6;
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  transition: transform 150ms ease-out, color 150ms ease-out;
}
.article-endmark-mark:hover {
  color: #7c3aed;
  transform: rotate(45deg);
}
.dark .article-endmark-mark:hover {
  color: #c4b5fd;
}
.article-endmark-mark.is-found {
  cursor: default;
}
.article-endmark-msg {
  font-family: "Fira Code VF", "Fira Code", monospace;
  font-size: 0.8125rem;
  color: #807e93;
}
.article-endmark-cursor {
  color: #8b5cf6;
}
/* Dateline whisper — the article's secret byline. byline.js turns the date
   into a quiet button; click it and a margin note types out beside it. */
.byline-date {
  cursor: pointer;
  transition: color 150ms ease-out;
}
.byline-date:hover {
  color: #7c3aed;
}
.dark .byline-date:hover {
  color: #c4b5fd;
}
.byline-whisper {
  margin-left: 0.25ch;
  font-family: "Fira Code VF", "Fira Code", monospace;
  font-size: 0.75rem;
  text-transform: none;
  letter-spacing: 0;
  color: #807e93;
}
.byline-whisper-cursor {
  color: #8b5cf6;
}
/* Heading anchors — a violet # that fades in on hover, click to copy */
.heading-anchor {
  margin-left: 0.4em;
  font-family: "Fira Code VF", "Fira Code", monospace;
  font-weight: 400;
  font-size: 0.85em;
  color: #a78bfa;
  text-decoration: none;
  opacity: 0;
  transition: opacity 150ms ease-out;
}
.prose h2:hover .heading-anchor,
.prose h3:hover .heading-anchor,
.heading-anchor:focus-visible {
  opacity: 1;
}
.heading-anchor:hover {
  color: #7c3aed;
}
.dark .heading-anchor:hover {
  color: #c4b5fd;
}
@media (hover: none) {
  .heading-anchor {
    opacity: 0.45;
  }
}
/* --- IEx console easter egg --------------------------------------------- */
#iex-console {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 70;
  height: min(42vh, 22rem);
  display: flex;
  flex-direction: column;
  background-color: #16141f;
  border-top: 2px solid #8b5cf6;
  box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
  font-family: "Fira Code VF", "Fira Code", monospace;
  font-size: 0.8125rem;
  line-height: 1.6;
  color: #e2e2ea;
  transform: translateY(100%);
  transition: transform 220ms cubic-bezier(0.32, 0.72, 0, 1);
}
#iex-console.iex-open {
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  #iex-console {
    transition: none;
  }
}
.iex-bar {
  flex: none;
  padding: 0.4rem 1rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #a78bfa;
  border-bottom: 1px solid #2b2738;
  display: flex;
  justify-content: space-between;
}
.iex-bar kbd {
  color: #807e93;
  letter-spacing: 0.1em;
}
.iex-out {
  flex: 1;
  overflow-y: auto;
  padding: 0.75rem 1rem 0.25rem;
  white-space: pre-wrap;
  word-break: break-word;
}
.iex-out .iex-echo { color: #807e93; }
.iex-out .iex-result { color: #9dd6b0; }
.iex-out .iex-error { color: #f08fa8; }
.iex-out .iex-info { color: #b1aec2; }
.iex-out a { color: #c4b5fd; text-decoration: underline; }
.iex-line {
  flex: none;
  display: flex;
  align-items: baseline;
  gap: 0.5ch;
  padding: 0.25rem 1rem 0.85rem;
}
.iex-prompt {
  color: #c4b5fd;
  white-space: nowrap;
}
.iex-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #e2e2ea;
  font: inherit;
  caret-color: #8b5cf6;
}
/* Footer hint */
.iex-hint {
  font-family: "Fira Code VF", "Fira Code", monospace;
  font-size: 0.75rem;
  color: #9ca3af;
  transition: color 150ms ease-out;
}
.iex-hint:hover {
  color: #8b5cf6;
}
/* Violet rain overlay */
#violet-rain {
  position: fixed;
  inset: 0;
  z-index: 60;
  pointer-events: none;
  transition: opacity 600ms ease-out;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  src: url("/fonts/Inter-Regular-4dd66a113d54a7f9a1ae913049610617.woff2?vsn=d") format("woff2"),
       url("/fonts/Inter-Regular-7c539936c4c8c822b59a1bcc6c08a6ec.woff?vsn=d") format("woff");
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  src: url("/fonts/SourceSerif4-Roman.var-e9192c2fe0a31fbb3b7cd6a28b2309cd.woff2?vsn=d") format("woff2");
}
@font-face {
  font-family: "Source Serif 4";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  src: url("/fonts/SourceSerif4-Italic.var-66c33f6b248f76850cff4a00118c80e4.woff2?vsn=d") format("woff2");
}
@font-face {
  font-family: 'Fira Code';
  src: url('/fonts/FiraCode-Light-f46c731cb8e64db8e052d4537017cd11.woff2?vsn=d') format('woff2'),
    url("/fonts/FiraCode-Light-3ee54064261b9c60dd7158361a69984e.woff?vsn=d") format("woff");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Fira Code';
  src: url('/fonts/FiraCode-Regular-507cfa03982e436605ea817454931f2f.woff2?vsn=d') format('woff2'),
    url("/fonts/FiraCode-Regular-a79534418cf151b4950f1f4d62a35341.woff?vsn=d") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Fira Code';
  src: url('/fonts/FiraCode-Medium-c0ee572c47b2dea2e3d37ee527d8cb14.woff2?vsn=d') format('woff2'),
    url("/fonts/FiraCode-Medium-0ba163e48cc171359978e0da4ff71d90.woff?vsn=d") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Fira Code';
  src: url('/fonts/FiraCode-SemiBold-aa0b6c0b856be73eeea1f8c524a2f878.woff2?vsn=d') format('woff2'),
    url("/fonts/FiraCode-SemiBold-f47027f165df32df70e5cd25cdd7681a.woff?vsn=d") format("woff");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Fira Code';
  src: url('/fonts/FiraCode-Bold-46d5e77a7397fed486199ac0e148bbfc.woff2?vsn=d') format('woff2'),
    url("/fonts/FiraCode-Bold-9effcc85d769e18d728a90b52bc336b8.woff?vsn=d") format("woff");
  font-weight: 700;
  font-style: normal;
}
@supports (font-variation-settings: normal) {
  @font-face {
    font-family: "Inter var";
    font-weight: 100 900;
    font-style: normal;
    font-named-instance: "Regular";
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
    src: url("/fonts/Inter-roman.var-90e8f61d26f65b5ff0acc45ddf6740ea.woff2?vsn=d") format("woff2");
  }

  @font-face {
    font-family: "Inter var";
    font-weight: 100 900;
    font-style: italic;
    font-named-instance: "Italic";
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
    src: url("/fonts/Inter-italic.var-2690e3c25733fb852b55b3f8d651a431.woff2?vsn=d") format("woff2");
  }

  @font-face {
    font-family: 'Fira Code VF';
    font-weight: 300 700;
    font-style: normal;
    font-display: swap;
    src: url('/fonts/FiraCode-VF-4bcf8df5bcb37545cbadd2ef224c2cdc.woff2?vsn=d') format('woff2-variations'),
        url('/fonts/FiraCode-VF-3a803c241d7241c54d2d9a9056959545.woff?vsn=d') format('woff-variations');
  }
}
/* ---------------------------------------------------------------------------
   Code block theme — one token system feeding both highlighters:
   makeup (server-side Elixir) and highlight.js (client-side everything else).
   Light and dark are just two sets of custom-property values.
   --------------------------------------------------------------------------- */
:root {
  --code-bg: #fbfafe;
  --code-border: #e6e3f0;
  --code-rule: #8b5cf6;          /* violet-500 — the editorial top rule  */
  --code-ink: #2a2734;
  --code-muted: #565064;
  --code-keyword: #6d28d9;       /* violet-700 */
  --code-string: #2f7d52;        /* muted moss */
  --code-atom: #a85b08;          /* desaturated amber — numbers, atoms  */
  --code-type: #0f766e;          /* teal — modules, classes, fn heads   */
  --code-comment: #8b8a94;
  --code-error: #be123c;
  --code-label: #6d28d9;
  --code-hll-bg: #f1ecfd;
  --code-inline-bg: #f3effd;
  --code-inline-ink: #5b21b6;
  --code-scroll-shadow: rgba(76, 29, 149, 0.12);
}
.dark {
  --code-bg: #16141f;
  --code-border: #2b2738;
  --code-rule: #8b5cf6;
  --code-ink: #e2e2ea;
  --code-muted: #b1aec2;
  --code-keyword: #c4b5fd;       /* violet-300 */
  --code-string: #9dd6b0;        /* sage */
  --code-atom: #e3b584;          /* sand */
  --code-type: #7fd0c2;          /* soft teal */
  --code-comment: #807e93;
  --code-error: #f08fa8;
  --code-label: #a78bfa;
  --code-hll-bg: #221d36;
  --code-inline-bg: #251f38;
  --code-inline-ink: #cabffc;
  --code-scroll-shadow: rgba(0, 0, 0, 0.55);
}
/* --- Block chrome ---------------------------------------------------------- */
.prose pre {
  position: relative;
  overflow: hidden;
  background-color: var(--code-bg);
  border: 1px solid var(--code-border);
  border-top: 2px solid var(--code-rule);
  border-radius: 0;
  color: var(--code-ink);
  padding: 2.4rem 0 0 0;
}
/* The inner code element is the scroller, so the label and copy button
   stay put while long lines scroll. Gradient pairs render edge shadows
   only when there is hidden overflow (background-attachment trick). */
.prose pre code {
  display: block;
  overflow-x: auto;
  padding: 0 1.25rem 1.15rem;
  background:
    linear-gradient(90deg, var(--code-bg) 40%, rgba(255, 255, 255, 0)) left center,
    linear-gradient(270deg, var(--code-bg) 40%, rgba(255, 255, 255, 0)) right center,
    radial-gradient(farthest-side at 0 50%, var(--code-scroll-shadow), transparent) left center,
    radial-gradient(farthest-side at 100% 50%, var(--code-scroll-shadow), transparent) right center;
  background-repeat: no-repeat;
  background-size: 3rem 100%, 3rem 100%, 0.9rem 100%, 0.9rem 100%;
  background-attachment: local, local, scroll, scroll;
}
.prose pre[data-lang]::before {
  content: attr(data-lang);
  position: absolute;
  top: 0.75rem;
  left: 1.25rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--code-label);
}
.code-copy {
  position: absolute;
  top: 0.6rem;
  right: 1rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--code-comment);
  padding: 0.15rem 0.25rem;
  opacity: 0;
  transition: opacity 150ms ease-out, color 150ms ease-out;
}
.prose pre:hover .code-copy,
.code-copy:focus-visible {
  opacity: 1;
}
.code-copy:hover {
  color: var(--code-label);
}
.code-copy-done,
.code-copy-done:hover {
  color: var(--code-string);
  opacity: 1;
}
@media (hover: none) {
  .code-copy {
    opacity: 1;
  }
}
/* Let code breathe a step wider than the prose column on large screens.
   The right bleed stays shy of the sidenote rail's gutter. */
@media (min-width: 1024px) {
  .prose pre {
    margin-left: -1.25rem;
    margin-right: -0.5rem;
  }
}
/* --- Inline code ------------------------------------------------------------ */
.prose code.inline {
  color: var(--code-inline-ink);
  background-color: var(--code-inline-bg);
  border-radius: 0.25rem;
  padding: 0.1em 0.35em;
}
/* --- Shared token colors: makeup (server-side Elixir) ----------------------- */
.makeup {
  font-family: Fira Code VF, Fira Code, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  color: var(--code-ink);
}
.makeup .unselectable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
/* Highlighted lines (.hll) — violet wash with an inset rule, full-bleed
   across the scroller's padding. */
.makeup .hll {
  display: block;
  margin: 0 -1.25rem;
  padding: 0 1.25rem;
  background-color: var(--code-hll-bg);
  box-shadow: inset 2px 0 0 var(--code-rule);
}
.makeup .k, .makeup .kc, .makeup .kd, .makeup .kn, .makeup .kp,
.makeup .kr, .makeup .kt, .makeup .nb, .makeup .bp, .makeup .nt {
  color: var(--code-keyword);
}
.makeup .s, .makeup .s1, .makeup .s2, .makeup .sa, .makeup .sb,
.makeup .sc, .makeup .sd, .makeup .sh, .makeup .si, .makeup .sr,
.makeup .sx, .makeup .dl, .makeup .gi {
  color: var(--code-string);
}
.makeup .m, .makeup .mb, .makeup .mf, .makeup .mh, .makeup .mi,
.makeup .mo, .makeup .il, .makeup .l, .makeup .ld, .makeup .ss,
.makeup .na, .makeup .no, .makeup .se, .makeup .cp, .makeup .cpf {
  color: var(--code-atom);
}
.makeup .nc, .makeup .nn, .makeup .nd, .makeup .ne, .makeup .nf,
.makeup .fm {
  color: var(--code-type);
}
.makeup .n, .makeup .ni, .makeup .nl, .makeup .nv, .makeup .nx,
.makeup .py, .makeup .vc, .makeup .vg, .makeup .vi, .makeup .vm {
  color: var(--code-ink);
}
.makeup .o, .makeup .ow, .makeup .p {
  color: var(--code-muted);
}
.makeup .c, .makeup .c1, .makeup .ch, .makeup .cm, .makeup .cs,
.makeup .gu {
  color: var(--code-comment);
  font-style: italic;
}
.makeup .err, .makeup .gd {
  color: var(--code-error);
}
.makeup .ge { font-style: italic; }
.makeup .gs { font-weight: bold; }
/* --- Shared token colors: highlight.js (client-side) ------------------------ */
.hljs {
  color: var(--code-ink);
}
.hljs-keyword, .hljs-doctag, .hljs-formula, .hljs-selector-tag,
.hljs-name {
  color: var(--code-keyword);
}
.hljs-string, .hljs-regexp, .hljs-meta-string, .hljs-addition {
  color: var(--code-string);
}
.hljs-number, .hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-link,
.hljs-attr, .hljs-attribute, .hljs-variable, .hljs-template-variable,
.hljs-selector-attr, .hljs-selector-pseudo {
  color: var(--code-atom);
}
.hljs-title, .hljs-section, .hljs-type, .hljs-built_in,
.hljs-builtin-name, .hljs-class .hljs-title, .hljs-selector-id,
.hljs-selector-class {
  color: var(--code-type);
}
.hljs-meta, .hljs-tag, .hljs-subst, .hljs-params {
  color: var(--code-muted);
}
.hljs-comment, .hljs-quote {
  color: var(--code-comment);
  font-style: italic;
}
.hljs-deletion {
  color: var(--code-error);
}
.hljs-emphasis { font-style: italic; }
.hljs-strong { font-weight: bold; }
.hljs-link { text-decoration: underline; }
.dark .prose strong {
  --tw-text-opacity: 1 !important;
  color: rgb(249 250 251 / var(--tw-text-opacity)) !important;
}
.dark .link, .dark .prose a, .dark .prose a code {
  --tw-text-opacity: 1;
  color: rgb(229 231 235 / var(--tw-text-opacity));
}
.dark .link:focus, .dark .prose a:focus, .dark .prose a:focus code {
  --tw-text-opacity: 1;
  color: rgb(254 202 202 / var(--tw-text-opacity));
}
.dark .link:visited, .dark .prose a:visited, .dark .prose a:visited code {
  --tw-text-opacity: 1;
  color: rgb(233 213 255 / var(--tw-text-opacity));
}
.dark .link:hover, .dark .prose a:hover, .dark .prose a:hover code {
  --tw-text-opacity: 1;
  color: rgb(254 202 202 / var(--tw-text-opacity));
}
.dark .sidenote {
  color: #9ca3af;
}
.dark .sidenote::before {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity));
}
.dark .sidenote.is-active {
  color: #9ca3af;
  border-left-color: #4b5563;
  background-color: #1f2937;
}
.dark .sidenote.is-highlighted {
  background-color: rgba(217, 180, 60, 0.15);
}
/* LiveView specific classes for your customizations */
.phx-no-feedback.invalid-feedback,
.phx-no-feedback .invalid-feedback {
  display: none;
}
.phx-click-loading {
  opacity: 0.5;
  transition: opacity 1s ease-out;
}
.phx-disconnected{
  cursor: wait;
}
.phx-disconnected *{
  pointer-events: none;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
.static {
  position: static;
}
.fixed {
  position: fixed;
}
.absolute {
  position: absolute;
}
.relative {
  position: relative;
}
.inset-0 {
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
}
.inset-y-0 {
  top: 0px;
  bottom: 0px;
}
.left-0 {
  left: 0px;
}
.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}
.ml-2 {
  margin-left: 0.5rem;
}
.-mt-2 {
  margin-top: -0.5rem;
}
.-mr-1 {
  margin-right: -0.25rem;
}
.mt-3 {
  margin-top: 0.75rem;
}
.mt-4 {
  margin-top: 1rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-1 {
  margin-top: 0.25rem;
}
.mb-10 {
  margin-bottom: 2.5rem;
}
.mt-1\.5 {
  margin-top: 0.375rem;
}
.mt-3\.5 {
  margin-top: 0.875rem;
}
.mt-5 {
  margin-top: 1.25rem;
}
.mt-6 {
  margin-top: 1.5rem;
}
.ml-auto {
  margin-left: auto;
}
.mt-auto {
  margin-top: auto;
}
.mb-6 {
  margin-bottom: 1.5rem;
}
.mb-8 {
  margin-bottom: 2rem;
}
.mb-2 {
  margin-bottom: 0.5rem;
}
.ml-4 {
  margin-left: 1rem;
}
.mb-4 {
  margin-bottom: 1rem;
}
.mt-8 {
  margin-top: 2rem;
}
.ml-6 {
  margin-left: 1.5rem;
}
.mb-12 {
  margin-bottom: 3rem;
}
.mr-3 {
  margin-right: 0.75rem;
}
.mt-10 {
  margin-top: 2.5rem;
}
.mt-14 {
  margin-top: 3.5rem;
}
.mb-16 {
  margin-bottom: 4rem;
}
.mt-7 {
  margin-top: 1.75rem;
}
.mt-2\.5 {
  margin-top: 0.625rem;
}
.block {
  display: block;
}
.inline-block {
  display: inline-block;
}
.inline {
  display: inline;
}
.flex {
  display: flex;
}
.inline-flex {
  display: inline-flex;
}
.grid {
  display: grid;
}
.contents {
  display: contents;
}
.hidden {
  display: none;
}
.h-12 {
  height: 3rem;
}
.h-44 {
  height: 11rem;
}
.h-6 {
  height: 1.5rem;
}
.h-16 {
  height: 4rem;
}
.h-5 {
  height: 1.25rem;
}
.h-9 {
  height: 2.25rem;
}
.h-2 {
  height: 0.5rem;
}
.h-11 {
  height: 2.75rem;
}
.h-full {
  height: 100%;
}
.min-h-\[65vh\] {
  min-height: 65vh;
}
.w-12 {
  width: 3rem;
}
.w-0\.5 {
  width: 0.125rem;
}
.w-0 {
  width: 0px;
}
.w-44 {
  width: 11rem;
}
.w-6 {
  width: 1.5rem;
}
.w-5 {
  width: 1.25rem;
}
.w-9 {
  width: 2.25rem;
}
.w-60 {
  width: 15rem;
}
.w-2 {
  width: 0.5rem;
}
.w-11 {
  width: 2.75rem;
}
.w-full {
  width: 100%;
}
.min-w-0 {
  min-width: 0px;
}
.max-w-2xl {
  max-width: 42rem;
}
.max-w-5xl {
  max-width: 64rem;
}
.max-w-none {
  max-width: none;
}
.max-w-4xl {
  max-width: 56rem;
}
.max-w-7xl {
  max-width: 80rem;
}
.max-w-\[46rem\] {
  max-width: 46rem;
}
.max-w-3xl {
  max-width: 48rem;
}
.shrink-0 {
  flex-shrink: 0;
}
.origin-top {
  transform-origin: top;
}
.translate-x-3 {
  --tw-translate-x: 0.75rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-3 {
  --tw-translate-y: 0.75rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-y-0 {
  --tw-scale-y: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes pulse {

  50% {
    opacity: .5;
  }
}
.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.cursor-pointer {
  cursor: pointer;
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.resize {
  resize: both;
}
.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.flex-col {
  flex-direction: column;
}
.flex-wrap {
  flex-wrap: wrap;
}
.items-start {
  align-items: flex-start;
}
.items-center {
  align-items: center;
}
.items-baseline {
  align-items: baseline;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.gap-6 {
  gap: 1.5rem;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-px {
  gap: 1px;
}
.gap-4 {
  gap: 1rem;
}
.gap-8 {
  gap: 2rem;
}
.gap-x-3 {
  -moz-column-gap: 0.75rem;
       column-gap: 0.75rem;
}
.gap-x-2 {
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
}
.gap-x-4 {
  -moz-column-gap: 1rem;
       column-gap: 1rem;
}
.gap-y-1 {
  row-gap: 0.25rem;
}
.gap-x-6 {
  -moz-column-gap: 1.5rem;
       column-gap: 1.5rem;
}
.gap-y-0\.5 {
  row-gap: 0.125rem;
}
.gap-y-0 {
  row-gap: 0px;
}
.gap-x-10 {
  -moz-column-gap: 2.5rem;
       column-gap: 2.5rem;
}
.gap-x-5 {
  -moz-column-gap: 1.25rem;
       column-gap: 1.25rem;
}
.gap-y-3 {
  row-gap: 0.75rem;
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}
.space-y-3 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}
.divide-y > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-y-reverse: 0;
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(243 244 246 / var(--tw-divide-opacity));
}
.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rounded-sm {
  border-radius: 0.125rem;
}
.rounded-md {
  border-radius: 0.375rem;
}
.rounded-full {
  border-radius: 9999px;
}
.border {
  border-width: 1px;
}
.border-2 {
  border-width: 2px;
}
.border-t-2 {
  border-top-width: 2px;
}
.border-b-2 {
  border-bottom-width: 2px;
}
.border-t {
  border-top-width: 1px;
}
.border-b {
  border-bottom-width: 1px;
}
.border-l-4 {
  border-left-width: 4px;
}
.border-l-2 {
  border-left-width: 2px;
}
.border-t-4 {
  border-top-width: 4px;
}
.border-gray-200 {
  --tw-border-opacity: 1;
  border-color: rgb(229 231 235 / var(--tw-border-opacity));
}
.border-brand-400 {
  --tw-border-opacity: 1;
  border-color: rgb(167 139 250 / var(--tw-border-opacity));
}
.border-\[\#FDD44F\] {
  --tw-border-opacity: 1;
  border-color: rgb(253 212 79 / var(--tw-border-opacity));
}
.border-brand-200 {
  --tw-border-opacity: 1;
  border-color: rgb(221 214 254 / var(--tw-border-opacity));
}
.border-brand-300 {
  --tw-border-opacity: 1;
  border-color: rgb(196 181 253 / var(--tw-border-opacity));
}
.border-transparent {
  border-color: transparent;
}
.border-amber-500 {
  --tw-border-opacity: 1;
  border-color: rgb(245 158 11 / var(--tw-border-opacity));
}
.border-brand-500 {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity));
}
.border-t-brand-500 {
  --tw-border-opacity: 1;
  border-top-color: rgb(139 92 246 / var(--tw-border-opacity));
}
.border-t-\[\#0047B6\] {
  --tw-border-opacity: 1;
  border-top-color: rgb(0 71 182 / var(--tw-border-opacity));
}
.bg-brand-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(124 58 237 / var(--tw-bg-opacity));
}
.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-brand-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(139 92 246 / var(--tw-bg-opacity));
}
.bg-brand-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(245 243 255 / var(--tw-bg-opacity));
}
.bg-amber-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(255 251 235 / var(--tw-bg-opacity));
}
.bg-gray-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.bg-gray-400 {
  --tw-bg-opacity: 1;
  background-color: rgb(156 163 175 / var(--tw-bg-opacity));
}
.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}
.p-5 {
  padding: 1.25rem;
}
.p-8 {
  padding: 2rem;
}
.p-6 {
  padding: 1.5rem;
}
.p-2 {
  padding: 0.5rem;
}
.p-4 {
  padding: 1rem;
}
.p-1 {
  padding: 0.25rem;
}
.p-10 {
  padding: 2.5rem;
}
.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.px-2\.5 {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}
.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-1\.5 {
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.py-0\.5 {
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.py-0 {
  padding-top: 0px;
  padding-bottom: 0px;
}
.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}
.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.py-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}
.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.py-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
.pt-6 {
  padding-top: 1.5rem;
}
.pb-6 {
  padding-bottom: 1.5rem;
}
.pl-5 {
  padding-left: 1.25rem;
}
.pb-8 {
  padding-bottom: 2rem;
}
.pb-1 {
  padding-bottom: 0.25rem;
}
.pl-6 {
  padding-left: 1.5rem;
}
.pb-12 {
  padding-bottom: 3rem;
}
.pb-10 {
  padding-bottom: 2.5rem;
}
.pt-4 {
  padding-top: 1rem;
}
.text-center {
  text-align: center;
}
.font-serif {
  font-family: "Source Serif 4", Charter, Georgia, ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}
.font-mono {
  font-family: Fira Code VF, Fira Code, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}
.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-\[0\.7rem\] {
  font-size: 0.7rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-\[0\.65rem\] {
  font-size: 0.65rem;
}
.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}
.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}
.font-normal {
  font-weight: 400;
}
.font-semibold {
  font-weight: 600;
}
.font-medium {
  font-weight: 500;
}
.font-bold {
  font-weight: 700;
}
.font-extrabold {
  font-weight: 800;
}
.uppercase {
  text-transform: uppercase;
}
.capitalize {
  text-transform: capitalize;
}
.normal-case {
  text-transform: none;
}
.italic {
  font-style: italic;
}
.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}
.leading-snug {
  line-height: 1.375;
}
.leading-relaxed {
  line-height: 1.625;
}
.leading-tight {
  line-height: 1.25;
}
.leading-6 {
  line-height: 1.5rem;
}
.leading-\[1\.05\] {
  line-height: 1.05;
}
.tracking-normal {
  letter-spacing: 0em;
}
.tracking-widest {
  letter-spacing: 0.1em;
}
.tracking-tight {
  letter-spacing: -0.025em;
}
.tracking-wider {
  letter-spacing: 0.05em;
}
.tracking-\[0\.15em\] {
  letter-spacing: 0.15em;
}
.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity));
}
.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-brand-700 {
  --tw-text-opacity: 1;
  color: rgb(109 40 217 / var(--tw-text-opacity));
}
.text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity));
}
.text-gray-600 {
  --tw-text-opacity: 1;
  color: rgb(75 85 99 / var(--tw-text-opacity));
}
.text-\[\#0047B6\] {
  --tw-text-opacity: 1;
  color: rgb(0 71 182 / var(--tw-text-opacity));
}
.text-gray-700 {
  --tw-text-opacity: 1;
  color: rgb(55 65 81 / var(--tw-text-opacity));
}
.text-brand-500 {
  --tw-text-opacity: 1;
  color: rgb(139 92 246 / var(--tw-text-opacity));
}
.text-brand-400 {
  --tw-text-opacity: 1;
  color: rgb(167 139 250 / var(--tw-text-opacity));
}
.text-amber-700 {
  --tw-text-opacity: 1;
  color: rgb(180 83 9 / var(--tw-text-opacity));
}
.text-brand-600 {
  --tw-text-opacity: 1;
  color: rgb(124 58 237 / var(--tw-text-opacity));
}
.text-brand-300 {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity));
}
.text-red-500 {
  --tw-text-opacity: 1;
  color: rgb(239 68 68 / var(--tw-text-opacity));
}
.text-gray-900 {
  --tw-text-opacity: 1;
  color: rgb(17 24 39 / var(--tw-text-opacity));
}
.underline {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}
.decoration-brand-400 {
  -webkit-text-decoration-color: #a78bfa;
          text-decoration-color: #a78bfa;
}
.underline-offset-4 {
  text-underline-offset: 4px;
}
.ring-2 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-1 {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.ring-brand-200 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(221 214 254 / var(--tw-ring-opacity));
}
.ring-gray-200 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity));
}
.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.transition-colors {
  transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-transform {
  transition-property: transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-150 {
  transition-duration: 150ms;
}
.duration-200 {
  transition-duration: 200ms;
}
.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.ease-out {
  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}
.last\:border-b-0:last-child {
  border-bottom-width: 0px;
}
.hover\:border-brand-400:hover {
  --tw-border-opacity: 1;
  border-color: rgb(167 139 250 / var(--tw-border-opacity));
}
.hover\:border-brand-500:hover {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity));
}
.hover\:border-brand-300:hover {
  --tw-border-opacity: 1;
  border-color: rgb(196 181 253 / var(--tw-border-opacity));
}
.hover\:bg-brand-500:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(139 92 246 / var(--tw-bg-opacity));
}
.hover\:bg-brand-50:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(245 243 255 / var(--tw-bg-opacity));
}
.hover\:text-brand-600:hover {
  --tw-text-opacity: 1;
  color: rgb(124 58 237 / var(--tw-text-opacity));
}
.hover\:text-brand-500:hover {
  --tw-text-opacity: 1;
  color: rgb(139 92 246 / var(--tw-text-opacity));
}
.hover\:text-brand-700:hover {
  --tw-text-opacity: 1;
  color: rgb(109 40 217 / var(--tw-text-opacity));
}
.hover\:text-gray-500:hover {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity));
}
.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.hover\:opacity-80:hover {
  opacity: 0.8;
}
.focus\:border-brand-500:focus {
  --tw-border-opacity: 1;
  border-color: rgb(139 92 246 / var(--tw-border-opacity));
}
.focus\:outline-none:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.focus\:ring-2:focus {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}
.focus\:ring-brand-500:focus {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(139 92 246 / var(--tw-ring-opacity));
}
.focus\:ring-offset-2:focus {
  --tw-ring-offset-width: 2px;
}
.group[open] .group-open\:rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:translate-x-1 {
  --tw-translate-x: 0.25rem;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:scale-y-100 {
  --tw-scale-y: 1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.dark .dark\:prose-dark :where(blockquote):not(:where([class~="not-prose"] *)) {
  color: #9ca3af;
}
.dark .dark\:prose-dark :where(pre):not(:where([class~="not-prose"] *)) {}
.dark .dark\:prose-dark :where(pre code):not(:where([class~="not-prose"] *)) {}
.dark .dark\:prose-dark {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(h1):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(h2):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(h3):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(h4):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(h5):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(h6):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:prose-dark :where(figcaption):not(:where([class~="not-prose"] *)) {
  color: #6b7280;
}
.dark .dark\:prose-dark :where(thead):not(:where([class~="not-prose"] *)) {
  color: #d1d5db;
}
.dark .dark\:block {
  display: block;
}
.dark .dark\:hidden {
  display: none;
}
.dark .dark\:divide-gray-800 > :not([hidden]) ~ :not([hidden]) {
  --tw-divide-opacity: 1;
  border-color: rgb(31 41 55 / var(--tw-divide-opacity));
}
.dark .dark\:border-gray-800 {
  --tw-border-opacity: 1;
  border-color: rgb(31 41 55 / var(--tw-border-opacity));
}
.dark .dark\:border-brand-800 {
  --tw-border-opacity: 1;
  border-color: rgb(91 33 182 / var(--tw-border-opacity));
}
.dark .dark\:border-brand-700 {
  --tw-border-opacity: 1;
  border-color: rgb(109 40 217 / var(--tw-border-opacity));
}
.dark .dark\:border-brand-600 {
  --tw-border-opacity: 1;
  border-color: rgb(124 58 237 / var(--tw-border-opacity));
}
.dark .dark\:bg-gray-900 {
  --tw-bg-opacity: 1;
  background-color: rgb(17 24 39 / var(--tw-bg-opacity));
}
.dark .dark\:bg-gray-800 {
  --tw-bg-opacity: 1;
  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}
.dark .dark\:bg-gray-600 {
  --tw-bg-opacity: 1;
  background-color: rgb(75 85 99 / var(--tw-bg-opacity));
}
.dark .dark\:text-brand-300 {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity));
}
.dark .dark\:text-\[\#7aa5e8\] {
  --tw-text-opacity: 1;
  color: rgb(122 165 232 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-300 {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity));
}
.dark .dark\:text-brand-400 {
  --tw-text-opacity: 1;
  color: rgb(167 139 250 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-500 {
  --tw-text-opacity: 1;
  color: rgb(107 114 128 / var(--tw-text-opacity));
}
.dark .dark\:text-amber-300 {
  --tw-text-opacity: 1;
  color: rgb(252 211 77 / var(--tw-text-opacity));
}
.dark .dark\:text-amber-400 {
  --tw-text-opacity: 1;
  color: rgb(251 191 36 / var(--tw-text-opacity));
}
.dark .dark\:text-brand-800 {
  --tw-text-opacity: 1;
  color: rgb(91 33 182 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-100 {
  --tw-text-opacity: 1;
  color: rgb(243 244 246 / var(--tw-text-opacity));
}
.dark .dark\:ring-brand-700 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(109 40 217 / var(--tw-ring-opacity));
}
.dark .dark\:ring-gray-700 {
  --tw-ring-opacity: 1;
  --tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity));
}
.dark .dark\:hover\:border-brand-600:hover {
  --tw-border-opacity: 1;
  border-color: rgb(124 58 237 / var(--tw-border-opacity));
}
.dark .dark\:hover\:bg-gray-900:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(17 24 39 / var(--tw-bg-opacity));
}
.dark .dark\:hover\:text-brand-300:hover {
  --tw-text-opacity: 1;
  color: rgb(196 181 253 / var(--tw-text-opacity));
}
.dark .dark\:hover\:text-brand-200:hover {
  --tw-text-opacity: 1;
  color: rgb(221 214 254 / var(--tw-text-opacity));
}
.dark .dark\:focus\:ring-offset-gray-900:focus {
  --tw-ring-offset-color: #111827;
}
@media (min-width: 640px) {

  .sm\:mt-0 {
    margin-top: 0px;
  }

  .sm\:mt-1 {
    margin-top: 0.25rem;
  }

  .sm\:mb-0 {
    margin-bottom: 0px;
  }

  .sm\:block {
    display: block;
  }

  .sm\:grid {
    display: grid;
  }

  .sm\:w-full {
    width: 100%;
  }

  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sm\:grid-cols-\[9rem_1fr\] {
    grid-template-columns: 9rem 1fr;
  }

  .sm\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .sm\:grid-cols-\[13rem_1fr\] {
    grid-template-columns: 13rem 1fr;
  }

  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .sm\:gap-x-8 {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }

  .sm\:gap-x-10 {
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
  }

  .sm\:self-start {
    align-self: flex-start;
  }

  .sm\:px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .sm\:pt-1 {
    padding-top: 0.25rem;
  }

  .sm\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .sm\:text-5xl {
    font-size: 3rem;
    line-height: 1;
  }
}
@media (min-width: 768px) {

  .md\:order-2 {
    order: 2;
  }

  .md\:order-1 {
    order: 1;
  }

  .md\:mt-0 {
    margin-top: 0px;
  }

  .md\:inline {
    display: inline;
  }

  .md\:flex {
    display: flex;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:items-baseline {
    align-items: baseline;
  }

  .md\:justify-between {
    justify-content: space-between;
  }

  .md\:gap-x-4 {
    -moz-column-gap: 1rem;
         column-gap: 1rem;
  }
}
@media (min-width: 1024px) {

  .lg\:prose-lg {
    font-size: 1.125rem;
    line-height: 1.7777778;
  }

  .lg\:prose-lg :where(p):not(:where([class~="not-prose"] *)) {
    margin-top: 1.3333333em;
    margin-bottom: 1.3333333em;
  }

  .lg\:prose-lg :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
    font-size: 1.2222222em;
    line-height: 1.4545455;
    margin-top: 1.0909091em;
    margin-bottom: 1.0909091em;
  }

  .lg\:prose-lg :where(blockquote):not(:where([class~="not-prose"] *)) {
    margin-top: 1.6666667em;
    margin-bottom: 1.6666667em;
    padding-left: 1em;
  }

  .lg\:prose-lg :where(h1):not(:where([class~="not-prose"] *)) {
    font-size: 2.6666667em;
    margin-top: 0;
    margin-bottom: 0.8333333em;
    line-height: 1;
  }

  .lg\:prose-lg :where(h2):not(:where([class~="not-prose"] *)) {
    font-size: 1.6666667em;
    margin-top: 1.8666667em;
    margin-bottom: 1.0666667em;
    line-height: 1.3333333;
  }

  .lg\:prose-lg :where(h3):not(:where([class~="not-prose"] *)) {
    font-size: 1.3333333em;
    margin-top: 1.6666667em;
    margin-bottom: 0.6666667em;
    line-height: 1.5;
  }

  .lg\:prose-lg :where(h4):not(:where([class~="not-prose"] *)) {
    margin-top: 1.7777778em;
    margin-bottom: 0.4444444em;
    line-height: 1.5555556;
  }

  .lg\:prose-lg :where(img):not(:where([class~="not-prose"] *)) {
    margin-top: 1.7777778em;
    margin-bottom: 1.7777778em;
  }

  .lg\:prose-lg :where(video):not(:where([class~="not-prose"] *)) {
    margin-top: 1.7777778em;
    margin-bottom: 1.7777778em;
  }

  .lg\:prose-lg :where(figure):not(:where([class~="not-prose"] *)) {
    margin-top: 1.7777778em;
    margin-bottom: 1.7777778em;
  }

  .lg\:prose-lg :where(figure > *):not(:where([class~="not-prose"] *)) {
    margin-top: 0;
    margin-bottom: 0;
  }

  .lg\:prose-lg :where(figcaption):not(:where([class~="not-prose"] *)) {
    font-size: 0.8888889em;
    line-height: 1.5;
    margin-top: 1em;
  }

  .lg\:prose-lg :where(code):not(:where([class~="not-prose"] *)) {
    font-size: 0.8888889em;
  }

  .lg\:prose-lg :where(h2 code):not(:where([class~="not-prose"] *)) {
    font-size: 0.8666667em;
  }

  .lg\:prose-lg :where(h3 code):not(:where([class~="not-prose"] *)) {
    font-size: 0.875em;
  }

  .lg\:prose-lg :where(pre):not(:where([class~="not-prose"] *)) {
    font-size: 0.8888889em;
    line-height: 1.75;
    margin-top: 2em;
    margin-bottom: 2em;
    border-radius: 0.375rem;
    padding-top: 1em;
    padding-right: 1.5em;
    padding-bottom: 1em;
    padding-left: 1.5em;
  }

  .lg\:prose-lg :where(ol):not(:where([class~="not-prose"] *)) {
    margin-top: 1.3333333em;
    margin-bottom: 1.3333333em;
    padding-left: 1.5555556em;
  }

  .lg\:prose-lg :where(ul):not(:where([class~="not-prose"] *)) {
    margin-top: 1.3333333em;
    margin-bottom: 1.3333333em;
    padding-left: 1.5555556em;
  }

  .lg\:prose-lg :where(li):not(:where([class~="not-prose"] *)) {
    margin-top: 0.6666667em;
    margin-bottom: 0.6666667em;
  }

  .lg\:prose-lg :where(ol > li):not(:where([class~="not-prose"] *)) {
    padding-left: 0.4444444em;
  }

  .lg\:prose-lg :where(ul > li):not(:where([class~="not-prose"] *)) {
    padding-left: 0.4444444em;
  }

  .lg\:prose-lg :where(.prose-lg > ul > li p):not(:where([class~="not-prose"] *)) {
    margin-top: 0.8888889em;
    margin-bottom: 0.8888889em;
  }

  .lg\:prose-lg :where(.prose-lg > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
    margin-top: 1.3333333em;
  }

  .lg\:prose-lg :where(.prose-lg > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
    margin-bottom: 1.3333333em;
  }

  .lg\:prose-lg :where(.prose-lg > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
    margin-top: 1.3333333em;
  }

  .lg\:prose-lg :where(.prose-lg > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
    margin-bottom: 1.3333333em;
  }

  .lg\:prose-lg :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"] *)) {
    margin-top: 0.8888889em;
    margin-bottom: 0.8888889em;
  }

  .lg\:prose-lg :where(hr):not(:where([class~="not-prose"] *)) {
    margin-top: 3.1111111em;
    margin-bottom: 3.1111111em;
  }

  .lg\:prose-lg :where(hr + *):not(:where([class~="not-prose"] *)) {
    margin-top: 0;
  }

  .lg\:prose-lg :where(h2 + *):not(:where([class~="not-prose"] *)) {
    margin-top: 0;
  }

  .lg\:prose-lg :where(h3 + *):not(:where([class~="not-prose"] *)) {
    margin-top: 0;
  }

  .lg\:prose-lg :where(h4 + *):not(:where([class~="not-prose"] *)) {
    margin-top: 0;
  }

  .lg\:prose-lg :where(table):not(:where([class~="not-prose"] *)) {
    font-size: 0.8888889em;
    line-height: 1.5;
  }

  .lg\:prose-lg :where(thead th):not(:where([class~="not-prose"] *)) {
    padding-right: 0.75em;
    padding-bottom: 0.75em;
    padding-left: 0.75em;
  }

  .lg\:prose-lg :where(thead th:first-child):not(:where([class~="not-prose"] *)) {
    padding-left: 0;
  }

  .lg\:prose-lg :where(thead th:last-child):not(:where([class~="not-prose"] *)) {
    padding-right: 0;
  }

  .lg\:prose-lg :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
    padding-top: 0.75em;
    padding-right: 0.75em;
    padding-bottom: 0.75em;
    padding-left: 0.75em;
  }

  .lg\:prose-lg :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
    padding-left: 0;
  }

  .lg\:prose-lg :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
    padding-right: 0;
  }

  .lg\:prose-lg :where(.prose-lg > :first-child):not(:where([class~="not-prose"] *)) {
    margin-top: 0;
  }

  .lg\:prose-lg :where(.prose-lg > :last-child):not(:where([class~="not-prose"] *)) {
    margin-bottom: 0;
  }

  .lg\:sticky {
    position: sticky;
  }

  .lg\:top-8 {
    top: 2rem;
  }

  .lg\:mb-0 {
    margin-bottom: 0px;
  }

  .lg\:block {
    display: block;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:grid {
    display: grid;
  }

  .lg\:hidden {
    display: none;
  }

  .lg\:w-full {
    width: 100%;
  }

  .lg\:grid-cols-\[minmax\(0\2c 1fr\)_18rem\] {
    grid-template-columns: minmax(0,1fr) 18rem;
  }

  .lg\:grid-cols-\[19rem_minmax\(0\2c 1fr\)\] {
    grid-template-columns: 19rem minmax(0,1fr);
  }

  .lg\:gap-x-12 {
    -moz-column-gap: 3rem;
         column-gap: 3rem;
  }

  .lg\:gap-x-16 {
    -moz-column-gap: 4rem;
         column-gap: 4rem;
  }

  .lg\:px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-width: 1280px) {

  .xl\:sticky {
    position: sticky;
  }

  .xl\:top-8 {
    top: 2rem;
  }

  .xl\:block {
    display: block;
  }

  .xl\:grid {
    display: grid;
  }

  .xl\:hidden {
    display: none;
  }

  .xl\:grid-cols-\[minmax\(0\2c 1fr\)_16rem\] {
    grid-template-columns: minmax(0,1fr) 16rem;
  }

  .xl\:gap-x-16 {
    -moz-column-gap: 4rem;
         column-gap: 4rem;
  }

  .xl\:gap-x-8 {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }

  .xl\:gap-x-7 {
    -moz-column-gap: 1.75rem;
         column-gap: 1.75rem;
  }
}
@media print {

  .print\:prose-print {
    color: #000;
  }

  .print\:prose-print :where(h1):not(:where([class~="not-prose"] *)) {
    color: #000;
  }

  .print\:prose-print :where(h2):not(:where([class~="not-prose"] *)) {
    color: #000;
  }

  .print\:prose-print :where(h3):not(:where([class~="not-prose"] *)) {
    color: #000;
  }

  .print\:prose-print :where(h4):not(:where([class~="not-prose"] *)) {
    color: #000;
  }

  .print\:prose-print :where(h5):not(:where([class~="not-prose"] *)) {
    color: #000;
  }

  .print\:prose-print :where(h6):not(:where([class~="not-prose"] *)) {
    color: #000;
  }

  .print\:inline {
    display: inline;
  }

  .print\:hidden {
    display: none;
  }
}