@layer base, components, utilities;

@layer components {
@property --n {
  syntax: '<integer>';
  inherits: true;
  initial-value: 1;
}
@keyframes z-fade-scale {
  0% {
    opacity: 0;
    scale: 0.5;
  }

  50% {
    opacity: 1;
    scale: 1;
  }

  100% {
    opacity: 0;
    scale: 2;
  }
}
@keyframes z-pointer {
  0%, 100% {
    pointer-events: none;
  }

  50% {
    pointer-events: auto;
  }
}
@keyframes grid-pan-y {
  to {
    background-position-y:
      calc(var(--gy) - (var(--n) - 1) * round(nearest, 80cqh, var(--grid-size))),
      calc(var(--gy) - (var(--n) - 1) * round(nearest, 80cqh, var(--grid-size))),
      calc(var(--gy) - (var(--n) - 1) * round(nearest, 50cqh, calc(var(--grid-size) * 0.5))),
      calc(var(--gy) - (var(--n) - 1) * round(nearest, 50cqh, calc(var(--grid-size) * 0.5)));
  }
}
@keyframes grid-pan-x {
  to {
    background-position-x:
      calc(var(--gx) - (var(--n) - 1) * round(nearest, 80cqw, var(--grid-size))),
      calc(var(--gx) - (var(--n) - 1) * round(nearest, 80cqw, var(--grid-size))),
      calc(var(--gx) - (var(--n) - 1) * round(nearest, 50cqw, calc(var(--grid-size) * 0.5))),
      calc(var(--gx) - (var(--n) - 1) * round(nearest, 50cqw, calc(var(--grid-size) * 0.5)));
  }
}
@keyframes grid-zoom-out {
  0% {
    background-size:
      var(--grid-size) var(--grid-size),
      var(--grid-size) var(--grid-size),
      calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
      calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5);
    opacity: 1;
    background-position:
      var(--gx) var(--gy),
      var(--gx) var(--gy),
      var(--gx) var(--gy),
      var(--gx) var(--gy);
  }

  97% {
    opacity: 0;
  }

  100% {
    background-size:
      calc(var(--grid-size) * 2) calc(var(--grid-size) * 2),
      calc(var(--grid-size) * 2) calc(var(--grid-size) * 2),
      var(--grid-size) var(--grid-size),
      var(--grid-size) var(--grid-size);
    opacity: 0;
    background-position:
      var(--zx) var(--zy),
      var(--zx) var(--zy),
      var(--zx-m) var(--zy-m),
      var(--zx-m) var(--zy-m);
  }
}
@keyframes grid-zoom-in {
  0% {
    background-size:
      calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
      calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
      calc(var(--grid-size) * 0.25) calc(var(--grid-size) * 0.25),
      calc(var(--grid-size) * 0.25) calc(var(--grid-size) * 0.25);
    opacity: 0;
    background-position:
      var(--gx) var(--gy),
      var(--gx) var(--gy),
      var(--gx) var(--gy),
      var(--gx) var(--gy);
  }

  97% {
    opacity: 1;
  }

  100% {
    background-size:
      var(--grid-size) var(--grid-size),
      var(--grid-size) var(--grid-size),
      calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
      calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5);
    opacity: 1;
    background-position:
      var(--zx) var(--zy),
      var(--zx) var(--zy),
      var(--zx-m) var(--zy-m),
      var(--zx-m) var(--zy-m);
  }
}

.stylecheat,
[stylecheat] {
/* ---- A.css ---- */
.a:is(.primary, .secondary, .tertiary, [primary], [secondary], [tertiary]),
a:is(.primary, .secondary, .tertiary, [primary], [secondary], [tertiary]) {
  transition: all 100ms ease-in-out;
  text-decoration: none;

  &.primary,
  &[primary] {
    color: oklch(from var(--primary) calc(l/2 + 0.3) c h);

    &:hover,
    &:focus {
      color: oklch(from var(--primary) calc(l/2 + 0.4) c h);
    }
  }

  &.secondary,
  &[secondary] {
    color: oklch(from var(--secondary) calc(l/2 + 0.15 - 0.1 * var(--theme-sign)) c h);

    &:hover,
    &:focus {
      color: oklch(from var(--secondary) calc(l/2 + 0.3 - 0.1 * var(--theme-sign)) c h);
    }
  }

  &.tertiary,
  &[tertiary] {
    /* Start - Button tertiary styles */
    display: flex;
    border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));
    padding: calc(var(--unit) * 1.5) calc(var(--unit) * 3);
    outline-offset: 0;
    /* End - Button tertiary styles */

    background-color: transparent;
    color: var(--secondary-foreground);
    outline-color: transparent;

    &:hover {
      background-color: oklch(from var(--secondary) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      color: oklch(from var(--secondary-foreground) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      outline-color: oklch(from var(--secondary) calc(l * (1 - 0.075 * var(--theme-sign))) c h);
    }

    &:active {
      outline-color: transparent;
    }

    &:focus-visible {
      outline-width: 3px;
      outline-color: oklch(from var(--primary) calc(l * (1 - 0.075 * var(--theme-sign))) c h);
    }
  }

  &:active {
    transform: translateY(1px);
  }

  &:focus-visible {
    outline-width: 3px;
    outline-color: oklch(from var(--primary) calc(l/2 + 0.4) c h);
  }
}
/* ---- Accordion.css ---- */
.accordion,
accordion {
  display: grid;
  width: 100%;
  grid-template-rows: 0fr;
  transition: grid-template-rows 200ms ease-out;
}

.accordion:is(.open),
accordion:is([open]) {
  grid-template-rows: 1fr;
}

.accordion > .accordion-content,
accordion > accordion-content {
  overflow: hidden;
}
/* ---- Button.css ---- */
.button:is(.primary, .secondary, .tertiary, [primary], [secondary], [tertiary]),
button:is(.primary, .secondary, .tertiary, [primary], [secondary], [tertiary]) {
  display: flex;
  align-items: center;
  justify-content: center;

  white-space: nowrap;
  gap: calc(var(--unit) * 1);

  background-color: transparent;

  border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));
  padding: calc(var(--unit) * 1.5) calc(var(--unit) * 3);
  outline-width: 1px;

  cursor: pointer;

  > * {
    margin-inline: calc(-1.5 * var(--unit));
  }

  &.primary,
  &[primary] {
    background-color: var(--primary);
    color: var(--primary-foreground);
    outline-color: oklch(from var(--primary) calc(l * (1 - 0.15)) c h);

    &:enabled:hover {
      background-color: oklch(from var(--primary) calc(l * (1 + 0.1 * var(--theme-sign))) c h);
      color: oklch(from var(--primary-foreground) calc(l * (1 + 0.1 * var(--theme-sign))) c h);
      outline-color: oklch(from var(--primary) calc(l * (1 + 0.075 * var(--theme-sign))) c h);
    }

    &:focus-visible:enabled {
      outline-width: 3px;
      outline-color: oklch(from var(--primary) calc(l * (1 + 0.075 * var(--theme-sign))) c h);
    }
  }

  &.secondary,
  &[secondary] {
    background-color: var(--secondary);
    color: var(--secondary-foreground);
    outline-color: oklch(from var(--secondary) calc(l * (1 - 0.075)) c h);

    &:enabled:hover {
      background-color: oklch(from var(--secondary) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      color: oklch(from var(--secondary-foreground) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      outline-color: oklch(from var(--secondary) calc(l * (1 - 0.075 * var(--theme-sign))) c h);
    }

    &:focus-visible:enabled {
      outline-width: 3px;
      outline-color: oklch(from var(--secondary) calc(l * (1 - 0.075 * var(--theme-sign))) c h);
    }
  }

  &.tertiary,
  &[tertiary] {
    background-color: transparent;
    color: var(--secondary-foreground);
    outline-color: transparent;
    outline-width: 0;
    /* text-decoration: underline; */

    &:enabled:hover {
      background-color: oklch(from var(--secondary) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      color: oklch(from var(--secondary-foreground) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      outline-color: oklch(from var(--secondary) calc(l * (1 - 0.075 * var(--theme-sign))) c h);
    }

    &:enabled:active {
      /* text-decoration: none; */
      outline-color: transparent;
    }

    &:focus-visible:enabled {
      outline-width: 3px;
      outline-color: oklch(from var(--secondary) calc(l * (1 - 0.075 * var(--theme-sign))) c h);
    }
  }

  &:enabled:active {
    transform: translateY(1px);
  }

  /* &:not([tertiary]):enabled:active {
    outline-width: 1px;
    outline-color: var(--primary);
  } */

  &:disabled {
    color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
  }
}
/* ---- Card.css ---- */
.card,
card {
  display: flex;
  flex-direction: column;
  padding-block: calc(var(--unit) * 3 - 1px);
  padding-inline: calc(var(--unit) * 3);
  border: 1px solid var(--border);

  background-color: var(--card);
  color: var(--card-foreground);
  border-radius: calc(var(--radius) - calc(var(--unit) * 1));
}
/* ---- Carousel.css ---- */

slides > * {
  --n: sibling-count();
}

carousel {
  display: flex;
  flex: 1;
  container-type: size;
  contain: paint;
}

slides {
  width: 100%;
  height: 100%;
  position: relative;
  overflow-y: auto;
  scrollbar-width: none;
}

slides[scrollbar] {
  scrollbar-width: auto;
}

slides[x] {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  overflow-y: hidden;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: none;
}

slides[y],
slides[z] {
  overflow-y: scroll;
  overflow-x: hidden;
  scroll-snap-type: y mandatory;
  overscroll-behavior-y: none;
}

slides[y],
slides[z] {
  scroll-timeline: --slides-scroll block;
}

slides[x] {
  scroll-timeline: --slides-scroll-x inline;
}

slides[x] > * {
  height: 100%;
  min-width: 100%;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  display: flex;
}

slides[y] > * {
  min-height: 100%;
  width: 100%;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  display: flex;
}

slides[z] > * {
  min-height: 100%;
  width: 100%;
  scroll-snap-align: start;
}

slide {
  display: block;
}

slides[x] > * > *,
slides[y] > * > * {
  position: relative;
}

slides[z] > * > * {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}


slides[z] > slide {
  view-timeline: --slide-self block;
}

slides[z] > slide > * {
  animation: z-fade-scale linear both;
  animation-timeline: --slide-self;
}

slides[z] > slide > * > * {
  pointer-events: none;
  animation: z-pointer linear both;
  animation-timeline: --slide-self;
}



/* --- slides + square-grid: animated grid for y/x/z modes --- */

slides.square-grid:not([locked])[y]:has(> :nth-child(2)),
slides.square-grid:not([locked])[z]:has(> :nth-child(2)) {
  background-image: none;
}

slides.square-grid:not([locked])[y]:has(> :nth-child(2)) > :first-child::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to right, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
      var(--gy) / var(--grid-size) var(--grid-size),
    linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
      var(--gy) / var(--grid-size) var(--grid-size),
    linear-gradient(to right, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
      var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
    linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
      var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5);
  animation: grid-pan-y linear both;
  animation-timeline: --slides-scroll;
}

slides.square-grid:not([locked])[x]:has(> :nth-child(2)) {
  background-image: none;
}

slides.square-grid:not([locked])[x]:has(> :nth-child(2)) > :first-child::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(to right, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
      var(--gy) / var(--grid-size) var(--grid-size),
    linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
      var(--gy) / var(--grid-size) var(--grid-size),
    linear-gradient(to right, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
      var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
    linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
      var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5);
  animation: grid-pan-x linear both;
  animation-timeline: --slides-scroll-x;
}



slides.square-grid:not([locked])[z]:has(> :nth-child(2)) > :first-child::before,
slides.square-grid:not([locked])[z]:has(> :nth-child(2)) > :first-child::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  --cx: calc(var(--gx) + round(nearest, 50cqw - var(--gx), var(--grid-size)));
  --cy: calc(var(--gy) + round(nearest, 50cqh - var(--gy), var(--grid-size)));
  --zx: calc(2 * var(--gx) - var(--cx));
  --zy: calc(2 * var(--gy) - var(--cy));
  --zx-m: calc(2 * var(--gx) - var(--cx));
  --zy-m: calc(2 * var(--gy) - var(--cy));
  background-position: var(--gx) var(--gy);
  background-image:
    linear-gradient(to right, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px),
    linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px),
    linear-gradient(to right, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px),
    linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px);
  animation-timeline: --slides-scroll;
  animation-timing-function: linear;
  animation-fill-mode: both;
  animation-iteration-count: calc(var(--n) - 1);
}

slides.square-grid:not([locked])[z]:has(> :nth-child(2)) > :first-child::before {
  animation-name: grid-zoom-out;
}

slides.square-grid:not([locked])[z]:has(> :nth-child(2)) > :first-child::after {
  animation-name: grid-zoom-in;
}


