@charset "UTF-8";@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap");@import url("https://fonts.googleapis.com/css2?family=Fira+Code&:wght@0,100..700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap");@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap");@import url("https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap");/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: rotateX(0);
      --tw-rotate-y: rotateY(0);
      --tw-rotate-z: rotateZ(0);
      --tw-skew-x: skewX(0);
      --tw-skew-y: skewY(0);
      --tw-border-style: solid;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --spacing: .25rem;
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  }
}

@layer base, components;

@layer utilities {
  .visible {
    visibility: visible;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }

  .mt-6 {
    margin-top: calc(var(--spacing) * 6);
  }

  .mr-4 {
    margin-right: calc(var(--spacing) * 4);
  }

  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-block {
    display: inline-block;
  }

  .table {
    display: table;
  }

  .w-fit {
    width: fit-content;
  }

  .flex-shrink {
    flex-shrink: 1;
  }

  .flex-grow {
    flex-grow: 1;
  }

  .transform {
    transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
  }

  .resize {
    resize: both;
  }

  .list-decimal {
    list-style-type: decimal;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .justify-end {
    justify-content: flex-end;
  }

  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }

  .rounded {
    border-radius: .25rem;
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .bg-transparent {
    background-color: #0000;
  }

  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }

  .pb-4 {
    padding-bottom: calc(var(--spacing) * 4);
  }

  .text-center {
    text-align: center;
  }

  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .text-wrap {
    text-wrap: wrap;
  }

  .capitalize {
    text-transform: capitalize;
  }

  .lowercase {
    text-transform: lowercase;
  }

  .italic {
    font-style: italic;
  }

  .underline {
    text-decoration-line: underline;
  }

  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .filter {
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .backdrop-filter {
    -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  }

  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
}

@media (min-width: 40rem) {
  .container {
    max-width: unset;
  }
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
  initial-value: rotateX(0);
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
  initial-value: rotateY(0);
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
  initial-value: rotateZ(0);
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false;
  initial-value: skewX(0);
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false;
  initial-value: skewY(0);
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false
}







:root {
  color-scheme: light dark;
  --font-poppins: "Poppins", sans-serif;
  --font: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Fira Code", monospace;
  --font-text: "Inter", sans-serif;
  --font-serif: "DM Serif Display", serif;
  --contrast: #fff;
  --bg-100: #1c1e22;
  --bg-200: #282c34;
  --bg-300: #23272e;
  --bg-alt: #fff;
  --selection-bg: #435880;
  --selection-text: #fff;
  --scrollthumb: #3b414f;
  --scrollthumb-hover: #2e343d;
  --red: #ff5b5b;
  --green: #7adf55;
  --orange: #d27d06;
  --url: #3792dc;
  --accent: var(--accent-500);
  --accent-100: #849193;
  --accent-200: #98dbff;
  --accent-300: #7ec2ff;
  --accent-400: #65a2d4;
  --accent-500: #4692d1;
  --accent-600: #247bb8;
  --accent-700: #0065a0;
  --accent-800: #004f88;
  --accent-900: #003b71;
  --accent-dark: #2c374d;
  --secondary: #059a84;
  --mono: var(--mono-base);
  --mono-light: hsl(218, 12%, 20%);
  --mono-soft: hsl(206, 10%, 31%);
  --mono-base: #6a777f;
  --mono-mid: hsl(215, 9%, 53%);
  --mono-dark: hsl(214, 12%, 35%);
  --border-light: #23272e;
  --border-base: #3b3b3b;
  --border-mid: #3b3b3b;
  --input-disabled: hsl(207, 15%, 15%);
  --input-light: var(--bg-200);
  --input-base: color-mix(in srgb, var(--bg-200) 50%, var(--bg-100));
  --text: var(--text-base);
  --text-alt: #fff;
  --text-disabled: var(--mono-base);
  --text-light: hsl(202, 12%, 50%);
  --text-soft: color-mix(in srgb, var(--text-light), 50% var(--text-base));
  --text-base: #c9d7e0;
  --text-dark: #a0a2a3;
  --text-inverse: #f1f1f1;
  --tooltip-background: #51595d;
  --card-box-shadow: 0px 0px 0px transparent;
}
* {
  box-sizing: border-box;
  scrollbar-width: thin;
  --accent-light: color-mix(in srgb, var(--accent), 75% transparent);
  --bg-150: color-mix(in srgb, var(--bg-200), 50% var(--bg-100));
  --primary: var(--accent);
  --focus-visible-outline: 4px solid var(--accent-200);
  --border: var(--border-base);
}
* input {
  color-scheme: dark;
}
* .light {
  --contrast: #000;
  --secondary: #1cc1a8;
  --box-shadow: 0px 4px 8px 4px color-mix(in srgb, var(--text) 12%, transparent);
  --bg-100: #ffffff;
  --bg-200: #ebedef;
  --bg-300: #d8dee9;
  --bg-alt: #1c1e22;
  --selection-bg: var(--accent-300);
  --selection-text: var(--text);
  --scrollthumb: #cdcdcd;
  --scrollthumb-hover: #aeaeae;
  --red: #e9686a;
  --green: #38ae48;
  --orange: #eb812e;
  --url: #1a6eb2;
  --accent: var(--accent-500);
  --accent-100: #849193;
  --accent-200: #98dbff;
  --accent-300: #7ec2ff;
  --accent-400: #65a2d4;
  --accent-500: #4185f4;
  --mono: var(--mono-base);
  --mono-light: hsl(217, 12%, 87%);
  --mono-soft: color-mix(in srgb, var(--mono-light), 50% var(--mono-base));
  --mono-base: hsl(214, 5%, 60%);
  --mono-mid: hsl(215, 9%, 53%);
  --mono-dark: hsl(214, 12%, 35%);
  --border-light: #e0e0e0;
  --border-base: #dfe0e2;
  --border-mid: #bebfc0;
  --input-disabled: #f5f5f5;
  --input-light: var(--bg-200);
  --input-base: color-mix(in srgb, var(--bg-200) 50%, var(--bg-100));
  --text: var(--text-base);
  --text-alt: #f3f3f3;
  --text-disabled: var(--mono-base);
  --text-light: #91969e;
  --text-soft: color-mix(in srgb, var(--text-light), 50% var(--text-base));
  --text-base: #344856;
  --text-dark: #37393b;
  --text-inverse: #1d1d1d;
  --tooltip-background: #626b6e;
}
* .light input {
  color-scheme: light;
}
.scrollbar-gutter {
  scrollbar-gutter: stable;
}
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
/* Track */
::-webkit-scrollbar-track {
  border-radius: 100px;
  background-color: var(--bg-100);
}
/* Handle */
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: var(--scrollthumb);
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--scrollthumb-hover);
}
::-webkit-scrollbar-corner {
  background-color: transparent;
}
.divider {
  width: 100%;
  height: 1px;
  background-color: var(--bg, var(--border-base));
}
.divider.vertical {
  width: 1px;
  height: 100%;
}
html.bg-dark {
  background-color: #23272e;
  --scrollbar-bg: #1c1e22;
}
html.bg-light {
  background-color: #e9ecee;
  --scrollbar-bg: #fff;
}
body {
  padding: 0;
  margin: 0;
  background-color: var(--bg-100);
  color: var(--text-base);
  font-family: var(--font);
}
a {
  text-decoration: none;
  color: var(--url);
}
a:focus-visible {
  outline-offset: 0;
  outline: var(--focus-visible-outline);
  border-radius: 0.25rem;
}
a.none {
  color: inherit;
}
a.button,
button {
  font-family: var(--font);
  border: 0;
  font-size: 1rem;
  border-radius: 0.5rem;
  cursor: pointer;
  --padding-block: var(--py, 0.375rem);
  --padding-inline: var(--px, 1rem);
  --hover-opacity: 12%;
  --text-color: var(--text);
  --button-bg: var(--bg-200);
  --border-color: var(--mono-soft);
  padding-block: var(--padding-block);
  padding-inline: var(--padding-inline);
  background-color: var(--button-bg, var(--accent));
  color: var(--text-color);
  padding-block: calc(var(--padding-block) - 1px);
  border: 1px solid var(--border-color);
}
a.button.round,
button.round {
  text-align: center;
  border-radius: 100px;
  padding-inline: 2rem;
}
a.button.accent-2,
button.accent-2 {
  --button-bg: var(--orange);
}
a.button:hover,
button:hover {
  --hover-opacity: 6%;
  background-color: color-mix(in srgb, var(--button-bg, var(--accent)), var(--hover-opacity) #000);
}
a.button:focus,
button:focus {
  outline: none;
}
a.button:focus-visible,
button:focus-visible {
  transition: none !important;
  outline: var(--focus-visible-outline) !important;
}
a.button.primary,
button.primary {
  --button-bg: var(--accent);
  --text-color: var(--text-alt);
  border: 1px solid transparent;
}
a.button.primary:hover,
button.primary:hover {
  --hover-opacity: 12%;
}
a.button.secondary,
button.secondary {
  --button-bg: var(--secondary);
  --text-color: var(--text-alt);
  border: 1px solid transparent;
}
a.button.secondary:hover,
button.secondary:hover {
  --hover-opacity: 12%;
}
a.button.outlined,
button.outlined {
  --border-color: var(--text-color);
  --button-bg: transparent;
  --text-color: var(--accent);
  border: 1px solid var(--border-color);
  padding: calc(var(--padding-block) - 1px) calc(var(--padding-inline) - 1px);
}
a.button.outlined:hover,
button.outlined:hover {
  --hover-opacity: 12%;
  background-color: color-mix(in srgb, var(--text-color) var(--hover-opacity), var(--bg-100));
}
a.button.warning,
button.warning {
  --text-color: var(--text-alt);
  --button-bg: var(--red);
  border: 0;
}
a.button.warning.outlined,
button.warning.outlined {
  --button-bg: color-mix(in srgb, var(--red) 12%, transparent);
  --border-color: var(--red);
  border: 1px solid var(--border-color);
  --text-color: var(--red);
}
a.button.warning.outlined:hover,
button.warning.outlined:hover {
  --hover-opacity: 20%;
}
a.button.bordered,
button.bordered {
  --accent-color: var(--accent);
  --button-bg: color-mix(in srgb, var(--accent-color), 70% var(--bg-100));
  border: 1px solid var(--accent-color);
  color: var(--text);
}
a.button.bordered:hover,
button.bordered:hover {
  --button-bg: color-mix(in srgb, var(--accent-color), 65% var(--bg-100));
  background-color: var(--button-bg);
  color: var(--text-inverse);
  border-color: color-mix(in srgb, var(--accent-color), 25% var(--bg-alt));
}
a.button.none, a.button.tpx,
button.none,
button.tpx {
  --button-bg: transparent;
  border: none;
  outline: none;
  color: inherit;
  width: fit-content;
  height: fit-content;
  padding: var(--padding, 0.25rem);
  border-radius: 0.25rem;
  font-weight: inherit;
  transition: all 0.3s;
}
a.button.none:hover, a.button.tpx:hover,
button.none:hover,
button.tpx:hover {
  box-shadow: none;
  background-color: color-mix(in srgb, var(--mono-mid) 10%, transparent);
}
a.button.none.no-hover, a.button.tpx.no-hover,
button.none.no-hover,
button.tpx.no-hover {
  background-color: transparent;
}
a.button.none:focus, a.button.tpx:focus,
button.none:focus,
button.tpx:focus {
  box-shadow: none;
}
a.button.none.accent, a.button.tpx.accent,
button.none.accent,
button.tpx.accent {
  color: var(--accent);
}
a.button:disabled, a.button.disabled,
button:disabled,
button.disabled {
  --text-color: var(--text-disabled);
  --button-bg: var(--input-disabled);
  cursor: default;
  pointer-events: none;
}
a.button:disabled:hover, a.button.disabled:hover,
button:disabled:hover,
button.disabled:hover {
  background-color: var(--button-bg);
}
a.button:disabled:focus-visible, a.button.disabled:focus-visible,
button:disabled:focus-visible,
button.disabled:focus-visible {
  outline: 4px solid var(--mono) !important;
}
a.button.small,
button.small {
  font-size: 0.875rem;
  --padding-block: 0.375rem;
  --padding-inline: 0.625rem;
  border-radius: 0.375rem;
}
a.button.smaller,
button.smaller {
  font-size: 0.875rem;
  --padding-block: 0.25rem;
  --padding-inline: 0.75rem;
  border-radius: 0.375rem;
}
a.button.text,
button.text {
  padding: 0;
  padding-inline: var(--py, 0);
  width: fit-content;
  background-color: transparent;
  color: var(--text-color, var(--text));
}
a.button.no-focus:focus-visible,
button.no-focus:focus-visible {
  outline: none !important;
}
a.button.rounded,
button.rounded {
  aspect-ratio: 1;
  border-radius: 100%;
}
a.button.list,
button.list {
  width: 100%;
}
a.button.list:hover,
button.list:hover {
  background-color: var(--bg-150);
}
a.button.list.selected,
button.list.selected {
  --c: color-mix(in srgb, var(--accent), 90% transparent);
  background-color: color-mix(in srgb, var(--mono) 25%, var(--c));
}
a.button.reset,
button.reset {
  text-align: unset;
}
a.button.img,
button.img {
  padding: 0;
  border: 0;
  background-color: transparent;
}
a.button.img:focus-within, a.button.img:hover, a.button.img:focus-visible,
button.img:focus-within,
button.img:hover,
button.img:focus-visible {
  outline: none !important;
}
a.button.img:hover,
button.img:hover {
  background-color: transparent;
}
a.button.icon,
button.icon {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mono);
  --button-bg: transparent;
  border: none;
  outline: none;
  color: inherit;
  width: fit-content;
  height: fit-content;
  padding: var(--padding, 0.25rem);
  border-radius: 0.25rem;
  font-weight: inherit;
}
a.button.icon:hover,
button.icon:hover {
  box-shadow: none;
  background-color: color-mix(in srgb, var(--mono-mid) 10%, transparent);
}
a.button.icon.no-hover,
button.icon.no-hover {
  background-color: transparent;
}
a.button.icon:focus,
button.icon:focus {
  box-shadow: none;
}
input {
  font-family: inherit;
  font-size: inherit;
  outline: none;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  height: fit-content;
  max-height: 1000px;
  line-height: normal;
  font-feature-settings: "case" !important;
  color: var(--text-base);
  --outline-color: var(--mono-mid);
  line-height: normal;
  background-color: var(--input-base);
  border: 1px solid var(--border-base);
  appearance: textfield;
  -moz-appearance: textfield;
}
input.small {
  font-size: 0.875rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
}
input:focus-within {
  border: 1px solid transparent;
  outline: 1px solid var(--outline-color);
}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input:disabled {
  background-color: var(--input-disabled);
  color: var(--text-disabled);
}
input::placeholder {
  font-size: 0.875rem;
  color: var(--text-light);
  font-weight: 400;
}
input.error {
  background-color: color-mix(in srgb, var(--red) 12%, transparent);
  outline: 2px solid var(--red);
  border: 1px solid transparent;
}
input.clear {
  background-color: transparent;
  border: 0;
  transition: all 0.3s;
  --border-color: var(--border-base);
  border: 1px solid var(--border-color);
}
input.clear:hover {
  --border-color: var(--border-mid);
}
input.clear:focus-within {
  --border-color: var(--mono-mid);
  border: 1px solid var(--border-color);
  outline: 0;
}
input.clear.error {
  outline: 0;
  background-color: transparent;
  --border-color: var(--red);
}
textarea {
  font-family: inherit;
  font-size: inherit;
  outline: none;
  padding: 0.5rem;
  border-radius: 0.375rem;
  line-height: normal;
  font-feature-settings: "case" !important;
  color: var(--text-base);
  --bg-color: var(--input-base);
  line-height: normal;
  border: 1px solid var(--border-base);
  background-color: var(--bg-color);
  appearance: textfield;
  -moz-appearance: textfield;
}
textarea.small {
  font-size: 0.875rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
}
textarea::placeholder {
  font-size: 0.875rem;
  color: color-mix(in srgb, var(--text-light), 40% transparent);
  font-weight: 400;
}
textarea:focus-within {
  border: 1px solid transparent;
  outline: 1px solid var(--accent);
}
textarea::-webkit-outer-spin-button, textarea::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
textarea:disabled {
  background-color: var(--input-disabled);
  color: var(--text-disabled);
}
textarea.error {
  background-color: color-mix(in srgb, var(--red) 12%, transparent);
  outline: 2px solid var(--red);
  border: 1px solid transparent;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  --color: color-mix(in srgb, var(--accent) 12%, var(--bg-100));
  -webkit-box-shadow: 0 0 0px 10000px var(--color) inset;
}
.icon {
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--mono);
}
.icon.unset {
  color: unset;
}
.input-box {
  font-family: inherit;
  font-size: inherit;
  outline: none;
  padding-left: 0.5rem;
  border-radius: 0.5rem;
  resize: vertical;
  color: var(--text-base);
  display: flex;
  align-items: center;
  --input-box-bg: var(--input-base);
  border: 1px solid var(--border-base);
  background-color: var(--input-box-bg);
}
.input-box .icon {
  color: var(--mono-300);
}
.input-box:focus-within {
  border: 1px solid transparent;
  outline: 1px solid var(--accent);
}
.input-box .prefix {
  display: flex;
  align-items: center;
  color: var(--mono);
}
.input-box input {
  background-color: transparent;
  padding-inline: 0.5rem;
  border: 0;
  width: 100%;
}
.input-box input:focus {
  border: 0;
  outline: 0;
}
.input-box.disabled {
  background-color: var(--input-disabled);
}
.input-box.error {
  background-color: color-mix(in srgb, var(--red) 12%, transparent);
  outline: 2px solid var(--red);
  border: 1px solid transparent;
}
.input-box.clear {
  background-color: transparent;
  border: 0;
  transition: all 0.3s;
  --border-color: var(--border-base);
  border: 1px solid var(--border-color);
  outline: 0;
}
.input-box.clear:hover:not(:disabled) {
  --border-color: var(--border-mid);
}
.input-box.clear:focus-within {
  --border-color: var(--mono-mid) !important;
}
.input-box.clear.error {
  outline: 0;
  background-color: transparent;
  --border-color: var(--red);
}
.kbd-container {
  display: flex;
  gap: 0.25rem;
}
kbd {
  font-family: var(--font-mono);
  font-size: 0.875rem;
  border-radius: 0.25rem;
  padding: 2px 4px;
  color: var(--mono);
  background-color: var(--bg-100);
  border: 1px solid var(--border-base);
}
kbd.small {
  padding-block: 0;
  padding-inline: 0.125rem;
}
span.error {
  color: var(--red);
  font-size: 0.875rem;
}
.info-box {
  background-color: color-mix(in srgb, var(--mono-light), 75% transparent);
  border-radius: 0.25rem;
  padding-block: 0.375rem;
  padding-inline: 0.5rem;
  border: 1px solid var(--border-base);
  font-size: var(--font-size, 0.875rem);
}
.info-box.error, .info-box.warning {
  background-color: color-mix(in srgb, var(--red) 12%, transparent);
  border: 1px solid var(--red);
  color: var(--red);
}
.info-box.accent {
  background-color: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent);
  border: 1px solid var(--accent);
}
.info-box.success {
  background-color: color-mix(in srgb, var(--green) 12%, transparent);
  border: 1px solid var(--green);
  color: var(--green);
}
.info-box.alert {
  background-color: color-mix(in srgb, var(--orange) 12%, transparent);
  border: 1px solid var(--orange);
  color: var(--orange);
}
.header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-row .group {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.legal {
  font-size: 0.75rem;
  color: var(--text-light);
}
.legal a {
  color: var(--text);
}
.legal a:hover {
  text-decoration: underline;
}
.tags.styled {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.tags.styled .tag {
  font-size: 0.875rem;
  padding-block: 0.25rem;
  padding-inline: 0.75rem;
  display: inline;
  background-color: var(--input-base);
  border: 1px solid var(--border-base);
  color: var(--text-soft);
  border-radius: 1rem;
}
.tags.styled .tag:hover {
  border: 1px solid var(--accent);
}
h1,
h2,
h3 {
  margin: 0;
  font-weight: 600;
}
h1 {
  font-size: 2.5rem;
  font-family: var(--font-serif);
  font-weight: 500;
}
.input-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.input-group[required] label::after,
.input-group[required] span.label::after {
  content: "*";
  margin-left: 2px;
  color: var(--orange);
}
.input-group span.label {
  color: var(--text-soft);
  font-size: 0.875rem;
}
.input-group span.note {
  font-size: 0.75rem;
  color: var(--text-light);
}
.input-group label {
  color: var(--text-soft);
  font-size: 0.875rem;
}
.input-group.horizontal {
  display: flex;
  align-items: var(--align-items, flex-start);
  flex-direction: row;
  padding-block: 0.5rem;
}
@media screen and (max-width: 600px) {
  .input-group.horizontal {
    flex-direction: column;
    gap: 0.5rem;
  }
}
.button-group {
  display: flex;
  gap: 0.5rem;
}
.button-group.actions {
  display: flex;
  flex-direction: row-reverse;
  gap: 0.5rem;
}
.button-group.small a.button,
.button-group.small button {
  min-width: 80px;
  font-size: 0.875rem;
  --padding-block: 0.325rem;
  --padding-inline: 0.75rem;
  border-radius: 0.325rem;
}
table.styled {
  width: 100%;
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--text);
  background-color: var(--table__outsideBackground-color);
  --table__border-color: var(--mono-light);
  --table__background-color: var(--table-header);
  --table__outsideBackground-color: var(--bg-100);
  font-family: var(--font-table);
  border-radius: 0.25rem;
}
table.styled.light {
  --table__border-color: var(--mono-100);
}
table.styled.dark {
  --table__border-color: var(--mono-200);
}
table.styled.hover tbody tr:hover td {
  background-color: color-mix(in srgb, var(--accent-100) 6%, transparent);
}
table.styled th,
table.styled td {
  border-right: 1px solid var(--table__border-color);
  border-radius: none;
}
table.styled th > div,
table.styled td > div {
  padding-block: 0.5rem;
  padding-inline: 0.5rem;
  display: flex;
}
table.styled th > div.center,
table.styled td > div.center {
  justify-content: center;
  text-align: center;
}
table.styled th {
  border-top: 1px solid var(--table__border-color);
  border-bottom: 1px solid var(--table__border-color);
  font-size: 14px;
  font-weight: 400;
  background-color: var(--table__background-color);
  font-weight: 500;
}
table.styled th:first-child {
  border-radius: 0.25rem 0 0 0;
  border-left: 1px solid var(--table__border-color);
}
table.styled th:last-child {
  border-radius: 0 0.25rem 0 0;
}
table.styled th:nth-last-child(2) {
  border-right: 1px solid var(--table__border-color);
}
table.styled th:last-child {
  border-left: 0;
}
table.styled tbody tr:last-child td:first-child {
  border-radius: 0 0 0 0.25rem;
}
table.styled tbody tr:last-child td:last-child {
  border-radius: 0 0 0.25rem 0rem;
}
table.styled td {
  background-color: var(--bg-p);
  border-bottom: 1px solid var(--table__border-color);
}
table.styled td:first-child {
  border-left: 1px solid var(--table__border-color);
}
table.styled td:nth-last-child(2) {
  border-right: 1px solid var(--table__border-color);
}
table.styled td:last-child {
  border-left: 0;
}
table.styled td > div {
  padding-block: 0.375rem;
  white-space: break-spaces;
  gap: 2px;
  flex-wrap: wrap;
}
table.styled.noInnerBorder th:not(:last-child),
table.styled.noInnerBorder td:not(:last-child) {
  border-right: 0;
}
table.styled.noActionColumn th:nth-last-child(2) {
  border-right: 1px solid var(--table__border-color);
}
table.styled.noActionColumn th:last-child {
  border-left: 0;
}
table.styled.noActionColumn td:nth-last-child(2) {
  border-right: 1px solid var(--table__border-color);
}
table.styled.noActionColumn td:last-child {
  border-left: 0;
}
table.styled.horizontal th {
  border-radius: 0;
  text-align: left;
  font-size: 0.875rem;
  border-top: 0;
}
table.styled.horizontal td {
  border: 1px solid var(--table__border-color);
  border-top: 0;
  text-align: left;
  font-size: 0.875rem;
}
table.styled.horizontal tr:first-child th {
  border-radius: 0.25rem 0 0 0 !important;
  border: 1px solid var(--table__border-color);
}
table.styled.horizontal tr:first-child td {
  border-top: 1px solid var(--table__border-color);
  border-radius: 0 0.25rem 0 0;
}
table.styled.horizontal tr:last-child th {
  border-radius: 0 0 0 0.25rem !important;
}
table.styled.horizontal tr:last-child td {
  border-radius: 0 0 0.25rem 0;
}
.table_wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  overflow-y: hidden;
  overflow-x: auto;
  padding-bottom: 4px;
}
@media screen and (max-width: 768px) {
  .table_wrapper {
    width: 100%;
  }
}
.note {
  font-size: 0.75rem;
  color: var(--text-light);
}
.ag-charts-wrapper button {
  --button-bg: transparent;
}
.legal-doc {
  width: min(100%, 800px);
  padding-bottom: 4rem;
  font-family: var(--font-text);
  font-size: 1rem;
  line-height: 1.5;
}
.legal-doc h1,
.legal-doc h2,
.legal-doc h3,
.legal-doc h4 {
  font-family: var(--font-serif);
  font-weight: 400;
  margin-block: 0;
  position: relative;
  cursor: pointer;
  scroll-margin-top: 4.5rem;
}
.legal-doc h1 a,
.legal-doc h2 a,
.legal-doc h3 a,
.legal-doc h4 a {
  color: inherit;
  text-decoration: none !important;
}
.legal-doc h1:before,
.legal-doc h2:before,
.legal-doc h3:before,
.legal-doc h4:before {
  content: "#";
  position: absolute;
  left: -1.5rem;
  opacity: 0;
  transition: all 0.3s;
}
.legal-doc h1:hover:before,
.legal-doc h2:hover:before,
.legal-doc h3:hover:before,
.legal-doc h4:hover:before {
  opacity: 1;
}
.legal-doc h1 {
  font-size: 2.5rem;
}
.legal-doc h2 {
  font-size: 1.75rem;
  margin-top: 3rem;
}
.legal-doc table {
  table-layout: auto;
  width: 100%;
  margin-block: 1rem;
  border-collapse: collapse;
  --table-border: 1px solid var(--border-base);
  border: var(--table-border);
  font-family: var(--font-text);
  font-size: 0.875rem;
}
.legal-doc table tr {
  border-bottom: var(--table-border);
}
.legal-doc table th,
.legal-doc table td {
  padding-block: 0.25rem;
  padding-inline: 0.5rem;
  text-align: left;
  border-right: var(--table-border);
}
.legal-doc table th {
  background-color: var(--bg-200);
}
.legal-doc ul li,
.legal-doc ol li {
  margin-block: 0.25rem;
}
.legal-doc hr {
  display: block;
  height: 1px;
  border: 0;
  width: 100%;
  height: 1px;
  margin-block: 1rem;
  background-color: var(--bg, var(--border-base));
}
.legal-doc a:hover {
  text-decoration: underline;
}
code {
  background-color: color-mix(in srgb, var(--bg-200), 25% var(--bg-300));
  border-radius: 0.375rem;
  font-size: 0.875rem;
  padding: 0.125rem 0.375rem;
  font-family: var(--font-mono);
}
.page-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 0.5rem;
  margin-bottom: 0.5rem;
  width: 100%;
}
.page-top h1 {
  font-weight: 500;
  font-size: 2rem;
}
.page-top .left,
.page-top .right {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.form-container .input-group.horizontal {
  display: grid;
  grid-template-columns: var(--c1, 100px) 1fr;
}
.form-container .input-group.horizontal span.label {
  margin-top: 0.625rem;
}
.form-container span.note {
  grid-column: 2/2;
}
.input-group.horizontal .generate {
  margin-left: 0;
  grid-column: 2/3;
}
.input-group.horizontal .generate :global(button) {
  padding-block: 0.25rem;
  padding-inline: 1rem;
  width: fit-content !important;
  border-radius: 50px;
}
.input-group.horizontal .generate :global(.isAwaiting) {
  filter: grayscale(0.25) !important;
}
.input-group.horizontal .generate :global(.isAwaiting) :global(.icon) {
  color: light-dark(mediumorchid, violet);
}
.input-group.horizontal .generate .text {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.input-group.horizontal .generate .text .icon {
  color: light-dark(mediumorchid, violet);
}
.input-group.horizontal .generate .text span {
  font-size: 0.825rem;
}
fieldset {
  border: 1px solid var(--border-base);
  border-radius: 0.375rem;
  padding-block: 0.25rem;
  padding-inline: 0.5rem;
}
fieldset legend {
  padding-inline: 0.25rem;
  font-size: 0.75rem;
  color: var(--text-light);
}
fieldset:hover {
  border-color: var(--border-mid);
}
fieldset:focus-within {
  border-color: var(--mono-mid);
}
.codemirror-wrapper {
  background-color: var(--bg-100);
  --cm-active-line-bg: color-mix(in srgb, var(--primary) 16%, var(--bg-100));
}
.codemirror-wrapper .cm-selectionBackground {
  background-color: var(--cm-active-line-bg) !important;
}
.codemirror-wrapper .cm-activeLine {
  background-color: color-mix(in srgb, var(--bg-300) 24%, transparent);
}
.codemirror-wrapper .cm-gutters {
  background-color: color-mix(in srgb, var(--bg-200), 25% transparent);
  border-color: var(--border);
}
.codemirror-wrapper .cm-activeLineGutter {
  background-color: transparent;
  color: var(--primary);
  font-weight: 600;
}
.codemirror-wrapper .cm-editor {
  height: var(--max-height);
  width: var(--width);
}
.codemirror-wrapper .cm-editor ::-webkit-scrollbar-track {
  border-radius: 0px;
}
.codemirror-wrapper .cm-editor ::selection {
  color: currentColor !important;
}
.codemirror-wrapper .cm-focused {
  box-shadow: none;
}
.codemirror-wrapper .ͼ39 {
  color: #1c7fd5;
}
.toaster-class[data-sonner-toast][data-styled=true] {
  font-family: var(--font);
  --c-border: color-mix(in srgb, var(--c), 75% var(--bg-100));
  --c-bg: color-mix(in srgb, var(--c) 12%, var(--bg-100));
  --c: var(--text);
  color: var(--c);
  border-color: var(--c-border);
  background-color: var(--c-bg);
  font-weight: 400;
}
.toaster-class[data-sonner-toast][data-styled=true][data-type=error] {
  --c: var(--red);
}
.toaster-class[data-sonner-toast][data-styled=true][data-type=success] {
  --c: var(--green);
}
.toaster-class[data-sonner-toast][data-styled=true][data-type=warning] {
  --c: var(--c-amber);
}
.toaster-class[data-sonner-toast][data-styled=true] [data-close-button][data-close-button] {
  left: unset;
  right: -1rem;
  opacity: 0;
  transition: all 0.15s;
  color: var(--c);
  border-color: var(--c-border);
  background-color: var(--c-bg);
  outline: 1px solid transparent;
}
.toaster-class[data-sonner-toast][data-styled=true] [data-close-button][data-close-button]:hover {
  --darker: color-mix(in srgb, var(--c), 75% var(--bg-100));
  background-color: var(--darker);
  outline: 1px solid var(--c);
}
.toaster-class:hover button[data-close-button] {
  opacity: 1 !important;
}
.doc-container {
  --doc-width: 978px;
  width: var(--doc-width);
  margin-inline: auto;
  padding-block: 1rem;
  --index-width: 3rem;
  padding-bottom: 200px;
}
@media screen and (max-width: 768px) {
  .doc-container {
    width: 100%;
    padding-inline: 1rem;
  }
}

.docs-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  --index-width: 6rem;
}
.docs-content .notice {
  background-color: var(--bg-150);
  margin-left: 3rem;
  border-radius: 0.5rem;
  padding: 0.75rem;
  font-size: 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.docs-content .notice p {
  margin: 0;
  line-height: 125%;
}
.docs-content .header-main {
  margin-left: var(--index-width);
  width: calc(100% - var(--index-width));
}
.docs-content .header-main h1 {
  font-size: 2.5rem;
  margin-block: 1rem;
}
@media screen and (max-width: 768px) {
  .docs-content .header-main {
    --index-width: 0;
  }
}
.docs-content .section {
  margin-block: 0.5rem;
  scroll-margin-top: 2rem;
}
.docs-content .section-header {
  display: grid;
  grid-template-columns: var(--index-width) 1fr;
  align-items: center;
  padding-bottom: 1rem;
}
.docs-content .section-header h1,
.docs-content .section-header h2,
.docs-content .section-header h3 {
  grid-column: 2/3;
  font-weight: 600;
  font-size: 1.25rem;
}
.docs-content .section-header h1.main,
.docs-content .section-header h2.main,
.docs-content .section-header h3.main {
  font-family: var(--font-serif);
  font-size: 1.75rem;
  font-weight: 400;
}
@media screen and (max-width: 768px) {
  .docs-content .section-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
  }
  .docs-content .section-header h1,
  .docs-content .section-header h2,
  .docs-content .section-header h3 {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--accent-600);
  }
}
.docs-content .section-index {
  font-weight: 300;
  color: var(--text-light);
  width: var(--index-width);
  word-wrap: break-word;
}
@media screen and (max-width: 768px) {
  .docs-content .section-index {
    font-weight: 800;
    color: var(--text);
    font-size: 0.875rem;
  }
}
.docs-content .section-content {
  display: grid;
  grid-template-columns: var(--index-width) 1fr;
}
.docs-content .section-content .content {
  grid-column: 2/-1;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media screen and (max-width: 768px) {
  .docs-content .section-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }
}
.docs-content .table-wrapper {
  margin-inline: 0.5rem;
  margin-block: 1rem;
  overflow-x: auto;
  max-width: calc(var(--doc-width) - var(--index-width)) !important;
}
.docs-content .wrapper h4.category {
  margin: 0;
  text-decoration: underline;
  padding-bottom: 1rem;
}
.docs-content .wrapper.category-note {
  background-color: var(--note-bg);
  padding: 1rem;
  border-radius: 0.5rem;
}
.docs-content .wrapper.category-explanation {
  background-color: var(--explain-bg);
  padding: 1rem;
  border-radius: 0.5rem;
}
.docs-content .wrapper.category-rationale {
  background-color: var(--rationale-bg);
  padding: 1rem;
  border-radius: 0.5rem;
}
.docs-content .divider-container {
  margin-left: 6rem;
}
@media screen and (max-width: 520px) {
  .docs-content .divider-container {
    margin-left: 0;
  }
}
.docs-content sup:has(.text-footnote) {
  line-height: 100%;
  position: relative;
  vertical-align: baseline;
  top: -0.25rem;
  margin-inline: 1px;
}
.docs-content .text-footnote {
  font-size: 0.75rem;
}
.docs-content [data-indent="1"] {
  padding-left: 2.25rem;
}
.docs-content [data-indent="2"] {
  padding-left: 4.5rem;
}
.docs-content [data-indent="3"] {
  padding-left: 6.75rem;
}
.docs-content [data-indent="4"] {
  padding-left: 9rem;
}
.docs-content [data-indent="5"] {
  padding-left: 11.25rem;
}
.docs-content [data-indent="6"] {
  padding-left: 13.5rem;
}
.docs-content [data-indent="7"] {
  padding-left: 15.75rem;
}
.docs-content [data-indent="8"] {
  padding-left: 18rem;
}
.docs-content [data-section-indent="1"] .section-header h2 {
  padding-left: 1rem;
}
.docs-content [data-section-indent="1"] .section-content {
  padding-left: 1rem;
}
.docs-content [data-section-indent="2"] .section-header h2 {
  padding-left: 2rem;
}
.docs-content [data-section-indent="2"] .section-content {
  padding-left: 2rem;
}
.docs-content [data-section-indent="3"] .section-header h2 {
  padding-left: 3rem;
}
.docs-content [data-section-indent="3"] .section-content {
  padding-left: 3rem;
}
.docs-content [data-section-indent="4"] .section-header h2 {
  padding-left: 4rem;
}
.docs-content [data-section-indent="4"] .section-content {
  padding-left: 4rem;
}
.docs-content [data-section-indent="5"] .section-header h2 {
  padding-left: 5rem;
}
.docs-content [data-section-indent="5"] .section-content {
  padding-left: 5rem;
}
.docs-content [data-section-indent="6"] .section-header h2 {
  padding-left: 6rem;
}
.docs-content [data-section-indent="6"] .section-content {
  padding-left: 6rem;
}
.docs-content [data-section-indent="7"] .section-header h2 {
  padding-left: 7rem;
}
.docs-content [data-section-indent="7"] .section-content {
  padding-left: 7rem;
}
.docs-content [data-section-indent="8"] .section-header h2 {
  padding-left: 8rem;
}
.docs-content [data-section-indent="8"] .section-content {
  padding-left: 8rem;
}

