@xplortech/apollo-core 0.1.0 → 0.1.1

package/dist/apollo-core/apollo-core.css

@@ -1,23 +1,2127 @@
-/*! tailwindcss v2.1.4 | MIT License | https://tailwindcss.com *//*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */[class^="xpl-"],[class^="xpl-"] *,[class^="xpl-"]::before,[class^="xpl-"] *::before,[class^="xpl-"]::after,[class^="xpl-"] *::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}[class^="xpl-"]{-moz-tab-size:4;-o-tab-size:4;tab-size:4;line-height:1.15;-webkit-text-size-adjust:100%;}[class^="xpl-"],[class^="xpl-"] *{font-family:var(--xpl-font-family);line-height:1.5;}[class^="xpl-"] hr{height:0;color:inherit;border-top-width:1px;}[class^="xpl-"] abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted}[class^="xpl-"] b,[class^="xpl-"] strong{font-weight:bolder}[class^="xpl-"] pre,[class^="xpl-"] code,[class^="xpl-"] kbd,[class^="xpl-"] samp{font-family:ui-monospace,
+/* stylelint-disable no-descending-specificity  */
+
+/*! tailwindcss v2.1.4 | MIT License | https://tailwindcss.com */
+
+/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
+
+/*
+Document
+========
+*/
+
+/**
+ * 1. Prevent padding and border from affecting element width.
+ *
+ *    We used to set this in the html element and inherit from
+ *    the parent element for everything else. This caused issues
+ *    in shadow-dom-enhanced elements like <details> where the content
+ *    is wrapped by a div with box-sizing set to `content-box`.
+ *
+ *    https://github.com/mozdevs/cssremedy/issues/4
+ *
+ *
+ * 2. Allow adding a border to an element by just adding a border-width.
+ *
+ *    By default, the way the browser specifies that an element should have no
+ *    border is by setting it's border-style to `none` in the user-agent
+ *    stylesheet.
+ *
+ *    In order to easily add borders to elements by just setting the `border-width`
+ *    property, we change the default border-style for all elements to `solid`, and
+ *    use border-width to hide them instead. This way our `border` utilities only
+ *    need to set the `border-width` property instead of the entire `border`
+ *    shorthand, making our border utilities much more straightforward to compose.
+ *
+ *    https://github.com/tailwindcss/tailwindcss/pull/116
+ */
+
+[class^="xpl-"],
+[class^="xpl-"] *,
+[class^="xpl-"]::before,
+[class^="xpl-"] *::before,
+[class^="xpl-"]::after,
+[class^="xpl-"] *::after {
+  box-sizing: border-box; /* 1 */
+  border-width: 0; /* 2 */
+  border-style: solid; /* 2 */
+  border-color: #e5e7eb; /* 2 */
+}
+
+/**
+Use a more readable tab size (opinionated).
+*/
+
+/**
+1. Correct the line height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+*/
+
+[class^="xpl-"] {
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  tab-size: 4;
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/*
+Sections
+========
+*/
+
+/**
+Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
+*/
+
+/**
+ * Tailwind custom reset styles
+ */
+
+/**
+ * 1. Use the user's configured `sans` font-family (with Tailwind's default
+ *    sans-serif font stack as a fallback) as a sane default.
+ * 2. Use Tailwind's default "normal" line-height so the user isn't forced
+ *    to override it to ensure consistency even when using the default theme.
+ */
+
+[class^="xpl-"],
+[class^="xpl-"] * {
+  font-family: var(--xpl-font-family);
+  line-height: 1.5; /* 2 */
+}
+
+/*
+Grouping content
+================
+*/
+
+/**
+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
+*/
+
+[class^="xpl-"] hr {
+  height: 0; /* 1 */
+  color: inherit; /* 2 */
+  border-top-width: 1px; /* 3 */
+}
+
+/*
+Text-level semantics
+====================
+*/
+
+/**
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+
+[class^="xpl-"] abbr[title] {
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+}
+
+/**
+Add the correct font weight in Edge and Safari.
+*/
+
+[class^="xpl-"] b,
+[class^="xpl-"] strong {
+  font-weight: bolder;
+}
+
+/**
+1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
+2. Correct the odd 'em' font sizing in all browsers.
+*/
+
+/**
+ * Use the configured 'mono' font family for elements that
+ * are expected to be rendered with a monospace font, falling
+ * back to the system monospace stack if there is no configured
+ * 'mono' font family.
+ */
+
+[class^="xpl-"] pre,
+[class^="xpl-"] code,
+[class^="xpl-"] kbd,
+[class^="xpl-"] samp {
+  font-family:
+    ui-monospace,
     SFMono-Regular,
     Menlo,
     Monaco,
     Consolas,
     "Liberation Mono",
     "Courier New",
-    monospace;font-size:1em;}[class^="xpl-"] small{font-size:80%}[class^="xpl-"] sub,[class^="xpl-"] sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}[class^="xpl-"] sub{bottom:-0.25em}[class^="xpl-"] sup{top:-0.5em}[class^="xpl-"] table,table[class^="xpl-"]{text-indent:0;border-color:inherit;border-collapse:collapse}[class^="xpl-"] button,button[class^="xpl-"],[class^="xpl-"] input,input[class^="xpl-"],[class^="xpl-"] optgroup,optgroup[class^="xpl-"],[class^="xpl-"] select,select[class^="xpl-"] [class^="xpl-"] textarea,textarea[class^="xpl-"]{font-family:var(--xpl-font-family);font-size:100%;line-height:1.15;margin:0;}[class^="xpl-"] button,button[class^="xpl-"],[class^="xpl-"] select,select[class^="xpl-"]{text-transform:none}[class^="xpl-"] button,button[class^="xpl-"] [class^="xpl-"] [type="button"],[type="button"][class^="xpl-"]{-webkit-appearance:button}[class^="xpl-"] legend{padding:0}[class^="xpl-"] progress{vertical-align:baseline}[class^="xpl-"] summary{display:list-item}[class^="xpl-"] blockquote,[class^="xpl-"] dl,[class^="xpl-"] dd,[class^="xpl-"] h1,[class^="xpl-"] h2,[class^="xpl-"] h3,[class^="xpl-"] h4,[class^="xpl-"] h5,[class^="xpl-"] h6,[class^="xpl-"] hr,[class^="xpl-"] figure,[class^="xpl-"] p,[class^="xpl-"] pre{margin:0}[class^="xpl-"] button,button[class^="xpl-"]{background-color:transparent;background-image:none;cursor:pointer}[class^="xpl-"] button:focus,button[class^="xpl-"]:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}[class^="xpl-"] fieldset{margin:0;padding:0}[class^="xpl-"] ol,ol[class^="xpl-"],[class^="xpl-"] ul,ul[class^="xpl-"]{list-style:none;margin:0;padding:0}[class^="xpl-"] img{border-style:solid}[class^="xpl-"] textarea{resize:vertical}[class^="xpl-"] input::-moz-placeholder,input[class^="xpl-"]::-moz-placeholder,[class^="xpl-"] textarea::-moz-placeholder,textarea[class^="xpl-"]::-moz-placeholder{opacity:1;color:#9ca3af}[class^="xpl-"] input:-ms-input-placeholder,input[class^="xpl-"]:-ms-input-placeholder,[class^="xpl-"] textarea:-ms-input-placeholder,textarea[class^="xpl-"]:-ms-input-placeholder{opacity:1;color:#9ca3af}[class^="xpl-"] input::-moz-placeholder,input[class^="xpl-"]::-moz-placeholder,[class^="xpl-"] textarea::-moz-placeholder,textarea[class^="xpl-"]::-moz-placeholder{opacity:1;color:#9ca3af}[class^="xpl-"] input:-ms-input-placeholder,input[class^="xpl-"]:-ms-input-placeholder,[class^="xpl-"] textarea:-ms-input-placeholder,textarea[class^="xpl-"]:-ms-input-placeholder{opacity:1;color:#9ca3af}[class^="xpl-"] input::placeholder,input[class^="xpl-"]::placeholder,[class^="xpl-"] textarea::placeholder,textarea[class^="xpl-"]::placeholder{opacity:1;color:#9ca3af}[class^="xpl-"] h1,[class^="xpl-"] h2,[class^="xpl-"] h3,[class^="xpl-"] h4,[class^="xpl-"] h5,[class^="xpl-"] h6{font-size:inherit;font-weight:inherit}[class^="xpl-"] a{color:inherit;text-decoration:inherit}[class^="xpl-"] button,button[class^="xpl-"],[class^="xpl-"] input,input[class^="xpl-"],[class^="xpl-"] optgroup,optgroup[class^="xpl-"],[class^="xpl-"] select,select[class^="xpl-"],[class^="xpl-"] textarea,textarea[class^="xpl-"]{padding:0;line-height:inherit;color:inherit}[class^="xpl-"] img,[class^="xpl-"] video,[class^="xpl-"] canvas,[class^="xpl-"] audio,[class^="xpl-"] iframe,[class^="xpl-"] embed,[class^="xpl-"] object{display:block}[class^="xpl-"] img,[class^="xpl-"] video{max-width:100%;height:auto}*{--tw-shadow:0 0 #0000;--tw-ring-inset:var(--tw-empty,  );--tw-ring-offset-width:0;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59, 130, 246, 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000}:root{--xpl-font-family:apple-system,
+    monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+Add the correct font size in all browsers.
+*/
+
+[class^="xpl-"] small {
+  font-size: 80%;
+}
+
+/**
+Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
+*/
+
+[class^="xpl-"] sub,
+[class^="xpl-"] sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+[class^="xpl-"] sub {
+  bottom: -0.25em;
+}
+
+[class^="xpl-"] sup {
+  top: -0.5em;
+}
+
+/*
+Tabular data
+============
+*/
+
+/**
+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)
+*/
+
+[class^="xpl-"] table,
+table[class^="xpl-"] {
+  text-indent: 0; /* 1 */
+  border-color: inherit; /* 2 */
+  border-collapse: collapse;
+}
+
+/*
+Forms
+=====
+*/
+
+/**
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+*/
+
+[class^="xpl-"] button,
+button[class^="xpl-"],
+[class^="xpl-"] input,
+input[class^="xpl-"],
+[class^="xpl-"] optgroup,
+optgroup[class^="xpl-"],
+[class^="xpl-"] select,
+select[class^="xpl-"] [class^="xpl-"] textarea,
+textarea[class^="xpl-"] {
+  font-family: var(--xpl-font-family); /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+Remove the inheritance of text transform in Edge and Firefox.
+1. Remove the inheritance of text transform in Firefox.
+*/
+
+[class^="xpl-"] button,
+button[class^="xpl-"],
+[class^="xpl-"] select,
+select[class^="xpl-"] {
+  /* 1 */
+  text-transform: none;
+}
+
+/**
+Correct the inability to style clickable types in iOS and Safari.
+*/
+
+[class^="xpl-"] button,
+button[class^="xpl-"] [class^="xpl-"] [type="button"],
+[type="button"][class^="xpl-"] {
+  -webkit-appearance: button;
+}
+
+/**
+Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
+*/
+
+[class^="xpl-"] legend {
+  padding: 0;
+}
+
+/**
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+
+[class^="xpl-"] progress {
+  vertical-align: baseline;
+}
+
+/*
+Interactive
+===========
+*/
+
+/*
+Add the correct display in Chrome and Safari.
+*/
+
+[class^="xpl-"] summary {
+  display: list-item;
+}
+
+/**
+ * Manually forked from SUIT CSS Base: https://github.com/suitcss/base
+ * A thin layer on top of normalize.css that provides a starting point more
+ * suitable for web applications.
+ */
+
+/**
+ * Removes the default spacing and border for appropriate elements.
+ */
+
+[class^="xpl-"] blockquote,
+[class^="xpl-"] dl,
+[class^="xpl-"] dd,
+[class^="xpl-"] h1,
+[class^="xpl-"] h2,
+[class^="xpl-"] h3,
+[class^="xpl-"] h4,
+[class^="xpl-"] h5,
+[class^="xpl-"] h6,
+[class^="xpl-"] hr,
+[class^="xpl-"] figure,
+[class^="xpl-"] p,
+[class^="xpl-"] pre {
+  margin: 0;
+}
+
+[class^="xpl-"] button,
+button[class^="xpl-"] {
+  background-color: transparent;
+  background-image: none;
+  cursor: pointer;
+}
+
+/**
+ * Work around a Firefox/IE bug where the transparent `button` background
+ * results in a loss of the default `button` focus styles.
+ */
+
+[class^="xpl-"] button:focus,
+button[class^="xpl-"]:focus {
+  outline: 1px dotted;
+  outline: 5px auto -webkit-focus-ring-color;
+}
+
+[class^="xpl-"] fieldset {
+  margin: 0;
+  padding: 0;
+}
+
+[class^="xpl-"] ol,
+ol[class^="xpl-"],
+[class^="xpl-"] ul,
+ul[class^="xpl-"] {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+/**
+ * Undo the `border-style: none` reset that Normalize applies to images so that
+ * our `border-{width}` utilities have the expected effect.
+ *
+ * The Normalize reset is unnecessary for us since we default the border-width
+ * to 0 on all elements.
+ *
+ * https://github.com/tailwindcss/tailwindcss/issues/362
+ */
+
+[class^="xpl-"] img {
+  border-style: solid;
+}
+
+[class^="xpl-"] textarea {
+  resize: vertical;
+}
+
+[class^="xpl-"] input::-moz-placeholder,
+input[class^="xpl-"]::-moz-placeholder,
+[class^="xpl-"] textarea::-moz-placeholder,
+textarea[class^="xpl-"]::-moz-placeholder {
+  opacity: 1;
+  color: #9ca3af;
+}
+
+[class^="xpl-"] input:-ms-input-placeholder,
+input[class^="xpl-"]:-ms-input-placeholder,
+[class^="xpl-"] textarea:-ms-input-placeholder,
+textarea[class^="xpl-"]:-ms-input-placeholder {
+  opacity: 1;
+  color: #9ca3af;
+}
+
+[class^="xpl-"] input::-moz-placeholder, input[class^="xpl-"]::-moz-placeholder, [class^="xpl-"] textarea::-moz-placeholder, textarea[class^="xpl-"]::-moz-placeholder {
+  opacity: 1;
+  color: #9ca3af;
+}
+
+[class^="xpl-"] input:-ms-input-placeholder, input[class^="xpl-"]:-ms-input-placeholder, [class^="xpl-"] textarea:-ms-input-placeholder, textarea[class^="xpl-"]:-ms-input-placeholder {
+  opacity: 1;
+  color: #9ca3af;
+}
+
+[class^="xpl-"] input::placeholder,
+input[class^="xpl-"]::placeholder,
+[class^="xpl-"] textarea::placeholder,
+textarea[class^="xpl-"]::placeholder {
+  opacity: 1;
+  color: #9ca3af;
+}
+
+[class^="xpl-"] h1,
+[class^="xpl-"] h2,
+[class^="xpl-"] h3,
+[class^="xpl-"] h4,
+[class^="xpl-"] h5,
+[class^="xpl-"] h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+
+/**
+ * Reset links to optimize for opt-in styling instead of
+ * opt-out.
+ */
+
+[class^="xpl-"] a {
+  color: inherit;
+  text-decoration: inherit;
+}
+
+/**
+ * Reset form element properties that are easy to forget to
+ * style explicitly so you don't inadvertently introduce
+ * styles that deviate from your design system. These styles
+ * supplement a partial reset that is already applied by
+ * normalize.css.
+ */
+
+[class^="xpl-"] button,
+button[class^="xpl-"],
+[class^="xpl-"] input,
+input[class^="xpl-"],
+[class^="xpl-"] optgroup,
+optgroup[class^="xpl-"],
+[class^="xpl-"] select,
+select[class^="xpl-"],
+[class^="xpl-"] textarea,
+textarea[class^="xpl-"] {
+  padding: 0;
+  line-height: inherit;
+  color: inherit;
+}
+
+/**
+ * Make replaced elements `display: block` by default as that's
+ * the behavior you want almost all of the time.
+ *
+ * https://github.com/mozdevs/cssremedy/issues/14
+ */
+
+[class^="xpl-"] img,
+[class^="xpl-"] video,
+[class^="xpl-"] canvas,
+[class^="xpl-"] audio,
+[class^="xpl-"] iframe,
+[class^="xpl-"] embed,
+[class^="xpl-"] object {
+  display: block;
+}
+
+/**
+ * Constrain images and videos to the parent width and preserve
+ * their intrinsic aspect ratio.
+ *
+ * https://github.com/mozdevs/cssremedy/issues/14
+ */
+
+[class^="xpl-"] img,
+[class^="xpl-"] video {
+  max-width: 100%;
+  height: auto;
+}
+
+* {
+  --tw-shadow: 0 0 #0000;
+  --tw-ring-inset: var(--tw-empty, /*!*/ /*!*/);
+  --tw-ring-offset-width: 0;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgba(59, 130, 246, 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+}
+
+:root {
+  /* Typography */
+  --xpl-font-family:
+    apple-system,
     system-ui,
     "Segoe UI",
     "Arial",
     "Helvetica",
     "Roboto",
-    sans-serif;--xpl-primary:#f44e27;--xpl-darkmode-primary:#f99170;--xpl-text-primary:#212633;--xpl-darkmode-text-primary:#fff;--xpl-secondary:#6923f4;--xpl-secondary-dark:#4d1ab2;--xpl-secondary-extra-dark:#330d80;--xpl-secondary-light:#8857fa;--xpl-secondary-extra-light:#ebe5ff;--xpl-darkmode-secondary:#c3adff;--xpl-darkmode-secondary-dark:#a480ff;--xpl-darkmode-secondary-extra-dark:#8857fa;--xpl-darkmode-secondary-light:#ddd1ff;--xpl-text-secondary:#666d7d;--xpl-darkmode-text-secondary:#ced3db;--xpl-button-radius:9999px}.xpl-avatar{border-radius:9999px;display:inline-block;position:relative;text-transform:uppercase;vertical-align:middle}a.xpl-avatar{text-decoration:none}a.xpl-avatar:focus{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(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);--tw-ring-offset-width:2px}a.xpl-avatar{transition-property:background-color, border-color, color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.dark a.xpl-avatar{--tw-ring-offset-color:#212633;}a.xpl-avatar:focus{--tw-ring-color:var(--xpl-secondary-light)}.dark a.xpl-avatar:focus{--tw-ring-color:var(--xpl-darkmode-secondary)}a.xpl-avatar::after{content:'';--tw-bg-opacity:1;background-color:rgba(0, 0, 0, var(--tw-bg-opacity));border-radius:9999px;display:block;height:100%;opacity:0;position:absolute;top:0px;left:0px;width:100%;transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}a.xpl-avatar:hover::after,a.xpl-avatar:active::after{opacity:0.2}.xpl-avatar--disabled{cursor:not-allowed}.xpl-avatar img,.xpl-avatar__placeholder{border-radius:9999px;height:2.5rem;width:2.5rem}.xpl-avatar__placeholder{background-color:var(--xpl-secondary);display:flex;align-items:center;justify-content:center;font-weight:500;font-size:0.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.dark .xpl-avatar__placeholder{background-color:var(--xpl-darkmode-secondary);--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}.xpl-avatar--green .xpl-avatar__placeholder{--tw-bg-opacity:1;background-color:rgba(116, 251, 208, var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}a.xpl-avatar--green:focus,.dark a.xpl-avatar--green:focus{--tw-ring-color:#74fbd0;}.xpl-avatar--yellow .xpl-avatar__placeholder{--tw-bg-opacity:1;background-color:rgba(236, 253, 145, var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}a.xpl-avatar--yellow:focus,.dark a.xpl-avatar--yellow:focus{--tw-ring-color:#ecfd91;}.xpl-avatar--pink .xpl-avatar__placeholder{--tw-bg-opacity:1;background-color:rgba(255, 158, 246, var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}a.xpl-avatar--pink:focus,.dark a.xpl-avatar--pink:focus{--tw-ring-color:#ff9ef6;}.xpl-avatar--primary .xpl-avatar__placeholder{background-color:var(--xpl-primary)}.xpl-avatar--sm img,.xpl-avatar--sm .xpl-avatar__placeholder{height:1.5rem;font-size:0.625rem;line-height:0.875rem;width:1.5rem}.xpl-avatar--md img,.xpl-avatar--md .xpl-avatar__placeholder{height:2rem;font-size:0.625rem;line-height:0.875rem;width:2rem}.dark .xpl-avatar--primary .xpl-avatar__placeholder{background-color:var(--xpl-darkmode-primary);--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}a.xpl-avatar--primary:focus{--tw-ring-color:var(--xpl-primary)}.dark a.xpl-avatar--primary:focus{--tw-ring-color:var(--xpl-darkmode-primary)}[class^='xpl-avatar__dot']{border-radius:9999px;display:block;height:0.625rem;position:absolute;right:0px;bottom:0px;--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);--tw-ring-opacity:1;--tw-ring-color:rgba(255, 255, 255, var(--tw-ring-opacity));width:0.625rem}.dark [class^='xpl-avatar__dot']{--tw-ring-opacity:1;--tw-ring-color:rgba(33, 38, 51, var(--tw-ring-opacity))}.xpl-avatar__dot--active{--tw-bg-opacity:1;background-color:rgba(55, 184, 143, var(--tw-bg-opacity))}.dark .xpl-avatar__dot--active{--tw-bg-opacity:1;background-color:rgba(82, 235, 186, var(--tw-bg-opacity))}.xpl-avatar__dot--warning{--tw-bg-opacity:1;background-color:rgba(242, 79, 61, var(--tw-bg-opacity))}.dark .xpl-avatar__dot--warning{--tw-bg-opacity:1;background-color:rgba(255, 147, 135, var(--tw-bg-opacity))}.xpl-avatar__dot--inactive{--tw-bg-opacity:1;background-color:rgba(157, 163, 175, var(--tw-bg-opacity))}.xpl-avatar--md [class^='xpl-avatar__dot']{height:0.5rem;width:0.5rem}.xpl-avatar--sm [class^='xpl-avatar__dot']{height:0.375rem;width:0.375rem}.xpl-avatar--rounded img{border-radius:0.375rem}.xpl-avatar-group>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(-0.5rem * var(--tw-space-x-reverse));margin-left:calc(-0.5rem * calc(1 - var(--tw-space-x-reverse)))}.xpl-avatar-group{display:flex;overflow:hidden}.xpl-avatar-group img{border-radius:9999px;display:inline-block;height:2rem;--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);--tw-ring-opacity:1;--tw-ring-color:rgba(255, 255, 255, var(--tw-ring-opacity));width:2rem}.xpl-avatar-group--s>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(-0.25rem * var(--tw-space-x-reverse));margin-left:calc(-0.25rem * calc(1 - var(--tw-space-x-reverse)))}.xpl-avatar-group--s img{height:1.5rem;width:1.5rem}.xpl-avatar-group--l img{height:2.5rem;width:2.5rem}.xpl-avatar-group--reverse{position:relative;z-index:0}.xpl-avatar-group--reverse img:nth-child(0){position:relative;z-index:50}.xpl-avatar-group--reverse img:nth-child(1){position:relative;z-index:40}.xpl-avatar-group--reverse img:nth-child(2){position:relative;z-index:30}.xpl-avatar-group--reverse img:nth-child(3){position:relative;z-index:20}.xpl-avatar-group--reverse img:nth-child(4){position:relative;z-index:10}.xpl-badge{padding:4px 12px;--tw-bg-opacity:1;background-color:rgba(235, 229, 255, var(--tw-bg-opacity));border-radius:9999px;display:inline-flex;align-items:center;font-size:0.75rem;line-height:1rem}.xpl-badge--dot::before{content:"";height:8px;margin:0 4px 0 -4px;width:8px;--tw-bg-opacity:1;background-color:rgba(136, 87, 250, var(--tw-bg-opacity));border-radius:9999px;display:inline-block}.dark .xpl-badge{padding:3px 11px;background-color:transparent;--tw-border-opacity:1;border-color:rgba(195, 173, 255, var(--tw-border-opacity));border-width:1px;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.dark .xpl-badge::before{--tw-bg-opacity:1;background-color:rgba(195, 173, 255, var(--tw-bg-opacity))}.xpl-badge--success{--tw-bg-opacity:1;background-color:rgba(196, 255, 237, var(--tw-bg-opacity))}.xpl-badge--success::before{--tw-bg-opacity:1;background-color:rgba(55, 184, 143, var(--tw-bg-opacity))}.dark .xpl-badge--success{--tw-border-opacity:1;border-color:rgba(82, 235, 186, var(--tw-border-opacity))}.dark .xpl-badge--success::before{--tw-bg-opacity:1;background-color:rgba(82, 235, 186, var(--tw-bg-opacity))}.xpl-badge--warning{--tw-bg-opacity:1;background-color:rgba(244, 253, 197, var(--tw-bg-opacity))}.xpl-badge--warning::before{--tw-bg-opacity:1;background-color:rgba(190, 204, 35, var(--tw-bg-opacity))}.dark .xpl-badge--warning{--tw-border-opacity:1;border-color:rgba(223, 240, 96, var(--tw-border-opacity))}.dark .xpl-badge--warning::before{--tw-bg-opacity:1;background-color:rgba(223, 240, 96, var(--tw-bg-opacity))}.xpl-badge--inactive{--tw-bg-opacity:1;background-color:rgba(228, 230, 235, var(--tw-bg-opacity))}.xpl-badge--inactive::before{--tw-bg-opacity:1;background-color:rgba(157, 163, 175, var(--tw-bg-opacity))}.dark .xpl-badge--inactive{--tw-border-opacity:1;border-color:rgba(157, 163, 175, var(--tw-border-opacity))}.xpl-badge--error{--tw-bg-opacity:1;background-color:rgba(254, 217, 213, var(--tw-bg-opacity))}.xpl-badge--error::before{--tw-bg-opacity:1;background-color:rgba(242, 79, 61, var(--tw-bg-opacity))}.dark .xpl-badge--error{--tw-border-opacity:1;border-color:rgba(255, 147, 135, var(--tw-border-opacity))}.dark .xpl-badge--error::before{--tw-bg-opacity:1;background-color:rgba(255, 147, 135, var(--tw-bg-opacity))}a.xpl-button,button.xpl-button{background-color:var(--xpl-secondary);border-radius:var(--xpl-button-radius);height:40px;padding:11px 23px;text-decoration:none}a.xpl-button,button.xpl-button{border-color:transparent;border-radius:9999px;border-width:1px;display:inline-flex;align-items:center;font-weight:500;font-size:0.875rem;line-height:1.25rem}a.xpl-button:focus,button.xpl-button:focus{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(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);--tw-ring-offset-width:2px}a.xpl-button,button.xpl-button{--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity));transition-property:background-color, border-color, color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.xpl-button i.leading{margin:0 8px 0 -4px}.xpl-button--sm i.leading{margin-right:6px}.xpl-button--xs i.leading{margin-right:4px}.xpl-button i.trailing{margin:0 -4px 0 8px}.xpl-button--sm i.trailing{margin-left:6px}.xpl-button--xs i.trailing{margin-left:4px}.dark a.xpl-button,.dark button.xpl-button{--tw-ring-offset-color:#212633;background-color:var(--xpl-darkmode-secondary)}.dark a.xpl-button,.dark button.xpl-button{--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}a.xpl-button:hover,button.xpl-button:hover{background-color:var(--xpl-secondary-dark)}a.xpl-button:hover,button.xpl-button:hover{--tw-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}a.xpl-button:focus,button.xpl-button:focus{--tw-ring-color:var(--xpl-secondary-light)}button.xpl-button:disabled{--tw-bg-opacity:1;background-color:rgba(228, 230, 235, var(--tw-bg-opacity));cursor:not-allowed;--tw-shadow:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.dark a.xpl-button:hover,.dark button.xpl-button:hover{background-color:var(--xpl-darkmode-secondary-dark)}.dark button.xpl-button:disabled{--tw-bg-opacity:1;background-color:rgba(68, 75, 92, var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(157, 163, 175, var(--tw-text-opacity))}a.xpl-button--secondary,button.xpl-button--secondary{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}.dark a.xpl-button--secondary,.dark button.xpl-button--secondary{background-color:transparent;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}a.xpl-button--secondary:hover,button.xpl-button--secondary:hover{border-color:var(--xpl-secondary)}a.xpl-button--secondary:hover,button.xpl-button--secondary:hover{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity))}button.xpl-button--secondary:disabled{--tw-bg-opacity:1;background-color:rgba(245, 247, 250, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity))}.dark a.xpl-button--secondary:hover,.dark button.xpl-button--secondary:hover{border-color:var(--xpl-darkmode-secondary)}.dark a.xpl-button--secondary:hover,.dark button.xpl-button--secondary:hover{background-color:transparent}.dark a.xpl-button--secondary:focus,.dark button.xpl-button--secondary:focus{--tw-ring-color:var(--xpl-darkmode-secondary)}.dark a.xpl-button--secondary:active,.dark button.xpl-button--secondary:active{--tw-ring-color:var(--xpl-darkmode-secondary-extra-dark)}.dark button.xpl-button--secondary:disabled{background-color:transparent;--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity))}a.xpl-button--subtle,button.xpl-button--subtle{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));border-style:none;--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}.dark a.xpl-button--subtle,.dark button.xpl-button--subtle{background-color:transparent;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}a.xpl-button--subtle:hover,button.xpl-button--subtle:hover{--tw-bg-opacity:1;background-color:rgba(245, 247, 250, var(--tw-bg-opacity))}a.xpl-button--subtle:focus,button.xpl-button--subtle:focus{--tw-bg-opacity:1;background-color:rgba(245, 247, 250, var(--tw-bg-opacity));--tw-ring-opacity:1;--tw-ring-color:rgba(228, 230, 235, var(--tw-ring-opacity))}a.xpl-button--subtle:active,button.xpl-button--subtle:active{--tw-bg-opacity:1;background-color:rgba(228, 230, 235, var(--tw-bg-opacity))}button.xpl-button--subtle:disabled{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.dark a.xpl-button--subtle:hover,.dark button.xpl-button--subtle:hover{--tw-bg-opacity:1;background-color:rgba(55, 62, 78, var(--tw-bg-opacity))}.dark a.xpl-button--subtle:focus,.dark button.xpl-button--subtle:focus{background-color:transparent;--tw-ring-opacity:1;--tw-ring-color:rgba(55, 62, 78, var(--tw-ring-opacity))}.dark a.xpl-button--subtle:active,.dark button.xpl-button--subtle:active{--tw-bg-opacity:1;background-color:rgba(68, 75, 92, var(--tw-bg-opacity))}.dark button.xpl-button--subtle:disabled{background-color:transparent;--tw-text-opacity:1;color:rgba(157, 163, 175, var(--tw-text-opacity))}a.xpl-button--warning,button.xpl-button--warning{--tw-bg-opacity:1;background-color:rgba(194, 33, 15, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(194, 33, 15, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.dark a.xpl-button--warning,.dark button.xpl-button--warning{--tw-bg-opacity:1;background-color:rgba(255, 147, 135, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(255, 147, 135, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}a.xpl-button--warning:hover,button.xpl-button--warning:hover,a.xpl-button--warning:active,button.xpl-button--warning:active{--tw-bg-opacity:1;background-color:rgba(150, 19, 5, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(150, 19, 5, var(--tw-border-opacity))}a.xpl-button--warning:focus,button.xpl-button--warning:focus{--tw-ring-opacity:1;--tw-ring-color:rgba(194, 33, 15, var(--tw-ring-opacity))}button.xpl-button--warning:disabled{--tw-bg-opacity:1;background-color:rgba(228, 230, 235, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(228, 230, 235, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.dark a.xpl-button--warning:hover,.dark button.xpl-button--warning:hover{--tw-bg-opacity:1;background-color:rgba(248, 114, 99, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(248, 114, 99, var(--tw-border-opacity))}.dark a.xpl-button--warning:focus,.dark button.xpl-button--warning:focus{--tw-ring-opacity:1;--tw-ring-color:rgba(255, 147, 135, var(--tw-ring-opacity))}.dark a.xpl-button--warning:active,.dark button.xpl-button--warning:active{--tw-bg-opacity:1;background-color:rgba(248, 114, 99, var(--tw-bg-opacity))}.dark button.xpl-button--warning:disabled{--tw-bg-opacity:1;background-color:rgba(68, 75, 92, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(68, 75, 92, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(157, 163, 175, var(--tw-text-opacity))}a.xpl-button--sm,button.xpl-button--sm{padding:7px 15px;height:32px}a.xpl-button--sm,button.xpl-button--sm{font-size:0.75rem;line-height:1rem}a.xpl-button--xs,button.xpl-button--xs{padding:3px 9px;height:24px}a.xpl-button--xs,button.xpl-button--xs{font-size:0.625rem;line-height:0.875rem}a.xpl-button--icon-only,button.xpl-button--icon-only{width:44px}a.xpl-button--icon-only,button.xpl-button--icon-only{padding-right:0px;padding-left:0px;text-align:center}a.xpl-button--sm.xpl-button--icon-only,button.xpl-button--sm.xpl-button--icon-only{width:32px}a.xpl-button--xs.xpl-button--icon-only,button.xpl-button--xs.xpl-button--icon-only{width:24px}.xpl-button--icon-only i{transform:scale(1.2);width:100%}.xpl-button--icon-only.xpl-button--sm i{transform:scale(1.25)}.xpl-button--icon-only.xpl-button--xs i{transform:scale(1)}.xpl-checkbox-container{display:flex;margin-bottom:1.5rem}.xpl-checkbox{border-radius:4px;border-color:#d1d5db;height:16px;top:2px;transition-property:border background-color;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;width:16px;-webkit-appearance:none;-moz-appearance:none;appearance:none;--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));border-width:1px;cursor:pointer}.xpl-checkbox:focus{outline:2px solid transparent;outline-offset:2px}.xpl-checkbox{position:relative}.xpl-checkbox: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);--tw-ring-offset-width:2px}.xpl-checkbox::after{background-position:calc(50% - 2px) calc(50% - 1px);content:"";height:16px;width:16px;background-repeat:no-repeat;display:block;opacity:0;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity));transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.dark .xpl-checkbox{--tw-ring-offset-color:#212633;background-color:#212633;border-color:#d1d5db}.xpl-checkbox:hover{background-color:#ced2db}.xpl-checkbox:checked{background-color:var(--xpl-secondary)}.xpl-checkbox:indeterminate{background-color:var(--xpl-secondary);border-color:var(--xpl-secondary)}.xpl-checkbox:indeterminate::after{background-position:calc(50% - 1px) calc(50% - 1px);background-image:url("data:image/svg+xml,%3Csvg width='11' height='7' viewBox='0 0 11 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 2.5L11 2.5L11 4.5L0 4.5Z' fill='white'/%3E%3C/svg%3E%0A");opacity:1}.xpl-checkbox:active,.xpl-checkbox:checked{border-color:var(--xpl-secondary)}.xpl-checkbox:disabled{border-color:#e4e6eb;--tw-bg-opacity:1;background-color:rgba(228, 230, 235, var(--tw-bg-opacity));cursor:not-allowed}.xpl-checkbox:focus{--tw-ring-color:var(--xpl-secondary-light)}.xpl-checkbox:hover::after,.xpl-checkbox:checked::after{background-image:url("data:image/svg+xml,%3Csvg width='11' height='8' viewBox='0 0 11 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.37866 7.6145C4.57397 7.80981 4.90601 7.80981 5.10132 7.6145L10.8435 1.87231C11.0388 1.677 11.0388 1.34497 10.8435 1.14966L10.1404 0.446533C9.94507 0.251221 9.63257 0.251221 9.43726 0.446533L4.74976 5.13403L2.54272 2.94653C2.34741 2.75122 2.03491 2.75122 1.8396 2.94653L1.13647 3.64966C0.941162 3.84497 0.941162 4.177 1.13647 4.37231L4.37866 7.6145Z' fill='white'/%3E%3C/svg%3E%0A")}.xpl-checkbox:hover::after,.xpl-checkbox:checked::after{opacity:1}.dark .xpl-checkbox:hover{background-color:#545d6e;border-color:#545d6e}.dark .xpl-checkbox:checked{background-color:var(--xpl-darkmode-secondary)}.dark .xpl-checkbox:checked::after{background-image:url("data:image/svg+xml,%3Csvg width='11' height='8' viewBox='0 0 11 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.37866 7.6145C4.57397 7.80981 4.90601 7.80981 5.10132 7.6145L10.8435 1.87231C11.0388 1.677 11.0388 1.34497 10.8435 1.14966L10.1404 0.446533C9.94507 0.251221 9.63257 0.251221 9.43726 0.446533L4.74976 5.13403L2.54272 2.94653C2.34741 2.75122 2.03491 2.75122 1.8396 2.94653L1.13647 3.64966C0.941162 3.84497 0.941162 4.177 1.13647 4.37231L4.37866 7.6145Z' fill='%23212633'/%3E%3C/svg%3E%0A")}.dark .xpl-checkbox:indeterminate{background-color:var(--xpl-darkmode-secondary);border-color:var(--xpl-darkmode-secondary)}.dark .xpl-checkbox:active,.dark .xpl-checkbox:checked{border-color:var(--xpl-darkmode-secondary)}.dark .xpl-checkbox:disabled{background-color:#666d7d;border-color:#666d7d}.dark .xpl-checkbox:focus{--tw-ring-color:var(--xpl-darkmode-secondary-light)}.xpl-checkbox+label{cursor:pointer;font-size:0.875rem;line-height:1.25rem;padding-right:1rem;padding-left:1rem;vertical-align:middle}.xpl-checkbox:disabled+label{color:#666d7d;cursor:not-allowed}.dark .xpl-checkbox+label{--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.dark .xpl-checkbox:disabled+label{color:#ced3db}.xpl-checkbox+label small{display:block;font-size:0.75rem;line-height:1rem;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.dark .xpl-checkbox+label small{color:#ced3db}.xpl-pagination{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));padding-top:0.75rem;padding-bottom:0.75rem}@media (min-width: 768px){.xpl-pagination{display:flex;align-items:center;justify-content:space-between}}.xpl-pagination p{font-size:0.75rem;line-height:1rem;padding-bottom:0.5rem;--tw-text-opacity:1;color:rgba(68, 75, 92, var(--tw-text-opacity))}@media (min-width: 768px){.xpl-pagination p{padding-bottom:0px}}.xpl-pagination span{font-weight:500}.xpl-pagination nav>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(-1px * var(--tw-space-x-reverse));margin-left:calc(-1px * calc(1 - var(--tw-space-x-reverse)))}.xpl-pagination nav{border-radius:0.375rem;display:inline-flex;position:relative;--tw-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.05);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);z-index:0}.xpl-pagination svg{height:1.25rem;width:1.25rem;fill:currentColor}.xpl-pagination .xpl-pagination-prev{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity))}.xpl-pagination .xpl-pagination-prev:hover{--tw-bg-opacity:1;background-color:rgba(250, 251, 252, var(--tw-bg-opacity))}.xpl-pagination .xpl-pagination-prev{--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity));border-top-left-radius:0.375rem;border-bottom-left-radius:0.375rem;border-width:1px;display:inline-flex;align-items:center;font-weight:500;font-size:0.75rem;line-height:1rem;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.5rem;padding-right:0.5rem;position:relative;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.xpl-pagination .xpl-pagination-next{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity))}.xpl-pagination .xpl-pagination-next:hover{--tw-bg-opacity:1;background-color:rgba(250, 251, 252, var(--tw-bg-opacity))}.xpl-pagination .xpl-pagination-next{--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity));border-top-right-radius:0.375rem;border-bottom-right-radius:0.375rem;border-width:1px;display:inline-flex;align-items:center;font-weight:500;font-size:0.75rem;line-height:1rem;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.5rem;padding-right:0.5rem;position:relative;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.xpl-pagination .xpl-pagination-prev span,.xpl-pagination .xpl-pagination-next span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}.xpl-pagination a,.xpl-pagination button{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity))}.xpl-pagination a:hover,.xpl-pagination button:hover{--tw-bg-opacity:1;background-color:rgba(250, 251, 252, var(--tw-bg-opacity))}.xpl-pagination a,.xpl-pagination button{--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity));border-width:1px;display:inline-flex;align-items:center;font-weight:500;font-size:0.75rem;line-height:1rem;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:1rem;padding-right:1rem;position:relative;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.xpl-pagination-ellipsis{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity));border-width:1px;display:inline-flex;align-items:center;font-weight:500;font-size:0.75rem;line-height:1rem;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:1rem;padding-right:1rem;position:relative;--tw-text-opacity:1;color:rgba(68, 75, 92, var(--tw-text-opacity))}.xpl-pagination .xpl-pagination-current{--tw-bg-opacity:1;background-color:rgba(238, 242, 255, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(99, 102, 241, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(79, 70, 229, var(--tw-text-opacity));z-index:10}.xpl-pagination .xpl-pagination-current:hover{--tw-bg-opacity:1;background-color:rgba(238, 242, 255, var(--tw-bg-opacity))}.xpl-pagination .xpl-pagination-show-md{display:none}@media (min-width: 768px){.xpl-pagination .xpl-pagination-show-md{display:inline-flex}}.xpl-radio-container{display:flex;margin-bottom:1.5rem}.xpl-radio{border-color:#d1d5db;height:16px;top:2px;transition-property:border;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;width:16px;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:9999px;border-width:1px;cursor:pointer}.xpl-radio:focus{outline:2px solid transparent;outline-offset:2px}.xpl-radio{position:relative}.xpl-radio: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);--tw-ring-offset-width:2px}.dark .xpl-radio{--tw-ring-offset-color:#212633;border-color:#ced3db}.xpl-radio:hover,.xpl-radio:checked{border-width:4px}.xpl-radio:active,.xpl-radio:checked{border-color:var(--xpl-secondary)}.xpl-radio:disabled{border-color:#e4e6eb;--tw-bg-opacity:1;background-color:rgba(228, 230, 235, var(--tw-bg-opacity));cursor:not-allowed}.xpl-radio:focus{--tw-ring-color:var(--xpl-secondary-light)}.dark .xpl-radio:active,.dark .xpl-radio:checked{border-color:var(--xpl-darkmode-secondary)}.dark .xpl-radio:disabled{background-color:#666d7d;border-color:#666d7d}.dark .xpl-radio:focus{--tw-ring-color:var(--xpl-darkmode-secondary-light)}.xpl-radio+label{cursor:pointer;font-size:0.875rem;line-height:1.25rem;padding-right:1rem;padding-left:1rem;vertical-align:middle}.xpl-radio:disabled+label{color:#666d7d;cursor:not-allowed}.dark .xpl-radio+label{--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.dark .xpl-radio:disabled+label{color:#ced3db}.xpl-radio+label small{display:block;font-size:0.75rem;line-height:1rem;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.dark .xpl-radio+label small{color:#ced3db}.xpl-table-container{--tw-border-opacity:1;border-color:rgba(228, 230, 235, var(--tw-border-opacity));border-radius:0.375rem;border-width:1px;overflow:auto;--tw-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.dark .xpl-table-container{--tw-bg-opacity:1;background-color:rgba(33, 38, 51, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(55, 62, 78, var(--tw-border-opacity))}.xpl-table>: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));--tw-divide-opacity:1;border-color:rgba(228, 230, 235, var(--tw-divide-opacity))}.xpl-table{min-width:100%}.dark .xpl-table>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgba(55, 62, 78, var(--tw-divide-opacity))}.xpl-table--abs{position:absolute}.xpl-table thead th{font-weight:500;font-size:0.75rem;line-height:1rem;padding-top:0.75rem;padding-bottom:0.75rem;padding-left:1.5rem;padding-right:1.5rem;text-align:left;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity));white-space:nowrap}.xpl-table-row-selected td{--tw-bg-opacity:1 !important;background-color:rgba(244, 242, 255, var(--tw-bg-opacity)) !important}.xpl-table tbody tr td{font-size:0.875rem;line-height:1.25rem;padding-top:1rem;padding-bottom:1rem;padding-left:1.5rem;padding-right:1.5rem;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity));white-space:nowrap}.dark .xpl-table-row-selected td{--tw-bg-opacity:1 !important;background-color:rgba(55, 62, 78, var(--tw-bg-opacity)) !important}.xpl-table--freeze thead th:first-child,.xpl-table--freeze tbody td:first-child{border-right-width:1px}.xpl-table--freeze thead th:first-child,.xpl-table--freeze tbody td:first-child{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(228, 230, 235, var(--tw-border-opacity));position:sticky;left:0px;z-index:10}.xpl-table--freeze thead th:first-child{--tw-bg-opacity:1;background-color:rgba(250, 251, 252, var(--tw-bg-opacity))}.xpl-table tbody tr td:first-child,.xpl-table p{font-weight:500;font-size:0.875rem;line-height:1.25rem;--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}.dark .xpl-table thead th{--tw-text-opacity:1;color:rgba(206, 211, 219, var(--tw-text-opacity))}.dark .xpl-table tbody tr td{--tw-text-opacity:1;color:rgba(206, 211, 219, var(--tw-text-opacity))}.dark .xpl-table--freeze thead th:first-child{--tw-bg-opacity:1;background-color:rgba(37, 43, 57, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(55, 62, 78, var(--tw-border-opacity))}.dark .xpl-table--freeze tbody td:first-child{--tw-bg-opacity:1;background-color:rgba(33, 38, 51, var(--tw-bg-opacity));--tw-border-opacity:1;border-color:rgba(55, 62, 78, var(--tw-border-opacity))}.xpl-table--freeze thead th:first-child::after,.xpl-table--freeze tbody td:first-child::after{background:linear-gradient(
+    sans-serif;
+  /* Colors */
+  --xpl-primary: #f44e27;
+  --xpl-darkmode-primary: #f99170;
+  --xpl-text-primary: #212633;
+  --xpl-darkmode-text-primary: #fff;
+  --xpl-secondary: #6923f4;
+  --xpl-secondary-dark: #4d1ab2;
+  --xpl-secondary-extra-dark: #330d80;
+  --xpl-secondary-light: #8857fa;
+  --xpl-secondary-extra-light: #ebe5ff;
+  --xpl-darkmode-secondary: #c3adff;
+  --xpl-darkmode-secondary-dark: #a480ff;
+  --xpl-darkmode-secondary-extra-dark: #8857fa;
+  --xpl-darkmode-secondary-light: #ddd1ff;
+  --xpl-text-secondary: #666d7d;
+  --xpl-darkmode-text-secondary: #ced3db;
+  /* Component */
+  --xpl-button-radius: 9999px;
+}
+
+.xpl-avatar {
+  border-radius: 9999px;
+  display: inline-block;
+  position: relative;
+  text-transform: uppercase;
+  vertical-align: middle;
+}
+
+a.xpl-avatar {
+  text-decoration: none;
+}
+
+a.xpl-avatar:focus {
+  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(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);
+  --tw-ring-offset-width: 2px;
+}
+
+a.xpl-avatar {
+  transition-property: background-color, border-color, color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.dark a.xpl-avatar {
+  --tw-ring-offset-color: #212633; /* gray-900 */
+}
+
+a.xpl-avatar:focus {
+  --tw-ring-color: var(--xpl-secondary-light);
+}
+
+.dark a.xpl-avatar:focus {
+  --tw-ring-color: var(--xpl-darkmode-secondary);
+}
+
+a.xpl-avatar::after {
+  content: '';
+  --tw-bg-opacity: 1;
+  background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
+  border-radius: 9999px;
+  display: block;
+  height: 100%;
+  opacity: 0;
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  width: 100%;
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+a.xpl-avatar:hover::after, a.xpl-avatar:active::after {
+  opacity: 0.2;
+}
+
+.xpl-avatar--disabled {
+  cursor: not-allowed;
+}
+
+.xpl-avatar img, .xpl-avatar__placeholder {
+  border-radius: 9999px;
+  height: 2.5rem;
+  width: 2.5rem;
+}
+
+.xpl-avatar__placeholder {
+  background-color: var(--xpl-secondary);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .xpl-avatar__placeholder {
+  background-color: var(--xpl-darkmode-secondary);
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+.xpl-avatar--green .xpl-avatar__placeholder {
+  --tw-bg-opacity: 1;
+  background-color: rgba(116, 251, 208, var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+a.xpl-avatar--green:focus,
+.dark a.xpl-avatar--green:focus {
+  --tw-ring-color: #74fbd0; /* green accent */
+}
+
+.xpl-avatar--yellow .xpl-avatar__placeholder {
+  --tw-bg-opacity: 1;
+  background-color: rgba(236, 253, 145, var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+a.xpl-avatar--yellow:focus,
+.dark a.xpl-avatar--yellow:focus {
+  --tw-ring-color: #ecfd91; /* yellow accent */
+}
+
+.xpl-avatar--pink .xpl-avatar__placeholder {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 158, 246, var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+a.xpl-avatar--pink:focus,
+.dark a.xpl-avatar--pink:focus {
+  --tw-ring-color: #ff9ef6; /* pink accent */
+}
+
+.xpl-avatar--primary .xpl-avatar__placeholder {
+  background-color: var(--xpl-primary);
+}
+
+.xpl-avatar--sm img, .xpl-avatar--sm .xpl-avatar__placeholder {
+  height: 1.5rem;
+  font-size: 0.625rem;
+  line-height: 0.875rem;
+  width: 1.5rem;
+}
+
+.xpl-avatar--md img, .xpl-avatar--md .xpl-avatar__placeholder {
+  height: 2rem;
+  font-size: 0.625rem;
+  line-height: 0.875rem;
+  width: 2rem;
+}
+
+.dark .xpl-avatar--primary .xpl-avatar__placeholder {
+  background-color: var(--xpl-darkmode-primary);
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+a.xpl-avatar--primary:focus {
+  --tw-ring-color: var(--xpl-primary);
+}
+
+.dark a.xpl-avatar--primary:focus {
+  --tw-ring-color: var(--xpl-darkmode-primary);
+}
+
+[class^='xpl-avatar__dot'] {
+  border-radius: 9999px;
+  display: block;
+  height: 0.625rem;
+  position: absolute;
+  right: 0px;
+  bottom: 0px;
+  --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);
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(255, 255, 255, var(--tw-ring-opacity));
+  width: 0.625rem;
+}
+
+.dark [class^='xpl-avatar__dot'] {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(33, 38, 51, var(--tw-ring-opacity));
+}
+
+.xpl-avatar__dot--active {
+  --tw-bg-opacity: 1;
+  background-color: rgba(55, 184, 143, var(--tw-bg-opacity));
+}
+
+.dark .xpl-avatar__dot--active {
+  --tw-bg-opacity: 1;
+  background-color: rgba(82, 235, 186, var(--tw-bg-opacity));
+}
+
+.xpl-avatar__dot--warning {
+  --tw-bg-opacity: 1;
+  background-color: rgba(242, 79, 61, var(--tw-bg-opacity));
+}
+
+.dark .xpl-avatar__dot--warning {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 147, 135, var(--tw-bg-opacity));
+}
+
+.xpl-avatar__dot--inactive {
+  --tw-bg-opacity: 1;
+  background-color: rgba(157, 163, 175, var(--tw-bg-opacity));
+}
+
+.xpl-avatar--md [class^='xpl-avatar__dot'] {
+  height: 0.5rem;
+  width: 0.5rem;
+}
+
+.xpl-avatar--sm [class^='xpl-avatar__dot'] {
+  height: 0.375rem;
+  width: 0.375rem;
+}
+
+.xpl-avatar--rounded img {
+  border-radius: 0.375rem;
+}
+
+.xpl-avatar-group > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(-0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(-0.5rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
+.xpl-avatar-group {
+  display: flex;
+  overflow: hidden;
+}
+
+.xpl-avatar-group img {
+  border-radius: 9999px;
+  display: inline-block;
+  height: 2rem;
+  --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);
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(255, 255, 255, var(--tw-ring-opacity));
+  width: 2rem;
+}
+
+.xpl-avatar-group--s > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(-0.25rem * var(--tw-space-x-reverse));
+  margin-left: calc(-0.25rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
+.xpl-avatar-group--s img {
+  height: 1.5rem;
+  width: 1.5rem;
+}
+
+.xpl-avatar-group--l img {
+  height: 2.5rem;
+  width: 2.5rem;
+}
+
+.xpl-avatar-group--reverse {
+  position: relative;
+  z-index: 0;
+}
+
+.xpl-avatar-group--reverse img:nth-child(0) {
+  position: relative;
+  z-index: 50;
+}
+
+.xpl-avatar-group--reverse img:nth-child(1) {
+  position: relative;
+  z-index: 40;
+}
+
+.xpl-avatar-group--reverse img:nth-child(2) {
+  position: relative;
+  z-index: 30;
+}
+
+.xpl-avatar-group--reverse img:nth-child(3) {
+  position: relative;
+  z-index: 20;
+}
+
+.xpl-avatar-group--reverse img:nth-child(4) {
+  position: relative;
+  z-index: 10;
+}
+
+.xpl-badge {
+  padding: 4px 12px;
+  --tw-bg-opacity: 1;
+  background-color: rgba(235, 229, 255, var(--tw-bg-opacity));
+  border-radius: 9999px;
+  display: inline-flex;
+  align-items: center;
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+.xpl-badge--dot::before {
+  content: "";
+  height: 8px;
+  margin: 0 4px 0 -4px;
+  width: 8px;
+  --tw-bg-opacity: 1;
+  background-color: rgba(136, 87, 250, var(--tw-bg-opacity));
+  border-radius: 9999px;
+  display: inline-block;
+}
+
+.dark .xpl-badge {
+  padding: 3px 11px;
+  background-color: transparent;
+  --tw-border-opacity: 1;
+  border-color: rgba(195, 173, 255, var(--tw-border-opacity));
+  border-width: 1px;
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .xpl-badge::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(195, 173, 255, var(--tw-bg-opacity));
+}
+
+.xpl-badge--success {
+  --tw-bg-opacity: 1;
+  background-color: rgba(196, 255, 237, var(--tw-bg-opacity));
+}
+
+.xpl-badge--success::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(55, 184, 143, var(--tw-bg-opacity));
+}
+
+.dark .xpl-badge--success {
+  --tw-border-opacity: 1;
+  border-color: rgba(82, 235, 186, var(--tw-border-opacity));
+}
+
+.dark .xpl-badge--success::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(82, 235, 186, var(--tw-bg-opacity));
+}
+
+.xpl-badge--warning {
+  --tw-bg-opacity: 1;
+  background-color: rgba(244, 253, 197, var(--tw-bg-opacity));
+}
+
+.xpl-badge--warning::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(190, 204, 35, var(--tw-bg-opacity));
+}
+
+.dark .xpl-badge--warning {
+  --tw-border-opacity: 1;
+  border-color: rgba(223, 240, 96, var(--tw-border-opacity));
+}
+
+.dark .xpl-badge--warning::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(223, 240, 96, var(--tw-bg-opacity));
+}
+
+.xpl-badge--inactive {
+  --tw-bg-opacity: 1;
+  background-color: rgba(228, 230, 235, var(--tw-bg-opacity));
+}
+
+.xpl-badge--inactive::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(157, 163, 175, var(--tw-bg-opacity));
+}
+
+.dark .xpl-badge--inactive {
+  --tw-border-opacity: 1;
+  border-color: rgba(157, 163, 175, var(--tw-border-opacity));
+}
+
+.xpl-badge--error {
+  --tw-bg-opacity: 1;
+  background-color: rgba(254, 217, 213, var(--tw-bg-opacity));
+}
+
+.xpl-badge--error::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(242, 79, 61, var(--tw-bg-opacity));
+}
+
+.dark .xpl-badge--error {
+  --tw-border-opacity: 1;
+  border-color: rgba(255, 147, 135, var(--tw-border-opacity));
+}
+
+.dark .xpl-badge--error::before {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 147, 135, var(--tw-bg-opacity));
+}
+
+a.xpl-button,
+button.xpl-button {
+  background-color: var(--xpl-secondary);
+  border-radius: var(--xpl-button-radius);
+  height: 40px;
+  padding: 11px 23px;
+  text-decoration: none;
+}
+
+a.xpl-button, button.xpl-button {
+  border-color: transparent;
+  border-radius: 9999px;
+  border-width: 1px;
+  display: inline-flex;
+  align-items: center;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+
+a.xpl-button:focus, button.xpl-button:focus {
+  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(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);
+  --tw-ring-offset-width: 2px;
+}
+
+a.xpl-button, button.xpl-button {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+  transition-property: background-color, border-color, color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.xpl-button i.leading {
+  margin: 0 8px 0 -4px;
+}
+
+.xpl-button--sm i.leading {
+  margin-right: 6px;
+}
+
+.xpl-button--xs i.leading {
+  margin-right: 4px;
+}
+
+.xpl-button i.trailing {
+  margin: 0 -4px 0 8px;
+}
+
+.xpl-button--sm i.trailing {
+  margin-left: 6px;
+}
+
+.xpl-button--xs i.trailing {
+  margin-left: 4px;
+}
+
+.dark a.xpl-button,
+.dark button.xpl-button {
+  --tw-ring-offset-color: #212633; /* gray-900 */
+  background-color: var(--xpl-darkmode-secondary);
+}
+
+.dark a.xpl-button, .dark button.xpl-button {
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+a.xpl-button:hover,
+button.xpl-button:hover {
+  background-color: var(--xpl-secondary-dark);
+}
+
+a.xpl-button:hover, button.xpl-button:hover {
+  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+a.xpl-button:focus,
+button.xpl-button:focus {
+  --tw-ring-color: var(--xpl-secondary-light);
+}
+
+button.xpl-button:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgba(228, 230, 235, var(--tw-bg-opacity));
+  cursor: not-allowed;
+  --tw-shadow: 0 0 #0000;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.dark a.xpl-button:hover,
+.dark button.xpl-button:hover {
+  background-color: var(--xpl-darkmode-secondary-dark);
+}
+
+.dark button.xpl-button:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgba(68, 75, 92, var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(157, 163, 175, var(--tw-text-opacity));
+}
+
+a.xpl-button--secondary, button.xpl-button--secondary {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+.dark a.xpl-button--secondary, .dark button.xpl-button--secondary {
+  background-color: transparent;
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+a.xpl-button--secondary:hover,
+button.xpl-button--secondary:hover {
+  border-color: var(--xpl-secondary);
+}
+
+a.xpl-button--secondary:hover, button.xpl-button--secondary:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+button.xpl-button--secondary:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgba(245, 247, 250, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+}
+
+.dark a.xpl-button--secondary:hover,
+.dark button.xpl-button--secondary:hover {
+  border-color: var(--xpl-darkmode-secondary);
+}
+
+.dark a.xpl-button--secondary:hover, .dark button.xpl-button--secondary:hover {
+  background-color: transparent;
+}
+
+.dark a.xpl-button--secondary:focus,
+.dark button.xpl-button--secondary:focus {
+  --tw-ring-color: var(--xpl-darkmode-secondary);
+}
+
+.dark a.xpl-button--secondary:active,
+.dark button.xpl-button--secondary:active {
+  --tw-ring-color: var(--xpl-darkmode-secondary-extra-dark);
+}
+
+.dark button.xpl-button--secondary:disabled {
+  background-color: transparent;
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+}
+
+a.xpl-button--subtle, button.xpl-button--subtle {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  border-style: none;
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+.dark a.xpl-button--subtle, .dark button.xpl-button--subtle {
+  background-color: transparent;
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+a.xpl-button--subtle:hover, button.xpl-button--subtle:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(245, 247, 250, var(--tw-bg-opacity));
+}
+
+a.xpl-button--subtle:focus, button.xpl-button--subtle:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgba(245, 247, 250, var(--tw-bg-opacity));
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(228, 230, 235, var(--tw-ring-opacity));
+}
+
+a.xpl-button--subtle:active, button.xpl-button--subtle:active {
+  --tw-bg-opacity: 1;
+  background-color: rgba(228, 230, 235, var(--tw-bg-opacity));
+}
+
+button.xpl-button--subtle:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.dark a.xpl-button--subtle:hover, .dark button.xpl-button--subtle:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(55, 62, 78, var(--tw-bg-opacity));
+}
+
+.dark a.xpl-button--subtle:focus, .dark button.xpl-button--subtle:focus {
+  background-color: transparent;
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(55, 62, 78, var(--tw-ring-opacity));
+}
+
+.dark a.xpl-button--subtle:active, .dark button.xpl-button--subtle:active {
+  --tw-bg-opacity: 1;
+  background-color: rgba(68, 75, 92, var(--tw-bg-opacity));
+}
+
+.dark button.xpl-button--subtle:disabled {
+  background-color: transparent;
+  --tw-text-opacity: 1;
+  color: rgba(157, 163, 175, var(--tw-text-opacity));
+}
+
+a.xpl-button--warning, button.xpl-button--warning {
+  --tw-bg-opacity: 1;
+  background-color: rgba(194, 33, 15, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(194, 33, 15, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark a.xpl-button--warning, .dark button.xpl-button--warning {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 147, 135, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(255, 147, 135, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+a.xpl-button--warning:hover, button.xpl-button--warning:hover, a.xpl-button--warning:active, button.xpl-button--warning:active {
+  --tw-bg-opacity: 1;
+  background-color: rgba(150, 19, 5, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(150, 19, 5, var(--tw-border-opacity));
+}
+
+a.xpl-button--warning:focus, button.xpl-button--warning:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(194, 33, 15, var(--tw-ring-opacity));
+}
+
+button.xpl-button--warning:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgba(228, 230, 235, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.dark a.xpl-button--warning:hover, .dark button.xpl-button--warning:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(248, 114, 99, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(248, 114, 99, var(--tw-border-opacity));
+}
+
+.dark a.xpl-button--warning:focus, .dark button.xpl-button--warning:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgba(255, 147, 135, var(--tw-ring-opacity));
+}
+
+.dark a.xpl-button--warning:active, .dark button.xpl-button--warning:active {
+  --tw-bg-opacity: 1;
+  background-color: rgba(248, 114, 99, var(--tw-bg-opacity));
+}
+
+.dark button.xpl-button--warning:disabled {
+  --tw-bg-opacity: 1;
+  background-color: rgba(68, 75, 92, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(68, 75, 92, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(157, 163, 175, var(--tw-text-opacity));
+}
+
+a.xpl-button--sm,
+button.xpl-button--sm {
+  padding: 7px 15px;
+  height: 32px;
+}
+
+a.xpl-button--sm, button.xpl-button--sm {
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+a.xpl-button--xs,
+button.xpl-button--xs {
+  padding: 3px 9px;
+  height: 24px;
+}
+
+a.xpl-button--xs, button.xpl-button--xs {
+  font-size: 0.625rem;
+  line-height: 0.875rem;
+}
+
+a.xpl-button--icon-only,
+button.xpl-button--icon-only {
+  width: 44px;
+}
+
+a.xpl-button--icon-only, button.xpl-button--icon-only {
+  padding-right: 0px;
+  padding-left: 0px;
+  text-align: center;
+}
+
+a.xpl-button--sm.xpl-button--icon-only,
+button.xpl-button--sm.xpl-button--icon-only {
+  width: 32px;
+}
+
+a.xpl-button--xs.xpl-button--icon-only,
+button.xpl-button--xs.xpl-button--icon-only {
+  width: 24px;
+}
+
+.xpl-button--icon-only i {
+  transform: scale(1.2);
+  width: 100%;
+}
+
+.xpl-button--icon-only.xpl-button--sm i {
+  transform: scale(1.25);
+}
+
+.xpl-button--icon-only.xpl-button--xs i {
+  transform: scale(1);
+}
+
+/**
+ * TODO: A lot of this is copied and pasted from radio.css
+ * (especially container, label, description). Could probably condense
+ * both into a single helper/utility class for layout, type, etc.
+ */
+
+.xpl-checkbox-container {
+  display: flex;
+  margin-bottom: 1.5rem;
+}
+
+.xpl-checkbox {
+  border-radius: 4px;
+  border-color: #d1d5db;
+  height: 16px;
+  top: 2px;
+  transition-property: border background-color;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+  width: 16px;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  border-width: 1px;
+  cursor: pointer;
+}
+
+.xpl-checkbox:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+
+.xpl-checkbox {
+  position: relative;
+}
+
+.xpl-checkbox: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);
+  --tw-ring-offset-width: 2px;
+}
+
+.xpl-checkbox::after {
+  background-position: calc(50% - 2px) calc(50% - 1px);
+  content: "";
+  height: 16px;
+  width: 16px;
+  background-repeat: no-repeat;
+  display: block;
+  opacity: 0;
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.dark .xpl-checkbox {
+  --tw-ring-offset-color: #212633;
+  background-color: #212633;
+  border-color: #d1d5db;
+}
+
+.xpl-checkbox:hover {
+  background-color: #ced2db;
+}
+
+.xpl-checkbox:checked {
+  background-color: var(--xpl-secondary);
+}
+
+.xpl-checkbox:indeterminate {
+  background-color: var(--xpl-secondary);
+  border-color: var(--xpl-secondary);
+}
+
+.xpl-checkbox:indeterminate::after {
+  background-position: calc(50% - 1px) calc(50% - 1px);
+  background-image: url("data:image/svg+xml,%3Csvg width='11' height='7' viewBox='0 0 11 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 2.5L11 2.5L11 4.5L0 4.5Z' fill='white'/%3E%3C/svg%3E%0A");
+  opacity: 1;
+}
+
+.xpl-checkbox:active,
+.xpl-checkbox:checked {
+  border-color: var(--xpl-secondary);
+}
+
+.xpl-checkbox:disabled {
+  border-color: #e4e6eb; /* gray 200 */
+  --tw-bg-opacity: 1;
+  background-color: rgba(228, 230, 235, var(--tw-bg-opacity));
+  cursor: not-allowed;
+}
+
+.xpl-checkbox:focus {
+  --tw-ring-color: var(--xpl-secondary-light);
+}
+
+.xpl-checkbox:hover::after,
+.xpl-checkbox:checked::after {
+  background-image: url("data:image/svg+xml,%3Csvg width='11' height='8' viewBox='0 0 11 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.37866 7.6145C4.57397 7.80981 4.90601 7.80981 5.10132 7.6145L10.8435 1.87231C11.0388 1.677 11.0388 1.34497 10.8435 1.14966L10.1404 0.446533C9.94507 0.251221 9.63257 0.251221 9.43726 0.446533L4.74976 5.13403L2.54272 2.94653C2.34741 2.75122 2.03491 2.75122 1.8396 2.94653L1.13647 3.64966C0.941162 3.84497 0.941162 4.177 1.13647 4.37231L4.37866 7.6145Z' fill='white'/%3E%3C/svg%3E%0A");
+}
+
+.xpl-checkbox:hover::after, .xpl-checkbox:checked::after {
+  opacity: 1;
+}
+
+.dark .xpl-checkbox:hover {
+  background-color: #545d6e;
+  border-color: #545d6e;
+}
+
+.dark .xpl-checkbox:checked {
+  background-color: var(--xpl-darkmode-secondary);
+}
+
+.dark .xpl-checkbox:checked::after {
+  background-image: url("data:image/svg+xml,%3Csvg width='11' height='8' viewBox='0 0 11 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.37866 7.6145C4.57397 7.80981 4.90601 7.80981 5.10132 7.6145L10.8435 1.87231C11.0388 1.677 11.0388 1.34497 10.8435 1.14966L10.1404 0.446533C9.94507 0.251221 9.63257 0.251221 9.43726 0.446533L4.74976 5.13403L2.54272 2.94653C2.34741 2.75122 2.03491 2.75122 1.8396 2.94653L1.13647 3.64966C0.941162 3.84497 0.941162 4.177 1.13647 4.37231L4.37866 7.6145Z' fill='%23212633'/%3E%3C/svg%3E%0A");
+}
+
+.dark .xpl-checkbox:indeterminate {
+  background-color: var(--xpl-darkmode-secondary);
+  border-color: var(--xpl-darkmode-secondary);
+}
+
+.dark .xpl-checkbox:active,
+.dark .xpl-checkbox:checked {
+  border-color: var(--xpl-darkmode-secondary);
+}
+
+.dark .xpl-checkbox:disabled {
+  background-color: #666d7d;
+  border-color: #666d7d;
+}
+
+.dark .xpl-checkbox:focus {
+  --tw-ring-color: var(--xpl-darkmode-secondary-light);
+}
+
+.xpl-checkbox + label {
+  cursor: pointer;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  padding-right: 1rem;
+  padding-left: 1rem;
+  vertical-align: middle;
+}
+
+.xpl-checkbox:disabled + label {
+  color: #666d7d;
+  cursor: not-allowed;
+}
+
+.dark .xpl-checkbox + label {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .xpl-checkbox:disabled + label {
+  color: #ced3db;
+}
+
+.xpl-checkbox + label small {
+  display: block;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.dark .xpl-checkbox + label small {
+  color: #ced3db;
+}
+
+.xpl-pagination {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+}
+
+@media (min-width: 768px) {
+  .xpl-pagination {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+}
+
+.xpl-pagination p {
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-bottom: 0.5rem;
+  --tw-text-opacity: 1;
+  color: rgba(68, 75, 92, var(--tw-text-opacity));
+}
+
+@media (min-width: 768px) {
+  .xpl-pagination p {
+    padding-bottom: 0px;
+  }
+}
+
+.xpl-pagination span {
+  font-weight: 500;
+}
+
+.xpl-pagination nav > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(-1px * var(--tw-space-x-reverse));
+  margin-left: calc(-1px * calc(1 - var(--tw-space-x-reverse)));
+}
+
+.xpl-pagination nav {
+  border-radius: 0.375rem;
+  display: inline-flex;
+  position: relative;
+  --tw-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+  z-index: 0;
+}
+
+.xpl-pagination svg {
+  height: 1.25rem;
+  width: 1.25rem;
+  fill: currentColor;
+}
+
+.xpl-pagination .xpl-pagination-prev {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+.xpl-pagination .xpl-pagination-prev:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(250, 251, 252, var(--tw-bg-opacity));
+}
+
+.xpl-pagination .xpl-pagination-prev {
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+  border-top-left-radius: 0.375rem;
+  border-bottom-left-radius: 0.375rem;
+  border-width: 1px;
+  display: inline-flex;
+  align-items: center;
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  position: relative;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.xpl-pagination .xpl-pagination-next {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+.xpl-pagination .xpl-pagination-next:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(250, 251, 252, var(--tw-bg-opacity));
+}
+
+.xpl-pagination .xpl-pagination-next {
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+  border-top-right-radius: 0.375rem;
+  border-bottom-right-radius: 0.375rem;
+  border-width: 1px;
+  display: inline-flex;
+  align-items: center;
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+  position: relative;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.xpl-pagination .xpl-pagination-prev span, .xpl-pagination .xpl-pagination-next span {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}
+
+.xpl-pagination a, .xpl-pagination button {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+.xpl-pagination a:hover, .xpl-pagination button:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(250, 251, 252, var(--tw-bg-opacity));
+}
+
+.xpl-pagination a, .xpl-pagination button {
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+  border-width: 1px;
+  display: inline-flex;
+  align-items: center;
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  position: relative;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.xpl-pagination-ellipsis {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+  border-width: 1px;
+  display: inline-flex;
+  align-items: center;
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  position: relative;
+  --tw-text-opacity: 1;
+  color: rgba(68, 75, 92, var(--tw-text-opacity));
+}
+
+.xpl-pagination .xpl-pagination-current {
+  --tw-bg-opacity: 1;
+  background-color: rgba(238, 242, 255, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(99, 102, 241, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(79, 70, 229, var(--tw-text-opacity));
+  z-index: 10;
+}
+
+.xpl-pagination .xpl-pagination-current:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgba(238, 242, 255, var(--tw-bg-opacity));
+}
+
+.xpl-pagination .xpl-pagination-show-md {
+  display: none;
+}
+
+@media (min-width: 768px) {
+  .xpl-pagination .xpl-pagination-show-md {
+    display: inline-flex;
+  }
+}
+
+.xpl-radio-container {
+  display: flex;
+  margin-bottom: 1.5rem;
+}
+
+.xpl-radio {
+  border-color: #d1d5db;
+  height: 16px;
+  top: 2px;
+  transition-property: border;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+  width: 16px;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border-radius: 9999px;
+  border-width: 1px;
+  cursor: pointer;
+}
+
+.xpl-radio:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+
+.xpl-radio {
+  position: relative;
+}
+
+.xpl-radio: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);
+  --tw-ring-offset-width: 2px;
+}
+
+.dark .xpl-radio {
+  --tw-ring-offset-color: #212633;
+  border-color: #ced3db;
+}
+
+.xpl-radio:hover,
+.xpl-radio:checked {
+  border-width: 4px;
+}
+
+.xpl-radio:active,
+.xpl-radio:checked {
+  border-color: var(--xpl-secondary);
+}
+
+.xpl-radio:disabled {
+  border-color: #e4e6eb; /* gray 200 */
+  --tw-bg-opacity: 1;
+  background-color: rgba(228, 230, 235, var(--tw-bg-opacity));
+  cursor: not-allowed;
+}
+
+.xpl-radio:focus {
+  --tw-ring-color: var(--xpl-secondary-light);
+}
+
+.dark .xpl-radio:active,
+.dark .xpl-radio:checked {
+  border-color: var(--xpl-darkmode-secondary);
+}
+
+.dark .xpl-radio:disabled {
+  background-color: #666d7d;
+  border-color: #666d7d;
+}
+
+.dark .xpl-radio:focus {
+  --tw-ring-color: var(--xpl-darkmode-secondary-light);
+}
+
+.xpl-radio + label {
+  cursor: pointer;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  padding-right: 1rem;
+  padding-left: 1rem;
+  vertical-align: middle;
+}
+
+.xpl-radio:disabled + label {
+  color: #666d7d;
+  cursor: not-allowed;
+}
+
+.dark .xpl-radio + label {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .xpl-radio:disabled + label {
+  color: #ced3db;
+}
+
+.xpl-radio + label small {
+  display: block;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.dark .xpl-radio + label small {
+  color: #ced3db;
+}
+
+.xpl-table-container {
+  --tw-border-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-border-opacity));
+  border-radius: 0.375rem;
+  border-width: 1px;
+  overflow: auto;
+  --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+.dark .xpl-table-container {
+  --tw-bg-opacity: 1;
+  background-color: rgba(33, 38, 51, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(55, 62, 78, var(--tw-border-opacity));
+}
+
+.xpl-table > :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));
+  --tw-divide-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-divide-opacity));
+}
+
+.xpl-table {
+  min-width: 100%;
+}
+
+.dark .xpl-table > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-opacity: 1;
+  border-color: rgba(55, 62, 78, var(--tw-divide-opacity));
+}
+
+.xpl-table--abs {
+  position: absolute;
+}
+
+.xpl-table thead th {
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  text-align: left;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+  white-space: nowrap;
+}
+
+.xpl-table-row-selected td {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgba(244, 242, 255, var(--tw-bg-opacity)) !important;
+}
+
+.xpl-table tbody tr td {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+  padding-left: 1.5rem;
+  padding-right: 1.5rem;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+  white-space: nowrap;
+}
+
+.dark .xpl-table-row-selected td {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgba(55, 62, 78, var(--tw-bg-opacity)) !important;
+}
+
+.xpl-table--freeze thead th:first-child,
+.xpl-table--freeze tbody td:first-child {
+  border-right-width: 1px;
+}
+
+.xpl-table--freeze thead th:first-child, .xpl-table--freeze tbody td:first-child {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-border-opacity));
+  position: sticky;
+  left: 0px;
+  z-index: 10;
+}
+
+.xpl-table--freeze thead th:first-child {
+  --tw-bg-opacity: 1;
+  background-color: rgba(250, 251, 252, var(--tw-bg-opacity));
+}
+
+.xpl-table tbody tr td:first-child, .xpl-table p {
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+.dark .xpl-table thead th {
+  --tw-text-opacity: 1;
+  color: rgba(206, 211, 219, var(--tw-text-opacity));
+}
+
+.dark .xpl-table tbody tr td {
+  --tw-text-opacity: 1;
+  color: rgba(206, 211, 219, var(--tw-text-opacity));
+}
+
+.dark .xpl-table--freeze thead th:first-child {
+  --tw-bg-opacity: 1;
+  background-color: rgba(37, 43, 57, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(55, 62, 78, var(--tw-border-opacity));
+}
+
+.dark .xpl-table--freeze tbody td:first-child {
+  --tw-bg-opacity: 1;
+  background-color: rgba(33, 38, 51, var(--tw-bg-opacity));
+  --tw-border-opacity: 1;
+  border-color: rgba(55, 62, 78, var(--tw-border-opacity));
+}
+
+.xpl-table--freeze thead th:first-child::after,
+.xpl-table--freeze tbody td:first-child::after {
+  background:
+    linear-gradient(
       90deg,
       #e4e6eb 0%,
       #e4e6eb 0.01%,
       rgba(228, 230, 235, 0) 100%
-    );content:"";width:24px}.xpl-table--freeze thead th:first-child::after,.xpl-table--freeze tbody td:first-child::after{display:block;height:100%;opacity:0;position:absolute;top:0px;left:100%;transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.xpl-table--has-scrolled thead th:first-child::after,.xpl-table--has-scrolled tbody td:first-child::after{opacity:1}.dark .xpl-table--freeze thead th:first-child::after,.dark .xpl-table--freeze tbody td:first-child::after{background:linear-gradient(
+    );
+  content: "";
+  width: 24px;
+}
+
+.xpl-table--freeze thead th:first-child::after, .xpl-table--freeze tbody td:first-child::after {
+  display: block;
+  height: 100%;
+  opacity: 0;
+  position: absolute;
+  top: 0px;
+  left: 100%;
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
+.xpl-table--has-scrolled thead th:first-child::after, .xpl-table--has-scrolled tbody td:first-child::after {
+  opacity: 1;
+}
+
+.dark .xpl-table--freeze thead th:first-child::after,
+.dark .xpl-table--freeze tbody td:first-child::after {
+  background:
+    linear-gradient(
       90deg,
       rgba(0, 0, 0, 0.4) 0%,
       rgba(0, 0, 0, 0) 100%
-    )}.xpl-table thead{--tw-bg-opacity:1;background-color:rgba(250, 251, 252, var(--tw-bg-opacity))}.dark .xpl-table thead{--tw-bg-opacity:1;background-color:rgba(37, 43, 57, var(--tw-bg-opacity))}.xpl-table tbody>: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));--tw-divide-opacity:1;border-color:rgba(228, 230, 235, var(--tw-divide-opacity))}.xpl-table tbody{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity))}.dark .xpl-table tbody>:not([hidden])~:not([hidden]){--tw-divide-opacity:1;border-color:rgba(68, 75, 92, var(--tw-divide-opacity))}.dark .xpl-table tbody{background-color:transparent}.xpl-table.xpl-table--striped tbody tr:nth-child(2n) td{--tw-bg-opacity:1;background-color:rgba(250, 251, 252, var(--tw-bg-opacity))}.dark .xpl-table tbody tr td:first-child,.dark .xpl-table p{--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.dark .xpl-table.xpl-table--striped tbody tr:nth-child(2n) td{--tw-bg-opacity:1;background-color:rgba(37, 43, 57, var(--tw-bg-opacity))}.xpl-table .wrap{white-space:normal}.xpl-table a{--tw-text-opacity:1;color:rgba(79, 70, 229, var(--tw-text-opacity))}.xpl-table a:hover{--tw-text-opacity:1;color:rgba(49, 46, 129, var(--tw-text-opacity))}.xpl-table label{cursor:pointer;display:flex;align-items:center}.xpl-table input[type="checkbox"]{cursor:pointer;margin-right:1.5rem}.xpl-tabs{margin-bottom:0.75rem;overflow-x:auto}.xpl-tabs nav>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(2rem * var(--tw-space-x-reverse));margin-left:calc(2rem * calc(1 - var(--tw-space-x-reverse)))}.xpl-tabs nav{--tw-border-opacity:1;border-color:rgba(228, 230, 235, var(--tw-border-opacity));border-bottom-width:1px;display:flex;min-width:100%}.xpl-tabs a,.xpl-tabs button{border-color:transparent}.xpl-tabs a:hover,.xpl-tabs button:hover{--tw-border-opacity:1;border-color:rgba(228, 230, 235, var(--tw-border-opacity))}.xpl-tabs a,.xpl-tabs button{border-bottom-width:2px;display:flex;font-weight:500;font-size:0.75rem;line-height:1rem;padding-left:0.25rem;padding-right:0.25rem;padding-top:1rem;padding-bottom:1rem;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.xpl-tabs a:hover,.xpl-tabs button:hover{--tw-text-opacity:1;color:rgba(68, 75, 92, var(--tw-text-opacity))}.xpl-tabs a,.xpl-tabs button{white-space:nowrap}.xpl-tabs a span,.xpl-tabs button span{--tw-bg-opacity:1;background-color:rgba(245, 247, 250, var(--tw-bg-opacity));border-radius:9999px;font-weight:500;font-size:0.625rem;line-height:0.875rem;margin-left:0.75rem;padding-top:0.125rem;padding-bottom:0.125rem;padding-left:0.625rem;padding-right:0.625rem;--tw-text-opacity:1;color:rgba(33, 38, 51, var(--tw-text-opacity))}.xpl-tabs a.current,.xpl-tabs button.current{--tw-border-opacity:1;border-color:rgba(99, 102, 241, var(--tw-border-opacity));--tw-text-opacity:1;color:rgba(79, 70, 229, var(--tw-text-opacity))}.xpl-tabs a.current span,.xpl-tabs button.current span{--tw-bg-opacity:1;background-color:rgba(224, 231, 255, var(--tw-bg-opacity));--tw-text-opacity:1;color:rgba(79, 70, 229, var(--tw-text-opacity))}.xpl-utility-bar ul>*{display:grid;align-content:center}.xpl-utility-bar ul:nth-child(2)>*{margin-left:0.5rem}.xpl-utility-bar ul:nth-child(2){justify-self:end}.xpl-utility-bar ul:first-child>*{margin-right:0.5rem}.xpl-utility-bar ul:first-child{justify-self:start}.xpl-utility-bar ul{display:grid;align-content:center;grid-auto-flow:column}.xpl-utility-bar{--tw-bg-opacity:1;background-color:rgba(255, 255, 255, var(--tw-bg-opacity))}.dark .xpl-utility-bar{--tw-bg-opacity:1;background-color:rgba(37, 43, 57, var(--tw-bg-opacity))}.xpl-utility-bar{--tw-border-opacity:1;border-color:rgba(206, 211, 219, var(--tw-border-opacity))}.dark .xpl-utility-bar{--tw-border-opacity:1;border-color:rgba(68, 75, 92, var(--tw-border-opacity))}.xpl-utility-bar{border-bottom-width:1px;display:grid;padding-top:0.75rem;padding-bottom:0.75rem;padding-left:1rem;padding-right:1rem;--tw-text-opacity:1;color:rgba(102, 109, 125, var(--tw-text-opacity))}.dark .xpl-utility-bar{--tw-text-opacity:1;color:rgba(206, 211, 219, var(--tw-text-opacity))}.xpl-utility-bar{grid-auto-flow:column}@media (min-width: 640px){.xpl-utility-bar{padding-left:1.5rem;padding-right:1.5rem}}
+    );
+}
+
+.xpl-table thead {
+  --tw-bg-opacity: 1;
+  background-color: rgba(250, 251, 252, var(--tw-bg-opacity));
+}
+
+.dark .xpl-table thead {
+  --tw-bg-opacity: 1;
+  background-color: rgba(37, 43, 57, var(--tw-bg-opacity));
+}
+
+.xpl-table tbody > :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));
+  --tw-divide-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-divide-opacity));
+}
+
+.xpl-table tbody {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+.dark .xpl-table tbody > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-opacity: 1;
+  border-color: rgba(68, 75, 92, var(--tw-divide-opacity));
+}
+
+.dark .xpl-table tbody {
+  background-color: transparent;
+}
+
+.xpl-table.xpl-table--striped tbody tr:nth-child(2n) td {
+  --tw-bg-opacity: 1;
+  background-color: rgba(250, 251, 252, var(--tw-bg-opacity));
+}
+
+.dark .xpl-table tbody tr td:first-child, .dark .xpl-table p {
+  --tw-text-opacity: 1;
+  color: rgba(255, 255, 255, var(--tw-text-opacity));
+}
+
+.dark .xpl-table.xpl-table--striped tbody tr:nth-child(2n) td {
+  --tw-bg-opacity: 1;
+  background-color: rgba(37, 43, 57, var(--tw-bg-opacity));
+}
+
+.xpl-table .wrap {
+  white-space: normal;
+}
+
+.xpl-table a {
+  --tw-text-opacity: 1;
+  color: rgba(79, 70, 229, var(--tw-text-opacity));
+}
+
+.xpl-table a:hover {
+  --tw-text-opacity: 1;
+  color: rgba(49, 46, 129, var(--tw-text-opacity));
+}
+
+.xpl-table label {
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+}
+
+.xpl-table input[type="checkbox"] {
+  cursor: pointer;
+  margin-right: 1.5rem;
+}
+
+.xpl-tabs {
+  margin-bottom: 0.75rem;
+  overflow-x: auto;
+}
+
+.xpl-tabs nav > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(2rem * var(--tw-space-x-reverse));
+  margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
+.xpl-tabs nav {
+  --tw-border-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-border-opacity));
+  border-bottom-width: 1px;
+  display: flex;
+  min-width: 100%;
+}
+
+.xpl-tabs a, .xpl-tabs button {
+  border-color: transparent;
+}
+
+.xpl-tabs a:hover, .xpl-tabs button:hover {
+  --tw-border-opacity: 1;
+  border-color: rgba(228, 230, 235, var(--tw-border-opacity));
+}
+
+.xpl-tabs a, .xpl-tabs button {
+  border-bottom-width: 2px;
+  display: flex;
+  font-weight: 500;
+  font-size: 0.75rem;
+  line-height: 1rem;
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.xpl-tabs a:hover, .xpl-tabs button:hover {
+  --tw-text-opacity: 1;
+  color: rgba(68, 75, 92, var(--tw-text-opacity));
+}
+
+.xpl-tabs a, .xpl-tabs button {
+  white-space: nowrap;
+}
+
+.xpl-tabs a span, .xpl-tabs button span {
+  --tw-bg-opacity: 1;
+  background-color: rgba(245, 247, 250, var(--tw-bg-opacity));
+  border-radius: 9999px;
+  font-weight: 500;
+  font-size: 0.625rem;
+  line-height: 0.875rem;
+  margin-left: 0.75rem;
+  padding-top: 0.125rem;
+  padding-bottom: 0.125rem;
+  padding-left: 0.625rem;
+  padding-right: 0.625rem;
+  --tw-text-opacity: 1;
+  color: rgba(33, 38, 51, var(--tw-text-opacity));
+}
+
+.xpl-tabs a.current, .xpl-tabs button.current {
+  --tw-border-opacity: 1;
+  border-color: rgba(99, 102, 241, var(--tw-border-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(79, 70, 229, var(--tw-text-opacity));
+}
+
+.xpl-tabs a.current span, .xpl-tabs button.current span {
+  --tw-bg-opacity: 1;
+  background-color: rgba(224, 231, 255, var(--tw-bg-opacity));
+  --tw-text-opacity: 1;
+  color: rgba(79, 70, 229, var(--tw-text-opacity));
+}
+
+.xpl-utility-bar ul > * {
+      display: grid;
+      align-content: center;
+    }
+
+.xpl-utility-bar ul:nth-child(2) > * {
+        margin-left: 0.5rem;
+      }
+
+.xpl-utility-bar ul:nth-child(2) {
+      justify-self: end;
+}
+
+.xpl-utility-bar ul:first-child > * {
+        margin-right: 0.5rem;
+      }
+
+.xpl-utility-bar ul:first-child {
+      justify-self: start;
+}
+
+.xpl-utility-bar ul {
+    display: grid;
+    align-content: center;
+    grid-auto-flow: column;
+}
+
+.xpl-utility-bar {
+  --tw-bg-opacity: 1;
+  background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
+}
+
+.dark .xpl-utility-bar {
+  --tw-bg-opacity: 1;
+  background-color: rgba(37, 43, 57, var(--tw-bg-opacity));
+}
+
+.xpl-utility-bar {
+  --tw-border-opacity: 1;
+  border-color: rgba(206, 211, 219, var(--tw-border-opacity));
+}
+
+.dark .xpl-utility-bar {
+  --tw-border-opacity: 1;
+  border-color: rgba(68, 75, 92, var(--tw-border-opacity));
+}
+
+.xpl-utility-bar {
+  border-bottom-width: 1px;
+  display: grid;
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  --tw-text-opacity: 1;
+  color: rgba(102, 109, 125, var(--tw-text-opacity));
+}
+
+.dark .xpl-utility-bar {
+  --tw-text-opacity: 1;
+  color: rgba(206, 211, 219, var(--tw-text-opacity));
+}
+
+.xpl-utility-bar {
+  grid-auto-flow: column;
+}
+
+@media (min-width: 640px) {
+  .xpl-utility-bar {
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
+  }
+}