/* ---- Checkbox.css ---- */
.checkbox,
.switch,
input[type='checkbox'] {
  appearance: none;

  background-color: var(--input);
  border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));

  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6);
  padding: calc(var(--unit) * 1);

  vertical-align: top;

  &:before {
    content: '';
    display: block;
    aspect-ratio: 1;
    height: 100%;
    border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));
    background-color: oklch(
      from var(--primary) calc(l + (1 - (var(--theme-sign) + 1) / 2))
        calc(c * (1 * (var(--theme-sign) + 1) / 2)) h
    );
    transform: scale(0);
  }

  &:checked:before {
    transition: transform 100ms cubic-bezier(0.25, 0.1, 0.25, 1);
    transform: scale(1);
  }
}
/* ---- Collective.css ---- */
.input,
.checkbox,
.radio,
.select,
.textarea,
.button:is(.primary, .secondary, .tertiary, [primary], [secondary], [tertiary]),
input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']),
input[type='file'],
input[type='checkbox'],
input[type='radio'],
select,
textarea,
button:is(.primary, .secondary, .tertiary, [primary], [secondary], [tertiary]) {
  /* margin: 1px; */
  outline-width: 1px;
  outline-style: solid;
  outline-color: var(--border);
  outline-offset: 0;

  transition-property: outline-color, background-color, color;
  transition-duration: 100ms;
  transition-timing-function: ease-in-out;

  &::placeholder {
    font-weight: 400;
  }

  &:disabled {
    background-color: oklch(from var(--background) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
    color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
    outline-color: transparent;
    cursor: not-allowed;
  }
}

.input,
.textarea,
input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']),
textarea {
  &:disabled {
    /* This is needed for Input & Textarea, to actually respect the color in chrome */
    -webkit-text-fill-color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
  }
}

.input,
.select,
textarea,
input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']),
input[type='range'],
input[type='checkbox'],
input[type='radio'],
select,
textarea {
  /* &:focus:enabled:not(:checked), */
  &:active:enabled:not(:checked),
  &:focus-visible:enabled {
    outline-width: 3px;
    outline-color: oklch(from var(--input) calc(l/2 + 0.4) c h);
  }
}
/* ---- Crow.css ---- */
crow:not(:has(> crow)) > crow,
.crow:not(:has(> .crow)) > .crow {
	flex: 1;
}

crow,
.crow {
	display: flex;
	align-items: center;
	justify-content: center;
}
.up,
[up],
.down,
[down] {
	height: 100%;
}
.up,
[up] {
	align-items: flex-start;
}
.down,
[down] {
	align-items: flex-end;
}
.left,
[left] {
	justify-content: flex-start;
}
.right,
[right] {
	justify-content: flex-end;
}
.vertical,
[vertical] {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.vertical > .up,
[vertical] > [up],
.vertical > .down,
[vertical] > [down] {
	height: auto;
}
.vertical.up,
[vertical][up] {
	justify-content: flex-start;
}
.vertical.down,
[vertical][down] {
	justify-content: flex-end;
}
.crow.vertical.left,
crow[vertical][left],
.crow.vertical > .left,
crow[vertical] > [left],
.crow.vertical.right,
crow[vertical][right],
.crow.vertical > .right,
crow[vertical] > [right] {
	width: 100%;
}
.vertical.left,
[vertical][left] {
	align-items: flex-start;
}
.vertical.right,
[vertical][right] {
	align-items: flex-end;
}
.vertical > .left,
[vertical] > [left],
.vertical > .right,
[vertical] > [right] {
	display: flex;
}
/* ---- Hr.css ---- */
hr,
.hr {
  border: none;
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--border), transparent);
}
/* ---- Label.css ---- */
.label:has(input[type='checkbox'], input[type='radio']),
label:has(input[type='checkbox'], input[type='radio']) {
  display: flex;
  gap: calc(var(--unit) * 2);
}

.label:has(select, input:not([type='checkbox'], [type='radio'], [type='range'], [type='file'])),
label:has(select, input:not([type='checkbox'], [type='radio'], [type='range'], [type='file'])) {
  display: grid;
}

.label > .select,
.label > .input,
label > select,
label > input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']) {
  grid-area: 1/1;
  padding-inline-end: calc(var(--unit) * 8); /* 32px */
}

.label:has(:disabled),
label:has(:disabled) {
  color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
  cursor: not-allowed;
}

.label:has(
    .select,
    .input:not([type='checkbox'], [type='radio'], [type='range'], [type='file'])
  ):after,
label:has(
    select,
    input:not([type='checkbox'], [type='radio'], [type='range'], [type='file'])
  ):after {
  content: '';
  pointer-events: none;
  grid-area: 1/1;
  mask-position: calc(100% - calc(var(--unit) * 2)) center;
  mask-size: calc(var(--unit) * 3.5) auto;
  mask-repeat: no-repeat;
  background-color: var(--popover-foreground);
}

.label:has(
    .input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']):placeholder-shown
  ):after,
label:has(
    input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']):placeholder-shown
  ):after {
  background-color: oklch(from var(--background) calc(l/2 + 0.3 - 0.1 * var(--theme-sign)) c h);
}

.label:has(
    .select:disabled,
    .input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']):disabled
  ):after,
label:has(
    select:disabled,
    input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']):disabled
  ):after {
  background-color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
}

.label:has(.select):after,
label:has(select):after {
  mask-image: var(--icon, var(--icon-chevron-down));
}

.label:has(.input:not([type='checkbox'], [type='radio'], [type='range'], [type='file'])):after,
label:has(input:not([type='checkbox'], [type='radio'], [type='range'], [type='file'])):after {
  transition: background-color 150ms ease-in-out;
  mask-image: var(--icon, var(--icon-search));
}
/* ---- Radio.css ---- */
.radio,
input[type='radio'] {
  appearance: none;

  background-color: var(--input);
  border-radius: 50%;

  width: calc(var(--unit) * 6);
  height: calc(var(--unit) * 6); /* aspect-ratio: 1; doesn't seem to work for safari iphone */
  padding: calc(var(--unit) * 1);

  vertical-align: top;

  &:before {
    content: '';
    display: block;
    aspect-ratio: 1;
    height: 100%;
    border-radius: 50%;
    background-color: oklch(
      from var(--primary) calc(l + (1 - (var(--theme-sign) + 1) / 2))
        calc(c * (1 * (var(--theme-sign) + 1) / 2)) h
    );
    transform: scale(0);
  }

  &:checked:before {
    transition: transform 100ms cubic-bezier(0.25, 0.1, 0.25, 1);
    transform: scale(1);
  }
}
/* ---- Range.css ---- */
.range,
input[type='range'] {
  display: flex;
  appearance: none;
  min-width: 234px;
  outline: 0;

  background-color: var(--input);
  border-radius: calc(var(--unit) * 3);
  height: calc(var(--unit) * 1.5);
  border: 1px solid var(--border);

  &::-webkit-slider-thumb {
    appearance: none;
    outline: 0px inset transparent;
    outline-offset: 0;
    transition: outline 50ms ease-in-out;
    transition: outline 50ms ease-in-out;

    width: calc(var(--unit) * 6);
    aspect-ratio: 1;
    background-color: oklch(
      from var(--primary) calc(l + (1 - (var(--theme-sign) + 1) / 2))
        calc(c * (1 * (var(--theme-sign) + 1) / 2)) h
    );
    border-radius: 50%;

    border: calc(var(--unit) * 1) solid var(--input);
    outline: 1px solid var(--border);
  }

  &:disabled {
    cursor: not-allowed;

    &::-webkit-slider-thumb {
      border-color: oklch(from var(--background) calc(l * (1 - 0.1 * var(--theme-sign))) c h);
      background-color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
      outline-color: transparent;
    }
  }

  &:focus:enabled:not(:active) {
    outline: 0;

    &::-webkit-slider-thumb {
      outline: 3px solid oklch(from var(--input) calc(l/2 + 0.4) c h);
    }
  }
}
/* ---- Select.css ---- */
.select,
select {
  min-width: 234px;
  appearance: none;

  background-color: var(--input);
  color: var(--popover-foreground);
  border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));

  padding: calc(var(--unit) * 1.5) calc(var(--unit) * 2);

  &:invalid {
    color: oklch(from var(--background) calc(l/2 + 0.3 - 0.1 * var(--theme-sign)) c h);
  }
}
/* ---- SquareGrid.css ---- */
.square-grid,
square-grid {
	--grid-size: calc(var(--grid-unit, var(--unit)) * 12);
	--gx: -1px;
	--gy: -1px;
}

.square-grid[center],
square-grid[center] {
	--gx: 50cqw;
	--gy: 50cqh;
}

.square-grid[locked],
square-grid[locked] {
	background:
		linear-gradient(to right, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
			var(--gy) / var(--grid-size) var(--grid-size),
		linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
			var(--gy) / var(--grid-size) var(--grid-size),
		linear-gradient(to right, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
			var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
		linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
			var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5);
	background-attachment: fixed;
}

.square-grid:not([locked]),
square-grid:not([locked]) {
	background:
		linear-gradient(to right, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
			var(--gy) / var(--grid-size) var(--grid-size),
		linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.22) 0 1px, transparent 1px) var(--gx)
			var(--gy) / var(--grid-size) var(--grid-size),
		linear-gradient(to right, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
			var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5),
		linear-gradient(to bottom, oklch(0.55 0.02 260 / 0.08) 0 1px, transparent 1px) var(--gx)
			var(--gy) / calc(var(--grid-size) * 0.5) calc(var(--grid-size) * 0.5);
}
/* ---- Stack.css ---- */
stack {
  display: grid;
  place-items: center;
}

