.a {
  background: var(--content-color);
  color: var(--content-text);
  width: var(--a-a);
  position: sticky;
  top: 0;
  border-right: var(--a-b);
  min-width: var(--a-c);
  grid-template-rows: var(--a-d);
  display: var(--a-e);
}

.a:last-child {
  border-left: var(--b-a);
  margin-left: var(--b-b);
}

.b {
  white-space: nowrap;
}

.c {
  grid-template-columns: auto 1fr auto;
  grid-gap: 0.5em;
  display: grid;
  padding: 0.25em 1em;
  cursor: pointer;
  height: 1.75em;
  line-height: 1;
  background: var(--c-a);
  color: var(--c-b);
}

.c > div:nth-child(2) {
  line-height: 1.5em;
}

.c small {
  text-overflow: ellipsis;
  font-family: monospace;
  white-space: nowrap;
  line-height: 2.25em;
  overflow: hidden;
  display: block;
  opacity: 0.5;
}

.d {
  border-bottom: 1px solid var(--content-border);
  padding: 0.5em 1em;
  font-weight: bold;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  grid-gap: 0.5em;
  display: grid;
}

.d small {
  font-weight: normal;
  opacity: 0.75;
}

.e {
  align-items: center;
  display: flex;
}

.f {
  width: 20em;
}

.g {
  padding: 1em;
}

.h {
  --tabler-stroke-width: 1;
  justify-content: center;
  display: inline-flex;
  align-items: center;
  font-size: 9em;
  animation: var(--d-a);
}

.h svg {
  height: 1em;
  width: 1em;
}

.i {
  border: 0.0625em solid var(--content-border);
  background: var(--faded-color);
  color: var(--faded-text);
  border-radius: 0.5em;
  padding: 1em 1.5em;
  margin-top: 1.5em;
  margin-bottom: var(--e-a);
}

.j {
  flex-direction: column;
  align-items: center;
  display: flex;
  gap: 1em;
}

.k {
  max-width: 80ch;
}

.l {
  grid-template-columns: var(--f-d, 1fr 1fr);
  grid-gap: 0.5em 2em;
  display: grid;
  min-height: var(--f-a);
  grid-template-areas: var(--f-b);
  grid-template-rows: var(--f-c);
  height: var(--f-e);
}

.l > *:nth-child(1) {
  grid-area: var(--g-a);
}

.l > *:nth-child(3) {
  grid-area: var(--h-a);
}

.m {
  justify-content: space-between;
  display: flex;
}

.n {
  background: var(--i-a);
  min-height: var(--i-b);
  border-radius: 0.5em;
  font-size: 0.875em;
  color: var(--i-c);
  place-content: center;
  font-weight: bold;
  cursor: pointer;
  display: grid;
}

.o {
  grid-auto-rows: 1px;
  grid-gap: 30px;
  display: grid;
  grid-template-columns: var(--j-a);
}

.p > * > * > *:first-child {
  flex: var(--k-a);
}

.p > * > * > *:last-child {
  flex: var(--l-a);
}

.q {
  position: relative;
  display: grid;
}

.r {
  position: absolute;
  z-index: 10000;
  bottom: 0em;
  right: 0em;
  left: 0em;
  top: 0em;
  font-size: var(--m-a);
  background: var(--primary-color);
  border-radius: var(--m-b);
  color: var(--primary-text);
  place-content: center;
  pointer-events: none;
  display: var(--m-c);
}

.s {
  position: relative;
  min-height: 0;
  min-width: 0;
  border: var(--n-a);
  background: var(--n-b);
  border-radius: var(--n-c);
}

.s .highlight {
  background: var(--primary-color);
  color: var(--primary-text);
  padding: 2px 2px 0 2px;
  border-radius: 2px;
}

.s .monaco-editor {
  position: absolute;
}

.s .monaco-editor .overflow-guard {
  border-radius: var(--o-a);
}

.s .monaco-editor .lines-content {
  padding-left: 10px;
}

.s .monaco-editor .monaco-scrollable-element {
  border-left: 1px solid var(--input-border);
}

.t {
  grid-template-rows: auto 1fr;
  display: grid;
  border-radius: 0.5em;
  overflow: hidden;
  margin: var(--q-a);
  box-shadow: var(--q-b);
  background: var(--q-c);
  color: var(--q-d);
}

.t:first-child {
  margin-top: var(--r-a);
}

.t:last-child {
  margin-bottom: var(--s-a);
}

.u {
  grid-template-columns: var(--p-a);
  justify-content: start;
  overflow: auto;
  display: grid;
}

.v {
  justify-content: space-between;
  align-items: center;
  display: flex;
  border-bottom: 2px solid var(--content-border);
  padding: 0.5em 1em;
}

.w:hover {
  color: var(--primary-color);
  cursor: pointer;
}

.x {
  flex-direction: var(--t-a);
  display: var(--t-b);
}

.x > *:last-child {
  height: var(--u-a);
  flex: var(--u-b);
}

.x textarea {
  border-radius: 0 0 0.375em 0.375em;
  font-family: monospace;
}

.y {
  --tabler-stroke-width: 2;
  border: 0.07142857em solid var(--input-border);
  border-bottom: 0;
  border-radius: 0.375em 0.375em 0 0;
  background: var(--input-color);
  font-size: 0.875em;
  justify-content: start;
  flex-wrap: wrap;
  overflow: hidden;
  display: flex;
}

.y svg {
  height: 16px;
  width: 16px;
}

.y input {
  border: 0;
  border-radius: 0 !important;
}

.y > * {
  outline: 0.0625em solid var(--input-border) !important;
  border-radius: 0 !important;
  flex: 1;
}

.y > *:disabled {
  filter: none !important;
  color: var(--v-a);
}

.z {
  position: fixed;
  z-index: 1000;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  background: var(--background-color);
  display: grid;
  padding: 1em;
}

.aa {
  border: 0.0625em solid var(--faded-color);
  background: var(--faded-color);
  min-height: var(--w-a);
  border-radius: 0.25em;
  padding: 0.5em 1em;
  align-items: center;
  display: flex;
}

.aa > * + * {
  margin-left: 0.5em;
}

.ab {
  font-family: monospace;
  flex: 1;
  word-break: var(--x-a);
  text-overflow: var(--x-b);
  white-space: var(--x-c);
  overflow: var(--x-d);
}

.ac {
  font-family: monospace;
  font-weight: normal;
}

.ad {
  border: 0.0625em solid var(--faded-color);
  background: var(--faded-color);
  border-radius: 0.25em;
  padding: 0.5em 1em;
  align-items: center;
  display: flex;
}

.ad > * + * {
  margin-left: 0.5em;
}

.ae {
  font-family: monospace;
  white-space: var(--y-b, pre-wrap);
  flex: 1;
  text-overflow: var(--y-a);
  overflow: var(--y-c);
}

.af {
  font-family: monospace;
  font-weight: normal;
}

.ag {
  grid-template-rows: var(--aa-a, 1fr 310px);
  grid-gap: 1.5em;
  display: grid;
}

.ah {
  grid-template-columns: 1fr 300px auto;
  grid-gap: 1em;
  display: grid;
}

.ai {
  border-radius: 0.375em;
  justify-content: space-around;
  flex-direction: column;
  align-items: center;
  display: flex;
  background: var(--ab-a);
}

.aj {
  box-shadow: var(--z-a);
  border-radius: 6px;
  height: 7.5vw;
  width: 15vw;
  background: var(--z-b);
}

.ak {
  border: 0.0625em solid var(--input-border);
  border-radius: 0 0 0.375em 0.375em;
  background: var(--input-color);
  display: grid;
  padding: var(--ac-a);
}

.al {
  border: 0.0625em solid var(--input-border);
  background-color: var(--input-color);
  font-size: var(--ad-a);
  border-radius: 0.375em;
  touch-action: none;
  position: relative;
  display: grid;
  height: 17em;
  width: 17em;
  cursor: var(--ad-b);
}