body.dark {
  --note-bg: #35383d;
  --explain-bg: #244551;
  --rationale-bg: #503411;
}

body.light {
  --note-bg: #e5e7eb;
  --explain-bg: #e5eef1;
  --rationale-bg: #feefce;
}

.docs-content .content p {
  margin-block: 0.25rem;
  line-height: 150%;
}
.docs-content .content p:first-child {
  margin-top: 0;
}
.docs-content .content table {
  border-collapse: collapse;
  margin: 0;
  overflow: hidden;
  table-layout: auto;
  width: 100%;
  font-size: 0.875rem;
  margin-block: 0.5rem;
}
.docs-content .content table.auto-layout {
  table-layout: auto;
  width: 100%;
}
.docs-content .content table.fixed-layout {
  table-layout: fixed;
  width: 100%;
}
.docs-content .content table td,
.docs-content .content table th {
  border: 1px solid var(--mono);
  box-sizing: border-box;
  min-width: 1rem;
  padding: 0;
  position: relative;
  vertical-align: top;
  padding-inline: 0.5rem;
  padding-block: 0.25rem;
}
.docs-content .content table td > *,
.docs-content .content table th > * {
  margin-bottom: 0;
}
.docs-content .content table th {
  background-color: var(--mono-soft);
  font-weight: bold;
  text-align: left;
}
.docs-content .content figure {
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.75rem;
  max-width: calc(100% - 2rem);
  padding-inline: 1rem;
  padding-block: 1rem 0.5rem;
  max-width: 100%;
}
.docs-content .content figure img {
  border-radius: 0.5rem;
  max-width: 100%;
}
.docs-content .content figure figcaption {
  font-size: 0.875rem;
  color: var(--text-soft);
  border-radius: 0.375rem;
  width: 100%;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .docs-content .content figure {
    width: 100%;
  }
  .docs-content .content figure img {
    width: 100%;
  }
}
.docs-content .content span.index-list {
  color: var(--text-light);
  font-weight: 400;
  font-size: 0.9375rem;
  margin-right: 0.5rem;
}
.docs-content .content ol,
.docs-content .content ul {
  margin: 0;
  margin-left: -0.75rem;
}
.docs-content .content ol li::marker,
.docs-content .content ul li::marker {
  color: var(--text-light);
  font-weight: 400;
  font-size: 0.9375rem;
}
.docs-content .content ol li,
.docs-content .content ul li {
  padding-left: 0.5rem;
  margin-block: 0.5rem;
}
.docs-content .content ol.hide-list:first-child > li {
  list-style: none;
}
.docs-content .content ol.hide-list:first-child > li > p {
  display: none;
}
.docs-content .content ol.list-decimal {
  list-style-type: decimal;
}
.docs-content .content ol.list-alpha {
  list-style-type: lower-alpha;
}
.docs-content .content ol.list-roman {
  list-style-type: lower-roman;
}