stack > * {
  grid-area: 1/1;
}
/* ---- Switch.css ---- */
.switch,
input[type='checkbox'][role='switch'] {
  width: 48px;

  background-color: var(--input);
  border-radius: calc(var(--unit) * 3);

  &:before {
    transition: all 150ms ease-in-out;
    content: '';
    color: var(--primary-foreground);
    border-radius: calc(var(--unit) * 2.5);
    transform: scale(1);
  }

  &:disabled:before {
    background-color: oklch(from var(--popover) calc(l * (1 - 0.5 * var(--theme-sign))) c h);
  }

  &:checked {
    background-color: var(--primary);
    outline-color: oklch(from var(--primary) calc(l * (1 + 0.075 * var(--theme-sign))) c h);

    &:focus-visible:enabled {
      outline-color: oklch(from var(--primary) calc(l * (1 + 0.075 * var(--theme-sign))) c h);
    }

    &:before {
      background-color: var(--primary-foreground);
    }
  }

  &:checked:before {
    margin-inline-start: calc(var(--unit) * 6);
  }

  &:active:enabled,
  &:focus-visible:enabled {
    outline-width: 3px;
  }
}
/* ---- TextArea.css ---- */
.textarea,
textarea {
  min-width: 234px;

  background-color: var(--input);
  border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));
  color: oklch(calc((1 - var(--theme-sign)) * 0.5) 0 0);
  padding: calc(var(--unit) * 1.5) calc(var(--unit) * 2);

  &:not(:disabled)::placeholder {
    color: oklch(from var(--background) calc(l/2 + 0.3 - 0.1 * var(--theme-sign)) c h);
  }
}
/* ---- TextInput.css ---- */
.input,
input:not([type='checkbox'], [type='radio'], [type='range'], [type='file']) {
  min-width: 234px;

  background-color: var(--input);
  border-radius: min(calc(var(--radius) - calc(var(--unit) * 1)), calc(var(--unit) * 1));
  color: var(--popover-foreground);
  padding: calc(var(--unit) * 1.5) calc(var(--unit) * 2);

  &:not(:disabled)::placeholder {
    color: oklch(from var(--background) calc(l/2 + 0.3 - 0.1 * var(--theme-sign)) c h);
  }
}

 }
}
/* ---- Iconice.css ---- */
:root {
  --icon-bell: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M16.023%2012.5c0-4.5-4-3.5-4-7%200-0.29-0.028-0.538-0.079-0.749-0.263-1.766-1.44-3.183-2.965-3.615%200.014-0.062%200.021-0.125%200.021-0.191%200-0.52-0.45-0.945-1-0.945s-1%200.425-1%200.945c0%200.065%200.007%200.129%200.021%200.191-1.71%200.484-2.983%202.208-3.020%204.273-0.001%200.030-0.001%200.060-0.001%200.091%200%203.5-4%202.5-4%207%200%201.191%202.665%202.187%206.234%202.439%200.336%200.631%201.001%201.061%201.766%201.061s1.43-0.43%201.766-1.061c3.568-0.251%206.234-1.248%206.234-2.439%200-0.004-0-0.007-0-0.011l0.024%200.011zM12.91%2013.345c-0.847%200.226-1.846%200.389-2.918%200.479-0.089-1.022-0.947-1.824-1.992-1.824s-1.903%200.802-1.992%201.824c-1.072-0.090-2.071-0.253-2.918-0.479-1.166-0.311-1.724-0.659-1.928-0.845%200.204-0.186%200.762-0.534%201.928-0.845%201.356-0.362%203.1-0.561%204.91-0.561s3.554%200.199%204.91%200.561c1.166%200.311%201.724%200.659%201.928%200.845-0.204%200.186-0.762%200.534-1.928%200.845z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-book: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M14%202v13h-10.5c-0.829%200-1.5-0.672-1.5-1.5s0.671-1.5%201.5-1.5h9.5v-12h-10c-1.1%200-2%200.9-2%202v12c0%201.1%200.9%202%202%202h12v-14h-1z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M3.501%2013v0c-0%200-0.001%200-0.001%200-0.276%200-0.5%200.224-0.5%200.5s0.224%200.5%200.5%200.5c0%200%200.001-0%200.001-0v0h9.498v-1h-9.498z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-bullhorn: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M16%206.707c0-3.139-0.919-5.687-2.054-5.707%200.005-0%200.009-0%200.014-0h-1.296c0%200-3.044%202.287-7.425%203.184-0.134%200.708-0.219%201.551-0.219%202.523s0.085%201.816%200.219%202.523c4.382%200.897%207.425%203.184%207.425%203.184h1.296c-0.005%200-0.009-0-0.014-0.001%201.136-0.020%202.054-2.567%202.054-5.707zM13.513%2011.551c-0.147%200-0.305-0.152-0.387-0.243-0.197-0.22-0.387-0.562-0.55-0.989-0.363-0.957-0.564-2.239-0.564-3.611s0.2-2.655%200.564-3.611c0.162-0.428%200.353-0.77%200.55-0.99%200.081-0.091%200.24-0.243%200.387-0.243s0.305%200.152%200.387%200.243c0.197%200.22%200.387%200.562%200.55%200.99%200.363%200.957%200.564%202.239%200.564%203.611s-0.2%202.655-0.564%203.611c-0.162%200.428-0.353%200.77-0.55%200.989-0.081%200.091-0.24%200.243-0.387%200.243zM3.935%206.707c0-0.812%200.060-1.6%200.173-2.33-0.74%200.102-1.39%200.161-2.193%200.161-1.048%200-1.048%200-1.048%200l-0.867%201.479v1.378l0.867%201.479c0%200%200%200%201.048%200%200.803%200%201.453%200.059%202.193%200.161-0.113-0.729-0.173-1.518-0.173-2.33zM5.752%2010.034l-2-0.383%201.279%205.024c0.066%200.26%200.324%200.391%200.573%200.291l1.852-0.741c0.249-0.1%200.349-0.374%200.222-0.611l-1.926-3.581zM13.513%208.574c-0.057%200-0.118-0.059-0.149-0.094-0.076-0.085-0.149-0.217-0.212-0.381-0.14-0.369-0.217-0.863-0.217-1.392s0.077-1.023%200.217-1.392c0.063-0.165%200.136-0.297%200.212-0.381%200.031-0.035%200.092-0.094%200.149-0.094s0.118%200.059%200.149%200.094c0.076%200.085%200.149%200.217%200.212%200.381%200.14%200.369%200.217%200.863%200.217%201.392s-0.077%201.023-0.217%201.392c-0.063%200.165-0.136%200.297-0.212%200.381-0.031%200.035-0.092%200.094-0.149%200.094z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-checkmark: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M432%2064l-240%20240-112-112-80%2080%20192%20192%20320-320z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E');
  --icon-clock: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M10.293%2011.707l-3.293-3.293v-4.414h2v3.586l2.707%202.707zM8%200c-4.418%200-8%203.582-8%208s3.582%208%208%208%208-3.582%208-8-3.582-8-8-8zM8%2014c-3.314%200-6-2.686-6-6s2.686-6%206-6c3.314%200%206%202.686%206%206s-2.686%206-6%206z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-credit-card: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M14.5%202h-13c-0.825%200-1.5%200.675-1.5%201.5v9c0%200.825%200.675%201.5%201.5%201.5h13c0.825%200%201.5-0.675%201.5-1.5v-9c0-0.825-0.675-1.5-1.5-1.5zM1.5%203h13c0.271%200%200.5%200.229%200.5%200.5v1.5h-14v-1.5c0-0.271%200.229-0.5%200.5-0.5zM14.5%2013h-13c-0.271%200-0.5-0.229-0.5-0.5v-4.5h14v4.5c0%200.271-0.229%200.5-0.5%200.5zM2%2010h1v2h-1zM4%2010h1v2h-1zM6%2010h1v2h-1z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-cog: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M14.59%209.535c-0.839-1.454-0.335-3.317%201.127-4.164l-1.572-2.723c-0.449%200.263-0.972%200.414-1.529%200.414-1.68%200-3.042-1.371-3.042-3.062h-3.145c0.004%200.522-0.126%201.051-0.406%201.535-0.839%201.454-2.706%201.948-4.17%201.106l-1.572%202.723c0.453%200.257%200.845%200.634%201.123%201.117%200.838%201.452%200.336%203.311-1.12%204.16l1.572%202.723c0.448-0.261%200.967-0.41%201.522-0.41%201.675%200%203.033%201.362%203.042%203.046h3.145c-0.001-0.517%200.129-1.040%200.406-1.519%200.838-1.452%202.7-1.947%204.163-1.11l1.572-2.723c-0.45-0.257-0.839-0.633-1.116-1.113zM8%2011.24c-1.789%200-3.24-1.45-3.24-3.24s1.45-3.24%203.24-3.24c1.789%200%203.24%201.45%203.24%203.24s-1.45%203.24-3.24%203.24z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-cross: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M507.331%20411.33c-0.002-0.002-0.004-0.004-0.006-0.005l-155.322-155.325%20155.322-155.325c0.002-0.002%200.004-0.003%200.006-0.005%201.672-1.673%202.881-3.627%203.656-5.708%202.123-5.688%200.912-12.341-3.662-16.915l-73.373-73.373c-4.574-4.573-11.225-5.783-16.914-3.66-2.080%200.775-4.035%201.984-5.709%203.655%200%200.002-0.002%200.003-0.004%200.005l-155.324%20155.326-155.324-155.325c-0.002-0.002-0.003-0.003-0.005-0.005-1.673-1.671-3.627-2.88-5.707-3.655-5.69-2.124-12.341-0.913-16.915%203.66l-73.374%2073.374c-4.574%204.574-5.784%2011.226-3.661%2016.914%200.776%202.080%201.985%204.036%203.656%205.708%200.002%200.001%200.003%200.003%200.005%200.005l155.325%20155.324-155.325%20155.326c-0.001%200.002-0.003%200.003-0.004%200.005-1.671%201.673-2.88%203.627-3.657%205.707-2.124%205.688-0.913%2012.341%203.661%2016.915l73.374%2073.373c4.575%204.574%2011.226%205.784%2016.915%203.661%202.080-0.776%204.035-1.985%205.708-3.656%200.001-0.002%200.003-0.003%200.005-0.005l155.324-155.325%20155.324%20155.325c0.002%200.001%200.004%200.003%200.006%200.004%201.674%201.672%203.627%202.881%205.707%203.657%205.689%202.123%2012.342%200.913%2016.914-3.661l73.373-73.374c4.574-4.574%205.785-11.227%203.662-16.915-0.776-2.080-1.985-4.034-3.657-5.707z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E');
  --icon-crow: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20345.5%20341.9%22%3E%3Cpath%20d%3D%22M157.4%20249.7c-.3-.7-12-6-13-6l-46%2016.9c-13.8%2013.2-52.6%2068.1-71.8%2066.6-2.9-.2-4.3-2.8-7.1-2.9s-5.2%203.7-10.9%202.9c-13.3-1.9-10.8-4%205.4-22.4s35.9-34.2%2053.4-51.3c7.6-7.4%2015.1-14.9%2022-23l.4-1.4c-2.9-2.7-4.7%204-2.7-7.9s18.3-37.5%2025.3-48.5c15-23.8%2034.5-53.6%2055.2-72.4%206.2-5.6%2023.1-16%2026.8-21.1%2010.9-14.8%208.8-41.6%2022.1-58.7%2017.9-22.9%2056.4-27.6%2078.8-9%202.4%202%206.7%209.3%2010%2011s15.2%202.8%2020.5%204.5c3.4%201.1%2022.6%209.2%2019.4%2013.9l-36.7%2013.6c-4.7%208-11.4%2014.8-12.2%2025.2s2%204.9%209.2%2032.6-.3%2048.8-13.7%2072.6-32.6%2041.2-57.1%2053.1l-3.2%2013.3%2030.9%2032.9c5.8-1.5%2013-1.6%2018.2-2.7s6.8-5%2013.9-2.5c4.9%201.8%205.3%205.3%206.8%206.2s3.8.5%205.7%201.3c4.8%202%207.2%208.2%206.2%2013.2-1.6-.2-1.3-2.3-3-3.5-8.1-6.1-8.2%203.3-16.9%201.5%201.4%205.7%207%209.4%202.5%2016-.6%200-1.9-7.7-6.4-8.6-11.5%208.2-24.2-9-34.6-9.4-5.3-.2-12%204-19.9%203-5.2-.7-7.4-6.8-12.4-2.5-1.7%201.4-1.6%204.6-4%205.4-1.9-16.6%2015.3-14.2%2026.4-15%201.5-.1%202.9.8%202.5-1.5L220%20254.6c-4-1.5-6.8-3.2-9.5-6.5l-21.2%201.7c-3%202.5-12%2011.4-11.5%2015l27%2045.3c12%206.9%2031.1-4%2042.1%205.2%205%204.1%203.4%207.5%204.7%2012.2s4.9%207.6%201.8%2013.7c-3%20.6%201.3%202.6-2.9-4.5s-6.4-2.4-10.4-2.5c-2.1-.1-8-3.6-8.6-3l2%2010c-3.2%201.1-4.3-3.3-6.6-3.8s-5.5%201.4-10.2%200c-7.8-2.3-16.2-16-20.8-17.1s-11%203.2-18.6-1.3c-4-2.3-5.3-8.2-11.4-5.1-2%201.1-1.5%203.1-3.2%203.3-.5-9.3%206.1-12%2014.4-10.9%203.4.4%206.5%202.6%2010.1%202.9%201.5.1%203%20.6%202.5-1.5-7.3-12.7-14.6-25.7-22.9-37.9-2.8-4.3-8.1-7.9-8.9-13-.2-2.1.5-6.2-.2-7.3z%22%2F%3E%3C%2Fsvg%3E');
  --icon-dark: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20448%22%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%0A%20%20%20%20d%3D%22M355.656%20325.63c-9%201.5-18.25%202.25-27.5%202.25-92.75%200-168-75.25-168-168%200-31.75%209.25-62.75%2026-89.25-66.5%2019.75-114%2080.75-114%20153.25%200%2088.25%2071.75%20160%20160%20160%2048.25%200%2093.5-22%20123.5-58.25m50.75-21.249c-31.25%2067.75-99.75%20111.5-174.25%20111.5-105.75%200-192-86.25-192-192%200-103.75%2081.25-188%20184.75-191.75%207-.25%2012.75%203.75%2015.25%209.75%202.75%206.25%201%2013.5-3.75%2018-28.5%2026-44.25%2061.5-44.25%20100%200%2075%2061%20136%20136%20136q29.625%200%2057-12.75c6.25-2.75%2013.25-1.5%2018%203.25s6%2012%203.25%2018%22%20%2F%3E%0A%3C%2Fsvg%3E');
  --icon-download: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8%209l4-4h-3v-4h-2v4h-3zM11.636%207.364l-1.121%201.121%204.064%201.515-6.579%202.453-6.579-2.453%204.064-1.515-1.121-1.121-4.364%201.636v4l8%203%208-3v-4z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-css-3: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%202048%202048%22%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%20fill-rule%3D%22evenodd%22%20d%3D%22M1582.48%2C1627.13l120.816-1353.38%2C1.585-17.752H343.116l1.582%2C17.752%2C120.689%2C1353.6%2C1.006%2C11.285%2C10.872%2C3.018%2C541.588%2C150.346h8.685l543.064-150.568%2C10.87-3.014%2C1.009-11.289v.002ZM1025.111%2C555.45h395.75l-11.913%2C138.491-390.414%2C173.558%2C6.576%2C31.226h366.391l-42.175%2C483.261-325.538%2C90.259-325.432-90.106-20.667-231.443h134l10.737%2C117.345%2C1.042%2C11.374%2C11.027%2C2.929%2C186.463%2C49.539%2C8.493-.064%2C184.316-51.231%2C10.978-3.053.964-11.315%2C18.428-216.732%2C1.504-17.688h-578.959l-12.198-139.091%2C377.014-161.362%2C26.761-11.469-6.386-31.354h-414.572l-11.81-133.074h399.62Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-earth: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8%200c-4.418%200-8%203.582-8%208s3.582%208%208%208%208-3.582%208-8-3.582-8-8-8zM8%2015c-0.984%200-1.92-0.203-2.769-0.57l3.643-4.098c0.081-0.092%200.126-0.21%200.126-0.332v-1.5c0-0.276-0.224-0.5-0.5-0.5-1.765%200-3.628-1.835-3.646-1.854-0.094-0.094-0.221-0.146-0.354-0.146h-2c-0.276%200-0.5%200.224-0.5%200.5v3c0%200.189%200.107%200.363%200.276%200.447l1.724%200.862v2.936c-1.813-1.265-3-3.366-3-5.745%200-1.074%200.242-2.091%200.674-3h1.826c0.133%200%200.26-0.053%200.354-0.146l2-2c0.094-0.094%200.146-0.221%200.146-0.354v-1.21c0.634-0.189%201.305-0.29%202-0.29%201.1%200%202.141%200.254%203.067%200.706-0.065%200.055-0.128%200.112-0.188%200.172-0.567%200.567-0.879%201.32-0.879%202.121s0.312%201.555%200.879%202.121c0.569%200.569%201.332%200.879%202.119%200.879%200.049%200%200.099-0.001%200.149-0.004%200.216%200.809%200.605%202.917-0.131%205.818-0.007%200.027-0.011%200.055-0.013%200.082-1.271%201.298-3.042%202.104-5.002%202.104z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-embed: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M13%2011.5l1.5%201.5%205-5-5-5-1.5%201.5%203.5%203.5z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M7%204.5l-1.5-1.5-5%205%205%205%201.5-1.5-3.5-3.5z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M10.958%202.352l1.085%200.296-3%2011-1.085-0.296%203-11z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-home: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M16%209.226l-8-6.21-8%206.21v-2.532l8-6.21%208%206.21zM14%209v6h-4v-4h-4v4h-4v-6l6-4.5z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-heart: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M11.8%201c-1.682%200-3.129%201.368-3.799%202.797-0.671-1.429-2.118-2.797-3.8-2.797-2.318%200-4.2%201.882-4.2%204.2%200%204.716%204.758%205.953%208%2010.616%203.065-4.634%208-6.050%208-10.616%200-2.319-1.882-4.2-4.2-4.2z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-folder: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M13%2015l3-8h-13l-3%208zM2%206l-2%209v-13h4.5l2%202h6.5v2z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-html-5: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M0.946%200l1.284%2014.4%205.762%201.6%205.777-1.602%201.286-14.398h-14.108zM12.668%2013.482l-4.644%201.287v0.007l-0.012-0.004-0.012%200.004v-0.007l-4.644-1.287-1.098-12.304h11.508l-1.098%2012.304zM10.168%208.284l-0.204%202.29-1.972%200.532-1.967-0.53-0.126-1.41h-1.773l0.247%202.774%203.626%201.003%203.615-1.003%200.485-5.422h-6.437l-0.161-1.809h6.758l0.158-1.766h-8.847l0.477%205.341z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-heart-broken: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M11.8%201c2.318%200%204.2%201.882%204.2%204.2%200%204.566-4.935%205.982-8%2010.616-3.243-4.663-8-5.9-8-10.616%200-2.319%201.882-4.2%204.2-4.2%200.943%200%201.812%200.43%202.512%201.060l-1.213%201.94%203.5%202-2%205%205.5-6-3.5-2%200.967-1.451c0.553-0.34%201.175-0.549%201.833-0.549z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-desktop: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M0%201v10h16v-10h-16zM15%2010h-14v-8h14v8zM10.5%2012h-5l-0.5%202-1%201h8l-1-1z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-images: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2018%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M17%202h-1v-1c0-0.55-0.45-1-1-1h-14c-0.55%200-1%200.45-1%201v12c0%200.55%200.45%201%201%201h1v1c0%200.55%200.45%201%201%201h14c0.55%200%201-0.45%201-1v-12c0-0.55-0.45-1-1-1zM2%203v10h-0.998c-0.001-0.001-0.001-0.001-0.002-0.002v-11.996c0.001-0.001%200.001-0.001%200.002-0.002h13.996c0.001%200.001%200.001%200.001%200.002%200.002v0.998h-12c-0.55%200-1%200.45-1%201v0zM17%2014.998c-0.001%200.001-0.001%200.001-0.002%200.002h-13.996c-0.001-0.001-0.001-0.001-0.002-0.002v-11.996c0.001-0.001%200.001-0.001%200.002-0.002h13.996c0.001%200.001%200.001%200.001%200.002%200.002v11.996z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M15%205.5c0%200.828-0.672%201.5-1.5%201.5s-1.5-0.672-1.5-1.5%200.672-1.5%201.5-1.5%201.5%200.672%201.5%201.5z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M16%2014h-12v-2l3.5-6%204%205h1l3.5-3z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-layout: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20768%20768%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M160%2064c-26.496%200-50.56%2010.784-67.872%2028.128s-28.128%2041.376-28.128%2067.872v448c0%2026.496%2010.784%2050.56%2028.128%2067.872s41.376%2028.128%2067.872%2028.128h448c26.496%200%2050.56-10.784%2067.872-28.128s28.128-41.376%2028.128-67.872v-448c0-26.496-10.784-50.56-28.128-67.872s-41.376-28.128-67.872-28.128zM640%20256h-512v-96c0-8.832%203.552-16.8%209.376-22.624s13.792-9.376%2022.624-9.376h448c8.832%200%2016.8%203.552%2022.624%209.376s9.376%2013.792%209.376%2022.624zM256%20320v320h-96c-8.832%200-16.8-3.552-22.624-9.376s-9.376-13.792-9.376-22.624v-288zM320%20640v-320h320v288c0%208.832-3.552%2016.8-9.376%2022.624s-13.792%209.376-22.624%209.376z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-logo-svelte: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2098.1%20118%22%3E%0A%20%20%3Cpath%20fill%3D%22%23ff3e00%22%20d%3D%22M91.8%2C15.6C80.9%2C0%2C59.2-4.7%2C43.6%2C5.2l-27.5%2C17.6c-7.5%2C4.7-12.7%2C12.4-14.2%2C21.1-1.3%2C7.3-.2%2C14.8%2C3.3%2C21.3-2.4%2C3.6-4%2C7.6-4.7%2C11.8-1.6%2C8.9.5%2C18.1%2C5.7%2C25.4%2C11%2C15.7%2C32.6%2C20.3%2C48.2%2C10.4l27.5-17.5c7.5-4.7%2C12.7-12.4%2C14.2-21.1%2C1.3-7.3.2-14.8-3.3-21.3%2C2.4-3.6%2C4-7.6%2C4.7-11.8%2C1.7-9-.4-18.2-5.7-25.5ZM84%2C38.1c-.2.9-.4%2C1.7-.7%2C2.6l-.5%2C1.6-1.4-1c-3.3-2.4-6.9-4.2-10.8-5.4l-1-.3v-1c.2-1.4-.2-2.9-1-4.1-1.6-2.3-4.4-3.3-7.1-2.6-.6.2-1.2.4-1.7.7l-27.4%2C17.5c-1.4.9-2.3%2C2.2-2.6%2C3.8-.3%2C1.6.1%2C3.3%2C1%2C4.6%2C1.6%2C2.3%2C4.4%2C3.3%2C7.1%2C2.6.6-.2%2C1.2-.4%2C1.7-.7l10.5-6.7c1.7-1.1%2C3.6-1.9%2C5.6-2.5%2C8.9-2.3%2C18.2%2C1.2%2C23.4%2C8.7%2C3.2%2C4.4%2C4.4%2C9.9%2C3.5%2C15.3-.9%2C5.2-4.1%2C9.9-8.6%2C12.7l-27.5%2C17.5c-1.7%2C1.1-3.6%2C1.9-5.6%2C2.5-8.9%2C2.3-18.2-1.2-23.4-8.7-3.2-4.4-4.4-9.9-3.5-15.3.2-.9.4-1.7.6-2.6l.5-1.6%2C1.4%2C1c3.3%2C2.4%2C6.9%2C4.2%2C10.8%2C5.4l1%2C.3v1c-.2%2C1.4.2%2C2.9%2C1%2C4.1%2C1.6%2C2.3%2C4.4%2C3.4%2C7.1%2C2.7.6-.2%2C1.2-.4%2C1.7-.7l27.4-17.5c1.4-.9%2C2.3-2.2%2C2.6-3.8.3-1.6%2C0-3.3-1-4.6-1.6-2.3-4.4-3.3-7.1-2.6-.6.2-1.2.4-1.7.7l-10.5%2C6.7c-1.7%2C1.1-3.6%2C1.9-5.6%2C2.4-8.9%2C2.3-18.2-1.2-23.4-8.7-3.1-4.4-4.4-9.9-3.4-15.3.9-5.2%2C4.1-9.9%2C8.6-12.7l27.5-17.5c1.7-1.1%2C3.6-1.9%2C5.6-2.5%2C8.9-2.3%2C18.2%2C1.2%2C23.4%2C8.7%2C3.2%2C4.4%2C4.4%2C9.9%2C3.5%2C15.3Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-logo-apeegg: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20777%20448%22%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%0A%20%20%20%20d%3D%22M305.249%20120.181C273.934%2053.884%20221.742%200%20169.834%200%20117.079%200%2064.323%2058.398%2033.008%20126.106%209.028%20178.861%200%20237.259%200%20278.167c0%2093.944%2076.171%20169.834%20169.834%20169.834s169.834-76.171%20169.834-169.834c0-41.753-9.31-104.383-34.418-157.985zM132.877%20390.166c-37.521.847-37.521-27.647-37.521-27.647%202.257-24.544%2020.03-19.184%2043.164-20.03s42.035%2016.927%2043.164%2026.801c.847%209.874-11.284%2020.03-48.806%2020.877zm115.949-180.272c0%2018.337%2014.952%2027.93%2018.056%2036.957%203.103%209.31%206.489%2027.083-2.821%2030.751-13.824%205.078-26.237-4.514-44.574-16.081s-7.617%2010.721-7.617%2010.721%2017.773%2028.493%2017.773%2055.295-21.441%2018.337-21.441%2018.337-30.468-25.108-69.683-25.108c-39.214%200-40.343%209.028-54.73%209.874-14.67.847-15.234-3.95-15.234-17.773s7.617-22.851%2018.056-34.7c7.335-8.181%206.489-23.134-5.925-16.927s-37.521%2015.234-38.368%200%2022.287-35.265%2022.287-49.934-32.161-29.904-33.854-41.471C29.34%20158.268%2047.678%2094.51%2081.532%2093.664c33.008-.847%2010.438%2028.493%2063.194%2029.904h6.771c7.899-.282%2021.723-.564%2043.728-20.594%2027.647-25.39%2052.192-20.03%2062.912-11.567s32.161%2020.03%2032.161%2057.552c0%2037.804-41.471%2042.317-41.471%2060.937z%22%20%2F%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%0A%20%20%20%20d%3D%22M116.232%20208.201c-12.695%201.975-29.058-9.028-34.418-12.977-.847-.564-1.975-.282-2.257.847-6.489%2024.544%206.206%2023.98%2012.413%2025.955%206.489%201.975%202.539%206.489-.282%208.181-3.385%201.693-15.799-1.128-15.799-1.128.564%207.335%2014.388%205.078%2020.03%204.796%201.41%200%202.821-.564%203.95-1.693%206.489-5.642%2029.622-25.955%2016.363-23.98zm69.4%205.643c-11.849-.282%205.078%2014.67%2013.542%2021.723%203.103%202.539%206.771%204.232%2010.721%204.796%206.489.847%2015.799.847%2016.081-5.642%200%200-13.259%203.103-15.799%201.128s-7.053-6.206-.282-8.181c6.489-1.975%2030.186-1.411%2022.569-27.93-.282%200-30.186%2014.388-46.831%2014.106zm-10.72%2020.312c-6.206%200-34.418%2028.212-34.983%2033.008-.282%204.514-7.053-31.033-26.237-30.186-19.184.564-12.977%2013.259-11.003%2019.184s16.645%2017.491%2021.159%2017.773c0%200-13.824-13.541-13.824-18.902s1.41-7.053%205.36-7.053%209.31%203.103%2012.695%2010.72c2.539%205.925%206.206%2013.824%207.617%2017.491.564%201.128%201.411%201.693%202.821%201.693.847%200%201.975-.564%202.257-1.128%203.95-5.642%2021.441-28.776%2031.879-28.776%2011.849%200%207.053%2012.413%203.95%2014.952-3.103%202.821-9.874%207.617-20.03%209.592%200%200%2013.824%203.95%2029.622-11.567%2015.799-14.952-3.385-26.801-11.284-26.801zm309.199-77.3H451.95l-14.388%2043.446h-42.599l48.524-165.038h49.652l48.242%20165.038h-42.317zM601.189%2035.265c7.053%200%2013.542%201.128%2019.184%203.668s10.72%206.206%2014.67%2010.721c3.95%204.796%207.335%2010.156%209.31%2016.927q3.385%209.734%203.385%2022.005c0%207.899-1.128%2015.234-3.385%2021.723s-5.36%2012.131-9.31%2016.927-9.028%208.463-14.67%2011.003-12.131%203.95-19.184%203.95h-12.413v58.116h-37.803V35.267h50.217zm160.806%2037.239h-63.758v26.801h46.831v37.239h-46.831v26.519h63.758v37.239H660.998V35.264h100.997zM502.73%20279.013h-64.04v26.519h47.114v37.239h-47.113v26.519h64.04v37.239H401.452V241.773h101.279zm134.005%2097.048c-2.821%203.95-6.206%207.899-10.156%2011.567s-8.181%207.053-12.977%209.874-10.156%205.078-15.799%206.771-11.849%202.539-18.056%202.539h-.282c-9.874%200-18.62-1.693-26.237-4.796-7.617-3.385-13.824-7.899-18.902-13.541s-9.028-12.695-11.849-20.594-4.232-16.645-4.796-26.237v-34.136c0-8.746%201.41-17.209%203.95-25.39%202.539-7.899%206.489-14.952%2011.849-20.877%205.078-5.925%2011.567-10.721%2019.184-14.388s16.645-5.36%2026.519-5.36h.282q15.234.846%2024.544%205.078c6.206%203.103%2011.284%206.489%2014.952%2010.438s6.489%207.899%208.463%2011.849q2.963%205.925%205.078%209.31l-30.468%2020.312c-.847-1.693-1.693-3.385-2.539-5.642s-2.257-3.95-3.95-5.642-3.95-3.385-6.206-4.514c-2.539-1.128-5.642-1.975-9.592-1.975-7.335%200-13.259%202.539-17.491%207.335-4.232%205.078-6.489%2011.567-6.489%2019.748v32.161c0%203.95.564%207.617%201.975%2011.284%201.411%203.385%203.103%206.489%205.36%208.746%202.257%202.539%205.078%204.514%208.181%205.925s6.489%202.257%2010.156%202.257c5.078.282%209.31-.847%2012.413-2.539%203.103-1.975%205.642-4.232%207.335-7.335v-8.181h-17.491v-31.879h53.32v57.834zm140.212%200c-2.821%203.95-6.206%207.899-10.156%2011.567s-8.181%207.053-12.977%209.874-10.156%205.078-15.799%206.771-11.849%202.539-18.056%202.539h-.564c-9.874%200-18.62-1.693-26.237-4.796-7.617-3.385-13.824-7.899-18.902-13.541s-9.028-12.695-11.849-20.594-4.232-16.645-4.514-26.237v-34.136c0-8.746%201.41-17.209%203.95-25.39%202.539-7.899%206.489-14.952%2011.849-20.877%205.078-5.925%2011.567-10.721%2019.184-14.388s16.645-5.36%2026.519-5.36h.282q15.234.846%2024.544%205.078c6.206%203.103%2011.284%206.489%2014.952%2010.438s6.489%207.899%208.463%2011.849q2.963%205.925%205.078%209.31l-30.468%2020.312c-.847-1.693-1.693-3.385-2.539-5.642s-2.257-3.95-3.95-5.642-3.95-3.385-6.206-4.514c-2.539-1.128-5.642-1.975-9.592-1.975-7.335%200-13.259%202.539-17.491%207.335-4.232%205.078-6.489%2011.567-6.489%2019.748v32.161c0%203.95.564%207.617%201.975%2011.284%201.41%203.385%203.103%206.489%205.36%208.746%202.257%202.539%205.078%204.514%208.181%205.925s6.489%202.257%2010.156%202.257c5.078.282%209.31-.847%2012.413-2.539%203.103-1.975%205.642-4.232%207.335-7.335v-8.181h-17.491v-31.879h53.32v57.834z%22%20%2F%3E%0A%3C%2Fsvg%3E');
  --icon-pin: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8%200c-2.761%200-5%202.239-5%205%200%205%205%2011%205%2011s5-6%205-11c0-2.761-2.239-5-5-5zM8%208c-1.657%200-3-1.343-3-3s1.343-3%203-3%203%201.343%203%203-1.343%203-3%203z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-logo-react: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2023%2020.5%22%3E%0A%20%20%3Ccircle%20fill%3D%22%2361dafb%22%20cx%3D%2211.5%22%20cy%3D%2210.2%22%20r%3D%222%22%2F%3E%0A%20%20%3Cpath%20fill%3D%22%2361dafb%22%20d%3D%22M23%2C10.2c0-1.6-1.9-3-4.8-3.9.7-3%2C.5-5.3-.9-6.1-1.4-.8-3.5.1-5.8%2C2.3C9.3.4%2C7.2-.5%2C5.8.3c-1.2.7-1.6%2C2.4-1.2%2C4.8%2C0%2C.4.2.9.3%2C1.3-2.9.8-4.8%2C2.2-4.8%2C3.9s1.9%2C3%2C4.8%2C3.8c-.1.5-.2.9-.3%2C1.3-.4%2C2.4%2C0%2C4.1%2C1.2%2C4.8.3.2.7.3%2C1.2.3%2C1%2C0%2C2.2-.6%2C3.6-1.6.3-.3.7-.6%2C1-.9.3.3.7.6%2C1%2C.9%2C1.3%2C1.1%2C2.6%2C1.6%2C3.6%2C1.6s.8%2C0%2C1.2-.3c1.2-.7%2C1.6-2.4%2C1.2-4.8%2C0-.4-.2-.9-.3-1.3%2C2.9-.8%2C4.8-2.2%2C4.8-3.8ZM16.1%2C1c.2%2C0%2C.5%2C0%2C.7.2.9.5%2C1.1%2C2.4.5%2C5-.9-.2-2-.4-3.1-.5-.6-.9-1.3-1.7-1.9-2.4%2C1.5-1.5%2C2.9-2.3%2C3.9-2.3ZM7.4%2C12.6c.2.4.5.8.7%2C1.2-.7-.1-1.4-.2-2.1-.4.2-.6.4-1.3.7-2%2C.2.4.4.8.6%2C1.2ZM6.1%2C7.1c.6-.2%2C1.3-.3%2C2.1-.4-.2.4-.5.8-.7%2C1.1-.2.4-.4.8-.6%2C1.2-.3-.7-.5-1.3-.7-2ZM7.3%2C10.2c.3-.6.6-1.2%2C1-1.9.4-.6.7-1.2%2C1.1-1.8.7%2C0%2C1.4%2C0%2C2.1%2C0s1.4%2C0%2C2.1%2C0c.4.5.8%2C1.1%2C1.1%2C1.8.3.6.7%2C1.2%2C1%2C1.9-.3.6-.6%2C1.2-1%2C1.8-.4.6-.7%2C1.2-1.1%2C1.8-.7%2C0-1.4%2C0-2.1%2C0s-1.4%2C0-2.1%2C0c-.4-.6-.8-1.2-1.1-1.8-.4-.6-.7-1.2-1-1.8ZM15.6%2C12.6c.2-.4.4-.8.6-1.2.3.7.5%2C1.3.7%2C2-.6.1-1.3.3-2.1.4.2-.4.5-.8.7-1.2ZM15.6%2C7.9c-.2-.4-.5-.8-.7-1.1.7%2C0%2C1.4.2%2C2.1.4-.2.6-.4%2C1.3-.7%2C2-.2-.4-.4-.8-.6-1.2ZM11.5%2C3.9c.4.5.9%2C1%2C1.3%2C1.6-.4%2C0-.9%2C0-1.3%2C0s-.9%2C0-1.3%2C0c.5-.6.9-1.1%2C1.3-1.6ZM6.2%2C1.1c.2-.1.4-.2.7-.2.9%2C0%2C2.2.7%2C3.6%2C1.9.1%2C0%2C.2.2.3.3-.6.7-1.3%2C1.5-1.9%2C2.4-1.1%2C0-2.1.3-3.1.5-.1-.4-.2-.8-.3-1.2-.3-2%2C0-3.3.7-3.8ZM1%2C10.2c0-1.1%2C1.5-2.2%2C4.1-2.9.3.9.7%2C1.9%2C1.1%2C2.9-.5%2C1-.8%2C1.9-1.1%2C2.9-2.6-.7-4.1-1.8-4.1-2.9ZM9.9%2C18.1c-1.5%2C1.2-2.8%2C1.7-3.6%2C1.3-.8-.5-1-1.8-.7-3.8%2C0-.4.1-.8.3-1.2.9.2%2C2%2C.4%2C3.1.5.6.9%2C1.3%2C1.7%2C1.9%2C2.4-.3.3-.6.6-.9.8ZM10.2%2C14.9c.4%2C0%2C.9%2C0%2C1.3%2C0s.9%2C0%2C1.3%2C0c-.4.6-.9%2C1.1-1.3%2C1.6-.5-.5-.9-1-1.3-1.6ZM16.8%2C19.3c-.8.4-2.1%2C0-3.6-1.3-.3-.2-.6-.5-.9-.8.7-.7%2C1.3-1.5%2C1.9-2.4%2C1.1%2C0%2C2.1-.3%2C3.1-.5.1.4.2.8.3%2C1.2.3%2C2%2C0%2C3.3-.7%2C3.8ZM17.9%2C13.1c-.3-.9-.7-1.9-1.1-2.9.5-1%2C.8-2%2C1.1-2.9%2C2.6.7%2C4.1%2C1.8%2C4.1%2C2.9s-1.5%2C2.2-4.1%2C2.9Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-logo-apeegg-simple: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20340%20448%22%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%0A%20%20%20%20d%3D%22M305.249%20120.181C273.934%2053.884%20221.742%200%20169.834%200%20117.079%200%2064.323%2058.398%2033.008%20126.106%209.028%20178.861%200%20237.259%200%20278.167c0%2093.944%2076.171%20169.834%20169.834%20169.834s169.834-76.171%20169.834-169.834c0-41.753-9.31-104.383-34.418-157.985zM132.877%20390.166c-37.521.847-37.521-27.647-37.521-27.647%202.257-24.544%2020.03-19.184%2043.164-20.03s42.035%2016.927%2043.164%2026.801c.847%209.874-11.284%2020.03-48.806%2020.877zm115.949-180.272c0%2018.337%2014.952%2027.93%2018.056%2036.957%203.103%209.31%206.489%2027.083-2.821%2030.751-13.824%205.078-26.237-4.514-44.574-16.081s-7.617%2010.721-7.617%2010.721%2017.773%2028.493%2017.773%2055.295-21.441%2018.337-21.441%2018.337-30.468-25.108-69.683-25.108c-39.214%200-40.343%209.028-54.73%209.874-14.67.847-15.234-3.95-15.234-17.773s7.617-22.851%2018.056-34.7c7.335-8.181%206.489-23.134-5.925-16.927s-37.521%2015.234-38.368%200%2022.287-35.265%2022.287-49.934-32.161-29.904-33.854-41.471C29.34%20158.268%2047.678%2094.51%2081.532%2093.664c33.008-.847%2010.438%2028.493%2063.194%2029.904h6.771c7.899-.282%2021.723-.564%2043.728-20.594%2027.647-25.39%2052.192-20.03%2062.912-11.567s32.161%2020.03%2032.161%2057.552c0%2037.804-41.471%2042.317-41.471%2060.937z%22%20%2F%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%0A%20%20%20%20d%3D%22M116.232%20208.201c-12.695%201.975-29.058-9.028-34.418-12.977-.847-.564-1.975-.282-2.257.847-6.489%2024.544%206.206%2023.98%2012.413%2025.955%206.489%201.975%202.539%206.489-.282%208.181-3.385%201.693-15.799-1.128-15.799-1.128.564%207.335%2014.388%205.078%2020.03%204.796%201.41%200%202.821-.564%203.95-1.693%206.489-5.642%2029.622-25.955%2016.363-23.98zm69.4%205.643c-11.849-.282%205.078%2014.67%2013.542%2021.723%203.103%202.539%206.771%204.232%2010.721%204.796%206.489.847%2015.799.847%2016.081-5.642%200%200-13.259%203.103-15.799%201.128s-7.053-6.206-.282-8.181c6.489-1.975%2030.186-1.411%2022.569-27.93-.282%200-30.186%2014.388-46.831%2014.106zm-10.72%2020.312c-6.206%200-34.418%2028.212-34.983%2033.008-.282%204.514-7.053-31.033-26.237-30.186-19.184.564-12.977%2013.259-11.003%2019.184s16.645%2017.491%2021.159%2017.773c0%200-13.824-13.541-13.824-18.902s1.41-7.053%205.36-7.053%209.31%203.103%2012.695%2010.72c2.539%205.925%206.206%2013.824%207.617%2017.491.564%201.128%201.411%201.693%202.821%201.693.847%200%201.975-.564%202.257-1.128%203.95-5.642%2021.441-28.776%2031.879-28.776%2011.849%200%207.053%2012.413%203.95%2014.952-3.103%202.821-9.874%207.617-20.03%209.592%200%200%2013.824%203.95%2029.622-11.567%2015.799-14.952-3.385-26.801-11.284-26.801z%22%20%2F%3E%0A%3C%2Fsvg%3E');
  --icon-logo-github: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8%200.198c-4.418%200-8%203.582-8%208%200%203.535%202.292%206.533%205.471%207.591%200.4%200.074%200.547-0.174%200.547-0.385%200-0.191-0.008-0.821-0.011-1.489-2.226%200.484-2.695-0.944-2.695-0.944-0.364-0.925-0.888-1.171-0.888-1.171-0.726-0.497%200.055-0.486%200.055-0.486%200.803%200.056%201.226%200.824%201.226%200.824%200.714%201.223%201.872%200.869%202.328%200.665%200.072-0.517%200.279-0.87%200.508-1.070-1.777-0.202-3.645-0.888-3.645-3.954%200-0.873%200.313-1.587%200.824-2.147-0.083-0.202-0.357-1.015%200.077-2.117%200%200%200.672-0.215%202.201%200.82%200.638-0.177%201.322-0.266%202.002-0.269%200.68%200.003%201.365%200.092%202.004%200.269%201.527-1.035%202.198-0.82%202.198-0.82%200.435%201.102%200.162%201.916%200.079%202.117%200.513%200.56%200.823%201.274%200.823%202.147%200%203.073-1.872%203.749-3.653%203.947%200.287%200.248%200.543%200.735%200.543%201.481%200%201.070-0.009%201.932-0.009%202.195%200%200.213%200.144%200.462%200.55%200.384%203.177-1.059%205.466-4.057%205.466-7.59%200-4.418-3.582-8-8-8z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-light: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20768%20768%22%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%0A%20%20%20%20d%3D%22M576%20384c0-53.024-21.536-101.056-56.224-135.776S437.024%20192%20384%20192s-101.056%2021.536-135.776%2056.224S192%20330.976%20192%20384s21.536%20101.056%2056.224%20135.776S330.976%20576%20384%20576s101.056-21.536%20135.776-56.224S576%20437.024%20576%20384m-64%200c0%2035.36-14.304%2067.296-37.504%2090.496S419.36%20512%20384%20512s-67.296-14.304-90.496-37.504S256%20419.36%20256%20384s14.304-67.296%2037.504-90.496S348.64%20256%20384%20256s67.296%2014.304%2090.496%2037.504S512%20348.64%20512%20384M352%2032v64c0%2017.664%2014.336%2032%2032%2032s32-14.336%2032-32V32c0-17.664-14.336-32-32-32s-32%2014.336-32%2032m0%20640v64c0%2017.664%2014.336%2032%2032%2032s32-14.336%2032-32v-64c0-17.664-14.336-32-32-32s-32%2014.336-32%2032M112.416%20157.664l45.44%2045.44c12.512%2012.512%2032.768%2012.512%2045.248%200s12.512-32.768%200-45.248l-45.44-45.44c-12.512-12.512-32.768-12.512-45.248%200s-12.512%2032.768%200%2045.248m452.48%20452.48%2045.44%2045.44c12.512%2012.512%2032.768%2012.512%2045.248%200s12.512-32.768%200-45.248l-45.44-45.44c-12.512-12.512-32.768-12.512-45.248%200s-12.512%2032.768%200%2045.248M32%20416h64c17.664%200%2032-14.336%2032-32s-14.336-32-32-32H32c-17.664%200-32%2014.336-32%2032s14.336%2032%2032%2032m640%200h64c17.664%200%2032-14.336%2032-32s-14.336-32-32-32h-64c-17.664%200-32%2014.336-32%2032s14.336%2032%2032%2032M157.664%20655.584l45.44-45.44c12.512-12.512%2012.512-32.768%200-45.248s-32.768-12.512-45.248%200l-45.44%2045.44c-12.512%2012.512-12.512%2032.768%200%2045.248s32.768%2012.512%2045.248%200m452.48-452.48%2045.44-45.44c12.512-12.512%2012.512-32.768%200-45.248s-32.768-12.512-45.248%200l-45.44%2045.44c-12.512%2012.512-12.512%2032.768%200%2045.248s32.768%2012.512%2045.248%200%22%20%2F%3E%0A%3C%2Fsvg%3E');
  --icon-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M13%2014h-10v-2l3-5%204.109%205%202.891-2v4z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M13%207.5c0%200.828-0.672%201.5-1.5%201.5s-1.5-0.672-1.5-1.5%200.672-1.5%201.5-1.5c0.828%200%201.5%200.672%201.5%201.5z%22%3E%3C%2Fpath%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M14.341%203.579c-0.347-0.473-0.831-1.027-1.362-1.558s-1.085-1.015-1.558-1.362c-0.806-0.591-1.197-0.659-1.421-0.659h-7.75c-0.689%200-1.25%200.561-1.25%201.25v13.5c0%200.689%200.561%201.25%201.25%201.25h11.5c0.689%200%201.25-0.561%201.25-1.25v-9.75c0-0.224-0.068-0.615-0.659-1.421zM12.271%202.729c0.48%200.48%200.856%200.912%201.134%201.271h-2.406v-2.405c0.359%200.278%200.792%200.654%201.271%201.134zM14%2014.75c0%200.136-0.114%200.25-0.25%200.25h-11.5c-0.135%200-0.25-0.114-0.25-0.25v-13.5c0-0.135%200.115-0.25%200.25-0.25%200%200%207.749-0%207.75%200v3.5c0%200.276%200.224%200.5%200.5%200.5h3.5v9.75z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-pencil: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M6%2010l2-1%207-7-1-1-7%207-1%202zM4.52%2013.548c-0.494-1.043-1.026-1.574-2.069-2.069l1.548-4.262%202-1.217%206-6h-3l-6%206-3%2010%2010-3%206-6v-3l-6%206-1.217%202z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-play-button: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M8%200c-4.418%200-8%203.582-8%208s3.582%208%208%208%208-3.582%208-8-3.582-8-8-8zM8%2014.5c-3.59%200-6.5-2.91-6.5-6.5s2.91-6.5%206.5-6.5%206.5%202.91%206.5%206.5-2.91%206.5-6.5%206.5zM6%204.5l6%203.5-6%203.5z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-search: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M496.131%20435.698l-121.276-103.147c-12.537-11.283-25.945-16.463-36.776-15.963%2028.628-33.534%2045.921-77.039%2045.921-124.588%200-106.039-85.961-192-192-192s-192%2085.961-192%20192%2085.961%20192%20192%20192c47.549%200%2091.054-17.293%20124.588-45.922-0.5%2010.831%204.68%2024.239%2015.963%2036.776l103.147%20121.276c17.661%2019.623%2046.511%2021.277%2064.11%203.678s15.946-46.449-3.677-64.11zM192%20320c-70.692%200-128-57.308-128-128s57.308-128%20128-128%20128%2057.308%20128%20128-57.307%20128-128%20128z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-smartphone: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M12%200h-9c-0.55%200-1%200.45-1%201v14c0%200.55%200.45%201%201%201h9c0.55%200%201-0.45%201-1v-14c0-0.55-0.45-1-1-1zM7.5%2015.278c-0.43%200-0.778-0.348-0.778-0.778s0.348-0.778%200.778-0.778%200.778%200.348%200.778%200.778-0.348%200.778-0.778%200.778zM12%2013h-9v-11h9v11z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-stack: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M16%205l-8-4-8%204%208%204%208-4zM8%202.328l5.345%202.672-5.345%202.672-5.345-2.672%205.345-2.672zM14.398%207.199l1.602%200.801-8%204-8-4%201.602-0.801%206.398%203.199zM14.398%2010.199l1.602%200.801-8%204-8-4%201.602-0.801%206.398%203.199z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-tablet: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M12.5%200h-10c-0.825%200-1.5%200.675-1.5%201.5v13c0%200.825%200.675%201.5%201.5%201.5h10c0.825%200%201.5-0.675%201.5-1.5v-13c0-0.825-0.675-1.5-1.5-1.5zM7.5%2015.5c-0.276%200-0.5-0.224-0.5-0.5s0.224-0.5%200.5-0.5%200.5%200.224%200.5%200.5-0.224%200.5-0.5%200.5zM12%2014h-9v-12h9v12z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-user: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M9%2011.041v-0.825c1.102-0.621%202-2.168%202-3.716%200-2.485%200-4.5-3-4.5s-3%202.015-3%204.5c0%201.548%200.898%203.095%202%203.716v0.825c-3.392%200.277-6%201.944-6%203.959h14c0-2.015-2.608-3.682-6-3.959z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-spinner: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M304%2C480c-114.7%2C0-207.6-99.9-208-223.3%2C0-26.5-21.8-48.9-48.4-48.7-26.3.2-47.6%2C21.6-47.6%2C48%2C0%2C141.4%2C114.6%2C256%2C256%2C256s249.6-108.4%2C255.7-244.3c-5.6%2C118.3-96.5%2C212.3-207.7%2C212.3ZM256%2C0C118.5%2C0%2C6.4%2C108.4.3%2C244.3%2C5.9%2C126%2C96.8%2C32%2C208%2C32s207.6%2C99.9%2C208%2C223.3c0%2C26.5%2C21.8%2C48.9%2C48.4%2C48.7%2C26.3-.2%2C47.6-21.6%2C47.6-48C512%2C114.6%2C397.4%2C0%2C256%2C0Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-upload: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M7%209h2v-4h3l-4-4-4%204h3zM10%206.75v1.542l4.579%201.708-6.579%202.453-6.579-2.453%204.579-1.708v-1.542l-6%202.25v4l8%203%208-3v-4z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-quill: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M0%2016c2-6%207.234-16%2016-16-4.109%203.297-6%2011-9%2011s-3%200-3%200l-3%205h-1z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-void: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%20120%20120%22%3E%0A%20%20%3Cpath%0A%20%20%20%20d%3D%22M111.82%2C60.419c-26.177%2C4.938-46.869%2C25.364-52.226%2C51.388-4.951-26.164-25.377-46.844-51.414-52.201%2C26.177-4.951%2C46.869-25.377%2C52.214-51.414%2C4.938%2C26.177%2C25.39%2C46.882%2C51.427%2C52.226Z%22%20%2F%3E%0A%3C%2Fsvg%3E');
  --icon-chevron-left: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%20%20%3C!--%20Generator%3A%20Adobe%20Illustrator%2029.8.4%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%202.1.1%20Build%206)%20%20--%3E%0A%20%20%3Cpath%20d%3D%22M10.25%2C1.75l1.5%2C1.5-4.5%2C4.5%2C4.5%2C4.5-1.5%2C1.5-6-6L10.25%2C1.75Z%22%2F%3E%0A%3C%2Fsvg%3E');
  --icon-chevron-down: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M2%205.5l1.5-1.5%204.5%204.5%204.5-4.5%201.5%201.5-6%206-6-6z%22%3E%3C%2Fpath%3E%0A%3C%2Fsvg%3E%0A');
  --icon-chevron-up: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%20%20%3C!--%20Generator%3A%20Adobe%20Illustrator%2029.8.4%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%202.1.1%20Build%206)%20%20--%3E%0A%20%20%3Cpath%20d%3D%22M14%2C10l-1.5%2C1.5-4.5-4.5-4.5%2C4.5-1.5-1.5%2C6-6%2C6%2C6Z%22%2F%3E%0A%3C%2Fsvg%3E');
  --icon-chevron-right: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%2016%2016%22%3E%0A%20%20%3C!--%20Generator%3A%20Adobe%20Illustrator%2029.8.4%2C%20SVG%20Export%20Plug-In%20.%20SVG%20Version%3A%202.1.1%20Build%206)%20%20--%3E%0A%20%20%3Cpath%20d%3D%22M5.75%2C13.75l-1.5-1.5%2C4.5-4.5L4.25%2C3.25l1.5-1.5%2C6%2C6-6%2C6Z%22%2F%3E%0A%3C%2Fsvg%3E');
  --icon-lock-open: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M128%20256v-64c0-106.039%2085.961-192%20192-192s192%2085.961%20192%20192v0h-96v64h128c35.346%200%2064%2028.654%2064%2064v0%20256c0%2035.346-28.654%2064-64%2064v0h-448c-35.346%200-64-28.654-64-64v0-256c0-35.2%2028.8-64%2064-64h32zM288%20471.36v72.64h64v-72.64c19.265-11.272%2032-31.861%2032-55.426%200-35.346-28.654-64-64-64s-64%2028.654-64%2064c0%2023.564%2012.735%2044.154%2031.698%2055.262l0.302%200.164zM224%20192v64h192v-64c0-53.019-42.981-96-96-96s-96%2042.981-96%2096v0z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-lock-closed: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20640%20640%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M128%20256v-64c0-106.039%2085.961-192%20192-192s192%2085.961%20192%20192v0%2064h32c35.346%200%2064%2028.654%2064%2064v0%20256c0%2035.346-28.654%2064-64%2064v0h-448c-35.346%200-64-28.654-64-64v0-256c0-35.2%2028.8-64%2064-64h32zM288%20471.36v72.64h64v-72.64c19.265-11.272%2032-31.861%2032-55.426%200-35.346-28.654-64-64-64s-64%2028.654-64%2064c0%2023.564%2012.735%2044.154%2031.698%2055.262l0.302%200.164zM224%20192v64h192v-64c0-53.019-42.981-96-96-96s-96%2042.981-96%2096v0z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-eye: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201536%201536%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M575.841%20768c0%20105.951%2086.049%20192%20192%20192s192-86.049%20192-192v-1.599c-20.511%2020.799-48.639%2033.6-80.001%2033.6-61.791%200-111.999-50.241-111.999-111.999%200-44.481%2026.208-83.199%2063.681-101.121-19.839-7.041-41.28-10.881-63.681-10.881-105.921%200-192%2086.079-192%20192zM1492.959%20658.881c-119.040-151.362-408.96-402.882-724.8-402.882-316.161%200-606.369%20251.52-725.439%20402.879-26.88%2034.56-41.601%2072-42.561%20109.119%200.96%2037.119%2015.681%2074.559%2042.561%20109.119%20119.073%20151.395%20408.96%20402.885%20725.121%20402.885s606.048-251.487%20725.121-402.879c27.201-34.56%2041.919-72%2042.879-109.119-0.96-37.122-15.681-74.562-42.882-109.122zM767.841%201088.001c-176.64%200-320.001-143.361-320.001-320.001s143.361-320.001%20320.001-320.001%20320.001%20143.361%20320.001%20320.001c-0.003%20176.64-143.361%20320.001-320.001%20320.001z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-logo-x: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%3Cpath%20fill%3D%22%23000%22%20d%3D%22M14.234%2010.162%2022.977%200h-2.072l-7.591%208.824L7.251%200H.258l9.168%2013.343L.258%2024H2.33l8.016-9.318L16.749%2024h6.993zm-2.837%203.299-.929-1.329L3.076%201.56h3.182l5.965%208.532.929%201.329%207.754%2011.09h-3.182z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
  --icon-logo-vibe: url('data:image/svg+xml;utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20viewBox%3D%220%200%20260%20257%22%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%20d%3D%22M104.16%2C73.48c12.36-1.2%2C26.82%2C2.68%2C38.06%2C10.15%2C3.88%2C2.57%2C10.55%2C9.13%2C12.87%2C12.72%2C6.16%2C9.46%2C8.55%2C20.33%2C7.07%2C31.89-.8%2C5.98-.4%2C7.97%2C1.63%2C7.97%2C3.66%2C0%2C10.55-11.45%2C13.52-22.62%2C4.1-13.21.94-28.89.14-32.47-2.07-9.35-6.89-21.46-11.89-29.97-9.02-15.37-24.57-30.99-42.37-42.59-5.29-3.48-12.14-7.32-14.39-8.12-2.1-.72-6.05-.58-10.4.43-4.78%2C1.09-14.24%2C4.24-19.43%2C6.49-13.34%2C5.69-24.46%2C12.79-35.52%2C22.69-14.93%2C13.34-24.65%2C26.57-32.47%2C44.22C5.14%2C87.44%2C1.95%2C99.14.43%2C113.03c-.65%2C6.2-.54%2C21.49.22%2C27.91%2C1.49%2C12.29%2C4.82%2C24.46%2C9.39%2C34.14%2C3.77%2C7.97%2C5.55%2C9.89%2C7.36%2C7.79.83-.94.8-.91%2C2.14-11.82%2C3.41-27.47%2C16.2-54.51%2C34.47-72.7%2C14.97-14.93%2C31.42-23.09%2C50.16-24.86l-.01-.01Z%22%2F%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%20d%3D%22M257.31%2C105.29c-3.47-19.72-9.59-34.95-20.47-50.9-8.11-11.89-16.38-20.77-27.37-29.38-4.92-3.82-17.98-11.79-23.83-14.52-11.23-5.21-23.33-8.79-33.96-10.01-8.76-1-11.33-.5-10.5%2C2.15.36%2C1.21.35%2C1.16%2C8.92%2C8.04%2C21.55%2C17.37%2C37.79%2C42.49%2C43.63%2C67.61%2C4.8%2C20.59%2C3.06%2C38.87-5.3%2C55.73-5.5%2C11.13-16.41%2C21.38-28.68%2C27-4.23%2C1.94-13.32%2C4.15-17.59%2C4.23-11.29.25-21.79-3.44-30.83-10.8-4.66-3.83-6.57-4.54-7.64-2.82-1.93%2C3.11%2C4.18%2C15%2C12.1%2C23.41%2C9.06%2C10.45%2C24.05%2C16.02%2C27.52%2C17.24%2C9.04%2C3.17%2C21.86%2C5.45%2C31.74%2C5.69%2C17.82.43%2C39.29-4.56%2C58.52-13.57%2C5.75-2.66%2C12.62-6.46%2C14.48-7.95%2C1.72-1.4%2C3.68-4.84%2C5.11-9.07%2C1.6-4.64%2C3.9-14.34%2C4.72-19.93%2C2.19-14.33%2C2.02-27.53-.57-42.14v-.01Z%22%2F%3E%0A%20%20%3Cpath%20fill%3D%22%23000%22%20d%3D%22M231.57%2C197.33c-1.23-.27-1.18-.25-11.35%2C3.92-25.63%2C10.47-55.47%2C12.54-80.27%2C5.51-20.35-5.75-35.51-16.11-46.23-31.58-7.09-10.19-10.78-24.7-9.77-38.16.35-4.64%2C2.81-13.67%2C4.8-17.45%2C5.24-10%2C13.55-17.41%2C24.36-21.77%2C5.61-2.23%2C7.15-3.55%2C6.16-5.32-1.79-3.19-15.15-3.59-26.34-.73-13.53%2C2.88-25.65%2C13.31-28.39%2C15.76-7.14%2C6.38-15.34%2C16.5-20.32%2C25.03-8.99%2C15.39-15%2C36.59-16.41%2C57.79-.45%2C6.32-.44%2C14.17-.04%2C16.52.4%2C2.19%2C2.46%2C5.56%2C5.47%2C8.86%2C3.29%2C3.64%2C10.67%2C10.35%2C15.16%2C13.77%2C11.49%2C8.85%2C23.13%2C15.08%2C37.17%2C19.88%2C18.94%2C6.5%2C35.23%2C8.5%2C54.45%2C6.69%2C14.33-1.35%2C26.1-4.29%2C38.95-9.76%2C5.72-2.46%2C19.01-10.04%2C24.23-13.84%2C9.99-7.31%2C18.98-16.17%2C25.18-24.89%2C5.11-7.19%2C5.92-9.68%2C3.2-10.23h-.01Z%22%2F%3E%0A%3C%2Fsvg%3E');
}