.am {
  pointer-events: none;
  height: inherit;
  width: 100%;
}

.am line {
  stroke: currentColor;
  stroke-width: 0.1em;
  opacity: 0.15;
}

.am circle {
  fill: currentColor;
  opacity: 0.25;
}

.an {
  transform: translate(-50%, -50%);
  left: var(--ae-a);
  top: var(--ae-b);
  position: absolute;
  background: var(--content-text);
  border-radius: 50%;
  height: 1em;
  width: 1em;
}

.ao {
  background: linear-gradient(45deg, var(--checker-color-1) 25%, transparent 25%, transparent 75%, var(--checker-color-1) 75%, var(--checker-color-1)),
                  linear-gradient(45deg, var(--checker-color-1) 25%, transparent 25%, transparent 75%, var(--checker-color-1) 75%, var(--checker-color-1));
  background-size: 1.25em 1.25em, 1.25em 1.25em;
  background-position: 0 0, 0.625em 0.625em;
  background-color: var(--checker-color-2);
  overflow: hidden;
  border: 0.0625em solid var(--input-border);
  border-radius: 0.325em;
  grid-template-rows: auto 1fr auto;
  grid-gap: 1em;
  display: grid;
}

.ap {
  background: var(--faded-color);
  align-items: var(--af-b, center);
  font-size: 0.875em;
  display: flex;
  padding: 1em;
  gap: 1em;
  flex-direction: var(--af-a);
}

.ap > *:last-child {
  margin-left: var(--ag-a, auto);
  width: var(--ag-b);
}

.ap:first-child {
  border-bottom: 0.0625em solid var(--input-border);
}

.ap:last-child {
  border-top: 0.0625em solid var(--input-border);
}

.aq {
  position: relative;
}

.ar {
  position: absolute;
}

.as {
  border-right: var(--ah-b, 2px solid  var(--input-border));
  height: var(--ah-d, 2em);
  border-top: var(--ah-a);
  width: var(--ah-c);
}

.at {
  --highlight-background: #00dbff21;
  --highlight-underline: #c3edff66;
  --highlight-color: #c3edff;
  --highlight: #00dbff;
  --background: #11111133;
  --border: #FFFFFF44;
  --color: #FFFFFFDD;
  grid-template-rows: auto 1fr auto;
  color: var(--color);
  min-height: 100vh;
  display: grid;
  animation: show 1.25s 0.5s both;
}

.au {
  padding: 0 20px;
  margin: 0 auto;
  display: grid;
}

.av {
  text-align: center;
  max-width: 80ch;
  margin: 0 auto;
  margin-top: var(--ai-a, 125px);
}

.av h2 {
  font-family: Plus Jakarta Sans;
  font-weight: 600;
  font-size: var(--aj-a, 36px);
  margin: 0;
}

.av p {
  color: var(--color);
  font-size: 18px;
  margin: 0;
  margin-top: 10px;
  margin-bottom: 30px;
}

.av form {
  max-width: 400px;
  margin: 0 auto;
}

.av input {
  background: var(--background);
  border: 2px solid #FFFFFF66;
  box-sizing: border-box;
  border-radius: 30px;
  height: 50px;
  width: 100%;
  font-family: Open Sans;
  padding: 0 20px;
  font-size: 20px;
  color: white;
}

.av input:focus {
  border-color: var(--highlight);
  outline: none;
}

.av button {
  --tabler-stroke-width: 1.85;
  background: var(--background);
  box-sizing: border-box;
  display: inline-block;
  transition: 120ms;
  cursor: pointer;
  border: 2px solid #FFFFFF66;
  border-radius: 40px;
  font-family: Plus Jakarta Sans;
  text-decoration: none;
  font-weight: 500;
  font-size: 18px;
  padding: 13px 30px 15px 30px;
  margin-top: 20px;
  color: #FFFFFFCC;
}

.av button:hover {
  background: var(--highlight-background);
  border: 2px solid var(--highlight);
}

.aw {
  line-height: 1.5;
  font-size: var(--ak-a, 20px);
}

.aw > * + * {
  margin-top: 40px;
}

.aw section {
  max-width: 80ch;
  margin: 0 auto;
}

.aw section li {
  line-height: 2;
}

.aw section h1 {
  font-family: Plus Jakarta Sans;
  padding-top: 1em;
  font-size: var(--al-a, 36px);
  margin: 0;
  margin-bottom: 10px;
}

.aw section h1 + small {
  margin-bottom: 30px;
  display: block;
  opacity: 0.75;
}

.aw section h2 {
  border-bottom: 4px double var(--border);
  padding-bottom: 15px;
  margin-top: 2em;
  font-size: var(--am-a);
}

.aw section a {
  color: var(--highlight);
}

.aw hr {
  border: 0;
  border-top: 2px dotted var(--border);
  margin-bottom: var(--an-a, 125px);
  margin-top: var(--an-b, 100px);
}

.aw video {
  border: 2px solid var(--border);
  box-sizing: border-box;
  background: #11111199;
  border-radius: 10px;
  max-width: 100%;
  padding: var(--ao-a, 20px);
  width: 100%;
  margin: 40px auto;
  display: block;
}

.ax {
  border: var(--ap-c, 3px solid var(--border));
  background: var(--background);
  border-radius: 10px;
  color: var(--color);
  position: relative;
  font-size: var(--ap-a, 18px);
  padding: var(--ap-b, 30px);
}

.ax::after {
  content: "";
  position: absolute;
  width: 48px;
  left: -51px;
  height: 3px;
  top: 30px;
  background-image: var(--aq-a);
  display: var(--aq-b);
}

.ax::before {
  background: var(--highlight);
  font-weight: bold;
  color: #000;
  border-radius: 0 4px 0 15px;
  padding: 5px 15px 10px 20px;
  position: absolute;
  z-index: 1;
  right: 0;
  top: 0;
  content: var(--ar-a);
}

.ay {
  grid-template-columns: auto 1fr;
  grid-gap: 0.5em;
  display: grid;
  line-height: 1.5;
}

.ay svg {
  margin-top: 0.1em;
  height: 24px;
  width: 24px;
}

.az {
  border-bottom: 1px dashed var(--border);
  margin-bottom: 0.5em !important;
  padding-bottom: 0.5em;
}

.az svg {
  height: 24px;
  width: 24px;
}

.az div {
  border-right: var(--as-b, 1px  solid var(--border));
  display: inline-block;
  padding-right: var(--as-a, 15px);
  margin-right: var(--as-c, 10px);
  line-height: 1.25;
}

.az span {
  font-weight: normal;
  font-size: 16px;
  opacity: 0.75;
  display: var(--at-a);
}

.ba {
  border-bottom: 2px solid var(--border);
  background: var(--background);
  backdrop-filter: blur(15px);
  transition: opacity 300ms;
  position: sticky;
  z-index: 100;
  top: 0;
  opacity: var(--au-a);
}