.ProseMirror.tiptap {
  margin-top: 0.5rem;
  width: 100%;
  border: 1px solid var(--mono-light);
  border: 0 !important;
  border-radius: 0.5rem;
  padding: 0;
  min-height: 200px;
  max-height: 600px;
  overflow: auto;
}
.ProseMirror.tiptap:focus-visible {
  outline: none;
}
.ProseMirror.tiptap a {
  cursor: pointer;
  text-decoration: underline;
  padding: 2px;
  border-radius: 4px;
  background-color: color-mix(in srgb, var(--mono), 90% transparent);
}
.ProseMirror.tiptap p.is-editor-empty:first-child::before {
  color: var(--text-soft);
  content: attr(data-placeholder);
  float: left;
  height: 0;
  pointer-events: none;
}
.ProseMirror.tiptap .table-wrapper {
  margin-inline: 0.5rem;
  margin-block: 1rem;
  overflow-x: auto;
}
.ProseMirror.tiptap figure {
  cursor: pointer;
  outline: 2px dashed orange;
  margin: 1rem;
}
.ProseMirror.tiptap figure img {
  max-width: 600px;
  object-fit: contain;
}
.ProseMirror.tiptap figure figcaption {
  outline: 2px dashed var(--mono-light);
  color: var(--text-soft) !important;
  padding-block: 0.5rem;
  cursor: text;
}
.ProseMirror.tiptap figure figcaption::selection {
  background-color: var(--accent);
  color: #fff !important;
}
.ProseMirror.tiptap figure:after {
  content: "To delete image - remove caption then press `Delete` Key";
  font-size: 0.75rem;
  color: var(--text-soft);
}
.ProseMirror.tiptap.resize-cursor {
  cursor: ew-resize;
  cursor: col-resize;
}
.ProseMirror.tiptap table .selectedCell:after {
  background: color-mix(in srgb, var(--orange), 80% transparent);
  content: "";
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  pointer-events: none;
  position: absolute;
  z-index: 2;
}
.ProseMirror.tiptap table .column-resize-handle {
  background-color: red;
  bottom: -2px;
  pointer-events: none;
  position: absolute;
  right: -2px;
  top: 0;
  width: 4px;
}
.ProseMirror.tiptap ol.hide-list:first-child > li {
  list-style-type: "❌";
}
.ProseMirror.tiptap ol.hide-list:first-child > li > p {
  display: block;
}