icon, .icon {
  --icon: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%20120%20120%22%3E%0A%20%20%3Cpath%0A%20%20%20%20d%3D%22M111.82%2C60.419c-26.177%2C4.938-46.869%2C25.364-52.226%2C51.388-4.951-26.164-25.377-46.844-51.414-52.201%2C26.177-4.951%2C46.869-25.377%2C52.214-51.414%2C4.938%2C26.177%2C25.39%2C46.882%2C51.427%2C52.226Z%22%20%2F%3E%0A%3C%2Fsvg%3E");
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: var(--color, currentColor);
  mask-image: var(--icon);
  mask-repeat: no-repeat;
  mask-size: cover;
}

icon[bell], icon.bell {
  --icon: var(--icon-bell);
  width: 1em;
  height: 1em;
}

icon[book], icon.book {
  --icon: var(--icon-book);
  width: 1em;
  height: 1em;
}

icon[bullhorn], icon.bullhorn {
  --icon: var(--icon-bullhorn);
  width: 1em;
  height: 1em;
}

icon[checkmark], icon.checkmark {
  --icon: var(--icon-checkmark);
  width: 1em;
  height: 1em;
}

icon[clock], icon.clock {
  --icon: var(--icon-clock);
  width: 1em;
  height: 1em;
}

icon[credit-card], icon.credit-card {
  --icon: var(--icon-credit-card);
  width: 1em;
  height: 1em;
}