.bb {
  padding: 0 20px;
  margin: 0 auto;
  height: 60px;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.bc > a svg {
  display: block;
  height: 20px;
  width: 100px;
}

.bc > a svg path {
  fill: var(--color) !important;
}

.bc > a:hover svg path {
  fill: var(--highlight) !important;
}

.bd {
  --tabler-stroke-width: 1.75;
  font-family: Plus Jakarta Sans;
  font-weight: 500;
  font-size: 18px;
  list-style: none;
  display: var(--av-j, flex);
  gap: 30px;
  transition: var(--av-a);
  position: var(--av-b);
  z-index: var(--av-c);
  bottom: var(--av-d);
  right: var(--av-e);
  left: var(--av-f);
  border-top: var(--av-g);
  backdrop-filter: var(--av-h);
  background: var(--av-i);
  padding: var(--av-k);
  transform: var(--av-l);
}

.bd a > *:first-child {
  position: relative;
  margin-right: 7px;
  top: 2px;
}

.bd a {
  text-decoration: none;
  color: var(--color);
}

.bd a:hover {
  color: var(--highlight);
}

.be {
  --tabler-stroke-width: 1.85;
  transition: background 120ms;
  box-sizing: border-box;
  display: inline-block;
  cursor: pointer;
  border: 2px solid var(--highlight);
  border-radius: 1.666em;
  font-family: Plus Jakarta Sans;
  text-decoration: none;
  font-size: var(--aw-a);
  text-align: center;
  font-weight: 500;
  color: var(--highlight-color);
  padding: 0.625em 1.666em 0.7em 1.666em;
  width: var(--aw-b);
}

.be:hover {
  background: var(--highlight-background);
}

.be > svg {
  margin-right: 0.416em;
  position: relative;
  top: 0.125em;
  height: 1em;
  width: 1em;
}

.bf {
  grid-template-areas: var(--ax-b, "title title title""content content content""avatar name rating");
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto 1fr auto;
  grid-gap: 1em;
  display: grid;
  border: var(--ax-a, 3px solid var(--border));
  background: var(--background);
  border-radius: 10px;
  transition: 300ms;
  padding: var(--ax-c, 30px);
}

.bg {
  grid-area: avatar;
  border-radius: 50%;
  height: 40px;
  width: 40px;
}

.bh {
  grid-area: content;
  font-size: var(--ay-a, 18px);
}

.bh > *:first-child {
  margin-top: 0;
}

.bh > *:last-child {
  margin-bottom: 0;
}

.bi {
  font-family: Plus Jakarta Sans;
  font-weight: 600;
  grid-area: title;
  font-size: var(--az-a, 24px);
}

.bj {
  align-self: center;
  grid-area: name;
}

.bk {
  transition: 300ms;
  color: var(--ba-a, var(--border));
  align-self: center;
  grid-area: rating;
  font-size: 30px;
  line-height: 1;
}

.bk path {
  transition: 300ms;
  fill: var(--bb-a);
}

.bl {
  --tabler-stroke-width: 3;
  border-radius: 5px;
  font-size: 16px;
  width: 100%;
}

.bl thead td {
  background: var(--background);
  padding: 0.5em 1em;
  font-weight: bold;
}

.bl thead td:nth-child(2) {
  background: var(--highlight-background);
  color: var(--highlight);
}

.bl thead td:not(:first-child) {
  text-align: center;
  width: 40px;
}

.bl tbody td {
  background: var(--background);
  padding: 0.5em 1em;
}

.bl tbody td:not(:first-child) {
  text-align: center;
  width: 40px;
}

.bl tbody td:nth-child(2) {
  background: var(--highlight-background);
  color: var(--highlight);
}

.bl tbody td:first-child {
  font-weight: bold;
  width: 300px;
}

.bm {
  text-align: center;
  padding: var(--bc-a, 100px 0);
}

.bn {
  font-family: Plus Jakarta Sans;
  font-weight: 500;
  font-size: var(--bd-a, 60px);
  color: #FFF;
  margin: 0;
}

.bo {
  font-family: Open Sans;
  color: var(--color);
  font-weight: 400;
  line-height: 1.5;
  font-size: var(--be-a, 22px);
  margin: 0 auto;
  max-width: 67ch;
  margin-top: 20px;
  margin-bottom: 20px;
}

.bo b {
  color: #FFF;
}

.bp {
  --tabler-stroke-width: 1.85;
  font-family: Plus Jakarta Sans;
  font-weight: 500;
  font-size: 20px;
  justify-content: space-between;
  display: flex;
  margin: 0 auto;
  margin-bottom: 15px;
  max-width: var(--max-width);
  opacity: 0.75;
}

.bp > * {
  color: var(--highlight-color);
  text-decoration: none;
  text-align: left;
  align-items: center;
  display: flex;
  gap: 5px;
}

.bp > * > *:last-child {
  position: relative;
  top: 2px;
}

.bp a > *:last-child {
  transform: scaleX(-1);
}

.bq {
  max-width: var(--max-width);
  aspect-ratio: 16/9;
  position: relative;
  margin: 0 auto;
  color: #FFF;
  z-index: 1;
  background: var(--background);
  background-clip: padding-box;
  border: solid 4px transparent;
  border-radius: 17px;
}

.bq:before {
  position: absolute;
  z-index: -1;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  margin: -4px;
  content: '';
  background: linear-gradient(30deg, #afff83, #588aff);
  border-radius: 14px;
}

.br {
  border-radius: 10px;
  aspect-ratio: var(--bf-b, 16/9);
  display: block;
  width: 100%;
  border: 0;
  transition: opacity 1s;
  opacity: var(--bf-a);
  height: var(--bf-c);
}

.bs {
  border-radius: 10px;
  background: #111;
}

.bt {
  color: var(--highlight-color);
  font-family: Open Sans;
  text-decoration: none;
  display: block;
  opacity: 0.75;
  margin: 0 auto;
  margin-top: 15px;
  margin-bottom: var(--bg-a, 100px);
}

.bu {
  margin-bottom: 60px;
  padding: 0 40px;
  justify-content: center;
  flex-wrap: wrap;
  display: flex;
  gap: 10px;
}

.bv + * {
  margin-top: 4em;
}

.bw {
  font-size: 18px;
}

.bw strong {
  font-size: var(--bh-b, 1.33em);
  font-weight: var(--bh-a, 600);
}

.bw a {
  color: var(--highlight);
}

.bw li + li {
  margin-top: 10px;
}

.bw p {
  color: var(--color);
  margin: 0;
  margin-top: 0.5em;
  font-size: var(--bi-a);
}

.bx {
  font-family: Plus Jakarta Sans;
  font-weight: 400;
  font-size: var(--bj-a, 26px);
  margin: 0;
}

.by {
  font-size: var(--bk-a, 18px);
  margin: 0;
  margin-top: 10px;
  margin-bottom: 20px;
}

.bz {
  background: var(--background);
  color: var(--color);
  border: 3px solid var(--border);
  border-radius: 10px;
  font-family: Open Sans;
  padding: var(--bl-b, 30px);
  grid-template-columns: var(--bl-a, 1fr 1fr);
  grid-gap: var(--bl-c, 7.5vw);
  display: grid;
}

.ca {
  border-top: 2px solid var(--border);
  background: var(--background);
  margin-top: var(--bm-a, 125px);
}

.cb {
  padding: var(--bn-b, 40px 20px 50px);
  margin: 0 auto;
  grid-template-columns: var(--bn-a, 1fr auto);
  align-items: center;
  display: grid;
  max-width: var(--bn-c);
}

.cc p {
  margin-bottom: 0;
}

.cc > svg {
  display: block;
  height: 20px;
  width: 100px;
}

.cd {
  grid-auto-flow: var(--bo-b, column);
  align-items: start;
  grid-gap: var(--bo-c, 100px);
  display: grid;
  grid-template-columns: var(--bo-a);
  margin-top: var(--bo-d);
}

.ce {
  grid-auto-flow: var(--bp-b, column);
  align-items: start;
  grid-gap: var(--bp-c, 30px);
  display: grid;
  grid-template-columns: var(--bp-a);
}

.cf {
  --tabler-stroke-width: 1.75;
  font-size: 18px;
  grid-gap: 10px;
  display: grid;
}

.cf a > *:first-child {
  position: relative;
  margin-right: 7px;
  top: 2px;
}

.cf a {
  text-decoration: none;
  color: var(--color);
}

.cf a:hover {
  color: var(--highlight);
}

.cg {
  font-family: Plus Jakarta Sans;
  font-weight: 600;
  font-size: var(--bq-a, 36px);
  margin: 0;
  margin-top: 1em;
  margin-bottom: 0.25em;
}

.ch {
  font-family: Open Sans;
  color: var(--color);
  font-size: 18px;
  margin: 0;
  margin-bottom: 30px;
}

.ci {
  background: linear-gradient(30deg, #00ff93, #588aff);
  -webkit-background-clip: text;
  color: transparent;
}

.cj {
  --demo-border-color: var(--border);
  --demo-color: var(--color);
}

.cj.highlighted {
  --demo-border-color: var(--highlight);
  --demo-color: var(--highlight-color);
}

.ck {
  border: 3px solid var(--demo-border-color);
  background: var(--background);
  border-radius: 10px;
  position: relative;
  transition: 300ms;
  display: block;
  padding: var(--bu-a, 10px);
}

.cl {
  background: var(--background-color);
  min-height: var(--br-a);
  border-radius: 7px;
  font-size: 16px;
  padding: var(--br-b, 20px);
  display: grid;
}

.cl > a > img {
  width: 100%;
}

.cm {
  font-family: Plus Jakarta Sans;
  color: var(--demo-color);
  font-weight: 600;
  font-size: 18px;
  background: var(--background);
  padding: 10px 15px;
  transition: 300ms;
  border: 2px solid var(--demo-border-color);
  border-radius: 8px;
  position: absolute;
  right: -3px;
  top: -77px;
  display: var(--bv-a);
}

.cm svg {
  --tabler-stroke-width: 2.25;
  position: relative;
  margin-right: 6px;
  top: var(--bs-a);
}

.cm svg g {
  stroke: currentColor !important;
  stroke-width: 2.25;
}

.cn {
  font-family: Plus Jakarta Sans;
  font-size: var(--bt-a);
  font-weight: 600;
  color: #FFF;
  margin: 0;
}

.co {
  font-family: Open Sans;
  color: var(--color);
  line-height: 1.5;
  font-size: var(--bw-a, 18px);
  margin-top: 5px;
  margin-bottom: 30px;
}

.cp {
  position: relative;
  padding-left: var(--bx-a, 50px);
  max-width: 100ch;
  margin: 0 auto;
}

.cp > * + * {
  margin-top: var(--by-a, 40px);
}

.cq {
  border-left: 2px solid var(--border);
  position: absolute;
  bottom: 12px;
  top: 12px;
  left: 0;
  display: var(--bz-a);
}

.cq::before {
  content: "";
  background: var(--border);
  border-radius: 10px;
  height: 12px;
  width: 12px;
  position: absolute;
  left: -7px;
  top: -12px;
}

.cq::after {
  content: "";
  background: var(--border);
  border-radius: 10px;
  height: 12px;
  width: 12px;
  position: absolute;
  bottom: -12px;
  left: -7px;
}

.cr {
  grid-template-columns: var(--ca-a, 1fr 1fr 1fr);
  grid-gap: var(--ca-b, 2em);
  display: grid;
}

.cs {
  font-family: Open Sans;
  text-decoration: none;
  background: var(--background);
  color: var(--color);
  border: 3px solid var(--border);
  border-radius: 10px;
  display: block;
  padding: 10px;
}

.cs > *:first-child {
  aspect-ratio: 16/9;
  height: auto;
  width: 100%;
}

.cs > *:first-child img {
  height: 100%;
  width: 100%;
}

.cs > *:last-child {
  padding: 0 10px 5px;
}

.cs:hover {
  border: 3px solid var(--highlight);
}

.cs strong {
  font-family: Plus Jakarta Sans;
  font-weight: 600;
  font-size: 22px;
  display: block;
  margin-bottom: 2px;
  margin-top: 15px;
}

.cs p {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 10px;
  font-size: 18px;
  margin: 0;
  margin-top: 10px;
}

.cs small {
  font-size: 14px;
  opacity: 0.75;
}

.ct {
  border-left: var(--cb-d, 1px solid var(--border));
  padding-left: var(--cb-c, 3em);
  margin-top: var(--cb-e, 40px);
  border-top: var(--cb-a);
  padding-top: var(--cb-b);
}

.ct > * + * {
  padding-top: var(--cc-a, 80px);
  display: block;
}

.cu {
  grid-template-columns: var(--cd-a, 450px 1fr);
  align-items: start;
  display: grid;
}

.cv {
  padding-right: var(--ce-a, 3em);
}

.cw {
  border-top: 1px solid var(--border);
  padding-top: 20px;
  margin-top: -10px;
}

.cw a + a {
  margin-top: 5px;
}

.cw a {
  --tabler-stroke-width: 1.5;
  text-decoration: none;
  color: var(--color);
  font-size: 20px;
  display: block;
}

.cw a svg {
  position: relative;
  margin-right: 5px;
  top: 3px;
}

.cw a svg g {
  stroke: currentColor;
}

.cw a:hover {
  color: var(--highlight);
}

.cx {
  border: 2px solid var(--highlight);
  background: var(--background);
  border-radius: 10px;
  padding: var(--cf-a, 40px 30px);
  margin: 0 auto;
  width: var(--cf-b, 600px);
}

.cx a {
  color: var(--highlight);
}

.cx p {
  font-size: 18px;
}

.cx ul {
  font-size: 18px;
}

.cx ul {
  padding-left: 1em;
}

.cx li + li {
  margin-top: 6px;
}

.cy {
  font-family: Plus Jakarta Sans;
  text-align: center;
  font-weight: 300;
  font-size: var(--cg-a, 60px);
  margin: 40px 0;
}

.cy sub {
  font-size: var(--ch-a, 36px);
}

.cy sup {
  position: relative;
  font-size: var(--ci-a, 36px);
  left: -5px;
  top: 5px;
}

.cz {
  font-family: Plus Jakarta Sans;
  text-align: center;
  font-weight: 600;
  font-size: var(--cj-a, 24px);
  justify-content: center;
  align-items: center;
  display: flex;
  height: 60px;
}

.da {
  font-family: Plus Jakarta Sans;
  text-align: center;
  font-weight: 600;
  font-size: var(--ck-a, 46px);
  margin: 0;
  margin-bottom: 10px;
  margin-top: 36px;
}

.db {
  text-align: center;
  padding: 0 40px;
}

.db > * + * {
  margin-left: 10px;
}

.dc {
  text-align: center;
  font-size: var(--cl-b, 20px);
  margin: 0;
  margin-bottom: var(--cl-a, 70px);
}

.dd {
  grid-template-columns: var(--cm-a, 450px);
  justify-content: center;
  align-items: center;
  grid-gap: var(--cm-b, 100px);
  display: grid;
  width: var(--cm-c);
}

.de {
  --tabler-stroke-width: 1.5;
  grid-template-rows: 50px auto auto;
  justify-items: center;
  align-items: center;
  display: grid;
}

.de p {
  text-align: center;
  font-size: 18px;
  margin: 0;
  margin-top: 10px;
  margin-bottom: 30px;
}

.df {
  border: 0;
  border-top: 1px solid var(--border);
  max-width: 1000px;
  margin: 0 auto;
  margin-top: 50px;
  margin-bottom: 60px;
}

.dg {
  --tabler-stroke-width: 0.65;
  place-content: center;
  text-align: center;
  display: grid;
}

.dh > * + * {
  margin-top: var(--cn-a, 100px );
}

.di {
  grid-template-columns: var(--co-a, 1fr 1fr);
  grid-gap: var(--co-b, 50px);
  display: grid;
}

.dj::before {
  transition: opacity 320ms;
  pointer-events: none;
  position: sticky;
  display: block;
  content: "";
  z-index: 10;
}

.dj::after {
  transition: opacity 320ms;
  pointer-events: none;
  position: sticky;
  display: block;
  content: "";
  z-index: 10;
}

.dj::-webkit-scrollbar {
  cursor: pointer;
  height: 12px;
  width: 12px;
}

.dj::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

.dj::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
}

.dj:focus {
  outline: 0.125em solid var(--primary-color);
}

.dk {
  max-width: var(--cp-a);
  overscroll-behavior: contain;
  overflow-y: hidden;
  overflow-x: auto;
  display: flex;
  padding-bottom: var(--cp-b);
}

.dk > * {
  flex: 0 0 auto;
}

.dk::before {
  margin-right: var(--cq-a);
  min-width: var(--cq-b);
}

.dk::after {
  margin-right: var(--cq-a);
  min-width: var(--cq-b);
}

.dk::before {
  background: radial-gradient(ellipse farthest-side at left center, var(--scroll-shadow-to), var(--scroll-shadow-from));
  border-image: linear-gradient(0deg, var(--scroll-shadow-from), var(--scroll-shadow-to), var(--scroll-shadow-from)) 1;
  border-left: 0.0625em solid;
  left: 0;
  opacity: var(--ct-a);
}

.dk::after {
  background: radial-gradient(ellipse farthest-side at right center, var(--scroll-shadow-to), var(--scroll-shadow-from));
  border-image: linear-gradient(0deg, var(--scroll-shadow-from), var(--scroll-shadow-to), var(--scroll-shadow-from)) 1;
  border-right: 0.0625em solid;
  right: 0;
  opacity: var(--cu-a);
}

.dl {
  max-height: var(--cr-a);
  overscroll-behavior: contain;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: var(--cr-b);
}

.dl::before {
  margin-top: var(--cs-a);
  min-height: var(--cs-b);
}

.dl::after {
  margin-top: var(--cs-a);
  min-height: var(--cs-b);
}

.dl::before {
  background: radial-gradient(ellipse farthest-side at top center, var(--scroll-shadow-to), var(--scroll-shadow-from));
  border-image: linear-gradient(90deg, var(--scroll-shadow-from), var(--scroll-shadow-to), var(--scroll-shadow-from)) 1;
  border-top: 0.0625em solid;
  top: 0;
  opacity: var(--cv-a);
}

.dl::after {
  background: radial-gradient(ellipse farthest-side at bottom center, var(--scroll-shadow-to), var(--scroll-shadow-from));
  border-image: linear-gradient(90deg, var(--scroll-shadow-from), var(--scroll-shadow-to), var(--scroll-shadow-from)) 1;
  border-bottom: 0.0625em solid;
  bottom: 0;
  opacity: var(--cw-a);
}

.dm {
  font-size: var(--cy-a);
  font-family: var(--font-family);
  text-align: var(--cy-b);
  word-break: break-word;
  line-height: 1.7;
  display: var(--cy-c);
}

.dm > *:first-child {
  margin-top: 0;
}

.dm > *:last-child {
  margin-bottom: 0;
}

.dm h1 {
  margin-bottom: 0.35em;
  margin-top: 2em;
  line-height: 1.2em;
}

.dm h2 {
  margin-bottom: 0.35em;
  margin-top: 2em;
  line-height: 1.2em;
}

.dm h3 {
  margin-bottom: 0.35em;
  margin-top: 2em;
  line-height: 1.2em;
}

.dm h4 {
  margin-bottom: 0.35em;
  margin-top: 2em;
  line-height: 1.2em;
}

.dm h5 {
  margin-bottom: 0.35em;
  margin-top: 2em;
  line-height: 1.2em;
}

.dm h1 + * {
  margin-top: 0;
}

.dm h2 + * {
  margin-top: 0;
}

.dm h3 + * {
  margin-top: 0;
}

.dm h4 + * {
  margin-top: 0;
}

.dm h5 + * {
  margin-top: 0;
}

.dm ul {
  padding-left: 1.5em;
}

.dm ol {
  padding-left: 1.5em;
}

.dm li + li {
  margin-top: 0.5em;
}

.dm a:not([name]):not([class]) {
  color: var(--primary-color);
  text-decoration: none;
}

.dm a:not([name]):not([class]) code:not([class]) {
  color: inherit;
}

.dm a:not([name]):not([class]) kbd:not([class]) {
  color: inherit;
}

.dm a:not([name]):not([class]):focus {
  outline: 0.125em dotted var(--primary-color);
  text-decoration: underline;
  outline-offset: 0.125em;
}

.dm a:not([name]):not([class])[target="_blank"]:after {
  transform: scaleX(-1);
  display: inline-block;
  margin-left: 0.1em;
  content: " ⎋";
}

.dm code:not([class]) {
  border: 0.0625em solid var(--input-border);
  background: var(--input-color);
  color: var(--input-text);
  padding: 0.35em 0.45em 0.2em;
  border-radius: 0.25em;
  font-size: 0.875em;
}

.dm kbd:not([class]) {
  border: 0.0625em solid var(--input-border);
  background: var(--input-color);
  color: var(--input-text);
  padding: 0.35em 0.45em 0.2em;
  border-radius: 0.25em;
  font-size: 0.875em;
}

.dm kbd:not([class]) {
  border-bottom: 0.1875em solid var(--input-border);
}

.dm pre:not([class]) code:not([class]) {
  padding: 0.5em 0.75em;
  display: block;
}

.dm video:not([class]) {
  border-radius: 0.25em;
  width: 100%;
}

.dm img:not([class]) {
  border-radius: 0.25em;
  width: 100%;
}

.dn {
  box-shadow: 0 0 0.625em var(--shadow-color);
  background: var(--content-color);
  color: var(--content-text);
  border-radius: 0.5em;
  padding: 1.25em;
  display: var(--da-a);
}

.dp {
  border-bottom: 0.0625em solid var(--title-border);
  padding-bottom: 0.5em;
  margin-bottom: 1em;
  font-family: var(--title-font-family);
  color: var(--title-color);
  font-weight: bold;
  font-size: 1.25em;
}

.dq {
  padding-left: 0.75em;
  font-size: 0.875em;
  font-weight: bold;
  opacity: 0.85;
}

.dr {
  font-size: var(--cz-a);
  grid-gap: 0.5em;
  display: grid;
  grid-template-rows: var(--cz-b);
}

.ds {
  transition: transform 320ms, opacity 320ms;
  font-size: var(--db-a);
  z-index: var(--db-b);
  position: var(--db-c);
  bottom: var(--db-d);
  right: var(--db-e);
  transform: var(--db-f);
  opacity: var(--db-g);
}

.dt {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  justify-content: center;
  display: inline-flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  outline: none;
  padding: 0;
  border: 0.0625em solid var(--input-border);
  font-size: var(--dc-a);
  border-radius: 0.375em;
  height: 2.125em;
  width: 2.125em;
  background-color: var(--dc-b);
  border-color: var(--dc-c);
  color: var(--dc-d);
}

.dt::-moz-focus-inner {
  border: 0;
}

.dt:focus {
  box-shadow: var(--dd-a);
  background-color: var(--dd-b);
  border-color: var(--dd-c);
  color: var(--dd-d);
}

.dt:disabled {
  filter: saturate(0) brightness(0.8) contrast(0.5);
  cursor: not-allowed;
}

.du {
  width: var(--de-a);
  transition: var(--de-b);
  transform: var(--de-c);
  opacity: var(--de-d);
  visibility: var(--de-e);
}

.dv {
  border-radius: 0.25em;
  height: 1.25em;
  width: 2.5em;
  background: var(--df-a);
  background-position: 0 0, 0.625em 0.625em;
  background-color: var(--checker-color-2);
  background-size: 1.25em 1.25em;
  border: var(--df-b);
}

.dw {
  font-family: monospace;
  grid-template-columns: 1fr auto;
  align-items: center;
  grid-gap: 1em;
  display: grid;
}

.dx {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0.375em;
  display: inline-block;
  font-size: var(--dg-a);
  font-family: var(--font-family);
  font-weight: bold;
  box-sizing: border-box;
  text-decoration: none;
  user-select: none;
  position: relative;
  cursor: pointer;
  outline: none;
  padding: 0;
  margin: 0;
  border: 0;
  background-color: var(--dg-b);
  color: var(--dg-c);
}

.dx::-moz-focus-inner {
  border: 0;
}

.dx:focus::before {
  content: "";
  border-radius: 0.25em;
  position: absolute;
  bottom: 0.1875em;
  right: 0.1875em;
  left: 0.1875em;
  top: 0.1875em;
  border: var(--di-a);
}

.dx:hover {
  background-color: var(--dj-a);
}

.dx:focus {
  background-color: var(--dj-a);
}

.dx:disabled {
  filter: saturate(0) brightness(0.8) contrast(0.5);
  cursor: not-allowed;
}

.dy {
  justify-content: var(--dh-a);
  align-items: center;
  display: flex;
  box-sizing: border-box;
  padding: 0.75em 1.25em;
}

.dz {
  padding-bottom: 0.05em;
  line-height: 1.2;
  word-break: var(--dk-a);
  text-overflow: var(--dk-b);
  white-space: var(--dk-c);
  overflow: var(--dk-d);
}

.ea {
  -moz-user-select: none;
  user-select: var(--dl-i, none);
  font-size: var(--dl-a);
  font-family: var(--font-family);
  grid-gap: 1em;
  display: grid;
  border: var(--dl-b);
  background: var(--dl-c);
  color: var(--dl-d);
  border-radius: var(--dl-e);
  padding: var(--dl-f);
  filter: var(--dl-g);
  cursor: var(--dl-h);
}

.eb {
  grid-template-columns: repeat(7, 1fr);
  justify-items: center;
  align-items: center;
  grid-gap: 0.3125em;
  display: grid;
  width: 100%;
  pointer-events: var(--dm-a);
}

.ec {
  align-items: center;
  line-height: 2;
  display: flex;
}

.ed {
  text-align: center;
  font-weight: bold;
  flex: 1;
}

.ee {
  text-transform: uppercase;
  text-align: center;
  font-weight: bold;
  font-size: 0.74em;
  opacity: 0.5;
  width: 2em;
}

.ef {
  justify-content: space-around;
  white-space: nowrap;
  display: flex;
  line-height: 1;
}

.eg {
  font-size: var(--dn-a);
  outline: none;
  padding: var(--dn-b);
}

.eg:focus {
  outline: var(--dp-a);
}

.eh {
  grid-gap: 0.3125em;
  display: grid;
}

.ei {
  font-size: var(--dq-a);
  justify-content: center;
  flex-direction: column;
  align-items: center;
  display: flex;
  flex: 1;
  padding: var(--dq-b);
}

.ej {
  font-family: var(--title-font-family);
  text-align: center;
  font-weight: bold;
  margin-top: 1em;
  font-size: var(--dr-a);
}

.ek {
  margin-bottom: 2em;
  margin-top: 0.5em;
  text-align: center;
  font-size: var(--ds-a);
}

.el {
  display: grid;
}

.em {
  grid-auto-flow: var(--dt-a, column);
  display: grid;
  grid-gap: var(--dt-b);
}

.en {
  background: rgba(0, 0, 0, 0.8);
  position: fixed;
  z-index: 1000;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  font-size: var(--du-a);
  justify-content: flex-end;
  flex-direction: column;
  display: flex;
  transition: var(--du-b);
  visibility: var(--du-c);
  opacity: var(--du-d);
}

.eo {
  box-sizing: border-box;
  padding: 0 1em;
  height: 3em;
  width: 100%;
  outline: 0;
  margin: 0;
  border: 0;
  text-decoration: none;
  font-family: inherit;
  font-size: inherit;
  color: var(--dv-b, inherit);
  grid-auto-flow: column;
  justify-content: start;
  align-items: center;
  grid-gap: 0.75em;
  display: grid;
  background: var(--dv-a);
  font-weight: var(--dv-c);
  cursor: var(--dv-d);
}

.ep:hover {
  color: var(--dw-a);
}

.ep:focus {
  color: var(--dw-a);
}

.eq {
  background: var(--content-border);
  height: 0.125em;
  border: 0;
}

.er {
  transition: transform 320ms, opacity 320ms;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  text-align: center;
  overflow: auto;
  min-height: 0;
  transform: var(--dx-a);
  opacity: var(--dx-b);
}

.es {
  border-radius: 0.5em;
  overflow: hidden;
  margin: 1em;
  background: var(--content-color);
  font-family: var(--font-family);
  color: var(--content-text);
  text-align: left;
  display: var(--dy-a);
  min-width: var(--dy-b);
}

.es > * {
  border: 0;
}

.es > * + * {
  border-top: 0.0625em solid var(--content-faded-border);
}

.et {
  grid-template-columns: 0.4375em 1fr;
  display: grid;
}

.eu {
  border-right: 0.0625em solid var(--content-faded-border);
  background: var(--content-faded-color);
}

.ev > * + * {
  border-top: 0.0625em solid var(--content-faded-border);
}

.ew {
  padding: 0.5em 1em;
}

.ex {
  font-size: inherit;
  color: inherit;
  appearance: none;
  background: none;
  display: block;
  outline: none;
  width: 100%;
  padding: 0;
  margin: 0;
}

.ey {
  grid-template-areas: "rect hue""alpha alpha";
  grid-template-columns: 13em 1em;
  grid-template-rows: 13em 1em;
  grid-gap: 1em;
  display: grid;
  width: 15em;
  font-size: var(--dz-a);
  user-select: none;
  padding: var(--dz-b);
  border: var(--dz-c);
  background-color: var(--dz-d);
  border-radius: var(--dz-e);
}

.ez {
  background-image: linear-gradient(0deg, #000 0%, transparent 100%),
                        linear-gradient(90deg, #FFF 0%, rgba(0,0,0,0) 100%);
  background-color: var(--ea-a);
  border: 0.0625em solid var(--input-border);
  background-clip: content-box;
  border-radius: 0.25em;
  position: relative;
  touch-action: none;
  grid-area: rect;
  cursor: move;
}

.fa {
  background: linear-gradient(to bottom, #F00 0%, #FF0 17%, #0F0 33%,#0FF 50%, #00F 67%, #F0F 83%, #F00 100%);
  background-clip: content-box;
  border: 0.0625em solid var(--input-border);
  border-radius: 0.25em;
  position: relative;
  cursor: row-resize;
  touch-action: none;
  grid-area: hue;
}

.fb {
  border: 0.0625em solid var(--input-border);
  border-radius: 0.25em;
  background-image: var(--eb-a);
  background-position: 0 0, 0 0, 0.5em 0.5em;
  background-size: 100%, 1em 1em, 1em 1em;
  background-clip: content-box;
  background-color: #DDD;
  touch-action: none;
  position: relative;
  cursor: col-resize;
  grid-area: alpha;
}

.fc {
  grid-template-columns: 7em repeat(4, 1fr);
  grid-column: 1 / 3;
  grid-gap: 0.333em;
  display: grid;
  font-size: 0.75em;
}

.fc label {
  text-align: center;
}

.fc input {
  font-family: monospace;
  font-size: 1.0875em;
  text-align: center;
  font-weight: bold;
  padding: 0.2em 0 0 0;
  background: var(--ef-a);
}

.fd {
  color: var(--input-text);
  margin-bottom: 0.15em;
  text-align: center;
  font-weight: bold;
}

.fe {
  background: rgba(102, 102, 102, 0.6);
  pointer-events: none;
  position: absolute;
  box-shadow: var(--eg-a);
}

.ff {
  transform: translate3d(0,0,0) translate(-50%,-50%);
  border-radius: 0.125em;
  height: 0.5em;
  width: 0.5em;
  left: var(--ec-a);
  top: var(--ec-b);
}

.fg {
  transform: translate3d(0,0,0) translateY(-50%);
  top: var(--ed-a);
  border-radius: 0.125em;
  right: -0.125em;
  left: -0.125em;
  height: 0.4em;
}

.fh {
  transform: translate3d(0,0,0) translateX(-50%);
  left: var(--ee-a);
  border-radius: 0.125em;
  bottom: -0.125em;
  top: -0.125em;
  width: 0.4em;
}

.fi {
  text-align: left;
}

.fj {
  display: flex;
  flex-direction: var(--eh-a);
  align-items: var(--eh-b);
}

.fk {
  color: var(--danger-color);
  margin-top: 0.3125em;
  align-items: start;
  display: flex;
  font-family: var(--font-family);
  font-size: 0.875em;
  font-weight: bold;
}

.fk > *:first-child {
  position: relative;
  top: 0.25em;
}

.fl {
  flex: 0 0 auto;
  height: 0.5em;
  width: 0.5em;
}

.fm {
  font-family: var(--font-family);
  color: var(--content-text);
  font-size: 0.875em;
  font-weight: bold;
  flex: var(--ei-a);
  white-space: var(--ei-b);
  line-height: var(--ei-c);
}

.fn {
  font-size: var(--ej-a);
  justify-content: var(--ej-b);
  align-items: var(--ej-c);
  display: flex;
  flex-direction: var(--ej-d);
}

.fo {
  height: var(--ek-a);
  width: var(--ek-b);
  flex: 0 0 auto;
}

.fp {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  background: rgba(0, 0, 0, 0.8);
  max-height: 100vh;
  overflow-y: auto;
  display: flex;
  transform: translate3d(0,0,0);
  z-index: var(--el-a);
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  transition: var(--el-b);
  pointer-events: var(--el-c);
  visibility: var(--el-d);
  opacity: var(--el-e);
}

.fq {
  transition: var(--em-a);
  padding: 1em;
  margin: auto;
  transform: var(--em-b);
}

.fr {
  border: 0.0625em solid var(--input-border);
  padding: 0.4375em 0.625em;
  box-sizing: border-box;
}

.fs {
  background-color: var(--input-color);
  color: var(--ep-j, inherit);
  border-radius: 0.375em;
  font-family: inherit;
  line-height: inherit;
  font-weight: inherit;
  font-size: inherit;
  outline: none;
  margin: 0;
  position: var(--ep-a);
  overflow: var(--ep-b);
  height: var(--ep-c);
  width: var(--ep-d);
  left: var(--ep-e);
  top: var(--ep-f);
  resize: var(--ep-g);
  border-color: var(--ep-h);
  background: var(--ep-i);
}

.fs:focus {
  border-color: var(--eo-a);
  background: var(--eo-b);
  color: var(--eo-c);
}

.fs:disabled {
  filter: saturate(0) brightness(0.8) contrast(0.5);
  cursor: not-allowed;
  user-select: none;
}

.ft {
  word-break: break-word;
  word-wrap: break-word;
  white-space: pre-wrap;
  visibility: hidden;
  user-select: none;
  display: block;
}

.fu {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  font-size: var(--en-a);
  font-family: var(--font-family);
  min-height: 2.375em;
  line-height: 1.3em;
  word-break: break-word;
  word-wrap: break-word;
  position: relative;
  overflow: visible;
  display: inline-grid;
  width: 100%;
}

.fv {
  height: var(--eq-a);
  overflow: visible;
  transition: var(--eq-b);
  transform: var(--eq-c);
  margin-bottom: var(--eq-d);
}

.fw {
  box-shadow: 0 0 1em rgba(0, 0, 0, 0.2);
  background: rgba(25, 25, 25, 0.985);
  padding: 0.75em 1.5em 0.85em;
  border-radius: 0.5em;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  display: block;
  font-family: var(--font-family);
  font-weight: 600;
  color: white;
}

.fw::before {
  animation: var(--er-a);
  background: var(--primary-color);
  content: "";
  position: absolute;
  height: 0.1875em;
  display: block;
  left: 0;
  top: 0;
}

.fx {
  font-size: var(--es-a);
  justify-content: center;
  display: inline-flex;
  align-items: center;
  cursor: var(--es-b);
  opacity: var(--es-c);
}

.fx:focus {
  color: var(--eu-a);
}

.fx:hover {
  color: var(--eu-a);
}

.fx svg {
  opacity: var(--et-a);
  fill: currentColor;
  height: 1em;
  width: 1em;
  pointer-events: var(--et-b);
  cursor: var(--et-c);
}

.fy {
  color: inherit;
}

.fz {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-appearance: none;
  appearance: none;
  background: none;
  color: inherit;
  outline: 0;
  padding: 0;
  border: 0;
  margin: 0;
}

.ga {
  object-position: var(--ev-a);
  object-fit: var(--ev-b);
  transition: opacity 200ms;
  border-radius: inherit;
  height: inherit;
  display: block;
  width: inherit;
  opacity: var(--ev-c);
}

.gb {
  background: var(--ew-a);
  height: var(--ew-b);
  width: var(--ew-c);
  border-radius: var(--ew-d);
}

.gc {
  z-index: var(--ex-a);
  position: fixed;
  left: var(--ex-b);
  top: var(--ex-c);
  pointer-events: var(--ex-d);
}

.gd {
  font-size: var(--ey-a);
  border-radius: 0.25em;
  justify-content: center;
  align-items: center;
  display: flex;
  cursor: pointer;
  min-height: 2em;
  min-width: 2em;
  height: 100%;
  width: 100%;
  opacity: var(--ey-b);
  pointer-events: var(--ey-c);
  background: var(--ey-d);
  color: var(--ey-e);
}

.gd:hover {
  background: var(--primary-color);
  color: var(--primary-text);
}

.ge {
  font-size: var(--ez-a);
  font-family: var(--font-family);
  line-height: 1.2;
  align-items: center;
  display: flex;
  height: 2em;
}

.gf {
  display: inline-block;
  margin: 0 0.75em;
  opacity: 0.4;
}

.gg {
  text-decoration: none;
  outline: none;
}

.gg::-moz-focus-inner {
  border: 0;
}

.gg:hover {
  color: var(--primary-color);
}

.gg:focus {
  color: var(--primary-color);
}

.gh {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  color: inherit;
}

.gh:not(:last-child) {
  opacity: 0.75;
}

.gi {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  background: rgba(0, 0, 0, 0.8);
  transform: translate3d(0,0,0);
  z-index: var(--fa-a);
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  transition: var(--fa-b);
  pointer-events: var(--fa-c);
  visibility: var(--fa-d);
  opacity: var(--fa-e);
}

.gj {
  transition: var(--fb-a);
  border-right: 0.0625em solid var(--content-border);
  background: var(--content-color);
  color: var(--content-text);
  min-width: var(--fb-b);
  padding: 1.5em;
  position: absolute;
  bottom: 0;
  right: 0;
  top: 0;
  transform: var(--fb-c);
}

.gk {
  position: fixed;
  z-index: 1100;
  right: 1em;
  top: 1em;
  flex-direction: column;
  align-items: flex-end;
  display: flex;
}

.gl {
  box-shadow: 0 0.125em 0.625em -0.125em var(--shadow-color);
  border: 0.0625em solid var(--content-border);
  border-radius: 0.5em;
  width: var(--fc-a);
  background: var(--content-color);
  color: var(--content-text);
  font-size: var(--fc-b);
  font-family: var(--font-family);
}

.gm {
  border-bottom: 0.0714em solid var(--input-border);
  border-radius: 0.5em 0.5em 0 0;
  padding: 0.5714em 0.85714em;
  background: var(--input-color);
  color: var(--input-text);
  font-size: 0.875em;
  font-weight: bold;
}

.gn {
  padding: 0.75em;
}

.go {
  -webkit-appearance: none;
  box-sizing: border-box;
  font-size: var(--fd-a);
  background: transparent;
  vertical-align: middle;
  cursor: pointer;
  width: 100%;
  padding: 0;
  margin: 0;
}

.go::-webkit-slider-thumb {
  -webkit-appearance: none;
  margin-top: -0.26875em;
}

.go::-webkit-slider-thumb {
  background-color: var(--primary-color);
  box-sizing: border-box;
  border-radius: 0.2em;
  height: 1.125em;
  width: 0.85em;
  border: 0;
}

.go::-moz-range-thumb {
  background-color: var(--primary-color);
  box-sizing: border-box;
  border-radius: 0.2em;
  height: 1.125em;
  width: 0.85em;
  border: 0;
}

.go::-ms-thumb {
  background-color: var(--primary-color);
  box-sizing: border-box;
  border-radius: 0.2em;
  height: 1.125em;
  width: 0.85em;
  border: 0;
}

.go:focus::-webkit-slider-thumb {
  background-color: var(--primary-color);
}

.go:focus::-moz-range-thumb {
  background-color: var(--primary-color);
}

.go:focus::-ms-thumb {
  background-color: var(--primary-color);
}

.go::-webkit-slider-runnable-track {
  border: 0.0625em solid var(--input-border);
  background-color: var(--input-color);
  box-sizing: border-box;
  border-radius: 0.2em;
  height: 0.625em;
  background-image: linear-gradient(var(--primary-color), var(--primary-color));
  background-size: var(--fe-a);
  background-position-y: 0.125em;
  background-position-x: 0.125em;
  background-repeat: no-repeat;
}

.go::-moz-range-track {
  border: 0.0625em solid var(--input-border);
  background-color: var(--input-color);
  box-sizing: border-box;
  border-radius: 0.2em;
  height: 0.625em;
  background-image: linear-gradient(var(--primary-color), var(--primary-color));
  background-size: var(--fe-a);
  background-position-y: 0.125em;
  background-position-x: 0.125em;
  background-repeat: no-repeat;
}

.go::-ms-track {
  border: 0.0625em solid var(--input-border);
  background-color: var(--input-color);
  box-sizing: border-box;
  border-radius: 0.2em;
  height: 0.625em;
  background-image: linear-gradient(var(--primary-color), var(--primary-color));
  background-size: var(--fe-a);
  background-position-y: 0.125em;
  background-position-x: 0.125em;
  background-repeat: no-repeat;
}

.go:focus::-webkit-slider-runnable-track {
  background-color: var(--input-focus-color);
  border-color: var(--input-focus-border);
  color: var(--input-focus-text);
}

.go:focus::-moz-range-track {
  background-color: var(--input-focus-color);
  border-color: var(--input-focus-border);
  color: var(--input-focus-text);
}

.go:focus::-ms-track {
  background-color: var(--input-focus-color);
  border-color: var(--input-focus-border);
  color: var(--input-focus-text);
}

.go:focus {
  outline: none;
}

.go::-moz-focus-outer {
  border: 0;
}

.go:disabled {
  filter: saturate(0) brightness(0.8) contrast(0.5);
  cursor: not-allowed;
  user-select: none;
}

.gp {
  font-size: var(--ff-a);
  display: inline-block;
  position: relative;
  width: 100%;
  filter: var(--ff-b);
  cursor: var(--ff-c);
}

.gq {
  font-family: var(--font-family);
  font-size: inherit;
  line-height: 1em;
  border: 0.0625em solid var(--input-border);
  background: var(--fg-c, var(--input-color));
  color: var(--fg-d, var(--input-text));
  border-radius: 0.375em;
  padding: 0 0.875em;
  height: 2.75em;
  box-sizing: border-box;
  box-shadow: none;
  outline: none;
  width: 100%;
  filter: none;
  padding-right: var(--fg-a);
  border-color: var(--fg-b);
}

.gq:focus {
  border-color: var(--fh-a);
  background: var(--fh-b);
  color: var(--fh-c);
}

.gq:disabled {
  cursor: not-allowed;
}

.gr {
  top: calc(50% - 0.5em);
  right: 0.6875em;
  position: absolute;
  cursor: pointer;
  display: grid;
  pointer-events: var(--fi-a);
  color: var(--fi-b);
}

.gr:hover {
  color: var(--primary-color);
}

.gs {
  pointer-events: var(--fj-a);
}

.gs * {
  outline: none !important;
}

.gt {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-appearance: none;
  appearance: none;
  box-shadow: 0 0 0.2em rgba(0,0,0,0.25);
  border-radius: 50%;
  padding: 0;
  border: 0;
  margin: 0;
  cursor: pointer;
  outline: none;
  font-size: var(--fk-a);
  height: 1em;
  width: 1em;
  justify-content: center;
  align-items: center;
  display: flex;
  background: var(--fk-b);
  color: var(--fk-c);
}

.gt:focus::before {
  content: "";
  border-radius: 50%;
  position: absolute;
  bottom: 0.1875rem;
  right: 0.1875rem;
  left: 0.1875rem;
  top: 0.1875rem;
  border: var(--fl-a);
}

.gt:hover {
  filter: brightness(0.8) contrast(1.5);
}

.gt:focus {
  filter: brightness(0.8) contrast(1.5);
}

.gu {
  border: 0.0625em solid var(--input-border);
  background: var(--fm-f, var(--input-color));
  color: var(--fm-g, var(--input-text));
  border-radius: 0.375em;
  padding: 0 0.875em;
  height: 2.75em;
  font-size: var(--fm-a);
  font-family: sans-serif;
  line-height: 1.25em;
  box-sizing: border-box;
  position: relative;
  user-select: var(--fm-d, none);
  outline: none;
  display: grid;
  filter: var(--fm-b);
  cursor: var(--fm-c);
  border-color: var(--fm-e);
}

.gv {
  user-select: none;
  opacity: 0.5;
}

.gw {
  align-items: center;
  grid-gap: 0.625em;
  display: grid;
  grid-template-columns: var(--fn-a);
}

.gx {
  font-size: var(--fo-a);
  border-radius: 0.25em;
  user-select: none;
  padding: 0.625em;
  cursor: pointer;
  grid-auto-flow: column;
  justify-content: start;
  align-items: center;
  grid-gap: 0.25em;
  display: grid;
  background: var(--fo-b);
  color: var(--fo-c);
}

.gx:hover {
  background: var(--primary-color);
  color: var(--primary-text);
  filter: var(--fp-a);
}

@keyframes rotate {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg) ;
  }
}

@media (min-width: 701px) and (max-width: 1030px) {
  .ah {
    grid-template-columns: 1fr 1fr;
  }

  .ah > *:first-child {
    grid-column: span 2;
    min-height: 30vh;
  }
}

@media (max-width: 700px) {
  .ah {
    grid-template-columns: 1fr;
  }

  .ah > *:first-child {
    min-height: 30vh;
  }
}

@keyframes show {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@media (max-width: 1280px) {
  .au {
    max-width: 1200px;
  }

  .bb {
    max-width: 1200px;
  }

  .cb {
    max-width: 1200px;
  }
}

@media (min-width: 1281px) {
  .au {
    max-width: 80%;
  }

  .bb {
    max-width: 80%;
  }

  .cb {
    max-width: 80%;
  }
}

@media (max-width: 400px) {
  .bl {
    font-size: 14px;
  }
}

@media (max-width: 320px) {
  .bl {
    font-size: 12px;
  }
}

@supports (-moz-appearance:none) {
  .dl {
    padding-right: var(--cx-a);
  }
}

@media (max-width: 900px) {
  .fw {
    font-size: 0.875em;
  }

  .gk {
    width: calc(100vw - 1em);
    left: 1em;
  }
}

@keyframes duration-notification {
  0% {
    width: 100%;
  }

  100% {
    width: 0;
  }
}