.docs-content.editor ol.hide-list:first-child > li {
  list-style-type: "❌";
}
.docs-content.editor ol.hide-list:first-child > li > p {
  display: block;
}.toaster.svelte-c82lj3 {
  z-index: 1000;
  position: fixed;
  top: 1rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column-reverse;
  gap: 0.5rem;
  width: max-content;
}
.toaster.svelte-c82lj3 .toast:where(.svelte-c82lj3) {
  background-color: #fff;
  border: 1px solid #000;
  padding-block: 1rem;
  padding-inline: 1rem;
  padding-right: 0rem;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  border: 2px solid var(--c);
  background-color: color-mix(in srgb, var(--c), 85% var(--bg-100));
  gap: 0.5rem;
  max-width: 400px;
}
.toaster.svelte-c82lj3 .toast:where(.svelte-c82lj3) .status:where(.svelte-c82lj3) {
  color: var(--c);
}
.toaster.svelte-c82lj3 .toast:where(.svelte-c82lj3) .text:where(.svelte-c82lj3) {
  min-width: 150px;
}
.toaster.svelte-c82lj3 .toast:where(.svelte-c82lj3) .text:where(.svelte-c82lj3) .title:where(.svelte-c82lj3) {
  font-size: 1rem;
}
.toaster.svelte-c82lj3 .toast:where(.svelte-c82lj3) .text:where(.svelte-c82lj3) .message:where(.svelte-c82lj3) {
  font-size: 0.875rem;
  color: var(--text-soft);
  white-space: pre-wrap;
}
.toaster.svelte-c82lj3 .toast:where(.svelte-c82lj3) button.close:where(.svelte-c82lj3) {
  color: var(--text-soft);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-inline: 0.5rem;
  margin-left: auto;
}.progressbar-container.svelte-14y5kdd {
  position: fixed;
  top: 0;
  width: 100%;
  height: 4px;
  z-index: 1000;
}
.progressbar-container.svelte-14y5kdd .progress:where(.svelte-14y5kdd) {
  width: 0%;
  transition: width 2s ease-out;
  height: 100%;
  background-color: var(--accent);
  animation: svelte-14y5kdd-loading 2s forwards ease-out;
}
@keyframes svelte-14y5kdd-loading {
  0% {
    width: 0%;
  }
  33% {
    width: var(--random1);
  }
  40% {
    width: var(--random1);
  }
  66% {
    width: var(--random2);
  }
  70% {
    width: var(--random2);
  }
  100% {
    width: 90%;
  }
}.progressbar-container.svelte-1e7dp78 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 4px;
  z-index: 1000;
}
.progressbar-container.svelte-1e7dp78 .progress:where(.svelte-1e7dp78) {
  width: 0%;
  transition: width 2s ease-out;
  height: 100%;
  background-color: var(--accent);
  animation: svelte-1e7dp78-loading 2s forwards ease-out;
}
@keyframes svelte-1e7dp78-loading {
  0% {
    width: 0%;
  }
  33% {
    width: var(--random1);
  }
  40% {
    width: var(--random1);
  }
  66% {
    width: var(--random2);
  }
  70% {
    width: var(--random2);
  }
  100% {
    width: 90%;
  }
}.html-lightbox-bg {
  background-color: color-mix(in srgb, color-mix(in srgb, var(--bg), 25% #000), 12% transparent) !important;
}

.lightbox.svelte-hxvs17 {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  scrollbar-gutter: none;
}
.lightbox.svelte-hxvs17 .background:where(.svelte-hxvs17) {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: color-mix(in srgb, var(--scrollbar-bg), 12% transparent);
  backdrop-filter: blur(6px);
}
.lightbox.svelte-hxvs17 .content:where(.svelte-hxvs17) {
  pointer-events: none;
  z-index: 3;
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lightbox.svelte-hxvs17 .content:where(.svelte-hxvs17) img:where(.svelte-hxvs17) {
  pointer-events: all;
  user-select: none;
}
.lightbox.svelte-hxvs17 .content:where(.svelte-hxvs17) img.transition:where(.svelte-hxvs17) {
  transition: transform 0.3s;
}
.lightbox.svelte-hxvs17 .overlay:where(.svelte-hxvs17) {
  position: absolute;
  z-index: 4;
  padding: 0.5rem;
}
.lightbox.svelte-hxvs17 .overlay.bottom-left:where(.svelte-hxvs17) {
  bottom: 0;
  left: 0;
  font-size: 0.75rem;
  color: var(--mono);
  border-radius: 0.25rem;
}
.lightbox.svelte-hxvs17 .overlay.top-left:where(.svelte-hxvs17) {
  top: 0.5rem;
  left: 0.5rem;
}
.lightbox.svelte-hxvs17 .overlay.top-left:where(.svelte-hxvs17) .indexes:where(.svelte-hxvs17) {
  font-size: 1rem;
  letter-spacing: 4px;
  font-family: var(--font-mono);
}
.lightbox.svelte-hxvs17 .overlay.top-left:where(.svelte-hxvs17) span:where(.svelte-hxvs17) {
  font-size: 0.875rem;
}
.lightbox.svelte-hxvs17 .overlay.arrow:where(.svelte-hxvs17) {
  padding: 0.25rem;
  transform: translateY(-50%);
  top: 50%;
  border-radius: 50%;
}
.lightbox.svelte-hxvs17 .overlay.arrow.arrow-left:where(.svelte-hxvs17) {
  left: 1rem;
}
.lightbox.svelte-hxvs17 .overlay.arrow.arrow-right:where(.svelte-hxvs17) {
  right: 1rem;
}.panel-wrapper.svelte-mtxbvs {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.panel.svelte-mtxbvs {
  pointer-events: all;
  border: 0;
  border-radius: 1rem;
  padding: 0.5rem;
  position: absolute;
  z-index: 102;
  width: var(--w, 400px);
  min-height: 50px;
  background-color: var(--bg-100);
  border: 1px solid var(--border);
  margin-top: var(--offset, 0px);
}
.panel.top.svelte-mtxbvs {
  top: 4rem;
}
.panel.not-top.svelte-mtxbvs {
  filter: blur(2px);
  opacity: 0.5;
  pointer-events: none;
}
@media screen and (max-width: 768px) {
  .panel.svelte-mtxbvs {
    width: calc(100vw - 2rem);
  }
}
@media screen and (max-height: 400px) {
  .panel.svelte-mtxbvs {
    min-height: unset;
  }
}
.panel.svelte-mtxbvs button.icon.close-btn:where(.svelte-mtxbvs) {
  position: absolute;
  top: 0.5rem;
  right: 0.75rem;
  aspect-ratio: 1;
  padding: 0.5rem;
  border-radius: 50%;
  background-color: transparent;
}
.panel.svelte-mtxbvs button.icon.close-btn:where(.svelte-mtxbvs):hover {
  background-color: var(--hovered-2);
}
.panel.svelte-mtxbvs button.icon.close-btn.position-backdrop:where(.svelte-mtxbvs) {
  position: fixed;
  top: 1rem;
  right: 1rem;
  color: var(--contrast);
  transform: scale(1.25);
}
.panel.svelte-mtxbvs button.icon.close-btn.position-backdrop:where(.svelte-mtxbvs):hover {
  background: var(--bg-200);
  box-shadow: var(--box-sh);
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) {
  overflow-y: auto;
  max-height: var(--max-height, calc(100dvh - 2rem));
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) {
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  color: var(--text);
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) .header:where(.svelte-mtxbvs) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) .header:where(.svelte-mtxbvs) .title:where(.svelte-mtxbvs) h2:where(.svelte-mtxbvs) {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--text);
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) .header:where(.svelte-mtxbvs) .title:where(.svelte-mtxbvs) p.description:where(.svelte-mtxbvs) {
  padding-top: 0.5rem;
  font-size: 0.8125rem;
  color: var(--text-soft);
  margin: 0;
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) .panel-error:where(.svelte-mtxbvs) {
  font-size: 0.875rem;
  color: var(--red);
  border: 1px solid var(--red);
  padding: 0.25rem 0.375rem;
  border-radius: 0.25rem;
  width: fit-content;
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) .panel-error:where(.svelte-mtxbvs) ul:where(.svelte-mtxbvs) {
  margin: 0;
  margin-block: 0.25rem;
  padding-inline: 1rem;
  padding-left: 1.5rem;
}
.panel.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) .content:where(.svelte-mtxbvs) .panel-error:where(.svelte-mtxbvs) ul:where(.svelte-mtxbvs) li:where(.svelte-mtxbvs) {
  padding: 0;
}
.panel.unstyled.svelte-mtxbvs {
  padding: 0;
}
.panel.unstyled.svelte-mtxbvs .header:where(.svelte-mtxbvs) {
  display: none !important;
}
.panel.unstyled.svelte-mtxbvs .content:where(.svelte-mtxbvs) {
  padding: 0;
}
.panel.unstyled.svelte-mtxbvs .scrollable:where(.svelte-mtxbvs) {
  max-height: unset;
  overflow: unset;
}

.backdrop.svelte-mtxbvs {
  pointer-events: all;
  position: fixed;
  z-index: 101;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: color-mix(in srgb, var(--mono-light) 75%, transparent);
  backdrop-filter: blur(4px);
}
	html[dir='ltr'],
	[data-sonner-toaster][dir='ltr'] {
		--toast-icon-margin-start: -3px;
		--toast-icon-margin-end: 4px;
		--toast-svg-margin-start: -1px;
		--toast-svg-margin-end: 0px;
		--toast-button-margin-start: auto;
		--toast-button-margin-end: 0;
		--toast-close-button-start: 0;
		--toast-close-button-end: unset;
		--toast-close-button-transform: translate(-35%, -35%);
	}

	html[dir='rtl'],
	[data-sonner-toaster][dir='rtl'] {
		--toast-icon-margin-start: 4px;
		--toast-icon-margin-end: -3px;
		--toast-svg-margin-start: 0px;
		--toast-svg-margin-end: -1px;
		--toast-button-margin-start: 0;
		--toast-button-margin-end: auto;
		--toast-close-button-start: unset;
		--toast-close-button-end: 0;
		--toast-close-button-transform: translate(35%, -35%);
	}

	[data-sonner-toaster] {
		position: fixed;
		width: var(--width);
		font-family:
			ui-sans-serif,
			system-ui,
			-apple-system,
			BlinkMacSystemFont,
			Segoe UI,
			Roboto,
			Helvetica Neue,
			Arial,
			Noto Sans,
			sans-serif,
			Apple Color Emoji,
			Segoe UI Emoji,
			Segoe UI Symbol,
			Noto Color Emoji;
		--gray1: hsl(0, 0%, 99%);
		--gray2: hsl(0, 0%, 97.3%);
		--gray3: hsl(0, 0%, 95.1%);
		--gray4: hsl(0, 0%, 93%);
		--gray5: hsl(0, 0%, 90.9%);
		--gray6: hsl(0, 0%, 88.7%);
		--gray7: hsl(0, 0%, 85.8%);
		--gray8: hsl(0, 0%, 78%);
		--gray9: hsl(0, 0%, 56.1%);
		--gray10: hsl(0, 0%, 52.3%);
		--gray11: hsl(0, 0%, 43.5%);
		--gray12: hsl(0, 0%, 9%);
		--border-radius: 8px;
		box-sizing: border-box;
		padding: 0;
		margin: 0;
		list-style: none;
		outline: none;
		z-index: 999999999;
		transition: transform 400ms ease;
	}

	@media (hover: none) and (pointer: coarse) {
		[data-sonner-toaster][data-lifted='true'] {
			transform: none;
		}
	}

	[data-sonner-toaster][data-x-position='right'] {
		right: var(--offset-right);
	}

	[data-sonner-toaster][data-x-position='left'] {
		left: var(--offset-left);
	}

	[data-sonner-toaster][data-x-position='center'] {
		left: 50%;
		transform: translateX(-50%);
	}

	[data-sonner-toaster][data-y-position='top'] {
		top: var(--offset-top);
	}

	[data-sonner-toaster][data-y-position='bottom'] {
		bottom: var(--offset-bottom);
	}

	[data-sonner-toast] {
		--y: translateY(100%);
		--lift-amount: calc(var(--lift) * var(--gap));
		z-index: var(--z-index);
		position: absolute;
		opacity: 0;
		transform: var(--y);
		touch-action: none;
		transition:
			transform 400ms,
			opacity 400ms,
			height 400ms,
			box-shadow 200ms;
		box-sizing: border-box;
		outline: none;
		overflow-wrap: anywhere;
	}

	[data-sonner-toast][data-styled='true'] {
		padding: 16px;
		background: var(--normal-bg);
		border: 1px solid var(--normal-border);
		color: var(--normal-text);
		border-radius: var(--border-radius);
		box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
		width: var(--width);
		font-size: 13px;
		display: flex;
		align-items: center;
		gap: 6px;
	}

	[data-sonner-toast]:focus-visible {
		box-shadow:
			0px 4px 12px rgba(0, 0, 0, 0.1),
			0 0 0 2px rgba(0, 0, 0, 0.2);
	}

	[data-sonner-toast][data-y-position='top'] {
		top: 0;
		--y: translateY(-100%);
		--lift: 1;
		--lift-amount: calc(1 * var(--gap));
	}

	[data-sonner-toast][data-y-position='bottom'] {
		bottom: 0;
		--y: translateY(100%);
		--lift: -1;
		--lift-amount: calc(var(--lift) * var(--gap));
	}

	[data-sonner-toast][data-styled='true'] [data-description] {
		font-weight: 400;
		line-height: 1.4;
		color: #3f3f3f;
	}

	[data-rich-colors='true'][data-sonner-toast][data-styled='true']
		[data-description] {
		color: inherit;
	}

	[data-sonner-toaster][data-sonner-theme='dark'] [data-description] {
		color: hsl(0, 0%, 91%);
	}

	[data-sonner-toast][data-styled='true'] [data-title] {
		font-weight: 500;
		line-height: 1.5;
		color: inherit;
	}

	[data-sonner-toast][data-styled='true'] [data-icon] {
		display: flex;
		height: 16px;
		width: 16px;
		position: relative;
		justify-content: flex-start;
		align-items: center;
		flex-shrink: 0;
		margin-left: var(--toast-icon-margin-start);
		margin-right: var(--toast-icon-margin-end);
	}

	[data-sonner-toast][data-promise='true'] [data-icon] > svg {
		opacity: 0;
		transform: scale(0.8);
		transform-origin: center;
		animation: sonner-fade-in 300ms ease forwards;
	}

	[data-sonner-toast][data-styled='true'] [data-icon] > * {
		flex-shrink: 0;
	}

	[data-sonner-toast][data-styled='true'] [data-icon] svg {
		margin-left: var(--toast-svg-margin-start);
		margin-right: var(--toast-svg-margin-end);
	}

	[data-sonner-toast][data-styled='true'] [data-content] {
		display: flex;
		flex-direction: column;
		gap: 2px;
	}

	[data-sonner-toast][data-styled='true'] [data-button] {
		border-radius: 4px;
		padding-left: 8px;
		padding-right: 8px;
		height: 24px;
		font-size: 12px;
		color: var(--normal-bg);
		background: var(--normal-text);
		margin-left: var(--toast-button-margin-start);
		margin-right: var(--toast-button-margin-end);
		border: none;
		font-weight: 500;
		cursor: pointer;
		outline: none;
		display: flex;
		align-items: center;
		flex-shrink: 0;
		transition:
			opacity 400ms,
			box-shadow 200ms;
	}

	[data-sonner-toast][data-styled='true'] [data-button]:focus-visible {
		box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.4);
	}

	[data-sonner-toast][data-styled='true'] [data-button]:first-of-type {
		margin-left: var(--toast-button-margin-start);
		margin-right: var(--toast-button-margin-end);
	}

	[data-sonner-toast][data-styled='true'] [data-cancel] {
		color: var(--normal-text);
		background: rgba(0, 0, 0, 0.08);
	}

	[data-sonner-toaster][data-sonner-theme='dark']
		[data-sonner-toast][data-styled='true']
		[data-cancel] {
		background: rgba(255, 255, 255, 0.3);
	}

	[data-sonner-toast][data-styled='true'] [data-close-button] {
		position: absolute;
		left: var(--toast-close-button-start);
		right: var(--toast-close-button-end);
		top: 0;
		height: 20px;
		width: 20px;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 0;
		color: var(--gray12);
		background: var(--normal-bg);
		border: 1px solid var(--gray4);
		transform: var(--toast-close-button-transform);
		border-radius: 50%;
		cursor: pointer;
		z-index: 1;
		transition:
			opacity 100ms,
			background 200ms,
			border-color 200ms;
	}

	[data-sonner-toast][data-styled='true'] [data-close-button]:focus-visible {
		box-shadow:
			0px 4px 12px rgba(0, 0, 0, 0.1),
			0 0 0 2px rgba(0, 0, 0, 0.2);
	}

	[data-sonner-toast][data-styled='true'] [data-disabled='true'] {
		cursor: not-allowed;
	}

	[data-sonner-toast][data-styled='true']:hover [data-close-button]:hover {
		background: var(--gray2);
		border-color: var(--gray5);
	}

	[data-sonner-toast][data-swiping='true']::before {
		content: '';
		position: absolute;
		left: -100%;
		right: -100%;
		height: 100%;
		z-index: -1;
	}

	[data-sonner-toast][data-y-position='top'][data-swiping='true']::before {
		bottom: 50%;
		transform: scaleY(3) translateY(50%);
	}

	[data-sonner-toast][data-y-position='bottom'][data-swiping='true']::before {
		top: 50%;
		transform: scaleY(3) translateY(-50%);
	}

	[data-sonner-toast][data-swiping='false'][data-removed='true']::before {
		content: '';
		position: absolute;
		inset: 0;
		transform: scaleY(2);
	}

	[data-sonner-toast][data-expanded='true']::after {
		content: '';
		position: absolute;
		left: 0;
		height: calc(var(--gap) + 1px);
		bottom: 100%;
		width: 100%;
	}

	[data-sonner-toast][data-mounted='true'] {
		--y: translateY(0);
		opacity: 1;
	}

	[data-sonner-toast][data-expanded='false'][data-front='false'] {
		--scale: var(--toasts-before) * 0.05 + 1;
		--y: translateY(calc(var(--lift-amount) * var(--toasts-before)))
			scale(calc(-1 * var(--scale)));
		height: var(--front-toast-height);
	}

	[data-sonner-toast] > * {
		transition: opacity 400ms;
	}

	[data-sonner-toast][data-x-position='right'] {
		right: 0;
	}

	[data-sonner-toast][data-x-position='left'] {
		left: 0;
	}

	[data-sonner-toast][data-expanded='false'][data-front='false'][data-styled='true']
		> * {
		opacity: 0;
	}

	[data-sonner-toast][data-visible='false'] {
		opacity: 0;
		pointer-events: none;
	}

	[data-sonner-toast][data-mounted='true'][data-expanded='true'] {
		--y: translateY(calc(var(--lift) * var(--offset)));
		height: var(--initial-height);
	}

	[data-sonner-toast][data-removed='true'][data-front='true'][data-swipe-out='false'] {
		--y: translateY(calc(var(--lift) * -100%));
		opacity: 0;
	}

	[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='true'] {
		--y: translateY(
			calc(var(--lift) * var(--offset) + var(--lift) * -100%)
		);
		opacity: 0;
	}

	[data-sonner-toast][data-removed='true'][data-front='false'][data-swipe-out='false'][data-expanded='false'] {
		--y: translateY(40%);
		opacity: 0;
		transition:
			transform 500ms,
			opacity 200ms;
	}

	[data-sonner-toast][data-removed='true'][data-front='false']::before {
		height: calc(var(--initial-height) + 20%);
	}

	[data-sonner-toast][data-swiping='true'] {
		transform: var(--y) translateY(var(--swipe-amount-y, 0px))
			translateX(var(--swipe-amount-x, 0px));
		transition: none;
	}

	[data-sonner-toast][data-swiped='true'] {
		user-select: none;
	}

	[data-sonner-toast][data-swipe-out='true'][data-y-position='bottom'],
	[data-sonner-toast][data-swipe-out='true'][data-y-position='top'] {
		animation-duration: 200ms;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}

	[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='left'] {
		animation-name: swipe-out-left;
	}

	[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='right'] {
		animation-name: swipe-out-right;
	}

	[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='up'] {
		animation-name: swipe-out-up;
	}

	[data-sonner-toast][data-swipe-out='true'][data-swipe-direction='down'] {
		animation-name: swipe-out-down;
	}

	@keyframes swipe-out-left {
		from {
			transform: var(--y) translateX(var(--swipe-amount-x));
			opacity: 1;
		}

		to {
			transform: var(--y) translateX(calc(var(--swipe-amount-x) - 100%));
			opacity: 0;
		}
	}

	@keyframes swipe-out-right {
		from {
			transform: var(--y) translateX(var(--swipe-amount-x));
			opacity: 1;
		}

		to {
			transform: var(--y) translateX(calc(var(--swipe-amount-x) + 100%));
			opacity: 0;
		}
	}

	@keyframes swipe-out-up {
		from {
			transform: var(--y) translateY(var(--swipe-amount-y));
			opacity: 1;
		}

		to {
			transform: var(--y) translateY(calc(var(--swipe-amount-y) - 100%));
			opacity: 0;
		}
	}

	@keyframes swipe-out-down {
		from {
			transform: var(--y) translateY(var(--swipe-amount-y));
			opacity: 1;
		}

		to {
			transform: var(--y) translateY(calc(var(--swipe-amount-y) + 100%));
			opacity: 0;
		}
	}

	@media (max-width: 600px) {
		[data-sonner-toaster] {
			position: fixed;
			right: var(--mobile-offset-right);
			left: var(--mobile-offset-left);
			width: 100%;
		}

		[data-sonner-toaster][dir='rtl'] {
			left: calc(var(--mobile-offset-left) * -1);
		}

		[data-sonner-toaster] [data-sonner-toast] {
			left: 0;
			right: 0;
			width: calc(100% - var(--mobile-offset-left) * 2);
		}

		[data-sonner-toaster][data-x-position='left'] {
			left: var(--mobile-offset-left);
		}

		[data-sonner-toaster][data-y-position='bottom'] {
			bottom: var(--mobile-offset-bottom);
		}

		[data-sonner-toaster][data-y-position='top'] {
			top: var(--mobile-offset-top);
		}

		[data-sonner-toaster][data-x-position='center'] {
			left: var(--mobile-offset-left);
			right: var(--mobile-offset-right);
			transform: none;
		}
	}

	[data-sonner-toaster][data-sonner-theme='light'] {
		--normal-bg: #fff;
		--normal-border: var(--gray4);
		--normal-text: var(--gray12);

		--success-bg: hsl(143, 85%, 96%);
		--success-border: hsl(145, 92%, 87%);
		--success-text: hsl(140, 100%, 27%);

		--info-bg: hsl(208, 100%, 97%);
		--info-border: hsl(221, 91%, 93%);
		--info-text: hsl(210, 92%, 45%);

		--warning-bg: hsl(49, 100%, 97%);
		--warning-border: hsl(49, 91%, 84%);
		--warning-text: hsl(31, 92%, 45%);

		--error-bg: hsl(359, 100%, 97%);
		--error-border: hsl(359, 100%, 94%);
		--error-text: hsl(360, 100%, 45%);
	}

	[data-sonner-toaster][data-sonner-theme='light']
		[data-sonner-toast][data-invert='true'] {
		--normal-bg: #000;
		--normal-border: hsl(0, 0%, 20%);
		--normal-text: var(--gray1);
	}

	[data-sonner-toaster][data-sonner-theme='dark']
		[data-sonner-toast][data-invert='true'] {
		--normal-bg: #fff;
		--normal-border: var(--gray3);
		--normal-text: var(--gray12);
	}

	[data-sonner-toaster][data-sonner-theme='dark'] {
		--normal-bg: #000;
		--normal-bg-hover: hsl(0, 0%, 12%);
		--normal-border: hsl(0, 0%, 20%);
		--normal-border-hover: hsl(0, 0%, 25%);
		--normal-text: var(--gray1);

		--success-bg: hsl(150, 100%, 6%);
		--success-border: hsl(147, 100%, 12%);
		--success-text: hsl(150, 86%, 65%);

		--info-bg: hsl(215, 100%, 6%);
		--info-border: hsl(223, 43%, 17%);
		--info-text: hsl(216, 87%, 65%);

		--warning-bg: hsl(64, 100%, 6%);
		--warning-border: hsl(60, 100%, 9%);
		--warning-text: hsl(46, 87%, 65%);

		--error-bg: hsl(358, 76%, 10%);
		--error-border: hsl(357, 89%, 16%);
		--error-text: hsl(358, 100%, 81%);
	}

	[data-sonner-toaster][data-sonner-theme='dark']
		[data-sonner-toast]
		[data-close-button] {
		background: var(--normal-bg);
		border-color: var(--normal-border);
		color: var(--normal-text);
	}

	[data-sonner-toaster][data-sonner-theme='dark']
		[data-sonner-toast]
		[data-close-button]:hover {
		background: var(--normal-bg-hover);
		border-color: var(--normal-border-hover);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='success'] {
		background: var(--success-bg);
		border-color: var(--success-border);
		color: var(--success-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='success']
		[data-close-button] {
		background: var(--success-bg);
		border-color: var(--success-border);
		color: var(--success-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='info'] {
		background: var(--info-bg);
		border-color: var(--info-border);
		color: var(--info-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='info']
		[data-close-button] {
		background: var(--info-bg);
		border-color: var(--info-border);
		color: var(--info-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='warning'] {
		background: var(--warning-bg);
		border-color: var(--warning-border);
		color: var(--warning-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='warning']
		[data-close-button] {
		background: var(--warning-bg);
		border-color: var(--warning-border);
		color: var(--warning-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='error'] {
		background: var(--error-bg);
		border-color: var(--error-border);
		color: var(--error-text);
	}

	[data-rich-colors='true'][data-sonner-toast][data-type='error']
		[data-close-button] {
		background: var(--error-bg);
		border-color: var(--error-border);
		color: var(--error-text);
	}

	.sonner-loading-wrapper {
		--size: 16px;
		height: var(--size);
		width: var(--size);
		position: absolute;
		inset: 0;
		z-index: 10;
	}

	.sonner-loading-wrapper[data-visible='false'] {
		transform-origin: center;
		animation: sonner-fade-out 0.2s ease forwards;
	}

	.sonner-spinner {
		position: relative;
		top: 50%;
		left: 50%;
		height: var(--size);
		width: var(--size);
	}

	.sonner-loading-bar {
		animation: sonner-spin 1.2s linear infinite;
		background: var(--gray11);
		border-radius: 6px;
		height: 8%;
		left: -10%;
		position: absolute;
		top: -3.9%;
		width: 24%;
	}

	.sonner-loading-bar:nth-child(1) {
		animation-delay: -1.2s;
		transform: rotate(0.0001deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(2) {
		animation-delay: -1.1s;
		transform: rotate(30deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(3) {
		animation-delay: -1s;
		transform: rotate(60deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(4) {
		animation-delay: -0.9s;
		transform: rotate(90deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(5) {
		animation-delay: -0.8s;
		transform: rotate(120deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(6) {
		animation-delay: -0.7s;
		transform: rotate(150deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(7) {
		animation-delay: -0.6s;
		transform: rotate(180deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(8) {
		animation-delay: -0.5s;
		transform: rotate(210deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(9) {
		animation-delay: -0.4s;
		transform: rotate(240deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(10) {
		animation-delay: -0.3s;
		transform: rotate(270deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(11) {
		animation-delay: -0.2s;
		transform: rotate(300deg) translate(146%);
	}

	.sonner-loading-bar:nth-child(12) {
		animation-delay: -0.1s;
		transform: rotate(330deg) translate(146%);
	}

	@keyframes sonner-fade-in {
		0% {
			opacity: 0;
			transform: scale(0.8);
		}
		100% {
			opacity: 1;
			transform: scale(1);
		}
	}

	@keyframes sonner-fade-out {
		0% {
			opacity: 1;
			transform: scale(1);
		}
		100% {
			opacity: 0;
			transform: scale(0.8);
		}
	}

	@keyframes sonner-spin {
		0% {
			opacity: 1;
		}
		100% {
			opacity: 0.15;
		}
	}

	@media (prefers-reduced-motion) {
		[data-sonner-toast],
		[data-sonner-toast] > *,
		.sonner-loading-bar {
			transition: none !important;
			animation: none !important;
		}
	}

	.sonner-loader {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		transform-origin: center;
		transition:
			opacity 200ms,
			transform 200ms;
	}

	.sonner-loader[data-visible='false'] {
		opacity: 0;
		transform: scale(0.8) translate(-50%, -50%);
	}
.popover-background.svelte-52uebp {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 520px) {
  .popover-background.svelte-52uebp {
    background-color: var(--bg, transparent);
    backdrop-filter: var(--blur);
  }
}

.popover.svelte-52uebp {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  opacity: 0;
  width: fit-content;
}
.popover.open.svelte-52uebp {
  opacity: 1;
}
@media screen and (max-height: 400px) {
  .popover.svelte-52uebp {
    top: 0 !important;
    left: 0 !important;
    height: 100dvh !important;
    width: 100dvw !important;
  }
}.main-container.svelte-12qhfyh {
  min-height: 100dvh;
}