icon[cog], icon.cog {
  --icon: var(--icon-cog);
  width: 1em;
  height: 1em;
}

icon[cross], icon.cross {
  --icon: var(--icon-cross);
  width: 1em;
  height: 1em;
}

icon[crow], icon.crow {
  --icon: var(--icon-crow);
  width: 1.0105293945598128em;
  height: 1em;
}

icon[dark], icon.dark {
  --icon: var(--icon-dark);
  width: 1em;
  height: 1em;
}

icon[download], icon.download {
  --icon: var(--icon-download);
  width: 1em;
  height: 1em;
}

icon[css-3], icon.css-3 {
  --icon: var(--icon-css-3);
  width: 1em;
  height: 1em;
}

icon[earth], icon.earth {
  --icon: var(--icon-earth);
  width: 1em;
  height: 1em;
}

icon[embed], icon.embed {
  --icon: var(--icon-embed);
  width: 1.25em;
  height: 1em;
}

icon[home], icon.home {
  --icon: var(--icon-home);
  width: 1em;
  height: 1em;
}

icon[heart], icon.heart {
  --icon: var(--icon-heart);
  width: 1em;
  height: 1em;
}

icon[folder], icon.folder {
  --icon: var(--icon-folder);
  width: 1em;
  height: 1em;
}

icon[html-5], icon.html-5 {
  --icon: var(--icon-html-5);
  width: 1em;
  height: 1em;
}

icon[heart-broken], icon.heart-broken {
  --icon: var(--icon-heart-broken);
  width: 1em;
  height: 1em;
}

icon[desktop], icon.desktop {
  --icon: var(--icon-desktop);
  width: 1em;
  height: 1em;
}

icon[images], icon.images {
  --icon: var(--icon-images);
  width: 1.125em;
  height: 1em;
}

icon[layout], icon.layout {
  --icon: var(--icon-layout);
  width: 1em;
  height: 1em;
}

icon[logo-svelte], icon.logo-svelte {
  --icon: var(--icon-logo-svelte);
  width: 0.8313559322033898em;
  height: 1em;
}

icon[logo-apeegg], icon.logo-apeegg {
  --icon: var(--icon-logo-apeegg);
  width: 1.734375em;
  height: 1em;
}

icon[pin], icon.pin {
  --icon: var(--icon-pin);
  width: 1em;
  height: 1em;
}

icon[logo-react], icon.logo-react {
  --icon: var(--icon-logo-react);
  width: 1.1219512195121952em;
  height: 1em;
}

icon[logo-apeegg-simple], icon.logo-apeegg-simple {
  --icon: var(--icon-logo-apeegg-simple);
  width: 1em;
  height: 1.3176470588235294em;
}

icon[logo-github], icon.logo-github {
  --icon: var(--icon-logo-github);
  width: 1em;
  height: 1em;
}

icon[light], icon.light {
  --icon: var(--icon-light);
  width: 1em;
  height: 1em;
}

icon[image], icon.image {
  --icon: var(--icon-image);
  width: 1em;
  height: 1em;
}

icon[pencil], icon.pencil {
  --icon: var(--icon-pencil);
  width: 1em;
  height: 1em;
}

icon[play-button], icon.play-button {
  --icon: var(--icon-play-button);
  width: 1em;
  height: 1em;
}

icon[search], icon.search {
  --icon: var(--icon-search);
  width: 1em;
  height: 1em;
}

icon[smartphone], icon.smartphone {
  --icon: var(--icon-smartphone);
  width: 1em;
  height: 1em;
}

icon[stack], icon.stack {
  --icon: var(--icon-stack);
  width: 1em;
  height: 1em;
}

icon[tablet], icon.tablet {
  --icon: var(--icon-tablet);
  width: 1em;
  height: 1em;
}

icon[user], icon.user {
  --icon: var(--icon-user);
  width: 1em;
  height: 1em;
}

icon[spinner], icon.spinner {
  --icon: var(--icon-spinner);
  width: 1em;
  height: 1em;
}

icon[upload], icon.upload {
  --icon: var(--icon-upload);
  width: 1em;
  height: 1em;
}

icon[quill], icon.quill {
  --icon: var(--icon-quill);
  width: 1em;
  height: 1em;
}

icon[void], icon.void {
  --icon: var(--icon-void);
  width: 1em;
  height: 1em;
}

icon[chevron-left], icon.chevron-left {
  --icon: var(--icon-chevron-left);
  width: 1em;
  height: 1em;
}

icon[chevron-down], icon.chevron-down {
  --icon: var(--icon-chevron-down);
  width: 1em;
  height: 1em;
}

icon[chevron-up], icon.chevron-up {
  --icon: var(--icon-chevron-up);
  width: 1em;
  height: 1em;
}

icon[chevron-right], icon.chevron-right {
  --icon: var(--icon-chevron-right);
  width: 1em;
  height: 1em;
}

icon[lock-open], icon.lock-open {
  --icon: var(--icon-lock-open);
  width: 1em;
  height: 1em;
}

icon[lock-closed], icon.lock-closed {
  --icon: var(--icon-lock-closed);
  width: 1em;
  height: 1em;
}

icon[eye], icon.eye {
  --icon: var(--icon-eye);
  width: 1em;
  height: 1em;
}

icon[logo-x], icon.logo-x {
  --icon: var(--icon-logo-x);
  width: 1em;
  height: 1em;
}

icon[logo-vibe], icon.logo-vibe {
  --icon: var(--icon-logo-vibe);
  width: 1.0116731517509727em;
  height: 1em;
}
/* ---- Reset.css ---- */
@layer base {
  *,
  ::after,
  ::before,
  ::backdrop,
  ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }

  button,
  input,
  select,
  optgroup,
  textarea,
  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
  }

  html,
  :host {
    line-height: 1.5;
  }
}
/* ---- Stylecheat.css ---- */
:root {
  --icon-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 448' fill='currentColor'%3E%3Cpath fill='black' d='m420.75 202-185.5 185.25a15.844 15.844 0 0 1-22.5 0L27.25 202c-6.25-6.25-6.25-16.5 0-22.75L68.75 138a15.844 15.844 0 0 1 22.5 0L224 270.75 356.75 138a15.844 15.844 0 0 1 22.5 0l41.5 41.25c6.25 6.25 6.25 16.5 0 22.75'/%3E%3C/svg%3E");
  --theme-sign: 1;
}

.dark {
  --icon-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 448' fill='currentColor'%3E%3Cpath fill='white' d='m420.75 202-185.5 185.25a15.844 15.844 0 0 1-22.5 0L27.25 202c-6.25-6.25-6.25-16.5 0-22.75L68.75 138a15.844 15.844 0 0 1 22.5 0L224 270.75 356.75 138a15.844 15.844 0 0 1 22.5 0l41.5 41.25c6.25 6.25 6.25 16.5 0 22.75'/%3E%3C/svg%3E");
  --theme-sign: -1;
}
/* ---- Theme.css ---- */
:root {
  --background: oklch(0.9383 0.0042 236.4993);
  --foreground: oklch(0.3211 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.3211 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.3211 0 0);
  --primary: oklch(0.6397 0.172 36.4421);
  --primary-foreground: oklch(1 0 0);
  --secondary: oklch(0.967 0.0029 264.5419);
  --secondary-foreground: oklch(0.4461 0.0263 256.8018);
  --muted: oklch(0.9846 0.0017 247.8389);
  --muted-foreground: oklch(0.551 0.0234 264.3637);
  --accent: oklch(0.9119 0.0222 243.8174);
  --accent-foreground: oklch(0.3791 0.1378 265.5222);
  --destructive: oklch(0.6368 0.2078 25.3313);
  --destructive-foreground: oklch(1 0 0);
  --border: oklch(0.9022 0.0052 247.8822);
  --input: oklch(0.97 0.0029 264.542);
  --ring: oklch(0.6397 0.172 36.4421);
  --chart-1: oklch(0.7156 0.0605 248.6845);
  --chart-2: oklch(0.7875 0.0917 35.9616);
  --chart-3: oklch(0.5778 0.0759 254.1573);
  --chart-4: oklch(0.5016 0.0849 259.4902);
  --chart-5: oklch(0.4241 0.0952 264.0306);
  --sidebar: oklch(0.903 0.0046 258.3257);
  --sidebar-foreground: oklch(0.3211 0 0);
  --sidebar-primary: oklch(0.6397 0.172 36.4421);
  --sidebar-primary-foreground: oklch(1 0 0);
  --sidebar-accent: oklch(0.9119 0.0222 243.8174);
  --sidebar-accent-foreground: oklch(0.3791 0.1378 265.5222);
  --sidebar-border: oklch(0.9276 0.0058 264.5313);
  --sidebar-ring: oklch(0.6397 0.172 36.4421);
  --font-sans: 'Geist', Inter, sans-serif;
  --font-serif: Source Serif 4, serif;
  --font-mono: JetBrains Mono, monospace;
  --radius: 0.75rem;
  --shadow-x: 0px;
  --shadow-y: 1px;
  --shadow-blur: 3px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.1;
  --shadow-color: hsl(0 0% 0%);
  --shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
  --shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
  --shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow-md: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 2px 4px -1px hsl(0 0% 0% / 0.1);
  --shadow-lg: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 4px 6px -1px hsl(0 0% 0% / 0.1);
  --shadow-xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 8px 10px -1px hsl(0 0% 0% / 0.1);
  --shadow-2xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.25);
  --tracking-normal: 0em;
  --spacing: 0.25rem;
}

.dark {
  --background: oklch(0.2598 0.0306 262.6666);
  --foreground: oklch(0.9219 0 0);
  --card: oklch(0.3106 0.0301 268.6365);
  --card-foreground: oklch(0.9219 0 0);
  --popover: oklch(0.29 0.0249 268.3986);
  --popover-foreground: oklch(0.9219 0 0);
  --primary: oklch(0.6397 0.172 36.4421);
  --primary-foreground: oklch(1 0 0);
  --secondary: oklch(0.3095 0.0266 266.7132);
  --secondary-foreground: oklch(0.9219 0 0);
  --muted: oklch(0.3095 0.0266 266.7132);
  --muted-foreground: oklch(0.7155 0 0);
  --accent: oklch(0.338 0.0589 267.5867);
  --accent-foreground: oklch(0.8823 0.0571 254.1284);
  --destructive: oklch(0.6368 0.2078 25.3313);
  --destructive-foreground: oklch(1 0 0);
  --border: oklch(0.3843 0.0301 269.7337);
  --input: oklch(0.3843 0.0301 269.7337);
  --ring: oklch(0.6397 0.172 36.4421);
  --chart-1: oklch(0.7156 0.0605 248.6845);
  --chart-2: oklch(0.7693 0.0876 34.1875);
  --chart-3: oklch(0.5778 0.0759 254.1573);
  --chart-4: oklch(0.5016 0.0849 259.4902);
  --chart-5: oklch(0.4241 0.0952 264.0306);
  --sidebar: oklch(0.31 0.0283 267.7408);
  --sidebar-foreground: oklch(0.9219 0 0);
  --sidebar-primary: oklch(0.6397 0.172 36.4421);
  --sidebar-primary-foreground: oklch(1 0 0);
  --sidebar-accent: oklch(0.338 0.0589 267.5867);
  --sidebar-accent-foreground: oklch(0.8823 0.0571 254.1284);
  --sidebar-border: oklch(0.3843 0.0301 269.7337);
  --sidebar-ring: oklch(0.6397 0.172 36.4421);
  --font-sans: 'Geist', sans-serif;
  --font-serif: Source Serif 4, serif;
  --font-mono: JetBrains Mono, monospace;
  --radius: 0.75rem;
  --shadow-x: 0px;
  --shadow-y: 1px;
  --shadow-blur: 3px;
  --shadow-spread: 0px;
  --shadow-opacity: 0.1;
  --shadow-color: hsl(0 0% 0%);
  --shadow-2xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
  --shadow-xs: 0px 1px 3px 0px hsl(0 0% 0% / 0.05);
  --shadow-sm: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 1px 2px -1px hsl(0 0% 0% / 0.1);
  --shadow-md: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 2px 4px -1px hsl(0 0% 0% / 0.1);
  --shadow-lg: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 4px 6px -1px hsl(0 0% 0% / 0.1);
  --shadow-xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.1), 0px 8px 10px -1px hsl(0 0% 0% / 0.1);
  --shadow-2xl: 0px 1px 3px 0px hsl(0 0% 0% / 0.25);
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-card: var(--card);
  --color-card-foreground: var(--card-foreground);
  --color-popover: var(--popover);
  --color-popover-foreground: var(--popover-foreground);
  --color-primary: var(--primary);
  --color-primary-foreground: var(--primary-foreground);
  --color-secondary: var(--secondary);
  --color-secondary-foreground: var(--secondary-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-destructive: var(--destructive);
  --color-destructive-foreground: var(--destructive-foreground);
  --color-border: var(--border);
  --color-input: var(--input);
  --color-ring: var(--ring);
  --color-chart-1: var(--chart-1);
  --color-chart-2: var(--chart-2);
  --color-chart-3: var(--chart-3);
  --color-chart-4: var(--chart-4);
  --color-chart-5: var(--chart-5);
  --color-sidebar: var(--sidebar);
  --color-sidebar-foreground: var(--sidebar-foreground);
  --color-sidebar-primary: var(--sidebar-primary);
  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --color-sidebar-accent: var(--sidebar-accent);
  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
  --color-sidebar-border: var(--sidebar-border);
  --color-sidebar-ring: var(--sidebar-ring);

  --font-sans: var(--font-sans);
  --font-mono: var(--font-mono);
  --font-serif: var(--font-serif);

  --radius-sm: calc(var(--radius) - 4px);
  --radius-md: calc(var(--radius) - 2px);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) + 4px);

  --shadow-2xs: var(--shadow-2xs);
  --shadow-xs: var(--shadow-xs);
  --shadow-sm: var(--shadow-sm);
  --shadow: var(--shadow);
  --shadow-md: var(--shadow-md);
  --shadow-lg: var(--shadow-lg);
  --shadow-xl: var(--shadow-xl);
  --shadow-2xl: var(--shadow-2xl);
}
/* ---- Typography.css ---- */
/* Typography - content flow with sibling-aware spacing */
/* Visual styles apply globally, layout spacing requires [typography] or .typography wrapper */

/* Base text color */
body {
  color: var(--foreground);
}

/* Headings - visual styles (sizes, colors, line-height, font-weight) */
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  line-height: 1.2;
  font-weight: 600;
  color: var(--foreground);
}

h1 {
  font-size: calc(var(--unit) * 9);
} /* 36px */
h2 {
  font-size: calc(var(--unit) * 7);
} /* 28px */
h3 {
  font-size: calc(var(--unit) * 6);
} /* 24px */
h4 {
  font-size: calc(var(--unit) * 5);
} /* 20px */
h5 {
  font-size: calc(var(--unit) * 4);
} /* 16px */
h6 {
  font-size: calc(var(--unit) * 3.5);
} /* 14px */

/* Paragraphs - visual styles */
p {
  margin: 0;
  line-height: 1.6;
}

/* Lists - visual styles */
ul,
ol {
  margin: 0;
  padding-inline-start: calc(var(--unit) * 6); /* 24px */
}

li {
  margin: 0;
  line-height: 1.5;
}
li::marker {
  color: oklch(from var(--foreground) calc(l + 0.05) c h);
}

/* Blockquote - visual styles */
blockquote,
quote {
  display: block;
  margin: 0;
  padding-inline-start: calc(var(--unit) * 4);
  border-inline-start: calc(var(--unit) * 1) solid var(--border);
  font-style: italic;
  color: var(--muted-foreground);
}

/* Inline elements - visual styles */
strong,
b {
  font-weight: 600;
  color: oklch(from var(--foreground) calc(l + 0.05) c h);
}
em,
i {
  font-style: italic;
}
small {
  font-size: calc(var(--unit) * 3.5);
} /* 14px */
mark {
  background: var(--accent);
  padding: 0 calc(var(--unit) * 1);
}
code {
  font-family: var(--font-mono, monospace);
  font-size: calc(var(--unit) * 3.5); /* 14px */
  background: var(--secondary);
  padding: calc(var(--unit) * 1) calc(var(--unit) * 1.5);
  border-radius: calc(var(--unit) * 1);
}

/* Preformatted - visual styles */
pre {
  margin: 0;
  padding: calc(var(--unit) * 3);
  background: var(--secondary);
  border-radius: calc(var(--unit) * 2);
  overflow-x: auto;
  font-family: var(--font-mono, monospace);
  font-size: calc(var(--unit) * 3.5); /* 14px */
  line-height: 1.5;
}

pre code {
  background: transparent;
  padding: 0;
}

/* --- Layout spacing (requires [typography] or .typography wrapper) --- */
/* Uses wildcards for extensibility with custom elements */
/* Order matters: later rules win when specificity is equal */

[typography],
.typography {
  /* Nested lists - tighter */
  li > ul,
  li > ol {
    margin-top: calc(var(--unit) * 1);
  }

  /* After headings - moderate space */
  h1 + *,
  h2 + * {
    margin-top: calc(var(--unit) * 3);
  }
  h3 + *,
  h4 + *,
  h5 + *,
  h6 + * {
    margin-top: calc(var(--unit) * 2);
  }

  /* After paragraphs */
  p + * {
    margin-top: calc(var(--unit) * 3);
  }

  /* After lists */
  ul + *,
  ol + * {
    margin-top: calc(var(--unit) * 3);
  }

  /* After blockquotes and pre */
  blockquote + *,
  quote + *,
  pre + *,
  template + * {
    margin-top: calc(var(--unit) * 4);
  }

  /* Before headings - section break (last so they override above) */
  * + h1 {
    margin-top: calc(var(--unit) * 8);
  }
  * + h2 {
    margin-top: calc(var(--unit) * 7);
  }
  * + h3 {
    margin-top: calc(var(--unit) * 6);
  }
  * + h4 {
    margin-top: calc(var(--unit) * 5);
  }
  * + h5 {
    margin-top: calc(var(--unit) * 4);
  }
  * + h6 {
    margin-top: calc(var(--unit) * 4);
  }

  /* HR spacing */
  hr + *,
  * + hr {
    margin-top: calc(var(--unit) * 6);
  }
}
/* ---- Units.css ---- */
/* Unit system - single base, multiply as needed */
:root {
  --unit: 4px;
}

/* Gap utilities */
.g-1, [g-1] { gap: calc(var(--unit) * 1); }
.g-2, [g-2] { gap: calc(var(--unit) * 2); }
.g-3, [g-3] { gap: calc(var(--unit) * 3); }
.g-4, [g-4] { gap: calc(var(--unit) * 4); }
.g-5, [g-5] { gap: calc(var(--unit) * 5); }
.g-6, [g-6] { gap: calc(var(--unit) * 6); }
.g-7, [g-7] { gap: calc(var(--unit) * 7); }
.g-8, [g-8] { gap: calc(var(--unit) * 8); }

/* Margin utilities */
.mt-1, [mt-1] { margin-top: calc(var(--unit) * 1); }
.mt-2, [mt-2] { margin-top: calc(var(--unit) * 2); }
.mt-3, [mt-3] { margin-top: calc(var(--unit) * 3); }
.mt-4, [mt-4] { margin-top: calc(var(--unit) * 4); }
.mt-5, [mt-5] { margin-top: calc(var(--unit) * 5); }
.mt-6, [mt-6] { margin-top: calc(var(--unit) * 6); }
.mt-7, [mt-7] { margin-top: calc(var(--unit) * 7); }
.mt-8, [mt-8] { margin-top: calc(var(--unit) * 8); }

.mb-1, [mb-1] { margin-bottom: calc(var(--unit) * 1); }
.mb-2, [mb-2] { margin-bottom: calc(var(--unit) * 2); }
.mb-3, [mb-3] { margin-bottom: calc(var(--unit) * 3); }
.mb-4, [mb-4] { margin-bottom: calc(var(--unit) * 4); }
.mb-5, [mb-5] { margin-bottom: calc(var(--unit) * 5); }
.mb-6, [mb-6] { margin-bottom: calc(var(--unit) * 6); }
.mb-7, [mb-7] { margin-bottom: calc(var(--unit) * 7); }
.mb-8, [mb-8] { margin-bottom: calc(var(--unit) * 8); }

.ml-1, [ml-1] { margin-left: calc(var(--unit) * 1); }
.ml-2, [ml-2] { margin-left: calc(var(--unit) * 2); }
.ml-3, [ml-3] { margin-left: calc(var(--unit) * 3); }
.ml-4, [ml-4] { margin-left: calc(var(--unit) * 4); }
.ml-5, [ml-5] { margin-left: calc(var(--unit) * 5); }
.ml-6, [ml-6] { margin-left: calc(var(--unit) * 6); }
.ml-7, [ml-7] { margin-left: calc(var(--unit) * 7); }
.ml-8, [ml-8] { margin-left: calc(var(--unit) * 8); }

.mr-1, [mr-1] { margin-right: calc(var(--unit) * 1); }
.mr-2, [mr-2] { margin-right: calc(var(--unit) * 2); }
.mr-3, [mr-3] { margin-right: calc(var(--unit) * 3); }
.mr-4, [mr-4] { margin-right: calc(var(--unit) * 4); }
.mr-5, [mr-5] { margin-right: calc(var(--unit) * 5); }
.mr-6, [mr-6] { margin-right: calc(var(--unit) * 6); }
.mr-7, [mr-7] { margin-right: calc(var(--unit) * 7); }
.mr-8, [mr-8] { margin-right: calc(var(--unit) * 8); }

.mx-1, [mx-1] { margin-inline: calc(var(--unit) * 1); }
.mx-2, [mx-2] { margin-inline: calc(var(--unit) * 2); }
.mx-3, [mx-3] { margin-inline: calc(var(--unit) * 3); }
.mx-4, [mx-4] { margin-inline: calc(var(--unit) * 4); }
.mx-5, [mx-5] { margin-inline: calc(var(--unit) * 5); }
.mx-6, [mx-6] { margin-inline: calc(var(--unit) * 6); }
.mx-7, [mx-7] { margin-inline: calc(var(--unit) * 7); }
.mx-8, [mx-8] { margin-inline: calc(var(--unit) * 8); }

.my-1, [my-1] { margin-block: calc(var(--unit) * 1); }
.my-2, [my-2] { margin-block: calc(var(--unit) * 2); }
.my-3, [my-3] { margin-block: calc(var(--unit) * 3); }
.my-4, [my-4] { margin-block: calc(var(--unit) * 4); }
.my-5, [my-5] { margin-block: calc(var(--unit) * 5); }
.my-6, [my-6] { margin-block: calc(var(--unit) * 6); }
.my-7, [my-7] { margin-block: calc(var(--unit) * 7); }
.my-8, [my-8] { margin-block: calc(var(--unit) * 8); }

.m-1, [m-1] { margin: calc(var(--unit) * 1); }
.m-2, [m-2] { margin: calc(var(--unit) * 2); }
.m-3, [m-3] { margin: calc(var(--unit) * 3); }
.m-4, [m-4] { margin: calc(var(--unit) * 4); }
.m-5, [m-5] { margin: calc(var(--unit) * 5); }
.m-6, [m-6] { margin: calc(var(--unit) * 6); }
.m-7, [m-7] { margin: calc(var(--unit) * 7); }
.m-8, [m-8] { margin: calc(var(--unit) * 8); }

/* Padding utilities */
.pt-1, [pt-1] { padding-top: calc(var(--unit) * 1); }
.pt-2, [pt-2] { padding-top: calc(var(--unit) * 2); }
.pt-3, [pt-3] { padding-top: calc(var(--unit) * 3); }
.pt-4, [pt-4] { padding-top: calc(var(--unit) * 4); }
.pt-5, [pt-5] { padding-top: calc(var(--unit) * 5); }
.pt-6, [pt-6] { padding-top: calc(var(--unit) * 6); }
.pt-7, [pt-7] { padding-top: calc(var(--unit) * 7); }
.pt-8, [pt-8] { padding-top: calc(var(--unit) * 8); }

.pb-1, [pb-1] { padding-bottom: calc(var(--unit) * 1); }
.pb-2, [pb-2] { padding-bottom: calc(var(--unit) * 2); }
.pb-3, [pb-3] { padding-bottom: calc(var(--unit) * 3); }
.pb-4, [pb-4] { padding-bottom: calc(var(--unit) * 4); }
.pb-5, [pb-5] { padding-bottom: calc(var(--unit) * 5); }
.pb-6, [pb-6] { padding-bottom: calc(var(--unit) * 6); }
.pb-7, [pb-7] { padding-bottom: calc(var(--unit) * 7); }
.pb-8, [pb-8] { padding-bottom: calc(var(--unit) * 8); }

.pl-1, [pl-1] { padding-left: calc(var(--unit) * 1); }
.pl-2, [pl-2] { padding-left: calc(var(--unit) * 2); }
.pl-3, [pl-3] { padding-left: calc(var(--unit) * 3); }
.pl-4, [pl-4] { padding-left: calc(var(--unit) * 4); }
.pl-5, [pl-5] { padding-left: calc(var(--unit) * 5); }
.pl-6, [pl-6] { padding-left: calc(var(--unit) * 6); }
.pl-7, [pl-7] { padding-left: calc(var(--unit) * 7); }
.pl-8, [pl-8] { padding-left: calc(var(--unit) * 8); }

.pr-1, [pr-1] { padding-right: calc(var(--unit) * 1); }
.pr-2, [pr-2] { padding-right: calc(var(--unit) * 2); }
.pr-3, [pr-3] { padding-right: calc(var(--unit) * 3); }
.pr-4, [pr-4] { padding-right: calc(var(--unit) * 4); }
.pr-5, [pr-5] { padding-right: calc(var(--unit) * 5); }
.pr-6, [pr-6] { padding-right: calc(var(--unit) * 6); }
.pr-7, [pr-7] { padding-right: calc(var(--unit) * 7); }
.pr-8, [pr-8] { padding-right: calc(var(--unit) * 8); }

.px-1, [px-1] { padding-inline: calc(var(--unit) * 1); }
.px-2, [px-2] { padding-inline: calc(var(--unit) * 2); }
.px-3, [px-3] { padding-inline: calc(var(--unit) * 3); }
.px-4, [px-4] { padding-inline: calc(var(--unit) * 4); }
.px-5, [px-5] { padding-inline: calc(var(--unit) * 5); }
.px-6, [px-6] { padding-inline: calc(var(--unit) * 6); }
.px-7, [px-7] { padding-inline: calc(var(--unit) * 7); }
.px-8, [px-8] { padding-inline: calc(var(--unit) * 8); }

.py-1, [py-1] { padding-block: calc(var(--unit) * 1); }
.py-2, [py-2] { padding-block: calc(var(--unit) * 2); }
.py-3, [py-3] { padding-block: calc(var(--unit) * 3); }
.py-4, [py-4] { padding-block: calc(var(--unit) * 4); }
.py-5, [py-5] { padding-block: calc(var(--unit) * 5); }
.py-6, [py-6] { padding-block: calc(var(--unit) * 6); }
.py-7, [py-7] { padding-block: calc(var(--unit) * 7); }
.py-8, [py-8] { padding-block: calc(var(--unit) * 8); }

.p-1, [p-1] { padding: calc(var(--unit) * 1); }
.p-2, [p-2] { padding: calc(var(--unit) * 2); }
.p-3, [p-3] { padding: calc(var(--unit) * 3); }
.p-4, [p-4] { padding: calc(var(--unit) * 4); }
.p-5, [p-5] { padding: calc(var(--unit) * 5); }
.p-6, [p-6] { padding: calc(var(--unit) * 6); }
.p-7, [p-7] { padding: calc(var(--unit) * 7); }
.p-8, [p-8] { padding: calc(var(--unit) * 8); }